fix: 增加已办页面的独立链接

fix: 组织管理的主列表改为懒加载
This commit is contained in:
gaoyunqi
2024-07-22 19:46:51 +08:00
parent 8034e9b090
commit 6c5b4b6272
5 changed files with 384 additions and 244 deletions

View File

@ -67,7 +67,7 @@ function handleIndexColumn(
flag: INDEX_COLUMN_FLAG,
width: 50,
title: t('序号'),
align: 'right',
align: 'center',
customRender: ({ index }) => {
const getPagination = unref(getPaginationRef);
if (isBoolean(getPagination)) {

View File

@ -182,6 +182,14 @@ export const FLOW_ROUTE: AppRouteRecordRaw[] = [{
meta: {
title: '我发起的'
}
},
{
path: 'done',
name: 'FlowListPage4',
component: () => import('/@/views/secondDev/processTasksPage.vue'),
meta: {
title: '已办'
}
}
]
}, {

View File

@ -24,7 +24,7 @@
loader: () => import('../workflow/task/components/processTasks/MyProcessV2.vue')
});
const TaskDone = defineAsyncComponent({
loader: () => import('../workflow/task/components/processTasks/TaskDone.vue')
loader: () => import('../workflow/task/components/processTasks/TaskDoneV2.vue')
});
const RecycleBin = defineAsyncComponent({
@ -100,6 +100,8 @@
id = 'Drafts';
} else if (lHash.indexOf('/myProcess') > 0) {
id = 'MyProcess';
} else if (lHash.indexOf('/done') > 0) {
id = 'TaskDone';
}
let data = reactive({
componentName: shallowRef(ToDoTasks)

View File

@ -1,15 +1,15 @@
<template>
<PageWrapper dense contentFullHeight fixedHeight>
<BasicTable @register="registerTable">
<PageWrapper contentFullHeight dense fixedHeight>
<BasicTable @expand="handleExpand" @register="registerTable">
<template #toolbar>
<a-button type="primary" v-auth="'department:add'" @click="handleCreate">
<a-button v-auth="'department:add'" type="primary" @click="handleCreate">
{{ t('新增组织') }}
</a-button>
</template>
<template #bodyCell="{ column, record }">
<template v-if="column.dataIndex == 'name'">
<a-tag color="processing" v-if="record.departmentType === 1">公司</a-tag>
<a-tag color="warning" v-else-if="record.departmentType === 0">部门</a-tag>
<a-tag v-if="record.departmentType === 1" color="processing">公司</a-tag>
<a-tag v-else-if="record.departmentType === 0" color="warning">部门</a-tag>
&nbsp;{{ record.name }}
</template>
<template v-if="column.dataIndex == 'action'">
@ -19,12 +19,12 @@
icon: 'ant-design:user-add-outlined',
auth: 'department:addUser',
tooltip: '添加人员',
onClick: handleAddUser.bind(null, record),
onClick: handleAddUser.bind(null, record)
},
{
icon: 'clarity:note-edit-line',
auth: 'department:edit',
onClick: handleEdit.bind(null, record),
onClick: handleEdit.bind(null, record)
},
{
icon: 'ant-design:delete-outlined',
@ -32,9 +32,9 @@
auth: 'department:delete',
popConfirm: {
title: t('是否确认删除'),
confirm: handleDelete.bind(null, record),
},
},
confirm: handleDelete.bind(null, record)
}
}
]"
/>
</template>
@ -43,16 +43,16 @@
<DeptDrawer @register="registerDrawer" @success="handleSuccess" />
<SelectMember
v-if="visible"
:visible="visible"
:isShowTree="false"
:multiple="true"
:selectedIds="selectedUserIds"
:isShowTree="false"
:visible="visible"
@change="handleDeptUser"
@close="
() => {
visible = false;
}
"
@change="handleDeptUser"
/>
</PageWrapper>
</template>
@ -68,13 +68,9 @@
import { useMessage } from '/@/hooks/web/useMessage';
// import { useI18n } from 'vue-i18n';
import { SelectMember } from '/@/components/SelectOrganizational/index';
import {
deleteDepartment,
getDepartmentEnabledTree,
getDepartmentUserList,
updateDepartmentUser,
} from '/@/api/system/department';
import { deleteDepartment, getDepartmentEnabledTree, getDepartmentTrees, getDepartmentUserList, updateDepartmentUser } from '/@/api/system/department';
import { useI18n } from '/@/hooks/web/useI18n';
const { t } = useI18n();
export const columns: BasicColumn[] = [
{
@ -82,14 +78,14 @@
dataIndex: 'name',
width: 400,
align: 'left',
sorter: true,
sorter: true
},
{
title: '组织编码',
dataIndex: 'code',
sorter: true,
align: 'left',
width: 100,
width: 100
},
{
@ -102,41 +98,41 @@
const enabledMark = record.enabledMark == 1 ? true : false;
return h(Switch, { checked: enabledMark });
},
}
},
{
title: t('主页'),
dataIndex: 'website',
width: 200,
align: 'left',
sorter: true,
sorter: true
},
{
title: t('地址'),
dataIndex: 'address',
width: 200,
align: 'left',
sorter: true,
sorter: true
},
{
title: t('备注'),
dataIndex: 'remark',
align: 'left',
width: 150,
sorter: true,
},
sorter: true
}
];
export const searchFormSchema: FormSchema[] = [
{
field: 'name',
label: t('组织名称'),
component: 'Input',
component: 'Input'
},
{
field: 'code',
label: t('组织编码'),
component: 'Input',
component: 'Input'
},
{
field: 'enabledMark',
@ -145,10 +141,10 @@
componentProps: {
options: [
{ label: t('启用'), value: 1 },
{ label: t('停用'), value: 0 },
],
},
},
{ label: t('停用'), value: 0 }
]
}
}
];
export default defineComponent({
@ -159,24 +155,24 @@
const [registerDrawer, { openModal }] = useModal();
const [registerTable, { reload }] = useTable({
title: t('组织列表'),
api: getDepartmentEnabledTree,
api: getDepartmentTrees,
columns,
formConfig: {
rowProps: {
gutter: 16,
gutter: 16
},
schemas: searchFormSchema,
actionColOptions: { span: 16 },
showResetButton: false,
showResetButton: false
},
beforeFetch: (params) => {
return {
...params,
isOrg: 1,
isOrg: 1
};
},
pagination: {
pageSize: 20,
pageSize: 20
},
striped: false,
useSearchForm: true,
@ -186,12 +182,12 @@
width: 100,
title: t('操作'),
dataIndex: 'action',
slots: { customRender: 'action' },
slots: { customRender: 'action' }
},
tableSetting: {
size: false,
setting: false,
},
setting: false
}
});
const visible = ref<boolean>(false);
@ -200,14 +196,14 @@
function handleCreate() {
openModal(true, {
isUpdate: false,
isUpdate: false
});
}
function handleEdit(record: Recordable) {
openModal(true, {
record,
isUpdate: true,
isUpdate: true
});
}
@ -216,10 +212,11 @@
reload();
notification.success({
message: t('提示'),
description: t('删除成功'),
description: t('删除成功')
}); //提示消息
});
}
function handleAddUser(record: Recordable) {
deptId.value = record.id;
getDepartmentUserList({ id: record.id }).then((res) => {
@ -234,7 +231,7 @@
updateDepartmentUser({ id: deptId.value, userIds: v }).then(() => {
notification.success({
message: '添加人员',
description: t('成功'),
description: t('成功')
});
});
}
@ -243,6 +240,27 @@
reload();
}
function handleExpand(expanded, record) {
if (!expanded) {
return;
}
const { id } = record;
if (record?.children.length || record._loaded) {
return;
}
getDepartmentTrees({ id }).then((result) => {
const node = result[0];
if (node?.children.length) {
node.children.forEach((item) => {
item.children = [];
item.key = item.id;
});
record.children = node.children;
}
record._loaded = true;
});
}
return {
registerTable,
registerDrawer,
@ -252,10 +270,11 @@
handleAddUser,
handleDeptUser,
handleSuccess,
handleExpand,
visible,
selectedUserIds,
t,
t
};
},
}
});
</script>

View File

@ -0,0 +1,111 @@
<template>
<BasicTable @register="registerTable" @selection-change="selectionChange">
<template #toolbar>
<div class="button-box">
<RejectProcess
:taskId="taskId"
:processId="processId"
@close="reload"
@restart="restartProcess"
class="mr-2"
><a-button v-auth="'processtasks:withdraw'">{{ t('撤回') }}</a-button></RejectProcess
>
</div>
</template>
<template #currentProgress="{ record }">
<a-progress v-if="record.currentProgress" :percent="record.currentProgress" size="small" />
</template>
</BasicTable>
<LaunchProcess
v-if="restartProcessVisible"
:schemaId="schemaId"
:taskId="taskId"
@close="restartProcessClose"
/>
</template>
<script setup lang="ts">
import userTaskTable from './../../hooks/userTaskTable';
import { ref } from 'vue';
import LookProcess from './../LookProcess.vue';
import LaunchProcess from './../LaunchProcess.vue';
import RejectProcess from './../RejectProcess.vue';
import { BasicTable, useTable, BasicColumn } from '/@/components/Table';
import { getSchemaTask } from '/@/api/workflow/process';
import { TaskTypeUrl } from '/@/enums/workflowEnum';
import { useI18n } from '/@/hooks/web/useI18n';
const { t } = useI18n();
const restartProcessVisible = ref(false);
const configColumns: BasicColumn[] = [
{
title: t('流水号'),
dataIndex: 'serialNumber',
width: 80,
},
{
title: t('流程名称'),
dataIndex: 'processName',
width: '32%',
align: 'left',
},
{
title: t('任务名称'),
dataIndex: 'currentTaskName',
width: '17%',
align: 'left',
},
{
title: t('当前进度'),
dataIndex: 'currentProgress',
width: '17%',
slots: { customRender: 'currentProgress' },
},
{
title: t('发起人'),
dataIndex: 'originator',
align: 'left',
width: 80,
},
{
title: t('发起时间'),
dataIndex: 'createTime',
align: 'left',
width: 120,
},
];
const { formConfig, processId, taskId, schemaId, selectionChange } = userTaskTable();
const [registerTable, { reload }] = useTable({
title: t('已办任务列表'),
api: getSchemaTask,
rowKey: 'id',
columns: configColumns,
formConfig: formConfig(),
beforeFetch: (params) => {
return { data: params, taskUrl: TaskTypeUrl.FINISHED_TASKS };
},
useSearchForm: true,
showTableSetting: true,
striped: false,
pagination: {
pageSize: 18,
},
indexColumnProps: {
width: 50,
},
});
function restartProcess() {
restartProcessVisible.value = true;
}
function restartProcessClose() {
restartProcessVisible.value = false;
reload();
}
</script>
<style scoped></style>