evui 3.3.19 → 3.3.22

package/dist/evui.common.js

@@ -87,17 +87,6 @@ module.exports =
 /************************************************************************/
 /******/ ({
 
-/***/ "002b":
-/***/ (function(module, __webpack_exports__, __webpack_require__) {
-
-"use strict";
-/* harmony import */ var _node_modules_vue_style_loader_index_js_ref_8_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_8_oneOf_1_1_node_modules_vue_loader_v16_dist_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_2_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_3_node_modules_sass_loader_dist_cjs_js_ref_8_oneOf_1_4_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_v16_dist_index_js_ref_0_1_Select_vue_vue_type_style_index_0_id_9f8a1b7a_lang_scss__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("4e26");
-/* harmony import */ var _node_modules_vue_style_loader_index_js_ref_8_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_8_oneOf_1_1_node_modules_vue_loader_v16_dist_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_2_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_3_node_modules_sass_loader_dist_cjs_js_ref_8_oneOf_1_4_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_v16_dist_index_js_ref_0_1_Select_vue_vue_type_style_index_0_id_9f8a1b7a_lang_scss__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_vue_style_loader_index_js_ref_8_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_8_oneOf_1_1_node_modules_vue_loader_v16_dist_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_2_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_3_node_modules_sass_loader_dist_cjs_js_ref_8_oneOf_1_4_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_v16_dist_index_js_ref_0_1_Select_vue_vue_type_style_index_0_id_9f8a1b7a_lang_scss__WEBPACK_IMPORTED_MODULE_0__);
-/* unused harmony reexport * */
-
-
-/***/ }),
-
 /***/ "00ee":
 /***/ (function(module, exports, __webpack_require__) {
 
@@ -164,21 +153,6 @@ module.exports = function (fn, that, length) {
 /* unused harmony reexport * */
 
 
-/***/ }),
-
-/***/ "044f":
-/***/ (function(module, exports, __webpack_require__) {
-
-// style-loader: Adds some css to the DOM by adding a <style> tag
-
-// load the styles
-var content = __webpack_require__("4890");
-if(typeof content === 'string') content = [[module.i, content, '']];
-if(content.locals) module.exports = content.locals;
-// add the styles to the DOM
-var add = __webpack_require__("499e").default
-var update = add("1fe9e43e", content, true, {"sourceMap":false,"shadowMode":false});
-
 /***/ }),
 
 /***/ "0538":
@@ -381,20 +355,6 @@ if(content.locals) module.exports = content.locals;
 var add = __webpack_require__("499e").default
 var update = add("5a9ac64a", content, true, {"sourceMap":false,"shadowMode":false});
 
-/***/ }),
-
-/***/ "0fe5":
-/***/ (function(module, exports, __webpack_require__) {
-
-// Imports
-var ___CSS_LOADER_API_IMPORT___ = __webpack_require__("24fb");
-exports = ___CSS_LOADER_API_IMPORT___(false);
-// Module
-exports.push([module.i, ".ev-select{display:block;position:relative;width:100%;border-radius:4px;cursor:pointer}.ev-select .ev-input,.ev-select .ev-textarea{width:100%;outline:0;background-color:transparent;border-radius:4px;transition:border .3s ease-in-out;border:1px solid #b2b2b2;color:#0d0d0d}.dark .ev-select .ev-input,.dark .ev-select .ev-textarea{border:1px solid #666;color:#fff}.ev-select .ev-input:focus,.ev-select .ev-input:hover,.ev-select .ev-textarea:focus,.ev-select .ev-textarea:hover{border:1px solid #1a6afe}.dark .ev-select .ev-input:focus,.dark .ev-select .ev-input:hover,.dark .ev-select .ev-textarea:focus,.dark .ev-select .ev-textarea:hover{border:1px solid #007aff}.ev-select .ev-input{height:35px;padding:0 15px}.ev-select .ev-textarea{height:100px;padding:5px;resize:none}.ev-select.readonly .ev-input,.ev-select.readonly .ev-select,.ev-select.readonly .ev-textarea{background-color:hsla(0,0%,69.8%,.1)}.dark .ev-select.readonly .ev-input,.dark .ev-select.readonly .ev-select,.dark .ev-select.readonly .ev-textarea{background-color:hsla(0,0%,40%,.3)}.ev-select.readonly .ev-input:focus,.ev-select.readonly .ev-input:hover,.ev-select.readonly .ev-select:focus,.ev-select.readonly .ev-select:hover,.ev-select.readonly .ev-textarea:focus,.ev-select.readonly .ev-textarea:hover{border:1px solid hsla(0,0%,69.8%,.5)}.dark .ev-select.readonly .ev-input:focus,.dark .ev-select.readonly .ev-input:hover,.dark .ev-select.readonly .ev-select:focus,.dark .ev-select.readonly .ev-select:hover,.dark .ev-select.readonly .ev-textarea:focus,.dark .ev-select.readonly .ev-textarea:hover{border:1px solid hsla(0,0%,40%,.5)}.ev-select.readonly.ev-input-number:hover .ev-input,.ev-select.readonly.ev-input-number:hover .ev-textarea,.ev-select.readonly.ev-select:hover .ev-input,.ev-select.readonly.ev-select:hover .ev-textarea,.ev-select.readonly.ev-text-field:hover .ev-input,.ev-select.readonly.ev-text-field:hover .ev-textarea{border:1px solid hsla(0,0%,69.8%,.5)}.dark .ev-select.readonly.ev-input-number:hover .ev-input,.dark .ev-select.readonly.ev-input-number:hover .ev-textarea,.dark .ev-select.readonly.ev-select:hover .ev-input,.dark .ev-select.readonly.ev-select:hover .ev-textarea,.dark .ev-select.readonly.ev-text-field:hover .ev-input,.dark .ev-select.readonly.ev-text-field:hover .ev-textarea{border:1px solid hsla(0,0%,40%,.5)}.ev-select.disabled.ev-input-number,.ev-select.disabled.ev-input-number *,.ev-select.disabled.ev-select,.ev-select.disabled.ev-select *,.ev-select.disabled.ev-text-field,.ev-select.disabled.ev-text-field *{cursor:not-allowed!important}.ev-select.disabled.ev-input-number:hover .ev-input,.ev-select.disabled.ev-input-number:hover .ev-textarea,.ev-select.disabled.ev-select:hover .ev-input,.ev-select.disabled.ev-select:hover .ev-textarea,.ev-select.disabled.ev-text-field:hover .ev-input,.ev-select.disabled.ev-text-field:hover .ev-textarea{border:1px solid #ff3b30}.dark .ev-select.disabled.ev-input-number:hover .ev-input,.dark .ev-select.disabled.ev-input-number:hover .ev-textarea,.dark .ev-select.disabled.ev-select:hover .ev-input,.dark .ev-select.disabled.ev-select:hover .ev-textarea,.dark .ev-select.disabled.ev-text-field:hover .ev-input,.dark .ev-select.disabled.ev-text-field:hover .ev-textarea{border:1px solid #ff453a}.ev-select.disabled .ev-input,.ev-select.disabled .ev-textarea{border:1px solid #b2b2b2;background-color:hsla(0,0%,69.8%,.1);color:#b2b2b2}.dark .ev-select.disabled .ev-input,.dark .ev-select.disabled .ev-textarea{border:1px solid #555;background-color:hsla(0,0%,40%,.3);color:#555}.ev-select.disabled .ev-input:focus,.ev-select.disabled .ev-input:hover,.ev-select.disabled .ev-textarea:focus,.ev-select.disabled .ev-textarea:hover{border:1px solid #ff3b30}.dark .ev-select.disabled .ev-input:focus,.dark .ev-select.disabled .ev-input:hover,.dark .ev-select.disabled .ev-textarea:focus,.dark .ev-select.disabled .ev-textarea:hover{border:1px solid #ff453a}.ev-select.error .ev-input,.ev-select.error .ev-textarea{border:1px solid #ff3b30}.dark .ev-select.error .ev-input,.dark .ev-select.error .ev-textarea{border:1px solid #ff453a}.ev-select.error .ev-input:focus,.ev-select.error .ev-input:hover,.ev-select.error .ev-textarea:focus,.ev-select.error .ev-textarea:hover{border:1px solid rgba(255,59,48,.5)}.dark .ev-select.error .ev-input:focus,.dark .ev-select.error .ev-input:hover,.dark .ev-select.error .ev-textarea:focus,.dark .ev-select.error .ev-textarea:hover{border:1px solid rgba(255,69,58,.5)}.ev-select.error.ev-input-number:hover .ev-input,.ev-select.error.ev-input-number:hover .ev-textarea,.ev-select.error.ev-text-field:hover .ev-input,.ev-select.error.ev-text-field:hover .ev-textarea{border:1px solid rgba(255,59,48,.5)}.dark .ev-select.error.ev-input-number:hover .ev-input,.dark .ev-select.error.ev-input-number:hover .ev-textarea,.dark .ev-select.error.ev-text-field:hover .ev-input,.dark .ev-select.error.ev-text-field:hover .ev-textarea{border:1px solid rgba(255,69,58,.5)}.ev-select__wrapper{position:relative}.ev-select .ev-input{padding:0 30px 0 15px;border:1px solid #b2b2b2;cursor:pointer}.ev-select .ev-input-suffix,.ev-select .ev-input.multiple{position:absolute;height:100%}.ev-select .ev-input-suffix{display:flex;top:0;right:5px;align-items:center}.ev-select .ev-input-suffix:hover{color:#409eff}.ev-select .ev-input-suffix-arrow{transform:rotate(0deg);transition-duration:.3s}.ev-select .ev-input-suffix-arrow.selected{transform:rotate(180deg)}.ev-select .ev-select-tag-wrapper{display:flex;width:100%;height:100%;padding:3px 0;min-height:35px;flex-wrap:wrap;align-items:center;z-index:100}.ev-select-tag{display:flex;position:relative;height:24px;padding:0 19px 0 8px;margin:2px 0 2px 6px;background-color:#f4f4f5;align-items:center;border:1px solid #e9e9eb;border-radius:4px;color:#909399;font-size:12px;cursor:auto}.ev-select-tag.num{padding-right:8px}.ev-select-tag .ev-tag-suffix{display:flex;position:absolute;top:0;right:3px;height:100%;align-items:center;color:#0d0d0d;cursor:pointer}.ev-select-tag .ev-tag-suffix:hover{color:#409eff}.ev-select-dropbox-wrapper{height:0}.ev-select-dropbox{position:absolute;width:100%;max-height:175px;background-color:#fcfcfc;border:1px solid #e4e7ed;color:#606266;box-shadow:0 2px 12px 0 rgba(0,0,0,.1);border-radius:4px;z-index:100;cursor:pointer;overflow:hidden}.ev-select-dropbox ul{list-style:none}.ev-select-dropbox li{height:35px;line-height:35px}.ev-select-dropbox .ev-input-query{width:100%;min-height:35px;padding:0 30px 0 15px;border:0;border-bottom:1px solid #b2b2b2;outline:0;font-size:14px;background-color:transparent}.ev-select-dropbox .ev-select-dropbox-list{width:100%;max-height:140px;overflow-y:auto}.ev-select-dropbox-item{padding:0 15px;overflow:hidden;text-overflow:ellipsis;font-size:15px;color:#0d0d0d;white-space:nowrap;cursor:pointer}.ev-select-dropbox-item:hover{opacity:.85}.ev-select-dropbox-item.selected{color:#ebebeb;background-color:#730ef4}.ev-select-dropbox-item.disabled{opacity:1;color:#c0c4cc}", ""]);
-// Exports
-module.exports = exports;
-
-
 /***/ }),
 
 /***/ "1148":
@@ -4145,6 +4105,21 @@ module.exports = function (it, Constructor, name) {
 };
 
 
+/***/ }),
+
+/***/ "1a54":
+/***/ (function(module, exports, __webpack_require__) {
+
+// style-loader: Adds some css to the DOM by adding a <style> tag
+
+// load the styles
+var content = __webpack_require__("3492");
+if(typeof content === 'string') content = [[module.i, content, '']];
+if(content.locals) module.exports = content.locals;
+// add the styles to the DOM
+var add = __webpack_require__("499e").default
+var update = add("4f651123", content, true, {"sourceMap":false,"shadowMode":false});
+
 /***/ }),
 
 /***/ "1be4":
@@ -4304,6 +4279,21 @@ module.exports = function (url, options) {
 
 /***/ }),
 
+/***/ "1e2f":
+/***/ (function(module, exports, __webpack_require__) {
+
+// style-loader: Adds some css to the DOM by adding a <style> tag
+
+// load the styles
+var content = __webpack_require__("f99b");
+if(typeof content === 'string') content = [[module.i, content, '']];
+if(content.locals) module.exports = content.locals;
+// add the styles to the DOM
+var add = __webpack_require__("499e").default
+var update = add("5ac4a7d0", content, true, {"sourceMap":false,"shadowMode":false});
+
+/***/ }),
+
 /***/ "2266":
 /***/ (function(module, exports, __webpack_require__) {
 
@@ -4968,6 +4958,20 @@ var getBuiltIn = __webpack_require__("d066");
 module.exports = getBuiltIn('navigator', 'userAgent') || '';
 
 
+/***/ }),
+
+/***/ "3492":
+/***/ (function(module, exports, __webpack_require__) {
+
+// Imports
+var ___CSS_LOADER_API_IMPORT___ = __webpack_require__("24fb");
+exports = ___CSS_LOADER_API_IMPORT___(false);
+// Module
+exports.push([module.i, ".table[data-v-0c99a380]{position:relative;width:100%;height:100%;padding-top:33px}.table.non-header[data-v-0c99a380]{padding-top:0}.table .table-header[data-v-0c99a380]{overflow:hidden;position:absolute;top:0;width:100%;height:33px;border-top:2px solid #7f7f7f;border-bottom:1px solid #cfcfcf}.dark .table .table-header[data-v-0c99a380]{border-top:2px solid;border-bottom:1px solid}.column-list[data-v-0c99a380]{width:100%;white-space:nowrap;list-style-type:none}.column[data-v-0c99a380],.column-list[data-v-0c99a380]{position:relative;height:100%}.column[data-v-0c99a380]{display:inline-flex;padding:0 10px;line-height:30px;justify-content:center;align-items:center;text-align:center;vertical-align:top;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;border-right:1px solid #cfcfcf}.dark .column[data-v-0c99a380]{border-right:1px solid}.column[data-v-0c99a380]:last-child{border-right:0;margin-right:20px}.column:last-child .column-resize[data-v-0c99a380]{cursor:default!important}.column .sort-icon[data-v-0c99a380]{display:inline-block;float:right;font-size:14px;line-height:30px}.column .ev-icon-filter[data-v-0c99a380]{font-size:13px;color:#005cc8}.column-name[data-v-0c99a380]{display:inline-block;float:left;overflow:hidden;text-overflow:ellipsis;font-weight:700;font-size:14px}.column-filter[data-v-0c99a380]{display:none;position:absolute;right:0;background-color:transparent}.column-filter i[data-v-0c99a380]{margin-right:2px;font-size:14px;vertical-align:middle}.column:hover .column-filter[data-v-0c99a380]{display:block;cursor:pointer}.column-filter-status[data-v-0c99a380]{position:absolute;left:0;background-color:transparent}.column-filter-status .ei[data-v-0c99a380]{font-size:10px;vertical-align:top}.column-resize[data-v-0c99a380]{position:absolute;bottom:0;right:-5px;width:10px;height:100%}.column-resize[data-v-0c99a380]:hover{cursor:col-resize}.table-body[data-v-0c99a380]{position:relative;width:100%;height:100%;overflow:auto;overflow-anchor:none}.table-body table[data-v-0c99a380]{clear:both;width:inherit;border-spacing:0;border-collapse:collapse}.table-body.stripe tr[data-v-0c99a380]:nth-child(2n){background:hsla(0,0%,89.8%,.6)}.table-body.bottom-border[data-v-0c99a380]{border-bottom:1px solid #cfcfcf}.dark .table-body.bottom-border[data-v-0c99a380]{border-bottom:1px solid}.table-body .row[data-v-0c99a380]{white-space:nowrap;border-bottom:1px solid #cfcfcf}.dark .table-body .row[data-v-0c99a380]{border-bottom:1px solid}.table-body .row.selected[data-v-0c99a380]{background:rgba(219,240,249,.6)!important;color:inherit!important}.dark .table-body .row.selected[data-v-0c99a380]{background:!important;color:inherit!important}.table-body .row.highlight[data-v-0c99a380]{background:#5ab7ff;color:#fff}.table-body .cell[data-v-0c99a380]{display:inline-block;padding:0 10px;text-align:center;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;border-right:1px solid #cfcfcf}.dark .table-body .cell[data-v-0c99a380]{border-right:1px solid}.table-body .cell div[data-v-0c99a380]{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.table-body .cell.row-checkbox[data-v-0c99a380]{display:inline-flex;justify-content:center;align-items:center}.table-body .cell.render[data-v-0c99a380]{overflow:initial}.table-body .cell.float[data-v-0c99a380],.table-body .cell.number[data-v-0c99a380]{text-align:right}.table-body .cell.string[data-v-0c99a380],.table-body .cell.stringNumber[data-v-0c99a380]{text-align:left}.table-body .cell.center[data-v-0c99a380]{text-align:center}.table-body .cell.left[data-v-0c99a380]{text-align:left}.table-body .cell.left .wrap[data-v-0c99a380]{justify-content:flex-start}.table-body .cell.right[data-v-0c99a380]{text-align:right}.table-body .cell.right .wrap[data-v-0c99a380]{justify-content:flex-end}.table-body .cell[data-v-0c99a380]:last-child{border-right:0}.table-body .cell.tree-td[data-v-0c99a380]{text-align:left!important}.table-resize-line[data-v-0c99a380]{position:absolute;top:0;bottom:0;width:1px;border-right:1px solid #cfcfcf}.dark .table-resize-line[data-v-0c99a380]{border-right:1px solid}.vscroll-spacer[data-v-0c99a380]{opacity:0;clear:both}[v-cloak][data-v-0c99a380]{display:none}.ev-checkbox[data-v-0c99a380]{margin:0}.non-border[data-v-0c99a380]{border:none!important}.is-empty[data-v-0c99a380]{height:30px;text-align:center}", ""]);
+// Exports
+module.exports = exports;
+
+
 /***/ }),
 
 /***/ "35a1":
@@ -5360,20 +5364,6 @@ module.exports = function (O, defaultConstructor) {
 };
 
 
-/***/ }),
-
-/***/ "4890":
-/***/ (function(module, exports, __webpack_require__) {
-
-// Imports
-var ___CSS_LOADER_API_IMPORT___ = __webpack_require__("24fb");
-exports = ___CSS_LOADER_API_IMPORT___(false);
-// Module
-exports.push([module.i, ".table[data-v-1aab6f12]{position:relative;width:100%;height:100%;padding-top:33px}.table.non-header[data-v-1aab6f12]{padding-top:0}.table .table-header[data-v-1aab6f12]{overflow:hidden;position:absolute;top:0;width:100%;height:33px;border-top:2px solid #7f7f7f;border-bottom:1px solid #cfcfcf}.dark .table .table-header[data-v-1aab6f12]{border-top:2px solid;border-bottom:1px solid}.column-list[data-v-1aab6f12]{width:100%;white-space:nowrap;list-style-type:none}.column[data-v-1aab6f12],.column-list[data-v-1aab6f12]{position:relative;height:100%}.column[data-v-1aab6f12]{display:inline-flex;padding:0 10px;line-height:30px;justify-content:center;align-items:center;text-align:center;vertical-align:top;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;border-right:1px solid #cfcfcf}.dark .column[data-v-1aab6f12]{border-right:1px solid}.column[data-v-1aab6f12]:last-child{border-right:0;margin-right:20px}.column:last-child .column-resize[data-v-1aab6f12]{cursor:default!important}.column .sort-icon[data-v-1aab6f12]{display:inline-block;float:right;font-size:14px;line-height:30px}.column .ev-icon-filter[data-v-1aab6f12]{font-size:13px;color:#005cc8}.column-name[data-v-1aab6f12]{display:inline-block;float:left;overflow:hidden;text-overflow:ellipsis;font-weight:700;font-size:14px}.column-filter[data-v-1aab6f12]{display:none;position:absolute;right:0;background-color:transparent}.column-filter i[data-v-1aab6f12]{margin-right:2px;font-size:14px;vertical-align:middle}.column:hover .column-filter[data-v-1aab6f12]{display:block;cursor:pointer}.column-filter-status[data-v-1aab6f12]{position:absolute;left:0;background-color:transparent}.column-filter-status .ei[data-v-1aab6f12]{font-size:10px;vertical-align:top}.column-resize[data-v-1aab6f12]{position:absolute;bottom:0;right:-5px;width:10px;height:100%}.column-resize[data-v-1aab6f12]:hover{cursor:col-resize}.table-body[data-v-1aab6f12]{position:relative;width:100%;height:100%;overflow:auto;overflow-anchor:none}.table-body table[data-v-1aab6f12]{clear:both;width:inherit;border-spacing:0;border-collapse:collapse}.table-body.stripe tr[data-v-1aab6f12]:nth-child(2n){background:hsla(0,0%,89.8%,.6)}.table-body.bottom-border[data-v-1aab6f12]{border-bottom:1px solid #cfcfcf}.dark .table-body.bottom-border[data-v-1aab6f12]{border-bottom:1px solid}.table-body .row[data-v-1aab6f12]{white-space:nowrap;border-bottom:1px solid #cfcfcf}.dark .table-body .row[data-v-1aab6f12]{border-bottom:1px solid}.table-body .row.selected[data-v-1aab6f12]{background:rgba(219,240,249,.6)!important;color:inherit!important}.dark .table-body .row.selected[data-v-1aab6f12]{background:!important;color:inherit!important}.table-body .row.highlight[data-v-1aab6f12]{background:#5ab7ff;color:#fff}.table-body .cell[data-v-1aab6f12]{display:inline-block;padding:0 10px;text-align:center;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;border-right:1px solid #cfcfcf}.dark .table-body .cell[data-v-1aab6f12]{border-right:1px solid}.table-body .cell div[data-v-1aab6f12]{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.table-body .cell.row-checkbox[data-v-1aab6f12]{display:inline-flex;justify-content:center;align-items:center}.table-body .cell.render[data-v-1aab6f12]{overflow:initial}.table-body .cell.float[data-v-1aab6f12],.table-body .cell.number[data-v-1aab6f12]{text-align:right}.table-body .cell.string[data-v-1aab6f12],.table-body .cell.stringNumber[data-v-1aab6f12]{text-align:left}.table-body .cell.center[data-v-1aab6f12]{text-align:center}.table-body .cell.left[data-v-1aab6f12]{text-align:left}.table-body .cell.left .wrap[data-v-1aab6f12]{justify-content:flex-start}.table-body .cell.right[data-v-1aab6f12]{text-align:right}.table-body .cell.right .wrap[data-v-1aab6f12]{justify-content:flex-end}.table-body .cell[data-v-1aab6f12]:last-child{border-right:0}.table-body .cell.tree-td[data-v-1aab6f12]{text-align:left!important}.table-resize-line[data-v-1aab6f12]{position:absolute;top:0;bottom:0;width:1px;border-right:1px solid #cfcfcf}.dark .table-resize-line[data-v-1aab6f12]{border-right:1px solid}.vscroll-spacer[data-v-1aab6f12]{opacity:0;clear:both}[v-cloak][data-v-1aab6f12]{display:none}.ev-checkbox[data-v-1aab6f12]{margin:0}.non-border[data-v-1aab6f12]{border:none!important}.is-empty[data-v-1aab6f12]{height:30px;text-align:center}", ""]);
-// Exports
-module.exports = exports;
-
-
 /***/ }),
 
 /***/ "4930":
@@ -5955,21 +5945,6 @@ module.exports = function from(arrayLike /* , mapfn = undefined, thisArg = undef
 };
 
 
-/***/ }),
-
-/***/ "4e26":
-/***/ (function(module, exports, __webpack_require__) {
-
-// style-loader: Adds some css to the DOM by adding a <style> tag
-
-// load the styles
-var content = __webpack_require__("0fe5");
-if(typeof content === 'string') content = [[module.i, content, '']];
-if(content.locals) module.exports = content.locals;
-// add the styles to the DOM
-var add = __webpack_require__("499e").default
-var update = add("18d9403c", content, true, {"sourceMap":false,"shadowMode":false});
-
 /***/ }),
 
 /***/ "4fad":
@@ -6366,6 +6341,17 @@ module.exports = function (it) {
 };
 
 
+/***/ }),
+
+/***/ "5b8e":
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var _node_modules_vue_style_loader_index_js_ref_8_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_8_oneOf_1_1_node_modules_vue_loader_v16_dist_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_2_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_3_node_modules_sass_loader_dist_cjs_js_ref_8_oneOf_1_4_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_v16_dist_index_js_ref_0_1_Select_vue_vue_type_style_index_0_id_67ac0a78_lang_scss__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("1e2f");
+/* harmony import */ var _node_modules_vue_style_loader_index_js_ref_8_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_8_oneOf_1_1_node_modules_vue_loader_v16_dist_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_2_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_3_node_modules_sass_loader_dist_cjs_js_ref_8_oneOf_1_4_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_v16_dist_index_js_ref_0_1_Select_vue_vue_type_style_index_0_id_67ac0a78_lang_scss__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_vue_style_loader_index_js_ref_8_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_8_oneOf_1_1_node_modules_vue_loader_v16_dist_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_2_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_3_node_modules_sass_loader_dist_cjs_js_ref_8_oneOf_1_4_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_v16_dist_index_js_ref_0_1_Select_vue_vue_type_style_index_0_id_67ac0a78_lang_scss__WEBPACK_IMPORTED_MODULE_0__);
+/* unused harmony reexport * */
+
+
 /***/ }),
 
 /***/ "5c6c":
@@ -6534,6 +6520,21 @@ module.exports = !nativeAssign || fails(function () {
 } : nativeAssign;
 
 
+/***/ }),
+
+/***/ "6143":
+/***/ (function(module, exports, __webpack_require__) {
+
+// style-loader: Adds some css to the DOM by adding a <style> tag
+
+// load the styles
+var content = __webpack_require__("f16d");
+if(typeof content === 'string') content = [[module.i, content, '']];
+if(content.locals) module.exports = content.locals;
+// add the styles to the DOM
+var add = __webpack_require__("499e").default
+var update = add("fba8e534", content, true, {"sourceMap":false,"shadowMode":false});
+
 /***/ }),
 
 /***/ "6263":
@@ -6924,7 +6925,7 @@ module.exports = {
 var ___CSS_LOADER_API_IMPORT___ = __webpack_require__("24fb");
 exports = ___CSS_LOADER_API_IMPORT___(false);
 // Module
-exports.push([module.i, ".ev-chart-wrapper{display:block}.ev-chart-container,.ev-chart-wrapper{position:relative;width:100%;height:100%}.ev-chart-container{overflow:hidden}.ev-chart-title{top:0;left:0;width:100%;padding-left:10px;word-wrap:normal;white-space:nowrap;text-overflow:ellipsis;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.ev-chart-legend,.ev-chart-title{position:absolute;overflow:hidden}.ev-chart-legend-box{overflow-x:hidden;overflow-y:auto}.ev-chart-legend-container{position:relative;overflow:hidden}.ev-chart-legend-color,.ev-chart-legend-color--point-line{position:absolute;top:50%;left:0;transform:translateY(-50%);width:18px;height:4px}.ev-chart-legend-color--point-line:after{display:inline-block;position:absolute;top:-2px;left:5px;width:8px;height:8px;content:\" \";border-radius:50%;background-color:inherit}.ev-chart-legend-name{position:absolute;top:50%;left:0;width:100%;text-align:left;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;font-size:12px;margin-left:24px;padding-right:16px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;font-weight:400;transform:translateY(-50%)}.ev-chart-legend-name:hover{font-weight:700}.ev-chart-legend-value{float:right;text-align:left;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.ev-chart-resize-bar{position:absolute;background:transparent;opacity:.5;z-index:10}.ev-chart-resize-bar:hover,.ev-chart-resize-ghost{background-color:#e2e2e2}.ev-chart-resize-ghost{position:absolute;width:4px;height:100%;cursor:col-resize;opacity:.5}.ev-chart-resize-ghost.horizontal{width:100%;height:4px;cursor:row-resize}.ev-chart-tooltip{position:absolute;z-index:850;top:0;left:0;overflow-y:hidden;overflow-x:hidden;border-radius:8px}.ev-chart-tooltip .ev-chart-tooltip-header{padding:8px 16px 0 16px;font-family:Roboto,serif;overflow:hidden;font-size:16px}.ev-chart-tooltip .ev-chart-tooltip-header--wrap{word-wrap:break-word}.ev-chart-tooltip .ev-chart-tooltip-header--ellipsis{text-overflow:ellipsis;white-space:nowrap}.ev-chart-tooltip .ev-chart-tooltip-body{overflow-x:hidden;overflow-y:hidden}", ""]);
+exports.push([module.i, ".ev-chart-wrapper{display:block}.ev-chart-container,.ev-chart-wrapper{position:relative;width:100%;height:100%}.ev-chart-container{overflow:hidden}.ev-chart-title{top:0;left:0;width:100%;padding-left:10px;word-wrap:normal;white-space:nowrap;text-overflow:ellipsis;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.ev-chart-legend,.ev-chart-title{position:absolute;overflow:hidden}.ev-chart-legend-box{overflow-x:hidden;overflow-y:auto}.ev-chart-legend-container{position:relative}.ev-chart-legend-color,.ev-chart-legend-color--point-line{position:absolute;top:50%;left:0;transform:translateY(-50%);width:18px;height:4px}.ev-chart-legend-color--point-line:after{display:inline-block;position:absolute;top:-2px;left:5px;width:8px;height:8px;content:\" \";border-radius:50%;background-color:inherit}.ev-chart-legend-name{position:absolute;top:50%;left:0;width:100%;text-align:left;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;font-size:12px;margin-left:24px;padding-right:16px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;font-weight:400;transform:translateY(-50%)}.ev-chart-legend-name:hover{font-weight:700}.ev-chart-legend-value{float:right;text-align:left;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.ev-chart-legend-line{position:relative;width:100%;height:100%;border-radius:10px;background-color:#e3e3e3}.ev-chart-legend-line-layer,.ev-chart-legend-thumb{position:absolute;top:0;left:0;width:100%;height:100%}.ev-chart-legend-thumb{border-radius:10px;color:#000}.ev-chart-legend-handle{position:absolute;top:0;left:0;cursor:pointer}.ev-chart-legend-handle.dragging,.ev-chart-legend-handle:hover{transform:scale(1.2)}.ev-chart-legend-handle-btn{width:100%;height:100%;border-radius:50%;background-color:#fff;transition:transform .1s ease-in-out;box-sizing:border-box;border:2px solid #979797}.ev-chart-legend-handle-btn-color{position:absolute;top:4px;left:4px;width:calc(100% - 8px);height:calc(100% - 8px);border-radius:50%}.ev-chart-legend-label{position:absolute;font-size:12px;line-height:1.4em}.ev-chart-legend-label-text{display:block;white-space:nowrap}.ev-chart-legend-overlay{position:absolute;top:0;left:0;width:100%;height:100%}.ev-chart-legend-overlay .ev-chart-legend-overlay-item{position:absolute;top:1px;left:1px;border-radius:50%;border:1px solid #fff;background-color:transparent}.ev-chart-legend-overlay .ev-chart-legend-overlay-tooltip{position:absolute;font-size:12px;line-height:1.4em}.ev-chart-resize-bar{position:absolute;background:transparent;opacity:.5;z-index:10}.ev-chart-resize-bar:hover,.ev-chart-resize-ghost{background-color:#e2e2e2}.ev-chart-resize-ghost{position:absolute;width:4px;height:100%;cursor:col-resize;opacity:.5}.ev-chart-resize-ghost.horizontal{width:100%;height:4px;cursor:row-resize}.ev-chart-tooltip{position:absolute;z-index:850;top:0;left:0;overflow-y:hidden;overflow-x:hidden;border-radius:8px}.ev-chart-tooltip .ev-chart-tooltip-header{padding:8px 16px 0 16px;font-family:Roboto,serif;overflow:hidden;font-size:16px}.ev-chart-tooltip .ev-chart-tooltip-header--wrap{word-wrap:break-word}.ev-chart-tooltip .ev-chart-tooltip-header--ellipsis{text-overflow:ellipsis;white-space:nowrap}.ev-chart-tooltip .ev-chart-tooltip-body{overflow-x:hidden;overflow-y:hidden}", ""]);
 // Exports
 module.exports = exports;
 
@@ -7266,29 +7267,6 @@ module.exports = [
 /* unused harmony reexport * */
 
 
-/***/ }),
-
-/***/ "79ef":
-/***/ (function(module, exports, __webpack_require__) {
-
-// Imports
-var ___CSS_LOADER_API_IMPORT___ = __webpack_require__("24fb");
-var ___CSS_LOADER_GET_URL_IMPORT___ = __webpack_require__("1de5");
-var ___CSS_LOADER_URL_IMPORT_0___ = __webpack_require__("f051");
-var ___CSS_LOADER_URL_IMPORT_1___ = __webpack_require__("0924");
-var ___CSS_LOADER_URL_IMPORT_2___ = __webpack_require__("eb91");
-var ___CSS_LOADER_URL_IMPORT_3___ = __webpack_require__("a884");
-exports = ___CSS_LOADER_API_IMPORT___(false);
-var ___CSS_LOADER_URL_REPLACEMENT_0___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_0___);
-var ___CSS_LOADER_URL_REPLACEMENT_1___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_1___);
-var ___CSS_LOADER_URL_REPLACEMENT_2___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_2___);
-var ___CSS_LOADER_URL_REPLACEMENT_3___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_3___);
-// Module
-exports.push([module.i, ".table[data-v-9801c414]{position:relative;width:100%;height:100%;padding-top:33px}.table.non-header[data-v-9801c414]{padding-top:0}.table .table-header[data-v-9801c414]{overflow:hidden;position:absolute;top:0;width:100%;height:33px;border-top:2px solid #7f7f7f;border-bottom:1px solid #cfcfcf}.dark .table .table-header[data-v-9801c414]{border-top:2px solid;border-bottom:1px solid}.table .table-header.non-border[data-v-9801c414]{border-bottom:2px solid #7f7f7f!important}.column-list[data-v-9801c414]{width:100%;white-space:nowrap;list-style-type:none}.column[data-v-9801c414],.column-list[data-v-9801c414]{position:relative;height:100%}.column[data-v-9801c414]{display:inline-flex;padding:0 10px;line-height:30px;justify-content:center;align-items:center;text-align:center;vertical-align:top;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;border-right:1px solid #cfcfcf}.dark .column[data-v-9801c414]{border-right:1px solid}.column[data-v-9801c414]:last-child{border-right:0;margin-right:20px}.column:last-child .column-resize[data-v-9801c414]{cursor:default!important}.column .sort-icon[data-v-9801c414]{display:inline-block;float:right;font-size:14px;line-height:30px}.column .ev-icon-filter[data-v-9801c414]{font-size:13px;color:#005cc8}.column-name[data-v-9801c414]{display:inline-block;float:left;overflow:hidden;text-overflow:ellipsis;font-weight:700;font-size:14px}.column-filter[data-v-9801c414]{display:none;position:absolute;right:0;background-color:transparent}.column-filter i[data-v-9801c414]{margin-right:2px;font-size:14px;vertical-align:middle}.column:hover .column-filter[data-v-9801c414]{display:block;cursor:pointer}.column-filter-status[data-v-9801c414]{position:absolute;left:0;background-color:transparent}.column-filter-status .ei[data-v-9801c414]{font-size:10px;vertical-align:top}.column-resize[data-v-9801c414]{position:absolute;bottom:0;right:-5px;width:10px;height:100%}.column-resize[data-v-9801c414]:hover{cursor:col-resize}.table-body[data-v-9801c414]{position:relative;width:100%;height:100%;overflow:auto;overflow-anchor:none}.table-body table[data-v-9801c414]{clear:both;border-spacing:0;border-collapse:collapse;width:inherit}.table-body.stripe tr[data-v-9801c414]:nth-child(2n){background:hsla(0,0%,89.8%,.6)}.table-body.bottom-border[data-v-9801c414]{border-bottom:1px solid #cfcfcf}.dark .table-body.bottom-border[data-v-9801c414]{border-bottom:1px solid}.table-body .row[data-v-9801c414]{white-space:nowrap;border-bottom:1px solid #cfcfcf}.dark .table-body .row[data-v-9801c414]{border-bottom:1px solid}.table-body .row.selected[data-v-9801c414]{background:rgba(219,240,249,.6)!important;color:inherit!important;font-size:inherit!important}.dark .table-body .row.selected[data-v-9801c414]{background:!important;color:inherit!important;font-size:inherit!important}.table-body .row.highlight[data-v-9801c414]{background:#5ab7ff;color:#fff}.table-body .cell[data-v-9801c414]{display:inline-block;padding:0 10px;text-align:center;max-width:100%;white-space:nowrap;text-overflow:ellipsis;border-right:1px solid #cfcfcf}.dark .table-body .cell[data-v-9801c414]{border-right:1px solid}.table-body .cell div[data-v-9801c414]{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.table-body .cell.row-checkbox[data-v-9801c414]{display:inline-flex;justify-content:center;align-items:center}.table-body .cell.render[data-v-9801c414]{overflow:initial}.table-body .cell.float[data-v-9801c414],.table-body .cell.number[data-v-9801c414]{text-align:right}.table-body .cell.string[data-v-9801c414],.table-body .cell.stringNumber[data-v-9801c414]{text-align:left}.table-body .cell.center[data-v-9801c414]{text-align:center}.table-body .cell.left[data-v-9801c414]{text-align:left}.table-body .cell.left .wrap[data-v-9801c414]{justify-content:flex-start}.table-body .cell.right[data-v-9801c414]{text-align:right}.table-body .cell.right .wrap[data-v-9801c414]{justify-content:flex-end}.table-body .cell[data-v-9801c414]:last-child{border-right:0}.table-resize-line[data-v-9801c414]{position:absolute;top:0;bottom:0;width:1px;border-right:1px solid #cfcfcf}.dark .table-resize-line[data-v-9801c414]{border-right:1px solid}.vscroll-spacer[data-v-9801c414]{opacity:0;clear:both}[v-cloak][data-v-9801c414]{display:none}.ev-checkbox[data-v-9801c414]{margin:0}.non-border[data-v-9801c414]{border:none!important}.is-empty[data-v-9801c414]{height:30px;text-align:center}.postgresql[data-v-9801c414]{background:url(" + ___CSS_LOADER_URL_REPLACEMENT_0___ + ") no-repeat 50%}.oracle[data-v-9801c414]{background:url(" + ___CSS_LOADER_URL_REPLACEMENT_1___ + ") no-repeat 50%}.mongodb[data-v-9801c414]{background:url(" + ___CSS_LOADER_URL_REPLACEMENT_2___ + ") no-repeat 50%}.mysql[data-v-9801c414]{background:url(" + ___CSS_LOADER_URL_REPLACEMENT_3___ + ") no-repeat 50%}", ""]);
-// Exports
-module.exports = exports;
-
-
 /***/ }),
 
 /***/ "7b0b":
@@ -7957,7 +7935,7 @@ $({ target: 'Number', stat: true }, {
 /***/ "9224":
 /***/ (function(module) {
 
-module.exports = JSON.parse("{\"a\":\"3.3.19\"}");
+module.exports = JSON.parse("{\"a\":\"3.3.22\"}");
 
 /***/ }),
 
@@ -9851,17 +9829,6 @@ module.exports = {
 };
 
 
-/***/ }),
-
-/***/ "af65":
-/***/ (function(module, __webpack_exports__, __webpack_require__) {
-
-"use strict";
-/* harmony import */ var _node_modules_vue_style_loader_index_js_ref_8_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_8_oneOf_1_1_node_modules_vue_loader_v16_dist_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_2_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_3_node_modules_sass_loader_dist_cjs_js_ref_8_oneOf_1_4_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_v16_dist_index_js_ref_0_1_TreeGrid_vue_vue_type_style_index_0_id_1aab6f12_lang_scss_scoped_true__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("044f");
-/* harmony import */ var _node_modules_vue_style_loader_index_js_ref_8_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_8_oneOf_1_1_node_modules_vue_loader_v16_dist_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_2_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_3_node_modules_sass_loader_dist_cjs_js_ref_8_oneOf_1_4_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_v16_dist_index_js_ref_0_1_TreeGrid_vue_vue_type_style_index_0_id_1aab6f12_lang_scss_scoped_true__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_vue_style_loader_index_js_ref_8_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_8_oneOf_1_1_node_modules_vue_loader_v16_dist_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_2_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_3_node_modules_sass_loader_dist_cjs_js_ref_8_oneOf_1_4_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_v16_dist_index_js_ref_0_1_TreeGrid_vue_vue_type_style_index_0_id_1aab6f12_lang_scss_scoped_true__WEBPACK_IMPORTED_MODULE_0__);
-/* unused harmony reexport * */
-
-
 /***/ }),
 
 /***/ "afaf":
@@ -10291,21 +10258,6 @@ exports.push([module.i, ".table[data-v-fd0ffe52]{position:relative;width:100%;he
 module.exports = exports;
 
 
-/***/ }),
-
-/***/ "b9ad":
-/***/ (function(module, exports, __webpack_require__) {
-
-// style-loader: Adds some css to the DOM by adding a <style> tag
-
-// load the styles
-var content = __webpack_require__("79ef");
-if(typeof content === 'string') content = [[module.i, content, '']];
-if(content.locals) module.exports = content.locals;
-// add the styles to the DOM
-var add = __webpack_require__("499e").default
-var update = add("6709888e", content, true, {"sourceMap":false,"shadowMode":false});
-
 /***/ }),
 
 /***/ "bac3":
@@ -10796,17 +10748,6 @@ module.exports = function (namespace, method) {
 };
 
 
-/***/ }),
-
-/***/ "d11a":
-/***/ (function(module, __webpack_exports__, __webpack_require__) {
-
-"use strict";
-/* harmony import */ var _node_modules_vue_style_loader_index_js_ref_8_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_8_oneOf_1_1_node_modules_vue_loader_v16_dist_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_2_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_3_node_modules_sass_loader_dist_cjs_js_ref_8_oneOf_1_4_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_v16_dist_index_js_ref_0_1_Grid_vue_vue_type_style_index_0_id_9801c414_lang_scss_scoped_true__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("b9ad");
-/* harmony import */ var _node_modules_vue_style_loader_index_js_ref_8_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_8_oneOf_1_1_node_modules_vue_loader_v16_dist_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_2_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_3_node_modules_sass_loader_dist_cjs_js_ref_8_oneOf_1_4_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_v16_dist_index_js_ref_0_1_Grid_vue_vue_type_style_index_0_id_9801c414_lang_scss_scoped_true__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_vue_style_loader_index_js_ref_8_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_8_oneOf_1_1_node_modules_vue_loader_v16_dist_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_2_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_3_node_modules_sass_loader_dist_cjs_js_ref_8_oneOf_1_4_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_v16_dist_index_js_ref_0_1_Grid_vue_vue_type_style_index_0_id_9801c414_lang_scss_scoped_true__WEBPACK_IMPORTED_MODULE_0__);
-/* unused harmony reexport * */
-
-
 /***/ }),
 
 /***/ "d1e7":
@@ -11591,6 +11532,17 @@ module.exports = function (target, src, options) {
 };
 
 
+/***/ }),
+
+/***/ "e35c":
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var _node_modules_vue_style_loader_index_js_ref_8_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_8_oneOf_1_1_node_modules_vue_loader_v16_dist_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_2_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_3_node_modules_sass_loader_dist_cjs_js_ref_8_oneOf_1_4_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_v16_dist_index_js_ref_0_1_Grid_vue_vue_type_style_index_0_id_96cfa08e_lang_scss_scoped_true__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("6143");
+/* harmony import */ var _node_modules_vue_style_loader_index_js_ref_8_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_8_oneOf_1_1_node_modules_vue_loader_v16_dist_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_2_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_3_node_modules_sass_loader_dist_cjs_js_ref_8_oneOf_1_4_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_v16_dist_index_js_ref_0_1_Grid_vue_vue_type_style_index_0_id_96cfa08e_lang_scss_scoped_true__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_vue_style_loader_index_js_ref_8_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_8_oneOf_1_1_node_modules_vue_loader_v16_dist_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_2_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_3_node_modules_sass_loader_dist_cjs_js_ref_8_oneOf_1_4_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_v16_dist_index_js_ref_0_1_Grid_vue_vue_type_style_index_0_id_96cfa08e_lang_scss_scoped_true__WEBPACK_IMPORTED_MODULE_0__);
+/* unused harmony reexport * */
+
+
 /***/ }),
 
 /***/ "e371":
@@ -11826,6 +11778,17 @@ module.exports = function (exec) {
 };
 
 
+/***/ }),
+
+/***/ "e67b":
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var _node_modules_vue_style_loader_index_js_ref_8_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_8_oneOf_1_1_node_modules_vue_loader_v16_dist_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_2_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_3_node_modules_sass_loader_dist_cjs_js_ref_8_oneOf_1_4_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_v16_dist_index_js_ref_0_1_TreeGrid_vue_vue_type_style_index_0_id_0c99a380_lang_scss_scoped_true__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("1a54");
+/* harmony import */ var _node_modules_vue_style_loader_index_js_ref_8_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_8_oneOf_1_1_node_modules_vue_loader_v16_dist_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_2_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_3_node_modules_sass_loader_dist_cjs_js_ref_8_oneOf_1_4_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_v16_dist_index_js_ref_0_1_TreeGrid_vue_vue_type_style_index_0_id_0c99a380_lang_scss_scoped_true__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_vue_style_loader_index_js_ref_8_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_8_oneOf_1_1_node_modules_vue_loader_v16_dist_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_2_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_3_node_modules_sass_loader_dist_cjs_js_ref_8_oneOf_1_4_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_v16_dist_index_js_ref_0_1_TreeGrid_vue_vue_type_style_index_0_id_0c99a380_lang_scss_scoped_true__WEBPACK_IMPORTED_MODULE_0__);
+/* unused harmony reexport * */
+
+
 /***/ }),
 
 /***/ "e6cf":
@@ -12390,6 +12353,29 @@ module.exports.f = function (C) {
 };
 
 
+/***/ }),
+
+/***/ "f16d":
+/***/ (function(module, exports, __webpack_require__) {
+
+// Imports
+var ___CSS_LOADER_API_IMPORT___ = __webpack_require__("24fb");
+var ___CSS_LOADER_GET_URL_IMPORT___ = __webpack_require__("1de5");
+var ___CSS_LOADER_URL_IMPORT_0___ = __webpack_require__("f051");
+var ___CSS_LOADER_URL_IMPORT_1___ = __webpack_require__("0924");
+var ___CSS_LOADER_URL_IMPORT_2___ = __webpack_require__("eb91");
+var ___CSS_LOADER_URL_IMPORT_3___ = __webpack_require__("a884");
+exports = ___CSS_LOADER_API_IMPORT___(false);
+var ___CSS_LOADER_URL_REPLACEMENT_0___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_0___);
+var ___CSS_LOADER_URL_REPLACEMENT_1___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_1___);
+var ___CSS_LOADER_URL_REPLACEMENT_2___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_2___);
+var ___CSS_LOADER_URL_REPLACEMENT_3___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_3___);
+// Module
+exports.push([module.i, ".table[data-v-96cfa08e]{position:relative;width:100%;height:100%;padding-top:33px}.table.non-header[data-v-96cfa08e]{padding-top:0}.table .table-header[data-v-96cfa08e]{overflow:hidden;position:absolute;top:0;width:100%;height:33px;border-top:2px solid #7f7f7f;border-bottom:1px solid #cfcfcf}.dark .table .table-header[data-v-96cfa08e]{border-top:2px solid;border-bottom:1px solid}.table .table-header.non-border[data-v-96cfa08e]{border-bottom:2px solid #7f7f7f!important}.column-list[data-v-96cfa08e]{width:100%;white-space:nowrap;list-style-type:none}.column[data-v-96cfa08e],.column-list[data-v-96cfa08e]{position:relative;height:100%}.column[data-v-96cfa08e]{display:inline-flex;padding:0 10px;line-height:30px;justify-content:center;align-items:center;text-align:center;vertical-align:top;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;border-right:1px solid #cfcfcf}.dark .column[data-v-96cfa08e]{border-right:1px solid}.column[data-v-96cfa08e]:last-child{border-right:0;margin-right:20px}.column:last-child .column-resize[data-v-96cfa08e]{cursor:default!important}.column .sort-icon[data-v-96cfa08e]{display:inline-block;float:right;font-size:14px;line-height:30px}.column .ev-icon-filter[data-v-96cfa08e]{font-size:13px;color:#005cc8}.column-name[data-v-96cfa08e]{display:inline-block;float:left;overflow:hidden;text-overflow:ellipsis;font-weight:700;font-size:14px}.column-filter[data-v-96cfa08e]{display:none;position:absolute;right:0;background-color:transparent}.column-filter i[data-v-96cfa08e]{margin-right:2px;font-size:14px;vertical-align:middle}.column:hover .column-filter[data-v-96cfa08e]{display:block;cursor:pointer}.column-filter-status[data-v-96cfa08e]{position:absolute;left:0;background-color:transparent}.column-filter-status .ei[data-v-96cfa08e]{font-size:10px;vertical-align:top}.column-resize[data-v-96cfa08e]{position:absolute;bottom:0;right:-5px;width:10px;height:100%}.column-resize[data-v-96cfa08e]:hover{cursor:col-resize}.table-body[data-v-96cfa08e]{position:relative;width:100%;height:100%;overflow:auto;overflow-anchor:none}.table-body table[data-v-96cfa08e]{clear:both;border-spacing:0;border-collapse:collapse;width:inherit}.table-body.stripe tr[data-v-96cfa08e]:nth-child(2n){background:hsla(0,0%,89.8%,.6)}.table-body.bottom-border[data-v-96cfa08e]{border-bottom:1px solid #cfcfcf}.dark .table-body.bottom-border[data-v-96cfa08e]{border-bottom:1px solid}.table-body .row[data-v-96cfa08e]{white-space:nowrap;border-bottom:1px solid #cfcfcf}.dark .table-body .row[data-v-96cfa08e]{border-bottom:1px solid}.table-body .row.selected[data-v-96cfa08e]{background:rgba(219,240,249,.6)!important;color:inherit!important;font-size:inherit!important}.dark .table-body .row.selected[data-v-96cfa08e]{background:!important;color:inherit!important;font-size:inherit!important}.table-body .row.highlight[data-v-96cfa08e]{background:#5ab7ff;color:#fff}.table-body .cell[data-v-96cfa08e]{display:inline-block;padding:0 10px;text-align:center;max-width:100%;white-space:nowrap;text-overflow:ellipsis;border-right:1px solid #cfcfcf}.dark .table-body .cell[data-v-96cfa08e]{border-right:1px solid}.table-body .cell div[data-v-96cfa08e]{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.table-body .cell.row-checkbox[data-v-96cfa08e]{display:inline-flex;justify-content:center;align-items:center}.table-body .cell.render[data-v-96cfa08e]{overflow:initial}.table-body .cell.float[data-v-96cfa08e],.table-body .cell.number[data-v-96cfa08e]{text-align:right}.table-body .cell.string[data-v-96cfa08e],.table-body .cell.stringNumber[data-v-96cfa08e]{text-align:left}.table-body .cell.center[data-v-96cfa08e]{text-align:center}.table-body .cell.left[data-v-96cfa08e]{text-align:left}.table-body .cell.left .wrap[data-v-96cfa08e]{justify-content:flex-start}.table-body .cell.right[data-v-96cfa08e]{text-align:right}.table-body .cell.right .wrap[data-v-96cfa08e]{justify-content:flex-end}.table-body .cell[data-v-96cfa08e]:last-child{border-right:0}.table-resize-line[data-v-96cfa08e]{position:absolute;top:0;bottom:0;width:1px;border-right:1px solid #cfcfcf}.dark .table-resize-line[data-v-96cfa08e]{border-right:1px solid}.vscroll-spacer[data-v-96cfa08e]{opacity:0;clear:both}[v-cloak][data-v-96cfa08e]{display:none}.ev-checkbox[data-v-96cfa08e]{margin:0}.non-border[data-v-96cfa08e]{border:none!important}.is-empty[data-v-96cfa08e]{height:30px;text-align:center}.postgresql[data-v-96cfa08e]{background:url(" + ___CSS_LOADER_URL_REPLACEMENT_0___ + ") no-repeat 50%}.oracle[data-v-96cfa08e]{background:url(" + ___CSS_LOADER_URL_REPLACEMENT_1___ + ") no-repeat 50%}.mongodb[data-v-96cfa08e]{background:url(" + ___CSS_LOADER_URL_REPLACEMENT_2___ + ") no-repeat 50%}.mysql[data-v-96cfa08e]{background:url(" + ___CSS_LOADER_URL_REPLACEMENT_3___ + ") no-repeat 50%}", ""]);
+// Exports
+module.exports = exports;
+
+
 /***/ }),
 
 /***/ "f183":
@@ -12530,6 +12516,20 @@ module.exports = function (key) {
 };
 
 
+/***/ }),
+
+/***/ "f99b":
+/***/ (function(module, exports, __webpack_require__) {
+
+// Imports
+var ___CSS_LOADER_API_IMPORT___ = __webpack_require__("24fb");
+exports = ___CSS_LOADER_API_IMPORT___(false);
+// Module
+exports.push([module.i, ".ev-select{display:block;position:relative;width:100%;border-radius:4px;cursor:pointer}.ev-select .ev-input,.ev-select .ev-textarea{width:100%;outline:0;background-color:transparent;border-radius:4px;transition:border .3s ease-in-out;border:1px solid #b2b2b2;color:#0d0d0d}.dark .ev-select .ev-input,.dark .ev-select .ev-textarea{border:1px solid #666;color:#fff}.ev-select .ev-input:focus,.ev-select .ev-input:hover,.ev-select .ev-textarea:focus,.ev-select .ev-textarea:hover{border:1px solid #1a6afe}.dark .ev-select .ev-input:focus,.dark .ev-select .ev-input:hover,.dark .ev-select .ev-textarea:focus,.dark .ev-select .ev-textarea:hover{border:1px solid #007aff}.ev-select .ev-input{height:35px;padding:0 15px}.ev-select .ev-textarea{height:100px;padding:5px;resize:none}.ev-select.readonly .ev-input,.ev-select.readonly .ev-select,.ev-select.readonly .ev-textarea{background-color:hsla(0,0%,69.8%,.1)}.dark .ev-select.readonly .ev-input,.dark .ev-select.readonly .ev-select,.dark .ev-select.readonly .ev-textarea{background-color:hsla(0,0%,40%,.3)}.ev-select.readonly .ev-input:focus,.ev-select.readonly .ev-input:hover,.ev-select.readonly .ev-select:focus,.ev-select.readonly .ev-select:hover,.ev-select.readonly .ev-textarea:focus,.ev-select.readonly .ev-textarea:hover{border:1px solid hsla(0,0%,69.8%,.5)}.dark .ev-select.readonly .ev-input:focus,.dark .ev-select.readonly .ev-input:hover,.dark .ev-select.readonly .ev-select:focus,.dark .ev-select.readonly .ev-select:hover,.dark .ev-select.readonly .ev-textarea:focus,.dark .ev-select.readonly .ev-textarea:hover{border:1px solid hsla(0,0%,40%,.5)}.ev-select.readonly.ev-input-number:hover .ev-input,.ev-select.readonly.ev-input-number:hover .ev-textarea,.ev-select.readonly.ev-select:hover .ev-input,.ev-select.readonly.ev-select:hover .ev-textarea,.ev-select.readonly.ev-text-field:hover .ev-input,.ev-select.readonly.ev-text-field:hover .ev-textarea{border:1px solid hsla(0,0%,69.8%,.5)}.dark .ev-select.readonly.ev-input-number:hover .ev-input,.dark .ev-select.readonly.ev-input-number:hover .ev-textarea,.dark .ev-select.readonly.ev-select:hover .ev-input,.dark .ev-select.readonly.ev-select:hover .ev-textarea,.dark .ev-select.readonly.ev-text-field:hover .ev-input,.dark .ev-select.readonly.ev-text-field:hover .ev-textarea{border:1px solid hsla(0,0%,40%,.5)}.ev-select.disabled.ev-input-number,.ev-select.disabled.ev-input-number *,.ev-select.disabled.ev-select,.ev-select.disabled.ev-select *,.ev-select.disabled.ev-text-field,.ev-select.disabled.ev-text-field *{cursor:not-allowed!important}.ev-select.disabled.ev-input-number:hover .ev-input,.ev-select.disabled.ev-input-number:hover .ev-textarea,.ev-select.disabled.ev-select:hover .ev-input,.ev-select.disabled.ev-select:hover .ev-textarea,.ev-select.disabled.ev-text-field:hover .ev-input,.ev-select.disabled.ev-text-field:hover .ev-textarea{border:1px solid #ff3b30}.dark .ev-select.disabled.ev-input-number:hover .ev-input,.dark .ev-select.disabled.ev-input-number:hover .ev-textarea,.dark .ev-select.disabled.ev-select:hover .ev-input,.dark .ev-select.disabled.ev-select:hover .ev-textarea,.dark .ev-select.disabled.ev-text-field:hover .ev-input,.dark .ev-select.disabled.ev-text-field:hover .ev-textarea{border:1px solid #ff453a}.ev-select.disabled .ev-input,.ev-select.disabled .ev-textarea{border:1px solid #b2b2b2;background-color:hsla(0,0%,69.8%,.1);color:#b2b2b2}.dark .ev-select.disabled .ev-input,.dark .ev-select.disabled .ev-textarea{border:1px solid #555;background-color:hsla(0,0%,40%,.3);color:#555}.ev-select.disabled .ev-input:focus,.ev-select.disabled .ev-input:hover,.ev-select.disabled .ev-textarea:focus,.ev-select.disabled .ev-textarea:hover{border:1px solid #ff3b30}.dark .ev-select.disabled .ev-input:focus,.dark .ev-select.disabled .ev-input:hover,.dark .ev-select.disabled .ev-textarea:focus,.dark .ev-select.disabled .ev-textarea:hover{border:1px solid #ff453a}.ev-select.error .ev-input,.ev-select.error .ev-textarea{border:1px solid #ff3b30}.dark .ev-select.error .ev-input,.dark .ev-select.error .ev-textarea{border:1px solid #ff453a}.ev-select.error .ev-input:focus,.ev-select.error .ev-input:hover,.ev-select.error .ev-textarea:focus,.ev-select.error .ev-textarea:hover{border:1px solid rgba(255,59,48,.5)}.dark .ev-select.error .ev-input:focus,.dark .ev-select.error .ev-input:hover,.dark .ev-select.error .ev-textarea:focus,.dark .ev-select.error .ev-textarea:hover{border:1px solid rgba(255,69,58,.5)}.ev-select.error.ev-input-number:hover .ev-input,.ev-select.error.ev-input-number:hover .ev-textarea,.ev-select.error.ev-text-field:hover .ev-input,.ev-select.error.ev-text-field:hover .ev-textarea{border:1px solid rgba(255,59,48,.5)}.dark .ev-select.error.ev-input-number:hover .ev-input,.dark .ev-select.error.ev-input-number:hover .ev-textarea,.dark .ev-select.error.ev-text-field:hover .ev-input,.dark .ev-select.error.ev-text-field:hover .ev-textarea{border:1px solid rgba(255,69,58,.5)}.ev-select__wrapper{position:relative}.ev-select .ev-input{padding:0 30px 0 15px;border:1px solid #b2b2b2;cursor:pointer}.ev-select .ev-input-suffix,.ev-select .ev-input.multiple{position:absolute;height:100%}.ev-select .ev-input-suffix{display:flex;top:0;right:5px;align-items:center}.ev-select .ev-input-suffix:hover{color:#409eff}.ev-select .ev-input-suffix-arrow{transform:rotate(0deg);transition-duration:.3s}.ev-select .ev-input-suffix-arrow.selected{transform:rotate(180deg)}.ev-select .ev-select-tag-wrapper{display:flex;width:100%;height:100%;padding:3px 0;min-height:35px;flex-wrap:wrap;align-items:center;z-index:100}.ev-select-tag{display:flex;position:relative;height:24px;padding:0 19px 0 8px;margin:2px 0 2px 6px;background-color:#f4f4f5;align-items:center;border:1px solid #e9e9eb;border-radius:4px;color:#909399;font-size:12px;cursor:auto}.ev-select-tag.num{padding-right:8px}.ev-select-tag .ev-tag-suffix{display:flex;position:absolute;top:0;right:3px;height:100%;align-items:center;color:#0d0d0d;cursor:pointer}.ev-select-tag .ev-tag-suffix:hover{color:#409eff}.ev-select-dropbox-wrapper{height:0}.ev-select-dropbox{position:absolute;width:100%;max-height:175px;background-color:#fcfcfc;border:1px solid #e4e7ed;color:#606266;box-shadow:0 2px 12px 0 rgba(0,0,0,.1);border-radius:4px;z-index:100;cursor:pointer;overflow:hidden}.ev-select-dropbox ul{list-style:none}.ev-select-dropbox li{height:35px;line-height:35px}.ev-select-dropbox .ev-input-query{width:100%;min-height:35px;padding:0 30px 0 15px;border:0;border-bottom:1px solid #b2b2b2;outline:0;font-size:14px;background-color:transparent}.ev-select-dropbox .ev-select-dropbox-list{width:100%;max-height:140px;overflow-y:auto}.ev-select-dropbox-item{padding:0 15px;overflow:hidden;text-overflow:ellipsis;font-size:15px;color:#0d0d0d;white-space:nowrap;cursor:pointer}.ev-select-dropbox-item:hover{opacity:.85}.ev-select-dropbox-item.selected{color:#ebebeb;background-color:#730ef4}.ev-select-dropbox-item.disabled{opacity:1;color:#c0c4cc}", ""]);
+// Exports
+module.exports = exports;
+
+
 /***/ }),
 
 /***/ "f9c7":
@@ -13976,31 +13976,31 @@ RadioGroup.install = function (app) {
 };
 
 /* harmony default export */ var radioGroup = (RadioGroup);
-// CONCATENATED MODULE: ./node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib!./node_modules/vue-loader-v16/dist/templateLoader.js??ref--6!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader-v16/dist??ref--0-1!./src/components/select/Select.vue?vue&type=template&id=9f8a1b7a
+// CONCATENATED MODULE: ./node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib!./node_modules/vue-loader-v16/dist/templateLoader.js??ref--6!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader-v16/dist??ref--0-1!./src/components/select/Select.vue?vue&type=template&id=67ac0a78
 
 
 
-var Selectvue_type_template_id_9f8a1b7a_hoisted_1 = {
+var Selectvue_type_template_id_67ac0a78_hoisted_1 = {
   ref: "selectWrapper",
   class: "ev-select__wrapper"
 };
-var Selectvue_type_template_id_9f8a1b7a_hoisted_2 = {
+var Selectvue_type_template_id_67ac0a78_hoisted_2 = {
   key: 1,
   class: "ev-select-tag-wrapper"
 };
-var Selectvue_type_template_id_9f8a1b7a_hoisted_3 = {
+var Selectvue_type_template_id_67ac0a78_hoisted_3 = {
   class: "ev-tag-name"
 };
 
-var Selectvue_type_template_id_9f8a1b7a_hoisted_4 = /*#__PURE__*/Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("i", {
+var Selectvue_type_template_id_67ac0a78_hoisted_4 = /*#__PURE__*/Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("i", {
   class: "ev-tag-suffix-close ev-icon-error"
 }, null, -1);
 
-var Selectvue_type_template_id_9f8a1b7a_hoisted_5 = {
+var Selectvue_type_template_id_67ac0a78_hoisted_5 = {
   key: 0,
   class: "ev-select-tag"
 };
-var Selectvue_type_template_id_9f8a1b7a_hoisted_6 = {
+var Selectvue_type_template_id_67ac0a78_hoisted_6 = {
   class: "ev-tag-name"
 };
 
@@ -14037,7 +14037,7 @@ var _hoisted_14 = {
 var _hoisted_15 = {
   class: "ev-select-dropbox-item disabled"
 };
-function Selectvue_type_template_id_9f8a1b7a_render(_ctx, _cache, $props, $setup, $data, $options) {
+function Selectvue_type_template_id_67ac0a78_render(_ctx, _cache, $props, $setup, $data, $options) {
   var _directive_clickoutside = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["resolveDirective"])("clickoutside");
 
   return Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withDirectives"])((Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])("div", {
@@ -14046,7 +14046,7 @@ function Selectvue_type_template_id_9f8a1b7a_render(_ctx, _cache, $props, $setup
       selected: $setup.isDropbox,
       disabled: $props.disabled
     }]
-  }, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("div", Selectvue_type_template_id_9f8a1b7a_hoisted_1, [!$props.multiple ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])(external_commonjs_vue_commonjs2_vue_root_Vue_["Fragment"], {
+  }, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("div", Selectvue_type_template_id_67ac0a78_hoisted_1, [!$props.multiple ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])(external_commonjs_vue_commonjs2_vue_root_Vue_["Fragment"], {
     key: 0
   }, [!$props.clearable || !$setup.isClearableIcon ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])("span", {
     key: 0,
@@ -14070,7 +14070,7 @@ function Selectvue_type_template_id_9f8a1b7a_render(_ctx, _cache, $props, $setup
     onClick: _cache[3] || (_cache[3] = function () {
       return $setup.clickSelectInput && $setup.clickSelectInput.apply($setup, arguments);
     })
-  }, null, 8, ["placeholder", "disabled"]), [[external_commonjs_vue_commonjs2_vue_root_Vue_["vModelText"], $setup.selectedModel]])], 64)) : (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])("div", Selectvue_type_template_id_9f8a1b7a_hoisted_2, [!$props.clearable || !$setup.isClearableIcon ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])("span", {
+  }, null, 8, ["placeholder", "disabled"]), [[external_commonjs_vue_commonjs2_vue_root_Vue_["vModelText"], $setup.selectedModel]])], 64)) : (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])("div", Selectvue_type_template_id_67ac0a78_hoisted_2, [!$props.clearable || !$setup.isClearableIcon ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])("span", {
     key: 0,
     class: "ev-input-suffix",
     onClick: _cache[4] || (_cache[4] = function () {
@@ -14095,15 +14095,15 @@ function Selectvue_type_template_id_9f8a1b7a_render(_ctx, _cache, $props, $setup
     return Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])("div", {
       key: item,
       class: "ev-select-tag"
-    }, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("span", Selectvue_type_template_id_9f8a1b7a_hoisted_3, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(item.name), 1), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("span", {
+    }, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("span", Selectvue_type_template_id_67ac0a78_hoisted_3, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(item.name), 1), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("span", {
       class: "ev-tag-suffix",
       onClick: Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withModifiers"])(function ($event) {
         return [$setup.removeMv(item.value), $setup.changeDropboxPosition()];
       }, ["stop"])
-    }, [Selectvue_type_template_id_9f8a1b7a_hoisted_4], 8, ["onClick"])]);
+    }, [Selectvue_type_template_id_67ac0a78_hoisted_4], 8, ["onClick"])]);
   }), 128)) : (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])(external_commonjs_vue_commonjs2_vue_root_Vue_["Fragment"], {
     key: 2
-  }, [$setup.selectedModel.length ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])("div", Selectvue_type_template_id_9f8a1b7a_hoisted_5, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("span", Selectvue_type_template_id_9f8a1b7a_hoisted_6, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])($setup.selectedModel[0].name), 1), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("span", {
+  }, [$setup.selectedModel.length ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])("div", Selectvue_type_template_id_67ac0a78_hoisted_5, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("span", Selectvue_type_template_id_67ac0a78_hoisted_6, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])($setup.selectedModel[0].name), 1), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("span", {
     class: "ev-tag-suffix",
     onClick: _cache[6] || (_cache[6] = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withModifiers"])(function ($event) {
       return [$setup.removeMv($setup.selectedModel[0].value), $setup.changeDropboxPosition()];
@@ -14119,15 +14119,16 @@ function Selectvue_type_template_id_9f8a1b7a_render(_ctx, _cache, $props, $setup
     ref: "dropbox",
     class: "ev-select-dropbox",
     style: $setup.dropboxPosition
-  }, [$props.filterable ? Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withDirectives"])((Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])("input", {
+  }, [$props.filterable ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])("input", {
     key: 0,
-    "onUpdate:modelValue": _cache[8] || (_cache[8] = function ($event) {
-      return $setup.filterTextRef = $event;
-    }),
     type: "text",
     class: "ev-input-query",
-    placeholder: $props.searchPlaceholder
-  }, null, 8, ["placeholder"])), [[external_commonjs_vue_commonjs2_vue_root_Vue_["vModelText"], $setup.filterTextRef]]) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("div", _hoisted_12, [$setup.filteredItems.length ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])("ul", _hoisted_13, [(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(true), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])(external_commonjs_vue_commonjs2_vue_root_Vue_["Fragment"], null, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["renderList"])($setup.filteredItems, function (item, idx) {
+    placeholder: $props.searchPlaceholder,
+    value: $setup.filterTextRef,
+    onInput: _cache[8] || (_cache[8] = function () {
+      return $setup.changeFilterText && $setup.changeFilterText.apply($setup, arguments);
+    })
+  }, null, 40, ["placeholder", "value"])) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("div", _hoisted_12, [$setup.filteredItems.length ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])("ul", _hoisted_13, [(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(true), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])(external_commonjs_vue_commonjs2_vue_root_Vue_["Fragment"], null, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["renderList"])($setup.filteredItems, function (item, idx) {
     return Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])("li", {
       key: "".concat(item.value, "_").concat(idx),
       class: ["ev-select-dropbox-item", {
@@ -14144,7 +14145,7 @@ function Selectvue_type_template_id_9f8a1b7a_render(_ctx, _cache, $props, $setup
     }, null, 2)) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createTextVNode"])(" " + Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(item.name), 1)], 10, ["title", "onClick"]);
   }), 128))])) : (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])("ul", _hoisted_14, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("li", _hoisted_15, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])($props.noMatchingText), 1)]))], 512)], 4)) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true)])], 512)], 2)), [[_directive_clickoutside, $setup.clickOutsideDropbox]]);
 }
-// CONCATENATED MODULE: ./src/components/select/Select.vue?vue&type=template&id=9f8a1b7a
+// CONCATENATED MODULE: ./src/components/select/Select.vue?vue&type=template&id=67ac0a78
 
 // CONCATENATED MODULE: ./src/directives/clickoutside.js
 var clickoutside = {
@@ -14456,10 +14457,20 @@ var uses_useDropdown = function useDropdown(param) {
       return v.name.toUpperCase().includes(trimText.toUpperCase());
     }) || [];
   });
+  /**
+   * filterable 에서 text input 이벤트 핸들러
+   */
+
+  var changeFilterText = function changeFilterText(e) {
+    var _e$target;
+
+    filterTextRef.value = e === null || e === void 0 ? void 0 : (_e$target = e.target) === null || _e$target === void 0 ? void 0 : _e$target.value;
+  };
   /**
    * dropdown box 위치 변경하는 메소드
    */
 
+
   var changeDropboxPosition = /*#__PURE__*/function () {
     var _ref3 = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee3() {
       var _selectWrapper$value, _selectWrapper$value2, _dropbox$value;
@@ -14655,6 +14666,7 @@ var uses_useDropdown = function useDropdown(param) {
     filteredItems: filteredItems,
     clickSelectInput: clickSelectInput,
     clickOutsideDropbox: clickOutsideDropbox,
+    changeFilterText: changeFilterText,
     changeDropboxPosition: changeDropboxPosition,
     clickItem: clickItem,
     selectedItemClass: selectedItemClass
@@ -14745,6 +14757,7 @@ var uses_useDropdown = function useDropdown(param) {
         filteredItems = _useDropdown.filteredItems,
         clickSelectInput = _useDropdown.clickSelectInput,
         clickOutsideDropbox = _useDropdown.clickOutsideDropbox,
+        changeFilterText = _useDropdown.changeFilterText,
         changeDropboxPosition = _useDropdown.changeDropboxPosition,
         clickItem = _useDropdown.clickItem,
         selectedItemClass = _useDropdown.selectedItemClass;
@@ -14767,6 +14780,7 @@ var uses_useDropdown = function useDropdown(param) {
       filteredItems: filteredItems,
       clickSelectInput: clickSelectInput,
       clickOutsideDropbox: clickOutsideDropbox,
+      changeFilterText: changeFilterText,
       changeDropboxPosition: changeDropboxPosition,
       clickItem: clickItem,
       selectedItemClass: selectedItemClass
@@ -14775,8 +14789,8 @@ var uses_useDropdown = function useDropdown(param) {
 });
 // CONCATENATED MODULE: ./src/components/select/Select.vue?vue&type=script&lang=js
  
-// EXTERNAL MODULE: ./src/components/select/Select.vue?vue&type=style&index=0&id=9f8a1b7a&lang=scss
-var Selectvue_type_style_index_0_id_9f8a1b7a_lang_scss = __webpack_require__("002b");
+// EXTERNAL MODULE: ./src/components/select/Select.vue?vue&type=style&index=0&id=67ac0a78&lang=scss
+var Selectvue_type_style_index_0_id_67ac0a78_lang_scss = __webpack_require__("5b8e");
 
 // CONCATENATED MODULE: ./src/components/select/Select.vue
 
@@ -14784,7 +14798,7 @@ var Selectvue_type_style_index_0_id_9f8a1b7a_lang_scss = __webpack_require__("00
 
 
 
-Selectvue_type_script_lang_js.render = Selectvue_type_template_id_9f8a1b7a_render
+Selectvue_type_script_lang_js.render = Selectvue_type_template_id_67ac0a78_render
 
 /* harmony default export */ var Select = (Selectvue_type_script_lang_js);
 // CONCATENATED MODULE: ./src/components/select/index.js
@@ -26327,42 +26341,42 @@ var dist_default = /*#__PURE__*/__webpack_require__.n(dist);
 var vue3_observe_visibility_common = __webpack_require__("196e");
 var vue3_observe_visibility_common_default = /*#__PURE__*/__webpack_require__.n(vue3_observe_visibility_common);
 
-// CONCATENATED MODULE: ./node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib!./node_modules/vue-loader-v16/dist/templateLoader.js??ref--6!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader-v16/dist??ref--0-1!./src/components/grid/Grid.vue?vue&type=template&id=9801c414&scoped=true
+// CONCATENATED MODULE: ./node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib!./node_modules/vue-loader-v16/dist/templateLoader.js??ref--6!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader-v16/dist??ref--0-1!./src/components/grid/Grid.vue?vue&type=template&id=96cfa08e&scoped=true
 
 
 
 
 
-var _withId = /*#__PURE__*/Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withScopeId"])("data-v-9801c414");
+var _withId = /*#__PURE__*/Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withScopeId"])("data-v-96cfa08e");
 
-Object(external_commonjs_vue_commonjs2_vue_root_Vue_["pushScopeId"])("data-v-9801c414");
+Object(external_commonjs_vue_commonjs2_vue_root_Vue_["pushScopeId"])("data-v-96cfa08e");
 
-var Gridvue_type_template_id_9801c414_scoped_true_hoisted_1 = {
+var Gridvue_type_template_id_96cfa08e_scoped_true_hoisted_1 = {
   class: "column-list"
 };
-var Gridvue_type_template_id_9801c414_scoped_true_hoisted_2 = {
+var Gridvue_type_template_id_96cfa08e_scoped_true_hoisted_2 = {
   key: 0,
   class: "column-filter-status"
 };
-var Gridvue_type_template_id_9801c414_scoped_true_hoisted_3 = {
+var Gridvue_type_template_id_96cfa08e_scoped_true_hoisted_3 = {
   key: 0
 };
-var Gridvue_type_template_id_9801c414_scoped_true_hoisted_4 = {
+var Gridvue_type_template_id_96cfa08e_scoped_true_hoisted_4 = {
   key: 0
 };
 
-var Gridvue_type_template_id_9801c414_scoped_true_hoisted_5 = /*#__PURE__*/Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("td", {
+var Gridvue_type_template_id_96cfa08e_scoped_true_hoisted_5 = /*#__PURE__*/Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("td", {
   class: "is-empty"
 }, "No records", -1);
 
-var Gridvue_type_template_id_9801c414_scoped_true_hoisted_6 = {
+var Gridvue_type_template_id_96cfa08e_scoped_true_hoisted_6 = {
   ref: "resizeLine",
   class: "table-resize-line"
 };
 
 Object(external_commonjs_vue_commonjs2_vue_root_Vue_["popScopeId"])();
 
-var Gridvue_type_template_id_9801c414_scoped_true_render = /*#__PURE__*/_withId(function (_ctx, _cache, $props, $setup, $data, $options) {
+var Gridvue_type_template_id_96cfa08e_scoped_true_render = /*#__PURE__*/_withId(function (_ctx, _cache, $props, $setup, $data, $options) {
   var _component_toolbar = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["resolveComponent"])("toolbar");
 
   var _component_ev_checkbox = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["resolveComponent"])("ev-checkbox");
@@ -26413,7 +26427,7 @@ var Gridvue_type_template_id_9801c414_scoped_true_render = /*#__PURE__*/_withId(
       'table-header': true,
       'non-border': !!$setup.borderStyle
     }
-  }, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("ul", Gridvue_type_template_id_9801c414_scoped_true_hoisted_1, [_ctx.useCheckbox.use ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])("li", {
+  }, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("ul", Gridvue_type_template_id_96cfa08e_scoped_true_hoisted_1, [_ctx.useCheckbox.use ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])("li", {
     key: 0,
     class: {
       'column': true,
@@ -26446,7 +26460,7 @@ var Gridvue_type_template_id_9801c414_scoped_true_render = /*#__PURE__*/_withId(
       }
     }, [_ctx.isFiltering && (_ctx$filterList$colum = _ctx.filterList[column.field]) !== null && _ctx$filterList$colum !== void 0 && _ctx$filterList$colum.find(function (item) {
       return item.use;
-    }) ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])("span", Gridvue_type_template_id_9801c414_scoped_true_hoisted_2, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])(_component_ev_icon, {
+    }) ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])("span", Gridvue_type_template_id_96cfa08e_scoped_true_hoisted_2, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])(_component_ev_icon, {
       icon: "ev-icon-filter"
     })])) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("span", {
       title: column.caption,
@@ -26548,7 +26562,7 @@ var Gridvue_type_template_id_9801c414_scoped_true_render = /*#__PURE__*/_withId(
           'line-height': "".concat(_ctx.rowHeight, "px"),
           'min-width': "".concat($setup.isRenderer(column) ? _ctx.rendererMinWidth : _ctx.minWidth, "px")
         }
-      }, [!!_ctx.$slots[column.field] ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])("div", Gridvue_type_template_id_9801c414_scoped_true_hoisted_3, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["renderSlot"])(_ctx.$slots, column.field, {
+      }, [!!_ctx.$slots[column.field] ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])("div", Gridvue_type_template_id_96cfa08e_scoped_true_hoisted_3, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["renderSlot"])(_ctx.$slots, column.field, {
         item: {
           row: row,
           column: column
@@ -26558,13 +26572,13 @@ var Gridvue_type_template_id_9801c414_scoped_true_render = /*#__PURE__*/_withId(
         title: $setup.getConvertValue(column, row[2][column.index])
       }, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])($setup.getConvertValue(column, row[2][column.index])), 9, ["title"]))], 14, ["data-name", "data-index"])) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true)], 64);
     }), 128))], 42, ["data-index", "onClick", "onDblclick"]);
-  }), 128)), !_ctx.viewStore.length ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])("tr", Gridvue_type_template_id_9801c414_scoped_true_hoisted_4, [Gridvue_type_template_id_9801c414_scoped_true_hoisted_5])) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true)])]), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("div", {
+  }), 128)), !_ctx.viewStore.length ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])("tr", Gridvue_type_template_id_96cfa08e_scoped_true_hoisted_4, [Gridvue_type_template_id_96cfa08e_scoped_true_hoisted_5])) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true)])]), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("div", {
     style: "height: ".concat(_ctx.vScrollBottomHeight, "px;"),
     class: "vscroll-spacer"
   }, null, 4), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])(_component_ev_context_menu, {
     ref: "menu",
     items: _ctx.contextMenuItems
-  }, null, 8, ["items"])], 34), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withDirectives"])(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("div", Gridvue_type_template_id_9801c414_scoped_true_hoisted_6, null, 512), [[external_commonjs_vue_commonjs2_vue_root_Vue_["vShow"], _ctx.showResizeLine]]), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withDirectives"])(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])(_component_filter_window, {
+  }, null, 8, ["items"])], 34), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withDirectives"])(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("div", Gridvue_type_template_id_96cfa08e_scoped_true_hoisted_6, null, 512), [[external_commonjs_vue_commonjs2_vue_root_Vue_["vShow"], _ctx.showResizeLine]]), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withDirectives"])(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])(_component_filter_window, {
     "is-show": _ctx.showFilterWindow,
     "target-column": _ctx.currentFilter.column,
     "filter-items": _ctx.currentFilter.items,
@@ -26590,14 +26604,14 @@ var Gridvue_type_template_id_9801c414_scoped_true_render = /*#__PURE__*/_withId(
     "onUpdate:modelValue": _cache[5] || (_cache[5] = function ($event) {
       return _ctx.currentPage = $event;
     }),
-    total: _ctx.store.length,
+    total: _ctx.pageTotal,
     "per-page": _ctx.perPage,
     "visible-page": _ctx.visiblePage,
     "show-page-info": _ctx.showPageInfo,
     order: _ctx.order
   }, null, 8, ["modelValue", "total", "per-page", "visible-page", "show-page-info", "order"])) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true)], 64);
 });
-// CONCATENATED MODULE: ./src/components/grid/Grid.vue?vue&type=template&id=9801c414&scoped=true
+// CONCATENATED MODULE: ./src/components/grid/Grid.vue?vue&type=template&id=96cfa08e&scoped=true
 
 // CONCATENATED MODULE: ./node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib!./node_modules/vue-loader-v16/dist/templateLoader.js??ref--6!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader-v16/dist??ref--0-1!./src/components/grid/grid.toolbar.vue?vue&type=template&id=3c245986
 
@@ -29801,7 +29815,7 @@ var uses_pagingEvent = function pagingEvent(params) {
         currentPage: pageInfo.currentPage,
         prevPage: pageInfo.prevPage,
         startIndex: pageInfo.startIndex,
-        total: pageInfo.total,
+        total: pageInfo.pageTotal,
         perPage: pageInfo.perPage
       },
       sortInfo: {
@@ -30019,7 +30033,7 @@ var uses_pagingEvent = function pagingEvent(params) {
       startIndex: 0,
       prevPage: 0,
       currentPage: 0,
-      total: Object(external_commonjs_vue_commonjs2_vue_root_Vue_["computed"])(function () {
+      pageTotal: Object(external_commonjs_vue_commonjs2_vue_root_Vue_["computed"])(function () {
         var _props$option$page4;
 
         return ((_props$option$page4 = props.option.page) === null || _props$option$page4 === void 0 ? void 0 : _props$option$page4.total) || 0;
@@ -30511,8 +30525,8 @@ var uses_pagingEvent = function pagingEvent(params) {
 });
 // CONCATENATED MODULE: ./src/components/grid/Grid.vue?vue&type=script&lang=js
  
-// EXTERNAL MODULE: ./src/components/grid/Grid.vue?vue&type=style&index=0&id=9801c414&lang=scss&scoped=true
-var Gridvue_type_style_index_0_id_9801c414_lang_scss_scoped_true = __webpack_require__("d11a");
+// EXTERNAL MODULE: ./src/components/grid/Grid.vue?vue&type=style&index=0&id=96cfa08e&lang=scss&scoped=true
+var Gridvue_type_style_index_0_id_96cfa08e_lang_scss_scoped_true = __webpack_require__("e35c");
 
 // CONCATENATED MODULE: ./src/components/grid/Grid.vue
 
@@ -30520,8 +30534,8 @@ var Gridvue_type_style_index_0_id_9801c414_lang_scss_scoped_true = __webpack_req
 
 
 
-Gridvue_type_script_lang_js.render = Gridvue_type_template_id_9801c414_scoped_true_render
-Gridvue_type_script_lang_js.__scopeId = "data-v-9801c414"
+Gridvue_type_script_lang_js.render = Gridvue_type_template_id_96cfa08e_scoped_true_render
+Gridvue_type_script_lang_js.__scopeId = "data-v-96cfa08e"
 
 /* harmony default export */ var Grid = (Gridvue_type_script_lang_js);
 // CONCATENATED MODULE: ./src/components/grid/index.js
@@ -32746,7 +32760,9 @@ var modules = {
     return def;
   },
   getSeriesValueOptForHeatMap: function getSeriesValueOptForHeatMap(series) {
-    var data = series.data;
+    var data = series.data,
+        colorState = series.colorState,
+        isGradient = series.isGradient;
     var colorOpt = this.options.heatMapColor;
     var categoryCnt = colorOpt.categoryCnt;
     var decimalPoint = colorOpt.decimalPoint;
@@ -32769,10 +32785,10 @@ var modules = {
       }
     });
 
-    if (isExistError && series.colorAxis.length === categoryCnt) {
-      series.colorAxis.push({
+    if (isExistError && !isGradient && colorState.length === categoryCnt) {
+      colorState.push({
         id: "color#".concat(categoryCnt),
-        value: colorOpt.error,
+        color: colorOpt.error,
         state: 'normal',
         show: true
       });
@@ -33080,7 +33096,12 @@ var modules = {
                     end: position[dataIndex]
                   }
                 };
-              }); // canvas 의 클릭 위치값은 제 4 사분면의 위치이므로 clickedY, y1, y2 의 값은 음수를 취한다.
+              });
+
+              var isEmptyVector = function isEmptyVector(arr) {
+                return !arr || !Array.isArray(arr) || (arr === null || arr === void 0 ? void 0 : arr.length) !== 2;
+              }; // canvas 의 클릭 위치값은 제 4 사분면의 위치이므로 clickedY, y1, y2 의 값은 음수를 취한다.
+
 
               if (isStackChart) {
                 var _vectorList$find;
@@ -33088,6 +33109,10 @@ var modules = {
                 hitSeries = (_vectorList$find = vectorList.find(function (_ref12) {
                   var vector = _ref12.vector;
 
+                  if (isEmptyVector(vector === null || vector === void 0 ? void 0 : vector.start) && isEmptyVector(vector === null || vector === void 0 ? void 0 : vector.end)) {
+                    return false;
+                  }
+
                   var _vector$start = _slicedToArray(vector.start, 2),
                       x1 = _vector$start[0],
                       y1 = _vector$start[1];
@@ -33111,6 +33136,10 @@ var modules = {
                 hitSeries = (_vectorList$find2 = vectorList.find(function (_ref13) {
                   var vector = _ref13.vector;
 
+                  if (isEmptyVector(vector === null || vector === void 0 ? void 0 : vector.start) && isEmptyVector(vector === null || vector === void 0 ? void 0 : vector.end)) {
+                    return false;
+                  }
+
                   var _vector$start2 = _slicedToArray(vector.start, 2),
                       x1 = _vector$start2[0],
                       y1 = _vector$start2[1];
@@ -34221,7 +34250,8 @@ var PLOT_BAND_OPTION = {
 var HEAT_MAP_OPTION = {
   show: true,
   highlight: {
-    maxShadowOpacity: 0.4
+    maxShadowOpacity: 0.4,
+    brightness: 150
   },
   xAxisIndex: 0,
   yAxisIndex: 0,
@@ -35214,6 +35244,7 @@ var element_scatter_Scatter = /*#__PURE__*/function () {
 
 
 
+
 var element_bar_Bar = /*#__PURE__*/function () {
   function Bar(sId, opt, sIdx, isHorizontal) {
     var _this = this;
@@ -35608,14 +35639,14 @@ var element_bar_Bar = /*#__PURE__*/function () {
       ctx.textBaseline = 'middle';
       ctx.textAlign = isHorizontal && align !== 'center' ? 'left' : 'center';
       var value;
-      var isStacked = !isNaN(data.o);
+      var isStacked = truthy(this.stackIndex);
 
-      if (data.o === null) {
-        value = isHorizontal ? data.x : data.y;
-      } else if (isStacked) {
+      if (isStacked) {
         value = data.o;
       } else {
-        value = '';
+        var _ref2;
+
+        value = (_ref2 = isHorizontal ? data.x : data.y) !== null && _ref2 !== void 0 ? _ref2 : '';
       }
 
       var formattedTxt;
@@ -35625,65 +35656,88 @@ var element_bar_Bar = /*#__PURE__*/function () {
       }
 
       if (!formatter || typeof formattedTxt !== 'string') {
-        formattedTxt = helpers_util.labelSignFormat(value, decimalPoint);
+        var _Util$labelSignFormat;
+
+        formattedTxt = (_Util$labelSignFormat = helpers_util.labelSignFormat(value, decimalPoint)) !== null && _Util$labelSignFormat !== void 0 ? _Util$labelSignFormat : '';
       }
 
-      var vw = Math.round(ctx.measureText(formattedTxt).width);
-      var vh = fontSize + 4;
+      var textWidth = Math.round(ctx.measureText(formattedTxt).width);
+      var textHeight = fontSize + 4;
       var minXPos = x + 10;
       var minYPos = y - 10;
+      var widthFreeSpaceToDraw = w - 10;
+      var heightFreeSpaceToDraw = Math.abs(h + 10);
       var centerX = x + w / 2 <= minXPos ? minXPos : x + w / 2;
       var centerY = y + h / 2 >= minYPos ? minYPos : y + h / 2;
       var centerYHorizontal = isHighlight ? y + h / 2 : y - h / 2;
 
       switch (align) {
         case 'start':
-          if (isHorizontal) {
-            ctx.fillText(formattedTxt, minXPos, centerYHorizontal);
-          } else {
-            ctx.fillText(formattedTxt, centerX, minYPos);
-          }
+          {
+            if (isHorizontal) {
+              if (textWidth < widthFreeSpaceToDraw) {
+                ctx.fillText(formattedTxt, minXPos, centerYHorizontal);
+              }
+            } else if (textHeight < heightFreeSpaceToDraw) {
+              ctx.fillText(formattedTxt, centerX, minYPos);
+            }
 
-          break;
+            break;
+          }
 
         case 'center':
-          if (isHorizontal) {
-            ctx.fillText(formattedTxt, centerX, centerYHorizontal);
-          } else {
-            ctx.fillText(formattedTxt, centerX, centerY);
-          }
+          {
+            if (isHorizontal) {
+              if (textWidth < widthFreeSpaceToDraw) {
+                ctx.fillText(formattedTxt, centerX, centerYHorizontal);
+              }
+            } else if (textHeight < heightFreeSpaceToDraw) {
+              ctx.fillText(formattedTxt, centerX, centerY);
+            }
 
-          break;
+            break;
+          }
 
         case 'out':
-          if (isHorizontal) {
-            ctx.fillText(formattedTxt, minXPos + w, centerYHorizontal);
-          } else {
-            ctx.fillText(formattedTxt, centerX, y + h - vh / 2);
-          }
+          {
+            if (isStacked) {
+              console.warn('[EVUI][Bar Chart] In case of Stack Bar Chart, \'out\' of \'showValue\'\'s align is not supported.');
+              return;
+            }
 
-          break;
+            if (isHorizontal) {
+              ctx.fillText(formattedTxt, minXPos + w, centerYHorizontal);
+            } else {
+              ctx.fillText(formattedTxt, centerX, y + h - textHeight / 2);
+            }
 
-        case 'end':
-        default:
-          if (isHorizontal) {
-            var xPos = x + w - vw * 2;
-            ctx.fillText(formattedTxt, xPos <= minXPos ? minXPos : xPos, centerYHorizontal);
-          } else {
-            var yPos = y + h + vh;
-            ctx.fillText(formattedTxt, centerX, yPos >= minYPos ? minYPos : yPos);
+            break;
           }
 
-          break;
+        default:
+        case 'end':
+          {
+            if (isHorizontal) {
+              if (textWidth < widthFreeSpaceToDraw) {
+                var xPos = x + w - textWidth * 2;
+                ctx.fillText(formattedTxt, xPos <= minXPos ? minXPos : xPos, centerYHorizontal);
+              }
+            } else if (textHeight < heightFreeSpaceToDraw) {
+              var yPos = y + h + textHeight;
+              ctx.fillText(formattedTxt, centerX, yPos >= minYPos ? minYPos : yPos);
+            }
+
+            break;
+          }
       }
 
       ctx.restore();
     }
   }, {
     key: "drawBar",
-    value: function drawBar(_ref2) {
-      var ctx = _ref2.ctx,
-          positions = _ref2.positions;
+    value: function drawBar(_ref3) {
+      var ctx = _ref3.ctx,
+          positions = _ref3.positions;
       var isHorizontal = this.isHorizontal;
       var isStackBar = ('stackIndex' in this);
       var isBorderRadius = this.borderRadius && this.borderRadius > 0;
@@ -36271,10 +36325,13 @@ var element_pie_Pie = /*#__PURE__*/function () {
 
 
 
+
+
+
 
 
 var element_heatmap_HeatMap = /*#__PURE__*/function () {
-  function HeatMap(sId, opt, colorOpt) {
+  function HeatMap(sId, opt, colorOpt, isGradient) {
     var _this = this;
 
     _classCallCheck(this, HeatMap);
@@ -36283,10 +36340,14 @@ var element_heatmap_HeatMap = /*#__PURE__*/function () {
     Object.keys(merged).forEach(function (key) {
       _this[key] = merged[key];
     });
-    this.createColorAxis(colorOpt);
+    this.isGradient = isGradient;
+    this.createColorState(colorOpt);
     this.sId = sId;
     this.data = [];
-    this.labels = {};
+    this.labels = {
+      x: [],
+      y: []
+    };
     this.valueOpt = {};
     this.size = {
       w: 0,
@@ -36302,16 +36363,17 @@ var element_heatmap_HeatMap = /*#__PURE__*/function () {
 
 
   _createClass(HeatMap, [{
-    key: "createColorAxis",
-    value: function createColorAxis(colorOpt) {
-      var colorAxis = [];
+    key: "createColorState",
+    value: function createColorState(colorOpt) {
+      var colorState = [];
+      var regex = /[^0-9]&[^,]/g;
       var min = colorOpt.min,
           max = colorOpt.max,
           categoryCnt = colorOpt.categoryCnt,
           error = colorOpt.error,
           stroke = colorOpt.stroke;
-      var minColor = min.includes('#') ? helpers_util.hexToRgb(min) : min;
-      var maxColor = max.includes('#') ? helpers_util.hexToRgb(max) : max;
+      var minColor = min.includes('#') ? helpers_util.hexToRgb(min) : min.replace(regex, '');
+      var maxColor = max.includes('#') ? helpers_util.hexToRgb(max) : max.replace(regex, '');
 
       var _minColor$split = minColor.split(','),
           _minColor$split2 = _slicedToArray(_minColor$split, 3),
@@ -36325,35 +36387,71 @@ var element_heatmap_HeatMap = /*#__PURE__*/function () {
           maxG = _maxColor$split2[1],
           maxB = _maxColor$split2[2];
 
-      var unitR = Math.floor((minR - maxR) / (categoryCnt - 1));
-      var unitG = Math.floor((minG - maxG) / (categoryCnt - 1));
-      var unitB = Math.floor((minB - maxB) / (categoryCnt - 1));
-
-      for (var ix = 0; ix < categoryCnt; ix++) {
-        var r = +minR - unitR * ix;
-        var g = +minG - unitG * ix;
-        var b = +minB - unitB * ix;
-        colorAxis.push({
-          id: "color#".concat(ix),
-          value: "rgb(".concat(r, ",").concat(g, ",").concat(b, ")"),
-          state: 'normal',
-          show: true
+      if (this.isGradient) {
+        colorState.push({
+          minColor: {
+            minR: minR,
+            minG: minG,
+            minB: minB
+          },
+          maxColor: {
+            maxR: maxR,
+            maxG: maxG,
+            maxB: maxB
+          },
+          categoryCnt: categoryCnt,
+          start: 0,
+          end: 100,
+          selectedValue: null
         });
+      } else {
+        var unitR = Math.floor((minR - maxR) / (categoryCnt - 1));
+        var unitG = Math.floor((minG - maxG) / (categoryCnt - 1));
+        var unitB = Math.floor((minB - maxB) / (categoryCnt - 1));
+
+        for (var ix = 0; ix < categoryCnt; ix++) {
+          var r = +minR - unitR * ix;
+          var g = +minG - unitG * ix;
+          var b = +minB - unitB * ix;
+          colorState.push({
+            id: "color#".concat(ix),
+            color: "rgb(".concat(r, ",").concat(g, ",").concat(b, ")"),
+            state: 'normal',
+            show: true
+          });
+        }
       }
 
-      this.colorAxis = colorAxis;
+      this.colorState = colorState;
       this.errorColor = error;
       this.stroke = stroke;
     }
   }, {
-    key: "getColorIndex",
-    value: function getColorIndex(value) {
+    key: "getColorForGradient",
+    value: function getColorForGradient(value) {
+      var _this$colorState$ = this.colorState[0],
+          minColor = _this$colorState$.minColor,
+          maxColor = _this$colorState$.maxColor;
+      var minR = minColor.minR,
+          minG = minColor.minG,
+          minB = minColor.minB;
+      var maxR = maxColor.maxR,
+          maxG = maxColor.maxG,
+          maxB = maxColor.maxB;
+      var r = +minR - Math.floor((minR - maxR) * value / 100);
+      var g = +minG - Math.floor((minG - maxG) * value / 100);
+      var b = +minB - Math.floor((minB - maxB) * value / 100);
+      return "rgb(".concat(r, ",").concat(g, ",").concat(b, ")");
+    }
+  }, {
+    key: "getColorIndexForIcon",
+    value: function getColorIndexForIcon(value) {
       var _this$valueOpt = this.valueOpt,
           existError = _this$valueOpt.existError,
           min = _this$valueOpt.min,
           interval = _this$valueOpt.interval,
           decimalPoint = _this$valueOpt.decimalPoint;
-      var maxIndex = this.colorAxis.length - 1;
+      var maxIndex = this.colorState.length - 1;
 
       if (existError && value < 0) {
         return maxIndex;
@@ -36367,14 +36465,67 @@ var element_heatmap_HeatMap = /*#__PURE__*/function () {
 
       return colorIndex;
     }
+  }, {
+    key: "getItemInfo",
+    value: function getItemInfo(value) {
+      var _this$valueOpt2 = this.valueOpt,
+          min = _this$valueOpt2.min,
+          max = _this$valueOpt2.max;
+      var itemInfo = {
+        show: false,
+        opacity: 0,
+        dataColor: null,
+        id: null,
+        isHighlight: null
+      };
+
+      if (this.isGradient) {
+        var ratio = convertToPercent(value - min, max - min);
+        var _this$colorState$2 = this.colorState[0],
+            start = _this$colorState$2.start,
+            end = _this$colorState$2.end,
+            selectedValue = _this$colorState$2.selectedValue;
+
+        if (value < 0 || start <= ratio && ratio <= end) {
+          itemInfo.show = true;
+          itemInfo.isHighlight = selectedValue !== null && Math.floor(value) === Math.floor(min + (max - min) * (selectedValue / 100));
+          itemInfo.opacity = 1;
+          itemInfo.dataColor = value < 0 ? this.errorColor : this.getColorForGradient(ratio);
+        }
+      } else {
+        var colorIndex = this.getColorIndexForIcon(value);
+        var _this$colorState$colo = this.colorState[colorIndex],
+            show = _this$colorState$colo.show,
+            state = _this$colorState$colo.state,
+            color = _this$colorState$colo.color,
+            id = _this$colorState$colo.id;
+        itemInfo.show = show;
+        itemInfo.opacity = state === 'downplay' ? 0.1 : 1;
+        itemInfo.dataColor = value < 0 ? this.errorColor : color;
+        itemInfo.id = id;
+      }
+
+      return itemInfo;
+    }
   }, {
     key: "drawItem",
     value: function drawItem(ctx, x, y, w, h) {
       ctx.beginPath();
 
       if (this.stroke.show) {
-        ctx.strokeRect(x, y, w, h);
-        ctx.fillRect(x, y, w, h);
+        var radius = this.stroke.radius;
+
+        if (radius > 0 && radius < h && radius < w) {
+          ctx.moveTo(x + radius, y);
+          ctx.arcTo(x + w, y, x + w, y + h, radius);
+          ctx.arcTo(x + w, y + h, x, y + h, radius);
+          ctx.arcTo(x, y + h, x, y, radius);
+          ctx.arcTo(x, y, x + w, y, radius);
+          ctx.fill();
+        } else {
+          ctx.strokeRect(x, y, w, h);
+          ctx.fillRect(x, y, w, h);
+        }
       } else {
         var aliasPixel = helpers_util.aliasPixel(1);
         ctx.fillRect(x, y - aliasPixel, w + aliasPixel, h + aliasPixel);
@@ -36418,7 +36569,8 @@ var element_heatmap_HeatMap = /*#__PURE__*/function () {
 
       var ctx = param.ctx,
           chartRect = param.chartRect,
-          labelOffset = param.labelOffset;
+          labelOffset = param.labelOffset,
+          overlayCtx = param.overlayCtx;
       var xArea = chartRect.chartWidth - (labelOffset.left + labelOffset.right);
       var yArea = chartRect.chartHeight - (labelOffset.top + labelOffset.bottom);
       var xsp = chartRect.x1 + labelOffset.left;
@@ -36435,13 +36587,18 @@ var element_heatmap_HeatMap = /*#__PURE__*/function () {
         var value = item.o;
 
         if (xp !== null && yp !== null && value !== null && value !== undefined) {
-          var colorIndex = _this2.getColorIndex(value);
-
-          var opacity = _this2.colorAxis[colorIndex].state === 'downplay' ? 0.1 : 1;
-          item.dataColor = value < 0 ? _this2.errorColor : _this2.colorAxis[colorIndex].value;
-          item.cId = _this2.colorAxis[colorIndex].id;
+          var _this2$getItemInfo = _this2.getItemInfo(value),
+              show = _this2$getItemInfo.show,
+              opacity = _this2$getItemInfo.opacity,
+              dataColor = _this2$getItemInfo.dataColor,
+              id = _this2$getItemInfo.id,
+              isHighlight = _this2$getItemInfo.isHighlight;
+
+          item.dataColor = dataColor;
+          item.cId = id;
+          ctx.save();
 
-          if (_this2.colorAxis[colorIndex].show) {
+          if (show) {
             ctx.fillStyle = helpers_util.colorStringToRgba(item.dataColor, opacity);
 
             if (_this2.stroke.show) {
@@ -36459,24 +36616,25 @@ var element_heatmap_HeatMap = /*#__PURE__*/function () {
 
             _this2.drawItem(ctx, xp, yp, w, h);
 
+            ctx.restore();
+            item.xp = xp;
+            item.yp = yp;
+            item.w = w;
+            item.h = h;
+
             if (_this2.showValue.use) {
               _this2.drawValueLabels({
                 context: ctx,
-                data: item,
-                positions: {
-                  x: xp,
-                  y: yp,
-                  w: w,
-                  h: h
-                }
+                data: item
               });
             }
-          }
 
-          item.xp = xp;
-          item.yp = yp;
-          item.w = w;
-          item.h = h;
+            if (isHighlight) {
+              _this2.itemHighlight({
+                data: item
+              }, overlayCtx);
+            }
+          }
         }
       });
     }
@@ -36491,18 +36649,18 @@ var element_heatmap_HeatMap = /*#__PURE__*/function () {
     key: "drawValueLabels",
     value: function drawValueLabels(_ref) {
       var context = _ref.context,
-          data = _ref.data,
-          positions = _ref.positions;
+          data = _ref.data;
       var _this$showValue = this.showValue,
           fontSize = _this$showValue.fontSize,
           textColor = _this$showValue.textColor,
           align = _this$showValue.align,
           formatter = _this$showValue.formatter,
           decimalPoint = _this$showValue.decimalPoint;
-      var x = positions.x,
-          y = positions.y,
-          w = positions.w,
-          h = positions.h;
+      var x = data.xp,
+          y = data.yp,
+          w = data.w,
+          h = data.h,
+          value = data.o;
       var ctx = context;
       ctx.save();
       ctx.beginPath();
@@ -36511,7 +36669,6 @@ var element_heatmap_HeatMap = /*#__PURE__*/function () {
       ctx.lineWidth = 1;
       ctx.textBaseline = 'middle';
       ctx.textAlign = align !== 'center' ? 'left' : 'center';
-      var value = data.o;
       var formattedTxt;
 
       if (formatter) {
@@ -36613,8 +36770,6 @@ var element_heatmap_HeatMap = /*#__PURE__*/function () {
   }, {
     key: "itemHighlight",
     value: function itemHighlight(item, context) {
-      var _this$colorAxis$find;
-
       var gdata = item.data;
       var ctx = context;
       var x = gdata.xp;
@@ -36622,34 +36777,46 @@ var element_heatmap_HeatMap = /*#__PURE__*/function () {
       var w = gdata.w;
       var h = gdata.h;
       var cId = gdata.cId;
-      var isShow = (_this$colorAxis$find = this.colorAxis.find(function (_ref4) {
-        var id = _ref4.id;
-        return id === cId;
-      })) === null || _this$colorAxis$find === void 0 ? void 0 : _this$colorAxis$find.show;
+      var isShow;
+
+      if (this.isGradient) {
+        var _this$valueOpt3 = this.valueOpt,
+            min = _this$valueOpt3.min,
+            max = _this$valueOpt3.max;
+        var ratio = convertToPercent(gdata.o - min, max - min);
+        var _this$colorState$3 = this.colorState[0],
+            start = _this$colorState$3.start,
+            end = _this$colorState$3.end;
+        isShow = start <= ratio && ratio <= end || gdata.o === -1;
+      } else {
+        var _this$colorState$find;
+
+        isShow = (_this$colorState$find = this.colorState.find(function (_ref4) {
+          var id = _ref4.id;
+          return id === cId;
+        })) === null || _this$colorState$find === void 0 ? void 0 : _this$colorState$find.show;
+      }
+
       ctx.save();
+      ctx.shadowOffsetX = 2;
+      ctx.shadowOffsetY = 2;
+      ctx.shadowBlur = 4;
 
       if (x !== null && y !== null && isShow) {
         var color = gdata.dataColor;
-        ctx.strokeStyle = helpers_util.colorStringToRgba(color, 1);
-        ctx.fillStyle = helpers_util.colorStringToRgba(color, this.highlight.maxShadowOpacity);
-        ctx.shadowColor = color;
-        this.drawItem(ctx, x, y, w, h);
+        ctx.shadowColor = helpers_util.colorStringToRgba('#605F5F');
+        ctx.strokeStyle = helpers_util.colorStringToRgba(color);
+        ctx.fillStyle = helpers_util.colorStringToRgba(color);
+        this.drawItem(ctx, x - 2, y - 2, w + 4, h + 4);
+        ctx.restore();
 
         if (this.showValue.use) {
           this.drawValueLabels({
             context: ctx,
-            data: gdata,
-            positions: {
-              x: x,
-              y: y,
-              w: w,
-              h: h
-            }
+            data: gdata
           });
         }
       }
-
-      ctx.restore();
     }
     /**
      * Find graph item for tooltip
@@ -36868,7 +37035,11 @@ var model_series_modules = {
       return new element_pie(id, opt, index);
     } else if (type === 'heatMap') {
       this.seriesInfo.charts.heatMap.push(id);
-      return new element_heatmap(id, opt, this.options.heatMapColor);
+      var _this$options = this.options,
+          heatMapColor = _this$options.heatMapColor,
+          legend = _this$options.legend;
+      var isGradient = legend.type === 'gradient';
+      return new element_heatmap(id, opt, heatMapColor, isGradient);
     }
 
     return false;
@@ -38158,9 +38329,13 @@ var scale_step_StepScale = /*#__PURE__*/function (_Scale) {
       if (this.rangeMode) {
         var maxSteps = range.maxSteps;
 
-        while (numberOfSteps > maxSteps * 2) {
-          interval *= 2;
-          numberOfSteps = Math.round(numberOfSteps / interval);
+        if (maxSteps > 2) {
+          while (numberOfSteps > maxSteps * 2) {
+            interval *= 2;
+            numberOfSteps = Math.round(numberOfSteps / interval);
+          }
+        } else {
+          interval = this.labels.length;
         }
       }
 
@@ -38920,18 +39095,18 @@ var plugins_legend_modules = {
     var seriesList = this.seriesList;
     Object.values(seriesList).forEach(function (series) {
       if (!series.isExistGrp && series.showLegend) {
-        var colorAxis = series.colorAxis,
+        var colorState = series.colorState,
             valueOpt = series.valueOpt;
         var min = valueOpt.min,
             max = valueOpt.max,
             interval = valueOpt.interval,
             existError = valueOpt.existError,
             decimalPoint = valueOpt.decimalPoint;
-        var length = colorAxis.length;
+        var length = colorState.length;
         var endIndex = existError ? length - 2 : length - 1;
 
         for (var index = 0; index < length; index++) {
-          var colorItem = colorAxis[index];
+          var colorItem = colorState[index];
           var minValue = min + interval * index;
           var maxValue = minValue + interval;
 
@@ -38959,7 +39134,7 @@ var plugins_legend_modules = {
 
           _this2.addLegend({
             cId: colorItem.id,
-            color: colorItem.value,
+            color: colorItem.color,
             name: name
           });
         }
@@ -39164,7 +39339,7 @@ var plugins_legend_modules = {
       var nameDOM = (_targetDOM4 = targetDOM) === null || _targetDOM4 === void 0 ? void 0 : _targetDOM4.getElementsByClassName('ev-chart-legend-name')[0];
       var isActive = !(colorDOM !== null && colorDOM !== void 0 && colorDOM.className.includes('inactive'));
       var targetId = nameDOM.series.cId;
-      var activeCount = series.colorAxis.filter(function (colorItem) {
+      var activeCount = series.colorState.filter(function (colorItem) {
         return colorItem.show;
       }).length;
 
@@ -39185,12 +39360,12 @@ var plugins_legend_modules = {
         nameDOM.style.color = opt.color;
       }
 
-      var targetIndex = series.colorAxis.findIndex(function (colorItem) {
+      var targetIndex = series.colorState.findIndex(function (colorItem) {
         return colorItem.id === targetId;
       });
 
       if (targetIndex > -1) {
-        series.colorAxis[targetIndex].show = !isActive;
+        series.colorState[targetIndex].show = !isActive;
       }
 
       colorDOM.classList.toggle('inactive');
@@ -39226,7 +39401,7 @@ var plugins_legend_modules = {
 
       var nameDOM = targetDOM.getElementsByClassName('ev-chart-legend-name')[0];
       var targetId = nameDOM.series.cId;
-      series.colorAxis.forEach(function (colorItem) {
+      series.colorState.forEach(function (colorItem) {
         colorItem.state = colorItem.id === targetId ? 'highlight' : 'downplay';
       });
 
@@ -39247,7 +39422,7 @@ var plugins_legend_modules = {
 
     this.onLegendBoxLeave = function () {
       var series = Object.values(_this4.seriesList)[0];
-      series.colorAxis.forEach(function (item) {
+      series.colorState.forEach(function (item) {
         item.state = 'normal';
       });
 
@@ -39400,6 +39575,7 @@ var plugins_legend_modules = {
 
     containerDOM.style.height = '18px';
     containerDOM.style.display = 'inline-block';
+    containerDOM.style.overflow = 'hidden';
     containerDOM.dataset.type = 'container';
     this.legendBoxDOM.appendChild(containerDOM);
     this.seriesInfo.count++;
@@ -39420,6 +39596,7 @@ var plugins_legend_modules = {
     var boxStyle = (_this$legendBoxDOM = this.legendBoxDOM) === null || _this$legendBoxDOM === void 0 ? void 0 : _this$legendBoxDOM.style;
     var resizeStyle = (_this$resizeDOM = this.resizeDOM) === null || _this$resizeDOM === void 0 ? void 0 : _this$resizeDOM.style;
     var chartRect;
+    var legendPad;
     var title = opt !== null && opt !== void 0 && (_opt$title = opt.title) !== null && _opt$title !== void 0 && _opt$title.show ? opt === null || opt === void 0 ? void 0 : (_opt$title2 = opt.title) === null || _opt$title2 === void 0 ? void 0 : _opt$title2.height : 0;
     var positionTop = title + (opt === null || opt === void 0 ? void 0 : (_opt$legend2 = opt.legend) === null || _opt$legend2 === void 0 ? void 0 : _opt$legend2.height);
 
@@ -39443,14 +39620,15 @@ var plugins_legend_modules = {
       case 'top':
         wrapperStyle.padding = "".concat(positionTop, "px 0 0 0");
         chartRect = this.chartDOM.getBoundingClientRect();
+        legendPad = parseInt(legendStyle.paddingTop) + parseInt(legendStyle.paddingBottom);
         boxStyle.width = '100%';
-        boxStyle.height = "".concat(opt.legend.height, "px");
+        boxStyle.height = "".concat(opt.legend.height - legendPad, "px");
         legendStyle.top = "".concat(title, "px");
         legendStyle.right = '';
         legendStyle.bottom = '';
         legendStyle.left = '';
         legendStyle.width = "".concat(chartRect.width, "px");
-        legendStyle.height = "".concat(opt.legend.height + 4, "px"); // 4 resize bar size
+        legendStyle.height = "".concat(opt.legend.height + (resizeStyle ? 4 : 0), "px"); // 4 resize bar size
 
         if (resizeStyle) {
           resizeStyle.top = "".concat(positionTop, "px");
@@ -39493,14 +39671,15 @@ var plugins_legend_modules = {
       case 'bottom':
         wrapperStyle.padding = "".concat(title, "px 0 ").concat(opt.legend.height, "px 0");
         chartRect = this.chartDOM.getBoundingClientRect();
+        legendPad = parseInt(legendStyle.paddingTop) + parseInt(legendStyle.paddingBottom);
         boxStyle.width = '100%';
-        boxStyle.height = "".concat(opt.legend.height, "px");
+        boxStyle.height = "".concat(opt.legend.height - legendPad, "px");
         legendStyle.top = '';
         legendStyle.right = '';
         legendStyle.bottom = '0px';
         legendStyle.left = '0px';
         legendStyle.width = "".concat(chartRect.width, "px");
-        legendStyle.height = "".concat(opt.legend.height + 4, "px"); // 4 resize bar size
+        legendStyle.height = "".concat(opt.legend.height + (resizeStyle ? 4 : 0), "px"); // 4 resize bar size
 
         if (resizeStyle) {
           resizeStyle.top = '';
@@ -39766,6 +39945,638 @@ var plugins_legend_modules = {
   }
 };
 /* harmony default export */ var plugins_legend = (plugins_legend_modules);
+// CONCATENATED MODULE: ./src/components/chart/plugins/plugins.legend.gradient.js
+
+
+
+
+
+
+
+
+var MAX_HANDLE_SIZE = 28;
+var MIN_BOX_SIZE = {
+  width: 70,
+  height: 60
+};
+var plugins_legend_gradient_modules = {
+  /**
+   * Create legend DOM
+   *
+   * @returns {undefined}
+   */
+  createLegendLayout: function createLegendLayout() {
+    this.legendDOM = document.createElement('div');
+    this.legendDOM.className = 'ev-chart-legend';
+    this.legendBoxDOM = document.createElement('div');
+    this.legendBoxDOM.className = 'ev-chart-legend-box';
+    this.containerDOM = document.createElement('div');
+    this.containerDOM.className = 'ev-chart-legend-container';
+    this.legendBoxDOM.appendChild(this.containerDOM);
+    this.legendDOM.appendChild(this.legendBoxDOM);
+    this.wrapperDOM.appendChild(this.legendDOM);
+  },
+
+  /**
+   * Initialize legend
+   * If there was no initialization, create DOM and set default layout.
+   * It not, there will already be set layout, so add a legend for each series with group
+   *
+   * @returns {undefined}
+   */
+  initLegend: function initLegend() {
+    var _this = this;
+
+    if (!this.isInitLegend) {
+      this.createLegendLayout();
+      this.createLegend();
+    }
+
+    Object.values(this.seriesList).forEach(function (series) {
+      _this.setLegendStyle(series);
+    });
+    this.initEvent();
+    this.isInitLegend = true;
+    this.legendDragInfo = {
+      dragging: false,
+      isStart: true
+    };
+  },
+
+  /**
+   * Initialize legend event
+   *
+   * @returns {undefined}
+   */
+  initEvent: function initEvent() {
+    var _this2 = this;
+
+    if (this.isInitLegend) {
+      return;
+    }
+
+    this.onLegendMouseDown = function (e) {
+      e.stopPropagation();
+      e.preventDefault();
+      var type = e.target.dataset.type;
+      var targetDOM;
+
+      if (type === 'handle') {
+        targetDOM = e.target;
+      } else if (type === 'handle-btn') {
+        targetDOM = e.target.parentElement;
+      } else if (type === 'handle-btn-color') {
+        targetDOM = e.target.parentElement.parentElement;
+      } else {
+        return;
+      }
+
+      var seriesList = Object.values(_this2.seriesList);
+
+      if (!seriesList.length) {
+        return;
+      }
+
+      var colorState = seriesList[0].colorState;
+      var _colorState$ = colorState[0],
+          start = _colorState$.start,
+          end = _colorState$.end;
+      colorState[0].selectedValue = null;
+
+      _this2.clearOverlay();
+
+      _this2.legendDragInfo.dragging = true;
+      _this2.legendDragInfo.isStart = start !== end ? targetDOM.className.includes('start') : _this2.legendDragInfo.isStart;
+      targetDOM.classList.add('dragging');
+
+      _this2.legendBoxDOM.addEventListener('mousemove', _this2.onLegendMouseMove, false);
+
+      _this2.legendBoxDOM.addEventListener('mouseup', _this2.onLegendMouseUp, false);
+    };
+
+    this.onLegendMouseMove = function (e) {
+      e.stopPropagation();
+      e.preventDefault();
+      var _this2$legendDragInfo = _this2.legendDragInfo,
+          dragging = _this2$legendDragInfo.dragging,
+          isStart = _this2$legendDragInfo.isStart;
+
+      if (dragging) {
+        var value = _this2.getSelectedValue(e);
+
+        value = _this2.isSide ? 100 - value : value;
+        var dir = isStart ? 'start' : 'end';
+        var seriesList = Object.values(_this2.seriesList);
+
+        if (!seriesList.length) {
+          return;
+        }
+
+        var colorState = seriesList[0].colorState;
+        var _colorState$2 = colorState[0],
+            start = _colorState$2.start,
+            end = _colorState$2.end;
+
+        if (isStart && value > end || !isStart && value < start) {
+          return;
+        }
+
+        colorState[0][dir] = value;
+
+        _this2.update({
+          updateSeries: false,
+          updateSelTip: {
+            update: false,
+            keepDomain: false
+          }
+        });
+      }
+    };
+
+    this.onLegendMouseUp = function () {
+      _this2.legendDragInfo.dragging = false;
+
+      var targetDOM = _this2.containerDOM.getElementsByClassName('ev-chart-legend-handle dragging')[0];
+
+      targetDOM === null || targetDOM === void 0 ? void 0 : targetDOM.classList.remove('dragging');
+
+      _this2.legendBoxDOM.removeEventListener('mouseup', _this2.onLegendMouseUp, false);
+    };
+    /**
+     * callback for legendBoxDOM hovering
+     *
+     * @returns {undefined}
+     */
+
+
+    this.onLegendBoxOver = function (e) {
+      var type = e.target.dataset.type;
+      var seriesList = Object.values(_this2.seriesList);
+
+      if (!seriesList.length) {
+        return;
+      }
+
+      var _seriesList$ = seriesList[0],
+          colorState = _seriesList$.colorState,
+          valueOpt = _seriesList$.valueOpt;
+      var state = colorState[0];
+
+      var value = _this2.getSelectedValue(e);
+
+      value = _this2.isSide ? 100 - value : value;
+
+      if (['line', 'thumb', 'layer', 'overlay', 'overlay-item'].includes(type)) {
+        if (state.start <= value && value <= state.end) {
+          state.selectedValue = value;
+
+          _this2.createLegendOverlay(value, valueOpt);
+        } else {
+          return;
+        }
+      } else if (['handle', 'handle-btn', 'handle-btn-color'].includes(type)) {
+        var isStart = e.target.className.includes('start');
+        state.selectedValue = isStart ? state.start : state.end;
+
+        _this2.clearOverlay();
+      } else {
+        return;
+      }
+
+      _this2.update({
+        updateSeries: false,
+        updateSelTip: {
+          update: false,
+          keepDomain: false
+        }
+      });
+    };
+    /**
+     * callback for mouseleave event on legendBoxDOM
+     *
+     * @returns {undefined}
+     */
+
+
+    this.onLegendBoxLeave = function () {
+      _this2.legendDragInfo.dragging = false;
+
+      var lineDOM = _this2.containerDOM.getElementsByClassName('ev-chart-legend-line')[0];
+
+      var targetDOM = lineDOM.getElementsByClassName('ev-chart-legend-thumb')[0];
+
+      _this2.clearOverlay(targetDOM);
+
+      var seriesList = Object.values(_this2.seriesList);
+
+      if (!seriesList.length) {
+        return;
+      }
+
+      var colorState = seriesList[0].colorState;
+      colorState[0].selectedValue = null;
+
+      _this2.update({
+        updateSeries: false,
+        updateSelTip: {
+          update: false,
+          keepDomain: false
+        }
+      });
+    };
+
+    this.legendBoxDOM.addEventListener('mousedown', this.onLegendMouseDown);
+    this.legendBoxDOM.addEventListener('mouseover', this.onLegendBoxOver);
+    this.legendBoxDOM.addEventListener('mouseleave', this.onLegendBoxLeave);
+  },
+  getSelectedValue: function getSelectedValue(evt) {
+    var _this$containerDOM$ge = this.containerDOM.getBoundingClientRect(),
+        x = _this$containerDOM$ge.x,
+        y = _this$containerDOM$ge.y,
+        width = _this$containerDOM$ge.width,
+        height = _this$containerDOM$ge.height;
+
+    var isTop = !this.isSide;
+    var sp = isTop ? x : y;
+    var size = isTop ? width : height;
+    var movePoint = isTop ? evt.clientX : evt.clientY;
+
+    if (movePoint < sp) {
+      movePoint = sp;
+    } else if (movePoint > sp + size) {
+      movePoint = sp + size;
+    }
+
+    var move = movePoint - sp;
+    return +convertToPercent(move, size);
+  },
+
+  /**
+   * To update legend, reset all process.
+   *
+   * @returns {undefined}
+   */
+  updateLegend: function updateLegend() {
+    var _this3 = this;
+
+    this.resetLegend();
+    this.createLegend();
+    Object.values(this.seriesList).forEach(function (series) {
+      _this3.setLegendStyle(series);
+    });
+  },
+
+  /**
+   * To update legend, remove all of legendBoxDOM's children
+   *
+   * @returns {undefined}
+   */
+  resetLegend: function resetLegend() {
+    var containerDOM = this.containerDOM;
+
+    if (!containerDOM) {
+      return;
+    }
+
+    while (containerDOM.hasChildNodes()) {
+      containerDOM.removeChild(containerDOM.firstChild);
+    }
+  },
+  clearOverlay: function clearOverlay() {
+    var targetDOM = this.containerDOM.getElementsByClassName('ev-chart-legend-line')[0];
+    var overlayDOM = targetDOM.getElementsByClassName('ev-chart-legend-overlay')[0];
+
+    if (overlayDOM) {
+      targetDOM.removeChild(overlayDOM);
+      var thumbDOM = targetDOM.getElementsByClassName('ev-chart-legend-thumb')[0];
+      var labels = thumbDOM.children;
+      labels.forEach(function (labelDOM) {
+        labelDOM.style.opacity = 1;
+      });
+    }
+  },
+  createLegendOverlay: function createLegendOverlay(value, opt) {
+    this.clearOverlay();
+    var handleSize = this.legendHandleSize;
+    var min = opt.min,
+        max = opt.max;
+
+    if (min === undefined || max === undefined) {
+      return;
+    }
+
+    var targetDOM = this.containerDOM.getElementsByClassName('ev-chart-legend-line')[0];
+    var overlayDOM = document.createElement('div');
+    overlayDOM.className = 'ev-chart-legend-overlay';
+    overlayDOM.dataset.type = 'overlay';
+    var tooltipDOM = document.createElement('div');
+    tooltipDOM.className = 'ev-chart-legend-overlay-tooltip';
+    tooltipDOM.innerText = Math.floor(min + (max - min) * (value / 100));
+    var itemDOM = document.createElement('span');
+    itemDOM.className = 'ev-chart-legend-overlay-item';
+    itemDOM.dataset.type = 'overlay-item';
+    var itemStyle;
+    var tooltipStyle;
+    var position = Math.floor(handleSize / 2) + 14;
+
+    if (this.isSide) {
+      tooltipStyle = "top:".concat(100 - value, "%;left:").concat(position, "px;transform:translateY(-50%);");
+      itemStyle = "top:".concat(100 - value, "%;transform:translateY(-50%);");
+    } else {
+      tooltipStyle = "top:-".concat(position, "px;left:").concat(value, "%;transform:translateX(-50%);");
+      itemStyle = "left:".concat(value, "%;transform:translateX(-50%);");
+    }
+
+    itemStyle += "width:".concat(handleSize - 10, "px;height:").concat(handleSize - 10, "px;");
+    tooltipDOM.style.cssText = tooltipStyle;
+    itemDOM.style.cssText = itemStyle;
+    overlayDOM.appendChild(tooltipDOM);
+    overlayDOM.appendChild(itemDOM);
+    targetDOM.appendChild(overlayDOM);
+    var thumbDOM = targetDOM.getElementsByClassName('ev-chart-legend-thumb')[0];
+    var labels = thumbDOM.children;
+    labels.forEach(function (labelDOM) {
+      labelDOM.style.opacity = 0.2;
+    });
+  },
+  createLegendHandle: function createLegendHandle(type) {
+    var colorBtnDOM = document.createElement('span');
+    colorBtnDOM.className = "ev-chart-legend-handle-btn-color ".concat(type);
+    colorBtnDOM.dataset.type = 'handle-btn-color';
+    var btnDOM = document.createElement('div');
+    btnDOM.className = "ev-chart-legend-handle-btn ".concat(type);
+    btnDOM.dataset.type = 'handle-btn';
+    btnDOM.appendChild(colorBtnDOM);
+    var handleDOM = document.createElement('div');
+    handleDOM.className = "ev-chart-legend-handle ".concat(type);
+    handleDOM.dataset.type = 'handle';
+    handleDOM.appendChild(btnDOM);
+    return handleDOM;
+  },
+  createLegendLabel: function createLegendLabel() {
+    var textDOM = document.createElement('span');
+    textDOM.className = 'ev-chart-legend-label-text';
+    var labelDOM = document.createElement('div');
+    labelDOM.className = 'ev-chart-legend-label';
+    return labelDOM;
+  },
+
+  /**
+   * Create legend DOM
+   *
+   * @returns {undefined}
+   */
+  createLegend: function createLegend() {
+    if (!Object.values(this.seriesList).length) {
+      return;
+    }
+
+    var opt = this.options.legend;
+    this.isSide = !['top', 'bottom'].includes(opt.position);
+    var legendSize = this.isSide ? opt.width : opt.height;
+    this.legendHandleSize = legendSize > MAX_HANDLE_SIZE ? MAX_HANDLE_SIZE : legendSize;
+    var handleSize = this.legendHandleSize;
+    var startHandleDOM = this.createLegendHandle(this.isSide ? 'end' : 'start', handleSize);
+    var endHandleDOM = this.createLegendHandle(this.isSide ? 'start' : 'end', handleSize);
+    var lineLayerDOM = document.createElement('div');
+    lineLayerDOM.className = 'ev-chart-legend-line-layer';
+    lineLayerDOM.dataset.type = 'line-layer';
+    var thumbDOM = document.createElement('div');
+    thumbDOM.className = 'ev-chart-legend-thumb';
+    thumbDOM.dataset.type = 'thumb';
+    thumbDOM.appendChild(this.createLegendLabel());
+    thumbDOM.appendChild(this.createLegendLabel());
+    var lineDOM = document.createElement('div');
+    lineDOM.className = 'ev-chart-legend-line';
+    lineDOM.dataset.type = 'line';
+    lineDOM.appendChild(lineLayerDOM);
+    lineDOM.appendChild(thumbDOM);
+    this.containerDOM.appendChild(lineDOM);
+    this.containerDOM.appendChild(startHandleDOM);
+    this.containerDOM.appendChild(endHandleDOM);
+  },
+  setLegendStyle: function setLegendStyle(series) {
+    var dir = this.isSide ? 'top' : 'right';
+    var handleSize = this.legendHandleSize;
+    var valueOpt = series.valueOpt,
+        colorState = series.colorState;
+    var min = valueOpt.min,
+        max = valueOpt.max,
+        decimalPoint = valueOpt.decimalPoint;
+    var _colorState$3 = colorState[0],
+        start = _colorState$3.start,
+        end = _colorState$3.end;
+    var startColor = series.getColorForGradient(start);
+    var endColor = series.getColorForGradient(end);
+    var gradient = "linear-gradient(to ".concat(dir, ", ");
+    gradient += "".concat(startColor, ", ").concat(endColor, ")");
+    var labelPosition = Math.floor(handleSize / 2) + 14;
+    var defaultHandleStyle = "width:".concat(handleSize, "px;height:").concat(handleSize, "px;");
+    var labelStyle;
+    var startStyle;
+    var endStyle;
+    var thumbStyle = "background:".concat(gradient, ";");
+
+    if (this.isSide) {
+      defaultHandleStyle += "margin-top:-".concat(handleSize / 2, "px;");
+      labelStyle = "left:".concat(labelPosition, "px;transform:translateY(-50%);top:");
+      startStyle = "top:".concat(100 - end, "%;");
+      endStyle = "top:".concat(100 - start, "%;");
+      thumbStyle += "top:".concat(100 - end, "%;height:").concat(end - start, "%;");
+    } else {
+      defaultHandleStyle += "margin-left:-".concat(handleSize / 2, "px;");
+      labelStyle = "top:-".concat(labelPosition, "px;transform:translateX(-50%);left:");
+      startStyle = "left:".concat(start, "%;");
+      endStyle = "left:".concat(end, "%;");
+      thumbStyle += "left:".concat(start, "%;width:").concat(end - start, "%;");
+    }
+
+    var minText = (min + (max - min) * (start / 100)).toFixed(decimalPoint);
+    var maxText = (min + (max - min) * (end / 100)).toFixed(decimalPoint);
+    var thumbDOM = this.containerDOM.getElementsByClassName('ev-chart-legend-thumb')[0];
+    thumbDOM.style.cssText = thumbStyle;
+    var labelDOM = thumbDOM.getElementsByClassName('ev-chart-legend-label');
+    labelDOM[0].style.cssText = "".concat(labelStyle, "0%;");
+    labelDOM[1].style.cssText = "".concat(labelStyle, "100%;");
+
+    if (min !== undefined && max !== undefined) {
+      labelDOM[0].innerText = this.isSide ? maxText : minText;
+      labelDOM[1].innerText = this.isSide ? minText : maxText;
+    }
+
+    var handleDOM = this.containerDOM.getElementsByClassName('ev-chart-legend-handle');
+    handleDOM[0].style.cssText = defaultHandleStyle + startStyle;
+    handleDOM[1].style.cssText = defaultHandleStyle + endStyle;
+    var btnDOM = this.containerDOM.getElementsByClassName('ev-chart-legend-handle-btn-color');
+    btnDOM[0].style.backgroundColor = this.isSide ? endColor : startColor;
+    btnDOM[1].style.backgroundColor = this.isSide ? startColor : endColor;
+  },
+
+  /**
+   * Set legend components position by option
+   *
+   * @returns {undefined}
+   */
+  setLegendPosition: function setLegendPosition() {
+    var _opt$legend, _opt$title, _opt$title2, _opt$legend$padding, _opt$legend2;
+
+    var opt = this.options;
+    var position = opt === null || opt === void 0 ? void 0 : (_opt$legend = opt.legend) === null || _opt$legend === void 0 ? void 0 : _opt$legend.position;
+    var minWidth = MIN_BOX_SIZE.width,
+        minHeight = MIN_BOX_SIZE.height;
+    var handleSize = this.legendHandleSize;
+    var title = opt !== null && opt !== void 0 && (_opt$title = opt.title) !== null && _opt$title !== void 0 && _opt$title.show ? opt === null || opt === void 0 ? void 0 : (_opt$title2 = opt.title) === null || _opt$title2 === void 0 ? void 0 : _opt$title2.height : 0;
+    var positionTop = title + minHeight;
+
+    var _ref = (_opt$legend$padding = opt === null || opt === void 0 ? void 0 : (_opt$legend2 = opt.legend) === null || _opt$legend2 === void 0 ? void 0 : _opt$legend2.padding) !== null && _opt$legend$padding !== void 0 ? _opt$legend$padding : {},
+        _ref$top = _ref.top,
+        top = _ref$top === void 0 ? 0 : _ref$top,
+        _ref$bottom = _ref.bottom,
+        bottom = _ref$bottom === void 0 ? 0 : _ref$bottom,
+        _ref$left = _ref.left,
+        left = _ref$left === void 0 ? 0 : _ref$left,
+        _ref$right = _ref.right,
+        right = _ref$right === void 0 ? 0 : _ref$right;
+
+    var wrapperStyle = this.wrapperDOM.style;
+
+    if (!wrapperStyle) {
+      return;
+    }
+
+    var legendStyle;
+    var boxStyle;
+    var containerStyle;
+    var chartRect;
+
+    switch (position) {
+      case 'top':
+        wrapperStyle.padding = "".concat(positionTop, "px 0 0 0");
+        chartRect = this.chartDOM.getBoundingClientRect();
+        boxStyle = "padding:".concat(handleSize + 7, "px ").concat(right, "px ").concat(bottom, "px ").concat(left, "px;");
+        boxStyle += 'width:100%';
+        boxStyle += "height".concat(minHeight, "px;");
+        legendStyle = "width:".concat(chartRect.width, "px;");
+        legendStyle += "height:".concat(minHeight, "px;");
+        legendStyle += "top:".concat(title, "px;");
+        break;
+
+      case 'right':
+        wrapperStyle.padding = "".concat(title, "px ").concat(minWidth, "px 0 0");
+        chartRect = this.chartDOM.getBoundingClientRect();
+        boxStyle = "padding:".concat(top, "px ").concat(right, "px ").concat(bottom, "px ").concat(left, "px;");
+        boxStyle += "width:".concat(minWidth, "px;");
+        boxStyle += 'height:100%;';
+        boxStyle += "max-height:".concat(chartRect.height, "px;");
+        legendStyle = "width:".concat(minWidth, "px;");
+        legendStyle += "height:".concat(chartRect.height, "px;");
+        legendStyle += "top:".concat(title, "px;right:0px;");
+        break;
+
+      case 'bottom':
+        wrapperStyle.padding = "".concat(title, "px 0 ").concat(minHeight, "px 0");
+        chartRect = this.chartDOM.getBoundingClientRect();
+        boxStyle = "padding:".concat(handleSize + 7, "px ").concat(right, "px ").concat(bottom, "px ").concat(left, "px;");
+        boxStyle += 'width:100%;';
+        boxStyle += "height:".concat(minHeight, "px;");
+        legendStyle = "width:".concat(chartRect.width, "px;");
+        legendStyle += "height:".concat(minHeight, "px;");
+        legendStyle += 'bottom:0px;left:0px;';
+        break;
+
+      case 'left':
+        wrapperStyle.padding = "".concat(title, "px 0 0 ").concat(minWidth, "px");
+        chartRect = this.chartDOM.getBoundingClientRect();
+        boxStyle = "padding:".concat(top, "px ").concat(right, "px ").concat(bottom, "px ").concat(left, "px;");
+        boxStyle += 'display:absolute;';
+        boxStyle += 'bottom:0px;';
+        boxStyle += "width:".concat(minWidth, "px;");
+        boxStyle += 'height:100%;';
+        boxStyle += "maxHeight:".concat(chartRect.height, "px;");
+        legendStyle = "width:".concat(minWidth, "px;");
+        legendStyle += "height:".concat(chartRect.height, "px;");
+        legendStyle += "top:".concat(title, "px;left:0px");
+        break;
+
+      default:
+        break;
+    }
+
+    if (['top', 'bottom'].includes(position)) {
+      var containerSize = chartRect.width / 2;
+      containerStyle = "left:".concat(chartRect.width / 2 - containerSize / 2, "px;");
+      containerStyle += "width:".concat(containerSize, "px;");
+      containerStyle += "height:".concat(handleSize, "px;");
+      containerStyle += 'padding:4px 0;';
+      containerStyle += 'margin:0 4px;';
+    } else {
+      var _containerSize = chartRect.height / 2;
+
+      containerStyle = "top:".concat(chartRect.height / 2 - _containerSize / 2, "px;");
+      containerStyle += 'left:5px;';
+      containerStyle += "width:".concat(handleSize, "px;");
+      containerStyle += "height:".concat(_containerSize, "px;");
+      containerStyle += 'padding:0 4px;';
+      containerStyle += 'margin:4px 0;';
+    }
+
+    this.containerDOM.style.cssText = containerStyle;
+    this.legendBoxDOM.style.cssText = boxStyle;
+    this.legendDOM.style.cssText = legendStyle;
+  },
+
+  /**
+   * Update legend components size
+   *
+   * @returns {undefined}
+   */
+  updateLegendContainerSize: function updateLegendContainerSize() {
+    var _this4 = this;
+
+    Object.values(this.seriesList).forEach(function (series) {
+      _this4.setLegendStyle(series);
+    });
+  },
+
+  /**
+   * Show legend components by manipulating css
+   *
+   * @returns {undefined}
+   */
+  showLegend: function showLegend() {
+    if (this.resizeDOM) {
+      this.resizeDOM.style.display = 'block';
+    }
+
+    if (this.legendDOM) {
+      this.legendDOM.style.display = 'block';
+    }
+  },
+
+  /**
+   * Hide legend components by manipulating css
+   *
+   * @returns {undefined}
+   */
+  hideLegend: function hideLegend() {
+    var _this$wrapperDOM, _this$legendDOM, _opt$title3, _opt$title4;
+
+    var opt = this.options;
+    var wrapperStyle = (_this$wrapperDOM = this.wrapperDOM) === null || _this$wrapperDOM === void 0 ? void 0 : _this$wrapperDOM.style;
+    var legendStyle = (_this$legendDOM = this.legendDOM) === null || _this$legendDOM === void 0 ? void 0 : _this$legendDOM.style;
+    var title = opt !== null && opt !== void 0 && (_opt$title3 = opt.title) !== null && _opt$title3 !== void 0 && _opt$title3.show ? opt === null || opt === void 0 ? void 0 : (_opt$title4 = opt.title) === null || _opt$title4 === void 0 ? void 0 : _opt$title4.height : 0;
+
+    if (!legendStyle || !wrapperStyle) {
+      return;
+    }
+
+    legendStyle.display = 'none';
+    legendStyle.width = '0';
+    legendStyle.height = '0';
+    wrapperStyle.padding = "".concat(title, "px 0 0 0");
+  }
+};
+/* harmony default export */ var plugins_legend_gradient = (plugins_legend_gradient_modules);
 // EXTERNAL MODULE: ./node_modules/core-js/modules/es.object.from-entries.js
 var es_object_from_entries = __webpack_require__("c1f9");
 
@@ -40591,6 +41402,7 @@ var plugins_interaction_modules = {
 
 
 
+
 var TITLE_HEIGHT = 30;
 var TEXT_HEIGHT = 14;
 var LINE_SPACING = 8;
@@ -40937,7 +41749,7 @@ var plugins_tooltip_modules = {
    * @returns {undefined}
    */
   drawToolTipForHeatMap: function drawToolTipForHeatMap(hitInfo, context) {
-    var _opt$formatter3, _opt$formatter4, _colorAxis$find;
+    var _opt$formatter3, _opt$formatter4;
 
     var ctx = context;
     var items = hitInfo.items;
@@ -40955,11 +41767,28 @@ var plugins_tooltip_modules = {
     var opt = this.options.tooltip;
     var valueFormatter = typeof opt.formatter === 'function' ? opt.formatter : (_opt$formatter3 = opt.formatter) === null || _opt$formatter3 === void 0 ? void 0 : _opt$formatter3.value;
     var titleFormatter = (_opt$formatter4 = opt.formatter) === null || _opt$formatter4 === void 0 ? void 0 : _opt$formatter4.title;
-    var colorAxis = Object.values(this.seriesList)[0].colorAxis;
-    var isShow = (_colorAxis$find = colorAxis.find(function (_ref) {
-      var id = _ref.id;
-      return id === hitItem.cId;
-    })) === null || _colorAxis$find === void 0 ? void 0 : _colorAxis$find.show;
+    var series = Object.values(this.seriesList)[0];
+    var isShow = false;
+    var colorState = series.colorState,
+        isGradient = series.isGradient;
+
+    if (isGradient) {
+      var _series$valueOpt = series.valueOpt,
+          min = _series$valueOpt.min,
+          max = _series$valueOpt.max;
+      var ratio = convertToPercent(hitItem.o - min, max - min);
+      var _colorState$ = colorState[0],
+          start = _colorState$.start,
+          end = _colorState$.end;
+      isShow = start <= ratio && ratio <= end || hitItem.o === -1;
+    } else {
+      var _colorState$find;
+
+      isShow = (_colorState$find = colorState.find(function (_ref) {
+        var id = _ref.id;
+        return id === hitItem.cId;
+      })) === null || _colorState$find === void 0 ? void 0 : _colorState$find.show;
+    }
 
     if (!isShow) {
       this.tooltipClear();
@@ -42214,6 +43043,7 @@ var element_tip_modules = {
 
 
 
+
 
 
 var chart_core_EvChart = /*#__PURE__*/function () {
@@ -42231,6 +43061,11 @@ var chart_core_EvChart = /*#__PURE__*/function () {
     Object.assign(this, plugins_tooltip);
     Object.assign(this, plugins_pie);
     Object.assign(this, element_tip);
+
+    if (options.type === 'heatMap' && options.legend.type === 'gradient') {
+      Object.assign(this, plugins_legend_gradient);
+    }
+
     this.target = target;
     this.data = data;
     this.options = options;
@@ -42403,7 +43238,8 @@ var chart_core_EvChart = /*#__PURE__*/function () {
         selectSeries: {
           option: selectSeries,
           selected: this.defaultSelectInfo
-        }
+        },
+        overlayCtx: this.overlayCtx
       };
       var showIndex = 0;
       var showSeriesCount = 0;
@@ -43183,6 +44019,7 @@ var DEFAULT_OPTIONS = {
   },
   legend: {
     show: true,
+    type: 'icon',
     position: 'right',
     color: '#353740',
     inactive: '#aaa',
@@ -43270,12 +44107,13 @@ var DEFAULT_OPTIONS = {
   heatMapColor: {
     min: '#FFFFFF',
     max: '#0052FF',
-    categoryCnt: 5,
+    categoryCnt: 1,
     stroke: {
       show: false,
       color: '#FFFFFF',
       lineWidth: 1,
-      opacity: 1
+      opacity: 1,
+      radius: 0
     },
     error: '#FF0000',
     decimalPoint: 0
@@ -43684,32 +44522,32 @@ Chart.install = function (app) {
 };
 
 /* harmony default export */ var chart = (Chart);
-// CONCATENATED MODULE: ./node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib!./node_modules/vue-loader-v16/dist/templateLoader.js??ref--6!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader-v16/dist??ref--0-1!./src/components/treeGrid/TreeGrid.vue?vue&type=template&id=1aab6f12&scoped=true
+// CONCATENATED MODULE: ./node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib!./node_modules/vue-loader-v16/dist/templateLoader.js??ref--6!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader-v16/dist??ref--0-1!./src/components/treeGrid/TreeGrid.vue?vue&type=template&id=0c99a380&scoped=true
 
 
-var TreeGridvue_type_template_id_1aab6f12_scoped_true_withId = /*#__PURE__*/Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withScopeId"])("data-v-1aab6f12");
+var TreeGridvue_type_template_id_0c99a380_scoped_true_withId = /*#__PURE__*/Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withScopeId"])("data-v-0c99a380");
 
-Object(external_commonjs_vue_commonjs2_vue_root_Vue_["pushScopeId"])("data-v-1aab6f12");
+Object(external_commonjs_vue_commonjs2_vue_root_Vue_["pushScopeId"])("data-v-0c99a380");
 
-var TreeGridvue_type_template_id_1aab6f12_scoped_true_hoisted_1 = {
+var TreeGridvue_type_template_id_0c99a380_scoped_true_hoisted_1 = {
   class: "column-list"
 };
-var TreeGridvue_type_template_id_1aab6f12_scoped_true_hoisted_2 = {
+var TreeGridvue_type_template_id_0c99a380_scoped_true_hoisted_2 = {
   key: 0
 };
 
-var TreeGridvue_type_template_id_1aab6f12_scoped_true_hoisted_3 = /*#__PURE__*/Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("td", {
+var TreeGridvue_type_template_id_0c99a380_scoped_true_hoisted_3 = /*#__PURE__*/Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("td", {
   class: "is-empty"
 }, "No records", -1);
 
-var TreeGridvue_type_template_id_1aab6f12_scoped_true_hoisted_4 = {
+var TreeGridvue_type_template_id_0c99a380_scoped_true_hoisted_4 = {
   ref: "resizeLine",
   class: "table-resize-line"
 };
 
 Object(external_commonjs_vue_commonjs2_vue_root_Vue_["popScopeId"])();
 
-var TreeGridvue_type_template_id_1aab6f12_scoped_true_render = /*#__PURE__*/TreeGridvue_type_template_id_1aab6f12_scoped_true_withId(function (_ctx, _cache, $props, $setup, $data, $options) {
+var TreeGridvue_type_template_id_0c99a380_scoped_true_render = /*#__PURE__*/TreeGridvue_type_template_id_0c99a380_scoped_true_withId(function (_ctx, _cache, $props, $setup, $data, $options) {
   var _component_toolbar = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["resolveComponent"])("toolbar");
 
   var _component_ev_checkbox = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["resolveComponent"])("ev-checkbox");
@@ -43731,7 +44569,7 @@ var TreeGridvue_type_template_id_1aab6f12_scoped_true_render = /*#__PURE__*/Tree
     class: "toolbar-wrapper",
     style: "width: ".concat(_ctx.gridWidth, ";")
   }, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])(_component_toolbar, null, {
-    toolbarWrapper: TreeGridvue_type_template_id_1aab6f12_scoped_true_withId(function () {
+    toolbarWrapper: TreeGridvue_type_template_id_0c99a380_scoped_true_withId(function () {
       return [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["renderSlot"])(_ctx.$slots, "toolbar", {
         item: {
           onSearch: $setup.onSearch
@@ -43748,7 +44586,7 @@ var TreeGridvue_type_template_id_1aab6f12_scoped_true_render = /*#__PURE__*/Tree
   }, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withDirectives"])(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("div", {
     ref: "header",
     class: $setup.headerClass
-  }, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("ul", TreeGridvue_type_template_id_1aab6f12_scoped_true_hoisted_1, [_ctx.useCheckbox.use ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])("li", {
+  }, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("ul", TreeGridvue_type_template_id_0c99a380_scoped_true_hoisted_1, [_ctx.useCheckbox.use ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])("li", {
     key: 0,
     class: $setup.headerCheckboxClass,
     style: "width: ".concat(_ctx.minWidth, "px;")
@@ -43817,7 +44655,7 @@ var TreeGridvue_type_template_id_1aab6f12_scoped_true_render = /*#__PURE__*/Tree
     }, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["renderList"])(_ctx.orderedColumns, function (column, cellIndex) {
       return {
         name: $setup.getSlotName(column.field),
-        fn: TreeGridvue_type_template_id_1aab6f12_scoped_true_withId(function (_ref) {
+        fn: TreeGridvue_type_template_id_0c99a380_scoped_true_withId(function (_ref) {
           var item = _ref.item;
           return [!!_ctx.$slots[column.field] ? Object(external_commonjs_vue_commonjs2_vue_root_Vue_["renderSlot"])(_ctx.$slots, column.field, {
             key: 0,
@@ -43832,13 +44670,13 @@ var TreeGridvue_type_template_id_1aab6f12_scoped_true_render = /*#__PURE__*/Tree
         })
       };
     })]), 1032, ["selected-data", "node-data", "use-checkbox", "ordered-columns", "expand-icon", "collapse-icon", "parent-icon", "child-icon", "is-resize", "row-height", "min-width", "highlight-index", "border-style", "onCheckTreeData", "onExpandTreeData", "onClickTreeData", "onDblClickTreeData"]);
-  }), 128)), !_ctx.viewStore.length ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])("tr", TreeGridvue_type_template_id_1aab6f12_scoped_true_hoisted_2, [TreeGridvue_type_template_id_1aab6f12_scoped_true_hoisted_3])) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true)])]), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("div", {
+  }), 128)), !_ctx.viewStore.length ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])("tr", TreeGridvue_type_template_id_0c99a380_scoped_true_hoisted_2, [TreeGridvue_type_template_id_0c99a380_scoped_true_hoisted_3])) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true)])]), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("div", {
     style: "height: ".concat(_ctx.vScrollBottomHeight, "px;"),
     class: "vscroll-spacer"
   }, null, 4), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])(_component_ev_context_menu, {
     ref: "menu",
     items: _ctx.contextMenuItems
-  }, null, 8, ["items"])], 34), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withDirectives"])(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("div", TreeGridvue_type_template_id_1aab6f12_scoped_true_hoisted_4, null, 512), [[external_commonjs_vue_commonjs2_vue_root_Vue_["vShow"], _ctx.showResizeLine]])], 2)], 4), [[_directive_resize, $setup.onResize], [_directive_observe_visibility, {
+  }, null, 8, ["items"])], 34), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withDirectives"])(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("div", TreeGridvue_type_template_id_0c99a380_scoped_true_hoisted_4, null, 512), [[external_commonjs_vue_commonjs2_vue_root_Vue_["vShow"], _ctx.showResizeLine]])], 2)], 4), [[_directive_resize, $setup.onResize], [_directive_observe_visibility, {
     callback: $setup.onShow,
     once: true
   }]]), $setup.useSummary ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])(_component_grid_summary, {
@@ -43859,14 +44697,14 @@ var TreeGridvue_type_template_id_1aab6f12_scoped_true_render = /*#__PURE__*/Tree
     "onUpdate:modelValue": _cache[5] || (_cache[5] = function ($event) {
       return _ctx.currentPage = $event;
     }),
-    total: _ctx.showTreeStore.length,
+    total: _ctx.pageTotal,
     "per-page": _ctx.perPage,
     "visible-page": _ctx.visiblePage,
     "show-page-info": _ctx.showPageInfo,
     order: _ctx.order
   }, null, 8, ["modelValue", "total", "per-page", "visible-page", "show-page-info", "order"])) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true)], 64);
 });
-// CONCATENATED MODULE: ./src/components/treeGrid/TreeGrid.vue?vue&type=template&id=1aab6f12&scoped=true
+// CONCATENATED MODULE: ./src/components/treeGrid/TreeGrid.vue?vue&type=template&id=0c99a380&scoped=true
 
 // CONCATENATED MODULE: ./node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib!./node_modules/vue-loader-v16/dist/templateLoader.js??ref--6!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader-v16/dist??ref--0-1!./src/components/treeGrid/TreeGridNode.vue?vue&type=template&id=89ae5faa&scoped=true
 
@@ -45243,7 +46081,7 @@ var treeGrid_uses_pagingEvent = function pagingEvent(params) {
         currentPage: pageInfo.currentPage,
         prevPage: pageInfo.prevPage,
         startIndex: pageInfo.startIndex,
-        total: pageInfo.total,
+        total: pageInfo.pageTotal,
         perPage: pageInfo.perPage
       },
       searchInfo: {
@@ -45431,7 +46269,7 @@ var treeGrid_uses_pagingEvent = function pagingEvent(params) {
       startIndex: 0,
       prevPage: 0,
       currentPage: 0,
-      total: Object(external_commonjs_vue_commonjs2_vue_root_Vue_["computed"])(function () {
+      pageTotal: Object(external_commonjs_vue_commonjs2_vue_root_Vue_["computed"])(function () {
         var _props$option$page4;
 
         return ((_props$option$page4 = props.option.page) === null || _props$option$page4 === void 0 ? void 0 : _props$option$page4.total) || 0;
@@ -45744,6 +46582,7 @@ var treeGrid_uses_pagingEvent = function pagingEvent(params) {
 
                 setParentShow = function setParentShow(data) {
                   if (!(data !== null && data !== void 0 && data.parent)) {
+                    setChildShow(data);
                     return;
                   }
 
@@ -46004,8 +46843,8 @@ var treeGrid_uses_pagingEvent = function pagingEvent(params) {
 });
 // CONCATENATED MODULE: ./src/components/treeGrid/TreeGrid.vue?vue&type=script&lang=js
  
-// EXTERNAL MODULE: ./src/components/treeGrid/TreeGrid.vue?vue&type=style&index=0&id=1aab6f12&lang=scss&scoped=true
-var TreeGridvue_type_style_index_0_id_1aab6f12_lang_scss_scoped_true = __webpack_require__("af65");
+// EXTERNAL MODULE: ./src/components/treeGrid/TreeGrid.vue?vue&type=style&index=0&id=0c99a380&lang=scss&scoped=true
+var TreeGridvue_type_style_index_0_id_0c99a380_lang_scss_scoped_true = __webpack_require__("e67b");
 
 // CONCATENATED MODULE: ./src/components/treeGrid/TreeGrid.vue
 
@@ -46013,8 +46852,8 @@ var TreeGridvue_type_style_index_0_id_1aab6f12_lang_scss_scoped_true = __webpack
 
 
 
-TreeGridvue_type_script_lang_js.render = TreeGridvue_type_template_id_1aab6f12_scoped_true_render
-TreeGridvue_type_script_lang_js.__scopeId = "data-v-1aab6f12"
+TreeGridvue_type_script_lang_js.render = TreeGridvue_type_template_id_0c99a380_scoped_true_render
+TreeGridvue_type_script_lang_js.__scopeId = "data-v-0c99a380"
 
 /* harmony default export */ var TreeGrid = (TreeGridvue_type_script_lang_js);
 // CONCATENATED MODULE: ./src/components/treeGrid/index.js