Feat: Ajout de la page pour nouveau chantier ( A CORRIGER)

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 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 { ThemedButton } from '@/components/themed-button';
+import { ThemedTextInput } from '@/components/themed-textinput';
 
 export default function AddChantier() {
+  const { chantier, setChantier } = useChantier();
+  const { user, setUser } = useUser();
+  const { ressources, setRessources } = useRessources();
+  
+  const [loading, setLoading] = useState(false);
+  const [nom, setNom] = useState('');
+  const [chefChantier, setChefChantier] = useState('');
+  const [adresse, setAdresse] = useState('');
+  const [duree, setDuree] = useState('');
+  const [userSelect, setUserSelect] = useState<string[]>([]);
+  const [ressourcesSelect, setRessourcesSelect] = useState<string[]>([]);
 
-    return(
-        <ThemedView lvl={3} style={styles.back}>
-          <View style={styles.container}>
-            <ThemedText>TODO</ThemedText>
-          </View>
-        </ThemedView>
-      )
+  // 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",
+  },
+});