@opentinyvue/vue-grid-toolbar 2.21.0 → 3.21.0

package/lib/index.js

@@ -22,6 +22,7 @@ import Popover from '@opentinyvue/vue-popover';
 import Radio from '@opentinyvue/vue-radio';
 import { format } from '@opentinyvue/vue-renderless/common/date';
 import { extend } from '@opentinyvue/vue-renderless/common/object';
+import { resolveComponent, openBlock, createBlock, withCtx, createVNode, createTextVNode, toDisplayString, createElementVNode, createElementBlock, createCommentVNode, normalizeClass, resolveDynamicComponent, Fragment, renderList, resolveDirective, withDirectives, vShow } from 'vue';
 import Tree from '@opentinyvue/vue-tree';
 import Split from '@opentinyvue/vue-split';
 import Checkbox from '@opentinyvue/vue-checkbox';
@@ -35,38 +36,41 @@ import Tooltip from '@opentinyvue/vue-tooltip';
 import Clickoutside from '@opentinyvue/vue-renderless/common/deps/clickoutside';
 import '@opentinyvue/vue-theme/grid-toolbar/index.css';
 
-function normalizeComponent(scriptExports, render, staticRenderFns, functionalTemplate, injectStyles, scopeId, moduleIdentifier, shadowMode) {
-  var options = typeof scriptExports === "function" ? scriptExports.options : scriptExports;
-  if (render) {
-    options.render = render;
-    options.staticRenderFns = staticRenderFns;
-    options._compiled = true;
-  }
-  var hook;
-  if (injectStyles) {
-    hook = injectStyles;
+function _createForOfIteratorHelperLoose(r, e) {
+  var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"];
+  if (t) return (t = t.call(r)).next.bind(t);
+  if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) {
+    t && (r = t);
+    var o = 0;
+    return function() {
+      return o >= r.length ? { done: true } : { done: false, value: r[o++] };
+    };
   }
-  if (hook) {
-    if (options.functional) {
-      options._injectStyles = hook;
-      var originalRender = options.render;
-      options.render = function renderWithStyleInjection(h, context) {
-        hook.call(context);
-        return originalRender(h, context);
-      };
-    } else {
-      var existing = options.beforeCreate;
-      options.beforeCreate = existing ? [].concat(existing, hook) : [hook];
-    }
+  throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+}
+function _unsupportedIterableToArray(r, a) {
+  if (r) {
+    if ("string" == typeof r) return _arrayLikeToArray(r, a);
+    var t = {}.toString.call(r).slice(8, -1);
+    return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0;
   }
-  return {
-    exports: scriptExports,
-    options
-  };
 }
+function _arrayLikeToArray(r, a) {
+  (null == a || a > r.length) && (a = r.length);
+  for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e];
+  return n;
+}
+var _export_sfc = function _export_sfc2(sfc, props) {
+  var target = sfc.__vccOpts || sfc;
+  for (var _iterator = _createForOfIteratorHelperLoose(props), _step; !(_step = _iterator()).done; ) {
+    var _step$value = _step.value, key = _step$value[0], val = _step$value[1];
+    target[key] = val;
+  }
+  return target;
+};
 
-var _excluded2 = ["property"], _excluded3 = ["property"];
-function _objectWithoutPropertiesLoose2(r, e) {
+var _excluded = ["property"], _excluded2 = ["row"], _excluded3 = ["property"];
+function _objectWithoutPropertiesLoose(r, e) {
   if (null == r) return {};
   var t2 = {};
   for (var n in r) if ({}.hasOwnProperty.call(r, n)) {
@@ -152,7 +156,7 @@ function mergeArray(toArr, fromArr) {
   }
   return result;
 }
-var __vue2_script$3 = defineComponent({
+var _sfc_main$3 = defineComponent({
   name: "TinyGridCustomSwitch",
   components: {
     TinyButton: Button,
@@ -471,8 +475,8 @@ var __vue2_script$3 = defineComponent({
       }
       this.fixStatus();
     },
-    doCheck: function doCheck(_ref3) {
-      var storageType = _ref3.storageType;
+    doCheck: function doCheck(_ref) {
+      var storageType = _ref.storageType;
       if (storageType === "remote") {
         if (!this.historyConfig.remoteMethod || typeof this.historyConfig.remoteMethod !== "function") {
           GridTools.error("ui.grid.error.remoteMethod");
@@ -528,338 +532,531 @@ var __vue2_script$3 = defineComponent({
     }
   }
 });
-var render$3 = function render$32() {
-  var _vm = this;
-  var _h = _vm.$createElement;
-  var _c = _vm._self._c || _h;
-  return _vm.customMode === "saas" ? _c("tiny-popover", {
+var _hoisted_1$2 = {
+  key: 0,
+  class: "radio-box"
+};
+var _hoisted_2$2 = {
+  class: "btn-box"
+};
+var _hoisted_3$2 = {
+  key: 1,
+  class: "tiny-grid-custom-switch"
+};
+var _hoisted_4$2 = {
+  class: "tiny-grid-custom-switch__title"
+};
+var _hoisted_5$2 = {
+  class: "tiny-grid-custom-switch__label"
+};
+var _hoisted_6$2 = {
+  class: "tiny-grid-custom-switch__content"
+};
+var _hoisted_7$2 = ["title"];
+var _hoisted_8$2 = ["title"];
+var _hoisted_9$2 = ["title"];
+var _hoisted_10$2 = {
+  key: 0,
+  class: "tiny-grid-custom-switch__confirm-btns"
+};
+var _hoisted_11$2 = {
+  class: "tiny-grid-custom-switch__del-tip"
+};
+var _hoisted_12$2 = {
+  class: "tiny-grid-custom-switch__del-tip"
+};
+var _hoisted_13$2 = {
+  class: "tiny-grid-custom-switch__del-tip"
+};
+var _hoisted_14$2 = {
+  class: "tiny-grid-custom-switch__del-tip"
+};
+function _sfc_render$3(_ctx, _cache, $props2, $setup, $data, $options) {
+  var _component_tiny_radio = resolveComponent("tiny-radio");
+  var _component_tiny_input = resolveComponent("tiny-input");
+  var _component_tiny_button = resolveComponent("tiny-button");
+  var _component_tiny_popover = resolveComponent("tiny-popover");
+  var _component_tiny_alert = resolveComponent("tiny-alert");
+  var _component_tiny_col = resolveComponent("tiny-col");
+  var _component_tiny_row = resolveComponent("tiny-row");
+  var _component_tiny_select = resolveComponent("tiny-select");
+  var _component_tiny_layout = resolveComponent("tiny-layout");
+  var _component_tiny_dialog_box = resolveComponent("tiny-dialog-box");
+  return _ctx.customMode === "saas" ? (openBlock(), createBlock(_component_tiny_popover, {
+    key: 0,
     ref: "popover",
-    attrs: {
-      "width": "280",
-      "placement": "top",
-      "popper-class": "grid-toolbar-template-popover",
-      "trigger": "manual"
-    },
-    scopedSlots: _vm._u([{
-      key: "reference",
-      fn: function fn() {
-        return [_c("tiny-button", {
-          staticClass: "save-btn",
-          on: {
-            "click": function click($event) {
-              _vm.templateVisible = !_vm.templateVisible;
-            }
-          }
-        }, [_vm._v(_vm._s(_vm.t("ui.grid.individuation.saveTemplate")))])];
-      },
-      proxy: true
-    }], null, false, 3411578796),
-    model: {
-      value: _vm.templateVisible,
-      callback: function callback($$v) {
-        _vm.templateVisible = $$v;
-      },
-      expression: "templateVisible"
-    }
-  }, [_c("div", [_vm.selectedTemplateVal.id && !_vm.historyConfig.hideOverwrite ? _c("div", {
-    staticClass: "radio-box"
-  }, [_c("tiny-radio", {
-    attrs: {
-      "label": "overwrite"
-    },
-    model: {
-      value: _vm.saveMethod,
-      callback: function callback($$v) {
-        _vm.saveMethod = $$v;
-      },
-      expression: "saveMethod"
-    }
-  }, [_vm._v(_vm._s(_vm.t("ui.grid.individuation.overwriteSave")))]), _c("tiny-radio", {
-    attrs: {
-      "label": "save"
-    },
-    model: {
-      value: _vm.saveMethod,
-      callback: function callback($$v) {
-        _vm.saveMethod = $$v;
-      },
-      expression: "saveMethod"
-    }
-  }, [_vm._v(_vm._s(_vm.t("ui.grid.individuation.saveAs")))])], 1) : _vm._e(), _vm.saveMethod === "save" ? _c("tiny-input", {
-    attrs: {
-      "type": "text",
-      "placeholder": _vm.t("ui.grid.individuation.defaultTemplateName")
-    },
-    model: {
-      value: _vm.savedTemplateName,
-      callback: function callback($$v) {
-        _vm.savedTemplateName = $$v;
-      },
-      expression: "savedTemplateName"
-    }
-  }) : _c("tiny-input", {
-    attrs: {
-      "placeholder": _vm.t("ui.grid.individuation.reserveTemplateName"),
-      "type": "text"
-    },
-    model: {
-      value: _vm.selectedTemplateName,
-      callback: function callback($$v) {
-        _vm.selectedTemplateName = $$v;
-      },
-      expression: "selectedTemplateName"
-    }
-  }), _c("div", {
-    staticClass: "btn-box"
-  }, [_c("tiny-button", {
-    on: {
-      "click": function click($event) {
-        _vm.templateVisible = false;
-      }
-    }
-  }, [_vm._v(_vm._s(_vm.t("ui.grid.individuation.cancelBtn")))]), _c("tiny-button", {
-    attrs: {
-      "type": "primary"
-    },
-    on: {
-      "click": function click($event) {
-        return _vm.handleSaveConfirm(_vm.saveMethod);
-      }
-    }
-  }, [_vm._v(_vm._s(_vm.t("ui.grid.individuation.saveBtn")))])], 1)], 1)]) : _c("div", {
-    staticClass: "tiny-grid-custom-switch"
-  }, [_c("tiny-layout", [_c("tiny-row", {
-    attrs: {
-      "no-space": ""
-    }
-  }, [_c("tiny-col", {
-    attrs: {
-      "span": 12
-    }
-  }, [_c("div", {
-    staticClass: "tiny-grid-custom-switch__title"
-  }, [_vm.historyConfig.showTitle ? _c("tiny-alert", {
-    attrs: {
-      "description": _vm.historyConfig.title || _vm.t("ui.grid.individuation.switchtitle"),
-      "closable": false
-    }
-  }) : _vm._e()], 1)])], 1), _c("tiny-row", {
-    attrs: {
-      "no-space": ""
-    }
-  }, [_vm.historyConfig.showSave ? _c("tiny-col", {
-    attrs: {
-      "span": 2
-    }
-  }, [_c("div", [_c("tiny-button", {
-    attrs: {
-      "type": "primary",
-      "size": "mini",
-      "disabled": _vm.historyConfig.saveDisabled || _vm.saveDisabled
-    },
-    on: {
-      "click": _vm.handleSave
-    }
-  }, [_vm._v(_vm._s(_vm.historyConfig.saveText || _vm.t("ui.grid.individuation.switchsave")))])], 1)]) : _vm._e(), _c("tiny-col", {
-    attrs: {
-      "span": 2
-    }
-  }, [_c("div", {
-    staticClass: "tiny-grid-custom-switch__label"
-  }, [_vm._v(" " + _vm._s(_vm.historyConfig.labelText || _vm.t("ui.grid.individuation.switchlabel")) + " ")])]), _c("tiny-col", {
-    attrs: {
-      "span": 5
-    }
-  }, [_c("div", {
-    staticClass: "tiny-grid-custom-switch__content"
-  }, [_c("tiny-select", {
-    ref: "select",
-    attrs: {
-      "clearable": "",
-      "value-field": "id",
-      "text-field": "name",
-      "placeholder": _vm.historyConfig.selectPlaceholder || _vm.t("ui.select.placeholder"),
-      "disabled": _vm.historyConfig.selectDisabled || _vm.selectDisabled,
-      "options": _vm.options
-    },
-    on: {
-      "change": _vm.handleSelectChange
-    },
-    model: {
-      value: _vm.selected,
-      callback: function callback($$v) {
-        _vm.selected = $$v;
-      },
-      expression: "selected"
-    }
-  })], 1)]), _c("tiny-col", {
-    attrs: {
-      "span": 3
-    }
-  }, [_c("div", [_vm.historyConfig.showApply ? _c("span", {
-    staticClass: "tiny-grid-custom-switch__icon-btn",
-    class: {
-      "tiny-grid-custom-switch__icon-btn--disabled": _vm.historyConfig.applyDisabled || _vm.applyDisabled
-    },
-    attrs: {
-      "title": _vm.historyConfig.applyTitle || _vm.t("ui.grid.individuation.switchapply")
-    },
-    on: {
-      "click": _vm.handleApply
-    }
-  }, [_c(_vm.historyConfig.applyIcon || _vm.IconSave, {
-    tag: "component"
-  })], 1) : _vm._e(), _vm.historyConfig.showEdit ? _c("span", {
-    staticClass: "tiny-grid-custom-switch__icon-btn",
-    class: {
-      "tiny-grid-custom-switch__icon-btn--disabled": _vm.historyConfig.editDisabled || _vm.editDisabled
-    },
-    attrs: {
-      "title": _vm.historyConfig.editTitle || _vm.t("ui.grid.individuation.switchedit")
-    },
-    on: {
-      "click": _vm.handleEdit
-    }
-  }, [_c(_vm.historyConfig.editIcon || _vm.IconEdit, {
-    tag: "component"
-  })], 1) : _vm._e(), _vm.historyConfig.showDel ? _c("span", {
-    staticClass: "tiny-grid-custom-switch__icon-btn",
-    class: {
-      "tiny-grid-custom-switch__icon-btn--disabled": _vm.historyConfig.delDisabled || _vm.delDisabled
-    },
-    attrs: {
-      "title": _vm.historyConfig.delTitle || _vm.t("ui.grid.individuation.switchdel")
-    },
-    on: {
-      "click": _vm.handleDel
-    }
-  }, [_c(_vm.historyConfig.delIcon || _vm.IconDel, {
-    tag: "component"
-  })], 1) : _vm._e()])])], 1)], 1), _c("tiny-dialog-box", {
-    attrs: {
-      "top": "30vh",
-      "width": "420px",
-      "dialog-class": "tiny-grid-custom-switch__dialog-box",
-      "draggable": "",
-      "append-to-body": "",
-      "visible": _vm.visible,
-      "close-on-click-modal": false,
-      "title": _vm.dialogTitle
-    },
-    on: {
-      "update:visible": function updateVisible($event) {
-        _vm.visible = $event;
-      }
-    },
-    scopedSlots: _vm._u([{
-      key: "footer",
-      fn: function fn() {
-        return [~["apply", "edit", "del"].indexOf(_vm.status) ? [_vm.status === "apply" ? [_c("tiny-button", {
-          attrs: {
-            "type": "primary"
+    width: "280",
+    modelValue: _ctx.templateVisible,
+    "onUpdate:modelValue": _cache[7] || (_cache[7] = function($event) {
+      return _ctx.templateVisible = $event;
+    }),
+    placement: "top",
+    "popper-class": "grid-toolbar-template-popover",
+    trigger: "manual"
+  }, {
+    reference: withCtx(function() {
+      return [createVNode(_component_tiny_button, {
+        class: "save-btn",
+        onClick: _cache[6] || (_cache[6] = function($event) {
+          return _ctx.templateVisible = !_ctx.templateVisible;
+        })
+      }, {
+        default: withCtx(function() {
+          return [createTextVNode(
+            toDisplayString(_ctx.t("ui.grid.individuation.saveTemplate")),
+            1
+            /* TEXT */
+          )];
+        }),
+        _: 1
+        /* STABLE */
+      })];
+    }),
+    default: withCtx(function() {
+      return [createElementVNode("div", null, [_ctx.selectedTemplateVal.id && !_ctx.historyConfig.hideOverwrite ? (openBlock(), createElementBlock("div", _hoisted_1$2, [createVNode(_component_tiny_radio, {
+        modelValue: _ctx.saveMethod,
+        "onUpdate:modelValue": _cache[0] || (_cache[0] = function($event) {
+          return _ctx.saveMethod = $event;
+        }),
+        label: "overwrite"
+      }, {
+        default: withCtx(function() {
+          return [createTextVNode(
+            toDisplayString(_ctx.t("ui.grid.individuation.overwriteSave")),
+            1
+            /* TEXT */
+          )];
+        }),
+        _: 1
+        /* STABLE */
+      }, 8, ["modelValue"]), createVNode(_component_tiny_radio, {
+        modelValue: _ctx.saveMethod,
+        "onUpdate:modelValue": _cache[1] || (_cache[1] = function($event) {
+          return _ctx.saveMethod = $event;
+        }),
+        label: "save"
+      }, {
+        default: withCtx(function() {
+          return [createTextVNode(
+            toDisplayString(_ctx.t("ui.grid.individuation.saveAs")),
+            1
+            /* TEXT */
+          )];
+        }),
+        _: 1
+        /* STABLE */
+      }, 8, ["modelValue"])])) : createCommentVNode("v-if", true), _ctx.saveMethod === "save" ? (openBlock(), createBlock(_component_tiny_input, {
+        key: 1,
+        modelValue: _ctx.savedTemplateName,
+        "onUpdate:modelValue": _cache[2] || (_cache[2] = function($event) {
+          return _ctx.savedTemplateName = $event;
+        }),
+        type: "text",
+        placeholder: _ctx.t("ui.grid.individuation.defaultTemplateName")
+      }, null, 8, ["modelValue", "placeholder"])) : (openBlock(), createBlock(_component_tiny_input, {
+        key: 2,
+        modelValue: _ctx.selectedTemplateName,
+        "onUpdate:modelValue": _cache[3] || (_cache[3] = function($event) {
+          return _ctx.selectedTemplateName = $event;
+        }),
+        placeholder: _ctx.t("ui.grid.individuation.reserveTemplateName"),
+        type: "text"
+      }, null, 8, ["modelValue", "placeholder"])), createElementVNode("div", _hoisted_2$2, [createVNode(_component_tiny_button, {
+        onClick: _cache[4] || (_cache[4] = function($event) {
+          return _ctx.templateVisible = false;
+        })
+      }, {
+        default: withCtx(function() {
+          return [createTextVNode(
+            toDisplayString(_ctx.t("ui.grid.individuation.cancelBtn")),
+            1
+            /* TEXT */
+          )];
+        }),
+        _: 1
+        /* STABLE */
+      }), createVNode(_component_tiny_button, {
+        type: "primary",
+        onClick: _cache[5] || (_cache[5] = function($event) {
+          return _ctx.handleSaveConfirm(_ctx.saveMethod);
+        })
+      }, {
+        default: withCtx(function() {
+          return [createTextVNode(
+            toDisplayString(_ctx.t("ui.grid.individuation.saveBtn")),
+            1
+            /* TEXT */
+          )];
+        }),
+        _: 1
+        /* STABLE */
+      })])])];
+    }),
+    _: 1
+    /* STABLE */
+  }, 8, ["modelValue"])) : (openBlock(), createElementBlock("div", _hoisted_3$2, [createVNode(_component_tiny_layout, null, {
+    default: withCtx(function() {
+      return [createVNode(_component_tiny_row, {
+        "no-space": ""
+      }, {
+        default: withCtx(function() {
+          return [createVNode(_component_tiny_col, {
+            span: 12
+          }, {
+            default: withCtx(function() {
+              return [createElementVNode("div", _hoisted_4$2, [_ctx.historyConfig.showTitle ? (openBlock(), createBlock(_component_tiny_alert, {
+                key: 0,
+                description: _ctx.historyConfig.title || _ctx.t("ui.grid.individuation.switchtitle"),
+                closable: false
+              }, null, 8, ["description"])) : createCommentVNode("v-if", true)])];
+            }),
+            _: 1
+            /* STABLE */
+          })];
+        }),
+        _: 1
+        /* STABLE */
+      }), createVNode(_component_tiny_row, {
+        "no-space": ""
+      }, {
+        default: withCtx(function() {
+          return [_ctx.historyConfig.showSave ? (openBlock(), createBlock(_component_tiny_col, {
+            key: 0,
+            span: 2
+          }, {
+            default: withCtx(function() {
+              return [createElementVNode("div", null, [createVNode(_component_tiny_button, {
+                type: "primary",
+                size: "mini",
+                disabled: _ctx.historyConfig.saveDisabled || _ctx.saveDisabled,
+                onClick: _ctx.handleSave
+              }, {
+                default: withCtx(function() {
+                  return [createTextVNode(
+                    toDisplayString(_ctx.historyConfig.saveText || _ctx.t("ui.grid.individuation.switchsave")),
+                    1
+                    /* TEXT */
+                  )];
+                }),
+                _: 1
+                /* STABLE */
+              }, 8, ["disabled", "onClick"])])];
+            }),
+            _: 1
+            /* STABLE */
+          })) : createCommentVNode("v-if", true), createVNode(_component_tiny_col, {
+            span: 2
+          }, {
+            default: withCtx(function() {
+              return [createElementVNode(
+                "div",
+                _hoisted_5$2,
+                toDisplayString(_ctx.historyConfig.labelText || _ctx.t("ui.grid.individuation.switchlabel")),
+                1
+                /* TEXT */
+              )];
+            }),
+            _: 1
+            /* STABLE */
+          }), createVNode(_component_tiny_col, {
+            span: 5
+          }, {
+            default: withCtx(function() {
+              return [createElementVNode("div", _hoisted_6$2, [createVNode(_component_tiny_select, {
+                clearable: "",
+                ref: "select",
+                "value-field": "id",
+                "text-field": "name",
+                placeholder: _ctx.historyConfig.selectPlaceholder || _ctx.t("ui.select.placeholder"),
+                disabled: _ctx.historyConfig.selectDisabled || _ctx.selectDisabled,
+                options: _ctx.options,
+                onChange: _ctx.handleSelectChange,
+                modelValue: _ctx.selected,
+                "onUpdate:modelValue": _cache[8] || (_cache[8] = function($event) {
+                  return _ctx.selected = $event;
+                })
+              }, null, 8, ["placeholder", "disabled", "options", "onChange", "modelValue"])])];
+            }),
+            _: 1
+            /* STABLE */
+          }), createVNode(_component_tiny_col, {
+            span: 3
+          }, {
+            default: withCtx(function() {
+              return [createElementVNode("div", null, [_ctx.historyConfig.showApply ? (openBlock(), createElementBlock("span", {
+                key: 0,
+                title: _ctx.historyConfig.applyTitle || _ctx.t("ui.grid.individuation.switchapply"),
+                class: normalizeClass(["tiny-grid-custom-switch__icon-btn", {
+                  "tiny-grid-custom-switch__icon-btn--disabled": _ctx.historyConfig.applyDisabled || _ctx.applyDisabled
+                }]),
+                onClick: _cache[9] || (_cache[9] = function() {
+                  return _ctx.handleApply && _ctx.handleApply.apply(_ctx, arguments);
+                })
+              }, [(openBlock(), createBlock(resolveDynamicComponent(_ctx.historyConfig.applyIcon || _ctx.IconSave)))], 10, _hoisted_7$2)) : createCommentVNode("v-if", true), _ctx.historyConfig.showEdit ? (openBlock(), createElementBlock("span", {
+                key: 1,
+                title: _ctx.historyConfig.editTitle || _ctx.t("ui.grid.individuation.switchedit"),
+                class: normalizeClass(["tiny-grid-custom-switch__icon-btn", {
+                  "tiny-grid-custom-switch__icon-btn--disabled": _ctx.historyConfig.editDisabled || _ctx.editDisabled
+                }]),
+                onClick: _cache[10] || (_cache[10] = function() {
+                  return _ctx.handleEdit && _ctx.handleEdit.apply(_ctx, arguments);
+                })
+              }, [(openBlock(), createBlock(resolveDynamicComponent(_ctx.historyConfig.editIcon || _ctx.IconEdit)))], 10, _hoisted_8$2)) : createCommentVNode("v-if", true), _ctx.historyConfig.showDel ? (openBlock(), createElementBlock("span", {
+                key: 2,
+                title: _ctx.historyConfig.delTitle || _ctx.t("ui.grid.individuation.switchdel"),
+                class: normalizeClass(["tiny-grid-custom-switch__icon-btn", {
+                  "tiny-grid-custom-switch__icon-btn--disabled": _ctx.historyConfig.delDisabled || _ctx.delDisabled
+                }]),
+                onClick: _cache[11] || (_cache[11] = function() {
+                  return _ctx.handleDel && _ctx.handleDel.apply(_ctx, arguments);
+                })
+              }, [(openBlock(), createBlock(resolveDynamicComponent(_ctx.historyConfig.delIcon || _ctx.IconDel)))], 10, _hoisted_9$2)) : createCommentVNode("v-if", true)])];
+            }),
+            _: 1
+            /* STABLE */
+          })];
+        }),
+        _: 1
+        /* STABLE */
+      })];
+    }),
+    _: 1
+    /* STABLE */
+  }), createVNode(_component_tiny_dialog_box, {
+    top: "30vh",
+    width: "420px",
+    "dialog-class": "tiny-grid-custom-switch__dialog-box",
+    draggable: "",
+    "append-to-body": "",
+    visible: _ctx.visible,
+    "close-on-click-modal": false,
+    title: _ctx.dialogTitle,
+    "onUpdate:visible": _cache[22] || (_cache[22] = function($event) {
+      return _ctx.visible = $event;
+    })
+  }, {
+    footer: withCtx(function() {
+      return [~["apply", "edit", "del"].indexOf(_ctx.status) ? (openBlock(), createElementBlock(
+        Fragment,
+        {
+          key: 0
+        },
+        [_ctx.status === "apply" ? (openBlock(), createElementBlock(
+          Fragment,
+          {
+            key: 0
           },
-          on: {
-            "click": function click($event) {
-              return _vm.handleApplyConfirm("yes");
-            }
-          }
-        }, [_vm._v(" " + _vm._s(_vm.t("ui.grid.individuation.switchdelyes")) + " ")]), _c("tiny-button", {
-          on: {
-            "click": function click($event) {
-              return _vm.handleApplyConfirm("no");
-            }
-          }
-        }, [_vm._v(_vm._s(_vm.t("ui.grid.individuation.switchdelno")))])] : _vm._e(), _vm.status === "edit" ? [_c("tiny-button", {
-          attrs: {
-            "type": "primary",
-            "disabled": !_vm.editName
+          [createVNode(_component_tiny_button, {
+            type: "primary",
+            onClick: _cache[16] || (_cache[16] = function($event) {
+              return _ctx.handleApplyConfirm("yes");
+            })
+          }, {
+            default: withCtx(function() {
+              return [createTextVNode(
+                toDisplayString(_ctx.t("ui.grid.individuation.switchdelyes")),
+                1
+                /* TEXT */
+              )];
+            }),
+            _: 1
+            /* STABLE */
+          }), createVNode(_component_tiny_button, {
+            onClick: _cache[17] || (_cache[17] = function($event) {
+              return _ctx.handleApplyConfirm("no");
+            })
+          }, {
+            default: withCtx(function() {
+              return [createTextVNode(
+                toDisplayString(_ctx.t("ui.grid.individuation.switchdelno")),
+                1
+                /* TEXT */
+              )];
+            }),
+            _: 1
+            /* STABLE */
+          })],
+          64
+          /* STABLE_FRAGMENT */
+        )) : createCommentVNode("v-if", true), _ctx.status === "edit" ? (openBlock(), createElementBlock(
+          Fragment,
+          {
+            key: 1
           },
-          on: {
-            "click": function click($event) {
-              return _vm.handleEditConfirm("yes");
-            }
-          }
-        }, [_vm._v(" " + _vm._s(_vm.t("ui.grid.individuation.switchdelyes")) + " ")]), _c("tiny-button", {
-          on: {
-            "click": function click($event) {
-              return _vm.handleEditConfirm("no");
-            }
-          }
-        }, [_vm._v(_vm._s(_vm.t("ui.grid.individuation.switchdelno")))])] : _vm._e(), _vm.status === "del" ? [_c("tiny-button", {
-          attrs: {
-            "type": "primary"
+          [createVNode(_component_tiny_button, {
+            type: "primary",
+            disabled: !_ctx.editName,
+            onClick: _cache[18] || (_cache[18] = function($event) {
+              return _ctx.handleEditConfirm("yes");
+            })
+          }, {
+            default: withCtx(function() {
+              return [createTextVNode(
+                toDisplayString(_ctx.t("ui.grid.individuation.switchdelyes")),
+                1
+                /* TEXT */
+              )];
+            }),
+            _: 1
+            /* STABLE */
+          }, 8, ["disabled"]), createVNode(_component_tiny_button, {
+            onClick: _cache[19] || (_cache[19] = function($event) {
+              return _ctx.handleEditConfirm("no");
+            })
+          }, {
+            default: withCtx(function() {
+              return [createTextVNode(
+                toDisplayString(_ctx.t("ui.grid.individuation.switchdelno")),
+                1
+                /* TEXT */
+              )];
+            }),
+            _: 1
+            /* STABLE */
+          })],
+          64
+          /* STABLE_FRAGMENT */
+        )) : createCommentVNode("v-if", true), _ctx.status === "del" ? (openBlock(), createElementBlock(
+          Fragment,
+          {
+            key: 2
           },
-          on: {
-            "click": function click($event) {
-              return _vm.handleDelConfirm("yes");
-            }
-          }
-        }, [_vm._v(" " + _vm._s(_vm.t("ui.grid.individuation.switchdelyes")) + " ")]), _c("tiny-button", {
-          on: {
-            "click": function click($event) {
-              return _vm.handleDelConfirm("no");
-            }
-          }
-        }, [_vm._v(_vm._s(_vm.t("ui.grid.individuation.switchdelno")))])] : _vm._e()] : _vm._e()];
-      },
-      proxy: true
-    }])
-  }, [_vm.status === "save" ? _c("div", {
-    staticClass: "tiny-grid-custom-switch__confirm-btns"
-  }, [_c("tiny-button", {
-    attrs: {
-      "type": "primary"
-    },
-    on: {
-      "click": function click($event) {
-        return _vm.handleSaveConfirm("save");
-      }
-    }
-  }, [_vm._v(" " + _vm._s(_vm.t("ui.grid.individuation.switchonlytemp")) + " ")]), _c("tiny-button", {
-    on: {
-      "click": function click($event) {
-        return _vm.handleSaveConfirm("save-apply");
-      }
-    }
-  }, [_vm._v(" " + _vm._s(_vm.t("ui.grid.individuation.switchtempapply")) + " ")]), _c("tiny-button", {
-    attrs: {
-      "disabled": !_vm.selected
-    },
-    on: {
-      "click": function click($event) {
-        return _vm.handleSaveConfirm("overwrite");
-      }
-    }
-  }, [_vm._v(" " + _vm._s(_vm.t("ui.grid.individuation.switchtempoverwrite")) + " ")])], 1) : _vm._e(), _vm.status === "apply" ? [_c("div", {
-    staticClass: "tiny-grid-custom-switch__del-tip"
-  }, [_vm._v(_vm._s(_vm.selectedName))]), _c("div", {
-    staticClass: "tiny-grid-custom-switch__del-tip"
-  }, [_vm._v(" " + _vm._s(_vm.t("ui.grid.individuation.switchapplycon")) + " ")])] : _vm._e(), _vm.status === "edit" ? [_c("tiny-input", {
-    model: {
-      value: _vm.editName,
-      callback: function callback($$v) {
-        _vm.editName = $$v;
-      },
-      expression: "editName"
-    }
-  })] : _vm._e(), _vm.status === "del" ? [_c("div", {
-    staticClass: "tiny-grid-custom-switch__del-tip"
-  }, [_vm._v(_vm._s(_vm.selectedName))]), _c("div", {
-    staticClass: "tiny-grid-custom-switch__del-tip"
-  }, [_vm._v(" " + _vm._s(_vm.t("ui.grid.individuation.switchdelcon")) + " ")])] : _vm._e()], 2)], 1);
-};
-var staticRenderFns$3 = [];
-var __cssModules$3 = {};
-var __component__$3 = /* @__PURE__ */ normalizeComponent(__vue2_script$3, render$3, staticRenderFns$3, false, __vue2_injectStyles$3);
-function __vue2_injectStyles$3(context) {
-  for (var o in __cssModules$3) {
-    this[o] = __cssModules$3[o];
-  }
+          [createVNode(_component_tiny_button, {
+            type: "primary",
+            onClick: _cache[20] || (_cache[20] = function($event) {
+              return _ctx.handleDelConfirm("yes");
+            })
+          }, {
+            default: withCtx(function() {
+              return [createTextVNode(
+                toDisplayString(_ctx.t("ui.grid.individuation.switchdelyes")),
+                1
+                /* TEXT */
+              )];
+            }),
+            _: 1
+            /* STABLE */
+          }), createVNode(_component_tiny_button, {
+            onClick: _cache[21] || (_cache[21] = function($event) {
+              return _ctx.handleDelConfirm("no");
+            })
+          }, {
+            default: withCtx(function() {
+              return [createTextVNode(
+                toDisplayString(_ctx.t("ui.grid.individuation.switchdelno")),
+                1
+                /* TEXT */
+              )];
+            }),
+            _: 1
+            /* STABLE */
+          })],
+          64
+          /* STABLE_FRAGMENT */
+        )) : createCommentVNode("v-if", true)],
+        64
+        /* STABLE_FRAGMENT */
+      )) : createCommentVNode("v-if", true)];
+    }),
+    default: withCtx(function() {
+      return [_ctx.status === "save" ? (openBlock(), createElementBlock("div", _hoisted_10$2, [createVNode(_component_tiny_button, {
+        type: "primary",
+        onClick: _cache[12] || (_cache[12] = function($event) {
+          return _ctx.handleSaveConfirm("save");
+        })
+      }, {
+        default: withCtx(function() {
+          return [createTextVNode(
+            toDisplayString(_ctx.t("ui.grid.individuation.switchonlytemp")),
+            1
+            /* TEXT */
+          )];
+        }),
+        _: 1
+        /* STABLE */
+      }), createVNode(_component_tiny_button, {
+        onClick: _cache[13] || (_cache[13] = function($event) {
+          return _ctx.handleSaveConfirm("save-apply");
+        })
+      }, {
+        default: withCtx(function() {
+          return [createTextVNode(
+            toDisplayString(_ctx.t("ui.grid.individuation.switchtempapply")),
+            1
+            /* TEXT */
+          )];
+        }),
+        _: 1
+        /* STABLE */
+      }), createVNode(_component_tiny_button, {
+        onClick: _cache[14] || (_cache[14] = function($event) {
+          return _ctx.handleSaveConfirm("overwrite");
+        }),
+        disabled: !_ctx.selected
+      }, {
+        default: withCtx(function() {
+          return [createTextVNode(
+            toDisplayString(_ctx.t("ui.grid.individuation.switchtempoverwrite")),
+            1
+            /* TEXT */
+          )];
+        }),
+        _: 1
+        /* STABLE */
+      }, 8, ["disabled"])])) : createCommentVNode("v-if", true), _ctx.status === "apply" ? (openBlock(), createElementBlock(
+        Fragment,
+        {
+          key: 1
+        },
+        [createElementVNode(
+          "div",
+          _hoisted_11$2,
+          toDisplayString(_ctx.selectedName),
+          1
+          /* TEXT */
+        ), createElementVNode(
+          "div",
+          _hoisted_12$2,
+          toDisplayString(_ctx.t("ui.grid.individuation.switchapplycon")),
+          1
+          /* TEXT */
+        )],
+        64
+        /* STABLE_FRAGMENT */
+      )) : createCommentVNode("v-if", true), _ctx.status === "edit" ? (openBlock(), createBlock(_component_tiny_input, {
+        key: 2,
+        modelValue: _ctx.editName,
+        "onUpdate:modelValue": _cache[15] || (_cache[15] = function($event) {
+          return _ctx.editName = $event;
+        })
+      }, null, 8, ["modelValue"])) : createCommentVNode("v-if", true), _ctx.status === "del" ? (openBlock(), createElementBlock(
+        Fragment,
+        {
+          key: 3
+        },
+        [createElementVNode(
+          "div",
+          _hoisted_13$2,
+          toDisplayString(_ctx.selectedName),
+          1
+          /* TEXT */
+        ), createElementVNode(
+          "div",
+          _hoisted_14$2,
+          toDisplayString(_ctx.t("ui.grid.individuation.switchdelcon")),
+          1
+          /* TEXT */
+        )],
+        64
+        /* STABLE_FRAGMENT */
+      )) : createCommentVNode("v-if", true)];
+    }),
+    _: 1
+    /* STABLE */
+  }, 8, ["visible", "title"])]));
 }
-var CustomSwitch = /* @__PURE__ */ function() {
-  return __component__$3.exports;
-}();
-var __vue2_script$2 = defineComponent({
+var CustomSwitch = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["render", _sfc_render$3]]);
+var _sfc_main$2 = defineComponent({
   components: {
     TinyAlert: Alert,
     TinyTabs: Tabs,
@@ -1019,8 +1216,8 @@ var __vue2_script$2 = defineComponent({
     t,
     getColumnConfigs: function getColumnConfigs(configs) {
       var _getColNodes = function getColNodes(columns2) {
-        return columns2.map(function(_ref4) {
-          var id = _ref4.id, title = _ref4.title, property = _ref4.property, fixed = _ref4.fixed, visible = _ref4.visible, order = _ref4.order, sortable = _ref4.sortable, level = _ref4.level, children = _ref4.children;
+        return columns2.map(function(_ref2) {
+          var id = _ref2.id, title = _ref2.title, property = _ref2.property, fixed = _ref2.fixed, visible = _ref2.visible, order = _ref2.order, sortable = _ref2.sortable, level = _ref2.level, children = _ref2.children;
           if (property) {
             var column = {
               id,
@@ -1094,8 +1291,8 @@ var __vue2_script$2 = defineComponent({
         column.sortingIndex = index + 1;
       });
     },
-    renderNumberSorting: function renderNumberSorting(h2, _ref5) {
-      var row = _ref5.row;
+    renderNumberSorting: function renderNumberSorting(h2, _ref3) {
+      var row = _ref3.row;
       return h2("span", row.sortingIndex + "");
     },
     handleCustomMouseMove: function handleCustomMouseMove() {
@@ -1210,8 +1407,8 @@ var __vue2_script$2 = defineComponent({
     },
     buildSettings: function buildSettings() {
       var props = ["order", "fixed", "visible", "sortable"].concat(this.keys);
-      this.settings.columns = mapTree(this.columns, function(_ref6) {
-        var property = _ref6.property, rest = _objectWithoutPropertiesLoose2(_ref6, _excluded2);
+      this.settings.columns = mapTree(this.columns, function(_ref4) {
+        var property = _ref4.property, rest = _objectWithoutPropertiesLoose(_ref4, _excluded);
         var node = {
           property
         };
@@ -1272,7 +1469,7 @@ var __vue2_script$2 = defineComponent({
       if (typeof this.resetMethod === "function") {
         this.resetMethod().then(function(sourceSettings) {
           _this12.buildSettings();
-          var _ref7 = sourceSettings || {}, columns = _ref7.columns, sortType = _ref7.sortType, pageSize = _ref7.pageSize;
+          var _ref5 = sourceSettings || {}, columns = _ref5.columns, sortType = _ref5.sortType, pageSize = _ref5.pageSize;
           if (columns && columns.length && _this12.settings.columns && _this12.settings.columns.length) {
             _this12.settings.columns.forEach(function(setting) {
               var source = find(columns, function(item) {
@@ -1345,313 +1542,357 @@ var __vue2_script$2 = defineComponent({
     }
   }
 });
-var _excluded = ["row"];
-function _objectWithoutProperties(e, t2) {
-  if (null == e) return {};
-  var o, r, i = _objectWithoutPropertiesLoose(e, t2);
-  if (Object.getOwnPropertySymbols) {
-    var s = Object.getOwnPropertySymbols(e);
-    for (r = 0; r < s.length; r++) o = s[r], t2.includes(o) || {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]);
-  }
-  return i;
-}
-function _objectWithoutPropertiesLoose(r, e) {
-  if (null == r) return {};
-  var t2 = {};
-  for (var n in r) if ({}.hasOwnProperty.call(r, n)) {
-    if (e.includes(n)) continue;
-    t2[n] = r[n];
-  }
-  return t2;
-}
-var render$2 = function render$22() {
-  var _vm = this;
-  var _h = _vm.$createElement;
-  var _c = _vm._self._c || _h;
-  return _c("tiny-modal", {
-    attrs: {
-      "width": "600",
-      "title": _vm.t("ui.grid.individuation.title")
-    },
-    on: {
-      "input": _vm.handleInput,
-      "close": _vm.handleClose,
-      "custom-mousemove": _vm.handleCustomMouseMove
-    },
-    scopedSlots: _vm._u([{
-      key: "default",
-      fn: function fn() {
-        return [_vm.visible ? _c("div", {
-          staticClass: "tiny-grid-custom tiny-grid__wrapper"
-        }, [_c("tiny-tabs", {
-          staticClass: "tiny-grid-custom__tabs",
-          model: {
-            value: _vm.activeName,
-            callback: function callback($$v) {
-              _vm.activeName = $$v;
-            },
-            expression: "activeName"
-          }
-        }, [_c("div", {
-          staticClass: "tiny-grid-custom__tabs-body"
-        }, [_c("tiny-tab-item", {
-          staticClass: "tabs-body-item",
-          attrs: {
-            "title": _vm.t("ui.grid.individuation.tabs.base.title"),
-            "name": "base"
-          }
-        }, [_c("tiny-alert", {
-          staticClass: "tiny-grid-custom__alert",
-          attrs: {
-            "description": _vm.t("ui.grid.individuation.tabs.base.tips"),
-            "closable": false
-          }
-        }), _c("tiny-grid", {
-          staticClass: "tiny-grid-custom__setting",
-          attrs: {
-            "auto-resize": true,
-            "data": _vm.columns,
-            "row-class-name": _vm.rowClassName,
-            "row-key": "",
-            "drop-config": _vm.dropConfig,
-            "tree-config": {
-              children: "children"
-            },
-            "show-header": false,
-            "edit-config": {
-              trigger: "click",
-              mode: "cell",
-              showStatus: true
-            },
-            "max-height": _vm.historyConfig.tableMaxHeight
-          },
-          on: {
-            "row-drop-end": _vm.handleRowDropEnd
-          }
-        }, [_vm.initSettings.showIndex ? _c("tiny-grid-column", {
-          attrs: {
-            "type": "index",
-            "width": "60"
-          }
-        }) : _vm._e(), _c("tiny-grid-column", {
-          attrs: {
-            "field": "title",
-            "tree-node": ""
-          }
-        }), _c("tiny-grid-column", {
-          attrs: {
-            "field": "property",
-            "width": "120px",
-            "class-name": "setting-item"
-          },
-          scopedSlots: _vm._u([{
-            key: "default",
-            fn: function fn2(_ref) {
-              var row = _ref.row, data6 = _objectWithoutProperties(_ref, _excluded);
-              return [!row.children ? _c("div", {
-                staticClass: "setting-icon"
-              }, [_c("span", {
-                staticClass: "icon",
-                attrs: {
-                  "title": _vm.visibleTitle(row)
-                }
-              }, [_c(row.visible ? "icon-eyeopen" : "icon-eyeclose", {
-                tag: "component",
-                class: [{
-                  open: row.visible
-                }],
-                on: {
-                  "click": function click($event) {
-                    return _vm.handlerSetting("visible", row, data6);
-                  }
-                }
-              })], 1), _c("span", {
-                staticClass: "icon",
-                attrs: {
-                  "title": _vm.sortTitle(row)
-                }
-              }, [_c(row.order ? _vm.constants.icon[row.order] : "icon-minus", {
-                tag: "component",
-                class: {
-                  sort: row.order,
-                  "is-visible": !row.sortable
-                },
-                on: {
-                  "click": function click($event) {
-                    return _vm.handlerSetting("order", row);
-                  }
-                }
-              })], 1), _c("span", {
-                staticClass: "icon",
-                attrs: {
-                  "title": _vm.fixedTitle(row)
-                }
-              }, [row.level === 1 && _vm.showFixed ? _c(row.fixed ? _vm.constants.icon[row.fixed] : "icon-unlock", {
-                tag: "component",
-                class: {
-                  lock: row.fixed
+var _hoisted_1$1 = {
+  key: 0,
+  class: "tiny-grid-custom tiny-grid__wrapper"
+};
+var _hoisted_2$1 = {
+  class: "tiny-grid-custom__tabs-body"
+};
+var _hoisted_3$1 = {
+  key: 0,
+  class: "setting-icon"
+};
+var _hoisted_4$1 = ["title"];
+var _hoisted_5$1 = ["title"];
+var _hoisted_6$1 = ["title"];
+var _hoisted_7$1 = {
+  class: "tiny-grid-custom__setting other-setting"
+};
+var _hoisted_8$1 = {
+  class: "setting-item"
+};
+var _hoisted_9$1 = {
+  class: "label"
+};
+var _hoisted_10$1 = {
+  class: "selection"
+};
+var _hoisted_11$1 = {
+  class: "setting-item"
+};
+var _hoisted_12$1 = {
+  class: "label"
+};
+var _hoisted_13$1 = {
+  class: "selection"
+};
+var _hoisted_14$1 = ["dir"];
+function _sfc_render$2(_ctx, _cache, $props2, $setup, $data, $options) {
+  var _component_tiny_alert = resolveComponent("tiny-alert");
+  var _component_tiny_grid_column = resolveComponent("tiny-grid-column");
+  var _component_tiny_option = resolveComponent("tiny-option");
+  var _component_tiny_select = resolveComponent("tiny-select");
+  var _component_tiny_grid = resolveComponent("tiny-grid");
+  var _component_tiny_tab_item = resolveComponent("tiny-tab-item");
+  var _component_tiny_radio = resolveComponent("tiny-radio");
+  var _component_tiny_custom_switch = resolveComponent("tiny-custom-switch");
+  var _component_tiny_tabs = resolveComponent("tiny-tabs");
+  var _component_tiny_button = resolveComponent("tiny-button");
+  var _component_tiny_modal = resolveComponent("tiny-modal");
+  return openBlock(), createBlock(_component_tiny_modal, {
+    width: "600",
+    title: _ctx.t("ui.grid.individuation.title"),
+    modelValue: _ctx.visible,
+    "onUpdate:modelValue": _cache[5] || (_cache[5] = function($event) {
+      return _ctx.visible = $event;
+    }),
+    onInput: _ctx.handleInput,
+    onClose: _ctx.handleClose,
+    onCustomMousemove: _ctx.handleCustomMouseMove
+  }, {
+    default: withCtx(function() {
+      return [_ctx.visible ? (openBlock(), createElementBlock("div", _hoisted_1$1, [createVNode(_component_tiny_tabs, {
+        modelValue: _ctx.activeName,
+        "onUpdate:modelValue": _cache[3] || (_cache[3] = function($event) {
+          return _ctx.activeName = $event;
+        }),
+        class: "tiny-grid-custom__tabs"
+      }, {
+        default: withCtx(function() {
+          return [createElementVNode("div", _hoisted_2$1, [createVNode(_component_tiny_tab_item, {
+            class: "tabs-body-item",
+            title: _ctx.t("ui.grid.individuation.tabs.base.title"),
+            name: "base"
+          }, {
+            default: withCtx(function() {
+              return [createVNode(_component_tiny_alert, {
+                class: "tiny-grid-custom__alert",
+                description: _ctx.t("ui.grid.individuation.tabs.base.tips"),
+                closable: false
+              }, null, 8, ["description"]), createVNode(_component_tiny_grid, {
+                class: "tiny-grid-custom__setting",
+                "auto-resize": true,
+                data: _ctx.columns,
+                "row-class-name": _ctx.rowClassName,
+                "row-key": "",
+                "drop-config": _ctx.dropConfig,
+                "tree-config": {
+                  children: "children"
                 },
-                on: {
-                  "click": function click($event) {
-                    return _vm.handlerSetting("fixed", row);
-                  }
-                }
-              }) : _vm._e()], 1)]) : _vm._e()];
-            }
-          }], null, false, 2200875852)
-        }), _vm.numberSorting && !_vm.isGroup ? _c("tiny-grid-column", {
-          attrs: {
-            "width": "100px",
-            "editor": {},
-            "renderer": _vm.renderNumberSorting
-          },
-          scopedSlots: _vm._u([{
-            key: "edit",
-            fn: function fn2(_ref2) {
-              var row = _ref2.row;
-              return [_c("tiny-select", {
-                on: {
-                  "change": function change($event) {
-                    return _vm.handelNumberSorting($event, row);
-                  }
+                "show-header": false,
+                "edit-config": {
+                  trigger: "click",
+                  mode: "cell",
+                  showStatus: true
                 },
-                model: {
-                  value: row.sortingIndex,
-                  callback: function callback($$v) {
-                    _vm.$set(row, "sortingIndex", $$v);
-                  },
-                  expression: "row.sortingIndex"
-                }
-              }, _vm._l(_vm.sortingOptions, function(item) {
-                return _c("tiny-option", {
-                  key: item,
-                  attrs: {
-                    "label": item,
-                    "value": item
-                  }
-                });
-              }), 1)];
-            }
-          }], null, false, 4084401751)
-        }) : _vm._e()], 1)], 1), _vm.other ? _c("tiny-tab-item", {
-          staticClass: "tabs-body-item",
-          attrs: {
-            "title": _vm.t("ui.grid.individuation.tabs.other.title"),
-            "name": "other"
-          }
-        }, [_c("tiny-alert", {
-          staticClass: "tiny-grid-custom__alert",
-          attrs: {
-            "description": _vm.t("ui.grid.individuation.tabs.other.tips"),
-            "closable": false
-          }
-        }), _c("ul", {
-          staticClass: "tiny-grid-custom__setting other-setting"
-        }, [_c("li", {
-          staticClass: "setting-item"
-        }, [_c("span", {
-          staticClass: "label"
-        }, [_vm._v(_vm._s(_vm.t("ui.grid.individuation.tabs.other.sortType")))]), _c("span", {
-          staticClass: "selection"
-        }, [_c("tiny-radio", {
-          attrs: {
-            "label": "page"
-          },
-          model: {
-            value: _vm.settings.sortType,
-            callback: function callback($$v) {
-              _vm.$set(_vm.settings, "sortType", $$v);
-            },
-            expression: "settings.sortType"
-          }
-        }, [_vm._v(_vm._s(_vm.t("ui.grid.individuation.tabs.other.currPageSort")))]), _c("tiny-radio", {
-          attrs: {
-            "label": "all"
-          },
-          model: {
-            value: _vm.settings.sortType,
-            callback: function callback($$v) {
-              _vm.$set(_vm.settings, "sortType", $$v);
-            },
-            expression: "settings.sortType"
-          }
-        }, [_vm._v(_vm._s(_vm.t("ui.grid.individuation.tabs.other.allDataSort")))])], 1)]), _c("li", {
-          staticClass: "setting-item"
-        }, [_c("span", {
-          staticClass: "label"
-        }, [_vm._v(_vm._s(_vm.t("ui.grid.individuation.tabs.other.pageSize")))]), _c("span", {
-          staticClass: "selection"
-        }, _vm._l(_vm.initSettings.pageSizes, function(item, index) {
-          return _c("tiny-radio", {
-            key: index,
-            attrs: {
-              "label": item
-            },
-            model: {
-              value: _vm.settings.pageSize,
-              callback: function callback($$v) {
-                _vm.$set(_vm.settings, "pageSize", $$v);
-              },
-              expression: "settings.pageSize"
-            }
-          }, [_vm._v(_vm._s(item))]);
-        }), 1)])])], 1) : _vm._e(), _vm.multipleHistory && _vm.activeName === "base" ? _c("tiny-custom-switch", {
-          ref: "switch",
-          attrs: {
-            "history-config": _vm.historyConfig
-          }
-        }) : _vm._e()], 1)]), !_vm.multipleHistory || _vm.multipleHistory && _vm.activeName === "base" ? _c("div", {
-          staticClass: "tiny-grid-custom__footer",
-          attrs: {
-            "dir": _vm.TinyTheme === "saas" ? "rtl" : "ltr"
-          }
-        }, [_c("tiny-button", {
-          on: {
-            "click": _vm.handleReset
-          }
-        }, [_vm._v(" " + _vm._s(_vm.t("ui.grid.individuation.resetBtn")) + " ")]), _vm.showHideAll ? _c("tiny-button", {
-          on: {
-            "click": function click($event) {
-              return _vm.showOrHideAllColumns(!_vm.showAll);
-            }
-          }
-        }, [_vm._v(_vm._s(_vm.showAll ? _vm.t("ui.grid.individuation.hideAll") : _vm.t("ui.grid.individuation.showAll")))]) : _vm._e(), _c("tiny-button", {
-          on: {
-            "click": _vm.cancelSettings
-          }
-        }, [_vm._v(" " + _vm._s(_vm.t("ui.grid.individuation.cancelBtn")) + " ")]), _c("tiny-button", {
-          attrs: {
-            "type": "primary",
-            "disabled": _vm.saveDisabled
-          },
-          on: {
-            "click": _vm.saveSettings
-          }
-        }, [_vm._v(" " + _vm._s(_vm.t("ui.grid.individuation.saveBtn")) + " ")])], 1) : _vm._e()], 1) : _vm._e()];
-      },
-      proxy: true
-    }]),
-    model: {
-      value: _vm.visible,
-      callback: function callback($$v) {
-        _vm.visible = $$v;
-      },
-      expression: "visible"
-    }
-  });
-};
-var staticRenderFns$2 = [];
-var __cssModules$2 = {};
-var __component__$2 = /* @__PURE__ */ normalizeComponent(__vue2_script$2, render$2, staticRenderFns$2, false, __vue2_injectStyles$2);
-function __vue2_injectStyles$2(context) {
-  for (var o in __cssModules$2) {
-    this[o] = __cssModules$2[o];
-  }
+                "max-height": _ctx.historyConfig.tableMaxHeight,
+                onRowDropEnd: _ctx.handleRowDropEnd
+              }, {
+                default: withCtx(function() {
+                  return [_ctx.initSettings.showIndex ? (openBlock(), createBlock(_component_tiny_grid_column, {
+                    key: 0,
+                    type: "index",
+                    width: "60"
+                  })) : createCommentVNode("v-if", true), createVNode(_component_tiny_grid_column, {
+                    field: "title",
+                    "tree-node": ""
+                  }), createVNode(_component_tiny_grid_column, {
+                    field: "property",
+                    width: "120px",
+                    "class-name": "setting-item"
+                  }, {
+                    default: withCtx(function(_ref6) {
+                      var row = _ref6.row, data6 = _objectWithoutPropertiesLoose(_ref6, _excluded2);
+                      return [!row.children ? (openBlock(), createElementBlock("div", _hoisted_3$1, [createElementVNode("span", {
+                        class: "icon",
+                        title: _ctx.visibleTitle(row)
+                      }, [(openBlock(), createBlock(resolveDynamicComponent(row.visible ? "icon-eyeopen" : "icon-eyeclose"), {
+                        class: normalizeClass([{
+                          open: row.visible
+                        }]),
+                        onClick: function onClick($event) {
+                          return _ctx.handlerSetting("visible", row, data6);
+                        }
+                      }, null, 8, ["class", "onClick"]))], 8, _hoisted_4$1), createElementVNode("span", {
+                        class: "icon",
+                        title: _ctx.sortTitle(row)
+                      }, [(openBlock(), createBlock(resolveDynamicComponent(row.order ? _ctx.constants.icon[row.order] : "icon-minus"), {
+                        class: normalizeClass({
+                          sort: row.order,
+                          "is-visible": !row.sortable
+                        }),
+                        onClick: function onClick($event) {
+                          return _ctx.handlerSetting("order", row);
+                        }
+                      }, null, 8, ["class", "onClick"]))], 8, _hoisted_5$1), createElementVNode("span", {
+                        class: "icon",
+                        title: _ctx.fixedTitle(row)
+                      }, [row.level === 1 && _ctx.showFixed ? (openBlock(), createBlock(resolveDynamicComponent(row.fixed ? _ctx.constants.icon[row.fixed] : "icon-unlock"), {
+                        key: 0,
+                        class: normalizeClass({
+                          lock: row.fixed
+                        }),
+                        onClick: function onClick($event) {
+                          return _ctx.handlerSetting("fixed", row);
+                        }
+                      }, null, 8, ["class", "onClick"])) : createCommentVNode("v-if", true)], 8, _hoisted_6$1)])) : createCommentVNode("v-if", true)];
+                    }),
+                    _: 1
+                    /* STABLE */
+                  }), _ctx.numberSorting && !_ctx.isGroup ? (openBlock(), createBlock(_component_tiny_grid_column, {
+                    key: 1,
+                    width: "100px",
+                    editor: {},
+                    renderer: _ctx.renderNumberSorting
+                  }, {
+                    edit: withCtx(function(_ref7) {
+                      var row = _ref7.row;
+                      return [createVNode(_component_tiny_select, {
+                        modelValue: row.sortingIndex,
+                        "onUpdate:modelValue": function onUpdateModelValue($event) {
+                          return row.sortingIndex = $event;
+                        },
+                        onChange: function onChange($event) {
+                          return _ctx.handelNumberSorting($event, row);
+                        }
+                      }, {
+                        default: withCtx(function() {
+                          return [(openBlock(true), createElementBlock(
+                            Fragment,
+                            null,
+                            renderList(_ctx.sortingOptions, function(item) {
+                              return openBlock(), createBlock(_component_tiny_option, {
+                                key: item,
+                                label: item,
+                                value: item
+                              }, null, 8, ["label", "value"]);
+                            }),
+                            128
+                            /* KEYED_FRAGMENT */
+                          ))];
+                        }),
+                        _: 2
+                        /* DYNAMIC */
+                      }, 1032, ["modelValue", "onUpdate:modelValue", "onChange"])];
+                    }),
+                    _: 1
+                    /* STABLE */
+                  }, 8, ["renderer"])) : createCommentVNode("v-if", true)];
+                }),
+                _: 1
+                /* STABLE */
+              }, 8, ["data", "row-class-name", "drop-config", "max-height", "onRowDropEnd"])];
+            }),
+            _: 1
+            /* STABLE */
+          }, 8, ["title"]), _ctx.other ? (openBlock(), createBlock(_component_tiny_tab_item, {
+            key: 0,
+            class: "tabs-body-item",
+            title: _ctx.t("ui.grid.individuation.tabs.other.title"),
+            name: "other"
+          }, {
+            default: withCtx(function() {
+              return [createVNode(_component_tiny_alert, {
+                class: "tiny-grid-custom__alert",
+                description: _ctx.t("ui.grid.individuation.tabs.other.tips"),
+                closable: false
+              }, null, 8, ["description"]), createElementVNode("ul", _hoisted_7$1, [createElementVNode("li", _hoisted_8$1, [createElementVNode(
+                "span",
+                _hoisted_9$1,
+                toDisplayString(_ctx.t("ui.grid.individuation.tabs.other.sortType")),
+                1
+                /* TEXT */
+              ), createElementVNode("span", _hoisted_10$1, [createVNode(_component_tiny_radio, {
+                modelValue: _ctx.settings.sortType,
+                "onUpdate:modelValue": _cache[0] || (_cache[0] = function($event) {
+                  return _ctx.settings.sortType = $event;
+                }),
+                label: "page"
+              }, {
+                default: withCtx(function() {
+                  return [createTextVNode(
+                    toDisplayString(_ctx.t("ui.grid.individuation.tabs.other.currPageSort")),
+                    1
+                    /* TEXT */
+                  )];
+                }),
+                _: 1
+                /* STABLE */
+              }, 8, ["modelValue"]), createVNode(_component_tiny_radio, {
+                modelValue: _ctx.settings.sortType,
+                "onUpdate:modelValue": _cache[1] || (_cache[1] = function($event) {
+                  return _ctx.settings.sortType = $event;
+                }),
+                label: "all"
+              }, {
+                default: withCtx(function() {
+                  return [createTextVNode(
+                    toDisplayString(_ctx.t("ui.grid.individuation.tabs.other.allDataSort")),
+                    1
+                    /* TEXT */
+                  )];
+                }),
+                _: 1
+                /* STABLE */
+              }, 8, ["modelValue"])])]), createElementVNode("li", _hoisted_11$1, [createElementVNode(
+                "span",
+                _hoisted_12$1,
+                toDisplayString(_ctx.t("ui.grid.individuation.tabs.other.pageSize")),
+                1
+                /* TEXT */
+              ), createElementVNode("span", _hoisted_13$1, [(openBlock(true), createElementBlock(
+                Fragment,
+                null,
+                renderList(_ctx.initSettings.pageSizes, function(item, index) {
+                  return openBlock(), createBlock(_component_tiny_radio, {
+                    key: index,
+                    modelValue: _ctx.settings.pageSize,
+                    "onUpdate:modelValue": _cache[2] || (_cache[2] = function($event) {
+                      return _ctx.settings.pageSize = $event;
+                    }),
+                    label: item
+                  }, {
+                    default: withCtx(function() {
+                      return [createTextVNode(
+                        toDisplayString(item),
+                        1
+                        /* TEXT */
+                      )];
+                    }),
+                    _: 2
+                    /* DYNAMIC */
+                  }, 1032, ["modelValue", "label"]);
+                }),
+                128
+                /* KEYED_FRAGMENT */
+              ))])])])];
+            }),
+            _: 1
+            /* STABLE */
+          }, 8, ["title"])) : createCommentVNode("v-if", true), _ctx.multipleHistory && _ctx.activeName === "base" ? (openBlock(), createBlock(_component_tiny_custom_switch, {
+            key: 1,
+            ref: "switch",
+            "history-config": _ctx.historyConfig
+          }, null, 8, ["history-config"])) : createCommentVNode("v-if", true)])];
+        }),
+        _: 1
+        /* STABLE */
+      }, 8, ["modelValue"]), !_ctx.multipleHistory || _ctx.multipleHistory && _ctx.activeName === "base" ? (openBlock(), createElementBlock("div", {
+        key: 0,
+        class: "tiny-grid-custom__footer",
+        dir: _ctx.TinyTheme === "saas" ? "rtl" : "ltr"
+      }, [createVNode(_component_tiny_button, {
+        onClick: _ctx.handleReset
+      }, {
+        default: withCtx(function() {
+          return [createTextVNode(
+            toDisplayString(_ctx.t("ui.grid.individuation.resetBtn")),
+            1
+            /* TEXT */
+          )];
+        }),
+        _: 1
+        /* STABLE */
+      }, 8, ["onClick"]), _ctx.showHideAll ? (openBlock(), createBlock(_component_tiny_button, {
+        key: 0,
+        onClick: _cache[4] || (_cache[4] = function($event) {
+          return _ctx.showOrHideAllColumns(!_ctx.showAll);
+        })
+      }, {
+        default: withCtx(function() {
+          return [createTextVNode(
+            toDisplayString(_ctx.showAll ? _ctx.t("ui.grid.individuation.hideAll") : _ctx.t("ui.grid.individuation.showAll")),
+            1
+            /* TEXT */
+          )];
+        }),
+        _: 1
+        /* STABLE */
+      })) : createCommentVNode("v-if", true), createVNode(_component_tiny_button, {
+        onClick: _ctx.cancelSettings
+      }, {
+        default: withCtx(function() {
+          return [createTextVNode(
+            toDisplayString(_ctx.t("ui.grid.individuation.cancelBtn")),
+            1
+            /* TEXT */
+          )];
+        }),
+        _: 1
+        /* STABLE */
+      }, 8, ["onClick"]), createVNode(_component_tiny_button, {
+        type: "primary",
+        onClick: _ctx.saveSettings,
+        disabled: _ctx.saveDisabled
+      }, {
+        default: withCtx(function() {
+          return [createTextVNode(
+            toDisplayString(_ctx.t("ui.grid.individuation.saveBtn")),
+            1
+            /* TEXT */
+          )];
+        }),
+        _: 1
+        /* STABLE */
+      }, 8, ["onClick", "disabled"])], 8, _hoisted_14$1)) : createCommentVNode("v-if", true)])) : createCommentVNode("v-if", true)];
+    }),
+    _: 1
+    /* STABLE */
+  }, 8, ["title", "modelValue", "onInput", "onClose", "onCustomMousemove"]);
 }
-var GridCustom = /* @__PURE__ */ function() {
-  return __component__$2.exports;
-}();
-var __vue2_script$1 = {
+var GridCustom = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["render", _sfc_render$2]]);
+var _sfc_main$1 = {
   name: "TinyGridCustomSelect",
   components: {
     TinySelect: Select,
@@ -1738,56 +1979,45 @@ var __vue2_script$1 = {
     }
   }
 };
-var render$1 = function render$12() {
-  var _vm = this;
-  var _h = _vm.$createElement;
-  var _c = _vm._self._c || _h;
-  return _c("tiny-select", {
-    attrs: {
-      "placeholder": "请选择",
-      "placement": "bottom-end",
-      "searchable": true,
-      "multiple": ""
-    },
-    on: {
-      "change": _vm.columnChange
-    },
-    scopedSlots: _vm._u([{
-      key: "reference",
-      fn: function fn() {
-        return [_c("tiny-icon-setting")];
-      },
-      proxy: true
-    }]),
-    model: {
-      value: _vm.multivalue,
-      callback: function callback($$v) {
-        _vm.multivalue = $$v;
-      },
-      expression: "multivalue"
-    }
-  }, _vm._l(_vm.columns, function(item) {
-    return _c("tiny-option", {
-      key: item.property,
-      attrs: {
-        "disabled": item.disabled,
-        "label": item.title,
-        "value": item.property
-      }
-    });
-  }), 1);
-};
-var staticRenderFns$1 = [];
-var __cssModules$1 = {};
-var __component__$1 = /* @__PURE__ */ normalizeComponent(__vue2_script$1, render$1, staticRenderFns$1, false, __vue2_injectStyles$1);
-function __vue2_injectStyles$1(context) {
-  for (var o in __cssModules$1) {
-    this[o] = __cssModules$1[o];
-  }
+function _sfc_render$1(_ctx, _cache, $props2, $setup, $data, $options) {
+  var _component_tiny_icon_setting = resolveComponent("tiny-icon-setting");
+  var _component_tiny_option = resolveComponent("tiny-option");
+  var _component_tiny_select = resolveComponent("tiny-select");
+  return openBlock(), createBlock(_component_tiny_select, {
+    modelValue: $data.multivalue,
+    "onUpdate:modelValue": _cache[0] || (_cache[0] = function($event) {
+      return $data.multivalue = $event;
+    }),
+    onChange: $options.columnChange,
+    placeholder: "请选择",
+    placement: "bottom-end",
+    searchable: true,
+    multiple: ""
+  }, {
+    reference: withCtx(function() {
+      return [createVNode(_component_tiny_icon_setting)];
+    }),
+    default: withCtx(function() {
+      return [(openBlock(true), createElementBlock(
+        Fragment,
+        null,
+        renderList($data.columns, function(item) {
+          return openBlock(), createBlock(_component_tiny_option, {
+            key: item.property,
+            disabled: item.disabled,
+            label: item.title,
+            value: item.property
+          }, null, 8, ["disabled", "label", "value"]);
+        }),
+        128
+        /* KEYED_FRAGMENT */
+      ))];
+    }),
+    _: 1
+    /* STABLE */
+  }, 8, ["modelValue", "onChange"]);
 }
-var GridCustomSelect = /* @__PURE__ */ function() {
-  return __component__$1.exports;
-}();
+var GridCustomSelect = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["render", _sfc_render$1]]);
 var position = ["left", "right"];
 var TitleRender = {
   props: ["column"],
@@ -1803,7 +2033,7 @@ var TitleRender = {
     }) : title]);
   }
 };
-var __vue2_script = defineComponent({
+var _sfc_main = /* @__PURE__ */ defineComponent({
   components: {
     TinyModal: Modal,
     TinyButton: Button,
@@ -2474,7 +2704,7 @@ var __vue2_script = defineComponent({
       var props = ["order", "fixed", "visible", "sortable"].concat(this.keys);
       !this.updatedSorting && !this.columnsGroup.length && (this.columns = [].concat(this.groupedColumns[0].data));
       this.settings.columns = mapTree(this.columns, function(_ref10) {
-        var property = _ref10.property, rest = _objectWithoutPropertiesLoose2(_ref10, _excluded3);
+        var property = _ref10.property, rest = _objectWithoutPropertiesLoose(_ref10, _excluded3);
         var node = {
           property
         };
@@ -2691,566 +2921,871 @@ var __vue2_script = defineComponent({
     }
   }
 });
-var render2 = function render3() {
-  var _vm = this;
-  var _h = _vm.$createElement;
-  var _c = _vm._self._c || _h;
-  return _c("tiny-modal", {
-    staticClass: "tiny-grid-toolbar-modal",
-    attrs: {
-      "width": "800",
-      "title": " "
-    },
-    on: {
-      "input": _vm.handleInput,
-      "close": _vm.handleClose
-    },
-    scopedSlots: _vm._u([{
-      key: "default",
-      fn: function fn() {
-        return [_vm.visible ? _c("div", {
-          staticClass: "tiny-grid-custom"
-        }, [_c("div", {
-          staticClass: "tiny-grid-custom__tabs"
-        }, [_c("div", {
-          staticClass: "tiny-grid-custom__tabs-head"
-        }, [_c("ul", [_c("li", {
-          class: {
-            "tiny-grid-custom__tabs-selected": _vm.activeName === "base" && _vm.other,
-            "tiny-grid-custom__tabs-base": !_vm.other
-          },
-          on: {
-            "click": function click($event) {
-              _vm.activeName = "base";
-            }
-          }
-        }, [_c("span", [_vm._v(_vm._s(_vm.t("ui.grid.individuation.columnSet")))])]), _vm.other ? _c("li", {
-          class: {
-            "tiny-grid-custom__tabs-selected": _vm.activeName === "other"
-          },
-          on: {
-            "click": function click($event) {
-              _vm.activeName = "other";
-            }
-          }
-        }, [_c("span", [_vm._v(_vm._s(_vm.t("ui.grid.individuation.tabs.other.title")))])]) : _vm._e()])]), _c("div", {
-          staticClass: "tiny-grid-custom__tabs-body"
-        }, [_c("div", {
-          directives: [{
-            name: "show",
-            rawName: "v-show",
-            value: _vm.activeName === "base",
-            expression: "activeName === 'base'"
-          }],
-          class: ["tabs-body-item", _vm.animateShow === "base" ? "active-item" : ""]
-        }, [_c("tiny-split", {
-          attrs: {
-            "trigger-simple": "",
-            "collapse-left-top": ""
-          },
-          scopedSlots: _vm._u([{
-            key: "left",
-            fn: function fn2() {
-              return [_c("div", {
-                staticClass: "left-panel"
-              }, [_vm.multipleHistory ? _c("div", {
-                staticClass: "select-template"
-              }, [_c("tiny-select", {
-                attrs: {
-                  "shape": "filter",
-                  "label": _vm.t("ui.grid.individuation.selectTemplate"),
-                  "clearable": ""
-                },
-                on: {
-                  "change": _vm.selectedTemplateChange
-                },
-                model: {
-                  value: _vm.selectedTemplate,
-                  callback: function callback($$v) {
-                    _vm.selectedTemplate = $$v;
-                  },
-                  expression: "selectedTemplate"
-                }
-              }, _vm._l(_vm.templateOptions, function(item) {
-                return _c("tiny-option", {
-                  key: item.id,
-                  attrs: {
-                    "label": item.name,
-                    "value": item.id
-                  }
-                }, [_c("span", {
-                  staticStyle: {
-                    "float": "left",
-                    "width": "240px",
-                    "overflow": "hidden",
-                    "text-overflow": "ellipsis",
-                    "white-space": "nowrap"
-                  },
-                  attrs: {
-                    "title": item.name
-                  }
-                }, [_vm._v(_vm._s(item.name))]), _vm.historyConfig.showDel ? _c("span", {
-                  staticStyle: {
-                    "float": "right",
-                    "padding": "0 6px",
-                    "color": "#1890ff",
-                    "cursor": "pointer"
-                  },
-                  on: {
-                    "click": function click($event) {
-                      return _vm.deleteTemplate(item, $event);
-                    }
-                  }
-                }, [_vm._v(_vm._s(_vm.t("ui.grid.individuation.switchdel")))]) : _vm._e()]);
-              }), 1)], 1) : _vm._e(), _vm.search ? _c("tiny-search", {
-                attrs: {
-                  "placeholder": _vm.t("ui.grid.individuation.toolbar.search")
-                },
-                on: {
-                  "input": _vm.searchChange
-                },
-                model: {
-                  value: _vm.searchValue,
-                  callback: function callback($$v) {
-                    _vm.searchValue = $$v;
-                  },
-                  expression: "searchValue"
-                }
-              }) : _vm._e(), _vm.isGroup ? _c("div", [!_vm.searchValue ? _c("div", {
-                staticClass: "multi-check-all-btn"
-              }, [_c("tiny-checkbox", {
-                attrs: {
-                  "indeterminate": _vm.isMultiIndeterminate
-                },
-                on: {
-                  "change": _vm.checkAllChange
-                },
-                model: {
-                  value: _vm.multiCheckAll,
-                  callback: function callback($$v) {
-                    _vm.multiCheckAll = $$v;
-                  },
-                  expression: "multiCheckAll"
-                }
-              }, [_vm._v(" " + _vm._s(_vm.t("ui.grid.individuation.toolbar.all")) + " ")])], 1) : _vm._e(), _c("tiny-tree", {
-                ref: "tree",
-                attrs: {
-                  "data": _vm.columns,
-                  "default-expand-all": "",
-                  "check-on-click-node": "",
-                  "show-checkbox": "",
-                  "node-key": "id",
-                  "default-checked-keys": _vm.defaultcheckedkeys,
-                  "filter-node-method": _vm.filterTreeNode,
-                  "props": {
-                    label: "title"
-                  }
-                },
-                on: {
-                  "check": _vm.checkNode
-                },
-                scopedSlots: _vm._u([{
-                  key: "default",
-                  fn: function fn3(sourceData) {
-                    return [_c("div", {
-                      staticClass: "tiny-tree-node__label"
-                    }, [_c("title-render", {
-                      attrs: {
-                        "column": sourceData.data
-                      }
-                    })], 1)];
-                  }
-                }], null, false, 3003057265)
-              })], 1) : _c("div", [_vm.searchValue ? _c("div", [_c("tiny-checkbox-group", {
-                attrs: {
-                  "vertical": ""
-                },
-                model: {
-                  value: _vm.checkedColumns,
-                  callback: function callback($$v) {
-                    _vm.checkedColumns = $$v;
-                  },
-                  expression: "checkedColumns"
-                }
-              }, _vm._l(_vm.searchColumns, function(column) {
-                return _c("tiny-checkbox", {
-                  key: column.property,
-                  attrs: {
-                    "label": column.property,
-                    "disabled": column.alwaysShow
-                  }
-                }, [_c("title-render", {
-                  attrs: {
-                    "column": column
-                  }
-                })], 1);
-              }), 1)], 1) : _c("div", [_c("div", {
-                staticClass: "check-all-btn"
-              }, [_c("tiny-checkbox", {
-                attrs: {
-                  "indeterminate": _vm.isIndeterminate
-                },
-                model: {
-                  value: _vm.checkAll,
-                  callback: function callback($$v) {
-                    _vm.checkAll = $$v;
-                  },
-                  expression: "checkAll"
-                }
-              }, [_vm._v(" " + _vm._s(_vm.t("ui.grid.individuation.toolbar.all")) + " ")])], 1), _c("tiny-checkbox-group", {
-                attrs: {
-                  "vertical": ""
-                },
-                model: {
-                  value: _vm.checkedColumns,
-                  callback: function callback($$v) {
-                    _vm.checkedColumns = $$v;
-                  },
-                  expression: "checkedColumns"
-                }
-              }, [_vm._l(_vm.groupedColumns, function(group, index) {
-                return [_vm.defer(Math.floor(index / 5)) ? _c("div", {
-                  key: index
-                }, [group.label ? _c("p", {
-                  staticClass: "group-label",
-                  class: [index === 0 && "group-label-first"]
-                }, [_vm._v(" " + _vm._s(group.label) + " ")]) : _vm._e(), _vm._l(group.data, function(column) {
-                  return _c("tiny-checkbox", {
-                    key: column.property,
-                    attrs: {
-                      "label": column.property,
-                      "disabled": column.alwaysShow
-                    }
-                  }, [_c("title-render", {
-                    attrs: {
-                      "column": column
-                    }
-                  })], 1);
-                })], 2) : _vm._e()];
-              })], 2)], 1)])], 1)];
-            },
-            proxy: true
-          }, {
-            key: "right",
-            fn: function fn2() {
-              return [_c("div", {
-                staticClass: "right-panel"
-              }, [_c("div", {
-                staticClass: "header"
-              }, [_c("p", [_vm._v(" " + _vm._s(_vm.t("ui.grid.individuation.toolbar.selected")) + " (" + _vm._s(_vm.visibleColumns.length) + "/" + _vm._s(_vm.columns.length) + ") ")]), !_vm.setting.hideFixedColumn ? _c("span", [_vm._v(_vm._s(_vm.t("ui.grid.individuation.toolbar.freeze")))]) : _vm._e(), !_vm.setting.hideSortColumn ? _c("span", [_vm._v(_vm._s(_vm.t("ui.grid.individuation.toolbar.sort")))]) : _vm._e(), !_vm.isGroup ? _c("span", {
-                staticClass: "clear-all",
-                on: {
-                  "click": _vm.handelClearAll
-                }
-              }, [_vm._v(_vm._s(_vm.t("ui.grid.individuation.toolbar.clear")))]) : _vm._e()]), _c("ul", {
-                ref: "list",
-                staticClass: "column-list-panel"
-              }, _vm._l(_vm.visibleColumns, function(column, index) {
-                return _c("li", {
-                  key: column.property + index,
-                  class: [column.fixed, _vm.getRowClassName(column), "column-list-item", !column.expand && "item-collapse"],
-                  attrs: {
+var _hoisted_1 = {
+  key: 0,
+  class: "tiny-grid-custom"
+};
+var _hoisted_2 = {
+  class: "tiny-grid-custom__tabs"
+};
+var _hoisted_3 = {
+  class: "tiny-grid-custom__tabs-head"
+};
+var _hoisted_4 = {
+  class: "tiny-grid-custom__tabs-body"
+};
+var _hoisted_5 = {
+  class: "left-panel"
+};
+var _hoisted_6 = {
+  key: 0,
+  class: "select-template"
+};
+var _hoisted_7 = ["title"];
+var _hoisted_8 = ["onClick"];
+var _hoisted_9 = {
+  key: 2
+};
+var _hoisted_10 = {
+  key: 0,
+  class: "multi-check-all-btn"
+};
+var _hoisted_11 = {
+  class: "tiny-tree-node__label"
+};
+var _hoisted_12 = {
+  key: 3
+};
+var _hoisted_13 = {
+  key: 0
+};
+var _hoisted_14 = {
+  key: 1
+};
+var _hoisted_15 = {
+  class: "check-all-btn"
+};
+var _hoisted_16 = {
+  class: "right-panel"
+};
+var _hoisted_17 = {
+  class: "header"
+};
+var _hoisted_18 = {
+  key: 0
+};
+var _hoisted_19 = {
+  key: 1
+};
+var _hoisted_20 = {
+  ref: "list",
+  class: "column-list-panel"
+};
+var _hoisted_21 = ["data-row"];
+var _hoisted_22 = {
+  key: 0,
+  class: "drag-icon toolbar-drag-item"
+};
+var _hoisted_23 = /* @__PURE__ */ createElementVNode(
+  "span",
+  null,
+  null,
+  -1
+  /* HOISTED */
+);
+var _hoisted_24 = /* @__PURE__ */ createElementVNode(
+  "span",
+  null,
+  null,
+  -1
+  /* HOISTED */
+);
+var _hoisted_25 = /* @__PURE__ */ createElementVNode(
+  "span",
+  null,
+  null,
+  -1
+  /* HOISTED */
+);
+var _hoisted_26 = /* @__PURE__ */ createElementVNode(
+  "span",
+  null,
+  null,
+  -1
+  /* HOISTED */
+);
+var _hoisted_27 = /* @__PURE__ */ createElementVNode(
+  "span",
+  null,
+  null,
+  -1
+  /* HOISTED */
+);
+var _hoisted_28 = /* @__PURE__ */ createElementVNode(
+  "span",
+  null,
+  null,
+  -1
+  /* HOISTED */
+);
+var _hoisted_29 = [_hoisted_23, _hoisted_24, _hoisted_25, _hoisted_26, _hoisted_27, _hoisted_28];
+var _hoisted_30 = {
+  key: 2,
+  class: "sort-number"
+};
+var _hoisted_31 = {
+  key: 0,
+  class: "sort-number-editor"
+};
+var _hoisted_32 = ["onClick"];
+var _hoisted_33 = {
+  key: 3,
+  class: "dropdown-column"
+};
+var _hoisted_34 = {
+  key: 2,
+  class: "set-btn"
+};
+var _hoisted_35 = ["onClick"];
+var _hoisted_36 = {
+  key: 1
+};
+var _hoisted_37 = ["data-row"];
+var _hoisted_38 = {
+  class: "column-container"
+};
+var _hoisted_39 = {
+  class: "other-setting"
+};
+var _hoisted_40 = {
+  class: "label"
+};
+var _hoisted_41 = ["dir"];
+function _sfc_render(_ctx, _cache, $props2, $setup, $data, $options) {
+  var _component_tiny_option = resolveComponent("tiny-option");
+  var _component_tiny_select = resolveComponent("tiny-select");
+  var _component_tiny_search = resolveComponent("tiny-search");
+  var _component_tiny_checkbox = resolveComponent("tiny-checkbox");
+  var _component_title_render = resolveComponent("title-render");
+  var _component_tiny_tree = resolveComponent("tiny-tree");
+  var _component_tiny_checkbox_group = resolveComponent("tiny-checkbox-group");
+  var _component_icon_chevron_right = resolveComponent("icon-chevron-right");
+  var _component_icon_left_frozen = resolveComponent("icon-left-frozen");
+  var _component_icon_right_frozen = resolveComponent("icon-right-frozen");
+  var _component_tiny_dropdown_item = resolveComponent("tiny-dropdown-item");
+  var _component_tiny_dropdown_menu = resolveComponent("tiny-dropdown-menu");
+  var _component_tiny_dropdown = resolveComponent("tiny-dropdown");
+  var _component_icon_ascending = resolveComponent("icon-ascending");
+  var _component_icon_descending = resolveComponent("icon-descending");
+  var _component_icon_close = resolveComponent("icon-close");
+  var _component_tiny_split = resolveComponent("tiny-split");
+  var _component_tiny_radio = resolveComponent("tiny-radio");
+  var _component_tiny_radio_group = resolveComponent("tiny-radio-group");
+  var _component_tiny_button = resolveComponent("tiny-button");
+  var _component_tiny_custom_switch = resolveComponent("tiny-custom-switch");
+  var _component_tiny_tooltip = resolveComponent("tiny-tooltip");
+  var _component_tiny_modal = resolveComponent("tiny-modal");
+  var _directive_clickoutside = resolveDirective("clickoutside");
+  return openBlock(), createBlock(_component_tiny_modal, {
+    width: "800",
+    title: " ",
+    class: "tiny-grid-toolbar-modal",
+    modelValue: _ctx.visible,
+    "onUpdate:modelValue": _cache[16] || (_cache[16] = function($event) {
+      return _ctx.visible = $event;
+    }),
+    onInput: _ctx.handleInput,
+    onClose: _ctx.handleClose
+  }, {
+    default: withCtx(function() {
+      return [_ctx.visible ? (openBlock(), createElementBlock("div", _hoisted_1, [createElementVNode("div", _hoisted_2, [createElementVNode("div", _hoisted_3, [createElementVNode("ul", null, [createElementVNode(
+        "li",
+        {
+          onClick: _cache[0] || (_cache[0] = function($event) {
+            return _ctx.activeName = "base";
+          }),
+          class: normalizeClass({
+            "tiny-grid-custom__tabs-selected": _ctx.activeName === "base" && _ctx.other,
+            "tiny-grid-custom__tabs-base": !_ctx.other
+          })
+        },
+        [createElementVNode(
+          "span",
+          null,
+          toDisplayString(_ctx.t("ui.grid.individuation.columnSet")),
+          1
+          /* TEXT */
+        )],
+        2
+        /* CLASS */
+      ), _ctx.other ? (openBlock(), createElementBlock(
+        "li",
+        {
+          key: 0,
+          onClick: _cache[1] || (_cache[1] = function($event) {
+            return _ctx.activeName = "other";
+          }),
+          class: normalizeClass({
+            "tiny-grid-custom__tabs-selected": _ctx.activeName === "other"
+          })
+        },
+        [createElementVNode(
+          "span",
+          null,
+          toDisplayString(_ctx.t("ui.grid.individuation.tabs.other.title")),
+          1
+          /* TEXT */
+        )],
+        2
+        /* CLASS */
+      )) : createCommentVNode("v-if", true)])]), createElementVNode("div", _hoisted_4, [withDirectives(createElementVNode(
+        "div",
+        {
+          class: normalizeClass(["tabs-body-item", _ctx.animateShow === "base" ? "active-item" : ""])
+        },
+        [createVNode(_component_tiny_split, {
+          modelValue: _ctx.splitVal,
+          "onUpdate:modelValue": _cache[13] || (_cache[13] = function($event) {
+            return _ctx.splitVal = $event;
+          }),
+          "trigger-simple": "",
+          "collapse-left-top": ""
+        }, {
+          left: withCtx(function() {
+            return [createElementVNode("div", _hoisted_5, [_ctx.multipleHistory ? (openBlock(), createElementBlock("div", _hoisted_6, [createVNode(_component_tiny_select, {
+              modelValue: _ctx.selectedTemplate,
+              "onUpdate:modelValue": _cache[2] || (_cache[2] = function($event) {
+                return _ctx.selectedTemplate = $event;
+              }),
+              shape: "filter",
+              label: _ctx.t("ui.grid.individuation.selectTemplate"),
+              onChange: _ctx.selectedTemplateChange,
+              clearable: ""
+            }, {
+              default: withCtx(function() {
+                return [(openBlock(true), createElementBlock(
+                  Fragment,
+                  null,
+                  renderList(_ctx.templateOptions, function(item) {
+                    return openBlock(), createBlock(_component_tiny_option, {
+                      key: item.id,
+                      label: item.name,
+                      value: item.id
+                    }, {
+                      default: withCtx(function() {
+                        return [createElementVNode("span", {
+                          style: {
+                            "float": "left",
+                            "width": "240px",
+                            "overflow": "hidden",
+                            "text-overflow": "ellipsis",
+                            "white-space": "nowrap"
+                          },
+                          title: item.name
+                        }, toDisplayString(item.name), 9, _hoisted_7), _ctx.historyConfig.showDel ? (openBlock(), createElementBlock("span", {
+                          key: 0,
+                          style: {
+                            "float": "right",
+                            "padding": "0 6px",
+                            "color": "#1890ff",
+                            "cursor": "pointer"
+                          },
+                          onClick: function onClick($event) {
+                            return _ctx.deleteTemplate(item, $event);
+                          }
+                        }, toDisplayString(_ctx.t("ui.grid.individuation.switchdel")), 9, _hoisted_8)) : createCommentVNode("v-if", true)];
+                      }),
+                      _: 2
+                      /* DYNAMIC */
+                    }, 1032, ["label", "value"]);
+                  }),
+                  128
+                  /* KEYED_FRAGMENT */
+                ))];
+              }),
+              _: 1
+              /* STABLE */
+            }, 8, ["modelValue", "label", "onChange"])])) : createCommentVNode("v-if", true), _ctx.search ? (openBlock(), createBlock(_component_tiny_search, {
+              key: 1,
+              modelValue: _ctx.searchValue,
+              "onUpdate:modelValue": _cache[3] || (_cache[3] = function($event) {
+                return _ctx.searchValue = $event;
+              }),
+              onInput: _ctx.searchChange,
+              placeholder: _ctx.t("ui.grid.individuation.toolbar.search")
+            }, null, 8, ["modelValue", "onInput", "placeholder"])) : createCommentVNode("v-if", true), _ctx.isGroup ? (openBlock(), createElementBlock("div", _hoisted_9, [!_ctx.searchValue ? (openBlock(), createElementBlock("div", _hoisted_10, [createVNode(_component_tiny_checkbox, {
+              indeterminate: _ctx.isMultiIndeterminate,
+              modelValue: _ctx.multiCheckAll,
+              "onUpdate:modelValue": _cache[4] || (_cache[4] = function($event) {
+                return _ctx.multiCheckAll = $event;
+              }),
+              onChange: _ctx.checkAllChange
+            }, {
+              default: withCtx(function() {
+                return [createTextVNode(
+                  toDisplayString(_ctx.t("ui.grid.individuation.toolbar.all")),
+                  1
+                  /* TEXT */
+                )];
+              }),
+              _: 1
+              /* STABLE */
+            }, 8, ["indeterminate", "modelValue", "onChange"])])) : createCommentVNode("v-if", true), createVNode(_component_tiny_tree, {
+              ref: "tree",
+              data: _ctx.columns,
+              "default-expand-all": "",
+              "check-on-click-node": "",
+              "show-checkbox": "",
+              "node-key": "id",
+              "default-checked-keys": _ctx.defaultcheckedkeys,
+              onCheck: _ctx.checkNode,
+              "filter-node-method": _ctx.filterTreeNode,
+              props: {
+                label: "title"
+              }
+            }, {
+              default: withCtx(function(sourceData) {
+                return [createElementVNode("div", _hoisted_11, [createVNode(_component_title_render, {
+                  column: sourceData.data
+                }, null, 8, ["column"])])];
+              }),
+              _: 1
+              /* STABLE */
+            }, 8, ["data", "default-checked-keys", "onCheck", "filter-node-method"])])) : (openBlock(), createElementBlock("div", _hoisted_12, [_ctx.searchValue ? (openBlock(), createElementBlock("div", _hoisted_13, [createVNode(_component_tiny_checkbox_group, {
+              modelValue: _ctx.checkedColumns,
+              "onUpdate:modelValue": _cache[5] || (_cache[5] = function($event) {
+                return _ctx.checkedColumns = $event;
+              }),
+              vertical: ""
+            }, {
+              default: withCtx(function() {
+                return [(openBlock(true), createElementBlock(
+                  Fragment,
+                  null,
+                  renderList(_ctx.searchColumns, function(column) {
+                    return openBlock(), createBlock(_component_tiny_checkbox, {
+                      label: column.property,
+                      disabled: column.alwaysShow,
+                      key: column.property
+                    }, {
+                      default: withCtx(function() {
+                        return [createVNode(_component_title_render, {
+                          column
+                        }, null, 8, ["column"])];
+                      }),
+                      _: 2
+                      /* DYNAMIC */
+                    }, 1032, ["label", "disabled"]);
+                  }),
+                  128
+                  /* KEYED_FRAGMENT */
+                ))];
+              }),
+              _: 1
+              /* STABLE */
+            }, 8, ["modelValue"])])) : (openBlock(), createElementBlock("div", _hoisted_14, [createElementVNode("div", _hoisted_15, [createVNode(_component_tiny_checkbox, {
+              indeterminate: _ctx.isIndeterminate,
+              modelValue: _ctx.checkAll,
+              "onUpdate:modelValue": _cache[6] || (_cache[6] = function($event) {
+                return _ctx.checkAll = $event;
+              })
+            }, {
+              default: withCtx(function() {
+                return [createTextVNode(
+                  toDisplayString(_ctx.t("ui.grid.individuation.toolbar.all")),
+                  1
+                  /* TEXT */
+                )];
+              }),
+              _: 1
+              /* STABLE */
+            }, 8, ["indeterminate", "modelValue"])]), createVNode(_component_tiny_checkbox_group, {
+              modelValue: _ctx.checkedColumns,
+              "onUpdate:modelValue": _cache[7] || (_cache[7] = function($event) {
+                return _ctx.checkedColumns = $event;
+              }),
+              vertical: ""
+            }, {
+              default: withCtx(function() {
+                return [(openBlock(true), createElementBlock(
+                  Fragment,
+                  null,
+                  renderList(_ctx.groupedColumns, function(group, index) {
+                    return openBlock(), createElementBlock(
+                      Fragment,
+                      null,
+                      [_ctx.defer(Math.floor(index / 5)) ? (openBlock(), createElementBlock("div", {
+                        key: index
+                      }, [group.label ? (openBlock(), createElementBlock(
+                        "p",
+                        {
+                          key: 0,
+                          class: normalizeClass(["group-label", [index === 0 && "group-label-first"]])
+                        },
+                        toDisplayString(group.label),
+                        3
+                        /* TEXT, CLASS */
+                      )) : createCommentVNode("v-if", true), (openBlock(true), createElementBlock(
+                        Fragment,
+                        null,
+                        renderList(group.data, function(column) {
+                          return openBlock(), createBlock(_component_tiny_checkbox, {
+                            label: column.property,
+                            disabled: column.alwaysShow,
+                            key: column.property
+                          }, {
+                            default: withCtx(function() {
+                              return [createVNode(_component_title_render, {
+                                column
+                              }, null, 8, ["column"])];
+                            }),
+                            _: 2
+                            /* DYNAMIC */
+                          }, 1032, ["label", "disabled"]);
+                        }),
+                        128
+                        /* KEYED_FRAGMENT */
+                      ))])) : createCommentVNode("v-if", true)],
+                      64
+                      /* STABLE_FRAGMENT */
+                    );
+                  }),
+                  256
+                  /* UNKEYED_FRAGMENT */
+                ))];
+              }),
+              _: 1
+              /* STABLE */
+            }, 8, ["modelValue"])]))]))])];
+          }),
+          right: withCtx(function() {
+            return [createElementVNode("div", _hoisted_16, [createElementVNode("div", _hoisted_17, [createElementVNode(
+              "p",
+              null,
+              toDisplayString(_ctx.t("ui.grid.individuation.toolbar.selected")) + " (" + toDisplayString(_ctx.visibleColumns.length) + "/" + toDisplayString(_ctx.columns.length) + ") ",
+              1
+              /* TEXT */
+            ), !_ctx.setting.hideFixedColumn ? (openBlock(), createElementBlock(
+              "span",
+              _hoisted_18,
+              toDisplayString(_ctx.t("ui.grid.individuation.toolbar.freeze")),
+              1
+              /* TEXT */
+            )) : createCommentVNode("v-if", true), !_ctx.setting.hideSortColumn ? (openBlock(), createElementBlock(
+              "span",
+              _hoisted_19,
+              toDisplayString(_ctx.t("ui.grid.individuation.toolbar.sort")),
+              1
+              /* TEXT */
+            )) : createCommentVNode("v-if", true), !_ctx.isGroup ? (openBlock(), createElementBlock(
+              "span",
+              {
+                key: 2,
+                class: "clear-all",
+                onClick: _cache[8] || (_cache[8] = function() {
+                  return _ctx.handelClearAll && _ctx.handelClearAll.apply(_ctx, arguments);
+                })
+              },
+              toDisplayString(_ctx.t("ui.grid.individuation.toolbar.clear")),
+              1
+              /* TEXT */
+            )) : createCommentVNode("v-if", true)]), createElementVNode(
+              "ul",
+              _hoisted_20,
+              [(openBlock(true), createElementBlock(
+                Fragment,
+                null,
+                renderList(_ctx.visibleColumns, function(column, index) {
+                  return openBlock(), createElementBlock("li", {
+                    key: column.property + index,
+                    class: normalizeClass([column.fixed, _ctx.getRowClassName(column), "column-list-item", !column.expand && "item-collapse"]),
                     "data-tag": "tiny-grid-toolbar-item",
                     "data-row": column.property
-                  }
-                }, [_c("div", [_vm.defer(Math.floor(index / 3)) ? _c("div", {
-                  staticClass: "column-container",
-                  class: [!_vm.isGroup && "with-padding"]
-                }, [_vm.dropConfig.plugin && !_vm.isGroup ? _c("div", {
-                  staticClass: "drag-icon toolbar-drag-item"
-                }, [_c("span"), _c("span"), _c("span"), _c("span"), _c("span"), _c("span")]) : _vm._e(), _vm.isGroup && column.children ? _c("div", {
-                  staticClass: "toolbar-icon-expand",
-                  class: [column.expand && "toolbar-icon-collapse"]
-                }, [_c("icon-chevron-right", {
-                  on: {
-                    "click": function click($event) {
-                      column.expand = !column.expand;
-                    }
-                  }
-                })], 1) : _vm._e(), !_vm.isGroup ? _c("div", {
-                  staticClass: "sort-number"
-                }, [column.numberSortVisible ? _c("div", {
-                  directives: [{
-                    name: "clickoutside",
-                    rawName: "v-clickoutside",
-                    value: _vm.clickEditorOutside,
-                    expression: "clickEditorOutside"
-                  }],
-                  staticClass: "sort-number-editor"
-                }, [_c("tiny-select", {
-                  ref: "select" + index,
-                  refInFor: true,
-                  attrs: {
-                    "automatic-dropdown": ""
-                  },
-                  on: {
-                    "focus": function focus($event) {
-                      return _vm.selectFocus($event, column.sortingIndex);
-                    },
-                    "change": _vm.sortSelectChange
-                  },
-                  model: {
-                    value: column.sortingIndex,
-                    callback: function callback($$v) {
-                      _vm.$set(column, "sortingIndex", $$v);
+                  }, [createElementVNode("div", null, [_ctx.defer(Math.floor(index / 3)) ? (openBlock(), createElementBlock(
+                    "div",
+                    {
+                      key: 0,
+                      class: normalizeClass(["column-container", [!_ctx.isGroup && "with-padding"]])
                     },
-                    expression: "column.sortingIndex"
-                  }
-                }, _vm._l(_vm.sortingOptions, function(item) {
-                  return _c("tiny-option", {
-                    key: item,
-                    attrs: {
-                      "label": item,
-                      "value": item
-                    }
-                  });
-                }), 1)], 1) : _c("div", {
-                  staticClass: "sort-number-display",
-                  on: {
-                    "click": function click($event) {
-                      return _vm.clickSortDisplay(column, index);
-                    }
-                  }
-                }, [_vm._v(" " + _vm._s(column.sortingIndex) + " ")])]) : _vm._e(), _c("p", {
-                  staticClass: "name toolbar-drag-item",
-                  class: [_vm.dropConfig.plugin && !_vm.isGroup && "dragable"],
-                  on: {
-                    "mouseenter": _vm.handleMouseenter,
-                    "mouseleave": _vm.handleMouseleave
-                  }
-                }, [_c("title-render", {
-                  attrs: {
-                    "column": column
-                  }
-                })], 1), !_vm.setting.hideFixedColumn && (!_vm.isGroup || !column.children) ? _c("div", {
-                  staticClass: "dropdown-column"
-                }, [_c("tiny-dropdown", {
-                  attrs: {
-                    "show-icon": false,
-                    "trigger": "hover"
-                  },
-                  on: {
-                    "item-click": _vm.handleFixedItemClick
-                  },
-                  scopedSlots: _vm._u([{
-                    key: "dropdown",
-                    fn: function fn3() {
-                      return [_c("tiny-dropdown-menu", {
-                        on: {
-                          "mouseenter": function mouseenter($event) {
-                            return _vm.handleDropdownMouseenter($event, index);
-                          },
-                          "mouseleave": function mouseleave($event) {
-                            return _vm.handleDropdownMouseleave($event, index);
-                          }
+                    [_ctx.dropConfig.plugin && !_ctx.isGroup ? (openBlock(), createElementBlock("div", _hoisted_22, _hoisted_29)) : createCommentVNode("v-if", true), _ctx.isGroup && column.children ? (openBlock(), createElementBlock(
+                      "div",
+                      {
+                        key: 1,
+                        class: normalizeClass(["toolbar-icon-expand", [column.expand && "toolbar-icon-collapse"]])
+                      },
+                      [createVNode(_component_icon_chevron_right, {
+                        onClick: function onClick($event) {
+                          return column.expand = !column.expand;
                         }
-                      }, _vm._l(column.fixedOption, function(item) {
-                        return _c("tiny-dropdown-item", {
-                          key: item.value,
-                          attrs: {
-                            "label": item.label,
-                            "item-data": {
-                              value: item.value,
-                              property: column.property
-                            }
-                          }
-                        }, [_vm._v(_vm._s(item.label))]);
-                      }), 1)];
-                    },
-                    proxy: true
-                  }], null, true)
-                }, [_c("span", {
-                  class: ["left", "right"].includes(column.fixed) && "dropdown-btn"
-                }, [column.fixed === "left" ? _c("icon-left-frozen") : column.fixed === "right" ? _c("icon-right-frozen") : _c("span", {
-                  staticClass: "set-btn"
-                }, [_vm._v(_vm._s(_vm.t("ui.grid.individuation.toolbar.set")))])], 1)])], 1) : _vm._e(), !_vm.setting.hideSortColumn ? _c("div", {
-                  staticClass: "dropdown-column",
-                  class: [!column.sortable && "visibility-hidden"]
-                }, [_c("tiny-dropdown", {
-                  attrs: {
-                    "show-icon": false,
-                    "trigger": "hover"
-                  },
-                  on: {
-                    "item-click": _vm.handleSortItemClick
-                  },
-                  scopedSlots: _vm._u([{
-                    key: "dropdown",
-                    fn: function fn3() {
-                      return [_c("tiny-dropdown-menu", {
-                        on: {
-                          "mouseenter": function mouseenter($event) {
-                            return _vm.handleDropdownMouseenter($event, index);
+                      }, null, 8, ["onClick"])],
+                      2
+                      /* CLASS */
+                    )) : createCommentVNode("v-if", true), !_ctx.isGroup ? (openBlock(), createElementBlock("div", _hoisted_30, [column.numberSortVisible ? withDirectives((openBlock(), createElementBlock("div", _hoisted_31, [createVNode(_component_tiny_select, {
+                      ref_for: true,
+                      ref: "select" + index,
+                      modelValue: column.sortingIndex,
+                      "onUpdate:modelValue": function onUpdateModelValue($event) {
+                        return column.sortingIndex = $event;
+                      },
+                      "automatic-dropdown": "",
+                      onFocus: function onFocus($event) {
+                        return _ctx.selectFocus($event, column.sortingIndex);
+                      },
+                      onChange: _ctx.sortSelectChange
+                    }, {
+                      default: withCtx(function() {
+                        return [(openBlock(true), createElementBlock(
+                          Fragment,
+                          null,
+                          renderList(_ctx.sortingOptions, function(item) {
+                            return openBlock(), createBlock(_component_tiny_option, {
+                              key: item,
+                              label: item,
+                              value: item
+                            }, null, 8, ["label", "value"]);
+                          }),
+                          128
+                          /* KEYED_FRAGMENT */
+                        ))];
+                      }),
+                      _: 2
+                      /* DYNAMIC */
+                    }, 1032, ["modelValue", "onUpdate:modelValue", "onFocus", "onChange"])])), [[_directive_clickoutside, _ctx.clickEditorOutside]]) : (openBlock(), createElementBlock("div", {
+                      key: 1,
+                      class: "sort-number-display",
+                      onClick: function onClick($event) {
+                        return _ctx.clickSortDisplay(column, index);
+                      }
+                    }, toDisplayString(column.sortingIndex), 9, _hoisted_32))])) : createCommentVNode("v-if", true), createElementVNode(
+                      "p",
+                      {
+                        class: normalizeClass(["name toolbar-drag-item", [_ctx.dropConfig.plugin && !_ctx.isGroup && "dragable"]]),
+                        onMouseenter: _cache[9] || (_cache[9] = function() {
+                          return _ctx.handleMouseenter && _ctx.handleMouseenter.apply(_ctx, arguments);
+                        }),
+                        onMouseleave: _cache[10] || (_cache[10] = function() {
+                          return _ctx.handleMouseleave && _ctx.handleMouseleave.apply(_ctx, arguments);
+                        })
+                      },
+                      [createVNode(_component_title_render, {
+                        column
+                      }, null, 8, ["column"])],
+                      34
+                      /* CLASS, NEED_HYDRATION */
+                    ), !_ctx.setting.hideFixedColumn && (!_ctx.isGroup || !column.children) ? (openBlock(), createElementBlock("div", _hoisted_33, [createVNode(_component_tiny_dropdown, {
+                      "show-icon": false,
+                      onItemClick: _ctx.handleFixedItemClick,
+                      trigger: "hover"
+                    }, {
+                      dropdown: withCtx(function() {
+                        return [createVNode(_component_tiny_dropdown_menu, {
+                          onMouseenter: function onMouseenter($event) {
+                            return _ctx.handleDropdownMouseenter($event, index);
                           },
-                          "mouseleave": function mouseleave($event) {
-                            return _vm.handleDropdownMouseleave($event, index);
+                          onMouseleave: function onMouseleave($event) {
+                            return _ctx.handleDropdownMouseleave($event, index);
                           }
-                        }
-                      }, _vm._l(column.sortOption, function(item) {
-                        return _c("tiny-dropdown-item", {
-                          key: item.value,
-                          attrs: {
-                            "label": item.label,
-                            "item-data": {
-                              value: item.value,
-                              property: column.property
+                        }, {
+                          default: withCtx(function() {
+                            return [(openBlock(true), createElementBlock(
+                              Fragment,
+                              null,
+                              renderList(column.fixedOption, function(item) {
+                                return openBlock(), createBlock(_component_tiny_dropdown_item, {
+                                  key: item.value,
+                                  label: item.label,
+                                  "item-data": {
+                                    value: item.value,
+                                    property: column.property
+                                  }
+                                }, {
+                                  default: withCtx(function() {
+                                    return [createTextVNode(
+                                      toDisplayString(item.label),
+                                      1
+                                      /* TEXT */
+                                    )];
+                                  }),
+                                  _: 2
+                                  /* DYNAMIC */
+                                }, 1032, ["label", "item-data"]);
+                              }),
+                              128
+                              /* KEYED_FRAGMENT */
+                            ))];
+                          }),
+                          _: 2
+                          /* DYNAMIC */
+                        }, 1032, ["onMouseenter", "onMouseleave"])];
+                      }),
+                      default: withCtx(function() {
+                        return [createElementVNode(
+                          "span",
+                          {
+                            class: normalizeClass(["left", "right"].includes(column.fixed) && "dropdown-btn")
+                          },
+                          [column.fixed === "left" ? (openBlock(), createBlock(_component_icon_left_frozen, {
+                            key: 0
+                          })) : column.fixed === "right" ? (openBlock(), createBlock(_component_icon_right_frozen, {
+                            key: 1
+                          })) : (openBlock(), createElementBlock(
+                            "span",
+                            _hoisted_34,
+                            toDisplayString(_ctx.t("ui.grid.individuation.toolbar.set")),
+                            1
+                            /* TEXT */
+                          ))],
+                          2
+                          /* CLASS */
+                        )];
+                      }),
+                      _: 2
+                      /* DYNAMIC */
+                    }, 1032, ["onItemClick"])])) : createCommentVNode("v-if", true), !_ctx.setting.hideSortColumn ? (openBlock(), createElementBlock(
+                      "div",
+                      {
+                        key: 4,
+                        class: normalizeClass(["dropdown-column", [!column.sortable && "visibility-hidden"]])
+                      },
+                      [createVNode(_component_tiny_dropdown, {
+                        "show-icon": false,
+                        onItemClick: _ctx.handleSortItemClick,
+                        trigger: "hover"
+                      }, {
+                        dropdown: withCtx(function() {
+                          return [createVNode(_component_tiny_dropdown_menu, {
+                            onMouseenter: function onMouseenter($event) {
+                              return _ctx.handleDropdownMouseenter($event, index);
+                            },
+                            onMouseleave: function onMouseleave($event) {
+                              return _ctx.handleDropdownMouseleave($event, index);
                             }
-                          }
-                        }, [_vm._v(_vm._s(item.label))]);
-                      }), 1)];
-                    },
-                    proxy: true
-                  }], null, true)
-                }, [_c("span", {
-                  class: ["asc", "desc"].includes(column.order) && "dropdown-btn"
-                }, [column.order === "asc" ? _c("icon-ascending") : column.order === "desc" ? _c("icon-descending") : _c("span", {
-                  staticClass: "set-btn",
-                  class: [!column.sortable && "visibility-hidden"]
-                }, [_vm._v(_vm._s(_vm.t("ui.grid.individuation.toolbar.set")))])], 1)])], 1) : _vm._e(), !_vm.isGroup ? _c("span", {
-                  staticClass: "close-icon",
-                  class: [column.alwaysShow && "visibility-hidden"],
-                  on: {
-                    "click": function click($event) {
-                      return _vm.hiddenColumn(column.property);
-                    }
-                  }
-                }, [_c("icon-close")], 1) : _vm._e()]) : _vm._e(), column.children ? _c("ul", _vm._l(column.children, function(column2, index2) {
-                  return _c("li", {
-                    directives: [{
-                      name: "show",
-                      rawName: "v-show",
-                      value: column2.visible,
-                      expression: "column.visible"
-                    }],
-                    key: column2.property + index2,
-                    class: [column2.fixed, _vm.getRowClassName(column2)],
-                    attrs: {
-                      "data-row": column2.property
-                    }
-                  }, [_c("div", {
-                    staticClass: "column-container"
-                  }, [_c("p", {
-                    staticClass: "name child-name",
-                    on: {
-                      "mouseenter": _vm.handleMouseenter,
-                      "mouseleave": _vm.handleMouseleave
-                    }
-                  }, [_c("title-render", {
-                    attrs: {
-                      "column": column2
-                    }
-                  })], 1)])]);
-                }), 0) : _vm._e()])]);
-              }), 0)])];
-            },
-            proxy: true
-          }], null, false, 1239171024),
-          model: {
-            value: _vm.splitVal,
-            callback: function callback($$v) {
-              _vm.splitVal = $$v;
-            },
-            expression: "splitVal"
-          }
-        })], 1), _c("div", {
-          directives: [{
-            name: "show",
-            rawName: "v-show",
-            value: _vm.activeName === "other",
-            expression: "activeName === 'other'"
-          }],
-          class: ["tabs-body-item", _vm.animateShow === "other" ? "active-item" : ""]
-        }, [_c("div", {
-          staticClass: "other-setting"
-        }, [_c("span", {
-          staticClass: "label"
-        }, [_vm._v(_vm._s(_vm.t("ui.grid.individuation.tabs.other.pageSize")))]), _c("tiny-radio-group", {
-          model: {
-            value: _vm.settings.pageSize,
-            callback: function callback($$v) {
-              _vm.$set(_vm.settings, "pageSize", $$v);
-            },
-            expression: "settings.pageSize"
-          }
-        }, _vm._l(_vm.initSettings.pageSizes, function(item, index) {
-          return _c("tiny-radio", {
-            key: index,
-            attrs: {
-              "label": item
-            }
-          }, [_vm._v(_vm._s(item))]);
-        }), 1)], 1)])])]), _c("div", {
-          staticClass: "tiny-grid-custom__footer",
-          attrs: {
-            "dir": _vm.tinyTheme === "saas" ? "rtl" : "ltr"
-          }
-        }, [_c("tiny-button", {
-          attrs: {
-            "type": "primary"
-          },
-          on: {
-            "click": _vm.saveSettings
-          }
-        }, [_vm._v(_vm._s(_vm.t("ui.grid.individuation.saveBtn")))]), _vm.multipleHistory && _vm.activeName === "base" ? _c("tiny-custom-switch", {
-          ref: "switch",
-          attrs: {
-            "remote": _vm.setting.remote,
-            "custom-mode": _vm.customMode,
-            "selectedTemplateVal": _vm.selectedTemplateVal,
-            "history-config": _vm.historyConfig
-          },
-          on: {
-            "init-storage": _vm.initStorage,
-            "set-selected": _vm.setSelectedTemplate
-          }
-        }) : _vm._e(), _c("tiny-button", {
-          on: {
-            "click": _vm.handleReset
-          }
-        }, [_vm._v(_vm._s(_vm.t("ui.grid.individuation.resetBtn")))]), _c("tiny-button", {
-          on: {
-            "click": _vm.cancelSettings
-          }
-        }, [_vm._v(_vm._s(_vm.t("ui.grid.individuation.cancelBtn")))])], 1)]) : _vm._e(), _c("tiny-tooltip", {
-          ref: "tooltip",
-          attrs: {
-            "popper-class": "absolute",
-            "manual": true,
-            "effect": "light",
-            "content": _vm.tooltipContent,
-            "placement": "top"
-          },
-          model: {
-            value: _vm.tooltipVisible,
-            callback: function callback($$v) {
-              _vm.tooltipVisible = $$v;
-            },
-            expression: "tooltipVisible"
-          }
-        })];
-      },
-      proxy: true
-    }]),
-    model: {
-      value: _vm.visible,
-      callback: function callback($$v) {
-        _vm.visible = $$v;
-      },
-      expression: "visible"
-    }
-  });
-};
-var staticRenderFns = [];
-var __cssModules = {};
-var __component__ = /* @__PURE__ */ normalizeComponent(__vue2_script, render2, staticRenderFns, false, __vue2_injectStyles);
-function __vue2_injectStyles(context) {
-  for (var o in __cssModules) {
-    this[o] = __cssModules[o];
-  }
+                          }, {
+                            default: withCtx(function() {
+                              return [(openBlock(true), createElementBlock(
+                                Fragment,
+                                null,
+                                renderList(column.sortOption, function(item) {
+                                  return openBlock(), createBlock(_component_tiny_dropdown_item, {
+                                    key: item.value,
+                                    label: item.label,
+                                    "item-data": {
+                                      value: item.value,
+                                      property: column.property
+                                    }
+                                  }, {
+                                    default: withCtx(function() {
+                                      return [createTextVNode(
+                                        toDisplayString(item.label),
+                                        1
+                                        /* TEXT */
+                                      )];
+                                    }),
+                                    _: 2
+                                    /* DYNAMIC */
+                                  }, 1032, ["label", "item-data"]);
+                                }),
+                                128
+                                /* KEYED_FRAGMENT */
+                              ))];
+                            }),
+                            _: 2
+                            /* DYNAMIC */
+                          }, 1032, ["onMouseenter", "onMouseleave"])];
+                        }),
+                        default: withCtx(function() {
+                          return [createElementVNode(
+                            "span",
+                            {
+                              class: normalizeClass(["asc", "desc"].includes(column.order) && "dropdown-btn")
+                            },
+                            [column.order === "asc" ? (openBlock(), createBlock(_component_icon_ascending, {
+                              key: 0
+                            })) : column.order === "desc" ? (openBlock(), createBlock(_component_icon_descending, {
+                              key: 1
+                            })) : (openBlock(), createElementBlock(
+                              "span",
+                              {
+                                key: 2,
+                                class: normalizeClass(["set-btn", [!column.sortable && "visibility-hidden"]])
+                              },
+                              toDisplayString(_ctx.t("ui.grid.individuation.toolbar.set")),
+                              3
+                              /* TEXT, CLASS */
+                            ))],
+                            2
+                            /* CLASS */
+                          )];
+                        }),
+                        _: 2
+                        /* DYNAMIC */
+                      }, 1032, ["onItemClick"])],
+                      2
+                      /* CLASS */
+                    )) : createCommentVNode("v-if", true), !_ctx.isGroup ? (openBlock(), createElementBlock("span", {
+                      key: 5,
+                      class: normalizeClass(["close-icon", [column.alwaysShow && "visibility-hidden"]]),
+                      onClick: function onClick($event) {
+                        return _ctx.hiddenColumn(column.property);
+                      }
+                    }, [createVNode(_component_icon_close)], 10, _hoisted_35)) : createCommentVNode("v-if", true)],
+                    2
+                    /* CLASS */
+                  )) : createCommentVNode("v-if", true), column.children ? (openBlock(), createElementBlock("ul", _hoisted_36, [(openBlock(true), createElementBlock(
+                    Fragment,
+                    null,
+                    renderList(column.children, function(column2, index2) {
+                      return withDirectives((openBlock(), createElementBlock("li", {
+                        key: column2.property + index2,
+                        class: normalizeClass([column2.fixed, _ctx.getRowClassName(column2)]),
+                        "data-row": column2.property
+                      }, [createElementVNode("div", _hoisted_38, [createElementVNode(
+                        "p",
+                        {
+                          class: "name child-name",
+                          onMouseenter: _cache[11] || (_cache[11] = function() {
+                            return _ctx.handleMouseenter && _ctx.handleMouseenter.apply(_ctx, arguments);
+                          }),
+                          onMouseleave: _cache[12] || (_cache[12] = function() {
+                            return _ctx.handleMouseleave && _ctx.handleMouseleave.apply(_ctx, arguments);
+                          })
+                        },
+                        [createVNode(_component_title_render, {
+                          column: column2
+                        }, null, 8, ["column"])],
+                        32
+                        /* NEED_HYDRATION */
+                      )])], 10, _hoisted_37)), [[vShow, column2.visible]]);
+                    }),
+                    128
+                    /* KEYED_FRAGMENT */
+                  ))])) : createCommentVNode("v-if", true)])], 10, _hoisted_21);
+                }),
+                128
+                /* KEYED_FRAGMENT */
+              ))],
+              512
+              /* NEED_PATCH */
+            )])];
+          }),
+          _: 1
+          /* STABLE */
+        }, 8, ["modelValue"])],
+        2
+        /* CLASS */
+      ), [[vShow, _ctx.activeName === "base"]]), withDirectives(createElementVNode(
+        "div",
+        {
+          class: normalizeClass(["tabs-body-item", _ctx.animateShow === "other" ? "active-item" : ""])
+        },
+        [createElementVNode("div", _hoisted_39, [createElementVNode(
+          "span",
+          _hoisted_40,
+          toDisplayString(_ctx.t("ui.grid.individuation.tabs.other.pageSize")),
+          1
+          /* TEXT */
+        ), createVNode(_component_tiny_radio_group, {
+          modelValue: _ctx.settings.pageSize,
+          "onUpdate:modelValue": _cache[14] || (_cache[14] = function($event) {
+            return _ctx.settings.pageSize = $event;
+          })
+        }, {
+          default: withCtx(function() {
+            return [(openBlock(true), createElementBlock(
+              Fragment,
+              null,
+              renderList(_ctx.initSettings.pageSizes, function(item, index) {
+                return openBlock(), createBlock(_component_tiny_radio, {
+                  key: index,
+                  label: item
+                }, {
+                  default: withCtx(function() {
+                    return [createTextVNode(
+                      toDisplayString(item),
+                      1
+                      /* TEXT */
+                    )];
+                  }),
+                  _: 2
+                  /* DYNAMIC */
+                }, 1032, ["label"]);
+              }),
+              128
+              /* KEYED_FRAGMENT */
+            ))];
+          }),
+          _: 1
+          /* STABLE */
+        }, 8, ["modelValue"])])],
+        2
+        /* CLASS */
+      ), [[vShow, _ctx.activeName === "other"]])])]), createElementVNode("div", {
+        class: "tiny-grid-custom__footer",
+        dir: _ctx.tinyTheme === "saas" ? "rtl" : "ltr"
+      }, [createVNode(_component_tiny_button, {
+        type: "primary",
+        onClick: _ctx.saveSettings
+      }, {
+        default: withCtx(function() {
+          return [createTextVNode(
+            toDisplayString(_ctx.t("ui.grid.individuation.saveBtn")),
+            1
+            /* TEXT */
+          )];
+        }),
+        _: 1
+        /* STABLE */
+      }, 8, ["onClick"]), _ctx.multipleHistory && _ctx.activeName === "base" ? (openBlock(), createBlock(_component_tiny_custom_switch, {
+        key: 0,
+        ref: "switch",
+        remote: _ctx.setting.remote,
+        "custom-mode": _ctx.customMode,
+        selectedTemplateVal: _ctx.selectedTemplateVal,
+        "history-config": _ctx.historyConfig,
+        onInitStorage: _ctx.initStorage,
+        onSetSelected: _ctx.setSelectedTemplate
+      }, null, 8, ["remote", "custom-mode", "selectedTemplateVal", "history-config", "onInitStorage", "onSetSelected"])) : createCommentVNode("v-if", true), createVNode(_component_tiny_button, {
+        onClick: _ctx.handleReset
+      }, {
+        default: withCtx(function() {
+          return [createTextVNode(
+            toDisplayString(_ctx.t("ui.grid.individuation.resetBtn")),
+            1
+            /* TEXT */
+          )];
+        }),
+        _: 1
+        /* STABLE */
+      }, 8, ["onClick"]), createVNode(_component_tiny_button, {
+        onClick: _ctx.cancelSettings
+      }, {
+        default: withCtx(function() {
+          return [createTextVNode(
+            toDisplayString(_ctx.t("ui.grid.individuation.cancelBtn")),
+            1
+            /* TEXT */
+          )];
+        }),
+        _: 1
+        /* STABLE */
+      }, 8, ["onClick"])], 8, _hoisted_41)])) : createCommentVNode("v-if", true), createVNode(_component_tiny_tooltip, {
+        ref: "tooltip",
+        modelValue: _ctx.tooltipVisible,
+        "onUpdate:modelValue": _cache[15] || (_cache[15] = function($event) {
+          return _ctx.tooltipVisible = $event;
+        }),
+        "popper-class": "absolute",
+        manual: true,
+        effect: "light",
+        content: _ctx.tooltipContent,
+        placement: "top"
+      }, null, 8, ["modelValue", "content"])];
+    }),
+    _: 1
+    /* STABLE */
+  }, 8, ["modelValue", "onInput", "onClose"]);
 }
-var GridCustomSaas = /* @__PURE__ */ function() {
-  return __component__.exports;
-}();
+var GridCustomSaas = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
 var classMap = {
   isActive: "is__active"
 };
@@ -3605,7 +4140,7 @@ var GridToolbar = defineComponent({
       tableListeners
     };
   },
-  render: function render4() {
+  render: function render2() {
     var _ref21;
     var $grid = this.$grid, $slots = this.slots, table = this.table, loading = this.loading, settingStore = this.settingStore, refresh = this.refresh, fullScreen = this.fullScreen;
     var setting = this.setting, initSettings = this.initSettings, _this$buttons = this.buttons, buttons = _this$buttons === void 0 ? [] : _this$buttons, vSize2 = this.vSize, tableFullColumn = this.tableFullColumn;
@@ -4028,7 +4563,7 @@ var GridToolbar = defineComponent({
     }
   }
 });
-var version = "2.21.0";
+var version = "3.21.0";
 GridToolbar.install = function(Vue) {
   Vue.component(GridToolbar.name, GridToolbar);
 };