调整合同待办已办功能
This commit is contained in:
parent
dc87bbca61
commit
589ddf5954
|
@ -1,9 +1,12 @@
|
|||
<script setup lang="ts">
|
||||
import { Page } from '@vben/common-ui';
|
||||
import TodoPage from '../../components/todo-page/todo-page.vue';
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<Page content-class="h-full">
|
||||
<TodoPage :module="['contractSetup']" />
|
||||
</Page>
|
||||
</template>
|
||||
|
||||
<style scoped></style>
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<script setup lang="ts">
|
||||
import { onMounted, reactive } from 'vue';
|
||||
import { onMounted, reactive, ref, watch } from 'vue';
|
||||
import { useRouter } from 'vue-router';
|
||||
|
||||
import { Page } from '@vben/common-ui';
|
||||
|
@ -26,6 +26,46 @@ const { xGridRef: xGrid2Ref, triggerProxy: triggerProxy2 } = useVxeTable({
|
|||
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 - 表格 */
|
||||
const gridOptions = reactive(
|
||||
gridProps({
|
||||
|
@ -98,11 +138,10 @@ function toDetail(type: string, id: string, row?: any) {
|
|||
|
||||
onMounted(() => {});
|
||||
|
||||
// 页面打开后获取列表数据
|
||||
defineExpose({});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<Page content-class="h-full flex flex-col">
|
||||
<a-space class="flex h-full flex-col" direction="vertical" size="small">
|
||||
<a-card
|
||||
:body-style="{ flex: '1' }"
|
||||
|
@ -168,7 +207,6 @@ onMounted(() => {});
|
|||
</vxe-grid>
|
||||
</a-card>
|
||||
</a-space>
|
||||
</Page>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
|
|
|
@ -5,84 +5,25 @@ import { Page } from '@vben/common-ui';
|
|||
|
||||
import Apis from '#/api';
|
||||
import { useVxeTable } from '#/hooks/vxeTable';
|
||||
import { DICT_TYPE, getDictOptions } from '#/utils/dict';
|
||||
import { getTodoColumns } from '#/views/contract/schema';
|
||||
import { toDetailPage } from '#/views/contract/utils';
|
||||
import { useRouter } from 'vue-router';
|
||||
import { DICT_TYPE, getDictDatasAsync, getDictOptions } from '#/utils/dict';
|
||||
import TodoPage from '#/views/contract/components/todo-page/todo-page.vue';
|
||||
|
||||
const router = useRouter();
|
||||
|
||||
const { xGridRef, triggerProxy, gridProps } = useVxeTable({ ref: 'xGridRef' });
|
||||
const { xGridRef: xGrid2Ref, triggerProxy: triggerProxy2 } = useVxeTable({
|
||||
ref: 'xGrid2Ref',
|
||||
});
|
||||
const treeData = ref();
|
||||
|
||||
const todoPageRef = ref();
|
||||
const selectedKeys = ref<string[]>([]);
|
||||
|
||||
/** Hooks - 表格 */
|
||||
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,
|
||||
},
|
||||
}),
|
||||
);
|
||||
let treeKeys = ref([]);
|
||||
|
||||
/** Hooks - 表格 */
|
||||
const grid2Options = reactive(
|
||||
gridProps({
|
||||
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');
|
||||
function onTreeSelect(e) {
|
||||
console.log(e);
|
||||
treeKeys.value = e;
|
||||
}
|
||||
|
||||
const expandedKeys = ref<string[]>([]);
|
||||
|
||||
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) => {
|
||||
item.key = item.value;
|
||||
item.title = item.label;
|
||||
|
@ -92,22 +33,6 @@ async function loadDataByDictType() {
|
|||
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(() => {
|
||||
loadDataByDictType();
|
||||
});
|
||||
|
@ -131,63 +56,7 @@ onMounted(() => {
|
|||
</a-card>
|
||||
</a-col>
|
||||
<a-col :span="19" class="min-w-700px flex flex-col">
|
||||
<a-card
|
||||
: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>
|
||||
<TodoPage ref="todoPageRef" v-model:module="treeKeys"></TodoPage>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</Page>
|
||||
|
|
Loading…
Reference in New Issue