z9130
/
pansoft-plrl
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

调整合同待办已办功能

This commit is contained in:
z9130 2024-10-10 17:53:43 +08:00
parent dc87bbca61
commit 589ddf5954
3 changed files with 121 additions and 211 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
apps/web-contract/src/views/contract/approval/todo/index.vue
View File

@ -1,9 +1,12 @@
<script setup lang="ts"> <script setup lang="ts">
import { Page } from '@vben/common-ui';
import TodoPage from '../../components/todo-page/todo-page.vue'; import TodoPage from '../../components/todo-page/todo-page.vue';
</script> </script>
<template> <template>
<TodoPage :module="['contractSetup']" /> <Page content-class="h-full">
<TodoPage :module="['contractSetup']" />
</Page>
</template> </template>
<style scoped></style> <style scoped></style>

176
apps/web-contract/src/views/contract/components/todo-page/todo-page.vue
View File

@ -1,5 +1,5 @@
<script setup lang="ts"> <script setup lang="ts">
import { onMounted, reactive } from 'vue'; import { onMounted, reactive, ref, watch } from 'vue';
import { useRouter } from 'vue-router'; import { useRouter } from 'vue-router';
import { Page } from '@vben/common-ui'; import { Page } from '@vben/common-ui';
@ -26,6 +26,46 @@ const { xGridRef: xGrid2Ref, triggerProxy: triggerProxy2 } = useVxeTable({
ref: 'xGrid2Ref', ref: 'xGrid2Ref',
}); });
// emit 用于发出事件
const emit = defineEmits<{
(e: 'update:module', value: string[]): void;
}>();
// 创建一个本地的 module 值，作为双向绑定的中间值
const localModule = ref((props.module || []).slice()); // 创建一个本地副本
// 防止无限循环的标志
let isInternalUpdate = false;
// 监听 props.module 的变化，并同步到 localModule
watch(
() => props.module,
(newVal) => {
if (!isInternalUpdate) {
// 如果不是内部触发的，则同步更新 localModule
localModule.value = newVal?.slice() || [];
triggerProxy('reload'); // 触发其他操作
triggerProxy2('reload'); // 触发其他操作
console.log('module prop changed:', newVal);
}
// 重置标志
isInternalUpdate = false;
},
{ immediate: true, deep: true },
);
// 监听 localModule 的变化，并向父组件发出更新事件
watch(
localModule,
(newValue) => {
// 只有当 localModule 和 props.module 不同时才触发 emit
if (JSON.stringify(newValue) !== JSON.stringify(props.module)) {
isInternalUpdate = true; // 标记此次更新是内部更新
emit('update:module', newValue); // 发出更新事件
}
},
{ deep: true },
);
/** Hooks - 表格 */ /** Hooks - 表格 */
const gridOptions = reactive( const gridOptions = reactive(
gridProps({ gridProps({
@ -98,77 +138,75 @@ function toDetail(type: string, id: string, row?: any) {
onMounted(() => {}); onMounted(() => {});
// 页面打开后获取列表数据 defineExpose({});
</script> </script>
<template> <template>
<Page content-class="h-full flex flex-col"> <a-space class="flex h-full flex-col" direction="vertical" size="small">
<a-space class="flex h-full flex-col" direction="vertical" size="small"> <a-card
<a-card :body-style="{ flex: '1' }"
:body-style="{ flex: '1' }" class="flex h-full flex-col"
class="flex h-full flex-col" size="small"
size="small" title="待办"
title="待办" >
> <vxe-grid ref="xGridRef" v-bind="gridOptions">
<vxe-grid ref="xGridRef" v-bind="gridOptions"> <template #toolbar_buttons> </template>
<template #toolbar_buttons> </template> <template #title_slot="{ row }">
<template #title_slot="{ row }"> <span
<span class="cursor-pointer text-blue-500 hover:underline"
class="cursor-pointer text-blue-500 hover:underline" @click="toDetail(row.module, row.businessId, row)"
@click="toDetail(row.module, row.businessId, row)" >
> {{ row.contractName }}
{{ row.contractName }} </span>
</span> </template>
</template> <template #operate="{ row }">
<template #operate="{ row }"> <a-button
<a-button class="text-blue-500"
class="text-blue-500" size="small"
size="small" type="text"
type="text" @click="
@click=" toDetailPage('approval', '', {
toDetailPage('approval', '', { contractId: row.contractId,
contractId: row.contractId, flowInstanceId: row.flowInstanceId,
flowInstanceId: row.flowInstanceId, })
}) "
" >
> 查看
查看 </a-button>
</a-button> </template>
</template> </vxe-grid>
</vxe-grid> </a-card>
</a-card> <a-card
<a-card :body-style="{ flex: '1' }"
:body-style="{ flex: '1' }" class="flex h-full flex-col"
class="flex h-full flex-col" size="small"
size="small" title="已办"
title="已办" >
> <vxe-grid ref="xGrid2Ref" v-bind="grid2Options">
<vxe-grid ref="xGrid2Ref" v-bind="grid2Options"> <template #toolbar_buttons> </template>
<template #toolbar_buttons> </template> <template #title_slot="{ row }">
<template #title_slot="{ row }"> <span>
<span> {{ row.contractName }}
{{ row.contractName }} </span>
</span> </template>
</template> <template #operate="{ row }">
<template #operate="{ row }"> <a-button
<a-button class="text-blue-500"
class="text-blue-500" size="small"
size="small" type="text"
type="text" @click="
@click=" toDetailPage('approval', '', {
toDetailPage('approval', '', { contractId: row.contractId,
contractId: row.contractId, flowInstanceId: row.flowInstanceId,
flowInstanceId: row.flowInstanceId, })
}) "
" >
> 查看
查看 </a-button>
</a-button> </template>
</template> </vxe-grid>
</vxe-grid> </a-card>
</a-card> </a-space>
</a-space>
</Page>
</template> </template>
<style scoped> <style scoped>

151
apps/web-contract/src/views/user-center/todo/index.vue
View File

@ -5,84 +5,25 @@ import { Page } from '@vben/common-ui';
import Apis from '#/api'; import Apis from '#/api';
import { useVxeTable } from '#/hooks/vxeTable'; import { useVxeTable } from '#/hooks/vxeTable';
import { DICT_TYPE, getDictOptions } from '#/utils/dict'; import { DICT_TYPE, getDictDatasAsync, getDictOptions } from '#/utils/dict';
import { getTodoColumns } from '#/views/contract/schema'; import TodoPage from '#/views/contract/components/todo-page/todo-page.vue';
import { toDetailPage } from '#/views/contract/utils';
import { useRouter } from 'vue-router';
const router = useRouter();
const { xGridRef, triggerProxy, gridProps } = useVxeTable({ ref: 'xGridRef' });
const { xGridRef: xGrid2Ref, triggerProxy: triggerProxy2 } = useVxeTable({
ref: 'xGrid2Ref',
});
const treeData = ref(); const treeData = ref();
const todoPageRef = ref();
const selectedKeys = ref<string[]>([]); const selectedKeys = ref<string[]>([]);
/** Hooks - 表格 */ let treeKeys = ref([]);
const gridOptions = reactive(
gridProps({
columns: getTodoColumns({ type: 'todo' }),
proxyConfig: {
autoLoad: true,
ajax: {
query: ({ page }) => {
return Apis.home.get_todo({
params: {
pageNum: page.currentPage,
pageSize: page.pageSize,
moduleId: selectedKeys.value[0],
},
});
},
},
},
pagerConfig: {
enabled: true,
},
toolbarConfig: {
enabled: false,
},
}),
);
/** Hooks - 表格 */ function onTreeSelect(e) {
const grid2Options = reactive( console.log(e);
gridProps({ treeKeys.value = e;
columns: getTodoColumns({ type: 'done' }),
proxyConfig: {
autoLoad: true,
ajax: {
query: ({ page }) => {
return Apis.home.get_done({
params: {
pageNum: page.currentPage,
pageSize: page.pageSize,
moduleId: selectedKeys.value[0],
},
});
},
},
},
pagerConfig: {
enabled: true,
},
toolbarConfig: {
enabled: false,
},
}),
);
function onTreeSelect() {
triggerProxy('reload');
triggerProxy2('reload');
} }
const expandedKeys = ref<string[]>([]); const expandedKeys = ref<string[]>([]);
async function loadDataByDictType() { async function loadDataByDictType() {
const data = getDictOptions(DICT_TYPE.contract_todo_type); const dictMap = await getDictDatasAsync([DICT_TYPE.contract_todo_type]);
const data = dictMap[DICT_TYPE.contract_todo_type] || [];
data.forEach((item) => { data.forEach((item) => {
item.key = item.value; item.key = item.value;
item.title = item.label; item.title = item.label;
@ -92,22 +33,6 @@ async function loadDataByDictType() {
treeData.value = [{ title: '全部', key: 'all', children: data }]; treeData.value = [{ title: '全部', key: 'all', children: data }];
} }
function toDetail(type: string, id: string, row?: any) {
switch (type) {
case 'contractSetup': {
router.push(`/contract/approval/edit/${id}`);
break;
}
case 'selectMerchant': {
router.push(`/contract/business/edit/${row.contractId}`);
break;
}
default: {
break;
}
}
}
onMounted(() => { onMounted(() => {
loadDataByDictType(); loadDataByDictType();
}); });
@ -131,63 +56,7 @@ onMounted(() => {
</a-card> </a-card>
</a-col> </a-col>
<a-col :span="19" class="min-w-700px flex flex-col"> <a-col :span="19" class="min-w-700px flex flex-col">
<a-card <TodoPage ref="todoPageRef" v-model:module="treeKeys"></TodoPage>
:body-style="{ flex: '1' }"
class="flex h-full flex-col"
size="small"
title="待办"
>
<vxe-grid ref="xGridRef" v-bind="gridOptions" class="flex-1">
<template #toolbar_buttons> </template>
<template #title_slot="{ row }">
<span
class="cursor-pointer text-blue-500 hover:underline"
@click="toDetail(row.module, row.businessId, row)"
>
{{ row.contractName }}
</span>
</template>
<template #operate="{ row }">
<a-button
class="text-blue-500"
size="small"
type="text"
@click="
toDetailPage('approval', '', { contractId: row.contractId })
"
>
查看
</a-button>
</template>
</vxe-grid>
</a-card>
<a-card
:body-style="{ flex: '1' }"
class="flex h-full flex-col"
size="small"
title="已办"
>
<vxe-grid ref="xGrid2Ref" v-bind="grid2Options" class="flex-1">
<template #toolbar_buttons> </template>
<template #title_slot="{ row }">
<span class="">
{{ row.contractName }}
</span>
</template>
<template #operate="{ row }">
<a-button
class="text-blue-500"
size="small"
type="text"
@click="
toDetailPage('approval', '', { contractId: row.contractId })
"
>
查看
</a-button>
</template>
</vxe-grid>
</a-card>
</a-col> </a-col>
</a-row> </a-row>
</Page> </Page>