feat: add disabled submit functionality to OcrDialog and enhance request list handling

src/components/upload-file/OcrDialog.vue

@@ -22,6 +22,7 @@ type Props = {
   autoSave?: boolean;
   data?: Data;
   hideBtn?: boolean;
+  disabledSubmit?: boolean;
 };
 
 type HandleProps = {
@@ -109,6 +110,7 @@ async function change(e: Event) {
     hide-delete
     hide-btn
     edit
+    :disabledSubmit
     :title
     :is-edit
     :readonly

src/pages/08_request-list/DocumentExpansion.vue

@@ -24,6 +24,7 @@ import {
   EmployeePassportPayload,
   EmployeeVisaPayload,
 } from 'stores/employee/types';
+import { canAccess } from 'src/stores/utils';
 
 type Data = {
   id: string;
@@ -50,6 +51,8 @@ defineEmits<{
 }>();
 
 const group = ref('passport');
+const refFormEmployeePassport = ref();
+const refFormEmployeeVisa = ref();
 
 const requestListStore = useRequestList();
 
@@ -474,6 +477,13 @@ function changeCustomerTab(opts: { tab: 'customer' | 'employee' }) {
                   <q-td>
                     <span class="row justify-end no-wrap">
                       <OcrDialog
+                        :disabled-submit="
+                          group === 'passport'
+                            ? !refFormEmployeePassport
+                            : group === 'visa'
+                              ? !refFormEmployeeVisa
+                              : undefined
+                        "
                         @submit="
                           (file, meta) => {
                             $emit(
@@ -500,7 +510,13 @@ function changeCustomerTab(opts: { tab: 'customer' | 'employee' }) {
                       >
                         <template #trigger="{ browse }">
                           <MainButton
-                            v-if="!!state.isEdit"
+                            v-if="
+                              !!state.isEdit &&
+                              (props.row.documentType === 'passport' ||
+                              props.row.documentType === 'visa'
+                                ? canAccess('customer', 'edit')
+                                : true)
+                            "
                             iconOnly
                             icon="mdi-tray-arrow-up"
                             color="var(--positive-bg)"
@@ -513,6 +529,7 @@ function changeCustomerTab(opts: { tab: 'customer' | 'employee' }) {
                         </template>
                         <template #body="{ metadata, isRunning }">
                           <FormEmployeePassport
+                            ref="refFormEmployeePassport"
                             v-if="group === 'passport' && metadata"
                             :title="$t('customerEmployee.form.group.passport')"
                             dense
@@ -545,6 +562,7 @@ function changeCustomerTab(opts: { tab: 'customer' | 'employee' }) {
 
                           <FormEmployeeVisa
                             v-if="group === 'visa' && metadata"
+                            ref="refFormEmployeeVisa"
                             :title="$t('customerEmployee.form.group.visa')"
                             ocr
                             dense

src/pages/08_request-list/TableRequestList.vue

@@ -52,25 +52,38 @@ function responsiblePerson(quotation: QuotationFull) {
     workflowTemplateStepId: string;
   }[] = [];
 
+  const userIds = new Set<string>();
+  const groupKeys = new Set<string>();
+
   for (const v of productServiceList) {
     const tempStep = v.service?.workflow?.step;
 
     if (tempStep) {
       tempStep.forEach((lhs) => {
         for (const rhs of lhs.responsiblePerson) {
-          tempPerson.push(rhs.user);
+          if (!userIds.has(rhs.user.id)) {
+            userIds.add(rhs.user.id);
+            tempPerson.push(rhs.user);
+          }
         }
       });
+
       tempStep.forEach((lhs) => {
         const newGroup = lhs.responsibleGroup as unknown as {
           group: string;
           id: string;
           workflowTemplateStepId: string;
         }[];
+
         for (const rhs of newGroup) {
-          tempGroup.push(rhs);
+          const key = `${rhs.group}-${rhs.id}-${rhs.workflowTemplateStepId}`;
+          if (!groupKeys.has(key)) {
+            groupKeys.add(key);
+            tempGroup.push(rhs);
+          }
         }
       });
+
       return { user: tempPerson, group: tempGroup };
     }
   }