yxk-20260526-党委会查询督办流程：写一个通用的删除流程方法

src/api/common/api.ts

@@ -17,6 +17,7 @@ enum Api {
   startProcess = '/act/process/extActProcess/startMutilProcess',
   startProcessSchedules = '/tasktask/taskTask/flow-schedules',
   queryByBusinessId = '/tasktask/taskTask/queryByBusinessId',
+  deleteSingleProcess = '/tasktask/taskTask/deleteSingleProcess',
 }
 
 /**
@@ -115,8 +116,8 @@ export const downloadFile = (url, fileName?, parameter?) => {
     if (typeof window.navigator.msSaveBlob !== 'undefined') {
       window.navigator.msSaveBlob(new Blob([data]), fileName);
     } else {
-      let url = window.URL.createObjectURL(new Blob([data]));
+      const url = window.URL.createObjectURL(new Blob([data]));
-      let link = document.createElement('a');
+      const link = document.createElement('a');
       link.style.display = 'none';
       link.href = url;
       link.setAttribute('download', fileName);
@@ -154,8 +155,8 @@ export const startProcessSchedules = (params) => {
   return defHttp.post({
     url: Api.startProcessSchedules,
     params,
-  })
+  });
-}
+};
 
 /**
  * 发起流程
@@ -173,9 +174,15 @@ export const startProcess = (params) => {
  * 根据业务ID查询流程列表
  * @param params
  */
-export const queryByBusinessId = (params) =>
+export const queryByBusinessId = (params) => defHttp.get({ url: Api.queryByBusinessId, params }, { isTransformResponse: false });
-  defHttp.get({ url: Api.queryByBusinessId, params }, { isTransformResponse: false });
 
+/**
+ * 删除单个流程实例
+ * @param params { processInstId: string }
+ */
+export const deleteSingleProcess = (params) => {
+  return defHttp.post({ url: Api.deleteSingleProcess, params }, { joinParamsToUrl: true, isTransformResponse: false });
+};
 
 /**
  * 【用于评论功能】自定义文件上传-方法

src/components/semri/process/BusinessProcessListModal.vue

@@ -8,6 +8,16 @@
       </BasicTable>
     </div>
     <BpmPictureModal @register="registerBpmModal" />
+    <j-modal
+      title="审批历史"
+      :width="approvalHistoryModalWidth"
+      :visible="approvalHistoryVisible"
+      :footer="null"
+      @cancel="handleApprovalHistoryCancel"
+      cancelText="关闭"
+    >
+      <TaskApprovalHistoryContent ref="approvalHistoryRef" :form-data="approvalHistoryFormData" />
+    </j-modal>
   </j-modal>
 </template>
 
@@ -17,14 +27,14 @@
   import JModal from '/@/components/Modal/src/JModal/JModal.vue';
   import { useModal } from '/@/components/Modal';
   import { columns } from './QueryProcessList.data';
-  import { queryByBusinessId } from '/@/api/common/api';
+  import { deleteSingleProcess, queryByBusinessId } from '/@/api/common/api';
   import { useMessage } from '/@/hooks/web/useMessage';
+  import TaskApprovalHistoryContent from '/@/views/super/bpm/process/personalOffice/myHandleTask/content/TaskApprovalHistoryContent.vue';
 
   interface OpenParams {
     businessId?: string;
     title?: string;
     columns?: BasicColumn[];
-    onDeleteProcess?: (record: Recordable, reload: () => Promise<void>) => Promise<void>;
   }
 
   const title = ref('流程列表');
@@ -32,12 +42,15 @@
   const currentBusinessId = ref('');
   const defaultColumns = columns;
   const modalWidth = 'min(1280px, calc(100vw - 64px))';
+  const approvalHistoryModalWidth = 'min(1100px, calc(100vw - 96px))';
   // 按当前列宽合计收敛横向滚动距离，避免少量列被默认宽度撑得过大。
   const tableScrollX = 1680;
   // 固定表体高度，让横向滚动条停留在弹窗底部，而不是跟随少量数据行出现在中间。
   const tableBodyHeight = 500;
   const { createMessage } = useMessage();
-  const onDeleteProcessRef = ref<OpenParams['onDeleteProcess']>();
+  const approvalHistoryVisible = ref(false);
+  const approvalHistoryFormData = ref<Recordable>({});
+  const approvalHistoryRef = ref();
   const [registerBpmModal, { openModal: bpmPicModal }] = useModal();
 
   const [registerTable, { setColumns, setTableData, setLoading, clearSelectedRowKeys }] = useTable({
@@ -51,7 +64,7 @@
     actionColumn: {
       title: '操作',
       dataIndex: 'action',
-      width: 120,
+      width: 240,
       fixed: 'right',
       slots: { customRender: 'action' },
     },
@@ -86,7 +99,6 @@
   async function open(params: OpenParams = {}) {
     currentBusinessId.value = params.businessId || '';
     title.value = params.title || '流程列表';
-    onDeleteProcessRef.value = params.onDeleteProcess;
     visible.value = true;
     await nextTick();
     setColumns(params.columns?.length ? params.columns : defaultColumns);
@@ -96,9 +108,9 @@
   function handleCancel() {
     visible.value = false;
     currentBusinessId.value = '';
-    onDeleteProcessRef.value = undefined;
     setColumns(defaultColumns);
     setTableData([]);
+    handleApprovalHistoryCancel();
     clearSelectedRowKeys();
   }
 
@@ -109,34 +121,66 @@
     });
   }
 
+  async function handlePreviewApprovalHistory(record) {
+    const processInstId = record?.processInstId;
+    if (!processInstId) {
+      createMessage.error('流程实例ID不能为空');
+      return;
+    }
+
+    approvalHistoryFormData.value = {
+      procInstId: processInstId,
+      processInstId,
+    };
+    approvalHistoryVisible.value = true;
+    await nextTick();
+    approvalHistoryRef.value?.reload?.();
+  }
+
+  function handleApprovalHistoryCancel() {
+    approvalHistoryVisible.value = false;
+    approvalHistoryFormData.value = {};
+  }
+
   async function handleDeleteProcess(record) {
-    if (typeof onDeleteProcessRef.value === 'function') {
+    const processInstId = record?.processInstId;
-      await onDeleteProcessRef.value(record, loadData);
+    if (!processInstId) {
+      createMessage.error('流程实例ID不能为空');
+      return;
+    }
+
+    try {
+      const res = await deleteSingleProcess({ processInstId });
+      if (res?.success) {
+        createMessage.success(res.message || '删除流程成功');
+        await loadData();
       } else {
-      createMessage.warning('未配置删除流程回调');
+        createMessage.error(res?.message || '删除流程失败');
+      }
+    } catch (error) {
+      createMessage.error('删除流程失败');
     }
   }
 
   function getTableAction(record) {
-    const actions: any[] = [
+    return [
       {
-        label: '审批历史',
+        label: '流程图',
         onClick: handlePreviewPic.bind(null, record),
       },
-    ];
+      {
-
+        label: '审批历史',
-    if (typeof onDeleteProcessRef.value === 'function') {
+        onClick: handlePreviewApprovalHistory.bind(null, record),
-      actions.push({
+      },
+      {
         label: '删除流程',
         popConfirm: {
           title: '确定删除该流程吗？',
           confirm: handleDeleteProcess.bind(null, record),
           placement: 'topLeft',
         },
-      });
+      },
-    }
+    ];
-
-    return actions;
   }
 
   defineExpose({

src/views/bg/xispeak/BgXiSpeak.api.ts

@@ -1,5 +1,5 @@
-import { defHttp } from "/@/utils/http/axios";
+import { defHttp } from '/@/utils/http/axios';
-import { useMessage } from "/@/hooks/web/useMessage";
+import { useMessage } from '/@/hooks/web/useMessage';
 
 const { createConfirm } = useMessage();
 
@@ -45,7 +45,7 @@ export const deleteBgXiSpeak = (params,handleSuccess) => {
   return defHttp.delete({ url: Api.deleteBgXiSpeak, params }, { joinParamsToUrl: true }).then(() => {
     handleSuccess();
   });
-}
+};
 
 /**
  * 批量删除
@@ -63,9 +63,9 @@ export const batchDeleteBgXiSpeak = (params, handleSuccess) => {
       return defHttp.delete({ url: Api.deleteBgXiSpeak, data: params }, { joinParamsToUrl: true }).then(() => {
         handleSuccess();
       });
-    }
+    },
   });
-}
+};
 
 /**
  * 保存或者更新
@@ -73,9 +73,9 @@ export const batchDeleteBgXiSpeak = (params, handleSuccess) => {
  * @param isUpdate
  */
 export const saveOrUpdateDict = (params, isUpdate) => {
-  let url = isUpdate ? Api.edit : Api.save;
+  const url = isUpdate ? Api.edit : Api.save;
   return defHttp.post({ url: url, params }, { isTransformResponse: false });
-}
+};
 
 /**
  * 查询全部树形节点数据
@@ -153,7 +153,7 @@ export const bgXiSpeakFeedbackDeleteBatch = (params, handleSuccess) => {
  * @param isUpdate
  */
 export const bgXiSpeakFeedbackSaveOrUpdate = (params, isUpdate) => {
-  let url = isUpdate ? '/bg/xispeak/bgXiSpeak/editBgXiSpeakFeedback' : '/bg/xispeak/bgXiSpeak/addBgXiSpeakFeedback';
+  const url = isUpdate ? '/bg/xispeak/bgXiSpeak/editBgXiSpeakFeedback' : '/bg/xispeak/bgXiSpeak/addBgXiSpeakFeedback';
   return defHttp.post({ url: url, params }, { isTransformResponse: false });
 };
 
@@ -185,10 +185,6 @@ export const withDrawXiSpeak = (params) => {
   return defHttp.post({ url: '/bg/xispeak/bgXiSpeak/withDrawXiSpeak', params }, { joinParamsToUrl: true, isTransformResponse: false });
 };
 
-export const deleteSingleProcess = (params) => {
-  return defHttp.post({ url: '/tasktask/taskTask/deleteSingleProcess', params }, { joinParamsToUrl: true, isTransformResponse: false });
-};
-
 /**
  * 批量查询反馈统计数量（每个 xispeak 下的 feedback 总条数和已闭环数）
  * @param params { ids: "id1,id2,id3" }

src/views/bg/xispeak/BgXiSpeakList.vue

@@ -83,7 +83,6 @@
     updateLaunchType,
     saveOrUpdateDict,
     withDrawXiSpeak,
-    deleteSingleProcess,
     getRootListWithDept,
     bgXiSpeakFeedbackList,
   } from './BgXiSpeak.api';
@@ -137,8 +136,11 @@
     },
   });
 
-  const [registerTable, { reload, collapseAll, updateTableDataRecord, findTableDataRecord, getDataSource, setTableData }, { rowSelection, selectedRowKeys }] =
+  const [
-    tableContext;
+    registerTable,
+    { reload, collapseAll, updateTableDataRecord, findTableDataRecord, getDataSource, setTableData },
+    { rowSelection, selectedRowKeys },
+  ] = tableContext;
   const mainId = computed(() => (unref(selectedRowKeys).length > 0 ? unref(selectedRowKeys)[0] : ''));
   provide('mainId', mainId);
 
@@ -593,20 +595,9 @@
       title: '流程列表',
       businessId: record.id,
       columns: '',
-      onDeleteProcess: handleDeleteProcess,
     });
   }
 
-  async function handleDeleteProcess(processRecord, reload) {
-    const res = await deleteSingleProcess({ processInstId: processRecord.processInstId });
-    if (res.success) {
-      createMessage.success(res.message || '删除流程成功');
-      await reload();
-    } else {
-      createMessage.error(res.message || '删除流程失败');
-    }
-  }
-
   async function handleFlowScheduleConfirm({ payload, options }) {
     const record = payload?.record || {};
     const flowCode = payload?.flowCode || FLOW_CODE;