feat: 修改流程列表页面，去掉左侧的类别树
This commit is contained in:
gaoyunqi
@ -1,11 +1,6 @@
|
||||
import type { AppRouteRecordRaw } from '/@/router/types';
|
||||
import { t } from '/@/hooks/web/useI18n';
|
||||
import {
|
||||
REDIRECT_NAME,
|
||||
LAYOUT,
|
||||
EXCEPTION_COMPONENT,
|
||||
PAGE_NOT_FOUND_NAME,
|
||||
} from '/@/router/constant';
|
||||
import { REDIRECT_NAME, LAYOUT, EXCEPTION_COMPONENT, PAGE_NOT_FOUND_NAME } from '/@/router/constant';
|
||||
import { PageEnum } from '/@/enums/pageEnum';
|
||||
|
||||
// 404 on a page
|
||||
@ -16,7 +11,7 @@ export const PAGE_NOT_FOUND_ROUTE: AppRouteRecordRaw = {
|
||||
meta: {
|
||||
title: 'ErrorPage',
|
||||
hideBreadcrumb: true,
|
||||
hideMenu: true,
|
||||
hideMenu: true
|
||||
},
|
||||
children: [
|
||||
{
|
||||
@ -26,10 +21,10 @@ export const PAGE_NOT_FOUND_ROUTE: AppRouteRecordRaw = {
|
||||
meta: {
|
||||
title: 'ErrorPage',
|
||||
hideBreadcrumb: true,
|
||||
hideMenu: true,
|
||||
},
|
||||
},
|
||||
],
|
||||
hideMenu: true
|
||||
}
|
||||
}
|
||||
]
|
||||
};
|
||||
|
||||
export const REDIRECT_ROUTE: AppRouteRecordRaw = {
|
||||
@ -39,7 +34,7 @@ export const REDIRECT_ROUTE: AppRouteRecordRaw = {
|
||||
meta: {
|
||||
title: REDIRECT_NAME,
|
||||
hideBreadcrumb: true,
|
||||
hideMenu: true,
|
||||
hideMenu: true
|
||||
},
|
||||
children: [
|
||||
{
|
||||
@ -48,10 +43,10 @@ export const REDIRECT_ROUTE: AppRouteRecordRaw = {
|
||||
component: () => import('/@/views/sys/redirect/index.vue'),
|
||||
meta: {
|
||||
title: REDIRECT_NAME,
|
||||
hideBreadcrumb: true,
|
||||
},
|
||||
},
|
||||
],
|
||||
hideBreadcrumb: true
|
||||
}
|
||||
}
|
||||
]
|
||||
};
|
||||
|
||||
export const ERROR_LOG_ROUTE: AppRouteRecordRaw = {
|
||||
@ -62,7 +57,7 @@ export const ERROR_LOG_ROUTE: AppRouteRecordRaw = {
|
||||
meta: {
|
||||
title: 'ErrorLog',
|
||||
hideBreadcrumb: true,
|
||||
hideChildrenInMenu: true,
|
||||
hideChildrenInMenu: true
|
||||
},
|
||||
children: [
|
||||
{
|
||||
@ -72,10 +67,10 @@ export const ERROR_LOG_ROUTE: AppRouteRecordRaw = {
|
||||
meta: {
|
||||
title: t('错误日志列表'),
|
||||
hideBreadcrumb: true,
|
||||
currentActiveMenu: '/error-log',
|
||||
},
|
||||
},
|
||||
],
|
||||
currentActiveMenu: '/error-log'
|
||||
}
|
||||
}
|
||||
]
|
||||
};
|
||||
|
||||
export const SYSTEM_ROUTE: AppRouteRecordRaw = {
|
||||
@ -86,7 +81,7 @@ export const SYSTEM_ROUTE: AppRouteRecordRaw = {
|
||||
meta: {
|
||||
orderNo: 10,
|
||||
icon: 'ion:grid-outline',
|
||||
title: t('分析页'),
|
||||
title: t('分析页')
|
||||
},
|
||||
children: [
|
||||
{
|
||||
@ -95,18 +90,18 @@ export const SYSTEM_ROUTE: AppRouteRecordRaw = {
|
||||
component: () => import('/@/views/dashboard/analysis/index.vue'),
|
||||
meta: {
|
||||
affix: true,
|
||||
title: t('分析页'),
|
||||
},
|
||||
title: t('分析页')
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'workbench',
|
||||
name: 'Workbench',
|
||||
component: () => import('/@/views/dashboard/workbench/index.vue'),
|
||||
meta: {
|
||||
title: t('工作台'),
|
||||
},
|
||||
},
|
||||
],
|
||||
title: t('工作台')
|
||||
}
|
||||
}
|
||||
]
|
||||
};
|
||||
|
||||
export const USERCENTER_ROUTE: AppRouteRecordRaw = {
|
||||
@ -115,7 +110,7 @@ export const USERCENTER_ROUTE: AppRouteRecordRaw = {
|
||||
component: LAYOUT,
|
||||
redirect: PageEnum.USER_CENTER,
|
||||
meta: {
|
||||
title: t('用户中心'),
|
||||
title: t('用户中心')
|
||||
},
|
||||
children: [
|
||||
{
|
||||
@ -124,17 +119,17 @@ export const USERCENTER_ROUTE: AppRouteRecordRaw = {
|
||||
component: () => import('/@/views/system/setting/index.vue'),
|
||||
meta: {
|
||||
title: t('用户中心'),
|
||||
icon: 'ant-design:user-outlined',
|
||||
},
|
||||
},
|
||||
],
|
||||
icon: 'ant-design:user-outlined'
|
||||
}
|
||||
}
|
||||
]
|
||||
};
|
||||
|
||||
export const FLOW_ROUTE: AppRouteRecordRaw = {
|
||||
path: '/flow',
|
||||
name: 'Flow',
|
||||
meta: {
|
||||
title: '流程',
|
||||
title: '流程'
|
||||
},
|
||||
component: LAYOUT,
|
||||
children: [
|
||||
@ -143,8 +138,24 @@ export const FLOW_ROUTE: AppRouteRecordRaw = {
|
||||
name: 'CreateFlow',
|
||||
component: () => import('/@/views/secondDev/createFlow.vue'),
|
||||
meta: {
|
||||
title: '新建流程',
|
||||
title: '新建流程'
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'approveFlow',
|
||||
name: 'ApproveFlow',
|
||||
component: () => import('/@/views/secondDev/approveFlow.vue'),
|
||||
meta: {
|
||||
title: '审批流程'
|
||||
}
|
||||
},
|
||||
],
|
||||
{
|
||||
path: 'flowList',
|
||||
name: 'FlowListPage',
|
||||
component: () => import('/@/views/secondDev/processTasksPage.vue'),
|
||||
meta: {
|
||||
title: '流程列表'
|
||||
}
|
||||
}
|
||||
]
|
||||
};
|
||||
|
||||
117
src/views/secondDev/processTasksPage.vue
Normal file
117
src/views/secondDev/processTasksPage.vue
Normal file
@ -0,0 +1,117 @@
|
||||
<template>
|
||||
<PageWrapper contentClass="flex" contentFullHeight dense fixedHeight>
|
||||
<component :is="data.componentName" />
|
||||
</PageWrapper>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { reactive, shallowRef, defineAsyncComponent, unref, ref } from 'vue';
|
||||
import { PageWrapper } from '/@/components/Page';
|
||||
import ToDoTasks from '/@/views/workflow/task/components/processTasks/ToDoTasks.vue';
|
||||
import { useRouter } from 'vue-router';
|
||||
import { useI18n } from '/@/hooks/web/useI18n';
|
||||
import { useMultipleTabStore } from '/@/store/modules/multipleTab';
|
||||
|
||||
const { t } = useI18n();
|
||||
const { currentRoute } = useRouter();
|
||||
const tabStore = useMultipleTabStore();
|
||||
|
||||
const FlowLaunch = defineAsyncComponent({
|
||||
loader: () => import('../workflow/task/FlowLaunch.vue')
|
||||
});
|
||||
|
||||
const MyProcess = defineAsyncComponent({
|
||||
loader: () => import('../workflow/task/components/processTasks/MyProcess.vue')
|
||||
});
|
||||
const TaskDone = defineAsyncComponent({
|
||||
loader: () => import('../workflow/task/components/processTasks/TaskDone.vue')
|
||||
});
|
||||
|
||||
const RecycleBin = defineAsyncComponent({
|
||||
loader: () => import('../workflow/task/components/processTasks/RecycleBin.vue')
|
||||
});
|
||||
|
||||
const MyCirculation = defineAsyncComponent({
|
||||
loader: () => import('../workflow/task/components/processTasks/MyCirculation.vue')
|
||||
});
|
||||
|
||||
const Drafts = defineAsyncComponent({
|
||||
loader: () => import('../workflow/task/components/processTasks/Drafts.vue')
|
||||
});
|
||||
const componentByType: Map<string, any> = new Map([
|
||||
['ToDoTasks', ToDoTasks],
|
||||
['FlowLaunch', FlowLaunch],
|
||||
['TaskDone', TaskDone],
|
||||
['MyProcess', MyProcess],
|
||||
['RecycleBin', RecycleBin],
|
||||
['MyCirculation', MyCirculation],
|
||||
['Drafts', Drafts]
|
||||
]);
|
||||
|
||||
const treeData = [
|
||||
{
|
||||
key: 'ToDoTasks',
|
||||
id: 'ToDoTasks',
|
||||
name: t('待办任务'),
|
||||
icon: 'ant-design:profile-outlined'
|
||||
},
|
||||
{
|
||||
key: 'FlowLaunch',
|
||||
id: 'FlowLaunch',
|
||||
name: t('发起流程'),
|
||||
icon: 'ant-design:profile-outlined'
|
||||
},
|
||||
{
|
||||
key: 'TaskDone',
|
||||
id: 'TaskDone',
|
||||
name: t('已办任务'),
|
||||
icon: 'ant-design:profile-outlined'
|
||||
},
|
||||
{
|
||||
key: 'MyProcess',
|
||||
id: 'MyProcess',
|
||||
name: t('我的流程'),
|
||||
icon: 'ant-design:profile-outlined'
|
||||
},
|
||||
{
|
||||
key: 'MyCirculation',
|
||||
id: 'MyCirculation',
|
||||
name: t('我的传阅'),
|
||||
icon: 'ant-design:profile-outlined'
|
||||
},
|
||||
{
|
||||
key: 'Drafts',
|
||||
id: 'Drafts',
|
||||
name: t('草稿箱'),
|
||||
icon: 'ant-design:profile-outlined'
|
||||
},
|
||||
{
|
||||
key: 'RecycleBin',
|
||||
id: 'RecycleBin',
|
||||
name: t('回收站'),
|
||||
icon: 'ant-design:profile-outlined'
|
||||
}
|
||||
];
|
||||
const selectedKeys = ref(['ToDoTasks']);
|
||||
const query = unref(currentRoute).query;
|
||||
let id = query.name;
|
||||
const tabKey = query.tabKey as string;
|
||||
let data = reactive({
|
||||
componentName: shallowRef(ToDoTasks)
|
||||
});
|
||||
if (id) {
|
||||
selectedKeys.value = [id.toString()];
|
||||
const tabName = treeData.find((item) => item.id === id)?.name;
|
||||
if (tabName && tabKey) {
|
||||
tabStore.changeTitle(tabKey, tabName);
|
||||
}
|
||||
handleSelect([id]);
|
||||
}
|
||||
|
||||
function handleSelect(componentRow) {
|
||||
if (componentRow.length > 0 && componentRow[0]) {
|
||||
data.componentName = componentByType.has(componentRow[0]) ? componentByType.get(componentRow[0]) : ToDoTasks;
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="less" scoped></style>
|
||||
Reference in New Issue
Block a user