cnhis-design-vue 3.1.8-beta.2 → 3.1.8-beta.5

package/es/packages/select-person/src/SelectPerson.vue_vue_type_script_setup_true_lang.mjs

@@ -21,6 +21,7 @@ const _hoisted_6 = {
   class: "people-tree-item tags-box"
 };
 var script = /* @__PURE__ */ defineComponent({
+  name: "SelectPerson",
   props: {
     visible: {
       type: Boolean,
@@ -507,35 +508,17 @@ var script = /* @__PURE__ */ defineComponent({
         state.treeData.main = JSON.parse(JSON.stringify(props.data));
         return;
       }
-      let copyData = JSON.parse(JSON.stringify(state.treeData.main));
-      filterTree({
+      state.expandedKeys = [];
+      let copyData = JSON.parse(JSON.stringify(props.data));
+      state.treeData.main = filterTree({
         value: state.title,
         data: copyData,
-        prop: "title"
-      });
-      const expandedKeys = [];
-      const filter_ = (tree) => {
-        var _a;
-        let arr = [];
-        if (!tree.length)
-          return [];
-        for (let i = 0; i < tree.length; i++) {
-          const v = tree[i];
-          if (v.visible) {
-            expandedKeys.push(v.key);
-            if ((_a = v.children) == null ? void 0 : _a.length) {
-              arr[i] = filter_(v.children);
-            } else {
-              arr[i] = v;
-              arr[i].children = [];
-            }
-          }
+        prop: "title",
+        filter: true,
+        callback: (child) => {
+          child.visible && state.expandedKeys.push(child.key);
         }
-        return arr;
-      };
-      state.treeData.main = filter_(copyData);
-      state.expandedKeys = expandedKeys;
-      console.log("6667", state.treeData.main, expandedKeys, state.checkedKeys.main);
+      }) || [];
     };
     const onExpand = (expandedKeys) => {
       state.expandedKeys = expandedKeys;
@@ -802,7 +785,7 @@ var script = /* @__PURE__ */ defineComponent({
     });
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", _hoisted_1, [createVNode(unref(NSpin), {
-        show: unref(state).spinning
+        show: state.spinning
       }, {
         default: withCtx(() => [createElementVNode("div", _hoisted_2, [createCommentVNode(" \u6811\u4E3B\u4F53\u4E0E\u68C0\u7D22 "), createElementVNode("div", _hoisted_3, [createVNode(unref(NInputGroup), {
           style: {
@@ -814,8 +797,8 @@ var script = /* @__PURE__ */ defineComponent({
               "text-align": "left"
             },
             clearable: "",
-            value: unref(state).title,
-            "onUpdate:value": _cache[0] || (_cache[0] = ($event) => unref(state).title = $event),
+            value: state.title,
+            "onUpdate:value": _cache[0] || (_cache[0] = ($event) => state.title = $event),
             placeholder: __props.searchPlaceholder
           }, null, 8, ["value", "placeholder"]), createVNode(unref(NButton), {
             type: "primary",
@@ -827,53 +810,53 @@ var script = /* @__PURE__ */ defineComponent({
           _: 1
         }), unref(searchTreeVisable) ? (openBlock(), createBlock(unref(NCheckbox), {
           key: 0,
-          checked: unref(state).searchChecked,
-          "onUpdate:checked": [_cache[1] || (_cache[1] = ($event) => unref(state).searchChecked = $event), radioChange],
-          indeterminate: unref(state).searchIndeterminate
+          checked: state.searchChecked,
+          "onUpdate:checked": [_cache[1] || (_cache[1] = ($event) => state.searchChecked = $event), radioChange],
+          indeterminate: state.searchIndeterminate
         }, {
           default: withCtx(() => [_hoisted_4]),
           _: 1
         }, 8, ["checked", "indeterminate"])) : (openBlock(), createBlock(unref(NCheckbox), {
           key: 1,
-          checked: unref(state).singleChecked,
-          "onUpdate:checked": [_cache[2] || (_cache[2] = ($event) => unref(state).singleChecked = $event), radioChange],
-          indeterminate: unref(state).searchIndeterminate
+          checked: state.singleChecked,
+          "onUpdate:checked": [_cache[2] || (_cache[2] = ($event) => state.singleChecked = $event), radioChange],
+          indeterminate: state.searchIndeterminate
         }, {
           default: withCtx(() => [_hoisted_5]),
           _: 1
         }, 8, ["checked", "indeterminate"])), createCommentVNode(' <div v-show="state.search.status == 3 || (state.search.status == 0 && state.treeData.main && state.treeData.main.length == 0)" class="no-data-tips">\n            \u67E5\u65E0\u7ED3\u679C\n          </div> '), createCommentVNode(" main tree "), withDirectives(createVNode(unref(NTree), {
           class: "main-tree-container",
-          "checked-keys": unref(state).checkedKeys.main,
-          "onUpdate:checked-keys": _cache[3] || (_cache[3] = ($event) => unref(state).checkedKeys.main = $event),
-          "expanded-keys": unref(state).expandedKeys,
+          "checked-keys": state.checkedKeys.main,
+          "onUpdate:checked-keys": _cache[3] || (_cache[3] = ($event) => state.checkedKeys.main = $event),
+          "expanded-keys": state.expandedKeys,
           checkable: "",
           cascade: "",
           "allow-checking-not-loaded": "",
           selectable: false,
-          data: unref(state).treeData.main,
+          data: state.treeData.main,
           "check-strategy": __props.queryMainTreeData ? "all" : "child",
           "onUpdate:expandedKeys": onExpand,
           "on-load": onLoadData,
           "render-label": renderLabel
-        }, null, 8, ["checked-keys", "expanded-keys", "data", "check-strategy"]), [[vShow, unref(state).search.status == 0]]), createCommentVNode(" search tree "), createVNode(script$1, mergeProps(_ctx.$attrs, {
+        }, null, 8, ["checked-keys", "expanded-keys", "data", "check-strategy"]), [[vShow, state.search.status == 0]]), createCommentVNode(" search tree "), createVNode(script$1, mergeProps(_ctx.$attrs, {
           ref_key: "searchTree",
           ref: searchTree,
           visible: unref(searchTreeVisable),
-          formatTreeData: unref(state).treeData.search,
-          searchValue: unref(state).searchValue,
-          allCheckedKeys: unref(state).checkedKeys,
-          defaultExpandedKeys: unref(state).search.defaultExpandedKeys,
-          dataListKeys: unref(state).search.dataListKeys,
-          searchNoMore: unref(state).searchNoMore,
-          loadMorenLoadinng: unref(state).loadMorenLoadinng,
+          formatTreeData: state.treeData.search,
+          searchValue: state.searchValue,
+          allCheckedKeys: state.checkedKeys,
+          defaultExpandedKeys: state.search.defaultExpandedKeys,
+          dataListKeys: state.search.dataListKeys,
+          searchNoMore: state.searchNoMore,
+          loadMorenLoadinng: state.loadMorenLoadinng,
           onAddCheckedkeysMain: addCheckedkeysMain,
           onRemoveCheckedkeysMain: removeCheckedkeysMain,
           onAddCheckedkeysOther: addCheckedkeysOther,
           onRemoveCheckedkeysOther: removeCheckedkeysOther,
           onSearchOnloadMore: searchOnloadMore
-        }), null, 16, ["visible", "formatTreeData", "searchValue", "allCheckedKeys", "defaultExpandedKeys", "dataListKeys", "searchNoMore", "loadMorenLoadinng"])]), createCommentVNode(" \u6811\u5DF2\u9009\u7684\u6570\u636E "), createElementVNode("div", _hoisted_6, [unref(state).defaultShowList && unref(state).defaultShowList.length ? renderSlot(_ctx.$slots, "default", {
+        }), null, 16, ["visible", "formatTreeData", "searchValue", "allCheckedKeys", "defaultExpandedKeys", "dataListKeys", "searchNoMore", "loadMorenLoadinng"])]), createCommentVNode(" \u6811\u5DF2\u9009\u7684\u6570\u636E "), createElementVNode("div", _hoisted_6, [state.defaultShowList && state.defaultShowList.length ? renderSlot(_ctx.$slots, "default", {
           key: 0
-        }, () => [(openBlock(true), createElementBlock(Fragment, null, renderList(unref(state).defaultShowList, (tag, i) => {
+        }, () => [(openBlock(true), createElementBlock(Fragment, null, renderList(state.defaultShowList, (tag, i) => {
           return openBlock(), createElementBlock("div", {
             class: "tag-item def-item",
             key: i

package/es/packages/select-person/src/utils/index.d.ts

@@ -1,4 +1,4 @@
-export function filterTree({ value, data, prop, filter, filterXor, children, visible, filterChildren, callback }: {
+export declare const filterTree: ({ value, data, prop, filter, filterXor, children, visible, filterChildren, callback }: {
     value?: string | undefined;
     data?: any[] | undefined;
     prop?: string | undefined;
@@ -7,6 +7,6 @@ export function filterTree({ value, data, prop, filter, filterXor, children, vis
     children?: string | undefined;
     visible?: string | undefined;
     filterChildren?: boolean | undefined;
-    callback?: null | undefined;
-}): any;
-export function deepTraversalFirst(node: any, nodeList?: any[]): any[];
+    callback?: Function | undefined;
+}) => any[] | undefined;
+export declare const deepTraversalFirst: (node: any, nodeList?: any[]) => any[];

package/es/packages/select-person/src/utils/index2.mjs

@@ -1,4 +1,14 @@
-const filterTree = ({ value = "", data = [], prop = "title", filter = false, filterXor = false, children = "children", visible = "visible", filterChildren = true, callback = null }) => {
+const filterTree = ({
+  value = "",
+  data = [],
+  prop = "title",
+  filter = false,
+  filterXor = false,
+  children = "children",
+  visible = "visible",
+  filterChildren = true,
+  callback
+}) => {
   visible = visible || "visible";
   children = children || "children";
   prop = prop || "text";
@@ -12,9 +22,9 @@ const filterTree = ({ value = "", data = [], prop = "title", filter = false, fil
   const traverse = function(node) {
     const childNodes = node[children] || [];
     childNodes.forEach((child) => {
-      callback && callback(child);
-      child[visible] = !node.root && !filterChildren && node[visible] || filterNodeMethod.call(child, value, child, prop);
+      child[visible] = !node.root && !filterChildren && node[visible] || filterNodeMethod.call(child, value, child);
       traverse(child);
+      callback && callback(child);
     });
     if (!node[visible] && childNodes.length) {
       let allHidden = true;
@@ -31,10 +41,14 @@ const filterTree = ({ value = "", data = [], prop = "title", filter = false, fil
     let copyData = data.slice();
     let filterHandle = (filterData) => {
       return filterData.filter((item, index) => {
+        var _a;
         if (item[visible]) {
           if (item[children]) {
             item[children] = filterHandle(item[children]);
           }
+          if (!((_a = item[children]) == null ? void 0 : _a.length)) {
+            item[children] = void 0;
+          }
           return true;
         }
         return false;

package/es/packages/select-person/style/index.less

@@ -1,229 +1,229 @@
-@primary-color: #5585f5;
-.people-tree {
-  display: flex;
-
-  .people-tree-item {
-    width: 50%;
-    padding: 22px 12px 0;
-    max-height: 376px;
-    height: 376px;
-    overflow-y: auto;
-
-    &.people-tree-left {
-      display: flex;
-      flex-direction: column;
-    }
-
-    &:first-child {
-      border-right: 1px solid #e8e8e8;
-    }
-
-    .tag-item {
-      &.isRoot {
-        background: rgba(@primary-color, 0.08);
-        border: 1px solid rgba(@primary-color, 0.5);
-        color: @primary-color;
-
-        .tag-close {
-          color: @primary-color;
-
-          &:hover {
-            color: rgba(@primary-color, 0.6);
-          }
-        }
-
-      }
-
-      box-sizing: border-box;
-      color: #212121;
-      font-size: 14px;
-      list-style: none;
-      display: inline-flex;
-      align-items: center;
-      height: 24px;
-      line-height: 24px;
-      margin-right: 8px;
-      margin-bottom: 4px;
-      padding: 0 6px;
-      white-space: nowrap;
-      background: rgba(#d5d5d5, 0.2);
-      border: 1px solid rgba(#000000, 0.14);
-      border-radius: 4px;
-      transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
-
-      .tag-close {
-        &:hover {
-          color: rgba(@primary-color, 0.6);
-        }
-
-        &:active {
-          color: #fff;
-        }
-
-        display: inline-block;
-        font-size: 14px;
-        margin-left: 3px;
-        color: #969696;
-        font-weight: 700;
-        cursor: pointer;
-        transition: all 0.3s;
-      }
-    }
-
-    .no-data-tips {
-      height: 200px;
-      width: 100%;
-      display: flex;
-      justify-content: center;
-      align-items: center;
-      font-size: 16px;
-      font-weight: 700;
-    }
-
-    .c-title {
-      font-size: 14px;
-      font-family: PingFangSC-Regular, PingFang SC;
-      font-weight: 400;
-      color: #212121;
-    }
-
-    .c-sub-title {
-      font-size: 12px;
-      font-family: PingFangSC-Regular, PingFang SC;
-      color: #4e4e4e;
-    }
-
-    .p-title {
-      font-size: 14px;
-      font-family: PingFangSC-Medium, PingFang SC;
-      font-weight: 500;
-      color: #212121;
-    }
-
-    &.tags-box {
-      display: flex;
-      flex-wrap: wrap;
-      justify-content: flex-start;
-      align-items: flex-start;
-      align-content: flex-start;
-    }
-  }
-}
-
-.df {
-  display: flex;
-}
-
-.search-input-icon {
-  color: rgba(0, 0, 0, 0.4);
-  margin-bottom: -2px;
-}
-
-.main-tree-container {
-  overflow-y: auto;
-}
-
-.df {
-  display: flex;
-}
-
-.search-tree-wrap {
-  .search-tree-item {
-    display: flex;
-    align-items: center;
-  }
-
-  .name-wrap {
-    width: 48px;
-    height: 48px;
-    background: #7d88b5;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    border-radius: 50%;
-    margin-right: 13px;
-
-    .name {
-      font-size: 16px;
-      color: #ffffff;
-      margin-bottom: 0;
-      line-height: 16px;
-    }
-  }
-
-  .info-wrap {
-    overflow: hidden;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-    display: flex;
-    flex-direction: column;
-  }
-
-  .info-wrap-top {
-    align-items: flex-end;
-    margin: 0;
-    margin-bottom: 1px;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-  }
-
-  .info-wrap-title {
-    margin-bottom: 0;
-    font-size: 16px;
-    font-family: PingFangSC-Regular, PingFang SC;
-    font-weight: 400;
-    color: #4e4e4e;
-    line-height: 16px;
-
-    .c-title {
-      font-size: 14px;
-      font-family: PingFangSC-Regular, PingFang SC;
-      font-weight: 400;
-      color: #212121;
-    }
-
-    .c-sub-title {
-      font-size: 12px;
-      font-family: PingFangSC-Regular, PingFang SC;
-      color: #4e4e4e;
-    }
-  }
-
-  .info-wrap-desc {
-    margin-left: 10px;
-    margin-bottom: 0;
-    font-size: 12px;
-    line-height: 17px;
-    color: #aeaeae;
-  }
-
-  .info-wrap-position {
-    margin-bottom: 0;
-    font-size: 12px;
-    color: #7d88b5;
-    line-height: 17px;
-  }
-}
-
-.load-more-btn-wrap {
-  display: flex;
-  justify-content: center;
-  height: 35px;
-  line-height: 35px;
-  cursor: pointer;
-  padding-top: 10px;
-  box-sizing: border-box;
-
-  .search-input-icon {
-    font-size: 16px;
-    color: rgba(0, 0, 0, 0.4);
-    margin-right: 14px;
-  }
-
-  .load-more-btn {
-    font-size: 12px;
-    color: #747c8e;
-    line-height: 12px;
-  }
-}
+@primary-color: #5585f5;
+.people-tree {
+  display: flex;
+
+  .people-tree-item {
+    width: 50%;
+    padding: 22px 12px 0;
+    max-height: 376px;
+    height: 376px;
+    overflow-y: auto;
+
+    &.people-tree-left {
+      display: flex;
+      flex-direction: column;
+    }
+
+    &:first-child {
+      border-right: 1px solid #e8e8e8;
+    }
+
+    .tag-item {
+      &.isRoot {
+        background: rgba(@primary-color, 0.08);
+        border: 1px solid rgba(@primary-color, 0.5);
+        color: @primary-color;
+
+        .tag-close {
+          color: @primary-color;
+
+          &:hover {
+            color: rgba(@primary-color, 0.6);
+          }
+        }
+
+      }
+
+      box-sizing: border-box;
+      color: #212121;
+      font-size: 14px;
+      list-style: none;
+      display: inline-flex;
+      align-items: center;
+      height: 24px;
+      line-height: 24px;
+      margin-right: 8px;
+      margin-bottom: 4px;
+      padding: 0 6px;
+      white-space: nowrap;
+      background: rgba(#d5d5d5, 0.2);
+      border: 1px solid rgba(#000000, 0.14);
+      border-radius: 4px;
+      transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
+
+      .tag-close {
+        &:hover {
+          color: rgba(@primary-color, 0.6);
+        }
+
+        &:active {
+          color: #fff;
+        }
+
+        display: inline-block;
+        font-size: 14px;
+        margin-left: 3px;
+        color: #969696;
+        font-weight: 700;
+        cursor: pointer;
+        transition: all 0.3s;
+      }
+    }
+
+    .no-data-tips {
+      height: 200px;
+      width: 100%;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      font-size: 16px;
+      font-weight: 700;
+    }
+
+    .c-title {
+      font-size: 14px;
+      font-family: PingFangSC-Regular, PingFang SC;
+      font-weight: 400;
+      color: #212121;
+    }
+
+    .c-sub-title {
+      font-size: 12px;
+      font-family: PingFangSC-Regular, PingFang SC;
+      color: #4e4e4e;
+    }
+
+    .p-title {
+      font-size: 14px;
+      font-family: PingFangSC-Medium, PingFang SC;
+      font-weight: 500;
+      color: #212121;
+    }
+
+    &.tags-box {
+      display: flex;
+      flex-wrap: wrap;
+      justify-content: flex-start;
+      align-items: flex-start;
+      align-content: flex-start;
+    }
+  }
+}
+
+.df {
+  display: flex;
+}
+
+.search-input-icon {
+  color: rgba(0, 0, 0, 0.4);
+  margin-bottom: -2px;
+}
+
+.main-tree-container {
+  overflow-y: auto;
+}
+
+.df {
+  display: flex;
+}
+
+.search-tree-wrap {
+  .search-tree-item {
+    display: flex;
+    align-items: center;
+  }
+
+  .name-wrap {
+    width: 48px;
+    height: 48px;
+    background: #7d88b5;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    border-radius: 50%;
+    margin-right: 13px;
+
+    .name {
+      font-size: 16px;
+      color: #ffffff;
+      margin-bottom: 0;
+      line-height: 16px;
+    }
+  }
+
+  .info-wrap {
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    display: flex;
+    flex-direction: column;
+  }
+
+  .info-wrap-top {
+    align-items: flex-end;
+    margin: 0;
+    margin-bottom: 1px;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+
+  .info-wrap-title {
+    margin-bottom: 0;
+    font-size: 16px;
+    font-family: PingFangSC-Regular, PingFang SC;
+    font-weight: 400;
+    color: #4e4e4e;
+    line-height: 16px;
+
+    .c-title {
+      font-size: 14px;
+      font-family: PingFangSC-Regular, PingFang SC;
+      font-weight: 400;
+      color: #212121;
+    }
+
+    .c-sub-title {
+      font-size: 12px;
+      font-family: PingFangSC-Regular, PingFang SC;
+      color: #4e4e4e;
+    }
+  }
+
+  .info-wrap-desc {
+    margin-left: 10px;
+    margin-bottom: 0;
+    font-size: 12px;
+    line-height: 17px;
+    color: #aeaeae;
+  }
+
+  .info-wrap-position {
+    margin-bottom: 0;
+    font-size: 12px;
+    color: #7d88b5;
+    line-height: 17px;
+  }
+}
+
+.load-more-btn-wrap {
+  display: flex;
+  justify-content: center;
+  height: 35px;
+  line-height: 35px;
+  cursor: pointer;
+  padding-top: 10px;
+  box-sizing: border-box;
+
+  .search-input-icon {
+    font-size: 16px;
+    color: rgba(0, 0, 0, 0.4);
+    margin-right: 14px;
+  }
+
+  .load-more-btn {
+    font-size: 12px;
+    color: #747c8e;
+    line-height: 12px;
+  }
+}