fix: new worker

src/components/02_personnel-management/FormPerson.vue

@@ -293,15 +293,11 @@ watch(
         :readonly="readonly"
         :label="$t('form.birthDate')"
         :disabled-dates="disabledAfterToday"
-        :rules="
+        :rules="[
-          employee
+          (val: string) =>
-            ? []
+            !!val ||
-            : [
+            $t('form.error.selectField', { field: $t('form.birthDate') }),
-                (val: string) =>
+        ]"
-                  !!val ||
-                  $t('form.error.selectField', { field: $t('form.birthDate') }),
-              ]
-        "
       />
 
       <q-input

src/pages/05_quotation/QuotationForm.vue

@@ -161,49 +161,7 @@ const selectedWorker = ref<
     }[];
   })[]
 >([]);
-const selectedWorkerItem = computed(() => {
+const selectedWorkerItem = ref([]);
-  return [
-    ...selectedWorker.value.map((e) => ({
-      foreignRefNo: e.employeePassport
-        ? e.employeePassport[0]?.number || '-'
-        : '-',
-      employeeName:
-        locale.value === Lang.English
-          ? `${e.firstNameEN} ${e.lastNameEN}`
-          : e.firstName
-            ? `${e.firstName} ${e.lastName}`
-            : `${e.firstNameEN} ${e.lastNameEN}`,
-      birthDate: dateFormatJS({ date: e.dateOfBirth }),
-      gender: e.gender,
-      age: calculateAge(e.dateOfBirth),
-      nationality: optionStore.mapOption(e.nationality),
-      documentExpireDate:
-        e.employeePassport !== undefined &&
-        e.employeePassport[0]?.expireDate !== undefined
-          ? dateFormatJS({ date: e.employeePassport[0]?.expireDate })
-          : '-',
-      imgUrl: e.selectedImage
-        ? `${API_BASE_URL}/employee/${e.id}/image/${e.selectedImage}`
-        : '',
-      status: e.status,
-    })),
-
-    ...newWorkerList.value.map((v: any) => ({
-      foreignRefNo: v.passportNo,
-      employeeName:
-        locale.value === Lang.English
-          ? `${v.firstNameEN} ${v.lastNameEN}`
-          : `${v.firstName} ${v.lastName}`,
-      birthDate: dateFormatJS({ date: v.dateOfBirth }),
-      gender: v.gender,
-      age: calculateAge(v.dateOfBirth),
-      nationality: optionStore.mapOption(v.nationality),
-      documentExpireDate: '-',
-      imgUrl: '',
-      status: 'CREATED',
-    })),
-  ];
-});
 const firstCodePayment = ref('');
 const selectedProductGroup = ref('');
 const selectedInstallmentNo = ref<number[]>([]);
@@ -556,7 +514,7 @@ async function convertDataToFormSubmit() {
     ),
   );
 
-  selectedWorker.value.forEach((v, i) => {
+  selectedWorkerItem.value.forEach((v, i) => {
     if (v.attachment !== undefined) {
       v.attachment.forEach((value) => {
         fileItemNewWorker.value.push({
@@ -573,7 +531,7 @@ async function convertDataToFormSubmit() {
 
   quotationFormData.value.worker = JSON.parse(
     JSON.stringify([
-      ...selectedWorker.value.map((v) => {
+      ...selectedWorkerItem.value.map((v) => {
         {
           return v.id;
         }
@@ -806,7 +764,40 @@ function toggleDeleteProduct(index: number) {
 }
 
 async function assignWorkerToSelectedWorker() {
-  selectedWorker.value = quotationFormData.value.worker;
+  selectedWorkerItem.value = quotationFormData.value.worker.map((e) => {
+    return {
+      id: e.id,
+      foreignRefNo: e.employeePassport
+        ? e.employeePassport[0]?.number || '-'
+        : '-',
+      employeeName:
+        locale.value === Lang.English
+          ? `${e.firstNameEN} ${e.lastNameEN}`
+          : `${e.firstName || e.firstNameEN} ${e.lastName || e.lastNameEN}`,
+      birthDate: dateFormatJS({ date: e.dateOfBirth }),
+      gender: e.gender,
+      age: calculateAge(e.dateOfBirth),
+      nationality: optionStore.mapOption(e.nationality),
+      documentExpireDate:
+        e.employeePassport !== undefined &&
+        e.employeePassport[0]?.expireDate !== undefined
+          ? dateFormatJS({ date: e.employeePassport[0]?.expireDate })
+          : '-',
+      imgUrl: e.selectedImage
+        ? `${API_BASE_URL}/employee/${e.id}/image/${e.selectedImage}`
+        : '',
+      employeePassport: e.employeePassport,
+      status: e.status,
+      workerNew: false,
+      lastNameEN: e.lastNameEN,
+      lastName: e.lastName,
+      middleNameEN: e.middleNameEN,
+      middleName: e.middleName,
+      firstNameEN: e.firstNameEN,
+      firstName: e.firstName,
+      namePrefix: e.namePrefix,
+    };
+  });
 }
 
 function convertToTable(nodes: Node[]) {
@@ -865,21 +856,21 @@ function convertToTable(nodes: Node[]) {
 
 function convertEmployeeToTable(selected: Employee[]) {
   productServiceList.value.forEach((v) => {
-    if (selectedWorker.value.length === 0 && v.amount === 1) v.amount -= 1;
+    if (selectedWorkerItem.value.length === 0 && v.amount === 1) v.amount -= 1;
 
     v.amount = Math.max(
-      v.amount + selected.length - selectedWorker.value.length,
+      v.amount + selected.length - selectedWorkerItem.value.length,
       1,
     );
 
     const oldWorkerId: string[] = [];
     const newWorkerIndex: number[] = [];
 
-    selectedWorker.value.forEach((item, i) => {
+    selectedWorkerItem.value.forEach((item, i) => {
       if (v.workerIndex.includes(i)) oldWorkerId.push(item.id);
     });
     selected.forEach((item, i) => {
-      if (selectedWorker.value.find((n) => item.id === n.id)) return;
+      if (selectedWorkerItem.value.find((n) => item.id === n.id)) return;
       newWorkerIndex.push(i);
     });
 
@@ -892,7 +883,7 @@ function convertEmployeeToTable(selected: Employee[]) {
   pageState.employeeModal = false;
   quotationFormData.value.workerMax = Math.max(
     quotationFormData.value.workerMax || 1,
-    selectedWorker.value.length,
+    selectedWorkerItem.value.length,
   );
 }
 
@@ -965,6 +956,71 @@ function viewProductFile(data: ProductRelation) {
   pageState.imageDialogUrl = base64 ? base64[1] : '';
 }
 
+function combineWorker(newWorker: any, oldWorker: any) {
+  selectedWorkerItem.value = [
+    ...oldWorker.map((e) => ({
+      id: e.id,
+      foreignRefNo: e.employeePassport
+        ? e.employeePassport[0]?.number || '-'
+        : '-',
+      employeeName:
+        locale.value === Lang.English
+          ? `${e.firstNameEN} ${e.lastNameEN}`
+          : `${e.firstName || e.firstNameEN} ${e.lastName || e.lastNameEN}`,
+      birthDate: dateFormatJS({ date: e.dateOfBirth }),
+      gender: e.gender,
+      age: calculateAge(e.dateOfBirth),
+      nationality: optionStore.mapOption(e.nationality),
+      documentExpireDate:
+        e.employeePassport !== undefined &&
+        e.employeePassport[0]?.expireDate !== undefined
+          ? dateFormatJS({ date: e.employeePassport[0]?.expireDate })
+          : '-',
+      imgUrl: e.selectedImage
+        ? `${API_BASE_URL}/employee/${e.id}/image/${e.selectedImage}`
+        : '',
+
+      employeePassport: e.employeePassport,
+      status: e.status,
+      workerNew: false,
+      lastNameEN: e.lastNameEN,
+      lastName: e.lastName,
+      middleNameEN: e.middleNameEN,
+      middleName: e.middleName,
+      firstNameEN: e.firstNameEN,
+      firstName: e.firstName,
+      namePrefix: e.namePrefix,
+    })),
+
+    ...newWorker.map((v: any) => ({
+      id: v.id,
+      foreignRefNo: v.passportNo || '-',
+      employeeName:
+        locale.value === Lang.English
+          ? `${v.firstNameEN} ${v.lastNameEN}`
+          : `${v.firstName || v.firstNameEN} ${v.lastName || v.lastNameEN}`,
+      birthDate: dateFormatJS({ date: v.dateOfBirth }),
+      gender: v.gender,
+      age: calculateAge(v.dateOfBirth),
+      nationality: optionStore.mapOption(v.nationality),
+      documentExpireDate: '-',
+      imgUrl: '',
+      status: 'CREATED',
+
+      lastNameEN: v.lastNameEN,
+      lastName: v.lastName,
+      middleNameEN: v.middleNameEN,
+      middleName: v.middleName,
+      firstNameEN: v.firstNameEN,
+      firstName: v.firstName,
+      namePrefix: v.namePrefix,
+
+      dateOfBirth: v.dateOfBirth,
+      workerNew: true,
+    })),
+  ];
+}
+
 const sessionData = ref<Record<string, any>>();
 
 onMounted(async () => {
@@ -1036,7 +1092,7 @@ watch(
   () => quotationFormData.value.customerBranchId,
   async (v) => {
     if (!v) return;
-    selectedWorker.value = [];
+    selectedWorkerItem.value = [];
   },
 );
 
@@ -1116,7 +1172,7 @@ function storeDataLocal() {
           workName: quotationFormData.value.workName,
           dueDate: quotationFormData.value.dueDate,
         },
-        selectedWorker: selectedWorker.value,
+        selectedWorker: selectedWorkerItem.value,
         createdBy: quotationFormState.value.createdBy('tha'),
         agentPrice: agentPrice.value,
       },
@@ -1201,10 +1257,10 @@ async function getWorkerFromCriteria(
   if (!ret) return false; // error, do not close dialog
 
   const deduplicate = ret.result.filter(
-    (a) => !selectedWorker.value.find((b) => a.id === b.id),
+    (a) => !selectedWorkerItem.value.find((b) => a.id === b.id),
   );
 
-  convertEmployeeToTable([...deduplicate, ...selectedWorker.value]);
+  convertEmployeeToTable([...deduplicate, ...selectedWorkerItem.value]);
 
   return true;
 }
@@ -1594,15 +1650,15 @@ function covertToNode() {
                     (v) =>
                       (quotationFormData.workerMax = Math.max(
                         v,
-                        selectedWorker.length,
+                        selectedWorkerItem.length,
                       ))
                   "
                   :employee-amount="
-                    quotationFormData.workerMax || selectedWorker.length
+                    quotationFormData.workerMax || selectedWorkerItem.length
                   "
                   :readonly="readonly"
                   :rows="selectedWorkerItem"
-                  @delete="(i) => deleteItem(selectedWorker, i)"
+                  @delete="(i) => deleteItem(selectedWorkerItem, i)"
                 />
               </div>
             </q-expansion-item>
@@ -1846,7 +1902,7 @@ function covertToNode() {
                             installments: quotationFormData.paySplit,
                           },
                           'quotation-labor': {
-                            name: selectedWorker.map(
+                            name: selectedWorkerItem.map(
                               (v, i) =>
                                 `${i + 1}. ` +
                                 `${v.employeePassport.length !== 0 ? v.employeePassport[0].number + '_' : ''}${v.namePrefix}.${v.firstNameEN ? `${v.firstNameEN} ${v.lastNameEN}` : `${v.firstName} ${v.lastName}`}  `.toUpperCase(),
@@ -2389,13 +2445,12 @@ function covertToNode() {
     <!-- add employee quotation -->
 
     <QuotationFormWorkerSelect
-      :preselect-worker="selectedWorker"
+      :preselect-worker="selectedWorkerItem"
       :customerBranchId="quotationFormData.customerBranchId"
       v-model:open="pageState.employeeModal"
-      v-model:new-worker-list="newWorkerList"
       @success="
         (v) => {
-          selectedWorker = v.worker;
+          combineWorker(v.newWorker, v.worker);
         }
       "
     />
@@ -2438,7 +2493,7 @@ function covertToNode() {
   <!-- add Worker -->
   <QuotationFormWorkerAddDialog
     v-if="quotationFormState.source"
-    :disabled-worker-id="selectedWorker.map((v) => v.id)"
+    :disabled-worker-id="selectedWorkerItem.map((v) => v.id)"
     :product-service-list="quotationFormState.source.productServiceList"
     :quotation-id="quotationFormState.source.id"
     :customer-branch-id="quotationFormState.source.customerBranchId"

src/pages/05_quotation/QuotationFormWorkerSelect.vue

@@ -113,7 +113,7 @@ const props = withDefaults(
   defineProps<{
     customerBranchId?: string;
     disabledWorkerId?: string[];
-    preselectWorker?: Employee[];
+    preselectWorker?: (Employee & { workerNew: boolean })[];
   }>(),
   {},
 );
@@ -133,7 +133,7 @@ const optionStore = useOptionStore();
 const employeeStore = useEmployeeStore();
 
 const open = defineModel<boolean>('open', { default: false });
-const newWorkerList = defineModel<
+const newWorkerList = ref<
   (EmployeeWorker & {
     attachment?: {
       name?: string;
@@ -143,7 +143,7 @@ const newWorkerList = defineModel<
       _meta?: Record<string, any>;
     }[];
   })[]
->('newWorkerList', { default: [] });
+>([]);
 const workerSelected = ref<Employee[]>([]);
 const workerList = ref<Employee[]>([]);
 const importWorkerCriteria = ref<{
@@ -208,7 +208,13 @@ function getEmployeeImageUrl(item: Employee) {
 
 function init() {
   if (props.preselectWorker) {
-    workerSelected.value = JSON.parse(JSON.stringify(props.preselectWorker));
+    workerSelected.value = JSON.parse(
+      JSON.stringify(props.preselectWorker.filter((v) => !v.workerNew)),
+    );
+
+    newWorkerList.value = JSON.parse(
+      JSON.stringify(props.preselectWorker.filter((v) => v.workerNew)),
+    );
   }
   getWorkerList();
 }
@@ -608,11 +614,14 @@ watch(
           solid
           id="btn-success"
           @click="
-            (emits('success', {
+            () => {
-              worker: workerSelected,
+              $emit('success', {
-              newWorker: newWorkerList,
+                worker: workerSelected,
-            }),
+                newWorker: newWorkerList,
-            (open = false))
+              });
+
+              open = false;
+            }
           "
         >
           {{ $t('general.select', { msg: $t('quotation.employeeList') }) }}
@@ -634,9 +643,11 @@ watch(
         if (employeeFormState.currentTab === 'personalInfo') {
           const currentEmployeeId =
             await employeeFormStore.submitPersonal(onCreateImageList);
-          quotationForm.injectNewEmployee({
+          newWorkerList.push(
-            data: { ...currentFromDataEmployee, id: currentEmployeeId },
+            quotationForm.injectNewEmployee({
-          });
+              data: { ...currentFromDataEmployee, id: currentEmployeeId },
+            }),
+          );
           employeeFormState.isEmployeeEdit = false;
           employeeFormState.dialogType = 'info';
         }

src/pages/05_quotation/form.ts

@@ -69,6 +69,7 @@ export const useQuotationForm = defineStore('form-quotation', () => {
         file?: File;
         _meta?: Record<string, any>;
       }[];
+      workerNew: boolean;
     })[]
   >([]);
 
@@ -220,7 +221,7 @@ export const useQuotationForm = defineStore('form-quotation', () => {
     },
     callback?: () => void,
   ) {
-    newWorkerList.value.push({
+    const temp = {
       //passportNo: obj.data.passportNo,
       //documentExpireDate: obj.data.documentExpireDate,
       id: obj.data.id,
@@ -235,9 +236,12 @@ export const useQuotationForm = defineStore('form-quotation', () => {
       gender: obj.data.gender,
       dateOfBirth: obj.data.dateOfBirth,
       attachment: obj.data.attachment,
-    });
+      workerNew: true,
+    };
 
     callback?.();
+
+    return temp;
   }
 
   function dialogDelete(callback: () => void) {

src/pages/12_debit-note/FormPage.vue

@@ -209,47 +209,7 @@ const selectedWorker = ref<
     }[];
   })[]
 >([]);
-const selectedWorkerItem = computed(() => {
+const selectedWorkerItem = ref([]);
-  return [
-    ...selectedWorker.value.map((e) => ({
-      foreignRefNo: e.employeePassport
-        ? e.employeePassport[0]?.number || '-'
-        : '-',
-      employeeName:
-        locale.value === Lang.English
-          ? `${e.firstNameEN} ${e.lastNameEN}`
-          : `${e.firstName || e.firstNameEN} ${e.lastName || e.lastNameEN}`,
-      birthDate: dateFormatJS({ date: e.dateOfBirth }),
-      gender: e.gender,
-      age: calculateAge(e.dateOfBirth),
-      nationality: optionStore.mapOption(e.nationality),
-      documentExpireDate:
-        e.employeePassport !== undefined &&
-        e.employeePassport[0]?.expireDate !== undefined
-          ? dateFormatJS({ date: e.employeePassport[0]?.expireDate })
-          : '-',
-      imgUrl: e.selectedImage
-        ? `${API_BASE_URL}/employee/${e.id}/image/${e.selectedImage}`
-        : '',
-      status: e.status,
-    })),
-
-    ...newWorkerList.value.map((v: any) => ({
-      foreignRefNo: v.passportNo || '-',
-      employeeName:
-        locale.value === Lang.English
-          ? `${v.firstNameEN} ${v.lastNameEN}`
-          : `${v.firstName || v.firstNameEN} ${v.lastName || v.lastNameEN}`,
-      birthDate: dateFormatJS({ date: v.dateOfBirth }),
-      gender: v.gender,
-      age: calculateAge(v.dateOfBirth),
-      nationality: optionStore.mapOption(v.nationality),
-      documentExpireDate: '-',
-      imgUrl: '',
-      status: 'CREATED',
-    })),
-  ];
-});
 
 const selectedInstallmentNo = ref<number[]>([]);
 const installmentAmount = ref<number>(0);
@@ -374,7 +334,39 @@ function assignProductServiceList() {
 
 function assignSelectedWorker() {
   if (debitNoteData.value)
-    selectedWorker.value = debitNoteData.value.worker.map((v) => v.employee);
+    selectedWorkerItem.value = debitNoteData.value.worker.map((e) => {
+      return {
+        id: e.employee.id,
+        foreignRefNo: e.employee.employeePassport
+          ? e.employee.employeePassport[0]?.number || '-'
+          : '-',
+        employeeName:
+          locale.value === Lang.English
+            ? `${e.employee.firstNameEN} ${e.employee.lastNameEN}`
+            : `${e.employee.firstName || e.employee.firstNameEN} ${e.employee.lastName || e.employee.lastNameEN}`,
+        birthDate: dateFormatJS({ date: e.employee.dateOfBirth }),
+        gender: e.employee.gender,
+        age: calculateAge(e.employee.dateOfBirth),
+        nationality: optionStore.mapOption(e.employee.nationality),
+        documentExpireDate:
+          e.employee.employeePassport !== undefined &&
+          e.employee.employeePassport[0]?.expireDate !== undefined
+            ? dateFormatJS({ date: e.employee.employeePassport[0]?.expireDate })
+            : '-',
+        imgUrl: e.employee.selectedImage
+          ? `${API_BASE_URL}/employee/${e.id}/image/${e.employee.selectedImage}`
+          : '',
+        status: e.employee.status,
+        workerNew: false,
+        lastNameEN: e.employee.lastNameEN,
+        lastName: e.employee.lastName,
+        middleNameEN: e.employee.middleNameEN,
+        middleName: e.employee.middleName,
+        firstNameEN: e.employee.firstNameEN,
+        firstName: e.employee.firstName,
+        namePrefix: e.employee.namePrefix,
+      };
+    });
 }
 
 async function assignFormData(id: string) {
@@ -540,8 +532,6 @@ function getPrice(
 ) {
   if (filterHook) list = list.filter(filterHook);
 
-  console.log(list);
-
   return list.reduce(
     (a, c) => {
       if (
@@ -815,15 +805,11 @@ async function submit() {
 
     worker: JSON.parse(
       JSON.stringify([
-        ...selectedWorker.value.map((v) => {
+        ...selectedWorkerItem.value.map((v) => {
           {
             return v.id;
           }
         }),
-        ...newWorkerList.value.map((v) => {
-          const { attachment, ...payload } = v;
-          return pageState.mode === 'edit' ? payload.id : payload;
-        }),
       ]),
     ),
     dueDate: currentFormData.value.dueDate,
@@ -902,7 +888,7 @@ function storeDataLocal() {
           dueDate: currentFormData.value.dueDate,
         },
         productServicelist: productService.value,
-        selectedWorker: selectedWorker.value,
+        selectedWorker: selectedWorkerItem.value,
         createdBy: getName(),
       },
     }),
@@ -927,6 +913,69 @@ function closeAble() {
   return window.opener !== null;
 }
 
+function combineWorker(newWorker: any, oldWorker: any) {
+  selectedWorkerItem.value = [
+    ...oldWorker.map((e) => ({
+      id: e.id,
+      foreignRefNo: e.employeePassport
+        ? e.employeePassport[0]?.number || '-'
+        : '-',
+      employeeName:
+        locale.value === Lang.English
+          ? `${e.firstNameEN} ${e.lastNameEN}`
+          : `${e.firstName || e.firstNameEN} ${e.lastName || e.lastNameEN}`,
+      birthDate: dateFormatJS({ date: e.dateOfBirth }),
+      gender: e.gender,
+      age: calculateAge(e.dateOfBirth),
+      nationality: optionStore.mapOption(e.nationality),
+      documentExpireDate:
+        e.employeePassport !== undefined &&
+        e.employeePassport[0]?.expireDate !== undefined
+          ? dateFormatJS({ date: e.employeePassport[0]?.expireDate })
+          : '-',
+      imgUrl: e.selectedImage
+        ? `${API_BASE_URL}/employee/${e.id}/image/${e.selectedImage}`
+        : '',
+      status: e.status,
+      workerNew: false,
+      lastNameEN: e.lastNameEN,
+      lastName: e.lastName,
+      middleNameEN: e.middleNameEN,
+      middleName: e.middleName,
+      firstNameEN: e.firstNameEN,
+      firstName: e.firstName,
+      namePrefix: e.namePrefix,
+    })),
+
+    ...newWorker.map((v: any) => ({
+      id: v.id,
+      foreignRefNo: v.passportNo || '-',
+      employeeName:
+        locale.value === Lang.English
+          ? `${v.firstNameEN} ${v.lastNameEN}`
+          : `${v.firstName || v.firstNameEN} ${v.lastName || v.lastNameEN}`,
+      birthDate: dateFormatJS({ date: v.dateOfBirth }),
+      gender: v.gender,
+      age: calculateAge(v.dateOfBirth),
+      nationality: optionStore.mapOption(v.nationality),
+      documentExpireDate: '-',
+      imgUrl: '',
+      status: 'CREATED',
+
+      lastNameEN: v.lastNameEN,
+      lastName: v.lastName,
+      middleNameEN: v.middleNameEN,
+      middleName: v.middleName,
+      firstNameEN: v.firstNameEN,
+      firstName: v.firstName,
+      namePrefix: v.namePrefix,
+
+      dateOfBirth: v.dateOfBirth,
+      workerNew: true,
+    })),
+  ];
+}
+
 watch(
   () => pageState.mode,
   () => toggleMode(pageState.mode),
@@ -1111,7 +1160,7 @@ async function submitAccepted() {
             "
             :row-worker="selectedWorkerItem"
             @add-worker="() => (pageState.employeeModal = true)"
-            @delete="(i) => deleteItem(selectedWorker, i)"
+            @delete="(i) => deleteItem(selectedWorkerItem, i)"
           />
 
           <!-- #TODO add  openProductDialog at @add-product-->
@@ -1376,13 +1425,12 @@ async function submitAccepted() {
   <!-- add employee quotation -->
 
   <QuotationFormWorkerSelect
-    :preselect-worker="selectedWorker"
+    :preselect-worker="selectedWorkerItem"
     :customerBranchId="quotationData?.customerBranchId"
     v-model:open="pageState.employeeModal"
-    v-model:new-worker-list="newWorkerList"
     @success="
       (v) => {
-        selectedWorker = v.worker;
+        combineWorker(v.newWorker, v.worker);
       }
     "
   />