|
@@ -5,7 +5,6 @@ import {useMutation, useQueryClient} from '@tanstack/react-query';
|
|
|
import {editRoleMenu, getRoleList, getTreeMenu} from '@apis';
|
|
|
import {message} from 'antd';
|
|
|
import {RoleListData, TreeMenuListData} from '@models';
|
|
|
-import {useMap} from 'ahooks';
|
|
|
import {pageContext, context as roleContext} from '@pages/role/context';
|
|
|
|
|
|
function useEditMenu(onClose: () => void, onFetch: () => void) {
|
|
@@ -27,28 +26,28 @@ function useEditMenu(onClose: () => void, onFetch: () => void) {
|
|
|
|
|
|
function useTreeMap() {
|
|
|
const client = useQueryClient();
|
|
|
- const [map, {set}] = useMap<string, string>();
|
|
|
|
|
|
- useEffect(
|
|
|
- function() {
|
|
|
- const treeData = client.getQueryData<TreeMenuListData[]>([getTreeMenu.name]);
|
|
|
- if (!treeData || treeData.length === 0) return;
|
|
|
+ function parseParentIdMap() {
|
|
|
+ const map = new Map<string, string>();
|
|
|
|
|
|
- function deepTree(tree: TreeMenuListData[]) {
|
|
|
- tree.forEach(function({pId, key, children}) {
|
|
|
- // 一级菜单不参与寻找父级id
|
|
|
- pId !== '0' && set(key, pId);
|
|
|
+ const treeData = client.getQueryData<TreeMenuListData[]>([getTreeMenu.name]);
|
|
|
+ if (!treeData || treeData.length === 0) return map;
|
|
|
|
|
|
- children.length && deepTree(children);
|
|
|
- });
|
|
|
- }
|
|
|
+ function deepTree(tree: TreeMenuListData[]) {
|
|
|
+ tree.forEach(function({pId, key, children}) {
|
|
|
+ // 一级菜单不参与寻找父级id
|
|
|
+ pId !== '0' && map.set(key, pId);
|
|
|
|
|
|
- deepTree(treeData);
|
|
|
- },
|
|
|
- [client, set],
|
|
|
- );
|
|
|
+ children.length && deepTree(children);
|
|
|
+ });
|
|
|
+ }
|
|
|
+
|
|
|
+ deepTree(treeData);
|
|
|
+
|
|
|
+ return map;
|
|
|
+ }
|
|
|
|
|
|
- return map;
|
|
|
+ return parseParentIdMap;
|
|
|
}
|
|
|
|
|
|
export function useSubmit(
|
|
@@ -57,29 +56,49 @@ export function useSubmit(
|
|
|
) {
|
|
|
const list = useContextSection(context, ([list]) => list);
|
|
|
const [isLoading, mutate] = useEditMenu(onClose, onFetch);
|
|
|
- const treeMap = useTreeMap();
|
|
|
+ const parseTreeMap = useTreeMap();
|
|
|
|
|
|
- function fixMenuTreeList(list: string) {
|
|
|
- const trees = list.split(','),
|
|
|
- // 方式有重复问题
|
|
|
- treeSet = new Set(trees);
|
|
|
+ function parseMenuTreeList(list: string) {
|
|
|
+ const trees = list.split(',');
|
|
|
+ const menuSet = new Set(),
|
|
|
+ antdSet = new Set();
|
|
|
+ const treeMap = parseTreeMap();
|
|
|
|
|
|
trees.forEach(function(val) {
|
|
|
- const mapPId = treeMap.get(val);
|
|
|
+ // 传给后台的要子菜单和父菜单的id
|
|
|
+ menuSet.add(val);
|
|
|
+
|
|
|
+ const pId = treeMap.get(val);
|
|
|
+
|
|
|
+ // 如果有pId说明是二级菜单 antd中需要添加
|
|
|
+ // 同时需要向menuSet中添加 确保所有的二级菜单的父级都包含
|
|
|
|
|
|
- mapPId && treeSet.add(mapPId);
|
|
|
+ if (pId) {
|
|
|
+ menuSet.add(pId);
|
|
|
+ antdSet.add(val);
|
|
|
+ }
|
|
|
});
|
|
|
|
|
|
- return [...treeSet].join(',') + ',';
|
|
|
+ const menu = [...menuSet].join(','),
|
|
|
+ antd = [...antdSet].join(',');
|
|
|
+
|
|
|
+ return {
|
|
|
+ menu: `${menu}${menu ? ',' : ''}`,
|
|
|
+ antd,
|
|
|
+ };
|
|
|
}
|
|
|
|
|
|
function onSubmit(e: FormEvent<HTMLFormElement>) {
|
|
|
e.preventDefault();
|
|
|
|
|
|
const listStr = list.join(',');
|
|
|
- const treeMenu = fixMenuTreeList(listStr);
|
|
|
+ const {antd, menu} = parseMenuTreeList(listStr);
|
|
|
|
|
|
- mutate({id, menu: treeMenu, menuBefore: listStr});
|
|
|
+ mutate({
|
|
|
+ id,
|
|
|
+ menu,
|
|
|
+ menuBefore: antd,
|
|
|
+ });
|
|
|
}
|
|
|
|
|
|
return [isLoading, onSubmit] as const;
|