@ibiz-template/vue3-components 0.7.30-alpha.3 → 0.7.31-alpha.0

package/lib/common/pql-editor/pql-editor.module.cjs

@@ -0,0 +1,182 @@
+'use strict';
+
+var editor = require('@wangeditor/editor');
+require('../../node_modules/.pnpm/snabbdom@3.5.1/node_modules/snabbdom/build/index.cjs');
+var index = require('./utils/index.cjs');
+var h = require('../../node_modules/.pnpm/snabbdom@3.5.1/node_modules/snabbdom/build/h.cjs');
+
+"use strict";
+const pqlType = [
+  "pql-field",
+  "pql-field-value",
+  "pql-field-operator",
+  "pql-field-connection"
+];
+function withPqlPlugin(editor$1) {
+  var _a;
+  const { isVoid, isInline, deleteBackward, deleteFragment, insertText } = editor$1;
+  const newEditor = editor$1;
+  const config = newEditor.getConfig();
+  const pql = (_a = config.EXTEND_CONF) == null ? void 0 : _a.pql;
+  let timer;
+  const updateCursor = () => {
+    var _a2;
+    const { selection } = editor$1;
+    if (selection && ((_a2 = selection.focus) == null ? void 0 : _a2.offset) === 0) {
+      const node = editor.SlateEditor.node(editor$1, selection)[0];
+      if (node) {
+        const el = editor$1.toDOMNode(node);
+        if (index.isMove(el)) {
+          editor$1.move(1);
+        }
+      }
+    }
+  };
+  newEditor.isVoid = (el) => {
+    const type = editor.DomEditor.getNodeType(el);
+    if (pqlType.includes(type)) {
+      return true;
+    }
+    return isVoid(el);
+  };
+  newEditor.isInline = (el) => {
+    const type = editor.DomEditor.getNodeType(el);
+    if (pqlType.includes(type)) {
+      return true;
+    }
+    return isInline(el);
+  };
+  newEditor.deleteBackward = (unit) => {
+    deleteBackward(unit);
+    if (pql && pql.showSuggestion) {
+      window.clearTimeout(timer);
+      timer = window.setTimeout(() => {
+        updateCursor();
+        pql.showSuggestion();
+      }, 10);
+    }
+  };
+  newEditor.deleteFragment = (direction) => {
+    deleteFragment(direction);
+    if (pql && pql.showSuggestion) {
+      window.clearTimeout(timer);
+      timer = window.setTimeout(() => {
+        updateCursor();
+        pql.showSuggestion();
+      }, 10);
+    }
+  };
+  newEditor.insertText = (text) => {
+    insertText(text);
+    if (pql && pql.showSuggestion) {
+      window.clearTimeout(timer);
+      timer = window.setTimeout(() => {
+        pql.showSuggestion();
+      }, 10);
+    }
+  };
+  return newEditor;
+}
+function renderPqlElement(el) {
+  const { type, label = "" } = el;
+  if (type === "pql-field-operator" || type === "pql-field-connection") {
+    return h.h(
+      "span",
+      {
+        props: {
+          contentEditable: false
+        },
+        style: {
+          display: "inline-block",
+          lineHeight: "22px"
+        }
+      },
+      [label]
+    );
+  }
+  if (type === "pql-field-value") {
+    return h.h(
+      "span",
+      {
+        props: {
+          contentEditable: false
+        },
+        style: {
+          display: "inline-block",
+          lineHeight: "22px",
+          color: "#5dcfff"
+        }
+      },
+      [label]
+    );
+  }
+  const vNode = h.h(
+    "span",
+    {
+      props: {
+        contentEditable: false
+      },
+      style: {
+        color: "#6698ff",
+        backgroundColor: "#edf2fd",
+        display: "inline-block",
+        padding: "0 5px",
+        borderRadius: "3px",
+        lineHeight: "22px"
+      }
+    },
+    [label]
+  );
+  return vNode;
+}
+function pqlToHtml(el) {
+  const type = el.type || "";
+  if (!type) {
+    return el.text || "";
+  }
+  const html = '<span\n        data-pql="true"\n        data-w-e-type="'.concat(type, '"\n        data-w-e-is-void\n        data-w-e-is-inline\n        data-label="').concat(el.label || "", '"\n        data-value="').concat(el.value || "", '"\n    ></span>');
+  return html;
+}
+function parsePqlHtml(domElem) {
+  const type = domElem.getAttribute("data-w-e-type") || "";
+  const label = domElem.getAttribute("data-label") || "";
+  const value = domElem.getAttribute("data-value") || "";
+  if (type) {
+    return {
+      type,
+      label,
+      value,
+      children: [{ text: "" }]
+    };
+  }
+  return {
+    children: [{ text: "" }]
+  };
+}
+const PqlModule = {
+  editorPlugin: withPqlPlugin,
+  renderElems: pqlType.map((type) => {
+    return {
+      type,
+      renderElem: renderPqlElement
+    };
+  }),
+  elemsToHtml: pqlType.map((type) => {
+    return {
+      type,
+      elemToHtml: pqlToHtml
+    };
+  }),
+  parseElemsHtml: [
+    {
+      selector: 'span[data-pql="true"]',
+      parseElemHtml: parsePqlHtml
+    }
+  ]
+};
+
+exports.PqlModule = PqlModule;
+exports.parsePqlHtml = parsePqlHtml;
+exports.pqlToHtml = pqlToHtml;
+exports.renderPqlElement = renderPqlElement;
+exports.withPqlPlugin = withPqlPlugin;

package/lib/common/pql-editor/utils/index.cjs

@@ -0,0 +1,280 @@
+'use strict';
+
+var core = require('@ibiz-template/core');
+var runtime = require('@ibiz-template/runtime');
+
+"use strict";
+const FilterModes = [
+  { valueOP: runtime.ValueOP.EQ, label: "\u7B49\u4E8E", sqlOP: "=" },
+  { valueOP: runtime.ValueOP.NOT_EQ, label: "\u4E0D\u7B49\u4E8E", sqlOP: "<>" },
+  { valueOP: runtime.ValueOP.GT, label: "\u5927\u4E8E", sqlOP: ">" },
+  { valueOP: runtime.ValueOP.GT_AND_EQ, label: "\u5927\u4E8E\u7B49\u4E8E", sqlOP: ">=" },
+  { valueOP: runtime.ValueOP.LT, label: "\u5C0F\u4E8E", sqlOP: "<" },
+  { valueOP: runtime.ValueOP.LT_AND_EQ, label: "\u5C0F\u4E8E\u7B49\u4E8E", sqlOP: "<=" },
+  { valueOP: runtime.ValueOP.IS_NULL, label: "\u4E3A\u7A7A", sqlOP: "Nil" },
+  { valueOP: runtime.ValueOP.IS_NOT_NULL, label: "\u975E\u7A7A", sqlOP: "NotNil" },
+  { valueOP: runtime.ValueOP.IN, label: "\u5C5E\u4E8E", sqlOP: "In" },
+  { valueOP: runtime.ValueOP.NOT_IN, label: "\u4E0D\u5C5E\u4E8E", sqlOP: "NotIn" },
+  { valueOP: runtime.ValueOP.LIKE, label: "\u6587\u672C\u5305\u542B", sqlOP: "%" },
+  { valueOP: runtime.ValueOP.LIFT_LIKE, label: "\u6587\u672C\u5DE6\u5305\u542B", sqlOP: "%#" },
+  { valueOP: runtime.ValueOP.RIGHT_LIKE, label: "\u6587\u672C\u53F3\u5305\u542B", sqlOP: "#%" },
+  { valueOP: runtime.ValueOP.EXISTS, label: "\u5B58\u5728", sqlOP: "EXISTS" },
+  { valueOP: runtime.ValueOP.NOT_EXISTS, label: "\u4E0D\u5B58\u5728", sqlOP: "NOTEXISTS" }
+];
+const ExcludeOPs = [
+  runtime.ValueOP.IS_NULL,
+  runtime.ValueOP.IS_NOT_NULL,
+  runtime.ValueOP.EXISTS,
+  runtime.ValueOP.NOT_EXISTS
+];
+const filterModeMap = /* @__PURE__ */ new Map();
+FilterModes.forEach((mode) => {
+  filterModeMap.set(mode.valueOP, mode);
+});
+const symbolMap = /* @__PURE__ */ new Map();
+FilterModes.forEach((mode) => {
+  symbolMap.set(mode.sqlOP, mode.valueOP);
+});
+const generateItems = (children) => {
+  if (!children.length) {
+    return [];
+  }
+  const items = [];
+  for (let i = 0; i < children.length; i++) {
+    if (i !== 0) {
+      const connection = children[i];
+      if (connection && connection.type === "pql-field-connection") {
+        if (i === children.length - 1) {
+          throw new core.RuntimeError("pql\u8282\u70B9\u89E3\u6790\u9519\u8BEF");
+        }
+        items.push({
+          type: "connection",
+          value: {
+            label: connection.label,
+            value: connection.value
+          }
+        });
+      } else {
+        throw new core.RuntimeError("pql\u8282\u70B9\u89E3\u6790\u9519\u8BEF");
+      }
+    }
+    const key = children[i !== 0 ? ++i : i];
+    const operator = children[++i];
+    if (key && operator && key.type === "pql-field" && operator.type === "pql-field-operator") {
+      if (operator.value && ExcludeOPs.includes(operator.value)) {
+        items.push({
+          type: "condition",
+          key: {
+            label: key.label,
+            value: key.value
+          },
+          operator: {
+            label: operator.label,
+            value: operator.value
+          }
+        });
+        continue;
+      } else {
+        const value = children[++i];
+        if (value && (value.type === "pql-field-value" || value.text)) {
+          items.push({
+            type: "condition",
+            key: {
+              label: key.label,
+              value: key.value
+            },
+            operator: {
+              label: operator.label,
+              value: operator.value
+            },
+            value: {
+              label: value.type === "pql-field-value" ? value.label : value.text,
+              value: value.type === "pql-field-value" ? value.value : value.text
+            }
+          });
+          continue;
+        }
+      }
+    }
+    throw new core.RuntimeError("pql\u8282\u70B9\u89E3\u6790\u9519\u8BEF");
+  }
+  return items;
+};
+const generateCustomCond = (items, fields) => {
+  const map = /* @__PURE__ */ new Map();
+  fields.forEach((item) => {
+    map.set(item.appDEFieldId, item);
+  });
+  let cond = "";
+  items.forEach((item) => {
+    var _a, _b, _c;
+    if (item.type === "condition") {
+      const { key, operator, value } = item;
+      const symbol = (_a = filterModeMap.get(operator == null ? void 0 : operator.value)) == null ? void 0 : _a.sqlOP;
+      cond += "$".concat(JSON.stringify({
+        name: (key == null ? void 0 : key.value) || "",
+        caption: (key == null ? void 0 : key.label) || ""
+      }), "  ").concat(symbol, "  $").concat(JSON.stringify({
+        value: (value == null ? void 0 : value.value) || "",
+        caption: (value == null ? void 0 : value.label) || "",
+        field: "".concat(((_b = map.get((key == null ? void 0 : key.value) || "")) == null ? void 0 : _b.appDataEntityFullTag) || "", ".").concat((key == null ? void 0 : key.value) || "")
+      }));
+    }
+    if (item.type === "connection") {
+      cond += "  ".concat((_c = item.value) == null ? void 0 : _c.value, "  ");
+    }
+  });
+  return cond;
+};
+const parseCustomCond = (cond) => {
+  var _a;
+  try {
+    const items = cond.split("  ");
+    const pqlItems = [];
+    for (let i = 0; i < items.length; i++) {
+      if (i !== 0) {
+        const connection = items[i];
+        if (connection === "and" || connection === "or") {
+          if (i === items.length - 1) {
+            throw new core.RuntimeError("pql\u81EA\u5B9A\u4E49\u6761\u4EF6\u89E3\u6790\u9519\u8BEF");
+          }
+          pqlItems.push({
+            type: "connection",
+            value: {
+              label: connection,
+              value: connection
+            }
+          });
+        } else {
+          throw new core.RuntimeError("pql\u81EA\u5B9A\u4E49\u6761\u4EF6\u89E3\u6790\u9519\u8BEF");
+        }
+      }
+      const key = items[i !== 0 ? ++i : i];
+      const operator = items[++i];
+      const value = items[++i];
+      if (key && /^\$/.test(key) && operator && value && /^\$/.test(value)) {
+        const keyObj = JSON.parse(key.slice(1));
+        const valueObj = JSON.parse(value.slice(1));
+        pqlItems.push({
+          type: "condition",
+          key: {
+            label: keyObj.caption,
+            value: keyObj.name
+          },
+          operator: {
+            label: ((_a = filterModeMap.get(symbolMap.get(operator))) == null ? void 0 : _a.label) || "",
+            value: symbolMap.get(operator)
+          },
+          value: {
+            label: valueObj.caption,
+            value: valueObj.value
+          }
+        });
+        continue;
+      }
+      throw new core.RuntimeError("pql\u81EA\u5B9A\u4E49\u6761\u4EF6\u89E3\u6790\u9519\u8BEF");
+    }
+    return pqlItems;
+  } catch (err) {
+    ibiz.log.error(err == null ? void 0 : err.message);
+  }
+};
+const pqlItemsToPqlNodes = async (items, fields, getCodeListItems) => {
+  const nodes = [];
+  const codeListMap = /* @__PURE__ */ new Map();
+  const fieldList = fields.filter(
+    (child) => items.some((item) => {
+      var _a;
+      return ((_a = item.key) == null ? void 0 : _a.value) === child.appDEFieldId;
+    })
+  );
+  await Promise.all(
+    fieldList.map(async (item) => {
+      if (item.appCodeListId) {
+        const codeItems = await getCodeListItems(item.appCodeListId);
+        if (codeItems) {
+          codeListMap.set(item.appDEFieldId, codeItems);
+        }
+      }
+    })
+  );
+  items.forEach((item) => {
+    var _a, _b;
+    if (item.type === "condition") {
+      const { key, operator, value } = item;
+      nodes.push({
+        type: "pql-field",
+        label: key == null ? void 0 : key.label,
+        value: key == null ? void 0 : key.value
+      });
+      nodes.push({
+        type: "pql-field-operator",
+        label: operator == null ? void 0 : operator.label,
+        value: operator == null ? void 0 : operator.value
+      });
+      const field = fields.find((child) => child.appDEFieldId === (key == null ? void 0 : key.value));
+      if (field && field.appCodeListId) {
+        const codeItems = codeListMap.get(field.appDEFieldId);
+        const codeItem = codeItems == null ? void 0 : codeItems.find((child) => child.value === (value == null ? void 0 : value.value));
+        if (codeItem) {
+          nodes.push({
+            type: "pql-field-value",
+            label: value == null ? void 0 : value.label,
+            value: value == null ? void 0 : value.value
+          });
+        } else {
+          nodes.push({
+            text: value == null ? void 0 : value.value
+          });
+        }
+      } else {
+        nodes.push({
+          text: value == null ? void 0 : value.value
+        });
+      }
+    }
+    if (item.type === "connection") {
+      nodes.push({
+        type: "pql-field-connection",
+        label: (_a = item.value) == null ? void 0 : _a.label,
+        value: (_b = item.value) == null ? void 0 : _b.value
+      });
+    }
+  });
+  return nodes;
+};
+const pqlNodeToHtml = (node) => {
+  const type = node.type || "";
+  if (!type) {
+    return node.text || "";
+  }
+  const html = '<span\n        data-pql="true"\n        data-w-e-type="'.concat(type, '"\n        data-w-e-is-void\n        data-w-e-is-inline\n        data-label="').concat(node.label || "", '"\n        data-value="').concat(node.value || "", '"\n    ></span>');
+  return html;
+};
+const pqlNodesToHtml = (nodes) => {
+  let html = "<p>";
+  nodes.forEach((node) => {
+    html += pqlNodeToHtml(node);
+  });
+  html += "</p>";
+  return html;
+};
+function isMove(el) {
+  if (!el) {
+    return false;
+  }
+  if (el.getAttribute("data-slate-node") === "element" && el.getAttribute("data-slate-inline") && el.getAttribute("data-slate-void")) {
+    return true;
+  }
+  return isMove(el.parentElement);
+}
+
+exports.ExcludeOPs = ExcludeOPs;
+exports.FilterModes = FilterModes;
+exports.generateCustomCond = generateCustomCond;
+exports.generateItems = generateItems;
+exports.isMove = isMove;
+exports.parseCustomCond = parseCustomCond;
+exports.pqlItemsToPqlNodes = pqlItemsToPqlNodes;
+exports.pqlNodeToHtml = pqlNodeToHtml;
+exports.pqlNodesToHtml = pqlNodesToHtml;

package/lib/control/chart/chart.cjs

@@ -48,7 +48,7 @@ const ChartControl = /* @__PURE__ */ vue.defineComponent({
       required: false
     }
   },
-  emits: ["drillDown"],
+  emits: ["drillDetail"],
   setup(props, {
     emit
   }) {
@@ -58,9 +58,8 @@ const ChartControl = /* @__PURE__ */ vue.defineComponent({
     const maxHeight = vue.ref(0);
     const uuid = qxUtil.createUUID();
     const showCheck = vue.ref(false);
-    const drillDownPos = vue.ref({});
-    const drillDownRef = vue.ref();
-    let func;
+    const drillDetailPos = vue.ref({});
+    const drillDetailRef = vue.ref();
     let tempParams;
     const initSimpleData = () => {
       if (!props.data) {
@@ -97,19 +96,35 @@ const ChartControl = /* @__PURE__ */ vue.defineComponent({
     const getGridData = () => {
       return c.state.gridData || [];
     };
-    const computedDrillDownPos = (params) => {
+    const computedDrillDetailPos = (params) => {
       if (params.event) {
         const event = params.event.event;
-        event.stopPropagation();
-        event.preventDefault();
         const {
           offsetX,
           offsetY
         } = params.event;
-        drillDownPos.value = {
-          top: "".concat(offsetY, "px"),
-          left: "".concat(offsetX + 16, "px")
-        };
+        const {
+          clientWidth
+        } = event.target;
+        if (offsetX + 160 > clientWidth) {
+          drillDetailPos.value = {
+            top: "".concat(offsetY - 20, "px"),
+            left: "".concat(offsetX - 160, "px")
+          };
+        } else {
+          drillDetailPos.value = {
+            top: "".concat(offsetY, "px"),
+            left: "".concat(offsetX + 16, "px")
+          };
+        }
+      }
+    };
+    const setDrillState = () => {
+      showCheck.value = false;
+    };
+    const setTipState = () => {
+      if (!showCheck.value) {
+        c.changeTooltipState(true);
       }
     };
     let resizeObserver;
@@ -118,6 +133,8 @@ const ChartControl = /* @__PURE__ */ vue.defineComponent({
       const chart = echarts.init(chartRef.value);
       c.initChart(chart);
       window.addEventListener("resize", setHeight);
+      window.addEventListener("pointerdown", setDrillState);
+      window.addEventListener("click", setTipState);
       if (chartRef.value && ResizeObserver) {
         resizeObserver = new ResizeObserver(() => {
           c.resizeChart();
@@ -125,31 +142,36 @@ const ChartControl = /* @__PURE__ */ vue.defineComponent({
         resizeObserver.observe(chartRef.value);
       }
       setHeight();
-      if ((_b = (_a = props.modelData.controlParam) == null ? void 0 : _a.ctrlParams) == null ? void 0 : _b.ENABLEDRILLDOWN) {
+      const drillDetails = (_b = (_a = props.modelData.controlParam) == null ? void 0 : _a.ctrlParams) == null ? void 0 : _b.ENABLEDRILLDETAIL;
+      if (drillDetails == null ? void 0 : drillDetails.length) {
         chart.on("click", (params) => {
+          const serieModel = c.computedClickSerieModel(params);
+          if (!serieModel) {
+            return;
+          }
+          const tempDrill = drillDetails.find((item) => {
+            return item.name === serieModel.valueField;
+          });
+          if (!tempDrill || !tempDrill.isDrill) {
+            return;
+          }
           tempParams = params;
+          computedDrillDetailPos(params);
           chart.dispatchAction({
             type: "hideTip"
           });
-          showCheck.value = true;
           c.changeTooltipState(false);
-          func = vue3Util.useClickOutside(drillDownRef, () => {
-            showCheck.value = false;
-            c.changeTooltipState(true);
-            func.stop();
-          });
-          computedDrillDownPos(params);
+          showCheck.value = true;
         });
       }
     });
-    const openDrillDown = (_event) => {
+    const openDrillDetail = (_event) => {
+      _event.stopPropagation();
+      _event.preventDefault();
       showCheck.value = false;
-      if (func) {
-        func.stop();
-      }
       c.changeTooltipState(true);
-      const param = c.computedDrillDownParam(tempParams);
-      emit("drillDown", param);
+      const param = c.computedDrillDetailParam(tempParams);
+      emit("drillDetail", param);
     };
     vue.watch(() => c.state.showGrid, () => {
       setHeight();
@@ -179,6 +201,8 @@ const ChartControl = /* @__PURE__ */ vue.defineComponent({
     };
     vue.onBeforeUnmount(() => {
       window.removeEventListener("resize", setHeight);
+      window.removeEventListener("pointerdown", setDrillState);
+      window.removeEventListener("click", setTipState);
       resizeObserver == null ? void 0 : resizeObserver.disconnect();
     });
     return {
@@ -187,9 +211,9 @@ const ChartControl = /* @__PURE__ */ vue.defineComponent({
       chartRef,
       uuid,
       showCheck,
-      drillDownPos,
-      drillDownRef,
-      openDrillDown,
+      drillDetailPos,
+      drillDetailRef,
+      openDrillDetail,
       renderGrid
     };
   },
@@ -213,12 +237,12 @@ const ChartControl = /* @__PURE__ */ vue.defineComponent({
         "ref": "chartRef",
         "class": [this.ns.e("chart")]
       }, [ibiz.i18n.t("control.chart.chartPlaceholder")]), this.showCheck ? vue.createVNode("div", {
-        "ref": "drillDownRef",
-        "class": this.ns.e("drill-down"),
-        "style": this.drillDownPos,
-        "onClick": this.openDrillDown
+        "ref": "drillDetailRef",
+        "class": this.ns.e("drill-detail"),
+        "style": this.drillDetailPos,
+        "onPointerdown": this.openDrillDetail
       }, [vue.createVNode("div", {
-        "class": this.ns.em("drill-down", "item")
+        "class": this.ns.em("drill-detail", "item")
       }, [vue.createVNode("svg", {
         "viewBox": "0 0 16 16",
         "xmlns": "http://www.w3.org/2000/svg",
@@ -234,8 +258,8 @@ const ChartControl = /* @__PURE__ */ vue.defineComponent({
         "d": "M11.626 0c1.057 0 1.923.818 2 1.855l.005.15v3.411a.6.6 0 0 1-1.192.097l-.008-.097.001-1.348V2.005c0-.41-.31-.749-.705-.799l-.101-.006h-9.62c-.41 0-.75.308-.8.704l-.006.101v11.989c0 .41.308.75.705.8l.101.006h5.906l.017-.004.016-.003h2.074a.598.598 0 1 1 .107 1.187l-.095.01V16H2.006a2.006 2.006 0 0 1-2-1.856L0 13.994V2.005C0 .948.818.082 1.856.005L2.006 0h9.62zm-1.595 6.328a3.669 3.669 0 0 1 3.665 3.665c0 .79-.251 1.523-.678 2.123l2.412 2.412a.6.6 0 1 1-.848.85l-2.41-2.412a3.646 3.646 0 0 1-2.14.692 3.67 3.67 0 0 1-3.667-3.665 3.67 3.67 0 0 1 3.666-3.665zm-5.106 5.29a.6.6 0 0 1 .097 1.191l-.097.008H2.85a.6.6 0 0 1-.097-1.192l.097-.008h2.074zm5.106-4.09a2.468 2.468 0 0 0-2.466 2.465 2.468 2.468 0 0 0 2.466 2.466 2.47 2.47 0 0 0 2.466-2.466 2.469 2.469 0 0 0-2.466-2.465zm-4.815-.126a.6.6 0 0 1 .097 1.193l-.097.007h-2.35A.6.6 0 0 1 2.77 7.41l.098-.008h2.349zm5.58-4a.6.6 0 0 1 .097 1.192l-.097.008H2.867A.6.6 0 0 1 2.77 3.41l.097-.008h7.929z",
         "id": "asp\u5408\u5E76\u5F62\u72B6"
       }, null)])]), vue.createVNode("div", {
-        "class": this.ns.em("drill-down", "item-text")
-      }, [ibiz.i18n.t("control.chart.drillDown")])])]) : null]), this.c.state.showGrid ? vue.createVNode("div", {
+        "class": this.ns.em("drill-detail", "item-text")
+      }, [ibiz.i18n.t("control.chart.drillDetail")])])]) : null]), this.c.state.showGrid ? vue.createVNode("div", {
         "class": this.ns.e("grid")
       }, [this.renderGrid()]) : null])])]
     });

package/lib/control/chart/chart.css

@@ -1 +1 @@
-.ibiz-control-chart{width:100%;height:100%}.ibiz-control-chart__chart-grid{width:100%;height:100%}.ibiz-control-chart__chart-grid.is-show-grid{display:flex;height:calc(100% - 16px)}.ibiz-control-chart__chart-grid--bottom{flex-direction:column}.ibiz-control-chart__chart-grid--top{flex-direction:column-reverse}.ibiz-control-chart__chart-grid--left{flex-direction:row-reverse}.ibiz-control-chart__chart-grid--right{flex-direction:row}.ibiz-control-chart__chart-grid.is-no-data{display:none}.ibiz-control-chart__chart-grid-container{position:relative;flex:1;height:50%}.ibiz-control-chart__chart-grid-container.is-bottom{width:100%;height:50%;min-height:50%}.ibiz-control-chart__chart-grid-container.is-top{width:100%;height:50%;min-height:50%}.ibiz-control-chart__chart-grid-container.is-left{width:50%;min-width:50%;height:100%}.ibiz-control-chart__chart-grid-container.is-right{width:50%;min-width:50%;height:100%}.ibiz-control-chart__chart-grid-container.is-no-grid{flex:unset;width:100%;height:100%}.ibiz-control-chart__chart{width:100%;height:100%}.ibiz-control-chart__drill-down{position:absolute;top:0;left:0;width:150px;padding:var(--ibiz-spacing-tight) 0;background:var(--ibiz-color-bg-1);border:1px solid var(--ibiz-color-border);border-radius:var(--ibiz-border-radius-small);box-shadow:var(--ibiz-color-elevated)}.ibiz-control-chart__drill-down--item{display:flex;gap:var(--ibiz-spacing-tight);align-items:center;height:40px;padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-base-loose);font-size:var(--ibiz-font-size-regular);cursor:pointer}.ibiz-control-chart__drill-down--item:hover{background-color:var(--ibiz-color-fill-1)}.ibiz-control-chart__drill-down--item-text{margin-bottom:var(--ibiz-spacing-super-tight)}.ibiz-control-chart__grid{flex:1;height:auto}.ibiz-control-chart__grid .cell{text-overflow:ellipsis;white-space:nowrap}.ibiz-control-chart__grid .el-table__body-wrapper{border-bottom:1px solid var(--ibiz-color-border)}.ibiz-control-chart__empty{display:none;height:100%}.ibiz-control-chart__empty.is-no-data{display:flex}.ibiz-control-chart-chart-container{width:100%;height:100%}
+.ibiz-control-chart{width:100%;height:100%}.ibiz-control-chart__chart-grid{width:100%;height:100%}.ibiz-control-chart__chart-grid.is-show-grid{display:flex;height:calc(100% - 16px)}.ibiz-control-chart__chart-grid--bottom{flex-direction:column}.ibiz-control-chart__chart-grid--top{flex-direction:column-reverse}.ibiz-control-chart__chart-grid--left{flex-direction:row-reverse}.ibiz-control-chart__chart-grid--right{flex-direction:row}.ibiz-control-chart__chart-grid.is-no-data{display:none}.ibiz-control-chart__chart-grid-container{position:relative;flex:1;height:50%}.ibiz-control-chart__chart-grid-container.is-bottom{width:100%;height:50%;min-height:50%}.ibiz-control-chart__chart-grid-container.is-top{width:100%;height:50%;min-height:50%}.ibiz-control-chart__chart-grid-container.is-left{width:50%;min-width:50%;height:100%}.ibiz-control-chart__chart-grid-container.is-right{width:50%;min-width:50%;height:100%}.ibiz-control-chart__chart-grid-container.is-no-grid{flex:unset;width:100%;height:100%}.ibiz-control-chart__chart{width:100%;height:100%}.ibiz-control-chart__drill-detail{position:absolute;top:0;left:0;width:150px;padding:var(--ibiz-spacing-tight) 0;background:var(--ibiz-color-bg-1);border:1px solid var(--ibiz-color-border);border-radius:var(--ibiz-border-radius-small);box-shadow:var(--ibiz-color-elevated)}.ibiz-control-chart__drill-detail--item{display:flex;gap:var(--ibiz-spacing-tight);align-items:center;height:40px;padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-base-loose);font-size:var(--ibiz-font-size-regular);cursor:pointer}.ibiz-control-chart__drill-detail--item:hover{background-color:var(--ibiz-color-fill-1)}.ibiz-control-chart__drill-detail--item-text{margin-bottom:var(--ibiz-spacing-super-tight)}.ibiz-control-chart__grid{flex:1;height:auto}.ibiz-control-chart__grid .cell{text-overflow:ellipsis;white-space:nowrap}.ibiz-control-chart__grid .el-table__body-wrapper{border-bottom:1px solid var(--ibiz-color-border)}.ibiz-control-chart__empty{display:none;height:100%}.ibiz-control-chart__empty.is-no-data{display:flex}.ibiz-control-chart-chart-container{width:100%;height:100%}

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

@@ -13,6 +13,9 @@ const PortletLayout = /* @__PURE__ */ vue.defineComponent({
     controller: {
       type: runtime.PortletPartController,
       required: true
+    },
+    linkAction: {
+      type: Object
     }
   },
   setup(props) {
@@ -34,13 +37,19 @@ const PortletLayout = /* @__PURE__ */ vue.defineComponent({
     const onActionClick = async (detail, event) => {
       await props.controller.onActionClick(detail, event);
     };
+    const openLink = (event) => {
+      if (props.linkAction) {
+        props.controller.onActionClick(props.linkAction, event);
+      }
+    };
     return {
       c,
       ns,
       popperClass,
       portletType,
       isShowHeader,
-      onActionClick
+      onActionClick,
+      openLink
     };
   },
   render() {
@@ -57,7 +66,8 @@ const PortletLayout = /* @__PURE__ */ vue.defineComponent({
     }, [vue.createVNode("div", {
       "class": this.ns.be("header", "left")
     }, [model.showTitleBar && vue.createVNode("div", {
-      "class": this.ns.e("caption")
+      "class": [this.ns.e("caption"), this.ns.is("link", !!this.linkAction)],
+      "onClick": this.openLink
     }, [vue.createVNode(vue.resolveComponent("iBizIcon"), {
       "class": this.ns.e("caption-icon"),
       "icon": model.sysImage