Commit 8b62fa0cb0559ec3ea8a1b82a2d44165b2337522

Authored by Vben
1 parent b6bb8163

feat(tree): actionItem added show attribute close #314

CHANGELOG.zh_CN.md
... ... @@ -12,6 +12,7 @@
12 12 - 新增部门管理示例界面
13 13 - 新增 WebSocket 示例和服务脚本
14 14 - BasicTree 组件新增 `renderIcon` 属性用于控制层级图标显示
  15 +- BasicTree->actionItem 新增 show 属性,用于动态控制按钮显示
15 16  
16 17 ### ⚡ Performance Improvements
17 18  
... ...
src/components/Tree/src/index.vue
... ... @@ -16,7 +16,7 @@
16 16 // import { DownOutlined } from '@ant-design/icons-vue';
17 17  
18 18 import { omit, get } from 'lodash-es';
19   - import { isFunction } from '/@/utils/is';
  19 + import { isBoolean, isFunction } from '/@/utils/is';
20 20 import { extendSlots } from '/@/utils/helper/tsxHelper';
21 21  
22 22 import { useTree } from './useTree';
... ... @@ -116,6 +116,14 @@
116 116 const { actionList } = props;
117 117 if (!actionList || actionList.length === 0) return;
118 118 return actionList.map((item, index) => {
  119 + if (isFunction(item.show)) {
  120 + return item.show?.(node);
  121 + }
  122 +
  123 + if (isBoolean(item.show)) {
  124 + return item.show;
  125 + }
  126 +
119 127 return (
120 128 <span key={index} class={`${prefixCls}__action`}>
121 129 {item.render(node)}
... ... @@ -147,7 +155,7 @@
147 155 >
148 156 {get(item, titleField)}
149 157 </span>
150   - <span class={`${prefixCls}__actions`}> {renderAction(item)}</span>
  158 + <span class={`${prefixCls}__actions`}> {renderAction({ ...item, level })}</span>
151 159 </span>
152 160 ),
153 161 default: () =>
... ...
src/components/Tree/src/types.ts
1 1 import type { TreeDataItem } from 'ant-design-vue/es/tree/Tree';
2 2 export interface ActionItem {
3   - render: (record: any) => any;
  3 + render: (record: Recordable) => any;
  4 + show?: boolean | ((record: Recordable) => boolean);
4 5 }
5 6  
6 7 export interface TreeItem extends TreeDataItem {
... ...
src/views/demo/tree/EditTree.vue
... ... @@ -46,6 +46,7 @@
46 46 }
47 47 const actionList: ActionItem[] = [
48 48 {
  49 + // show:()=>boolean;
49 50 render: (node) => {
50 51 return h(PlusOutlined, {
51 52 class: 'ml-2',
... ...