yxk-20260610-审批历史页面

审批历史页面改为一次加载完整审批历史并全部展示；表格上方增加节点名称平铺 checkbox，默认全选。用户勾选或取消勾选节点时，仅在前端过滤表格数据，不调用接口。

src/views/super/bpm/process/personalOffice/myHandleTask/content/TaskApprovalHistoryContent.vue

@@ -1,5 +1,17 @@
 <template>
   <div class="approval-history-pane">
+    <div v-if="taskNameOptions.length > 0" class="approval-history-filter">
+      <span class="approval-history-filter__label">节点名称：</span>
+      <a-checkbox-group v-model:value="selectedTaskNames" class="approval-history-filter__checkboxes" @change="handleTaskNameChange">
+        <a-checkbox v-for="taskName in taskNameOptions" :key="taskName" :value="taskName">
+          {{ taskName }}
+        </a-checkbox>
+      </a-checkbox-group>
+      <div class="approval-history-filter__actions">
+        <a-button type="link" size="small" :disabled="selectedTaskNames.length === taskNameOptions.length" @click="selectAllTaskNames">全选</a-button>
+        <a-button type="link" size="small" :disabled="selectedTaskNames.length === 0" @click="clearTaskNames">清空</a-button>
+      </div>
+    </div>
     <BasicTable @register="registerTable" />
   </div>
 </template>
@@ -11,11 +23,16 @@
    */
   import { BasicTable, useTable } from '/@/components/Table';
   import type { BasicColumn } from '/@/components/Table';
-  import { onMounted, watch } from 'vue';
+  import { onMounted, ref, watch } from 'vue';
   import { list as queryApprovalOpinionList } from '/@/views/taskApprovalOpinion/TaskApprovalOpinion.api';
 
+  interface ApprovalHistoryRecord {
+    [key: string]: any;
+    taskName?: string;
+  }
+
   const approvalHistoryColumns: BasicColumn[] = [
-    { title: '节点名称', dataIndex: 'taskName', width: 160, align: 'left' },
+    { title: '节点名称', dataIndex: 'taskName', width: 160, align: 'center' },
     { title: '开始时间', dataIndex: 'startTime', width: 170, align: 'center' },
     { title: '办理时间', dataIndex: 'opTime', width: 170, align: 'center' },
     {
@@ -43,7 +60,11 @@
       },
     },
     setup(props) {
-      const [registerTable, { reload }] = useTable({
+      const allApprovalHistoryList = ref<ApprovalHistoryRecord[]>([]);
+      const taskNameOptions = ref<string[]>([]);
+      const selectedTaskNames = ref<string[]>([]);
+
+      const [registerTable, { reload, setTableData }] = useTable({
         title: '',
         api: getApprovalHistoryList,
         columns: approvalHistoryColumns,
@@ -55,35 +76,107 @@
         useSearchForm: false,
         canResize: false,
         immediate: false,
-        pagination: {
+        pagination: false,
-          pageSize: 10,
-        },
         scroll: { x: 1290 },
       });
 
-      // 按流程实例查询审批历史，只查 task_approval_opinion 表
+      function getProcessInstId(): string {
-      function getApprovalHistoryList(params) {
+        return props.formData?.procInsId || props.formData?.procInstId || props.formData?.processInstanceId;
-        const processInstId =
+      }
-          props.formData?.procInsId ||
+
-          props.formData?.procInstId ||
+      function normalizeTaskName(taskName: unknown): string {
-          props.formData?.processInstanceId;
+        return typeof taskName === 'string' ? taskName.trim() : '';
-        if (!processInstId) {
+      }
-          return Promise.resolve({ records: [], total: 0 });
+
+      function resolveRecords(res: any): ApprovalHistoryRecord[] {
+        if (Array.isArray(res)) {
+          return res;
         }
-        return queryApprovalOpinionList({
+        return res?.records || res?.result?.records || [];
-          ...params,
+      }
+
+      function resolveTotal(res: any, fallbackTotal: number): number {
+        return Number(res?.total || res?.result?.total || fallbackTotal || 0);
+      }
+
+      function getFilteredApprovalHistoryList(): ApprovalHistoryRecord[] {
+        if (selectedTaskNames.value.length === 0) {
+          return [];
+        }
+        const selectedNameSet = new Set(selectedTaskNames.value);
+        return allApprovalHistoryList.value.filter((record) => {
+          const taskName = normalizeTaskName(record.taskName);
+          return taskName && selectedNameSet.has(taskName);
+        });
+      }
+
+      function resetTaskNameFilter(records: ApprovalHistoryRecord[]) {
+        const taskNames = records.map((record) => normalizeTaskName(record.taskName)).filter(Boolean);
+        taskNameOptions.value = Array.from(new Set(taskNames));
+        selectedTaskNames.value = [...taskNameOptions.value];
+      }
+
+      function applyTaskNameFilter() {
+        setTableData(getFilteredApprovalHistoryList());
+      }
+
+      function handleTaskNameChange(checkedValues: string[]) {
+        selectedTaskNames.value = checkedValues;
+        applyTaskNameFilter();
+      }
+
+      function selectAllTaskNames() {
+        selectedTaskNames.value = [...taskNameOptions.value];
+        applyTaskNameFilter();
+      }
+
+      function clearTaskNames() {
+        selectedTaskNames.value = [];
+        applyTaskNameFilter();
+      }
+
+      // 按流程实例查询审批历史，只查 task_approval_opinion 表
+      async function getApprovalHistoryList() {
+        const processInstId = getProcessInstId();
+        if (!processInstId) {
+          allApprovalHistoryList.value = [];
+          resetTaskNameFilter([]);
+          return { records: [], total: 0 };
+        }
+
+        const queryParams = {
           processInstId,
           column: 'startTime',
           order: 'asc',
+        };
+
+        // 接口默认为分页返回，先取首批数据和总数；若未拿全，再按总数补齐完整审批历史。
+        const firstRes = await queryApprovalOpinionList({
+          ...queryParams,
+          pageNo: 1,
+          pageSize: 10,
         });
+        const firstRecords = resolveRecords(firstRes);
+        const total = resolveTotal(firstRes, firstRecords.length);
+        let records = firstRecords;
+        if (total > firstRecords.length) {
+          const fullRes = await queryApprovalOpinionList({
+            ...queryParams,
+            pageNo: 1,
+            pageSize: total,
+          });
+          records = resolveRecords(fullRes);
+        }
+
+        allApprovalHistoryList.value = records;
+        resetTaskNameFilter(records);
+        const filteredRecords = getFilteredApprovalHistoryList();
+        return { records: filteredRecords, total: filteredRecords.length };
       }
 
       // 组件挂载时自动加载（解决 tab 懒加载场景下父组件 reload 调用时子组件未挂载的问题）
       onMounted(() => {
-        const processInstId =
+        const processInstId = getProcessInstId();
-          props.formData?.procInsId ||
-          props.formData?.procInstId ||
-          props.formData?.processInstanceId;
         if (processInstId) {
           reload();
         }
@@ -102,6 +195,11 @@
       return {
         registerTable,
         reload,
+        taskNameOptions,
+        selectedTaskNames,
+        handleTaskNameChange,
+        selectAllTaskNames,
+        clearTaskNames,
       };
     },
   };
@@ -112,4 +210,38 @@
     height: 100%;
     padding: 4px 0;
   }
+
+  .approval-history-filter {
+    display: flex;
+    align-items: flex-start;
+    gap: 8px;
+    margin-bottom: 8px;
+    padding: 4px 0;
+  }
+
+  .approval-history-filter__label {
+    flex: 0 0 auto;
+    line-height: 32px;
+    color: rgba(0, 0, 0, 0.85);
+  }
+
+  .approval-history-filter__checkboxes {
+    display: flex;
+    flex: 1;
+    flex-wrap: wrap;
+    gap: 6px 12px;
+    min-width: 0;
+    padding-top: 5px;
+
+    :deep(.ant-checkbox-wrapper) {
+      margin-left: 0;
+    }
+  }
+
+  .approval-history-filter__actions {
+    display: flex;
+    flex: 0 0 auto;
+    align-items: center;
+    line-height: 32px;
+  }
 </style>