widget.qw 1.0.21 → 1.0.23

package/build/style.css

@@ -709,25 +709,25 @@
   margin:3px;
 }
 
-.cascader-pop[data-v-38ba675f] {
+.cascader-pop[data-v-c97110e4] {
     width: 100%;
     overflow: hidden;
 }
-.cascader-selector[data-v-38ba675f] {
+.cascader-selector[data-v-c97110e4] {
     padding: 10px;
 }
-.search-buttons[data-v-38ba675f] {
+.search-buttons[data-v-c97110e4] {
     display: flex;
     gap: 10px;
 }
-.clear-btn[data-v-38ba675f] {
+.clear-btn[data-v-c97110e4] {
     background-color: #f2f3f5;
     border: none;
     border-radius: 4px;
     padding: 4px 8px;
     font-size: 14px;
 }
-.confirm-btn[data-v-38ba675f] {
+.confirm-btn[data-v-c97110e4] {
     background-color: #1989fa;
     color: white;
     border: none;
@@ -735,19 +735,19 @@
     padding: 4px 8px;
     font-size: 14px;
 }
-.no-results[data-v-38ba675f] {
+.no-results[data-v-c97110e4] {
     text-align: center;
     padding: 20px;
     color: #969799;
 }
-.cascader-header[data-v-38ba675f] {
+.cascader-header[data-v-c97110e4] {
     padding: 10px;
     border-bottom: 1px solid #ebedf0;
     display: flex;
     justify-content: space-between;
     align-items: center;
 }
-.current-path[data-v-38ba675f] {
+.current-path[data-v-c97110e4] {
     flex: 1;
     font-size: 14px;
     color: #323233;
@@ -755,25 +755,25 @@
     overflow: hidden;
     text-overflow: ellipsis;
 }
-.header-right[data-v-38ba675f] {
+.header-right[data-v-c97110e4] {
     display: flex;
     gap: 8px;
     margin-left: auto;
 }
-.cancel-btn[data-v-38ba675f] {
+.cancel-btn[data-v-c97110e4] {
     color: #969799;
     margin-right: 5px;
 }
-.scroll-container[data-v-38ba675f] {
+.scroll-container[data-v-c97110e4] {
     height: calc(80vh - 150px);
     overflow-y: auto;
 }
-.cell-content[data-v-38ba675f] {
+.cell-content[data-v-c97110e4] {
     display: flex;
     align-items: center;
     gap: 12px;
 }
-.circle-selector[data-v-38ba675f] {
+.circle-selector[data-v-c97110e4] {
     width: 20px;
     height: 20px;
     border-radius: 50%;
@@ -783,29 +783,29 @@
     transition: all 0.2s;
     flex-shrink: 0;
 }
-.circle-selector.selected[data-v-38ba675f] {
+.circle-selector.selected[data-v-c97110e4] {
     background-color: #1989fa;
     border-color: #1989fa;
 }
-.circle-selector.selected .van-icon[data-v-38ba675f] {
+.circle-selector.selected .van-icon[data-v-c97110e4] {
     color: white;
     font-size: 14px;
 }
-.van-cell__right-icon[data-v-38ba675f] {
+.van-cell__right-icon[data-v-c97110e4] {
     color: #969799;
     font-size: 16px;
     margin-left: 8px;
 }
-.name[data-v-38ba675f] {
+.name[data-v-c97110e4] {
     flex: 1;
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
 }
-.cancel-btn[data-v-38ba675f] {
+.cancel-btn[data-v-c97110e4] {
     color: #969799;
 }
-.search-field[data-v-38ba675f] {
+.search-field[data-v-c97110e4] {
     background: #fff;
     padding: 10px 16px;
     border-bottom: 1px solid #ebedf0;

package/build/widget.qw.es.js

@@ -20279,7 +20279,7 @@ const _sfc_main$3 = {
   }
 };
 var TreePicker = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["__scopeId", "data-v-6744b874"]]);
-var CascaderPop_vue_vue_type_style_index_0_scoped_true_lang = /* @__PURE__ */ (() => "\n.cascader-pop[data-v-38ba675f] {\r\n    width: 100%;\r\n    overflow: hidden;\n}\n.cascader-selector[data-v-38ba675f] {\r\n    padding: 10px;\n}\n.search-buttons[data-v-38ba675f] {\r\n    display: flex;\r\n    gap: 10px;\n}\n.clear-btn[data-v-38ba675f] {\r\n    background-color: #f2f3f5;\r\n    border: none;\r\n    border-radius: 4px;\r\n    padding: 4px 8px;\r\n    font-size: 14px;\n}\n.confirm-btn[data-v-38ba675f] {\r\n    background-color: #1989fa;\r\n    color: white;\r\n    border: none;\r\n    border-radius: 4px;\r\n    padding: 4px 8px;\r\n    font-size: 14px;\n}\n.no-results[data-v-38ba675f] {\r\n    text-align: center;\r\n    padding: 20px;\r\n    color: #969799;\n}\n.cascader-header[data-v-38ba675f] {\r\n    padding: 10px;\r\n    border-bottom: 1px solid #ebedf0;\r\n    display: flex;\r\n    justify-content: space-between;\r\n    align-items: center;\n}\n.current-path[data-v-38ba675f] {\r\n    flex: 1;\r\n    font-size: 14px;\r\n    color: #323233;\r\n    white-space: nowrap;\r\n    overflow: hidden;\r\n    text-overflow: ellipsis;\n}\n.header-right[data-v-38ba675f] {\r\n    display: flex;\r\n    gap: 8px;\r\n    margin-left: auto;\n}\n.cancel-btn[data-v-38ba675f] {\r\n    color: #969799;\r\n    margin-right: 5px;\n}\n.scroll-container[data-v-38ba675f] {\r\n    height: calc(80vh - 150px);\r\n    overflow-y: auto;\n}\n.cell-content[data-v-38ba675f] {\r\n    display: flex;\r\n    align-items: center;\r\n    gap: 12px;\n}\n.circle-selector[data-v-38ba675f] {\r\n    width: 20px;\r\n    height: 20px;\r\n    border-radius: 50%;\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    transition: all 0.2s;\r\n    flex-shrink: 0;\n}\n.circle-selector.selected[data-v-38ba675f] {\r\n    background-color: #1989fa;\r\n    border-color: #1989fa;\n}\n.circle-selector.selected .van-icon[data-v-38ba675f] {\r\n    color: white;\r\n    font-size: 14px;\n}\n.van-cell__right-icon[data-v-38ba675f] {\r\n    color: #969799;\r\n    font-size: 16px;\r\n    margin-left: 8px;\n}\n.name[data-v-38ba675f] {\r\n    flex: 1;\r\n    overflow: hidden;\r\n    text-overflow: ellipsis;\r\n    white-space: nowrap;\n}\n.cancel-btn[data-v-38ba675f] {\r\n    color: #969799;\n}\n.search-field[data-v-38ba675f] {\r\n    background: #fff;\r\n    padding: 10px 16px;\r\n    border-bottom: 1px solid #ebedf0;\r\n    position: sticky;\r\n    top: 0;\r\n    z-index: 999;\r\n    margin-bottom: 10px;\r\n    flex-shrink: 0;\r\n    /* \u9632\u6B62\u538B\u7F29 */\n}\r\n")();
+var CascaderPop_vue_vue_type_style_index_0_scoped_true_lang = /* @__PURE__ */ (() => "\n.cascader-pop[data-v-c97110e4] {\r\n    width: 100%;\r\n    overflow: hidden;\n}\n.cascader-selector[data-v-c97110e4] {\r\n    padding: 10px;\n}\n.search-buttons[data-v-c97110e4] {\r\n    display: flex;\r\n    gap: 10px;\n}\n.clear-btn[data-v-c97110e4] {\r\n    background-color: #f2f3f5;\r\n    border: none;\r\n    border-radius: 4px;\r\n    padding: 4px 8px;\r\n    font-size: 14px;\n}\n.confirm-btn[data-v-c97110e4] {\r\n    background-color: #1989fa;\r\n    color: white;\r\n    border: none;\r\n    border-radius: 4px;\r\n    padding: 4px 8px;\r\n    font-size: 14px;\n}\n.no-results[data-v-c97110e4] {\r\n    text-align: center;\r\n    padding: 20px;\r\n    color: #969799;\n}\n.cascader-header[data-v-c97110e4] {\r\n    padding: 10px;\r\n    border-bottom: 1px solid #ebedf0;\r\n    display: flex;\r\n    justify-content: space-between;\r\n    align-items: center;\n}\n.current-path[data-v-c97110e4] {\r\n    flex: 1;\r\n    font-size: 14px;\r\n    color: #323233;\r\n    white-space: nowrap;\r\n    overflow: hidden;\r\n    text-overflow: ellipsis;\n}\n.header-right[data-v-c97110e4] {\r\n    display: flex;\r\n    gap: 8px;\r\n    margin-left: auto;\n}\n.cancel-btn[data-v-c97110e4] {\r\n    color: #969799;\r\n    margin-right: 5px;\n}\n.scroll-container[data-v-c97110e4] {\r\n    height: calc(80vh - 150px);\r\n    overflow-y: auto;\n}\n.cell-content[data-v-c97110e4] {\r\n    display: flex;\r\n    align-items: center;\r\n    gap: 12px;\n}\n.circle-selector[data-v-c97110e4] {\r\n    width: 20px;\r\n    height: 20px;\r\n    border-radius: 50%;\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    transition: all 0.2s;\r\n    flex-shrink: 0;\n}\n.circle-selector.selected[data-v-c97110e4] {\r\n    background-color: #1989fa;\r\n    border-color: #1989fa;\n}\n.circle-selector.selected .van-icon[data-v-c97110e4] {\r\n    color: white;\r\n    font-size: 14px;\n}\n.van-cell__right-icon[data-v-c97110e4] {\r\n    color: #969799;\r\n    font-size: 16px;\r\n    margin-left: 8px;\n}\n.name[data-v-c97110e4] {\r\n    flex: 1;\r\n    overflow: hidden;\r\n    text-overflow: ellipsis;\r\n    white-space: nowrap;\n}\n.cancel-btn[data-v-c97110e4] {\r\n    color: #969799;\n}\n.search-field[data-v-c97110e4] {\r\n    background: #fff;\r\n    padding: 10px 16px;\r\n    border-bottom: 1px solid #ebedf0;\r\n    position: sticky;\r\n    top: 0;\r\n    z-index: 999;\r\n    margin-bottom: 10px;\r\n    flex-shrink: 0;\r\n    /* \u9632\u6B62\u538B\u7F29 */\n}\r\n")();
 const _hoisted_1$1 = {
   class: "cascader-selector"
 };
@@ -20322,26 +20322,18 @@ const _sfc_main$2 = {
       type: String,
       default: ""
     },
-    queryNodes: {
+    keywordQueryNode: {
       type: Function,
       default: () => {
       }
     },
-    queryNode: {
+    idQueryNode: {
       type: Function,
       default: () => {
       }
-    },
-    minLevel: {
-      type: Number,
-      default: 0
-    },
-    maxLevel: {
-      type: Number,
-      default: 9999
     }
   },
-  emits: ["update:show", "select"],
+  emits: ["update:modelValue", "update:show", "select"],
   setup(__props, {
     emit
   }) {
@@ -20349,57 +20341,52 @@ const _sfc_main$2 = {
     const show = useVModel(props, "show", emit);
     const modelValue = useVModel(props, "modelValue", emit);
     const data2 = reactive({
-      totalNodes: [],
+      parentNode: null,
       keyword: "",
-      currentNode: null,
       selectedNodeId: ""
     });
-    const canSelect = (node) => {
-      return node.canCheck && node.level >= props.minLevel && node.level <= props.maxLevel;
-    };
+    onMounted(() => {
+      props.idQueryNode({
+        id: "",
+        isReturnParent: true
+      }, (node) => {
+        data2.parentNode = node;
+      });
+    });
     const optionNodes = computed(() => {
       var _a;
-      if (data2.currentNode)
-        return ((_a = data2.currentNode) == null ? void 0 : _a.children) ? data2.currentNode.children : [];
-      else
-        return data2.totalNodes ? data2.totalNodes : [];
+      return ((_a = data2.parentNode) == null ? void 0 : _a.children) ? data2.parentNode.children : [];
     });
     const pathsLabel = computed(() => {
-      if (!data2.currentNode || !data2.currentNode.id)
-        return "";
-      let paths = util.findPaths(data2.currentNode.id, data2.totalNodes);
-      console.log("paths", paths);
-      let res = paths.map((item) => item.label).join("/");
-      return res;
+      var _a;
+      return ((_a = data2.parentNode) == null ? void 0 : _a.path) ? data2.parentNode.path : "";
     });
-    const queryTotalNodes = () => __async(this, null, function* () {
-      yield props.queryNodes({
+    const keywordQueryNode = () => {
+      props.keywordQueryNode({
         keyword: data2.keyword,
-        parentId: ""
-      }, (nodes) => {
-        data2.totalNodes = nodes;
+        isReturnParent: true
+      }, (node) => {
+        data2.parentNode = node;
       });
-    });
-    const onSearch = () => __async(this, null, function* () {
-      yield props.queryNodes({
-        keyword: data2.keyword,
-        parentId: ""
-      }, (nodes) => {
-        data2.totalNodes = nodes;
-        data2.currentNode = null;
-      });
-    });
+    };
+    const onSearch = () => {
+      keywordQueryNode();
+    };
     const onBack = () => {
-      if (!data2.currentNode || !data2.currentNode.id)
+      if (!data2.parentNode || !data2.parentNode.parentId)
         return;
       data2.keyword = "";
-      data2.currentNode = util.findParent(data2.currentNode.id, data2.totalNodes);
+      props.idQueryNode({
+        id: data2.parentNode.parentId,
+        isReturnParent: true
+      }, (node) => {
+        data2.parentNode = node;
+      });
     };
     const onClear = () => {
       data2.keyword = "";
     };
     const reset = () => {
-      data2.currentNode = null;
       data2.keyword = "";
     };
     const onSubmit = () => {
@@ -20407,9 +20394,7 @@ const _sfc_main$2 = {
         util.warnToast("\u8BF7\u9009\u62E9");
         return;
       }
-      let selectedNode = util.findNode(data2.selectedNodeId, data2.totalNodes);
-      modelValue.value = selectedNode.id;
-      emit("select", selectedNode);
+      modelValue.value = data2.selectedNodeId;
       show.value = false;
       reset();
     };
@@ -20424,27 +20409,37 @@ const _sfc_main$2 = {
         data2.selectedNodeId = node.id;
     };
     const onNextLevel = (node) => {
-      props.queryNodes({
-        keyword: data2.keyword,
-        parentId: node.id
-      }, (nodes) => {
-        node.children = nodes;
-        data2.currentNode = node;
+      props.idQueryNode({
+        id: node.id,
+        isReturnParent: false
+      }, (node2) => {
+        data2.parentNode = node2;
       });
     };
     onMounted(() => __async(this, null, function* () {
-      yield queryTotalNodes();
+      props.idQueryNode({
+        id: "",
+        isReturnParent: true
+      }, (node) => {
+        data2.parentNode = node;
+      });
     }));
-    watch(() => props.modelValue, () => {
-      data2.currentNode = util.findParent(props.modelValue, data2.totalNodes);
-    }, {
+    watch(() => modelValue.value, (n, o) => __async(this, null, function* () {
+      data2.selectedNodeId = modelValue.value;
+      let params = {};
+      params.id = modelValue.value;
+      params.isReturnParent = true;
+      params.hasChildren = true;
+      yield props.idQueryNode(params, (node) => {
+        data2.parentNode = node;
+        if (!modelValue.value)
+          return;
+        let childNode = util.findNode(modelValue.value, data2.parentNode.children);
+        emit("select", childNode);
+      });
+    }), {
       immediate: true
     });
-    watch(() => props.show, () => {
-      if (!props.show)
-        return;
-      queryTotalNodes();
-    });
     return (_ctx, _cache) => {
       const _component_van_button = resolveComponent("van-button");
       const _component_van_search = resolveComponent("van-search");
@@ -20496,7 +20491,7 @@ const _sfc_main$2 = {
             return openBlock(), createBlock(_component_van_cell, {
               key: i
             }, createSlots({
-              title: withCtx(() => [createElementVNode("div", _hoisted_9, [canSelect(item) ? (openBlock(), createElementBlock("div", {
+              title: withCtx(() => [createElementVNode("div", _hoisted_9, [item.canCheck ? (openBlock(), createElementBlock("div", {
                 key: 0,
                 class: "circle-selector",
                 onClick: withModifiers(($event) => onToggle(item), ["stop"])
@@ -20512,7 +20507,7 @@ const _sfc_main$2 = {
                 color: "#e0e0e0"
               })) : createCommentVNode("", true)], 8, _hoisted_10)) : createCommentVNode("", true), createElementVNode("span", _hoisted_11, toDisplayString(item.label), 1)])]),
               _: 2
-            }, [item.hasChildren && item.level < props.maxLevel ? {
+            }, [item.hasChildren && item.canExpand ? {
               name: "right-icon",
               fn: withCtx(() => [createVNode(_component_van_icon, {
                 name: "arrow",
@@ -20527,7 +20522,7 @@ const _sfc_main$2 = {
     };
   }
 };
-var CascaderPop = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__scopeId", "data-v-38ba675f"]]);
+var CascaderPop = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__scopeId", "data-v-c97110e4"]]);
 const _sfc_main$1 = {
   __name: "CascaderPicker",
   props: {
@@ -20559,23 +20554,15 @@ const _sfc_main$1 = {
       type: String,
       default: ""
     },
-    queryNodes: {
+    keywordQueryNode: {
       type: Function,
       default: () => {
       }
     },
-    queryNode: {
+    idQueryNode: {
       type: Function,
       default: () => {
       }
-    },
-    minLevel: {
-      type: Number,
-      default: 1
-    },
-    maxLevel: {
-      type: Number,
-      default: 9999
     }
   },
   emits: ["update:modelValue", "select"],
@@ -20604,18 +20591,6 @@ const _sfc_main$1 = {
       data2.selectedNode = {};
       modelValue.value = null;
     };
-    watch(() => modelValue.value, (n, o) => __async(this, null, function* () {
-      if (!n) {
-        data2.selectedNode = {};
-        return;
-      }
-      props.queryNode((node) => {
-        data2.selectedNode = node;
-        emit("select", data2.selectedNode);
-      });
-    }), {
-      immediate: true
-    });
     return (_ctx, _cache) => {
       const _component_van_tag = resolveComponent("van-tag");
       const _component_van_field = resolveComponent("van-field");
@@ -20643,7 +20618,7 @@ const _sfc_main$1 = {
           size: "medium",
           onClose: withModifiers(onDelete, ["stop"])
         }, {
-          default: withCtx(() => [createTextVNode(toDisplayString(data2.selectedNode.formatLabel), 1)]),
+          default: withCtx(() => [createTextVNode(toDisplayString(data2.selectedNode.path), 1)]),
           _: 1
         }, 8, ["closeable", "onClose"])) : createCommentVNode("", true)])
       } : void 0]), 1032, ["label", "required", "rules", "disabled", "placeholder", "is-link"])) : createCommentVNode("", true), createVNode(CascaderPop, {
@@ -20653,11 +20628,9 @@ const _sfc_main$1 = {
         "onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => isRef(modelValue) ? modelValue.value = $event : null),
         placeholder: props.placeholder,
         onSelect,
-        queryNodes: props.queryNodes,
-        queryNode: props.queryNode,
-        minLevel: props.minLevel,
-        maxLevel: props.maxLevel
-      }, null, 8, ["show", "modelValue", "placeholder", "queryNodes", "queryNode", "minLevel", "maxLevel"])], 64);
+        keywordQueryNode: props.keywordQueryNode,
+        idQueryNode: props.idQueryNode
+      }, null, 8, ["show", "modelValue", "placeholder", "keywordQueryNode", "idQueryNode"])], 64);
     };
   }
 };

package/build/widget.qw.umd.js

@@ -20282,7 +20282,7 @@ var __async = (__this, __arguments, generator) => {
     }
   };
   var TreePicker = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["__scopeId", "data-v-6744b874"]]);
-  var CascaderPop_vue_vue_type_style_index_0_scoped_true_lang = /* @__PURE__ */ (() => "\n.cascader-pop[data-v-38ba675f] {\r\n    width: 100%;\r\n    overflow: hidden;\n}\n.cascader-selector[data-v-38ba675f] {\r\n    padding: 10px;\n}\n.search-buttons[data-v-38ba675f] {\r\n    display: flex;\r\n    gap: 10px;\n}\n.clear-btn[data-v-38ba675f] {\r\n    background-color: #f2f3f5;\r\n    border: none;\r\n    border-radius: 4px;\r\n    padding: 4px 8px;\r\n    font-size: 14px;\n}\n.confirm-btn[data-v-38ba675f] {\r\n    background-color: #1989fa;\r\n    color: white;\r\n    border: none;\r\n    border-radius: 4px;\r\n    padding: 4px 8px;\r\n    font-size: 14px;\n}\n.no-results[data-v-38ba675f] {\r\n    text-align: center;\r\n    padding: 20px;\r\n    color: #969799;\n}\n.cascader-header[data-v-38ba675f] {\r\n    padding: 10px;\r\n    border-bottom: 1px solid #ebedf0;\r\n    display: flex;\r\n    justify-content: space-between;\r\n    align-items: center;\n}\n.current-path[data-v-38ba675f] {\r\n    flex: 1;\r\n    font-size: 14px;\r\n    color: #323233;\r\n    white-space: nowrap;\r\n    overflow: hidden;\r\n    text-overflow: ellipsis;\n}\n.header-right[data-v-38ba675f] {\r\n    display: flex;\r\n    gap: 8px;\r\n    margin-left: auto;\n}\n.cancel-btn[data-v-38ba675f] {\r\n    color: #969799;\r\n    margin-right: 5px;\n}\n.scroll-container[data-v-38ba675f] {\r\n    height: calc(80vh - 150px);\r\n    overflow-y: auto;\n}\n.cell-content[data-v-38ba675f] {\r\n    display: flex;\r\n    align-items: center;\r\n    gap: 12px;\n}\n.circle-selector[data-v-38ba675f] {\r\n    width: 20px;\r\n    height: 20px;\r\n    border-radius: 50%;\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    transition: all 0.2s;\r\n    flex-shrink: 0;\n}\n.circle-selector.selected[data-v-38ba675f] {\r\n    background-color: #1989fa;\r\n    border-color: #1989fa;\n}\n.circle-selector.selected .van-icon[data-v-38ba675f] {\r\n    color: white;\r\n    font-size: 14px;\n}\n.van-cell__right-icon[data-v-38ba675f] {\r\n    color: #969799;\r\n    font-size: 16px;\r\n    margin-left: 8px;\n}\n.name[data-v-38ba675f] {\r\n    flex: 1;\r\n    overflow: hidden;\r\n    text-overflow: ellipsis;\r\n    white-space: nowrap;\n}\n.cancel-btn[data-v-38ba675f] {\r\n    color: #969799;\n}\n.search-field[data-v-38ba675f] {\r\n    background: #fff;\r\n    padding: 10px 16px;\r\n    border-bottom: 1px solid #ebedf0;\r\n    position: sticky;\r\n    top: 0;\r\n    z-index: 999;\r\n    margin-bottom: 10px;\r\n    flex-shrink: 0;\r\n    /* \u9632\u6B62\u538B\u7F29 */\n}\r\n")();
+  var CascaderPop_vue_vue_type_style_index_0_scoped_true_lang = /* @__PURE__ */ (() => "\n.cascader-pop[data-v-c97110e4] {\r\n    width: 100%;\r\n    overflow: hidden;\n}\n.cascader-selector[data-v-c97110e4] {\r\n    padding: 10px;\n}\n.search-buttons[data-v-c97110e4] {\r\n    display: flex;\r\n    gap: 10px;\n}\n.clear-btn[data-v-c97110e4] {\r\n    background-color: #f2f3f5;\r\n    border: none;\r\n    border-radius: 4px;\r\n    padding: 4px 8px;\r\n    font-size: 14px;\n}\n.confirm-btn[data-v-c97110e4] {\r\n    background-color: #1989fa;\r\n    color: white;\r\n    border: none;\r\n    border-radius: 4px;\r\n    padding: 4px 8px;\r\n    font-size: 14px;\n}\n.no-results[data-v-c97110e4] {\r\n    text-align: center;\r\n    padding: 20px;\r\n    color: #969799;\n}\n.cascader-header[data-v-c97110e4] {\r\n    padding: 10px;\r\n    border-bottom: 1px solid #ebedf0;\r\n    display: flex;\r\n    justify-content: space-between;\r\n    align-items: center;\n}\n.current-path[data-v-c97110e4] {\r\n    flex: 1;\r\n    font-size: 14px;\r\n    color: #323233;\r\n    white-space: nowrap;\r\n    overflow: hidden;\r\n    text-overflow: ellipsis;\n}\n.header-right[data-v-c97110e4] {\r\n    display: flex;\r\n    gap: 8px;\r\n    margin-left: auto;\n}\n.cancel-btn[data-v-c97110e4] {\r\n    color: #969799;\r\n    margin-right: 5px;\n}\n.scroll-container[data-v-c97110e4] {\r\n    height: calc(80vh - 150px);\r\n    overflow-y: auto;\n}\n.cell-content[data-v-c97110e4] {\r\n    display: flex;\r\n    align-items: center;\r\n    gap: 12px;\n}\n.circle-selector[data-v-c97110e4] {\r\n    width: 20px;\r\n    height: 20px;\r\n    border-radius: 50%;\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    transition: all 0.2s;\r\n    flex-shrink: 0;\n}\n.circle-selector.selected[data-v-c97110e4] {\r\n    background-color: #1989fa;\r\n    border-color: #1989fa;\n}\n.circle-selector.selected .van-icon[data-v-c97110e4] {\r\n    color: white;\r\n    font-size: 14px;\n}\n.van-cell__right-icon[data-v-c97110e4] {\r\n    color: #969799;\r\n    font-size: 16px;\r\n    margin-left: 8px;\n}\n.name[data-v-c97110e4] {\r\n    flex: 1;\r\n    overflow: hidden;\r\n    text-overflow: ellipsis;\r\n    white-space: nowrap;\n}\n.cancel-btn[data-v-c97110e4] {\r\n    color: #969799;\n}\n.search-field[data-v-c97110e4] {\r\n    background: #fff;\r\n    padding: 10px 16px;\r\n    border-bottom: 1px solid #ebedf0;\r\n    position: sticky;\r\n    top: 0;\r\n    z-index: 999;\r\n    margin-bottom: 10px;\r\n    flex-shrink: 0;\r\n    /* \u9632\u6B62\u538B\u7F29 */\n}\r\n")();
   const _hoisted_1$1 = {
     class: "cascader-selector"
   };
@@ -20325,26 +20325,18 @@ var __async = (__this, __arguments, generator) => {
         type: String,
         default: ""
       },
-      queryNodes: {
+      keywordQueryNode: {
         type: Function,
         default: () => {
         }
       },
-      queryNode: {
+      idQueryNode: {
         type: Function,
         default: () => {
         }
-      },
-      minLevel: {
-        type: Number,
-        default: 0
-      },
-      maxLevel: {
-        type: Number,
-        default: 9999
       }
     },
-    emits: ["update:show", "select"],
+    emits: ["update:modelValue", "update:show", "select"],
     setup(__props, {
       emit
     }) {
@@ -20352,57 +20344,52 @@ var __async = (__this, __arguments, generator) => {
       const show = useVModel(props, "show", emit);
       const modelValue = useVModel(props, "modelValue", emit);
       const data2 = vue.reactive({
-        totalNodes: [],
+        parentNode: null,
         keyword: "",
-        currentNode: null,
         selectedNodeId: ""
       });
-      const canSelect = (node) => {
-        return node.canCheck && node.level >= props.minLevel && node.level <= props.maxLevel;
-      };
+      vue.onMounted(() => {
+        props.idQueryNode({
+          id: "",
+          isReturnParent: true
+        }, (node) => {
+          data2.parentNode = node;
+        });
+      });
       const optionNodes = vue.computed(() => {
         var _a;
-        if (data2.currentNode)
-          return ((_a = data2.currentNode) == null ? void 0 : _a.children) ? data2.currentNode.children : [];
-        else
-          return data2.totalNodes ? data2.totalNodes : [];
+        return ((_a = data2.parentNode) == null ? void 0 : _a.children) ? data2.parentNode.children : [];
       });
       const pathsLabel = vue.computed(() => {
-        if (!data2.currentNode || !data2.currentNode.id)
-          return "";
-        let paths = util.findPaths(data2.currentNode.id, data2.totalNodes);
-        console.log("paths", paths);
-        let res = paths.map((item) => item.label).join("/");
-        return res;
+        var _a;
+        return ((_a = data2.parentNode) == null ? void 0 : _a.path) ? data2.parentNode.path : "";
       });
-      const queryTotalNodes = () => __async(this, null, function* () {
-        yield props.queryNodes({
+      const keywordQueryNode = () => {
+        props.keywordQueryNode({
           keyword: data2.keyword,
-          parentId: ""
-        }, (nodes) => {
-          data2.totalNodes = nodes;
+          isReturnParent: true
+        }, (node) => {
+          data2.parentNode = node;
         });
-      });
-      const onSearch = () => __async(this, null, function* () {
-        yield props.queryNodes({
-          keyword: data2.keyword,
-          parentId: ""
-        }, (nodes) => {
-          data2.totalNodes = nodes;
-          data2.currentNode = null;
-        });
-      });
+      };
+      const onSearch = () => {
+        keywordQueryNode();
+      };
       const onBack = () => {
-        if (!data2.currentNode || !data2.currentNode.id)
+        if (!data2.parentNode || !data2.parentNode.parentId)
           return;
         data2.keyword = "";
-        data2.currentNode = util.findParent(data2.currentNode.id, data2.totalNodes);
+        props.idQueryNode({
+          id: data2.parentNode.parentId,
+          isReturnParent: true
+        }, (node) => {
+          data2.parentNode = node;
+        });
       };
       const onClear = () => {
         data2.keyword = "";
       };
       const reset = () => {
-        data2.currentNode = null;
         data2.keyword = "";
       };
       const onSubmit = () => {
@@ -20410,9 +20397,7 @@ var __async = (__this, __arguments, generator) => {
           util.warnToast("\u8BF7\u9009\u62E9");
           return;
         }
-        let selectedNode = util.findNode(data2.selectedNodeId, data2.totalNodes);
-        modelValue.value = selectedNode.id;
-        emit("select", selectedNode);
+        modelValue.value = data2.selectedNodeId;
         show.value = false;
         reset();
       };
@@ -20427,27 +20412,37 @@ var __async = (__this, __arguments, generator) => {
           data2.selectedNodeId = node.id;
       };
       const onNextLevel = (node) => {
-        props.queryNodes({
-          keyword: data2.keyword,
-          parentId: node.id
-        }, (nodes) => {
-          node.children = nodes;
-          data2.currentNode = node;
+        props.idQueryNode({
+          id: node.id,
+          isReturnParent: false
+        }, (node2) => {
+          data2.parentNode = node2;
         });
       };
       vue.onMounted(() => __async(this, null, function* () {
-        yield queryTotalNodes();
+        props.idQueryNode({
+          id: "",
+          isReturnParent: true
+        }, (node) => {
+          data2.parentNode = node;
+        });
       }));
-      vue.watch(() => props.modelValue, () => {
-        data2.currentNode = util.findParent(props.modelValue, data2.totalNodes);
-      }, {
+      vue.watch(() => modelValue.value, (n, o) => __async(this, null, function* () {
+        data2.selectedNodeId = modelValue.value;
+        let params = {};
+        params.id = modelValue.value;
+        params.isReturnParent = true;
+        params.hasChildren = true;
+        yield props.idQueryNode(params, (node) => {
+          data2.parentNode = node;
+          if (!modelValue.value)
+            return;
+          let childNode = util.findNode(modelValue.value, data2.parentNode.children);
+          emit("select", childNode);
+        });
+      }), {
         immediate: true
       });
-      vue.watch(() => props.show, () => {
-        if (!props.show)
-          return;
-        queryTotalNodes();
-      });
       return (_ctx, _cache) => {
         const _component_van_button = vue.resolveComponent("van-button");
         const _component_van_search = vue.resolveComponent("van-search");
@@ -20499,7 +20494,7 @@ var __async = (__this, __arguments, generator) => {
               return vue.openBlock(), vue.createBlock(_component_van_cell, {
                 key: i
               }, vue.createSlots({
-                title: vue.withCtx(() => [vue.createElementVNode("div", _hoisted_9, [canSelect(item) ? (vue.openBlock(), vue.createElementBlock("div", {
+                title: vue.withCtx(() => [vue.createElementVNode("div", _hoisted_9, [item.canCheck ? (vue.openBlock(), vue.createElementBlock("div", {
                   key: 0,
                   class: "circle-selector",
                   onClick: vue.withModifiers(($event) => onToggle(item), ["stop"])
@@ -20515,7 +20510,7 @@ var __async = (__this, __arguments, generator) => {
                   color: "#e0e0e0"
                 })) : vue.createCommentVNode("", true)], 8, _hoisted_10)) : vue.createCommentVNode("", true), vue.createElementVNode("span", _hoisted_11, vue.toDisplayString(item.label), 1)])]),
                 _: 2
-              }, [item.hasChildren && item.level < props.maxLevel ? {
+              }, [item.hasChildren && item.canExpand ? {
                 name: "right-icon",
                 fn: vue.withCtx(() => [vue.createVNode(_component_van_icon, {
                   name: "arrow",
@@ -20530,7 +20525,7 @@ var __async = (__this, __arguments, generator) => {
       };
     }
   };
-  var CascaderPop = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__scopeId", "data-v-38ba675f"]]);
+  var CascaderPop = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__scopeId", "data-v-c97110e4"]]);
   const _sfc_main$1 = {
     __name: "CascaderPicker",
     props: {
@@ -20562,23 +20557,15 @@ var __async = (__this, __arguments, generator) => {
         type: String,
         default: ""
       },
-      queryNodes: {
+      keywordQueryNode: {
         type: Function,
         default: () => {
         }
       },
-      queryNode: {
+      idQueryNode: {
         type: Function,
         default: () => {
         }
-      },
-      minLevel: {
-        type: Number,
-        default: 1
-      },
-      maxLevel: {
-        type: Number,
-        default: 9999
       }
     },
     emits: ["update:modelValue", "select"],
@@ -20607,18 +20594,6 @@ var __async = (__this, __arguments, generator) => {
         data2.selectedNode = {};
         modelValue.value = null;
       };
-      vue.watch(() => modelValue.value, (n, o) => __async(this, null, function* () {
-        if (!n) {
-          data2.selectedNode = {};
-          return;
-        }
-        props.queryNode((node) => {
-          data2.selectedNode = node;
-          emit("select", data2.selectedNode);
-        });
-      }), {
-        immediate: true
-      });
       return (_ctx, _cache) => {
         const _component_van_tag = vue.resolveComponent("van-tag");
         const _component_van_field = vue.resolveComponent("van-field");
@@ -20646,7 +20621,7 @@ var __async = (__this, __arguments, generator) => {
             size: "medium",
             onClose: vue.withModifiers(onDelete, ["stop"])
           }, {
-            default: vue.withCtx(() => [vue.createTextVNode(vue.toDisplayString(data2.selectedNode.formatLabel), 1)]),
+            default: vue.withCtx(() => [vue.createTextVNode(vue.toDisplayString(data2.selectedNode.path), 1)]),
             _: 1
           }, 8, ["closeable", "onClose"])) : vue.createCommentVNode("", true)])
         } : void 0]), 1032, ["label", "required", "rules", "disabled", "placeholder", "is-link"])) : vue.createCommentVNode("", true), vue.createVNode(CascaderPop, {
@@ -20656,11 +20631,9 @@ var __async = (__this, __arguments, generator) => {
           "onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => vue.isRef(modelValue) ? modelValue.value = $event : null),
           placeholder: props.placeholder,
           onSelect,
-          queryNodes: props.queryNodes,
-          queryNode: props.queryNode,
-          minLevel: props.minLevel,
-          maxLevel: props.maxLevel
-        }, null, 8, ["show", "modelValue", "placeholder", "queryNodes", "queryNode", "minLevel", "maxLevel"])], 64);
+          keywordQueryNode: props.keywordQueryNode,
+          idQueryNode: props.idQueryNode
+        }, null, 8, ["show", "modelValue", "placeholder", "keywordQueryNode", "idQueryNode"])], 64);
       };
     }
   };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "widget.qw",
   "private": false,
-  "version": "1.0.21",
+  "version": "1.0.23",
   "description": "marqstree Vue3组件库",
   "main": "build/widget.qw.es.js",
   "keywords": [

package/src/components/CascaderPicker.vue

@@ -5,16 +5,15 @@
         <template #input v-if="modelValue">
             <van-tag class="selected-node" v-if="modelValue" :closeable="!isDisabled" color="#fff" text-color="#333"
                 size="medium" @close.stop="onDelete">
-                {{ data.selectedNode.formatLabel }}
+                {{ data.selectedNode.path }}
             </van-tag>
         </template>
     </van-field>
 
     <CascaderPop v-model:show="data.isShowPop" v-model="modelValue" :placeholder="props.placeholder" @select="onSelect"
-        :queryNodes="props.queryNodes" :queryNode="props.queryNode" :minLevel="props.minLevel"
-        :maxLevel="props.maxLevel" />
-
+        :keywordQueryNode="props.keywordQueryNode" :idQueryNode="props.idQueryNode" />
 </template>
+
 <script setup>
 import { reactive, onMounted, watch } from "vue";
 import util from "@/util"
@@ -50,22 +49,14 @@ const props = defineProps({
         type: String,
         default: "",
     },
-    queryNodes: {
+    keywordQueryNode: {
         type: Function,
         default: () => { }
     },
-    queryNode: {
+    idQueryNode: {
         type: Function,
         default: () => { }
     },
-    minLevel: {
-        type: Number,
-        default: 1
-    },
-    maxLevel: {
-        type: Number,
-        default: 9999
-    }
 });
 
 // 弹出层
@@ -92,20 +83,6 @@ const onDelete = () => {
     data.selectedNode = {}
     modelValue.value = null
 }
-
-watch(() => modelValue.value, async (n, o) => {
-    if (!n) {
-        data.selectedNode = {}
-        return
-    }
-
-    props.queryNode((node) => {
-        data.selectedNode = node
-        emit('select', data.selectedNode)
-    })
-}, {
-    immediate: true
-})
 </script>
 
 <style scoped></style>

package/src/components/CascaderPop.vue

@@ -27,18 +27,20 @@
             <div class="scroll-container">
                 <!-- 遍历子节点列表 -->
                 <van-cell-group>
-                    <van-cell v-for="(item, i) in optionNodes" :key="i" >
+                    <van-cell v-for="(item, i) in optionNodes" :key="i">
                         <template #title>
                             <div class="cell-content">
-                                <div class="circle-selector" v-if="canSelect(item)"  @click.stop="onToggle(item)">
-                                    <van-icon v-if="data.selectedNodeId === item.id" name="success" size="20" color="#409eff"/>
-                                    <van-icon v-if="data.selectedNodeId != item.id" name="circle" size="20" color="#e0e0e0"/>
+                                <div class="circle-selector" v-if="item.canCheck" @click.stop="onToggle(item)">
+                                    <van-icon v-if="data.selectedNodeId === item.id" name="success" size="20"
+                                        color="#409eff" />
+                                    <van-icon v-if="data.selectedNodeId != item.id" name="circle" size="20"
+                                        color="#e0e0e0" />
                                 </div>
                                 <span class="name">{{ item.label }}</span>
                             </div>
                         </template>
-                        <template #right-icon v-if="item.hasChildren && item.level<props.maxLevel" >
-                            <van-icon name="arrow" @click.stop="onNextLevel(item)"/>
+                        <template #right-icon v-if="item.hasChildren && item.canExpand">
+                            <van-icon name="arrow" @click.stop="onNextLevel(item)" />
                         </template>
                     </van-cell>
                 </van-cell-group>
@@ -65,94 +67,75 @@ const props = defineProps({
         type: String,
         default: ''
     },
-    queryNodes: {
+    keywordQueryNode: {
         type: Function,
         default: () => { }
     },
-    queryNode: {
+    idQueryNode: {
         type: Function,
         default: () => { }
     },
-    minLevel:{
-        type:Number,
-        default: 0
-    },
-    maxLevel:{
-        type:Number,
-        default: 9999
-    }
 });
 // 定义emit
-const emit = defineEmits(["update:show", "select"]);
+const emit = defineEmits(["update:modelValue", "update:show", "select"]);
 // 弹出?
 const show = useVModel(props, 'show', emit)
 const modelValue = useVModel(props, 'modelValue', emit)
 const data = reactive({
-    // 所有节点
-    totalNodes: [],
+    //当前父节点
+    parentNode: null,
     // 搜索关键字
     keyword: "",
-    //当前节点
-    currentNode: null,
-    //勾选的节点id
+    //勾选的子节点id
     selectedNodeId: ''
 })
 
-const canSelect=(node)=>{
-    return node.canCheck && node.level>=props.minLevel && node.level<=props.maxLevel
-}
+onMounted(() => {
+    //查询根节点
+    props.idQueryNode({ id: '', isReturnParent: true }, (node) => {
+        data.parentNode = node
+    })
+})
 
 // 待选节点列表
 const optionNodes = computed(() => {
-    if (data.currentNode)
-        return data.currentNode?.children ? data.currentNode.children : []
-    else
-        return data.totalNodes ? data.totalNodes : []
+    return data.parentNode?.children ? data.parentNode.children : []
 })
 
 //选中节点的路径:父/子/孙
 const pathsLabel = computed(() => {
-    if (!data.currentNode || !data.currentNode.id)
-        return ''
-
-    let paths = util.findPaths(data.currentNode.id, data.totalNodes)
-    console.log("paths", paths);
-    let res = paths.map(item => item.label).join('/')
-    return res
+    return data.parentNode?.path ? data.parentNode.path : ''
 })
 
-// 查询树状节点列表
-const queryTotalNodes = async () => {
-    await props.queryNodes({keyword:data.keyword,parentId:''}, (nodes) => {
-        data.totalNodes = nodes
+// 关键字查询节点列表
+const keywordQueryNode = () => {
+    props.keywordQueryNode({ keyword: data.keyword, isReturnParent: true }, (node) => {
+        data.parentNode = node
     })
 }
 
 // 关键字查询
-const onSearch = async () => {
-    await props.queryNodes({keyword:data.keyword,parentId:''}, (nodes) => {
-        data.totalNodes = nodes
-        data.currentNode = null
-    })
+const onSearch = () => {
+    keywordQueryNode()
 }
 
 // 返回上一级
 const onBack = () => {
-    if (!data.currentNode || !data.currentNode.id)
+    if (!data.parentNode || !data.parentNode.parentId)
         return
 
     data.keyword = ""
-    data.currentNode = util.findParent(data.currentNode.id, data.totalNodes)
+    props.idQueryNode({ id: data.parentNode.parentId, isReturnParent: true }, (node) => {
+        data.parentNode = node
+    })
 }
 
-const onClear=()=>{
+const onClear = () => {
     data.keyword = ''
 }
 
 // 清除掉选中节点
 const reset = () => {
-    // 当前节点
-    data.currentNode = null
     // 搜索关键字
     data.keyword = ""
 }
@@ -164,9 +147,7 @@ const onSubmit = () => {
         return
     }
 
-    let selectedNode = util.findNode(data.selectedNodeId, data.totalNodes)
-    modelValue.value = selectedNode.id
-    emit('select', selectedNode)
+    modelValue.value = data.selectedNodeId
     show.value = false
 
     reset()
@@ -179,34 +160,44 @@ const onCancel = () => {
 }
 
 const onToggle = (node) => {
-    if(data.selectedNodeId == node.id)
+    if (data.selectedNodeId == node.id)
         data.selectedNodeId = ''
     else
         data.selectedNodeId = node.id
-}   
+}
 
 const onNextLevel = (node) => {
-    props.queryNodes({ keyword: data.keyword, parentId: node.id }, (nodes) => {
-        node.children = nodes
-        data.currentNode = node
+    props.idQueryNode({ id: node.id, isReturnParent: false }, (node) => {
+        data.parentNode = node
     })
 }
 
 //首页加载
 onMounted(async () => {
-    await queryTotalNodes()
+    props.idQueryNode({ id: '', isReturnParent: true }, (node) => {
+        data.parentNode = node
+    })
 })
 
-watch(() => props.modelValue, () => {
-    // 初始化当前节点
-    data.currentNode = util.findParent(props.modelValue, data.totalNodes)
-}, { immediate: true })
+watch(() => modelValue.value, async (n, o) => {
+    data.selectedNodeId = modelValue.value
 
-watch(()=>props.show,()=>{
-    if(!props.show)
-        return
+    let params = {}
+    params.id = modelValue.value
+    params.isReturnParent = true
+    params.hasChildren = true
 
-    queryTotalNodes()
+    await props.idQueryNode(params, (node) => {
+        data.parentNode = node
+
+        if (!modelValue.value)
+            return
+
+        let childNode = util.findNode(modelValue.value, data.parentNode.children)
+        emit('select', childNode)
+    })
+}, {
+    immediate: true
 })
 </script>