From 2060e76da93055864e49cc328ed938db387af047 Mon Sep 17 00:00:00 2001
From: gaoyunqi <gaoyunqi@gdyd.com>
Date: Tue, 23 Apr 2024 20:35:49 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E8=A1=A5=E5=85=85=E6=B5=81=E7=A8=8B?=
 =?UTF-8?q?=E7=9A=84=E5=AE=8C=E7=BB=93=E5=8A=9F=E8=83=BD=EF=BC=8C=E6=B5=81?=
 =?UTF-8?q?=E7=A8=8B=E9=A1=B5=E9=9D=A2=E7=9A=84=E6=8C=89=E9=92=AE=E8=AF=BB?=
 =?UTF-8?q?=E5=8F=96=E6=9D=83=E9=99=90=E6=8E=A7=E5=88=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/secondDev/approveFlowPage.vue | 508 +++++++++++++-----------
 1 file changed, 270 insertions(+), 238 deletions(-)

diff --git a/src/views/secondDev/approveFlowPage.vue b/src/views/secondDev/approveFlowPage.vue
index c37a97b..de545e7 100644
--- a/src/views/secondDev/approveFlowPage.vue
+++ b/src/views/secondDev/approveFlowPage.vue
@@ -9,13 +9,13 @@
                         </slot>
                         关闭
                     </a-button>
-                    <a-button v-if="!readonly" type="primary" @click="onApproveClick">
+                    <a-button v-if="!readonly && hasBtnApprove" type="primary" @click="onApproveClick">
                         <slot name="icon">
                             <check-circle-outlined />
                         </slot>
                         同意
                     </a-button>
-                    <a-button v-if="!readonly" @click="onDenyClick">
+                    <a-button v-if="!readonly && hasBtnReject" @click="onDenyClick">
                         <slot name="icon">
                             <stop-outlined />
                         </slot>
@@ -24,7 +24,7 @@
                     <a-dropdown>
                         <template #overlay>
                             <a-menu @click="onMoreClick">
-                                <a-menu-item v-if="!readonly" key="terminate">终止</a-menu-item>
+                                <a-menu-item v-if="!readonly && hasBtnFinish" key="finish">终止</a-menu-item>
                                 <a-menu-item v-if="!readonly" key="transfer">转办</a-menu-item>
                                 <a-menu-item key="flowchart">查看流程图</a-menu-item>
                             </a-menu>
@@ -36,13 +36,20 @@
                     </a-dropdown>
                 </a-space>
             </div>
-            <FormInformation :key="renderKey" ref="formInformation" :disabled="readonly"
-                :formAssignmentData="data.formAssignmentData" :formInfos="data.formInfos" :opinions="data.opinions"
-                :opinionsComponents="data.opinionsComponents" @get-form-configs="(config) => (formConfigs = config)" />
+            <FormInformation
+                :key="renderKey"
+                ref="formInformation"
+                :disabled="readonly"
+                :formAssignmentData="data.formAssignmentData"
+                :formInfos="data.formInfos"
+                :opinions="data.opinions"
+                :opinionsComponents="data.opinionsComponents"
+                @get-form-configs="(config) => (formConfigs = config)"
+            />
             <Title :font-size="18" default-value="流转信息"></Title>
             <flow-history :items="getTaskRecords()"></flow-history>
             <opinion-dialog ref="opinionDlg" />
-            <a-modal :visible="showFlowChart" centered class="geg" title="流程图" width="1200px" :closable="false">
+            <a-modal :closable="false" :visible="showFlowChart" centered class="geg" title="流程图" width="1200px">
                 <process-information :process-id="processId" :xml="data.xml" />
                 <template #footer>
                     <a-button type="primary" @click="closeFlowChart">关闭</a-button>
@@ -53,250 +60,275 @@
 </template>
 
 <script setup>
-import { useRouter } from 'vue-router';
-import { onMounted, reactive, ref, unref } from 'vue';
-import FormInformation from '/@/views/secondDev/FormInformation.vue';
-import userTaskItem from '/@/views/workflow/task/hooks/userTaskItem';
-import { getApprovalProcess, postApproval, postGetNextTaskMaybeArrival } from '/@/api/workflow/task';
-import { ApproveCode, ApproveType } from '/@/enums/workflowEnum';
-import { CheckCircleOutlined, StopOutlined, CloseOutlined, DownOutlined } from '@ant-design/icons-vue';
-import OpinionDialog from '/@/components/SecondDev/OpinionDialog.vue';
-import { separator } from '/@bpmn/config/info';
-import { useMultipleTabStore } from '/@/store/modules/multipleTab';
-import Title from '/@/components/Title/src/Title.vue';
-import FlowHistory from '/@/components/SecondDev/FlowHistory.vue';
-import { message } from 'ant-design-vue';
-import useEventBus from '/@/hooks/event/useEventBus';
-import ProcessInformation from '/@/views/workflow/task/components/flow/ProcessInformation.vue';
+    import { useRouter } from 'vue-router';
+    import { onMounted, reactive, ref, unref } from 'vue';
+    import FormInformation from '/@/views/secondDev/FormInformation.vue';
+    import userTaskItem from '/@/views/workflow/task/hooks/userTaskItem';
+    import { getApprovalProcess, postApproval, postGetNextTaskMaybeArrival } from '/@/api/workflow/task';
+    import { ApproveCode, ApproveType } from '/@/enums/workflowEnum';
+    import { CheckCircleOutlined, StopOutlined, CloseOutlined, DownOutlined } from '@ant-design/icons-vue';
+    import OpinionDialog from '/@/components/SecondDev/OpinionDialog.vue';
+    import { separator } from '/@bpmn/config/info';
+    import { useMultipleTabStore } from '/@/store/modules/multipleTab';
+    import Title from '/@/components/Title/src/Title.vue';
+    import FlowHistory from '/@/components/SecondDev/FlowHistory.vue';
+    import { message } from 'ant-design-vue';
+    import useEventBus from '/@/hooks/event/useEventBus';
+    import ProcessInformation from '/@/views/workflow/task/components/flow/ProcessInformation.vue';
 
-const { data, approveUserData, initProcessData, notificationError, notificationSuccess } = userTaskItem();
-const { bus, FLOW_PROCESSED } = useEventBus();
+    const { data, approveUserData, initProcessData, notificationError, notificationSuccess } = userTaskItem();
+    const { bus, FLOW_PROCESSED } = useEventBus();
 
-const tabStore = useMultipleTabStore();
-const router = useRouter();
-const currentRoute = router.currentRoute.value;
-const parentRoutePath = localStorage.getItem('parentRoutePath');
-localStorage.removeItem('parentRoutePath');
-const fullPath = currentRoute.fullPath;
-const rQuery = currentRoute.query;
-const rParams = currentRoute.params;
-const schemaId = ref(rParams.arg1);
-const taskId = ref(rQuery.taskId);
-const processId = ref(rParams.arg2);
-const readonly = ref(!!rQuery.readonly); // 查看流程会触发只读模式
-const renderKey = ref('');
-const formConfigs = ref();
-const opinionDlg = ref();
-const validateSuccess = ref(false);
-const formInformation = ref();
-const showFlowChart = ref(false);
+    const tabStore = useMultipleTabStore();
+    const router = useRouter();
+    const currentRoute = router.currentRoute.value;
+    const parentRoutePath = localStorage.getItem('parentRoutePath');
+    localStorage.removeItem('parentRoutePath');
+    const fullPath = currentRoute.fullPath;
+    const rQuery = currentRoute.query;
+    const rParams = currentRoute.params;
+    const schemaId = ref(rParams.arg1);
+    const taskId = ref(rQuery.taskId);
+    const processId = ref(rParams.arg2);
+    const readonly = ref(!!rQuery.readonly); // 查看流程会触发只读模式
+    const renderKey = ref('');
+    const formConfigs = ref();
+    const opinionDlg = ref();
+    const validateSuccess = ref(false);
+    const formInformation = ref();
+    const showFlowChart = ref(false);
+    const hasBtnApprove = ref(true);
+    const hasBtnReject = ref(false);
+    const hasBtnFinish = ref(false);
 
-let approvalData = reactive({
-    isCountersign: false,
-    isAddOrSubSign: false,
-    stampInfo: {
-        stampId: '',
-        password: ''
-    },
-    buttonConfigs: [],
-    approvedType: ApproveType.AGREE,
-    approvedResult: ApproveCode.AGREE,
-    approvedContent: '',
-    rejectNodeActivityId: '',
-    rejectNodeActivityIds: [],
-    circulateConfigs: [],
-    nextTaskUser: {} // 格式为taskKey: 用户id（逗号分隔）
-});
-let approvedType = ref(ApproveType.AGREE);
-
-function onMoreClick(e) {
-    if (e.key === "flowchart") {
-        openFlowChart()
-    }
-}
-
-function closeFlowChart() {
-    showFlowChart.value = false;
-}
-
-function openFlowChart() {
-    showFlowChart.value = true;
-}
-
-function close() {
-    tabStore.closeTab(currentRoute, router, parentRoutePath);
-}
-
-async function onApproveClick() {
-    await submit();
-    const params = await getApproveParams();
-    const nextNodes = await postGetNextTaskMaybeArrival(params);
-    approvalData.approvedType = ApproveType.AGREE;
-    approvalData.approvedResult = ApproveCode.AGREE;
-    opinionDlg.value.toggleDialog({
-        action: 'agree',
-        nextNodes,
-        callback: (args) => {
-            approvalData.approvedContent = args.opinion;
-            approvalData.nextTaskUser = args.nextTaskUser;
-            onFinish('approve');
-        }
+    let approvalData = reactive({
+        isCountersign: false,
+        isAddOrSubSign: false,
+        stampInfo: {
+            stampId: '',
+            password: ''
+        },
+        buttonConfigs: [],
+        approvedType: ApproveType.AGREE,
+        approvedResult: ApproveCode.AGREE,
+        approvedContent: '',
+        rejectNodeActivityId: '',
+        rejectNodeActivityIds: [],
+        circulateConfigs: [],
+        nextTaskUser: {} // 格式为taskKey: 用户id（逗号分隔）
     });
-}
+    let approvedType = ref(ApproveType.AGREE);
 
-async function onDenyClick() {
-    approvalData.approvedType = ApproveType.REJECT;
-    approvalData.approvedResult = ApproveCode.REJECT;
-    opinionDlg.value.toggleDialog({
-        action: 'reject',
-        processId: processId.value,
-        taskId: taskId.value,
-        callback: (args) => {
-            approvalData.approvedContent = args.opinion;
-            approvalData.rejectNodeActivityId = args.rejectNodeId;
-            approvalData.nextTaskUser = args.nextTaskUser;
-            onFinish('reject');
+    function onMoreClick(e) {
+        const key = e.key;
+        if (key === 'flowchart') {
+            openFlowChart();
+        } else if(key === 'finish'){
+            onFinishClick();
         }
-    });
-}
-
-function flowSuccess() {
-    opinionDlg.value.toggleDialog({
-        isClose: true
-    });
-    message.success('操作成功');
-    setTimeout(() => {
-        bus.emit(FLOW_PROCESSED);
-        close();
-    }, 500);
-}
-
-function flowFail() {
-    opinionDlg.value.stopLoading();
-}
-
-function reset() {
-    approvalData.isAddOrSubSign = false;
-    approvalData.stampInfo = {
-        stampId: '',
-        password: ''
-    };
-    approvalData.buttonConfigs = [];
-    approvalData.approvedType = ApproveType.AGREE;
-    approvalData.approvedContent = '';
-    approvalData.rejectNodeActivityId = '';
-    approvalData.rejectNodeActivityIds = [];
-    approvalData.circulateConfigs = [];
-}
-
-function getTaskRecords() {
-    if (data?.taskApproveOpinions?.length) {
-        return data.taskApproveOpinions || [];
     }
-}
 
-onMounted(async () => {
-    try {
-        let res = await getApprovalProcess(unref(taskId), unref(processId));
-        initProcessData(res);
-        const title = res?.schemaInfo?.name;
-        if (title) {
-            const tabPrefix = readonly.value ? '查看' : '审批';
-            tabStore.changeTitle(fullPath, `${tabPrefix}：${title}`);
-        }
-        if (!readonly.value) {
-            if (res.buttonConfigs) {
-                approvalData.buttonConfigs = res.buttonConfigs;
-            }
-            if (res.relationTasks) {
-                data.predecessorTasks = res.relationTasks;
-            }
-            if (res.isAddOrSubSign) {
-                approvalData.isAddOrSubSign = res.isAddOrSubSign;
-            }
-
-            approvalData.approvedType = ApproveType.AGREE;
-            approvedType.value = ApproveType.AGREE;
-            approvalData.approvedContent = '';
-            approvalData.rejectNodeActivityId = '';
-            approvalData.rejectNodeActivityIds = [];
-            approvalData.circulateConfigs = [];
-        }
-        renderKey.value = Math.random() + '';
-    } catch (error) { }
-});
-
-async function submit() {
-    data.submitLoading = true;
-    validateSuccess.value = false;
-    try {
-        let validateForms = await formInformation.value.validateForm();
-        if (validateForms.length > 0) {
-            let successValidate = validateForms.filter((ele) => {
-                return ele.validate;
-            });
-            if (successValidate.length == validateForms.length) {
-                validateSuccess.value = true;
-                data.submitLoading = false;
-            } else {
-                data.submitLoading = false;
-                notificationError(t('审批流程'), t('表单校验未通过'));
-            }
-        }
-    } catch (error) {
-        data.submitLoading = false;
-        notificationError(t('审批流程'), t('审批流程失败'));
+    function closeFlowChart() {
+        showFlowChart.value = false;
     }
-}
 
-function getUploadFileFolderIds(formModels) {
-    let fileFolderIds = [];
-    let uploadComponentIds = formInformation.value.getUploadComponentIds();
-    uploadComponentIds.forEach((ids) => {
-        if (ids.includes(separator)) {
-            let arr = ids.split(separator);
-            if (arr.length == 2 && formModels[arr[0]][arr[1]]) {
-                fileFolderIds.push(formModels[arr[0]][arr[1]]);
-            } else if (arr.length == 3 && formModels[arr[0]][arr[1]] && Array.isArray(formModels[arr[0]][arr[1]])) {
-                formModels[arr[0]][arr[1]].forEach((o) => {
-                    fileFolderIds.push(o[arr[2]]);
+    function openFlowChart() {
+        showFlowChart.value = true;
+    }
+
+    function close() {
+        tabStore.closeTab(currentRoute, router, parentRoutePath);
+    }
+
+    async function onApproveClick() {
+        await submit();
+        const params = await getApproveParams();
+        const nextNodes = await postGetNextTaskMaybeArrival(params);
+        approvalData.approvedType = ApproveType.AGREE;
+        approvalData.approvedResult = ApproveCode.AGREE;
+        opinionDlg.value.toggleDialog({
+            action: 'agree',
+            nextNodes,
+            callback: (args) => {
+                approvalData.approvedContent = args.opinion;
+                approvalData.nextTaskUser = args.nextTaskUser;
+                onFinish('approve');
+            }
+        });
+    }
+
+    async function onDenyClick() {
+        approvalData.approvedType = ApproveType.REJECT;
+        approvalData.approvedResult = ApproveCode.REJECT;
+        opinionDlg.value.toggleDialog({
+            action: 'reject',
+            processId: processId.value,
+            taskId: taskId.value,
+            callback: (args) => {
+                approvalData.approvedContent = args.opinion;
+                approvalData.rejectNodeActivityId = args.rejectNodeId;
+                approvalData.nextTaskUser = args.nextTaskUser;
+                onFinish('reject');
+            }
+        });
+    }
+
+    async function onFinishClick(){
+        approvalData.approvedType = ApproveType.FINISH;
+        approvalData.approvedResult = ApproveCode.FINISH;
+        onFinish('finish');
+    }
+
+    function flowSuccess() {
+        opinionDlg.value.toggleDialog({
+            isClose: true
+        });
+        message.success('操作成功');
+        setTimeout(() => {
+            bus.emit(FLOW_PROCESSED);
+            close();
+        }, 500);
+    }
+
+    function flowFail() {
+        opinionDlg.value.stopLoading();
+    }
+
+    function reset() {
+        approvalData.isAddOrSubSign = false;
+        approvalData.stampInfo = {
+            stampId: '',
+            password: ''
+        };
+        approvalData.buttonConfigs = [];
+        approvalData.approvedType = ApproveType.AGREE;
+        approvalData.approvedContent = '';
+        approvalData.rejectNodeActivityId = '';
+        approvalData.rejectNodeActivityIds = [];
+        approvalData.circulateConfigs = [];
+    }
+
+    function setBtnStatus() {
+        const btnConfigs = approvalData.buttonConfigs;
+        btnConfigs.forEach((btn) => {
+            const code = btn.buttonCode;
+            if (code === 'reject') {
+                hasBtnReject.value = true;
+            } else if (code === 'finish') {
+                hasBtnFinish.value = true;
+            }
+        });
+    }
+
+    function getTaskRecords() {
+        if (data?.taskApproveOpinions?.length) {
+            return data.taskApproveOpinions || [];
+        }
+    }
+
+    onMounted(async () => {
+        try {
+            let res = await getApprovalProcess(unref(taskId), unref(processId));
+            initProcessData(res);
+            const title = res?.schemaInfo?.name;
+            if (title) {
+                const tabPrefix = readonly.value ? '查看' : '审批';
+                tabStore.changeTitle(fullPath, `${tabPrefix}：${title}`);
+            }
+            if (!readonly.value) {
+                if (res.buttonConfigs) {
+                    approvalData.buttonConfigs = res.buttonConfigs;
+                    setBtnStatus();
+                }
+                if (res.relationTasks) {
+                    data.predecessorTasks = res.relationTasks;
+                }
+                if (res.isAddOrSubSign) {
+                    approvalData.isAddOrSubSign = res.isAddOrSubSign;
+                }
+
+                approvalData.approvedType = ApproveType.AGREE;
+                approvedType.value = ApproveType.AGREE;
+                approvalData.approvedContent = '';
+                approvalData.rejectNodeActivityId = '';
+                approvalData.rejectNodeActivityIds = [];
+                approvalData.circulateConfigs = [];
+            }
+            renderKey.value = Math.random() + '';
+        } catch (error) {}
+    });
+
+    async function submit() {
+        data.submitLoading = true;
+        validateSuccess.value = false;
+        try {
+            let validateForms = await formInformation.value.validateForm();
+            if (validateForms.length > 0) {
+                let successValidate = validateForms.filter((ele) => {
+                    return ele.validate;
                 });
+                if (successValidate.length == validateForms.length) {
+                    validateSuccess.value = true;
+                    data.submitLoading = false;
+                } else {
+                    data.submitLoading = false;
+                    notificationError(t('审批流程'), t('表单校验未通过'));
+                }
             }
-        }
-    });
-    return fileFolderIds;
-}
-
-async function getApproveParams() {
-    let formModels = await formInformation.value.getFormModels();
-    let system = formInformation.value.getSystemType();
-    let fileFolderIds = getUploadFileFolderIds(formModels);
-    return {
-        approvedType: approvalData.approvedType,
-        approvedResult: approvalData.approvedResult, // approvalData.approvedType 审批结果 如果为 4 就需要传buttonCode
-        approvedContent: approvalData.approvedContent,
-        formData: formModels,
-        rejectNodeActivityId: approvalData.rejectNodeActivityId,
-        taskId: taskId.value,
-        fileFolderIds,
-        circulateConfigs: approvalData.circulateConfigs,
-        /*stampId: values.stampId,
-        stampPassword: values.password,*/
-        isOldSystem: system,
-        nextTaskUser: approvalData.nextTaskUser
-    };
-}
-
-async function onFinish(values) {
-    try {
-        if (validateSuccess.value || values === 'reject') {
-            let params = await getApproveParams();
-            await postApproval(params);
-            flowSuccess();
+        } catch (error) {
             data.submitLoading = false;
+            notificationError(t('审批流程'), t('审批流程失败'));
+        }
+    }
+
+    function getUploadFileFolderIds(formModels) {
+        let fileFolderIds = [];
+        let uploadComponentIds = formInformation.value.getUploadComponentIds();
+        uploadComponentIds.forEach((ids) => {
+            if (ids.includes(separator)) {
+                let arr = ids.split(separator);
+                if (arr.length == 2 && formModels[arr[0]][arr[1]]) {
+                    fileFolderIds.push(formModels[arr[0]][arr[1]]);
+                } else if (arr.length == 3 && formModels[arr[0]][arr[1]] && Array.isArray(formModels[arr[0]][arr[1]])) {
+                    formModels[arr[0]][arr[1]].forEach((o) => {
+                        fileFolderIds.push(o[arr[2]]);
+                    });
+                }
+            }
+        });
+        return fileFolderIds;
+    }
+
+    async function getApproveParams() {
+        let formModels = await formInformation.value.getFormModels();
+        let system = formInformation.value.getSystemType();
+        let fileFolderIds = getUploadFileFolderIds(formModels);
+        return {
+            approvedType: approvalData.approvedType,
+            approvedResult: approvalData.approvedResult, // approvalData.approvedType 审批结果 如果为 4 就需要传buttonCode
+            approvedContent: approvalData.approvedContent,
+            formData: formModels,
+            rejectNodeActivityId: approvalData.rejectNodeActivityId,
+            taskId: taskId.value,
+            fileFolderIds,
+            circulateConfigs: approvalData.circulateConfigs,
+            /*stampId: values.stampId,
+            stampPassword: values.password,*/
+            isOldSystem: system,
+            nextTaskUser: approvalData.nextTaskUser
+        };
+    }
+
+    async function onFinish(values) {
+        try {
+            if (validateSuccess.value || values === 'reject' || values === 'finish') {
+                let params = await getApproveParams();
+                await postApproval(params);
+                flowSuccess();
+                data.submitLoading = false;
+            }
+        } catch (error) {
+            flowFail();
         }
-    } catch (error) {
-        flowFail();
     }
-}
 </script>