diff --git a/app/(tabs)/home.tsx b/app/(tabs)/home.tsx index 34fcb4b..8e60ab6 100644 --- a/app/(tabs)/home.tsx +++ b/app/(tabs)/home.tsx @@ -1,32 +1,41 @@ +import ChantierSummary from '@/components/chantierSummary'; import SelectChantier from '@/components/selectChantier'; import SetStatus from '@/components/setStatus'; import { ThemedView, } from '@/components/themed-view'; import Constants from 'expo-constants'; //pour connaître la taille de la barre menu de l'OS en haut import React from 'react'; import { StyleSheet, View } from 'react-native'; +import { useChantier } from '../ContextChantier'; export default function Home() { - + const { chantier, setChantier } = useChantier(); + return( - - - - - - - - - + + + + + + + + + + + ) } const styles = StyleSheet.create({ + back:{ + height:"100%", + width:"100%", + }, container: { flex: 1, marginTop: Constants.statusBarHeight, //pour la barre menu du haut @@ -35,4 +44,8 @@ const styles = StyleSheet.create({ flex: 1, width:"100%" }, + summary:{ + marginTop:60, + padding:10, + } }); \ No newline at end of file diff --git a/components/chantierSummary.tsx b/components/chantierSummary.tsx new file mode 100644 index 0000000..df1dbe3 --- /dev/null +++ b/components/chantierSummary.tsx @@ -0,0 +1,61 @@ +import SelectChantier from '@/components/selectChantier'; +import SetStatus from '@/components/setStatus'; +import { ThemedView, } from '@/components/themed-view'; +import Constants from 'expo-constants'; //pour connaître la taille de la barre menu de l'OS en haut +import React from 'react'; +import { StyleSheet, View, Image, ViewStyle, StyleProp } from 'react-native'; +import { ThemedText } from './themed-text'; +import { Chantier } from '@/class/class'; + + +type Props = { + data: { + chantier:Chantier|null; + } + style?: StyleProp; +}; + +export default function ChantierSummary({data,style , ...otherProps }: Props) { + + + return( + + {data.chantier ? ( + + + + + + {data.chantier.chef != null ? "true" : "false"} + Adresse: {data.chantier.adresse} + Chef de chantier: {data.chantier.chef.last_name}{" "}{data.chantier.chef.name} + État: {data.chantier.etat} + + + ) : + + Pas de chantier Selectionné + + } + + ) +} + +const styles = StyleSheet.create({ + chantier: { + padding: 5, + //marginTop:5, + //margin:5, + borderRadius: 10, + //borderWidth: 1, + flexDirection: 'row', + height: 150, + }, + image:{ + margin:0, + width: 70, + height: 140, + borderRadius: 5, + marginRight: 10, + }, +}); \ No newline at end of file diff --git a/components/selectChantier.tsx b/components/selectChantier.tsx index a821ca5..69646a2 100644 --- a/components/selectChantier.tsx +++ b/components/selectChantier.tsx @@ -20,6 +20,7 @@ import { ThemedTextInput } from "./themed-textinput"; import { ThemedView } from "./themed-view"; const screenHeight = Dimensions.get("window").height; +const { width, height } = Dimensions.get("window"); /* @@ -80,12 +81,13 @@ export default function SelectChantier() { return ( + {isOpen && ( setIsOpen(false)}/>)} - onPressOpen()}> + onPressOpen()}> - {isOpen ? "Fermer" : "Chantier"} + {isOpen ? "Fermer" : (chantier!=null ? chantier.adresse : "Chantier")} - + {isOpen && ( @@ -118,12 +120,22 @@ const styles = StyleSheet.create({ width: "100%", height: screenHeight / 2, padding: 10, + zIndex:1000, }, window: { borderRadius: 15, height: "100%", //backgroundColor: '#00FF00', overflow: "hidden", + }, + autoClose: { + + position: 'absolute', + top: -height, + left: -width, + width:width*2, + height:height*2, + //backgroundColor: 'rgba(255, 0, 0, 0.5)', }, menu: { padding: 5, diff --git a/components/setStatus.tsx b/components/setStatus.tsx index 9345824..00fd0bf 100644 --- a/components/setStatus.tsx +++ b/components/setStatus.tsx @@ -1,12 +1,11 @@ import { useChantier } from '@/app/ContextChantier'; -import { useState } from 'react'; -import { Dimensions, LayoutAnimation, Pressable, StyleSheet, View } from 'react-native'; +import { useCallback, useState } from 'react'; +import { Dimensions, LayoutAnimation, Modal, Pressable, StyleSheet, View } from 'react-native'; import Animated, { LinearTransition } from 'react-native-reanimated'; import { ThemedButton } from './themed-button'; import { ThemedText } from './themed-text'; import { ThemedView } from "./themed-view"; -const screenHeight = Dimensions.get("window").height; const { width, height } = Dimensions.get("window"); @@ -15,6 +14,8 @@ export default function SetStatus() { const { chantier, setChantier} = useChantier(); const [currentSatus, setCurrentSearch] = useState("En cours"); const [isOpen,setIsOpen] = useState(false); + const [openConfirmation,setOpenConfirmation] = useState(false); + const AnimatedThemedView = Animated.createAnimatedComponent(ThemedView); @@ -28,6 +29,7 @@ export default function SetStatus() { } function selectSatus(status: string): void { + setOpenConfirmation(true); setCurrentSearch(status); setIsOpen(false); } @@ -47,25 +49,32 @@ export default function SetStatus() { return( - - - onPressOpen()}> - {currentSatus} - - {isOpen && - - - - {choices.map((str, index) => ( - str!==currentSatus && choice(str, index) - ))} + + + {isOpen && ( setIsOpen(false)}/>)} + + + onPressOpen()}> + {currentSatus} + + {isOpen && ( + <> + {//TODO : Modal pour confirmer la changement + } + + + + {choices.map((str, index) => ( + str!==currentSatus && choice(str, index) + ))} + - - } + + )} + ) - } const styles = StyleSheet.create({ @@ -76,12 +85,22 @@ const styles = StyleSheet.create({ width:"30%", padding: 10, paddingLeft: 0, - overflow: 'hidden', + //overflow: 'hidden', }, window:{ borderRadius:15, //backgroundColor: '#00FF00', overflow: 'hidden', + position: 'relative', + }, + autoClose: { + + position: 'absolute', + top: -height, + left: -width, + width:width*2, + height:height*2, + //backgroundColor: 'rgba(255, 0, 0, 0.5)', }, menu:{ padding:0, @@ -90,7 +109,7 @@ const styles = StyleSheet.create({ }, list:{ flex: 1, - overflow: 'hidden', + //overflow: 'hidden', borderRadius:10, }, @@ -107,6 +126,5 @@ const styles = StyleSheet.create({ }, centeredText:{ textAlign: 'center', - fontSize: 13, } });