@ibiz-template/vue3-components 0.7.4 → 0.7.6

package/es/panel-component/nav-pos-index/nav-pos-index.controller.mjs

@@ -1,5 +1,6 @@
 import { PanelItemController, ViewMode, Modal } from '@ibiz-template/runtime';
 import { routerCallback } from '@ibiz-template/vue3-util';
+import { notNilEmpty } from 'qx-util';
 import { NavPosIndexState } from './nav-pos-index.state.mjs';
 
 "use strict";
@@ -33,6 +34,23 @@ class NavPosIndexController extends PanelItemController {
      * @type {boolean}
      */
     __publicField(this, "autoGoLast", true);
+    /**
+     * 无缓存
+     * @author lxm
+     * @date 2024-04-22 04:12:41
+     * @readonly
+     * @type {boolean}
+     */
+    __publicField(this, "noCache", false);
+    /**
+     * 自定义补充参数
+     *
+     * @author zk
+     * @date 2023-09-27 03:09:02
+     * @type {IData}
+     * @memberof NavPosController
+     */
+    __publicField(this, "rawItemParams", {});
   }
   createState() {
     var _a;
@@ -70,6 +88,11 @@ class NavPosIndexController extends PanelItemController {
   get appmenu() {
     return this.panel.getController("appmenu");
   }
+  async onInit() {
+    await super.onInit();
+    this.handleRawItemParams();
+    this.noCache = this.rawItemParams.expcache === "NO_CACHE";
+  }
   /**
    * 改变显示视图
    * @author lxm
@@ -248,6 +271,26 @@ class NavPosIndexController extends PanelItemController {
       ibiz.util.setBrowserTitle("");
     }
   }
+  /**
+   * 处理自定义补充参数 [{key:'name',value:'data'}] => {name:'data'}
+   *
+   * @author zk
+   * @date 2023-09-27 03:09:55
+   * @protected
+   * @memberof NavPosController
+   */
+  handleRawItemParams() {
+    var _a;
+    let params = {};
+    const rawItemParams = (_a = this.model.rawItem) == null ? void 0 : _a.rawItemParams;
+    if (notNilEmpty(rawItemParams)) {
+      params = rawItemParams.reduce((param, item) => {
+        param[item.key.toLowerCase()] = item.value;
+        return param;
+      }, {});
+    }
+    Object.assign(this.rawItemParams, params);
+  }
 }
 
 export { NavPosIndexController };

package/es/panel-component/nav-pos-index/nav-pos-index.mjs

@@ -69,6 +69,9 @@ const NavPosIndex = /* @__PURE__ */ defineComponent({
       default: ({
         Component
       }) => {
+        if (this.c.noCache) {
+          return Component ? createVNode(Component, null, null) : null;
+        }
         return createVNode(resolveComponent("keepAlive"), {
           "include": cacheKeys,
           "max": 30,

package/es/panel-component/panel-button/panel-button.controller.mjs

@@ -97,6 +97,8 @@ class PanelButtonController extends PanelItemController {
     if (actionType === "NONE") {
       return;
     }
+    event.stopPropagation();
+    event.preventDefault();
     await UIActionUtil.execAndResolved(
       uiactionId,
       {

package/es/panel-component/panel-static-carousel/panel-static-carousel.mjs

@@ -36,10 +36,18 @@ const PanelStaticCarousel = /* @__PURE__ */ defineComponent({
     if ((_a = model.rawItem) == null ? void 0 : _a.rawItemParams) {
       let swipeData = [];
       const imgData = model.rawItem.rawItemParams;
-      const configItem = imgData.findIndex((item) => Object.is(item.key, "autoplay"));
-      if (configItem > -1) {
-        swipeData = imgData.slice(0, -2);
-        getSwipeConfig(imgData.slice(-2));
+      const autoplayIndex = imgData.findIndex((item) => Object.is(item.key, "autoplay"));
+      const timespanIndex = imgData.findIndex((item) => Object.is(item.key, "timespan"));
+      let number = 0;
+      if (autoplayIndex >= 0) {
+        number += 1;
+      }
+      if (timespanIndex >= 0) {
+        number += 1;
+      }
+      if (number > 0) {
+        swipeData = imgData.slice(0, -number);
+        getSwipeConfig(imgData.slice(-number));
       } else {
         swipeData = imgData;
         getSwipeConfig(imgData);
@@ -53,7 +61,7 @@ const PanelStaticCarousel = /* @__PURE__ */ defineComponent({
         return {
           id,
           name: key,
-          imgUrl: sysImage == null ? void 0 : sysImage.imagePath,
+          imgUrl: (sysImage == null ? void 0 : sysImage.imagePath) || (sysImage == null ? void 0 : sysImage.rawContent),
           cssClass: sysImage == null ? void 0 : sysImage.cssClass,
           linkPath: item.linkPath
         };

package/es/view-engine/wizard-view-engine.mjs

@@ -27,8 +27,8 @@ class WizardViewEngine extends ViewEngineBase {
       this.view.slotProps.wizardpanel = {};
     }
     this.wizardPanel.initialize();
-    this.wizardPanel.evt.on("onFinishSuccess", (_event) => {
-      this.view.closeView({ ok: true, data: [] });
+    this.wizardPanel.evt.on("onFinishSuccess", (event) => {
+      this.view.closeView({ ok: true, data: event.data });
     });
   }
 }

package/lib/common/action-toolbar/action-toolbar.cjs

@@ -151,7 +151,7 @@ const IBizActionToolbar = /* @__PURE__ */ vue.defineComponent({
         "class": this.ns.e("caption")
       }, [this.caption, vue.createVNode("ion-icon", {
         "class": this.ns.e("caption-icon"),
-        "name": "ibiz-arrow-down"
+        "name": "ellipsis-vertical-outline"
       }, null)]),
       dropdown: () => vue.createVNode(vue.resolveComponent("el-dropdown-menu"), null, {
         default: () => [details.length > 0 && details.map((detail) => {

package/lib/common/rawitem/rawitem.cjs

@@ -31,7 +31,7 @@ const IBizRawItem = /* @__PURE__ */ vue.defineComponent({
     }
     const rawItemType = vue.ref(props.type || contentType || "");
     const rawItemContent = vue.ref("");
-    let sysImage = null;
+    let sysImage;
     if (contentType === "IMAGE") {
       sysImage = rawItem.sysImage;
     }
@@ -71,7 +71,7 @@ const IBizRawItem = /* @__PURE__ */ vue.defineComponent({
     const rawItemText = vue.ref("");
     const convertValue = () => {
       if (rawItemType.value === "IMAGE") {
-        if (typeof props.content === "string") {
+        if (props.content && typeof props.content === "string") {
           if (isImg(props.content)) {
             rawItemContent.value = {
               imagePath: props.content
@@ -81,6 +81,8 @@ const IBizRawItem = /* @__PURE__ */ vue.defineComponent({
               cssClass: props.content
             };
           }
+        } else if (sysImage) {
+          rawItemContent.value = sysImage;
         }
       }
       if (["TEXT", "HEADING1", "HEADING2", "HEADING3", "HEADING4", "HEADING5", "HEADING6", "PARAGRAPH", "HTML", "RAW"].includes(rawItemType.value)) {
@@ -124,7 +126,7 @@ const IBizRawItem = /* @__PURE__ */ vue.defineComponent({
     };
     convertValue();
     vue.watch(() => props.content, (newVal, oldVal) => {
-      if (newVal !== oldVal) {
+      if (newVal && newVal !== oldVal) {
         rawItemContent.value = newVal;
         convertValue();
       }

package/lib/common/view-message/view-message.cjs

@@ -69,11 +69,15 @@ const ViewMessage = /* @__PURE__ */ vue.defineComponent({
     });
     const handleAlertClose = (index) => {
       items.value[index].hidden = true;
-      const isHiddenCarouse = items.value.every((item) => item.hidden);
+      const isHiddenCarouse = items.value.every((item2) => item2.hidden);
       if (isHiddenCarouse) {
         isHiddenContainer.value = true;
       }
       uuid.value = qxUtil.createUUID();
+      const item = items.value[index];
+      if (item.removeMode === 1) {
+        localStorage.setItem(item.key, "1");
+      }
     };
     const handleChange = (index) => {
       initialIndex.value = index;

package/lib/control/app-menu/app-menu.cjs

@@ -192,6 +192,9 @@ const AppMenuControl = /* @__PURE__ */ vue.defineComponent({
         defaultActive.value = activeMenu ? activeMenu.id : "";
       }
     });
+    const fn = (data) => {
+      counterData.value = data;
+    };
     c.evt.on("onMounted", async () => {
       const allItems = c.getAllItems();
       const defaultActiveMenuItem = allItems.find((item) => {
@@ -216,13 +219,12 @@ const AppMenuControl = /* @__PURE__ */ vue.defineComponent({
       if (counterRefId) {
         counter = c.getCounter(counterRefId);
         if (counter) {
-          counter.onChange((data) => {
-            counterData.value = data;
-          });
+          counter.onChange(fn);
         }
       }
     });
     vue.onUnmounted(() => {
+      counter == null ? void 0 : counter.offChange(fn);
       counter == null ? void 0 : counter.destroy();
     });
     const menuMode = vue.computed(() => {

package/lib/control/dashboard/custom-dashboard-container/custom-dashboard-container.cjs

@@ -22,7 +22,7 @@ const CustomDashboardContainer = /* @__PURE__ */ vue.defineComponent({
     emit
   }) {
     const ns = vue3Util.useNamespace("custom-dashboard-container");
-    const customC = vue.reactive(new runtime.CustomDashboardController(props.modelData));
+    const customC = vue.reactive(new runtime.CustomDashboardController(props.modelData, props.dashboard));
     const isInited = vue.ref(false);
     const isShowDesign = vue.ref(false);
     const showTypeDir = vue.ref(false);
@@ -66,13 +66,27 @@ const CustomDashboardContainer = /* @__PURE__ */ vue.defineComponent({
     const isShowDefault = vue.computed(() => {
       return customC.customModelData.length === 0;
     });
+    const handleCustomModelChange = async (args) => {
+      await props.dashboard.initPortlets(args.model);
+      await props.dashboard.initPortletsConfig(args.config);
+    };
     vue.onMounted(async () => {
-      const model = await customC.loadCustomModelData();
-      const tempModelDatas = convertData(model);
-      emit("changed", {
-        model: tempModelDatas
+      const response = await customC.loadCustomModelData();
+      const tempModelDatas = convertData(response.model);
+      await handleCustomModelChange({
+        model: tempModelDatas,
+        config: response.config
       });
       isInited.value = true;
+      props.dashboard.evt.on("onConfigChange", async (eventArgs) => {
+        const {
+          name,
+          config
+        } = eventArgs;
+        customC.saveCustomModelData(customC.customModelData, {
+          [name]: config
+        });
+      });
     });
     return {
       ns,

package/lib/control/dashboard/dashboard-design/dashboard-design.cjs

@@ -136,6 +136,7 @@ const DashboardDesign = /* @__PURE__ */ vue.defineComponent({
     const groups = vue.ref(result.groups);
     const filterVal = vue.ref("");
     const layoutModel = vue.ref(ramda.clone(customC.customModelData));
+    const layoutConfig = vue.ref(ramda.clone(customC.portletConfig));
     const providers = vue.ref({});
     const portletControllers = vue.ref({});
     const designPanel = vue.ref(null);
@@ -166,6 +167,17 @@ const DashboardDesign = /* @__PURE__ */ vue.defineComponent({
         }
       }));
     };
+    const initPortletsConfig = async () => {
+      const config = layoutConfig.value || {};
+      Object.keys(config).forEach((key) => {
+        const portlet = portletControllers.value[key];
+        if (portlet) {
+          portlet.config = config[key];
+          portlet.state.title = portlet.config.srftitle;
+          Object.assign(portlet.params, portlet.config);
+        }
+      });
+    };
     const getPortletByCodeName = (codeName) => {
       const app = ibiz.hub.getApp(ibiz.env.appId);
       if (app.model.appPortlets) {
@@ -193,11 +205,13 @@ const DashboardDesign = /* @__PURE__ */ vue.defineComponent({
     const preparePortlet = async () => {
       const tempModelDatas = convertData(layoutModel.value);
       await initPortlets(tempModelDatas);
+      await initPortletsConfig();
     };
     vue.watch(() => props.isShowDesign, async (newVal) => {
       if (newVal) {
-        const tempData = await customC.loadCustomModelData();
-        layoutModel.value = ramda.clone(tempData);
+        const res = await customC.loadCustomModelData();
+        layoutModel.value = ramda.clone(res.model);
+        layoutConfig.value = ramda.clone(res.config);
         await preparePortlet();
       }
     }, {
@@ -211,9 +225,9 @@ const DashboardDesign = /* @__PURE__ */ vue.defineComponent({
       layoutModel.value = [];
     };
     const onSave = async () => {
-      const model = await customC.saveCustomModelData(layoutModel.value);
+      const res = await customC.saveCustomModelData(layoutModel.value);
       emit("saved", {
-        model
+        model: res.model
       });
     };
     const removeItem = async (child) => {

package/lib/control/dashboard/dashboard-design/dashboard-design.css

@@ -1 +1 @@
-.ibiz-dashboard-design{width:100%;height:100%}.ibiz-dashboard-design .ibiz-dashboard-design-header{height:48px;padding:var(--ibiz-spacing-tight);display:flex;align-items:center;justify-content:space-between}.ibiz-dashboard-design .ibiz-dashboard-design-header .ibiz-dashboard-design-header-utils{display:flex;align-items:center;justify-content:flex-start}.ibiz-dashboard-design-header-utils__col-num{margin-right:var(--ibiz-spacing-tight)}.ibiz-dashboard-design-header-utils__row-h{margin-right:var(--ibiz-spacing-tight)}.ibiz-dashboard-design .ibiz-dashboard-design-content{width:100%;height:calc(100% - 48px);display:flex;align-items:flex-start;justify-content:flex-start}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-tree{min-width:300px;height:100%;overflow-y:scroll}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-tree .ibiz-dashboard-design-tree-filter{width:100%;height:32px;padding:0 var(--ibiz-spacing-tight)}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-tree .ibiz-dashboard-design-tree-content{height:calc(100% - 32px);overflow:auto}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-tree .ibiz-dashboard-design-tree-content>.el-menu{height:100%;border:none}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-tree .ibiz-dashboard-design-tree-content>.el-menu .el-menu-item{display:flex;flex-flow:flex nowrap;align-items:center;justify-content:space-between}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-tree .ibiz-dashboard-design-tree-content>.el-menu .el-menu-item>span{max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-tree .ibiz-dashboard-design-tree-content>.el-menu .el-menu-item ion-icon{cursor:pointer}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-tree .ibiz-dashboard-design-tree-content>.el-menu .el-menu-item ion-icon:hover{color:var(--ibiz-color-primary)}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-scroll-box{flex-grow:1;height:100%;overflow-y:scroll;background:#efefef}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-panel{position:relative}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-panel .ibiz-dashboard-design-grid-layout-mask{position:absolute;inset:0;height:100%;min-height:1248px;background:linear-gradient(to bottom,var(--ibiz-color-primary) 10px,transparent 10px),linear-gradient(to right,var(--ibiz-color-primary) 10px,transparent 10px)}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-panel .ibiz-dashboard-design-grid-layout .ibiz-dashboard-design-grid-layout-item{width:100%;height:100%}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-panel .ibiz-dashboard-design-grid-layout .ibiz-dashboard-design-grid-layout-item .el-card__body{display:flex;flex-flow:column nowrap;height:100%;background-color:var(--ibiz-color-white)}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-panel .ibiz-dashboard-design-grid-layout .ibiz-dashboard-design-grid-layout-item .ibiz-dashboard-design-grid-layout-item-header{display:flex;align-items:center;justify-content:space-between}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-panel .ibiz-dashboard-design-grid-layout .ibiz-dashboard-design-grid-layout-item .ibiz-dashboard-design-grid-layout-item-header>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-panel .ibiz-dashboard-design-grid-layout .ibiz-dashboard-design-grid-layout-item .ibiz-dashboard-design-grid-layout-item-header ion-icon{cursor:pointer}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-panel .ibiz-dashboard-design-grid-layout .ibiz-dashboard-design-grid-layout-item .ibiz-dashboard-design-grid-layout-item-content{display:flex;align-items:center;justify-content:center;width:100%;height:100%}
+.ibiz-dashboard-design{width:100%;height:100%}.ibiz-dashboard-design .ibiz-dashboard-design-header{height:48px;padding:var(--ibiz-spacing-tight);display:flex;align-items:center;justify-content:space-between}.ibiz-dashboard-design .ibiz-dashboard-design-header .ibiz-dashboard-design-header-utils{display:flex;align-items:center;justify-content:flex-start}.ibiz-dashboard-design-header-utils__col-num{margin-right:var(--ibiz-spacing-tight)}.ibiz-dashboard-design-header-utils__row-h{margin-right:var(--ibiz-spacing-tight)}.ibiz-dashboard-design .ibiz-dashboard-design-content{width:100%;height:calc(100% - 48px);display:flex;align-items:flex-start;justify-content:flex-start}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-tree{min-width:300px;height:100%;overflow-y:scroll}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-tree .ibiz-dashboard-design-tree-filter{width:100%;height:32px;padding:0 var(--ibiz-spacing-tight)}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-tree .ibiz-dashboard-design-tree-content{height:calc(100% - 32px);overflow:auto}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-tree .ibiz-dashboard-design-tree-content>.el-menu{height:100%;border:none}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-tree .ibiz-dashboard-design-tree-content>.el-menu .el-menu-item{display:flex;flex-flow:flex nowrap;align-items:center;justify-content:space-between}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-tree .ibiz-dashboard-design-tree-content>.el-menu .el-menu-item>span{max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-tree .ibiz-dashboard-design-tree-content>.el-menu .el-menu-item ion-icon{cursor:pointer}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-tree .ibiz-dashboard-design-tree-content>.el-menu .el-menu-item ion-icon:hover{color:var(--ibiz-color-primary)}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-scroll-box{flex-grow:1;height:100%;overflow-y:scroll;background:#efefef}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-panel{position:relative}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-panel .ibiz-dashboard-design-grid-layout-mask{position:absolute;inset:0;height:100%;min-height:1248px;background:linear-gradient(to bottom,var(--ibiz-color-primary) 10px,transparent 10px),linear-gradient(to right,var(--ibiz-color-primary) 10px,transparent 10px)}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-panel .ibiz-dashboard-design-grid-layout .ibiz-dashboard-design-grid-layout-item{width:100%;height:100%}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-panel .ibiz-dashboard-design-grid-layout .ibiz-dashboard-design-grid-layout-item .el-card__body{display:flex;flex-flow:column nowrap;height:100%;background-color:var(--ibiz-color-white)}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-panel .ibiz-dashboard-design-grid-layout .ibiz-dashboard-design-grid-layout-item .ibiz-dashboard-design-grid-layout-item-header{display:flex;align-items:center;justify-content:space-between}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-panel .ibiz-dashboard-design-grid-layout .ibiz-dashboard-design-grid-layout-item .ibiz-dashboard-design-grid-layout-item-header>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-panel .ibiz-dashboard-design-grid-layout .ibiz-dashboard-design-grid-layout-item .ibiz-dashboard-design-grid-layout-item-header ion-icon{cursor:pointer}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-panel .ibiz-dashboard-design-grid-layout .ibiz-dashboard-design-grid-layout-item .ibiz-dashboard-design-grid-layout-item-content{display:flex;align-items:center;justify-content:center;width:100%;height:100%;pointer-events:none}

package/lib/control/dashboard/dashboard.cjs

@@ -58,7 +58,6 @@ const DashboardControl = /* @__PURE__ */ vue.defineComponent({
   },
   setup() {
     const c = vue3Util.useControlController((...args) => new runtime.DashboardController(...args));
-    const vue$1 = vue.getCurrentInstance().proxy;
     const customModelDatas = vue.ref([]);
     const ns = vue3Util.useNamespace("control-".concat(c.model.controlType.toLowerCase()));
     c.evt.on("onCreated", () => {
@@ -66,16 +65,10 @@ const DashboardControl = /* @__PURE__ */ vue.defineComponent({
         portlet.state = vue.reactive(portlet.state);
       });
     });
-    const handleCustomModelChange = async (args) => {
-      customModelDatas.value = args.model;
-      await c.initPortlets(customModelDatas.value);
-      vue$1.$forceUpdate();
-    };
     return {
       c,
       ns,
-      customModelDatas,
-      handleCustomModelChange
+      customModelDatas
     };
   },
   render() {
@@ -121,8 +114,7 @@ const DashboardControl = /* @__PURE__ */ vue.defineComponent({
     }, {
       default: () => [state.isCreated && (model.enableCustomized ? vue.createVNode(vue.resolveComponent("iBizCustomDashboardContainer"), {
         "modelData": this.modelData,
-        "dashboard": this.c,
-        "onChanged": this.handleCustomModelChange
+        "dashboard": this.c
       }, _isSlot(_slot2 = renderCustomSlots()) ? _slot2 : {
         default: () => [_slot2]
       }) : renderDefaultContent())]

package/lib/control/dashboard/portlet/portlet-layout/portlet-layout.cjs

@@ -36,10 +36,6 @@ const PortletLayout = /* @__PURE__ */ vue.defineComponent({
       model,
       state
     } = this.controller;
-    let title = model.title;
-    if (model.titleLanguageRes) {
-      title = ibiz.i18n.t(model.titleLanguageRes.lanResTag, model.title);
-    }
     return vue.createVNode("div", {
       "class": [this.ns.b(), this.ns.is("no-header", !this.isShowHeader)]
     }, [this.isShowHeader && vue.createVNode("div", {
@@ -54,13 +50,14 @@ const PortletLayout = /* @__PURE__ */ vue.defineComponent({
       "icon": model.sysImage
     }, null), vue.createVNode("span", {
       "class": this.ns.e("caption-text"),
-      "title": title
-    }, [title])])]), vue.createVNode("div", {
+      "title": state.title
+    }, [state.title])])]), vue.createVNode("div", {
       "class": this.ns.be("header", "right")
     }, [model.uiactionGroup && vue.createVNode(vue.resolveComponent("iBizActionToolbar"), {
       "class": this.ns.e("toolbar"),
       "action-details": model.uiactionGroup.uiactionGroupDetails,
       "actions-state": state.actionGroupState,
+      "mode": model.actionGroupExtractMode === "ITEMS" ? "dropdown" : "buttons",
       "onActionClick": this.onActionClick
     }, null)])]), vue.createVNode("div", {
       "key": "content",

package/lib/control/drbar/drbar.cjs

@@ -46,13 +46,18 @@ const DRBarControl = /* @__PURE__ */ vue.defineComponent({
     const ns = vue3Util.useNamespace("control-".concat(c.model.controlType.toLowerCase()));
     const router = vueRouter.useRouter();
     const counterData = vue.reactive({});
+    const fn = (counter) => {
+      Object.assign(counterData, counter);
+    };
     c.evt.on("onCreated", () => {
       if (c.counter) {
-        c.counter.onChange((counter) => {
-          Object.assign(counterData, counter);
-        }, true);
+        c.counter.onChange(fn, true);
       }
     });
+    vue.onUnmounted(() => {
+      var _a;
+      (_a = c.counter) == null ? void 0 : _a.offChange(fn);
+    });
     c.setRouter(router);
     const handleSelect = (key) => {
       c.handleSelectChange(key);

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

@@ -440,7 +440,8 @@ class DRBarController extends runtime.ControlController {
     if (appCounterRef) {
       this.counter = await runtime.CounterService.getCounterByRef(
         appCounterRef,
-        this.context
+        this.context,
+        { ...this.params }
       );
     }
   }

package/lib/control/drtab/drtab.cjs

@@ -36,13 +36,18 @@ const DRTabControl = /* @__PURE__ */ vue.defineComponent({
     const ns = vue3Util.useNamespace("control-".concat(c.model.controlType.toLowerCase()));
     const router = vueRouter.useRouter();
     const counterData = vue.reactive({});
+    const fn = (counter) => {
+      Object.assign(counterData, counter);
+    };
     c.evt.on("onCreated", () => {
       if (c.counter) {
-        c.counter.onChange((counter) => {
-          Object.assign(counterData, counter);
-        }, true);
+        c.counter.onChange(fn, true);
       }
     });
+    vue.onUnmounted(() => {
+      var _a;
+      (_a = c.counter) == null ? void 0 : _a.offChange(fn);
+    });
     c.setRouter(router);
     const handleTabChange = () => {
       c.handleTabChange();
@@ -62,10 +67,17 @@ const DRTabControl = /* @__PURE__ */ vue.defineComponent({
             const {
               srfnav
             } = routePath.pathNodes[depth - 1];
+            const isRoutePushed = !!c.routeDepth && runtime.hasSubRoute(c.routeDepth);
             if (srfnav && c.state.activeName && c.state.activeName !== srfnav) {
               c.state.activeName = srfnav;
-              const isRoutePushed = !!c.routeDepth && runtime.hasSubRoute(c.routeDepth);
               c.handleTabChange(isRoutePushed);
+            } else if (!srfnav) {
+              const routeNoSub = !!c.routeDepth && !runtime.hasSubRoute(c.routeDepth);
+              const doTabChange = c.state.activeName !== c.state.defaultName || routeNoSub;
+              if (doTabChange) {
+                c.state.activeName = c.state.defaultName;
+                c.handleTabChange(isRoutePushed);
+              }
             }
           }
         }

package/lib/control/drtab/drtab.controller.cjs

@@ -170,6 +170,9 @@ class DRTabController extends runtime.ControlController {
         sysImage: editItemSysImage,
         fullPath: this.routeDepth ? vue3Util.getNestedRoutePath(this.router.currentRoute.value, this.routeDepth) : ""
       });
+      this.state.defaultName = "";
+    } else {
+      this.state.defaultName = (dedrtabPages == null ? void 0 : dedrtabPages[0].id) || "";
     }
     dedrtabPages == null ? void 0 : dedrtabPages.forEach((item) => {
       let itemCaption = item.caption;
@@ -304,7 +307,8 @@ class DRTabController extends runtime.ControlController {
     if (appCounterRef) {
       this.counter = await runtime.CounterService.getCounterByRef(
         appCounterRef,
-        this.context
+        this.context,
+        { ...this.params }
       );
     }
   }

package/lib/control/form/form-detail/form-tab-panel/form-tab-panel.cjs

@@ -38,6 +38,9 @@ const FormTabPanel = /* @__PURE__ */ vue.defineComponent({
         pageC.onClick(event);
       }
     };
+    const fn = (data) => {
+      counterData.value = data;
+    };
     vue.onMounted(() => {
       var _a, _b;
       const defaultSlots = ((_a = slots.default) == null ? void 0 : _a.call(slots)) || [];
@@ -52,14 +55,12 @@ const FormTabPanel = /* @__PURE__ */ vue.defineComponent({
       if (counterRefId.value) {
         counter = props.controller.getCounter(counterRefId.value);
         if (counter) {
-          counter.onChange((data) => {
-            counterData.value = data;
-          });
+          counter.onChange(fn);
         }
       }
     });
     vue.onUnmounted(() => {
-      counter == null ? void 0 : counter.destroy();
+      counter == null ? void 0 : counter.offChange(fn);
     });
     return {
       ns,

package/lib/control/grid/grid/grid-control.util.cjs

@@ -1,5 +1,6 @@
 'use strict';
 
+var core = require('@ibiz-template/core');
 var runtime = require('@ibiz-template/runtime');
 var vue = require('vue');
 
@@ -92,6 +93,9 @@ function useITableEvent(c) {
     if (row.srfkey) {
       activeClassName += " id-".concat(row.srfkey);
     }
+    if (c.enableRowEditOrder) {
+      activeClassName += " enable-order";
+    }
     return activeClassName;
   }
   function handleHeaderCellClassName({
@@ -293,8 +297,101 @@ function useGridHeaderStyle(tableRef, ns) {
     headerCssVars
   };
 }
+function useGridDraggable(tableRef, ns, c) {
+  if (!c.enableRowEditOrder || !c.model.orderValueAppDEFieldId) {
+    return {};
+  }
+  let draggingDom = null;
+  let dragIndex = 0;
+  let draggingKey = "";
+  let draggingData = null;
+  const cleanups = [];
+  const calcSrfKeyByClass = (classList) => {
+    let result = "";
+    classList.forEach((className) => {
+      if (className.startsWith("id-")) {
+        result = className.replace("id-", "");
+      }
+    });
+    return result;
+  };
+  const setRowDragEvent = (item) => {
+    item.setAttribute("draggable", "true");
+    const cleanDragStart = core.listenJSEvent(
+      item,
+      "dragstart",
+      (event) => {
+        if (event.target) {
+          draggingDom = event.target;
+          event.dataTransfer.effectAllowed = "move";
+          draggingKey = calcSrfKeyByClass(draggingDom.classList);
+          dragIndex = c.state.rows.findIndex(
+            (row) => row.data.srfkey === draggingKey
+          );
+          draggingData = c.state.rows[dragIndex];
+        }
+      }
+    );
+    const cleanDragEnter = core.listenJSEvent(
+      item,
+      "dragenter",
+      (event) => {
+        event.preventDefault();
+        const targetDom = event.currentTarget;
+        const targetKey = calcSrfKeyByClass(targetDom.classList);
+        const targetIndex = c.state.rows.findIndex(
+          (row) => row.data.srfkey === targetKey
+        );
+        if (draggingKey === targetKey || targetIndex === -1) {
+          return;
+        }
+        c.state.rows.splice(dragIndex, 1);
+        c.state.rows.splice(targetIndex, 0, draggingData);
+        dragIndex = targetIndex;
+      }
+    );
+    const cleanDragOver = core.listenJSEvent(
+      item,
+      "dragover",
+      (event) => {
+        event.preventDefault();
+      }
+    );
+    const cleanDragEnd = core.listenJSEvent(item, "dragend", (event) => {
+      event.preventDefault();
+      c.onDragChange();
+    });
+    cleanups.push(cleanDragStart);
+    cleanups.push(cleanDragEnter);
+    cleanups.push(cleanDragOver);
+    cleanups.push(cleanDragEnd);
+  };
+  vue.watch(
+    [() => tableRef.value, () => c.state.isLoaded],
+    (table, isLoaded) => {
+      if (!isLoaded || !table) {
+        return;
+      }
+      const grid = tableRef.value.$el;
+      if (grid) {
+        const rows = grid.getElementsByClassName("el-table__row");
+        rows.forEach((item) => {
+          setRowDragEvent(item);
+        });
+      }
+    }
+  );
+  return {
+    cleanup: () => {
+      cleanups.forEach((cleanup) => {
+        cleanup();
+      });
+    }
+  };
+}
 
 exports.useAppGridBase = useAppGridBase;
 exports.useAppGridPagination = useAppGridPagination;
+exports.useGridDraggable = useGridDraggable;
 exports.useGridHeaderStyle = useGridHeaderStyle;
 exports.useITableEvent = useITableEvent;