Files
mmm-projet/components/add/select/ressourceSummary.tsx

79 lines
2.8 KiB
TypeScript

import { Chantier, Ressources } from '@/class/class';
import { ThemedView, } from '@/components/theme/themed-view';
import React, { useEffect, useState } from 'react';
import { Image, StyleProp, StyleSheet, View, ViewStyle } from 'react-native';
import { ThemedText } from '@/components/theme/themed-text';
import { ThemedButton } from '@/components/theme/themed-button';
import { getNbUseRessources } from '@/class/utils';
import { useReservations } from '@/app/ContextReservation';
import { getReservations } from '@/services/ressourcesService';
type RessourcesQte = [Ressources, number];
type Props = {
ressource:Ressources;
qte:number;
sendRessource: (ressource: RessourcesQte) => void;
style?: StyleProp<ViewStyle>;
};
export default function RessourceSummary({ressource: ressource,qte,style,sendRessource: sendRessource, ...otherProps }: Props) {
const { reservations, setReservations } = useReservations();
const [count,setCount] = useState(qte);
function onPressAdd(ressource: Ressources): void {
if(count<ressource.quantity-getNbUseRessources(ressource,reservations)){
setCount(count+1);
sendRessource([ressource, count+1]);
}
}
function onPressSub(ressource: Ressources): void {
if(count>0){
setCount(count-1);
sendRessource([ressource, count-1]);
}
}
useEffect(() => {
async function loadReservations() {
const list = await getReservations();
setReservations(list);
}
loadReservations();
}, []);
return(
<View style={style}>
<ThemedView lvl={2} border={3} style={{padding:10,width:"100%",borderRadius:10,flexDirection: 'row',justifyContent: 'space-between',}}>
<View>
<ThemedText>Nom : {ressource.name}</ThemedText>
<ThemedText>Restant : {ressource.quantity-getNbUseRessources(ressource,reservations)}/{ressource.quantity}</ThemedText>
</View>
<View style={{alignItems:"center"}}>
<ThemedButton style={styles.button} lvl={3} onPress={() => onPressAdd(ressource)}>
<ThemedText>+</ThemedText>
</ThemedButton>
<ThemedText>{count}/{ressource.quantity-getNbUseRessources(ressource,reservations)}</ThemedText>
<ThemedButton style={styles.button} lvl={3} onPress={() => onPressSub(ressource)}>
<ThemedText>-</ThemedText>
</ThemedButton>
</View>
</ThemedView>
</View>
)
}
const styles = StyleSheet.create({
button:{
padding:5,
marginHorizontal:10,
alignItems:"center",
borderRadius: 20,
width: 40,
height: 40,
},
});