refactor:【BPM 工作流】针对TODO 更新流程相关接口和组件，优化文档提示，调整表单字段类型

2025-05-21 01:29:03 +08:00
parent 7a54f7767a
commit a4839416fe
22 changed files with 182 additions and 176 deletions
--- a/apps/web-antd/src/views/bpm/task/copy/index.vue
+++ b/apps/web-antd/src/views/bpm/task/copy/index.vue
@@ -61,9 +61,8 @@ function onActionClick({
  }
 }

-/** 办理任务 */
-function onDetail(row: BpmProcessInstanceApi.ProcessInstanceVO) {
-  // TODO @siye：row 的类型是不是不对哈？需要改成 copyvo 么？
+/** 任务详情 */
+function onDetail(row: BpmProcessInstanceApi.CopyVO) {
  const query = {
    id: row.processInstanceId,
    ...(row.activityId && { activityId: row.activityId }),
@@ -82,11 +81,12 @@ function onRefresh() {

 <template>
  <Page auto-content-height>
-    <!-- TODO @siye：应该用 <template #doc>，这样高度可以被用进去哈 -->
-    <DocAlert
-      title="审批转办、委派、抄送"
-      url="https://doc.iocoder.cn/bpm/task-delegation-and-cc/"
-    />
+    <template #doc>
+      <DocAlert
+        title="审批转办、委派、抄送"
+        url="https://doc.iocoder.cn/bpm/task-delegation-and-cc/"
+      />
+    </template>

    <FormModal @success="onRefresh" />
    <Grid table-title="抄送任务">
--- a/apps/web-antd/src/views/bpm/task/done/data.ts
+++ b/apps/web-antd/src/views/bpm/task/done/data.ts
@@ -2,8 +2,6 @@ import type { VbenFormSchema } from '#/adapter/form';
 import type { OnActionClickFn, VxeTableGridOptions } from '#/adapter/vxe-table';
 import type { BpmTaskApi } from '#/api/bpm/task';

-import { useAccess } from '@vben/access';
-
 import { getCategorySimpleList } from '#/api/bpm/category';
 import {
  DICT_TYPE,
@@ -12,18 +10,15 @@ import {
  getRangePickerDefaultProps,
 } from '#/utils';

-// TODO @siye：这个要去掉么？没用到
-const { hasAccessByCodes } = useAccess();
-
 /** 列表的搜索表单 */
 export function useGridFormSchema(): VbenFormSchema[] {
  return [
    {
      fieldName: 'name',
-      label: '流程名称',
+      label: '任务名称',
      component: 'Input',
      componentProps: {
-        placeholder: '请输入流程名称',
+        placeholder: '请输入任务名称',
        allowClear: true,
      },
    },
@@ -79,8 +74,8 @@ export function useGridColumns<T = BpmTaskApi.TaskVO>(
 ): VxeTableGridOptions['columns'] {
  return [
    {
-      field: 'name',
-      title: '流程名称',
+      field: 'processInstance.name',
+      title: '流程',
      minWidth: 200,
      fixed: 'left',
    },
--- a/apps/web-antd/src/views/bpm/task/done/index.vue
+++ b/apps/web-antd/src/views/bpm/task/done/index.vue
@@ -78,18 +78,19 @@ function onRefresh() {

 <template>
  <Page auto-content-height>
-    <DocAlert
-      title="审批通过、不通过、驳回"
-      url="https://doc.iocoder.cn/bpm/task-todo-done/"
-    />
-    <DocAlert title="审批加签、减签" url="https://doc.iocoder.cn/bpm/sign/" />
-    <DocAlert
-      title="审批转办、委派、抄送"
-      url="https://doc.iocoder.cn/bpm/task-delegation-and-cc/"
-    />
-    <DocAlert title="审批加签、减签" url="https://doc.iocoder.cn/bpm/sign/" />
+    <template #doc>
+      <DocAlert
+        title="审批通过、不通过、驳回"
+        url="https://doc.iocoder.cn/bpm/task-todo-done/"
+      />
+      <DocAlert title="审批加签、减签" url="https://doc.iocoder.cn/bpm/sign/" />
+      <DocAlert
+        title="审批转办、委派、抄送"
+        url="https://doc.iocoder.cn/bpm/task-delegation-and-cc/"
+      />
+      <DocAlert title="审批加签、减签" url="https://doc.iocoder.cn/bpm/sign/" />
+    </template>

-    <FormModal @success="onRefresh" />
    <Grid table-title="已办任务">
      <!-- 摘要 -->
      <template #slot-summary="{ row }">
--- a/apps/web-antd/src/views/bpm/task/manager/data.ts
+++ b/apps/web-antd/src/views/bpm/task/manager/data.ts
@@ -33,19 +33,11 @@ export function useGridColumns<T = BpmTaskApi.TaskVO>(
 ): VxeTableGridOptions['columns'] {
  return [
    {
-      field: 'name',
-      title: '流程名称',
+      field: 'processInstance.name',
+      title: '流程',
      minWidth: 200,
      fixed: 'left',
    },
-    {
-      field: 'processInstance.summary',
-      title: '摘要',
-      minWidth: 200,
-      slots: {
-        default: 'slot-summary',
-      },
-    },
    {
      field: 'processInstance.startUser.nickname',
      title: '发起人',
--- a/apps/web-antd/src/views/bpm/task/manager/index.vue
+++ b/apps/web-antd/src/views/bpm/task/manager/index.vue
@@ -16,7 +16,7 @@ import { useGridColumns, useGridFormSchema } from './data';

 defineOptions({ name: 'BpmManagerTask' });

-const [Grid, gridApi] = useVbenVxeGrid({
+const [Grid] = useVbenVxeGrid({
  formOptions: {
    schema: useGridFormSchema(),
  },
@@ -45,11 +45,14 @@ const [Grid, gridApi] = useVbenVxeGrid({
    cellConfig: {
      height: 64,
    },
-  } as VxeTableGridOptions<BpmTaskApi.TaskVO>,
+  } as VxeTableGridOptions<BpmTaskApi.TaskManagerVO>,
 });

 /** 表格操作按钮的回调函数 */
-function onActionClick({ code, row }: OnActionClickParams<BpmTaskApi.TaskVO>) {
+function onActionClick({
+  code,
+  row,
+}: OnActionClickParams<BpmTaskApi.TaskManagerVO>) {
  switch (code) {
    case 'history': {
      onHistory(row);
@@ -59,50 +62,22 @@ function onActionClick({ code, row }: OnActionClickParams<BpmTaskApi.TaskVO>) {
 }

 /** 查看历史 */
-function onHistory(row: BpmTaskApi.TaskVO) {
+function onHistory(row: BpmTaskApi.TaskManagerVO) {
  console.warn(row);
  router.push({
    name: 'BpmProcessInstanceDetail',
    query: {
-      // TODO @siye：数据类型，会爆红哈；
      id: row.processInstance.id,
    },
  });
 }
-
-/** 刷新表格 */
-function onRefresh() {
-  gridApi.query();
-}
 </script>

 <template>
  <Page auto-content-height>
-    <DocAlert title="工作流手册" url="https://doc.iocoder.cn/bpm/" />
-
-    <FormModal @success="onRefresh" />
-    <Grid table-title="流程任务">
-      <!-- 摘要 -->
-      <!-- TODO siye：这个要不要，也放到 data.ts 处理掉？ -->
-      <template #slot-summary="{ row }">
-        <div
-          class="flex flex-col py-2"
-          v-if="
-            row.processInstance.summary &&
-            row.processInstance.summary.length > 0
-          "
-        >
-          <div
-            v-for="(item, index) in row.processInstance.summary"
-            :key="index"
-          >
-            <span class="text-gray-500">
-              {{ item.key }} : {{ item.value }}
-            </span>
-          </div>
-        </div>
-        <div v-else>-</div>
-      </template>
-    </Grid>
+    <template #doc>
+      <DocAlert title="工作流手册" url="https://doc.iocoder.cn/bpm/" />
+    </template>
+    <Grid table-title="流程任务" />
  </Page>
 </template>
--- a/apps/web-antd/src/views/bpm/task/todo/data.ts
+++ b/apps/web-antd/src/views/bpm/task/todo/data.ts
@@ -14,10 +14,10 @@ export function useGridFormSchema(): VbenFormSchema[] {
  return [
    {
      fieldName: 'name',
-      label: '流程名称',
+      label: '任务名称',
      component: 'Input',
      componentProps: {
-        placeholder: '请输入流程名称',
+        placeholder: '请输入任务名称',
        allowClear: true,
      },
    },
@@ -72,8 +72,8 @@ export function useGridColumns<T = BpmTaskApi.TaskVO>(
 ): VxeTableGridOptions['columns'] {
  return [
    {
-      field: 'name',
-      title: '流程名称',
+      field: 'processInstance.name',
+      title: '流程',
      minWidth: 200,
      fixed: 'left',
    },
@@ -81,9 +81,9 @@ export function useGridColumns<T = BpmTaskApi.TaskVO>(
      field: 'processInstance.summary',
      title: '摘要',
      minWidth: 200,
-      slots: {
-        default: 'slot-summary',
-      },
+      // slots: {
+      //   default: 'slot-summary',
+      // },
    },
    {
      field: 'processInstance.startUser.nickname',
--- a/apps/web-antd/src/views/bpm/task/todo/index.vue
+++ b/apps/web-antd/src/views/bpm/task/todo/index.vue
@@ -78,18 +78,18 @@ function onRefresh() {

 <template>
  <Page auto-content-height>
-    <DocAlert
-      title="审批通过、不通过、驳回"
-      url="https://doc.iocoder.cn/bpm/task-todo-done/"
-    />
-    <DocAlert title="审批加签、减签" url="https://doc.iocoder.cn/bpm/sign/" />
-    <DocAlert
-      title="审批转办、委派、抄送"
-      url="https://doc.iocoder.cn/bpm/task-delegation-and-cc/"
-    />
-    <DocAlert title="审批加签、减签" url="https://doc.iocoder.cn/bpm/sign/" />
-
-    <FormModal @success="onRefresh" />
+    <template #doc>
+      <DocAlert
+        title="审批通过、不通过、驳回"
+        url="https://doc.iocoder.cn/bpm/task-todo-done/"
+      />
+      <DocAlert title="审批加签、减签" url="https://doc.iocoder.cn/bpm/sign/" />
+      <DocAlert
+        title="审批转办、委派、抄送"
+        url="https://doc.iocoder.cn/bpm/task-delegation-and-cc/"
+      />
+      <DocAlert title="审批加签、减签" url="https://doc.iocoder.cn/bpm/sign/" />
+    </template>
    <Grid table-title="待办任务">
      <!-- 摘要 -->
      <!-- TODO siye：这个要不要，也放到 data.ts 处理掉？ -->