plain-design 1.0.0-beta.146 → 1.0.0-beta.147

package/src/packages/components/TreeCore/createTreeNode.tsx

@@ -1,244 +1,244 @@
-import {iTreeKey2CheckStatus, iTreeProps, iTreeState} from "./TreeCore.type";
-import {iTreeUtils} from "./createTreeUtils";
-import {formatNodeData2TreeNode} from "./fromatNodeData";
-import {CheckboxStatus} from "../../utils/constant";
-
-export function createTreeNode(
-  {
-    data,
-    key,
-    parent,
-    level,
-    index,
-    id,
-    props,
-    state,
-    utils,
-    cacheNodeId2treeNode,
-    getCheckStatus,
-    empty,
-    ignoreEmpty,
-  }: {
-    /*节点数据*/
-    data: any,
-    /*唯一标识*/
-    key: string,
-    /*父节点*/
-    parent: iTreeNode | null,
-    /*层级*/
-    level: number,
-    /*在数组中的索引*/
-    index: number,
-    /*根据parent的key，自己的key以及level，index计算而来的唯一标识*/
-    /*用来判断这个节点的parent、自己的数据以及所在层级，所在数组的位置索引是否发生了变化*/
-    id: string,
-    props: iTreeProps,
-    state: iTreeState,
-    utils: iTreeUtils,
-    cacheNodeId2treeNode: Record<string, iTreeNode | undefined>,
-    /*获取选中状态*/
-    getCheckStatus: () => iTreeKey2CheckStatus,
-    /*是否为空节点*/
-    empty?: boolean,
-    /*是否忽略空节点*/
-    ignoreEmpty: boolean | undefined,
-  }
-) {
-  /*在flat list中的索引，用于在虚拟列表中设置vid，以便于拖拽的时候计算top值*/
-  let flatIndex = 0;
-  /*显示文本*/
-  const label = () => typeof props.labelField === "function" ? props.labelField(data) : data[props.labelField];
-  /*子节点数据*/
-  const childrenData: () => any[] | undefined = () => typeof props.childrenField === "function" ? props.childrenField(data) : (data[props.childrenField]);
-  /*设置子节点数据*/
-  const setChildrenData = (childrenData: any[] | null | undefined) => {
-    const { childrenField, setChildrenData } = props;
-    if (!!setChildrenData) {
-      setChildrenData(data, childrenData);
-    } else {
-      if (typeof childrenField === "string") {
-        (data as any)[childrenField] = childrenData;
-      } else {
-        throw new Error('tree: props.setChildrenData is required when childrenField is function');
-      }
-    }
-  };
-  /*子节点*/
-  const children = (): iTreeNode[] => {
-    const childrenData = self.childrenData();
-    const children = !childrenData ? [] : formatNodeData2TreeNode({
-      nodeDataList: childrenData,
-      parent: self,
-      level: level + 1,
-      props: props,
-      state: state,
-      utils: utils,
-      cacheNodeId2treeNode: cacheNodeId2treeNode,
-      getCheckStatus: getCheckStatus,
-      ignoreEmpty,
-    });
-    if (!!children && children.length > 0) {
-      return children;
-    } else {
-      /*当前节点不是叶子节点，数据已经加载完毕，但是没有数据，则添加一个空状态的节点*/
-      if (
-        !isLeaf() &&
-        isLoaded() && !ignoreEmpty
-      ) {
-        const emptyKey = key + '_empty';
-        const emptyId = utils.getTreeNodeId({ nodeKey: emptyKey, parent: self, level: level + 1, index: 0 });
-        return [createTreeNode({
-          data: {} as any,
-          key: emptyKey,
-          parent: self,
-          level: level + 1,
-          index: 0,
-          id:
-          emptyId,
-          props,
-          state,
-          utils,
-          cacheNodeId2treeNode,
-          getCheckStatus,
-          empty: true,
-          ignoreEmpty,
-        })];
-      }
-    }
-    return [];
-  };
-  /*是否为叶子结点*/
-  const isLeaf = () => {
-    /*默认情况下，没有设置isLeaf来判断节点是否为叶子节点的话，则判断是否存在有子节点数据来判断是否为叶子节点，如果子节点数据是一个空数组也视为非叶子节点*/
-    return !props.isLeaf ? !childrenData() : props.isLeaf(data);
-  };
-  /*叶子节点的图标*/
-  const leafIcon = () => {return typeof props.leafIcon === "string" ? props.leafIcon : props.leafIcon(self);};
-  /*是否已经选中*/
-  const checkStatus = (): typeof CheckboxStatus.TYPE => getCheckStatus()[key];
-  /*是否可选中*/
-  const isCheckAble = () => empty ? false : (!props.isCheckAble ? true : props.isCheckAble(data));
-  /*是否已经展开*/
-  const isExpanded = () => Boolean(state.expandedMap[key]);
-  /*是否已经加载完毕*/
-  const isLoaded = () => (!props.lazy || isLeaf()) ? true : Boolean(state.loadedMap[key]);
-  /*是否处于加载状态*/
-  const isLoading = () => Boolean(state.loadingMap[key]);
-  /*所有的父节点*/
-  const parents = (): iTreeNode[] => {
-    let current = parent;
-    let list = [];
-    while (!!current) {
-      list.push(current);
-      current = current.parent;
-    }
-    return list;
-  };
-  /*当前节点的文本是否匹配搜索关键词*/
-  const isMatchSearch = () => {
-    if (empty) {return false;}
-    const { filterMethod, filterText } = props;
-    if (filterText == null || !filterText.trim().length) {
-      return true;
-    }
-    const label = self.label();
-    /*当前节点的文本匹配搜索关键词则显示*/
-    if (!!filterMethod ? filterMethod(data, filterText) : (!!label && label.indexOf(filterText) > -1)) {
-      return true;
-    }
-    return false;
-  };
-  /*当前节点是否通过筛选关键词*/
-  const isPassFilter = () => {
-    /*当前节点匹配搜索关键词*/
-    if (isMatchSearch()) {
-      return true;
-    }
-    /*当前节点有子节点匹配搜索关键词*/
-    const children = self.children().filter(i => !i.empty);
-    if (!!children && children.length > 0 && children.some(i => i.isPassFilter())) {
-      return true;
-    }
-    /*当前节点有父节点匹配搜索关键词*/
-    if (self.parents().some(i => i.isMatchSearch())) {
-      return true;
-    }
-    return false;
-  };
-  /**
-   * 获取其下所有子节点的key
-   * @author  韦胜健
-   * @date    2022.9.21 22:31
-   */
-  const getChildrenKeys = () => {
-    const keys: string[] = [];
-    utils.iterate({
-      treeNodeList: children(),
-      handler: treeNode => !treeNode.empty && keys.push(treeNode.key)
-    });
-    return keys;
-  };
-
-  const setLoading = (flag: boolean): void => state.setLoading(self, flag);
-  const setLoaded = (flag: boolean): void => state.setLoaded(self, flag);
-
-  const self: iTreeNode = {
-    data,
-    key,
-    index,
-    level,
-    id,
-    parent,
-    empty,
-
-    flatIndex,
-    label,
-    childrenData,
-    setChildrenData,
-    children,
-    isLeaf,
-    leafIcon,
-    checkStatus,
-    isCheckAble,
-    isExpanded,
-    isLoaded,
-    isLoading,
-    parents,
-    isPassFilter,
-    getChildrenKeys,
-    setLoading,
-    setLoaded,
-    isMatchSearch,
-  };
-
-  return self;
-}
-
-export interface iTreeNode {
-  data: any,                                                              // 节点数据
-  key: string,                                                            // 节点的唯一标识
-  level: number,                                                          // 节点的层级
-  index: number,                                                          // 节点在其兄弟节点中的索引位置
-  id: string,                                                             // 自动生成的一个id
-  parent: iTreeNode | null,                                               // 父节点对象
-  empty?: boolean,                                                        // 节点是否为空节点
-
-  flatIndex: number,                                                      // 虚拟滚动的情况下拍平节点数据时的拍平数组中的索引位置
-  label: () => string | undefined | null,                                 // 节点显示文本
-  childrenData: () => any[] | undefined,                                  // 节点子数据
-  setChildrenData: (childrenData: any[] | null | undefined) => void,      // 设置节点子数据
-  children: () => iTreeNode[],                                            // 子节点
-  isLeaf: () => boolean,                                                  // 节点是否为叶子节点
-  leafIcon: () => string,                                                 // 叶子节点的图标
-  checkStatus: () => typeof CheckboxStatus.TYPE,                          // 节点的选中状态，check选中，uncheck未选中，minus半选
-  isCheckAble: () => boolean,                                             // 节点是否可以选中
-  isExpanded: () => boolean,                                              // 节点是否已经展开
-  isLoaded: () => boolean,                                                // 节点是否已经加载完毕子节点数据
-  isLoading: () => boolean,                                               // 节点是否处于加载子节点数据的加载状态
-  parents: () => iTreeNode[],                                             // 所有的父节点
-  isPassFilter: () => boolean,                                            // 是否通过了搜索，节点的文本或者其下某个子节点文本通过搜索的时候，该函数返回值为true
-  isMatchSearch: () => boolean,                                           // 节点文本是否通过搜索
-  getChildrenKeys: () => string[],                                        // 获取所有子节点的key数组
-  setLoading: (flag: boolean) => void,                                    // 设置节点的加载状态
-  setLoaded: (flag: boolean) => void,                                     // 设置节点是否已经加载完毕数据
-}
+import {iTreeKey2CheckStatus, iTreeProps, iTreeState} from "./TreeCore.type";
+import {iTreeUtils} from "./createTreeUtils";
+import {formatNodeData2TreeNode} from "./fromatNodeData";
+import {CheckboxStatus} from "../../utils/constant";
+
+export function createTreeNode(
+  {
+    data,
+    key,
+    parent,
+    level,
+    index,
+    id,
+    props,
+    state,
+    utils,
+    cacheNodeId2treeNode,
+    getCheckStatus,
+    empty,
+    ignoreEmpty,
+  }: {
+    /*节点数据*/
+    data: any,
+    /*唯一标识*/
+    key: string,
+    /*父节点*/
+    parent: iTreeNode | null,
+    /*层级*/
+    level: number,
+    /*在数组中的索引*/
+    index: number,
+    /*根据parent的key，自己的key以及level，index计算而来的唯一标识*/
+    /*用来判断这个节点的parent、自己的数据以及所在层级，所在数组的位置索引是否发生了变化*/
+    id: string,
+    props: iTreeProps,
+    state: iTreeState,
+    utils: iTreeUtils,
+    cacheNodeId2treeNode: Record<string, iTreeNode | undefined>,
+    /*获取选中状态*/
+    getCheckStatus: () => iTreeKey2CheckStatus,
+    /*是否为空节点*/
+    empty?: boolean,
+    /*是否忽略空节点*/
+    ignoreEmpty: boolean | undefined,
+  }
+) {
+  /*在flat list中的索引，用于在虚拟列表中设置vid，以便于拖拽的时候计算top值*/
+  let flatIndex = 0;
+  /*显示文本*/
+  const label = () => typeof props.labelField === "function" ? props.labelField(data) : data[props.labelField];
+  /*子节点数据*/
+  const childrenData: () => any[] | undefined = () => typeof props.childrenField === "function" ? props.childrenField(data) : (data[props.childrenField]);
+  /*设置子节点数据*/
+  const setChildrenData = (childrenData: any[] | null | undefined) => {
+    const { childrenField, setChildrenData } = props;
+    if (!!setChildrenData) {
+      setChildrenData(data, childrenData);
+    } else {
+      if (typeof childrenField === "string") {
+        (data as any)[childrenField] = childrenData;
+      } else {
+        throw new Error('tree: props.setChildrenData is required when childrenField is function');
+      }
+    }
+  };
+  /*子节点*/
+  const children = (): iTreeNode[] => {
+    const childrenData = self.childrenData();
+    const children = !childrenData ? [] : formatNodeData2TreeNode({
+      nodeDataList: childrenData,
+      parent: self,
+      level: level + 1,
+      props: props,
+      state: state,
+      utils: utils,
+      cacheNodeId2treeNode: cacheNodeId2treeNode,
+      getCheckStatus: getCheckStatus,
+      ignoreEmpty,
+    });
+    if (!!children && children.length > 0) {
+      return children;
+    } else {
+      /*当前节点不是叶子节点，数据已经加载完毕，但是没有数据，则添加一个空状态的节点*/
+      if (
+        !isLeaf() &&
+        isLoaded() && !ignoreEmpty
+      ) {
+        const emptyKey = key + '_empty';
+        const emptyId = utils.getTreeNodeId({ nodeKey: emptyKey, parent: self, level: level + 1, index: 0 });
+        return [createTreeNode({
+          data: {} as any,
+          key: emptyKey,
+          parent: self,
+          level: level + 1,
+          index: 0,
+          id:
+          emptyId,
+          props,
+          state,
+          utils,
+          cacheNodeId2treeNode,
+          getCheckStatus,
+          empty: true,
+          ignoreEmpty,
+        })];
+      }
+    }
+    return [];
+  };
+  /*是否为叶子结点*/
+  const isLeaf = () => {
+    /*默认情况下，没有设置isLeaf来判断节点是否为叶子节点的话，则判断是否存在有子节点数据来判断是否为叶子节点，如果子节点数据是一个空数组也视为非叶子节点*/
+    return !props.isLeaf ? !childrenData() : props.isLeaf(data);
+  };
+  /*叶子节点的图标*/
+  const leafIcon = () => {return typeof props.leafIcon === "string" ? props.leafIcon : props.leafIcon(self);};
+  /*是否已经选中*/
+  const checkStatus = (): typeof CheckboxStatus.TYPE => getCheckStatus()[key];
+  /*是否可选中*/
+  const isCheckAble = () => empty ? false : (!props.isCheckAble ? true : props.isCheckAble(data));
+  /*是否已经展开*/
+  const isExpanded = () => Boolean(state.expandedMap[key]);
+  /*是否已经加载完毕*/
+  const isLoaded = () => (!props.lazy || isLeaf()) ? true : Boolean(state.loadedMap[key]);
+  /*是否处于加载状态*/
+  const isLoading = () => Boolean(state.loadingMap[key]);
+  /*所有的父节点*/
+  const parents = (): iTreeNode[] => {
+    let current = parent;
+    let list = [];
+    while (!!current) {
+      list.push(current);
+      current = current.parent;
+    }
+    return list;
+  };
+  /*当前节点的文本是否匹配搜索关键词*/
+  const isMatchSearch = () => {
+    if (empty) {return false;}
+    const { filterMethod, filterText } = props;
+    if (filterText == null || !filterText.trim().length) {
+      return true;
+    }
+    const label = self.label();
+    /*当前节点的文本匹配搜索关键词则显示*/
+    if (!!filterMethod ? filterMethod(data, filterText) : (!!label && label.indexOf(filterText) > -1)) {
+      return true;
+    }
+    return false;
+  };
+  /*当前节点是否通过筛选关键词*/
+  const isPassFilter = () => {
+    /*当前节点匹配搜索关键词*/
+    if (isMatchSearch()) {
+      return true;
+    }
+    /*当前节点有子节点匹配搜索关键词*/
+    const children = self.children().filter(i => !i.empty);
+    if (!!children && children.length > 0 && children.some(i => i.isPassFilter())) {
+      return true;
+    }
+    /*当前节点有父节点匹配搜索关键词*/
+    if (self.parents().some(i => i.isMatchSearch())) {
+      return true;
+    }
+    return false;
+  };
+  /**
+   * 获取其下所有子节点的key
+   * @author  韦胜健
+   * @date    2022.9.21 22:31
+   */
+  const getChildrenKeys = () => {
+    const keys: string[] = [];
+    utils.iterate({
+      treeNodeList: children(),
+      handler: treeNode => !treeNode.empty && keys.push(treeNode.key)
+    });
+    return keys;
+  };
+
+  const setLoading = (flag: boolean): void => state.setLoading(self, flag);
+  const setLoaded = (flag: boolean): void => state.setLoaded(self, flag);
+
+  const self: iTreeNode = {
+    data,
+    key,
+    index,
+    level,
+    id,
+    parent,
+    empty,
+
+    flatIndex,
+    label,
+    childrenData,
+    setChildrenData,
+    children,
+    isLeaf,
+    leafIcon,
+    checkStatus,
+    isCheckAble,
+    isExpanded,
+    isLoaded,
+    isLoading,
+    parents,
+    isPassFilter,
+    getChildrenKeys,
+    setLoading,
+    setLoaded,
+    isMatchSearch,
+  };
+
+  return self;
+}
+
+export interface iTreeNode {
+  data: any,                                                              // 节点数据
+  key: string,                                                            // 节点的唯一标识
+  level: number,                                                          // 节点的层级
+  index: number,                                                          // 节点在其兄弟节点中的索引位置
+  id: string,                                                             // 自动生成的一个id
+  parent: iTreeNode | null,                                               // 父节点对象
+  empty?: boolean,                                                        // 节点是否为空节点
+
+  flatIndex: number,                                                      // 虚拟滚动的情况下拍平节点数据时的拍平数组中的索引位置
+  label: () => string | undefined | null,                                 // 节点显示文本
+  childrenData: () => any[] | undefined,                                  // 节点子数据
+  setChildrenData: (childrenData: any[] | null | undefined) => void,      // 设置节点子数据
+  children: () => iTreeNode[],                                            // 子节点
+  isLeaf: () => boolean,                                                  // 节点是否为叶子节点
+  leafIcon: () => string,                                                 // 叶子节点的图标
+  checkStatus: () => typeof CheckboxStatus.TYPE,                          // 节点的选中状态，check选中，uncheck未选中，minus半选
+  isCheckAble: () => boolean,                                             // 节点是否可以选中
+  isExpanded: () => boolean,                                              // 节点是否已经展开
+  isLoaded: () => boolean,                                                // 节点是否已经加载完毕子节点数据
+  isLoading: () => boolean,                                               // 节点是否处于加载子节点数据的加载状态
+  parents: () => iTreeNode[],                                             // 所有的父节点
+  isPassFilter: () => boolean,                                            // 是否通过了搜索，节点的文本或者其下某个子节点文本通过搜索的时候，该函数返回值为true
+  isMatchSearch: () => boolean,                                           // 节点文本是否通过搜索
+  getChildrenKeys: () => string[],                                        // 获取所有子节点的key数组
+  setLoading: (flag: boolean) => void,                                    // 设置节点的加载状态
+  setLoaded: (flag: boolean) => void,                                     // 设置节点是否已经加载完毕数据
+}

package/src/packages/components/TreeCore/createTreeProps.ts

@@ -1,76 +1,76 @@
-import {ComponentEvent, PropType} from "@peryl/react-compose";
-import {iTreeProps} from "./TreeCore.type";
-import {iTreeNode} from "./createTreeNode";
-import {PlainObject} from "@peryl/utils/event";
-
-export const TreePropsOptions = {
-  data: { type: Array as PropType<iTreeProps["data"]> },
-  keyField: { type: [String, Function] as PropType<iTreeProps["keyField"]>, required: true },
-  labelField: { type: [String, Function] as PropType<iTreeProps["labelField"]>, required: true },
-  childrenField: { type: [String, Function] as PropType<iTreeProps["childrenField"]>, required: true },
-  setChildrenData: { type: Function as PropType<iTreeProps["setChildrenData"]> },
-  isCheckAble: { type: Function as PropType<iTreeProps["isCheckAble"]> },
-  isLeaf: { type: Function as PropType<iTreeProps["isLeaf"]> },
-  filterMethod: { type: Function as PropType<iTreeProps["filterMethod"]> },
-  lazy: { type: Boolean as PropType<iTreeProps["lazy"]> },
-  getChildrenData: { type: Function as PropType<iTreeProps["getChildrenData"]> },
-  current: { type: String as PropType<iTreeProps["current"]> },
-  disableCurrent: { type: Boolean as PropType<iTreeProps["disableCurrent"]> },
-  multiple: { type: Boolean as PropType<iTreeProps["multiple"]> },
-  singleValueType: { type: String as PropType<iTreeProps['singleValueType']> },
-  checkLast: { type: Boolean as PropType<iTreeProps['checkLast']>, default: null },
-  checkStrictly: { type: Boolean as PropType<iTreeProps["checkStrictly"]> },
-  according: { type: Boolean as PropType<iTreeProps["according"]> },
-  autoExpandParent: { type: Boolean as PropType<iTreeProps["autoExpandParent"]>, default: true },
-  autoCollapseChildren: { type: Boolean as PropType<iTreeProps["autoExpandParent"]>, default: true },
-  autoCheckChildren: { type: Boolean as PropType<iTreeProps["autoExpandParent"]>, default: true },
-  autoCheckParent: { type: Boolean as PropType<iTreeProps["autoExpandParent"]>, default: true },
-  expandOnClickNode: { type: Boolean as PropType<iTreeProps["expandOnClickNode"]> },
-  checkOnClickNode: { type: Boolean as PropType<iTreeProps["checkOnClickNode"]> },
-  defaultExpandAll: { type: Boolean as PropType<iTreeProps["defaultExpandAll"]> },
-  getNodeIcon: { type: Function as PropType<iTreeProps["getNodeIcon"]> },
-  draggable: { type: Boolean as PropType<iTreeProps["draggable"]> },
-  customDraggier: { type: Boolean as PropType<iTreeProps["customDraggier"]> },
-  isAllowDraggable: { type: Function as PropType<iTreeProps["isAllowDraggable"]> },
-  isAllowDroppable: { type: Function as PropType<iTreeProps["isAllowDroppable"]> },
-  leafIcon: { type: [String, Function] as PropType<iTreeProps["leafIcon"]>, default: 'pi-drive-file' as string },
-  folderCollapseIcon: { type: String as PropType<iTreeProps["folderCollapseIcon"]>, default: 'pi-caret-right' as string },
-  folderExpandIcon: { type: String as PropType<iTreeProps["folderExpandIcon"]>, default: 'pi-down' as string },
-  expanderCover: { type: Boolean as PropType<iTreeProps["expanderCover"]>, default: true },
-  loading: { type: Boolean as PropType<iTreeProps["loading"]>, },
-  filterText: { type: String as PropType<iTreeProps["filterText"]>, },
-  virtual: { type: Boolean as PropType<iTreeProps['virtual']> },
-  virtualSize: { type: Number as PropType<iTreeProps["virtualSize"]> },
-  size: { type: String as PropType<iTreeProps["size"]> },
-  virtualDynamicSize: { type: Boolean as PropType<iTreeProps["virtualDynamicSize"]> },
-  noMatchText: { type: String as PropType<iTreeProps["noMatchText"]> },
-  noDataText: { type: String as PropType<iTreeProps["noDataText"]> },
-  nodeIcon: { type: Function as PropType<iTreeProps['nodeIcon']> },
-} as const;
-
-export const TreeEmitOptions = {
-  onUpdateModelValue: (val: any) => true,
-  onUpdateExpand: (val: any[] | undefined) => true,
-  onUpdateCurrent: (val?: string) => true,
-  onUpdateData: (val?: any[] | undefined | null) => true,
-  onDragChange: (data: iTreeDragChangeData) => true,
-} as const;
-
-export type iTreeEvent = ComponentEvent<typeof TreeEmitOptions>
-
-export interface iTreeDragChangeData {
-  data: any,                            // 拖拽的节点数据
-  newParent: PlainObject | null,        // 拖拽放置位置的父节点数据，如果放置的位置是根列表，则父节点为null
-  oldParent: PlainObject | null,        // 拖拽放置前，节点的父节点数据
-
-  node: iTreeNode,                      // 拖拽的节点信息
-  newParentNode: iTreeNode | null,      // 拖拽放置位置的父节点对象信息
-  oldParentNode: iTreeNode | null,      // 拖拽放置之前，节点的父节点对象信息
-
-  newSiblings: any[],                   // 拖拽放置之后，节点所在数组对象
-  newSiblingsBak: any[],                // 拖拽之前，newSiblings数据的备份
-  oldSiblings: any[],                   // 拖拽放置之前，节点所在数组对象
-  oldSiblingsBak: any[],                // 拖拽之前，  oldSiblings的数据备份
-
-  undo: () => void,                     // 撤销本次拖拽动作
-}
+import {ComponentEvent, PropType} from "@peryl/react-compose";
+import {iTreeProps} from "./TreeCore.type";
+import {iTreeNode} from "./createTreeNode";
+import {PlainObject} from "@peryl/utils/event";
+
+export const TreePropsOptions = {
+  data: { type: Array as PropType<iTreeProps["data"]> },
+  keyField: { type: [String, Function] as PropType<iTreeProps["keyField"]>, required: true },
+  labelField: { type: [String, Function] as PropType<iTreeProps["labelField"]>, required: true },
+  childrenField: { type: [String, Function] as PropType<iTreeProps["childrenField"]>, required: true },
+  setChildrenData: { type: Function as PropType<iTreeProps["setChildrenData"]> },
+  isCheckAble: { type: Function as PropType<iTreeProps["isCheckAble"]> },
+  isLeaf: { type: Function as PropType<iTreeProps["isLeaf"]> },
+  filterMethod: { type: Function as PropType<iTreeProps["filterMethod"]> },
+  lazy: { type: Boolean as PropType<iTreeProps["lazy"]> },
+  getChildrenData: { type: Function as PropType<iTreeProps["getChildrenData"]> },
+  current: { type: String as PropType<iTreeProps["current"]> },
+  disableCurrent: { type: Boolean as PropType<iTreeProps["disableCurrent"]> },
+  multiple: { type: Boolean as PropType<iTreeProps["multiple"]> },
+  singleValueType: { type: String as PropType<iTreeProps['singleValueType']> },
+  checkLast: { type: Boolean as PropType<iTreeProps['checkLast']>, default: null },
+  checkStrictly: { type: Boolean as PropType<iTreeProps["checkStrictly"]> },
+  according: { type: Boolean as PropType<iTreeProps["according"]> },
+  autoExpandParent: { type: Boolean as PropType<iTreeProps["autoExpandParent"]>, default: true },
+  autoCollapseChildren: { type: Boolean as PropType<iTreeProps["autoExpandParent"]>, default: true },
+  autoCheckChildren: { type: Boolean as PropType<iTreeProps["autoExpandParent"]>, default: true },
+  autoCheckParent: { type: Boolean as PropType<iTreeProps["autoExpandParent"]>, default: true },
+  expandOnClickNode: { type: Boolean as PropType<iTreeProps["expandOnClickNode"]> },
+  checkOnClickNode: { type: Boolean as PropType<iTreeProps["checkOnClickNode"]> },
+  defaultExpandAll: { type: Boolean as PropType<iTreeProps["defaultExpandAll"]> },
+  getNodeIcon: { type: Function as PropType<iTreeProps["getNodeIcon"]> },
+  draggable: { type: Boolean as PropType<iTreeProps["draggable"]> },
+  customDraggier: { type: Boolean as PropType<iTreeProps["customDraggier"]> },
+  isAllowDraggable: { type: Function as PropType<iTreeProps["isAllowDraggable"]> },
+  isAllowDroppable: { type: Function as PropType<iTreeProps["isAllowDroppable"]> },
+  leafIcon: { type: [String, Function] as PropType<iTreeProps["leafIcon"]>, default: 'pi-drive-file' as string },
+  folderCollapseIcon: { type: String as PropType<iTreeProps["folderCollapseIcon"]>, default: 'pi-caret-right' as string },
+  folderExpandIcon: { type: String as PropType<iTreeProps["folderExpandIcon"]>, default: 'pi-down' as string },
+  expanderCover: { type: Boolean as PropType<iTreeProps["expanderCover"]>, default: true },
+  loading: { type: Boolean as PropType<iTreeProps["loading"]>, },
+  filterText: { type: String as PropType<iTreeProps["filterText"]>, },
+  virtual: { type: Boolean as PropType<iTreeProps['virtual']> },
+  virtualSize: { type: Number as PropType<iTreeProps["virtualSize"]> },
+  size: { type: String as PropType<iTreeProps["size"]> },
+  virtualDynamicSize: { type: Boolean as PropType<iTreeProps["virtualDynamicSize"]> },
+  noMatchText: { type: String as PropType<iTreeProps["noMatchText"]> },
+  noDataText: { type: String as PropType<iTreeProps["noDataText"]> },
+  nodeIcon: { type: Function as PropType<iTreeProps['nodeIcon']> },
+} as const;
+
+export const TreeEmitOptions = {
+  onUpdateModelValue: (val: any) => true,
+  onUpdateExpand: (val: any[] | undefined) => true,
+  onUpdateCurrent: (val?: string) => true,
+  onUpdateData: (val?: any[] | undefined | null) => true,
+  onDragChange: (data: iTreeDragChangeData) => true,
+} as const;
+
+export type iTreeEvent = ComponentEvent<typeof TreeEmitOptions>
+
+export interface iTreeDragChangeData {
+  data: any,                            // 拖拽的节点数据
+  newParent: PlainObject | null,        // 拖拽放置位置的父节点数据，如果放置的位置是根列表，则父节点为null
+  oldParent: PlainObject | null,        // 拖拽放置前，节点的父节点数据
+
+  node: iTreeNode,                      // 拖拽的节点信息
+  newParentNode: iTreeNode | null,      // 拖拽放置位置的父节点对象信息
+  oldParentNode: iTreeNode | null,      // 拖拽放置之前，节点的父节点对象信息
+
+  newSiblings: any[],                   // 拖拽放置之后，节点所在数组对象
+  newSiblingsBak: any[],                // 拖拽之前，newSiblings数据的备份
+  oldSiblings: any[],                   // 拖拽放置之前，节点所在数组对象
+  oldSiblingsBak: any[],                // 拖拽之前，  oldSiblings的数据备份
+
+  undo: () => void,                     // 撤销本次拖拽动作
+}