GTsoft/ruoyi-plus-soybean
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat-wip(projects): 新增待办任务功能，优化代码

Browse Source
This commit is contained in:
AN 2025-06-22 12:33:56 +08:00
parent ae5c7e8372
commit b3dccb542e
15 changed files with 406 additions and 38 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
docs/sql/sys_menu.sql
View File

@ -38,6 +38,6 @@ UPDATE `sys_menu` SET `path` = 'https://gitee.com/xlsea/ruoyi-plus-soybean', `co
UPDATE `sys_menu` SET `status` = '1' WHERE `menu_id` IN ( '116', '130', '131', '132', '11700', '11701' );
-- 工作流菜单
UPDATE `ry-soy`.`sys_menu` SET `component` = 'workflow/design/index' WHERE `menu_id` = 11700;
UPDATE `sys_menu` SET `component` = 'workflow/design/index' WHERE `menu_id` = 11700;

5
src/components/custom/workflow/approval-info-panel.vue
View File

@ -1,6 +1,5 @@
<script setup lang="tsx">
import { ref } from 'vue';
import type { DataTableColumns } from 'naive-ui';
import { NPopover, NSpace, NTag } from 'naive-ui';
import { useLoading } from '@sa/hooks';
import { fetchGetFlowHisTaskList } from '@/service/api/workflow/instance';
@ -26,7 +25,7 @@ const { loading, startLoading, endLoading } = useLoading();
const { oss } = useDownload();
const columns = ref<DataTableColumns<Api.Workflow.HisTask>>([
const columns = ref<NaiveUI.TableColumn<Api.Workflow.HisTask>[]>([
{
title: '任务名称',
key: 'nodeName',
@ -180,7 +179,7 @@ async function getData() {
hisTask.value = [];
return;
}
const promises = rawList.map(async item => {
const promises = rawList.map(async (item: Api.Workflow.HisTask) => {
if (item.ext) {
const { error: err, data: ossList } = await fetchGetOssListByIds(item.ext.split(','));
if (!err) {

2
src/locales/langs/en-us.ts
View File

@ -238,6 +238,8 @@ const local: App.I18n.Schema = {
workflow_design: 'Process Design',
'workflow_process-definition': 'Process Definition',
'workflow_process-instance': 'Process Instance',
workflow_task: 'Task',
'workflow_task_all-task-waiting': 'All Task Waiting',
workflow_leave: 'Leave Apply'
},
menu: {

2
src/locales/langs/zh-cn.ts
View File

@ -238,6 +238,8 @@ const local: App.I18n.Schema = {
workflow_design: '流程设计',
'workflow_process-definition': '流程定义',
'workflow_process-instance': '流程实例',
workflow_task: '任务',
'workflow_task_all-task-waiting': '待办任务',
workflow_leave: '请假申请'
},
menu: {

1
src/router/elegant/imports.ts
View File

@ -48,4 +48,5 @@ export const views: Record<LastLevelRouteKey, RouteComponent | (() => Promise<Ro
workflow_leave: () => import("@/views/workflow/leave/index.vue"),
"workflow_process-definition": () => import("@/views/workflow/process-definition/index.vue"),
"workflow_process-instance": () => import("@/views/workflow/process-instance/index.vue"),
"workflow_task_all-task-waiting": () => import("@/views/workflow/task/all-task-waiting/index.vue"),
};

19
src/router/elegant/routes.ts
View File

@ -385,6 +385,25 @@ export const generatedRoutes: GeneratedRoute[] = [
title: 'workflow_process-instance',
i18nKey: 'route.workflow_process-instance'
}
},
{
name: 'workflow_task',
path: '/workflow/task',
meta: {
title: 'workflow_task',
i18nKey: 'route.workflow_task'
},
children: [
{
name: 'workflow_task_all-task-waiting',
path: '/workflow/task/all-task-waiting',
component: 'view.workflow_task_all-task-waiting',
meta: {
title: 'workflow_task_all-task-waiting',
i18nKey: 'route.workflow_task_all-task-waiting'
}
}
]
}
]
}

4
src/router/elegant/transform.ts
View File

@ -204,7 +204,9 @@ const routeMap: RouteMap = {
"workflow_design": "/workflow/design",
"workflow_leave": "/workflow/leave",
"workflow_process-definition": "/workflow/process-definition",
"workflow_process-instance": "/workflow/process-instance"
"workflow_process-instance": "/workflow/process-instance",
"workflow_task": "/workflow/task",
"workflow_task_all-task-waiting": "/workflow/task/all-task-waiting"
};
/**

18
src/service/api/workflow/task.ts
View File

@ -25,3 +25,21 @@ export function fetchCompleteTask(data: Api.Workflow.CompleteTaskOperateParams)
data
});
}
/** 获取所有待办任务 */
export function fetchGetAllWaitingTask(data: Api.Workflow.TaskSearchParams) {
return request<Api.Workflow.TaskList>({
url: '/workflow/task/pageByAllTaskWait',
method: 'get',
params: data
});
}
/** 获取所有已办任务 */
export function fetchGetAllFinishedTask(data: Api.Workflow.TaskSearchParams) {
return request<Api.Workflow.HisTaskList>({
url: '/workflow/task/pageByAllTaskFinish',
method: 'get',
params: data
});
}

20
src/typings/api/workflow.api.d.ts vendored
View File

@ -305,6 +305,10 @@ declare namespace Api {
/** 流程版本号 */
version: string;
}>;
/** 任务列表 */
type TaskList = Common.PaginatingQueryRecord<Task>;
/** 协作方式 */
type CooperateType = 1 | 2 | 3 | 4 | 5 | 6 | 7;
@ -378,11 +382,25 @@ declare namespace Api {
attachmentList: Api.System.Oss[];
}>;
type InstanceIdWithHisTask = CommonType.RecordNullable<{
/** 历史任务列表 */
type HisTaskList = Common.PaginatingQueryRecord<HisTask>;
/** 流程实例ID与历史任务 */
type InstanceIdWithHisTask = Common.CommonRecord<{
/** 流程实例ID */
instanceId: CommonType.IdType;
/** 历史任务 */
list: HisTask[];
}>;
/** 任务搜索参数 */
type TaskSearchParams = CommonType.RecordNullable<
Pick<Task, 'flowName' | 'flowCode' | 'businessId' | 'category' | 'nodeName'> &
Api.Common.CommonSearchParams & {
createByIds: CommonType.IdType[];
}
>;
/** 消息类型 */
type MessageType = '1' | '2' | '3';

3
src/typings/elegant-router.d.ts vendored
View File

@ -59,6 +59,8 @@ declare module "@elegant-router/types" {
"workflow_leave": "/workflow/leave";
"workflow_process-definition": "/workflow/process-definition";
"workflow_process-instance": "/workflow/process-instance";
"workflow_task": "/workflow/task";
"workflow_task_all-task-waiting": "/workflow/task/all-task-waiting";
};
/**
@ -157,6 +159,7 @@ declare module "@elegant-router/types" {
| "workflow_leave"
| "workflow_process-definition"
| "workflow_process-instance"
| "workflow_task_all-task-waiting"
>;
/**

11
src/views/workflow/leave/index.vue
View File

@ -168,12 +168,11 @@ const {
);
}
const buttonWithDividers = buttons.flatMap((btn, index) => {
if (index === 0) return [btn];
return [<NDivider vertical />, btn];
});
return <div class="flex-center gap-4px">{buttonWithDividers}</div>;
return (
<div class="flex-center gap-1px">
{buttons.map((btn, index) => (index > 0 ? [<NDivider vertical />, btn] : btn))}
</div>
);
}
}
]

28
src/views/workflow/process-definition/index.vue
View File

@ -102,9 +102,7 @@ const {
title: '版本号',
align: 'center',
minWidth: 120,
render(row) {
return <NTag type="info">v{row.version}.0</NTag>;
}
render: row => <NTag type="info">v{row.version}.0</NTag>
},
{
key: 'activityStatus',
@ -176,8 +174,8 @@ const {
width: 150,
fixed: 'right',
render: row => {
const buttons = [];
buttons.push(
const firstRowButtons = [];
firstRowButtons.push(
<ButtonIcon
text
type="primary"
@ -186,7 +184,7 @@ const {
onClick={() => edit(row.id)}
/>
);
buttons.push(
firstRowButtons.push(
<ButtonIcon
text
type="error"
@ -196,7 +194,7 @@ const {
onPositiveClick={() => handleDelete(row.id)}
/>
);
buttons.push(
firstRowButtons.push(
<ButtonIcon
text
type="primary"
@ -207,10 +205,9 @@ const {
/>
);
const firstRowButtons = buttons.flatMap((btn, index) => {
if (index === 0) return [btn];
return [<NDivider vertical />, btn];
});
const firstRowWithDividers = firstRowButtons.map((btn, index) =>
index > 0 ? [<NDivider vertical />, btn] : btn
);
const secondRowButtons = [];
@ -257,14 +254,13 @@ const {
);
}
const secondRowWithDividers = secondRowButtons.flatMap((btn, index) => {
if (index === 0) return [btn];
return [<NDivider vertical />, btn];
});
const secondRowWithDividers = secondRowButtons.map((btn, index) =>
index > 0 ? [<NDivider vertical />, btn] : btn
);
return (
<div class="flex-col">
<div class="h-[24px] flex-center gap-4px">{firstRowButtons}</div>
<div class="h-[24px] flex-center gap-4px">{firstRowWithDividers}</div>
<div class="h-[24px] flex-center gap-4px">{secondRowWithDividers}</div>
</div>
);

18
src/views/workflow/process-instance/index.vue
View File

@ -90,9 +90,7 @@ const baseColumns = ref<NaiveUI.TableColumn<Api.Workflow.ProcessInstance>[]>([
title: '流程分类',
align: 'center',
minWidth: 120,
render(row) {
return <NTag type="default">{row.categoryName}</NTag>;
}
render: row => <NTag type="default">{row.categoryName}</NTag>
},
{
key: 'createByName',
@ -104,7 +102,8 @@ const baseColumns = ref<NaiveUI.TableColumn<Api.Workflow.ProcessInstance>[]>([
key: 'version',
title: '版本号',
align: 'center',
width: 80
width: 80,
render: row => <NTag type="info">v{row.version}.0</NTag>
},
{
key: 'activityStatus',
@ -205,12 +204,11 @@ const operateColumns = ref<NaiveUI.TableColumn<Api.Workflow.ProcessInstance>[]>(
);
}
const buttonWithDividers = buttons.flatMap((btn, index) => {
if (index === 0) return [btn];
return [<NDivider vertical />, btn];
});
return <div class="flex-center gap-1px">{buttonWithDividers}</div>;
return (
<div class="flex-center gap-1px">
{buttons.map((btn, index) => (index > 0 ? [<NDivider vertical />, btn] : btn))}
</div>
);
}
}
]);

248
src/views/workflow/task/all-task-waiting/index.vue Normal file
View File

@ -0,0 +1,248 @@
<script setup lang="tsx">
import { computed, ref, watch } from 'vue';
import { NButton, NDivider, NEmpty, NInput, NRadioButton, NRadioGroup, NTag } from 'naive-ui';
import { useLoading } from '@sa/hooks';
import { fetchGetAllFinishedTask, fetchGetAllWaitingTask } from '@/service/api/workflow/task';
import { fetchGetCategoryTree } from '@/service/api/workflow/category';
import { useAppStore } from '@/store/modules/app';
import { useTable, useTableOperate } from '@/hooks/common/table';
import { useDict } from '@/hooks/business/dict';
import ButtonIcon from '@/components/custom/button-icon.vue';
import { $t } from '@/locales';
import AllTaskWaitingSearch from './modules/all-task-waiting-search.vue';
interface WaitingStatusOption {
label: string;
value: boolean;
}
// Create a union type to handle both Task and HisTask
type TaskOrHisTask = Api.Workflow.Task | Api.Workflow.HisTask;
defineOptions({
name: 'ProcessInstanceList'
});
useDict('wf_business_status');
const appStore = useAppStore();
const waitingStatus = ref<boolean>(true);
const waitingStatusOptions = ref<WaitingStatusOption[]>([
{ label: '待办任务', value: true },
{ label: '已办任务', value: false }
]);
// Common column definitions to reduce duplication
// Explicitly type as TableColumn<TaskOrHisTask> to ensure compatibility with both types
const commonColumns: NaiveUI.TableColumn<TaskOrHisTask>[] = [
{ type: 'selection', align: 'center', width: 50 },
{ key: 'flowName', title: '流程定义名称', align: 'center', width: 120 },
{ key: 'flowCode', title: '流程定义编码', align: 'center', width: 120 },
{ key: 'categoryName', title: '流程分类', align: 'center', width: 120 },
{
key: 'version',
title: '版本号',
align: 'center',
width: 120,
render: row => <NTag type="info">v{row.version}.0</NTag>
},
{ key: 'nodeName', title: '任务名称', align: 'center', width: 120 },
{ key: 'createByName', title: '申请人', align: 'center', width: 120 },
{ key: 'flowStatus', title: '流程状态', align: 'center', width: 120 }
];
// Waiting task specific columns
const waitingColumns = ref<NaiveUI.TableColumn<Api.Workflow.Task>[]>([
...(commonColumns as NaiveUI.TableColumn<Api.Workflow.Task>[]),
{ key: 'assigneeNames', title: '办理人', align: 'center', width: 120 },
{ key: 'createTime', title: '创建时间', align: 'center', width: 120 }
]);
// Finished task specific columns
const finishColumns = ref<NaiveUI.TableColumn<Api.Workflow.HisTask>[]>([
...(commonColumns as NaiveUI.TableColumn<Api.Workflow.HisTask>[]),
{ key: 'approveName', title: '办理人', align: 'center', width: 120 },
{ key: 'flowTaskStatus', title: '任务状态', align: 'center', width: 120 },
{ key: 'createTime', title: '创建时间', align: 'center', width: 120 }
]);
// Operation column with optimized render function
const operateColumns = ref<NaiveUI.TableColumn<TaskOrHisTask>[]>([
{
key: 'operate',
title: $t('common.operate'),
align: 'center',
fixed: 'right',
width: 120,
render: () => {
const buttons = [
<ButtonIcon text type="info" icon="material-symbols:visibility-outline" tooltipContent="查看" />
];
if (waitingStatus.value) {
buttons.push(<ButtonIcon text type="info" icon="material-symbols:edit-document" tooltipContent="流程干预" />);
}
return (
<div class="flex-center gap-1px">
{buttons.map((btn, index) => (index > 0 ? [<NDivider vertical />, btn] : btn))}
</div>
);
}
}
]);
const {
columns,
reloadColumns,
columnChecks,
data,
getData,
getDataByPage,
loading,
mobilePagination,
searchParams,
resetSearchParams,
updateApiFn
} = useTable({
apiFn: fetchGetAllWaitingTask,
apiParams: {
pageNum: 1,
pageSize: 10,
category: null,
flowName: null,
flowCode: null,
nodeName: null,
createByIds: null
},
columns: () => {
const baseColumns = waitingStatus.value ? waitingColumns.value : finishColumns.value;
return [...baseColumns, ...operateColumns.value] as NaiveUI.TableColumn<TaskOrHisTask>[];
}
});
const { checkedRowKeys, editingData: _editingData, handleEdit: _handleEdit } = useTableOperate(data, getData);
watch(waitingStatus, async () => {
const newApiFn = waitingStatus.value ? fetchGetAllWaitingTask : fetchGetAllFinishedTask;
// @ts-expect-error - This is a workaround for the type issue
updateApiFn(newApiFn);
await getDataByPage();
reloadColumns();
});
// Category tree handling
const { loading: treeLoading, startLoading: startTreeLoading, endLoading: endTreeLoading } = useLoading();
const categoryPattern = ref<string>();
const categoryData = ref<Api.Common.CommonTreeRecord>([]);
const selectedKeys = ref<string[]>([]);
const expandedKeys = ref<CommonType.IdType[]>(['100']);
const selectable = computed(() => !loading.value);
async function getTreeData() {
startTreeLoading();
const { data: tree, error } = await fetchGetCategoryTree();
if (!error) {
categoryData.value = tree;
}
endTreeLoading();
}
function handleClickTree(keys: string[]) {
searchParams.category = keys.length ? keys[0] : null;
checkedRowKeys.value = [];
getDataByPage();
}
function handleResetTreeData() {
categoryPattern.value = undefined;
getTreeData();
}
function handleResetSearch() {
resetSearchParams();
selectedKeys.value = [];
}
getTreeData();
</script>
<template>
<TableSiderLayout sider-title="流程分类列表">
<template #header-extra>
<NButton size="small" text class="h-18px" @click.stop="() => handleResetTreeData()">
<template #icon>
<SvgIcon icon="ic:round-refresh" />
</template>
</NButton>
</template>
<template #sider>
<NInput v-model:value="categoryPattern" clearable :placeholder="$t('common.keywordSearch')" />
<NSpin class="category-tree" :show="treeLoading">
<NTree
v-model:selected-keys="selectedKeys"
v-model:expanded-keys="expandedKeys"
block-node
show-line
:data="categoryData as []"
:show-irrelevant-nodes="false"
:pattern="categoryPattern"
class="infinite-scroll h-full min-h-200px py-3"
key-field="id"
label-field="label"
virtual-scroll
:selectable="selectable"
@update:selected-keys="handleClickTree"
>
<template #empty>
<NEmpty description="暂无分类信息" class="h-full min-h-200px justify-center" />
</template>
</NTree>
</NSpin>
</template>
<div class="h-full flex-col-stretch gap-12px overflow-hidden lt-sm:overflow-auto">
<AllTaskWaitingSearch v-model:model="searchParams" @reset="handleResetSearch" @search="getDataByPage" />
<NCard :bordered="false" size="small" class="sm:flex-1-hidden card-wrapper">
<template #header>
<NSpace>
<NRadioGroup v-model:value="waitingStatus" on-up size="small">
<NRadioButton
v-for="(status, index) in waitingStatusOptions"
:key="index"
:value="status.value"
:label="status.label"
/>
</NRadioGroup>
</NSpace>
</template>
<template #header-extra>
<TableHeaderOperation
v-model:columns="columnChecks"
:disabled-delete="checkedRowKeys.length === 0"
:loading="loading"
:show-add="false"
:show-delete="false"
:show-export="false"
@refresh="getData"
>
<template #prefix></template>
</TableHeaderOperation>
</template>
<NDataTable
v-model:checked-row-keys="checkedRowKeys"
:columns="columns"
:data="data"
size="small"
:flex-height="!appStore.isMobile"
:scroll-x="1405"
:loading="loading"
remote
:row-key="row => row.id"
:pagination="mobilePagination"
class="sm:h-full"
/>
</NCard>
</div>
</TableSiderLayout>
</template>

63
src/views/workflow/task/all-task-waiting/modules/all-task-waiting-search.vue Normal file
View File

@ -0,0 +1,63 @@
<script setup lang="tsx">
import { useNaiveForm } from '@/hooks/common/form';
defineOptions({
name: 'AllTaskWaitingSearch'
});
interface Emits {
(e: 'reset'): void;
(e: 'search'): void;
}
const emit = defineEmits<Emits>();
const { formRef, validate, restoreValidation } = useNaiveForm();
const model = defineModel<Api.Workflow.TaskSearchParams>('model', { required: true });
async function reset() {
await restoreValidation();
emit('reset');
}
async function search() {
await validate();
emit('search');
}
</script>
<template>
<NCard :bordered="false" size="small" class="card-wrapper">
<NCollapse>
<NCollapseItem :title="$t('common.search')">
<NForm ref="formRef" :model="model" label-placement="left" :label-width="100">
<NGrid responsive="screen" item-responsive>
<NFormItemGi span="6 s:12 m:6" label="任务名称" path="nodeName" class="pr-24px">
<NInput v-model:value="model.nodeName" placeholder="请输入任务名称" />
</NFormItemGi>
<NFormItemGi span="6 s:12 m:6" label="流程定义名称" path="bucketName" class="pr-24px">
<NInput v-model:value="model.flowName" placeholder="请输入流程定义名称" />
</NFormItemGi>
<NFormItemGi span="6 s:12 m:6" label="流程定义编码" path="flowCode" class="pr-24px">
<NInput v-model:value="model.flowCode" placeholder="流程定义编码" />
</NFormItemGi>
<NFormItemGi span="6" class="pr-24px">
<NSpace class="w-full" justify="end">
<NButton @click="reset">
<template #icon>
<icon-ic-round-refresh class="text-icon" />
</template>
{{ $t('common.reset') }}
</NButton>
<NButton type="primary" ghost @click="search">
<template #icon>
<icon-ic-round-search class="text-icon" />
</template>
{{ $t('common.search') }}
</NButton>
</NSpace>
</NFormItemGi>
</NGrid>
</NForm>
</NCollapseItem>
</NCollapse>
</NCard>
</template>