eduardo
/
katoikia-app
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

modified time picker for reservas

This commit is contained in:
Maria Sanchez 2022-08-23 20:35:11 -06:00
parent ff1af19613
commit b7ee2a20a9
2 changed files with 46 additions and 46 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

87
mobile-ui/components/AreaComun.js
View File

@ -13,6 +13,7 @@ import { API } from "../environment/api";
import {TimePicker} from 'react-native-simple-time-picker'; import {TimePicker} from 'react-native-simple-time-picker';
import { View, StyleSheet } from "react-native"; import { View, StyleSheet } from "react-native";
import { number } from "prop-types"; import { number } from "prop-types";
import DateTimePicker from '@react-native-community/datetimepicker';
export default function AreaComun({navigation}){ export default function AreaComun({navigation}){
const { user } = useContext(UserContext) const { user } = useContext(UserContext)
@ -23,6 +24,8 @@ export default function AreaComun({navigation}){
const [selectedMinutes, setSelectedMinutes] = useState(0); const [selectedMinutes, setSelectedMinutes] = useState(0);
const [endSelectedHours, setEndSelectedHours] = useState(0); const [endSelectedHours, setEndSelectedHours] = useState(0);
const [endSelectedMinutes, setEndSelectedMinutes] = useState(0); const [endSelectedMinutes, setEndSelectedMinutes] = useState(0);
const [time, setTime] = useState(new Date(1598051730000))
const [endTime, setEndTime] = useState(new Date(1598051730000))
const date = new Date(); const date = new Date();
useEffect(() => { useEffect(() => {
@ -62,42 +65,52 @@ export default function AreaComun({navigation}){
const postReserva = async() => { const postReserva = async() => {
//console.log(date); console.log(time);
const data = { // const data = {
"start_time": 7 + ":" +0, // "start_time": 7 + ":" +0,
"finish_time": 10 + ":" +0, // "finish_time": 10 + ":" +0,
"status": 1, // "status": 1,
"date_entry": date, // "date_entry": date,
"user_id" : user._id, // "user_id" : user._id,
"common_area_id": service._id, // "common_area_id": service._id,
"common_area_name": service.name, // "common_area_name": service.name,
"community_id": service.community_id // "community_id": service.community_id
} // }
console.log(data); // console.log(data);
try { // try {
const jsonDataResponse = await fetch(`${API.BASE_URL}/reservation/createReservation`, { // const jsonDataResponse = await fetch(`${API.BASE_URL}/reservation/createReservation`, {
cache: 'no-cache', // cache: 'no-cache',
method: 'POST', // method: 'POST',
body: JSON.stringify(data), // body: JSON.stringify(data),
headers: { // headers: {
'Content-Type': 'application/json' // 'Content-Type': 'application/json'
} // }
}) // })
const response = await jsonDataResponse.json(); // const response = await jsonDataResponse.json();
console.log(response.message); // console.log(response.message);
} catch (error) { // } catch (error) {
console.log("ERROR:" + error); // console.log("ERROR:" + error);
} // }
} }
const onChangeStart = (event, selectedDate) => {
const currentDate = selectedDate;
setShow(false);
setTime(currentDate);
};
const onChangeEnd = (event, selectedDate) => {
const currentDate = selectedDate;
setShow(false);
setEndTime(currentDate);
};
return ( return (
@ -131,36 +144,22 @@ export default function AreaComun({navigation}){
<FormControl isRequired> <FormControl isRequired>
<FormControl.Label>Hora de inicio</FormControl.Label> <FormControl.Label>Hora de inicio</FormControl.Label>
<View > <View >
<TimePicker <DateTimePicker mode="time" is24Hour={true} value={time} onChangeStart={onChange}/>
selectedHours={selectedHours}
selectedMinutes={selectedMinutes}
onChange={(hours, minutes) => {
setSelectedHours(hours);
setSelectedMinutes(minutes);
}}/>
</View> </View>
</FormControl> </FormControl>
<FormControl isRequired> <FormControl isRequired>
<FormControl.Label>Hora de finalización</FormControl.Label> <FormControl.Label>Hora de finalización</FormControl.Label>
<View > <View >
<TimePicker <DateTimePicker mode="time" is24Hour={true} value={time} onChangeEnd={onChange}/>
selectedHours={selectedHours}
//initial Hourse value
selectedMinutes={selectedMinutes}
//initial Minutes value
onChange={(hours, minutes) => {
setEndSelectedHours(hours);
setEndSelectedMinutes(minutes);
}}/>
</View> </View>
</FormControl> </FormControl>
<Button mt="2" backgroundColor="tertiary.600" onPress={()=> postReserva()}> <Button mt="10" backgroundColor="tertiary.600" onPress={()=> postReserva()}>
Reservar Reservar
</Button> </Button>
<Button mt="6" colorScheme="error" onPress={() => navigation.navigate('Comunicados')}> <Button mt="3" colorScheme="error" onPress={() => navigation.navigate('Comunicados')}>
Cancelar Cancelar
</Button> </Button>
</VStack> </VStack>

3
mobile-ui/package.json
View File

@ -38,7 +38,8 @@
"react-native-svg": "12.1.1", "react-native-svg": "12.1.1",
"react-native-table-component": "^1.2.2", "react-native-table-component": "^1.2.2",
"react-native-web": "0.17.1", "react-native-web": "0.17.1",
"universal-cookie": "^4.0.4" "universal-cookie": "^4.0.4",
"@react-native-community/datetimepicker": "4.0.0"
}, },
"devDependencies": { "devDependencies": {
"@babel/core": "^7.12.9" "@babel/core": "^7.12.9"