diff --git a/CHANGELOG.zh_CN.md b/CHANGELOG.zh_CN.md index 6c534fc9bf004e62b002bdf8c7aaaee435ed8235..cb9c924da4beb29807f7ebe585a9eb488a798c98 100644 --- a/CHANGELOG.zh_CN.md +++ b/CHANGELOG.zh_CN.md @@ -12,6 +12,7 @@ - 新增部门管理示例界面 - 新增 WebSocket 示例和服务脚本 - BasicTree 组件新增 `renderIcon` 属性用于控制层级图标显示 +- BasicTree->actionItem 新增 show 属性,用于动态控制按钮显示 ### ⚡ Performance Improvements diff --git a/src/components/Tree/src/index.vue b/src/components/Tree/src/index.vue index 27a29b6265d168bac04c06a4acfd18d34f21f420..194fb4de01f093155188d012620dd0464325739f 100644 --- a/src/components/Tree/src/index.vue +++ b/src/components/Tree/src/index.vue @@ -16,7 +16,7 @@ // import { DownOutlined } from '@ant-design/icons-vue'; import { omit, get } from 'lodash-es'; - import { isFunction } from '/@/utils/is'; + import { isBoolean, isFunction } from '/@/utils/is'; import { extendSlots } from '/@/utils/helper/tsxHelper'; import { useTree } from './useTree'; @@ -116,6 +116,14 @@ const { actionList } = props; if (!actionList || actionList.length === 0) return; return actionList.map((item, index) => { + if (isFunction(item.show)) { + return item.show?.(node); + } + + if (isBoolean(item.show)) { + return item.show; + } + return ( {item.render(node)} @@ -147,7 +155,7 @@ > {get(item, titleField)} - {renderAction(item)} + {renderAction({ ...item, level })} ), default: () => diff --git a/src/components/Tree/src/types.ts b/src/components/Tree/src/types.ts index 54105b3ec79ac7b85740fcf03d5b0b8a908cf607..0d1ea7968746e3fe6d796709acb22daf4923ce7d 100644 --- a/src/components/Tree/src/types.ts +++ b/src/components/Tree/src/types.ts @@ -1,6 +1,7 @@ import type { TreeDataItem } from 'ant-design-vue/es/tree/Tree'; export interface ActionItem { - render: (record: any) => any; + render: (record: Recordable) => any; + show?: boolean | ((record: Recordable) => boolean); } export interface TreeItem extends TreeDataItem { diff --git a/src/views/demo/tree/EditTree.vue b/src/views/demo/tree/EditTree.vue index 30624bdd3226804fb418c9fe35b45116f7052e1f..b31789a8ec722acfda5a68572cec5c333923598b 100644 --- a/src/views/demo/tree/EditTree.vue +++ b/src/views/demo/tree/EditTree.vue @@ -46,6 +46,7 @@ } const actionList: ActionItem[] = [ { + // show:()=>boolean; render: (node) => { return h(PlusOutlined, { class: 'ml-2',