@ibiz-template/vue3-components 0.7.41-alpha.13 → 0.7.41-alpha.131

package/lib/control/grid/grid/grid.cjs

@@ -17,15 +17,12 @@ function _isSlot(s) {
   return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !vue.isVNode(s);
 }
 function renderAttrs(model, params) {
-  var _a;
   const attrs = {};
-  (_a = model.controlAttributes) == null ? void 0 : _a.forEach((item) => {
-    if (item.attrName !== "span-method") {
-      if (item.attrName && item.attrValue) {
-        attrs[item.attrName] = runtime.ScriptFactory.execSingleLine(item.attrValue, {
-          ...params
-        });
-      }
+  runtime.filterPresetAttrs(model.controlAttributes).forEach((item) => {
+    if (item.attrName && item.attrName !== "span-method" && item.attrValue) {
+      attrs[item.attrName] = runtime.ScriptFactory.execSingleLine(item.attrValue, {
+        ...params
+      });
     }
   });
   return attrs;
@@ -53,23 +50,24 @@ function renderFieldColumn(c, row) {
   }
   let content = null;
   const {
-    controlRenders = []
+    controlRenders = [],
+    id
   } = c.model;
-  const panel = (_a = controlRenders.find((renderItem) => renderItem.renderType === "LAYOUTPANEL")) == null ? void 0 : _a.layoutPanel;
-  const columnType = (_b = c.model.userParam) == null ? void 0 : _b.columnType;
+  const panel = (_a = controlRenders.find((renderItem) => renderItem.renderType === "LAYOUTPANEL" && !["".concat(id == null ? void 0 : id.toLowerCase(), "_tooltip"), "".concat(id == null ? void 0 : id.toLowerCase(), "_edit_tooltip")].includes(renderItem.id))) == null ? void 0 : _a.layoutPanel;
+  const columnType = (_b = c.model.userParam) == null ? void 0 : _b.columntype;
   if (panel) {
-    content = vue.createVNode(vue.resolveComponent("iBizControlShell"), {
+    content = vue.withDirectives(vue.createVNode(vue.resolveComponent("iBizControlShell"), {
       "data": row.data,
       "modelData": panel,
       "context": c.context,
       "params": c.params
-    }, null);
+    }, null), [[vue.resolveDirective("tooltip"), vue3Util.renderTooltip(row.data, c.model, c.grid)]]);
   } else if (columnType === "attachment") {
-    content = vue.createVNode(vue.resolveComponent("iBizAttachmentColumn"), {
+    content = vue.withDirectives(vue.createVNode(vue.resolveComponent("iBizAttachmentColumn"), {
       "data": row.data,
       "value": fieldValue,
       "controller": c
-    }, null);
+    }, null), [[vue.resolveDirective("tooltip"), vue3Util.renderTooltip(row.data, c.model, c.grid)]]);
   } else {
     const showValue = c.formatValue(fieldValue);
     const tooltip = vue.computed(() => {
@@ -116,11 +114,11 @@ function renderFieldColumn(c, row) {
         c.openLinkView(row, event);
       }
     };
-    content = vue.createVNode("span", {
+    content = vue.withDirectives(vue.createVNode("span", {
       "class": ns.e("text"),
       "title": core.showTitle(tooltip.value),
       "onClick": onTextClick
-    }, [showValue, hiddenEmpty.value && c.model.unitName, percent.value && "(".concat(percent.value, ")")]);
+    }, [showValue, hiddenEmpty.value && c.model.unitName, percent.value && "(".concat(percent.value, ")")]), [[vue.resolveDirective("tooltip"), vue3Util.renderTooltip(row.data, c.model, c.grid)]]);
   }
   const onCellClick = (event) => {
     if (c.hasAction) {
@@ -137,26 +135,34 @@ function renderFieldColumn(c, row) {
     "class": ns.b("toolbar-container")
   }, [actionToolbar])] : content]);
 }
-function renderColumn(c, model, renderColumns, index) {
-  var _a, _b, _c;
+function renderColumn(c, model, renderColumns, index, slots) {
+  var _a, _b, _c, _d;
   const {
     codeName: columnName,
     width
   } = model;
   const columnC = c.columns[columnName];
   const columnState = c.state.columnStates.find((item) => item.key === columnName);
+  let type = "default";
+  const expandiconcolumn = (_a = c.controlParams.expandiconcolumn) == null ? void 0 : _a.toLowerCase();
+  const expandColumnSatate = c.state.columnStates.find((item) => expandiconcolumn && item.key.toLowerCase() === expandiconcolumn);
+  if (expandColumnSatate && !expandColumnSatate.hidden)
+    type = (columnName == null ? void 0 : columnName.toLowerCase()) === expandiconcolumn ? "default" : "";
   const widthFlexGrow = columnC.isAdaptiveColumn || !c.hasAdaptiveColumn && index === renderColumns.length - 1;
   const widthName = widthFlexGrow ? "min-width" : "width";
   const tempWidth = (columnState == null ? void 0 : columnState.columnWidth) || width;
+  const align = ((_b = model.align) == null ? void 0 : _b.toLowerCase()) || c.columnAlign;
+  const sortable = model.enableSort ? c.model.sortMode === "LOCAL" || "custom" : false;
   return vue.createVNode(vue.resolveComponent("el-table-column"), vue.mergeProps({
-    "className": "".concat((_a = model.columnType) == null ? void 0 : _a.toLowerCase(), " ").concat((_b = model.columnType) == null ? void 0 : _b.toLowerCase(), "-").concat(columnName),
+    "type": type,
+    "prop": columnName,
     "label": model.caption,
-    "prop": columnName
+    "fixed": columnState.fixed
   }, {
     [widthName]: tempWidth
   }, {
-    "fixed": columnState.fixed,
-    "sortable": model.enableSort ? c.model.sortMode === "LOCAL" || "custom" : false,
+    "sortable": sortable,
+    "align": align,
     "sortMethod": (a, b) => {
       const fieldName = model.id.toLowerCase();
       if (a[fieldName] < b[fieldName] || !a[fieldName])
@@ -165,7 +171,7 @@ function renderColumn(c, model, renderColumns, index) {
         return 1;
       return 0;
     },
-    "align": ((_c = model.align) == null ? void 0 : _c.toLowerCase()) || "center"
+    "className": "".concat((_c = model.columnType) == null ? void 0 : _c.toLowerCase(), " ").concat((_d = model.columnType) == null ? void 0 : _d.toLowerCase(), "-").concat(columnName)
   }), {
     header: ({
       column
@@ -179,10 +185,15 @@ function renderColumn(c, model, renderColumns, index) {
       row
     }) => {
       let elRow = row;
-      if (row.isGroupData) {
+      if (elRow.isGroupRow)
+        return vue.createVNode("div", {
+          "class": "ibiz-grid-field-column"
+        }, [vue.createVNode("span", {
+          "class": "ibiz-grid-field-column__text"
+        }, [row.caption])]);
+      if (row.isGroupData)
         elRow = row.first;
-      }
-      const rowState = c.findRowState(elRow);
+      const rowState = Object.keys(elRow).length > 0 ? c.findRowState(elRow) : void 0;
       if (rowState) {
         if (model.columnType === "DEFGRIDCOLUMN" || model.columnType === "DEFTREEGRIDCOLUMN") {
           if (c.providers[columnName].component === "IBizGridFieldColumn" && !columnC.isCustomCode && !columnC.codeList) {
@@ -198,13 +209,13 @@ function renderColumn(c, model, renderColumns, index) {
             ...c.getEventArgs(),
             data: rowState.data
           })
-        });
+        }, slots);
       }
       return null;
     }
   });
 }
-function renderChildColumn(c, model, renderColumns, index) {
+function renderChildColumn(c, model, renderColumns, index, slots, semanticClass, semanticStyle) {
   var _a, _b;
   if (model.columnType === "GROUPGRIDCOLUMN") {
     const childColumns = ((_a = model.degridColumns) == null ? void 0 : _a.filter((item) => !item.hideDefault && !item.hiddenDataItem)) || [];
@@ -213,12 +224,15 @@ function renderChildColumn(c, model, renderColumns, index) {
       codeName
     } = model;
     const columnC = c.columns[codeName];
-    const align = ((_b = model.align) == null ? void 0 : _b.toLowerCase()) || "center";
+    const align = ((_b = model.align) == null ? void 0 : _b.toLowerCase()) || c.columnAlign;
     return vue.createVNode(vue.resolveComponent("el-table-column"), {
       "prop": model.codeName,
       "label": model.caption,
       "min-width": width,
-      "align": align
+      "align": align,
+      "class-name": semanticClass("groupcolumn", {
+        column: columnC
+      })
     }, {
       header: ({
         column
@@ -230,12 +244,12 @@ function renderChildColumn(c, model, renderColumns, index) {
       },
       default: () => {
         return childColumns.map((column, index2) => {
-          return renderChildColumn(c, column, renderColumns, index2);
+          return renderChildColumn(c, column, renderColumns, index2, slots, semanticClass, semanticStyle);
         });
       }
     });
   }
-  return renderColumn(c, model, renderColumns, index);
+  return renderColumn(c, model, renderColumns, index, slots);
 }
 const GridControl = /* @__PURE__ */ vue.defineComponent({
   name: "IBizGridControl",
@@ -317,10 +331,7 @@ const GridControl = /* @__PURE__ */ vue.defineComponent({
   }) {
     const c = vue3Util.useControlController((...args) => new runtime.GridController(...args));
     const ns = vue3Util.useNamespace("control-".concat(c.model.controlType.toLowerCase()));
-    const {
-      zIndex
-    } = vue3Util.useUIStore();
-    c.state.zIndex = zIndex.increment();
+    vue3Util.useControlPopoverzIndex(c);
     const {
       sysCss
     } = c.model;
@@ -335,13 +346,19 @@ const GridControl = /* @__PURE__ */ vue.defineComponent({
       handleHeaderCellClassName,
       cleanClick = core.NOOP,
       cleanEnter = core.NOOP,
-      cleanTab = core.NOOP
+      cleanTab = core.NOOP,
+      onSelectAll
     } = gridControl_util.useITableEvent(c);
     const {
+      pageSemantic,
       onPageChange,
       onPageRefresh,
       onPageSizeChange
     } = usePagination.usePagination(c);
+    const {
+      semanticClass,
+      semanticStyle
+    } = vue3Util.useSemanticNode(c);
     const {
       headerCssVars
     } = gridControl_util.useGridHeaderStyle(tableRef, ns);
@@ -349,6 +366,32 @@ const GridControl = /* @__PURE__ */ vue.defineComponent({
       cleanup = core.NOOP,
       setDragEvent
     } = gridControl_util.useGridDraggable(tableRef, ns, c);
+    const childClass = [{
+      class: semanticClass("body.row"),
+      selector: ".el-table__row"
+    }, {
+      class: semanticClass("header.row"),
+      selector: ".el-table__header tr"
+    }, {
+      class: semanticClass("body.cell"),
+      selector: ".el-table__body .el-table__cell"
+    }, {
+      class: semanticClass("header.cell"),
+      selector: ".el-table__header .el-table__cell"
+    }];
+    const childStyle = [{
+      class: semanticStyle("body.row"),
+      selector: ".el-table__row"
+    }, {
+      class: semanticStyle("header.row"),
+      selector: ".el-table__header tr"
+    }, {
+      class: semanticStyle("body.cell"),
+      selector: ".el-table__body .el-table__cell"
+    }, {
+      class: semanticStyle("header.cell"),
+      selector: ".el-table__header .el-table__cell"
+    }];
     c.evt.on("onLoadSuccess", () => {
       if (setDragEvent) {
         setDragEvent();
@@ -366,7 +409,12 @@ const GridControl = /* @__PURE__ */ vue.defineComponent({
             "modelData": quickToolbar,
             "context": c.context,
             "params": c.params,
-            "class": ns.b("quick-toolbar")
+            "class": [ns.b("quick-toolbar"), semanticClass("quicktoolbar", {
+              model: quickToolbar
+            })],
+            "style": semanticStyle("quicktoolbar", {
+              model: quickToolbar
+            })
           }, null);
         }
         const noDataSlots = {};
@@ -378,6 +426,8 @@ const GridControl = /* @__PURE__ */ vue.defineComponent({
           });
         }
         return vue.createVNode(vue.resolveComponent("iBizNoData"), {
+          "class": semanticClass("empty"),
+          "style": semanticStyle("empty"),
           "text": c.model.emptyText,
           "emptyTextLanguageRes": c.model.emptyTextLanguageRes,
           "hideNoDataImage": c.state.hideNoDataImage
@@ -407,7 +457,12 @@ const GridControl = /* @__PURE__ */ vue.defineComponent({
         return;
       }
       return vue.createVNode("div", {
-        "class": [ns.b("batch-toolbar"), ns.is("show", c.state.selectedData.length > 0)]
+        "class": [ns.b("batch-toolbar"), ns.is("show", c.showBatchToolbar), semanticClass("batchtoolbar", {
+          model: batchToolbar
+        })],
+        "style": semanticStyle("batchtoolbar", {
+          model: batchToolbar
+        })
       }, [vue.createVNode("div", {
         "class": ns.b("batch-toolbar-content")
       }, [vue.createVNode("div", {
@@ -427,10 +482,11 @@ const GridControl = /* @__PURE__ */ vue.defineComponent({
       if (slots[model.id]) {
         return vue.renderSlot(slots, model.id, {
           model,
-          data: c.state.items
+          data: c.state.items,
+          controller: c.columns[model.codeName]
         });
       }
-      return renderChildColumn(c, model, renderColumns.value, index);
+      return renderChildColumn(c, model, renderColumns.value, index, slots, semanticClass, semanticStyle);
     };
     const renderDragIconColumn = () => {
       return vue.createVNode(vue.resolveComponent("el-table-column"), {
@@ -456,7 +512,8 @@ const GridControl = /* @__PURE__ */ vue.defineComponent({
             "fill-rule": "nonzero"
           }, [vue.createVNode("path", {
             "d": "M1 2a1 1 0 1 1 0-2 1 1 0 0 1 0 2zm4 0a1 1 0 1 1 0-2 1 1 0 0 1 0 2zM1 6a1 1 0 1 1 0-2 1 1 0 0 1 0 2zm4 0a1 1 0 1 1 0-2 1 1 0 0 1 0 2zm-4 4a1 1 0 1 1 0-2 1 1 0 0 1 0 2zm4 0a1 1 0 1 1 0-2 1 1 0 0 1 0 2zm-4 4a1 1 0 1 1 0-2 1 1 0 0 1 0 2zm4 0a1 1 0 1 1 0-2 1 1 0 0 1 0 2z",
-            "id": "drag-icon-air"
+            "id": "drag-icon-air",
+            "fill": "currentColor"
           }, null)])])]);
         }
       });
@@ -491,7 +548,6 @@ const GridControl = /* @__PURE__ */ vue.defineComponent({
         });
     };
     vue.onUnmounted(() => {
-      zIndex.decrement();
       if (cleanup !== core.NOOP)
         cleanup();
       if (cleanClick !== core.NOOP)
@@ -532,6 +588,11 @@ const GridControl = /* @__PURE__ */ vue.defineComponent({
       infiniteScroll,
       infiniteScrollKey,
       isLodeMoreDisabled,
+      semanticClass,
+      semanticStyle,
+      childClass,
+      childStyle,
+      pageSemantic,
       onRowClick,
       spanMethod,
       onSortChange,
@@ -549,7 +610,8 @@ const GridControl = /* @__PURE__ */ vue.defineComponent({
       handleRowClassName,
       renderBatchToolBar,
       renderDragIconColumn,
-      handleHeaderCellClassName
+      handleHeaderCellClassName,
+      onSelectAll
     };
   },
   render() {
@@ -562,42 +624,48 @@ const GridControl = /* @__PURE__ */ vue.defineComponent({
       "controller": this.c
     }, {
       default: () => [vue.createVNode(vue.resolveComponent("iBizControlBase"), {
-        "class": [this.ns.b(), this.ns.is("dynamic-grid", this.c.state.isAutoGrid), this.ns.is("show-header", !this.c.state.hideHeader), this.ns.is("enable-page", this.c.state.enablePagingBar), this.ns.is("enable-group", this.c.state.enableGroup), this.ns.is("single-select", state.singleSelect), this.ns.is("empty", state.items.length === 0), this.ns.is("enable-customized", this.c.model.enableCustomized)],
+        "class": [this.ns.b(), this.ns.is("dynamic-grid", this.c.state.isAutoGrid), this.ns.is("show-header", !this.c.state.hideHeader), this.ns.is("enable-page", this.c.state.enablePagingBar), this.ns.is("enable-group", this.c.state.enableGroup), this.ns.is("single-select", state.singleSelect), this.ns.is("empty", state.items.length === 0), this.ns.is("enable-customized", this.c.model.enableCustomized), this.ns.is("group-row-mode", this.c.controlParams.grouprowmode === "NEWROW"), this.semanticClass("root")],
         "controller": this.c,
-        "style": this.headerCssVars
+        "style": [this.headerCssVars, this.semanticStyle("root")]
       }, {
-        default: () => [vue.createVNode(vue.resolveComponent("el-table"), vue.mergeProps({
+        default: () => [vue.withDirectives(vue.createVNode(vue.resolveComponent("el-table"), vue.mergeProps({
+          "border": true,
           "ref": "tableRef",
-          "class": this.ns.e("table"),
+          "data": this.tableData,
+          "row-key": "tempsrfkey",
+          "tooltip-effect": "light",
+          "style": this.semanticStyle("content"),
+          "class": [this.ns.e("table"), this.semanticClass("content")],
+          "scrollbar-always-on": true,
+          "onRowClick": this.onRowClick,
+          "span-method": this.spanMethod,
           "default-sort": this.defaultSort,
-          "border": true,
-          "show-header": !this.c.state.hideHeader,
           "show-summary": this.c.enableAgg,
+          "onSortChange": this.onSortChange,
+          "onSelectAll": this.onSelectAll,
+          "onRowDblclick": this.onDbRowClick,
           "summary-method": this.summaryMethod,
-          "highlight-current-row": state.singleSelect,
-          "row-class-name": this.handleRowClassName,
-          "header-cell-class-name": this.handleHeaderCellClassName,
-          "row-key": "tempsrfkey",
-          "data": this.tableData,
+          "onHeaderDragend": this.headerDragend,
           "default-expand-all": defaultExpandAll,
-          "span-method": this.spanMethod,
-          "onRowClick": this.onRowClick,
-          "onRowDblclick": this.onDbRowClick,
+          "show-header": !this.c.state.hideHeader,
+          "row-class-name": this.handleRowClassName,
+          "highlight-current-row": state.singleSelect,
+          "expandRowKeys": this.c.state.expandRowKeys,
           "onSelectionChange": this.onSelectionChange,
-          "onSortChange": this.onSortChange,
-          "onHeaderDragend": this.headerDragend,
-          "tooltip-effect": "light",
-          "scrollbar-always-on": true
+          "header-cell-class-name": this.handleHeaderCellClassName,
+          "onExpandChange": (row, expanded) => this.c.expandChange(row, expanded)
         }, this.$attrs, renderAttrs(this.c.model, {
           ...this.c.getEventArgs()
         })), {
           empty: this.renderNoData,
           default: () => {
             return [this.c.enableRowEditOrder && this.renderDragIconColumn(), !state.singleSelect && vue.createVNode(vue.resolveComponent("el-table-column"), {
-              "class-name": this.ns.e("selection"),
-              "type": "selection",
               "width": "55",
-              "align": "center"
+              "align": "center",
+              "type": "selection",
+              "reserve-selection": true,
+              "style": this.semanticStyle("selection"),
+              "class-name": "".concat(this.ns.e("selection"), " ").concat(this.semanticClass("selection"))
             }, null), this.renderRowDetail(), this.renderColumns.map((model, index) => {
               return this.renderTableColumn(model, index);
             })];
@@ -626,7 +694,11 @@ const GridControl = /* @__PURE__ */ vue.defineComponent({
               }, null), ibiz.i18n.t("app.add")]
             }) : this.renderPopover()];
           }
-        }), this.c.state.enablePagingBar && vue.createVNode(vue.resolveComponent("iBizPagination"), {
+        }), [[vue.resolveDirective("child-class"), this.childClass], [vue.resolveDirective("child-style"), this.childStyle]]), this.c.state.enablePagingBar && vue.createVNode(vue.resolveComponent("iBizPagination"), {
+          "class": this.semanticClass("pagination"),
+          "style": this.semanticStyle("pagination"),
+          "semantic": this.pageSemantic,
+          "mode": this.c.paginationMode,
           "total": state.total,
           "curPage": state.curPage,
           "size": state.size,
@@ -638,6 +710,8 @@ const GridControl = /* @__PURE__ */ vue.defineComponent({
         }, null), this.c.model.enableCustomized && !this.c.state.hideHeader && vue.createVNode("div", {
           "class": this.ns.b("setting-box")
         }, [vue.createVNode(vue.resolveComponent("iBizGridSetting"), {
+          "class": this.semanticClass("setting"),
+          "style": this.semanticStyle("setting"),
           "columnStates": state.columnStates,
           "controller": this.c
         }, null)]), this.renderBatchToolBar()]

package/lib/control/grid/grid/grid.css

@@ -1 +1 @@
-.ibiz-control-grid{--ibiz-control-grid-text-color:var(--ibiz-color-text-0);--ibiz-control-grid-bg-color:transparent;--ibiz-control-grid-padding:var(--ibiz-spacing-none);--ibiz-control-grid-cell-padding:var(--ibiz-spacing-tight);--ibiz-control-grid-selection-padding:var(--ibiz-spacing-base-loose);--ibiz-control-grid-row-edit-bg-color:var(--ibiz-color-fill-2);--ibiz-control-grid-row-bg-color:var(--ibiz-color-bg-1);--ibiz-control-grid-row-bg-color-2:var(--ibiz-color-bg-0);--ibiz-control-grid-row-hover-color:rgba(var(--ibiz-grey-1), 1);--ibiz-control-grid-row-select-color:var(--ibiz-color-primary-light-default);--ibiz-control-grid-row-expand-icon-margin:var(--ibiz-spacing-none) var(--ibiz-spacing-none) var(--ibiz-spacing-none) var(--ibiz-spacing-tight);--ibiz-control-grid-now-header-height:auto;--ibiz-control-grid-scrollbar-width:4px;--ibiz-control-grid-scrollbar-bg-color:var(--ibiz-color-fill-2);--ibiz-control-grid-scrollbar-bg-hover-opacity:0.5;--ibiz-control-grid-scrollbar-bg-hover-color:var(--ibiz-color-fill-2);--ibiz-control-grid-header-text-color:var(--ibiz-color-text-2);--ibiz-control-grid-header-cell-padding:calc(var(--ibiz-spacing-base-tight) / 2) var(--ibiz-spacing-base-tight);--ibiz-control-grid-header-height:auto;--ibiz-control-grid-header-min-height:54px;--ibiz-control-grid-header-bg-color:rgba(var(--ibiz-grey-1), 1);--ibiz-control-grid-header-font-size:var(--ibiz-font-size-regular);--ibiz-control-grid-header-font-weight:var(--ibiz-font-weight-regular);--ibiz-control-grid-content-text-color:var(--ibiz-control-grid-text-color);--ibiz-control-grid-content-row-height:48px;--ibiz-control-grid-page-text-color:var(--ibiz-color-text-2);--ibiz-control-grid-page-height:50px;--ibiz-control-grid-page-padding:var(--ibiz-spacing-none) var(--ibiz-spacing-base-tight);--ibiz-control-grid-footer-text-color:var(--ibiz-color-text-2);--ibiz-control-grid-footer-bg-color:rgba(var(--ibiz-grey-1), 1);--ibiz-control-grid-footer-font-size:var(--ibiz-font-size-regular);--ibiz-control-grid-footer-font-weight:var(--ibiz-font-weight-bold);position:relative;width:100%;height:100%;padding:var(--ibiz-control-grid-padding);background-color:var(--ibiz-control-grid-bg-color)}.ibiz-control-grid .el-table{--el-table-header-bg-color:var(--ibiz-control-grid-header-bg-color);--el-table-current-row-bg-color:var(--ibiz-control-grid-row-select-color);--el-table-border-color:transparent}.ibiz-control-grid .el-table__body-wrapper tr td.el-table-fixed-column--left.is-first-column::before,.ibiz-control-grid .el-table__body-wrapper tr td.el-table-fixed-column--left.is-last-column::before,.ibiz-control-grid .el-table__body-wrapper tr td.el-table-fixed-column--right.is-first-column::before,.ibiz-control-grid .el-table__body-wrapper tr td.el-table-fixed-column--right.is-last-column::before{bottom:0}.ibiz-control-grid.is-empty .el-scrollbar .el-scrollbar__view{height:100%}.ibiz-control-grid.is-empty .el-table__empty-text{display:inline-block;height:100%}.ibiz-control-grid .el-table--border .el-table__cell{border-right:none}.ibiz-control-grid .el-table-fixed-column--left,.ibiz-control-grid .el-table-fixed-column--right{--el-bg-color:transparent}.ibiz-control-grid .el-table thead.is-group th.el-table__cell{background:var(--ibiz-control-grid-header-bg-color)}.ibiz-control-grid.is-enable-page .ibiz-control-grid__table{height:calc(100% - var(--ibiz-control-grid-page-height))}.ibiz-control-grid.is-enable-group .el-table__indent{display:none}.ibiz-control-grid.is-dynamic-grid .el-table__empty-block{height:calc(100% - 48px)!important;min-height:248px}.ibiz-control-grid__add{width:calc(100% - var(--ibiz-spacing-extra-tight));margin:var(--ibiz-spacing-tight) var(--ibiz-spacing-extra-tight);color:var(--ibiz-color-primary);background-color:transparent;border:1px dashed var(--ibiz-color-border)}.ibiz-control-grid__add ion-icon{margin-right:var(--ibiz-spacing-extra-tight)}.ibiz-control-grid__add:focus{color:var(--ibiz-color-primary-hover);background-color:transparent;border:1px dashed var(--ibiz-color-primary-hover)}.ibiz-control-grid__add:hover{color:var(--ibiz-color-primary-hover);background-color:transparent;border:1px dashed var(--ibiz-color-primary-hover)}.ibiz-control-grid__table{width:100%;height:100%}.ibiz-control-grid__table .caret-wrapper{justify-content:center}.ibiz-control-grid__table .caret-wrapper>*+*{margin-top:var(--ibiz-spacing-super-tight)}.ibiz-control-grid__table .sort-caret{--el-text-color-placeholder:--ibiz-control-grid-header-text-color;position:initial;opacity:.6}.ibiz-control-grid__table.el-table .el-table__cell{padding:var(--ibiz-spacing-none)}.ibiz-control-grid__table.el-table .el-table__body-wrapper tr td{background:var(--ibiz-control-grid-row-bg-color)}.ibiz-control-grid__table.el-table .el-table__body-wrapper tr:nth-child(2n) td{background-color:var(--ibiz-control-grid-row-bg-color-2)}.ibiz-control-grid__table.el-table .el-table__body-wrapper tr:hover td{background-color:var(--ibiz-control-grid-row-hover-color)}.ibiz-control-grid__table.el-table .el-table__body-wrapper tr.current-row td{background-color:var(--el-table-current-row-bg-color)}.ibiz-control-grid__table.el-table .el-table__body-wrapper tr.editing-row td.uagridcolumn{background-color:var(--ibiz-control-grid-row-hover-color)}.ibiz-control-grid__table.el-table .el-table__body-wrapper tr.editing-row td:not(.uagridcolumn){background-color:var(--ibiz-control-grid-row-edit-bg-color)}.ibiz-control-grid__table.el-table .el-table__body-wrapper tr.editing-row td .el-date-editor,.ibiz-control-grid__table.el-table .el-table__body-wrapper tr.editing-row td .el-input__wrapper,.ibiz-control-grid__table.el-table .el-table__body-wrapper tr.editing-row td .el-textarea__inner{--el-input-bg-color:var(--ibiz-color-white)}.ibiz-control-grid__table .el-table__header-wrapper .cell{height:var(--ibiz-control-grid-header-height);min-height:var(--ibiz-control-grid-header-min-height);padding:var(--ibiz-control-grid-header-cell-padding);font-size:var(--ibiz-control-grid-header-font-size);font-weight:var(--ibiz-control-grid-header-font-weight);color:var(--ibiz-control-grid-header-text-color);word-break:break-word;white-space:pre-wrap}.ibiz-control-grid__table .el-table__header-wrapper .el-table-column--selection .cell{padding:var(--ibiz-control-grid-selection-padding)}.ibiz-control-grid__table .el-table__header-wrapper .el-table__cell .cell{display:flex;align-items:center;justify-content:var(--ibiz-grid-column-justify-content)}.ibiz-control-grid__table .el-table__header-wrapper .el-table-fixed-column--left .cell,.ibiz-control-grid__table .el-table__header-wrapper .el-table-fixed-column--right .cell{display:flex;align-items:center;justify-content:var(--ibiz-grid-column-justify-content)}.ibiz-control-grid__table .el-table__body-wrapper{color:var(--ibiz-control-grid-content-text-color);--ibiz-color-text-0:var(--ibiz-control-grid-content-text-color);--ibiz-color-text-1:var(--ibiz-control-grid-content-text-color);--ibiz-color-text-2:var(--ibiz-control-grid-content-text-color);--ibiz-color-text-3:var(--ibiz-control-grid-content-text-color);border-bottom:.1px solid var(--ibiz-color-border)}.ibiz-control-grid__table .el-table__body-wrapper .el-table__row{height:var(--ibiz-control-grid-content-row-height);cursor:pointer}.ibiz-control-grid__table .el-table__body-wrapper .el-table__row>td{height:0;padding:var(--ibiz-spacing-none)}.ibiz-control-grid__table .el-table__body-wrapper .el-table__row .el-table__expand-icon{margin:var(--ibiz-control-grid-row-expand-icon-margin)}@-moz-document url-prefix(){.ibiz-control-grid__table .el-table__body-wrapper .el-table__row>td{height:100%}}.ibiz-control-grid__table .el-table__body-wrapper .cell{display:flex;align-items:center;height:100%;padding:var(--ibiz-spacing-none)}.ibiz-control-grid__table .el-table__body-wrapper .el-table-column--selection .cell{padding:var(--ibiz-control-grid-selection-padding)}.ibiz-control-grid__table .el-table__cell.is-center{--ibiz-grid-column-text-align:center;--ibiz-grid-column-justify-content:center}.ibiz-control-grid__table .el-table__cell.is-left{--ibiz-grid-column-text-align:left;--ibiz-grid-column-justify-content:flex-start}.ibiz-control-grid__table .el-table__cell.is-right{--ibiz-grid-column-text-align:right;--ibiz-grid-column-justify-content:flex-end}.ibiz-control-grid__table .el-scrollbar__wrap{position:relative}.ibiz-control-grid__table .el-table__footer-wrapper tfoot td.el-table__cell{font-size:var(--ibiz-control-grid-footer-font-size);font-weight:var(--ibiz-control-grid-footer-font-weight);color:var(--ibiz-control-grid-footer-text-color);background-color:var(--ibiz-control-grid-footer-bg-color)}.ibiz-control-grid__table .el-table__footer-wrapper tfoot td.el-table__cell:first-child>div{display:inline;vertical-align:4px}.ibiz-control-grid__table .enable-order{position:relative;padding-left:var(--ibiz-spacing-base-tight);transition:transform .25s cubic-bezier(0,0,.2,1)}.ibiz-control-grid__table .enable-order .ibiz-control-grid__drag-icon{padding:var(--ibiz-spacing-none)!important}.ibiz-control-grid__table .enable-order .ibiz-control-grid__drag-icon .cell{display:none}.ibiz-control-grid__table .enable-order:hover .ibiz-control-grid__drag-icon .cell{display:flex}.ibiz-control-grid__table .el-scrollbar__bar.is-horizontal{height:var(--ibiz-control-grid-scrollbar-width)}.ibiz-control-grid__table .el-scrollbar__bar.is-vertical{width:var(--ibiz-control-grid-scrollbar-width)}.ibiz-control-grid__table .el-scrollbar__thumb{background-color:var(--ibiz-control-grid-scrollbar-bg-color)}.ibiz-control-grid__table .el-scrollbar__thumb:hover{background-color:var(--ibiz-control-grid-scrollbar-bg-hover-color);opacity:var(--ibiz-control-grid-scrollbar-bg-hover-opacity)}.ibiz-control-grid__load-more-button{padding:var(--ibiz-control-grid-header-cell-padding);text-align:center}.ibiz-control-grid .el-table td.el-table__cell,.ibiz-control-grid .el-table th.el-table__cell.is-leaf{border-bottom:none}.ibiz-control-grid .ibiz-pagination{--ibiz-pagination-height:var(--ibiz-control-grid-page-height);--ibiz-pagination-text-color:var(--ibiz-control-grid-text-color);--ibiz-pagination-padding:var(--ibiz-control-grid-page-padding)}.ibiz-control-grid.is-single-select .el-table__header-wrapper .el-table__header thead>tr th:nth-child(1){padding-left:var(--ibiz-spacing-tight)}.ibiz-control-grid.is-single-select .el-table__body-wrapper .el-table__body tbody>tr td:nth-child(1){padding-left:var(--ibiz-spacing-tight)}.ibiz-control-grid.is-enable-customized .el-table__header-wrapper .el-table__header thead>tr:first-child th:last-child{padding-right:var(--ibiz-spacing-base-loose)}.ibiz-control-grid.is-enable-customized .ibiz-control-grid-setting-box{display:flex;align-items:center;justify-content:flex-start;position:absolute;top:0;right:0;z-index:10;height:var(--ibiz-control-grid-now-header-height);padding-right:var(--ibiz-spacing-extra-tight);background-color:var(--ibiz-control-grid-header-bg-color)}.ibiz-control-grid-quick-toolbar{justify-content:center}.ibiz-control-grid-batch-toolbar{position:absolute;top:0;left:54px;z-index:99;display:none;width:calc(100% - 54px);height:var(--ibiz-control-grid-now-header-height);font-size:var(--ibiz-font-size-regular);font-weight:var(--ibiz-font-weight-regular);background-color:var(--ibiz-control-grid-header-bg-color)}.ibiz-control-grid-batch-toolbar.is-show{display:flex;align-items:center;justify-content:flex-start}.ibiz-control-grid-batch-toolbar .ibiz-control-grid-batch-toolbar-separator{padding:0 var(--ibiz-spacing-base-tight)}.ibiz-control-grid-batch-toolbar .ibiz-control-grid-batch-toolbar-content{height:100%;display:flex;align-items:center;justify-content:flex-start}.ibiz-control-grid-batch-toolbar .ibiz-control-grid-batch-toolbar-text{flex:none}
+.ibiz-control-grid{--ibiz-control-grid-text-color:var(--ibiz-color-text-0);--ibiz-control-grid-bg-color:transparent;--ibiz-control-grid-border-color:var(--ibiz-color-border);--ibiz-control-grid-font-size:var(--ibiz-font-size-regular);--ibiz-control-grid-font-weight:var(--ibiz-font-weight-regular);--ibiz-control-grid-scrollbar-width:4px;--ibiz-control-grid-scrollbar-bg-color:var(--ibiz-color-fill-2);--ibiz-control-grid-scrollbar-bg-hover-opacity:0.5;--ibiz-control-grid-scrollbar-bg-hover-color:var(--ibiz-color-fill-2);--ibiz-control-grid-header-row-bg-color:rgba(var(--ibiz-grey-1), 1);--ibiz-control-grid-header-row-height:auto;--ibiz-control-grid-header-row-min-height:54px;--ibiz-control-grid-header-cell-padding:calc(var(--ibiz-spacing-base-tight) / 2) var(--ibiz-spacing-base-tight);--ibiz-control-grid-header-cell-text-color:var(--ibiz-color-text-2);--ibiz-control-grid-header-cell-font-size:var(--ibiz-control-grid-font-size);--ibiz-control-grid-header-cell-font-weight:var(--ibiz-control-grid-font-weight);--ibiz-control-grid-body-row-height:48px;--ibiz-control-grid-body-row-edit-bg-color:var(--ibiz-color-fill-2);--ibiz-control-grid-body-row-bg-color:var(--ibiz-color-bg-1);--ibiz-control-grid-body-row-bg-color-2:var(--ibiz-color-bg-0);--ibiz-control-grid-body-row-hover-bg-color:rgba(var(--ibiz-grey-1), 1);--ibiz-control-grid-body-row-select-bg-color:var(--ibiz-color-primary-light-default);--ibiz-control-grid-body-row-expand-icon-gap:var(--ibiz-spacing-tight);--ibiz-control-grid-body-cell-text-color:var(--ibiz-control-grid-text-color);--ibiz-control-grid-body-cell-padding:var(--ibiz-spacing-tight);--ibiz-control-grid-body-cell-link-color:var(--ibiz-color-link);--ibiz-control-grid-body-cell-link-hover-color:var(--ibiz-color-link-hover);--ibiz-control-grid-body-cell-hover-bg-color:var(--ibiz-color-fill-0);--ibiz-control-grid-body-cell-btn-bg-color:transparent;--ibiz-control-grid-body-cell-btn-hover-color:var(--ibiz-color-primary-hover);--ibiz-control-grid-body-cell-btn-color:var(--ibiz-color-primary);--ibiz-control-grid-body-cell-font-size:var(--ibiz-control-grid-font-size);--ibiz-control-grid-body-cell-font-weight:var(--ibiz-control-grid-font-weight);--ibiz-control-grid-footer-height:auto;--ibiz-control-grid-footer-text-color:var(--ibiz-color-text-2);--ibiz-control-grid-footer-bg-color:rgba(var(--ibiz-grey-1), 1);--ibiz-control-grid-footer-font-size:var(--ibiz-control-grid-font-size);--ibiz-control-grid-footer-font-weight:var(--ibiz-control-grid-font-weight);--ibiz-control-grid-footer-vertical-align:var(--ibiz-spacing-extra-tight);--ibiz-control-grid-selection-padding:var(--ibiz-spacing-base-loose);--ibiz-control-grid-selection-active-bg-color:var(--ibiz-color-primary);--ibiz-control-grid-selection-active-border-color:var(--ibiz-color-primary);--ibiz-control-grid-selection-active-icon-color:var(--el-color-white);--ibiz-control-grid-selection-border-color:var(--ibiz-control-grid-border-color);--ibiz-control-grid-setting-height:auto;--ibiz-control-grid-setting-padding-right:var(--ibiz-spacing-extra-tight);--ibiz-control-grid-setting-bg-color:var(--ibiz-control-grid-header-row-bg-color);--ibiz-control-grid-filter-color:var(--ibiz-color-text-3);--ibiz-control-grid-filter-active-color:var(--ibiz-color-primary);--ibiz-control-grid-sort-color:var(--ibiz-color-text-3);--ibiz-control-grid-sort-active-color:var(--ibiz-color-primary);--ibiz-control-grid-sort-gap:var(--ibiz-spacing-super-tight);position:relative}.ibiz-control-grid .el-table{--el-table-header-bg-color:var(--ibiz-control-grid-header-row-bg-color);--el-table-current-row-bg-color:var(--ibiz-control-grid-body-row-select-bg-color);--el-table-border-color:transparent}.ibiz-control-grid .el-table__body-wrapper tr td.el-table-fixed-column--left.is-first-column::before,.ibiz-control-grid .el-table__body-wrapper tr td.el-table-fixed-column--left.is-last-column::before,.ibiz-control-grid .el-table__body-wrapper tr td.el-table-fixed-column--right.is-first-column::before,.ibiz-control-grid .el-table__body-wrapper tr td.el-table-fixed-column--right.is-last-column::before{bottom:0}.ibiz-control-grid.is-empty .el-scrollbar .el-scrollbar__view{height:100%}.ibiz-control-grid.is-empty .el-table__empty-text{display:inline-block;height:100%}.ibiz-control-grid .el-table--border .el-table__cell{border-right:none}.ibiz-control-grid .el-table-fixed-column--left,.ibiz-control-grid .el-table-fixed-column--right{--el-bg-color:transparent}.ibiz-control-grid .el-table thead.is-group th.el-table__cell{background:var(--ibiz-control-grid-header-row-bg-color)}.ibiz-control-grid{width:100%;height:100%;background-color:var(--ibiz-control-grid-bg-color)}.ibiz-control-grid.is-enable-page .ibiz-control-grid__table{height:calc(100% - 50px)}.ibiz-control-grid.is-enable-group .el-table__indent{display:none}.ibiz-control-grid.is-dynamic-grid .el-table__empty-block{height:calc(100% - 48px)!important;min-height:248px}.ibiz-control-grid.is-group-row-mode .el-table .el-table__body-wrapper .el-table__row .el-table__expand-icon{margin:0 0 0 20px}.ibiz-control-grid__add{width:calc(100% - var(--ibiz-spacing-extra-tight));margin:var(--ibiz-spacing-tight) var(--ibiz-spacing-extra-tight);color:var(--ibiz-color-primary);background-color:transparent;border:1px dashed var(--ibiz-color-border)}.ibiz-control-grid__add ion-icon{margin-right:var(--ibiz-spacing-extra-tight)}.ibiz-control-grid__add:focus{color:var(--ibiz-color-primary-hover);background-color:transparent;border:1px dashed var(--ibiz-color-primary-hover)}.ibiz-control-grid__add:hover{color:var(--ibiz-color-primary-hover);background-color:transparent;border:1px dashed var(--ibiz-color-primary-hover)}.ibiz-control-grid__table{width:100%;height:100%}.ibiz-control-grid__table .caret-wrapper{justify-content:center;--el-text-color-placeholder:var(--ibiz-control-grid-sort-color);--el-color-primary:var(--ibiz-control-grid-sort-active-color)}.ibiz-control-grid__table .caret-wrapper>*+*{margin-top:var(--ibiz-control-grid-sort-gap)}.ibiz-control-grid__table .sort-caret{--el-text-color-placeholder:--ibiz-control-grid-header-text-color;position:initial;opacity:.6}.ibiz-control-grid__table.el-table .el-table__cell{padding:var(--ibiz-spacing-none)}.ibiz-control-grid__table.el-table .el-table__body-wrapper tr td{background:var(--ibiz-control-grid-body-row-bg-color)}.ibiz-control-grid__table.el-table .el-table__body-wrapper tr:nth-child(2n) td{background-color:var(--ibiz-control-grid-body-row-bg-color-2)}.ibiz-control-grid__table.el-table .el-table__body-wrapper tr:hover td{background-color:var(--ibiz-control-grid-body-row-hover-bg-color)}.ibiz-control-grid__table.el-table .el-table__body-wrapper tr.current-row td{background-color:var(--el-table-current-row-bg-color)}.ibiz-control-grid__table.el-table .el-table__body-wrapper tr.editing-row td.uagridcolumn{background-color:var(--ibiz-control-grid-body-row-hover-bg-color)}.ibiz-control-grid__table.el-table .el-table__body-wrapper tr.editing-row td:not(.uagridcolumn){background-color:var(--ibiz-control-grid-body-row-edit-bg-color)}.ibiz-control-grid__table.el-table .el-table__body-wrapper tr.editing-row td .el-date-editor,.ibiz-control-grid__table.el-table .el-table__body-wrapper tr.editing-row td .el-input__wrapper,.ibiz-control-grid__table.el-table .el-table__body-wrapper tr.editing-row td .el-textarea__inner{--el-input-bg-color:var(--ibiz-color-bg-1)}.ibiz-control-grid__table .el-table__header-wrapper .cell{height:var(--ibiz-control-grid-header-row-height);min-height:var(--ibiz-control-grid-header-row-min-height);padding:var(--ibiz-control-grid-header-cell-padding);font-size:var(--ibiz-control-grid-header-cell-font-size);font-weight:var(--ibiz-control-grid-header-cell-font-weight);color:var(--ibiz-control-grid-header-cell-text-color);word-break:break-word;white-space:pre-wrap}.ibiz-control-grid__table .el-table__header-wrapper .el-table-column--selection .cell{padding:var(--ibiz-control-grid-selection-padding)}.ibiz-control-grid__table .el-table__header-wrapper .el-table-column--selection .cell .el-checkbox{--el-border-color:var(--ibiz-control-grid-selection-border-color);--el-checkbox-checked-bg-color:var(--ibiz-control-grid-selection-active-bg-color);--el-checkbox-checked-input-border-color:var(--ibiz-control-grid-selection-active-border-color);--el-checkbox-checked-icon-color:var(--ibiz-control-grid-selection-active-icon-color)}.ibiz-control-grid__table .el-table__header-wrapper .el-table__cell .cell{display:flex;align-items:center;justify-content:var(--ibiz-grid-column-justify-content)}.ibiz-control-grid__table .el-table__header-wrapper .el-table-fixed-column--left .cell,.ibiz-control-grid__table .el-table__header-wrapper .el-table-fixed-column--right .cell{display:flex;align-items:center;justify-content:var(--ibiz-grid-column-justify-content)}.ibiz-control-grid__table .el-table__body-wrapper{color:var(--ibiz-control-grid-body-cell-text-color);border-bottom:.1px solid var(--ibiz-color-border)}.ibiz-control-grid__table .el-table__body-wrapper .el-table__row{height:var(--ibiz-control-grid-body-row-height);cursor:pointer}.ibiz-control-grid__table .el-table__body-wrapper .el-table__row>td{height:0;padding:var(--ibiz-spacing-none)}.ibiz-control-grid__table .el-table__body-wrapper .el-table__row .el-table__expand-icon{margin-left:var(--ibiz-control-grid-body-row-expand-icon-gap)}@-moz-document url-prefix(){.ibiz-control-grid__table .el-table__body-wrapper .el-table__row>td{height:100%}}.ibiz-control-grid__table .el-table__body-wrapper .cell{display:flex;align-items:center;height:100%;padding:var(--ibiz-spacing-none)}.ibiz-control-grid__table .el-table__body-wrapper .el-table-column--selection .cell{padding:var(--ibiz-control-grid-selection-padding)}.ibiz-control-grid__table .el-table__body-wrapper .el-table-column--selection .cell .el-checkbox{--el-border-color:var(--ibiz-control-grid-selection-border-color);--el-checkbox-checked-bg-color:var(--ibiz-control-grid-selection-active-bg-color);--el-checkbox-checked-input-border-color:var(--ibiz-control-grid-selection-active-border-color);--el-checkbox-checked-icon-color:var(--ibiz-control-grid-selection-active-icon-color)}.ibiz-control-grid__table .el-table__cell.is-center{--ibiz-grid-column-text-align:center;--ibiz-grid-column-justify-content:center}.ibiz-control-grid__table .el-table__cell.is-left{--ibiz-grid-column-text-align:left;--ibiz-grid-column-justify-content:flex-start}.ibiz-control-grid__table .el-table__cell.is-right{--ibiz-grid-column-text-align:right;--ibiz-grid-column-justify-content:flex-end}.ibiz-control-grid__table .el-scrollbar__wrap{position:relative}.ibiz-control-grid__table .el-table__footer-wrapper tfoot td.el-table__cell{height:var(--ibiz-control-grid-footer-height);font-size:var(--ibiz-control-grid-footer-font-size);font-weight:var(--ibiz-control-grid-footer-font-weight);color:var(--ibiz-control-grid-footer-text-color);background-color:var(--ibiz-control-grid-footer-bg-color)}.ibiz-control-grid__table .el-table__footer-wrapper tfoot td.el-table__cell:first-child>div{padding:0;vertical-align:var(--ibiz-control-grid-footer-vertical-align)}.ibiz-control-grid__table .enable-order{position:relative;padding-left:var(--ibiz-spacing-base-tight);transition:transform .25s cubic-bezier(0,0,.2,1)}.ibiz-control-grid__table .enable-order .ibiz-control-grid__drag-icon{padding:var(--ibiz-spacing-none)!important}.ibiz-control-grid__table .enable-order .ibiz-control-grid__drag-icon .cell{display:none}.ibiz-control-grid__table .enable-order:hover .ibiz-control-grid__drag-icon .cell{display:flex}.ibiz-control-grid__table .el-scrollbar__bar.is-horizontal{height:var(--ibiz-control-grid-scrollbar-width)}.ibiz-control-grid__table .el-scrollbar__bar.is-vertical{width:var(--ibiz-control-grid-scrollbar-width)}.ibiz-control-grid__table .el-scrollbar__thumb{background-color:var(--ibiz-control-grid-scrollbar-bg-color)}.ibiz-control-grid__table .el-scrollbar__thumb:hover{background-color:var(--ibiz-control-grid-scrollbar-bg-hover-color);opacity:var(--ibiz-control-grid-scrollbar-bg-hover-opacity)}.ibiz-control-grid__load-more-button{padding:var(--ibiz-control-grid-header-cell-padding);text-align:center}.ibiz-control-grid .el-table td.el-table__cell,.ibiz-control-grid .el-table th.el-table__cell.is-leaf{border-bottom:none}.ibiz-control-grid.is-single-select .el-table__header-wrapper .el-table__header thead>tr th:nth-child(1){padding-left:var(--ibiz-spacing-tight)}.ibiz-control-grid.is-single-select .el-table__body-wrapper .el-table__body tbody>tr td:nth-child(1){padding-left:var(--ibiz-spacing-tight)}.ibiz-control-grid.is-enable-customized .el-table__header-wrapper .el-table__header thead>tr:first-child th:last-child{padding-right:var(--ibiz-spacing-base-loose)}.ibiz-control-grid.is-enable-customized .ibiz-control-grid-setting-box{display:flex;align-items:center;justify-content:flex-start;position:absolute;top:0;right:0;z-index:10;height:var(--ibiz-control-grid-setting-height);padding-right:var(--ibiz-control-grid-setting-padding-right);background-color:var(--ibiz-control-grid-setting-bg-color)}.ibiz-control-grid-quick-toolbar{justify-content:center}.ibiz-control-grid-batch-toolbar{position:absolute;top:0;left:54px;z-index:99;display:none;width:calc(100% - 54px);height:var(--ibiz-control-grid-setting-height);font-size:var(--ibiz-font-size-regular);font-weight:var(--ibiz-font-weight-regular);background-color:var(--ibiz-control-grid-header-row-bg-color)}.ibiz-control-grid-batch-toolbar.is-show{display:flex;align-items:center;justify-content:flex-start}.ibiz-control-grid-batch-toolbar .ibiz-control-grid-batch-toolbar-separator{padding:0 var(--ibiz-spacing-base-tight)}.ibiz-control-grid-batch-toolbar .ibiz-control-grid-batch-toolbar-content{height:100%;display:flex;align-items:center;justify-content:flex-start}.ibiz-control-grid-batch-toolbar .ibiz-control-grid-batch-toolbar-text{flex:none}

package/lib/control/grid/grid-column/grid-column-header/grid-column-header.css

@@ -1 +1 @@
-.ibiz-grid-column-header{display:flex;align-items:center;justify-content:space-between}.ibiz-grid-column-header__caption{display:flex;gap:var(--ibiz-spacing-extra-tight);align-items:center}.ibiz-grid-column-header__filter--icon{height:23px;visibility:visible;color:var(--ibiz-color-text-3);margin-left:var(--ibiz-spacing-extra-tight)}.ibiz-grid-column-header__filter--icon.is-active{color:var(--ibiz-color-primary)}.ibiz-grid-column-header__popover--editor{padding-bottom:var(--ibiz-spacing-tight);border-bottom:1px solid var(--ibiz-color-border)}.ibiz-grid-column-header__popover--bottom{display:flex;align-items:center;float:right}
+.ibiz-grid-column-header{--ibiz-grid-column-header-filter-color:var(--ibiz-control-grid-filter-color);--ibiz-grid-column-header-filter-active-color:var(--ibiz-control-grid-filter-active-color);--ibiz-grid-column-header-icon-gap:var(--ibiz-spacing-extra-tight);--ibiz-grid-column-header-popover-padding-bottom:var(--ibiz-spacing-tight);--ibiz-grid-column-header-popover-divider:1px solid var(--ibiz-color-border);display:flex;align-items:center;justify-content:space-between}.ibiz-grid-column-header__caption{display:flex;gap:var(--ibiz-grid-column-header-icon-gap);align-items:center}.ibiz-grid-column-header__filter--icon{height:23px;margin-left:var(--ibiz-grid-column-header-icon-gap);color:var(--ibiz-grid-column-header-filter-color);visibility:visible}.ibiz-grid-column-header__filter--icon.is-active{color:var(--ibiz-grid-column-header-filter-active-color)}.ibiz-grid-column-header__popover{--ibiz-grid-column-header-filter-color:var(--ibiz-control-grid-filter-color);--ibiz-grid-column-header-filter-active-color:var(--ibiz-control-grid-filter-active-color);--ibiz-grid-column-header-icon-gap:var(--ibiz-spacing-extra-tight);--ibiz-grid-column-header-popover-padding-bottom:var(--ibiz-spacing-tight);--ibiz-grid-column-header-popover-divider:1px solid var(--ibiz-color-border)}.ibiz-grid-column-header__popover--editor{padding-bottom:var(--ibiz-grid-column-header-popover-padding-bottom);border-bottom:var(--ibiz-grid-column-header-popover-divider)}.ibiz-grid-column-header__popover--bottom{display:flex;align-items:center;float:right}

package/lib/control/grid/grid-column/grid-field-column/attachment-column/attachment-column.cjs

@@ -25,9 +25,11 @@ const AttachmentColumn = /* @__PURE__ */ vue.defineComponent({
   setup(props) {
     const ns = vue3Util.useNamespace("attachment-column");
     const {
-      downloadUrl,
+      getDownloadUrl,
       files,
-      onDownload
+      enableNoAccess,
+      onDownload,
+      getDownloadTicketParams
     } = fileUtil.useFilesParse(props, props.controller);
     const loading = vue.ref(true);
     const onLoad = () => {
@@ -54,7 +56,16 @@ const AttachmentColumn = /* @__PURE__ */ vue.defineComponent({
       await overlay.onWillDismiss();
     };
     const handlePDFPreview = async (file) => {
-      const url = file.url || downloadUrl.value.replace("%fileId%", file.id);
+      const downloadUrl = getDownloadUrl(props.data, file);
+      let url = file.url || downloadUrl.replace("%fileId%", file.id);
+      if (ibiz.config.common.enableDownloadTicket && !enableNoAccess) {
+        const downloadTicket = await ibiz.util.file.getDownloadTicket(props.controller.context, props.controller.params, props.data, {
+          fileId: file.id
+        }, getDownloadTicketParams());
+        if (downloadTicket && downloadTicket.ticket) {
+          url = downloadUrl.replace("%fileId%", downloadTicket.ticket);
+        }
+      }
       const response = await ibiz.net.request(url, {
         method: "get",
         responseType: "blob",