feat: module approval operation

Author: fit2cloudwxx

frontend/packages/web/src/hooks/useApprovalConfig.ts

@@ -8,11 +8,13 @@ import { FilterOption } from 'naive-ui/es/data-table/src/interface';
 export type ApprovalConfigType =
   | FormDesignKeyEnum.CONTRACT
   | FormDesignKeyEnum.INVOICE
+  | FormDesignKeyEnum.CONTRACT_INVOICE
   | FormDesignKeyEnum.OPPORTUNITY_QUOTATION;
 
 const dicApprovalKeyMap: Record<ApprovalConfigType, ReasonTypeEnum> = {
   [FormDesignKeyEnum.CONTRACT]: ReasonTypeEnum.CONTRACT_APPROVAL,
   [FormDesignKeyEnum.INVOICE]: ReasonTypeEnum.INVOICE_APPROVAL,
+  [FormDesignKeyEnum.CONTRACT_INVOICE]: ReasonTypeEnum.INVOICE_APPROVAL,
   [FormDesignKeyEnum.OPPORTUNITY_QUOTATION]: ReasonTypeEnum.QUOTATION_APPROVAL,
 };
 

frontend/packages/web/src/views/contract/contract/components/contractTable.vue

@@ -193,21 +193,6 @@
     checkedRowKeys.value = [];
   }
 
-  const actionConfig: BatchActionConfig = {
-    baseAction: [
-      {
-        label: t('common.exportChecked'),
-        key: 'exportChecked',
-        permission: ['CONTRACT:EXPORT'],
-      },
-      {
-        label: t('common.batchApproval'),
-        key: 'approval',
-        permission: ['CONTRACT:APPROVAL'],
-      },
-    ],
-  };
-
   const showApprovalModal = ref(false);
   const batchOperationName = ref('');
   const batchResult = ref<BatchOperationResult>({
@@ -237,7 +222,7 @@
     }
   }
 
-  function getOperationGroupList(row: ContractItem) {
+  function getEnableApprovalGroupList(row: ContractItem) {
     if (row.approvalStatus === QuotationStatusEnum.APPROVING) {
       return [
         {
@@ -294,6 +279,30 @@
     ];
   }
 
+  function getOperationGroupList(row: ContractItem, dicApprovalEnable: boolean) {
+    return dicApprovalEnable
+      ? getEnableApprovalGroupList(row)
+      : [
+          {
+            label: t('common.edit'),
+            key: 'edit',
+            permission: ['CONTRACT:UPDATE'],
+          },
+          {
+            label: t('contract.payment'),
+            key: 'paymentRecord',
+            permission: ['CONTRACT:PAYMENT'],
+            disabled: !row.amount || row.alreadyPayAmount >= row.amount,
+            tooltipContent: row.alreadyPayAmount >= row.amount ? t('contract.noPaymentRequired') : undefined,
+          },
+          {
+            label: t('common.delete'),
+            key: 'delete',
+            permission: ['CONTRACT:DELETE'],
+          },
+        ];
+  }
+
   const showDetailDrawer = ref(false);
 
   function handleEdit(id: string) {
@@ -413,9 +422,9 @@
       width: currentLocale.value === 'en-US' ? 180 : 150,
       fixed: 'right',
       render: (row: ContractItem) =>
-        getOperationGroupList(row).length
+        getOperationGroupList(row, dicApprovalEnable.value).length
           ? h(CrmOperationButton, {
-              groupList: getOperationGroupList(row),
+              groupList: getOperationGroupList(row, dicApprovalEnable.value),
               onSelect: (key: string) => handleActionSelect(row, key),
             })
           : '-',
@@ -508,6 +517,27 @@
     };
   });
 
+  const actionConfig = computed(() => {
+    return {
+      baseAction: [
+        {
+          label: t('common.exportChecked'),
+          key: 'exportChecked',
+          permission: ['CONTRACT:EXPORT'],
+        },
+        ...(dicApprovalEnable.value
+          ? [
+              {
+                label: t('common.batchApproval'),
+                key: 'approval',
+                permission: ['CONTRACT:APPROVAL'],
+              },
+            ]
+          : []),
+      ],
+    };
+  });
+
   // 表格
   const filterConfigList = computed<FilterFormItem[]>(() => [
     {

frontend/packages/web/src/views/contract/contract/components/detail.vue

@@ -104,6 +104,7 @@
 
   import { approvalContract, deleteContract, revokeContract } from '@/api/modules';
   import { contractStatusOptions } from '@/config/contract';
+  import useApprovalConfig from '@/hooks/useApprovalConfig';
   import useFormCreateApi from '@/hooks/useFormCreateApi';
   import useModal from '@/hooks/useModal';
   import { useUserStore } from '@/store';
@@ -160,7 +161,7 @@
     ].filter((item) => hasAnyPermission(item.permission))
   );
 
-  const buttonList = computed(() => {
+  function getApprovalEnableBtnList() {
     if (detailInfo.value?.approvalStatus === QuotationStatusEnum.APPROVING) {
       return [
         {
@@ -249,7 +250,44 @@
         permission: ['CONTRACT:DELETE'],
       },
     ];
-  });
+  }
+
+  const { initApprovalConfig, dicApprovalEnable } = useApprovalConfig(FormDesignKeyEnum.CONTRACT);
+
+  const buttonList = computed(() =>
+    dicApprovalEnable.value
+      ? getApprovalEnableBtnList()
+      : [
+          {
+            key: 'edit',
+            label: t('common.edit'),
+            permission: ['CONTRACT:UPDATE'],
+            text: false,
+            ghost: true,
+            class: 'n-btn-outline-primary',
+          },
+          {
+            label: t('contract.payment'),
+            key: 'paymentRecord',
+            permission: ['CONTRACT:PAYMENT'],
+            text: false,
+            ghost: true,
+            class: 'n-btn-outline-primary',
+            disabled: !detailInfo.value?.amount || detailInfo.value?.alreadyPayAmount >= detailInfo.value?.amount,
+            tooltipContent:
+              detailInfo.value?.alreadyPayAmount >= detailInfo.value?.amount ? t('contract.noPaymentRequired') : '',
+          },
+          {
+            label: t('common.delete'),
+            key: 'delete',
+            text: false,
+            ghost: true,
+            danger: true,
+            class: 'n-btn-outline-primary',
+            permission: ['CONTRACT:DELETE'],
+          },
+        ]
+  );
 
   function handleInit(type?: CollaborationType, name?: string, detail?: Record<string, any>) {
     title.value = name || '';
@@ -368,4 +406,13 @@
   function showBusinessTitleDetail(params: { id: string }) {
     emit('openBusinessTitleDrawer', params);
   }
+
+  watch(
+    () => visible.value,
+    (val) => {
+      if (val) {
+        initApprovalConfig();
+      }
+    }
+  );
 </script>

frontend/packages/web/src/views/contract/invoice/components/detail.vue

@@ -55,6 +55,7 @@
 
   import { approvalInvoiced, deleteInvoiced, revokeInvoiced } from '@/api/modules';
   import { deleteInvoiceContentMap } from '@/config/contract';
+  import useApprovalConfig from '@/hooks/useApprovalConfig';
   import useModal from '@/hooks/useModal';
   import useUserStore from '@/store/modules/user';
 
@@ -82,8 +83,9 @@
   function handleInit(type?: CollaborationType, name?: string, detail?: Record<string, any>) {
     detailInfo.value = detail;
   }
+  const { initApprovalConfig, dicApprovalEnable } = useApprovalConfig(FormDesignKeyEnum.INVOICE);
 
-  const buttonList = computed(() => {
+  function getApprovalEnableBtnList() {
     if (detailInfo.value?.approvalStatus === ContractInvoiceStatusEnum.APPROVING) {
       return [
         {
@@ -157,7 +159,31 @@
         permission: ['CONTRACT_INVOICE:DELETE'],
       },
     ];
-  });
+  }
+
+  const buttonList = computed(() =>
+    dicApprovalEnable.value
+      ? getApprovalEnableBtnList()
+      : [
+          {
+            key: 'edit',
+            label: t('common.edit'),
+            permission: ['CONTRACT_INVOICE:UPDATE'],
+            text: false,
+            ghost: true,
+            class: 'n-btn-outline-primary',
+          },
+          {
+            label: t('common.delete'),
+            key: 'delete',
+            text: false,
+            ghost: true,
+            danger: true,
+            class: 'n-btn-outline-primary',
+            permission: ['CONTRACT_INVOICE:DELETE'],
+          },
+        ]
+  );
 
   const refreshKey = ref(0);
   function handleSaved() {
@@ -238,4 +264,13 @@
         break;
     }
   }
+
+  watch(
+    () => visible.value,
+    (val) => {
+      if (val) {
+        initApprovalConfig();
+      }
+    }
+  );
 </script>

frontend/packages/web/src/views/contract/invoice/components/invoiceTable.vue

@@ -247,10 +247,7 @@
     }
   }
 
-  function getOperationGroupList(row: ContractInvoiceItem) {
-    if (props.readonly) {
-      return [];
-    }
+  function getApprovalEnableGroupList(row: ContractInvoiceItem) {
     if (row.approvalStatus === ContractInvoiceStatusEnum.APPROVING) {
       return [
         {
@@ -296,6 +293,27 @@
     ];
   }
 
+  function getOperationGroupList(row: ContractInvoiceItem, dicApprovalEnable: boolean) {
+    if (props.readonly) {
+      return [];
+    }
+    if (dicApprovalEnable) {
+      return getApprovalEnableGroupList(row);
+    }
+    return [
+      {
+        label: t('common.edit'),
+        key: 'edit',
+        permission: ['CONTRACT_INVOICE:UPDATE'],
+      },
+      {
+        label: t('common.delete'),
+        key: 'delete',
+        permission: ['CONTRACT_INVOICE:DELETE'],
+      },
+    ];
+  }
+
   const showDetailDrawer = ref(false);
 
   function handleDelete(row: any) {
@@ -383,15 +401,22 @@
     });
   }
 
+  function getOperationWidth(approvalEnable: boolean) {
+    if (approvalEnable) {
+      return currentLocale.value === 'en-US' ? 180 : 150;
+    }
+    return 120;
+  }
+
   const { useTableRes, customFieldsFilterConfig, dicApprovalEnable } = await useFormCreateTable({
     formKey: props.isContractTab ? FormDesignKeyEnum.CONTRACT_INVOICE : FormDesignKeyEnum.INVOICE,
     operationColumn: {
       key: 'operation',
-      width: currentLocale.value === 'en-US' ? 180 : 150,
+      width: computed(() => getOperationWidth(dicApprovalEnable.value)) as unknown as number,
       fixed: 'right',
       render: (row: ContractInvoiceItem) =>
         h(CrmOperationButton, {
-          groupList: getOperationGroupList(row),
+          groupList: getOperationGroupList(row, dicApprovalEnable.value),
           onSelect: (key: string) => handleActionSelect(row, key),
         }),
     },