feat: 流程定义 历史

apps/web-antd/src/api/workflow/definition/index.ts

@@ -1,27 +1,34 @@
-import type { ID, IDS, PageQuery } from '#/api/common';
+import type { ProcessDefinition } from './model';
+
+import type { ID, IDS, PageQuery, PageResult } from '#/api/common';
 
 import { requestClient } from '#/api/request';
 
 export function workflowDefinitionList(params?: PageQuery) {
-  return requestClient.get('/workflow/definition/list', { params });
+  return requestClient.get<PageResult<ProcessDefinition>>(
+    '/workflow/definition/list',
+    { params },
+  );
 }
 
 /**
  * 获取历史流程定义列表
  * @param flowCode
- * @returns
+ * @returns ProcessDefinition[]
  */
 export function getHisListByKey(flowCode: string) {
-  return requestClient.get(`/workflow/definition/getHisListByKey/${flowCode}`);
+  return requestClient.get<ProcessDefinition[]>(
+    `/workflow/definition/getHisListByKey/${flowCode}`,
+  );
 }
 
 /**
  * 获取流程定义详细信息
  * @param id id
- * @returns
+ * @returns ProcessDefinition
  */
 export function workflowDefinitionInfo(id: ID) {
-  return requestClient.get(`/workflow/definition/${id}`);
+  return requestClient.get<ProcessDefinition>(`/workflow/definition/${id}`);
 }
 
 /**

apps/web-antd/src/api/workflow/definition/model.d.ts

@@ -0,0 +1,19 @@
+export interface ProcessDefinition {
+  id: string;
+  createTime: string;
+  updateTime: string;
+  tenantId: string;
+  delFlag: string;
+  flowCode: string;
+  flowName: string;
+  category: string;
+  categoryName: string;
+  version: string;
+  isPublish: number;
+  formCustom: string;
+  formPath: string;
+  activityStatus: number;
+  listenerType?: any;
+  listenerPath?: any;
+  ext?: any;
+}

apps/web-antd/src/views/workflow/processDefinition/index.vue

@@ -122,7 +122,6 @@ const router = useRouter();
  * @param disabled true为预览，false为设计
  */
 function handleDesign(row: any, disabled: boolean) {
-  console.log(row);
   router.push({
     path: '/workflow/designer',
     query: { definitionId: row.id, disabled: String(disabled) },
@@ -146,7 +145,7 @@ const [ProcessDefinitionHistoryModal, historyModalApi] = useVbenModal({
  * @param row row
  */
 function handleHistory(row: any) {
-  historyModalApi.setData({ flowCode: row.flowCode });
+  historyModalApi.setData({ flowCode: row.flowCode, currentId: row.id });
   historyModalApi.open();
 }
 

apps/web-antd/src/views/workflow/processDefinition/process-definition-history-modal.vue

@@ -1,9 +1,23 @@
 <script setup lang="ts">
+import type { Recordable } from '@vben/types';
+
+import { useRouter } from 'vue-router';
+
 import { useVbenModal } from '@vben/common-ui';
 import { useVbenVxeGrid, type VxeGridProps } from '@vben/plugins/vxe-table';
+import { getVxePopupContainer } from '@vben/utils';
 
-import { getHisListByKey } from '#/api/workflow/definition';
+import { Popconfirm } from 'ant-design-vue';
 
+import {
+  getHisListByKey,
+  workflowDefinitionActive,
+  workflowDefinitionCopy,
+  workflowDefinitionDelete,
+  workflowDefinitionPublish,
+} from '#/api/workflow/definition';
+
+import { ActivityStatusEnum } from './constant';
 import { columns } from './data';
 
 const [BasicModal, modalApi] = useVbenModal({
@@ -14,10 +28,14 @@ const [BasicModal, modalApi] = useVbenModal({
     if (!isOpen) {
       return null;
     }
-    const { flowCode } = modalApi.getData() as { flowCode: string };
+    const { flowCode, currentId } = modalApi.getData() as {
+      currentId: string;
+      flowCode: string;
+    };
     const resp = await getHisListByKey(flowCode);
+    const omitCurrentList = resp.filter((item) => item.id !== currentId);
     // eslint-disable-next-line no-use-before-define
-    await tableApi.grid.loadData(resp);
+    await tableApi.grid.loadData(omitCurrentList);
   },
 });
 
@@ -52,11 +70,116 @@ const gridOptions: VxeGridProps = {
 const [BasicTable, tableApi] = useVbenVxeGrid({
   gridOptions,
 });
+
+/**
+ * 发布流程
+ * @param row row
+ */
+async function handlePublish(row: any) {
+  await workflowDefinitionPublish(row.id);
+  await tableApi.query();
+}
+
+const router = useRouter();
+/**
+ * 流程设计/预览
+ * @param row row
+ * @param disabled true为预览，false为设计
+ */
+function handleDesign(row: any, disabled: boolean) {
+  router.push({
+    path: '/workflow/designer',
+    query: { definitionId: row.id, disabled: String(disabled) },
+  });
+}
+
+async function handleDelete(row: Recordable<any>) {
+  await workflowDefinitionDelete(row.id);
+  await tableApi.query();
+}
+
+/**
+ * 复制流程
+ * @param row row
+ */
+async function handleCopy(row: any) {
+  await workflowDefinitionCopy(row.id);
+  await tableApi.query();
+}
+
+/**
+ * 激活/挂起流程
+ * @param row row
+ */
+async function handleActive(row: any) {
+  await workflowDefinitionActive(row.id, !row.activityStatus);
+  await tableApi.query();
+}
 </script>
 
 <template>
   <BasicModal>
     <!-- TODO: 添加操作列 -->
-    <BasicTable />
+    <BasicTable>
+      <template #action="{ row }">
+        <div class="flex flex-col gap-1">
+          <div>
+            <a-button
+              v-if="row.activityStatus === ActivityStatusEnum.Active"
+              size="small"
+              type="link"
+              @click="() => handleActive(row)"
+            >
+              挂起流程
+            </a-button>
+            <a-button
+              v-if="row.activityStatus === ActivityStatusEnum.Suspended"
+              size="small"
+              type="link"
+              @click="() => handleActive(row)"
+            >
+              激活流程
+            </a-button>
+            <Popconfirm
+              :get-popup-container="getVxePopupContainer"
+              placement="left"
+              title="确认删除？"
+              @confirm="handleDelete(row)"
+            >
+              <a-button danger size="small" type="link" @click.stop="">
+                删除流程
+              </a-button>
+            </Popconfirm>
+          </div>
+          <div>
+            <a-button
+              size="small"
+              type="link"
+              @click="handleDesign(row, !!row.isPublish)"
+            >
+              {{ row.isPublish ? '查看流程' : '设计流程' }}
+            </a-button>
+            <Popconfirm
+              :get-popup-container="getVxePopupContainer"
+              :title="`确认发布流程[${row.flowName}]?`"
+              placement="left"
+              @confirm="handlePublish(row)"
+            >
+              <a-button v-if="!row.isPublish" size="small" type="link">
+                发布流程
+              </a-button>
+            </Popconfirm>
+            <Popconfirm
+              :get-popup-container="getVxePopupContainer"
+              :title="`确认复制流程[${row.flowName}]?`"
+              placement="left"
+              @confirm="handleCopy(row)"
+            >
+              <a-button size="small" type="link"> 复制流程 </a-button>
+            </Popconfirm>
+          </div>
+        </div>
+      </template>
+    </BasicTable>
   </BasicModal>
 </template>