From fb9bcb7d1bbdad6ff0e8c10914e12264371818bd Mon Sep 17 00:00:00 2001
From: ChuChencheng <azureternite@live.com>
Date: Sun, 11 Jun 2023 04:27:04 +0800
Subject: [PATCH 1/7] feat: reset non reactive data before component destroy

---
 src/components/Tree.vue | 31 ++++++++++++++++++-------------
 1 file changed, 18 insertions(+), 13 deletions(-)

diff --git a/src/components/Tree.vue b/src/components/Tree.vue
index 54ddc9d..d13b2a2 100644
--- a/src/components/Tree.vue
+++ b/src/components/Tree.vue
@@ -813,22 +813,26 @@ export default (Vue as VueConstructor<Vue & {
       this.debounceTimer = window.requestAnimationFrame(this.updateRenderNodes.bind(this, true))
       // this.updateRenderNodes(true)
     },
+
+    initializeNonReactiveData (): void {
+      const { keyField, ignoreMode, filteredNodeCheckable, cascade, defaultExpandAll, load, expandOnFilter } = this
+      this.nonReactive = {
+        store: new TreeStore({
+          keyField,
+          ignoreMode,
+          filteredNodeCheckable,
+          cascade,
+          defaultExpandAll,
+          load,
+          expandOnFilter,
+        }),
+        blockNodes: [],
+      }
+    },
   },
   created () {
     // Initial non-reactive
-    const { keyField, ignoreMode, filteredNodeCheckable, cascade, defaultExpandAll, load, expandOnFilter } = this
-    this.nonReactive = {
-      store: new TreeStore({
-        keyField,
-        ignoreMode,
-        filteredNodeCheckable,
-        cascade,
-        defaultExpandAll,
-        load,
-        expandOnFilter,
-      }),
-      blockNodes: [],
-    }
+    this.initializeNonReactiveData()
 
     this.nonReactive.store.on('visible-data-change', this.updateBlockNodes)
     this.nonReactive.store.on('render-data-change', this.updateRender)
@@ -860,6 +864,7 @@ export default (Vue as VueConstructor<Vue & {
     if ($iframe.contentWindow) {
       $iframe.contentWindow.removeEventListener('resize', this.updateRender)
     }
+    this.initializeNonReactiveData()
   },
   watch: {
     value (newVal: VModelType) {

From 6e539b4c2536271fb9a8105fe5d268a118e5c8ef Mon Sep 17 00:00:00 2001
From: ChuChencheng <azureternite@live.com>
Date: Sun, 11 Jun 2023 04:27:27 +0800
Subject: [PATCH 2/7] chore: update version

---
 package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/package.json b/package.json
index b96efc5..666e6a1 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@wsfe/ctree",
-  "version": "2.3.0",
+  "version": "2.3.1",
   "main": "./dist/ctree.umd.min.js",
   "types": "./types",
   "description": "A vue tree component using virtual list.",

From e54b2506f2bf9b5aef195cb7a5c41a436b8135b9 Mon Sep 17 00:00:00 2001
From: ChuChencheng <azureternite@live.com>
Date: Sun, 11 Jun 2023 04:35:14 +0800
Subject: [PATCH 3/7] feat: update types

---
 types/src/components/Tree.vue.d.ts       | 1 +
 types/src/components/TreeDrop.vue.d.ts   | 3 ++-
 types/src/components/TreeSearch.vue.d.ts | 1 +
 3 files changed, 4 insertions(+), 1 deletion(-)

diff --git a/types/src/components/Tree.vue.d.ts b/types/src/components/Tree.vue.d.ts
index f26c810..f93a9c3 100644
--- a/types/src/components/Tree.vue.d.ts
+++ b/types/src/components/Tree.vue.d.ts
@@ -136,6 +136,7 @@ declare const _default: import("vue/types/vue").ExtendedVue<Vue & {
      */
     updateRenderNodes(isScroll?: boolean): void;
     handleTreeScroll(): void;
+    initializeNonReactiveData(): void;
 }, {
     topSpaceStyles: object;
     bottomSpaceStyles: object;
diff --git a/types/src/components/TreeDrop.vue.d.ts b/types/src/components/TreeDrop.vue.d.ts
index edc1ad2..bb3b2b9 100644
--- a/types/src/components/TreeDrop.vue.d.ts
+++ b/types/src/components/TreeDrop.vue.d.ts
@@ -9,7 +9,7 @@ declare const _default: import("vue/types/vue").ExtendedVue<Vue & {
             checkAllStatus: {
                 checked: boolean;
                 indeterminate: boolean; /** 多选选中节点个数 */
-                disabled: boolean;
+                disabled: boolean; /** 单选选中节点名称 */
             };
             isShowingChecked: boolean;
             /** 展示 slot 的 props */
@@ -149,6 +149,7 @@ declare const _default: import("vue/types/vue").ExtendedVue<Vue & {
                     updateRenderAmount(): void;
                     updateRenderNodes(isScroll?: boolean): void;
                     handleTreeScroll(): void;
+                    initializeNonReactiveData(): void;
                 } & {
                     topSpaceStyles: object;
                     bottomSpaceStyles: object;
diff --git a/types/src/components/TreeSearch.vue.d.ts b/types/src/components/TreeSearch.vue.d.ts
index 4c60f43..71d868d 100644
--- a/types/src/components/TreeSearch.vue.d.ts
+++ b/types/src/components/TreeSearch.vue.d.ts
@@ -67,6 +67,7 @@ declare const _default: import("vue/types/vue").ExtendedVue<Vue & {
             updateRenderAmount(): void;
             updateRenderNodes(isScroll?: boolean): void;
             handleTreeScroll(): void;
+            initializeNonReactiveData(): void;
         } & {
             topSpaceStyles: object;
             bottomSpaceStyles: object;

From 60f4c54d4097a21b7d0d9cc7e6c702acb5d28ce4 Mon Sep 17 00:00:00 2001
From: ChuChencheng <azureternite@live.com>
Date: Wed, 26 Jun 2024 22:51:58 +0800
Subject: [PATCH 4/7] feat: pick 3.x features #71 #79 #88 #89

---
 README.md                                | 101 +++++------
 docs/css/main.4a7507e0.css               |   1 -
 docs/css/main.77aa2d18.css               |   1 +
 docs/index.html                          |   2 +-
 docs/js/main.95d09ea6.js                 |   1 +
 docs/js/main.a980790b.js                 |   1 -
 examples/Feature.vue                     | 168 ++++++++++++++++++
 package.json                             |   2 +-
 src/components/Tree.vue                  | 209 ++++++++++++++++++++++-
 src/components/TreeNode.vue              | 183 +++++++++++++++-----
 src/const/index.ts                       |  14 ++
 src/store/tree-store.ts                  |  30 +++-
 src/styles/tree.less                     |  26 +++
 types/src/components/Tree.vue.d.ts       |  20 +++
 types/src/components/TreeDrop.vue.d.ts   |  19 +++
 types/src/components/TreeNode.vue.d.ts   |  11 +-
 types/src/components/TreeSearch.vue.d.ts |  20 +++
 types/src/const/index.d.ts               |  11 ++
 types/src/store/tree-store.d.ts          |   6 +
 19 files changed, 716 insertions(+), 110 deletions(-)
 delete mode 100644 docs/css/main.4a7507e0.css
 create mode 100644 docs/css/main.77aa2d18.css
 create mode 100644 docs/js/main.95d09ea6.js
 delete mode 100644 docs/js/main.a980790b.js

diff --git a/README.md b/README.md
index 64f097d..59f973e 100644
--- a/README.md
+++ b/README.md
@@ -34,48 +34,50 @@ npm install @wsfe/ctree
 
 ### CTree Props
 
-| 属性                             | 说明                                                                                                          | 类型                                                                                                             | 默认值       |
-|:---------------------------------|:--------------------------------------------------------------------------------------------------------------|:-----------------------------------------------------------------------------------------------------------------|:-------------|
-| value                            | 选中的值，可用 v-model ；单选为字符串或数字，多选为 `separator` 分隔的字符串或数组，优先多选                  | `string \| number \| Array<string \| number>`                                                                    | 无           |
-| data                             | 传入的树数据。数据量大时，不建议通过 props 传入数据，建议用 `setData` 方法代替                                | `object[]`                                                                                                       | []           |
-| unloadDataList                   | 供未加载且选中节点查询 title 字段值用的列表，格式与 `data` 一致即可                                           | `object[]`                                                                                                       | []           |
-| showUnloadCheckedNodes           | 过滤已选时是否在列表后面展示未加载的已选节点                                                                  | `boolean`                                                                                                        | true         |
-| emptyText                        | 数据为空时显示的文本                                                                                          | `string`                                                                                                         | '暂无数据'   |
-| titleField                       | 节点标题字段                                                                                                  | `string`                                                                                                         | 'title'      |
-| keyField                         | 节点唯一标识字段                                                                                              | `string`                                                                                                         | 'id'         |
-| separator                        | 多选模式下 value 分隔符                                                                                       | `string`                                                                                                         | ','          |
-| checkable                        | 是否可多选                                                                                                    | `boolean`                                                                                                        | false        |
-| selectable                       | 是否可单选                                                                                                    | `boolean`                                                                                                        | false        |
-| filteredNodeCheckable            | 是否可勾选被过滤节点                                                                                          | `boolean`                                                                                                        | false        |
-| cascade                          | 父子节点是否关联                                                                                              | `boolean`                                                                                                        | true         |
-| enableLeafOnly                   | 是否只启用子节点，当 `多选且父子不关联` 或 `单选` 时有效                                                      | `boolean`                                                                                                        | false        |
-| disableAll                       | 是否禁用所有节点                                                                                              | `boolean`                                                                                                        | false        |
-| defaultExpandAll                 | 是否默认展开所有节点                                                                                          | `boolean`                                                                                                        | false        |
-| defaultExpandedKeys `Deprecated` | 默认展开的节点 key                                                                                            | `Array<string \| number>`                                                                                        | []           |
-| expandedKeys `2.2.0`             | 展开的节点 key ，组件内部将会响应此 Prop 的变化                                                               | `Array<string \| number>`                                                                                        | []           |
-| draggable                        | 是否可拖拽                                                                                                    | `boolean`                                                                                                        | false        |
-| droppable                        | 是否可放置                                                                                                    | `boolean`                                                                                                        | false        |
-| beforeDropMethod                 | 在放置节点之前执行的方法，返回 true 允许放置， false 可阻止放置                                               | `(dragKey: string \| number, dropKey: string \| number, hoverPart: 'before' \| 'body' \| 'after') => boolean`    | `() => true` |
-| ignoreMode                       | 忽略模式，指定 `getCheckedNodes`, `getCheckedKeys` 与 `v-model` 默认要忽略的部分                              | `'none' \| 'parents' \| 'children'`                                                                              | 'none'       |
-| autoLoad                         | 异步加载初始化时是否自动加载根节点                                                                            | `boolean`                                                                                                        | true         |
-| load                             | 异步加载方法                                                                                                  | `(node: null \| TreeNode, resolve: Function, reject: Function) => any`                                           | 无           |
-| render                           | 节点渲染 render 函数                                                                                          | `(h: CreateElement, node: TreeNode) => VNode`                                                                    | 无           |
-| filterMethod                     | 节点过滤方法                                                                                                  | `(keyword: string, node: TreeNode) => boolean`                                                                   | 无           |
-| expandOnFilter `2.1.0`           | 过滤时是否展开所有可见节点                                                                                    | `boolean`                                                                                                        | true         |
-| unselectOnClick `2.1.0`          | 点击已选中节点是否取消选中                                                                                    | `boolean`                                                                                                        | true         |
-| loading                          | 是否显示 loading 图标                                                                                         | `boolean`                                                                                                        | false        |
-| nodeClassName                    | 节点根元素的 class ，传入函数以对每个节点定制 class                                                           | `string \| object \| Array<string \| object> \| (node: TreeNode) => string \| object \| Array<string \| object>` | 无           |
-| nodeMinHeight                    | 根据节点最小高度计算数据总高度                                                                                | `number`                                                                                                         | 30           |
-| nodeIndent                       | 子节点缩进                                                                                                    | `number`                                                                                                         | 20           |
-| renderNodeAmount                 | 渲染节点数量，可见节点数大于此值且高度超过(容器可视高度能容纳节点数 + bufferNodeAmount)则不会渲染所有可见节点 | `number`                                                                                                         | 100          |
-| bufferNodeAmount                 | 当滚动到视野外的节点个数大于此值时刷新渲染节点                                                                | `number`                                                                                                         | 20           |
+| 属性                             | 说明                                                                                                          | 类型                                                                                                             | 默认值                                                                                              |
+| :------------------------------- | :------------------------------------------------------------------------------------------------------------ | :--------------------------------------------------------------------------------------------------------------- | :-------------------------------------------------------------------------------------------------- |
+| value                            | 选中的值，可用 v-model ；单选为字符串或数字，多选为 `separator` 分隔的字符串或数组，优先多选                  | `string \| number \| Array<string \| number>`                                                                    | 无                                                                                                  |
+| data                             | 传入的树数据。数据量大时，不建议通过 props 传入数据，建议用 `setData` 方法代替                                | `object[]`                                                                                                       | []                                                                                                  |
+| unloadDataList                   | 供未加载且选中节点查询 title 字段值用的列表，格式与 `data` 一致即可                                           | `object[]`                                                                                                       | []                                                                                                  |
+| showUnloadCheckedNodes           | 过滤已选时是否在列表后面展示未加载的已选节点                                                                  | `boolean`                                                                                                        | true                                                                                                |
+| emptyText                        | 数据为空时显示的文本                                                                                          | `string`                                                                                                         | '暂无数据'                                                                                          |
+| titleField                       | 节点标题字段                                                                                                  | `string`                                                                                                         | 'title'                                                                                             |
+| keyField                         | 节点唯一标识字段                                                                                              | `string`                                                                                                         | 'id'                                                                                                |
+| separator                        | 多选模式下 value 分隔符                                                                                       | `string`                                                                                                         | ','                                                                                                 |
+| checkable                        | 是否可多选                                                                                                    | `boolean`                                                                                                        | false                                                                                               |
+| selectable                       | 是否可单选                                                                                                    | `boolean`                                                                                                        | false                                                                                               |
+| filteredNodeCheckable            | 是否可勾选被过滤节点                                                                                          | `boolean`                                                                                                        | false                                                                                               |
+| cascade                          | 父子节点是否关联                                                                                              | `boolean`                                                                                                        | true                                                                                                |
+| enableLeafOnly                   | 是否只启用子节点，当 `多选且父子不关联` 或 `单选` 时有效                                                      | `boolean`                                                                                                        | false                                                                                               |
+| disableAll                       | 是否禁用所有节点                                                                                              | `boolean`                                                                                                        | false                                                                                               |
+| defaultExpandAll                 | 是否默认展开所有节点                                                                                          | `boolean`                                                                                                        | false                                                                                               |
+| defaultExpandedKeys `Deprecated` | 默认展开的节点 key                                                                                            | `Array<string \| number>`                                                                                        | []                                                                                                  |
+| expandedKeys `2.2.0`             | 展开的节点 key ，组件内部将会响应此 Prop 的变化                                                               | `Array<string \| number>`                                                                                        | []                                                                                                  |
+| draggable                        | 是否可拖拽                                                                                                    | `boolean`                                                                                                        | false                                                                                               |
+| droppable                        | 是否可放置                                                                                                    | `boolean`                                                                                                        | false                                                                                               |
+| beforeDropMethod                 | 在放置节点之前执行的方法，返回 true 允许放置， false 可阻止放置                                               | `(dragKey: string \| number, dropKey: string \| number, hoverPart: 'before' \| 'body' \| 'after') => boolean`    | `() => true`                                                                                        |
+| ignoreMode                       | 忽略模式，指定 `getCheckedNodes`, `getCheckedKeys` 与 `v-model` 默认要忽略的部分                              | `'none' \| 'parents' \| 'children'`                                                                              | 'none'                                                                                              |
+| autoLoad                         | 异步加载初始化时是否自动加载根节点                                                                            | `boolean`                                                                                                        | true                                                                                                |
+| load                             | 异步加载方法                                                                                                  | `(node: null \| TreeNode, resolve: Function, reject: Function) => any`                                           | 无                                                                                                  |
+| render                           | 节点渲染 render 函数                                                                                          | `(h: CreateElement, node: TreeNode) => VNode`                                                                    | 无                                                                                                  |
+| filterMethod                     | 节点过滤方法                                                                                                  | `(keyword: string, node: TreeNode) => boolean`                                                                   | 无                                                                                                  |
+| expandOnFilter `2.1.0`           | 过滤时是否展开所有可见节点                                                                                    | `boolean`                                                                                                        | true                                                                                                |
+| unselectOnClick `2.1.0`          | 点击已选中节点是否取消选中                                                                                    | `boolean`                                                                                                        | true                                                                                                |
+| loading                          | 是否显示 loading 图标                                                                                         | `boolean`                                                                                                        | false                                                                                               |
+| nodeClassName                    | 节点根元素的 class ，传入函数以对每个节点定制 class                                                           | `string \| object \| Array<string \| object> \| (node: TreeNode) => string \| object \| Array<string \| object>` | 无                                                                                                  |
+| showLine `2.4.0`                 | 是否显示连接线，可指定连接线的宽度、颜色、实线、虚线，以及是否有折线                                          | `boolean \| { width?: number, type?: 'dashed' \| 'solid', color?: string, polyline?: boolean }`                  | 无，如果传入的非 boolean，则默认为 `{ width: 1, type: 'solid', color: '#D3D3D3', polyline: false }` |
+| animation `2.4.0`                | 是否启用过渡动画，目前仅控制展开收起                                                                          | `boolean`                                                                                                        | 无                                                                                                  |
+| nodeMinHeight                    | 根据节点最小高度计算数据总高度                                                                                | `number`                                                                                                         | 30                                                                                                  |
+| nodeIndent                       | 子节点缩进                                                                                                    | `number`                                                                                                         | 20                                                                                                  |
+| renderNodeAmount                 | 渲染节点数量，可见节点数大于此值且高度超过(容器可视高度能容纳节点数 + bufferNodeAmount)则不会渲染所有可见节点 | `number`                                                                                                         | 100                                                                                                 |
+| bufferNodeAmount                 | 当滚动到视野外的节点个数大于此值时刷新渲染节点                                                                | `number`                                                                                                         | 20                                                                                                  |
 
 ### CTree Events
 
 注：从 `2.0.8` 起，事件中返回的节点信息都是包括 `_parent` 与 `children` 的完整节点信息（拖拽事件的 `dataTransfer` 除外）。
 
 | 事件名           | 说明                        | 返回值                                                                      |
-|:-----------------|:----------------------------|:----------------------------------------------------------------------------|
+| :--------------- | :-------------------------- | :-------------------------------------------------------------------------- |
 | input            | 选中节点改变时触发          | 选中的节点                                                                  |
 | expand           | 展开/折叠时触发             | 节点信息                                                                    |
 | check            | 勾选时触发（多选）          | 被勾选的节点信息                                                            |
@@ -96,7 +98,7 @@ npm install @wsfe/ctree
 ### CTree Methods
 
 | 方法                   | 说明                                            | 参数                                                                                                                                                                                                | 返回值                            |
-|:-----------------------|:------------------------------------------------|:----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|:----------------------------------|
+| :--------------------- | :---------------------------------------------- | :-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | :-------------------------------- |
 | setData                | 使用此方法重置树数据，可避免大量数据被 vue 监听 | `data: object[]`: 同 data Prop                                                                                                                                                                      | `void`                            |
 | setChecked             | 设置多选选中/取消选中                           | `key: string \| number`: 节点 key<br/>`value: boolean`: 是否选中                                                                                                                                    | `void`                            |
 | setCheckedKeys         | 批量设置选中/取消选中                           | `keys: Array<string \| number>`: 节点 key<br/>`value: boolean`: 是否选中                                                                                                                            | `void`                            |
@@ -130,17 +132,18 @@ npm install @wsfe/ctree
 
 ### CTree Slots
 
-| 名称    | 说明             |
-|:--------|:-----------------|
-| empty   | 暂无数据         |
-| loading | 加载中显示的图标 |
+| 名称         | 说明                                          |
+| :----------- | :-------------------------------------------- |
+| empty        | 暂无数据                                      |
+| loading      | 加载中显示的图标                              |
+| node `2.4.0` | 自定义节点，slotProps 为 `{ node: TreeNode }` |
 
 ### CTree Data Fields
 
 注：以 '`_`' 开头的字段最好不要覆盖，以免影响内部处理逻辑
 
 | 字段           | 说明                                                                            |
-|:---------------|:--------------------------------------------------------------------------------|
+| :------------- | :------------------------------------------------------------------------------ |
 | id             | 默认以 'id' 作为 key 字段，也可以通过 `keyField` Prop 指定其他字段作为 key 字段 |
 | title          | 默认显示的名称，可通过 `titleField` Prop 指定其他字段作为 title 字段            |
 | checked        | 多选模式下是否勾选                                                              |
@@ -164,7 +167,7 @@ npm install @wsfe/ctree
 注：可在 `CTreeSearch` 上直接使用 `CTree` 的所有 Props
 
 | 属性                 | 说明                                                                               | 类型                                         | 默认值       |
-|:---------------------|:-----------------------------------------------------------------------------------|:---------------------------------------------|:-------------|
+| :------------------- | :--------------------------------------------------------------------------------- | :------------------------------------------- | :----------- |
 | searchPlaceholder    | 搜索输入框的 placeholder                                                           | `string`                                     | '搜索关键字' |
 | showCheckAll         | 是否显示全选复选框                                                                 | `boolean`                                    | true         |
 | showCheckedButton    | 是否显示已选按钮                                                                   | `boolean`                                    | true         |
@@ -181,7 +184,7 @@ npm install @wsfe/ctree
 注：可在 `CTreeSearch` 上直接监听 `CTree` 的所有 Events
 
 | 事件名 | 说明               | 返回值       |
-|:-------|:-------------------|:-------------|
+| :----- | :----------------- | :----------- |
 | search | 执行搜索操作时触发 | 搜索的关键字 |
 
 ### CTreeSearch Methods
@@ -189,7 +192,7 @@ npm install @wsfe/ctree
 注：可在 `CTreeSearch` 上直接调用 `CTree` 的所有 Methods
 
 | 方法         | 说明           | 参数                                                     | 返回值          |
-|:-------------|:---------------|:---------------------------------------------------------|:----------------|
+| :----------- | :------------- | :------------------------------------------------------- | :-------------- |
 | clearKeyword | 清空关键字     | 无                                                       | `void`          |
 | getKeyword   | 获取搜索关键字 | 无                                                       | `string`        |
 | search       | 执行搜索       | `keyword: string`: 搜索的关键字，默认为内部 this.keyword | `Promise<void>` |
@@ -199,7 +202,7 @@ npm install @wsfe/ctree
 注：可在 `CTreeSearch` 上直接传入 `CTree` 的所有 Slots
 
 | 名称         | 说明                                               |
-|:-------------|:---------------------------------------------------|
+| :----------- | :------------------------------------------------- |
 | search-input | 搜索输入框，可通过此 slot 自行封装树搜索组件的行为 |
 | actions      | 操作按钮，可在搜索输入框后加入更多操作按钮         |
 | footer       | 底部信息                                           |
@@ -211,7 +214,7 @@ npm install @wsfe/ctree
 注：可在 `CTreeDrop` 上直接使用 `CTree` 和 `CTreeSearch` 的所有 Props
 
 | 属性                       | 说明                                                                             | 类型                                                                              | 默认值         |
-|:---------------------------|:---------------------------------------------------------------------------------|:----------------------------------------------------------------------------------|:---------------|
+| :------------------------- | :------------------------------------------------------------------------------- | :-------------------------------------------------------------------------------- | :------------- |
 | dropHeight                 | 下拉内容高度                                                                     | `number`                                                                          | 300            |
 | dropPlaceholder            | 展示输入框 placeholder                                                           | `string`                                                                          | 无             |
 | dropDisabled               | 是否禁用                                                                         | `boolean`                                                                         | false          |
@@ -227,7 +230,7 @@ npm install @wsfe/ctree
 注：可在 `CTreeDrop` 上直接监听 `CTree` 和 `CTreeSearch` 的所有 Events
 
 | 事件名                  | 说明                   | 返回值         |
-|:------------------------|:-----------------------|:---------------|
+| :---------------------- | :--------------------- | :------------- |
 | dropdown-visible-change | 下拉框出现或消失时触发 | 下拉框是否可见 |
 | clear                   | 点击清空按钮时触发     | 无             |
 
@@ -240,7 +243,7 @@ npm install @wsfe/ctree
 注：可在 `CTreeDrop` 上直接传入 `CTree` 和 `CTreeSearch` 的所有 Slots
 
 | 名称    | 说明                                                 |
-|:--------|:-----------------------------------------------------|
+| :------ | :--------------------------------------------------- |
 | 默认    | 展示输入框                                           |
 | display | 展示输入框的展示文字，如果有默认 slot 则此 slot 无效 |
 | clear   | 替换清空图标，如果有默认 slot 则此 slot 无效         |
diff --git a/docs/css/main.4a7507e0.css b/docs/css/main.4a7507e0.css
deleted file mode 100644
index 54c62e8..0000000
--- a/docs/css/main.4a7507e0.css
+++ /dev/null
@@ -1 +0,0 @@
-@-webkit-keyframes ctree-animation-spin{0%{-webkit-transform:rotate(0deg) translateZ(0);transform:rotate(0deg) translateZ(0)}to{-webkit-transform:rotate(1turn) translateZ(0);transform:rotate(1turn) translateZ(0)}}@keyframes ctree-animation-spin{0%{-webkit-transform:rotate(0deg) translateZ(0);transform:rotate(0deg) translateZ(0)}to{-webkit-transform:rotate(1turn) translateZ(0);transform:rotate(1turn) translateZ(0)}}@-webkit-keyframes ctree-animation-svg-circle-spin{0%{stroke-dasharray:1 130;stroke-dashoffset:0}50%{stroke-dasharray:90 130;stroke-dashoffset:-30}to{stroke-dasharray:90 130;stroke-dashoffset:-124}}@keyframes ctree-animation-svg-circle-spin{0%{stroke-dasharray:1 130;stroke-dashoffset:0}50%{stroke-dasharray:90 130;stroke-dashoffset:-30}to{stroke-dasharray:90 130;stroke-dashoffset:-124}}.ctree-tree__scroll-area,.ctree-tree__wrapper{width:100%;height:100%;position:relative}.ctree-tree__scroll-area{overflow:auto;display:-webkit-box;display:-ms-flexbox;display:flex}.ctree-tree__block-area{-webkit-box-flex:1;-ms-flex:1;flex:1}.ctree-tree__empty{width:100%;height:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;position:absolute;top:0;left:0}.ctree-tree__empty-text_default{width:100%;text-align:center}.ctree-tree__loading{width:100%;height:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;position:absolute;top:0;left:0;background-color:hsla(0,0%,100%,.95)}.ctree-tree__loading-wrapper{width:100%;text-align:center}.ctree-tree__loading-icon{display:inline-block;width:30px;height:30px;-webkit-animation:ctree-animation-spin 2s linear infinite;animation:ctree-animation-spin 2s linear infinite}.ctree-tree__loading-icon .ctree-loading-icon__circle{stroke:#2d8cf0;stroke-linecap:round;-webkit-animation:ctree-animation-svg-circle-spin 1.5s ease-in-out infinite;animation:ctree-animation-svg-circle-spin 1.5s ease-in-out infinite}.ctree-tree__iframe{width:100%;height:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;position:absolute;top:0;left:0;display:block;border:none;padding:0;margin:0;opacity:0;z-index:-1000;pointer-events:none}.ctree-tree-node__wrapper{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.ctree-tree-node__drop{width:100%;height:2px}.ctree-tree-node__drop_active{background-color:#5cadff}.ctree-tree-node__node-body{-webkit-box-flex:1;-ms-flex:1;flex:1;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.ctree-tree-node__square{width:20px;height:20px;-ms-flex-negative:0;flex-shrink:0}.ctree-tree-node__expand,.ctree-tree-node__square{position:relative;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.ctree-tree-node__expand{cursor:pointer;width:16px;height:16px;-webkit-transition:-webkit-transform .2s linear;transition:-webkit-transform .2s linear;transition:transform .2s linear;transition:transform .2s linear,-webkit-transform .2s linear}.ctree-tree-node__expand:after{content:"";display:block;width:0;height:0;position:absolute;border:5px solid transparent;border-left:5px solid #515a6e}.ctree-tree-node__expand_active{-webkit-transform:rotate(90deg);transform:rotate(90deg)}.ctree-tree-node__loading-icon{display:inline-block;width:14px;height:14px;-webkit-animation:ctree-animation-spin 2s linear infinite;animation:ctree-animation-spin 2s linear infinite}.ctree-tree-node__loading-icon .ctree-loading-icon__circle{stroke:#515a6e;stroke-linecap:round;-webkit-animation:ctree-animation-svg-circle-spin 1.5s ease-in-out infinite;animation:ctree-animation-svg-circle-spin 1.5s ease-in-out infinite}.ctree-tree-node__checkbox{cursor:pointer;width:14px;height:14px;border:1px solid;border-color:#dcdee2;border-radius:2px;background-color:#fff;-webkit-transition:border-color .2s ease-in-out,background-color .2s ease-in-out,-webkit-box-shadow .2s ease-in-out;transition:border-color .2s ease-in-out,background-color .2s ease-in-out,-webkit-box-shadow .2s ease-in-out;transition:border-color .2s ease-in-out,background-color .2s ease-in-out,box-shadow .2s ease-in-out;transition:border-color .2s ease-in-out,background-color .2s ease-in-out,box-shadow .2s ease-in-out,-webkit-box-shadow .2s ease-in-out}.ctree-tree-node__checkbox,.ctree-tree-node__checkbox:after{-webkit-box-sizing:border-box;box-sizing:border-box;position:absolute}.ctree-tree-node__checkbox:after{content:"";display:table;border:2px solid #fff;border-top:0;border-left:0;width:4px;height:8px;top:1px;left:4px;-webkit-transform:rotate(45deg) scale(0);transform:rotate(45deg) scale(0);-webkit-transition:all .2s ease-in-out;transition:all .2s ease-in-out}.ctree-tree-node__checkbox:hover{border-color:#c5c8ce}.ctree-tree-node__checkbox:focus{-webkit-box-shadow:0 0 0 2px #5cadff;box-shadow:0 0 0 2px #5cadff}.ctree-tree-node__checkbox_checked{border-color:#2d8cf0;background-color:#2d8cf0}.ctree-tree-node__checkbox_checked:after{width:4px;height:8px;top:1px;left:4px;-webkit-transform:rotate(45deg) scale(1);transform:rotate(45deg) scale(1)}.ctree-tree-node__checkbox_checked:hover,.ctree-tree-node__checkbox_indeterminate{border-color:#2d8cf0;background-color:#2d8cf0}.ctree-tree-node__checkbox_indeterminate:after{width:8px;height:1px;top:5px;left:2px;-webkit-transform:scale(1);transform:scale(1)}.ctree-tree-node__checkbox_indeterminate:hover{border-color:#2d8cf0;background-color:#2d8cf0}.ctree-tree-node__checkbox_disabled{cursor:not-allowed}.ctree-tree-node__checkbox_disabled,.ctree-tree-node__checkbox_disabled:hover{border-color:#dcdee2;background-color:#e8eaec}.ctree-tree-node__checkbox_disabled:after{border-color:#c5c8ce}.ctree-tree-node__title{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-box-flex:1;-ms-flex:1;flex:1;height:26px;line-height:26px;margin-left:5px;padding-left:5px;background-color:transparent;word-break:keep-all;white-space:nowrap;word-wrap:none}.ctree-tree-node__title:hover{background-color:#ebf5ff}.ctree-tree-node__title_selected,.ctree-tree-node__title_selected:hover{background-color:#d4e7fc}.ctree-tree-node__title_disabled{cursor:not-allowed;color:#c5c8ce}.ctree-tree-search__wrapper{width:100%;height:100%;position:relative;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.ctree-tree-search__search{height:42px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-sizing:border-box;box-sizing:border-box}.ctree-tree-search__check-all-wrapper{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-pack:initial;-ms-flex-pack:initial;justify-content:normal;width:40px}.ctree-tree-search__check-all{margin-left:23px}.ctree-tree-search__input-wrapper{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;padding-left:5px;-webkit-box-flex:1;-ms-flex:1;flex:1}.ctree-tree-search__input{color:#515a6e;-webkit-box-sizing:border-box;box-sizing:border-box;width:100%;height:32px;border:1px solid #dcdee2;border-radius:4px;padding:4px 7px;outline:none;-webkit-transition:border .2s ease-in-out,-webkit-box-shadow .2s ease-in-out;transition:border .2s ease-in-out,-webkit-box-shadow .2s ease-in-out;transition:border .2s ease-in-out,box-shadow .2s ease-in-out;transition:border .2s ease-in-out,box-shadow .2s ease-in-out,-webkit-box-shadow .2s ease-in-out}.ctree-tree-search__input::-webkit-input-placeholder{color:#c5c8ce}.ctree-tree-search__input::-moz-placeholder{color:#c5c8ce}.ctree-tree-search__input:-ms-input-placeholder{color:#c5c8ce}.ctree-tree-search__input::-ms-input-placeholder{color:#c5c8ce}.ctree-tree-search__input::placeholder{color:#c5c8ce}.ctree-tree-search__input:hover{border-color:#57a3f3}.ctree-tree-search__input:focus{border-color:#57a3f3;-webkit-box-shadow:0 0 0 2px rgba(45,140,240,.2);box-shadow:0 0 0 2px rgba(45,140,240,.2)}.ctree-tree-search__input_disabled{cursor:not-allowed;color:#ccc;background-color:#f3f3f3}.ctree-tree-search__input_disabled:hover{border-color:#dcdee2}.ctree-tree-search__action-wrapper{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;padding:0 10px}.ctree-tree-search__checked-button{cursor:pointer}.ctree-tree-search__checked-button:hover{color:#5cadff}.ctree-tree-search__checked-button_active{color:#2d8cf0}.ctree-tree-search__tree-wrapper{width:100%;-webkit-box-flex:1;-ms-flex:1;flex:1;overflow-y:auto}.ctree-tree-search__footer{padding:5px}.ctree-tree-drop__wrapper{position:relative}.ctree-tree-drop__reference{cursor:pointer}.ctree-tree-drop__display-input{position:relative;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;padding-right:20px}.ctree-tree-drop__display-input-text{display:block;height:100%;line-height:22px}.ctree-tree-drop__display-input-placeholder{color:#c5c8ce}.ctree-tree-drop__display-input_focus{border-color:#57a3f3;-webkit-box-shadow:0 0 0 2px rgba(45,140,240,.2);box-shadow:0 0 0 2px rgba(45,140,240,.2)}.ctree-tree-drop__display-icon-drop{position:absolute;top:8px;right:3px;width:14px;height:14px;-webkit-box-sizing:border-box;box-sizing:border-box;border:3px solid #808695;border-top:none;border-left:none;-webkit-transform:rotate(45deg) scale(.5) translateX(-3.5px) translateY(-3.5px);transform:rotate(45deg) scale(.5) translateX(-3.5px) translateY(-3.5px);-webkit-transition:-webkit-transform .2s ease-in-out;transition:-webkit-transform .2s ease-in-out;transition:transform .2s ease-in-out;transition:transform .2s ease-in-out,-webkit-transform .2s ease-in-out}.ctree-tree-drop__display-icon-drop_active{-webkit-transform:rotate(225deg) scale(.5) translateX(-3.5px) translateY(-3.5px);transform:rotate(225deg) scale(.5) translateX(-3.5px) translateY(-3.5px)}.ctree-tree-drop__display-icon-clear{position:absolute;top:8px;right:3px;width:14px;height:14px;-webkit-box-sizing:border-box;box-sizing:border-box;border-radius:50%;background-color:#808695;overflow:hidden;-webkit-transform:scale(.9) rotate(45deg);transform:scale(.9) rotate(45deg);display:none}.ctree-tree-drop__display-icon-clear:after,.ctree-tree-drop__display-icon-clear:before{content:"";width:1px;height:7px;display:block;background-color:#fff;position:absolute;top:3.5px;left:6.5px}.ctree-tree-drop__display-icon-clear:after{-webkit-transform:rotate(90deg);transform:rotate(90deg)}.ctree-tree-drop__display-input:hover .ctree-tree-drop__display-icon-clear{display:block}.ctree-tree-drop__dropdown{position:absolute;top:-999px;left:-999px;-webkit-box-shadow:0 1px 6px rgba(0,0,0,.2);box-shadow:0 1px 6px rgba(0,0,0,.2);border-radius:4px;margin:5px 0;padding:5px 0;-webkit-transform-origin:center top 0;transform-origin:center top 0;background-color:#fff;z-index:9999}.ctree-tree-drop__dropdown .ctree-tree-search__search{border-bottom:1px solid #dcdee2;padding-bottom:5px;height:38px}.ctree-tree-drop__dropdown .ctree-tree-search__tree-wrapper{padding-top:5px}.ctree-dropdown-enter,.ctree-dropdown-leave-to{opacity:0;-webkit-transform:scaleY(.8);transform:scaleY(.8)}.ctree-dropdown-enter-active,.ctree-dropdown-leave-active{-webkit-transition:opacity .3s,-webkit-transform .3s;transition:opacity .3s,-webkit-transform .3s;transition:opacity .3s,transform .3s;transition:opacity .3s,transform .3s,-webkit-transform .3s}.container[data-v-01d42e0f]{width:100%;height:100%;padding:10px;-webkit-box-sizing:border-box;box-sizing:border-box}.container .panel[data-v-01d42e0f]{width:100%;margin-bottom:10px;border:1px solid #d3d3d3;border-radius:5px}.container .panel .header[data-v-01d42e0f]{height:30px;border-bottom:1px solid #d3d3d3;padding:10px 30px}.container .panel .body[data-v-01d42e0f]{display:-webkit-box;display:-ms-flexbox;display:flex}.container .panel .body .interface[data-v-01d42e0f]{border-right:1px solid #d3d3d3}.container .panel .body .desc[data-v-01d42e0f],.container .panel .body .interface[data-v-01d42e0f]{-webkit-box-flex:1;-ms-flex:1;flex:1;padding:10px 30px}.container .panel .body .desc .desc-block[data-v-01d42e0f]{padding:5px 0;margin-bottom:10px;border-bottom:1px solid #d3d3d3}.container .panel .body .desc .desc-block[data-v-01d42e0f]:last-child{border-bottom:none}.container[data-v-f597b4c8]{width:100%;height:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row}.container .tree[data-v-f597b4c8]{-webkit-box-flex:2;-ms-flex:2;flex:2}.container .control[data-v-f597b4c8]{-webkit-box-flex:1;-ms-flex:1;flex:1;padding:30px 0;border-left:1px solid grey}.container .control .desc-block[data-v-f597b4c8]{padding:10px 30px;margin-bottom:20px}.container .control .controls[data-v-f597b4c8]{padding:10px}.container .control .controls label[data-v-f597b4c8]{display:inline-block;width:120px;text-align:right}.container .control .controls .actions[data-v-f597b4c8]{margin-left:120px;margin-bottom:10px}.container .control .controls .actions button[data-v-f597b4c8]{cursor:pointer;margin-right:10px}.app[data-v-6c2a65d2]{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;width:100%;height:100%}.app .tab[data-v-6c2a65d2]{height:90px;padding:10px 50px;border-bottom:1px solid #d3d3d3}.app .tab button[data-v-6c2a65d2]{cursor:pointer;width:100px;height:38px;margin-right:30px;margin-bottom:10px;border-radius:5px;background:#e0ffff}.app .tab button[data-v-6c2a65d2]:focus{outline:none}.app .tab .active[data-v-6c2a65d2]{background:#add8e6}.app .tab-panel[data-v-6c2a65d2]{-webkit-box-flex:1;-ms-flex:1;flex:1;overflow-y:auto}body,html{width:100%;height:100%;margin:0;padding:0}
\ No newline at end of file
diff --git a/docs/css/main.77aa2d18.css b/docs/css/main.77aa2d18.css
new file mode 100644
index 0000000..91fafc7
--- /dev/null
+++ b/docs/css/main.77aa2d18.css
@@ -0,0 +1 @@
+@-webkit-keyframes ctree-animation-spin{0%{-webkit-transform:rotate(0deg) translateZ(0);transform:rotate(0deg) translateZ(0)}to{-webkit-transform:rotate(1turn) translateZ(0);transform:rotate(1turn) translateZ(0)}}@keyframes ctree-animation-spin{0%{-webkit-transform:rotate(0deg) translateZ(0);transform:rotate(0deg) translateZ(0)}to{-webkit-transform:rotate(1turn) translateZ(0);transform:rotate(1turn) translateZ(0)}}@-webkit-keyframes ctree-animation-svg-circle-spin{0%{stroke-dasharray:1 130;stroke-dashoffset:0}50%{stroke-dasharray:90 130;stroke-dashoffset:-30}to{stroke-dasharray:90 130;stroke-dashoffset:-124}}@keyframes ctree-animation-svg-circle-spin{0%{stroke-dasharray:1 130;stroke-dashoffset:0}50%{stroke-dasharray:90 130;stroke-dashoffset:-30}to{stroke-dasharray:90 130;stroke-dashoffset:-124}}.ctree-tree__scroll-area,.ctree-tree__wrapper{width:100%;height:100%;position:relative}.ctree-tree__scroll-area{overflow:auto;display:-webkit-box;display:-ms-flexbox;display:flex}.ctree-tree__block-area{-webkit-box-flex:1;-ms-flex:1;flex:1}.ctree-tree__empty{width:100%;height:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;position:absolute;top:0;left:0}.ctree-tree__empty-text_default{width:100%;text-align:center}.ctree-tree__loading{width:100%;height:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;position:absolute;top:0;left:0;background-color:hsla(0,0%,100%,.95)}.ctree-tree__loading-wrapper{width:100%;text-align:center}.ctree-tree__loading-icon{display:inline-block;width:30px;height:30px;-webkit-animation:ctree-animation-spin 2s linear infinite;animation:ctree-animation-spin 2s linear infinite}.ctree-tree__loading-icon .ctree-loading-icon__circle{stroke:#2d8cf0;stroke-linecap:round;-webkit-animation:ctree-animation-svg-circle-spin 1.5s ease-in-out infinite;animation:ctree-animation-svg-circle-spin 1.5s ease-in-out infinite}.ctree-tree__iframe{width:100%;height:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;position:absolute;top:0;left:0;display:block;border:none;padding:0;margin:0;opacity:0;z-index:-1000;pointer-events:none}.ctree-tree-node__indent-wrapper,.ctree-tree-node__wrapper{display:-webkit-box;display:-ms-flexbox;display:flex}.ctree-tree-node__wrapper{-webkit-box-flex:1;-ms-flex:1;flex:1;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.ctree-tree-node__drop{width:100%;height:2px}.ctree-tree-node__drop_active{background-color:#5cadff}.ctree-tree-node__node-body{-webkit-box-flex:1;-ms-flex:1;flex:1;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.ctree-tree-node__square{width:20px;height:20px;-ms-flex-negative:0;flex-shrink:0}.ctree-tree-node__expand,.ctree-tree-node__square{position:relative;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.ctree-tree-node__expand{cursor:pointer;width:16px;height:16px;-webkit-transition:-webkit-transform .2s linear;transition:-webkit-transform .2s linear;transition:transform .2s linear;transition:transform .2s linear,-webkit-transform .2s linear}.ctree-tree-node__expand:after{content:"";display:block;width:0;height:0;position:absolute;border:5px solid transparent;border-left:5px solid #515a6e}.ctree-tree-node__expand_active{-webkit-transform:rotate(90deg);transform:rotate(90deg)}.ctree-tree-node__loading-icon{display:inline-block;width:14px;height:14px;-webkit-animation:ctree-animation-spin 2s linear infinite;animation:ctree-animation-spin 2s linear infinite}.ctree-tree-node__loading-icon .ctree-loading-icon__circle{stroke:#515a6e;stroke-linecap:round;-webkit-animation:ctree-animation-svg-circle-spin 1.5s ease-in-out infinite;animation:ctree-animation-svg-circle-spin 1.5s ease-in-out infinite}.ctree-tree-node__checkbox{cursor:pointer;width:14px;height:14px;border:1px solid;border-color:#dcdee2;border-radius:2px;background-color:#fff;-webkit-transition:border-color .2s ease-in-out,background-color .2s ease-in-out,-webkit-box-shadow .2s ease-in-out;transition:border-color .2s ease-in-out,background-color .2s ease-in-out,-webkit-box-shadow .2s ease-in-out;transition:border-color .2s ease-in-out,background-color .2s ease-in-out,box-shadow .2s ease-in-out;transition:border-color .2s ease-in-out,background-color .2s ease-in-out,box-shadow .2s ease-in-out,-webkit-box-shadow .2s ease-in-out}.ctree-tree-node__checkbox,.ctree-tree-node__checkbox:after{-webkit-box-sizing:border-box;box-sizing:border-box;position:absolute}.ctree-tree-node__checkbox:after{content:"";display:table;border:2px solid #fff;border-top:0;border-left:0;width:4px;height:8px;top:1px;left:4px;-webkit-transform:rotate(45deg) scale(0);transform:rotate(45deg) scale(0);-webkit-transition:all .2s ease-in-out;transition:all .2s ease-in-out}.ctree-tree-node__checkbox:hover{border-color:#c5c8ce}.ctree-tree-node__checkbox:focus{-webkit-box-shadow:0 0 0 2px #5cadff;box-shadow:0 0 0 2px #5cadff}.ctree-tree-node__checkbox_checked{border-color:#2d8cf0;background-color:#2d8cf0}.ctree-tree-node__checkbox_checked:after{width:4px;height:8px;top:1px;left:4px;-webkit-transform:rotate(45deg) scale(1);transform:rotate(45deg) scale(1)}.ctree-tree-node__checkbox_checked:hover,.ctree-tree-node__checkbox_indeterminate{border-color:#2d8cf0;background-color:#2d8cf0}.ctree-tree-node__checkbox_indeterminate:after{width:8px;height:1px;top:5px;left:2px;-webkit-transform:scale(1);transform:scale(1)}.ctree-tree-node__checkbox_indeterminate:hover{border-color:#2d8cf0;background-color:#2d8cf0}.ctree-tree-node__checkbox_disabled{cursor:not-allowed}.ctree-tree-node__checkbox_disabled,.ctree-tree-node__checkbox_disabled:hover{border-color:#dcdee2;background-color:#e8eaec}.ctree-tree-node__checkbox_disabled:after{border-color:#c5c8ce}.ctree-tree-node__title{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-box-flex:1;-ms-flex:1;flex:1;height:26px;line-height:26px;margin-left:5px;padding-left:5px;background-color:transparent;word-break:keep-all;white-space:nowrap;word-wrap:none}.ctree-tree-node__title:hover{background-color:#ebf5ff}.ctree-tree-node__title_selected,.ctree-tree-node__title_selected:hover{background-color:#d4e7fc}.ctree-tree-node__title_disabled{cursor:not-allowed;color:#c5c8ce}.ctree-expand-animation-enter,.ctree-expand-animation-leave-to{opacity:0;grid-template-rows:0fr}.ctree-expand-animation-enter-to,.ctree-expand-animation-leave{opacity:1;grid-template-rows:1fr}.ctree-expand-animation-enter-active,.ctree-expand-animation-leave-active{-webkit-transition:opacity .2s,grid-template-rows .2s;transition:opacity .2s,grid-template-rows .2s;transition:opacity .2s,grid-template-rows .2s,-ms-grid-rows .2s}.ctree-tree-search__wrapper{width:100%;height:100%;position:relative;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.ctree-tree-search__search{height:42px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-sizing:border-box;box-sizing:border-box}.ctree-tree-search__check-all-wrapper{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-pack:initial;-ms-flex-pack:initial;justify-content:normal;width:40px}.ctree-tree-search__check-all{margin-left:23px}.ctree-tree-search__input-wrapper{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;padding-left:5px;-webkit-box-flex:1;-ms-flex:1;flex:1}.ctree-tree-search__input{color:#515a6e;-webkit-box-sizing:border-box;box-sizing:border-box;width:100%;height:32px;border:1px solid #dcdee2;border-radius:4px;padding:4px 7px;outline:none;-webkit-transition:border .2s ease-in-out,-webkit-box-shadow .2s ease-in-out;transition:border .2s ease-in-out,-webkit-box-shadow .2s ease-in-out;transition:border .2s ease-in-out,box-shadow .2s ease-in-out;transition:border .2s ease-in-out,box-shadow .2s ease-in-out,-webkit-box-shadow .2s ease-in-out}.ctree-tree-search__input::-webkit-input-placeholder{color:#c5c8ce}.ctree-tree-search__input::-moz-placeholder{color:#c5c8ce}.ctree-tree-search__input:-ms-input-placeholder{color:#c5c8ce}.ctree-tree-search__input::-ms-input-placeholder{color:#c5c8ce}.ctree-tree-search__input::placeholder{color:#c5c8ce}.ctree-tree-search__input:hover{border-color:#57a3f3}.ctree-tree-search__input:focus{border-color:#57a3f3;-webkit-box-shadow:0 0 0 2px rgba(45,140,240,.2);box-shadow:0 0 0 2px rgba(45,140,240,.2)}.ctree-tree-search__input_disabled{cursor:not-allowed;color:#ccc;background-color:#f3f3f3}.ctree-tree-search__input_disabled:hover{border-color:#dcdee2}.ctree-tree-search__action-wrapper{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;padding:0 10px}.ctree-tree-search__checked-button{cursor:pointer}.ctree-tree-search__checked-button:hover{color:#5cadff}.ctree-tree-search__checked-button_active{color:#2d8cf0}.ctree-tree-search__tree-wrapper{width:100%;-webkit-box-flex:1;-ms-flex:1;flex:1;overflow-y:auto}.ctree-tree-search__footer{padding:5px}.ctree-tree-drop__wrapper{position:relative}.ctree-tree-drop__reference{cursor:pointer}.ctree-tree-drop__display-input{position:relative;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;padding-right:20px}.ctree-tree-drop__display-input-text{display:block;height:100%;line-height:22px}.ctree-tree-drop__display-input-placeholder{color:#c5c8ce}.ctree-tree-drop__display-input_focus{border-color:#57a3f3;-webkit-box-shadow:0 0 0 2px rgba(45,140,240,.2);box-shadow:0 0 0 2px rgba(45,140,240,.2)}.ctree-tree-drop__display-icon-drop{position:absolute;top:8px;right:3px;width:14px;height:14px;-webkit-box-sizing:border-box;box-sizing:border-box;border:3px solid #808695;border-top:none;border-left:none;-webkit-transform:rotate(45deg) scale(.5) translateX(-3.5px) translateY(-3.5px);transform:rotate(45deg) scale(.5) translateX(-3.5px) translateY(-3.5px);-webkit-transition:-webkit-transform .2s ease-in-out;transition:-webkit-transform .2s ease-in-out;transition:transform .2s ease-in-out;transition:transform .2s ease-in-out,-webkit-transform .2s ease-in-out}.ctree-tree-drop__display-icon-drop_active{-webkit-transform:rotate(225deg) scale(.5) translateX(-3.5px) translateY(-3.5px);transform:rotate(225deg) scale(.5) translateX(-3.5px) translateY(-3.5px)}.ctree-tree-drop__display-icon-clear{position:absolute;top:8px;right:3px;width:14px;height:14px;-webkit-box-sizing:border-box;box-sizing:border-box;border-radius:50%;background-color:#808695;overflow:hidden;-webkit-transform:scale(.9) rotate(45deg);transform:scale(.9) rotate(45deg);display:none}.ctree-tree-drop__display-icon-clear:after,.ctree-tree-drop__display-icon-clear:before{content:"";width:1px;height:7px;display:block;background-color:#fff;position:absolute;top:3.5px;left:6.5px}.ctree-tree-drop__display-icon-clear:after{-webkit-transform:rotate(90deg);transform:rotate(90deg)}.ctree-tree-drop__display-input:hover .ctree-tree-drop__display-icon-clear{display:block}.ctree-tree-drop__dropdown{position:absolute;top:-999px;left:-999px;-webkit-box-shadow:0 1px 6px rgba(0,0,0,.2);box-shadow:0 1px 6px rgba(0,0,0,.2);border-radius:4px;margin:5px 0;padding:5px 0;-webkit-transform-origin:center top 0;transform-origin:center top 0;background-color:#fff;z-index:9999}.ctree-tree-drop__dropdown .ctree-tree-search__search{border-bottom:1px solid #dcdee2;padding-bottom:5px;height:38px}.ctree-tree-drop__dropdown .ctree-tree-search__tree-wrapper{padding-top:5px}.ctree-dropdown-enter,.ctree-dropdown-leave-to{opacity:0;-webkit-transform:scaleY(.8);transform:scaleY(.8)}.ctree-dropdown-enter-active,.ctree-dropdown-leave-active{-webkit-transition:opacity .3s,-webkit-transform .3s;transition:opacity .3s,-webkit-transform .3s;transition:opacity .3s,transform .3s;transition:opacity .3s,transform .3s,-webkit-transform .3s}.container[data-v-15aa1b8d]{width:100%;height:100%;padding:10px;-webkit-box-sizing:border-box;box-sizing:border-box}.container .panel[data-v-15aa1b8d]{width:100%;margin-bottom:10px;border:1px solid #d3d3d3;border-radius:5px}.container .panel .header[data-v-15aa1b8d]{height:30px;border-bottom:1px solid #d3d3d3;padding:10px 30px}.container .panel .body[data-v-15aa1b8d]{display:-webkit-box;display:-ms-flexbox;display:flex}.container .panel .body .interface[data-v-15aa1b8d]{border-right:1px solid #d3d3d3}.container .panel .body .desc[data-v-15aa1b8d],.container .panel .body .interface[data-v-15aa1b8d]{-webkit-box-flex:1;-ms-flex:1;flex:1;padding:10px 30px}.container .panel .body .desc .desc-block[data-v-15aa1b8d]{padding:5px 0;margin-bottom:10px;border-bottom:1px solid #d3d3d3}.container .panel .body .desc .desc-block[data-v-15aa1b8d]:last-child{border-bottom:none}.container[data-v-0c36da81]{width:100%;height:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row}.container .tree[data-v-0c36da81]{-webkit-box-flex:2;-ms-flex:2;flex:2}.container .control[data-v-0c36da81]{-webkit-box-flex:1;-ms-flex:1;flex:1;padding:30px 0;border-left:1px solid grey}.container .control .desc-block[data-v-0c36da81]{padding:10px 30px;margin-bottom:20px}.container .control .controls[data-v-0c36da81]{padding:10px}.container .control .controls label[data-v-0c36da81]{display:inline-block;width:120px;text-align:right}.container .control .controls .actions[data-v-0c36da81]{margin-left:120px;margin-bottom:10px}.container .control .controls .actions button[data-v-0c36da81]{cursor:pointer;margin-right:10px}.app[data-v-6afbf07a]{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;width:100%;height:100%}.app .tab[data-v-6afbf07a]{height:90px;padding:10px 50px;border-bottom:1px solid #d3d3d3}.app .tab button[data-v-6afbf07a]{cursor:pointer;width:100px;height:38px;margin-right:30px;margin-bottom:10px;border-radius:5px;background:#e0ffff}.app .tab button[data-v-6afbf07a]:focus{outline:none}.app .tab .active[data-v-6afbf07a]{background:#add8e6}.app .tab-panel[data-v-6afbf07a]{-webkit-box-flex:1;-ms-flex:1;flex:1;overflow-y:auto}body,html{width:100%;height:100%;margin:0;padding:0}
\ No newline at end of file
diff --git a/docs/index.html b/docs/index.html
index e7a3086..a41c9cd 100644
--- a/docs/index.html
+++ b/docs/index.html
@@ -1 +1 @@
-<!DOCTYPE html><html lang=en><head><meta charset=utf-8><meta http-equiv=X-UA-Compatible content="IE=edge"><meta name=viewport content="width=device-width,initial-scale=1"><link rel=icon href=/ctree/favicon.ico><title>ctree</title><link href=/ctree/css/main.4a7507e0.css rel=preload as=style><link href=/ctree/js/chunk-vendors.858205c1.js rel=preload as=script><link href=/ctree/js/main.a980790b.js rel=preload as=script><link href=/ctree/css/main.4a7507e0.css rel=stylesheet></head><body><noscript><strong>We're sorry but ctree doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><div id=app></div><script src=/ctree/js/chunk-vendors.858205c1.js></script><script src=/ctree/js/main.a980790b.js></script></body></html>
\ No newline at end of file
+<!DOCTYPE html><html lang=en><head><meta charset=utf-8><meta http-equiv=X-UA-Compatible content="IE=edge"><meta name=viewport content="width=device-width,initial-scale=1"><link rel=icon href=/ctree/favicon.ico><title>ctree</title><link href=/ctree/css/main.77aa2d18.css rel=preload as=style><link href=/ctree/js/chunk-vendors.858205c1.js rel=preload as=script><link href=/ctree/js/main.95d09ea6.js rel=preload as=script><link href=/ctree/css/main.77aa2d18.css rel=stylesheet></head><body><noscript><strong>We're sorry but ctree doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><div id=app></div><script src=/ctree/js/chunk-vendors.858205c1.js></script><script src=/ctree/js/main.95d09ea6.js></script></body></html>
\ No newline at end of file
diff --git a/docs/js/main.95d09ea6.js b/docs/js/main.95d09ea6.js
new file mode 100644
index 0000000..7f470fd
--- /dev/null
+++ b/docs/js/main.95d09ea6.js
@@ -0,0 +1 @@
+(function(e){function t(t){for(var i,o,s=t[0],l=t[1],c=t[2],h=0,u=[];h<s.length;h++)o=s[h],Object.prototype.hasOwnProperty.call(a,o)&&a[o]&&u.push(a[o][0]),a[o]=0;for(i in l)Object.prototype.hasOwnProperty.call(l,i)&&(e[i]=l[i]);d&&d(t);while(u.length)u.shift()();return r.push.apply(r,c||[]),n()}function n(){for(var e,t=0;t<r.length;t++){for(var n=r[t],i=!0,s=1;s<n.length;s++){var l=n[s];0!==a[l]&&(i=!1)}i&&(r.splice(t--,1),e=o(o.s=n[0]))}return e}var i={},a={main:0},r=[];function o(t){if(i[t])return i[t].exports;var n=i[t]={i:t,l:!1,exports:{}};return e[t].call(n.exports,n,n.exports,o),n.l=!0,n.exports}o.m=e,o.c=i,o.d=function(e,t,n){o.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:n})},o.r=function(e){"undefined"!==typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},o.t=function(e,t){if(1&t&&(e=o(e)),8&t)return e;if(4&t&&"object"===typeof e&&e&&e.__esModule)return e;var n=Object.create(null);if(o.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var i in e)o.d(n,i,function(t){return e[t]}.bind(null,i));return n},o.n=function(e){var t=e&&e.__esModule?function(){return e["default"]}:function(){return e};return o.d(t,"a",t),t},o.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},o.p="/ctree/";var s=window["webpackJsonp"]=window["webpackJsonp"]||[],l=s.push.bind(s);s.push=t,s=s.slice();for(var c=0;c<s.length;c++)t(s[c]);var d=l;r.push(["c31f","chunk-vendors"]),n()})({"050b":function(e,t,n){},"08ce":function(e,t,n){},4031:function(e,t,n){"use strict";var i=n("8093"),a=n.n(i);a.a},"6d6d":function(e,t,n){"use strict";var i=n("08ce"),a=n.n(i);a.a},8093:function(e,t,n){},a4b1:function(e,t,n){},c31f:function(e,t,n){"use strict";n.r(t);var i=n("2b0e"),a=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"app"},[n("div",{staticClass:"tab"},e._l(e.tabList,(function(t){return n("button",{key:t,class:{active:e.currentTab===t},on:{click:function(n){e.currentTab=t}}},[e._v(e._s(t))])})),0),n("div",{staticClass:"tab-panel"},[n(e.currentTab,{tag:"component"})],1)])},r=[],o=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"container"},[n("div",{staticClass:"panel"},[n("div",{staticClass:"header"},[e._v("基本用法")]),n("div",{staticClass:"body"},[n("div",{staticClass:"interface"},[n("div",{staticStyle:{height:"300px"}},[n("CTree",{attrs:{data:e.basicUsage,nodeClassName:function(e){return"generated-class-"+e.id},animation:""}})],1)]),n("div",{staticClass:"desc"},[e._v("\n        纯展示\n      ")])])]),n("div",{staticClass:"panel"},[n("div",{staticClass:"header"},[e._v("数据正确性验证")]),n("div",{staticClass:"body"},[n("div",{staticClass:"interface"},[n("div",{staticStyle:{height:"300px"}},[n("CTree",{attrs:{data:e.orderData,"default-expand-all":""}})],1)]),n("div",{staticClass:"desc"},[e._v("\n        数据正确性\n      ")])])]),n("div",{staticClass:"panel"},[n("div",{staticClass:"header"},[e._v("单选")]),n("div",{staticClass:"body"},[n("div",{staticClass:"interface"},[n("div",{staticStyle:{height:"300px"}},[n("CTree",{attrs:{data:e.selectable,selectable:""},model:{value:e.selectableValue,callback:function(t){e.selectableValue=t},expression:"selectableValue"}})],1)]),n("div",{staticClass:"desc"},[e._v("\n        单选模式。设置 selectable 即可"),n("br"),e._v("\n        v-model: "),n("br"),e._v("\n        "+e._s(e.selectableValue)+"\n      ")])])]),n("div",{staticClass:"panel"},[n("div",{staticClass:"header"},[e._v("多选")]),n("div",{staticClass:"body"},[n("div",{staticClass:"interface"},[n("div",{staticStyle:{height:"300px"}},[e.showCheckable?n("CTree",{attrs:{data:e.checkable,checkable:"","ignore-mode":e.checkableIgnoreMode,cascade:e.checkableCascade},model:{value:e.checkableValue,callback:function(t){e.checkableValue=t},expression:"checkableValue"}}):e._e()],1)]),n("div",{staticClass:"desc"},[n("div",{staticClass:"desc-block"},[n("p",[e._v("多选模式。设置 checkable 即可")]),e._v("\n          v-model: "),n("br"),e._v("\n          "+e._s(e.checkableValue)+"\n        ")]),n("div",{staticClass:"desc-block"},[n("p",[e._v("设置 ignoreMode 可指定 v-model 与 getCheckedNodes 方法要忽略父节点或者子节点，该 prop 仅初始设置有效")]),e._l(["none","parents","children"],(function(t){return n("button",{key:t,on:{click:function(n){e.checkableIgnoreMode=t,e.showCheckable=!1,e.$nextTick((function(){e.checkableValue=[],e.showCheckable=!0}))}}},[e._v(e._s(t))])})),n("p",[e._v("当前 ignoreMode: "+e._s(e.checkableIgnoreMode))])],2),n("div",{staticClass:"desc-block"},[n("p",[e._v("设置 cascade 可指定父子节点是否级联")]),e._l([!0,!1],(function(t,i){return n("button",{key:i,on:{click:function(n){e.checkableCascade=t,e.showCheckable=!1,e.$nextTick((function(){e.checkableValue=[],e.showCheckable=!0}))}}},[e._v(e._s(t))])})),n("p",[e._v("当前 cascade: "+e._s(e.checkableCascade))])],2),n("div",{staticClass:"desc-block"},[n("p",[e._v("重置以上选项")]),n("button",{on:{click:function(t){e.showCheckable=!1,e.$nextTick((function(){e.checkableIgnoreMode="none",e.checkableCascade=!0,e.checkableValue=[],e.showCheckable=!0}))}}},[e._v("Reset")])])])])]),n("div",{staticClass:"panel"},[n("div",{staticClass:"header"},[e._v("单选与多选并存")]),n("div",{staticClass:"body"},[n("div",{staticClass:"interface"},[n("div",{staticStyle:{height:"300px"}},[n("CTree",{attrs:{data:e.both,checkable:"",selectable:""},model:{value:e.bothValue,callback:function(t){e.bothValue=t},expression:"bothValue"}})],1)]),n("div",{staticClass:"desc"},[e._v("\n        当既可以单选又可以多选时， v-model 绑定的是多选的值"),n("br"),e._v("\n        v-model: "),n("br"),e._v("\n        "+e._s(e.bothValue)+"\n      ")])])]),n("div",{staticClass:"panel"},[n("div",{staticClass:"header"},[e._v("连接线")]),n("div",{staticClass:"body"},[n("div",{staticClass:"interface"},[n("div",{staticStyle:{height:"300px"}},[n("CTree",{attrs:{data:e.showLineTreeData,showLine:{type:e.showLineType,polyline:e.showLinePolyline},defaultExpandAll:"",animation:""}})],1)]),n("div",{staticClass:"desc"},[n("div",{staticClass:"desc-block"},[e._v("\n          传入 showLine 可展示连接线，type 可指定连接线类型\n        ")]),n("div",{staticClass:"desc-block"},[e._v("\n          showLine 传入对象可设置连接线的宽度，连线类型与颜色等"),n("br"),e._v("\n          showLine.type:\n\n          "),e._l(["solid","dashed"],(function(t){return n("button",{key:t,on:{click:function(n){return e.onShowLineTypeBtnClick(t)}}},[e._v("\n            "+e._s(t)+"\n          ")])})),n("p",[e._v("当前连接线类型："+e._s(e.showLineType))])],2),n("div",{staticClass:"desc-block"},[e._v("\n          showLine.polyline:\n\n          "),e._l([!0,!1],(function(t){return n("button",{key:t,on:{click:function(n){return e.onShowLinePolylineBtnClick(t)}}},[e._v("\n            "+e._s(t)+"\n          ")])})),n("p",[e._v("是否启用折线："+e._s(e.showLinePolyline))])],2)])])]),n("div",{staticClass:"panel"},[n("div",{staticClass:"header"},[e._v("自定义节点")]),n("div",{staticClass:"body"},[n("div",{staticClass:"interface"},[n("div",{staticStyle:{height:"300px"}},[n("CTree",{attrs:{data:e.basicUsage},scopedSlots:e._u([{key:"node",fn:function(t){var i=t.node;return[n("button",[e._v(e._s(i.title))])]}}])})],1)]),n("div",{staticClass:"desc"},[n("div",{staticClass:"desc-block"},[e._v("\n          除了 render，也可以传入 slot 自定义树节点\n          "),n("pre",[e._v("            "+e._s(e.nodeSlotDescText)+"\n          ")])])])])]),n("div",{staticClass:"panel"},[n("div",{staticClass:"header"},[e._v("远程")]),n("div",{staticClass:"body"},[n("div",{staticClass:"interface"},[n("div",{staticStyle:{height:"300px"}},[e.remoteShow?n("CTree",{attrs:{load:e.remoteLoad}}):e._e()],1)]),n("div",{staticClass:"desc"},[e._m(0),n("div",{staticClass:"desc-block"},[n("button",{on:{click:function(t){e.remoteShow=!1,e.$nextTick((function(){e.remoteShow=!0}))}}},[e._v("加载树组件")])])])])])])},s=[function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"desc-block"},[e._v("\n          设置 load 方法可以使用远程加载数据，如果有设置 data ，则 data 数据作为根数据；"),n("br"),e._v("\n          如果没有传 data ，则初始化时调用 load 方法载入根数据，其中节点参数为 null\n        ")])}],l=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{class:e.wrapperCls},[n("div",{ref:"scrollArea",class:e.scrollAreaCls,on:{"&scroll":function(t){return t.stopPropagation(),e.handleTreeScroll(t)}}},[n("div",{class:e.blockAreaCls},[n("div",{style:e.topSpaceStyles}),e._l(e.expandAnimation.ready?e.expandAnimation.topNodes:e.renderNodes,(function(t){return n("CTreeNode",e._g(e._b({key:t[e.keyField],class:"function"===typeof e.nodeClassName?e.nodeClassName(t):e.nodeClassName,style:{minHeight:e.nodeMinHeight+"px"},attrs:{data:t,noSiblingNodeMap:e.noSiblingNodeMap},on:{check:e.handleNodeCheck,select:e.handleNodeSelect,expand:e.handleNodeExpand,"node-drop":e.handleNodeDrop},scopedSlots:e._u([{key:"default",fn:function(t){return[e._t("node",null,null,t)]}}],null,!0)},"CTreeNode",e.$props,!1),e.treeNodeListeners))})),e.expandAnimation.ready?[n("transition",{attrs:{name:"ctree-expand-animation"},on:{"after-enter":e.onExpandAnimationFinish,"after-leave":e.onExpandAnimationFinish}},[n("div",{directives:[{name:"show",rawName:"v-show",value:e.expandAnimation.currentExpandState,expression:"expandAnimation.currentExpandState"}],style:{display:"grid"}},[n("div",{style:{overflow:"hidden"}},e._l(e.expandAnimation.middleNodes,(function(t){return n("CTreeNode",e._g(e._b({key:t[e.keyField],class:"function"===typeof e.nodeClassName?e.nodeClassName(t):e.nodeClassName,style:{minHeight:e.nodeMinHeight+"px"},attrs:{data:t,noSiblingNodeMap:e.noSiblingNodeMap},on:{check:e.handleNodeCheck,select:e.handleNodeSelect,expand:e.handleNodeExpand,"node-drop":e.handleNodeDrop},scopedSlots:e._u([{key:"default",fn:function(t){return[e._t("node",null,null,t)]}}],null,!0)},"CTreeNode",e.$props,!1),e.treeNodeListeners))})),1)])]),e._l(e.expandAnimation.bottomNodes,(function(t){return n("CTreeNode",e._g(e._b({key:t[e.keyField],class:"function"===typeof e.nodeClassName?e.nodeClassName(t):e.nodeClassName,style:{minHeight:e.nodeMinHeight+"px"},attrs:{data:t,noSiblingNodeMap:e.noSiblingNodeMap},on:{check:e.handleNodeCheck,select:e.handleNodeSelect,expand:e.handleNodeExpand,"node-drop":e.handleNodeDrop},scopedSlots:e._u([{key:"default",fn:function(t){return[e._t("node",null,null,t)]}}],null,!0)},"CTreeNode",e.$props,!1),e.treeNodeListeners))}))]:e._e(),n("div",{style:e.bottomSpaceStyles})],2)]),n("div",{directives:[{name:"show",rawName:"v-show",value:!e.blockLength,expression:"!blockLength"}],class:e.emptyCls},[n("span",{class:e.emptyTextDefaultCls},[e._t("empty",[e._v("\n        "+e._s(e.emptyText)+"\n      ")])],2)]),n("div",{directives:[{name:"show",rawName:"v-show",value:e.loading||e.isRootLoading,expression:"loading || isRootLoading"}],class:e.loadingCls},[n("div",{class:e.loadingWrapperCls},[e._t("loading",[n("LoadingIcon",{class:e.loadingIconCls})])],2)]),n("iframe",{ref:"iframe",class:e.iframeCls})])},c=[];function d(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function h(e,t){for(var n=0;n<t.length;n++){var i=t[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(e,i.key,i)}}function u(e,t,n){return t&&h(e.prototype,t),n&&h(e,n),e}var p,f=["_level","_filterVisible","_parent","_loading","_loaded","_remote","_keyField","children","setChildren"],v=function(){function e(t){var n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:null,i=arguments.length>2&&void 0!==arguments[2]?arguments[2]:"id",a=arguments.length>3&&void 0!==arguments[3]&&arguments[3];for(var r in d(this,e),this._keyField=i,this._remote=a,this._level=0,this.checked=!1,this.selected=!1,this.indeterminate=!1,this.disabled=!1,this.expand=!1,this.visible=!0,this._filterVisible=!0,this._parent=null,this.children=[],this.isLeaf=!1,this._loading=!1,this._loaded=!1,t)-1===f.indexOf(r)&&(this[r]=t[r]);null==this[i]&&(this[i]=Math.random().toString(36).substring(2)),this._parent=n,this._parent&&(this._level=this._parent._level+1),this.visible=null===this._parent||this._parent.expand&&this._parent.visible,Array.isArray(t.children)&&this.setChildren(t.children),this.children.length&&(this._loaded=!0),this._remote||(this.isLeaf=!this.children.length)}return u(e,[{key:"setChildren",value:function(t){var n=this;this.children=t.map((function(t){return new e(Object.assign({},t),n,n._keyField,n._remote)}))}}]),e}();(function(e){e["none"]="none",e["parents"]="parents",e["children"]="children"})(p||(p={}));var g,y,m,b,k=["setData","setChecked","setCheckedKeys","checkAll","clearChecked","setSelected","clearSelected","setExpand","setExpandKeys","setExpandAll","getCheckedNodes","getCheckedKeys","getIndeterminateNodes","getSelectedNode","getSelectedKey","getExpandNodes","getExpandKeys","getCurrentVisibleNodes","getNode","getTreeData","getFlatData","getNodesCount","insertBefore","insertAfter","append","prepend","remove","filter","showCheckedNodes","loadRootNodes","scrollTo"],_=["clearKeyword","getKeyword","search"];function C(e){return C="function"===typeof Symbol&&"symbol"===typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"===typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},C(e)}function w(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function x(e,t){for(var n=0;n<t.length;n++){var i=t[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(e,i.key,i)}}function S(e,t,n){return t&&x(e.prototype,t),n&&x(e,n),e}(function(e){e["bottom-start"]="bottom-start",e["bottom-end"]="bottom-end",e["bottom"]="bottom",e["top-start"]="top-start",e["top-end"]="top-end",e["top"]="top"})(g||(g={})),function(e){e["top"]="top",e["center"]="center",e["bottom"]="bottom"}(y||(y={})),function(e){e["before"]="before",e["body"]="body",e["after"]="after"}(m||(m={})),function(e){e["dashed"]="dashed",e["solid"]="solid"}(b||(b={}));var D=function(){function e(t){w(this,e),this.options=t,this.data=[],this.flatData=[],this.mapData=Object.create(null),this.unloadCheckedKeys=[],this.unloadSelectedKey=null,this.currentSelectedKey=null,this.listenersMap={}}return S(e,[{key:"insertIntoFlatData",value:function(e,t){this.flatData=this.flatData.slice(0,e).concat(t,this.flatData.slice(e))}},{key:"setData",value:function(e){var t=this,n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:null,i=arguments.length>2&&void 0!==arguments[2]?arguments[2]:null;for(var a in this.data=e.map((function(e){return new v(e,null,t.options.keyField,!!t.options.load)})),this.mapData)delete this.mapData[a];this.currentSelectedKey=null,this.flatData=this.flattenData(this.data),this.setUnloadCheckedKeys(i||[]),n&&(this.currentSelectedKey=null,this.setUnloadSelectedKey(n)),this.emit("visible-data-change"),this.emit("set-data")}},{key:"setChecked",value:function(e,t){var n=!(arguments.length>2&&void 0!==arguments[2])||arguments[2],i=!(arguments.length>3&&void 0!==arguments[3])||arguments[3],a=arguments.length>4&&void 0!==arguments[4]&&arguments[4],r=this.mapData[e];if(!r)return this.setUnloadChecked(e,t,n,i);r.disabled||r.checked&&t||(r.checked||r.indeterminate||t)&&(this.options.cascade?(this.checkNodeDownward(r,t,a),this.checkNodeUpward(r)):r.checked=t,n&&(r.checked?this.emit("check",r):this.emit("uncheck",r)),this.triggerCheckedChange(n,i))}},{key:"setUnloadChecked",value:function(e,t){var n=!(arguments.length>2&&void 0!==arguments[2])||arguments[2],i=!(arguments.length>3&&void 0!==arguments[3])||arguments[3],a=this.findIndex(e,this.unloadCheckedKeys);t?-1===a&&this.unloadCheckedKeys.push(e):-1!==a&&this.unloadCheckedKeys.splice(a,1),this.triggerCheckedChange(n,i)}},{key:"setCheckedKeys",value:function(e,t){var n=this,i=!(arguments.length>2&&void 0!==arguments[2])||arguments[2],a=!(arguments.length>3&&void 0!==arguments[3])||arguments[3];e.forEach((function(e){n.setChecked(e,t,!1,!1)})),this.triggerCheckedChange(i,a)}},{key:"checkAll",value:function(){var e=this,t=!(arguments.length>0&&void 0!==arguments[0])||arguments[0],n=!(arguments.length>1&&void 0!==arguments[1])||arguments[1];if(this.options.cascade){var i=function t(n){n.forEach((function(n){n.disabled?t(n.children):e.setChecked(n[e.options.keyField],!0,!1,!1)}))};i(this.data)}else for(var a=this.flatData.length,r=0;r<a;r++){var o=this.flatData[r];this.setChecked(o[this.options.keyField],!0,!1,!1)}this.triggerCheckedChange(t,n)}},{key:"clearChecked",value:function(){var e=this,t=!(arguments.length>0&&void 0!==arguments[0])||arguments[0],n=!(arguments.length>1&&void 0!==arguments[1])||arguments[1],i=this.getCheckedNodes();i.forEach((function(t){e.setChecked(t[e.options.keyField],!1,!1,!1)})),this.unloadCheckedKeys=[],this.triggerCheckedChange(t,n)}},{key:"triggerCheckedChange",value:function(){var e=!(arguments.length>0&&void 0!==arguments[0])||arguments[0],t=!(arguments.length>1&&void 0!==arguments[1])||arguments[1];e&&this.emit("checked-change",this.getCheckedNodes(),this.getCheckedKeys()),t&&this.emit("render-data-change")}},{key:"setSelected",value:function(e,t){var n=!(arguments.length>2&&void 0!==arguments[2])||arguments[2],i=!(arguments.length>3&&void 0!==arguments[3])||arguments[3],a=this.mapData[e];if(!a)return this.setUnloadSelected(e,t,n,i);a.disabled||a.selected!==t&&(e===this.currentSelectedKey?t||(a.selected=t,this.currentSelectedKey=null):t&&(null===this.currentSelectedKey?(a.selected=t,this.currentSelectedKey=a[this.options.keyField]):(this.mapData[this.currentSelectedKey]&&(this.mapData[this.currentSelectedKey].selected=!1),a.selected=t,this.currentSelectedKey=a[this.options.keyField])),n&&(a.selected?this.emit("select",a):this.emit("unselect",a),this.emit("selected-change",this.getSelectedNode(),this.getSelectedKey())),i&&this.emit("render-data-change"))}},{key:"setUnloadSelected",value:function(e,t){var n=!(arguments.length>2&&void 0!==arguments[2])||arguments[2],i=!(arguments.length>3&&void 0!==arguments[3])||arguments[3];t?(this.currentSelectedKey&&this.setSelected(this.currentSelectedKey,!1,!1,!1),this.unloadSelectedKey=e):this.unloadSelectedKey===e&&(this.unloadSelectedKey=null),n&&this.emit("selected-change",this.getSelectedNode(),this.getSelectedKey()),i&&this.emit("render-data-change")}},{key:"clearSelected",value:function(){var e=!(arguments.length>0&&void 0!==arguments[0])||arguments[0],t=!(arguments.length>1&&void 0!==arguments[1])||arguments[1];this.currentSelectedKey&&this.mapData[this.currentSelectedKey]?this.setSelected(this.currentSelectedKey,!1,e,t):null!==this.unloadSelectedKey&&(this.unloadSelectedKey=null,e&&this.emit("selected-change",this.getSelectedNode(),this.getSelectedKey()),t&&this.emit("render-data-change"))}},{key:"setExpand",value:function(e,t){var n=this,i=arguments.length>2&&void 0!==arguments[2]&&arguments[2],a=!(arguments.length>3&&void 0!==arguments[3])||arguments[3],r=!(arguments.length>4&&void 0!==arguments[4])||arguments[4],o=this.mapData[e];if(o&&(i||!o.isLeaf)&&o.expand!==t){if(!o.isLeaf){if("function"===typeof this.options.load){if(!o._loaded&&!o._loading&&t)return o._loading=!0,r&&this.emit("visible-data-change"),void new Promise((function(e,t){var i=n.options.load;i(o,e,t)})).then((function(e){if(Array.isArray(e)){var i=n.findIndex(o);if(-1===i)return;o._loaded=!0,o.expand=t,o.setChildren(e);var a=n.getCheckedKeys(),r=n.flattenData(o.children,null===n.getSelectedKey);n.insertIntoFlatData(i+1,r),n.setUnloadCheckedKeys(a),null!==n.unloadSelectedKey&&n.setUnloadSelectedKey(n.unloadSelectedKey),n.emit("set-data")}})).catch((function(e){var t=e;e instanceof Error||(t=new Error(e)),console.error(t)})).then((function(){o._loading=!1,a&&n.emit("expand",o),r&&n.emit("visible-data-change")}));if(o._loading)return}o.expand=t;var s=o.children.concat();while(s.length){var l=s.pop();l&&(l.expand&&l.children.length&&(s=l.children.concat(s)),!1===l._filterVisible?l.visible=!1:l.visible=null===l._parent||l._parent.expand&&l._parent.visible)}a&&this.emit("expand",o),r&&this.emit("visible-data-change")}i&&o._parent&&t&&this.setExpand(o._parent[this.options.keyField],t,i,!1,r)}}},{key:"setExpandKeys",value:function(e,t){var n=this,i=!(arguments.length>2&&void 0!==arguments[2])||arguments[2];e.forEach((function(e){n.setExpand(e,t,!1,!1,!1)})),i&&this.emit("visible-data-change")}},{key:"setExpandAll",value:function(e){var t=this,n=!(arguments.length>1&&void 0!==arguments[1])||arguments[1];this.flatData.forEach((function(n){t.options.load&&!n._loaded||t.setExpand(n[t.options.keyField],e,!1,!1,!1)})),n&&this.emit("visible-data-change")}},{key:"getCheckedNodes",value:function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:this.options.ignoreMode;if(e===p.children){var t=[],n=function e(n){n.forEach((function(n){n.checked?t.push(n):!n.isLeaf&&n.indeterminate&&e(n.children)}))};return n(this.data),t}return this.flatData.filter((function(t){return e===p.parents?t.checked&&t.isLeaf:t.checked}))}},{key:"getCheckedKeys",value:function(){var e=this,t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:this.options.ignoreMode;return this.getCheckedNodes(t).map((function(t){return t[e.options.keyField]})).concat(this.unloadCheckedKeys)}},{key:"getIndeterminateNodes",value:function(){return this.flatData.filter((function(e){return e.indeterminate}))}},{key:"getSelectedNode",value:function(){return null===this.currentSelectedKey?null:this.mapData[this.currentSelectedKey]||null}},{key:"getSelectedKey",value:function(){return this.currentSelectedKey||this.unloadSelectedKey||null}},{key:"getUnloadCheckedKeys",value:function(){return this.unloadCheckedKeys}},{key:"getExpandNodes",value:function(){return this.flatData.filter((function(e){return!e.isLeaf&&e.expand}))}},{key:"getExpandKeys",value:function(){var e=this;return this.getExpandNodes().map((function(t){return t[e.options.keyField]}))}},{key:"getNode",value:function(e){return this.mapData[e]||null}},{key:"insertBefore",value:function(e,t){var n=this.getInsertedNode(e,t);if(!n)return null;this.remove(n[this.options.keyField],!1);var i=this.mapData[t],a=i._parent,r=this.findIndex(t,a&&a.children),o=this.findIndex(t),s=a?-1:this.findIndex(t,this.data);return this.insertIntoStore(n,a,r,o,s),this.emit("visible-data-change"),n}},{key:"insertAfter",value:function(e,t){var n=this.getInsertedNode(e,t);if(!n)return null;this.remove(n[this.options.keyField],!1);for(var i=this.mapData[t],a=i._parent,r=this.findIndex(t,a&&a.children)+1,o=this.flatData.length,s=this.findIndex(t),l=s+1,c=s+1;c<=o;c++){if(c===o){l=c;break}if(this.flatData[c]._level<=i._level){l=c;break}}var d=a?-1:this.findIndex(t,this.data)+1;return this.insertIntoStore(n,a,r,l,d),this.emit("visible-data-change"),n}},{key:"append",value:function(e,t){var n=this.mapData[t];if(!n.isLeaf){var i=n.children.length;return this.insertAfter(e,n.children[i-1][this.options.keyField])}var a=this.getInsertedNode(e,t,!0);if(!a)return null;this.remove(a[this.options.keyField],!1);var r=this.findIndex(t)+1;return this.insertIntoStore(a,n,0,r),this.emit("visible-data-change"),a}},{key:"prepend",value:function(e,t){var n=this.mapData[t];if(!n.isLeaf)return this.insertBefore(e,n.children[0][this.options.keyField]);var i=this.getInsertedNode(e,t,!0);if(!i)return null;this.remove(i[this.options.keyField],!1);var a=this.findIndex(t)+1;return this.insertIntoStore(i,n,0,a),this.emit("visible-data-change"),i}},{key:"remove",value:function(e){var t=this,n=!(arguments.length>1&&void 0!==arguments[1])||arguments[1],i=this.mapData[e];if(!i)return null;var a=this.findIndex(i);if(-1===a)return null;for(var r=1,o=this.flatData.length,s=a+1;s<o;s++){if(!(this.flatData[s]._level>i._level))break;r++}this.flatData.splice(a,r);var l=function e(n){var i=t.mapData[n];delete t.mapData[n],i.children.forEach((function(n){return e(n[t.options.keyField])}))};if(l(e),!i._parent){var c=this.findIndex(i,this.data);c>-1&&this.data.splice(c,1)}if(i._parent){var d=this.findIndex(i,i._parent.children);-1!==d&&i._parent.children.splice(d,1),i._parent.isLeaf=!i._parent.children.length,i._parent.isLeaf&&(i._parent.expand=!1,i._parent.indeterminate=!1),this.updateMovingNodeStatus(i)}return n&&this.emit("visible-data-change"),i}},{key:"getInsertedNode",value:function(e,t){var n=arguments.length>2&&void 0!==arguments[2]&&arguments[2],i=this.mapData[t];if(!i)return null;var a=n?i:i._parent;if(e instanceof v)return e[this.options.keyField]===t?null:e;if("object"===C(e)){if(e[this.options.keyField]===t)return null;var r=this.mapData[e[this.options.keyField]];return r||new v(e,a,this.options.keyField,!!this.options.load)}return this.mapData[e]&&e!==t?this.mapData[e]:null}},{key:"insertIntoStore",value:function(e,t,n,i,a){if(-1!==i){-1!==n&&t&&t.children.splice(n,0,e),e._parent=t,t?(t.isLeaf=!1,this.setExpand(t[this.options.keyField],!0,!1,!1,!1)):"number"===typeof a&&a>-1&&this.data.splice(a,0,e);var r=this.flattenData([e]);e._level=t?t._level+1:0,r.forEach((function(e){return e._level=e._parent?e._parent._level+1:0})),this.insertIntoFlatData(i,r),this.updateMovingNodeStatus(e)}}},{key:"updateMovingNodeStatus",value:function(e){this.checkNodeUpward(e),this.triggerCheckedChange(),e.selected&&this.setSelected(e[this.options.keyField],!0)}},{key:"filter",value:function(e,t){var n=this,i=[];this.flatData.forEach((function(n){n._filterVisible=n._parent&&n._parent._filterVisible||t(e,n),n.visible=n._filterVisible,n._filterVisible&&i.push(n)})),i.forEach((function(e){var t=[],i=e._parent;while(i)t.unshift(i),i=i._parent;t.forEach((function(e){e._filterVisible=!0,e.visible=(null===e._parent||e._parent.expand&&e._parent.visible)&&e._filterVisible,n.options.expandOnFilter&&n.setExpand(e[n.options.keyField],!0,!1,!1,!1)})),e.visible=null===e._parent||e._parent.expand&&e._parent.visible})),this.emit("visible-data-change")}},{key:"setUnloadCheckedKeys",value:function(e){this.unloadCheckedKeys=e;for(var t=e.concat(),n=this.unloadCheckedKeys.length,i=n-1;i>=0;i--){var a=this.unloadCheckedKeys[i];this.mapData[a]&&(this.setChecked(a,!0,!1,!1),this.unloadCheckedKeys.splice(i,1))}var r=this.getCheckedKeys();r.length===t.length&&r.every((function(e){return t.some((function(t){return t===e}))}))||this.emit("checked-change",this.getCheckedNodes(),r)}},{key:"setUnloadSelectedKey",value:function(e){var t=this.getSelectedKey();this.mapData[e]?(this.setSelected(e,!0,!1),this.unloadSelectedKey=null):(this.currentSelectedKey&&this.setSelected(this.currentSelectedKey,!1,!1),this.unloadSelectedKey=e);var n=this.getSelectedKey();n!==t&&this.emit("selected-change",this.getSelectedNode(),n)}},{key:"flattenData",value:function(e){for(var t=!(arguments.length>1&&void 0!==arguments[1])||arguments[1],n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:[],i=e.length,a=0;a<i;a++){var r=e[a],o=r[this.options.keyField];if(n.push(r),this.mapData[o])throw new Error("[CTree] Duplicate tree node key.");this.mapData[o]=r,r.checked&&this.options.cascade&&(this.checkNodeDownward(r,!0),this.checkNodeUpward(r)),r.selected&&t&&(this.clearSelected(!1,!1),this.currentSelectedKey=r[this.options.keyField],this.emit("selected-change",r,this.currentSelectedKey)),!this.options.defaultExpandAll&&!r.expand||this.options.load||r.isLeaf||(r.expand=!1,this.setExpand(r[this.options.keyField],!0,!1,!1,!1)),r.children.length&&this.flattenData(r.children,t,n)}return n}},{key:"checkNodeDownward",value:function(e,t){var n=this,i=arguments.length>2&&void 0!==arguments[2]&&arguments[2];if(e.children.forEach((function(e){n.checkNodeDownward(e,t,i)})),e.isLeaf||this.options.load&&!e.children.length){if(!e.disabled){if(i&&!this.options.filteredNodeCheckable&&!e._filterVisible)return;e.checked=t,e.indeterminate=!1}}else this.checkParentNode(e)}},{key:"checkNodeUpward",value:function(e){var t=e._parent;while(t)this.checkParentNode(t),t=t._parent}},{key:"checkParentNode",value:function(e){var t=e.children.length;if(t){for(var n=!1,i=!1,a=!1,r=0;r<t;r++){var o=e.children[r];if(o.checked?n=!0:i=!0,n&&i||o.indeterminate){a=!0,e.checked=!1,e.indeterminate=!0;break}}a||(e.checked=n,e.indeterminate=!1)}}},{key:"findIndex",value:function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:this.flatData;if(null!==t)for(var n=e instanceof v?e[this.options.keyField]:e,i=t.length,a=0;a<i;a++)if(t[0]instanceof v){if(n===t[a][this.options.keyField])return a}else if(n===t[a])return a;return-1}},{key:"on",value:function(e,t){var n=this;this.listenersMap[e]||(this.listenersMap[e]=[]);var i=[];i=Array.isArray(t)?t:[t],i.forEach((function(t){-1===n.listenersMap[e].indexOf(t)&&n.listenersMap[e].push(t)}))}},{key:"off",value:function(e,t){if(this.listenersMap[e])if(t){var n=this.listenersMap[e].indexOf(t);n>-1&&this.listenersMap[e].splice(n,1)}else this.listenersMap[e]=[]}},{key:"emit",value:function(e){if(this.listenersMap[e]){for(var t=this.listenersMap[e].length,n=arguments.length,i=new Array(n>1?n-1:0),a=1;a<n;a++)i[a-1]=arguments[a];for(var r=0;r<t;r++){var o;(o=this.listenersMap[e])[r].apply(o,i)}}}}]),e}(),N=D,A=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{class:e.indentWrapperCls},[e.showLine?[e._l(e.data._level,(function(t,i){return[n("svg",{style:{alignSelf:"stretch",width:e.nodeIndent+"px"},attrs:{viewBox:"0 0 100 100",preserveAspectRatio:"none"}},[n("polyline",{attrs:{fill:"none",points:e.polylinePoints(i===e.data._level-1),"stroke-width":e.strokeWidth,stroke:e.showLineParams.color,"stroke-dasharray":e.strokeDasharray}})])]}))]:e._e(),n("div",{class:e.wrapperCls,style:{paddingLeft:e.showLine?"none":e.usePadding?e.data._level*e.nodeIndent+"px":null,marginLeft:e.showLine?"none":e.usePadding?null:e.data._level*e.nodeIndent+"px"}},[n("div",{class:e.dropBeforeCls}),n("div",e._g({ref:"nodeBody",class:e.nodeBodyCls},e.dropListeners),[n("div",{class:e.squareCls},[n("i",{directives:[{name:"show",rawName:"v-show",value:!e.data.isLeaf&&!e.data._loading,expression:"!data.isLeaf && !data._loading"}],class:e.expandCls,on:{click:e.handleExpand}}),e.data._loading?n("LoadingIcon",{class:e.loadingIconCls}):e._e()],1),e.showCheckbox?n("div",{class:e.squareCls},[n("div",{class:e.checkboxCls,on:{click:e.handleCheck}})]):e._e(),n("div",e._g({class:e.titleCls,attrs:{draggable:e.draggable&&!e.disableAll&&!e.data.disabled},on:{click:e.handleSelect,dblclick:e.handleDblclick,contextmenu:e.handleRightClick}},e.dragListeners),[e._t("default",[e.renderFunction?n(e.renderComponent,{tag:"component"}):[e._v(e._s(e.data[e.titleField]))]],{node:e.fullData})],2)]),n("div",{class:e.dropAfterCls})])],2)},T=[],O=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("svg",{attrs:{viewBox:"0 0 50 50"}},[n("circle",{staticClass:"ctree-loading-icon__circle",attrs:{cx:"25",cy:"25",r:"20",fill:"none","stroke-width":"5","stroke-miterlimit":"10"}})])},L=[],E=i["a"].extend({name:"CLoadingIcon"}),K=E,$=n("2877"),P=Object($["a"])(K,O,L,!1,null,null,null),F=P.exports;function R(e){return R="function"===typeof Symbol&&"symbol"===typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"===typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},R(e)}function I(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}var M="ctree-tree-node",B=i["a"].extend({name:"CTreeNode",inheritAttrs:!1,components:{LoadingIcon:F},props:{data:Object,titleField:String,keyField:String,render:Function,checkable:Boolean,selectable:Boolean,unselectOnClick:Boolean,disableAll:Boolean,draggable:Boolean,droppable:Boolean,usePadding:Boolean,nodeIndent:{type:Number,default:20},showLine:{type:[Boolean,Object]},noSiblingNodeMap:Object},data:function(){return{dragoverBody:!1,dragoverBefore:!1,dragoverAfter:!1}},computed:{indentWrapperCls:function(){return["".concat(M,"__indent-wrapper")]},wrapperCls:function(){return["".concat(M,"__wrapper"),I({},"".concat(M,"__wrapper_is-leaf"),this.data.isLeaf)]},nodeBodyCls:function(){return["".concat(M,"__node-body"),I({},"".concat(M,"__drop_active"),this.dragoverBody)]},dropBeforeCls:function(){return["".concat(M,"__drop"),I({},"".concat(M,"__drop_active"),this.dragoverBefore)]},dropAfterCls:function(){return["".concat(M,"__drop"),I({},"".concat(M,"__drop_active"),this.dragoverAfter)]},squareCls:function(){return["".concat(M,"__square")]},expandCls:function(){return["".concat(M,"__expand"),I({},"".concat(M,"__expand_active"),this.data.expand)]},loadingIconCls:function(){return["".concat(M,"__loading-icon")]},checkboxCls:function(){var e;return["".concat(M,"__checkbox"),(e={},I(e,"".concat(M,"__checkbox_checked"),this.data.checked),I(e,"".concat(M,"__checkbox_indeterminate"),this.data.indeterminate),I(e,"".concat(M,"__checkbox_disabled"),this.disableAll||this.data.disabled),e)]},titleCls:function(){var e;return["".concat(M,"__title"),(e={},I(e,"".concat(M,"__title_selected"),this.data.selected),I(e,"".concat(M,"__title_disabled"),this.disableAll||this.data.disabled),e)]},fullData:function(){return this.$parent.getNode(this.data[this.keyField])||{}},showCheckbox:function(){return this.checkable},renderFunction:function(){return this.data.render||this.render||null},renderComponent:function(){var e=this;return i["a"].extend({name:"Render",functional:!0,render:function(t){return"function"!==typeof e.renderFunction?t("div"):e.renderFunction(t,e.fullData)}})},dragListeners:function(){var e={};return!this.draggable||this.disableAll||this.data.disabled||(e={dragstart:this.handleDragStart}),e},dropListeners:function(){var e={};return this.droppable&&(e={dragenter:this.handleDragEnter.bind(this),dragover:this.handleDragOver.bind(this),dragleave:this.handleDragLeave.bind(this),drop:this.handleDrop.bind(this)}),e},showLineParams:function(){var e={width:1,type:b.solid,color:"#D3D3D3",polyline:!1},t=e;return"object"===R(this.showLine)&&(t={width:null!=this.showLine.width?this.showLine.width:e.width,type:this.showLine.type||e.type,color:this.showLine.color||e.color,polyline:null!=this.showLine.polyline?this.showLine.polyline:e.polyline}),t},strokeWidth:function(){return 100*this.showLineParams.width/this.nodeIndent},strokeDasharray:function(){switch(this.showLineParams.type){case b.dashed:return"25";default:break}return"none"}},methods:{polylinePoints:function(e){if(!this.showLineParams.polyline||!e)return"50,0 50,100";var t=this.fullData&&this.fullData._parent;return t&&this.noSiblingNodeMap[t[this.keyField]]&&this.noSiblingNodeMap[this.data[this.keyField]]?"50,0 50,50 100,50 50,50":"50,0 50,50 100,50 50,50 50,100"},handleExpand:function(){this.data.isLeaf||this.$emit("expand",this.fullData)},handleCheck:function(){this.disableAll||this.data.disabled||!this.checkable||this.$emit("check",this.fullData)},handleSelect:function(){if(this.$emit("click",this.fullData),this.selectable){if(this.disableAll||this.data.disabled)return;if(this.data.selected&&!this.unselectOnClick)return;this.$emit("select",this.fullData)}else this.checkable?this.handleCheck():this.handleExpand()},handleDblclick:function(){this.$emit("node-dblclick",this.fullData)},handleRightClick:function(){this.$emit("node-right-click",this.fullData)},getHoverPart:function(e){var t=this.$refs.nodeBody.getBoundingClientRect(),n=t.height,i=e.clientY-t.top;return i<=.3*n?m.before:i<=.7*n?m.body:m.after},resetDragoverFlags:function(e){var t=arguments.length>1&&void 0!==arguments[1]&&arguments[1];this.dragoverBefore=!1,this.dragoverBody=!1,this.dragoverAfter=!1,t||(e===m.before?this.dragoverBefore=!0:e===m.body?this.dragoverBody=!0:e===m.after&&(this.dragoverAfter=!0))},handleDragStart:function(e){e.dataTransfer&&e.dataTransfer.setData("node",JSON.stringify(this.data)),this.data.expand&&this.handleExpand(),this.$emit("node-dragstart",this.fullData,e)},handleDragEnter:function(e){e.preventDefault();var t=this.getHoverPart(e);this.resetDragoverFlags(t),this.$emit("node-dragenter",this.fullData,e,t)},handleDragOver:function(e){e.preventDefault();var t=this.getHoverPart(e);this.resetDragoverFlags(t),this.$emit("node-dragover",this.fullData,e,t)},handleDragLeave:function(e){var t=this.getHoverPart(e);this.resetDragoverFlags(t,!0),this.$emit("node-dragleave",this.fullData,e,t)},handleDrop:function(e){var t=this.getHoverPart(e);this.resetDragoverFlags(t,!0),this.$emit("node-drop",this.fullData,e,t)}}}),j=B,V=Object($["a"])(j,A,T,!1,null,null,null),H=V.exports;function U(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}var W="ctree-tree",G=["expand","select","unselect","selected-change","check","uncheck","checked-change","set-data"],Y=["node-drop"],X=function(e,t){if(Array.isArray(e)&&Array.isArray(t)){if(e.length===t.length&&e.every((function(e){return t.some((function(t){return t===e}))})))return!0}else if(e===t)return!0;return!1},q=i["a"].extend({name:"CTree",components:{CTreeNode:H,LoadingIcon:F},props:{value:[String,Number,Array],data:{type:Array,default:function(){return[]}},unloadDataList:{type:Array,default:function(){return[]}},showUnloadCheckedNodes:{type:Boolean,default:!0},emptyText:{type:String,default:"暂无数据"},titleField:{type:String,default:"title"},keyField:{type:String,default:"id"},separator:{type:String,default:","},checkable:{type:Boolean,default:!1},selectable:{type:Boolean,default:!1},filteredNodeCheckable:{type:Boolean,default:!1},cascade:{type:Boolean,default:!0},enableLeafOnly:{type:Boolean,default:!1},disableAll:{type:Boolean,default:!1},defaultExpandAll:{type:Boolean,default:!1},defaultExpandedKeys:{type:Array,default:function(){return[]}},expandedKeys:{type:Array,default:function(){return[]}},draggable:{type:Boolean,default:!1},droppable:{type:Boolean,default:!1},beforeDropMethod:{type:Function,default:function(){return function(){return!0}}},ignoreMode:{type:String,default:p.none},autoLoad:{type:Boolean,default:!0},load:Function,render:Function,filterMethod:Function,expandOnFilter:{type:Boolean,default:!0},unselectOnClick:{type:Boolean,default:!0},loading:{type:Boolean,default:!1},nodeMinHeight:{type:Number,default:30},nodeIndent:{type:Number,default:20},renderNodeAmount:{type:Number,default:100},bufferNodeAmount:{type:Number,default:20},nodeClassName:{type:[String,Object,Array,Function]},usePadding:{type:Boolean,default:!1},showLine:{type:[Boolean,Object]},animation:{type:Boolean}},data:function(){var e=Array.isArray(this.value)?this.value.concat():this.value;return{unloadCheckedNodes:[],blockLength:0,blockAreaHeight:0,topSpaceHeight:0,bottomSpaceHeight:0,renderAmount:0,renderAmountCache:0,renderNodes:[],renderStart:0,renderStartCache:0,isRootLoading:!1,valueCache:e,debounceTimer:void 0,expandAnimation:{start:!1,index:-1,level:-1,nextState:!1,ready:!1,currentExpandState:!1,topNodes:[],middleNodes:[],bottomNodes:[]}}},computed:{topSpaceStyles:function(){return{height:"".concat(this.topSpaceHeight,"px")}},bottomSpaceStyles:function(){return{height:"".concat(this.bottomSpaceHeight,"px")}},wrapperCls:function(){return["".concat(W,"__wrapper")]},scrollAreaCls:function(){return["".concat(W,"__scroll-area")]},blockAreaCls:function(){return["".concat(W,"__block-area")]},emptyCls:function(){return["".concat(W,"__empty")]},emptyTextDefaultCls:function(){return["".concat(W,"__empty-text_default")]},loadingCls:function(){return["".concat(W,"__loading")]},loadingWrapperCls:function(){return["".concat(W,"__loading-wrapper")]},loadingIconCls:function(){return["".concat(W,"__loading-icon")]},iframeCls:function(){return["".concat(W,"__iframe")]},treeNodeListeners:function(){var e={};for(var t in this.$listeners)-1===G.indexOf(t)&&-1===Y.indexOf(t)&&(e[t]=this.$listeners[t]);return e},noSiblingNodeMap:function(){var e=this,t=[],n=this.renderNodes[0]&&this.renderNodes[0]._parent;while(n)t.push(n),n=n._parent;var i=t.concat(this.renderNodes),a={},r=[];return i.forEach((function(t){var n=t._level,i=r.length;while(i){var o=r[i-1],s=o._level;if(!(s>n)){if(s===n){r.pop();break}break}a[o[e.keyField]]=!0,r.pop(),i--}r.push(t)})),r.forEach((function(t){a[t[e.keyField]]=!0})),a}},methods:{setData:function(e){this.resetSpaceHeights();var t=null,n=null;this.checkable?Array.isArray(this.value)?t=this.value.concat():"string"===typeof this.value&&(t=""===this.value?[]:this.value.split(this.separator)):this.selectable&&!Array.isArray(this.value)&&(n=this.value),this.nonReactive.store.setData(e,n,t),this.updateExpandedKeys()},setChecked:function(e,t){this.nonReactive.store.setChecked(e,t)},setCheckedKeys:function(e,t){this.nonReactive.store.setCheckedKeys(e,t)},checkAll:function(){this.nonReactive.store.checkAll()},clearChecked:function(){this.nonReactive.store.clearChecked()},setSelected:function(e,t){this.nonReactive.store.setSelected(e,t)},clearSelected:function(){this.nonReactive.store.clearSelected()},setExpand:function(e,t){var n=!(arguments.length>2&&void 0!==arguments[2])||arguments[2];this.nonReactive.store.setExpand(e,t,n)},setExpandKeys:function(e,t){this.nonReactive.store.setExpandKeys(e,t)},setExpandAll:function(e){this.nonReactive.store.setExpandAll(e)},getCheckedNodes:function(e){return e=e||this.ignoreMode,this.nonReactive.store.getCheckedNodes(e)},getCheckedKeys:function(e){return e=e||this.ignoreMode,this.nonReactive.store.getCheckedKeys(e)},getIndeterminateNodes:function(){return this.nonReactive.store.getIndeterminateNodes()},getSelectedNode:function(){return this.nonReactive.store.getSelectedNode()},getSelectedKey:function(){return this.nonReactive.store.getSelectedKey()},getExpandNodes:function(){return this.nonReactive.store.getExpandNodes()},getExpandKeys:function(){return this.nonReactive.store.getExpandKeys()},getCurrentVisibleNodes:function(){return this.nonReactive.store.flatData.filter((function(e){return e._filterVisible}))},getNode:function(e){return this.nonReactive.store.getNode(e)},getTreeData:function(){return this.nonReactive.store.data},getFlatData:function(){return this.nonReactive.store.flatData},getNodesCount:function(){return this.nonReactive.store.flatData.length},insertBefore:function(e,t){return this.nonReactive.store.insertBefore(e,t)},insertAfter:function(e,t){return this.nonReactive.store.insertAfter(e,t)},append:function(e,t){return this.nonReactive.store.append(e,t)},prepend:function(e,t){return this.nonReactive.store.prepend(e,t)},remove:function(e){return this.nonReactive.store.remove(e)},filter:function(e,t){var n=this,i=function(e,t){var i=t[n.titleField];return!(null==i||!i.toString)&&i.toString().toLowerCase().indexOf(e.toLowerCase())>-1};t=t||this.filterMethod||i,this.nonReactive.store.filter(e,t)},showCheckedNodes:function(e){var t=this;if(this.checkable){e=null==e?this.showUnloadCheckedNodes:e;var n=this.nonReactive.store.getCheckedNodes();if(this.nonReactive.store.filter("",(function(e,t){return t.checked})),e){var i=this.nonReactive.store.getUnloadCheckedKeys();if(i.length){var a=i.map((function(e){var i,a=t.unloadDataList.concat(n),r=e;return a.some((function(n){return n[t.keyField]===e&&null!=n[t.titleField]&&(r=n[t.titleField],!0)})),new v((i={},U(i,t.keyField,e),U(i,t.titleField,r),U(i,"checked",!0),U(i,"isLeaf",!0),i),null,t.keyField,!!t.load)}));this.unloadCheckedNodes=a,this.nonReactive.blockNodes=this.nonReactive.blockNodes.concat(a),this.updateBlockData(),this.updateRender()}}}},loadRootNodes:function(){var e=this;return this.isRootLoading=!0,new Promise((function(t,n){e.load(null,t,n)})).then((function(t){Array.isArray(t)&&e.setData(t)})).catch((function(){})).then((function(){e.isRootLoading=!1}))},scrollTo:function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:y.top,n=this.nonReactive.store.mapData[e];if(n&&n.visible){for(var i=-1,a=0;a<this.blockLength;a++)if(this.nonReactive.blockNodes[a][this.keyField]===e){i=a;break}if(-1!==i){var r=i*this.nodeMinHeight;if(t===y.center){var o=this.$refs.scrollArea.clientHeight;r-=(o-this.nodeMinHeight)/2}else if(t===y.bottom){var s=this.$refs.scrollArea.clientHeight;r-=s-this.nodeMinHeight}else"number"===typeof t&&(r-=t);this.$refs.scrollArea.scrollTop=r}}},updateExpandedKeys:function(){this.expandedKeys.length&&(this.nonReactive.store.setExpandAll(!1,!1),this.nonReactive.store.setExpandKeys(this.expandedKeys,!0))},updateUnloadStatus:function(){var e=this;if(this.unloadCheckedNodes.length){var t=this.nonReactive.store.getUnloadCheckedKeys();this.unloadCheckedNodes.forEach((function(n){n.checked=t.indexOf(n[e.keyField])>-1}))}},handleNodeCheck:function(e){(this.cascade||!this.enableLeafOnly||e.isLeaf)&&this.nonReactive.store.setChecked(e[this.keyField],!e.indeterminate&&!e.checked,!0,!0,!0)},handleNodeSelect:function(e){this.enableLeafOnly&&!e.isLeaf||this.nonReactive.store.setSelected(e[this.keyField],!e.selected)},handleNodeExpand:function(e){this.updateBeforeExpand(e),this.nonReactive.store.setExpand(e[this.keyField],!e.expand)},handleNodeDrop:function(e,t,n){if(this.droppable&&t.dataTransfer)try{var i=JSON.parse(t.dataTransfer.getData("node")),a=i[this.keyField],r=e[this.keyField],o=this.beforeDropMethod(a,r,n);if(o){if(a===r)return;n===m.before?this.nonReactive.store.insertBefore(a,r):n===m.body||!e.isLeaf&&e.expand?this.nonReactive.store.prepend(a,r):n===m.after&&this.nonReactive.store.insertAfter(a,r),this.$emit("node-drop",e,t,n,this.getNode(a))}}catch(s){throw new Error(s)}},emitCheckableInput:function(e,t){if(this.checkable){var n=t;Array.isArray(this.value)||(n=n.join(this.separator)),Array.isArray(n)?this.valueCache=n.concat():this.valueCache=n,this.$emit("input",n)}},emitSelectableInput:function(e,t){if(this.selectable&&!this.checkable){var n=t||"";this.valueCache=n,this.$emit("input",n)}},attachStoreEvents:function(){for(var e in this.$listeners)if(G.indexOf(e)>-1){var t=e;this.nonReactive.store.on(t,this.$listeners[e])}},resetSpaceHeights:function(){this.topSpaceHeight=0,this.bottomSpaceHeight=0,this.$refs.scrollArea.scrollTop=0},updateBlockNodes:function(){this.nonReactive.blockNodes=this.nonReactive.store.flatData.filter((function(e){return e.visible})),this.updateBlockData(),this.updateRender()},updateBlockData:function(){this.blockLength=this.nonReactive.blockNodes.length,this.blockAreaHeight=this.nodeMinHeight*this.blockLength},updateRender:function(){this.updateRenderAmount(),this.updateRenderNodes()},updateRenderAmount:function(){var e=this.$refs.scrollArea.clientHeight;this.renderAmount=Math.max(this.renderNodeAmount,Math.ceil(e/this.nodeMinHeight)+this.bufferNodeAmount)},updateRenderNodes:function(){var e=arguments.length>0&&void 0!==arguments[0]&&arguments[0];if(this.blockLength>this.renderAmount){var t=this.$refs.scrollArea.scrollTop,n=Math.floor(t/this.nodeMinHeight);this.renderStart=Math.floor(n/this.bufferNodeAmount)*this.bufferNodeAmount}else this.renderStart=0;e&&this.renderAmountCache===this.renderAmount&&this.renderStartCache===this.renderStart||(this.renderNodes=this.nonReactive.blockNodes.slice(this.renderStart,this.renderStart+this.renderAmount).map((function(e){return Object.assign({},e,{_parent:null,children:[]})})),this.topSpaceHeight=this.renderStart*this.nodeMinHeight,this.bottomSpaceHeight=this.blockAreaHeight-(this.topSpaceHeight+this.renderNodes.length*this.nodeMinHeight))},handleTreeScroll:function(){this.debounceTimer&&window.cancelAnimationFrame(this.debounceTimer),this.renderAmountCache=this.renderAmount,this.renderStartCache=this.renderStart,this.debounceTimer=window.requestAnimationFrame(this.updateRenderNodes.bind(this,!0))},resetExpandAnimation:function(){this.expandAnimation.start=!1,this.expandAnimation.ready=!1,this.expandAnimation.index=-1,this.expandAnimation.level=-1,this.expandAnimation.topNodes=[],this.expandAnimation.middleNodes=[],this.expandAnimation.bottomNodes=[]},updateMiddleNodes:function(){for(var e=this.expandAnimation.level,t=[],n=this.renderNodes.length,i=this.expandAnimation.index+1;i<n;i++){if(!(this.renderNodes[i]._level>e))break;t.push(this.renderNodes[i])}this.expandAnimation.middleNodes=t},updateBeforeExpand:function(e){var t=this;if(this.animation){this.resetExpandAnimation();var n=e[this.keyField],i=this.renderNodes.findIndex((function(e){return e[t.keyField]===n}));i>-1&&(this.expandAnimation.index=i,this.expandAnimation.level=e._level,this.expandAnimation.start=!0,this.expandAnimation.currentExpandState=e.expand,this.expandAnimation.nextState=!e.expand,this.expandAnimation.nextState?this.expandAnimation.bottomNodes=this.renderNodes.slice(this.expandAnimation.index+1):this.updateMiddleNodes())}},updateAfterExpand:function(){var e=this;this.animation&&(this.expandAnimation.start?-1!==this.expandAnimation.index&&this.$nextTick((function(){e.expandAnimation.topNodes=e.renderNodes.slice(0,e.expandAnimation.index+1),e.expandAnimation.nextState?e.updateMiddleNodes():e.expandAnimation.bottomNodes=e.renderNodes.slice(e.expandAnimation.index+1),e.expandAnimation.ready=!0,e.$nextTick((function(){e.expandAnimation.currentExpandState=!e.expandAnimation.currentExpandState}))})):this.expandAnimation.start=!1)},onExpandAnimationFinish:function(){this.resetExpandAnimation()},initializeNonReactiveData:function(){var e=this.keyField,t=this.ignoreMode,n=this.filteredNodeCheckable,i=this.cascade,a=this.defaultExpandAll,r=this.load,o=this.expandOnFilter;this.nonReactive={store:new N({keyField:e,ignoreMode:t,filteredNodeCheckable:n,cascade:i,defaultExpandAll:a,load:r,expandOnFilter:o}),blockNodes:[]}}},created:function(){var e=this;this.initializeNonReactiveData(),this.nonReactive.store.on("expand",this.updateAfterExpand),this.nonReactive.store.on("visible-data-change",this.updateBlockNodes),this.nonReactive.store.on("render-data-change",this.updateRender),this.nonReactive.store.on("checked-change",(function(t,n){e.emitCheckableInput(t,n),e.updateUnloadStatus()})),this.nonReactive.store.on("selected-change",this.emitSelectableInput),this.attachStoreEvents()},mounted:function(){this.data.length?(this.setData(this.data),this.defaultExpandedKeys.length&&this.nonReactive.store.setExpandKeys(this.defaultExpandedKeys,!0)):"function"===typeof this.load&&this.autoLoad&&this.loadRootNodes();var e=this.$refs.iframe;e.contentWindow&&e.contentWindow.addEventListener("resize",this.updateRender)},beforeDestroy:function(){var e=this.$refs.iframe;e.contentWindow&&e.contentWindow.removeEventListener("resize",this.updateRender),this.initializeNonReactiveData()},watch:{value:function(e){if(this.checkable){if(X(e,this.valueCache))return;var t=[];Array.isArray(e)?t=e.concat():"string"===typeof e&&(t=""===e?[]:e.split(this.separator)),this.nonReactive.store.clearChecked(!1,!1),this.nonReactive.store.setCheckedKeys(t,!0)}else if(this.selectable){if(e===this.valueCache)return;var n=this.nonReactive.store.getSelectedKey();""!==e&&null!=e?this.nonReactive.store.setSelected(e,!0):""!==e&&null!=e||!n||this.nonReactive.store.setSelected(n,!1)}},data:{deep:!0,handler:function(e){this.setData(e)}},expandedKeys:function(){this.updateExpandedKeys()},$listeners:function(){this.attachStoreEvents()}}}),z=q,J=Object($["a"])(z,l,c,!1,null,null,null),Q=J.exports,Z=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{class:e.wrapperCls},[n("div",{class:e.searchCls},[e.showCheckAll&&e.checkable?n("div",{class:e.checkAllWrapperCls},[n("div",{class:e.checkboxCls,on:{click:e.handleCheckAll}})]):e._e(),n("div",{class:e.inputWrapperCls},[e._t("search-input",[n("input",{directives:[{name:"model",rawName:"v-model",value:e.keyword,expression:"keyword"}],class:e.inputCls,attrs:{type:"text",placeholder:e.searchPlaceholder,disabled:e.searchDisabled},domProps:{value:e.keyword},on:{input:[function(t){t.target.composing||(e.keyword=t.target.value)},e.handleSearch]}})])],2),n("div",{class:e.actionWrapperCls},[e.showCheckedButton&&e.checkable?n("span",{class:e.checkedButtonCls,on:{click:e.handleShowChecked}},[e._v("\n        "+e._s(e.checkedButtonText)+"\n      ")]):e._e(),e._t("actions")],2)]),n("div",{class:e.treeWrapperCls},[n("CTree",e._g(e._b({ref:"tree",attrs:{value:e.value},on:{input:e.updateCheckedCount,"set-data":e.handleSetData,"checked-change":e.updateCheckAllStatus},scopedSlots:e._u([e._l(e.$scopedSlots,(function(t,n){return{key:n,fn:function(t){return[e._t(n,null,null,t)]}}}))],null,!0)},"CTree",e.$attrs,!1),e.$listeners))],1),e.showFooter&&e.checkable?n("div",{class:e.footerCls},[e._t("footer",[n("span",{staticStyle:{float:"right"}},[e._v("已选 "+e._s(e.checkedCount)+" 个")])])],2):e._e()])},ee=[];function te(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);t&&(i=i.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,i)}return n}function ne(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?te(n,!0).forEach((function(t){ie(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):te(n).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}function ie(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}var ae="ctree-tree-search",re="ctree-tree-node",oe={},se=Q.options.methods,le=function(e){var t=e;if(k.indexOf(t)>-1){var n=oe;n[t]=function(){for(var e=arguments.length,n=new Array(e),i=0;i<e;i++)n[i]=arguments[i];return se[t].apply(this.$refs.tree,n)}}};for(var ce in se)le(ce);var de=i["a"].extend({name:"CTreeSearch",inheritAttrs:!1,components:{CTree:Q},props:{value:{},searchPlaceholder:{type:String,default:"搜索关键字"},showCheckAll:{type:Boolean,default:!0},showCheckedButton:{type:Boolean,default:!0},checkedButtonText:{type:String,default:"已选"},showFooter:{type:Boolean,default:!0},searchMethod:Function,searchLength:{type:Number,default:1},searchDisabled:{type:Boolean,default:!1},searchRemote:{type:Boolean,default:!1},searchDebounceTime:{type:Number,default:300}},data:function(){return{checkAllStatus:{checked:!1,indeterminate:!1,disabled:!1},isShowingChecked:!1,keyword:"",debounceTimer:void 0,checkedCount:0}},computed:{wrapperCls:function(){return["".concat(ae,"__wrapper")]},searchCls:function(){return["".concat(ae,"__search")]},checkAllWrapperCls:function(){return["".concat(ae,"__check-all-wrapper")]},checkboxCls:function(){var e;return["".concat(ae,"__check-all"),"".concat(re,"__checkbox"),(e={},ie(e,"".concat(re,"__checkbox_checked"),this.checkAllStatus.checked),ie(e,"".concat(re,"__checkbox_indeterminate"),this.checkAllStatus.indeterminate),ie(e,"".concat(re,"__checkbox_disabled"),this.searchDisabled||this.checkAllStatus.disabled),e)]},inputWrapperCls:function(){return["".concat(ae,"__input-wrapper")]},inputCls:function(){return["".concat(ae,"__input"),ie({},"".concat(ae,"__input_disabled"),this.searchDisabled)]},actionWrapperCls:function(){return["".concat(ae,"__action-wrapper")]},checkedButtonCls:function(){return["".concat(ae,"__checked-button"),ie({},"".concat(ae,"__checked-button_active"),this.isShowingChecked)]},treeWrapperCls:function(){return["".concat(ae,"__tree-wrapper")]},footerCls:function(){return["".concat(ae,"__footer")]},checkable:function(){return"checkable"in this.$attrs&&!1!==this.$attrs.checkable}},methods:ne({},oe,{clearKeyword:function(){this.keyword=""},getKeyword:function(){return this.keyword},search:function(e){var t=this,n=e;return"string"!==typeof e&&(n=this.keyword),new Promise((function(e,i){clearTimeout(t.debounceTimer),t.debounceTimer=setTimeout((function(){if(!(n.length>0&&n.length<t.searchLength))if(t.isShowingChecked=!1,t.$emit("search",n),"function"===typeof t.searchMethod){var i=t.searchMethod(n);Promise.resolve(i).then((function(){t.updateCheckAllStatus(),e()}))}else t.searchRemote?t.$refs.tree.loadRootNodes().then((function(){t.updateCheckAllStatus(),e()})):(t.$refs.tree.filter(n),t.updateCheckAllStatus(),e())}),t.searchDebounceTime)}))},handleCheckAll:function(){var e=this;if(!this.searchDisabled&&!this.checkAllStatus.disabled){var t=this.$refs.tree.getCurrentVisibleNodes().map((function(t){return t[e.$refs.tree.keyField]}));this.checkAllStatus.checked||this.checkAllStatus.indeterminate?this.$refs.tree.setCheckedKeys(t,!1):this.$refs.tree.setCheckedKeys(t,!0),this.updateCheckAllStatus()}},handleSearch:function(){this.search()},handleShowChecked:function(){var e=this,t=function(){e.isShowingChecked=!e.isShowingChecked,e.isShowingChecked?e.$refs.tree.showCheckedNodes():e.$refs.tree.filter(e.keyword,(function(){return!0})),e.updateCheckAllStatus()};this.keyword?(this.clearKeyword(),this.search().then((function(){t()}))):t()},handleSetData:function(){this.updateCheckedCount(),this.updateCheckAllStatus()},updateCheckAllStatus:function(){for(var e=this.$refs.tree.getCurrentVisibleNodes(),t=e.length,n=!1,i=!1,a=!1,r=0;r<t;r++){var o=e[r];if(o.checked?n=!0:i=!0,n&&i||o.indeterminate){a=!0,this.checkAllStatus.checked=!1,this.checkAllStatus.indeterminate=!0;break}}a||(this.checkAllStatus.checked=n,this.checkAllStatus.indeterminate=!1)},updateCheckedCount:function(){this.checkedCount=this.$refs.tree.getCheckedKeys().length}}),mounted:function(){this.checkable&&!this.checkedCount&&this.handleSetData()}}),he=de,ue=Object($["a"])(he,Z,ee,!1,null,null,null),pe=ue.exports,fe=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{class:e.wrapperCls},[n("div",{ref:"reference",class:e.referenceCls,on:{click:e.handleRefClick}},[e._t("default",[n("div",{class:e.displayInputCls},[n("span",{class:e.displayInputTextCls},[e._t("display",[e._v("\n            "+e._s(e.displayValue)+"\n          ")],null,e.slotProps)],2),e.dropDisabled?e._e():[n("i",{class:e.dropIconCls}),e.clearable&&e.showClearIcon?e._t("clear",[n("i",{class:e.clearIconCls,on:{click:function(t){return t.stopPropagation(),e.handleClear(t)}}})]):e._e()]],2)],null,e.slotProps)],2),n("transition",{attrs:{name:"ctree-dropdown"}},[n("div",{directives:[{name:"show",rawName:"v-show",value:e.dropdownVisible,expression:"dropdownVisible"}],ref:"dropdown",class:e.dropdownCls,style:{height:e.dropHeight+"px"}},[n("CTreeSearch",e._g(e._b({ref:"treeSearch",attrs:{value:e.value},on:{"set-data":e.handleSetData,"checked-change":e.handleCheckedChange,"selected-change":e.handleSelectedChange},scopedSlots:e._u([e._l(e.$scopedSlots,(function(t,n){return{key:n,fn:function(t){return[e._t(n,null,null,t)]}}}))],null,!0)},"CTreeSearch",e.$attrs,!1),e.$listeners))],1)])],1)},ve=[];function ge(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);t&&(i=i.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,i)}return n}function ye(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?ge(n,!0).forEach((function(t){Ce(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):ge(n).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}function me(e){return _e(e)||ke(e)||be()}function be(){throw new TypeError("Invalid attempt to spread non-iterable instance")}function ke(e){if(Symbol.iterator in Object(e)||"[object Arguments]"===Object.prototype.toString.call(e))return Array.from(e)}function _e(e){if(Array.isArray(e)){for(var t=0,n=new Array(e.length);t<e.length;t++)n[t]=e[t];return n}}function Ce(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}var we="ctree-tree-drop",xe="ctree-tree-search",Se={},De=k.concat(_),Ne=pe.options.methods,Ae=function(e){var t=e;if(De.indexOf(t)>-1){var n=Se;n[t]=function(){for(var e=arguments.length,n=new Array(e),i=0;i<e;i++)n[i]=arguments[i];return Ne[t].apply(this.$refs.treeSearch,n)}}};for(var Te in Ne)Ae(Te);var Oe=i["a"].extend({name:"CTreeDrop",inheritAttrs:!1,components:{CTreeSearch:pe},props:{value:{},dropHeight:{type:Number,default:300},dropPlaceholder:{type:String},dropDisabled:{type:Boolean,default:!1},clearable:{type:Boolean,default:!1},placement:{type:String,default:g["bottom-start"]},transfer:{type:Boolean,default:!1},dropdownClassName:{type:[String,Array]},dropdownMinWidth:{type:Number},dropdownWidthFixed:{type:Boolean,default:!1}},data:function(){return{dropdownVisible:!1,checkedCount:0,selectedTitle:"",slotProps:{checkedNodes:[],checkedKeys:[],selectedNode:null,selectedKey:null}}},computed:{wrapperCls:function(){return["".concat(we,"__wrapper")]},referenceCls:function(){return["".concat(we,"__reference")]},displayInputCls:function(){var e;return["".concat(xe,"__input"),"".concat(we,"__display-input"),(e={},Ce(e,"".concat(we,"__display-input_focus"),this.dropdownVisible),Ce(e,"".concat(xe,"__input_disabled"),this.dropDisabled),e)]},displayInputTextCls:function(){var e=!1;return"string"===typeof this.dropPlaceholder&&(this.checkable?e=0===this.checkedCount:this.selectable&&(e=""===this.selectedTitle)),["".concat(we,"__display-input-text"),Ce({},"".concat(we,"__display-input-placeholder"),e)]},dropIconCls:function(){return["".concat(we,"__display-icon-drop"),Ce({},"".concat(we,"__display-icon-drop_active"),this.dropdownVisible)]},clearIconCls:function(){return["".concat(we,"__display-icon-clear")]},dropdownCls:function(){var e=Array.isArray(this.dropdownClassName)?this.dropdownClassName:[this.dropdownClassName];return["".concat(we,"__dropdown")].concat(me(e))},checkable:function(){return"checkable"in this.$attrs&&!1!==this.$attrs.checkable},selectable:function(){return"selectable"in this.$attrs&&!1!==this.$attrs.selectable},displayValue:function(){return this.checkable?0===this.checkedCount&&"string"===typeof this.dropPlaceholder?this.dropPlaceholder:"已选 ".concat(this.checkedCount," 个"):this.selectable?""===this.selectedTitle&&"string"===typeof this.dropPlaceholder?this.dropPlaceholder:this.selectedTitle:this.dropPlaceholder||""},showClearIcon:function(){return this.checkable?0!==this.checkedCount:!!this.selectable&&""!==this.selectedTitle}},methods:ye({},Se,{locateDropdown:function(){var e=this.$refs.reference.getBoundingClientRect(),t=e.width,n=e.height,i="".concat("number"===typeof this.dropdownMinWidth?this.dropdownMinWidth:t,"px");this.$refs.dropdown.style.minWidth=i,this.$refs.dropdown.style.width=this.dropdownWidthFixed?i:"auto";var a=this.$refs.dropdown.getBoundingClientRect(),r=window.getComputedStyle(this.$refs.dropdown),o=parseFloat(r.marginLeft)+parseFloat(r.marginRight),s=parseFloat(r.marginTop)+parseFloat(r.marginBottom),l=a.width+o,c=a.height/.8+s,d=0,h=0;switch(this.transfer&&(d=-999,h=-999),this.placement){case"bottom-start":this.transfer?(d=window.pageYOffset+e.bottom,h=window.pageXOffset+e.left):d=n;break;case"bottom-end":this.transfer?(d=window.pageYOffset+e.bottom,h=window.pageXOffset+e.right-l):(d=n,h=t-l);break;case"bottom":this.transfer?(d=window.pageYOffset+e.bottom,h=window.pageXOffset+e.left+(t-l)/2):(d=n,h=(t-l)/2);break;case"top-start":this.transfer?(d=window.pageYOffset+e.top-c,h=window.pageXOffset+e.left):d=-c;break;case"top-end":this.transfer?(d=window.pageYOffset+e.top-c,h=window.pageXOffset+e.right-l):(d=-c,h=t-l);break;case"top":this.transfer?(d=window.pageYOffset+e.top-c,h=window.pageXOffset+e.left+(t-l)/2):(d=-c,h=(t-l)/2);break}this.$refs.dropdown.style.top="".concat(d,"px"),this.$refs.dropdown.style.left="".concat(h,"px")},handleRefClick:function(){this.dropDisabled||(this.dropdownVisible=!this.dropdownVisible)},handleDocumentClick:function(e){this.$refs&&(this.$refs.reference.contains(e.target)||this.$refs.dropdown.contains(e.target)||(this.dropdownVisible=!1))},handleClear:function(){this.$emit("clear"),this.checkable?this.clearChecked():this.selectable&&this.clearSelected()},handleCheckedChange:function(e,t){this.slotProps.checkedNodes=e,this.slotProps.checkedKeys=t,this.checkedCount=t.length},handleSelectedChange:function(e,t){if(this.slotProps.selectedNode=e,this.slotProps.selectedKey=t,e){var n=this.$refs.treeSearch.$refs.tree.titleField;this.selectedTitle=e[n]}else this.selectedTitle=t||"";this.dropdownVisible=!1},handleSetData:function(){if(this.slotProps.checkedNodes=this.getCheckedNodes(),this.slotProps.checkedKeys=this.getCheckedKeys(),this.slotProps.selectedNode=this.getSelectedNode(),this.slotProps.selectedKey=this.getSelectedKey(),this.checkable&&(this.checkedCount=this.slotProps.checkedKeys.length),this.selectable&&null!=this.value){var e=this.getNode(this.value);if(e){var t=this.$refs.treeSearch.$refs.tree.titleField;this.selectedTitle=e[t]}else this.selectedTitle=this.value}}}),mounted:function(){document.addEventListener("click",this.handleDocumentClick),this.transfer&&document.body.appendChild(this.$refs.dropdown),this.handleSetData()},beforeDestroy:function(){document.removeEventListener("click",this.handleDocumentClick),this.$refs.dropdown.remove()},watch:{dropdownVisible:function(e){var t=this;this.$emit("dropdown-visible-change",e),e?this.$nextTick((function(){t.locateDropdown()})):this.$refs.treeSearch.getKeyword()&&(this.$refs.treeSearch.clearKeyword(),this.$refs.treeSearch.search())}}}),Le=Oe,Ee=Object($["a"])(Le,fe,ve,!1,null,null,null),Ke=Ee.exports,$e=(n("a4b1"),Q),Pe=function(){return Math.random().toString(36).substring(2)},Fe=function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},t=e.treeDepth,n=void 0===t?5:t,i=e.nodesPerLevel,a=e.sameIdTitle,r=void 0!==a&&a,o=e.inOrder,s=void 0!==o&&o,l=e.forceString,c=void 0!==l&&l,d=[],h=0,u=0,p=function e(t){var a=arguments.length>1&&void 0!==arguments[1]?arguments[1]:0;if(!(a>=n))for(var o=i||Math.floor(100*Math.random()),l=0;l<o;l++){var d=s?u++:Pe();c&&(d=d.toString());var p=r?d:Pe(),f={title:d,id:p,children:[]};t.push(f),h++,e(f.children,a+1)}};return p(d),{data:d,total:h}},Re=function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};return Fe(Object.assign({treeDepth:3,nodesPerLevel:5,sameIdTitle:!0},e))},Ie=function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:2;return Fe({treeDepth:1,nodesPerLevel:e,inOrder:!0})},Me={name:"Feature",components:{CTree:$e},data:function(){var e=Re().data;e[0].selected=!0;var t=Re().data;return t[0].expand=!0,t[1].children[0].disabled=!0,{basicUsage:Re().data,orderData:Re({inOrder:!0}).data,selectable:e,selectableValue:"",showCheckable:!0,checkable:t,checkableValue:[t[0].id],checkableIgnoreMode:"none",checkableCascade:!0,both:Re().data,bothValue:[],showLineTreeData:[{title:"node-1",id:"node-1",children:[{title:"node-1-1",id:"node-1-1",children:[{title:"node-1-1-1",id:"node-1-1-1"},{title:"node-1-1-2",id:"node-1-1-2"},{title:"node-1-1-3",id:"node-1-1-3"}]},{title:"node-1-2",id:"node-1-2",children:[{title:"node-1-2-1",id:"node-1-2-1"},{title:"node-1-2-2",id:"node-1-2-2"}]},{title:"node-1-3",id:"node-1-3",children:[{title:"node-1-3-1",id:"node-1-3-1"},{title:"node-1-3-2",id:"node-1-3-2"}]}]},{title:"node-2",id:"node-2",children:[{title:"node-2-1",id:"node-2-1",children:[{title:"node-2-1-1",id:"node-2-1-1"},{title:"node-2-1-2",id:"node-2-1-2"}]}]}],showLineType:void 0,showLinePolyline:!1,nodeSlotDescText:'\n<VTree :data="basicUsage">\n  <template v-slot:node="{ node }">\n    <button>{{ node.title }}</button>\n  </template>\n</VTree>\n      ',remoteShow:!1,remoteLoad:function(e,t,n){setTimeout((function(){t(Ie(e?2:5).data)}),1e3)}}},methods:{onShowLineTypeBtnClick:function(e){this.showLineType=e},onShowLinePolylineBtnClick:function(e){this.showLinePolyline=e}}},Be=Me,je=(n("4031"),Object($["a"])(Be,o,s,!1,null,"15aa1b8d",null)),Ve=je.exports,He=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"container"},[n("div",{staticClass:"tree"},[n("CTree",{ref:"tree",attrs:{data:e.treeData,checkable:"",selectable:""}})],1),n("div",{staticClass:"control"},[e._m(0),n("div",{staticClass:"controls"},[n("label",[e._v("节点深度：")]),n("input",{directives:[{name:"model",rawName:"v-model",value:e.params.treeDepth,expression:"params.treeDepth"}],attrs:{type:"number"},domProps:{value:e.params.treeDepth},on:{input:function(t){t.target.composing||e.$set(e.params,"treeDepth",t.target.value)}}})]),n("div",{staticClass:"controls"},[n("label",[e._v("每层节点个数：")]),n("input",{directives:[{name:"model",rawName:"v-model",value:e.params.nodesPerLevel,expression:"params.nodesPerLevel"}],attrs:{type:"number"},domProps:{value:e.params.nodesPerLevel},on:{input:function(t){t.target.composing||e.$set(e.params,"nodesPerLevel",t.target.value)}}})]),n("div",{staticClass:"controls"},[n("label",[e._v("总节点个数：")]),e._v("\n      "+e._s(e.nodeTotal)+"\n    ")]),n("div",{staticClass:"controls"},[n("div",{staticClass:"actions"},[n("button",{on:{click:e.handleGenerate}},[e._v("生成树节点数据")]),n("button",{on:{click:function(t){return e.handleGenerateTotal("1w")}}},[e._v("1w 节点")]),n("button",{on:{click:function(t){return e.handleGenerateTotal("10w")}}},[e._v("10w 节点")]),n("button",{on:{click:function(t){return e.handleGenerateTotal("20w")}}},[e._v("20w 节点")]),n("button",{on:{click:function(t){return e.handleGenerateTotal("30w")}}},[e._v("30w 节点")])]),n("div",{staticClass:"actions"},[n("button",{on:{click:e.handleSetData}},[e._v("设置树数据")])]),n("div",{staticClass:"actions"},[e.isTreeSet?n("span",{staticStyle:{color:"green"}},[e._v("树数据已设置")]):n("span",{staticStyle:{color:"red"}},[e._v("树数据已生成")])])]),n("div",{staticClass:"controls"},[n("label",[e._v("滚动节点id：")]),n("input",{directives:[{name:"model",rawName:"v-model",value:e.scrollKey,expression:"scrollKey"}],attrs:{type:"text"},domProps:{value:e.scrollKey},on:{input:function(t){t.target.composing||(e.scrollKey=t.target.value)}}})]),n("div",{staticClass:"controls"},[n("label",[e._v("滚动垂直位置：")]),n("select",{directives:[{name:"model",rawName:"v-model",value:e.scrollVerticalOption,expression:"scrollVerticalOption"}],on:{change:function(t){var n=Array.prototype.filter.call(t.target.options,(function(e){return e.selected})).map((function(e){var t="_value"in e?e._value:e.value;return t}));e.scrollVerticalOption=t.target.multiple?n:n[0]}}},[n("option",{attrs:{value:"top"}},[e._v("top")]),n("option",{attrs:{value:"center"}},[e._v("center")]),n("option",{attrs:{value:"bottom"}},[e._v("bottom")])])]),n("div",{staticClass:"controls"},[n("label",[e._v("滚动垂直偏移值：")]),n("input",{directives:[{name:"model",rawName:"v-model.number",value:e.scrollValue,expression:"scrollValue",modifiers:{number:!0}}],attrs:{type:"text"},domProps:{value:e.scrollValue},on:{input:function(t){t.target.composing||(e.scrollValue=e._n(t.target.value))},blur:function(t){return e.$forceUpdate()}}})]),n("div",{staticClass:"controls"},[n("div",{staticClass:"actions"},[n("button",{on:{click:e.handleScrollToNode}},[e._v("滚动到此节点")])])])])])},Ue=[function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"desc-block"},[n("p",[e._v("说明：在 Chrome 下表现良好")]),n("p",[e._v("在火狐浏览器下，因为其异步滚动策略 (scroll-linked) ，在快速滚动时会导致内容空白。")]),n("p",[e._v("另：浏览器元素/文档是有最大高度限制的，过多数据会导致显示不正常(Chrome 下 100 万条可以正常显示，但是在火狐或 Edge 则不行)")])])}],We={"1w":{treeDepth:2,nodesPerLevel:100},"10w":{treeDepth:2,nodesPerLevel:320},"20w":{treeDepth:2,nodesPerLevel:450},"30w":{treeDepth:2,nodesPerLevel:550}},Ge=[],Ye={name:"Performance",components:{CTree:$e},data:function(){return{cache:[],isTreeSet:!1,params:{treeDepth:2,nodesPerLevel:5},nodeTotal:0,treeData:[],scrollKey:"",scrollVerticalOption:"top",scrollValue:0}},methods:{handleGenerate:function(){var e=Fe(Object.assign({},this.params,{inOrder:!0,sameIdTitle:!0,forceString:!0}));Ge=e.data,this.nodeTotal=e.total,this.isTreeSet=!1},handleGenerateTotal:function(e){Object.assign(this.params,We[e]),this.handleGenerate()},handleSetData:function(){this.$refs.tree.setData(Ge.concat()),this.isTreeSet=!0},handleScrollToNode:function(){this.$refs.tree.scrollTo(this.scrollKey,this.scrollValue||this.scrollVerticalOption)}},created:function(){this.handleGenerate()}},Xe=Ye,qe=(n("cc5d"),Object($["a"])(Xe,He,Ue,!1,null,"0c36da81",null)),ze=qe.exports,Je=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",[n("CTree",{attrs:{data:e.basicUsage,loading:e.loading}}),n("button",{on:{click:e.handleToggle}},[e._v("Toggle Loading")])],1)},Qe=[],Ze=function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};return Fe(Object.assign({treeDepth:3,nodesPerLevel:5,sameIdTitle:!0},e))},et={name:"Loading",components:{CTree:$e},data:function(){return{basicUsage:Ze().data,loading:!1}},methods:{handleToggle:function(){this.loading=!this.loading}}},tt=et,nt=Object($["a"])(tt,Je,Qe,!1,null,null,null),it=nt.exports,at=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("CTreeSearch",{attrs:{data:e.data,checkable:"",expandOnFilter:!1},model:{value:e.value,callback:function(t){e.value=t},expression:"value"}},[n("span",{attrs:{slot:"empty"},slot:"empty"},[e._v("slot 传进来的暂无数据")]),n("template",{slot:"actions"},[n("span",{staticStyle:{"margin-left":"5px"}},[e._v("折叠")]),n("span",{staticStyle:{"margin-left":"5px"}},[e._v("展开")]),n("span",{staticStyle:{"margin-left":"5px"}},[e._v("slot 按钮")])])],2)},rt=[],ot=function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};return Fe(Object.assign({treeDepth:3,nodesPerLevel:5,sameIdTitle:!0,inOrder:!0,forceString:!0},e))},st={name:"Search",components:{CTreeSearch:pe},data:function(){return{data:ot().data,value:"2"}}},lt=st,ct=Object($["a"])(lt,at,rt,!1,null,null,null),dt=ct.exports,ht=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticStyle:{height:"100%"}},[n("CTreeSearch",{attrs:{load:e.load,"search-remote":"",checkable:""},on:{search:e.handleSearch},model:{value:e.value,callback:function(t){e.value=t},expression:"value"}},[n("span",{attrs:{slot:"empty"},slot:"empty"},[e._v("slot 传进来的暂无数据")])]),e._v("\n  "+e._s(e.value)+"\n")],1)},ut=[],pt=function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};return Fe(Object.assign({treeDepth:3,nodesPerLevel:5,sameIdTitle:!0,inOrder:!0,forceString:!0},e))},ft={name:"Search",components:{CTreeSearch:pe},data:function(){var e=this;return{times:[3,2,5],index:0,load:function(t,n){setTimeout((function(){var t=pt({nodesPerLevel:e.times[e.index]}).data;n(t)}),10)},value:["93","124"]}},methods:{handleSearch:function(){this.index++,this.index>=this.times.length&&(this.index=0)}}},vt=ft,gt=Object($["a"])(vt,ht,ut,!1,null,null,null),yt=(gt.exports,function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticStyle:{height:"100%"}},[n("CTreeSearch",{attrs:{data:e.data,checkable:"","search-method":e.searchMethod},on:{search:e.handleSearch},model:{value:e.value,callback:function(t){e.value=t},expression:"value"}},[n("span",{attrs:{slot:"empty"},slot:"empty"},[e._v("slot 传进来的暂无数据")])]),e._v("\n  "+e._s(e.value)+"\n")],1)}),mt=[],bt=function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};return Fe(Object.assign({treeDepth:3,nodesPerLevel:5,sameIdTitle:!0,inOrder:!0,forceString:!0},e))},kt={name:"Search",components:{CTreeSearch:pe},data:function(){return{data:[],times:[3,2,5],index:0,value:["93","124"]}},methods:{searchMethod:function(e){var t=this;return new Promise((function(e){setTimeout((function(){t.data=bt({nodesPerLevel:t.times[t.index]}).data,e()}),10)}))},handleSearch:function(){this.index++,this.index>=this.times.length&&(this.index=0)}}},_t=kt,Ct=Object($["a"])(_t,yt,mt,!1,null,null,null),wt=(Ct.exports,function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",[n("div",{staticStyle:{width:"200px"}},[n("p",[e._v("自定义展示 slot ：")]),n("CTreeDrop",{attrs:{data:e.data,checkable:"",clearable:"","drop-placeholder":"请选择",placement:e.placement,"dropdown-min-width":300,"dropdown-width-fixed":""},on:{"checked-change":e.handleCheckedChange},scopedSlots:e._u([{key:"display",fn:function(t){return[n("div",{staticStyle:{width:"170px","text-overflow":"ellipsis",overflow:"hidden"}},[e._v(e._s(t.checkedNodes.map((function(e){return e.title})).join(",")))])]}}]),model:{value:e.value,callback:function(t){e.value=t},expression:"value"}},[n("span",{attrs:{slot:"empty"},slot:"empty"},[e._v("slot 传进来的暂无数据")])]),e._v("\n    "+e._s(e.value)+"\n  ")],1),n("div",{staticStyle:{width:"200px"}},[n("p",[e._v("默认：")]),n("CTreeDrop",{attrs:{data:e.data,checkable:"",clearable:"","drop-placeholder":"请选择",placement:e.placement,"dropdown-min-width":300,"dropdown-width-fixed":""},on:{"checked-change":e.handleCheckedChange},model:{value:e.value,callback:function(t){e.value=t},expression:"value"}},[n("span",{attrs:{slot:"empty"},slot:"empty"},[e._v("slot 传进来的暂无数据")])]),e._v("\n    "+e._s(e.value)+"\n  ")],1)])}),xt=[],St=function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};return Fe(Object.assign({treeDepth:3,nodesPerLevel:5,sameIdTitle:!0,inOrder:!0,forceString:!0},e))},Dt={name:"Drop",components:{CTreeDrop:Ke},data:function(){var e=St().data;return{data:e,value:"2",placement:"bottom-start"}},methods:{handleCheckedChange:function(){console.log("checked-change")}}},Nt=Dt,At=Object($["a"])(Nt,wt,xt,!1,null,null,null),Tt=At.exports,Ot=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticStyle:{width:"200px"}},[n("CTreeDrop",{attrs:{data:e.data,checkable:"",clearable:"",cascade:!1,loading:e.loading,"drop-placeholder":"请选择","dropdown-min-width":300},on:{"checked-change":e.handleCheckedChange},model:{value:e.value,callback:function(t){e.value=t},expression:"value"}},[n("span",{attrs:{slot:"empty"},slot:"empty"},[e._v("slot 传进来的暂无数据")])]),e._v("\n  "+e._s(e.value)+"\n  "),n("button",{on:{click:e.handleChangeValue}},[e._v("Change Value")])],1)},Lt=[],Et=[{id:"p1-id",title:"c(lL%8",checked:!1,children:[{id:"c1-1-id",title:"c1-1",children:[]},{id:"c1-2-id",title:"c1-2",checked:!1,children:[]}]},{id:"p2-id",title:"KfQrp",checked:!1,children:[{id:"c2-1-id",title:"c2-1",checked:!1,children:[]},{id:"c2-2-id",title:"c1-2",checked:!1,children:[{id:"c2-2-1-id",title:"c1-2-1",checked:!1,children:[]}]}]}],Kt={name:"DropRemote",components:{CTreeDrop:Ke},data:function(){return{data:[],value:"",loading:!1}},created:function(){this.handleSetData()},methods:{handleChangeValue:function(){var e=this;setTimeout((function(){e.value="c1-1-id,c1-2-id"}),100)},handleCheckedChange:function(e){console.log("rrr checked change",e)},handleSetData:function(){var e=this;this.loading=!0,setTimeout((function(){e.data=Et,e.$nextTick((function(){e.value="c1-1-id,c1-2-id",e.loading=!1}))}),2e3)}}},$t=Kt,Pt=Object($["a"])($t,Ot,Lt,!1,null,null,null),Ft=(Pt.exports,function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",[n("CTree",{attrs:{data:e.data,checkable:"",draggable:"",droppable:""},on:{"node-drop":e.handleDrop},model:{value:e.value,callback:function(t){e.value=t},expression:"value"}},[n("span",{attrs:{slot:"empty"},slot:"empty"},[e._v("slot 传进来的暂无数据")])]),e._v("\n  "+e._s(e.value)+"\n")],1)}),Rt=[],It=function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};return Fe(Object.assign({treeDepth:3,nodesPerLevel:5,sameIdTitle:!0,inOrder:!0,forceString:!0},e))},Mt={name:"Drag",components:{CTree:$e},data:function(){var e=It().data;return{data:e,value:["0"]}},methods:{handleDrop:function(){console.log("node drop")}}},Bt=Mt,jt=Object($["a"])(Bt,Ft,Rt,!1,null,null,null),Vt=jt.exports,Ht=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticStyle:{width:"200px"}},[n("CTreeDrop",{attrs:{data:e.data,checkable:"",clearable:"","drop-placeholder":"请选择","dropdown-min-width":300,"dropdown-width-fixed":""},model:{value:e.value,callback:function(t){e.value=t},expression:"value"}},[n("span",{attrs:{slot:"empty"},slot:"empty"},[e._v("slot 传进来的暂无数据")])]),e._v("\n  "+e._s(e.value)+"\n")],1)},Ut=[],Wt=function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};return Fe(Object.assign({treeDepth:3,nodesPerLevel:5,sameIdTitle:!0,inOrder:!0,forceString:!0},e))},Gt=Wt().data,Yt={name:"DropDataChange",components:{CTreeDrop:Ke},data:function(){return{data:[],value:"2"}},watch:{value:{handler:function(e){var t=this;setTimeout((function(){t.data=Gt}),3e3)},immediate:!0}}},Xt=Yt,qt=Object($["a"])(Xt,Ht,Ut,!1,null,null,null),zt=(qt.exports,function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("CTree",{ref:"tree",attrs:{data:e.treeData,render:e.renderTree}})}),Jt=[],Qt={name:"InsertRenderTree",components:{CTree:$e},data:function(){return{treeData:[{}]}},methods:{renderTree:function(e,t){return e("div",[e("input",{attrs:{type:"text"}}),e("button",{on:{click:this.handleAdd.bind(this,t)}},["Add sibling"]),e("button",{on:{click:this.handleAddChild.bind(this,t)}},["Add child"]),e("button",{on:{click:this.handleDelete.bind(this,t)}},["Remove"])])},handleAdd:function(e){this.$refs.tree.insertAfter({},e.id)},handleAddChild:function(e){this.$refs.tree.append({},e.id)},handleDelete:function(e){this.$refs.tree.remove(e.id)}}},Zt=Qt,en=Object($["a"])(Zt,zt,Jt,!1,null,null,null),tn=en.exports,nn={Feature:Ve,Performance:ze,Loading:it,Search:dt,Drop:Tt,Drag:Vt,InsertRenderTree:tn},an={name:"App",components:nn,data:function(){var e=Object.keys(nn);return{currentTab:e[0],tabList:e}}},rn=an,on=(n("6d6d"),Object($["a"])(rn,a,r,!1,null,"6afbf07a",null)),sn=on.exports;n("eeb1");i["a"].config.productionTip=!1,new i["a"]({render:function(e){return e(sn)}}).$mount("#app")},cc5d:function(e,t,n){"use strict";var i=n("050b"),a=n.n(i);a.a},eeb1:function(e,t,n){}});
\ No newline at end of file
diff --git a/docs/js/main.a980790b.js b/docs/js/main.a980790b.js
deleted file mode 100644
index 920ed4e..0000000
--- a/docs/js/main.a980790b.js
+++ /dev/null
@@ -1 +0,0 @@
-(function(e){function t(t){for(var a,s,o=t[0],l=t[1],c=t[2],h=0,u=[];h<o.length;h++)s=o[h],Object.prototype.hasOwnProperty.call(i,s)&&i[s]&&u.push(i[s][0]),i[s]=0;for(a in l)Object.prototype.hasOwnProperty.call(l,a)&&(e[a]=l[a]);d&&d(t);while(u.length)u.shift()();return r.push.apply(r,c||[]),n()}function n(){for(var e,t=0;t<r.length;t++){for(var n=r[t],a=!0,o=1;o<n.length;o++){var l=n[o];0!==i[l]&&(a=!1)}a&&(r.splice(t--,1),e=s(s.s=n[0]))}return e}var a={},i={main:0},r=[];function s(t){if(a[t])return a[t].exports;var n=a[t]={i:t,l:!1,exports:{}};return e[t].call(n.exports,n,n.exports,s),n.l=!0,n.exports}s.m=e,s.c=a,s.d=function(e,t,n){s.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:n})},s.r=function(e){"undefined"!==typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},s.t=function(e,t){if(1&t&&(e=s(e)),8&t)return e;if(4&t&&"object"===typeof e&&e&&e.__esModule)return e;var n=Object.create(null);if(s.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var a in e)s.d(n,a,function(t){return e[t]}.bind(null,a));return n},s.n=function(e){var t=e&&e.__esModule?function(){return e["default"]}:function(){return e};return s.d(t,"a",t),t},s.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},s.p="/ctree/";var o=window["webpackJsonp"]=window["webpackJsonp"]||[],l=o.push.bind(o);o.push=t,o=o.slice();for(var c=0;c<o.length;c++)t(o[c]);var d=l;r.push(["c31f","chunk-vendors"]),n()})({"2bc9":function(e,t,n){"use strict";var a=n("7052"),i=n.n(a);i.a},"641e":function(e,t,n){},7052:function(e,t,n){},"826c":function(e,t,n){"use strict";var a=n("641e"),i=n.n(a);i.a},"925e":function(e,t,n){"use strict";var a=n("e2ab"),i=n.n(a);i.a},a4b1:function(e,t,n){},c31f:function(e,t,n){"use strict";n.r(t);var a=n("2b0e"),i=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"app"},[n("div",{staticClass:"tab"},e._l(e.tabList,(function(t){return n("button",{key:t,class:{active:e.currentTab===t},on:{click:function(n){e.currentTab=t}}},[e._v(e._s(t))])})),0),n("div",{staticClass:"tab-panel"},[n(e.currentTab,{tag:"component"})],1)])},r=[],s=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"container"},[n("div",{staticClass:"panel"},[n("div",{staticClass:"header"},[e._v("基本用法")]),n("div",{staticClass:"body"},[n("div",{staticClass:"interface"},[n("div",{staticStyle:{height:"300px"}},[n("CTree",{attrs:{data:e.basicUsage,nodeClassName:function(e){return"generated-class-"+e.id}}})],1)]),n("div",{staticClass:"desc"},[e._v("\n        纯展示\n      ")])])]),n("div",{staticClass:"panel"},[n("div",{staticClass:"header"},[e._v("数据正确性验证")]),n("div",{staticClass:"body"},[n("div",{staticClass:"interface"},[n("div",{staticStyle:{height:"300px"}},[n("CTree",{attrs:{data:e.orderData,"default-expand-all":""}})],1)]),n("div",{staticClass:"desc"},[e._v("\n        数据正确性\n      ")])])]),n("div",{staticClass:"panel"},[n("div",{staticClass:"header"},[e._v("单选")]),n("div",{staticClass:"body"},[n("div",{staticClass:"interface"},[n("div",{staticStyle:{height:"300px"}},[n("CTree",{attrs:{data:e.selectable,selectable:""},model:{value:e.selectableValue,callback:function(t){e.selectableValue=t},expression:"selectableValue"}})],1)]),n("div",{staticClass:"desc"},[e._v("\n        单选模式。设置 selectable 即可"),n("br"),e._v("\n        v-model: "),n("br"),e._v("\n        "+e._s(e.selectableValue)+"\n      ")])])]),n("div",{staticClass:"panel"},[n("div",{staticClass:"header"},[e._v("多选")]),n("div",{staticClass:"body"},[n("div",{staticClass:"interface"},[n("div",{staticStyle:{height:"300px"}},[e.showCheckable?n("CTree",{attrs:{data:e.checkable,checkable:"","ignore-mode":e.checkableIgnoreMode,cascade:e.checkableCascade},model:{value:e.checkableValue,callback:function(t){e.checkableValue=t},expression:"checkableValue"}}):e._e()],1)]),n("div",{staticClass:"desc"},[n("div",{staticClass:"desc-block"},[n("p",[e._v("多选模式。设置 checkable 即可")]),e._v("\n          v-model: "),n("br"),e._v("\n          "+e._s(e.checkableValue)+"\n        ")]),n("div",{staticClass:"desc-block"},[n("p",[e._v("设置 ignoreMode 可指定 v-model 与 getCheckedNodes 方法要忽略父节点或者子节点，该 prop 仅初始设置有效")]),e._l(["none","parents","children"],(function(t){return n("button",{key:t,on:{click:function(n){e.checkableIgnoreMode=t,e.showCheckable=!1,e.$nextTick((function(){e.checkableValue=[],e.showCheckable=!0}))}}},[e._v(e._s(t))])})),n("p",[e._v("当前 ignoreMode: "+e._s(e.checkableIgnoreMode))])],2),n("div",{staticClass:"desc-block"},[n("p",[e._v("设置 cascade 可指定父子节点是否级联")]),e._l([!0,!1],(function(t,a){return n("button",{key:a,on:{click:function(n){e.checkableCascade=t,e.showCheckable=!1,e.$nextTick((function(){e.checkableValue=[],e.showCheckable=!0}))}}},[e._v(e._s(t))])})),n("p",[e._v("当前 cascade: "+e._s(e.checkableCascade))])],2),n("div",{staticClass:"desc-block"},[n("p",[e._v("重置以上选项")]),n("button",{on:{click:function(t){e.showCheckable=!1,e.$nextTick((function(){e.checkableIgnoreMode="none",e.checkableCascade=!0,e.checkableValue=[],e.showCheckable=!0}))}}},[e._v("Reset")])])])])]),n("div",{staticClass:"panel"},[n("div",{staticClass:"header"},[e._v("单选与多选并存")]),n("div",{staticClass:"body"},[n("div",{staticClass:"interface"},[n("div",{staticStyle:{height:"300px"}},[n("CTree",{attrs:{data:e.both,checkable:"",selectable:""},model:{value:e.bothValue,callback:function(t){e.bothValue=t},expression:"bothValue"}})],1)]),n("div",{staticClass:"desc"},[e._v("\n        当既可以单选又可以多选时， v-model 绑定的是多选的值"),n("br"),e._v("\n        v-model: "),n("br"),e._v("\n        "+e._s(e.bothValue)+"\n      ")])])]),n("div",{staticClass:"panel"},[n("div",{staticClass:"header"},[e._v("远程")]),n("div",{staticClass:"body"},[n("div",{staticClass:"interface"},[n("div",{staticStyle:{height:"300px"}},[e.remoteShow?n("CTree",{attrs:{load:e.remoteLoad}}):e._e()],1)]),n("div",{staticClass:"desc"},[e._m(0),n("div",{staticClass:"desc-block"},[n("button",{on:{click:function(t){e.remoteShow=!1,e.$nextTick((function(){e.remoteShow=!0}))}}},[e._v("加载树组件")])])])])])])},o=[function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"desc-block"},[e._v("\n          设置 load 方法可以使用远程加载数据，如果有设置 data ，则 data 数据作为根数据；"),n("br"),e._v("\n          如果没有传 data ，则初始化时调用 load 方法载入根数据，其中节点参数为 null\n        ")])}],l=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{class:e.wrapperCls},[n("div",{ref:"scrollArea",class:e.scrollAreaCls,on:{"&scroll":function(t){return t.stopPropagation(),e.handleTreeScroll(t)}}},[n("div",{class:e.blockAreaCls},[n("div",{style:e.topSpaceStyles}),e._l(e.renderNodes,(function(t,a){return n("CTreeNode",e._g(e._b({key:t[e.keyField],class:"function"===typeof e.nodeClassName?e.nodeClassName(t):e.nodeClassName,style:{minHeight:e.nodeMinHeight+"px",marginLeft:e.usePadding?null:t._level*e.nodeIndent+"px",paddingLeft:e.usePadding?t._level*e.nodeIndent+"px":null},attrs:{data:t},on:{check:e.handleNodeCheck,select:e.handleNodeSelect,expand:e.handleNodeExpand,"node-drop":e.handleNodeDrop}},"CTreeNode",e.$props,!1),e.treeNodeListeners))})),n("div",{style:e.bottomSpaceStyles})],2)]),n("div",{directives:[{name:"show",rawName:"v-show",value:!e.blockLength,expression:"!blockLength"}],class:e.emptyCls},[n("span",{class:e.emptyTextDefaultCls},[e._t("empty",[e._v("\n        "+e._s(e.emptyText)+"\n      ")])],2)]),n("div",{directives:[{name:"show",rawName:"v-show",value:e.loading||e.isRootLoading,expression:"loading || isRootLoading"}],class:e.loadingCls},[n("div",{class:e.loadingWrapperCls},[e._t("loading",[n("LoadingIcon",{class:e.loadingIconCls})])],2)]),n("iframe",{ref:"iframe",class:e.iframeCls})])},c=[];function d(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function h(e,t){for(var n=0;n<t.length;n++){var a=t[n];a.enumerable=a.enumerable||!1,a.configurable=!0,"value"in a&&(a.writable=!0),Object.defineProperty(e,a.key,a)}}function u(e,t,n){return t&&h(e.prototype,t),n&&h(e,n),e}var f,p=["_level","_filterVisible","_parent","_loading","_loaded","_remote","_keyField","children","setChildren"],v=function(){function e(t){var n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:null,a=arguments.length>2&&void 0!==arguments[2]?arguments[2]:"id",i=arguments.length>3&&void 0!==arguments[3]&&arguments[3];for(var r in d(this,e),this._keyField=a,this._remote=i,this._level=0,this.checked=!1,this.selected=!1,this.indeterminate=!1,this.disabled=!1,this.expand=!1,this.visible=!0,this._filterVisible=!0,this._parent=null,this.children=[],this.isLeaf=!1,this._loading=!1,this._loaded=!1,t)-1===p.indexOf(r)&&(this[r]=t[r]);null==this[a]&&(this[a]=Math.random().toString(36).substring(2)),this._parent=n,this._parent&&(this._level=this._parent._level+1),this.visible=null===this._parent||this._parent.expand&&this._parent.visible,Array.isArray(t.children)&&this.setChildren(t.children),this.children.length&&(this._loaded=!0),this._remote||(this.isLeaf=!this.children.length)}return u(e,[{key:"setChildren",value:function(t){var n=this;this.children=t.map((function(t){return new e(Object.assign({},t),n,n._keyField,n._remote)}))}}]),e}();(function(e){e["none"]="none",e["parents"]="parents",e["children"]="children"})(f||(f={}));var g,b,y,k=["setData","setChecked","setCheckedKeys","checkAll","clearChecked","setSelected","clearSelected","setExpand","setExpandKeys","setExpandAll","getCheckedNodes","getCheckedKeys","getIndeterminateNodes","getSelectedNode","getSelectedKey","getExpandNodes","getExpandKeys","getCurrentVisibleNodes","getNode","getTreeData","getFlatData","getNodesCount","insertBefore","insertAfter","append","prepend","remove","filter","showCheckedNodes","loadRootNodes","scrollTo"],m=["clearKeyword","getKeyword","search"];function _(e){return _="function"===typeof Symbol&&"symbol"===typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"===typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},_(e)}function C(e){return x(e)||w(e)||S()}function S(){throw new TypeError("Invalid attempt to spread non-iterable instance")}function w(e){if(Symbol.iterator in Object(e)||"[object Arguments]"===Object.prototype.toString.call(e))return Array.from(e)}function x(e){if(Array.isArray(e)){for(var t=0,n=new Array(e.length);t<e.length;t++)n[t]=e[t];return n}}function D(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function A(e,t){for(var n=0;n<t.length;n++){var a=t[n];a.enumerable=a.enumerable||!1,a.configurable=!0,"value"in a&&(a.writable=!0),Object.defineProperty(e,a.key,a)}}function N(e,t,n){return t&&A(e.prototype,t),n&&A(e,n),e}(function(e){e["bottom-start"]="bottom-start",e["bottom-end"]="bottom-end",e["bottom"]="bottom",e["top-start"]="top-start",e["top-end"]="top-end",e["top"]="top"})(g||(g={})),function(e){e["top"]="top",e["center"]="center",e["bottom"]="bottom"}(b||(b={})),function(e){e["before"]="before",e["body"]="body",e["after"]="after"}(y||(y={}));var T=function(){function e(t){D(this,e),this.options=t,this.data=[],this.flatData=[],this.mapData=Object.create(null),this.unloadCheckedKeys=[],this.unloadSelectedKey=null,this.currentSelectedKey=null,this.listenersMap={}}return N(e,[{key:"setData",value:function(e){var t=this,n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:null,a=arguments.length>2&&void 0!==arguments[2]?arguments[2]:null;for(var i in this.data=e.map((function(e){return new v(e,null,t.options.keyField,!!t.options.load)})),this.mapData)delete this.mapData[i];this.currentSelectedKey=null,this.flatData=this.flattenData(this.data),this.setUnloadCheckedKeys(a||[]),n&&(this.currentSelectedKey=null,this.setUnloadSelectedKey(n)),this.emit("visible-data-change"),this.emit("set-data")}},{key:"setChecked",value:function(e,t){var n=!(arguments.length>2&&void 0!==arguments[2])||arguments[2],a=!(arguments.length>3&&void 0!==arguments[3])||arguments[3],i=arguments.length>4&&void 0!==arguments[4]&&arguments[4],r=this.mapData[e];if(!r)return this.setUnloadChecked(e,t,n,a);r.disabled||r.checked&&t||(r.checked||r.indeterminate||t)&&(this.options.cascade?(this.checkNodeDownward(r,t,i),this.checkNodeUpward(r)):r.checked=t,n&&(r.checked?this.emit("check",r):this.emit("uncheck",r)),this.triggerCheckedChange(n,a))}},{key:"setUnloadChecked",value:function(e,t){var n=!(arguments.length>2&&void 0!==arguments[2])||arguments[2],a=!(arguments.length>3&&void 0!==arguments[3])||arguments[3],i=this.findIndex(e,this.unloadCheckedKeys);t?-1===i&&this.unloadCheckedKeys.push(e):-1!==i&&this.unloadCheckedKeys.splice(i,1),this.triggerCheckedChange(n,a)}},{key:"setCheckedKeys",value:function(e,t){var n=this,a=!(arguments.length>2&&void 0!==arguments[2])||arguments[2],i=!(arguments.length>3&&void 0!==arguments[3])||arguments[3];e.forEach((function(e){n.setChecked(e,t,!1,!1)})),this.triggerCheckedChange(a,i)}},{key:"checkAll",value:function(){var e=this,t=!(arguments.length>0&&void 0!==arguments[0])||arguments[0],n=!(arguments.length>1&&void 0!==arguments[1])||arguments[1];if(this.options.cascade){var a=function t(n){n.forEach((function(n){n.disabled?t(n.children):e.setChecked(n[e.options.keyField],!0,!1,!1)}))};a(this.data)}else for(var i=this.flatData.length,r=0;r<i;r++){var s=this.flatData[r];this.setChecked(s[this.options.keyField],!0,!1,!1)}this.triggerCheckedChange(t,n)}},{key:"clearChecked",value:function(){var e=this,t=!(arguments.length>0&&void 0!==arguments[0])||arguments[0],n=!(arguments.length>1&&void 0!==arguments[1])||arguments[1],a=this.getCheckedNodes();a.forEach((function(t){e.setChecked(t[e.options.keyField],!1,!1,!1)})),this.unloadCheckedKeys=[],this.triggerCheckedChange(t,n)}},{key:"triggerCheckedChange",value:function(){var e=!(arguments.length>0&&void 0!==arguments[0])||arguments[0],t=!(arguments.length>1&&void 0!==arguments[1])||arguments[1];e&&this.emit("checked-change",this.getCheckedNodes(),this.getCheckedKeys()),t&&this.emit("render-data-change")}},{key:"setSelected",value:function(e,t){var n=!(arguments.length>2&&void 0!==arguments[2])||arguments[2],a=!(arguments.length>3&&void 0!==arguments[3])||arguments[3],i=this.mapData[e];if(!i)return this.setUnloadSelected(e,t,n,a);i.disabled||i.selected!==t&&(e===this.currentSelectedKey?t||(i.selected=t,this.currentSelectedKey=null):t&&(null===this.currentSelectedKey?(i.selected=t,this.currentSelectedKey=i[this.options.keyField]):(this.mapData[this.currentSelectedKey]&&(this.mapData[this.currentSelectedKey].selected=!1),i.selected=t,this.currentSelectedKey=i[this.options.keyField])),n&&(i.selected?this.emit("select",i):this.emit("unselect",i),this.emit("selected-change",this.getSelectedNode(),this.getSelectedKey())),a&&this.emit("render-data-change"))}},{key:"setUnloadSelected",value:function(e,t){var n=!(arguments.length>2&&void 0!==arguments[2])||arguments[2],a=!(arguments.length>3&&void 0!==arguments[3])||arguments[3];t?(this.currentSelectedKey&&this.setSelected(this.currentSelectedKey,!1,!1,!1),this.unloadSelectedKey=e):this.unloadSelectedKey===e&&(this.unloadSelectedKey=null),n&&this.emit("selected-change",this.getSelectedNode(),this.getSelectedKey()),a&&this.emit("render-data-change")}},{key:"clearSelected",value:function(){var e=!(arguments.length>0&&void 0!==arguments[0])||arguments[0],t=!(arguments.length>1&&void 0!==arguments[1])||arguments[1];this.currentSelectedKey&&this.mapData[this.currentSelectedKey]?this.setSelected(this.currentSelectedKey,!1,e,t):null!==this.unloadSelectedKey&&(this.unloadSelectedKey=null,e&&this.emit("selected-change",this.getSelectedNode(),this.getSelectedKey()),t&&this.emit("render-data-change"))}},{key:"setExpand",value:function(e,t){var n=this,a=arguments.length>2&&void 0!==arguments[2]&&arguments[2],i=!(arguments.length>3&&void 0!==arguments[3])||arguments[3],r=!(arguments.length>4&&void 0!==arguments[4])||arguments[4],s=this.mapData[e];if(s&&(a||!s.isLeaf)&&s.expand!==t){if(!s.isLeaf){if("function"===typeof this.options.load){if(!s._loaded&&!s._loading&&t)return s._loading=!0,r&&this.emit("visible-data-change"),void new Promise((function(e,t){var a=n.options.load;a(s,e,t)})).then((function(e){if(Array.isArray(e)){var a,i=n.findIndex(s);if(-1===i)return;s._loaded=!0,s.expand=t,s.setChildren(e);var r=n.getCheckedKeys(),o=n.flattenData(s.children,null===n.getSelectedKey);(a=n.flatData).splice.apply(a,[i+1,0].concat(C(o))),n.setUnloadCheckedKeys(r),null!==n.unloadSelectedKey&&n.setUnloadSelectedKey(n.unloadSelectedKey),n.emit("set-data")}})).catch((function(e){var t=e;e instanceof Error||(t=new Error(e)),console.error(t)})).then((function(){s._loading=!1,i&&n.emit("expand",s),r&&n.emit("visible-data-change")}));if(s._loading)return}s.expand=t;var o=C(s.children);while(o.length)o[0].expand&&o[0].children.length&&o.push.apply(o,C(o[0].children)),!1===o[0]._filterVisible?o[0].visible=!1:o[0].visible=null===o[0]._parent||o[0]._parent.expand&&o[0]._parent.visible,o.shift();i&&this.emit("expand",s),r&&this.emit("visible-data-change")}a&&s._parent&&t&&this.setExpand(s._parent[this.options.keyField],t,a,!1,r)}}},{key:"setExpandKeys",value:function(e,t){var n=this,a=!(arguments.length>2&&void 0!==arguments[2])||arguments[2];e.forEach((function(e){n.setExpand(e,t,!1,!1,!1)})),a&&this.emit("visible-data-change")}},{key:"setExpandAll",value:function(e){var t=this,n=!(arguments.length>1&&void 0!==arguments[1])||arguments[1];this.flatData.forEach((function(n){t.options.load&&!n._loaded||t.setExpand(n[t.options.keyField],e,!1,!1,!1)})),n&&this.emit("visible-data-change")}},{key:"getCheckedNodes",value:function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:this.options.ignoreMode;if(e===f.children){var t=[],n=function e(n){n.forEach((function(n){n.checked?t.push(n):!n.isLeaf&&n.indeterminate&&e(n.children)}))};return n(this.data),t}return this.flatData.filter((function(t){return e===f.parents?t.checked&&t.isLeaf:t.checked}))}},{key:"getCheckedKeys",value:function(){var e=this,t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:this.options.ignoreMode;return this.getCheckedNodes(t).map((function(t){return t[e.options.keyField]})).concat(this.unloadCheckedKeys)}},{key:"getIndeterminateNodes",value:function(){return this.flatData.filter((function(e){return e.indeterminate}))}},{key:"getSelectedNode",value:function(){return null===this.currentSelectedKey?null:this.mapData[this.currentSelectedKey]||null}},{key:"getSelectedKey",value:function(){return this.currentSelectedKey||this.unloadSelectedKey||null}},{key:"getUnloadCheckedKeys",value:function(){return this.unloadCheckedKeys}},{key:"getExpandNodes",value:function(){return this.flatData.filter((function(e){return!e.isLeaf&&e.expand}))}},{key:"getExpandKeys",value:function(){var e=this;return this.getExpandNodes().map((function(t){return t[e.options.keyField]}))}},{key:"getNode",value:function(e){return this.mapData[e]||null}},{key:"insertBefore",value:function(e,t){var n=this.getInsertedNode(e,t);if(!n)return null;this.remove(n[this.options.keyField],!1);var a=this.mapData[t],i=a._parent,r=this.findIndex(t,i&&i.children),s=this.findIndex(t),o=i?-1:this.findIndex(t,this.data);return this.insertIntoStore(n,i,r,s,o),this.emit("visible-data-change"),n}},{key:"insertAfter",value:function(e,t){var n=this.getInsertedNode(e,t);if(!n)return null;this.remove(n[this.options.keyField],!1);for(var a=this.mapData[t],i=a._parent,r=this.findIndex(t,i&&i.children)+1,s=this.flatData.length,o=this.findIndex(t),l=o+1,c=o+1;c<=s;c++){if(c===s){l=c;break}if(this.flatData[c]._level<=a._level){l=c;break}}var d=i?-1:this.findIndex(t,this.data)+1;return this.insertIntoStore(n,i,r,l,d),this.emit("visible-data-change"),n}},{key:"append",value:function(e,t){var n=this.mapData[t];if(!n.isLeaf){var a=n.children.length;return this.insertAfter(e,n.children[a-1][this.options.keyField])}var i=this.getInsertedNode(e,t,!0);if(!i)return null;this.remove(i[this.options.keyField],!1);var r=this.findIndex(t)+1;return this.insertIntoStore(i,n,0,r),this.emit("visible-data-change"),i}},{key:"prepend",value:function(e,t){var n=this.mapData[t];if(!n.isLeaf)return this.insertBefore(e,n.children[0][this.options.keyField]);var a=this.getInsertedNode(e,t,!0);if(!a)return null;this.remove(a[this.options.keyField],!1);var i=this.findIndex(t)+1;return this.insertIntoStore(a,n,0,i),this.emit("visible-data-change"),a}},{key:"remove",value:function(e){var t=this,n=!(arguments.length>1&&void 0!==arguments[1])||arguments[1],a=this.mapData[e];if(!a)return null;var i=this.findIndex(a);if(-1===i)return null;for(var r=1,s=this.flatData.length,o=i+1;o<s;o++){if(!(this.flatData[o]._level>a._level))break;r++}this.flatData.splice(i,r);var l=function e(n){var a=t.mapData[n];delete t.mapData[n],a.children.forEach((function(n){return e(n[t.options.keyField])}))};if(l(e),!a._parent){var c=this.findIndex(a,this.data);c>-1&&this.data.splice(c,1)}if(a._parent){var d=this.findIndex(a,a._parent.children);-1!==d&&a._parent.children.splice(d,1),a._parent.isLeaf=!a._parent.children.length,a._parent.isLeaf&&(a._parent.expand=!1,a._parent.indeterminate=!1),this.updateMovingNodeStatus(a)}return n&&this.emit("visible-data-change"),a}},{key:"getInsertedNode",value:function(e,t){var n=arguments.length>2&&void 0!==arguments[2]&&arguments[2],a=this.mapData[t];if(!a)return null;var i=n?a:a._parent;if(e instanceof v)return e[this.options.keyField]===t?null:e;if("object"===_(e)){if(e[this.options.keyField]===t)return null;var r=this.mapData[e[this.options.keyField]];return r||new v(e,i,this.options.keyField,!!this.options.load)}return this.mapData[e]&&e!==t?this.mapData[e]:null}},{key:"insertIntoStore",value:function(e,t,n,a,i){var r;if(-1!==a){-1!==n&&t&&t.children.splice(n,0,e),e._parent=t,t?(t.isLeaf=!1,this.setExpand(t[this.options.keyField],!0,!1,!1,!1)):"number"===typeof i&&i>-1&&this.data.splice(i,0,e);var s=this.flattenData([e]);e._level=t?t._level+1:0,s.forEach((function(e){return e._level=e._parent?e._parent._level+1:0})),(r=this.flatData).splice.apply(r,[a,0].concat(C(s))),this.updateMovingNodeStatus(e)}}},{key:"updateMovingNodeStatus",value:function(e){this.checkNodeUpward(e),this.triggerCheckedChange(),e.selected&&this.setSelected(e[this.options.keyField],!0)}},{key:"filter",value:function(e,t){var n=this,a=[];this.flatData.forEach((function(n){n._filterVisible=n._parent&&n._parent._filterVisible||t(e,n),n.visible=n._filterVisible,n._filterVisible&&a.push(n)})),a.forEach((function(e){var t=[],a=e._parent;while(a)t.unshift(a),a=a._parent;t.forEach((function(e){e._filterVisible=!0,e.visible=(null===e._parent||e._parent.expand&&e._parent.visible)&&e._filterVisible,n.options.expandOnFilter&&n.setExpand(e[n.options.keyField],!0,!1,!1,!1)})),e.visible=null===e._parent||e._parent.expand&&e._parent.visible})),this.emit("visible-data-change")}},{key:"setUnloadCheckedKeys",value:function(e){this.unloadCheckedKeys=e;for(var t=e.concat(),n=this.unloadCheckedKeys.length,a=n-1;a>=0;a--){var i=this.unloadCheckedKeys[a];this.mapData[i]&&(this.setChecked(i,!0,!1,!1),this.unloadCheckedKeys.splice(a,1))}var r=this.getCheckedKeys();r.length===t.length&&r.every((function(e){return t.some((function(t){return t===e}))}))||this.emit("checked-change",this.getCheckedNodes(),r)}},{key:"setUnloadSelectedKey",value:function(e){var t=this.getSelectedKey();this.mapData[e]?(this.setSelected(e,!0,!1),this.unloadSelectedKey=null):(this.currentSelectedKey&&this.setSelected(this.currentSelectedKey,!1,!1),this.unloadSelectedKey=e);var n=this.getSelectedKey();n!==t&&this.emit("selected-change",this.getSelectedNode(),n)}},{key:"flattenData",value:function(e){for(var t=!(arguments.length>1&&void 0!==arguments[1])||arguments[1],n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:[],a=e.length,i=0;i<a;i++){var r=e[i],s=r[this.options.keyField];if(n.push(r),this.mapData[s])throw new Error("[CTree] Duplicate tree node key.");this.mapData[s]=r,r.checked&&this.options.cascade&&(this.checkNodeDownward(r,!0),this.checkNodeUpward(r)),r.selected&&t&&(this.clearSelected(!1,!1),this.currentSelectedKey=r[this.options.keyField],this.emit("selected-change",r,this.currentSelectedKey)),!this.options.defaultExpandAll&&!r.expand||this.options.load||r.isLeaf||(r.expand=!1,this.setExpand(r[this.options.keyField],!0,!1,!1,!1)),r.children.length&&this.flattenData(r.children,t,n)}return n}},{key:"checkNodeDownward",value:function(e,t){var n=this,a=arguments.length>2&&void 0!==arguments[2]&&arguments[2];if(e.children.forEach((function(e){n.checkNodeDownward(e,t,a)})),e.isLeaf||this.options.load&&!e.children.length){if(!e.disabled){if(a&&!this.options.filteredNodeCheckable&&!e._filterVisible)return;e.checked=t,e.indeterminate=!1}}else this.checkParentNode(e)}},{key:"checkNodeUpward",value:function(e){var t=e._parent;while(t)this.checkParentNode(t),t=t._parent}},{key:"checkParentNode",value:function(e){var t=e.children.length;if(t){for(var n=!1,a=!1,i=!1,r=0;r<t;r++){var s=e.children[r];if(s.checked?n=!0:a=!0,n&&a||s.indeterminate){i=!0,e.checked=!1,e.indeterminate=!0;break}}i||(e.checked=n,e.indeterminate=!1)}}},{key:"findIndex",value:function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:this.flatData;if(null!==t)for(var n=e instanceof v?e[this.options.keyField]:e,a=t.length,i=0;i<a;i++)if(t[0]instanceof v){if(n===t[i][this.options.keyField])return i}else if(n===t[i])return i;return-1}},{key:"on",value:function(e,t){var n=this;this.listenersMap[e]||(this.listenersMap[e]=[]);var a=[];a=Array.isArray(t)?t:[t],a.forEach((function(t){-1===n.listenersMap[e].indexOf(t)&&n.listenersMap[e].push(t)}))}},{key:"off",value:function(e,t){if(this.listenersMap[e])if(t){var n=this.listenersMap[e].indexOf(t);n>-1&&this.listenersMap[e].splice(n,1)}else this.listenersMap[e]=[]}},{key:"emit",value:function(e){if(this.listenersMap[e]){for(var t=this.listenersMap[e].length,n=arguments.length,a=new Array(n>1?n-1:0),i=1;i<n;i++)a[i-1]=arguments[i];for(var r=0;r<t;r++){var s;(s=this.listenersMap[e])[r].apply(s,a)}}}}]),e}(),O=T,K=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{class:e.wrapperCls},[n("div",{class:e.dropBeforeCls}),n("div",e._g({ref:"nodeBody",class:e.nodeBodyCls},e.dropListeners),[n("div",{class:e.squareCls},[n("i",{directives:[{name:"show",rawName:"v-show",value:!e.data.isLeaf&&!e.data._loading,expression:"!data.isLeaf && !data._loading"}],class:e.expandCls,on:{click:e.handleExpand}}),e.data._loading?n("LoadingIcon",{class:e.loadingIconCls}):e._e()],1),e.showCheckbox?n("div",{class:e.squareCls},[n("div",{class:e.checkboxCls,on:{click:e.handleCheck}})]):e._e(),n("div",e._g({class:e.titleCls,attrs:{draggable:e.draggable&&!e.disableAll&&!e.data.disabled},on:{click:e.handleSelect,dblclick:e.handleDblclick,contextmenu:e.handleRightClick}},e.dragListeners),[e.renderFunction?n(e.renderComponent,{tag:"component"}):[e._v(e._s(e.data[e.titleField]))]],2)]),n("div",{class:e.dropAfterCls})])},$=[],E=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("svg",{attrs:{viewBox:"0 0 50 50"}},[n("circle",{staticClass:"ctree-loading-icon__circle",attrs:{cx:"25",cy:"25",r:"20",fill:"none","stroke-width":"5","stroke-miterlimit":"10"}})])},P=[],R=a["a"].extend({name:"CLoadingIcon"}),L=R,F=n("2877"),j=Object(F["a"])(L,E,P,!1,null,null,null),I=j.exports;function B(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}var M="ctree-tree-node",V=a["a"].extend({name:"CTreeNode",inheritAttrs:!1,components:{LoadingIcon:I},props:{data:Object,titleField:String,keyField:String,render:Function,checkable:Boolean,selectable:Boolean,unselectOnClick:Boolean,disableAll:Boolean,draggable:Boolean,droppable:Boolean},data:function(){return{dragoverBody:!1,dragoverBefore:!1,dragoverAfter:!1}},computed:{wrapperCls:function(){return["".concat(M,"__wrapper"),B({},"".concat(M,"__wrapper_is-leaf"),this.data.isLeaf)]},nodeBodyCls:function(){return["".concat(M,"__node-body"),B({},"".concat(M,"__drop_active"),this.dragoverBody)]},dropBeforeCls:function(){return["".concat(M,"__drop"),B({},"".concat(M,"__drop_active"),this.dragoverBefore)]},dropAfterCls:function(){return["".concat(M,"__drop"),B({},"".concat(M,"__drop_active"),this.dragoverAfter)]},squareCls:function(){return["".concat(M,"__square")]},expandCls:function(){return["".concat(M,"__expand"),B({},"".concat(M,"__expand_active"),this.data.expand)]},loadingIconCls:function(){return["".concat(M,"__loading-icon")]},checkboxCls:function(){var e;return["".concat(M,"__checkbox"),(e={},B(e,"".concat(M,"__checkbox_checked"),this.data.checked),B(e,"".concat(M,"__checkbox_indeterminate"),this.data.indeterminate),B(e,"".concat(M,"__checkbox_disabled"),this.disableAll||this.data.disabled),e)]},titleCls:function(){var e;return["".concat(M,"__title"),(e={},B(e,"".concat(M,"__title_selected"),this.data.selected),B(e,"".concat(M,"__title_disabled"),this.disableAll||this.data.disabled),e)]},fullData:function(){return this.$parent.getNode(this.data[this.keyField])||{}},showCheckbox:function(){return this.checkable},renderFunction:function(){return this.data.render||this.render||null},renderComponent:function(){var e=this;return a["a"].extend({name:"Render",functional:!0,render:function(t){return"function"!==typeof e.renderFunction?t("div"):e.renderFunction(t,e.fullData)}})},dragListeners:function(){var e={};return!this.draggable||this.disableAll||this.data.disabled||(e={dragstart:this.handleDragStart}),e},dropListeners:function(){var e={};return this.droppable&&(e={dragenter:this.handleDragEnter.bind(this),dragover:this.handleDragOver.bind(this),dragleave:this.handleDragLeave.bind(this),drop:this.handleDrop.bind(this)}),e}},methods:{handleExpand:function(){this.data.isLeaf||this.$emit("expand",this.fullData)},handleCheck:function(){this.disableAll||this.data.disabled||!this.checkable||this.$emit("check",this.fullData)},handleSelect:function(){if(this.$emit("click",this.fullData),this.selectable){if(this.disableAll||this.data.disabled)return;if(this.data.selected&&!this.unselectOnClick)return;this.$emit("select",this.fullData)}else this.checkable?this.handleCheck():this.handleExpand()},handleDblclick:function(){this.$emit("node-dblclick",this.fullData)},handleRightClick:function(){this.$emit("node-right-click",this.fullData)},getHoverPart:function(e){var t=this.$refs.nodeBody.getBoundingClientRect(),n=t.height,a=e.clientY-t.top;return a<=.3*n?y.before:a<=.7*n?y.body:y.after},resetDragoverFlags:function(e){var t=arguments.length>1&&void 0!==arguments[1]&&arguments[1];this.dragoverBefore=!1,this.dragoverBody=!1,this.dragoverAfter=!1,t||(e===y.before?this.dragoverBefore=!0:e===y.body?this.dragoverBody=!0:e===y.after&&(this.dragoverAfter=!0))},handleDragStart:function(e){e.dataTransfer&&e.dataTransfer.setData("node",JSON.stringify(this.data)),this.data.expand&&this.handleExpand(),this.$emit("node-dragstart",this.fullData,e)},handleDragEnter:function(e){e.preventDefault();var t=this.getHoverPart(e);this.resetDragoverFlags(t),this.$emit("node-dragenter",this.fullData,e,t)},handleDragOver:function(e){e.preventDefault();var t=this.getHoverPart(e);this.resetDragoverFlags(t),this.$emit("node-dragover",this.fullData,e,t)},handleDragLeave:function(e){var t=this.getHoverPart(e);this.resetDragoverFlags(t,!0),this.$emit("node-dragleave",this.fullData,e,t)},handleDrop:function(e){var t=this.getHoverPart(e);this.resetDragoverFlags(t,!0),this.$emit("node-drop",this.fullData,e,t)}}}),H=V,U=Object(F["a"])(H,K,$,!1,null,null,null),W=U.exports;function G(e){return q(e)||X(e)||Y()}function Y(){throw new TypeError("Invalid attempt to spread non-iterable instance")}function X(e){if(Symbol.iterator in Object(e)||"[object Arguments]"===Object.prototype.toString.call(e))return Array.from(e)}function q(e){if(Array.isArray(e)){for(var t=0,n=new Array(e.length);t<e.length;t++)n[t]=e[t];return n}}function J(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}var z="ctree-tree",Q=["expand","select","unselect","selected-change","check","uncheck","checked-change","set-data"],Z=["node-drop"],ee=function(e,t){if(Array.isArray(e)&&Array.isArray(t)){if(e.length===t.length&&e.every((function(e){return t.some((function(t){return t===e}))})))return!0}else if(e===t)return!0;return!1},te=a["a"].extend({name:"CTree",components:{CTreeNode:W,LoadingIcon:I},props:{value:[String,Number,Array],data:{type:Array,default:function(){return[]}},unloadDataList:{type:Array,default:function(){return[]}},showUnloadCheckedNodes:{type:Boolean,default:!0},emptyText:{type:String,default:"暂无数据"},titleField:{type:String,default:"title"},keyField:{type:String,default:"id"},separator:{type:String,default:","},checkable:{type:Boolean,default:!1},selectable:{type:Boolean,default:!1},filteredNodeCheckable:{type:Boolean,default:!1},cascade:{type:Boolean,default:!0},enableLeafOnly:{type:Boolean,default:!1},disableAll:{type:Boolean,default:!1},defaultExpandAll:{type:Boolean,default:!1},defaultExpandedKeys:{type:Array,default:function(){return[]}},expandedKeys:{type:Array,default:function(){return[]}},draggable:{type:Boolean,default:!1},droppable:{type:Boolean,default:!1},beforeDropMethod:{type:Function,default:function(){return function(){return!0}}},ignoreMode:{type:String,default:f.none},autoLoad:{type:Boolean,default:!0},load:Function,render:Function,filterMethod:Function,expandOnFilter:{type:Boolean,default:!0},unselectOnClick:{type:Boolean,default:!0},loading:{type:Boolean,default:!1},nodeMinHeight:{type:Number,default:30},nodeIndent:{type:Number,default:20},renderNodeAmount:{type:Number,default:100},bufferNodeAmount:{type:Number,default:20},nodeClassName:{type:[String,Object,Array,Function]},usePadding:{type:Boolean,default:!1}},data:function(){var e=Array.isArray(this.value)?this.value.concat():this.value;return{unloadCheckedNodes:[],blockLength:0,blockAreaHeight:0,topSpaceHeight:0,bottomSpaceHeight:0,renderAmount:0,renderAmountCache:0,renderNodes:[],renderStart:0,renderStartCache:0,isRootLoading:!1,valueCache:e,debounceTimer:void 0}},computed:{topSpaceStyles:function(){return{height:"".concat(this.topSpaceHeight,"px")}},bottomSpaceStyles:function(){return{height:"".concat(this.bottomSpaceHeight,"px")}},wrapperCls:function(){return["".concat(z,"__wrapper")]},scrollAreaCls:function(){return["".concat(z,"__scroll-area")]},blockAreaCls:function(){return["".concat(z,"__block-area")]},emptyCls:function(){return["".concat(z,"__empty")]},emptyTextDefaultCls:function(){return["".concat(z,"__empty-text_default")]},loadingCls:function(){return["".concat(z,"__loading")]},loadingWrapperCls:function(){return["".concat(z,"__loading-wrapper")]},loadingIconCls:function(){return["".concat(z,"__loading-icon")]},iframeCls:function(){return["".concat(z,"__iframe")]},treeNodeListeners:function(){var e={};for(var t in this.$listeners)-1===Q.indexOf(t)&&-1===Z.indexOf(t)&&(e[t]=this.$listeners[t]);return e}},methods:{setData:function(e){this.resetSpaceHeights();var t=null,n=null;this.checkable?Array.isArray(this.value)?t=this.value.concat():"string"===typeof this.value&&(t=""===this.value?[]:this.value.split(this.separator)):this.selectable&&!Array.isArray(this.value)&&(n=this.value),this.nonReactive.store.setData(e,n,t),this.updateExpandedKeys()},setChecked:function(e,t){this.nonReactive.store.setChecked(e,t)},setCheckedKeys:function(e,t){this.nonReactive.store.setCheckedKeys(e,t)},checkAll:function(){this.nonReactive.store.checkAll()},clearChecked:function(){this.nonReactive.store.clearChecked()},setSelected:function(e,t){this.nonReactive.store.setSelected(e,t)},clearSelected:function(){this.nonReactive.store.clearSelected()},setExpand:function(e,t){var n=!(arguments.length>2&&void 0!==arguments[2])||arguments[2];this.nonReactive.store.setExpand(e,t,n)},setExpandKeys:function(e,t){this.nonReactive.store.setExpandKeys(e,t)},setExpandAll:function(e){this.nonReactive.store.setExpandAll(e)},getCheckedNodes:function(e){return e=e||this.ignoreMode,this.nonReactive.store.getCheckedNodes(e)},getCheckedKeys:function(e){return e=e||this.ignoreMode,this.nonReactive.store.getCheckedKeys(e)},getIndeterminateNodes:function(){return this.nonReactive.store.getIndeterminateNodes()},getSelectedNode:function(){return this.nonReactive.store.getSelectedNode()},getSelectedKey:function(){return this.nonReactive.store.getSelectedKey()},getExpandNodes:function(){return this.nonReactive.store.getExpandNodes()},getExpandKeys:function(){return this.nonReactive.store.getExpandKeys()},getCurrentVisibleNodes:function(){return this.nonReactive.store.flatData.filter((function(e){return e._filterVisible}))},getNode:function(e){return this.nonReactive.store.getNode(e)},getTreeData:function(){return this.nonReactive.store.data},getFlatData:function(){return this.nonReactive.store.flatData},getNodesCount:function(){return this.nonReactive.store.flatData.length},insertBefore:function(e,t){return this.nonReactive.store.insertBefore(e,t)},insertAfter:function(e,t){return this.nonReactive.store.insertAfter(e,t)},append:function(e,t){return this.nonReactive.store.append(e,t)},prepend:function(e,t){return this.nonReactive.store.prepend(e,t)},remove:function(e){return this.nonReactive.store.remove(e)},filter:function(e,t){var n=this,a=function(e,t){var a=t[n.titleField];return!(null==a||!a.toString)&&a.toString().toLowerCase().indexOf(e.toLowerCase())>-1};t=t||this.filterMethod||a,this.nonReactive.store.filter(e,t)},showCheckedNodes:function(e){var t=this;if(this.checkable){e=null==e?this.showUnloadCheckedNodes:e;var n=this.nonReactive.store.getCheckedNodes();if(this.nonReactive.store.filter("",(function(e,t){return t.checked})),e){var a=this.nonReactive.store.getUnloadCheckedKeys();if(a.length){var i,r=a.map((function(e){var a,i=t.unloadDataList.concat(n),r=e;return i.some((function(n){return n[t.keyField]===e&&null!=n[t.titleField]&&(r=n[t.titleField],!0)})),new v((a={},J(a,t.keyField,e),J(a,t.titleField,r),J(a,"checked",!0),J(a,"isLeaf",!0),a),null,t.keyField,!!t.load)}));this.unloadCheckedNodes=r,(i=this.nonReactive.blockNodes).push.apply(i,G(r)),this.updateBlockData(),this.updateRender()}}}},loadRootNodes:function(){var e=this;return this.isRootLoading=!0,new Promise((function(t,n){e.load(null,t,n)})).then((function(t){Array.isArray(t)&&e.setData(t)})).catch((function(){})).then((function(){e.isRootLoading=!1}))},scrollTo:function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:b.top,n=this.nonReactive.store.mapData[e];if(n&&n.visible){for(var a=-1,i=0;i<this.blockLength;i++)if(this.nonReactive.blockNodes[i][this.keyField]===e){a=i;break}if(-1!==a){var r=a*this.nodeMinHeight;if(t===b.center){var s=this.$refs.scrollArea.clientHeight;r-=(s-this.nodeMinHeight)/2}else if(t===b.bottom){var o=this.$refs.scrollArea.clientHeight;r-=o-this.nodeMinHeight}else"number"===typeof t&&(r-=t);this.$refs.scrollArea.scrollTop=r}}},updateExpandedKeys:function(){this.expandedKeys.length&&(this.nonReactive.store.setExpandAll(!1,!1),this.nonReactive.store.setExpandKeys(this.expandedKeys,!0))},updateUnloadStatus:function(){var e=this;if(this.unloadCheckedNodes.length){var t=this.nonReactive.store.getUnloadCheckedKeys();this.unloadCheckedNodes.forEach((function(n){n.checked=t.indexOf(n[e.keyField])>-1}))}},handleNodeCheck:function(e){(this.cascade||!this.enableLeafOnly||e.isLeaf)&&this.nonReactive.store.setChecked(e[this.keyField],!e.indeterminate&&!e.checked,!0,!0,!0)},handleNodeSelect:function(e){this.enableLeafOnly&&!e.isLeaf||this.nonReactive.store.setSelected(e[this.keyField],!e.selected)},handleNodeExpand:function(e){this.nonReactive.store.setExpand(e[this.keyField],!e.expand)},handleNodeDrop:function(e,t,n){if(this.droppable&&t.dataTransfer)try{var a=JSON.parse(t.dataTransfer.getData("node")),i=a[this.keyField],r=e[this.keyField],s=this.beforeDropMethod(i,r,n);if(s){if(i===r)return;n===y.before?this.nonReactive.store.insertBefore(i,r):n===y.body||!e.isLeaf&&e.expand?this.nonReactive.store.prepend(i,r):n===y.after&&this.nonReactive.store.insertAfter(i,r),this.$emit("node-drop",e,t,n,this.getNode(i))}}catch(o){throw new Error(o)}},emitCheckableInput:function(e,t){if(this.checkable){var n=t;Array.isArray(this.value)||(n=n.join(this.separator)),Array.isArray(n)?this.valueCache=n.concat():this.valueCache=n,this.$emit("input",n)}},emitSelectableInput:function(e,t){if(this.selectable&&!this.checkable){var n=t||"";this.valueCache=n,this.$emit("input",n)}},attachStoreEvents:function(){for(var e in this.$listeners)if(Q.indexOf(e)>-1){var t=e;this.nonReactive.store.on(t,this.$listeners[e])}},resetSpaceHeights:function(){this.topSpaceHeight=0,this.bottomSpaceHeight=0,this.$refs.scrollArea.scrollTop=0},updateBlockNodes:function(){this.nonReactive.blockNodes=this.nonReactive.store.flatData.filter((function(e){return e.visible})),this.updateBlockData(),this.updateRender()},updateBlockData:function(){this.blockLength=this.nonReactive.blockNodes.length,this.blockAreaHeight=this.nodeMinHeight*this.blockLength},updateRender:function(){this.updateRenderAmount(),this.updateRenderNodes()},updateRenderAmount:function(){var e=this.$refs.scrollArea.clientHeight;this.renderAmount=Math.max(this.renderNodeAmount,Math.ceil(e/this.nodeMinHeight)+this.bufferNodeAmount)},updateRenderNodes:function(){var e=arguments.length>0&&void 0!==arguments[0]&&arguments[0];if(this.blockLength>this.renderAmount){var t=this.$refs.scrollArea.scrollTop,n=Math.floor(t/this.nodeMinHeight);this.renderStart=Math.floor(n/this.bufferNodeAmount)*this.bufferNodeAmount}else this.renderStart=0;e&&this.renderAmountCache===this.renderAmount&&this.renderStartCache===this.renderStart||(this.renderNodes=this.nonReactive.blockNodes.slice(this.renderStart,this.renderStart+this.renderAmount).map((function(e){return Object.assign({},e,{_parent:null,children:[]})})),this.topSpaceHeight=this.renderStart*this.nodeMinHeight,this.bottomSpaceHeight=this.blockAreaHeight-(this.topSpaceHeight+this.renderNodes.length*this.nodeMinHeight))},handleTreeScroll:function(){this.debounceTimer&&window.cancelAnimationFrame(this.debounceTimer),this.renderAmountCache=this.renderAmount,this.renderStartCache=this.renderStart,this.debounceTimer=window.requestAnimationFrame(this.updateRenderNodes.bind(this,!0))}},created:function(){var e=this,t=this.keyField,n=this.ignoreMode,a=this.filteredNodeCheckable,i=this.cascade,r=this.defaultExpandAll,s=this.load,o=this.expandOnFilter;this.nonReactive={store:new O({keyField:t,ignoreMode:n,filteredNodeCheckable:a,cascade:i,defaultExpandAll:r,load:s,expandOnFilter:o}),blockNodes:[]},this.nonReactive.store.on("visible-data-change",this.updateBlockNodes),this.nonReactive.store.on("render-data-change",this.updateRender),this.nonReactive.store.on("checked-change",(function(t,n){e.emitCheckableInput(t,n),e.updateUnloadStatus()})),this.nonReactive.store.on("selected-change",this.emitSelectableInput),this.attachStoreEvents()},mounted:function(){this.data.length?(this.setData(this.data),this.defaultExpandedKeys.length&&this.nonReactive.store.setExpandKeys(this.defaultExpandedKeys,!0)):"function"===typeof this.load&&this.autoLoad&&this.loadRootNodes();var e=this.$refs.iframe;e.contentWindow&&e.contentWindow.addEventListener("resize",this.updateRender)},beforeDestroy:function(){var e=this.$refs.iframe;e.contentWindow&&e.contentWindow.removeEventListener("resize",this.updateRender)},watch:{value:function(e){if(this.checkable){if(ee(e,this.valueCache))return;var t=[];Array.isArray(e)?t=e.concat():"string"===typeof e&&(t=""===e?[]:e.split(this.separator)),this.nonReactive.store.clearChecked(!1,!1),this.nonReactive.store.setCheckedKeys(t,!0)}else if(this.selectable){if(e===this.valueCache)return;var n=this.nonReactive.store.getSelectedKey();""!==e&&null!=e?this.nonReactive.store.setSelected(e,!0):""!==e&&null!=e||!n||this.nonReactive.store.setSelected(n,!1)}},data:{deep:!0,handler:function(e){this.setData(e)}},expandedKeys:function(){this.updateExpandedKeys()},$listeners:function(){this.attachStoreEvents()}}}),ne=te,ae=Object(F["a"])(ne,l,c,!1,null,null,null),ie=ae.exports,re=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{class:e.wrapperCls},[n("div",{class:e.searchCls},[e.showCheckAll&&e.checkable?n("div",{class:e.checkAllWrapperCls},[n("div",{class:e.checkboxCls,on:{click:e.handleCheckAll}})]):e._e(),n("div",{class:e.inputWrapperCls},[e._t("search-input",[n("input",{directives:[{name:"model",rawName:"v-model",value:e.keyword,expression:"keyword"}],class:e.inputCls,attrs:{type:"text",placeholder:e.searchPlaceholder,disabled:e.searchDisabled},domProps:{value:e.keyword},on:{input:[function(t){t.target.composing||(e.keyword=t.target.value)},e.handleSearch]}})])],2),n("div",{class:e.actionWrapperCls},[e.showCheckedButton&&e.checkable?n("span",{class:e.checkedButtonCls,on:{click:e.handleShowChecked}},[e._v("\n        "+e._s(e.checkedButtonText)+"\n      ")]):e._e(),e._t("actions")],2)]),n("div",{class:e.treeWrapperCls},[n("CTree",e._g(e._b({ref:"tree",attrs:{value:e.value},on:{input:e.updateCheckedCount,"set-data":e.handleSetData,"checked-change":e.updateCheckAllStatus},scopedSlots:e._u([e._l(e.$scopedSlots,(function(t,n){return{key:n,fn:function(t){return[e._t(n,null,null,t)]}}}))],null,!0)},"CTree",e.$attrs,!1),e.$listeners))],1),e.showFooter&&e.checkable?n("div",{class:e.footerCls},[e._t("footer",[n("span",{staticStyle:{float:"right"}},[e._v("已选 "+e._s(e.checkedCount)+" 个")])])],2):e._e()])},se=[];function oe(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);t&&(a=a.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,a)}return n}function le(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?oe(n,!0).forEach((function(t){ce(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):oe(n).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}function ce(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}var de="ctree-tree-search",he="ctree-tree-node",ue={},fe=ie.options.methods,pe=function(e){var t=e;if(k.indexOf(t)>-1){var n=ue;n[t]=function(){for(var e=arguments.length,n=new Array(e),a=0;a<e;a++)n[a]=arguments[a];return fe[t].apply(this.$refs.tree,n)}}};for(var ve in fe)pe(ve);var ge=a["a"].extend({name:"CTreeSearch",inheritAttrs:!1,components:{CTree:ie},props:{value:{},searchPlaceholder:{type:String,default:"搜索关键字"},showCheckAll:{type:Boolean,default:!0},showCheckedButton:{type:Boolean,default:!0},checkedButtonText:{type:String,default:"已选"},showFooter:{type:Boolean,default:!0},searchMethod:Function,searchLength:{type:Number,default:1},searchDisabled:{type:Boolean,default:!1},searchRemote:{type:Boolean,default:!1},searchDebounceTime:{type:Number,default:300}},data:function(){return{checkAllStatus:{checked:!1,indeterminate:!1,disabled:!1},isShowingChecked:!1,keyword:"",debounceTimer:void 0,checkedCount:0}},computed:{wrapperCls:function(){return["".concat(de,"__wrapper")]},searchCls:function(){return["".concat(de,"__search")]},checkAllWrapperCls:function(){return["".concat(de,"__check-all-wrapper")]},checkboxCls:function(){var e;return["".concat(de,"__check-all"),"".concat(he,"__checkbox"),(e={},ce(e,"".concat(he,"__checkbox_checked"),this.checkAllStatus.checked),ce(e,"".concat(he,"__checkbox_indeterminate"),this.checkAllStatus.indeterminate),ce(e,"".concat(he,"__checkbox_disabled"),this.searchDisabled||this.checkAllStatus.disabled),e)]},inputWrapperCls:function(){return["".concat(de,"__input-wrapper")]},inputCls:function(){return["".concat(de,"__input"),ce({},"".concat(de,"__input_disabled"),this.searchDisabled)]},actionWrapperCls:function(){return["".concat(de,"__action-wrapper")]},checkedButtonCls:function(){return["".concat(de,"__checked-button"),ce({},"".concat(de,"__checked-button_active"),this.isShowingChecked)]},treeWrapperCls:function(){return["".concat(de,"__tree-wrapper")]},footerCls:function(){return["".concat(de,"__footer")]},checkable:function(){return"checkable"in this.$attrs&&!1!==this.$attrs.checkable}},methods:le({},ue,{clearKeyword:function(){this.keyword=""},getKeyword:function(){return this.keyword},search:function(e){var t=this,n=e;return"string"!==typeof e&&(n=this.keyword),new Promise((function(e,a){clearTimeout(t.debounceTimer),t.debounceTimer=setTimeout((function(){if(!(n.length>0&&n.length<t.searchLength))if(t.isShowingChecked=!1,t.$emit("search",n),"function"===typeof t.searchMethod){var a=t.searchMethod(n);Promise.resolve(a).then((function(){t.updateCheckAllStatus(),e()}))}else t.searchRemote?t.$refs.tree.loadRootNodes().then((function(){t.updateCheckAllStatus(),e()})):(t.$refs.tree.filter(n),t.updateCheckAllStatus(),e())}),t.searchDebounceTime)}))},handleCheckAll:function(){var e=this;if(!this.searchDisabled&&!this.checkAllStatus.disabled){var t=this.$refs.tree.getCurrentVisibleNodes().map((function(t){return t[e.$refs.tree.keyField]}));this.checkAllStatus.checked||this.checkAllStatus.indeterminate?this.$refs.tree.setCheckedKeys(t,!1):this.$refs.tree.setCheckedKeys(t,!0),this.updateCheckAllStatus()}},handleSearch:function(){this.search()},handleShowChecked:function(){var e=this,t=function(){e.isShowingChecked=!e.isShowingChecked,e.isShowingChecked?e.$refs.tree.showCheckedNodes():e.$refs.tree.filter(e.keyword,(function(){return!0})),e.updateCheckAllStatus()};this.keyword?(this.clearKeyword(),this.search().then((function(){t()}))):t()},handleSetData:function(){this.updateCheckedCount(),this.updateCheckAllStatus()},updateCheckAllStatus:function(){for(var e=this.$refs.tree.getCurrentVisibleNodes(),t=e.length,n=!1,a=!1,i=!1,r=0;r<t;r++){var s=e[r];if(s.checked?n=!0:a=!0,n&&a||s.indeterminate){i=!0,this.checkAllStatus.checked=!1,this.checkAllStatus.indeterminate=!0;break}}i||(this.checkAllStatus.checked=n,this.checkAllStatus.indeterminate=!1)},updateCheckedCount:function(){this.checkedCount=this.$refs.tree.getCheckedKeys().length}}),mounted:function(){this.checkable&&!this.checkedCount&&this.handleSetData()}}),be=ge,ye=Object(F["a"])(be,re,se,!1,null,null,null),ke=ye.exports,me=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{class:e.wrapperCls},[n("div",{ref:"reference",class:e.referenceCls,on:{click:e.handleRefClick}},[e._t("default",[n("div",{class:e.displayInputCls},[n("span",{class:e.displayInputTextCls},[e._t("display",[e._v("\n            "+e._s(e.displayValue)+"\n          ")],null,e.slotProps)],2),e.dropDisabled?e._e():[n("i",{class:e.dropIconCls}),e.clearable&&e.showClearIcon?e._t("clear",[n("i",{class:e.clearIconCls,on:{click:function(t){return t.stopPropagation(),e.handleClear(t)}}})]):e._e()]],2)],null,e.slotProps)],2),n("transition",{attrs:{name:"ctree-dropdown"}},[n("div",{directives:[{name:"show",rawName:"v-show",value:e.dropdownVisible,expression:"dropdownVisible"}],ref:"dropdown",class:e.dropdownCls,style:{height:e.dropHeight+"px"}},[n("CTreeSearch",e._g(e._b({ref:"treeSearch",attrs:{value:e.value},on:{"set-data":e.handleSetData,"checked-change":e.handleCheckedChange,"selected-change":e.handleSelectedChange},scopedSlots:e._u([e._l(e.$scopedSlots,(function(t,n){return{key:n,fn:function(t){return[e._t(n,null,null,t)]}}}))],null,!0)},"CTreeSearch",e.$attrs,!1),e.$listeners))],1)])],1)},_e=[];function Ce(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);t&&(a=a.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,a)}return n}function Se(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?Ce(n,!0).forEach((function(t){Ne(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):Ce(n).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}function we(e){return Ae(e)||De(e)||xe()}function xe(){throw new TypeError("Invalid attempt to spread non-iterable instance")}function De(e){if(Symbol.iterator in Object(e)||"[object Arguments]"===Object.prototype.toString.call(e))return Array.from(e)}function Ae(e){if(Array.isArray(e)){for(var t=0,n=new Array(e.length);t<e.length;t++)n[t]=e[t];return n}}function Ne(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}var Te="ctree-tree-drop",Oe="ctree-tree-search",Ke={},$e=k.concat(m),Ee=ke.options.methods,Pe=function(e){var t=e;if($e.indexOf(t)>-1){var n=Ke;n[t]=function(){for(var e=arguments.length,n=new Array(e),a=0;a<e;a++)n[a]=arguments[a];return Ee[t].apply(this.$refs.treeSearch,n)}}};for(var Re in Ee)Pe(Re);var Le=a["a"].extend({name:"CTreeDrop",inheritAttrs:!1,components:{CTreeSearch:ke},props:{value:{},dropHeight:{type:Number,default:300},dropPlaceholder:{type:String},dropDisabled:{type:Boolean,default:!1},clearable:{type:Boolean,default:!1},placement:{type:String,default:g["bottom-start"]},transfer:{type:Boolean,default:!1},dropdownClassName:{type:[String,Array]},dropdownMinWidth:{type:Number},dropdownWidthFixed:{type:Boolean,default:!1}},data:function(){return{dropdownVisible:!1,checkedCount:0,selectedTitle:"",slotProps:{checkedNodes:[],checkedKeys:[],selectedNode:null,selectedKey:null}}},computed:{wrapperCls:function(){return["".concat(Te,"__wrapper")]},referenceCls:function(){return["".concat(Te,"__reference")]},displayInputCls:function(){var e;return["".concat(Oe,"__input"),"".concat(Te,"__display-input"),(e={},Ne(e,"".concat(Te,"__display-input_focus"),this.dropdownVisible),Ne(e,"".concat(Oe,"__input_disabled"),this.dropDisabled),e)]},displayInputTextCls:function(){var e=!1;return"string"===typeof this.dropPlaceholder&&(this.checkable?e=0===this.checkedCount:this.selectable&&(e=""===this.selectedTitle)),["".concat(Te,"__display-input-text"),Ne({},"".concat(Te,"__display-input-placeholder"),e)]},dropIconCls:function(){return["".concat(Te,"__display-icon-drop"),Ne({},"".concat(Te,"__display-icon-drop_active"),this.dropdownVisible)]},clearIconCls:function(){return["".concat(Te,"__display-icon-clear")]},dropdownCls:function(){var e=Array.isArray(this.dropdownClassName)?this.dropdownClassName:[this.dropdownClassName];return["".concat(Te,"__dropdown")].concat(we(e))},checkable:function(){return"checkable"in this.$attrs&&!1!==this.$attrs.checkable},selectable:function(){return"selectable"in this.$attrs&&!1!==this.$attrs.selectable},displayValue:function(){return this.checkable?0===this.checkedCount&&"string"===typeof this.dropPlaceholder?this.dropPlaceholder:"已选 ".concat(this.checkedCount," 个"):this.selectable?""===this.selectedTitle&&"string"===typeof this.dropPlaceholder?this.dropPlaceholder:this.selectedTitle:this.dropPlaceholder||""},showClearIcon:function(){return this.checkable?0!==this.checkedCount:!!this.selectable&&""!==this.selectedTitle}},methods:Se({},Ke,{locateDropdown:function(){var e=this.$refs.reference.getBoundingClientRect(),t=e.width,n=e.height,a="".concat("number"===typeof this.dropdownMinWidth?this.dropdownMinWidth:t,"px");this.$refs.dropdown.style.minWidth=a,this.$refs.dropdown.style.width=this.dropdownWidthFixed?a:"auto";var i=this.$refs.dropdown.getBoundingClientRect(),r=window.getComputedStyle(this.$refs.dropdown),s=parseFloat(r.marginLeft)+parseFloat(r.marginRight),o=parseFloat(r.marginTop)+parseFloat(r.marginBottom),l=i.width+s,c=i.height/.8+o,d=0,h=0;switch(this.transfer&&(d=-999,h=-999),this.placement){case"bottom-start":this.transfer?(d=window.pageYOffset+e.bottom,h=window.pageXOffset+e.left):d=n;break;case"bottom-end":this.transfer?(d=window.pageYOffset+e.bottom,h=window.pageXOffset+e.right-l):(d=n,h=t-l);break;case"bottom":this.transfer?(d=window.pageYOffset+e.bottom,h=window.pageXOffset+e.left+(t-l)/2):(d=n,h=(t-l)/2);break;case"top-start":this.transfer?(d=window.pageYOffset+e.top-c,h=window.pageXOffset+e.left):d=-c;break;case"top-end":this.transfer?(d=window.pageYOffset+e.top-c,h=window.pageXOffset+e.right-l):(d=-c,h=t-l);break;case"top":this.transfer?(d=window.pageYOffset+e.top-c,h=window.pageXOffset+e.left+(t-l)/2):(d=-c,h=(t-l)/2);break}this.$refs.dropdown.style.top="".concat(d,"px"),this.$refs.dropdown.style.left="".concat(h,"px")},handleRefClick:function(){this.dropDisabled||(this.dropdownVisible=!this.dropdownVisible)},handleDocumentClick:function(e){this.$refs&&(this.$refs.reference.contains(e.target)||this.$refs.dropdown.contains(e.target)||(this.dropdownVisible=!1))},handleClear:function(){this.$emit("clear"),this.checkable?this.clearChecked():this.selectable&&this.clearSelected()},handleCheckedChange:function(e,t){this.slotProps.checkedNodes=e,this.slotProps.checkedKeys=t,this.checkedCount=t.length},handleSelectedChange:function(e,t){if(this.slotProps.selectedNode=e,this.slotProps.selectedKey=t,e){var n=this.$refs.treeSearch.$refs.tree.titleField;this.selectedTitle=e[n]}else this.selectedTitle=t||"";this.dropdownVisible=!1},handleSetData:function(){if(this.slotProps.checkedNodes=this.getCheckedNodes(),this.slotProps.checkedKeys=this.getCheckedKeys(),this.slotProps.selectedNode=this.getSelectedNode(),this.slotProps.selectedKey=this.getSelectedKey(),this.checkable&&(this.checkedCount=this.slotProps.checkedKeys.length),this.selectable&&null!=this.value){var e=this.getNode(this.value);if(e){var t=this.$refs.treeSearch.$refs.tree.titleField;this.selectedTitle=e[t]}else this.selectedTitle=this.value}}}),mounted:function(){document.addEventListener("click",this.handleDocumentClick),this.transfer&&document.body.appendChild(this.$refs.dropdown),this.handleSetData()},beforeDestroy:function(){document.removeEventListener("click",this.handleDocumentClick),this.$refs.dropdown.remove()},watch:{dropdownVisible:function(e){var t=this;this.$emit("dropdown-visible-change",e),e?this.$nextTick((function(){t.locateDropdown()})):this.$refs.treeSearch.getKeyword()&&(this.$refs.treeSearch.clearKeyword(),this.$refs.treeSearch.search())}}}),Fe=Le,je=Object(F["a"])(Fe,me,_e,!1,null,null,null),Ie=je.exports,Be=(n("a4b1"),ie),Me=function(){return Math.random().toString(36).substring(2)},Ve=function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},t=e.treeDepth,n=void 0===t?5:t,a=e.nodesPerLevel,i=e.sameIdTitle,r=void 0!==i&&i,s=e.inOrder,o=void 0!==s&&s,l=e.forceString,c=void 0!==l&&l,d=[],h=0,u=0,f=function e(t){var i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:0;if(!(i>=n))for(var s=a||Math.floor(100*Math.random()),l=0;l<s;l++){var d=o?u++:Me();c&&(d=d.toString());var f=r?d:Me(),p={title:d,id:f,children:[]};t.push(p),h++,e(p.children,i+1)}};return f(d),{data:d,total:h}},He=function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};return Ve(Object.assign({treeDepth:3,nodesPerLevel:5,sameIdTitle:!0},e))},Ue=function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:2;return Ve({treeDepth:1,nodesPerLevel:e,inOrder:!0})},We={name:"Feature",components:{CTree:Be},data:function(){var e=He().data;e[0].selected=!0;var t=He().data;return t[0].expand=!0,t[1].children[0].disabled=!0,{basicUsage:He().data,orderData:He({inOrder:!0}).data,selectable:e,selectableValue:"",showCheckable:!0,checkable:t,checkableValue:[t[0].id],checkableIgnoreMode:"none",checkableCascade:!0,both:He().data,bothValue:[],remoteShow:!1,remoteLoad:function(e,t,n){setTimeout((function(){t(Ue(e?2:5).data)}),1e3)}}}},Ge=We,Ye=(n("826c"),Object(F["a"])(Ge,s,o,!1,null,"01d42e0f",null)),Xe=Ye.exports,qe=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"container"},[n("div",{staticClass:"tree"},[n("CTree",{ref:"tree",attrs:{data:e.treeData,checkable:"",selectable:""}})],1),n("div",{staticClass:"control"},[e._m(0),n("div",{staticClass:"controls"},[n("label",[e._v("节点深度：")]),n("input",{directives:[{name:"model",rawName:"v-model",value:e.params.treeDepth,expression:"params.treeDepth"}],attrs:{type:"number"},domProps:{value:e.params.treeDepth},on:{input:function(t){t.target.composing||e.$set(e.params,"treeDepth",t.target.value)}}})]),n("div",{staticClass:"controls"},[n("label",[e._v("每层节点个数：")]),n("input",{directives:[{name:"model",rawName:"v-model",value:e.params.nodesPerLevel,expression:"params.nodesPerLevel"}],attrs:{type:"number"},domProps:{value:e.params.nodesPerLevel},on:{input:function(t){t.target.composing||e.$set(e.params,"nodesPerLevel",t.target.value)}}})]),n("div",{staticClass:"controls"},[n("label",[e._v("总节点个数：")]),e._v("\n      "+e._s(e.nodeTotal)+"\n    ")]),n("div",{staticClass:"controls"},[n("div",{staticClass:"actions"},[n("button",{on:{click:e.handleGenerate}},[e._v("生成树节点数据")]),n("button",{on:{click:function(t){return e.handleGenerateTotal("1w")}}},[e._v("1w 节点")]),n("button",{on:{click:function(t){return e.handleGenerateTotal("10w")}}},[e._v("10w 节点")]),n("button",{on:{click:function(t){return e.handleGenerateTotal("20w")}}},[e._v("20w 节点")]),n("button",{on:{click:function(t){return e.handleGenerateTotal("30w")}}},[e._v("30w 节点")])]),n("div",{staticClass:"actions"},[n("button",{on:{click:e.handleSetData}},[e._v("设置树数据")])]),n("div",{staticClass:"actions"},[e.isTreeSet?n("span",{staticStyle:{color:"green"}},[e._v("树数据已设置")]):n("span",{staticStyle:{color:"red"}},[e._v("树数据已生成")])])]),n("div",{staticClass:"controls"},[n("label",[e._v("滚动节点id：")]),n("input",{directives:[{name:"model",rawName:"v-model",value:e.scrollKey,expression:"scrollKey"}],attrs:{type:"text"},domProps:{value:e.scrollKey},on:{input:function(t){t.target.composing||(e.scrollKey=t.target.value)}}})]),n("div",{staticClass:"controls"},[n("label",[e._v("滚动垂直位置：")]),n("select",{directives:[{name:"model",rawName:"v-model",value:e.scrollVerticalOption,expression:"scrollVerticalOption"}],on:{change:function(t){var n=Array.prototype.filter.call(t.target.options,(function(e){return e.selected})).map((function(e){var t="_value"in e?e._value:e.value;return t}));e.scrollVerticalOption=t.target.multiple?n:n[0]}}},[n("option",{attrs:{value:"top"}},[e._v("top")]),n("option",{attrs:{value:"center"}},[e._v("center")]),n("option",{attrs:{value:"bottom"}},[e._v("bottom")])])]),n("div",{staticClass:"controls"},[n("label",[e._v("滚动垂直偏移值：")]),n("input",{directives:[{name:"model",rawName:"v-model.number",value:e.scrollValue,expression:"scrollValue",modifiers:{number:!0}}],attrs:{type:"text"},domProps:{value:e.scrollValue},on:{input:function(t){t.target.composing||(e.scrollValue=e._n(t.target.value))},blur:function(t){return e.$forceUpdate()}}})]),n("div",{staticClass:"controls"},[n("div",{staticClass:"actions"},[n("button",{on:{click:e.handleScrollToNode}},[e._v("滚动到此节点")])])])])])},Je=[function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"desc-block"},[n("p",[e._v("说明：在 Chrome 下表现良好")]),n("p",[e._v("在火狐浏览器下，因为其异步滚动策略 (scroll-linked) ，在快速滚动时会导致内容空白。")]),n("p",[e._v("另：浏览器元素/文档是有最大高度限制的，过多数据会导致显示不正常(Chrome 下 100 万条可以正常显示，但是在火狐或 Edge 则不行)")])])}],ze={"1w":{treeDepth:2,nodesPerLevel:100},"10w":{treeDepth:2,nodesPerLevel:320},"20w":{treeDepth:2,nodesPerLevel:450},"30w":{treeDepth:2,nodesPerLevel:550}},Qe=[],Ze={name:"Performance",components:{CTree:Be},data:function(){return{cache:[],isTreeSet:!1,params:{treeDepth:2,nodesPerLevel:5},nodeTotal:0,treeData:[],scrollKey:"",scrollVerticalOption:"top",scrollValue:0}},methods:{handleGenerate:function(){var e=Ve(Object.assign({},this.params,{inOrder:!0,sameIdTitle:!0,forceString:!0}));Qe=e.data,this.nodeTotal=e.total,this.isTreeSet=!1},handleGenerateTotal:function(e){Object.assign(this.params,ze[e]),this.handleGenerate()},handleSetData:function(){this.$refs.tree.setData(Qe.concat()),this.isTreeSet=!0},handleScrollToNode:function(){this.$refs.tree.scrollTo(this.scrollKey,this.scrollValue||this.scrollVerticalOption)}},created:function(){this.handleGenerate()}},et=Ze,tt=(n("2bc9"),Object(F["a"])(et,qe,Je,!1,null,"f597b4c8",null)),nt=tt.exports,at=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",[n("CTree",{attrs:{data:e.basicUsage,loading:e.loading}}),n("button",{on:{click:e.handleToggle}},[e._v("Toggle Loading")])],1)},it=[],rt=function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};return Ve(Object.assign({treeDepth:3,nodesPerLevel:5,sameIdTitle:!0},e))},st={name:"Loading",components:{CTree:Be},data:function(){return{basicUsage:rt().data,loading:!1}},methods:{handleToggle:function(){this.loading=!this.loading}}},ot=st,lt=Object(F["a"])(ot,at,it,!1,null,null,null),ct=lt.exports,dt=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("CTreeSearch",{attrs:{data:e.data,checkable:"",expandOnFilter:!1},model:{value:e.value,callback:function(t){e.value=t},expression:"value"}},[n("span",{attrs:{slot:"empty"},slot:"empty"},[e._v("slot 传进来的暂无数据")]),n("template",{slot:"actions"},[n("span",{staticStyle:{"margin-left":"5px"}},[e._v("折叠")]),n("span",{staticStyle:{"margin-left":"5px"}},[e._v("展开")]),n("span",{staticStyle:{"margin-left":"5px"}},[e._v("slot 按钮")])])],2)},ht=[],ut=function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};return Ve(Object.assign({treeDepth:3,nodesPerLevel:5,sameIdTitle:!0,inOrder:!0,forceString:!0},e))},ft={name:"Search",components:{CTreeSearch:ke},data:function(){return{data:ut().data,value:"2"}}},pt=ft,vt=Object(F["a"])(pt,dt,ht,!1,null,null,null),gt=vt.exports,bt=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticStyle:{height:"100%"}},[n("CTreeSearch",{attrs:{load:e.load,"search-remote":"",checkable:""},on:{search:e.handleSearch},model:{value:e.value,callback:function(t){e.value=t},expression:"value"}},[n("span",{attrs:{slot:"empty"},slot:"empty"},[e._v("slot 传进来的暂无数据")])]),e._v("\n  "+e._s(e.value)+"\n")],1)},yt=[],kt=function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};return Ve(Object.assign({treeDepth:3,nodesPerLevel:5,sameIdTitle:!0,inOrder:!0,forceString:!0},e))},mt={name:"Search",components:{CTreeSearch:ke},data:function(){var e=this;return{times:[3,2,5],index:0,load:function(t,n){setTimeout((function(){var t=kt({nodesPerLevel:e.times[e.index]}).data;n(t)}),10)},value:["93","124"]}},methods:{handleSearch:function(){this.index++,this.index>=this.times.length&&(this.index=0)}}},_t=mt,Ct=Object(F["a"])(_t,bt,yt,!1,null,null,null),St=(Ct.exports,function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticStyle:{height:"100%"}},[n("CTreeSearch",{attrs:{data:e.data,checkable:"","search-method":e.searchMethod},on:{search:e.handleSearch},model:{value:e.value,callback:function(t){e.value=t},expression:"value"}},[n("span",{attrs:{slot:"empty"},slot:"empty"},[e._v("slot 传进来的暂无数据")])]),e._v("\n  "+e._s(e.value)+"\n")],1)}),wt=[],xt=function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};return Ve(Object.assign({treeDepth:3,nodesPerLevel:5,sameIdTitle:!0,inOrder:!0,forceString:!0},e))},Dt={name:"Search",components:{CTreeSearch:ke},data:function(){return{data:[],times:[3,2,5],index:0,value:["93","124"]}},methods:{searchMethod:function(e){var t=this;return new Promise((function(e){setTimeout((function(){t.data=xt({nodesPerLevel:t.times[t.index]}).data,e()}),10)}))},handleSearch:function(){this.index++,this.index>=this.times.length&&(this.index=0)}}},At=Dt,Nt=Object(F["a"])(At,St,wt,!1,null,null,null),Tt=(Nt.exports,function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",[n("div",{staticStyle:{width:"200px"}},[n("p",[e._v("自定义展示 slot ：")]),n("CTreeDrop",{attrs:{data:e.data,checkable:"",clearable:"","drop-placeholder":"请选择",placement:e.placement,"dropdown-min-width":300,"dropdown-width-fixed":""},on:{"checked-change":e.handleCheckedChange},scopedSlots:e._u([{key:"display",fn:function(t){return[n("div",{staticStyle:{width:"170px","text-overflow":"ellipsis",overflow:"hidden"}},[e._v(e._s(t.checkedNodes.map((function(e){return e.title})).join(",")))])]}}]),model:{value:e.value,callback:function(t){e.value=t},expression:"value"}},[n("span",{attrs:{slot:"empty"},slot:"empty"},[e._v("slot 传进来的暂无数据")])]),e._v("\n    "+e._s(e.value)+"\n  ")],1),n("div",{staticStyle:{width:"200px"}},[n("p",[e._v("默认：")]),n("CTreeDrop",{attrs:{data:e.data,checkable:"",clearable:"","drop-placeholder":"请选择",placement:e.placement,"dropdown-min-width":300,"dropdown-width-fixed":""},on:{"checked-change":e.handleCheckedChange},model:{value:e.value,callback:function(t){e.value=t},expression:"value"}},[n("span",{attrs:{slot:"empty"},slot:"empty"},[e._v("slot 传进来的暂无数据")])]),e._v("\n    "+e._s(e.value)+"\n  ")],1)])}),Ot=[],Kt=function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};return Ve(Object.assign({treeDepth:3,nodesPerLevel:5,sameIdTitle:!0,inOrder:!0,forceString:!0},e))},$t={name:"Drop",components:{CTreeDrop:Ie},data:function(){var e=Kt().data;return{data:e,value:"2",placement:"bottom-start"}},methods:{handleCheckedChange:function(){console.log("checked-change")}}},Et=$t,Pt=Object(F["a"])(Et,Tt,Ot,!1,null,null,null),Rt=Pt.exports,Lt=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticStyle:{width:"200px"}},[n("CTreeDrop",{attrs:{data:e.data,checkable:"",clearable:"",cascade:!1,loading:e.loading,"drop-placeholder":"请选择","dropdown-min-width":300},on:{"checked-change":e.handleCheckedChange},model:{value:e.value,callback:function(t){e.value=t},expression:"value"}},[n("span",{attrs:{slot:"empty"},slot:"empty"},[e._v("slot 传进来的暂无数据")])]),e._v("\n  "+e._s(e.value)+"\n  "),n("button",{on:{click:e.handleChangeValue}},[e._v("Change Value")])],1)},Ft=[],jt=[{id:"p1-id",title:"c(lL%8",checked:!1,children:[{id:"c1-1-id",title:"c1-1",children:[]},{id:"c1-2-id",title:"c1-2",checked:!1,children:[]}]},{id:"p2-id",title:"KfQrp",checked:!1,children:[{id:"c2-1-id",title:"c2-1",checked:!1,children:[]},{id:"c2-2-id",title:"c1-2",checked:!1,children:[{id:"c2-2-1-id",title:"c1-2-1",checked:!1,children:[]}]}]}],It={name:"DropRemote",components:{CTreeDrop:Ie},data:function(){return{data:[],value:"",loading:!1}},created:function(){this.handleSetData()},methods:{handleChangeValue:function(){var e=this;setTimeout((function(){e.value="c1-1-id,c1-2-id"}),100)},handleCheckedChange:function(e){console.log("rrr checked change",e)},handleSetData:function(){var e=this;this.loading=!0,setTimeout((function(){e.data=jt,e.$nextTick((function(){e.value="c1-1-id,c1-2-id",e.loading=!1}))}),2e3)}}},Bt=It,Mt=Object(F["a"])(Bt,Lt,Ft,!1,null,null,null),Vt=(Mt.exports,function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",[n("CTree",{attrs:{data:e.data,checkable:"",draggable:"",droppable:""},on:{"node-drop":e.handleDrop},model:{value:e.value,callback:function(t){e.value=t},expression:"value"}},[n("span",{attrs:{slot:"empty"},slot:"empty"},[e._v("slot 传进来的暂无数据")])]),e._v("\n  "+e._s(e.value)+"\n")],1)}),Ht=[],Ut=function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};return Ve(Object.assign({treeDepth:3,nodesPerLevel:5,sameIdTitle:!0,inOrder:!0,forceString:!0},e))},Wt={name:"Drag",components:{CTree:Be},data:function(){var e=Ut().data;return{data:e,value:["0"]}},methods:{handleDrop:function(){console.log("node drop")}}},Gt=Wt,Yt=Object(F["a"])(Gt,Vt,Ht,!1,null,null,null),Xt=Yt.exports,qt=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticStyle:{width:"200px"}},[n("CTreeDrop",{attrs:{data:e.data,checkable:"",clearable:"","drop-placeholder":"请选择","dropdown-min-width":300,"dropdown-width-fixed":""},model:{value:e.value,callback:function(t){e.value=t},expression:"value"}},[n("span",{attrs:{slot:"empty"},slot:"empty"},[e._v("slot 传进来的暂无数据")])]),e._v("\n  "+e._s(e.value)+"\n")],1)},Jt=[],zt=function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};return Ve(Object.assign({treeDepth:3,nodesPerLevel:5,sameIdTitle:!0,inOrder:!0,forceString:!0},e))},Qt=zt().data,Zt={name:"DropDataChange",components:{CTreeDrop:Ie},data:function(){return{data:[],value:"2"}},watch:{value:{handler:function(e){var t=this;setTimeout((function(){t.data=Qt}),3e3)},immediate:!0}}},en=Zt,tn=Object(F["a"])(en,qt,Jt,!1,null,null,null),nn=(tn.exports,function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("CTree",{ref:"tree",attrs:{data:e.treeData,render:e.renderTree}})}),an=[],rn={name:"InsertRenderTree",components:{CTree:Be},data:function(){return{treeData:[{}]}},methods:{renderTree:function(e,t){return e("div",[e("input",{attrs:{type:"text"}}),e("button",{on:{click:this.handleAdd.bind(this,t)}},["Add sibling"]),e("button",{on:{click:this.handleAddChild.bind(this,t)}},["Add child"]),e("button",{on:{click:this.handleDelete.bind(this,t)}},["Remove"])])},handleAdd:function(e){this.$refs.tree.insertAfter({},e.id)},handleAddChild:function(e){this.$refs.tree.append({},e.id)},handleDelete:function(e){this.$refs.tree.remove(e.id)}}},sn=rn,on=Object(F["a"])(sn,nn,an,!1,null,null,null),ln=on.exports,cn={Feature:Xe,Performance:nt,Loading:ct,Search:gt,Drop:Rt,Drag:Xt,InsertRenderTree:ln},dn={name:"App",components:cn,data:function(){var e=Object.keys(cn);return{currentTab:e[0],tabList:e}}},hn=dn,un=(n("925e"),Object(F["a"])(hn,i,r,!1,null,"6c2a65d2",null)),fn=un.exports;n("eeb1");a["a"].config.productionTip=!1,new a["a"]({render:function(e){return e(fn)}}).$mount("#app")},e2ab:function(e,t,n){},eeb1:function(e,t,n){}});
\ No newline at end of file
diff --git a/examples/Feature.vue b/examples/Feature.vue
index 538d1ca..9dc5392 100644
--- a/examples/Feature.vue
+++ b/examples/Feature.vue
@@ -9,6 +9,7 @@
             <CTree
               :data="basicUsage"
               :nodeClassName="(node) => `generated-class-${node.id}`"
+              animation
             />
           </div>
         </div>
@@ -136,6 +137,77 @@
       </div>
     </div>
 
+    <!-- 连接线 -->
+    <div class="panel">
+      <div class="header">连接线</div>
+      <div class="body">
+        <div class="interface">
+          <div style="height: 300px">
+            <CTree
+              :data="showLineTreeData"
+              :showLine="{ type: showLineType, polyline: showLinePolyline }"
+              defaultExpandAll
+              animation
+            />
+          </div>
+        </div>
+        <div class="desc">
+          <div class="desc-block">
+            传入 showLine 可展示连接线，type 可指定连接线类型
+          </div>
+          <div class="desc-block">
+            showLine 传入对象可设置连接线的宽度，连线类型与颜色等<br/>
+            showLine.type:
+
+            <button
+              v-for="showLineType in (['solid', 'dashed'])"
+              :key="showLineType"
+              @click="onShowLineTypeBtnClick(showLineType)"
+            >
+              {{ showLineType }}
+            </button>
+            <p>当前连接线类型：{{showLineType}}</p>
+          </div>
+          <div class="desc-block">
+            showLine.polyline:
+
+            <button
+              v-for="polyline in [true, false]"
+              :key="polyline"
+              @click="onShowLinePolylineBtnClick(polyline)"
+            >
+              {{ polyline }}
+            </button>
+            <p>是否启用折线：{{showLinePolyline}}</p>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <!-- 自定义节点 -->
+    <div class="panel">
+      <div class="header">自定义节点</div>
+      <div class="body">
+        <div class="interface">
+          <div style="height: 300px">
+            <CTree :data="basicUsage">
+              <template v-slot:node="{ node }">
+                <button>{{ node.title }}</button>
+              </template>
+            </CTree>
+          </div>
+        </div>
+        <div class="desc">
+          <div class="desc-block">
+            除了 render，也可以传入 slot 自定义树节点
+            <pre>
+              {{ nodeSlotDescText }}
+            </pre>
+          </div>
+        </div>
+      </div>
+    </div>
+
     <!-- 远程 -->
     <div class="panel">
       <div class="header">远程</div>
@@ -220,6 +292,93 @@ export default {
       both: genData().data,
       bothValue: [],
 
+      // 连接线
+      showLineTreeData: [
+        {
+          title: 'node-1',
+          id: 'node-1',
+          children: [
+            {
+              title: 'node-1-1',
+              id: 'node-1-1',
+              children: [
+                {
+                  title: 'node-1-1-1',
+                  id: 'node-1-1-1',
+                },
+                {
+                  title: 'node-1-1-2',
+                  id: 'node-1-1-2',
+                },
+                {
+                  title: 'node-1-1-3',
+                  id: 'node-1-1-3',
+                },
+              ],
+            },
+            {
+              title: 'node-1-2',
+              id: 'node-1-2',
+              children: [
+                {
+                  title: 'node-1-2-1',
+                  id: 'node-1-2-1',
+                },
+                {
+                  title: 'node-1-2-2',
+                  id: 'node-1-2-2',
+                },
+              ],
+            },
+            {
+              title: 'node-1-3',
+              id: 'node-1-3',
+              children: [
+                {
+                  title: 'node-1-3-1',
+                  id: 'node-1-3-1',
+                },
+                {
+                  title: 'node-1-3-2',
+                  id: 'node-1-3-2',
+                },
+              ],
+            },
+          ],
+        },
+        {
+          title: 'node-2',
+          id: 'node-2',
+          children: [
+            {
+              title: 'node-2-1',
+              id: 'node-2-1',
+              children: [
+                {
+                  title: 'node-2-1-1',
+                  id: 'node-2-1-1',
+                },
+                {
+                  title: 'node-2-1-2',
+                  id: 'node-2-1-2',
+                },
+              ],
+            },
+          ],
+        },
+      ],
+      showLineType: undefined,
+      showLinePolyline: false,
+
+      // 自定义节点
+      nodeSlotDescText: `
+<VTree :data="basicUsage">
+  <template v-slot:node="{ node }">
+    <button>{{ node.title }}</button>
+  </template>
+</VTree>
+      `,
+
       // 远程
       remoteShow: false,
       remoteLoad: (node, resolve, reject) => {
@@ -229,6 +388,15 @@ export default {
       }
     }
   },
+  methods: {
+    onShowLineTypeBtnClick (type) {
+      this.showLineType = type
+    },
+
+    onShowLinePolylineBtnClick (polyline) {
+      this.showLinePolyline = polyline
+    },
+  },
 }
 </script>
 
diff --git a/package.json b/package.json
index 666e6a1..4b0d3ef 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@wsfe/ctree",
-  "version": "2.3.1",
+  "version": "2.4.0",
   "main": "./dist/ctree.umd.min.js",
   "types": "./types",
   "description": "A vue tree component using virtual list.",
diff --git a/src/components/Tree.vue b/src/components/Tree.vue
index d13b2a2..3dc754b 100644
--- a/src/components/Tree.vue
+++ b/src/components/Tree.vue
@@ -10,22 +10,82 @@
       <div :class="blockAreaCls">
         <div :style="topSpaceStyles"></div>
         <CTreeNode
-          v-for="(node, index) in renderNodes"
+          v-for="node in (expandAnimation.ready ? expandAnimation.topNodes : renderNodes)"
           :key="node[keyField]"
           :data="node"
+          :noSiblingNodeMap="noSiblingNodeMap"
           v-bind="$props"
           v-on="treeNodeListeners"
           :class="typeof nodeClassName === 'function' ? nodeClassName(node) : nodeClassName"
           :style="{
             minHeight: `${nodeMinHeight}px`,
-            marginLeft: usePadding ? null : `${node._level * nodeIndent}px`,
-            paddingLeft: usePadding ? `${node._level * nodeIndent}px` : null,
           }"
           @check="handleNodeCheck"
           @select="handleNodeSelect"
           @expand="handleNodeExpand"
           @node-drop="handleNodeDrop"
-        />
+        >
+          <template v-slot="slotProps">
+            <slot name="node" v-bind="slotProps"></slot>
+          </template>
+        </CTreeNode>
+        <template v-if="expandAnimation.ready">
+          <transition
+            name="ctree-expand-animation"
+            @after-enter="onExpandAnimationFinish"
+            @after-leave="onExpandAnimationFinish"
+          >
+            <div
+              v-show="expandAnimation.currentExpandState"
+              :style="{
+                display: 'grid',
+              }"
+            >
+              <div :style="{ overflow: 'hidden' }">
+                <CTreeNode
+                  v-for="node in expandAnimation.middleNodes"
+                  :key="node[keyField]"
+                  :data="node"
+                  :noSiblingNodeMap="noSiblingNodeMap"
+                  v-bind="$props"
+                  v-on="treeNodeListeners"
+                  :class="typeof nodeClassName === 'function' ? nodeClassName(node) : nodeClassName"
+                  :style="{
+                    minHeight: `${nodeMinHeight}px`,
+                  }"
+                  @check="handleNodeCheck"
+                  @select="handleNodeSelect"
+                  @expand="handleNodeExpand"
+                  @node-drop="handleNodeDrop"
+                >
+                  <template v-slot="slotProps">
+                    <slot name="node" v-bind="slotProps"></slot>
+                  </template>
+                </CTreeNode>
+              </div>
+            </div>
+          </transition>
+          <CTreeNode
+            v-for="node in expandAnimation.bottomNodes"
+            :key="node[keyField]"
+            :data="node"
+            :noSiblingNodeMap="noSiblingNodeMap"
+            v-bind="$props"
+            v-on="treeNodeListeners"
+            :class="typeof nodeClassName === 'function' ? nodeClassName(node) : nodeClassName"
+            :style="{
+              minHeight: `${nodeMinHeight}px`,
+            }"
+            @check="handleNodeCheck"
+            @select="handleNodeSelect"
+            @expand="handleNodeExpand"
+            @node-drop="handleNodeDrop"
+          >
+            <template v-slot="slotProps">
+              <slot name="node" v-bind="slotProps"></slot>
+            </template>
+          </CTreeNode>
+        </template>
         <div :style="bottomSpaceStyles"></div>
       </div>
     </div>
@@ -334,6 +394,17 @@ export default (Vue as VueConstructor<Vue & {
       type: Boolean,
       default: false,
     },
+
+    showLine: {
+      type: [
+        Boolean,
+        Object,
+      ],
+    },
+
+    animation: {
+      type: Boolean,
+    },
   },
   data () {
     const valueCache = Array.isArray(this.value) ? this.value.concat() : this.value
@@ -376,6 +447,21 @@ export default (Vue as VueConstructor<Vue & {
 
       /** 防抖计时器 id */
       debounceTimer: (undefined as number | undefined),
+
+      /** 展开动画 */
+      expandAnimation: {
+        start: false,
+        index: -1,
+        level: -1,
+        nextState: false,
+
+        ready: false,
+        currentExpandState: false,
+
+        topNodes: [] as TreeNode[],
+        middleNodes: [] as TreeNode[],
+        bottomNodes: [] as TreeNode[],
+      },
     }
   },
   computed: {
@@ -453,6 +539,43 @@ export default (Vue as VueConstructor<Vue & {
       }
       return result
     },
+
+    noSiblingNodeMap (): Record<string, true> {
+      const parentsOfFirstNode: TreeNode[] = []
+      let nodeParent = this.renderNodes[0] && this.renderNodes[0]._parent
+
+      while (nodeParent) {
+        parentsOfFirstNode.push(nodeParent)
+        nodeParent = nodeParent._parent
+      }
+
+      const nodesToIterate = parentsOfFirstNode.concat(this.renderNodes)
+
+      const map: Record<string, true> = {}
+      const stack: TreeNode[] = []
+      nodesToIterate.forEach((renderNode) => {
+        const currentNodeLevel = renderNode._level
+        let length = stack.length
+        while (length) {
+          const stackNode = stack[length - 1]
+          const stackNodeLevel = stackNode._level
+          if (stackNodeLevel > currentNodeLevel) {
+            map[stackNode[this.keyField]] = true
+            stack.pop()
+          } else if (stackNodeLevel === currentNodeLevel) {
+            stack.pop()
+            break
+          } else break
+          length--
+        }
+        stack.push(renderNode)
+      })
+      stack.forEach((node) => {
+        map[node[this.keyField]] = true
+      })
+
+      return map
+    },
   },
   methods: {
     //#region Public API
@@ -597,7 +720,7 @@ export default (Vue as VueConstructor<Vue & {
           }, null, this.keyField, !!this.load)
         })
         this.unloadCheckedNodes = unloadNodes
-        this.nonReactive.blockNodes.push(...unloadNodes)
+        this.nonReactive.blockNodes = this.nonReactive.blockNodes.concat(unloadNodes)
         this.updateBlockData()
         this.updateRender()
       }
@@ -674,6 +797,7 @@ export default (Vue as VueConstructor<Vue & {
       this.nonReactive.store.setSelected(node[this.keyField], !node.selected)
     },
     handleNodeExpand (node: TreeNode): void {
+      this.updateBeforeExpand(node)
       this.nonReactive.store.setExpand(node[this.keyField], !node.expand)
     },
     handleNodeDrop (data: TreeNode, e: DragEvent, hoverPart: dragHoverPartEnum): void {
@@ -814,6 +938,80 @@ export default (Vue as VueConstructor<Vue & {
       // this.updateRenderNodes(true)
     },
 
+    // #region expand animation
+    resetExpandAnimation (): void {
+      this.expandAnimation.start = false
+      this.expandAnimation.ready = false
+      this.expandAnimation.index = -1
+      this.expandAnimation.level = -1
+
+      this.expandAnimation.topNodes = []
+      this.expandAnimation.middleNodes = []
+      this.expandAnimation.bottomNodes = []
+    },
+
+    updateMiddleNodes (): void {
+      const nodeToExpandLevel = this.expandAnimation.level
+      const middleNodes: TreeNode[] = []
+      const renderNodesLength = this.renderNodes.length
+      for (let i = this.expandAnimation.index + 1; i < renderNodesLength; i++) {
+        if (this.renderNodes[i]._level > nodeToExpandLevel) {
+          middleNodes.push(this.renderNodes[i])
+        } else break
+      }
+      this.expandAnimation.middleNodes = middleNodes
+    },
+
+    updateBeforeExpand (nodeToExpand: TreeNode): void {
+      if (!this.animation) return
+      this.resetExpandAnimation()
+
+      const key = nodeToExpand[this.keyField]
+      const index = this.renderNodes.findIndex((renderNode) => renderNode[this.keyField] === key)
+      if (index > -1) {
+        this.expandAnimation.index = index
+        this.expandAnimation.level = nodeToExpand._level
+        this.expandAnimation.start = true
+        this.expandAnimation.currentExpandState = nodeToExpand.expand
+        this.expandAnimation.nextState = !nodeToExpand.expand
+
+        if (this.expandAnimation.nextState) {
+          this.expandAnimation.bottomNodes = this.renderNodes.slice(this.expandAnimation.index + 1)
+        } else {
+          this.updateMiddleNodes()
+        }
+      }
+    },
+
+    updateAfterExpand (): void {
+      if (!this.animation) return
+
+      if (!this.expandAnimation.start) {
+        this.expandAnimation.start = false
+        return
+      }
+
+      if (this.expandAnimation.index === -1) return
+
+      this.$nextTick(() => {
+        this.expandAnimation.topNodes = this.renderNodes.slice(0, this.expandAnimation.index + 1)
+        if (this.expandAnimation.nextState) {
+          this.updateMiddleNodes()
+        } else {
+          this.expandAnimation.bottomNodes = this.renderNodes.slice(this.expandAnimation.index + 1)
+        }
+        this.expandAnimation.ready = true
+        this.$nextTick(() => {
+          this.expandAnimation.currentExpandState = !this.expandAnimation.currentExpandState
+        })
+      })
+    },
+
+   onExpandAnimationFinish (): void {
+      this.resetExpandAnimation()
+    },
+    // #endregion expand animation
+
     initializeNonReactiveData (): void {
       const { keyField, ignoreMode, filteredNodeCheckable, cascade, defaultExpandAll, load, expandOnFilter } = this
       this.nonReactive = {
@@ -834,6 +1032,7 @@ export default (Vue as VueConstructor<Vue & {
     // Initial non-reactive
     this.initializeNonReactiveData()
 
+    this.nonReactive.store.on('expand', this.updateAfterExpand)
     this.nonReactive.store.on('visible-data-change', this.updateBlockNodes)
     this.nonReactive.store.on('render-data-change', this.updateRender)
     this.nonReactive.store.on('checked-change', (checkedNodes: TreeNode[], checkedKeys: TreeNodeKeyType[]) => {
diff --git a/src/components/TreeNode.vue b/src/components/TreeNode.vue
index 4d71985..282a245 100644
--- a/src/components/TreeNode.vue
+++ b/src/components/TreeNode.vue
@@ -1,53 +1,83 @@
 <template>
-  <div :class="wrapperCls">
-    <div :class="dropBeforeCls"></div>
+  <div :class="indentWrapperCls">
+    <template v-if="showLine">
+      <template v-for="(level, index) in data._level">
+        <svg
+          viewBox="0 0 100 100"
+          preserveAspectRatio="none"
+          :style="{
+            alignSelf: 'stretch',
+            width: `${nodeIndent}px`,
+          }"
+        >
+          <polyline
+            fill="none"
+            :points="polylinePoints(index === data._level - 1)"
+            :stroke-width="strokeWidth"
+            :stroke="showLineParams.color"
+            :stroke-dasharray="strokeDasharray"
+          />
+        </svg>
+      </template>
+    </template>
     <div
-      ref="nodeBody"
-      :class="nodeBodyCls"
-      v-on="dropListeners"
+      :class="wrapperCls"
+      :style="{
+        paddingLeft: showLine ? 'none' : (usePadding ? `${data._level * nodeIndent}px` : null),
+        marginLeft: showLine ? 'none' : (usePadding ? null : `${data._level * nodeIndent}px`),
+      }"
     >
-      <!-- 展开按钮 -->
-      <div :class="squareCls">
-        <!-- 外层用于占位，icon 用于点击 -->
-        <i
-          v-show="!data.isLeaf && !data._loading"
-          :class="expandCls"
-          @click="handleExpand"
-        ></i>
-        <LoadingIcon
-          v-if="data._loading"
-          :class="loadingIconCls"
-        />
-      </div>
-
-      <!-- 复选框 -->
+      <div :class="dropBeforeCls"></div>
       <div
-        v-if="showCheckbox"
-        :class="squareCls"
+        ref="nodeBody"
+        :class="nodeBodyCls"
+        v-on="dropListeners"
       >
+        <!-- 展开按钮 -->
+        <div :class="squareCls">
+          <!-- 外层用于占位，icon 用于点击 -->
+          <i
+            v-show="!data.isLeaf && !data._loading"
+            :class="expandCls"
+            @click="handleExpand"
+          ></i>
+          <LoadingIcon
+            v-if="data._loading"
+            :class="loadingIconCls"
+          />
+        </div>
+
+        <!-- 复选框 -->
         <div
-          :class="checkboxCls"
-          @click="handleCheck"
-        ></div>
-      </div>
+          v-if="showCheckbox"
+          :class="squareCls"
+        >
+          <div
+            :class="checkboxCls"
+            @click="handleCheck"
+          ></div>
+        </div>
 
-      <!-- 标题 -->
-      <div
-        :class="titleCls"
-        @click="handleSelect"
-        @dblclick="handleDblclick"
-        @contextmenu="handleRightClick"
-        v-on="dragListeners"
-        :draggable="draggable && !disableAll && !data.disabled"
-      >
-        <component
-          v-if="renderFunction"
-          :is="renderComponent"
-        ></component>
-        <template v-else>{{ data[titleField] }}</template>
+        <!-- 标题 -->
+        <div
+          :class="titleCls"
+          @click="handleSelect"
+          @dblclick="handleDblclick"
+          @contextmenu="handleRightClick"
+          v-on="dragListeners"
+          :draggable="draggable && !disableAll && !data.disabled"
+        >
+          <slot :node="fullData">
+            <component
+              v-if="renderFunction"
+              :is="renderComponent"
+            ></component>
+            <template v-else>{{ data[titleField] }}</template>
+          </slot>
+        </div>
       </div>
+      <div :class="dropAfterCls"></div>
     </div>
-    <div :class="dropAfterCls"></div>
   </div>
 </template>
 
@@ -55,7 +85,7 @@
 import Vue, { VueConstructor, CreateElement, VNode } from 'vue'
 import { TreeNode } from '../store'
 import LoadingIcon from './LoadingIcon.vue'
-import { dragHoverPartEnum } from '../const'
+import { ShowLine, dragHoverPartEnum, showLineType } from '../const'
 import CTree from './Tree.vue'
 
 const prefixCls = 'ctree-tree-node'
@@ -100,6 +130,28 @@ export default (Vue as VueConstructor<Vue & {
 
     /** 是否可放置 */
     droppable: Boolean,
+
+    /**
+     * 使用 padding 代替 margin 来展示子节点缩进
+     * 此 Prop 是为了方便样式定制，在下个大版本将全部使用 padding
+     * @deprecated
+     */
+     usePadding: Boolean,
+
+    /** 子节点缩进 */
+    nodeIndent: {
+      type: Number,
+      default: 20,
+    },
+
+    showLine: {
+      type: [
+        Boolean,
+        Object,
+      ],
+    },
+
+    noSiblingNodeMap: Object,
   },
   data () {
     return {
@@ -115,6 +167,11 @@ export default (Vue as VueConstructor<Vue & {
   },
   computed: {
     //#region Classes
+    indentWrapperCls (): Array<string | object> {
+      return [
+        `${prefixCls}__indent-wrapper`,
+      ]
+    },
     wrapperCls (): Array<string | object> {
       return [
         `${prefixCls}__wrapper`,
@@ -231,8 +288,50 @@ export default (Vue as VueConstructor<Vue & {
       return result
     },
     //#endregion Drag events
+
+    // #region show line
+    showLineParams (): Required<ShowLine> {
+      const defaultParams: Required<ShowLine> = {
+        width: 1,
+        type: showLineType.solid,
+        color: '#D3D3D3',
+        polyline: false,
+      }
+      let params: Required<ShowLine> = defaultParams
+      if (typeof this.showLine === 'object') {
+        params = {
+          width: this.showLine.width != null ? this.showLine.width : defaultParams.width,
+          type: this.showLine.type || defaultParams.type,
+          color: this.showLine.color || defaultParams.color,
+          polyline: this.showLine.polyline != null ? this.showLine.polyline : defaultParams.polyline,
+        }
+      }
+      return params
+    },
+
+    strokeWidth (): number {
+      return this.showLineParams.width * 100 / this.nodeIndent
+    },
+
+    strokeDasharray (): string {
+      switch (this.showLineParams.type) {
+        case showLineType.dashed:
+          return '25'
+        default:
+          break
+      }
+      return 'none'
+    },
+    // #endregion show line
   },
   methods: {
+    polylinePoints (isDirectParentLine: boolean): string {
+      if (!this.showLineParams.polyline || !isDirectParentLine) return '50,0 50,100'
+      const parent = this.fullData && this.fullData._parent
+      if (parent && this.noSiblingNodeMap[parent[this.keyField]] && this.noSiblingNodeMap[this.data[this.keyField]]) return '50,0 50,50 100,50 50,50'
+      return '50,0 50,50 100,50 50,50 50,100'
+    },
+
     handleExpand (): void {
       if (this.data.isLeaf) return
       this.$emit('expand', this.fullData)
diff --git a/src/const/index.ts b/src/const/index.ts
index 7307616..4bcb1be 100644
--- a/src/const/index.ts
+++ b/src/const/index.ts
@@ -129,3 +129,17 @@ export enum dragHoverPartEnum {
 //#endregion Drag
 
 export type TreeNodeKeyType = string | number
+
+export enum showLineType {
+  // dotted = 'dotted',
+  dashed = 'dashed',
+  solid = 'solid',
+}
+
+export interface ShowLine {
+  /** 连接线宽度，svg stroke-width， 默认 1px */
+  width?: number
+  type?: showLineType
+  color?: string
+  polyline?: boolean
+}
diff --git a/src/store/tree-store.ts b/src/store/tree-store.ts
index 764d74c..f50d7e6 100644
--- a/src/store/tree-store.ts
+++ b/src/store/tree-store.ts
@@ -77,6 +77,15 @@ export default class TreeStore {
   constructor (private readonly options: ITreeStoreOptions) {
   }
 
+  /**
+   * Use this function to insert nodes into flatData to avoid 'maximun call stack size exceeded' error
+   * @param insertIndex The index to insert, the same usage as `this.flatData.splice(insertIndex, 0, insertNodes)`
+   * @param insertNodes Tree nodes to insert
+   */
+  private insertIntoFlatData(insertIndex: number, insertNodes: TreeNode[]) {
+    this.flatData = this.flatData.slice(0, insertIndex).concat(insertNodes, this.flatData.slice(insertIndex))
+  }
+
   setData (data: ITreeNodeOptions[], selectableUnloadKey: TreeNodeKeyType | null = null, checkableUnloadKeys: TreeNodeKeyType[] | null = null): void {
     this.data = data.map((nodeData: ITreeNodeOptions): TreeNode => new TreeNode(nodeData, null, this.options.keyField, !!this.options.load))
     // 清空 mapData
@@ -355,7 +364,7 @@ export default class TreeStore {
               // 如果单选选中的值为空，则允许后续数据覆盖单选 value
               const currentCheckedKeys = this.getCheckedKeys()
               const flattenChildren = this.flattenData(node.children, this.getSelectedKey === null)
-              this.flatData.splice(parentIndex + 1, 0, ...flattenChildren)
+              this.insertIntoFlatData(parentIndex + 1, flattenChildren)
               // 如果有未加载的选中节点，判断其是否已加载
               this.setUnloadCheckedKeys(currentCheckedKeys)
               if (this.unloadSelectedKey !== null) {
@@ -387,17 +396,20 @@ export default class TreeStore {
 
       node.expand = value
       // Set children visibility
-      const queue = [...node.children]
+      let queue = node.children.concat()
       while (queue.length) {
-        if (queue[0].expand && queue[0].children.length) {
-          queue.push(...queue[0].children)
+        const nodeFromQueue = queue.pop()
+        if (!nodeFromQueue) continue
+        if (nodeFromQueue.expand && nodeFromQueue.children.length) {
+          queue = nodeFromQueue.children.concat(queue)
         }
-        if (queue[0]._filterVisible === false) {
-          queue[0].visible = false
+        if (nodeFromQueue._filterVisible === false) {
+          nodeFromQueue.visible = false
         } else {
-          queue[0].visible = queue[0]._parent === null || (queue[0]._parent.expand && queue[0]._parent.visible)
+          nodeFromQueue.visible =
+            nodeFromQueue._parent === null ||
+            (nodeFromQueue._parent.expand && nodeFromQueue._parent.visible)
         }
-        queue.shift()
       }
 
       if (triggerEvent) {
@@ -736,7 +748,7 @@ export default class TreeStore {
     // 处理自身及子节点 _level
     node._level = parentNode ? parentNode._level + 1 : 0
     nodes.forEach((childNode) => childNode._level = childNode._parent ? childNode._parent._level + 1 : 0)
-    this.flatData.splice(flatIndex, 0, ...nodes)
+    this.insertIntoFlatData(flatIndex, nodes)
 
     // 更新被移除处父节点状态
     this.updateMovingNodeStatus(node)
diff --git a/src/styles/tree.less b/src/styles/tree.less
index c0b14aa..861931a 100644
--- a/src/styles/tree.less
+++ b/src/styles/tree.less
@@ -2,6 +2,7 @@
   // prefix
   @tree-prefix: ~"@{ctree-prefix}-tree";
   @tree-node-prefix: ~"@{tree-prefix}-node";
+  @tree-expand-animation: ~'@{ctree-prefix}-expand-animation';
 
   // Tree
   .@{tree-prefix} {
@@ -77,8 +78,14 @@
   .@{tree-node-prefix} {
     @base-square-length: 20px;
 
+    // 缩进
+    &__indent-wrapper {
+      display: flex;
+    }
+
     // 容器
     &__wrapper {
+      flex: 1;
       display: flex;
       flex-direction: column;
     }
@@ -281,6 +288,25 @@
       }
     }
   }
+
+  .@{tree-expand-animation} {
+    &-enter,
+    &-leave-to {
+      opacity: 0;
+      grid-template-rows: 0fr;
+    }
+
+    &-enter-to,
+    &-leave {
+      opacity: 1;
+      grid-template-rows: 1fr;
+    }
+
+    &-enter-active,
+    &-leave-active {
+      transition: opacity .2s, grid-template-rows .2s;
+    }
+  }
 }
 
 #ctree-tree-styles();
diff --git a/types/src/components/Tree.vue.d.ts b/types/src/components/Tree.vue.d.ts
index f93a9c3..59af091 100644
--- a/types/src/components/Tree.vue.d.ts
+++ b/types/src/components/Tree.vue.d.ts
@@ -46,6 +46,18 @@ declare const _default: import("vue/types/vue").ExtendedVue<Vue & {
     valueCache: VModelType;
     /** 防抖计时器 id */
     debounceTimer: number | undefined;
+    /** 展开动画 */
+    expandAnimation: {
+        start: boolean;
+        index: number;
+        level: number;
+        nextState: boolean;
+        ready: boolean;
+        currentExpandState: boolean;
+        topNodes: TreeNode[];
+        middleNodes: TreeNode[];
+        bottomNodes: TreeNode[];
+    };
 }, {
     /** 使用此方法重置树数据，可避免大量数据被 vue 监听 */
     setData(data: AnyPropsArrayType): void;
@@ -136,6 +148,11 @@ declare const _default: import("vue/types/vue").ExtendedVue<Vue & {
      */
     updateRenderNodes(isScroll?: boolean): void;
     handleTreeScroll(): void;
+    resetExpandAnimation(): void;
+    updateMiddleNodes(): void;
+    updateBeforeExpand(nodeToExpand: TreeNode): void;
+    updateAfterExpand(): void;
+    onExpandAnimationFinish(): void;
     initializeNonReactiveData(): void;
 }, {
     topSpaceStyles: object;
@@ -150,6 +167,7 @@ declare const _default: import("vue/types/vue").ExtendedVue<Vue & {
     loadingIconCls: string[];
     iframeCls: string[];
     treeNodeListeners: object;
+    noSiblingNodeMap: Record<string, true>;
 }, {
     value: string | number | TreeNodeKeyType[];
     data: AnyPropsArrayType;
@@ -185,5 +203,7 @@ declare const _default: import("vue/types/vue").ExtendedVue<Vue & {
     bufferNodeAmount: number;
     nodeClassName: any;
     usePadding: boolean;
+    showLine: any;
+    animation: boolean;
 }>;
 export default _default;
diff --git a/types/src/components/TreeDrop.vue.d.ts b/types/src/components/TreeDrop.vue.d.ts
index bb3b2b9..3decd04 100644
--- a/types/src/components/TreeDrop.vue.d.ts
+++ b/types/src/components/TreeDrop.vue.d.ts
@@ -99,6 +99,17 @@ declare const _default: import("vue/types/vue").ExtendedVue<Vue & {
                     isRootLoading: boolean;
                     valueCache: string | number | TreeNodeKeyType[];
                     debounceTimer: number | undefined;
+                    expandAnimation: {
+                        start: boolean;
+                        index: number;
+                        level: number;
+                        nextState: boolean;
+                        ready: boolean;
+                        currentExpandState: boolean;
+                        topNodes: TreeNode[];
+                        middleNodes: TreeNode[];
+                        bottomNodes: TreeNode[];
+                    };
                 } & {
                     setData(data: {
                         [key: string]: any;
@@ -149,6 +160,11 @@ declare const _default: import("vue/types/vue").ExtendedVue<Vue & {
                     updateRenderAmount(): void;
                     updateRenderNodes(isScroll?: boolean): void;
                     handleTreeScroll(): void;
+                    resetExpandAnimation(): void;
+                    updateMiddleNodes(): void;
+                    updateBeforeExpand(nodeToExpand: TreeNode): void;
+                    updateAfterExpand(): void;
+                    onExpandAnimationFinish(): void;
                     initializeNonReactiveData(): void;
                 } & {
                     topSpaceStyles: object;
@@ -163,6 +179,7 @@ declare const _default: import("vue/types/vue").ExtendedVue<Vue & {
                     loadingIconCls: string[];
                     iframeCls: string[];
                     treeNodeListeners: object;
+                    noSiblingNodeMap: Record<string, true>;
                 } & {
                     value: string | number | TreeNodeKeyType[];
                     data: {
@@ -202,6 +219,8 @@ declare const _default: import("vue/types/vue").ExtendedVue<Vue & {
                     bufferNodeAmount: number;
                     nodeClassName: any;
                     usePadding: boolean;
+                    showLine: any;
+                    animation: boolean;
                 } & Vue & {
                     $refs: {
                         scrollArea: HTMLDivElement;
diff --git a/types/src/components/TreeNode.vue.d.ts b/types/src/components/TreeNode.vue.d.ts
index eaf2908..0233ca2 100644
--- a/types/src/components/TreeNode.vue.d.ts
+++ b/types/src/components/TreeNode.vue.d.ts
@@ -1,6 +1,6 @@
 import Vue, { VueConstructor, CreateElement, VNode } from 'vue';
 import { TreeNode } from '../store';
-import { dragHoverPartEnum } from '../const';
+import { ShowLine, dragHoverPartEnum } from '../const';
 declare const _default: import("vue/types/vue").ExtendedVue<Vue & {
     $refs: {
         nodeBody: HTMLDivElement;
@@ -13,6 +13,7 @@ declare const _default: import("vue/types/vue").ExtendedVue<Vue & {
     /** 节点后拖拽 dragover */
     dragoverAfter: boolean;
 }, {
+    polylinePoints(isDirectParentLine: boolean): string;
     handleExpand(): void;
     handleCheck(): void;
     handleSelect(): void;
@@ -32,6 +33,7 @@ declare const _default: import("vue/types/vue").ExtendedVue<Vue & {
     handleDragLeave(e: DragEvent): void;
     handleDrop(e: DragEvent): void;
 }, {
+    indentWrapperCls: (string | object)[];
     wrapperCls: (string | object)[];
     nodeBodyCls: (string | object)[];
     dropBeforeCls: (string | object)[];
@@ -47,6 +49,9 @@ declare const _default: import("vue/types/vue").ExtendedVue<Vue & {
     renderComponent: VueConstructor<Vue>;
     dragListeners: object;
     dropListeners: object;
+    showLineParams: Required<ShowLine>;
+    strokeWidth: number;
+    strokeDasharray: string;
 }, {
     data: TreeNode;
     titleField: string;
@@ -58,5 +63,9 @@ declare const _default: import("vue/types/vue").ExtendedVue<Vue & {
     disableAll: boolean;
     draggable: boolean;
     droppable: boolean;
+    usePadding: boolean;
+    nodeIndent: number;
+    showLine: any;
+    noSiblingNodeMap: any;
 }>;
 export default _default;
diff --git a/types/src/components/TreeSearch.vue.d.ts b/types/src/components/TreeSearch.vue.d.ts
index 71d868d..ecb666d 100644
--- a/types/src/components/TreeSearch.vue.d.ts
+++ b/types/src/components/TreeSearch.vue.d.ts
@@ -7,6 +7,7 @@ declare const _default: import("vue/types/vue").ExtendedVue<Vue & {
             unloadCheckedNodes: TreeNode[];
             blockLength: number;
             blockAreaHeight: number;
+            /** 处理全选点击 */
             topSpaceHeight: number;
             bottomSpaceHeight: number;
             renderAmount: number;
@@ -17,6 +18,17 @@ declare const _default: import("vue/types/vue").ExtendedVue<Vue & {
             isRootLoading: boolean;
             valueCache: string | number | TreeNodeKeyType[];
             debounceTimer: number | undefined;
+            expandAnimation: {
+                start: boolean;
+                index: number;
+                level: number;
+                nextState: boolean;
+                ready: boolean;
+                currentExpandState: boolean;
+                topNodes: TreeNode[];
+                middleNodes: TreeNode[];
+                bottomNodes: TreeNode[];
+            };
         } & {
             setData(data: {
                 [key: string]: any;
@@ -67,6 +79,11 @@ declare const _default: import("vue/types/vue").ExtendedVue<Vue & {
             updateRenderAmount(): void;
             updateRenderNodes(isScroll?: boolean): void;
             handleTreeScroll(): void;
+            resetExpandAnimation(): void;
+            updateMiddleNodes(): void;
+            updateBeforeExpand(nodeToExpand: TreeNode): void;
+            updateAfterExpand(): void;
+            onExpandAnimationFinish(): void;
             initializeNonReactiveData(): void;
         } & {
             topSpaceStyles: object;
@@ -81,6 +98,7 @@ declare const _default: import("vue/types/vue").ExtendedVue<Vue & {
             loadingIconCls: string[];
             iframeCls: string[];
             treeNodeListeners: object;
+            noSiblingNodeMap: Record<string, true>;
         } & {
             value: string | number | TreeNodeKeyType[];
             data: {
@@ -120,6 +138,8 @@ declare const _default: import("vue/types/vue").ExtendedVue<Vue & {
             bufferNodeAmount: number;
             nodeClassName: any;
             usePadding: boolean;
+            showLine: any;
+            animation: boolean;
         } & Vue & {
             $refs: {
                 scrollArea: HTMLDivElement;
diff --git a/types/src/const/index.d.ts b/types/src/const/index.d.ts
index c0912be..9dc71c9 100644
--- a/types/src/const/index.d.ts
+++ b/types/src/const/index.d.ts
@@ -67,4 +67,15 @@ export declare enum dragHoverPartEnum {
     after = "after"
 }
 export declare type TreeNodeKeyType = string | number;
+export declare enum showLineType {
+    dashed = "dashed",
+    solid = "solid"
+}
+export interface ShowLine {
+    /** 连接线宽度，svg stroke-width， 默认 1px */
+    width?: number;
+    type?: showLineType;
+    color?: string;
+    polyline?: boolean;
+}
 export {};
diff --git a/types/src/store/tree-store.d.ts b/types/src/store/tree-store.d.ts
index 0bfb621..d875f2e 100644
--- a/types/src/store/tree-store.d.ts
+++ b/types/src/store/tree-store.d.ts
@@ -46,6 +46,12 @@ export default class TreeStore {
     /** 事件 listeners */
     private listenersMap;
     constructor(options: ITreeStoreOptions);
+    /**
+     * Use this function to insert nodes into flatData to avoid 'maximun call stack size exceeded' error
+     * @param insertIndex The index to insert, the same usage as `this.flatData.splice(insertIndex, 0, insertNodes)`
+     * @param insertNodes Tree nodes to insert
+     */
+    private insertIntoFlatData;
     setData(data: ITreeNodeOptions[], selectableUnloadKey?: TreeNodeKeyType | null, checkableUnloadKeys?: TreeNodeKeyType[] | null): void;
     /**
      * 设置单个节点多选选中

From ec4f63f191057f27c03236032a3d1af3ca7e618f Mon Sep 17 00:00:00 2001
From: ChuChencheng <azureternite@live.com>
Date: Wed, 26 Jun 2024 22:54:45 +0800
Subject: [PATCH 5/7] feat: update types

---
 types/src/components/Tree.vue.d.ts       |  6 +++---
 types/src/components/TreeDrop.vue.d.ts   | 14 +++++++-------
 types/src/components/TreeSearch.vue.d.ts | 10 +++++-----
 types/src/store/tree-store.d.ts          |  4 ++--
 4 files changed, 17 insertions(+), 17 deletions(-)

diff --git a/types/src/components/Tree.vue.d.ts b/types/src/components/Tree.vue.d.ts
index 59af091..0a72360 100644
--- a/types/src/components/Tree.vue.d.ts
+++ b/types/src/components/Tree.vue.d.ts
@@ -70,8 +70,8 @@ declare const _default: import("vue/types/vue").ExtendedVue<Vue & {
     setExpand(key: TreeNodeKeyType, value: boolean, expandParent?: boolean): void;
     setExpandKeys(keys: TreeNodeKeyType[], value: boolean): void;
     setExpandAll(value: boolean): void;
-    getCheckedNodes(ignoreMode?: "children" | "none" | "parents" | undefined): TreeNode[];
-    getCheckedKeys(ignoreMode?: "children" | "none" | "parents" | undefined): TreeNodeKeyType[];
+    getCheckedNodes(ignoreMode?: "none" | "parents" | "children" | undefined): TreeNode[];
+    getCheckedKeys(ignoreMode?: "none" | "parents" | "children" | undefined): TreeNodeKeyType[];
     getIndeterminateNodes(): TreeNode[];
     getSelectedNode(): TreeNode | null;
     getSelectedKey(): string | number | null;
@@ -189,7 +189,7 @@ declare const _default: import("vue/types/vue").ExtendedVue<Vue & {
     draggable: boolean;
     droppable: boolean;
     beforeDropMethod: (dragKey: TreeNodeKeyType, dropKey: TreeNodeKeyType, hoverPart: dragHoverPartEnum) => boolean;
-    ignoreMode: "children" | "none" | "parents";
+    ignoreMode: "none" | "parents" | "children";
     autoLoad: boolean;
     load: (node: TreeNode | null, resolve: Function, reject: Function) => any;
     render: (h: CreateElement, node: TreeNode) => VNode;
diff --git a/types/src/components/TreeDrop.vue.d.ts b/types/src/components/TreeDrop.vue.d.ts
index 3decd04..de7fb35 100644
--- a/types/src/components/TreeDrop.vue.d.ts
+++ b/types/src/components/TreeDrop.vue.d.ts
@@ -38,8 +38,8 @@ declare const _default: import("vue/types/vue").ExtendedVue<Vue & {
             setExpand: (key: TreeNodeKeyType, value: boolean, expandParent?: boolean) => void;
             setExpandKeys: (keys: TreeNodeKeyType[], value: boolean) => void;
             setExpandAll: (value: boolean) => void;
-            getCheckedNodes: (ignoreMode?: "children" | "none" | "parents" | undefined) => TreeNode[];
-            getCheckedKeys: (ignoreMode?: "children" | "none" | "parents" | undefined) => TreeNodeKeyType[];
+            getCheckedNodes: (ignoreMode?: "none" | "parents" | "children" | undefined) => TreeNode[];
+            getCheckedKeys: (ignoreMode?: "none" | "parents" | "children" | undefined) => TreeNodeKeyType[];
             getIndeterminateNodes: () => TreeNode[];
             getSelectedNode: () => TreeNode | null;
             getSelectedKey: () => string | number | null;
@@ -123,8 +123,8 @@ declare const _default: import("vue/types/vue").ExtendedVue<Vue & {
                     setExpand(key: TreeNodeKeyType, value: boolean, expandParent?: boolean): void;
                     setExpandKeys(keys: TreeNodeKeyType[], value: boolean): void;
                     setExpandAll(value: boolean): void;
-                    getCheckedNodes(ignoreMode?: "children" | "none" | "parents" | undefined): TreeNode[];
-                    getCheckedKeys(ignoreMode?: "children" | "none" | "parents" | undefined): TreeNodeKeyType[];
+                    getCheckedNodes(ignoreMode?: "none" | "parents" | "children" | undefined): TreeNode[];
+                    getCheckedKeys(ignoreMode?: "none" | "parents" | "children" | undefined): TreeNodeKeyType[];
                     getIndeterminateNodes(): TreeNode[];
                     getSelectedNode(): TreeNode | null;
                     getSelectedKey(): string | number | null;
@@ -205,7 +205,7 @@ declare const _default: import("vue/types/vue").ExtendedVue<Vue & {
                     draggable: boolean;
                     droppable: boolean;
                     beforeDropMethod: (dragKey: TreeNodeKeyType, dropKey: TreeNodeKeyType, hoverPart: import("../const").dragHoverPartEnum) => boolean;
-                    ignoreMode: "children" | "none" | "parents";
+                    ignoreMode: "none" | "parents" | "children";
                     autoLoad: boolean;
                     load: (node: TreeNode | null, resolve: Function, reject: Function) => any;
                     render: (h: import("vue").CreateElement, node: TreeNode) => import("vue").VNode;
@@ -274,8 +274,8 @@ declare const _default: import("vue/types/vue").ExtendedVue<Vue & {
     setExpand: (key: TreeNodeKeyType, value: boolean, expandParent?: boolean) => void;
     setExpandKeys: (keys: TreeNodeKeyType[], value: boolean) => void;
     setExpandAll: (value: boolean) => void;
-    getCheckedNodes: (ignoreMode?: "children" | "none" | "parents" | undefined) => TreeNode[];
-    getCheckedKeys: (ignoreMode?: "children" | "none" | "parents" | undefined) => TreeNodeKeyType[];
+    getCheckedNodes: (ignoreMode?: "none" | "parents" | "children" | undefined) => TreeNode[];
+    getCheckedKeys: (ignoreMode?: "none" | "parents" | "children" | undefined) => TreeNodeKeyType[];
     getIndeterminateNodes: () => TreeNode[];
     getSelectedNode: () => TreeNode | null;
     getSelectedKey: () => string | number | null;
diff --git a/types/src/components/TreeSearch.vue.d.ts b/types/src/components/TreeSearch.vue.d.ts
index ecb666d..e61d863 100644
--- a/types/src/components/TreeSearch.vue.d.ts
+++ b/types/src/components/TreeSearch.vue.d.ts
@@ -42,8 +42,8 @@ declare const _default: import("vue/types/vue").ExtendedVue<Vue & {
             setExpand(key: TreeNodeKeyType, value: boolean, expandParent?: boolean): void;
             setExpandKeys(keys: TreeNodeKeyType[], value: boolean): void;
             setExpandAll(value: boolean): void;
-            getCheckedNodes(ignoreMode?: "children" | "none" | "parents" | undefined): TreeNode[];
-            getCheckedKeys(ignoreMode?: "children" | "none" | "parents" | undefined): TreeNodeKeyType[];
+            getCheckedNodes(ignoreMode?: "none" | "parents" | "children" | undefined): TreeNode[];
+            getCheckedKeys(ignoreMode?: "none" | "parents" | "children" | undefined): TreeNodeKeyType[];
             getIndeterminateNodes(): TreeNode[];
             getSelectedNode(): TreeNode | null;
             getSelectedKey(): string | number | null;
@@ -124,7 +124,7 @@ declare const _default: import("vue/types/vue").ExtendedVue<Vue & {
             draggable: boolean;
             droppable: boolean;
             beforeDropMethod: (dragKey: TreeNodeKeyType, dropKey: TreeNodeKeyType, hoverPart: import("../const").dragHoverPartEnum) => boolean;
-            ignoreMode: "children" | "none" | "parents";
+            ignoreMode: "none" | "parents" | "children";
             autoLoad: boolean;
             load: (node: TreeNode | null, resolve: Function, reject: Function) => any;
             render: (h: import("vue").CreateElement, node: TreeNode) => import("vue").VNode;
@@ -199,8 +199,8 @@ declare const _default: import("vue/types/vue").ExtendedVue<Vue & {
     setExpand: (key: TreeNodeKeyType, value: boolean, expandParent?: boolean) => void;
     setExpandKeys: (keys: TreeNodeKeyType[], value: boolean) => void;
     setExpandAll: (value: boolean) => void;
-    getCheckedNodes: (ignoreMode?: "children" | "none" | "parents" | undefined) => TreeNode[];
-    getCheckedKeys: (ignoreMode?: "children" | "none" | "parents" | undefined) => TreeNodeKeyType[];
+    getCheckedNodes: (ignoreMode?: "none" | "parents" | "children" | undefined) => TreeNode[];
+    getCheckedKeys: (ignoreMode?: "none" | "parents" | "children" | undefined) => TreeNodeKeyType[];
     getIndeterminateNodes: () => TreeNode[];
     getSelectedNode: () => TreeNode | null;
     getSelectedKey: () => string | number | null;
diff --git a/types/src/store/tree-store.d.ts b/types/src/store/tree-store.d.ts
index d875f2e..f41afde 100644
--- a/types/src/store/tree-store.d.ts
+++ b/types/src/store/tree-store.d.ts
@@ -128,12 +128,12 @@ export default class TreeStore {
      * 获取多选选中节点
      * @param ignoreMode 忽略模式，可选择忽略父节点或子节点，默认值是 CTree 的 ignoreMode Prop
      */
-    getCheckedNodes(ignoreMode?: "children" | "none" | "parents" | undefined): TreeNode[];
+    getCheckedNodes(ignoreMode?: "none" | "parents" | "children" | undefined): TreeNode[];
     /**
      * 获取多选选中的节点 key ，包括未加载的 key
      * @param ignoreMode 忽略模式，同 `getCheckedNodes`
      */
-    getCheckedKeys(ignoreMode?: "children" | "none" | "parents" | undefined): TreeNodeKeyType[];
+    getCheckedKeys(ignoreMode?: "none" | "parents" | "children" | undefined): TreeNodeKeyType[];
     /**
      * 获取多选半选状态节点
      */

From 305d9eb03f0f04e38e7d9a3f9503e70a6737d471 Mon Sep 17 00:00:00 2001
From: ChuChencheng <azureternite@live.com>
Date: Sun, 22 Sep 2024 04:03:46 +0800
Subject: [PATCH 6/7] fix: DOM node key duplicate after switching to virtual
 list when animation is on

---
 package.json            |  2 +-
 src/components/Tree.vue | 11 ++++++++---
 2 files changed, 9 insertions(+), 4 deletions(-)

diff --git a/package.json b/package.json
index 4b0d3ef..a6f7120 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@wsfe/ctree",
-  "version": "2.4.0",
+  "version": "2.4.1",
   "main": "./dist/ctree.umd.min.js",
   "types": "./types",
   "description": "A vue tree component using virtual list.",
diff --git a/src/components/Tree.vue b/src/components/Tree.vue
index 3dc754b..f26fbd2 100644
--- a/src/components/Tree.vue
+++ b/src/components/Tree.vue
@@ -458,6 +458,7 @@ export default (Vue as VueConstructor<Vue & {
         ready: false,
         currentExpandState: false,
 
+        expandRenderStart: 0,
         topNodes: [] as TreeNode[],
         middleNodes: [] as TreeNode[],
         bottomNodes: [] as TreeNode[],
@@ -945,6 +946,7 @@ export default (Vue as VueConstructor<Vue & {
       this.expandAnimation.index = -1
       this.expandAnimation.level = -1
 
+      this.expandAnimation.expandRenderStart = 0
       this.expandAnimation.topNodes = []
       this.expandAnimation.middleNodes = []
       this.expandAnimation.bottomNodes = []
@@ -954,7 +956,8 @@ export default (Vue as VueConstructor<Vue & {
       const nodeToExpandLevel = this.expandAnimation.level
       const middleNodes: TreeNode[] = []
       const renderNodesLength = this.renderNodes.length
-      for (let i = this.expandAnimation.index + 1; i < renderNodesLength; i++) {
+      const expandRenderStartDiff = this.renderStart - this.expandAnimation.expandRenderStart
+      for (let i = this.expandAnimation.index - expandRenderStartDiff + 1; i < renderNodesLength; i++) {
         if (this.renderNodes[i]._level > nodeToExpandLevel) {
           middleNodes.push(this.renderNodes[i])
         } else break
@@ -974,6 +977,7 @@ export default (Vue as VueConstructor<Vue & {
         this.expandAnimation.start = true
         this.expandAnimation.currentExpandState = nodeToExpand.expand
         this.expandAnimation.nextState = !nodeToExpand.expand
+        this.expandAnimation.expandRenderStart = this.renderStart
 
         if (this.expandAnimation.nextState) {
           this.expandAnimation.bottomNodes = this.renderNodes.slice(this.expandAnimation.index + 1)
@@ -994,11 +998,12 @@ export default (Vue as VueConstructor<Vue & {
       if (this.expandAnimation.index === -1) return
 
       this.$nextTick(() => {
-        this.expandAnimation.topNodes = this.renderNodes.slice(0, this.expandAnimation.index + 1)
+        const expandRenderStartDiff = this.renderStart - this.expandAnimation.expandRenderStart
+        this.expandAnimation.topNodes = this.renderNodes.slice(0, this.expandAnimation.index - expandRenderStartDiff + 1)
         if (this.expandAnimation.nextState) {
           this.updateMiddleNodes()
         } else {
-          this.expandAnimation.bottomNodes = this.renderNodes.slice(this.expandAnimation.index + 1)
+          this.expandAnimation.bottomNodes = this.renderNodes.slice(this.expandAnimation.index - expandRenderStartDiff + 1)
         }
         this.expandAnimation.ready = true
         this.$nextTick(() => {

From 7ee51edd2d9ee0d18b99b5e7cbf3e7801d3fc0cc Mon Sep 17 00:00:00 2001
From: ChuChencheng <azureternite@live.com>
Date: Sun, 22 Sep 2024 04:05:00 +0800
Subject: [PATCH 7/7] chore: update types

---
 types/src/components/Tree.vue.d.ts       |  7 ++++---
 types/src/components/TreeDrop.vue.d.ts   | 15 ++++++++-------
 types/src/components/TreeSearch.vue.d.ts | 11 ++++++-----
 types/src/store/tree-store.d.ts          |  4 ++--
 4 files changed, 20 insertions(+), 17 deletions(-)

diff --git a/types/src/components/Tree.vue.d.ts b/types/src/components/Tree.vue.d.ts
index 0a72360..e1734a5 100644
--- a/types/src/components/Tree.vue.d.ts
+++ b/types/src/components/Tree.vue.d.ts
@@ -54,6 +54,7 @@ declare const _default: import("vue/types/vue").ExtendedVue<Vue & {
         nextState: boolean;
         ready: boolean;
         currentExpandState: boolean;
+        expandRenderStart: number;
         topNodes: TreeNode[];
         middleNodes: TreeNode[];
         bottomNodes: TreeNode[];
@@ -70,8 +71,8 @@ declare const _default: import("vue/types/vue").ExtendedVue<Vue & {
     setExpand(key: TreeNodeKeyType, value: boolean, expandParent?: boolean): void;
     setExpandKeys(keys: TreeNodeKeyType[], value: boolean): void;
     setExpandAll(value: boolean): void;
-    getCheckedNodes(ignoreMode?: "none" | "parents" | "children" | undefined): TreeNode[];
-    getCheckedKeys(ignoreMode?: "none" | "parents" | "children" | undefined): TreeNodeKeyType[];
+    getCheckedNodes(ignoreMode?: "children" | "none" | "parents" | undefined): TreeNode[];
+    getCheckedKeys(ignoreMode?: "children" | "none" | "parents" | undefined): TreeNodeKeyType[];
     getIndeterminateNodes(): TreeNode[];
     getSelectedNode(): TreeNode | null;
     getSelectedKey(): string | number | null;
@@ -189,7 +190,7 @@ declare const _default: import("vue/types/vue").ExtendedVue<Vue & {
     draggable: boolean;
     droppable: boolean;
     beforeDropMethod: (dragKey: TreeNodeKeyType, dropKey: TreeNodeKeyType, hoverPart: dragHoverPartEnum) => boolean;
-    ignoreMode: "none" | "parents" | "children";
+    ignoreMode: "children" | "none" | "parents";
     autoLoad: boolean;
     load: (node: TreeNode | null, resolve: Function, reject: Function) => any;
     render: (h: CreateElement, node: TreeNode) => VNode;
diff --git a/types/src/components/TreeDrop.vue.d.ts b/types/src/components/TreeDrop.vue.d.ts
index de7fb35..ed2d9c7 100644
--- a/types/src/components/TreeDrop.vue.d.ts
+++ b/types/src/components/TreeDrop.vue.d.ts
@@ -38,8 +38,8 @@ declare const _default: import("vue/types/vue").ExtendedVue<Vue & {
             setExpand: (key: TreeNodeKeyType, value: boolean, expandParent?: boolean) => void;
             setExpandKeys: (keys: TreeNodeKeyType[], value: boolean) => void;
             setExpandAll: (value: boolean) => void;
-            getCheckedNodes: (ignoreMode?: "none" | "parents" | "children" | undefined) => TreeNode[];
-            getCheckedKeys: (ignoreMode?: "none" | "parents" | "children" | undefined) => TreeNodeKeyType[];
+            getCheckedNodes: (ignoreMode?: "children" | "none" | "parents" | undefined) => TreeNode[];
+            getCheckedKeys: (ignoreMode?: "children" | "none" | "parents" | undefined) => TreeNodeKeyType[];
             getIndeterminateNodes: () => TreeNode[];
             getSelectedNode: () => TreeNode | null;
             getSelectedKey: () => string | number | null;
@@ -106,6 +106,7 @@ declare const _default: import("vue/types/vue").ExtendedVue<Vue & {
                         nextState: boolean;
                         ready: boolean;
                         currentExpandState: boolean;
+                        expandRenderStart: number;
                         topNodes: TreeNode[];
                         middleNodes: TreeNode[];
                         bottomNodes: TreeNode[];
@@ -123,8 +124,8 @@ declare const _default: import("vue/types/vue").ExtendedVue<Vue & {
                     setExpand(key: TreeNodeKeyType, value: boolean, expandParent?: boolean): void;
                     setExpandKeys(keys: TreeNodeKeyType[], value: boolean): void;
                     setExpandAll(value: boolean): void;
-                    getCheckedNodes(ignoreMode?: "none" | "parents" | "children" | undefined): TreeNode[];
-                    getCheckedKeys(ignoreMode?: "none" | "parents" | "children" | undefined): TreeNodeKeyType[];
+                    getCheckedNodes(ignoreMode?: "children" | "none" | "parents" | undefined): TreeNode[];
+                    getCheckedKeys(ignoreMode?: "children" | "none" | "parents" | undefined): TreeNodeKeyType[];
                     getIndeterminateNodes(): TreeNode[];
                     getSelectedNode(): TreeNode | null;
                     getSelectedKey(): string | number | null;
@@ -205,7 +206,7 @@ declare const _default: import("vue/types/vue").ExtendedVue<Vue & {
                     draggable: boolean;
                     droppable: boolean;
                     beforeDropMethod: (dragKey: TreeNodeKeyType, dropKey: TreeNodeKeyType, hoverPart: import("../const").dragHoverPartEnum) => boolean;
-                    ignoreMode: "none" | "parents" | "children";
+                    ignoreMode: "children" | "none" | "parents";
                     autoLoad: boolean;
                     load: (node: TreeNode | null, resolve: Function, reject: Function) => any;
                     render: (h: import("vue").CreateElement, node: TreeNode) => import("vue").VNode;
@@ -274,8 +275,8 @@ declare const _default: import("vue/types/vue").ExtendedVue<Vue & {
     setExpand: (key: TreeNodeKeyType, value: boolean, expandParent?: boolean) => void;
     setExpandKeys: (keys: TreeNodeKeyType[], value: boolean) => void;
     setExpandAll: (value: boolean) => void;
-    getCheckedNodes: (ignoreMode?: "none" | "parents" | "children" | undefined) => TreeNode[];
-    getCheckedKeys: (ignoreMode?: "none" | "parents" | "children" | undefined) => TreeNodeKeyType[];
+    getCheckedNodes: (ignoreMode?: "children" | "none" | "parents" | undefined) => TreeNode[];
+    getCheckedKeys: (ignoreMode?: "children" | "none" | "parents" | undefined) => TreeNodeKeyType[];
     getIndeterminateNodes: () => TreeNode[];
     getSelectedNode: () => TreeNode | null;
     getSelectedKey: () => string | number | null;
diff --git a/types/src/components/TreeSearch.vue.d.ts b/types/src/components/TreeSearch.vue.d.ts
index e61d863..ce0b135 100644
--- a/types/src/components/TreeSearch.vue.d.ts
+++ b/types/src/components/TreeSearch.vue.d.ts
@@ -25,6 +25,7 @@ declare const _default: import("vue/types/vue").ExtendedVue<Vue & {
                 nextState: boolean;
                 ready: boolean;
                 currentExpandState: boolean;
+                expandRenderStart: number;
                 topNodes: TreeNode[];
                 middleNodes: TreeNode[];
                 bottomNodes: TreeNode[];
@@ -42,8 +43,8 @@ declare const _default: import("vue/types/vue").ExtendedVue<Vue & {
             setExpand(key: TreeNodeKeyType, value: boolean, expandParent?: boolean): void;
             setExpandKeys(keys: TreeNodeKeyType[], value: boolean): void;
             setExpandAll(value: boolean): void;
-            getCheckedNodes(ignoreMode?: "none" | "parents" | "children" | undefined): TreeNode[];
-            getCheckedKeys(ignoreMode?: "none" | "parents" | "children" | undefined): TreeNodeKeyType[];
+            getCheckedNodes(ignoreMode?: "children" | "none" | "parents" | undefined): TreeNode[];
+            getCheckedKeys(ignoreMode?: "children" | "none" | "parents" | undefined): TreeNodeKeyType[];
             getIndeterminateNodes(): TreeNode[];
             getSelectedNode(): TreeNode | null;
             getSelectedKey(): string | number | null;
@@ -124,7 +125,7 @@ declare const _default: import("vue/types/vue").ExtendedVue<Vue & {
             draggable: boolean;
             droppable: boolean;
             beforeDropMethod: (dragKey: TreeNodeKeyType, dropKey: TreeNodeKeyType, hoverPart: import("../const").dragHoverPartEnum) => boolean;
-            ignoreMode: "none" | "parents" | "children";
+            ignoreMode: "children" | "none" | "parents";
             autoLoad: boolean;
             load: (node: TreeNode | null, resolve: Function, reject: Function) => any;
             render: (h: import("vue").CreateElement, node: TreeNode) => import("vue").VNode;
@@ -199,8 +200,8 @@ declare const _default: import("vue/types/vue").ExtendedVue<Vue & {
     setExpand: (key: TreeNodeKeyType, value: boolean, expandParent?: boolean) => void;
     setExpandKeys: (keys: TreeNodeKeyType[], value: boolean) => void;
     setExpandAll: (value: boolean) => void;
-    getCheckedNodes: (ignoreMode?: "none" | "parents" | "children" | undefined) => TreeNode[];
-    getCheckedKeys: (ignoreMode?: "none" | "parents" | "children" | undefined) => TreeNodeKeyType[];
+    getCheckedNodes: (ignoreMode?: "children" | "none" | "parents" | undefined) => TreeNode[];
+    getCheckedKeys: (ignoreMode?: "children" | "none" | "parents" | undefined) => TreeNodeKeyType[];
     getIndeterminateNodes: () => TreeNode[];
     getSelectedNode: () => TreeNode | null;
     getSelectedKey: () => string | number | null;
diff --git a/types/src/store/tree-store.d.ts b/types/src/store/tree-store.d.ts
index f41afde..d875f2e 100644
--- a/types/src/store/tree-store.d.ts
+++ b/types/src/store/tree-store.d.ts
@@ -128,12 +128,12 @@ export default class TreeStore {
      * 获取多选选中节点
      * @param ignoreMode 忽略模式，可选择忽略父节点或子节点，默认值是 CTree 的 ignoreMode Prop
      */
-    getCheckedNodes(ignoreMode?: "none" | "parents" | "children" | undefined): TreeNode[];
+    getCheckedNodes(ignoreMode?: "children" | "none" | "parents" | undefined): TreeNode[];
     /**
      * 获取多选选中的节点 key ，包括未加载的 key
      * @param ignoreMode 忽略模式，同 `getCheckedNodes`
      */
-    getCheckedKeys(ignoreMode?: "none" | "parents" | "children" | undefined): TreeNodeKeyType[];
+    getCheckedKeys(ignoreMode?: "children" | "none" | "parents" | undefined): TreeNodeKeyType[];
     /**
      * 获取多选半选状态节点
      */
