katoikia-app/mobile-ui/components/AgregarInvitados.js

208 lines
6.2 KiB
JavaScript
Raw Normal View History

2022-08-23 01:31:42 +00:00
import React, { useContext, useState } from "react";
import { API } from "../environment/api";
import { MaterialCommunityIcons } from '@expo/vector-icons';
2022-08-19 04:30:47 +00:00
import {
2022-08-23 01:31:42 +00:00
Box, Button,
Center, FormControl, Heading, ScrollView, VStack,Select
2022-08-19 04:30:47 +00:00
} from "native-base";
2022-08-23 01:31:42 +00:00
import { StyleSheet, TextInput } from "react-native";
import { UserContext } from "../context/UserContext";
2022-08-19 04:30:47 +00:00
2022-08-23 01:31:42 +00:00
export default function AgregarInvitados({ navigation }) {
2022-08-23 02:53:07 +00:00
const baseURL = `${API.BASE_URL}/guest/createGuest/`;
2022-08-23 01:31:42 +00:00
const [name, setName] = useState();
const [apellido, setApellido] =useState();
2022-08-23 02:53:07 +00:00
const [dni, setDNI] = useState();
const [phone, setPhone] = useState();
const [number_plate, setNumber_plate] = useState();
const [tenant_id, setTenant_id] = useState();
const [community_id, setCommunity_id] = useState();
const { user } = useContext(UserContext);
2022-08-26 21:01:29 +00:00
const [errors, setErrors] = useState({});
const [categoria, setCategoria] = React.useState("");
2022-08-26 21:01:29 +00:00
const [info, setInfo] = useState({
name: "",
last_name: "",
dni: "",
phone: "",
number_plate:"",
status: "1",
2022-08-26 21:01:29 +00:00
tenant_id: user._id,
//tenant_id: "6301df20dac7dcf76dcecade",
community_id: user.community_id,
//community_id: "62be68215692582bbfd77134",
type_guest:""
2022-08-26 21:01:29 +00:00
});
const onHandleChange = (name) => (value) => setInfo(prev => ({...prev, [name]: value}))
const validate = async() => {
if( info.name === "" && info.last_name === "" && info.dni === "" && info.phone === ""){
setErrors({ ...errors,
name: 'Debe ingresar un nombre',
last_name: 'Debe ingresar un apellido',
dni: 'Debe ingresar un número de identificación',
phone: 'Debe ingresar un número de teléfono'
});
return false;
}else if (info.name === "" ) {
setErrors({ ...errors,
name: 'Debe ingresar un nombre'
});
return false;
} else if(info.last_name === ""){
setErrors({ ...errors,
last_name: 'Debe ingresar un apellido'
});
return false;
}else if (info.dni === "") {
setErrors({ ...errors,
dni: 'Debe ingresar un número de identificación'
});
return false;
}else if (info.phone === "") {
setErrors({ ...errors,
phone: 'Debe ingresar un número de teléfono'
});
return false;
2022-08-23 01:31:42 +00:00
}
2022-08-26 21:01:29 +00:00
return true;
}
2022-08-23 01:31:42 +00:00
2022-08-26 21:01:29 +00:00
const saveInvitado = async() => {
const error = await validate();
if (error) {
try {
await fetch(baseURL, {
cache: 'no-cache',
method: 'POST',
body: JSON.stringify(info),
headers: {
'Content-Type': 'application/json'
}
})
.then(response => {
if (response.status != 201){
console.log('ocurrio un error ');
}else{
navigation.navigate('Inicio');
2022-08-26 21:01:29 +00:00
return response.json();
}
})
} catch (error) {
console.log("ERROR: " + error);
}
2022-08-23 01:31:42 +00:00
}
2022-08-26 21:01:29 +00:00
2022-08-23 01:31:42 +00:00
}
return (
<Center>
2022-08-26 21:01:29 +00:00
<ScrollView width='100%' h='570' ml='36' _contentContainerStyle={{
2022-08-23 01:31:42 +00:00
px: "20px",
mb: "4",
minW: "72"
}}>
<Box safeArea p="2" w="90%" maxW="290" py="8">
<Heading size="lg" color="coolGray.800" _dark={{
color: "warmGray.50"
}} fontWeight="semibold">
Registrar invitado
</Heading>
<Heading mt="1" color="coolGray.600" _dark={{
color: "warmGray.200"
}} fontWeight="medium" size="xs">
Registre el invitado que desee
</Heading>
2022-08-26 21:01:29 +00:00
<VStack space={5} mt="5">
2022-08-23 04:20:07 +00:00
<FormControl isRequired>
2022-08-23 01:31:42 +00:00
<FormControl.Label>Nombre</FormControl.Label>
2022-08-26 21:01:29 +00:00
<TextInput style={'name' in errors ? styles.errorMessage : styles.input} type="text" onChangeText={onHandleChange("name")}/>
{'name' in errors && <FormControl.ErrorMessage _text={{
fontSize: 'xs'
}}>Debe ingresar un correo electrónico</FormControl.ErrorMessage> }
2022-08-23 01:31:42 +00:00
</FormControl>
2022-08-23 04:20:07 +00:00
<FormControl isRequired>
2022-08-23 01:31:42 +00:00
<FormControl.Label>Apellido</FormControl.Label>
2022-08-26 21:01:29 +00:00
<TextInput style={'last_name' in errors ? styles.errorMessage : styles.input} type="text" onChangeText={onHandleChange("last_name")}/>
2022-08-23 01:31:42 +00:00
</FormControl>
2022-08-23 04:20:07 +00:00
<FormControl isRequired>
2022-08-23 02:53:07 +00:00
<FormControl.Label>Identificación</FormControl.Label>
2022-08-26 21:01:29 +00:00
<TextInput style={'dni' in errors ? styles.errorMessage : styles.input}type="text" onChangeText={onHandleChange("dni")}/>
2022-08-23 01:31:42 +00:00
</FormControl>
2022-08-23 04:20:07 +00:00
<FormControl isRequired>
2022-08-23 02:53:07 +00:00
<FormControl.Label>Teléfono</FormControl.Label>
2022-08-26 21:01:29 +00:00
<TextInput style={'phone' in errors ? styles.errorMessage : styles.input}type="text" onChangeText={onHandleChange("phone")} />
2022-08-23 01:31:42 +00:00
</FormControl>
2022-08-23 20:18:49 +00:00
<FormControl >
<FormControl.Label>Placa</FormControl.Label>
2022-08-26 21:01:29 +00:00
<TextInput style={styles.input} type="text" onChangeText={onHandleChange("number_plate")} />
</FormControl>
<FormControl >
<FormControl.Label>Tipo de invitado</FormControl.Label>
<Select onChangeText={onHandleChange("type_guest")} selectedValue={categoria} minWidth="200" accessibilityLabel="Choose Service" placeholder="Choose Service" _selectedItem={{
bg: "teal.600"
}} mt={1} onValueChange={onHandleChange("type_guest")}>
<Select.Item label="Invitado Frecuente" value="Frecuente" />
<Select.Item label="Invitado de acceso rápido" value="Rapido" />
</Select>
2022-08-23 20:18:49 +00:00
</FormControl>
2022-08-23 04:20:07 +00:00
<Button mt="2" backgroundColor='tertiary.600' onPress={() => saveInvitado()}>
2022-08-23 01:31:42 +00:00
Guardar
</Button>
</VStack>
</Box>
</ScrollView>
</Center>
)
}
2022-08-19 04:30:47 +00:00
2022-08-23 01:31:42 +00:00
const styles = StyleSheet.create({
input: {
2022-08-26 21:01:29 +00:00
height: 35,
2022-08-23 01:31:42 +00:00
margin: 3,
borderWidth: 0.5,
padding: 5,
flex: 1,
paddingTop: 9,
paddingRight: 19,
paddingBottom: 20,
paddingLeft: 0,
marginTop: 6,
marginBottom: 6,
borderRadius: 4
2022-08-26 21:01:29 +00:00
},
errorMessage: {
height: 35,
margin: 3,
borderWidth: 0.5,
padding: 5,
flex: 1,
paddingTop: 9,
paddingRight: 19,
paddingLeft: 0,
marginTop: 6,
borderRadius: 4,
borderColor: '#be123c'
2022-08-23 01:31:42 +00:00
}
})
2022-08-19 04:30:47 +00:00