fix errors in beef production view : products quantity is not restore…

…d after cancellation, inappropriate colors inread only mode
benjaminpochat · Aug 26, 2024 · 3d00eda · 3d00eda
1 parent 7c8cddd
commit 3d00eda
Show file tree

Hide file tree

Showing 5 changed files with 60 additions and 22 deletions.
diff --git a/frontend/app/src/domains/production/views/beefProduction/BeefProductionView.tsx b/frontend/app/src/domains/production/views/beefProduction/BeefProductionView.tsx
@@ -11,6 +11,7 @@ import PackageLotsCreator from '../PackageLotsCreator.tsx'
 import { useKeycloak } from '@react-keycloak/web'
 import { useLoaderData, useNavigate } from 'react-router-dom'
 import { ApiBuilder } from '../../../../api/ApiBuilder.ts'
+import { Production } from '@viandeendirect/api/dist/models/Production'
 
 export default function BeefProductionView() {
 
@@ -145,7 +146,7 @@ export default function BeefProductionView() {
         }
     }
 
-    function cancelUpdate() {
+    async function cancelUpdate() {
         setAlerts(undefined)
         switch (currentTab) {
             case BREEDING_PROPERTIES_TAB: 
@@ -168,14 +169,20 @@ export default function BeefProductionView() {
                     setReadOnly(true)
                 })
             case PRODUCTS_TAB:
+                const reloadedProduction = await reloadProduction(production.id)
                 setProduction({...production,
-                    lots: production?.lots ? production?.lots.map((lot) => {return {...lot}}) : undefined
+                    lots: reloadedProduction?.lots ? reloadedProduction?.lots : undefined
                 })
                 setSaveEnabled(true)
                 setReadOnly(true) 
         }
     }
 
+    async function reloadProduction(beefProductionId: number): Promise<Production> {
+        const api = await apiBuilder.getAuthenticatedApi(keycloak)
+        return await api.getBeefProduction({beefProductionId: beefProductionId})
+    }
+
     function displayAlerts() {
         if (alerts) {
             return <Alert severity="error">{alerts}</Alert>

diff --git a/frontend/app/src/domains/production/views/beefProduction/forms/BreedingPropertiesForm.tsx b/frontend/app/src/domains/production/views/beefProduction/forms/BreedingPropertiesForm.tsx
@@ -1,10 +1,9 @@
 import React from "react"
 
-import { Button, ButtonGroup } from "@mui/material"
-import { CheckboxElement, DatePickerElement, FormContainer, SelectElement, SubmitHandler, TextFieldElement, useForm } from 'react-hook-form-mui'
+import { CheckboxElement, DatePickerElement, FormContainer, SelectElement, TextFieldElement } from 'react-hook-form-mui'
 
-import BeefProduction from "@viandeendirect/api/dist/models/BeefProduction"
 import dayjs from "dayjs"
+import '../../../../../resources/styles/form.css'
 
 export function BreedingPropertiesForm({
     form: form, 
@@ -33,31 +32,35 @@ export function BreedingPropertiesForm({
                         label="Date de naissance"
                         disabled={disabled}
                         maxDate={maxBirthDate ? dayjs(maxBirthDate) : undefined}
-                        disableFuture={true}/>
+                        disableFuture={true}
+                        className={disabled ? 'disabled' : ''}/>
                 </div>
                 <div>
                     <TextFieldElement 
                         name="birthFarm" 
                         validation={{ required: 'Champ obligatoire' }} 
                         label="Ferme de naissance" 
                         variant="standard" 
-                        disabled={disabled}/>
+                        disabled={disabled}
+                        className={disabled ? 'disabled' : ''}/>
                 </div>
                 <div>
                     <TextFieldElement 
                         name="birthPlace" 
                         validation={{ required: 'Champ obligatoire' }} 
                         label="Commune de naissance" 
                         variant="standard" 
-                        disabled={disabled}/>
+                        disabled={disabled}
+                        className={disabled ? 'disabled' : ''}/>
                 </div>
                 <div>
                     <TextFieldElement 
                         name="animalIdentifier" 
                         validation={{ required: 'Champ obligatoire' }} 
                         label="Numéro d'identification de l'animal" 
                         variant="standard" 
-                        disabled={disabled}/>
+                        disabled={disabled}
+                        className={disabled ? 'disabled' : ''}/>
                 </div>
                 <div>
                     <SelectElement 
@@ -67,7 +70,8 @@ export function BreedingPropertiesForm({
                         label="Type d'animal" 
                         variant="standard" 
                         options={animalTypeList}
-                        disabled={disabled}/>
+                        disabled={disabled}
+                        className={disabled ? 'disabled' : ''}/>
                 </div>
                 <div>
                     <SelectElement 
@@ -77,13 +81,15 @@ export function BreedingPropertiesForm({
                         label="Race bovine" 
                         variant="standard" 
                         options={cattleBreedList}
-                        disabled={disabled}/>
+                        disabled={disabled}
+                        className={disabled ? 'disabled' : ''}/>
                 </div>
                 <div>
                     <CheckboxElement
                         name='labelRougeCertified' 
                         label="Label rouge"
-                        disabled={disabled}/>
+                        disabled={disabled}
+                        className={disabled ? 'disabled' : ''}/>
                 </div>
             </div>
         </FormContainer>

diff --git a/frontend/app/src/domains/production/views/beefProduction/forms/CuttingPropertiesForm.tsx b/frontend/app/src/domains/production/views/beefProduction/forms/CuttingPropertiesForm.tsx
@@ -1,9 +1,8 @@
 import React from 'react'
-import { ButtonGroup, Button } from '@mui/material'
-import { FormContainer, DatePickerElement, TextFieldElement, useForm } from 'react-hook-form-mui'
+import { FormContainer, DatePickerElement, TextFieldElement } from 'react-hook-form-mui'
 
-import BeefProduction from "@viandeendirect/api/dist/models/BeefProduction"
 import dayjs from 'dayjs'
+import '../../../../../resources/styles/form.css'
 
 export function CuttingPropertiesForm({
     form: form,
@@ -18,23 +17,26 @@ export function CuttingPropertiesForm({
                     validation={{ required: 'Champ obligatoire' }}
                     label="Date de la découpe" 
                     minDate={minCuttingDate ? dayjs(minCuttingDate) : undefined}
-                    disabled={disabled}/>
+                    disabled={disabled}
+                    className={disabled ? 'disabled' : ''}/>
             </div>
             <div>
                 <TextFieldElement
                     name="cuttingButcher"
                     validation={{ required: 'Champ obligatoire' }}
                     label="Boucherie"
                     variant="standard"
-                    disabled={disabled}/>
+                    disabled={disabled}
+                    className={disabled ? 'disabled' : ''}/>
             </div>
             <div>
                 <TextFieldElement
                     name="cuttingPlace"
                     validation={{ required: 'Champ obligatoire' }}
                     label="Commune de la découpe"
                     variant="standard"
-                    disabled={disabled}/>
+                    disabled={disabled}
+                    className={disabled ? 'disabled' : ''}/>
             </div>
         </div>
     </FormContainer>

diff --git a/frontend/app/src/domains/production/views/beefProduction/forms/SlaughterPropertiesForm.tsx b/frontend/app/src/domains/production/views/beefProduction/forms/SlaughterPropertiesForm.tsx
@@ -3,6 +3,7 @@ import { DatePickerElement, FormContainer, SliderElement, TextFieldElement } fro
 
 import { BeefProductionService } from '../../../service/BeefProductionService.ts'
 import dayjs from 'dayjs'
+import '../../../../../resources/styles/form.css'
 
 export function SlaughterPropertiesForm({
     form: form,
@@ -22,23 +23,26 @@ export function SlaughterPropertiesForm({
                     label="Date de l'abattage" 
                     minDate={minSlaughterDate ? dayjs(minSlaughterDate) : undefined}
                     maxDate={maxSlaughterDate ? dayjs(maxSlaughterDate) : undefined}
-                    disabled={disabled}/>
+                    disabled={disabled}
+                    className={disabled ? 'disabled' : ''}/>
             </div>
             <div>
                 <TextFieldElement
                     name="slaughterHouse"
                     validation={{ required: 'Champ obligatoire' }}
                     label="Abattoir"
                     variant="standard" 
-                    disabled={disabled}/>
+                    disabled={disabled}
+                    className={disabled ? 'disabled' : ''}/>
             </div>
             <div>
                 <TextFieldElement
                     name="slaughterPlace"
                     validation={{ required: 'Champ obligatoire' }}
                     label="Commune d'abattage"
                     variant="standard" 
-                    disabled={disabled}/>
+                    disabled={disabled}
+                    className={disabled ? 'disabled' : ''}/>
             </div>
             <div>
                 <SliderElement
@@ -47,7 +51,8 @@ export function SlaughterPropertiesForm({
                     max={500}
                     step={10} 
                     disabled={disabled}
-                    rules={{ required: 'Champ obligatoire' }}/>
+                    rules={{ required: 'Champ obligatoire' }}
+                    className={disabled ? 'disabled' : ''}/>
                 <div>
                     <span>Poids de l'animal vivant : {BeefProductionService.getLiveWeight(warmCarcassWeight || initialWarmCarcassWeight)} kg</span>
                 </div>

diff --git a/frontend/app/src/resources/styles/form.css b/frontend/app/src/resources/styles/form.css
@@ -0,0 +1,18 @@
+.form {
+    margin-bottom: 0.5rem;
+}
+
+.disabled input {
+    -webkit-text-fill-color: black
+    !important
+}
+
+.disabled div[role="combobox"] {
+    -webkit-text-fill-color: black
+    !important
+}
+
+.disabled + span {
+    -webkit-text-fill-color: black
+    !important
+}