mirror of
https://github.com/vbenjs/vben-admin-thin-next.git
synced 2025-01-24 02:00:22 +08:00
perf(tree): improve the beforeRightClick callback to support more configuration of the menu (#608)
This commit is contained in:
parent
d34467d3f4
commit
adff788de5
@ -23,11 +23,12 @@
|
||||
import { filter } from '/@/utils/helper/treeHelper';
|
||||
|
||||
import { useTree } from './useTree';
|
||||
import { useContextMenu, ContextMenuItem } from '/@/hooks/web/useContextMenu';
|
||||
import { useContextMenu } from '/@/hooks/web/useContextMenu';
|
||||
import { useExpose } from '/@/hooks/core/useExpose';
|
||||
import { useDesign } from '/@/hooks/web/useDesign';
|
||||
|
||||
import { basicProps } from './props';
|
||||
import { CreateContextOptions } from '/@/components/ContextMenu';
|
||||
|
||||
interface State {
|
||||
expandedKeys: Keys;
|
||||
@ -128,18 +129,20 @@
|
||||
|
||||
async function handleRightClick({ event, node }: Recordable) {
|
||||
const { rightMenuList: menuList = [], beforeRightClick } = props;
|
||||
let rightMenuList: ContextMenuItem[] = [];
|
||||
let contextMenuOptions: CreateContextOptions = { event, items: [] };
|
||||
|
||||
if (beforeRightClick && isFunction(beforeRightClick)) {
|
||||
rightMenuList = await beforeRightClick(node);
|
||||
let result = await beforeRightClick(node, event);
|
||||
if (Array.isArray(result)) {
|
||||
contextMenuOptions.items = result;
|
||||
} else {
|
||||
Object.assign(contextMenuOptions, result);
|
||||
}
|
||||
} else {
|
||||
rightMenuList = menuList;
|
||||
contextMenuOptions.items = menuList;
|
||||
}
|
||||
if (!rightMenuList.length) return;
|
||||
createContextMenu({
|
||||
event,
|
||||
items: rightMenuList,
|
||||
});
|
||||
if (!contextMenuOptions.items?.length) return;
|
||||
createContextMenu(contextMenuOptions);
|
||||
}
|
||||
|
||||
function setExpandedKeys(keys: Keys) {
|
||||
|
@ -1,5 +1,5 @@
|
||||
import type { PropType } from 'vue';
|
||||
import type { ReplaceFields, ActionItem, Keys, CheckKeys } from './types';
|
||||
import type { ReplaceFields, ActionItem, Keys, CheckKeys, ContextMenuOptions } from './types';
|
||||
import type { ContextMenuItem } from '/@/hooks/web/useContextMenu';
|
||||
import type { TreeDataItem } from 'ant-design-vue/es/tree/Tree';
|
||||
import { propTypes } from '/@/utils/propTypes';
|
||||
@ -53,7 +53,7 @@ export const basicProps = {
|
||||
},
|
||||
|
||||
beforeRightClick: {
|
||||
type: Function as PropType<(...arg: any) => ContextMenuItem[]>,
|
||||
type: Function as PropType<(...arg: any) => ContextMenuItem[] | ContextMenuOptions>,
|
||||
default: null,
|
||||
},
|
||||
|
||||
|
@ -1,4 +1,5 @@
|
||||
import type { TreeDataItem } from 'ant-design-vue/es/tree/Tree';
|
||||
import { ContextMenuItem } from '/@/hooks/web/useContextMenu';
|
||||
export interface ActionItem {
|
||||
render: (record: Recordable) => any;
|
||||
show?: boolean | ((record: Recordable) => boolean);
|
||||
@ -40,3 +41,9 @@ export interface InsertNodeParams {
|
||||
list?: TreeDataItem[];
|
||||
push?: 'push' | 'unshift';
|
||||
}
|
||||
|
||||
export interface ContextMenuOptions {
|
||||
icon?: string;
|
||||
styles?: any;
|
||||
items?: ContextMenuItem[];
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user