|
|
|
@ -1,18 +1,27 @@ |
|
|
|
|
<script setup name="DictPage"> |
|
|
|
|
import { onMounted, reactive, h, watch } from 'vue'; |
|
|
|
|
import { onMounted, reactive, watch } from 'vue'; |
|
|
|
|
import DictForm from './DictForm.vue'; |
|
|
|
|
import { CoreDict } from '@/api/index.js'; |
|
|
|
|
import { useMessage } from 'naive-ui'; |
|
|
|
|
import DictTable from '@/views/Auth/Dict/DictTable.vue'; |
|
|
|
|
import DictTree from '@/views/Auth/Dict/DictTree.vue'; |
|
|
|
|
import { BgColorsOutlined } from '@ant-design/icons-vue'; |
|
|
|
|
import { IconPool } from '@/components/AntDesignVue/Icon/index.js'; |
|
|
|
|
import { useBaseDataStore } from '@/stores/baseData.js'; |
|
|
|
|
const baseDataStore = useBaseDataStore(); |
|
|
|
|
const Message = useMessage(); |
|
|
|
|
|
|
|
|
|
// 待查询次数 |
|
|
|
|
let searchCount = 0; |
|
|
|
|
|
|
|
|
|
// ! 关于新增修改的表单 |
|
|
|
|
const formData = reactive({ |
|
|
|
|
// 弹窗名称 |
|
|
|
|
modelName: '创建字典', |
|
|
|
|
// 弹窗状态 |
|
|
|
|
status: false, |
|
|
|
|
// 编辑状态 |
|
|
|
|
isUpdate: false, |
|
|
|
|
// 字典ID |
|
|
|
|
dictId: undefined, |
|
|
|
|
// 表单数据 |
|
|
|
|
formData: { |
|
|
|
|
pid: 0, |
|
|
|
@ -36,15 +45,15 @@ const formData = reactive({ |
|
|
|
|
// 确认 |
|
|
|
|
handleAck: (data) => handleCreateAck(data), |
|
|
|
|
// 取消 |
|
|
|
|
handleCancel: () => { |
|
|
|
|
formData.status = false; |
|
|
|
|
}, |
|
|
|
|
handleCancel: clearFormData, |
|
|
|
|
}); |
|
|
|
|
// ! 关于表格数据 |
|
|
|
|
const tableData = reactive({ |
|
|
|
|
dataSource: [], |
|
|
|
|
methods: { |
|
|
|
|
handleTableChange: () => {}, |
|
|
|
|
handleRemoveAck, |
|
|
|
|
handleUpdate, |
|
|
|
|
}, |
|
|
|
|
pageInfo: { |
|
|
|
|
pageSize: 10, |
|
|
|
@ -71,19 +80,64 @@ const tableData = reactive({ |
|
|
|
|
{ title: '更新时间', key: 'updatetime', status: true }, |
|
|
|
|
{ title: '更新人', key: 'updateName', status: true }, |
|
|
|
|
{ title: '操作', key: 'action', status: true }, |
|
|
|
|
] |
|
|
|
|
], |
|
|
|
|
}); |
|
|
|
|
// todo 重置分页参数 |
|
|
|
|
// todo 清除数据体 |
|
|
|
|
// todo 清理筛选项 |
|
|
|
|
// ! 确认添加 |
|
|
|
|
async function handleCreateAck(data) { |
|
|
|
|
await CoreDict.createDict(data); |
|
|
|
|
Message.success('添加字典成功!'); |
|
|
|
|
formData.status = false; |
|
|
|
|
clearSearchData(); |
|
|
|
|
clearFormData(); |
|
|
|
|
getPage(); |
|
|
|
|
} |
|
|
|
|
// ! 确认删除 |
|
|
|
|
async function handleRemoveAck(data) { |
|
|
|
|
await CoreDict.removeDict(data.dictId); |
|
|
|
|
Message.success('删除字典成功!'); |
|
|
|
|
if (tableData.dataSource.length == 1 && tableData.pageInfo.pageNumber > 1) { |
|
|
|
|
tableData.pageInfo.pageNumber--; |
|
|
|
|
} |
|
|
|
|
getPage(); |
|
|
|
|
} |
|
|
|
|
// ! 更新数据 |
|
|
|
|
async function handleUpdate(data) { |
|
|
|
|
formData.modelName = '更新字典'; |
|
|
|
|
formData.status = true; |
|
|
|
|
formData.isUpdate = true; |
|
|
|
|
formData.dictId = data.dictId; |
|
|
|
|
formData.formData.pid = data.pid; |
|
|
|
|
formData.formData.dictKey = data.dictKey; |
|
|
|
|
formData.formData.dictDesc = data.dictDesc; |
|
|
|
|
formData.formData.dictName = data.dictName; |
|
|
|
|
formData.formData.dictIcon = data.dictIcon; |
|
|
|
|
formData.formData.dictType = data.dictType; |
|
|
|
|
formData.formData.serviceKey = data.serviceKey; |
|
|
|
|
formData.formData.root = data.root; |
|
|
|
|
formData.formData.orderNum = data.orderNum; |
|
|
|
|
formData.handleAck = handleUpdateAck; |
|
|
|
|
} |
|
|
|
|
// ! 确认更新数据 |
|
|
|
|
async function handleUpdateAck(data) { |
|
|
|
|
await CoreDict.updateDict(formData.dictId, data); |
|
|
|
|
Message.success('更新字典成功!'); |
|
|
|
|
clearFormData(); |
|
|
|
|
getPage(); |
|
|
|
|
} |
|
|
|
|
// ! 监听筛选 |
|
|
|
|
watch(tableData.pageInfo, () => { |
|
|
|
|
if (searchCount === 0) { |
|
|
|
|
searchCount++; |
|
|
|
|
getPage(); |
|
|
|
|
setTimeout(() => { |
|
|
|
|
searchCount = 0; |
|
|
|
|
}, 750); |
|
|
|
|
} else { |
|
|
|
|
searchCount++; |
|
|
|
|
} |
|
|
|
|
}); |
|
|
|
|
// ! 获取表格数据 |
|
|
|
|
async function getPage() { |
|
|
|
|
baseDataStore.getDictList(); |
|
|
|
|
const resd = await CoreDict.getDict(tableData.pageInfo); |
|
|
|
|
tableData.dataSource = resd.rowData; |
|
|
|
|
tableData.total = Number(resd.total); |
|
|
|
@ -94,8 +148,42 @@ const handlePageChange = (page, pageSize) => { |
|
|
|
|
tableData.pageInfo.pageNumber = page; |
|
|
|
|
getPage(); |
|
|
|
|
}; |
|
|
|
|
// ! 清除筛选条件 |
|
|
|
|
function clearSearchData() { |
|
|
|
|
tableData.pageInfo = { |
|
|
|
|
pageSize: 10, |
|
|
|
|
pageNumber: 1, |
|
|
|
|
isList: false, |
|
|
|
|
isAsc: false, |
|
|
|
|
dictInfo: undefined, |
|
|
|
|
dictType: undefined, |
|
|
|
|
root: undefined, |
|
|
|
|
serviceKey: undefined, |
|
|
|
|
status: undefined, |
|
|
|
|
}; |
|
|
|
|
} |
|
|
|
|
// ! 清除编辑数据 |
|
|
|
|
function clearFormData() { |
|
|
|
|
formData.modelName = '创建字典'; |
|
|
|
|
formData.isUpdate = false; |
|
|
|
|
formData.status = false; |
|
|
|
|
formData.dictId = undefined; |
|
|
|
|
formData.handleAck = handleCreateAck; |
|
|
|
|
formData.formData.pid = 0; |
|
|
|
|
formData.formData.dictKey = ''; |
|
|
|
|
formData.formData.dictDesc = ''; |
|
|
|
|
formData.formData.dictName = ''; |
|
|
|
|
formData.formData.dictIcon = ''; |
|
|
|
|
formData.formData.dictType = 1; |
|
|
|
|
formData.formData.serviceKey = undefined; |
|
|
|
|
formData.formData.root = false; |
|
|
|
|
formData.formData.orderNum = 0; |
|
|
|
|
} |
|
|
|
|
onMounted(() => { |
|
|
|
|
getPage(); |
|
|
|
|
if (baseDataStore.state.serviceList.length == 0) { |
|
|
|
|
baseDataStore.getServiceList(); |
|
|
|
|
} |
|
|
|
|
}); |
|
|
|
|
</script> |
|
|
|
|
|
|
|
|
@ -105,6 +193,24 @@ onMounted(() => { |
|
|
|
|
<ASpace> |
|
|
|
|
<CreateAntdButton name="字典" @click="formData.status = true" /> |
|
|
|
|
<TableColumChoose v-model:columnList="tableData.tableColumnList" /> |
|
|
|
|
<AInputSearch v-model:value="tableData.pageInfo.dictInfo" placeholder="字典名称/标识/描述" style="width: 200px" @search="getPage" /> |
|
|
|
|
<ASelect placeholder="请选择字典类型" allowClear v-model:value="tableData.pageInfo.dictType" :options="baseDataStore.state.dictTypeList" /> |
|
|
|
|
<ASelect |
|
|
|
|
placeholder="请选择所属服务" |
|
|
|
|
allowClear |
|
|
|
|
v-model:value="tableData.pageInfo.serviceKey" |
|
|
|
|
:options="baseDataStore.state.serviceList" |
|
|
|
|
:field-names="{ label: 'serviceName', value: 'serviceKey', options: 'children' }" |
|
|
|
|
/> |
|
|
|
|
<ASelect |
|
|
|
|
placeholder="是否为原始数据" |
|
|
|
|
allowClear |
|
|
|
|
v-model:value="tableData.pageInfo.root" |
|
|
|
|
:options="[ |
|
|
|
|
{ label: '是', value: 1 }, |
|
|
|
|
{ label: '否', value: 0 }, |
|
|
|
|
]" |
|
|
|
|
/> |
|
|
|
|
</ASpace> |
|
|
|
|
</template> |
|
|
|
|
<template #main> |
|
|
|
|