feat:用dialog替换字典页面删除时原用的modal;menu/index中的adaptabilityOptions变量值改成从字典中获取

This commit is contained in:
wh 2025-07-18 00:50:38 +08:00
parent 0d9b6589c7
commit 29f516a337
5 changed files with 68 additions and 61 deletions

9
auto-imports.d.ts vendored
View File

@ -7,8 +7,6 @@
export {} export {}
declare global { declare global {
const EffectScope: typeof import('vue')['EffectScope'] const EffectScope: typeof import('vue')['EffectScope']
const addChildMenu: typeof import('./src/api/menu')['addChildMenu']
const addParentMenu: typeof import('./src/api/menu')['addParentMenu']
const addChildDict: typeof import('./src/api/dictApi')['addChildDict'] const addChildDict: typeof import('./src/api/dictApi')['addChildDict']
const addChildMenu: typeof import('./src/api/menu')['addChildMenu'] const addChildMenu: typeof import('./src/api/menu')['addChildMenu']
const addParentDict: typeof import('./src/api/dictApi')['addParentDict'] const addParentDict: typeof import('./src/api/dictApi')['addParentDict']
@ -18,9 +16,6 @@ declare global {
const customRef: typeof import('vue')['customRef'] const customRef: typeof import('vue')['customRef']
const defineAsyncComponent: typeof import('vue')['defineAsyncComponent'] const defineAsyncComponent: typeof import('vue')['defineAsyncComponent']
const defineComponent: typeof import('vue')['defineComponent'] const defineComponent: typeof import('vue')['defineComponent']
const deleteMenu: typeof import('./src/api/menu')['deleteMenu']
const deleteUser: typeof import('./src/api/roleApi')['deleteUser']
const editParentMenu: typeof import('./src/api/menu')['editParentMenu']
const deleteChildDict: typeof import('./src/api/dictApi')['deleteChildDict'] const deleteChildDict: typeof import('./src/api/dictApi')['deleteChildDict']
const deleteMenu: typeof import('./src/api/menu')['deleteMenu'] const deleteMenu: typeof import('./src/api/menu')['deleteMenu']
const deleteParentDict: typeof import('./src/api/dictApi')['deleteParentDict'] const deleteParentDict: typeof import('./src/api/dictApi')['deleteParentDict']
@ -31,10 +26,6 @@ declare global {
const enable: typeof import('./src/api/roleApi')['enable'] const enable: typeof import('./src/api/roleApi')['enable']
const enableRole: typeof import('./src/api/roleApi')['enableRole'] const enableRole: typeof import('./src/api/roleApi')['enableRole']
const getAllMenu: typeof import('./src/api/menu')['getAllMenu'] const getAllMenu: typeof import('./src/api/menu')['getAllMenu']
const eidtChildMenu: typeof import('./src/api/menu')['eidtChildMenu']
const enable: typeof import('./src/api/roleApi')['enable']
const enableRole: typeof import('./src/api/roleApi')['enableRole']
const getAllMenu: typeof import('./src/api/menu')['getAllMenu']
const getCurrentInstance: typeof import('vue')['getCurrentInstance'] const getCurrentInstance: typeof import('vue')['getCurrentInstance']
const getCurrentScope: typeof import('vue')['getCurrentScope'] const getCurrentScope: typeof import('vue')['getCurrentScope']
const getDict: typeof import('./src/api/dictApi')['getDict'] const getDict: typeof import('./src/api/dictApi')['getDict']

View File

@ -79,7 +79,7 @@ export function addChildDict(data: DictRowQuery) {
* @param tag tags数组 * @param tag tags数组
* @returns * @returns
*/ */
export function getDict(value: string, tag: string): Promise<DictRowReturn[]> { export function getDict(value: string, tag: string | null = null): Promise<DictRowReturn[]> {
return http({ return http({
url: DictChildURL, url: DictChildURL,
method: 'GET', method: 'GET',

View File

@ -10,8 +10,8 @@
<h1>{{ tableTitle }}</h1> <h1>{{ tableTitle }}</h1>
</div> </div>
<div class="dict-main__search"> <div class="dict-main__search">
<n-input autosize v-model:value="mainSearch" placeholder="查询字典名称(中/英)" clearable <n-input autosize v-model:value="mainSearch" placeholder="查询字典名称(中/英)或字典值" clearable
@keyup.enter="handleFindDatas" class="dict-main__search-input"> @keyup.enter="handleFindDatas" @input="handleInputSearch" class="dict-main__search-input" >
</n-input> </n-input>
<n-button type="primary" @click="handleFindDatas" :focusable="false" class="dict-main__search-btn"> <n-button type="primary" @click="handleFindDatas" :focusable="false" class="dict-main__search-btn">
<template #icon> <template #icon>
@ -33,7 +33,7 @@
</div> </div>
</main> </main>
<n-modal v-model:show="showDataModal" title="新增字典数据" preset="dialog" :mask-closable="false"> <n-modal v-model:show="showDataModal" title="新增字典数据" preset="dialog" :mask-closable="false" :draggable="true">
<n-form ref="formRef" :model="formData" :rules="formRules"> <n-form ref="formRef" :model="formData" :rules="formRules">
<n-form-item label="字典中文名称" path="label"> <n-form-item label="字典中文名称" path="label">
<n-input v-model:value="formData.label" placeholder="输入字典中文名称" clearable /> <n-input v-model:value="formData.label" placeholder="输入字典中文名称" clearable />
@ -63,12 +63,6 @@
</n-space> </n-space>
</template> </template>
</n-modal> </n-modal>
<n-modal v-model:show="showDeleteModal" title="删除字典数据" preset="dialog" :mask-closable="false" content="确认删除该项字典数据?"
negative-text="取消" positive-text="确认" @negative-click="showDeleteModal = false"
@positive-click="hanldeDeleteSubmit">
</n-modal>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
@ -76,7 +70,7 @@ import { getDict } from '@/api/dictApi';
import LsEmpty from '@/components/Ls-UI/LsEmpty.vue'; import LsEmpty from '@/components/Ls-UI/LsEmpty.vue';
import { deepClone } from '@/utils'; import { deepClone } from '@/utils';
import { AddOutline, PencilOutline, SearchOutline, TrashOutline } from '@vicons/ionicons5'; import { AddOutline, PencilOutline, SearchOutline, TrashOutline } from '@vicons/ionicons5';
import { DataTableColumns, FormInst, NButton, NIcon, NSpace, NTag, NTime, useMessage } from 'naive-ui'; import { DataTableColumns, FormInst, NButton, NIcon, NSpace, NTag, NTime, useDialog, useMessage } from 'naive-ui';
const parentProps = defineProps<{ const parentProps = defineProps<{
uuid: string uuid: string
@ -107,6 +101,9 @@ watch(parentProps, async (newValue) => {
} }
}); });
const message = useMessage();
const dialog = useDialog();
interface DictRow { interface DictRow {
uuid?: string uuid?: string
parentId?: string parentId?: string
@ -160,10 +157,6 @@ const getColumns = ({
return h( return h(
NTag, NTag,
{ {
style: {
marginRight: '6px',
color: '#3D8EFF',
},
type: 'info', type: 'info',
bordered: false bordered: false
}, },
@ -253,7 +246,7 @@ const getColumns = ({
const getDatas = async () => { const getDatas = async () => {
try { try {
console.log("父级字典:", parentProps); console.log("父级字典:", parentProps);
const result = await getDict(parentProps.value, null); const result = await getDict(parentProps.value);
tableData.value = result.map(item => { tableData.value = result.map(item => {
const { tag, ...rest } = item; const { tag, ...rest } = item;
return { return {
@ -268,11 +261,13 @@ const getDatas = async () => {
} }
}; };
const handleFindDatas = () => { const handleInputSearch = () => {
currentData.value = tableData.value.filter(item => (item.label.includes(mainSearch.value) || item.labelEn.includes(mainSearch.value)) && item.value === parentProps.value) handleFindDatas(); //
}; }
const message = useMessage(); const handleFindDatas = () => {
currentData.value = tableData.value.filter(item => (item.label.includes(mainSearch.value) || item.labelEn.includes(mainSearch.value) || item.value.includes(mainSearch.value)))
};
const formRef = ref<FormInst | null>(null); const formRef = ref<FormInst | null>(null);
const currentMode = ref<'Add' | 'Modify'>('Add'); const currentMode = ref<'Add' | 'Modify'>('Add');
@ -389,19 +384,27 @@ const handleFormSubmit = async (e: MouseEvent) => {
} }
// //
const showDeleteModal = ref(false); const handleDeleteDatas = async (row: DictRow) => {
const deleteData = ref<DictRow | null>(null); dialog.warning({
title: '删除字典数据',
const handleDeleteDatas = (row: DictRow) => { content: '确认删除?',
console.log("删除:", row); positiveText: '确认',
deleteData.value = row; negativeText: '取消',
showDeleteModal.value = true; draggable: true,
onPositiveClick: async () => {
try {
await handleDeleteSubmit(row);
} catch (error) {
console.log('删除失败', error);
}
}
})
} }
const hanldeDeleteSubmit = async () => { const handleDeleteSubmit = async (deleteData: DictRow) => {
console.log('submit delete ', deleteData); console.log('submit delete ', deleteData);
try { try {
await deleteChildDict(deleteData.value.uuid); await deleteChildDict(deleteData.uuid);
message.success('删除成功'); message.success('删除成功');
try { try {
await getDatas(); await getDatas();

View File

@ -39,7 +39,7 @@
</n-space> </n-space>
</nav> </nav>
<n-modal v-model:show="showDataModal" title="新增父级字典" preset="dialog" :mask-closable="false"> <n-modal v-model:show="showDataModal" title="新增父级字典" preset="dialog" :mask-closable="false" :draggable="true">
<n-form ref="formRef" :model="formData" :rules="formRules"> <n-form ref="formRef" :model="formData" :rules="formRules">
<n-form-item label="父级字典名称" path="label"> <n-form-item label="父级字典名称" path="label">
<n-input v-model:value="formData.label" placeholder="输入父级字典名称" /> <n-input v-model:value="formData.label" placeholder="输入父级字典名称" />
@ -55,18 +55,12 @@
</n-space> </n-space>
</template> </template>
</n-modal> </n-modal>
<n-modal v-model:show="showDeleteModal" title="删除父级字典数据" preset="dialog" :mask-closable="false"
content="确认删除该项字典数据?" negative-text="取消" positive-text="确认" @negative-click="showDeleteModal = false"
@positive-click="handleDeleteSubmit">
</n-modal>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { getParentDict } from '@/api/dictApi'; import { getParentDict } from '@/api/dictApi';
import { AddOutline, BookOutline, PencilOutline, SearchOutline, TrashOutline } from '@vicons/ionicons5'; import { AddOutline, BookOutline, PencilOutline, SearchOutline, TrashOutline } from '@vicons/ionicons5';
import { FormInst, NButton, NIcon, useMessage } from 'naive-ui'; import { FormInst, NButton, NIcon, useDialog, useMessage } from 'naive-ui';
const parentProps = defineProps<{ const parentProps = defineProps<{
parentUuid: string parentUuid: string
@ -93,6 +87,8 @@ interface DictRow {
createUserId?: string createUserId?: string
} }
const message = useMessage();
const dialog = useDialog();
const parentDictDatas = ref<DictRow[]>([]); const parentDictDatas = ref<DictRow[]>([]);
// //
@ -126,8 +122,6 @@ const handleUpdateParent = (dict: DictRow) => {
return; return;
} }
const message = useMessage();
// //
interface FormData { interface FormData {
label: string; label: string;
@ -206,21 +200,30 @@ const handleFormSubmit = async (e: MouseEvent) => {
} }
// //
const showDeleteModal = ref(false);
const deleteData = ref<DictRow | null>(null);
const handleDeleteParent = (e: MouseEvent, data: DictRow) => { const handleDeleteParent = (e: MouseEvent, data: DictRow) => {
e.stopPropagation(); e.stopPropagation();
console.log('删除', data); console.log('删除', data);
deleteData.value = data; dialog.warning({
showDeleteModal.value = true; title: '删除父级字典数据',
content: '确认删除?',
positiveText: '确认',
negativeText: '取消',
draggable: true,
onPositiveClick: async () => {
try {
await handleDeleteSubmit(data);
} catch (error) {
console.log('删除失败', error);
}
}
})
} }
const handleDeleteSubmit = async () => { const handleDeleteSubmit = async (deleteData: DictRow) => {
console.log('submit delete ', deleteData); console.log('submit delete ', deleteData);
try { try {
await deleteParentDict(deleteData.value.uuid); await deleteParentDict(deleteData.uuid);
if (deleteData.value.uuid === parentProps.parentUuid) { if (deleteData.uuid === parentProps.parentUuid) {
emit('update:parentUuid', ''); emit('update:parentUuid', '');
emit('update:parentValue', ''); emit('update:parentValue', '');
emit('update:parentTitle', ''); emit('update:parentTitle', '');

View File

@ -295,11 +295,21 @@ const isEditChild = ref(false)
const currentChildId = ref('') const currentChildId = ref('')
// //
const adaptabilityOptions = [ const adaptabilityOptions = ref([]);
{ label: 'PC端', value: 'pc' },
{ label: '移动端', value: 'mobile' }, getDict("page_adaptability").then((res) => {
{ label: '响应式', value: 'responsive' } console.log('获取适配方式选项', res);
] adaptabilityOptions.value = res.map(item => {
const {label, value, ...rest} = item;
return {
label: label,
value: value,
}
})
}).catch((errors) => {
console.log('获取适配方式选项失败', errors);
message.error('获取适配方式选项失败');
})
// //
const parentModalTitle = computed(() => (isEditParent.value ? '编辑父级菜单' : '添加父级菜单')) const parentModalTitle = computed(() => (isEditParent.value ? '编辑父级菜单' : '添加父级菜单'))