Merge branch 'main' of https://gitlab2.istic.univ-rennes1.fr/trochas/mmm-projet

app/(tabs)/_layout.tsx

@@ -7,14 +7,15 @@ import { HapticTab } from '@/components/haptic-tab';
 import { IconSymbol } from '@/components/ui/icon-symbol';
 import { Colors } from '@/constants/theme';
 import { useColorScheme } from '@/hooks/use-color-scheme';
-import AddChantier from './addChantier';
 import GestionOuvrier from './gestion_ouvrier';
 import ListMateriel from './gestionnaire_ressource';
 import Home from './home';
 import MapScreen from './mapScreen';
-
+import AddChantier from './addChantier';
-
 import AntDesign from '@expo/vector-icons/AntDesign';
+import { UserProvider } from '../ContextUser';
+import { ChantierProvider } from '../ContextChantier';
+import { RessourcesProvider } from '../ContextRessource';
 
 const Tabs = createBottomTabNavigator();
 
@@ -22,59 +23,67 @@ export default function TabLayout() {
   const colorScheme = useColorScheme();
 
   return (
-    <Tabs.Navigator
+    <UserProvider>
-      initialRouteName='explore'
+      <ChantierProvider>
-      screenOptions={{
+        <RessourcesProvider>
-        tabBarActiveTintColor: Colors[colorScheme ?? 'light'].tint,
+          <Tabs.Navigator
-        headerShown: false,
+            initialRouteName='explore'
-        tabBarButton: HapticTab,
+            screenOptions={{
-    }}>
+              tabBarActiveTintColor: Colors[colorScheme ?? 'light'].tint,
-      <Tabs.Screen
+              headerShown: false,
-        name="home"
+              tabBarButton: HapticTab,
-        component={Home}
+            }}>
-        options={{
+            <Tabs.Screen
-          title: 'Home',
+              name="home"
-          tabBarIcon: ({ color }) => (
+              component={Home}
-            <IconSymbol size={28} name="house.fill" color={color} />
+              options={{
-          ),
+                title: 'Home',
-        }}
+                tabBarIcon: ({ color }) => (
-      />  
+                  <IconSymbol size={28} name="house.fill" color={color} />
-      <Tabs.Screen
+                ),
-        name="gestionnaire_ressource"
+              }}
-        component={ListMateriel}
+            />
-        options={{
+            <Tabs.Screen
-          title: 'Ressources',
+              name="gestionnaire_ressource"
-          tabBarIcon: ({ color }) => (
+              component={ListMateriel}
-            <IconSymbol size={28} name="backpack.fill" color={color} />
+              options={{
-          ),
+                title: 'Ressources',
-        }}
+                tabBarIcon: ({ color }) => (
-      />
+                  <IconSymbol size={28} name="backpack.fill" color={color} />
-      <Tabs.Screen
+                ),
-        name="gestionnaire_ouvrier"
+              }}
-        component={GestionOuvrier}
+            />
-        options={{
+            <Tabs.Screen
-          title: 'Ouvriers',
+              name="GestionOuvrier"
-          tabBarIcon: ({ color }) => <IconSymbol size={28} name="person.fill" color={color} />,
+              component={GestionOuvrier}
-        }}
+              options={{
-      />
+                title: 'Bonjour',
-      <Tabs.Screen
+                tabBarIcon: ({ color }) => <IconSymbol size={28} name="person.fill" color={color} />,
-        name="explore"
+              }}
-        component={MapScreen}
+            />
-        options={{
+            <Tabs.Screen
-          title: 'MapScreen',
+              name="explore"
-          tabBarIcon: ({ color }) => <IconSymbol size={28} name="paperplane.fill" color={color} />,
+              component={MapScreen}
-        }}
+              options={{
-      >
+                title: 'MapScreen',
-      </Tabs.Screen>
+                tabBarIcon: ({ color }) => <IconSymbol size={28} name="paperplane.fill" color={color} />,
-      <Tabs.Screen
+              }}
-        name="addChantier"
+            >
-        component={AddChantier}
+            </Tabs.Screen>
-        options={{
+            <Tabs.Screen
-          title: 'Ajouter',
+              name="addChantier"
-          tabBarIcon: ({ color }) => (<AntDesign name="plus" size={28} color={color} />),
+              component={AddChantier}
-        }}
+              options={{
-      />              
+                title: 'Ajouter',
+                tabBarIcon: ({ color }) => (
+                  <AntDesign name="plus" size={24} color="black" />
+                ),
+              }}
+            />
 
-    </Tabs.Navigator>
+          </Tabs.Navigator>
+        </RessourcesProvider>
+      </ChantierProvider>
+    </UserProvider>
   );
 }

app/(tabs)/addChantier.tsx

@@ -1,27 +1,201 @@
+import ChantierSummary from '@/components/chantierSummary';
+import SelectChantier from '@/components/selectChantier';
+import SetStatus from '@/components/setStatus';
+import { ThemedView } from '@/components/themed-view';
+import React, { useEffect, useState } from 'react';
+import { StyleSheet, ScrollView, Button, TextInput, Text } from 'react-native';
+import { useChantier } from '../ContextChantier';
+import { useRessources } from '../ContextRessource';
+import { useUser } from '../ContextUser';
+import { getRessources, getUsers, addChantier } from '@/services/ressourcesService';
+import { Chantier, Ressources } from '@/class/class';
 import { ThemedText } from '@/components/themed-text';
-import { ThemedView, } from '@/components/themed-view';
+import { ThemedButton } from '@/components/themed-button';
-import Constants from 'expo-constants'; //pour connaître la taille de la barre menu de l'OS en haut
+import { ThemedTextInput } from '@/components/themed-textinput';
-import React from 'react';
-import { StyleSheet, View } from 'react-native';
 
 export default function AddChantier() {
+  const { chantier, setChantier } = useChantier();
+  const { user, setUser } = useUser();
+  const { ressources, setRessources } = useRessources();
   
-    return(
+  const [loading, setLoading] = useState(false);
-        <ThemedView lvl={3} style={styles.back}>
+  const [nom, setNom] = useState('');
-          <View style={styles.container}>
+  const [chefChantier, setChefChantier] = useState('');
-            <ThemedText>TODO</ThemedText>
+  const [adresse, setAdresse] = useState('');
-          </View>
+  const [duree, setDuree] = useState('');
-        </ThemedView>
+  const [userSelect, setUserSelect] = useState<string[]>([]);
-      )
+  const [ressourcesSelect, setRessourcesSelect] = useState<string[]>([]);
+
+  // Charger les utilisateurs et ressources
+  useEffect(() => {
+    async function load() {
+      setLoading(true);
+      const usersDb = await getUsers();
+      const ressourcesDb = await getRessources();
+      setUser(usersDb);
+      setRessources(ressourcesDb);
+      setLoading(false);
+    }
+    load();
+  }, []);
+
+  async function handleAddChantier() {
+    setLoading(true);
+
+    // Vérification chef
+    const chefUser = user.find(u => u.id === chefChantier);
+    if (!chefUser) {
+      console.error("Chef introuvable !");
+      setLoading(false);
+      return;
+    }
+
+    // Trouver les Users de l'équipe
+    const equipeUsers = userSelect
+      .map(id => user.find(u => u.id === id))
+      .filter(Boolean) as typeof user;
+
+    // Trouver les ressources sélectionnées
+    const materielSelect = ressourcesSelect
+  .map(id => ressources.find(r => r.id.toString() === id))
+  .filter(Boolean) as Ressources[];
+
+
+    // Construire l'objet chantier complet
+    const chantierData: Omit<Chantier, 'id'> = {
+  chef: chefUser!,
+  adresse,
+  dateDep: new Date(),
+  equipe: equipeUsers,
+  materiel: materielSelect,
+  etat: 'En attente',
+  latitude: 0,
+  longitude: 0,
+  anomalies: [],
+  tempsEst: 0,
+  vehicules: [],
+  contact: "",
+};
+
+    // Ajouter le chantier dans Firestore
+    const id = await addChantier(chantierData);
+    setLoading(false);
+
+    if (id) {
+      console.log("Chantier ajouté avec l'ID :", id);
+      setChantier({ ...chantierData, id });
+    }
+  }
+  return (
+    <ScrollView style= {styles.container}>
+      <ThemedView style = {styles.header}>
+        <ThemedText style = {styles.text}>Ajouter un nouveau chantier </ThemedText>
+        <ThemedTextInput lvl = {0} style = {styles.input} placeholder='Nom du chantier' value = {nom} onChangeText={setNom}/>
+        <ThemedTextInput lvl = {0} style = {styles.input} placeholder='Adresse du chantier' value = {adresse} onChangeText={setAdresse} />
+        <ThemedTextInput lvl = {0} style = {styles.input} placeholder='durée estimée (en jours)' value = {duree} onChangeText={setDuree} />
+        <ThemedTextInput lvl = {0} style = {styles.input} placeholder='chef de chantier' value= {chefChantier} onChangeText={setChefChantier}/>
+        <ThemedText style={{ fontWeight: "bold", marginTop: 15 }}>Équipe</ThemedText>
+        <SelectChantier
+        data={user}
+        multiple
+        selected={userSelect}
+        onChange={setUserSelect}
+        placeholder="Sélectionner l'équipe"
+      />
+      <Text style={{ fontWeight: "bold", marginTop: 15 }}>Ressources</Text>
+      <SelectChantier
+        data={ressources}
+        multiple
+        selected={ressourcesSelect}
+        onChange={setRessourcesSelect}
+        placeholder="Sélectionner les ressources"
+      />
+      <ThemedButton
+        lvl={1}
+        shadow={true}
+        style={{ padding: 10, borderRadius: 8, marginBottom: 10 }}
+        onPress={() => handleAddChantier()}
+        >
+
+      </ThemedButton>
+      </ThemedView>
+
+    </ScrollView>
+  );
 }
 
 const styles = StyleSheet.create({
-  back:{
-    height:"100%",
-    width:"100%",
-  },
   container: {
     flex: 1,
-    marginTop: Constants.statusBarHeight, //pour la barre menu du haut
+    marginTop: 60,
+  },
+  header: {
+    marginBottom: 20,
+    alignItems: "center",
+    paddingHorizontal: 20,
+  },
+  text: {
+    fontSize: 22,
+    fontWeight: "bold",
+    marginBottom: 10,
+  },
+  inputBack: {
+    width: "100%",
+    borderRadius: 10,
+    backgroundColor: "transparent",
+  },
+  input: {
+    width: "100%",
+    borderRadius: 10,
+    padding: 10,
+    fontSize: 16,
+  },
+  card: {
+    flexDirection: "row",
+    marginHorizontal: 20,
+    marginBottom: 15,
+    borderRadius: 10,
+    padding: 10,
+  },
+  image: {
+    width: 80,
+    height: 80,
+    borderRadius: 8,
+    marginRight: 10,
+  },
+  info: {
+    flex: 1,
+    justifyContent: "center",
+  },
+  footer: {
+    padding: 20,
+  },
+  empty: {
+    textAlign: "center",
+    marginTop: 30,
+    color: "#888",
+  },
+  filterMenuOverlay: {
+    position: "absolute",
+    top: 0,
+    left: 0,
+    right: 0,
+    bottom: 0,
+    backgroundColor: "rgba(0,0,0,0.4)",
+    justifyContent: "center",
+    alignItems: "center",
+    zIndex: 999,
+  },
+  filterMenu: {
+    width: "80%",
+    borderRadius: 12,
+    padding: 20,
+    backgroundColor: "#fff",
+  },
+  filterTitle: {
+    fontSize: 18,
+    fontWeight: "bold",
+    marginBottom: 20,
+    textAlign: "center",
   },
 });

components/selectChantier.tsx

@@ -1,10 +1,8 @@
 import { useChantier } from "@/app/ContextChantier";
 import { Chantier } from "@/class/class";
 import { getChantiers } from "@/services/ressourcesService";
-import { useRouter } from "expo-router";
 import { useEffect, useState } from "react";
 import {
-  ActivityIndicator,
   Dimensions,
   Image,
   Pressable,
@@ -31,14 +29,18 @@ const { width, height } = Dimensions.get("window");
 
 */
 
-export default function SelectChantier() {
+export default function SelectChantier(props: {
+  data?: any[];
+  multiple?: boolean;
+  selected?: string[] | string | null;
+  onChange?: (val: any) => void;
+  placeholder?: string;
+}) {
+  const { data: propData, multiple = false, selected, onChange, placeholder } = props || {};
   const { chantier, setChantier } = useChantier();
   const [search, setSearch] = useState("");
   const [isOpen, setIsOpen] = useState(false);
-  const [isLoaded, setIsLoaded] = useState(false);
+  const [chantiers, setChantiers] = useState<any[]>([]);
-  const [chantiers, setChantiers] = useState<Chantier[]>([]);
-  const router = useRouter();
-
 
   const AnimatedThemedView = Animated.createAnimatedComponent(ThemedView);
   const AnimatedThemedText = Animated.createAnimatedComponent(ThemedText);
@@ -47,21 +49,28 @@ export default function SelectChantier() {
     Animated.createAnimatedComponent(ThemedTextInput);
 
   async function onPressOpen(){
-    setIsLoaded(false);
     setIsOpen(!isOpen);
     if(!isOpen){
-      const updatedChantiers = await getChantiers();
+      if (propData && propData.length) {
-      setIsLoaded(true);
+        setChantiers(propData as any[]);
-      setChantiers(updatedChantiers)
+      } else {
+        const updatedChantiers = await getChantiers();
+        setChantiers(updatedChantiers);
+      }
     }
   }
 
   function onPressAddChantier(){
-    router.push("/(tabs)/addChantier")
+
-    setIsOpen(false)
   }
 
   useEffect(() => {
+    // If parent provided data, use it. Otherwise fetch chantiers.
+    if (propData && propData.length) {
+      setChantiers(propData as any[]);
+      return;
+    }
+
     async function loadChantiers() {
       const list = await getChantiers();
       setChantiers(list);
@@ -70,22 +79,56 @@ export default function SelectChantier() {
     loadChantiers();
   }, []);
 
-  function selectChantier(chantier: Chantier): void {
+  function getId(item: any) {
-    setChantier(chantier);
+    return (item && (item.id ?? item._id ?? item.uid ?? item.key)) ?? String(item);
+  }
+
+  function getLabel(item: any) {
+    if (!item) return String(item);
+    if (item.adresse) return item.adresse;
+    if (item.nom) return item.nom;
+    if (item.name && item.last_name) return `${item.last_name} ${item.name}`;
+    if (item.name) return item.name;
+    if (item.label) return item.label;
+    if (typeof item === 'string') return item;
+    return JSON.stringify(item);
+  }
+
+  function selectChantier(item: any): void {
+    const id = String(getId(item));
+    if (multiple) {
+      // for multiple selection toggle id in selected array
+      const current = Array.isArray(selected) ? [...selected] : [];
+      const idx = current.indexOf(id);
+      if (idx >= 0) current.splice(idx, 1);
+      else current.push(id);
+      onChange?.(current);
+      // keep menu open for multiple selection
+      return;
+    }
+
+    // single selection
+    if (onChange) {
+      onChange(id);
+    } else {
+      // fallback behavior for old usage: if selecting a Chantier, update context
+      setChantier(item as Chantier);
+    }
     setIsOpen(false);
   }
 
-  const renderChantier = (chantier: Chantier, index: number) => {
+  const renderChantier = (item: any, index: number) => {
+    const label = getLabel(item);
+    const id = String(getId(item));
+    const isSelected = Array.isArray(selected) ? selected.includes(id) : selected === id;
     return (
-        <Pressable key={index} onPress={() => selectChantier(chantier)}>
+        <Pressable key={index} onPress={() => selectChantier(item)}>
-          <ThemedView lvl={4} style={styles.chantier}>
+          <ThemedView lvl={4} style={[styles.chantier, isSelected ? { borderWidth: 1 } : {}]}>
             <View>
-              <Image source={{ uri:"https://cdn.discordapp.com/attachments/1425108443571945644/1427207643180826757/raw.png?ex=69392bb2&is=6937da32&hm=dcc09e76d3dca89d2418947b46efbd38673b9dc559027724b2e51d493b173bc9&" /*chantier.urlImg*/ }} style={styles.image} />
+              <Image source={{ uri: "https://cdn.discordapp.com/attachments/1425108443571945644/1427207643180826757/raw.png?ex=69392bb2&is=6937da32&hm=dcc09e76d3dca89d2418947b46efbd38673b9dc559027724b2e51d493b173bc9&" }} style={styles.image} />
             </View>
             <View>
-            <ThemedText>Adresse: {chantier.adresse}</ThemedText>
+              <ThemedText>{label}</ThemedText>
-            <ThemedText>Chef de chantier: {chantier.chef.last_name}{" "}{chantier.chef.name}</ThemedText>
-            <ThemedText>État: {chantier.etat}</ThemedText>
             </View>
           </ThemedView>
         </Pressable>
@@ -98,7 +141,19 @@ export default function SelectChantier() {
       <AnimatedThemedView layout={LinearTransition.duration(200)} lvl={2} shadow={true} style={styles.window}>
         <AnimatedThemedButton style={isOpen ? styles.buttonOpen : styles.buttonClose} lvl={isOpen ? 1 : 1} onPress={() => onPressOpen()}>
           <ThemedText style={styles.buttonText}>
-            {isOpen ? "Fermer" : (chantier!=null ? chantier.adresse : "Chantier")}
+            {isOpen
+              ? "Fermer"
+              : (multiple
+                  ? (Array.isArray(selected) && selected.length ? `${selected.length} sélectionnés` : (placeholder ?? "Sélectionner"))
+                  : (selected ? (() => {
+                      // show label of selected single item if provided in propData
+                      if (selected && propData) {
+                        const found = propData.find((it: any) => String(getId(it)) === String(selected));
+                        return found ? getLabel(found) : (chantier ? (chantier.adresse ?? getLabel(chantier)) : (placeholder ?? "Chantier"));
+                      }
+                      return chantier ? (chantier.adresse ?? getLabel(chantier)) : (placeholder ?? "Chantier");
+                    })() : (placeholder ?? "Chantier"))
+                )}
           </ThemedText>
         </AnimatedThemedButton>
         {isOpen && (
@@ -111,16 +166,14 @@ export default function SelectChantier() {
                 +
               </ThemedText>
             </ThemedButton>
-            <View style={styles.list}>
+
-              {isLoaded?
+            <ThemedView lvl={2} style={styles.list}>
               <ScrollView contentContainerStyle={styles.chantiersList}>
                 {chantiers.map((chantier, index) =>
                   renderChantier(chantier, index)
                 )}
               </ScrollView>
-              : <ActivityIndicator style={{height:"100%"}} color="#808080" size="large" />}
+            </ThemedView>
-            </View>
-
         </View>
         )}
       </AnimatedThemedView>
@@ -223,8 +276,5 @@ const styles = StyleSheet.create({
   buttonAdd:{
     borderRadius: 10,
     marginBottom: 10,
-    height: 30,
-    alignItems: 'center',
-    justifyContent: 'center',
   }
 });