bkui-vue 2.0.1-beta.15.table.2 → 2.0.1-beta.15.table.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -113,6 +113,7 @@ declare const _default: import("vue").DefineComponent<{
113
113
  showOverflowTooltip?: boolean | {
114
114
  content: string | ((col: import("../props").Column, row: any) => string);
115
115
  disabled?: boolean | ((col: import("../props").Column, row: any) => boolean);
116
+ allowHtml?: boolean;
116
117
  watchCellResize?: boolean;
117
118
  mode?: "auto" | "static";
118
119
  popoverOption?: any;
@@ -1,5 +1,7 @@
1
1
  import { UseColumns } from './use-columns';
2
- declare const _default: (columns: UseColumns) => {
2
+ declare const _default: (columns: UseColumns, { afterResize }: {
3
+ afterResize: any;
4
+ }) => {
3
5
  dragOffsetX: import("vue").Ref<number>;
4
6
  };
5
7
  export default _default;
@@ -6,7 +6,7 @@ declare const useColumns: (props: TablePropTypes) => {
6
6
  headHeight: import("vue").ComputedRef<number>;
7
7
  tableColumnSchema: WeakMap<object, any> & Omit<WeakMap<object, any>, keyof WeakMap<any, any>>;
8
8
  tableColumnList: any[];
9
- visibleColumns: any[];
9
+ visibleColumns: Column[];
10
10
  debounceUpdateColumns: import("lodash").DebouncedFunc<(columns: any) => void>;
11
11
  sortColumns: any[];
12
12
  filterColumns: any[];
@@ -32,6 +32,7 @@ declare const useColumns: (props: TablePropTypes) => {
32
32
  getColumnRect: (column: Column) => any;
33
33
  getColumnCustomClass: (column: any, row?: any) => any;
34
34
  getColumnRefAttribute: (col: Column | IEmptyObject, attributeName: string) => any;
35
+ getColumnCalcWidth: (column: Column) => any;
35
36
  resolveEventListener: (col: Column) => any;
36
37
  setColumnIsHidden: (column: Column, value?: boolean) => void;
37
38
  setColumnResizeWidth: (column: Column, value: number) => void;
@@ -48,6 +49,7 @@ declare const useColumns: (props: TablePropTypes) => {
48
49
  height?: number;
49
50
  }) => void;
50
51
  setVisibleColumns: () => void;
52
+ resolveColsCalcWidth: (width: number) => void;
51
53
  };
52
54
  export type UseColumns = ReturnType<typeof useColumns>;
53
55
  export default useColumns;
@@ -1,7 +1,7 @@
1
1
  import { SetupContext } from 'vue';
2
2
  import { TablePropTypes } from '../props';
3
3
  import { UseColumns } from './use-columns';
4
- declare const useSettings: (props: TablePropTypes, ctx: SetupContext, columns: UseColumns) => {
4
+ declare const useSettings: (props: TablePropTypes, ctx: SetupContext, columns: UseColumns, afterSetting: any) => {
5
5
  options: {
6
6
  fields: any[];
7
7
  checked: any[];
@@ -896,6 +896,7 @@ declare const BkTable: {
896
896
  showOverflowTooltip?: boolean | {
897
897
  content: string | ((col: import("./props").Column, row: any) => string);
898
898
  disabled?: boolean | ((col: import("./props").Column, row: any) => boolean);
899
+ allowHtml?: boolean;
899
900
  watchCellResize?: boolean;
900
901
  mode?: "auto" | "static";
901
902
  popoverOption?: any;
@@ -17692,9 +17692,9 @@ var tableProps = {
17692
17692
  stripe: shared_namespaceObject.PropTypes.bool.def(false),
17693
17693
  /**
17694
17694
  * 设置表格最小高度
17695
- * 默认:300
17695
+ * 默认:LINE_HEIGHT * 4
17696
17696
  */
17697
- minHeight: StringNumberType(LINE_HEIGHT * 2),
17697
+ minHeight: StringNumberType(LINE_HEIGHT * 4),
17698
17698
  /**
17699
17699
  * 设置表格最d大高度
17700
17700
  * 默认:auto,依赖外层高度
@@ -18116,7 +18116,8 @@ const isElement_namespaceObject = isElement_x({ ["default"]: () => __WEBPACK_EXT
18116
18116
 
18117
18117
 
18118
18118
 
18119
- /* harmony default export */ const use_column_resize = (function (columns) {
18119
+ /* harmony default export */ const use_column_resize = (function (columns, _ref) {
18120
+ var afterResize = _ref.afterResize;
18120
18121
  var getColumnAttribute = columns.getColumnAttribute,
18121
18122
  getColumnOrderWidth = columns.getColumnOrderWidth,
18122
18123
  setColumnAttribute = columns.setColumnAttribute;
@@ -18152,12 +18153,15 @@ const isElement_namespaceObject = isElement_x({ ["default"]: () => __WEBPACK_EXT
18152
18153
  var diff = e.clientX - startX;
18153
18154
  var resolveWidth = getColumnOrderWidth(dragColumn, ORDER_LIST) + diff;
18154
18155
  var minWidth = getColumnOrderWidth(dragColumn, [COLUMN_ATTRIBUTE.COL_MIN_WIDTH]);
18155
- setColumnAttribute(dragColumn, COLUMN_ATTRIBUTE.RESIZE_WIDTH, resolveWidth > minWidth ? resolveWidth : minWidth);
18156
+ var calcWidth = resolveWidth > minWidth ? resolveWidth : minWidth;
18157
+ setColumnAttribute(dragColumn, COLUMN_ATTRIBUTE.RESIZE_WIDTH, calcWidth);
18158
+ setColumnAttribute(dragColumn, COLUMN_ATTRIBUTE.CALC_WIDTH, calcWidth);
18156
18159
  document.removeEventListener('mouseup', handleMouseUp);
18157
18160
  document.removeEventListener('mousemove', handleMouseMove);
18158
18161
  startX = 0;
18159
18162
  dragOffsetX.value = -1000;
18160
18163
  dragColumn = null;
18164
+ afterResize === null || afterResize === void 0 || afterResize();
18161
18165
  };
18162
18166
  var updateOffsetX = function updateOffsetX(e) {
18163
18167
  return (0,shared_namespaceObject.throttle)(function () {
@@ -18177,13 +18181,8 @@ const isElement_namespaceObject = isElement_x({ ["default"]: () => __WEBPACK_EXT
18177
18181
  };
18178
18182
  var setChildrenNodeCursor = function setChildrenNodeCursor(root, cursor) {
18179
18183
  if ((0,isElement_namespaceObject["default"])(root)) {
18180
- var _root$style, _root$childNodes;
18184
+ var _root$style;
18181
18185
  (_root$style = root.style) === null || _root$style === void 0 || _root$style.setProperty('cursor', cursor);
18182
- if (((_root$childNodes = root.childNodes) === null || _root$childNodes === void 0 ? void 0 : _root$childNodes.length) > 0) {
18183
- root.childNodes.forEach(function (node) {
18184
- return setChildrenNodeCursor(node, cursor);
18185
- });
18186
- }
18187
18186
  }
18188
18187
  };
18189
18188
  var handler = defineProperty_defineProperty(defineProperty_defineProperty(defineProperty_defineProperty({}, EVENTS.MOUSE_DOWN, function (e, column) {
@@ -19962,6 +19961,21 @@ var getRawData = function getRawData(data) {
19962
19961
  }
19963
19962
  return data;
19964
19963
  };
19964
+ /**
19965
+ * 转换 px | % 为实际数值
19966
+ * @param val
19967
+ * @param parentVal
19968
+ * @returns
19969
+ */
19970
+ var getNumberOrPercentValue = function getNumberOrPercentValue(val, parentVal) {
19971
+ if (/^\d+\.?\d+(px)?$/.test("".concat(val))) {
19972
+ return Number("".concat(val).replace(/px/, ''));
19973
+ }
19974
+ if (/^\d+\.?\d+%$/.test("".concat(val))) {
19975
+ return Number("".concat(val).replace(/%/, '')) / 100 * (parentVal !== null && parentVal !== void 0 ? parentVal : 1);
19976
+ }
19977
+ return null;
19978
+ };
19965
19979
  ;// CONCATENATED MODULE: ../../packages/table/src/hooks/use-columns.tsx
19966
19980
 
19967
19981
 
@@ -20033,6 +20047,63 @@ var useColumns = function useColumns(props) {
20033
20047
  active: true
20034
20048
  }));
20035
20049
  };
20050
+ var setColumnCalcWidth = function setColumnCalcWidth(col, attrName, width) {
20051
+ var colWidth = 0;
20052
+ if (/^\d+\.?\d*(px)?$/.test("".concat(col[attrName]))) {
20053
+ colWidth = Number("".concat(col[attrName]).replace(/px/, ''));
20054
+ setColumnAttribute(col, COLUMN_ATTRIBUTE.CALC_WIDTH, colWidth);
20055
+ setColumnRect(col, {
20056
+ width: colWidth,
20057
+ left: null,
20058
+ right: null
20059
+ });
20060
+ }
20061
+ if (/^\d+\.?\d*%$/.test("".concat(col[attrName]))) {
20062
+ colWidth = Number("".concat(col[attrName]).replace(/%/, '')) / 100 * width;
20063
+ setColumnAttribute(col, COLUMN_ATTRIBUTE.CALC_WIDTH, colWidth);
20064
+ setColumnRect(col, {
20065
+ width: colWidth,
20066
+ left: null,
20067
+ right: null
20068
+ });
20069
+ }
20070
+ return colWidth;
20071
+ };
20072
+ /**
20073
+ * 根据表格外层宽度和表格列配置
20074
+ * 计算每一列的宽度
20075
+ * @param width
20076
+ */
20077
+ var resolveColsCalcWidth = function resolveColsCalcWidth(width) {
20078
+ var diffWidth = width;
20079
+ var minColWidth = COL_MIN_WIDTH;
20080
+ var resolveColWidth = function resolveColWidth(colList) {
20081
+ var attrName = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'width';
20082
+ var filterList = [];
20083
+ colList.forEach(function (col) {
20084
+ var calcWidth = setColumnCalcWidth(col, attrName, width);
20085
+ diffWidth = diffWidth - calcWidth;
20086
+ if ([undefined, null, 'auto', 'undefined', 'null', ''].includes(col[attrName])) {
20087
+ filterList.push(col);
20088
+ }
20089
+ });
20090
+ if (diffWidth > 0 && filterList.length) {
20091
+ minColWidth = diffWidth / filterList.length;
20092
+ }
20093
+ return filterList;
20094
+ };
20095
+ var minWidthList = resolveColWidth(visibleColumns);
20096
+ var autoWidthList = resolveColWidth(minWidthList, 'minWidth');
20097
+ autoWidthList.forEach(function (col) {
20098
+ var calcWidth = minColWidth > COL_MIN_WIDTH ? minColWidth : COL_MIN_WIDTH;
20099
+ setColumnAttribute(col, COLUMN_ATTRIBUTE.CALC_WIDTH, calcWidth);
20100
+ setColumnRect(col, {
20101
+ width: calcWidth,
20102
+ left: null,
20103
+ right: null
20104
+ });
20105
+ });
20106
+ };
20036
20107
  /**
20037
20108
  * 用来记录列的过滤状态
20038
20109
  * @param col
@@ -20228,6 +20299,9 @@ var useColumns = function useColumns(props) {
20228
20299
  var getColumnRect = function getColumnRect(column) {
20229
20300
  return getColumnAttribute(column, COLUMN_ATTRIBUTE.COL_RECT);
20230
20301
  };
20302
+ var getColumnCalcWidth = function getColumnCalcWidth(column) {
20303
+ return getColumnAttribute(column, COLUMN_ATTRIBUTE.CALC_WIDTH);
20304
+ };
20231
20305
  var setColumnRect = function setColumnRect(col, _ref2) {
20232
20306
  var left = _ref2.left,
20233
20307
  right = _ref2.right,
@@ -20429,6 +20503,7 @@ var useColumns = function useColumns(props) {
20429
20503
  getColumnRect: getColumnRect,
20430
20504
  getColumnCustomClass: getColumnCustomClass,
20431
20505
  getColumnRefAttribute: getColumnRefAttribute,
20506
+ getColumnCalcWidth: getColumnCalcWidth,
20432
20507
  resolveEventListener: resolveEventListener,
20433
20508
  setColumnIsHidden: setColumnIsHidden,
20434
20509
  setColumnResizeWidth: setColumnResizeWidth,
@@ -20439,7 +20514,8 @@ var useColumns = function useColumns(props) {
20439
20514
  setColumnSortActive: setColumnSortActive,
20440
20515
  setFixedStyle: setFixedStyle,
20441
20516
  setColumnRect: setColumnRect,
20442
- setVisibleColumns: setVisibleColumns
20517
+ setVisibleColumns: setVisibleColumns,
20518
+ resolveColsCalcWidth: resolveColsCalcWidth
20443
20519
  };
20444
20520
  };
20445
20521
  /* harmony default export */ const use_columns = (useColumns);
@@ -20647,10 +20723,10 @@ var useColumns = function useColumns(props) {
20647
20723
  var length = fixedRightColumns.value.length;
20648
20724
  for (var i = length - 1; i >= 0; i--) {
20649
20725
  var col = fixedRightColumns.value[i];
20650
- var _columns$getColumnRec = columns.getColumnRect(col),
20651
- width = _columns$getColumnRec.width;
20726
+ var width = columns.getColumnCalcWidth(col);
20652
20727
  columns.setColumnRect(col, {
20653
- right: right
20728
+ right: right,
20729
+ width: width
20654
20730
  });
20655
20731
  columns.setFixedStyle(col, {
20656
20732
  right: "".concat(right, "px")
@@ -20659,10 +20735,10 @@ var useColumns = function useColumns(props) {
20659
20735
  }
20660
20736
  var left = 0;
20661
20737
  fixedLeftColumns.value.forEach(function (col) {
20662
- var _columns$getColumnRec2 = columns.getColumnRect(col),
20663
- width = _columns$getColumnRec2.width;
20738
+ var width = columns.getColumnCalcWidth(col);
20664
20739
  columns.setColumnRect(col, {
20665
- left: left
20740
+ left: left,
20741
+ width: width
20666
20742
  });
20667
20743
  columns.setFixedStyle(col, {
20668
20744
  left: "".concat(left, "px")
@@ -20766,7 +20842,9 @@ function use_layout_objectSpread(e) { for (var r = 1; r < arguments.length; r++)
20766
20842
  });
20767
20843
  var tableStyle = (0,external_vue_namespaceObject.computed)(function () {
20768
20844
  return {
20769
- height: resolveNumberOrStringToPix(props.height, '100%')
20845
+ height: resolveNumberOrStringToPix(props.height),
20846
+ maxHeight: resolveNumberOrStringToPix(props.maxHeight),
20847
+ minHeight: resolveNumberOrStringToPix(props.minHeight)
20770
20848
  };
20771
20849
  });
20772
20850
  var headClass = (0,external_vue_namespaceObject.computed)(function () {
@@ -20876,6 +20954,10 @@ function use_layout_objectSpread(e) { for (var r = 1; r < arguments.length; r++)
20876
20954
  }
20877
20955
  ctx.emit(EMIT_EVENTS.SCROLL_BOTTOM, use_layout_objectSpread({}, args));
20878
20956
  });
20957
+ /**
20958
+ * 设置横向滚动条距离右侧距离
20959
+ * 用于判定fix column的显示样式
20960
+ */
20879
20961
  var setOffsetRight = function setOffsetRight() {
20880
20962
  var _refBody$value$refRoo, _refBody$value, _refBody$value$refRoo2, _refBody$value2, _ref;
20881
20963
  var scrollWidth = (_refBody$value$refRoo = (_refBody$value = refBody.value) === null || _refBody$value === void 0 || (_refBody$value = _refBody$value.refRoot) === null || _refBody$value === void 0 ? void 0 : _refBody$value.scrollWidth) !== null && _refBody$value$refRoo !== void 0 ? _refBody$value$refRoo : 0;
@@ -21305,7 +21387,8 @@ const directives_namespaceObject = directives_x({ ["bkEllipsisInstance"]: () =>
21305
21387
  var isTipsEnabled = (0,external_vue_namespaceObject.ref)(false);
21306
21388
  var cellStyle = (0,external_vue_namespaceObject.computed)(function () {
21307
21389
  return {
21308
- textAlign: props.column.textAlign
21390
+ textAlign: props.column.textAlign,
21391
+ minWidth: resolveNumberOrStringToPix(props.column.minWidth, null)
21309
21392
  };
21310
21393
  });
21311
21394
  var resolveSetting = function resolveSetting() {
@@ -21324,12 +21407,12 @@ const directives_namespaceObject = directives_x({ ["bkEllipsisInstance"]: () =>
21324
21407
  mode: mode,
21325
21408
  resizerWay: undefined,
21326
21409
  watchCellResize: undefined,
21327
- popoverOption: popoverOption
21410
+ popoverOption: popoverOption,
21411
+ allowHtml: false
21328
21412
  }
21329
21413
  };
21330
21414
  if (props.parentSetting !== null && typeof_typeof(props.parentSetting) === 'object') {
21331
- Object.assign(result.showOverflowTooltip, props.parentSetting);
21332
- Object.assign(result.showOverflowTooltip, {
21415
+ Object.assign(result.showOverflowTooltip, props.parentSetting, {
21333
21416
  disabled: !props.column.showOverflowTooltip
21334
21417
  });
21335
21418
  if (typeof_typeof(props.column.showOverflowTooltip) === 'object') {
@@ -21343,14 +21426,23 @@ const directives_namespaceObject = directives_x({ ["bkEllipsisInstance"]: () =>
21343
21426
  };
21344
21427
  };
21345
21428
  var bkEllipsisIns = null;
21429
+ var getContentValue = function getContentValue() {
21430
+ var _target$innerText;
21431
+ var allowHtml = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
21432
+ var target = getEllipsisTarget();
21433
+ if (allowHtml) {
21434
+ var _target$cloneNode, _target$cloneNode2;
21435
+ return (_target$cloneNode = target === null || target === void 0 || (_target$cloneNode2 = target.cloneNode) === null || _target$cloneNode2 === void 0 ? void 0 : _target$cloneNode2.call(target, true)) !== null && _target$cloneNode !== void 0 ? _target$cloneNode : '';
21436
+ }
21437
+ return (_target$innerText = target === null || target === void 0 ? void 0 : target.innerText) !== null && _target$innerText !== void 0 ? _target$innerText : '';
21438
+ };
21346
21439
  var resolveTooltipOption = function resolveTooltipOption() {
21347
- var _getEllipsisTarget$cl, _getEllipsisTarget, _getEllipsisTarget$cl2;
21348
21440
  var _resolveSetting = resolveSetting(),
21349
21441
  _resolveSetting$showO = _resolveSetting.showOverflowTooltip,
21350
21442
  showOverflowTooltip = _resolveSetting$showO === void 0 ? false : _resolveSetting$showO;
21351
21443
  var disabled = true;
21352
21444
  var resizerWay = props.resizerWay;
21353
- var defaultContent = (_getEllipsisTarget$cl = (_getEllipsisTarget = getEllipsisTarget()) === null || _getEllipsisTarget === void 0 || (_getEllipsisTarget$cl2 = _getEllipsisTarget.cloneNode) === null || _getEllipsisTarget$cl2 === void 0 ? void 0 : _getEllipsisTarget$cl2.call(_getEllipsisTarget, true)) !== null && _getEllipsisTarget$cl !== void 0 ? _getEllipsisTarget$cl : '';
21445
+ var defaultContent = getContentValue(showOverflowTooltip.allowHtml);
21354
21446
  var content = function content() {
21355
21447
  return defaultContent;
21356
21448
  };
@@ -21395,8 +21487,8 @@ const directives_namespaceObject = directives_x({ ["bkEllipsisInstance"]: () =>
21395
21487
  disabled = !((_props$column$showOve5 = (_props$column = props.column) === null || _props$column === void 0 || (_props$column = _props$column.showOverflowTooltip) === null || _props$column === void 0 ? void 0 : _props$column.showHead) !== null && _props$column$showOve5 !== void 0 ? _props$column$showOve5 : true);
21396
21488
  mode = 'auto';
21397
21489
  content = function content() {
21398
- var _getEllipsisTarget$cl3, _getEllipsisTarget2, _getEllipsisTarget2$c;
21399
- return (_getEllipsisTarget$cl3 = (_getEllipsisTarget2 = getEllipsisTarget()) === null || _getEllipsisTarget2 === void 0 || (_getEllipsisTarget2$c = _getEllipsisTarget2.cloneNode) === null || _getEllipsisTarget2$c === void 0 ? void 0 : _getEllipsisTarget2$c.call(_getEllipsisTarget2, true)) !== null && _getEllipsisTarget$cl3 !== void 0 ? _getEllipsisTarget$cl3 : '';
21490
+ var _getEllipsisTarget$cl, _getEllipsisTarget, _getEllipsisTarget$cl2;
21491
+ return (_getEllipsisTarget$cl = (_getEllipsisTarget = getEllipsisTarget()) === null || _getEllipsisTarget === void 0 || (_getEllipsisTarget$cl2 = _getEllipsisTarget.cloneNode) === null || _getEllipsisTarget$cl2 === void 0 ? void 0 : _getEllipsisTarget$cl2.call(_getEllipsisTarget, true)) !== null && _getEllipsisTarget$cl !== void 0 ? _getEllipsisTarget$cl : '';
21400
21492
  };
21401
21493
  if (props.headExplain) {
21402
21494
  mode = 'static';
@@ -21646,7 +21738,8 @@ var ROW_HEIGHT = 32;
21646
21738
  var _filter$value$list = filter.value.list,
21647
21739
  list = _filter$value$list === void 0 ? [] : _filter$value$list;
21648
21740
  var filterList = list.filter(function (l) {
21649
- return getRegExp(searchValue.value).test(l.value);
21741
+ var reg = getRegExp(searchValue.value);
21742
+ return reg.test(l.label) || reg.test(l.value);
21650
21743
  });
21651
21744
  return filterList;
21652
21745
  });
@@ -22391,9 +22484,9 @@ function use_render_isSlot(s) {
22391
22484
  var minWidth = columns.getColumnAttribute(column, COLUMN_ATTRIBUTE.COL_MIN_WIDTH);
22392
22485
  return (0,external_vue_namespaceObject.createVNode)("col", {
22393
22486
  "style": {
22487
+ width: resolveNumberOrStringToPix(width, 'auto'),
22394
22488
  minWidth: resolveNumberOrStringToPix(minWidth, 'auto')
22395
- },
22396
- "width": width
22489
+ }
22397
22490
  }, null);
22398
22491
  })]);
22399
22492
  };
@@ -23337,7 +23430,7 @@ const loading_less_namespaceObject = loading_less_x({ });
23337
23430
  function use_settings_isSlot(s) {
23338
23431
  return typeof s === 'function' || Object.prototype.toString.call(s) === '[object Object]' && !(0,external_vue_namespaceObject.isVNode)(s);
23339
23432
  }
23340
- var useSettings = function useSettings(props, ctx, columns) {
23433
+ var useSettings = function useSettings(props, ctx, columns, afterSetting) {
23341
23434
  var t = (0,config_provider_namespaceObject.useLocale)('table');
23342
23435
  var _usePrefix = (0,config_provider_namespaceObject.usePrefix)(),
23343
23436
  resolveClassName = _usePrefix.resolveClassName;
@@ -23413,6 +23506,7 @@ var useSettings = function useSettings(props, ctx, columns) {
23413
23506
  Object.assign(options, result);
23414
23507
  columns.setColumnAttributeBySettings(options, result.checked);
23415
23508
  columns.setVisibleColumns();
23509
+ afterSetting === null || afterSetting === void 0 || afterSetting(result.checked);
23416
23510
  (_refSetting$value = refSetting.value) === null || _refSetting$value === void 0 || _refSetting$value.hide();
23417
23511
  ctx.emit(EMIT_EVENTS.SETTING_CHANGE, result);
23418
23512
  };
@@ -23675,7 +23769,28 @@ var useSettings = function useSettings(props, ctx, columns) {
23675
23769
  var columns = use_columns(props);
23676
23770
  var rows = use_rows(props);
23677
23771
  var pagination = use_pagination(props);
23678
- var settings = use_settings(props, ctx, columns);
23772
+ var _useLayout = use_layout(props, ctx),
23773
+ renderContainer = _useLayout.renderContainer,
23774
+ renderBody = _useLayout.renderBody,
23775
+ renderHeader = _useLayout.renderHeader,
23776
+ renderFooter = _useLayout.renderFooter,
23777
+ setBodyHeight = _useLayout.setBodyHeight,
23778
+ setFootHeight = _useLayout.setFootHeight,
23779
+ setDragOffsetX = _useLayout.setDragOffsetX,
23780
+ setOffsetRight = _useLayout.setOffsetRight,
23781
+ refBody = _useLayout.refBody,
23782
+ refRoot = _useLayout.refRoot;
23783
+ /**
23784
+ * 设置字段结束,展示字段改变,设置表格偏移量为0
23785
+ * 避免太长横向滚动导致数据不可见
23786
+ * @param fields
23787
+ */
23788
+ var afterSetting = function afterSetting(fields) {
23789
+ if ((fields === null || fields === void 0 ? void 0 : fields.length) > 0) {
23790
+ refBody.value.scrollTo(0, 0);
23791
+ }
23792
+ };
23793
+ var settings = use_settings(props, ctx, columns, afterSetting);
23679
23794
  var dragEvents = use_draggable(props, rows, ctx);
23680
23795
  var _useRender = use_render({
23681
23796
  props: props,
@@ -23690,8 +23805,6 @@ var useSettings = function useSettings(props, ctx, columns) {
23690
23805
  renderTFoot = _useRender.renderTFoot,
23691
23806
  setDragEvents = _useRender.setDragEvents;
23692
23807
  setDragEvents(dragEvents);
23693
- var _useColumnResize = use_column_resize(columns),
23694
- dragOffsetX = _useColumnResize.dragOffsetX;
23695
23808
  var _useColumnTemplate = use_column_template(),
23696
23809
  resolveColumns = _useColumnTemplate.resolveColumns;
23697
23810
  var instance = (0,external_vue_namespaceObject.getCurrentInstance)();
@@ -23699,43 +23812,26 @@ var useSettings = function useSettings(props, ctx, columns) {
23699
23812
  columns.debounceUpdateColumns(resolveColumns(instance));
23700
23813
  };
23701
23814
  (0,external_vue_namespaceObject.provide)(PROVIDE_KEY_INIT_COL, initTableColumns);
23702
- var _useLayout = use_layout(props, ctx),
23703
- renderContainer = _useLayout.renderContainer,
23704
- renderBody = _useLayout.renderBody,
23705
- renderHeader = _useLayout.renderHeader,
23706
- renderFooter = _useLayout.renderFooter,
23707
- setBodyHeight = _useLayout.setBodyHeight,
23708
- setFootHeight = _useLayout.setFootHeight,
23709
- setDragOffsetX = _useLayout.setDragOffsetX,
23710
- setOffsetRight = _useLayout.setOffsetRight,
23711
- refRoot = _useLayout.refRoot,
23712
- refHead = _useLayout.refHead;
23713
23815
  var _useFixedColumn = use_fixed_column(props, columns),
23714
23816
  renderFixedRows = _useFixedColumn.renderFixedRows,
23715
23817
  resolveFixedColumnStyle = _useFixedColumn.resolveFixedColumnStyle;
23716
23818
  var _useScrollLoading = use_scroll_loading(props, ctx),
23717
23819
  renderScrollLoading = _useScrollLoading.renderScrollLoading;
23718
- var isResizeBodyHeight = (0,external_vue_namespaceObject.ref)(false);
23820
+ /**
23821
+ * Column配置改变或者容器Resize之后,根据Columns配置
23822
+ * 计算每一列的实际宽度
23823
+ */
23719
23824
  var computedColumnRect = function computedColumnRect() {
23720
- var _refHead$value;
23721
- if ((0,lodash.isElement)((_refHead$value = refHead === null || refHead === void 0 ? void 0 : refHead.value) !== null && _refHead$value !== void 0 ? _refHead$value : null)) {
23722
- columns.visibleColumns.forEach(function (col) {
23723
- var _refHead$value2;
23724
- var id = columns.getColumnId(col);
23725
- var query = "[data-id=\"".concat(id, "\"]");
23726
- var target = refHead === null || refHead === void 0 || (_refHead$value2 = refHead.value) === null || _refHead$value2 === void 0 ? void 0 : _refHead$value2.querySelector(query);
23727
- if ((0,lodash.isElement)(target)) {
23728
- columns.setColumnRect(col, {
23729
- width: target.offsetWidth,
23730
- height: target.offsetHeight,
23731
- left: null,
23732
- right: null
23733
- });
23734
- }
23735
- });
23736
- resolveFixedColumnStyle();
23737
- }
23825
+ var _refRoot$value$offset, _refRoot$value;
23826
+ var width = (_refRoot$value$offset = (_refRoot$value = refRoot.value) === null || _refRoot$value === void 0 ? void 0 : _refRoot$value.offsetWidth) !== null && _refRoot$value$offset !== void 0 ? _refRoot$value$offset : 0;
23827
+ columns.resolveColsCalcWidth(width);
23828
+ resolveFixedColumnStyle();
23738
23829
  };
23830
+ var _useColumnResize = use_column_resize(columns, {
23831
+ afterResize: resolveFixedColumnStyle
23832
+ }),
23833
+ dragOffsetX = _useColumnResize.dragOffsetX;
23834
+ var isResizeBodyHeight = (0,external_vue_namespaceObject.ref)(false);
23739
23835
  /**
23740
23836
  * table 渲染行
23741
23837
  */
@@ -46,6 +46,7 @@ export declare const fixedType: import("vue-types").VueTypeValidableDef<"left" |
46
46
  export type IOverflowTooltipOption = {
47
47
  content: ((col: Column, row: any) => string) | string;
48
48
  disabled?: ((col: Column, row: any) => boolean) | boolean;
49
+ allowHtml?: boolean;
49
50
  watchCellResize?: boolean;
50
51
  mode?: `${OverflowModeEnum}`;
51
52
  popoverOption?: any;
@@ -272,7 +273,7 @@ export declare const tableProps: {
272
273
  };
273
274
  /**
274
275
  * 设置表格最小高度
275
- * 默认:300
276
+ * 默认:LINE_HEIGHT * 4
276
277
  */
277
278
  minHeight: import("vue-types").VueTypeDef<StringNumber> & {
278
279
  default: StringNumber;
@@ -1208,7 +1208,6 @@
1208
1208
  width: 100%;
1209
1209
  height: 100%;
1210
1210
  overflow: hidden;
1211
- border-collapse: separate;
1212
1211
  border-spacing: 0;
1213
1212
  }
1214
1213
  .bk-table-flex {
@@ -1271,7 +1270,7 @@
1271
1270
  .bk-table .bk-table-head table,
1272
1271
  .bk-table .bk-table-body table {
1273
1272
  width: 100%;
1274
- border-collapse: collapse;
1273
+ border-collapse: separate;
1275
1274
  transform: translateZ(0);
1276
1275
  table-layout: fixed;
1277
1276
  align-self: flex-start;
@@ -1418,16 +1417,6 @@
1418
1417
  content: '';
1419
1418
  transform: translateX(50%);
1420
1419
  }
1421
- .bk-table .bk-table-head table thead th.column_fixed::after,
1422
- .bk-table .bk-table-body table thead th.column_fixed::after {
1423
- position: absolute;
1424
- content: '';
1425
- right: -2px;
1426
- top: 0;
1427
- bottom: 0;
1428
- width: 2px;
1429
- background-color: var(--table-head-bg-color);
1430
- }
1431
1420
  .bk-table .bk-table-head table thead th .cell,
1432
1421
  .bk-table .bk-table-body table thead th .cell {
1433
1422
  display: flex;
@@ -1442,12 +1431,6 @@
1442
1431
  cursor: pointer;
1443
1432
  background: var(--table-row-active-bg-color);
1444
1433
  }
1445
- .bk-table .bk-table-head table thead th.active.column_fixed::after,
1446
- .bk-table .bk-table-body table thead th.active.column_fixed::after,
1447
- .bk-table .bk-table-head table thead th:hover.column_fixed::after,
1448
- .bk-table .bk-table-body table thead th:hover.column_fixed::after {
1449
- background-color: var(--table-row-hover-bg-color);
1450
- }
1451
1434
  .bk-table .bk-table-head table thead th.column_fixed,
1452
1435
  .bk-table .bk-table-body table thead th.column_fixed {
1453
1436
  transform: translateX(var(--scroll-left));
@@ -1476,25 +1459,11 @@
1476
1459
  text-align: center;
1477
1460
  cursor: move;
1478
1461
  }
1479
- .bk-table .bk-table-head table tbody tr td.column_fixed::after,
1480
- .bk-table .bk-table-body table tbody tr td.column_fixed::after {
1481
- position: absolute;
1482
- content: '';
1483
- right: -2px;
1484
- top: 0;
1485
- bottom: 0;
1486
- width: 2px;
1487
- background-color: var(--table-bg-color);
1488
- }
1489
1462
  .bk-table .bk-table-head table tbody tr:hover.hover-highlight td:not(.empty-cell),
1490
1463
  .bk-table .bk-table-body table tbody tr:hover.hover-highlight td:not(.empty-cell) {
1491
1464
  background: var(--table-row-hover-bg-color);
1492
1465
  border-right-color: var(--table-row-hover-bg-color);
1493
1466
  }
1494
- .bk-table .bk-table-head table tbody tr:hover.hover-highlight td.column_fixed::after,
1495
- .bk-table .bk-table-body table tbody tr:hover.hover-highlight td.column_fixed::after {
1496
- background-color: var(--table-row-hover-bg-color);
1497
- }
1498
1467
  .bk-table .bk-table-head table tbody tr.--drag-start td,
1499
1468
  .bk-table .bk-table-body table tbody tr.--drag-start td {
1500
1469
  background: #fff !important;
@@ -1574,10 +1543,7 @@
1574
1543
  border-bottom: 1px solid var(--table-border-color);
1575
1544
  }
1576
1545
  .bk-table.bordered-col th {
1577
- border-right: 1px solid var(--table-border-color);
1578
- }
1579
- .bk-table.bordered-col th.column_fixed::after {
1580
- border-left: solid 1px var(--table-border-color);
1546
+ border-right: 1px solid var(--background-color);
1581
1547
  }
1582
1548
  .bk-table.bordered-col th:last-child {
1583
1549
  border-right: none;
@@ -1585,9 +1551,6 @@
1585
1551
  .bk-table.bordered-col .bk-table-body tbody tr td {
1586
1552
  border-right-color: var(--table-border-color);
1587
1553
  }
1588
- .bk-table.bordered-col .bk-table-body tbody tr td.column_fixed::after {
1589
- border-left: solid 1px var(--table-border-color);
1590
- }
1591
1554
  .bk-table th,
1592
1555
  .bk-table td {
1593
1556
  border-right: 1px solid var(--table-bg-color);