oneos-v5/frontend
1
0
Fork 0
Code Issues Pull Requests Actions 4 Packages Projects Releases Wiki Activity

refactor: bpm

Browse Source
This commit is contained in:
xingyu4j
2025-06-06 20:45:45 +08:00
parent 7e8f2a1328
commit 2c3dd668e3
47 changed files with 1454 additions and 1898 deletions
Download Patch File Download Diff File Expand all files Collapse all files

43
apps/web-antd/src/views/bpm/task/copy/data.ts
View File

@@ -1,13 +1,8 @@
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 type { VxeTableGridOptions } from '#/adapter/vxe-table';
import { getRangePickerDefaultProps } from '#/utils';
const { hasAccessByCodes } = useAccess();
/** 列表的搜索表单 */
export function useGridFormSchema(): VbenFormSchema[] {
return [
@@ -32,9 +27,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
}
/** 列表的字段 */
export function useGridColumns<T = BpmTaskApi.TaskVO>(
onActionClick: OnActionClickFn<T>,
): VxeTableGridOptions['columns'] {
export function useGridColumns(): VxeTableGridOptions['columns'] {
return [
{
field: 'processInstanceName',
@@ -46,8 +39,12 @@ export function useGridColumns<T = BpmTaskApi.TaskVO>(
field: 'summary',
title: '摘要',
minWidth: 200,
slots: {
default: 'slot-summary',
formatter: ({ cellValue }) => {
return cellValue && cellValue.length > 0
? cellValue
.map((item: any) => `${item.key} : ${item.value}`)
.join('\n')
: '-';
},
},
{
@@ -70,8 +67,8 @@ export function useGridColumns<T = BpmTaskApi.TaskVO>(
field: 'createUser.nickname',
title: '抄送人',
minWidth: 180,
slots: {
default: 'slot-createUser',
formatter: ({ cellValue }) => {
return cellValue || '-';
},
},
{
@@ -86,26 +83,10 @@ export function useGridColumns<T = BpmTaskApi.TaskVO>(
formatter: 'formatDateTime',
},
{
field: 'operation',
title: '操作',
minWidth: 120,
align: 'center',
width: 120,
fixed: 'right',
cellRender: {
attrs: {
nameField: 'name',
nameTitle: '流程名称',
onClick: onActionClick,
},
name: 'CellOperation',
options: [
{
code: 'detail',
text: '详情',
show: hasAccessByCodes(['bpm:task:query']),
},
],
},
slots: { default: 'actions' },
},
];
}

85
apps/web-antd/src/views/bpm/task/copy/index.vue
View File

@@ -1,13 +1,10 @@
<script lang="ts" setup>
import type {
OnActionClickParams,
VxeTableGridOptions,
} from '#/adapter/vxe-table';
import type { VxeTableGridOptions } from '#/adapter/vxe-table';
import type { BpmProcessInstanceApi } from '#/api/bpm/processInstance';
import { Page } from '@vben/common-ui';
import { useVbenVxeGrid } from '#/adapter/vxe-table';
import { ACTION_ICON, TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
import { getProcessInstanceCopyPage } from '#/api/bpm/processInstance';
import { DocAlert } from '#/components/doc-alert';
import { router } from '#/router';
@@ -16,12 +13,24 @@ import { useGridColumns, useGridFormSchema } from './data';
defineOptions({ name: 'BpmCopyTask' });
const [Grid, gridApi] = useVbenVxeGrid({
/** 任务详情 */
function handleDetail(row: BpmProcessInstanceApi.CopyVO) {
const query = {
id: row.processInstanceId,
...(row.activityId && { activityId: row.activityId }),
};
router.push({
name: 'BpmProcessInstanceDetail',
query,
});
}
const [Grid] = useVbenVxeGrid({
formOptions: {
schema: useGridFormSchema(),
},
gridOptions: {
columns: useGridColumns(onActionClick),
columns: useGridColumns(),
height: 'auto',
keepSource: true,
proxyConfig: {
@@ -47,36 +56,6 @@ const [Grid, gridApi] = useVbenVxeGrid({
},
} as VxeTableGridOptions<BpmProcessInstanceApi.CopyVO>,
});
/** 表格操作按钮的回调函数 */
function onActionClick({
code,
row,
}: OnActionClickParams<BpmProcessInstanceApi.CopyVO>) {
switch (code) {
case 'detail': {
onDetail(row);
break;
}
}
}
/** 任务详情 */
function onDetail(row: BpmProcessInstanceApi.CopyVO) {
const query = {
id: row.processInstanceId,
...(row.activityId && { activityId: row.activityId }),
};
router.push({
name: 'BpmProcessInstanceDetail',
query,
});
}
/** 刷新表格 */
function onRefresh() {
gridApi.query();
}
</script>
<template>
@@ -88,27 +67,19 @@ function onRefresh() {
/>
</template>
<FormModal @success="onRefresh" />
<Grid table-title="抄送任务">
<!-- 摘要 -->
<template #slot-summary="{ row }">
<div
class="flex flex-col py-2"
v-if="row.summary && row.summary.length > 0"
>
<div v-for="(item, index) in row.summary" :key="index">
<span class="text-gray-500">
{{ item.key }} : {{ item.value }}
</span>
</div>
</div>
<div v-else>-</div>
</template>
<!-- 抄送人 -->
<template #slot-createUser="{ row }">
<span class="text-gray-500">
{{ row.createUser.nickname || '系统' }}
</span>
<template #actions="{ row }">
<TableAction
:actions="[
{
label: $t('common.detail'),
type: 'link',
icon: ACTION_ICON.VIEW,
auth: ['bpm:task:query'],
onClick: handleDetail.bind(null, row),
},
]"
/>
</template>
</Grid>
</Page>

51
apps/web-antd/src/views/bpm/task/done/data.ts
View File

@@ -1,14 +1,8 @@
import type { VbenFormSchema } from '#/adapter/form';
import type { OnActionClickFn, VxeTableGridOptions } from '#/adapter/vxe-table';
import type { BpmTaskApi } from '#/api/bpm/task';
import type { VxeTableGridOptions } from '#/adapter/vxe-table';
import { getCategorySimpleList } from '#/api/bpm/category';
import {
DICT_TYPE,
formatPast2,
getDictOptions,
getRangePickerDefaultProps,
} from '#/utils';
import { DICT_TYPE, getDictOptions, getRangePickerDefaultProps } from '#/utils';
/** 列表的搜索表单 */
export function useGridFormSchema(): VbenFormSchema[] {
@@ -69,9 +63,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
}
/** 列表的字段 */
export function useGridColumns<T = BpmTaskApi.TaskVO>(
onActionClick: OnActionClickFn<T>,
): VxeTableGridOptions['columns'] {
export function useGridColumns(): VxeTableGridOptions['columns'] {
return [
{
field: 'processInstance.name',
@@ -83,8 +75,12 @@ export function useGridColumns<T = BpmTaskApi.TaskVO>(
field: 'processInstance.summary',
title: '摘要',
minWidth: 200,
slots: {
default: 'slot-summary',
formatter: ({ cellValue }) => {
return cellValue && cellValue.length > 0
? cellValue
.map((item: any) => `${item.key} : ${item.value}`)
.join('\n')
: '-';
},
},
{
@@ -92,12 +88,6 @@ export function useGridColumns<T = BpmTaskApi.TaskVO>(
title: '发起人',
minWidth: 120,
},
{
field: 'createTime',
title: '发起时间',
minWidth: 180,
formatter: 'formatDateTime',
},
{
field: 'name',
title: '当前任务',
@@ -133,9 +123,7 @@ export function useGridColumns<T = BpmTaskApi.TaskVO>(
field: 'durationInMillis',
title: '耗时',
minWidth: 180,
formatter: ({ cellValue }) => {
return `${formatPast2(cellValue)}`;
},
formatter: 'formatPast2',
},
{
field: 'processInstanceId',
@@ -148,25 +136,10 @@ export function useGridColumns<T = BpmTaskApi.TaskVO>(
minWidth: 280,
},
{
field: 'operation',
title: '操作',
minWidth: 120,
align: 'center',
width: 120,
fixed: 'right',
cellRender: {
attrs: {
nameField: 'name',
nameTitle: '流程名称',
onClick: onActionClick,
},
name: 'CellOperation',
options: [
{
code: 'history',
text: '历史',
},
],
},
slots: { default: 'actions' },
},
];
}

79
apps/web-antd/src/views/bpm/task/done/index.vue
View File

@@ -1,13 +1,10 @@
<script lang="ts" setup>
import type {
OnActionClickParams,
VxeTableGridOptions,
} from '#/adapter/vxe-table';
import type { VxeTableGridOptions } from '#/adapter/vxe-table';
import type { BpmTaskApi } from '#/api/bpm/task';
import { Page } from '@vben/common-ui';
import { useVbenVxeGrid } from '#/adapter/vxe-table';
import { ACTION_ICON, TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
import { getTaskDonePage } from '#/api/bpm/task';
import { DocAlert } from '#/components/doc-alert';
import { router } from '#/router';
@@ -16,12 +13,23 @@ import { useGridColumns, useGridFormSchema } from './data';
defineOptions({ name: 'BpmDoneTask' });
const [Grid, gridApi] = useVbenVxeGrid({
/** 查看历史 */
function handleHistory(row: BpmTaskApi.TaskManagerVO) {
router.push({
name: 'BpmProcessInstanceDetail',
query: {
id: row.processInstance.id,
taskId: row.id,
},
});
}
const [Grid] = useVbenVxeGrid({
formOptions: {
schema: useGridFormSchema(),
},
gridOptions: {
columns: useGridColumns(onActionClick),
columns: useGridColumns(),
height: 'auto',
keepSource: true,
proxyConfig: {
@@ -47,33 +55,6 @@ const [Grid, gridApi] = useVbenVxeGrid({
},
} as VxeTableGridOptions<BpmTaskApi.TaskVO>,
});
/** 表格操作按钮的回调函数 */
function onActionClick({ code, row }: OnActionClickParams<BpmTaskApi.TaskVO>) {
switch (code) {
case 'history': {
onHistory(row);
break;
}
}
}
/** 查看历史 */
function onHistory(row: BpmTaskApi.TaskVO) {
console.warn(row);
router.push({
name: 'BpmProcessInstanceDetail',
query: {
id: row.processInstance.id,
taskId: row.id,
},
});
}
/** 刷新表格 */
function onRefresh() {
gridApi.query();
}
</script>
<template>
@@ -92,25 +73,17 @@ function onRefresh() {
</template>
<Grid table-title="已办任务">
<!-- 摘要 -->
<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 #actions="{ row }">
<TableAction
:actions="[
{
label: '历史',
type: 'link',
icon: ACTION_ICON.VIEW,
onClick: handleHistory.bind(null, row),
},
]"
/>
</template>
</Grid>
</Page>

32
apps/web-antd/src/views/bpm/task/manager/data.ts
View File

@@ -1,8 +1,7 @@
import type { VbenFormSchema } from '#/adapter/form';
import type { OnActionClickFn, VxeTableGridOptions } from '#/adapter/vxe-table';
import type { BpmTaskApi } from '#/api/bpm/task';
import type { VxeTableGridOptions } from '#/adapter/vxe-table';
import { DICT_TYPE, formatPast2, getRangePickerDefaultProps } from '#/utils';
import { DICT_TYPE, getRangePickerDefaultProps } from '#/utils';
/** 列表的搜索表单 */
export function useGridFormSchema(): VbenFormSchema[] {
@@ -28,9 +27,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
}
/** 列表的字段 */
export function useGridColumns<T = BpmTaskApi.TaskVO>(
onActionClick: OnActionClickFn<T>,
): VxeTableGridOptions['columns'] {
export function useGridColumns(): VxeTableGridOptions['columns'] {
return [
{
field: 'processInstance.name',
@@ -89,9 +86,7 @@ export function useGridColumns<T = BpmTaskApi.TaskVO>(
field: 'durationInMillis',
title: '耗时',
minWidth: 180,
formatter: ({ cellValue }) => {
return `${formatPast2(cellValue)}`;
},
formatter: 'formatPast2',
},
{
field: 'processInstanceId',
@@ -104,25 +99,10 @@ export function useGridColumns<T = BpmTaskApi.TaskVO>(
minWidth: 280,
},
{
field: 'operation',
title: '操作',
minWidth: 120,
align: 'center',
width: 120,
fixed: 'right',
cellRender: {
attrs: {
nameField: 'name',
nameTitle: '流程名称',
onClick: onActionClick,
},
name: 'CellOperation',
options: [
{
code: 'history',
text: '历史',
},
],
},
slots: { default: 'actions' },
},
];
}

59
apps/web-antd/src/views/bpm/task/manager/index.vue
View File

@@ -1,13 +1,10 @@
<script lang="ts" setup>
import type {
OnActionClickParams,
VxeTableGridOptions,
} from '#/adapter/vxe-table';
import type { VxeTableGridOptions } from '#/adapter/vxe-table';
import type { BpmTaskApi } from '#/api/bpm/task';
import { Page } from '@vben/common-ui';
import { useVbenVxeGrid } from '#/adapter/vxe-table';
import { ACTION_ICON, TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
import { getTaskManagerPage } from '#/api/bpm/task';
import { DocAlert } from '#/components/doc-alert';
import { router } from '#/router';
@@ -16,12 +13,22 @@ import { useGridColumns, useGridFormSchema } from './data';
defineOptions({ name: 'BpmManagerTask' });
/** 查看历史 */
function handleHistory(row: BpmTaskApi.TaskManagerVO) {
router.push({
name: 'BpmProcessInstanceDetail',
query: {
id: row.processInstance.id,
},
});
}
const [Grid] = useVbenVxeGrid({
formOptions: {
schema: useGridFormSchema(),
},
gridOptions: {
columns: useGridColumns(onActionClick),
columns: useGridColumns(),
height: 'auto',
keepSource: true,
proxyConfig: {
@@ -47,30 +54,6 @@ const [Grid] = useVbenVxeGrid({
},
} as VxeTableGridOptions<BpmTaskApi.TaskManagerVO>,
});
/** 表格操作按钮的回调函数 */
function onActionClick({
code,
row,
}: OnActionClickParams<BpmTaskApi.TaskManagerVO>) {
switch (code) {
case 'history': {
onHistory(row);
break;
}
}
}
/** 查看历史 */
function onHistory(row: BpmTaskApi.TaskManagerVO) {
console.warn(row);
router.push({
name: 'BpmProcessInstanceDetail',
query: {
id: row.processInstance.id,
},
});
}
</script>
<template>
@@ -78,6 +61,20 @@ function onHistory(row: BpmTaskApi.TaskManagerVO) {
<template #doc>
<DocAlert title="工作流手册" url="https://doc.iocoder.cn/bpm/" />
</template>
<Grid table-title="流程任务" />
<Grid table-title="流程任务">
<template #actions="{ row }">
<TableAction
:actions="[
{
label: '历史',
type: 'link',
icon: ACTION_ICON.VIEW,
auth: ['bpm:task:query'],
onClick: handleHistory.bind(null, row),
},
]"
/>
</template>
</Grid>
</Page>
</template>

68
apps/web-antd/src/views/bpm/task/todo/data.ts
View File

@@ -1,16 +1,9 @@
import type { VbenFormSchema } from '#/adapter/form';
import type { OnActionClickFn, VxeTableGridOptions } from '#/adapter/vxe-table';
import type { BpmTaskApi } from '#/api/bpm/task';
import { h } from 'vue';
import { useAccess } from '@vben/access';
import type { VxeTableGridOptions } from '#/adapter/vxe-table';
import { getCategorySimpleList } from '#/api/bpm/category';
import { DICT_TYPE, getDictOptions, getRangePickerDefaultProps } from '#/utils';
const { hasAccessByCodes } = useAccess();
/** 列表的搜索表单 */
export function useGridFormSchema(): VbenFormSchema[] {
return [
@@ -69,9 +62,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
}
/** 列表的字段 */
export function useGridColumns<T = BpmTaskApi.TaskVO>(
onActionClick: OnActionClickFn<T>,
): VxeTableGridOptions['columns'] {
export function useGridColumns(): VxeTableGridOptions['columns'] {
return [
{
field: 'processInstance.name',
@@ -83,29 +74,12 @@ export function useGridColumns<T = BpmTaskApi.TaskVO>(
field: 'processInstance.summary',
title: '摘要',
minWidth: 200,
slots: {
default: ({ row }) => {
const summary = row?.processInstance?.summary;
if (!summary || summary.length === 0) {
return '-';
}
return summary.map((item: any) => {
return h(
'div',
{
key: item.key,
},
h(
'span',
{
class: 'text-gray-500',
},
`${item.key} : ${item.value}`,
),
);
});
},
formatter: ({ cellValue }) => {
return cellValue && cellValue.length > 0
? cellValue
.map((item: any) => `${item.key} : ${item.value}`)
.join('\n')
: '-';
},
},
{
@@ -113,12 +87,6 @@ export function useGridColumns<T = BpmTaskApi.TaskVO>(
title: '发起人',
minWidth: 120,
},
{
field: 'createTime',
title: '发起时间',
minWidth: 180,
formatter: 'formatDateTime',
},
{
field: 'name',
title: '当前任务',
@@ -141,26 +109,10 @@ export function useGridColumns<T = BpmTaskApi.TaskVO>(
minWidth: 280,
},
{
field: 'operation',
title: '操作',
minWidth: 120,
align: 'center',
width: 120,
fixed: 'right',
cellRender: {
attrs: {
nameField: 'name',
nameTitle: '流程名称',
onClick: onActionClick,
},
name: 'CellOperation',
options: [
{
code: 'audit',
text: '办理',
show: hasAccessByCodes(['bpm:task:query']),
},
],
},
slots: { default: 'actions' },
},
];
}

66
apps/web-antd/src/views/bpm/task/todo/index.vue
View File

@@ -1,13 +1,10 @@
<script lang="ts" setup>
import type {
OnActionClickParams,
VxeTableGridOptions,
} from '#/adapter/vxe-table';
import type { VxeTableGridOptions } from '#/adapter/vxe-table';
import type { BpmTaskApi } from '#/api/bpm/task';
import { Page } from '@vben/common-ui';
import { useVbenVxeGrid } from '#/adapter/vxe-table';
import { ACTION_ICON, TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
import { getTaskTodoPage } from '#/api/bpm/task';
import { DocAlert } from '#/components/doc-alert';
import { router } from '#/router';
@@ -16,12 +13,24 @@ import { useGridColumns, useGridFormSchema } from './data';
defineOptions({ name: 'BpmTodoTask' });
const [Grid, gridApi] = useVbenVxeGrid({
/** 办理任务 */
function handleAudit(row: BpmTaskApi.TaskVO) {
console.warn(row);
router.push({
name: 'BpmProcessInstanceDetail',
query: {
id: row.processInstance.id,
taskId: row.id,
},
});
}
const [Grid] = useVbenVxeGrid({
formOptions: {
schema: useGridFormSchema(),
},
gridOptions: {
columns: useGridColumns(onActionClick),
columns: useGridColumns(),
height: 'auto',
keepSource: true,
proxyConfig: {
@@ -47,33 +56,6 @@ const [Grid, gridApi] = useVbenVxeGrid({
},
} as VxeTableGridOptions<BpmTaskApi.TaskVO>,
});
/** 表格操作按钮的回调函数 */
function onActionClick({ code, row }: OnActionClickParams<BpmTaskApi.TaskVO>) {
switch (code) {
case 'audit': {
onAudit(row);
break;
}
}
}
/** 办理任务 */
function onAudit(row: BpmTaskApi.TaskVO) {
console.warn(row);
router.push({
name: 'BpmProcessInstanceDetail',
query: {
id: row.processInstance.id,
taskId: row.id,
},
});
}
/** 刷新表格 */
function onRefresh() {
gridApi.query();
}
</script>
<template>
@@ -90,6 +72,20 @@ function onRefresh() {
/>
<DocAlert title="审批加签、减签" url="https://doc.iocoder.cn/bpm/sign/" />
</template>
<Grid table-title="待办任务" />
<Grid table-title="待办任务">
<template #actions="{ row }">
<TableAction
:actions="[
{
label: '办理',
type: 'link',
icon: ACTION_ICON.VIEW,
auth: ['bpm:task:query'],
onClick: handleAudit.bind(null, row),
},
]"
/>
</template>
</Grid>
</Page>
</template>