opensource/plus-ui
2
0
Fork 0
mirror of https://gitee.com/JavaLionLi/plus-ui.git synced 2026-09-15 00:25:07 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

update: 修改菜单展开/折叠nextTick调用次数，修改时刷新数据

Browse Source
This commit is contained in:
lau 2025-06-23 23:24:56 +08:00
parent 2f35342782
commit 06ab676b3a
1 changed files with 61 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

76
src/views/system/menu/index.vue
View File

@ -302,6 +302,7 @@ const { sys_show_hide, sys_normal_disable } = toRefs<any>(proxy?.useDict('sys_sh
const menuList = ref<MenuVO[]>([]);
const menuChildrenListMap = ref({});
const menuExpandMap = ref({});
const loading = ref(true);
const showSearch = ref(true);
const menuOptions = ref<MenuOptionsType[]>([]);
@ -346,17 +347,41 @@ const { queryParams, form, rules } = toRefs<PageData<MenuForm, MenuQuery>>(data)
/** 获取子菜单列表 */
const getChildrenList = async (row: any, treeNode: unknown, resolve: (data: any[]) => void) => {
resolve(menuChildrenListMap.value[row.menuId] || []);
menuExpandMap.value[row.menuId] = { row, treeNode, resolve };
const children = menuChildrenListMap.value[row.menuId] || [];
// 菜单的子菜单清空后关闭展开
if (children.length == 0) {
menuTableRef.value?.updateKeyChildren(row.menuId, children);
}
resolve(children);
};
/** 查询菜单列表 */
const getList = async () => {
loading.value = true;
const res = await listMenu(queryParams.value);
/** 刷新展开的菜单数据 */
const refreshLoadTree = (parentId: string | number) => {
if (menuExpandMap.value[parentId]) {
const { row, treeNode, resolve } = menuExpandMap.value[parentId];
if (row) {
getChildrenList(row, treeNode, resolve);
if (row.parentId) {
const grandpaMenu = menuExpandMap.value[row.parentId];
getChildrenList(grandpaMenu.row, grandpaMenu.treeNode, grandpaMenu.resolve);
}
}
}
};
/** 重新加载所有已展开的菜单的数据 */
const refreshAllExpandMenuData = () => {
for (const menuId in menuExpandMap.value) {
refreshLoadTree(menuId);
}
};
/** 处理菜单数据 转为菜单id: 子菜单列表 */
const handleMenuChildrenListMap = (menuList: MenuVO[]) => {
const tempMap = {};
// 存储 父菜单:子菜单列表
for (const menu of res.data) {
for (const menu of menuList) {
const parentId = menu.parentId;
if (!tempMap[parentId]) {
tempMap[parentId] = [];
@ -364,11 +389,22 @@ const getList = async () => {
tempMap[parentId].push(menu);
}
// 设置有没有子菜单
for (const menu of res.data) {
for (const menu of menuList) {
menu['hasChildren'] = tempMap[menu.menuId]?.length > 0;
}
menuChildrenListMap.value = tempMap;
menuList.value = tempMap[0] || [];
};
/** 查询菜单列表 */
const getList = async () => {
loading.value = true;
const res = await listMenu(queryParams.value);
// 处理菜单数据 转为菜单id: 子菜单列表
handleMenuChildrenListMap(res.data);
// 只渲染一级菜单
menuList.value = menuChildrenListMap.value[0] || [];
// 重新加载展开的菜单
refreshAllExpandMenuData();
loading.value = false;
};
/** 查询菜单下拉树结构 */
@ -408,22 +444,32 @@ const handleAdd = (row?: MenuVO) => {
dialog.title = '添加菜单';
};
/** 展开/折叠操作 */
const handleToggleExpandAll = () => {
const handleToggleExpandAll = async () => {
isExpandAll.value = !isExpandAll.value;
toggleExpandAll(menuList.value, isExpandAll.value);
// 设置所有子菜单
setAllChildren(menuList.value);
nextTick(() => {
toggleExpandAll(menuList.value, isExpandAll.value);
console.log(new Date().getTime());
});
};
/** 展开/折叠所有 */
const toggleExpandAll = (data: MenuVO[], status: boolean) => {
data.forEach(async (item: MenuVO) => {
data.forEach((item: MenuVO) => {
menuTableRef.value?.toggleRowExpansion(item, status);
if (item.children && item.children.length > 0) toggleExpandAll(item.children, status);
});
};
/** 设置菜单的子菜单 */
const setAllChildren = (data: MenuVO[]) => {
data.forEach((item: MenuVO) => {
const menuChildrenList = menuChildrenListMap.value[item.menuId];
// 从menuChildrenListMap中获取子菜单列表
if (menuChildrenList && (!item.children || item.children.length === 0)) {
item.children = menuChildrenList || [];
// 等待子菜单列表加载完成
await nextTick();
}
menuTableRef.value?.toggleRowExpansion(item, status);
if (item.children && item.children.length > 0) toggleExpandAll(item.children, status);
if (item.children && item.children.length > 0) setAllChildren(item.children);
});
};
/** 修改按钮操作 */