feat: refs #5919 workerlocker

src/components/FormModel.vue

@@ -160,7 +160,7 @@ async function fetch() {
             params: { filter: JSON.stringify($props.filter) },
         });
 
-        if (Array.isArray(data)) data = data[0];
+        if (Array.isArray(data)) data = data[0] ?? {};
 
         state.set($props.model, data);
         originalData.value = data && JSON.parse(JSON.stringify(data));

src/pages/Worker/Card/WorkerLocker.vue

@@ -1,22 +1,31 @@
 <script setup>
-import { ref } from 'vue';
+import { ref, computed } from 'vue';
 import { useRoute } from 'vue-router';
 import { useI18n } from 'vue-i18n';
+import axios from 'axios';
+import { useRole } from 'src/composables/useRole';
 import FormModel from 'components/FormModel.vue';
-import FetchData from 'src/components/FetchData.vue';
 import VnSelect from 'src/components/common/VnSelect.vue';
+import { useArrayData } from 'src/composables/useArrayData';
+import FetchData from 'components/FetchData.vue';
 
-const route = useRoute();
+const { hasAny } = useRole();
 const { t } = useI18n();
 const fetchData = ref();
 const lockers = ref([]);
-const filter = ref({ where: {} });
+const { store } = useArrayData('Worker');
+const entityId = computed(() => useRoute().params.id);
+const filter = computed(() => ({
+    where: {
+        gender: store.data?.sex,
+        or: [{ workerFk: null }, { workerFk: entityId.value }],
+    },
+}));
 
-const getLockers = async (workerLocker) => {
-    console.log(workerLocker);
-    filter.value.where.gender = workerLocker.sex;
-    await fetchData.value.fetch();
-};
+const canEdit = () => hasAny(['productionBoss', 'hr']);
+
+const save = async (data) =>
+    await axios.patch(`Lockers/${data.id}`, { workerFk: entityId.value });
 </script>
 <template>
     <FetchData
@@ -26,20 +35,21 @@ const getLockers = async (workerLocker) => {
         @on-fetch="(data) => (lockers = data)"
     />
     <FormModel
-        :url="`Workers/locker`"
-        model="Worker"
-        :filter="{ where: { id: route.params.id } }"
-        @on-fetch="getLockers"
+        :url="`Workers/${entityId}/locker`"
+        model="worker"
         auto-load
+        :save-fn="save"
+        @on-fetch="() => canEdit() && fetchData.fetch()"
     >
         <template #form="{ data }">
             <VnSelect
                 :label="t('Locker')"
-                v-model="data.locker"
+                v-model="data.id"
                 :options="lockers"
                 option-label="code"
                 option-value="id"
                 hide-selected
+                :readonly="!canEdit()"
             />
         </template>
     </FormModel>