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

package/es/view-engine/pickup-tree-view.engine.mjs

@@ -1,8 +1,24 @@
-import { TreeDataSetNodeData, ViewCallTag } from '@ibiz-template/runtime';
+import { ViewCallTag } from '@ibiz-template/runtime';
 import { TreeViewEngine } from './tree-view.engine.mjs';
 
 "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 TreeViewEngine {
+  constructor() {
+    super(...arguments);
+    /**
+     * 选中数据
+     *
+     * @type {IData[]}
+     * @memberof PickupViewEngine
+     */
+    __publicField(this, "selectData", []);
+  }
   /**
    * 创建完成
    *
@@ -16,6 +32,41 @@ class PickupTreeViewEngine extends 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;
   }
   /**
    * 挂载完成
@@ -26,15 +77,21 @@ class PickupTreeViewEngine extends 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 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/lib/common/data-import2/data-import2.cjs

@@ -454,7 +454,9 @@ const DataImport2 = /* @__PURE__ */ vue.defineComponent({
     }), this.previewinfo[0] && this.previewinfo[0].length ? vue.createVNode("div", {
       "class": "ibiz-control-toolbar__item"
     }, [vue.createVNode(vue.resolveComponent("el-button"), {
-      "onClick": this.onButtonImportClick
+      "onClick": this.onButtonImportClick,
+      "disabled": !this.selectValues.join(""),
+      "title": !this.selectValues.join("") ? "\u8BF7\u9009\u62E9\u5217\u5BFC\u5165\u5C5E\u6027!" : ""
     }, _isSlot(_slot2 = ibiz.i18n.t("component.dataImport2.import")) ? _slot2 : {
       default: () => [_slot2]
     })]) : ""])])])]), vue.createVNode(vue.resolveComponent("data-import2-table"), {

package/lib/common/data-import2/data-import2.css

@@ -1 +1 @@
-.ibiz-data-import2{display:flex;flex-flow:column nowrap;min-width:644px;height:568px;background:var(--ibiz-color-bg-1)}.ibiz-data-import2__data-import2-toolbar{display:flex;align-items:center;justify-content:space-between}.ibiz-data-import2__data-import2-toolbar-container{display:flex;align-items:center;justify-content:space-between}.ibiz-data-import2__select-option-item-button{height:100%}
+.ibiz-data-import2{display:flex;flex-flow:column nowrap;min-width:644px;background:var(--ibiz-color-bg-1)}.ibiz-data-import2.ibiz-view{height:568px}.ibiz-data-import2__data-import2-toolbar{display:flex;align-items:center;justify-content:space-between}.ibiz-data-import2__data-import2-toolbar-container{display:flex;align-items:center;justify-content:space-between}.ibiz-data-import2__select-option-item-button{height:100%}

package/lib/control/drbar/drbar.controller.cjs

@@ -252,6 +252,9 @@ class DRBarController extends runtime.ControlController {
    */
   handleSelectChange(key, isRoutePushed = false) {
     var _a;
+    if (this.state.selectedItem === key) {
+      return;
+    }
     const drBarItem = (_a = this.model.dedrctrlItems) == null ? void 0 : _a.find((item) => item.id === key);
     if (drBarItem) {
       this.setVisible("navPos");

package/lib/control/form/form-detail/form-item/form-item.cjs

@@ -69,6 +69,7 @@ const FormItem = /* @__PURE__ */ vue.defineComponent({
     }
     return vue.createVNode(vue.resolveComponent("iBizFormItemContainer"), {
       "class": [this.ns.b(), this.ns.m(this.modelData.id), ...this.controller.containerClass],
+      "style": this.modelData.cssStyle,
       "required": this.c.state.required,
       "error": this.c.state.error,
       "label": this.c.labelCaption,

package/lib/control/tab-exp-panel/tab-exp-panel.cjs

@@ -44,28 +44,16 @@ const TabExpPanelControl = /* @__PURE__ */ vue.defineComponent({
     const route = vueRouter.useRoute();
     vue.watch(() => route.fullPath, (newVal, oldVal) => {
       if (newVal !== oldVal) {
-        const viewCodeName = c.view.model.codeName.toLowerCase();
-        const viewRouteKey = Object.keys(route.params).find((key) => {
-          return route.params[key] === viewCodeName;
-        });
-        if (!viewRouteKey) {
-          return;
-        }
-        const nextKeyNumber = (parseInt(viewRouteKey[viewRouteKey.length - 1], 10) + 2) * 2;
-        const tempFullPath = route.fullPath.split("/").slice(0, nextKeyNumber).join("/");
-        c.state.tabPages.forEach((page) => {
-          if (page.fullPath === tempFullPath) {
-            c.state.activeName = page.tabTag;
+        const depth = c.view.modal.routeDepth;
+        if (depth) {
+          const routePath = vue3Util.route2routePath(route);
+          const {
+            srfnav
+          } = routePath.pathNodes[depth - 1];
+          if (srfnav && c.state.activeName && c.state.activeName !== srfnav) {
+            c.state.activeName = srfnav;
             c.handleTabChange();
           }
-        });
-        if (c.state.activeName) {
-          const currentPage = c.state.tabPages.find((page) => {
-            return page.tabTag === c.state.activeName;
-          });
-          if (currentPage) {
-            currentPage.fullPath = tempFullPath;
-          }
         }
       }
     }, {

package/lib/control/toolbar/toolbar.cjs

@@ -72,6 +72,7 @@ const ToolbarControl = /* @__PURE__ */ vue.defineComponent({
       return vue.createVNode(vue.resolveComponent("el-sub-menu"), {
         "class": ns.b("submenu"),
         "index": item.id,
+        "title": item.tooltip,
         "popper-class": ns.b("submenu-popper")
       }, {
         default: () => {

package/lib/control/tree/tree.cjs

@@ -69,6 +69,7 @@ const TreeControl = /* @__PURE__ */ vue.defineComponent({
   },
   setup() {
     const c = vue3Util.useControlController((...args) => new runtime.TreeController(...args));
+    const cascadeSelect = vue.ref(false);
     const counterData = vue.reactive({});
     c.evt.on("onCreated", () => {
       if (c.counter) {
@@ -76,6 +77,9 @@ const TreeControl = /* @__PURE__ */ vue.defineComponent({
           Object.assign(counterData, counter);
         }, true);
       }
+      if (c.controlParams.cascadeselect) {
+        cascadeSelect.value = true;
+      }
     });
     const ns = vue3Util.useNamespace("control-".concat(c.model.controlType.toLowerCase()));
     const treeRef = vue.ref(null);
@@ -122,7 +126,8 @@ const TreeControl = /* @__PURE__ */ vue.defineComponent({
         _id: node._id,
         _uuid: node._uuid,
         _leaf: node._leaf,
-        _text: node._text
+        _text: node._text,
+        _disableSelect: node._disableSelect
       }));
     };
     c.evt.on("onAfterRefreshParent", (event) => {
@@ -406,6 +411,7 @@ const TreeControl = /* @__PURE__ */ vue.defineComponent({
       treeRefreshKey,
       editingNodeKey,
       editingNodeText,
+      cascadeSelect,
       findNodeData: elTreeUtil.findNodeData,
       onCheck,
       onNodeClick,
@@ -454,12 +460,13 @@ const TreeControl = /* @__PURE__ */ vue.defineComponent({
           "expand-on-click-node": false,
           "auto-expand-parent": false,
           "show-checkbox": !this.c.state.singleSelect,
-          "check-strictly": true,
+          "check-strictly": !this.cascadeSelect,
           "default-expanded-keys": this.c.state.expandedKeys,
           "props": {
             label: "_text",
             children: "_children",
-            isLeaf: "_leaf"
+            isLeaf: "_leaf",
+            disabled: "_disableSelect"
           },
           "lazy": true,
           "load": this.loadData,
@@ -527,7 +534,7 @@ const TreeControl = /* @__PURE__ */ vue.defineComponent({
               "onDblclick": (evt) => this.onNodeDbClick(nodeData, evt),
               "onClick": (evt) => this.onNodeClick(nodeData, evt),
               "onContextmenu": (evt) => this.onNodeContextmenu(nodeData, evt),
-              "class": [this.ns.b("node"), (_b = nodeModel.sysCss) == null ? void 0 : _b.cssName]
+              "class": [this.ns.b("node"), nodeData._disableSelect ? this.ns.bm("node", "disabled") : "", (_b = nodeModel.sysCss) == null ? void 0 : _b.cssName]
             }, [content, this.renderCounter(nodeModel), this.renderContextMenu(nodeModel, nodeData)]);
           }
         });

package/lib/control/tree/tree.css

@@ -1 +1 @@
-.ibiz-control-treeview{--ibiz-control-treeview-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-base);--ibiz-control-treeview-icon-height:var(--ibiz-spacing-base);--ibiz-control-treeview-icon-width:var(--ibiz-spacing-base);height:100%;padding:var(--ibiz-control-treeview-padding)}.ibiz-control-treeview-node{display:flex;flex-grow:1;flex-shrink:1;align-items:center;min-width:1px;height:100%}.ibiz-control-treeview-node__icon{width:var(--ibiz-control-treeview-icon-width);height:var(--ibiz-control-treeview-icon-height);margin-right:var(--ibiz-spacing-tight)}.ibiz-control-treeview-node__label{flex-grow:1;flex-shrink:1;min-width:1px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ibiz-control-treeview-node:hover .ibiz-control-treeview-context-menu-trigger{display:inline-block}.ibiz-control-treeview-context-menu-trigger{display:none;flex-shrink:0;width:30px;text-align:center;cursor:pointer}.ibiz-control-treeview-context-menu-trigger__caption-icon{vertical-align:middle}.ibiz-control-treeview-context-menu.mx-context-menu{padding:var(--ibiz-spacing-extra-tight) 0}.ibiz-control-treeview-context-menu.mx-context-menu .mx-context-menu-item{padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-base)}.ibiz-control-treeview-quick-search{margin-bottom:var(--ibiz-spacing-tight)}
+.ibiz-control-treeview{--ibiz-control-treeview-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-base);--ibiz-control-treeview-icon-height:var(--ibiz-spacing-base);--ibiz-control-treeview-icon-width:var(--ibiz-spacing-base);height:100%;padding:var(--ibiz-control-treeview-padding)}.ibiz-control-treeview-node{display:flex;flex-grow:1;flex-shrink:1;align-items:center;min-width:1px;height:100%}.ibiz-control-treeview-node__icon{width:var(--ibiz-control-treeview-icon-width);height:var(--ibiz-control-treeview-icon-height);margin-right:var(--ibiz-spacing-tight)}.ibiz-control-treeview-node__label{flex-grow:1;flex-shrink:1;min-width:1px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ibiz-control-treeview-node:hover .ibiz-control-treeview-context-menu-trigger{display:inline-block}.ibiz-control-treeview-node--disabled{color:var(--ibiz-color-disabled-text);cursor:not-allowed}.ibiz-control-treeview-context-menu-trigger{display:none;flex-shrink:0;width:30px;text-align:center;cursor:pointer}.ibiz-control-treeview-context-menu-trigger__caption-icon{vertical-align:middle}.ibiz-control-treeview-context-menu.mx-context-menu{padding:var(--ibiz-spacing-extra-tight) 0}.ibiz-control-treeview-context-menu.mx-context-menu .mx-context-menu-item{padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-base)}.ibiz-control-treeview-quick-search{margin-bottom:var(--ibiz-spacing-tight)}

package/lib/control/tree-grid-ex/tree-grid-ex.cjs

@@ -5,6 +5,7 @@ var vue3Util = require('@ibiz-template/vue3-util');
 var runtime = require('@ibiz-template/runtime');
 require('./tree-grid-ex.css');
 var core = require('@ibiz-template/core');
+var qxUtil = require('qx-util');
 var useRowEditPopover = require('./use-row-edit-popover.cjs');
 
 "use strict";
@@ -66,6 +67,7 @@ const TreeGridExControl = /* @__PURE__ */ vue.defineComponent({
         return temp;
       });
     };
+    const tableRefreshKey = vue.ref(qxUtil.createUUID());
     const treeRootData = vue.computed(() => {
       if (!c.state.isLoaded) {
         return [];
@@ -78,11 +80,15 @@ const TreeGridExControl = /* @__PURE__ */ vue.defineComponent({
       }, []);
     });
     const elTableData = vue.computed(() => {
+      tableRefreshKey.value = qxUtil.createUUID();
       if (treeRootData.value.length === 0) {
         return [];
       }
       return toElNodes(treeRootData.value, true);
     });
+    c.evt.on("onAfterRefreshParent", () => {
+      tableRefreshKey.value = qxUtil.createUUID();
+    });
     const loadData = async (item, treeNode, callback) => {
       let nodes;
       const nodeData = c.getNodeData(item.id);
@@ -157,6 +163,7 @@ const TreeGridExControl = /* @__PURE__ */ vue.defineComponent({
       tableRef,
       elTableData,
       renderColumns,
+      tableRefreshKey,
       renderNoData,
       loadData,
       onRowClick,
@@ -209,6 +216,7 @@ const TreeGridExControl = /* @__PURE__ */ vue.defineComponent({
     }, {
       default: () => [this.c.state.isLoaded && vue.createVNode(vue.resolveComponent("el-table"), {
         "ref": "tableRef",
+        "key": this.tableRefreshKey,
         "class": this.ns.e("table"),
         "border": true,
         "row-key": "id",

package/lib/editor/color-picker/ibiz-color-picker/ibiz-color-picker.cjs

@@ -16,6 +16,7 @@ const IBizColorPicker = /* @__PURE__ */ vue.defineComponent({
     const c = props.controller;
     const currentVal = vue.ref("");
     const colorPicker = vue.ref(null);
+    const predefineColors = vue.ref(["#000000", "#2C2C2C", "#50555C", "#ACB3BF", "#D0D3D9", "#C4C4C4", "#DADADA", "#E5E5E5", "#F0F0F0", "#F24E1E", "#E99C58", "#FFC700", "#FF4D00", "#FF00D6", "#D82E57", "#8E1DE8", "#0ACF83", "#18A0FB", "#A259FF", "#907CFF"]);
     const showFormDefaultContent = vue.computed(() => {
       if (props.controlParams && props.controlParams.editmode === "hover") {
         return true;
@@ -59,6 +60,7 @@ const IBizColorPicker = /* @__PURE__ */ vue.defineComponent({
       ns,
       c,
       currentVal,
+      predefineColors,
       contentStyle,
       colorPicker,
       handleChange,
@@ -85,7 +87,9 @@ const IBizColorPicker = /* @__PURE__ */ vue.defineComponent({
         "onChange": this.handleChange,
         "onBlur": this.onBlur,
         "onFocus": this.onFocus,
-        "size": "small"
+        "size": "small",
+        "predefine": this.predefineColors,
+        "show-alpha": true
       }, null), vue.createVNode("span", {
         "class": this.ns.b("text")
       }, [this.currentVal])]);

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

@@ -163,7 +163,7 @@ const IBizPicker = /* @__PURE__ */ vue.defineComponent({
     vue.onMounted(() => {
       vue.watch(() => props.data[c.valueItem], async (newVal, oldVal) => {
         if (newVal !== oldVal) {
-          if (!isLoaded.value && editorRef.value) {
+          if (!isLoaded.value && editorRef.value && ramda.isNil(props.value)) {
             await onSearch("");
           }
           const curItem = items.value.find((item) => Object.is(item[c.keyName], newVal));

package/lib/editor/data-picker/ibiz-picker-dropdown/ibiz-picker-dropdown.cjs

@@ -91,7 +91,7 @@ const IBizPickerDropDown = /* @__PURE__ */ vue.defineComponent({
     vue.onMounted(() => {
       vue.watch(() => props.data[c.valueItem], async (newVal, oldVal) => {
         if (newVal !== oldVal) {
-          if (!isLoaded.value && editorRef.value) {
+          if (!isLoaded.value && editorRef.value && ramda.isNil(props.value)) {
             shouldLoad.value = true;
             await onSearch("");
           }

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}