@ibiz-template/vue3-components 0.6.0-alpha.4 → 0.6.0

package/lib/editor/data-picker/ibiz-picker-select-view/ibiz-picker-select-view.cjs

@@ -3,8 +3,8 @@
 var vue = require('vue');
 var vue3Util = require('@ibiz-template/vue3-util');
 require('./ibiz-picker-select-view.css');
-var ramda = require('ramda');
 var runtime = require('@ibiz-template/runtime');
+var ramda = require('ramda');
 
 "use strict";
 function _isSlot(s) {
@@ -32,9 +32,24 @@ const IBizPickerSelectView = /* @__PURE__ */ vue.defineComponent({
     const queryValue = vue.ref("");
     const visible = vue.ref(false);
     const pickViewWidth = vue.ref("auto");
-    const context = vue.ref(ramda.clone(c.context));
-    const params = vue.ref(ramda.clone(c.params));
+    const context = vue.ref(c.context);
+    const params = vue.ref(c.params);
+    vue.watch(() => props.data, (newVal) => {
+      const {
+        context: tempContext,
+        params: tempParams
+      } = c.handlePublicParams(newVal, c.context, c.params);
+      Object.assign(context.value, tempContext);
+      Object.assign(params.value, tempParams);
+    }, {
+      immediate: true,
+      deep: true
+    });
     const isEditable = vue.ref(false);
+    const multipleTempValue = vue.ref(null);
+    const multipleTempText = vue.ref(null);
+    const multipleObjs = vue.ref(null);
+    const showView = vue.ref(false);
     const showFormDefaultContent = vue.computed(() => {
       if (props.controlParams && props.controlParams.editmode === "hover") {
         return true;
@@ -50,12 +65,6 @@ const IBizPickerSelectView = /* @__PURE__ */ vue.defineComponent({
         }, 100);
       }
     };
-    const onInputChange = () => {
-      context.value = {
-        query: queryValue.value,
-        ...context.value
-      };
-    };
     const triggerMenu = (show) => {
       if (props.disabled) {
         return;
@@ -86,10 +95,30 @@ const IBizPickerSelectView = /* @__PURE__ */ vue.defineComponent({
           params.value.selectedData = selectedData.value;
         }
       } else {
-        keySet.value = [];
         const selectItems = [];
+        keySet.value = [];
+        items.value = [];
         if (newVal) {
-          if (!props.data || !c.valueItem || !props.data[c.valueItem]) {
+          if (c.model.valueType === "OBJECTS") {
+            newVal.forEach((item) => {
+              const _item = ramda.clone(item);
+              Object.assign(_item, {
+                [c.keyName]: item[c.objectIdField],
+                [c.textName]: item[c.objectNameField]
+              });
+              if (c.objectValueField) {
+                Object.assign(_item, {
+                  ...item[c.objectValueField]
+                });
+                delete _item[c.objectValueField];
+              }
+              if (_item[c.keyName]) {
+                items.value.push(_item);
+                keySet.value.push(_item[c.keyName]);
+              }
+            });
+            selectItems.push(...newVal);
+          } else if (!props.data || !c.valueItem || !props.data[c.valueItem]) {
             ibiz.log.error("\u503C\u9879\u5F02\u5E38");
           } else {
             const tempValue = props.data[c.valueItem].split(",");
@@ -100,7 +129,6 @@ const IBizPickerSelectView = /* @__PURE__ */ vue.defineComponent({
                 srfkey
               });
             });
-            items.value = [];
             selectItems.forEach((item) => {
               keySet.value.push(item.srfkey);
               const index = items.value.findIndex((i) => Object.is(i.srfkey, item.srfkey));
@@ -114,10 +142,10 @@ const IBizPickerSelectView = /* @__PURE__ */ vue.defineComponent({
           }
         }
         selectedData.value = selectItems;
-        params.value.selectedData = selectedData.value;
+        multipleObjs.value = selectItems;
       }
     }, {
-      immediate: false,
+      immediate: true,
       deep: true
     });
     vue.onMounted(() => {
@@ -137,9 +165,26 @@ const IBizPickerSelectView = /* @__PURE__ */ vue.defineComponent({
       }
       emit("change", null);
     };
+    const onInputChange = (e) => {
+      if (!e) {
+        onClear();
+      }
+    };
     const onViewDataChange = (event) => {
       if (event.length === 0) {
-        onClear();
+        if (singleSelect.value) {
+          onClear();
+        } else {
+          items.value = [];
+          if (c.model.valueType === "OBJECTS") {
+            multipleObjs.value = null;
+          } else {
+            if (c.valueItem) {
+              multipleTempValue.value = null;
+            }
+            multipleTempText.value = null;
+          }
+        }
         return;
       }
       if (singleSelect.value) {
@@ -154,6 +199,15 @@ const IBizPickerSelectView = /* @__PURE__ */ vue.defineComponent({
         } else {
           emit("change", tempText);
         }
+      } else if (c.model.valueType === "OBJECTS") {
+        if (event && Array.isArray(event)) {
+          const objs = [];
+          event.forEach((item) => {
+            const obj = c.handleObjectParams(item);
+            objs.push(obj);
+          });
+          multipleObjs.value = objs;
+        }
       } else {
         let tempValue = "";
         let tempText = "";
@@ -176,9 +230,9 @@ const IBizPickerSelectView = /* @__PURE__ */ vue.defineComponent({
         tempValue = tempValue.substring(0, tempValue.length - 1);
         tempText = tempText.substring(0, tempText.length - 1);
         if (c.valueItem) {
-          emit("change", tempValue, c.valueItem);
+          multipleTempValue.value = tempValue;
         }
-        emit("change", tempText);
+        multipleTempText.value = tempText;
       }
     };
     const openLinkView = async (e) => {
@@ -198,20 +252,31 @@ const IBizPickerSelectView = /* @__PURE__ */ vue.defineComponent({
           }
         });
       }
-      let tempValue = "";
-      let tempText = "";
-      val.forEach((select) => {
-        const srfkey = select[c.keyName] ? select[c.keyName] : select.srfkey;
-        tempValue += "".concat(srfkey, ",");
-        const srfmajortext = select[c.textName] ? select[c.textName] : select.srfmajortext;
-        tempText += "".concat(srfmajortext, ",");
-      });
-      tempValue = tempValue.substring(0, tempValue.length - 1);
-      tempText = tempText.substring(0, tempText.length - 1);
-      if (c.valueItem) {
-        emit("change", tempValue, c.valueItem);
+      if (c.model.valueType === "OBJECTS") {
+        const objs = [];
+        val.forEach((item) => {
+          const obj = c.handleObjectParams(item);
+          objs.push(obj);
+        });
+        emit("change", objs);
+      } else {
+        let tempValue = "";
+        let tempText = "";
+        val.forEach((select) => {
+          const srfkey = select[c.keyName] ? select[c.keyName] : select.srfkey;
+          tempValue += "".concat(srfkey, ",");
+          const srfmajortext = select[c.textName] ? select[c.textName] : select.srfmajortext;
+          tempText += "".concat(srfmajortext, ",");
+        });
+        tempValue = tempValue.substring(0, tempValue.length - 1);
+        tempText = tempText.substring(0, tempText.length - 1);
+        if (c.valueItem) {
+          multipleTempValue.value = tempValue;
+          emit("change", tempValue, c.valueItem);
+        }
+        multipleTempText.value = tempText;
+        emit("change", tempText);
       }
-      emit("change", tempText);
     };
     const remoteMethod = (e) => {
       queryValue.value = e;
@@ -219,6 +284,9 @@ const IBizPickerSelectView = /* @__PURE__ */ vue.defineComponent({
     const onSelectionChange = (event) => {
       if (event.data) {
         onViewDataChange(event.data);
+        if (singleSelect.value && editorRef.value) {
+          editorRef.value.handleClose();
+        }
       }
     };
     const modal = new runtime.Modal({
@@ -245,8 +313,21 @@ const IBizPickerSelectView = /* @__PURE__ */ vue.defineComponent({
       if (singleSelect.value) {
         return queryValue.value;
       }
-      return selectedData.value.map((item) => item.srfmajortext).join(",");
+      return selectedData.value.map((item) => item[c.textName]).join(",");
     });
+    const onVisibleChange = (e) => {
+      showView.value = e;
+      if (!e && !singleSelect.value) {
+        if (c.model.valueType === "OBJECTS") {
+          emit("change", multipleObjs.value);
+        } else {
+          if (c.valueItem) {
+            emit("change", multipleTempValue.value, c.valueItem);
+          }
+          emit("change", multipleTempText.value);
+        }
+      }
+    };
     return {
       ns,
       c,
@@ -274,7 +355,10 @@ const IBizPickerSelectView = /* @__PURE__ */ vue.defineComponent({
       valueText,
       isEditable,
       setEditable,
-      showFormDefaultContent
+      showFormDefaultContent,
+      onVisibleChange,
+      showView,
+      selectedData
     };
   },
   render() {
@@ -283,7 +367,8 @@ const IBizPickerSelectView = /* @__PURE__ */ vue.defineComponent({
       "trigger": "click",
       "teleported": false,
       "class": this.ns.b("select"),
-      "popper-class": this.ns.b("popper")
+      "popper-class": this.ns.b("popper"),
+      "onVisibleChange": this.onVisibleChange
     }, {
       default: () => {
         let _slot;
@@ -294,6 +379,7 @@ const IBizPickerSelectView = /* @__PURE__ */ vue.defineComponent({
           "disabled": this.disabled,
           "readonly": this.readonly,
           "onChange": this.onInputChange,
+          "clearable": true,
           "onFocus": (e) => {
             this.onFocus(e);
           },
@@ -304,13 +390,13 @@ const IBizPickerSelectView = /* @__PURE__ */ vue.defineComponent({
             return [this.queryValue && !this.disabled && !this.readonly && vue.createVNode("ion-icon", {
               "onClick": this.onClear,
               "name": "clear"
-            }, null), this.c.model.linkAppViewId && this.queryValue && vue.createVNode("ion-icon", {
+            }, null), this.c.model.linkAppViewId && vue.createVNode("ion-icon", {
               "onClick": this.openLinkView,
               "name": "link-arrow"
             }, null)];
           }
         }) : vue.createVNode(vue.resolveComponent("el-select"), {
-          "popper-class": "select",
+          "popper-class": this.ns.b("select-popover"),
           "model-value": this.keySet,
           "placeholder": this.c.placeHolder ? this.c.placeHolder : " ",
           "multiple": true,
@@ -335,19 +421,24 @@ const IBizPickerSelectView = /* @__PURE__ */ vue.defineComponent({
         });
       },
       dropdown: () => {
+        if (!this.showView) {
+          return;
+        }
         const viewShell = vue.resolveComponent("IBizViewShell");
-        return vue.createVNode(vue.resolveComponent("el-dropdown-menu"), null, {
-          default: () => [this.c.pickupView && vue.h(viewShell, {
-            context: this.context,
-            params: this.params,
-            viewId: this.c.pickupView.id,
-            style: {
-              height: "100%",
-              width: this.pickViewWidth
-            },
-            onSelectionChange: this.onSelectionChange,
-            modal: this.modal
-          })]
+        return this.c.pickupView && vue.h(viewShell, {
+          context: this.context,
+          params: this.params,
+          viewId: this.c.pickupView.id,
+          style: {
+            height: "100%",
+            width: this.pickViewWidth
+          },
+          state: {
+            singleSelect: this.singleSelect,
+            selectedData: this.selectedData
+          },
+          onSelectionChange: this.onSelectionChange,
+          modal: this.modal
         });
       }
     });

package/lib/editor/data-picker/ibiz-picker-select-view/ibiz-picker-select-view.css

@@ -1 +1 @@
-.ibiz-picker-select-view{width:100%}.ibiz-picker-select-view .el-dropdown{width:100%}.ibiz-picker-select-view .el-select{width:100%}.ibiz-picker-select-view-popper.el-popper.el-dropdown__popper{width:100%;max-height:500px;overflow:auto}.ibiz-picker-select-view-popper.el-popper.el-dropdown__popper .el-scrollbar .el-dropdown__list{background:var(--ibiz-color-primary-text)}.ibiz-picker-select-view-popper.el-popper.el-dropdown__popper .el-scrollbar .el-dropdown__list .el-dropdown-menu{background:var(--ibiz-color-primary-text)}.ibiz-picker-select-view-form-default-content{display:none}.ibiz-form-item .ibiz-picker-select-view.is-show-default:hover .ibiz-picker-select-view-form-default-content{display:none}.ibiz-form-item .ibiz-picker-select-view.is-show-default:hover .ibiz-picker-select-view-select{display:block}.ibiz-form-item .ibiz-picker-select-view.is-show-default .ibiz-picker-select-view-form-default-content{display:flex;align-items:center;width:100%;height:var(--ibiz-editor-default-line-height);padding:var(--ibiz-form-item-hover-edit-padding);font-family:Arial,sans-serif;font-size:var(--ibiz-form-item-font-size);line-height:var(--ibiz-editor-default-line-height);color:var(--ibiz-form-item-text-color)}.ibiz-form-item .ibiz-picker-select-view.is-show-default .ibiz-picker-select-view-form-default-content .ibiz-picker-select-view-content-item{height:22px;padding:0 9px;margin:2px 6px 2px 0;font-size:var(--ibiz-font-size-small);line-height:22px;color:var(--ibiz-editor-default-text-color);background-color:var(--ibiz-color-fill-0);border:1px solid transparent;border-radius:var(--ibiz-border-radius-small)}.ibiz-form-item .ibiz-picker-select-view.is-show-default .ibiz-picker-select-view-select{display:none}.ibiz-form-item .ibiz-picker-select-view.is-show-default.is-editable .ibiz-picker-select-view-form-default-content{display:none}.ibiz-form-item .ibiz-picker-select-view.is-show-default.is-editable .ibiz-picker-select-view-select{display:block}
+.ibiz-picker-select-view{width:100%}.ibiz-picker-select-view .el-dropdown{width:100%}.ibiz-picker-select-view .el-select{width:100%}.ibiz-picker-select-view-popper.el-popper.el-dropdown__popper{width:100%;min-height:100px;max-height:500px;overflow:auto}.ibiz-picker-select-view-popper.el-popper.el-dropdown__popper .el-scrollbar .el-dropdown__list{background:var(--ibiz-color-primary-text)}.ibiz-picker-select-view-popper.el-popper.el-dropdown__popper .el-scrollbar .el-dropdown__list .el-dropdown-menu{background:var(--ibiz-color-primary-text)}.ibiz-picker-select-view-form-default-content{display:none}.ibiz-form-item .ibiz-picker-select-view.is-show-default:hover .ibiz-picker-select-view-form-default-content{display:none}.ibiz-form-item .ibiz-picker-select-view.is-show-default:hover .ibiz-picker-select-view-select{display:block}.ibiz-form-item .ibiz-picker-select-view.is-show-default .ibiz-picker-select-view-form-default-content{display:flex;align-items:center;width:100%;height:var(--ibiz-editor-default-line-height);padding:var(--ibiz-form-item-hover-edit-padding);font-family:Arial,sans-serif;font-size:var(--ibiz-form-item-font-size);line-height:var(--ibiz-editor-default-line-height);color:var(--ibiz-form-item-text-color)}.ibiz-form-item .ibiz-picker-select-view.is-show-default .ibiz-picker-select-view-form-default-content .ibiz-picker-select-view-content-item{height:22px;padding:0 9px;margin:2px 6px 2px 0;font-size:var(--ibiz-font-size-small);line-height:22px;color:var(--ibiz-editor-default-text-color);background-color:var(--ibiz-color-fill-0);border:1px solid transparent;border-radius:var(--ibiz-border-radius-small)}.ibiz-form-item .ibiz-picker-select-view.is-show-default .ibiz-picker-select-view-select{display:none}.ibiz-form-item .ibiz-picker-select-view.is-show-default.is-editable .ibiz-picker-select-view-form-default-content{display:none}.ibiz-form-item .ibiz-picker-select-view.is-show-default.is-editable .ibiz-picker-select-view-select{display:block}.ibiz-picker-select-view-select-popover{display:none}

package/lib/editor/data-picker/picker-editor.controller.cjs

@@ -295,7 +295,14 @@ class PickerEditorController extends runtime.EditorController {
     }
     if (this.objectValueField) {
       Object.assign(object, {
-        [this.objectValueField]: ramda.clone(select)
+        [this.objectValueField]: {
+          ...select
+        }
+      });
+    }
+    if (select.srfnodeid) {
+      Object.assign(object, {
+        srfnodeid: select.srfnodeid
       });
     }
     return object;

package/lib/view-engine/pickup-tree-view.engine.cjs

@@ -4,7 +4,23 @@ var runtime = require('@ibiz-template/runtime');
 var treeView_engine = require('./tree-view.engine.cjs');
 
 "use strict";
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => {
+  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+  return value;
+};
 class PickupTreeViewEngine extends treeView_engine.TreeViewEngine {
+  constructor() {
+    super(...arguments);
+    /**
+     * 选中数据
+     *
+     * @type {IData[]}
+     * @memberof PickupViewEngine
+     */
+    __publicField(this, "selectData", []);
+  }
   /**
    * 创建完成
    *
@@ -18,6 +34,41 @@ class PickupTreeViewEngine extends treeView_engine.TreeViewEngine {
       this.view.slotProps.tree = {};
     }
     this.view.slotProps.tree.singleSelect = this.view.state.singleSelect;
+    if (this.view.state.selectedData) {
+      this.selectData = this.view.state.selectedData.map((item) => {
+        return {
+          ...item,
+          _id: item.srfnodeid
+        };
+      });
+      const set = /* @__PURE__ */ new Set();
+      this.selectData.forEach((item) => {
+        if (item.srfnodeid) {
+          const keys = this.calcExpandKeys(item.srfnodeid);
+          keys.forEach((key) => set.add(key));
+        }
+      });
+      this.view.slotProps.tree.defaultExpandedKeys = Array.from(set);
+    }
+  }
+  /**
+   * 根据key计算需要展开的节点标识
+   * @author lxm
+   * @date 2023-11-07 02:42:45
+   * @param {string} key
+   * @return {*}  {string[]}
+   */
+  calcExpandKeys(key) {
+    const expandedKeys = [];
+    key.split(":").forEach((item, index) => {
+      if (index === 0) {
+        expandedKeys.push(item);
+      } else {
+        expandedKeys.push("".concat(expandedKeys[index - 1], ":").concat(item));
+      }
+    });
+    expandedKeys.pop();
+    return expandedKeys;
   }
   /**
    * 挂载完成
@@ -28,15 +79,21 @@ class PickupTreeViewEngine extends treeView_engine.TreeViewEngine {
    */
   async onMounted() {
     const { model } = this.view;
+    let forbiddenSelectionChange = false;
     this.xdataControl.evt.on("onSelectionChange", async (event) => {
-      if (event.data[0] && event.data[0] instanceof runtime.TreeDataSetNodeData) {
-        event.data[0] = event.data[0]._deData;
+      if (forbiddenSelectionChange) {
+        return;
       }
       this.view.evt.emit("onSelectionChange", { ...event });
     });
     this.xdataControl.evt.on("onActive", async (event) => {
       this.view.evt.emit("onDataActive", { ...event });
     });
+    this.xdataControl.evt.on("onLoadSuccess", () => {
+      forbiddenSelectionChange = true;
+      this.xdataControl.setSelection(this.selectData);
+      forbiddenSelectionChange = false;
+    });
     if (!this.view.state.noLoadDefault && model.loadDefault) {
       this.load();
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ibiz-template/vue3-components",
-  "version": "0.6.0-alpha.4",
+  "version": "0.6.0",
   "description": "使用 rollup 编译 vue 组件或者 jsx",
   "main": "lib/index.cjs",
   "module": "es/index.mjs",
@@ -27,12 +27,12 @@
     "@floating-ui/dom": "^1.5.3",
     "@ibiz-template-plugin/ai-chat": "^0.0.1",
     "@ibiz-template-plugin/gantt": "0.1.1",
-    "@ibiz-template/core": "^0.6.0-alpha.4",
-    "@ibiz-template/devtool": "0.0.1-dev.3",
-    "@ibiz-template/model-helper": "^0.6.0-alpha.4",
-    "@ibiz-template/runtime": "^0.6.0-alpha.4",
+    "@ibiz-template/core": "^0.6.0",
+    "@ibiz-template/devtool": "0.0.1-alpha.0",
+    "@ibiz-template/model-helper": "^0.6.0",
+    "@ibiz-template/runtime": "^0.6.0",
     "@ibiz-template/theme": "^0.5.0",
-    "@ibiz-template/vue3-util": "^0.6.0-alpha.4",
+    "@ibiz-template/vue3-util": "^0.6.0",
     "@ibiz-template/web-theme": "^1.1.8",
     "@ibiz/model-core": "^0.1.11",
     "@imengyu/vue3-context-menu": "^1.3.5",