Feat: ajout de la page d'ajout des ressources.
This commit is contained in:
@@ -1,8 +1,6 @@
|
||||
import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
|
||||
import { } from 'expo-router';
|
||||
import React from 'react';
|
||||
|
||||
|
||||
import { HapticTab } from '@/components/expoExempleComponents/haptic-tab';
|
||||
import { IconSymbol } from '@/components/ui/icon-symbol';
|
||||
import { Colors } from '@/constants/theme';
|
||||
@@ -12,6 +10,7 @@ import ListMateriel from './gestionnaire_ressource';
|
||||
import Home from './home';
|
||||
import MapScreen from './mapScreen';
|
||||
import AddChantier from './addChantier';
|
||||
import AddRessource from './addRessource';
|
||||
import AntDesign from '@expo/vector-icons/AntDesign';
|
||||
import { UserProvider } from '../ContextUser';
|
||||
import { ChantierProvider } from '../ContextChantier';
|
||||
@@ -78,6 +77,19 @@ export default function TabLayout() {
|
||||
}}
|
||||
/>
|
||||
|
||||
<Tabs.Screen
|
||||
name="addRessource"
|
||||
component={AddRessource}
|
||||
options={{
|
||||
title: 'Ajouter',
|
||||
tabBarIcon: ({ color }) => (
|
||||
<AntDesign name="plus" size={24} color={color} />
|
||||
),
|
||||
}}
|
||||
/>
|
||||
|
||||
|
||||
|
||||
</Tabs.Navigator>
|
||||
);
|
||||
}
|
||||
|
||||
203
app/(tabs)/addRessource.tsx
Normal file
203
app/(tabs)/addRessource.tsx
Normal file
@@ -0,0 +1,203 @@
|
||||
import ChantierSummary from '@/components/chantierSummary';
|
||||
import SelectChantier from '@/components/selectChantier';
|
||||
import SetStatus from '@/components/setStatus';
|
||||
|
||||
|
||||
import { ThemedView } from '@/components/theme/themed-view';
|
||||
import React, { useEffect, useState } from 'react';
|
||||
import { StyleSheet, ScrollView, Button, TextInput, Text, View, Modal } 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, User } from '@/class/class';
|
||||
import { ThemedText } from '@/components/theme/themed-text';
|
||||
import { ThemedButton } from '@/components/theme/themed-button';
|
||||
import { ThemedTextInput } from '@/components/theme/themed-textinput';
|
||||
import DateTimePicker, { DateTimePickerEvent } from '@react-native-community/datetimepicker';
|
||||
|
||||
import Constants from 'expo-constants'; //pour connaître la taille de la barre menu de l'OS en haut
|
||||
import SelectChafChantier from '@/components/selectChefChantier';
|
||||
import SelectMachine from '@/components/selectMachine';
|
||||
|
||||
//Uniquement accessible par le RESPONSSABLE du chantier
|
||||
//Pour créer ou modifier un chantier
|
||||
export default function AddRessource() {
|
||||
const { ressources, setRessources } = useRessources();
|
||||
|
||||
const [editMode,setEditMode] = useState(false);
|
||||
|
||||
const [loading, setLoading] = useState(false);
|
||||
const [nom, setNom] = useState('');
|
||||
const [type, setType] = useState('');
|
||||
const [quantite, setQuantite] = useState('');
|
||||
const [quantiteDisponible,setQuantiteDisponible] = useState('');
|
||||
const [openConfirmation,setOpenConfirmation] = useState(false);
|
||||
|
||||
async function handleAddRessource() {
|
||||
setLoading(true);
|
||||
setOpenConfirmation(true);
|
||||
}
|
||||
|
||||
async function onConfirm(): Promise<void> {
|
||||
//TODO
|
||||
//await changeChantierStatus(chantier.id,tempStatus)
|
||||
//Il faut changer le UX
|
||||
//setChantier({...chantier,etat: tempStatus})
|
||||
if(isValidRessource()){
|
||||
setOpenConfirmation(false);
|
||||
}
|
||||
}
|
||||
|
||||
function onCancel(): void {
|
||||
setOpenConfirmation(false);
|
||||
}
|
||||
function isValidRessource():Boolean{
|
||||
return nom!= "" && type!= "" && quantite != "" && quantiteDisponible != ""
|
||||
}
|
||||
|
||||
const renderValidationScreen = () => {
|
||||
return(
|
||||
<Modal transparent={true} >
|
||||
<View style={styles.overlay}>
|
||||
<ThemedView style={styles.overlayView}>
|
||||
<ThemedText style={{fontSize: 25}}>Créer la nouvelle ressource suivante ? :</ThemedText>
|
||||
<ThemedView lvl={2} style={styles.summaryNewChantier}>
|
||||
<ThemedText style={{fontSize: 20}}>Nom: {nom===''?"NONE":nom}</ThemedText>
|
||||
<ThemedText style={{fontSize: 20}}>Type: {type===''?"NONE":type}</ThemedText>
|
||||
<ThemedText style={{fontSize: 20}}>quantite: {quantite===''?"0":quantite} </ThemedText>
|
||||
<ThemedText style={{fontSize: 20}}>quantite disponible: {quantiteDisponible===''?"NONE":quantiteDisponible}</ThemedText>
|
||||
</ThemedView>
|
||||
<View style={styles.overlayView}>
|
||||
<ThemedButton lvl={2} border={5} style={styles.buttonValid} onPress={() => onConfirm()}>
|
||||
<ThemedText style={{fontSize: 25}}>Confirmer</ThemedText>
|
||||
</ThemedButton>
|
||||
</View>
|
||||
<View style={styles.overlayView}>
|
||||
<ThemedButton lvl={2} border={5} style={styles.buttonValid} onPress={() => onCancel()}>
|
||||
<ThemedText style={{fontSize: 25}}>Annuler</ThemedText>
|
||||
</ThemedButton>
|
||||
</View>
|
||||
</ThemedView>
|
||||
</View>
|
||||
</Modal>
|
||||
)
|
||||
}
|
||||
|
||||
|
||||
const renderInut = (name : string, preFill : string, value : string, setValue : ((text:string) => void),numeric:boolean) => {
|
||||
return (
|
||||
<View style = {styles.inputLine}>
|
||||
<ThemedText style = {styles.inputName}>{name}:</ThemedText>
|
||||
<ThemedTextInput lvl = {1} style = {styles.input} placeholder={preFill} value = {value} keyboardType={numeric ? "numeric" : "default"} onChangeText={setValue} />
|
||||
</View>
|
||||
);
|
||||
};
|
||||
|
||||
return (
|
||||
<ThemedView lvl={3} style={styles.back}>
|
||||
<View style={styles.container}>
|
||||
{editMode &&
|
||||
<View style={{width:"100%", position: 'absolute'}}>
|
||||
<SelectChantier></SelectChantier>
|
||||
</View>
|
||||
}
|
||||
<ScrollView>
|
||||
<View style = {styles.header}>
|
||||
|
||||
<ThemedText style = {styles.text}>
|
||||
{editMode? "Edition d'un chantier"
|
||||
:"Ajouter une nouvelle ressource"}
|
||||
</ThemedText>
|
||||
{renderInut("Nom","Marteau",nom,setNom,false)}
|
||||
{renderInut("Type","outil",type,setType,false)}
|
||||
{renderInut("Quantité ","14",quantite,setQuantite,true)}
|
||||
{renderInut("Quantité disponible","14",quantiteDisponible,setQuantiteDisponible,true)}
|
||||
<ThemedButton
|
||||
lvl={1}
|
||||
shadow={true}
|
||||
style={{ padding: 15, borderRadius: 8, marginTop: 10 }}
|
||||
onPress={() => handleAddRessource()}
|
||||
>
|
||||
<ThemedText>Valider</ThemedText>
|
||||
</ThemedButton>
|
||||
|
||||
{openConfirmation && renderValidationScreen()}
|
||||
</View>
|
||||
|
||||
</ScrollView>
|
||||
</View>
|
||||
</ThemedView>
|
||||
);
|
||||
}
|
||||
|
||||
const styles = StyleSheet.create({
|
||||
back:{
|
||||
height:"100%",
|
||||
width:"100%",
|
||||
},
|
||||
container: {
|
||||
flex: 1,
|
||||
marginTop: Constants.statusBarHeight, //pour la barre menu du haut
|
||||
},
|
||||
header: {
|
||||
marginTop:60,
|
||||
alignItems: "center",
|
||||
paddingHorizontal: 20,
|
||||
},
|
||||
text: {
|
||||
fontSize: 22,
|
||||
fontWeight: "bold",
|
||||
marginBottom: 10,
|
||||
},
|
||||
inputBack: {
|
||||
width: "100%",
|
||||
borderRadius: 10,
|
||||
backgroundColor: "transparent",
|
||||
},
|
||||
inputLine:{
|
||||
width: "100%",
|
||||
//flexDirection: 'row',
|
||||
paddingVertical: 5,
|
||||
//alignItems: "center",
|
||||
},
|
||||
inputName: {
|
||||
fontSize: 16,
|
||||
},
|
||||
input: {
|
||||
width: "100%",
|
||||
borderRadius: 10,
|
||||
padding: 10,
|
||||
fontSize: 16,
|
||||
},
|
||||
overlay:{
|
||||
backgroundColor:'#00000080',
|
||||
padding:"5%",
|
||||
paddingVertical:"20%",
|
||||
width:"100%",
|
||||
height:"100%",
|
||||
},
|
||||
overlayView:{
|
||||
borderRadius: 20,
|
||||
padding: 20,
|
||||
alignItems: "center",
|
||||
width: "100%",
|
||||
gap:5,
|
||||
//backgroundColor:'#ff0000',
|
||||
},
|
||||
buttonValid:{
|
||||
//borderWidth: 2,
|
||||
width:'100%',
|
||||
margin: 0,
|
||||
borderRadius: 15,
|
||||
padding: 10,
|
||||
height:60,
|
||||
alignItems: "center",
|
||||
justifyContent: 'center',
|
||||
},
|
||||
summaryNewChantier:{
|
||||
width:'100%',
|
||||
borderRadius: 15,
|
||||
padding:10,
|
||||
}
|
||||
});
|
||||
Reference in New Issue
Block a user