fix: refs #7986 front fixed

src/i18n/locale/en.yml

@@ -851,7 +851,7 @@ worker:
         volumeLimit: Volume limit
         sizeLimit: Size limit
         isOnReservationMode: Reservation mode
-        Machine: Machine
+        machine: Machine
 wagon:
     pageTitles:
         wagons: Wagons

src/i18n/locale/es.yml

@@ -849,7 +849,7 @@ worker:
         volumeLimit: Volumen límite
         sizeLimit: Tamaño límite
         isOnReservationMode: Modo de reserva
-        Machine: Máquina
+        machine: Máquina
 
 wagon:
     pageTitles:

src/pages/Worker/Card/WorkerOperator.vue

@@ -1,16 +1,19 @@
 <script setup>
 import { useI18n } from 'vue-i18n';
 import { useRoute } from 'vue-router';
-import { ref, computed } from 'vue';
+import { ref, computed, watch } from 'vue';
 import FetchData from 'components/FetchData.vue';
 import FormModelPopup from 'src/components/FormModelPopup.vue';
 import VnPaginate from 'src/components/ui/VnPaginate.vue';
 import VnRow from 'components/ui/VnRow.vue';
 import VnSelect from 'src/components/common/VnSelect.vue';
 import VnInput from 'src/components/common/VnInput.vue';
+import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
+import FormModel from 'components/FormModel.vue';
 
 const { t } = useI18n();
-const paginate = ref();
+
+const formModelRef = ref();
 const dialog = ref();
 const route = useRoute();
 const routeId = computed(() => route.params.id);
@@ -31,17 +34,17 @@ const initialData = computed(() => {
         machineFk: null,
     };
 });
+watch(
+    () => route.params.id,
+    () => formModelRef.value.reset()
+);
 </script>
 
 <template>
     <QPage class="column items-center q-pa-md centerCard">
+        <FetchData url="Trains" @on-fetch="(data) => (trainsData = data)" auto-load />
         <FetchData
-            url="Shelvings/Train"
-            @on-fetch="(data) => (trainsData = data)"
-            auto-load
-        />
-        <FetchData
-            url="Items/ItemPackingType"
+            url="ItemPackingTypes"
             @on-fetch="(data) => (ItemPackingTypesData = data)"
             auto-load
         />
@@ -50,18 +53,14 @@ const initialData = computed(() => {
             @on-fetch="(data) => (warehousesData = data)"
             auto-load
         />
-        <FetchData
-            url="Shelvings/Sector"
-            @on-fetch="(data) => (shelvingsData = data)"
-            auto-load
-        />
+        <FetchData url="Sectors" @on-fetch="(data) => (shelvingsData = data)" auto-load />
         <FetchData url="Machines" @on-fetch="(data) => (machinesData = data)" auto-load />
-        <VnPaginate
-            ref="paginate"
-            data-key="WorkerOperator"
+
+        <FormModel
+            ref="formModelRef"
+            :form-initial-data="initialData"
             url="Operators"
             :filter="{ where: { workerFk: routeId } }"
-            order="id"
             auto-load
         >
             <template #body="{ rows }">
@@ -75,8 +74,7 @@ const initialData = computed(() => {
                     <VnRow>
                         <VnInput
                             :label="t('worker.operator.numberOfWagons')"
-                            :model-value="data?.numberOfWagons"
-                            disable
+                            :model-value="row?.numberOfWagons"
                         />
                         <VnSelect
                             :label="t('worker.operator.train')"
@@ -84,7 +82,7 @@ const initialData = computed(() => {
                             hide-selected
                             option-label="name"
                             option-value="id"
-                            v-model="data.trainFk"
+                            v-model="row.trainFk"
                         />
                     </VnRow>
                     <VnRow>
@@ -94,7 +92,7 @@ const initialData = computed(() => {
                             hide-selected
                             option-label="code"
                             option-value="code"
-                            v-model="data.itemPackingTypeFk"
+                            v-model="row.itemPackingTypeFk"
                         />
                         <VnSelect
                             :label="t('worker.operator.warehouse')"
@@ -102,7 +100,7 @@ const initialData = computed(() => {
                             hide-selected
                             option-label="name"
                             option-value="id"
-                            v-model="data.warehouseFk"
+                            v-model="row.warehouseFk"
                         />
                     </VnRow>
                     <VnRow>
@@ -112,31 +110,36 @@ const initialData = computed(() => {
                             hide-selected
                             option-label="description"
                             option-value="id"
-                            v-model="data.sectorFk"
+                            v-model="row.sectorFk"
                         />
                         <VnInput
                             :label="t('worker.operator.labeler')"
-                            :model-value="data?.labelerFk"
+                            :model-value="row.labelerFk"
+                            lazy-rules
                         />
                     </VnRow>
                     <VnRow>
                         <VnInput
                             :label="t('worker.operator.linesLimit')"
-                            :model-value="data?.linesLimit"
+                            :model-value="row.linesLimit"
+                            lazy-rules
                         />
                         <VnInput
                             :label="t('worker.operator.volumeLimit')"
-                            :model-value="data?.volumeLimit"
+                            :model-value="row.volumeLimit"
+                            lazy-rules
                         />
                     </VnRow>
                     <VnRow>
                         <VnInput
                             :label="t('worker.operator.sizeLimit')"
-                            :model-value="data?.sizeLimit"
+                            :model-value="row.sizeLimit"
+                            lazy-rules
                         />
                         <VnInput
                             :label="t('worker.operator.isOnReservationMode')"
-                            :model-value="data?.isOnReservationMode"
+                            :model-value="row.isOnReservationMode"
+                            lazy-rules
                         />
                     </VnRow>
                     <VnRow>
@@ -146,7 +149,7 @@ const initialData = computed(() => {
                             hide-selected
                             option-label="plate"
                             option-value="id"
-                            v-model="data.machineFk"
+                            v-model="row.machineFk"
                         />
                     </VnRow>
                     <!-- <QBtn
@@ -168,7 +171,7 @@ const initialData = computed(() => {
                         </QBtn>-->
                 </QCard>
             </template>
-        </VnPaginate>
+        </FormModel>
         <QPageSticky :offset="[18, 18]">
             <QBtn @click.stop="dialog.show()" color="primary" fab icon="add" shortcut="+">
                 <QDialog ref="dialog">
@@ -183,8 +186,7 @@ const initialData = computed(() => {
                             <VnRow>
                                 <VnInput
                                     :label="t('worker.operator.numberOfWagons')"
-                                    :model-value="row?.numberOfWagons"
-                                    disable
+                                    :model-value="data.numberOfWagons"
                                 />
                                 <VnSelect
                                     :label="t('worker.operator.train')"