bkui-vue 0.0.2-beta.120 → 0.0.2-beta.122

package/lib/table/index.js

@@ -14,8 +14,8 @@ import * as __WEBPACK_EXTERNAL_MODULE__pagination_6e36ddb9__ from "../pagination
 import * as __WEBPACK_EXTERNAL_MODULE__directives_9cc9ba10__ from "../directives";
 import * as __WEBPACK_EXTERNAL_MODULE__exception_12c197e0__ from "../exception";
 import * as __WEBPACK_EXTERNAL_MODULE__button_59c00871__ from "../button";
-import * as __WEBPACK_EXTERNAL_MODULE__popover_cf5f8dce__ from "../popover";
 import * as __WEBPACK_EXTERNAL_MODULE__icon__2ba2075d__ from "../icon/";
+import * as __WEBPACK_EXTERNAL_MODULE__popover_cf5f8dce__ from "../popover";
 /******/ // The require scope
 /******/ var __webpack_require__ = {};
 /******/ 
@@ -1607,6 +1607,7 @@ function use_pagination_objectSpread(target) { for (var i = 1; i < arguments.len
  * IN THE SOFTWARE.
  */
 
+
 /**
  * 处理 Prop中的分页配置
  * prop中的配置会覆盖本地的配置
@@ -1684,6 +1685,16 @@ var resolvePaginationOption = function resolvePaginationOption(propPagination, d
       });
     }
   };
+  /**
+   * 初始化排序动作
+   * @param data
+   * @param sortColumns
+   */
+  var multiSort = function multiSort(data, sortColumns) {
+    sortColumns.forEach(function (item) {
+      sort(data, item.schema[COLUMN_ATTRIBUTE.COL_SORT_FN], item.column, item.schema[COLUMN_ATTRIBUTE.COL_SORT_TYPE], item.schema[COLUMN_ATTRIBUTE.COL_SORT_SCOPE]);
+    });
+  };
   var filter = function filter(sourceData, filterFn) {
     if (typeof filterFn === 'function') {
       var filterVals = sourceData.filter(function (row, index) {
@@ -1694,14 +1705,20 @@ var resolvePaginationOption = function resolvePaginationOption(propPagination, d
     }
     return sourceData;
   };
-  var resolvePageData = function resolvePageData(filterFn, sortFn, column, type, sortScope) {
+  var resolvePageData = function resolvePageData(filterFn, sortFn, column, type, sortScope, multiCol) {
     var sourceData = indexData.value.slice();
+    if (multiCol !== null && multiCol !== void 0 && multiCol.length) {
+      multiSort(sourceData, multiCol);
+    }
     pageData.length = 0;
     pageData.push.apply(pageData, _toConsumableArray(sourceData.slice(startIndex.value, endIndex.value)));
     filter(pageData, filterFn);
     sort(pageData, sortFn, column, type, sortScope);
     resolveLocalPagination();
   };
+  var resolvePageDataBySortList = function resolvePageDataBySortList(multiCol) {
+    resolvePageData(null, null, null, null, null, multiCol);
+  };
   var multiFilter = function multiFilter(filterFnList) {
     var sourceData = indexData.value.slice();
     var target = filterFnList.reduce(function (result, fn) {
@@ -1729,6 +1746,7 @@ var resolvePaginationOption = function resolvePaginationOption(propPagination, d
     indexData: indexData,
     localPagination: localPagination,
     resolvePageData: resolvePageData,
+    resolvePageDataBySortList: resolvePageDataBySortList,
     resetStartEndIndex: resetStartEndIndex,
     multiFilter: multiFilter,
     sort: sort
@@ -3056,8 +3074,9 @@ var getSortFn = function getSortFn(column, sortType) {
     return getRowText(row, fieldName);
   };
   var sortFn0 = function sortFn0(a, b) {
-    var val0 = getVal(a) || '';
-    var val1 = getVal(b) || '';
+    var _getVal, _getVal2;
+    var val0 = (_getVal = getVal(a)) !== null && _getVal !== void 0 ? _getVal : '';
+    var val1 = (_getVal2 = getVal(b)) !== null && _getVal2 !== void 0 ? _getVal2 : '';
     if (typeof val0 === 'number' && typeof val1 === 'number') {
       return val0 - val1;
     }
@@ -3072,13 +3091,13 @@ var getSortFn = function getSortFn(column, sortType) {
 };
 var getNextSortType = function getNextSortType(sortType) {
   var _steps;
-  var steps = (_steps = {}, defineProperty_defineProperty(_steps, SORT_OPTION.NULL, 0), defineProperty_defineProperty(_steps, SORT_OPTION.ASC, 1), defineProperty_defineProperty(_steps, SORT_OPTION.DESC, 2), _steps);
+  var steps = (_steps = {}, defineProperty_defineProperty(_steps, SORT_OPTION.NULL, 3), defineProperty_defineProperty(_steps, SORT_OPTION.ASC, 1), defineProperty_defineProperty(_steps, SORT_OPTION.DESC, 2), _steps);
   if (steps[sortType] === undefined) {
-    return SORT_OPTION.NULL;
+    return SORT_OPTION.ASC;
   }
   return Object.keys(steps)[(steps[sortType] + 1) % 3];
 };
-var resolveSort = function resolveSort(sort) {
+var resolveSort = function resolveSort(sort, column) {
   if (typeof sort === 'string') {
     return {
       value: sort
@@ -3090,12 +3109,15 @@ var resolveSort = function resolveSort(sort) {
     };
   }
   if (typeof_typeof(sort) === 'object' && sort !== null) {
-    if (typeof_typeof(sort.sortFn)) {
+    var _sort$value;
+    if (typeof sort.sortFn === 'function') {
       return utils_objectSpread({
         value: 'custom'
       }, sort);
     }
-    return sort;
+    return Object.assign({}, {
+      sortFn: getSortFn(column, (_sort$value = sort.value) !== null && _sort$value !== void 0 ? _sort$value : SORT_OPTION.NULL)
+    }, sort);
   }
   return null;
 };
@@ -3124,7 +3146,7 @@ var getRowId = function getRowId(row, defVal, props) {
 };
 var resolveColumnSortProp = function resolveColumnSortProp(col, props) {
   var _resolveSort, _col$sort;
-  var _ref4 = (_resolveSort = resolveSort((_col$sort = col.sort) !== null && _col$sort !== void 0 ? _col$sort : props.defaultSort)) !== null && _resolveSort !== void 0 ? _resolveSort : {},
+  var _ref4 = (_resolveSort = resolveSort((_col$sort = col.sort) !== null && _col$sort !== void 0 ? _col$sort : props.defaultSort, col)) !== null && _resolveSort !== void 0 ? _resolveSort : {},
     value = _ref4.value,
     sortFn = _ref4.sortFn,
     sortScope = _ref4.sortScope;
@@ -3132,7 +3154,7 @@ var resolveColumnSortProp = function resolveColumnSortProp(col, props) {
     type: value,
     fn: sortFn,
     scope: sortScope,
-    active: false
+    active: !!col.sort
   };
 };
 ;// CONCATENATED MODULE: ../../packages/table/src/use-attributes.ts
@@ -3205,6 +3227,7 @@ function use_attributes_objectSpread(target) { for (var i = 1; i < arguments.len
     pageData = _usePagination.pageData,
     localPagination = _usePagination.localPagination,
     resolvePageData = _usePagination.resolvePageData,
+    resolvePageDataBySortList = _usePagination.resolvePageDataBySortList,
     multiFilter = _usePagination.multiFilter,
     sort = _usePagination.sort,
     resetStartEndIndex = _usePagination.resetStartEndIndex;
@@ -3270,7 +3293,16 @@ function use_attributes_objectSpread(target) { for (var i = 1; i < arguments.len
           fn = _resolveColumnSortPro.fn,
           scope = _resolveColumnSortPro.scope,
           active = _resolveColumnSortPro.active;
-        formatData.columnSchema.set(col, (_formatData$columnSch = {}, defineProperty_defineProperty(_formatData$columnSch, COLUMN_ATTRIBUTE.CALC_WIDTH, undefined), defineProperty_defineProperty(_formatData$columnSch, COLUMN_ATTRIBUTE.RESIZE_WIDTH, undefined), defineProperty_defineProperty(_formatData$columnSch, COLUMN_ATTRIBUTE.COL_MIN_WIDTH, resolveMinWidth(col)), defineProperty_defineProperty(_formatData$columnSch, COLUMN_ATTRIBUTE.LISTENERS, new Map()), defineProperty_defineProperty(_formatData$columnSch, COLUMN_ATTRIBUTE.WIDTH, col.width), defineProperty_defineProperty(_formatData$columnSch, COLUMN_ATTRIBUTE.IS_HIDDEN, isColumnHidden(formatData.settings.fields, col, formatData.settings.checked)), defineProperty_defineProperty(_formatData$columnSch, COLUMN_ATTRIBUTE.COL_SORT_TYPE, type), defineProperty_defineProperty(_formatData$columnSch, COLUMN_ATTRIBUTE.COL_SORT_FN, fn), defineProperty_defineProperty(_formatData$columnSch, COLUMN_ATTRIBUTE.COL_FILTER_FN, undefined), defineProperty_defineProperty(_formatData$columnSch, COLUMN_ATTRIBUTE.COL_FILTER_SCOPE, undefined), defineProperty_defineProperty(_formatData$columnSch, COLUMN_ATTRIBUTE.COL_SORT_SCOPE, scope), defineProperty_defineProperty(_formatData$columnSch, COLUMN_ATTRIBUTE.COL_SORT_ACTIVE, active), defineProperty_defineProperty(_formatData$columnSch, COLUMN_ATTRIBUTE.COL_IS_DRAG, false), defineProperty_defineProperty(_formatData$columnSch, COLUMN_ATTRIBUTE.COL_SPAN, {
+        var getSortFn = function getSortFn(col) {
+          if (col.type === 'index') {
+            return function (a, b) {
+              var _formatData$dataSchem, _formatData$dataSchem2;
+              return fn === null || fn === void 0 ? void 0 : fn((_formatData$dataSchem = formatData.dataSchema.get(a)) === null || _formatData$dataSchem === void 0 ? void 0 : _formatData$dataSchem[TABLE_ROW_ATTRIBUTE.ROW_INDEX], (_formatData$dataSchem2 = formatData.dataSchema.get(b)) === null || _formatData$dataSchem2 === void 0 ? void 0 : _formatData$dataSchem2[TABLE_ROW_ATTRIBUTE.ROW_INDEX]);
+            };
+          }
+          return fn;
+        };
+        formatData.columnSchema.set(col, (_formatData$columnSch = {}, defineProperty_defineProperty(_formatData$columnSch, COLUMN_ATTRIBUTE.CALC_WIDTH, undefined), defineProperty_defineProperty(_formatData$columnSch, COLUMN_ATTRIBUTE.RESIZE_WIDTH, undefined), defineProperty_defineProperty(_formatData$columnSch, COLUMN_ATTRIBUTE.COL_MIN_WIDTH, resolveMinWidth(col)), defineProperty_defineProperty(_formatData$columnSch, COLUMN_ATTRIBUTE.LISTENERS, new Map()), defineProperty_defineProperty(_formatData$columnSch, COLUMN_ATTRIBUTE.WIDTH, col.width), defineProperty_defineProperty(_formatData$columnSch, COLUMN_ATTRIBUTE.IS_HIDDEN, isColumnHidden(formatData.settings.fields, col, formatData.settings.checked)), defineProperty_defineProperty(_formatData$columnSch, COLUMN_ATTRIBUTE.COL_SORT_TYPE, type), defineProperty_defineProperty(_formatData$columnSch, COLUMN_ATTRIBUTE.COL_SORT_FN, getSortFn(col)), defineProperty_defineProperty(_formatData$columnSch, COLUMN_ATTRIBUTE.COL_FILTER_FN, undefined), defineProperty_defineProperty(_formatData$columnSch, COLUMN_ATTRIBUTE.COL_FILTER_SCOPE, undefined), defineProperty_defineProperty(_formatData$columnSch, COLUMN_ATTRIBUTE.COL_SORT_SCOPE, scope), defineProperty_defineProperty(_formatData$columnSch, COLUMN_ATTRIBUTE.COL_SORT_ACTIVE, active), defineProperty_defineProperty(_formatData$columnSch, COLUMN_ATTRIBUTE.COL_IS_DRAG, false), defineProperty_defineProperty(_formatData$columnSch, COLUMN_ATTRIBUTE.COL_SPAN, {
           skipCol: skipCol,
           skipColumnNum: skipColumnNum,
           skipColLen: skipColLen
@@ -3369,17 +3401,26 @@ function use_attributes_objectSpread(target) { for (var i = 1; i < arguments.len
     }
     setColumnAttribute(column, COLUMN_ATTRIBUTE.COL_SORT_ACTIVE, active);
   };
+  var isRowChecked = function isRowChecked(row, index) {
+    if (isRowSelectEnable(props, {
+      row: row,
+      index: index
+    })) {
+      return getRowAttribute(row, TABLE_ROW_ATTRIBUTE.ROW_SELECTION);
+    }
+    return true;
+  };
   /**
    * 是否数据全选
    */
   var isCheckedAll = function isCheckedAll() {
     if (props.acrossAll) {
-      return formatData.data.every(function (row) {
-        return getRowAttribute(row, TABLE_ROW_ATTRIBUTE.ROW_SELECTION);
+      return formatData.data.every(function (row, index) {
+        return isRowChecked(row, index);
       });
     }
-    return pageData.every(function (row) {
-      return getRowAttribute(row, TABLE_ROW_ATTRIBUTE.ROW_SELECTION);
+    return pageData.every(function (row, index) {
+      return isRowChecked(row, index);
     });
   };
   /**
@@ -3502,7 +3543,7 @@ function use_attributes_objectSpread(target) { for (var i = 1; i < arguments.len
    * @param data
    */
   var formatDataSchema = function formatDataSchema(data) {
-    var _formatData$data, _formatData$dataSchem2;
+    var _formatData$data, _formatData$dataSchem4;
     formatData.data.length = 0;
     (_formatData$data = formatData.data).push.apply(_formatData$data, _toConsumableArray(data));
     var hasSelectedRow = false;
@@ -3516,8 +3557,8 @@ function use_attributes_objectSpread(target) { for (var i = 1; i < arguments.len
         hasUnSelectedRow = true;
       }
       if (!formatData.dataSchema.has(row)) {
-        var _formatData$dataSchem;
-        formatData.dataSchema.set(row, (_formatData$dataSchem = {}, defineProperty_defineProperty(_formatData$dataSchem, TABLE_ROW_ATTRIBUTE.ROW_EXPAND, false), defineProperty_defineProperty(_formatData$dataSchem, TABLE_ROW_ATTRIBUTE.ROW_SELECTION, isSelected), defineProperty_defineProperty(_formatData$dataSchem, TABLE_ROW_ATTRIBUTE.ROW_UID, rowId), defineProperty_defineProperty(_formatData$dataSchem, TABLE_ROW_ATTRIBUTE.ROW_INDEX, index + 1), defineProperty_defineProperty(_formatData$dataSchem, TABLE_ROW_ATTRIBUTE.ROW_SELECTION_INDETERMINATE, false), _formatData$dataSchem));
+        var _formatData$dataSchem3;
+        formatData.dataSchema.set(row, (_formatData$dataSchem3 = {}, defineProperty_defineProperty(_formatData$dataSchem3, TABLE_ROW_ATTRIBUTE.ROW_EXPAND, false), defineProperty_defineProperty(_formatData$dataSchem3, TABLE_ROW_ATTRIBUTE.ROW_SELECTION, isSelected), defineProperty_defineProperty(_formatData$dataSchem3, TABLE_ROW_ATTRIBUTE.ROW_UID, rowId), defineProperty_defineProperty(_formatData$dataSchem3, TABLE_ROW_ATTRIBUTE.ROW_INDEX, index + 1), defineProperty_defineProperty(_formatData$dataSchem3, TABLE_ROW_ATTRIBUTE.ROW_SELECTION_INDETERMINATE, false), _formatData$dataSchem3));
       }
       // 当传入的data改变时，更新相关属性
       // ROW_EXPAND & ROW_SELECTION & ROW_UID 不做更新
@@ -3525,7 +3566,7 @@ function use_attributes_objectSpread(target) { for (var i = 1; i < arguments.len
       rowId = target[TABLE_ROW_ATTRIBUTE.ROW_UID];
       target[TABLE_ROW_ATTRIBUTE.ROW_INDEX] = index + 1;
     });
-    formatData.dataSchema.set(CHECK_ALL_OBJ, (_formatData$dataSchem2 = {}, defineProperty_defineProperty(_formatData$dataSchem2, TABLE_ROW_ATTRIBUTE.ROW_SELECTION, hasSelectedRow), defineProperty_defineProperty(_formatData$dataSchem2, TABLE_ROW_ATTRIBUTE.ROW_SELECTION_INDETERMINATE, hasSelectedRow && hasUnSelectedRow), _formatData$dataSchem2));
+    formatData.dataSchema.set(CHECK_ALL_OBJ, (_formatData$dataSchem4 = {}, defineProperty_defineProperty(_formatData$dataSchem4, TABLE_ROW_ATTRIBUTE.ROW_SELECTION, hasSelectedRow), defineProperty_defineProperty(_formatData$dataSchem4, TABLE_ROW_ATTRIBUTE.ROW_SELECTION_INDETERMINATE, hasSelectedRow && hasUnSelectedRow), _formatData$dataSchem4));
     formatData.dataSchema.set(NEED_COL_ROW_SPAN, defineProperty_defineProperty({}, TABLE_ROW_ATTRIBUTE.ROW_SPAN, neepColspanOrRowspan(['rowspan'])));
   };
   /**
@@ -3561,7 +3602,17 @@ function use_attributes_objectSpread(target) { for (var i = 1; i < arguments.len
    * @param isSelected
    */
   var setRowSelection = function setRowSelection(row, isSelected) {
-    setRowAttribute(row, TABLE_ROW_ATTRIBUTE.ROW_SELECTION, isSelected);
+    var value = isSelected;
+    if (typeof props.isSelectedFn === 'function') {
+      value = props.isSelectedFn({
+        row: row
+      });
+    }
+    if (isRowSelectEnable(props, {
+      row: row
+    })) {
+      setRowAttribute(row, TABLE_ROW_ATTRIBUTE.ROW_SELECTION, value);
+    }
     setRowIndeterminate();
   };
   /**
@@ -3581,14 +3632,20 @@ function use_attributes_objectSpread(target) { for (var i = 1; i < arguments.len
     setRowAttribute(row, TABLE_ROW_ATTRIBUTE.ROW_EXPAND, isExpand);
   };
   var getRowAttribute = function getRowAttribute(row, attrName) {
-    var _formatData$dataSchem4;
-    return (_formatData$dataSchem4 = formatData.dataSchema.get(row)) === null || _formatData$dataSchem4 === void 0 ? void 0 : _formatData$dataSchem4[attrName];
+    var _formatData$dataSchem6;
+    return (_formatData$dataSchem6 = formatData.dataSchema.get(row)) === null || _formatData$dataSchem6 === void 0 ? void 0 : _formatData$dataSchem6[attrName];
   };
   var toggleRowSelection = function toggleRowSelection(row) {
+    if (typeof props.isSelectedFn === 'function') {
+      setRowSelection(row, props.isSelectedFn({
+        row: row
+      }));
+      return;
+    }
     setRowSelection(row, !getRowAttribute(row, TABLE_ROW_ATTRIBUTE.ROW_SELECTION));
   };
   var toggleAllSelection = function toggleAllSelection(value) {
-    var _formatData$dataSchem5;
+    var _formatData$dataSchem7;
     var val = value !== null && value !== void 0 ? value : !isCheckedAll();
     if (props.acrossAll) {
       formatData.data.forEach(function (row) {
@@ -3599,7 +3656,7 @@ function use_attributes_objectSpread(target) { for (var i = 1; i < arguments.len
     pageData.forEach(function (row) {
       return setRowSelection(row, val);
     });
-    formatData.dataSchema.set(CHECK_ALL_OBJ, (_formatData$dataSchem5 = {}, defineProperty_defineProperty(_formatData$dataSchem5, TABLE_ROW_ATTRIBUTE.ROW_SELECTION, val), defineProperty_defineProperty(_formatData$dataSchem5, TABLE_ROW_ATTRIBUTE.ROW_SELECTION_INDETERMINATE, false), _formatData$dataSchem5));
+    formatData.dataSchema.set(CHECK_ALL_OBJ, (_formatData$dataSchem7 = {}, defineProperty_defineProperty(_formatData$dataSchem7, TABLE_ROW_ATTRIBUTE.ROW_SELECTION, val), defineProperty_defineProperty(_formatData$dataSchem7, TABLE_ROW_ATTRIBUTE.ROW_SELECTION_INDETERMINATE, false), _formatData$dataSchem7));
   };
   var clearSelection = function clearSelection() {
     formatData.data.forEach(function (row) {
@@ -3717,6 +3774,20 @@ function use_attributes_objectSpread(target) { for (var i = 1; i < arguments.len
       return getRowAttribute(row, TABLE_ROW_ATTRIBUTE.ROW_SELECTION);
     });
   };
+  var resolveByDefColumns = function resolveByDefColumns() {
+    var multiSortColumns = [];
+    formatData.columns.forEach(function (column) {
+      var _schema$COLUMN_ATTRIB;
+      var schema = formatData.columnSchema.get(column);
+      if (typeof (schema === null || schema === void 0 ? void 0 : schema[COLUMN_ATTRIBUTE.COL_SORT_FN]) === 'function' && !((_schema$COLUMN_ATTRIB = schema === null || schema === void 0 ? void 0 : schema[COLUMN_ATTRIBUTE.IS_HIDDEN]) !== null && _schema$COLUMN_ATTRIB !== void 0 ? _schema$COLUMN_ATTRIB : true)) {
+        multiSortColumns.push({
+          column: column,
+          schema: schema
+        });
+      }
+    });
+    resolvePageDataBySortList(multiSortColumns);
+  };
   return {
     formatColumns: formatColumns,
     formatDataSchema: formatDataSchema,
@@ -3737,6 +3808,7 @@ function use_attributes_objectSpread(target) { for (var i = 1; i < arguments.len
     isActiveColumn: isActiveColumn,
     isHiddenColumn: isHiddenColumn,
     resolvePageData: resolvePageData,
+    resolveByDefColumns: resolveByDefColumns,
     resetStartEndIndex: resetStartEndIndex,
     toggleAllSelection: toggleAllSelection,
     setAllRowExpand: setAllRowExpand,
@@ -4501,12 +4573,15 @@ const external_exception_namespaceObject = external_exception_x({ ["default"]: (
 var external_button_x = y => { var x = {}; __webpack_require__.d(x, y); return x; }
 var external_button_y = x => () => x
 const external_button_namespaceObject = external_button_x({ ["default"]: () => __WEBPACK_EXTERNAL_MODULE__button_59c00871__["default"] });
+;// CONCATENATED MODULE: external "../icon/"
+var _x = y => { var x = {}; __webpack_require__.d(x, y); return x; }
+var _y = x => () => x
+const _namespaceObject = _x({ ["AngleDownFill"]: () => __WEBPACK_EXTERNAL_MODULE__icon__2ba2075d__.AngleDownFill, ["AngleUpFill"]: () => __WEBPACK_EXTERNAL_MODULE__icon__2ba2075d__.AngleUpFill, ["CloseLine"]: () => __WEBPACK_EXTERNAL_MODULE__icon__2ba2075d__.CloseLine, ["CogShape"]: () => __WEBPACK_EXTERNAL_MODULE__icon__2ba2075d__.CogShape });
 ;// CONCATENATED MODULE: external "../popover"
 var external_popover_x = y => { var x = {}; __webpack_require__.d(x, y); return x; }
 var external_popover_y = x => () => x
 const external_popover_namespaceObject = external_popover_x({ ["default"]: () => __WEBPACK_EXTERNAL_MODULE__popover_cf5f8dce__["default"] });
-;// CONCATENATED MODULE: ../../packages/table/src/plugins/head-filter.tsx
-
+;// CONCATENATED MODULE: ../../packages/table/src/plugins/settings.tsx
 
 
 /*
@@ -4544,145 +4619,452 @@ const external_popover_namespaceObject = external_popover_x({ ["default"]: () =>
 
 
 
-
 function _isSlot(s) {
   return typeof s === 'function' || Object.prototype.toString.call(s) === '[object Object]' && !(0,external_vue_namespaceObject.isVNode)(s);
 }
-/* harmony default export */ const head_filter = ((0,external_vue_namespaceObject.defineComponent)({
-  name: 'HeadFilter',
+/* harmony default export */ const plugins_settings = ((0,external_vue_namespaceObject.defineComponent)({
+  name: 'Settings',
   props: {
-    column: IColumnType,
-    height: external_shared_namespaceObject.PropTypes.number.def(LINE_HEIGHT)
+    settings: ITableSettings,
+    columns: external_shared_namespaceObject.PropTypes.arrayOf(IColumnType).def([])
   },
-  emits: ['change', 'filterSave'],
+  emits: ['change'],
   setup: function setup(props, _ref) {
-    var emit = _ref.emit;
+    var emit = _ref.emit,
+      slots = _ref.slots;
     var _usePrefix = (0,external_config_provider_namespaceObject.usePrefix)(),
       resolveClassName = _usePrefix.resolveClassName;
     var t = (0,external_config_provider_namespaceObject.useLocale)('table');
-    var column = props.column;
-    var _toRefs = (0,external_vue_namespaceObject.toRefs)(props.column),
-      filter = _toRefs.filter;
-    var checked = (0,external_vue_namespaceObject.computed)(function () {
-      var _filter$value$checked, _filter$value;
-      return (_filter$value$checked = (_filter$value = filter.value) === null || _filter$value === void 0 ? void 0 : _filter$value.checked) !== null && _filter$value$checked !== void 0 ? _filter$value$checked : [];
-    });
-    var state = (0,external_vue_namespaceObject.reactive)({
-      isOpen: false,
-      checked: checked.value
-    });
-    var maxHeight = (0,external_vue_namespaceObject.computed)(function () {
-      var _filter$value$maxHeig, _filter$value2;
-      return (_filter$value$maxHeig = (_filter$value2 = filter.value) === null || _filter$value2 === void 0 ? void 0 : _filter$value2.maxHeight) !== null && _filter$value$maxHeig !== void 0 ? _filter$value$maxHeig : LINE_HEIGHT * 15;
-    });
-    var height = (0,external_vue_namespaceObject.computed)(function () {
-      var _filter$value3;
-      return ((_filter$value3 = filter.value) === null || _filter$value3 === void 0 ? void 0 : _filter$value3.height) || '100%';
-    });
-    (0,external_vue_namespaceObject.watch)(function () {
-      return filter.value;
-    }, function () {
-      state.checked = checked.value;
-    }, {
-      immediate: true,
-      deep: true
-    });
-    var headClass = (0,external_vue_namespaceObject.computed)(function () {
-      var _classes;
-      return (0,external_shared_namespaceObject.classes)((_classes = {}, defineProperty_defineProperty(_classes, resolveClassName('table-head-action'), true), defineProperty_defineProperty(_classes, 'column-filter', true), defineProperty_defineProperty(_classes, '--row-height', "".concat(props.height, "px")), defineProperty_defineProperty(_classes, "active", state.checked.length), defineProperty_defineProperty(_classes, "opened", state.isOpen), _classes));
-    });
-    var headFilterContentClass = (0,external_shared_namespaceObject.classes)(defineProperty_defineProperty({}, resolveClassName('table-head-filter'), true));
-    var refVirtualRender = (0,external_vue_namespaceObject.ref)(null);
-    var handlePopShow = function handlePopShow(isOpen) {
-      state.isOpen = isOpen;
-      isOpen && setTimeout(function () {
-        refVirtualRender.value.reset();
-      });
+    var defaultSizeList = createDefaultSizeList(t);
+    var resolvedColVal = function resolvedColVal(item, index) {
+      return resolvePropVal(item, ['id', 'field', 'type'], [item, index]);
     };
-    var theme = "light ".concat(resolveClassName('table-head-filter'));
-    var localData = (0,external_vue_namespaceObject.computed)(function () {
-      var _filter$value$list = filter.value.list,
-        list = _filter$value$list === void 0 ? [] : _filter$value$list;
-      return list;
+    var checkAll = (0,external_vue_namespaceObject.ref)(false);
+    var isShow = (0,external_vue_namespaceObject.ref)(false);
+    var localSettings = (0,external_vue_namespaceObject.computed)(function () {
+      var deafultSettings = {
+        fields: props.columns.map(function (col) {
+          return Object.assign({}, col, {
+            field: col.field || col.type
+          });
+        }),
+        checked: [],
+        limit: 0,
+        size: 'small',
+        sizeList: defaultSizeList,
+        showLineHeight: true,
+        trigger: 'manual'
+      };
+      if (typeof props.settings === 'boolean') {
+        return deafultSettings;
+      }
+      return Object.assign({}, deafultSettings, props.settings);
     });
-    var getRegExp = function getRegExp(searchValue) {
-      var flags = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'ig';
-      return new RegExp("".concat(searchValue).replace(/[-[\]{}()*+?.,\\^$|#\s]/g, '\\$&'), flags);
+    var activeSize = (0,external_vue_namespaceObject.ref)(localSettings.value.size || 'small');
+    var activeHeight = (0,external_vue_namespaceObject.ref)(SETTING_SIZE.small);
+    var checkedFields = (0,external_vue_namespaceObject.ref)(localSettings.value.checked || []);
+    var className = resolveClassName('table-settings');
+    var theme = "light ".concat(className);
+    var renderFields = (0,external_vue_namespaceObject.computed)(function () {
+      return localSettings.value.fields || props.columns || [];
+    });
+    var cachedValue = {
+      checkAll: checkAll.value,
+      activeSize: activeSize.value,
+      activeHeight: activeHeight.value,
+      checkedFields: localSettings.value.checked || []
     };
-    var defaultFilterFn = function defaultFilterFn(checked, row) {
-      var match = filter.value.match;
-      var matchText = getRowText(row, resolvePropVal(column, 'field', [column, row]));
-      if (match === 'full') {
-        return checked.includes(matchText);
-      }
-      return checked.some(function (str) {
-        return getRegExp(str, 'img').test(matchText);
+    var handleSaveClick = function handleSaveClick() {
+      Object.assign(cachedValue, {
+        checkAll: checkAll.value,
+        activeSize: activeSize.value,
+        activeHeight: activeHeight.value,
+        checkedFields: checkedFields.value
       });
+      emit('change', {
+        checked: checkedFields.value,
+        size: activeSize.value,
+        height: activeHeight.value,
+        fields: (0,external_vue_namespaceObject.unref)(renderFields)
+      });
+      isShow.value = false;
     };
-    var filterFn = typeof filter.value.filterFn === 'function' ?
-    // eslint-disable-next-line max-len
-    function (checked, row, index, data) {
-      return filter.value.filterFn(checked, row, props.column, index, data);
-    } : function (checked, row) {
-      return checked.length ? defaultFilterFn(checked, row) : true;
-    };
-    var handleBtnSaveClick = function handleBtnSaveClick() {
-      handleFilterChange(true);
-      emit('filterSave', state.checked);
-      state.isOpen = false;
+    var handleCancelClick = function handleCancelClick() {
+      checkAll.value = cachedValue.checkAll;
+      activeSize.value = cachedValue.activeSize;
+      activeHeight.value = cachedValue.activeHeight;
+      checkedFields.value = cachedValue.checkedFields;
+      isShow.value = false;
     };
-    var handleFilterChange = function handleFilterChange() {
-      var btnSaveClick = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
-      var _resolveBtnOption = resolveBtnOption(btnSave, t.value.confirm),
-        disabled = _resolveBtnOption.disabled;
-      if (disabled || btnSaveClick) {
-        if (filter.value === 'custom') {
-          emit('change', state.checked, null);
-          state.isOpen = false;
-          return;
-        }
-        filter.value.checked = state.checked;
-        emit('change', state.checked, filterFn);
+    var handleSettingClick = function handleSettingClick() {
+      if (localSettings.value.trigger === 'manual') {
+        isShow.value = true;
       }
     };
-    var handleBtnResetClick = function handleBtnResetClick() {
-      if (state.checked.length) {
-        state.checked.length = 0;
-        state.isOpen = false;
-        (0,external_vue_namespaceObject.nextTick)(function () {
-          return emit('change', state.checked, filterFn);
+    var handleCheckAllClick = function handleCheckAllClick(e) {
+      e.stopImmediatePropagation();
+      e.stopPropagation();
+      e.preventDefault();
+      checkAll.value = !checkAll.value;
+      var fields = localSettings.value.fields || props.columns || [];
+      var readonlyFields = fields.filter(function (f, index) {
+        return f.disabled && checkedFields.value.includes(resolvedColVal(f, index));
+      }).map(function (item, index) {
+        return resolvedColVal(item, index);
+      });
+      if (checkAll.value) {
+        var _checkedFields$value;
+        var allFields = fields.filter(function (f) {
+          return !f.disabled;
+        }).map(function (item, index) {
+          return resolvedColVal(item, index);
         });
+        (_checkedFields$value = checkedFields.value).splice.apply(_checkedFields$value, [0, checkedFields.value.length].concat(_toConsumableArray(allFields), _toConsumableArray(readonlyFields)));
+      } else {
+        var _checkedFields$value2;
+        (_checkedFields$value2 = checkedFields.value).splice.apply(_checkedFields$value2, [0, checkedFields.value.length].concat(_toConsumableArray(readonlyFields)));
       }
     };
-    var resolveBtnOption = function resolveBtnOption(opt, defText) {
-      var disabled = opt === 'disabled' || opt === false;
-      var text = typeof opt === 'string' ? opt : defText;
+    var isLimit = (0,external_vue_namespaceObject.computed)(function () {
+      var _localSettings$value$;
+      return ((_localSettings$value$ = localSettings.value.limit) !== null && _localSettings$value$ !== void 0 ? _localSettings$value$ : 0) > 0;
+    });
+    var sizeList = localSettings.value.sizeList || defaultSizeList;
+    var isFiledDisabled = (0,external_vue_namespaceObject.computed)(function () {
+      return isLimit.value && (localSettings.value.limit ? localSettings.value.limit : 0) <= checkedFields.value.length;
+    });
+    var isItemReadonly = function isItemReadonly(item, index) {
+      return item.disabled || isFiledDisabled.value && !checkedFields.value.includes(resolvedColVal(item, index));
+    };
+    var handleSizeItemClick = function handleSizeItemClick(item) {
+      activeSize.value = item.value;
+      activeHeight.value = item.height;
+    };
+    var getItemClass = function getItemClass(item) {
       return {
-        disabled: disabled,
-        text: text
+        'line-size': true,
+        'is-medium': activeSize.value === 'medium',
+        active: item.value === activeSize.value
       };
     };
-    var _filter$value4 = filter.value,
-      btnSave = _filter$value4.btnSave,
-      btnReset = _filter$value4.btnReset;
-    var renderSaveBtn = function renderSaveBtn() {
-      var _resolveBtnOption2 = resolveBtnOption(btnSave, t.value.confirm),
-        disabled = _resolveBtnOption2.disabled,
-        text = _resolveBtnOption2.text;
-      if (disabled) {
+    var buttonStyle = {
+      marginRight: '12px'
+    };
+    var renderSize = function renderSize() {
+      return sizeList.map(function (item) {
         return (0,external_vue_namespaceObject.createVNode)("span", {
-          "class": "btn-filter-save disabled"
-        }, [text]);
-      }
-      return (0,external_vue_namespaceObject.createVNode)(external_button_namespaceObject["default"], {
-        "theme": "primary",
-        "size": "small",
-        "style": "width: 56px; margin-right: 8px;",
-        "onClick": handleBtnSaveClick
-      }, _isSlot(text) ? text : {
-        "default": function _default() {
-          return [text];
-        }
+          "class": getItemClass(item),
+          "onClick": function onClick() {
+            return handleSizeItemClick(item);
+          }
+        }, [item.label]);
+      });
+    };
+    var indeterminate = (0,external_vue_namespaceObject.computed)(function () {
+      return checkedFields.value.length > 0 && checkedFields.value.length < renderFields.value.length;
+    });
+    var showLineHeight = (0,external_vue_namespaceObject.computed)(function () {
+      return typeof localSettings.value.showLineHeight === 'boolean' ? localSettings.value.showLineHeight : true;
+    });
+    (0,external_vue_namespaceObject.watch)(function () {
+      return [checkedFields.value];
+    }, function () {
+      if (!checkedFields.value.length) {
+        checkAll.value = false;
+      }
+      if (checkedFields.value.length && renderFields.value.every(function (field, index) {
+        return checkedFields.value.includes(resolvedColVal(field, index));
+      })) {
+        checkAll.value = true;
+      }
+    }, {
+      immediate: true,
+      deep: true
+    });
+    (0,external_vue_namespaceObject.watch)(function () {
+      return [props.settings.checked];
+    }, function () {
+      var _checkedFields$value3;
+      (_checkedFields$value3 = checkedFields.value).splice.apply(_checkedFields$value3, [0, checkedFields.value.length].concat(_toConsumableArray(localSettings.value.checked)));
+    }, {
+      immediate: true,
+      deep: true
+    });
+    return function () {
+      var _localSettings$value$2;
+      return props.settings ? (0,external_vue_namespaceObject.createVNode)(external_popover_namespaceObject["default"], (0,external_vue_namespaceObject.mergeProps)({
+        "trigger": (_localSettings$value$2 = localSettings.value.trigger) !== null && _localSettings$value$2 !== void 0 ? _localSettings$value$2 : 'manual',
+        "isShow": isShow.value,
+        "placement": "bottom-end",
+        "arrow": true
+      }, {
+        theme: theme
+      }), {
+        "default": function _default() {
+          return (0,external_vue_namespaceObject.createVNode)("span", {
+            "class": "table-head-settings",
+            "onClick": handleSettingClick
+          }, [(0,external_vue_namespaceObject.createVNode)(_namespaceObject.CogShape, {
+            "style": "color: #c4c6cc;"
+          }, null)]);
+        },
+        content: function content() {
+          var _slots$default;
+          var _slot2;
+          return (0,external_vue_namespaceObject.createVNode)("div", {
+            "class": "setting-content"
+          }, [(0,external_vue_namespaceObject.createVNode)("div", {
+            "class": "setting-head"
+          }, [(0,external_vue_namespaceObject.createVNode)("span", {
+            "class": "head-title"
+          }, [t.value.setting.title]), (0,external_vue_namespaceObject.createVNode)(_namespaceObject.CloseLine, {
+            "class": "icon-close-action",
+            "onClick": handleCancelClick
+          }, null)]), (0,external_vue_namespaceObject.createVNode)("div", {
+            "class": "setting-body"
+          }, [(0,external_vue_namespaceObject.createVNode)("div", {
+            "class": "setting-body-title"
+          }, [(0,external_vue_namespaceObject.createVNode)("div", null, [(0,external_vue_namespaceObject.createVNode)("span", {
+            "class": "field-setting-label"
+          }, [t.value.setting.fields.title]), isLimit.value ? (0,external_vue_namespaceObject.createVNode)("span", {
+            "class": "limit"
+          }, [t.value.setting.fields.subtitle(localSettings.value.limit)]) : '']), isLimit.value ? '' : (0,external_vue_namespaceObject.createVNode)("span", {
+            "class": "check-all",
+            "onClick": handleCheckAllClick
+          }, [(0,external_vue_namespaceObject.createVNode)(external_checkbox_namespaceObject["default"], {
+            "label": t.value.setting.fields.selectAll,
+            "indeterminate": Boolean(indeterminate.value),
+            "modelValue": checkedFields.value.length > 0
+          }, {
+            "default": function _default() {
+              return [t.value.setting.fields.selectAll];
+            }
+          })])]), (0,external_vue_namespaceObject.createVNode)(external_checkbox_namespaceObject.BkCheckboxGroup, {
+            "class": "setting-body-fields",
+            "modelValue": checkedFields.value,
+            "onUpdate:modelValue": function onUpdateModelValue($event) {
+              return checkedFields.value = $event;
+            }
+          }, _isSlot(_slot2 = renderFields.value.map(function (item, index) {
+            var _slot;
+            return (0,external_vue_namespaceObject.createVNode)("div", {
+              "class": "field-item"
+            }, [(0,external_vue_namespaceObject.createVNode)(external_checkbox_namespaceObject["default"], {
+              "checked": checkedFields.value.includes(resolvedColVal(item, index)),
+              "label": resolvedColVal(item, index),
+              "disabled": isItemReadonly(item, index)
+            }, _isSlot(_slot = resolvePropVal(item, ['name', 'label'], [item, index])) ? _slot : {
+              "default": function _default() {
+                return [_slot];
+              }
+            })]);
+          })) ? _slot2 : {
+            "default": function _default() {
+              return [_slot2];
+            }
+          }), (_slots$default = slots["default"]) === null || _slots$default === void 0 ? void 0 : _slots$default.call(slots), showLineHeight.value ? (0,external_vue_namespaceObject.createVNode)("div", {
+            "class": "setting-body-line-height"
+          }, [t.value.setting.lineHeight.title, (0,external_vue_namespaceObject.createTextVNode)("\uFF1A"), renderSize()]) : '']), (0,external_vue_namespaceObject.createVNode)("div", {
+            "class": "setting-footer"
+          }, [(0,external_vue_namespaceObject.createVNode)(external_button_namespaceObject["default"], {
+            "theme": "primary",
+            "style": buttonStyle,
+            "onClick": handleSaveClick
+          }, {
+            "default": function _default() {
+              return [t.value.setting.options.ok];
+            }
+          }), (0,external_vue_namespaceObject.createVNode)(external_button_namespaceObject["default"], {
+            "style": buttonStyle,
+            "onClick": handleCancelClick
+          }, {
+            "default": function _default() {
+              return [t.value.setting.options.cancel];
+            }
+          })])]);
+        }
+      }) : '';
+    };
+  }
+}));
+;// CONCATENATED MODULE: ../../packages/table/src/plugins/head-filter.tsx
+
+
+
+/*
+ * Tencent is pleased to support the open source community by making
+ * 蓝鲸智云PaaS平台社区版 (BlueKing PaaS Community Edition) available.
+ *
+ * Copyright (C) 2021 THL A29 Limited, a Tencent company.  All rights reserved.
+ *
+ * 蓝鲸智云PaaS平台社区版 (BlueKing PaaS Community Edition) is licensed under the MIT License.
+ *
+ * License for 蓝鲸智云PaaS平台社区版 (BlueKing PaaS Community Edition):
+ *
+ * ---------------------------------------------------
+ * Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated
+ * documentation files (the "Software"), to deal in the Software without restriction, including without limitation
+ * the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and
+ * to permit persons to whom the Software is furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all copies or substantial portions of
+ * the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO
+ * THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF
+ * CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS
+ * IN THE SOFTWARE.
+ */
+
+
+
+
+
+
+
+
+
+
+
+function head_filter_isSlot(s) {
+  return typeof s === 'function' || Object.prototype.toString.call(s) === '[object Object]' && !(0,external_vue_namespaceObject.isVNode)(s);
+}
+/* harmony default export */ const head_filter = ((0,external_vue_namespaceObject.defineComponent)({
+  name: 'HeadFilter',
+  props: {
+    column: IColumnType,
+    height: external_shared_namespaceObject.PropTypes.number.def(LINE_HEIGHT)
+  },
+  emits: ['change', 'filterSave'],
+  setup: function setup(props, _ref) {
+    var emit = _ref.emit;
+    var _usePrefix = (0,external_config_provider_namespaceObject.usePrefix)(),
+      resolveClassName = _usePrefix.resolveClassName;
+    var t = (0,external_config_provider_namespaceObject.useLocale)('table');
+    var column = props.column;
+    var _toRefs = (0,external_vue_namespaceObject.toRefs)(props.column),
+      filter = _toRefs.filter;
+    var checked = (0,external_vue_namespaceObject.computed)(function () {
+      var _filter$value$checked, _filter$value;
+      return (_filter$value$checked = (_filter$value = filter.value) === null || _filter$value === void 0 ? void 0 : _filter$value.checked) !== null && _filter$value$checked !== void 0 ? _filter$value$checked : [];
+    });
+    var state = (0,external_vue_namespaceObject.reactive)({
+      isOpen: false,
+      checked: checked.value
+    });
+    var maxHeight = (0,external_vue_namespaceObject.computed)(function () {
+      var _filter$value$maxHeig, _filter$value2;
+      return (_filter$value$maxHeig = (_filter$value2 = filter.value) === null || _filter$value2 === void 0 ? void 0 : _filter$value2.maxHeight) !== null && _filter$value$maxHeig !== void 0 ? _filter$value$maxHeig : LINE_HEIGHT * 15;
+    });
+    var height = (0,external_vue_namespaceObject.computed)(function () {
+      var _filter$value3;
+      return ((_filter$value3 = filter.value) === null || _filter$value3 === void 0 ? void 0 : _filter$value3.height) || '100%';
+    });
+    (0,external_vue_namespaceObject.watch)(function () {
+      return filter.value;
+    }, function () {
+      state.checked = checked.value;
+    }, {
+      immediate: true,
+      deep: true
+    });
+    var headClass = (0,external_vue_namespaceObject.computed)(function () {
+      var _classes;
+      return (0,external_shared_namespaceObject.classes)((_classes = {}, defineProperty_defineProperty(_classes, resolveClassName('table-head-action'), true), defineProperty_defineProperty(_classes, 'column-filter', true), defineProperty_defineProperty(_classes, '--row-height', "".concat(props.height, "px")), defineProperty_defineProperty(_classes, "active", state.checked.length), defineProperty_defineProperty(_classes, "opened", state.isOpen), _classes));
+    });
+    var headFilterContentClass = (0,external_shared_namespaceObject.classes)(defineProperty_defineProperty({}, resolveClassName('table-head-filter'), true));
+    var refVirtualRender = (0,external_vue_namespaceObject.ref)(null);
+    var handlePopShow = function handlePopShow(isOpen) {
+      state.isOpen = isOpen;
+      isOpen && setTimeout(function () {
+        refVirtualRender.value.reset();
+      });
+    };
+    var theme = "light ".concat(resolveClassName('table-head-filter'));
+    var localData = (0,external_vue_namespaceObject.computed)(function () {
+      var _filter$value$list = filter.value.list,
+        list = _filter$value$list === void 0 ? [] : _filter$value$list;
+      return list;
+    });
+    var getRegExp = function getRegExp(searchValue) {
+      var flags = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'ig';
+      return new RegExp("".concat(searchValue).replace(/[-[\]{}()*+?.,\\^$|#\s]/g, '\\$&'), flags);
+    };
+    var defaultFilterFn = function defaultFilterFn(checked, row) {
+      var match = filter.value.match;
+      var matchText = getRowText(row, resolvePropVal(column, 'field', [column, row]));
+      if (match === 'full') {
+        return checked.includes(matchText);
+      }
+      return checked.some(function (str) {
+        return getRegExp(str, 'img').test(matchText);
+      });
+    };
+    var filterFn = typeof filter.value.filterFn === 'function' ?
+    // eslint-disable-next-line max-len
+    function (checked, row, index, data) {
+      return filter.value.filterFn(checked, row, props.column, index, data);
+    } : function (checked, row) {
+      return checked.length ? defaultFilterFn(checked, row) : true;
+    };
+    var handleBtnSaveClick = function handleBtnSaveClick() {
+      handleFilterChange(true);
+      emit('filterSave', state.checked);
+      state.isOpen = false;
+    };
+    var handleFilterChange = function handleFilterChange() {
+      var btnSaveClick = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
+      var _resolveBtnOption = resolveBtnOption(btnSave, t.value.confirm),
+        disabled = _resolveBtnOption.disabled;
+      if (disabled || btnSaveClick) {
+        if (filter.value === 'custom') {
+          emit('change', state.checked, null);
+          state.isOpen = false;
+          return;
+        }
+        filter.value.checked = state.checked;
+        emit('change', state.checked, filterFn);
+      }
+    };
+    var handleBtnResetClick = function handleBtnResetClick() {
+      if (state.checked.length) {
+        state.checked.length = 0;
+        state.isOpen = false;
+        (0,external_vue_namespaceObject.nextTick)(function () {
+          return emit('change', state.checked, filterFn);
+        });
+      }
+    };
+    var resolveBtnOption = function resolveBtnOption(opt, defText) {
+      var disabled = opt === 'disabled' || opt === false;
+      var text = typeof opt === 'string' ? opt : defText;
+      return {
+        disabled: disabled,
+        text: text
+      };
+    };
+    var _filter$value4 = filter.value,
+      btnSave = _filter$value4.btnSave,
+      btnReset = _filter$value4.btnReset;
+    var renderSaveBtn = function renderSaveBtn() {
+      var _resolveBtnOption2 = resolveBtnOption(btnSave, t.value.confirm),
+        disabled = _resolveBtnOption2.disabled,
+        text = _resolveBtnOption2.text;
+      if (disabled) {
+        return (0,external_vue_namespaceObject.createVNode)("span", {
+          "class": "btn-filter-save disabled"
+        }, [text]);
+      }
+      return (0,external_vue_namespaceObject.createVNode)(external_button_namespaceObject["default"], {
+        "theme": "primary",
+        "size": "small",
+        "style": "width: 56px; margin-right: 8px;",
+        "onClick": handleBtnSaveClick
+      }, head_filter_isSlot(text) ? text : {
+        "default": function _default() {
+          return [text];
+        }
       });
     };
     var renderResetBtn = function renderResetBtn() {
@@ -4697,7 +5079,7 @@ function _isSlot(s) {
         "size": "small",
         "disabled": state.checked.length === 0,
         "onClick": handleBtnResetClick
-      }, _isSlot(text) ? text : {
+      }, head_filter_isSlot(text) ? text : {
         "default": function _default() {
           return [text];
         }
@@ -4845,10 +5227,6 @@ function _nonIterableRest() {
 function _slicedToArray(arr, i) {
   return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
 }
-;// CONCATENATED MODULE: external "../icon/"
-var _x = y => { var x = {}; __webpack_require__.d(x, y); return x; }
-var _y = x => () => x
-const _namespaceObject = _x({ ["AngleDownFill"]: () => __WEBPACK_EXTERNAL_MODULE__icon__2ba2075d__.AngleDownFill, ["AngleUpFill"]: () => __WEBPACK_EXTERNAL_MODULE__icon__2ba2075d__.AngleUpFill, ["CloseLine"]: () => __WEBPACK_EXTERNAL_MODULE__icon__2ba2075d__.CloseLine, ["CogShape"]: () => __WEBPACK_EXTERNAL_MODULE__icon__2ba2075d__.CogShape });
 ;// CONCATENATED MODULE: ../../packages/table/src/plugins/head-sort.tsx
 
 
@@ -4893,19 +5271,23 @@ const _namespaceObject = _x({ ["AngleDownFill"]: () => __WEBPACK_EXTERNAL_MODULE
   },
   emits: ['change'],
   setup: function setup(props, _ref) {
-    var _props$column;
-    var emit = _ref.emit;
+    var _ref2, _props$column$sort$va, _props$column;
+    var emit = _ref.emit,
+      expose = _ref.expose;
     var _usePrefix = (0,external_config_provider_namespaceObject.usePrefix)(),
       resolveClassName = _usePrefix.resolveClassName;
-    var defSort = ((_props$column = props.column) === null || _props$column === void 0 || (_props$column = _props$column.sort) === null || _props$column === void 0 ? void 0 : _props$column.value) || props.defaultSort || SORT_OPTION.NULL;
+    var defSort = (_ref2 = (_props$column$sort$va = (_props$column = props.column) === null || _props$column === void 0 || (_props$column = _props$column.sort) === null || _props$column === void 0 ? void 0 : _props$column.value) !== null && _props$column$sort$va !== void 0 ? _props$column$sort$va : props.defaultSort) !== null && _ref2 !== void 0 ? _ref2 : SORT_OPTION.NULL;
     var sortType = (0,external_vue_namespaceObject.ref)(defSort);
     (0,external_vue_namespaceObject.watch)(function () {
       return [props.defaultSort];
-    }, function (_ref2) {
-      var _ref3 = _slicedToArray(_ref2, 1),
-        val = _ref3[0];
+    }, function (_ref3) {
+      var _ref4 = _slicedToArray(_ref3, 1),
+        val = _ref4[0];
       sortType.value = val;
     });
+    var setNextSortType = function setNextSortType(type) {
+      sortType.value = type;
+    };
     /**
      * 点击排序事件
      * @param e 鼠标事件
@@ -4924,7 +5306,7 @@ const _namespaceObject = _x({ ["AngleDownFill"]: () => __WEBPACK_EXTERNAL_MODULE
         currentSort = SORT_OPTION.NULL;
       }
       var execFn = getSortFn(props.column, currentSort);
-      var sort = resolveSort(props.column.sort);
+      var sort = resolveSort(props.column.sort, props.column);
       if ((sort === null || sort === void 0 ? void 0 : sort.value) === 'custom') {
         var _sort$sortFn;
         emit('change', (_sort$sortFn = sort === null || sort === void 0 ? void 0 : sort.sortFn) !== null && _sort$sortFn !== void 0 ? _sort$sortFn : execFn, currentSort);
@@ -4932,6 +5314,9 @@ const _namespaceObject = _x({ ["AngleDownFill"]: () => __WEBPACK_EXTERNAL_MODULE
       }
       emit('change', execFn, currentSort);
     };
+    expose({
+      setNextSortType: setNextSortType
+    });
     return function () {
       return (0,external_vue_namespaceObject.createVNode)("span", {
         "class": resolveClassName('head-cell-sort')
@@ -4951,8 +5336,9 @@ const _namespaceObject = _x({ ["AngleDownFill"]: () => __WEBPACK_EXTERNAL_MODULE
     };
   }
 }));
-;// CONCATENATED MODULE: ../../packages/table/src/plugins/settings.tsx
+;// CONCATENATED MODULE: ../../packages/table/src/plugins/use-head-cell.tsx
 
+var use_head_cell_this = undefined;
 
 /*
  * Tencent is pleased to support the open source community by making
@@ -4987,278 +5373,236 @@ const _namespaceObject = _x({ ["AngleDownFill"]: () => __WEBPACK_EXTERNAL_MODULE
 
 
 
-
-
-function settings_isSlot(s) {
+function use_head_cell_isSlot(s) {
   return typeof s === 'function' || Object.prototype.toString.call(s) === '[object Object]' && !(0,external_vue_namespaceObject.isVNode)(s);
 }
-/* harmony default export */ const plugins_settings = ((0,external_vue_namespaceObject.defineComponent)({
-  name: 'Settings',
-  props: {
-    settings: ITableSettings,
-    columns: external_shared_namespaceObject.PropTypes.arrayOf(IColumnType).def([])
-  },
-  emits: ['change'],
-  setup: function setup(props, _ref) {
-    var emit = _ref.emit,
-      slots = _ref.slots;
-    var _usePrefix = (0,external_config_provider_namespaceObject.usePrefix)(),
-      resolveClassName = _usePrefix.resolveClassName;
-    var t = (0,external_config_provider_namespaceObject.useLocale)('table');
-    var defaultSizeList = createDefaultSizeList(t);
-    var resolvedColVal = function resolvedColVal(item, index) {
-      return resolvePropVal(item, ['id', 'field', 'type'], [item, index]);
-    };
-    var checkAll = (0,external_vue_namespaceObject.ref)(false);
-    var isShow = (0,external_vue_namespaceObject.ref)(false);
-    var localSettings = (0,external_vue_namespaceObject.computed)(function () {
-      if (typeof props.settings === 'boolean') {
-        return {
-          fields: props.columns.map(function (col) {
-            return Object.assign({}, col, {
-              field: col.field || col.type
-            });
-          }),
-          checked: [],
-          limit: 0,
-          size: 'small',
-          sizeList: defaultSizeList,
-          showLineHeight: true
-        };
-      }
-      return props.settings;
-    });
-    var activeSize = (0,external_vue_namespaceObject.ref)(localSettings.value.size || 'small');
-    var activeHeight = (0,external_vue_namespaceObject.ref)(SETTING_SIZE.small);
-    var checkedFields = (0,external_vue_namespaceObject.ref)(localSettings.value.checked || []);
-    var className = resolveClassName('table-settings');
-    var theme = "light ".concat(className);
-    var renderFields = (0,external_vue_namespaceObject.computed)(function () {
-      return localSettings.value.fields || props.columns || [];
-    });
-    var cachedValue = {
-      checkAll: checkAll.value,
-      activeSize: activeSize.value,
-      activeHeight: activeHeight.value,
-      checkedFields: localSettings.value.checked || []
-    };
-    var handleSaveClick = function handleSaveClick() {
-      Object.assign(cachedValue, {
-        checkAll: checkAll.value,
-        activeSize: activeSize.value,
-        activeHeight: activeHeight.value,
-        checkedFields: checkedFields.value
-      });
-      emit('change', {
-        checked: checkedFields.value,
-        size: activeSize.value,
-        height: activeHeight.value,
-        fields: (0,external_vue_namespaceObject.unref)(renderFields)
-      });
-      isShow.value = false;
-    };
-    var handleCancelClick = function handleCancelClick() {
-      checkAll.value = cachedValue.checkAll;
-      activeSize.value = cachedValue.activeSize;
-      activeHeight.value = cachedValue.activeHeight;
-      checkedFields.value = cachedValue.checkedFields;
-      isShow.value = false;
-    };
-    var handleSettingClick = function handleSettingClick() {
-      isShow.value = true;
-    };
-    var handleCheckAllClick = function handleCheckAllClick(e) {
-      e.stopImmediatePropagation();
-      e.stopPropagation();
-      e.preventDefault();
-      checkAll.value = !checkAll.value;
-      var fields = localSettings.value.fields || props.columns || [];
-      var readonlyFields = fields.filter(function (f, index) {
-        return f.disabled && checkedFields.value.includes(resolvedColVal(f, index));
-      }).map(function (item, index) {
-        return resolvedColVal(item, index);
+/* harmony default export */ const use_head_cell = (function (props, context, column, tableResp) {
+  var _tableResp$formatData;
+  var nextSort = (0,external_vue_namespaceObject.ref)((_tableResp$formatData = tableResp.formatData.columnSchema.get(column)) === null || _tableResp$formatData === void 0 ? void 0 : _tableResp$formatData[COLUMN_ATTRIBUTE.COL_SORT_TYPE]);
+  var active = (0,external_vue_namespaceObject.computed)(function () {
+    var _tableResp$formatData2, _tableResp$formatData3;
+    return (_tableResp$formatData2 = (_tableResp$formatData3 = tableResp.formatData.columnSchema.get(column)) === null || _tableResp$formatData3 === void 0 ? void 0 : _tableResp$formatData3[COLUMN_ATTRIBUTE.COL_SORT_ACTIVE]) !== null && _tableResp$formatData2 !== void 0 ? _tableResp$formatData2 : false;
+  });
+  var resolveEventListener = function resolveEventListener(col) {
+    var listeners = tableResp.getColumnAttribute(col, COLUMN_ATTRIBUTE.LISTENERS);
+    if (!listeners) {
+      return {};
+    }
+    return Array.from(listeners === null || listeners === void 0 ? void 0 : listeners.keys()).reduce(function (handle, key) {
+      var eventName = key.split('_').slice(-1)[0];
+      return Object.assign(handle, defineProperty_defineProperty({}, eventName, function (e) {
+        listeners.get(key).forEach(function (fn) {
+          return Reflect.apply(fn, use_head_cell_this, [e, col]);
+        });
+      }));
+    }, {});
+  };
+  var getSortFnByColumn = function getSortFnByColumn(column, fn, a, b) {
+    if (column.type === 'index') {
+      return fn(tableResp.getRowAttribute(a, TABLE_ROW_ATTRIBUTE.ROW_INDEX), tableResp.getRowAttribute(b, TABLE_ROW_ATTRIBUTE.ROW_INDEX));
+    }
+    return fn(a, b);
+  };
+  /**
+   * 点击选中一列事件
+   * @param index 当前选中列Index
+   * @param column 当前选中列
+   */
+  var handleColumnHeadClick = function handleColumnHeadClick(index, column) {
+    if (tableResp.getColumnAttribute(column, COLUMN_ATTRIBUTE.COL_IS_DRAG)) {
+      return;
+    }
+    if (column.sort && !column.filter) {
+      var type = tableResp.getColumnAttribute(column, COLUMN_ATTRIBUTE.COL_SORT_TYPE);
+      nextSort.value = getNextSortType(type);
+      var sortFn = function sortFn(a, b) {
+        return getSortFnByColumn(column, getSortFn(column, nextSort.value), a, b);
+      };
+      tableResp.setColumnAttribute(column, COLUMN_ATTRIBUTE.COL_SORT_TYPE, nextSort.value);
+      tableResp.setColumnAttribute(column, COLUMN_ATTRIBUTE.COL_SORT_FN, sortFn);
+      tableResp.setColumnSortActive(column, true);
+      tableResp.sortData(column);
+      context.emit(EMIT_EVENTS.COLUMN_SORT, {
+        column: (0,external_vue_namespaceObject.unref)(column),
+        index: index,
+        type: nextSort.value
       });
-      if (checkAll.value) {
-        var _checkedFields$value;
-        var allFields = fields.filter(function (f) {
-          return !f.disabled;
-        }).map(function (item, index) {
-          return resolvedColVal(item, index);
+    }
+  };
+  var handleColCellClick = function handleColCellClick(index) {
+    handleColumnHeadClick(index, column);
+  };
+  var renderCheckboxColumn = function renderCheckboxColumn(row, index) {
+    var isAll = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
+    var handleChecked = function handleChecked(value) {
+      if (isAll) {
+        tableResp.setRowSelectionAll(value);
+        context.emit(EMIT_EVENTS.ROW_SELECT_ALL, {
+          checked: value,
+          data: props.data
         });
-        (_checkedFields$value = checkedFields.value).splice.apply(_checkedFields$value, [0, checkedFields.value.length].concat(_toConsumableArray(allFields), _toConsumableArray(readonlyFields)));
-      } else {
-        var _checkedFields$value2;
-        (_checkedFields$value2 = checkedFields.value).splice.apply(_checkedFields$value2, [0, checkedFields.value.length].concat(_toConsumableArray(readonlyFields)));
+        return;
       }
+      tableResp.setRowSelection(row, value);
+      context.emit(EMIT_EVENTS.ROW_SELECT, {
+        row: row,
+        index: index,
+        checked: value,
+        data: props.data
+      });
+      context.emit(EMIT_EVENTS.ROW_SELECT_CHANGE, {
+        row: row,
+        index: index,
+        checked: value,
+        data: props.data
+      });
     };
-    var isLimit = (0,external_vue_namespaceObject.computed)(function () {
-      var _localSettings$value$;
-      return ((_localSettings$value$ = localSettings.value.limit) !== null && _localSettings$value$ !== void 0 ? _localSettings$value$ : 0) > 0;
-    });
-    var sizeList = localSettings.value.sizeList || defaultSizeList;
-    var isFiledDisabled = (0,external_vue_namespaceObject.computed)(function () {
-      return isLimit.value && (localSettings.value.limit ? localSettings.value.limit : 0) <= checkedFields.value.length;
+    var indeterminate = tableResp.getRowAttribute(row, TABLE_ROW_ATTRIBUTE.ROW_SELECTION_INDETERMINATE);
+    var isChecked = tableResp.getRowAttribute(row, TABLE_ROW_ATTRIBUTE.ROW_SELECTION);
+    var isEnable = isRowSelectEnable(props, {
+      row: row,
+      index: index,
+      isCheckAll: isAll
     });
-    var isItemReadonly = function isItemReadonly(item, index) {
-      return item.disabled || isFiledDisabled.value && !checkedFields.value.includes(resolvedColVal(item, index));
-    };
-    var handleSizeItemClick = function handleSizeItemClick(item) {
-      activeSize.value = item.value;
-      activeHeight.value = item.height;
-    };
-    var getItemClass = function getItemClass(item) {
-      return {
-        'line-size': true,
-        'is-medium': activeSize.value === 'medium',
-        active: item.value === activeSize.value
+    return (0,external_vue_namespaceObject.createVNode)(external_checkbox_namespaceObject["default"], {
+      "onChange": handleChecked,
+      "disabled": !isEnable,
+      "modelValue": isChecked,
+      "indeterminate": indeterminate
+    }, null);
+  };
+  /**
+   * 获取排序设置表头
+   * @param column 当前渲染排序列
+   * @param index 排序列所在index
+   * @returns
+   */
+  var getSortCell = function getSortCell(column, index) {
+    /**
+     * 点击排序事件
+     * @param sortFn 排序函数
+     * @param type 排序类型
+     */
+    var handleSortClick = function handleSortClick(sortFn, type) {
+      var fn = function fn(a, b) {
+        return getSortFnByColumn(column, sortFn, a, b);
       };
+      tableResp.setColumnAttribute(column, COLUMN_ATTRIBUTE.COL_SORT_TYPE, type);
+      tableResp.setColumnAttribute(column, COLUMN_ATTRIBUTE.COL_SORT_FN, fn);
+      tableResp.sortData(column);
+      tableResp.setColumnSortActive(column, true);
+      context.emit(EMIT_EVENTS.COLUMN_SORT, {
+        column: column,
+        index: index,
+        type: type
+      });
     };
-    var buttonStyle = {
-      marginRight: '12px'
+    // 如果是独立的，则只高亮当前排序
+    return (0,external_vue_namespaceObject.createVNode)(head_sort, {
+      "column": column,
+      "defaultSort": active.value ? nextSort.value : SORT_OPTION.NULL,
+      "onChange": handleSortClick,
+      "active": active.value
+    }, null);
+  };
+  var getFilterCell = function getFilterCell(column, index) {
+    var handleFilterChange = function handleFilterChange(checked, filterFn) {
+      var filterFn0 = function filterFn0(row, index) {
+        return filterFn(checked, row, index);
+      };
+      tableResp.setColumnAttribute(column, COLUMN_ATTRIBUTE.COL_FILTER_FN, filterFn0);
+      tableResp.filter();
+      context.emit(EMIT_EVENTS.COLUMN_FILTER, {
+        checked: checked,
+        column: (0,external_vue_namespaceObject.unref)(column),
+        index: index
+      });
     };
-    var renderSize = function renderSize() {
-      return sizeList.map(function (item) {
-        return (0,external_vue_namespaceObject.createVNode)("span", {
-          "class": getItemClass(item),
-          "onClick": function onClick() {
-            return handleSizeItemClick(item);
-          }
-        }, [item.label]);
+    var filterSave = function filterSave(values) {
+      context.emit(EMIT_EVENTS.COLUMN_FILTER_SAVE, {
+        column: column,
+        values: values
       });
     };
-    var indeterminate = (0,external_vue_namespaceObject.computed)(function () {
-      return checkedFields.value.length > 0 && !renderFields.value.every(function (field, index) {
-        return checkedFields.value.includes(resolvePropVal(field, 'field', [field, index]));
-      });
-    });
-    var showLineHeight = (0,external_vue_namespaceObject.computed)(function () {
-      return typeof localSettings.value.showLineHeight === 'boolean' ? localSettings.value.showLineHeight : true;
-    });
-    (0,external_vue_namespaceObject.watch)(function () {
-      return [checkedFields.value];
-    }, function () {
-      if (!checkedFields.value.length) {
-        checkAll.value = false;
-      }
-      if (checkedFields.value.length && renderFields.value.every(function (field, index) {
-        return checkedFields.value.includes(resolvedColVal(field, index));
-      })) {
-        checkAll.value = true;
+    return (0,external_vue_namespaceObject.createVNode)(head_filter, {
+      "column": column,
+      "height": props.headHeight,
+      "onChange": handleFilterChange,
+      "onFilterSave": filterSave
+    }, null);
+  };
+  var config = resolveHeadConfig(props);
+  var cellFn = config.cellFn;
+  var getHeadCellText = function getHeadCellText(column, index) {
+    if (typeof cellFn === 'function') {
+      return cellFn(column, index);
+    }
+    if (typeof column.renderHead === 'function') {
+      return column.renderHead(column, index);
+    }
+    return resolvePropVal(column, 'label', [column, index]);
+  };
+  /**
+   * table head cell render
+   * @param column
+   * @param index
+   * @returns
+   */
+  var renderHeadCell = function renderHeadCell(column, index) {
+    if (column.type === 'selection') {
+      return [renderCheckboxColumn(CHECK_ALL_OBJ, null, true)];
+    }
+    var cells = [];
+    if (column.sort) {
+      cells.push(getSortCell(column, index));
+    }
+    if (column.filter) {
+      cells.push(getFilterCell(column, index));
+    }
+    var cellText = getHeadCellText(column, index);
+    cells.unshift((0,external_vue_namespaceObject.createVNode)("span", {
+      "class": "head-text"
+    }, [cellText]));
+    var showTitle = typeof cellText === 'string' ? cellText : undefined;
+    var headClass = {
+      'has-sort': !!column.sort,
+      'has-filter': !!column.filter
+    };
+    return (0,external_vue_namespaceObject.createVNode)(table_cell, {
+      "class": headClass,
+      "title": showTitle,
+      "observerResize": props.observerResize,
+      "resizerWay": props.resizerWay,
+      "isHead": true,
+      "column": column,
+      "parentSetting": props.showOverflowTooltip,
+      "headExplain": resolvePropVal(column.explain, 'head', [column])
+    }, use_head_cell_isSlot(cells) ? cells : {
+      "default": function _default() {
+        return [cells];
       }
-    }, {
-      immediate: true,
-      deep: true
-    });
-    (0,external_vue_namespaceObject.watch)(function () {
-      return [props.settings.checked];
-    }, function () {
-      var _checkedFields$value3;
-      (_checkedFields$value3 = checkedFields.value).splice.apply(_checkedFields$value3, [0, checkedFields.value.length].concat(_toConsumableArray(localSettings.value.checked)));
-    }, {
-      immediate: true,
-      deep: true
     });
-    return function () {
-      return props.settings ? (0,external_vue_namespaceObject.createVNode)(external_popover_namespaceObject["default"], (0,external_vue_namespaceObject.mergeProps)({
-        "trigger": "manual",
-        "isShow": isShow.value,
-        "placement": "bottom-end",
-        "arrow": true
-      }, {
-        theme: theme
-      }), {
-        "default": function _default() {
-          return (0,external_vue_namespaceObject.createVNode)("span", {
-            "class": "table-head-settings",
-            "onClick": handleSettingClick
-          }, [(0,external_vue_namespaceObject.createVNode)(_namespaceObject.CogShape, {
-            "style": "color: #c4c6cc;"
-          }, null)]);
-        },
-        content: function content() {
-          var _slots$default;
-          var _slot2;
-          return (0,external_vue_namespaceObject.createVNode)("div", {
-            "class": "setting-content"
-          }, [(0,external_vue_namespaceObject.createVNode)("div", {
-            "class": "setting-head"
-          }, [(0,external_vue_namespaceObject.createVNode)("span", {
-            "class": "head-title"
-          }, [t.value.setting.title]), (0,external_vue_namespaceObject.createVNode)(_namespaceObject.CloseLine, {
-            "class": "icon-close-action",
-            "onClick": handleCancelClick
-          }, null)]), (0,external_vue_namespaceObject.createVNode)("div", {
-            "class": "setting-body"
-          }, [(0,external_vue_namespaceObject.createVNode)("div", {
-            "class": "setting-body-title"
-          }, [(0,external_vue_namespaceObject.createVNode)("div", null, [(0,external_vue_namespaceObject.createVNode)("span", {
-            "class": "field-setting-label"
-          }, [t.value.setting.fields.title]), isLimit.value ? (0,external_vue_namespaceObject.createVNode)("span", {
-            "class": "limit"
-          }, [t.value.setting.fields.subtitle(localSettings.value.limit)]) : '']), isLimit.value ? '' : (0,external_vue_namespaceObject.createVNode)("span", {
-            "class": "check-all",
-            "onClick": handleCheckAllClick
-          }, [(0,external_vue_namespaceObject.createVNode)(external_checkbox_namespaceObject["default"], {
-            "label": t.value.setting.fields.selectAll,
-            "indeterminate": Boolean(indeterminate.value),
-            "modelValue": checkedFields.value.length > 0
-          }, {
-            "default": function _default() {
-              return [t.value.setting.fields.selectAll];
-            }
-          })])]), (0,external_vue_namespaceObject.createVNode)(external_checkbox_namespaceObject.BkCheckboxGroup, {
-            "class": "setting-body-fields",
-            "modelValue": checkedFields.value,
-            "onUpdate:modelValue": function onUpdateModelValue($event) {
-              return checkedFields.value = $event;
-            }
-          }, settings_isSlot(_slot2 = renderFields.value.map(function (item, index) {
-            var _slot;
-            return (0,external_vue_namespaceObject.createVNode)("div", {
-              "class": "field-item"
-            }, [(0,external_vue_namespaceObject.createVNode)(external_checkbox_namespaceObject["default"], {
-              "checked": checkedFields.value.includes(resolvedColVal(item, index)),
-              "label": resolvedColVal(item, index),
-              "disabled": isItemReadonly(item, index)
-            }, settings_isSlot(_slot = resolvePropVal(item, ['name', 'label'], [item, index])) ? _slot : {
-              "default": function _default() {
-                return [_slot];
-              }
-            })]);
-          })) ? _slot2 : {
-            "default": function _default() {
-              return [_slot2];
-            }
-          }), (_slots$default = slots["default"]) === null || _slots$default === void 0 ? void 0 : _slots$default.call(slots), showLineHeight.value ? (0,external_vue_namespaceObject.createVNode)("div", {
-            "class": "setting-body-line-height"
-          }, [t.value.setting.lineHeight.title, (0,external_vue_namespaceObject.createTextVNode)("\uFF1A"), renderSize()]) : '']), (0,external_vue_namespaceObject.createVNode)("div", {
-            "class": "setting-footer"
-          }, [(0,external_vue_namespaceObject.createVNode)(external_button_namespaceObject["default"], {
-            "theme": "primary",
-            "style": buttonStyle,
-            "onClick": handleSaveClick
-          }, {
-            "default": function _default() {
-              return [t.value.setting.options.ok];
-            }
-          }), (0,external_vue_namespaceObject.createVNode)(external_button_namespaceObject["default"], {
-            "style": buttonStyle,
-            "onClick": handleCancelClick
-          }, {
-            "default": function _default() {
-              return [t.value.setting.options.cancel];
-            }
-          })])]);
-        }
-      }) : '';
-    };
-  }
-}));
+  };
+  var getTH = function getTH(classList, style, index) {
+    return (0,external_vue_namespaceObject.createVNode)("th", (0,external_vue_namespaceObject.mergeProps)({
+      "colspan": 1,
+      "rowspan": 1,
+      "data-id": tableResp.getColumnId(column),
+      "class": classList,
+      "style": style,
+      "onClick": function onClick() {
+        return handleColCellClick(index);
+      }
+    }, resolveEventListener(column)), [renderHeadCell(column, index)]);
+  };
+  return {
+    getTH: getTH
+  };
+});
 ;// CONCATENATED MODULE: ../../packages/table/src/use-render.tsx
 
 
 
-var use_render_this = undefined;
 
 function use_render_ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function use_render_objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? use_render_ownKeys(Object(source), !0).forEach(function (key) { defineProperty_defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : use_render_ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
@@ -5303,8 +5647,6 @@ function use_render_objectSpread(target) { for (var i = 1; i < arguments.length;
 
 
 
-
-
 function use_render_isSlot(s) {
   return typeof s === 'function' || Object.prototype.toString.call(s) === '[object Object]' && !(0,external_vue_namespaceObject.isVNode)(s);
 }
@@ -5320,7 +5662,7 @@ function use_render_isSlot(s) {
   var settings = (0,external_vue_namespaceObject.computed)(function () {
     return formatData.value.settings;
   });
-  var activeSortIndex = (0,external_vue_namespaceObject.ref)(null);
+  // const activeSortIndex = ref(null);
   /**
    * 过滤当前可渲染的列
    */
@@ -5435,175 +5777,17 @@ function use_render_isSlot(s) {
     });
     context.emit(EMIT_EVENTS.PAGE_VALUE_CHANGE, current);
   };
-  var getSortFnByColumn = function getSortFnByColumn(column, fn, a, b) {
-    if (column.type === 'index') {
-      return fn(tableResp.getRowAttribute(a, TABLE_ROW_ATTRIBUTE.ROW_INDEX), tableResp.getRowAttribute(b, TABLE_ROW_ATTRIBUTE.ROW_INDEX));
-    }
-    return fn(a, b);
-  };
-  /**
-   * 点击选中一列事件
-   * @param index 当前选中列Index
-   * @param column 当前选中列
-   */
-  var handleColumnHeadClick = function handleColumnHeadClick(index, column) {
-    if (tableResp.getColumnAttribute(column, COLUMN_ATTRIBUTE.COL_IS_DRAG)) {
-      return;
-    }
-    if (column.sort && !column.filter) {
-      var type = tableResp.getColumnAttribute(column, COLUMN_ATTRIBUTE.COL_SORT_TYPE);
-      var nextSort = getNextSortType(type);
-      var sortFn = function sortFn(a, b) {
-        return getSortFnByColumn(column, getSortFn(column, nextSort), a, b);
-      };
-      tableResp.setColumnAttribute(column, COLUMN_ATTRIBUTE.COL_SORT_TYPE, nextSort);
-      tableResp.setColumnAttribute(column, COLUMN_ATTRIBUTE.COL_SORT_FN, sortFn);
-      tableResp.sortData(column);
-      context.emit(EMIT_EVENTS.COLUMN_SORT, {
-        column: (0,external_vue_namespaceObject.unref)(column),
-        index: index,
-        type: nextSort
-      });
-    }
-  };
-  /**
-   * 获取排序设置表头
-   * @param column 当前渲染排序列
-   * @param index 排序列所在index
-   * @returns
-   */
-  var getSortCell = function getSortCell(column, index) {
-    /**
-     * 点击排序事件
-     * @param sortFn 排序函数
-     * @param type 排序类型
-     */
-    var handleSortClick = function handleSortClick(sortFn, type) {
-      var fn = function fn(a, b) {
-        return getSortFnByColumn(column, sortFn, a, b);
-      };
-      tableResp.setColumnAttribute(column, COLUMN_ATTRIBUTE.COL_SORT_TYPE, type);
-      tableResp.setColumnAttribute(column, COLUMN_ATTRIBUTE.COL_SORT_FN, fn);
-      tableResp.sortData(column);
-      activeSortIndex.value = index;
-      context.emit(EMIT_EVENTS.COLUMN_SORT, {
-        column: column,
-        index: index,
-        type: type
-      });
-    };
-    var nextSort = tableResp.getColumnAttribute(column, COLUMN_ATTRIBUTE.COL_SORT_TYPE);
-    var active = props.colSortBehavior === IColSortBehavior.independent ? activeSortIndex.value === index : true;
-    // 如果是独立的，则只高亮当前排序
-    return (0,external_vue_namespaceObject.createVNode)(head_sort, {
-      "column": column,
-      "defaultSort": active ? nextSort : SORT_OPTION.NULL,
-      "onChange": handleSortClick,
-      "active": active
-    }, null);
-  };
-  var getFilterCell = function getFilterCell(column, index) {
-    var handleFilterChange = function handleFilterChange(checked, filterFn) {
-      var filterFn0 = function filterFn0(row, index) {
-        return filterFn(checked, row, index);
-      };
-      tableResp.setColumnAttribute(column, COLUMN_ATTRIBUTE.COL_FILTER_FN, filterFn0);
-      tableResp.filter();
-      context.emit(EMIT_EVENTS.COLUMN_FILTER, {
-        checked: checked,
-        column: (0,external_vue_namespaceObject.unref)(column),
-        index: index
-      });
-    };
-    var filterSave = function filterSave(values) {
-      context.emit(EMIT_EVENTS.COLUMN_FILTER_SAVE, {
-        column: column,
-        values: values
-      });
-    };
-    return (0,external_vue_namespaceObject.createVNode)(head_filter, {
-      "column": column,
-      "height": props.headHeight,
-      "onChange": handleFilterChange,
-      "onFilterSave": filterSave
-    }, null);
-  };
   /**
    * 渲染Table Header
    * @returns
    */
   var renderHeader = function renderHeader() {
     var config = resolveHeadConfig(props);
-    var cellFn = config.cellFn;
     var rowStyle = {
       // @ts-ignore:next-line
       '--row-height': "".concat(resolvePropVal(config, 'height', ['thead']), "px"),
       backgroundColor: props.thead.color
     };
-    var getHeadCellText = function getHeadCellText(column, index) {
-      if (typeof cellFn === 'function') {
-        return cellFn(column, index);
-      }
-      if (typeof column.renderHead === 'function') {
-        return column.renderHead(column, index);
-      }
-      return resolvePropVal(column, 'label', [column, index]);
-    };
-    /**
-     * table head cell render
-     * @param column
-     * @param index
-     * @returns
-     */
-    var renderHeadCell = function renderHeadCell(column, index) {
-      if (column.type === 'selection') {
-        return renderCheckboxColumn(CHECK_ALL_OBJ, null, true);
-      }
-      var cells = [];
-      if (column.sort) {
-        cells.push(getSortCell(column, index));
-      }
-      if (column.filter) {
-        cells.push(getFilterCell(column, index));
-      }
-      var cellText = getHeadCellText(column, index);
-      cells.unshift((0,external_vue_namespaceObject.createVNode)("span", {
-        "class": "head-text"
-      }, [cellText]));
-      var showTitle = typeof cellText === 'string' ? cellText : undefined;
-      var headClass = {
-        'has-sort': !!column.sort,
-        'has-filter': !!column.filter
-      };
-      return (0,external_vue_namespaceObject.createVNode)(table_cell, {
-        "class": headClass,
-        "title": showTitle,
-        "observerResize": props.observerResize,
-        "resizerWay": props.resizerWay,
-        "isHead": true,
-        "column": column,
-        "parentSetting": props.showOverflowTooltip,
-        "headExplain": resolvePropVal(column.explain, 'head', [column])
-      }, use_render_isSlot(cells) ? cells : {
-        "default": function _default() {
-          return [cells];
-        }
-      });
-    };
-    var resolveEventListener = function resolveEventListener(col) {
-      var listeners = tableResp.getColumnAttribute(col, COLUMN_ATTRIBUTE.LISTENERS);
-      if (!listeners) {
-        return {};
-      }
-      return Array.from(listeners === null || listeners === void 0 ? void 0 : listeners.keys()).reduce(function (handle, key) {
-        var eventName = key.split('_').slice(-1)[0];
-        return Object.assign(handle, defineProperty_defineProperty({}, eventName, function (e) {
-          listeners.get(key).forEach(function (fn) {
-            return Reflect.apply(fn, use_render_this, [e, col]);
-          });
-        }));
-      }, {});
-    };
     var _useFixedColumn = use_fixed_column(props, tableResp, head),
       resolveFixedColumnStyle = _useFixedColumn.resolveFixedColumnStyle;
     var getScrollFix = function getScrollFix() {
@@ -5624,19 +5808,13 @@ function use_render_isSlot(s) {
       "default": function _default() {
         return [(0,external_vue_namespaceObject.createVNode)("tr", null, [filterColGroups.value.map(function (column, index) {
           var _props$thead$color, _props$thead;
+          var _useHeadCell = use_head_cell(props, context, column, tableResp),
+            getTH = _useHeadCell.getTH;
           var headStyle = Object.assign({}, resolveFixedColumnStyle(column, styleRef.value.hasScrollY), {
             '--background-color': DEF_COLOR[(_props$thead$color = (_props$thead = props.thead) === null || _props$thead === void 0 ? void 0 : _props$thead.color) !== null && _props$thead$color !== void 0 ? _props$thead$color : IHeadColor.DEF1]
           });
-          return (0,external_vue_namespaceObject.createVNode)("th", (0,external_vue_namespaceObject.mergeProps)({
-            "colspan": 1,
-            "rowspan": 1,
-            "data-id": tableResp.getColumnId(column),
-            "class": [getHeadColumnClass(column, index), getColumnCustomClass(column), column.align || props.headerAlign || props.align],
-            "style": headStyle,
-            "onClick": function onClick() {
-              return handleColumnHeadClick(index, column);
-            }
-          }, resolveEventListener(column)), [renderHeadCell(column, index)]);
+          var classList = [getHeadColumnClass(column, index), getColumnCustomClass(column), column.align || props.headerAlign || props.align];
+          return getTH(classList, headStyle, index);
         }), getScrollFix()])];
       }
     })])]);
@@ -6150,13 +6328,19 @@ function table_objectSpread(target) { for (var i = 1; i < arguments.length; i++)
         tableOffsetRight.value = $tableScrollWidth - $contentWidth;
       }
     };
+    var isFirstLoad = (0,external_vue_namespaceObject.ref)(true);
     (0,external_vue_namespaceObject.watch)(function () {
       return [props.data, columns];
     }, function () {
       tableSchema.formatColumns(columns);
       tableSchema.formatDataSchema(props.data);
       tableSchema.resetStartEndIndex();
-      tableSchema.resolvePageData();
+      if (isFirstLoad.value) {
+        tableSchema.resolveByDefColumns();
+        isFirstLoad.value = false;
+      } else {
+        tableSchema.resolvePageData();
+      }
       registerResizeEvent();
       (0,external_vue_namespaceObject.nextTick)(function () {
         updateOffsetRight();