@vtx/components 4.0.0-beta.35 → 4.0.0-beta.36

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.
@@ -3,21 +3,21 @@ function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableTo
3
3
  function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
4
4
  function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
5
5
  function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
6
+ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
7
+ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
8
+ function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
9
+ function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
10
+ function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
6
11
  function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
7
12
  function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
8
13
  function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
9
14
  function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
10
15
  function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
11
16
  function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
12
- function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
13
- function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
14
- function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
15
- function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
16
- function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
17
17
  import { useMergedState } from '@rc-component/util';
18
18
  import request from '@vtx/utils/lib/request';
19
19
  import getSignature from '@vtx/utils/lib/getSignature';
20
- import { createContext, useEffect, useMemo, useRef, useState } from 'react';
20
+ import { createContext, useEffect, useMemo, useRef, useState, useCallback } from 'react';
21
21
  import { useIntl } from "../../vtx-provider";
22
22
  import { message } from 'antd';
23
23
  import { genColumnKey, isFunction, sortByGivenOrder, useDeepCompareEffectDebounce } from "../../utils";
@@ -25,13 +25,59 @@ import renderColumnButtons from "../renderColumnButtons";
25
25
  import { getVtxToken } from '@vtx/utils';
26
26
  import { jsx as _jsx } from "react/jsx-runtime";
27
27
  export var indexColumnKey = '_serialNum';
28
+ function useMergedState1(defaultValue, option) {
29
+ var _ref = option || {},
30
+ controlledValue = _ref.value,
31
+ onChange = _ref.onChange,
32
+ id = _ref.id;
33
+
34
+ // 1. 初始化内部非受控状态
35
+ var _useState = useState(defaultValue),
36
+ _useState2 = _slicedToArray(_useState, 2),
37
+ innerValue = _useState2[0],
38
+ setInnerValue = _useState2[1];
39
+ // 记录上一次的值,用于 onChange 回调传参
40
+ var prevValueRef = useRef(controlledValue !== null && controlledValue !== void 0 ? controlledValue : innerValue);
41
+ // 2. 受控模式下,同步更新 prevValueRef
42
+ useEffect(function () {
43
+ if (controlledValue !== undefined) {
44
+ prevValueRef.current = controlledValue;
45
+ }
46
+ }, [controlledValue]);
47
+ // 3. 统一的取值逻辑:优先用受控值,否则用内部值
48
+ var mergedValue = controlledValue !== undefined ? controlledValue : innerValue;
49
+ // 4. 统一的更新方法
50
+ var setValue = useCallback(function (value) {
51
+ var prevValue = mergedValue;
52
+ // 处理函数式更新(和 useState 保持一致)
53
+ var nextValue = typeof value === 'function' ? value(prevValue) : value;
54
+
55
+ // 受控模式:调用 onChange,不更新内部 state
56
+ if (controlledValue !== undefined) {
57
+ onChange === null || onChange === void 0 || onChange(nextValue, prevValue);
58
+ }
59
+ // 非受控模式:更新内部 state,同时触发 onChange
60
+ else {
61
+ setInnerValue(nextValue);
62
+ onChange === null || onChange === void 0 || onChange(nextValue, prevValue);
63
+ }
64
+ // 更新上一次值的缓存
65
+ prevValueRef.current = nextValue;
66
+ }, [controlledValue, mergedValue, onChange]);
67
+ // 5. 重置方法:恢复到初始默认值
68
+ var reset = useCallback(function () {
69
+ var resetValue = typeof defaultValue === 'function' ? defaultValue() : defaultValue;
70
+ setValue(resetValue);
71
+ }, [defaultValue, setValue]);
72
+ return [mergedValue, setValue, reset];
73
+ }
28
74
  function useContainer() {
29
75
  var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
30
- var _ref = getVtxToken() || {},
31
- _ref$userId = _ref.userId,
32
- userId = _ref$userId === void 0 ? '' : _ref$userId,
33
- _ref$tenantId = _ref.tenantId,
34
- tenantId = _ref$tenantId === void 0 ? '' : _ref$tenantId;
76
+ var _ref2 = getVtxToken() || {},
77
+ _ref2$userId = _ref2.userId,
78
+ userId = _ref2$userId === void 0 ? '' : _ref2$userId,
79
+ _ref2$tenantId = _ref2.tenantId,
80
+ tenantId = _ref2$tenantId === void 0 ? '' : _ref2$tenantId;
35
81
  var intl = useIntl();
36
82
  var _props$indexColumn = props.indexColumn,
37
83
  indexColumn = _props$indexColumn === void 0 ? true : _props$indexColumn,
@@ -87,22 +133,22 @@ function useContainer() {
87
133
  var columnsMapRef = useRef({});
88
134
  // 是否可拖拽, 除非columns 至少需要一项不设置 width 让其自适应。
89
135
  var isDragRef = useRef(false);
90
- var _useState = useState({}),
91
- _useState2 = _slicedToArray(_useState, 2),
92
- columnsMap = _useState2[0],
93
- setColumnsMap = _useState2[1];
94
- var _useState3 = useState(false),
136
+ var _useState3 = useState({}),
95
137
  _useState4 = _slicedToArray(_useState3, 2),
96
- showTable = _useState4[0],
97
- setShowTable = _useState4[1];
98
- var _useState5 = useState(''),
138
+ columnsMap = _useState4[0],
139
+ setColumnsMap = _useState4[1];
140
+ var _useState5 = useState(false),
99
141
  _useState6 = _slicedToArray(_useState5, 2),
100
- keyWords = _useState6[0],
101
- _setKeyWords = _useState6[1];
102
- var _useState7 = useState({}),
142
+ showTable = _useState6[0],
143
+ setShowTable = _useState6[1];
144
+ var _useState7 = useState(''),
103
145
  _useState8 = _slicedToArray(_useState7, 2),
104
- tableConfig = _useState8[0],
105
- setTableConfig = _useState8[1];
146
+ keyWords = _useState8[0],
147
+ _setKeyWords = _useState8[1];
148
+ var _useState9 = useState({}),
149
+ _useState10 = _slicedToArray(_useState9, 2),
150
+ tableConfig = _useState10[0],
151
+ setTableConfig = _useState10[1];
106
152
  var _useMergedState = useMergedState(function () {
107
153
  return props.size || props.defaultSize || 'middle';
108
154
  }, {
@@ -113,7 +159,7 @@ function useContainer() {
113
159
  tableSize = _useMergedState2[0],
114
160
  setTableSize = _useMergedState2[1];
115
161
  var _useMergedState3 = useMergedState(function () {
116
- return props.tableStyles || ['striped', 'header-background', 'border'];
162
+ return props.tableStyles || props.defaultTableStyles || ['striped', 'header-background', 'border'];
117
163
  }, {
118
164
  value: props.tableStyles,
119
165
  onChange: props.onChangeTableStyles
@@ -122,7 +168,7 @@ function useContainer() {
122
168
  tableStyles = _useMergedState4[0],
123
169
  setTableStyles = _useMergedState4[1];
124
170
  var _useMergedState5 = useMergedState(function () {
125
- return props.visibleColumnKeys || undefined;
171
+ return props.visibleColumnKeys || props.defaultVisibleColumnKeys || undefined;
126
172
  }, {
127
173
  value: props.visibleColumnKeys,
128
174
  onChange: props.onVisibleColumnsChange
@@ -131,7 +177,7 @@ function useContainer() {
131
177
  visibleColumnKeys = _useMergedState6[0],
132
178
  setVisibleColumnKeys = _useMergedState6[1];
133
179
  var _useMergedState7 = useMergedState(function () {
134
- return props.uniqueKey || undefined;
180
+ return props.uniqueKey || props.defaultUniqueKey || undefined;
135
181
  }, {
136
182
  value: props.uniqueKey,
137
183
  onChange: props.onChangesUniqueKey
@@ -170,13 +216,18 @@ function useContainer() {
170
216
  key: newColumn.key || newColumn.dataIndex,
171
217
  disable: disabledColumnKeys === null || disabledColumnKeys === void 0 ? void 0 : disabledColumnKeys.includes(column.dataIndex || column.key),
172
218
  render: isFunction(column.renderButtons) ? function (text, record, index) {
173
- return renderColumnButtons({
174
- renderButtons: column.renderButtons,
175
- visible: column.renderButtonsVisibleNum,
176
- text: text,
177
- record: record,
178
- index: index,
179
- TextEnum: TextEnum
219
+ return /*#__PURE__*/_jsx("div", {
220
+ style: {
221
+ whiteSpace: 'nowrap'
222
+ },
223
+ children: renderColumnButtons({
224
+ renderButtons: column.renderButtons,
225
+ visible: column.renderButtonsVisibleNum,
226
+ text: text,
227
+ record: record,
228
+ index: index,
229
+ TextEnum: TextEnum
230
+ })
180
231
  });
181
232
  } : 'render' in column ? column.render : function (text) {
182
233
  return ['', null, undefined].includes(text) ? '-' : text;
@@ -194,28 +245,28 @@ function useContainer() {
194
245
  sortKeyColumns.current = tableConfig.sortKeyColumns;
195
246
  return tableConfig.columnsMap;
196
247
  } else if (Array.isArray(props.defaultVisibleColumnKeys)) {
197
- tableColumn === null || tableColumn === void 0 || tableColumn.forEach(function (_ref2, index) {
198
- var _ref3;
199
- var key = _ref2.key,
200
- dataIndex = _ref2.dataIndex,
201
- fixed = _ref2.fixed,
202
- disable = _ref2.disable,
203
- width = _ref2.width;
248
+ tableColumn === null || tableColumn === void 0 || tableColumn.forEach(function (_ref3, index) {
249
+ var _ref4;
250
+ var key = _ref3.key,
251
+ dataIndex = _ref3.dataIndex,
252
+ fixed = _ref3.fixed,
253
+ disable = _ref3.disable,
254
+ width = _ref3.width;
204
255
  var columnKey = genColumnKey(key !== null && key !== void 0 ? key : dataIndex, index);
205
256
  columnKeyMap[columnKey] = {
206
- show: indexColumn && indexColumnKey == columnKey ? true : (_ref3 = _toConsumableArray(props.defaultVisibleColumnKeys)) === null || _ref3 === void 0 ? void 0 : _ref3.includes(columnKey),
257
+ show: indexColumn && indexColumnKey == columnKey ? true : (_ref4 = _toConsumableArray(props.defaultVisibleColumnKeys)) === null || _ref4 === void 0 ? void 0 : _ref4.includes(columnKey),
207
258
  fixed: fixed,
208
259
  disable: disable,
209
260
  width: width
210
261
  };
211
262
  });
212
263
  } else {
213
- tableColumn === null || tableColumn === void 0 || tableColumn.forEach(function (_ref4, index) {
214
- var key = _ref4.key,
215
- dataIndex = _ref4.dataIndex,
216
- fixed = _ref4.fixed,
217
- disable = _ref4.disable,
218
- width = _ref4.width;
264
+ tableColumn === null || tableColumn === void 0 || tableColumn.forEach(function (_ref5, index) {
265
+ var key = _ref5.key,
266
+ dataIndex = _ref5.dataIndex,
267
+ fixed = _ref5.fixed,
268
+ disable = _ref5.disable,
269
+ width = _ref5.width;
219
270
  var columnKey = genColumnKey(key !== null && key !== void 0 ? key : dataIndex, index);
220
271
  columnKeyMap[columnKey] = {
221
272
  show: true,
@@ -232,44 +283,44 @@ function useContainer() {
232
283
  useDeepCompareEffectDebounce(function () {
233
284
  var columnKeyMap = {};
234
285
  if (Array.isArray(visibleColumnKeys)) {
235
- tableColumn === null || tableColumn === void 0 || tableColumn.forEach(function (_ref5, index) {
236
- var _ref6;
237
- var key = _ref5.key,
238
- dataIndex = _ref5.dataIndex,
239
- fixed = _ref5.fixed,
240
- disable = _ref5.disable,
241
- width = _ref5.width;
286
+ tableColumn === null || tableColumn === void 0 || tableColumn.forEach(function (_ref6, index) {
287
+ var _ref7;
288
+ var key = _ref6.key,
289
+ dataIndex = _ref6.dataIndex,
290
+ fixed = _ref6.fixed,
291
+ disable = _ref6.disable,
292
+ width = _ref6.width;
242
293
  var columnKey = genColumnKey(key !== null && key !== void 0 ? key : dataIndex, index);
243
294
  columnKeyMap[columnKey] = {
244
- show: isFirst.current && indexColumn && indexColumnKey == columnKey ? true : (_ref6 = _toConsumableArray(visibleColumnKeys)) === null || _ref6 === void 0 ? void 0 : _ref6.includes(columnKey),
295
+ show: isFirst.current && indexColumn && indexColumnKey == columnKey ? true : (_ref7 = _toConsumableArray(visibleColumnKeys)) === null || _ref7 === void 0 ? void 0 : _ref7.includes(columnKey),
245
296
  fixed: fixed,
246
297
  disable: disable,
247
298
  width: width
248
299
  };
249
300
  });
250
301
  } else if (Array.isArray(props.defaultVisibleColumnKeys)) {
251
- tableColumn === null || tableColumn === void 0 || tableColumn.forEach(function (_ref7, index) {
252
- var _ref8;
253
- var key = _ref7.key,
254
- dataIndex = _ref7.dataIndex,
255
- fixed = _ref7.fixed,
256
- disable = _ref7.disable,
257
- width = _ref7.width;
302
+ tableColumn === null || tableColumn === void 0 || tableColumn.forEach(function (_ref8, index) {
303
+ var _ref9;
304
+ var key = _ref8.key,
305
+ dataIndex = _ref8.dataIndex,
306
+ fixed = _ref8.fixed,
307
+ disable = _ref8.disable,
308
+ width = _ref8.width;
258
309
  var columnKey = genColumnKey(key !== null && key !== void 0 ? key : dataIndex, index);
259
310
  columnKeyMap[columnKey] = {
260
- show: isFirst.current && indexColumn && indexColumnKey == columnKey ? true : (_ref8 = _toConsumableArray(props.defaultVisibleColumnKeys)) === null || _ref8 === void 0 ? void 0 : _ref8.includes(columnKey),
311
+ show: isFirst.current && indexColumn && indexColumnKey == columnKey ? true : (_ref9 = _toConsumableArray(props.defaultVisibleColumnKeys)) === null || _ref9 === void 0 ? void 0 : _ref9.includes(columnKey),
261
312
  fixed: fixed,
262
313
  disable: disable,
263
314
  width: width
264
315
  };
265
316
  });
266
317
  } else {
267
- tableColumn === null || tableColumn === void 0 || tableColumn.forEach(function (_ref9, index) {
268
- var key = _ref9.key,
269
- dataIndex = _ref9.dataIndex,
270
- fixed = _ref9.fixed,
271
- disable = _ref9.disable,
272
- width = _ref9.width;
318
+ tableColumn === null || tableColumn === void 0 || tableColumn.forEach(function (_ref10, index) {
319
+ var key = _ref10.key,
320
+ dataIndex = _ref10.dataIndex,
321
+ fixed = _ref10.fixed,
322
+ disable = _ref10.disable,
323
+ width = _ref10.width;
273
324
  var columnKey = genColumnKey(key !== null && key !== void 0 ? key : dataIndex, index);
274
325
  columnKeyMap[columnKey] = {
275
326
  show: true,
@@ -280,9 +331,9 @@ function useContainer() {
280
331
  });
281
332
  }
282
333
  var sortKeys = visibleColumnKeys || props.defaultVisibleColumnKeys || [];
283
- sortKeyColumns.current = Object.entries(columnKeyMap).map(function (_ref10) {
284
- var _ref11 = _slicedToArray(_ref10, 1),
285
- key = _ref11[0];
334
+ sortKeyColumns.current = Object.entries(columnKeyMap).map(function (_ref11) {
335
+ var _ref12 = _slicedToArray(_ref11, 1),
336
+ key = _ref12[0];
286
337
  return key;
287
338
  });
288
339
  if ((sortKeys === null || sortKeys === void 0 ? void 0 : sortKeys.length) > 0) {
@@ -7,6 +7,7 @@ import { Fragment as _Fragment } from "react/jsx-runtime";
7
7
  function Density() {
8
8
  var counter = useContext(TableContext);
9
9
  var TextEnum = counter.TextEnum;
10
+ console.log('tableSize', counter.tableSize);
10
11
  return /*#__PURE__*/_jsx(_Fragment, {
11
12
  children: /*#__PURE__*/_jsx(Dropdown, {
12
13
  menu: {
@@ -23,6 +24,7 @@ function Density() {
23
24
  onClick: function onClick(_ref) {
24
25
  var _counter$setTableSize;
25
26
  var key = _ref.key;
27
+ console.log('counter', counter, key);
26
28
  (_counter$setTableSize = counter.setTableSize) === null || _counter$setTableSize === void 0 || _counter$setTableSize.call(counter, key);
27
29
  },
28
30
  selectedKeys: [counter.tableSize]
@@ -32,8 +32,8 @@ var isMac = navigator.userAgent.indexOf('Mac OS') !== -1;
32
32
  export var indexColumnKey = '_serialNum';
33
33
  export var DEFAULT_HEIGHTS = {
34
34
  HEAD_FOOT: 115,
35
- ALERT: 49,
36
- TOOLBAR: 56
35
+ ALERT: 48,
36
+ TOOLBAR: 64
37
37
  };
38
38
  function VtxTable(props) {
39
39
  var _rest$dataSource, _rest$rowSelection, _rest$rowSelection3, _rest$rowSelection4;
@@ -52,7 +52,8 @@ function VtxTable(props) {
52
52
  isDragRef = _useContext2.isDragRef,
53
53
  rootDomRef = _useContext2.rootDomRef,
54
54
  sortKeyColumns = _useContext2.sortKeyColumns,
55
- TextEnum = _useContext2.TextEnum;
55
+ TextEnum = _useContext2.TextEnum,
56
+ tableSize = _useContext2.tableSize;
56
57
  var _useSet = useSet({
57
58
  // 表格id
58
59
  datagridId: "vtx-datagrid-".concat(new Date().getTime()),
@@ -111,8 +112,18 @@ function VtxTable(props) {
111
112
  if (!rootDomRef.current) {
112
113
  return null;
113
114
  }
114
- var bodyHeight = ((_rootDomRef$current = rootDomRef.current) === null || _rootDomRef$current === void 0 ? void 0 : _rootDomRef$current.clientHeight) - headFootHeight - toolbarHeight.current - alertHeight.current;
115
115
  var divs = rootDomRef.current.getElementsByTagName('div');
116
+ var pagination = Array.prototype.filter.call(rootDomRef.current.getElementsByTagName('ul'), function (dom) {
117
+ return dom.className.includes('ant-pagination');
118
+ })[0];
119
+ var tableHeader = Array.prototype.filter.call(rootDomRef.current.getElementsByTagName('thead'), function (dom) {
120
+ return dom.className.includes('ant-table-thead');
121
+ })[0];
122
+ var _headFootHeight = headFootHeight;
123
+ if (tableHeader) {
124
+ _headFootHeight = ((pagination === null || pagination === void 0 ? void 0 : pagination.clientHeight) || 0) + 32 + (tableHeader === null || tableHeader === void 0 ? void 0 : tableHeader.clientHeight);
125
+ }
126
+ var bodyHeight = ((_rootDomRef$current = rootDomRef.current) === null || _rootDomRef$current === void 0 ? void 0 : _rootDomRef$current.clientHeight) - _headFootHeight - toolbarHeight.current - alertHeight.current;
116
127
  var bodyDiv = Array.prototype.filter.call(divs, function (dom) {
117
128
  return dom.className.includes('ant-table-body') || dom.className.includes('ant-table-content');
118
129
  })[0];
@@ -124,12 +135,11 @@ function VtxTable(props) {
124
135
  }
125
136
  var tableHeight = (_bodyDiv$getElementsB = bodyDiv.getElementsByTagName('table')) === null || _bodyDiv$getElementsB === void 0 || (_bodyDiv$getElementsB = _bodyDiv$getElementsB[0]) === null || _bodyDiv$getElementsB === void 0 ? void 0 : _bodyDiv$getElementsB.clientHeight;
126
137
  if (tablePlaceholder) {
127
- var _rootDomRef$current2;
128
- tablePlaceholder.style.height = "".concat(((_rootDomRef$current2 = rootDomRef.current) === null || _rootDomRef$current2 === void 0 ? void 0 : _rootDomRef$current2.clientHeight) - headFootHeight + 68 - (rest.scrollY || 0) - 12, "px");
138
+ tablePlaceholder.style.height = "".concat(bodyHeight - (rest.scrollY || 0) - 12 - 32, "px");
129
139
  var tableCell = Array.prototype.filter.call(tablePlaceholder.getElementsByTagName('td'), function (dom) {
130
140
  return dom.className.includes('ant-table-cell');
131
141
  })[0];
132
- tableCell.style.height = "".concat(bodyHeight - (rest.scrollY || 0) - 12, "px");
142
+ tableCell.style.height = "".concat(bodyHeight - (rest.scrollY || 0) - 12 - 32, "px");
133
143
  }
134
144
  // antd6.x 的bug 如果table的高度 没有body 高 则没有滚动条
135
145
 
@@ -154,7 +164,7 @@ function VtxTable(props) {
154
164
  resizeObserver.disconnect();
155
165
  }
156
166
  };
157
- }, [autoFit]);
167
+ }, [autoFit, tableSize]);
158
168
  useLayoutEffect(function () {
159
169
  if (autoFit) {
160
170
  calculateHeight();
@@ -251,7 +261,7 @@ function VtxTable(props) {
251
261
  var _useAntdColumnResize = useAntdColumnResize(function () {
252
262
  return {
253
263
  columns: columns,
254
- minWidth: 20
264
+ minWidth: 10
255
265
  };
256
266
  }, [columns]),
257
267
  resizableColumns = _useAntdColumnResize.resizableColumns,
@@ -354,7 +364,9 @@ function VtxTable(props) {
354
364
  bordered: true
355
365
  // virtual
356
366
  }, rest), {}, {
357
- dataSource: dataSource,
367
+ dataSource: dataSource
368
+ // scroll={{ ...scroll }}
369
+ ,
358
370
  scroll: _objectSpread({
359
371
  x: 'max-content'
360
372
  }, scroll),
@@ -70,8 +70,8 @@ var renderColumnButtons = function renderColumnButtons(_ref) {
70
70
  };
71
71
  })) || [],
72
72
  onClick: function onClick(e) {
73
- var _moreActions$e$key;
74
- (_moreActions$e$key = moreActions[e.key]) === null || _moreActions$e$key === void 0 || _moreActions$e$key.onClick(record, index);
73
+ var _moreActions$e$key, _moreActions$e$key$on;
74
+ (_moreActions$e$key = moreActions[e.key]) === null || _moreActions$e$key === void 0 || (_moreActions$e$key$on = _moreActions$e$key.onClick) === null || _moreActions$e$key$on === void 0 || _moreActions$e$key$on.call(_moreActions$e$key, record, index);
75
75
  }
76
76
  },
77
77
  children: /*#__PURE__*/_jsxs("a", {
@@ -8,30 +8,33 @@ import { useStyle as useAntdStyle } from "../../vtx-provider";
8
8
  var genVtxStyle = function genVtxStyle(token) {
9
9
  var componentCls = token.componentCls,
10
10
  antCls = token.antCls;
11
- return _defineProperty({}, componentCls, _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({
11
+ return _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, componentCls, _defineProperty({
12
12
  position: 'relative',
13
- overflow: 'hidden'
14
- }, "".concat(antCls, "-table-wrapper"), _defineProperty(_defineProperty(_defineProperty({}, '.ant-spin', _defineProperty({
13
+ // overflow: 'hidden',
14
+ display: 'flex',
15
+ flexDirection: 'column'
16
+ }, "".concat(antCls, "-table-wrapper"), _defineProperty(_defineProperty(_defineProperty(_defineProperty({}, "table", {
17
+ // minWidth: "calc(100% - 2px) !important"
18
+ }), '.ant-spin', _defineProperty({
15
19
  height: '100%'
16
20
  }, '.ant-spin-container', _defineProperty({
17
- height: '100%'
18
- }, '.ant-table', {
21
+ height: '100%',
22
+ display: 'flex',
23
+ flexDirection: 'column'
24
+ }, '.ant-table', _defineProperty({
19
25
  // height: '100%',
20
- // ['.ant-table-container']: {
26
+ flex: 1
27
+ }, '.ant-table-container', _defineProperty(_defineProperty({}, '.ant-table-body', {
28
+ scrollbarWidth: "thin"
29
+ }), '.ant-table-content', _defineProperty({}, 'table', {
21
30
  // height: '100%',
22
- // ['.ant-table-content']: {
23
- // height: '100%',
24
- // ['table']: {
25
- // height: '100%',
26
- // }
27
- // }
28
- // }
29
- }))), '.ant-table', _defineProperty(_defineProperty(_defineProperty({}, '.ant-table-header', _defineProperty({}, '.ant-table-thead', {
31
+ // minWidth: "calc(100% - 1px) !important",
32
+ })))))), '.ant-table', _defineProperty(_defineProperty(_defineProperty({}, '.ant-table-header', _defineProperty({}, '.ant-table-thead', {
30
33
  '>tr>th': {
31
34
  background: token.colorBgContainer
32
35
  }
33
36
  })), '.ant-table-cell', {
34
- minWidth: 20
37
+ // minWidth: 10,
35
38
  }), '.ant-table-tbody', {
36
39
  '>tr.ant-table-placeholder': {
37
40
  position: 'absolute',
@@ -62,9 +65,9 @@ var genVtxStyle = function genVtxStyle(token) {
62
65
  }
63
66
  })), '.ant-pagination', _defineProperty({}, '.ant-pagination-item', {
64
67
  borderRadius: token.borderRadiusSM
65
- }))), "&-fit", {
68
+ })))), "".concat(componentCls, "-fit"), {
66
69
  height: '100%'
67
- }), "&-noFit", {}), "&-no-border", _defineProperty({}, "".concat(antCls, "-table-wrapper"), _defineProperty({}, "".concat(antCls, "-table"), _defineProperty({}, '>.ant-table-container', _defineProperty(_defineProperty({
70
+ }), "".concat(componentCls, "-noFit"), {}), "".concat(componentCls, "-no-border"), _defineProperty({}, "".concat(antCls, "-table-wrapper"), _defineProperty({}, "".concat(antCls, "-table"), _defineProperty({}, '>.ant-table-container', _defineProperty(_defineProperty({
68
71
  borderColor: 'transparent'
69
72
  }, '.ant-table-thead', {
70
73
  '>tr>th': {
@@ -78,7 +81,7 @@ var genVtxStyle = function genVtxStyle(token) {
78
81
  borderInlineColor: 'transparent !important',
79
82
  borderBottomColor: 'transparent !important'
80
83
  }
81
- }))))), "&.vtx-datagrid-striped", _defineProperty({}, "".concat(antCls, "-table-wrapper"), _defineProperty({}, "".concat(antCls, "-table"), _defineProperty({}, '>.ant-table-container', _defineProperty({}, '.ant-table-body', {
84
+ }))))), "".concat(componentCls, "-striped"), _defineProperty({}, "".concat(antCls, "-table-wrapper"), _defineProperty({}, "".concat(antCls, "-table"), _defineProperty({}, '>.ant-table-container', _defineProperty({}, '.ant-table-body', {
82
85
  '>table >tbody>tr:nth-child(odd)>td': {
83
86
  backgroundColor: token.colorBgLayoutTable,
84
87
  '&.ant-table-cell-row-hover': {
@@ -94,11 +97,11 @@ var genVtxStyle = function genVtxStyle(token) {
94
97
  backgroundColor: token.controlItemBgActiveHover
95
98
  }
96
99
  }
97
- }))))), "&.vtx-datagrid-header-background", _defineProperty({}, "".concat(antCls, "-table-wrapper"), _defineProperty({}, '.ant-table', _defineProperty({}, '.ant-table-header', _defineProperty({}, '.ant-table-thead', {
100
+ }))))), "".concat(componentCls, "-header-background"), _defineProperty({}, "".concat(antCls, "-table-wrapper"), _defineProperty({}, '.ant-table', _defineProperty({}, '.ant-table-header', _defineProperty({}, '.ant-table-thead', {
98
101
  '>tr>th': {
99
102
  background: token.colorBgLayoutTable
100
103
  }
101
- }))))));
104
+ })))));
102
105
  };
103
106
  export function useStyle(prefix) {
104
107
  return useAntdStyle(prefix, function (token) {
@@ -10,7 +10,9 @@ var genVtxEllipsisTextStyle = function genVtxEllipsisTextStyle(token) {
10
10
  return _defineProperty({}, componentCls, _defineProperty(_defineProperty({
11
11
  margin: 0,
12
12
  overflow: 'hidden',
13
- textOverflow: 'ellipsis'
13
+ textOverflow: 'ellipsis',
14
+ wordBreak: "break-all",
15
+ wordWrap: "break-word"
14
16
  }, "&--single", {
15
17
  whiteSpace: 'nowrap'
16
18
  }), "&--multi", {
@@ -10,6 +10,7 @@ var genVtxSplitPaneStyle = function genVtxSplitPaneStyle(token) {
10
10
  return _defineProperty({}, componentCls, {
11
11
  height: '100%',
12
12
  overflow: 'hidden',
13
+ backgroundColor: token.colorBgLayout,
13
14
  '.ant-splitter-bar .ant-splitter-bar-dragger::before': {
14
15
  background: 'transparent'
15
16
  },
@@ -1,5 +1,6 @@
1
1
  "use strict";
2
2
 
3
+ function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
3
4
  Object.defineProperty(exports, "__esModule", {
4
5
  value: true
5
6
  });
@@ -15,30 +16,75 @@ var _renderColumnButtons = _interopRequireDefault(require("../renderColumnButton
15
16
  var _utils2 = require("@vtx/utils");
16
17
  var _jsxRuntime = require("react/jsx-runtime");
17
18
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
18
- function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
19
19
  function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
20
20
  function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
21
21
  function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
22
22
  function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
23
+ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
24
+ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
25
+ function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
26
+ function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
27
+ function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
23
28
  function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
24
29
  function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
25
30
  function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
26
31
  function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
27
32
  function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
28
33
  function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
29
- function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
30
- function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
31
- function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
32
- function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
33
- function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
34
34
  var indexColumnKey = exports.indexColumnKey = '_serialNum';
35
+ function useMergedState1(defaultValue, option) {
36
+ var _ref = option || {},
37
+ controlledValue = _ref.value,
38
+ onChange = _ref.onChange,
39
+ id = _ref.id;
40
+
41
+ // 1. 初始化内部非受控状态
42
+ var _useState = (0, _react.useState)(defaultValue),
43
+ _useState2 = _slicedToArray(_useState, 2),
44
+ innerValue = _useState2[0],
45
+ setInnerValue = _useState2[1];
46
+ // 记录上一次的值,用于 onChange 回调传参
47
+ var prevValueRef = (0, _react.useRef)(controlledValue !== null && controlledValue !== void 0 ? controlledValue : innerValue);
48
+ // 2. 受控模式下,同步更新 prevValueRef
49
+ (0, _react.useEffect)(function () {
50
+ if (controlledValue !== undefined) {
51
+ prevValueRef.current = controlledValue;
52
+ }
53
+ }, [controlledValue]);
54
+ // 3. 统一的取值逻辑:优先用受控值,否则用内部值
55
+ var mergedValue = controlledValue !== undefined ? controlledValue : innerValue;
56
+ // 4. 统一的更新方法
57
+ var setValue = (0, _react.useCallback)(function (value) {
58
+ var prevValue = mergedValue;
59
+ // 处理函数式更新(和 useState 保持一致)
60
+ var nextValue = typeof value === 'function' ? value(prevValue) : value;
61
+
62
+ // 受控模式:调用 onChange,不更新内部 state
63
+ if (controlledValue !== undefined) {
64
+ onChange === null || onChange === void 0 || onChange(nextValue, prevValue);
65
+ }
66
+ // 非受控模式:更新内部 state,同时触发 onChange
67
+ else {
68
+ setInnerValue(nextValue);
69
+ onChange === null || onChange === void 0 || onChange(nextValue, prevValue);
70
+ }
71
+ // 更新上一次值的缓存
72
+ prevValueRef.current = nextValue;
73
+ }, [controlledValue, mergedValue, onChange]);
74
+ // 5. 重置方法:恢复到初始默认值
75
+ var reset = (0, _react.useCallback)(function () {
76
+ var resetValue = typeof defaultValue === 'function' ? defaultValue() : defaultValue;
77
+ setValue(resetValue);
78
+ }, [defaultValue, setValue]);
79
+ return [mergedValue, setValue, reset];
80
+ }
35
81
  function useContainer() {
36
82
  var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
37
- var _ref = (0, _utils2.getVtxToken)() || {},
38
- _ref$userId = _ref.userId,
39
- userId = _ref$userId === void 0 ? '' : _ref$userId,
40
- _ref$tenantId = _ref.tenantId,
41
- tenantId = _ref$tenantId === void 0 ? '' : _ref$tenantId;
83
+ var _ref2 = (0, _utils2.getVtxToken)() || {},
84
+ _ref2$userId = _ref2.userId,
85
+ userId = _ref2$userId === void 0 ? '' : _ref2$userId,
86
+ _ref2$tenantId = _ref2.tenantId,
87
+ tenantId = _ref2$tenantId === void 0 ? '' : _ref2$tenantId;
42
88
  var intl = (0, _vtxProvider.useIntl)();
43
89
  var _props$indexColumn = props.indexColumn,
44
90
  indexColumn = _props$indexColumn === void 0 ? true : _props$indexColumn,
@@ -94,22 +140,22 @@ function useContainer() {
94
140
  var columnsMapRef = (0, _react.useRef)({});
95
141
  // 是否可拖拽, 除非columns 至少需要一项不设置 width 让其自适应。
96
142
  var isDragRef = (0, _react.useRef)(false);
97
- var _useState = (0, _react.useState)({}),
98
- _useState2 = _slicedToArray(_useState, 2),
99
- columnsMap = _useState2[0],
100
- setColumnsMap = _useState2[1];
101
- var _useState3 = (0, _react.useState)(false),
143
+ var _useState3 = (0, _react.useState)({}),
102
144
  _useState4 = _slicedToArray(_useState3, 2),
103
- showTable = _useState4[0],
104
- setShowTable = _useState4[1];
105
- var _useState5 = (0, _react.useState)(''),
145
+ columnsMap = _useState4[0],
146
+ setColumnsMap = _useState4[1];
147
+ var _useState5 = (0, _react.useState)(false),
106
148
  _useState6 = _slicedToArray(_useState5, 2),
107
- keyWords = _useState6[0],
108
- _setKeyWords = _useState6[1];
109
- var _useState7 = (0, _react.useState)({}),
149
+ showTable = _useState6[0],
150
+ setShowTable = _useState6[1];
151
+ var _useState7 = (0, _react.useState)(''),
110
152
  _useState8 = _slicedToArray(_useState7, 2),
111
- tableConfig = _useState8[0],
112
- setTableConfig = _useState8[1];
153
+ keyWords = _useState8[0],
154
+ _setKeyWords = _useState8[1];
155
+ var _useState9 = (0, _react.useState)({}),
156
+ _useState10 = _slicedToArray(_useState9, 2),
157
+ tableConfig = _useState10[0],
158
+ setTableConfig = _useState10[1];
113
159
  var _useMergedState = (0, _util.useMergedState)(function () {
114
160
  return props.size || props.defaultSize || 'middle';
115
161
  }, {
@@ -120,7 +166,7 @@ function useContainer() {
120
166
  tableSize = _useMergedState2[0],
121
167
  setTableSize = _useMergedState2[1];
122
168
  var _useMergedState3 = (0, _util.useMergedState)(function () {
123
- return props.tableStyles || ['striped', 'header-background', 'border'];
169
+ return props.tableStyles || props.defaultTableStyles || ['striped', 'header-background', 'border'];
124
170
  }, {
125
171
  value: props.tableStyles,
126
172
  onChange: props.onChangeTableStyles
@@ -129,7 +175,7 @@ function useContainer() {
129
175
  tableStyles = _useMergedState4[0],
130
176
  setTableStyles = _useMergedState4[1];
131
177
  var _useMergedState5 = (0, _util.useMergedState)(function () {
132
- return props.visibleColumnKeys || undefined;
178
+ return props.visibleColumnKeys || props.defaultVisibleColumnKeys || undefined;
133
179
  }, {
134
180
  value: props.visibleColumnKeys,
135
181
  onChange: props.onVisibleColumnsChange
@@ -138,7 +184,7 @@ function useContainer() {
138
184
  visibleColumnKeys = _useMergedState6[0],
139
185
  setVisibleColumnKeys = _useMergedState6[1];
140
186
  var _useMergedState7 = (0, _util.useMergedState)(function () {
141
- return props.uniqueKey || undefined;
187
+ return props.uniqueKey || props.defaultUniqueKey || undefined;
142
188
  }, {
143
189
  value: props.uniqueKey,
144
190
  onChange: props.onChangesUniqueKey
@@ -177,13 +223,18 @@ function useContainer() {
177
223
  key: newColumn.key || newColumn.dataIndex,
178
224
  disable: disabledColumnKeys === null || disabledColumnKeys === void 0 ? void 0 : disabledColumnKeys.includes(column.dataIndex || column.key),
179
225
  render: (0, _utils.isFunction)(column.renderButtons) ? function (text, record, index) {
180
- return (0, _renderColumnButtons.default)({
181
- renderButtons: column.renderButtons,
182
- visible: column.renderButtonsVisibleNum,
183
- text: text,
184
- record: record,
185
- index: index,
186
- TextEnum: TextEnum
226
+ return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
227
+ style: {
228
+ whiteSpace: 'nowrap'
229
+ },
230
+ children: (0, _renderColumnButtons.default)({
231
+ renderButtons: column.renderButtons,
232
+ visible: column.renderButtonsVisibleNum,
233
+ text: text,
234
+ record: record,
235
+ index: index,
236
+ TextEnum: TextEnum
237
+ })
187
238
  });
188
239
  } : 'render' in column ? column.render : function (text) {
189
240
  return ['', null, undefined].includes(text) ? '-' : text;
@@ -201,28 +252,28 @@ function useContainer() {
201
252
  sortKeyColumns.current = tableConfig.sortKeyColumns;
202
253
  return tableConfig.columnsMap;
203
254
  } else if (Array.isArray(props.defaultVisibleColumnKeys)) {
204
- tableColumn === null || tableColumn === void 0 || tableColumn.forEach(function (_ref2, index) {
205
- var _ref3;
206
- var key = _ref2.key,
207
- dataIndex = _ref2.dataIndex,
208
- fixed = _ref2.fixed,
209
- disable = _ref2.disable,
210
- width = _ref2.width;
255
+ tableColumn === null || tableColumn === void 0 || tableColumn.forEach(function (_ref3, index) {
256
+ var _ref4;
257
+ var key = _ref3.key,
258
+ dataIndex = _ref3.dataIndex,
259
+ fixed = _ref3.fixed,
260
+ disable = _ref3.disable,
261
+ width = _ref3.width;
211
262
  var columnKey = (0, _utils.genColumnKey)(key !== null && key !== void 0 ? key : dataIndex, index);
212
263
  columnKeyMap[columnKey] = {
213
- show: indexColumn && indexColumnKey == columnKey ? true : (_ref3 = _toConsumableArray(props.defaultVisibleColumnKeys)) === null || _ref3 === void 0 ? void 0 : _ref3.includes(columnKey),
264
+ show: indexColumn && indexColumnKey == columnKey ? true : (_ref4 = _toConsumableArray(props.defaultVisibleColumnKeys)) === null || _ref4 === void 0 ? void 0 : _ref4.includes(columnKey),
214
265
  fixed: fixed,
215
266
  disable: disable,
216
267
  width: width
217
268
  };
218
269
  });
219
270
  } else {
220
- tableColumn === null || tableColumn === void 0 || tableColumn.forEach(function (_ref4, index) {
221
- var key = _ref4.key,
222
- dataIndex = _ref4.dataIndex,
223
- fixed = _ref4.fixed,
224
- disable = _ref4.disable,
225
- width = _ref4.width;
271
+ tableColumn === null || tableColumn === void 0 || tableColumn.forEach(function (_ref5, index) {
272
+ var key = _ref5.key,
273
+ dataIndex = _ref5.dataIndex,
274
+ fixed = _ref5.fixed,
275
+ disable = _ref5.disable,
276
+ width = _ref5.width;
226
277
  var columnKey = (0, _utils.genColumnKey)(key !== null && key !== void 0 ? key : dataIndex, index);
227
278
  columnKeyMap[columnKey] = {
228
279
  show: true,
@@ -239,44 +290,44 @@ function useContainer() {
239
290
  (0, _utils.useDeepCompareEffectDebounce)(function () {
240
291
  var columnKeyMap = {};
241
292
  if (Array.isArray(visibleColumnKeys)) {
242
- tableColumn === null || tableColumn === void 0 || tableColumn.forEach(function (_ref5, index) {
243
- var _ref6;
244
- var key = _ref5.key,
245
- dataIndex = _ref5.dataIndex,
246
- fixed = _ref5.fixed,
247
- disable = _ref5.disable,
248
- width = _ref5.width;
293
+ tableColumn === null || tableColumn === void 0 || tableColumn.forEach(function (_ref6, index) {
294
+ var _ref7;
295
+ var key = _ref6.key,
296
+ dataIndex = _ref6.dataIndex,
297
+ fixed = _ref6.fixed,
298
+ disable = _ref6.disable,
299
+ width = _ref6.width;
249
300
  var columnKey = (0, _utils.genColumnKey)(key !== null && key !== void 0 ? key : dataIndex, index);
250
301
  columnKeyMap[columnKey] = {
251
- show: isFirst.current && indexColumn && indexColumnKey == columnKey ? true : (_ref6 = _toConsumableArray(visibleColumnKeys)) === null || _ref6 === void 0 ? void 0 : _ref6.includes(columnKey),
302
+ show: isFirst.current && indexColumn && indexColumnKey == columnKey ? true : (_ref7 = _toConsumableArray(visibleColumnKeys)) === null || _ref7 === void 0 ? void 0 : _ref7.includes(columnKey),
252
303
  fixed: fixed,
253
304
  disable: disable,
254
305
  width: width
255
306
  };
256
307
  });
257
308
  } else if (Array.isArray(props.defaultVisibleColumnKeys)) {
258
- tableColumn === null || tableColumn === void 0 || tableColumn.forEach(function (_ref7, index) {
259
- var _ref8;
260
- var key = _ref7.key,
261
- dataIndex = _ref7.dataIndex,
262
- fixed = _ref7.fixed,
263
- disable = _ref7.disable,
264
- width = _ref7.width;
309
+ tableColumn === null || tableColumn === void 0 || tableColumn.forEach(function (_ref8, index) {
310
+ var _ref9;
311
+ var key = _ref8.key,
312
+ dataIndex = _ref8.dataIndex,
313
+ fixed = _ref8.fixed,
314
+ disable = _ref8.disable,
315
+ width = _ref8.width;
265
316
  var columnKey = (0, _utils.genColumnKey)(key !== null && key !== void 0 ? key : dataIndex, index);
266
317
  columnKeyMap[columnKey] = {
267
- show: isFirst.current && indexColumn && indexColumnKey == columnKey ? true : (_ref8 = _toConsumableArray(props.defaultVisibleColumnKeys)) === null || _ref8 === void 0 ? void 0 : _ref8.includes(columnKey),
318
+ show: isFirst.current && indexColumn && indexColumnKey == columnKey ? true : (_ref9 = _toConsumableArray(props.defaultVisibleColumnKeys)) === null || _ref9 === void 0 ? void 0 : _ref9.includes(columnKey),
268
319
  fixed: fixed,
269
320
  disable: disable,
270
321
  width: width
271
322
  };
272
323
  });
273
324
  } else {
274
- tableColumn === null || tableColumn === void 0 || tableColumn.forEach(function (_ref9, index) {
275
- var key = _ref9.key,
276
- dataIndex = _ref9.dataIndex,
277
- fixed = _ref9.fixed,
278
- disable = _ref9.disable,
279
- width = _ref9.width;
325
+ tableColumn === null || tableColumn === void 0 || tableColumn.forEach(function (_ref10, index) {
326
+ var key = _ref10.key,
327
+ dataIndex = _ref10.dataIndex,
328
+ fixed = _ref10.fixed,
329
+ disable = _ref10.disable,
330
+ width = _ref10.width;
280
331
  var columnKey = (0, _utils.genColumnKey)(key !== null && key !== void 0 ? key : dataIndex, index);
281
332
  columnKeyMap[columnKey] = {
282
333
  show: true,
@@ -287,9 +338,9 @@ function useContainer() {
287
338
  });
288
339
  }
289
340
  var sortKeys = visibleColumnKeys || props.defaultVisibleColumnKeys || [];
290
- sortKeyColumns.current = Object.entries(columnKeyMap).map(function (_ref10) {
291
- var _ref11 = _slicedToArray(_ref10, 1),
292
- key = _ref11[0];
341
+ sortKeyColumns.current = Object.entries(columnKeyMap).map(function (_ref11) {
342
+ var _ref12 = _slicedToArray(_ref11, 1),
343
+ key = _ref12[0];
293
344
  return key;
294
345
  });
295
346
  if ((sortKeys === null || sortKeys === void 0 ? void 0 : sortKeys.length) > 0) {
@@ -13,6 +13,7 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
13
13
  function Density() {
14
14
  var counter = (0, _react.useContext)(_Provide.TableContext);
15
15
  var TextEnum = counter.TextEnum;
16
+ console.log('tableSize', counter.tableSize);
16
17
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
17
18
  children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Dropdown, {
18
19
  menu: {
@@ -29,6 +30,7 @@ function Density() {
29
30
  onClick: function onClick(_ref) {
30
31
  var _counter$setTableSize;
31
32
  var key = _ref.key;
33
+ console.log('counter', counter, key);
32
34
  (_counter$setTableSize = counter.setTableSize) === null || _counter$setTableSize === void 0 || _counter$setTableSize.call(counter, key);
33
35
  },
34
36
  selectedKeys: [counter.tableSize]
@@ -42,8 +42,8 @@ var isMac = navigator.userAgent.indexOf('Mac OS') !== -1;
42
42
  var indexColumnKey = exports.indexColumnKey = '_serialNum';
43
43
  var DEFAULT_HEIGHTS = exports.DEFAULT_HEIGHTS = {
44
44
  HEAD_FOOT: 115,
45
- ALERT: 49,
46
- TOOLBAR: 56
45
+ ALERT: 48,
46
+ TOOLBAR: 64
47
47
  };
48
48
  function VtxTable(props) {
49
49
  var _rest$dataSource, _rest$rowSelection, _rest$rowSelection3, _rest$rowSelection4;
@@ -62,7 +62,8 @@ function VtxTable(props) {
62
62
  isDragRef = _useContext2.isDragRef,
63
63
  rootDomRef = _useContext2.rootDomRef,
64
64
  sortKeyColumns = _useContext2.sortKeyColumns,
65
- TextEnum = _useContext2.TextEnum;
65
+ TextEnum = _useContext2.TextEnum,
66
+ tableSize = _useContext2.tableSize;
66
67
  var _useSet = (0, _useSet3.default)({
67
68
  // 表格id
68
69
  datagridId: "vtx-datagrid-".concat(new Date().getTime()),
@@ -121,8 +122,18 @@ function VtxTable(props) {
121
122
  if (!rootDomRef.current) {
122
123
  return null;
123
124
  }
124
- var bodyHeight = ((_rootDomRef$current = rootDomRef.current) === null || _rootDomRef$current === void 0 ? void 0 : _rootDomRef$current.clientHeight) - headFootHeight - toolbarHeight.current - alertHeight.current;
125
125
  var divs = rootDomRef.current.getElementsByTagName('div');
126
+ var pagination = Array.prototype.filter.call(rootDomRef.current.getElementsByTagName('ul'), function (dom) {
127
+ return dom.className.includes('ant-pagination');
128
+ })[0];
129
+ var tableHeader = Array.prototype.filter.call(rootDomRef.current.getElementsByTagName('thead'), function (dom) {
130
+ return dom.className.includes('ant-table-thead');
131
+ })[0];
132
+ var _headFootHeight = headFootHeight;
133
+ if (tableHeader) {
134
+ _headFootHeight = ((pagination === null || pagination === void 0 ? void 0 : pagination.clientHeight) || 0) + 32 + (tableHeader === null || tableHeader === void 0 ? void 0 : tableHeader.clientHeight);
135
+ }
136
+ var bodyHeight = ((_rootDomRef$current = rootDomRef.current) === null || _rootDomRef$current === void 0 ? void 0 : _rootDomRef$current.clientHeight) - _headFootHeight - toolbarHeight.current - alertHeight.current;
126
137
  var bodyDiv = Array.prototype.filter.call(divs, function (dom) {
127
138
  return dom.className.includes('ant-table-body') || dom.className.includes('ant-table-content');
128
139
  })[0];
@@ -134,12 +145,11 @@ function VtxTable(props) {
134
145
  }
135
146
  var tableHeight = (_bodyDiv$getElementsB = bodyDiv.getElementsByTagName('table')) === null || _bodyDiv$getElementsB === void 0 || (_bodyDiv$getElementsB = _bodyDiv$getElementsB[0]) === null || _bodyDiv$getElementsB === void 0 ? void 0 : _bodyDiv$getElementsB.clientHeight;
136
147
  if (tablePlaceholder) {
137
- var _rootDomRef$current2;
138
- tablePlaceholder.style.height = "".concat(((_rootDomRef$current2 = rootDomRef.current) === null || _rootDomRef$current2 === void 0 ? void 0 : _rootDomRef$current2.clientHeight) - headFootHeight + 68 - (rest.scrollY || 0) - 12, "px");
148
+ tablePlaceholder.style.height = "".concat(bodyHeight - (rest.scrollY || 0) - 12 - 32, "px");
139
149
  var tableCell = Array.prototype.filter.call(tablePlaceholder.getElementsByTagName('td'), function (dom) {
140
150
  return dom.className.includes('ant-table-cell');
141
151
  })[0];
142
- tableCell.style.height = "".concat(bodyHeight - (rest.scrollY || 0) - 12, "px");
152
+ tableCell.style.height = "".concat(bodyHeight - (rest.scrollY || 0) - 12 - 32, "px");
143
153
  }
144
154
  // antd6.x 的bug 如果table的高度 没有body 高 则没有滚动条
145
155
 
@@ -164,7 +174,7 @@ function VtxTable(props) {
164
174
  resizeObserver.disconnect();
165
175
  }
166
176
  };
167
- }, [autoFit]);
177
+ }, [autoFit, tableSize]);
168
178
  (0, _react.useLayoutEffect)(function () {
169
179
  if (autoFit) {
170
180
  calculateHeight();
@@ -261,7 +271,7 @@ function VtxTable(props) {
261
271
  var _useAntdColumnResize = (0, _reactAntdColumnResize.useAntdColumnResize)(function () {
262
272
  return {
263
273
  columns: columns,
264
- minWidth: 20
274
+ minWidth: 10
265
275
  };
266
276
  }, [columns]),
267
277
  resizableColumns = _useAntdColumnResize.resizableColumns,
@@ -364,7 +374,9 @@ function VtxTable(props) {
364
374
  bordered: true
365
375
  // virtual
366
376
  }, rest), {}, {
367
- dataSource: dataSource,
377
+ dataSource: dataSource
378
+ // scroll={{ ...scroll }}
379
+ ,
368
380
  scroll: _objectSpread({
369
381
  x: 'max-content'
370
382
  }, scroll),
@@ -76,8 +76,8 @@ var renderColumnButtons = function renderColumnButtons(_ref) {
76
76
  };
77
77
  })) || [],
78
78
  onClick: function onClick(e) {
79
- var _moreActions$e$key;
80
- (_moreActions$e$key = moreActions[e.key]) === null || _moreActions$e$key === void 0 || _moreActions$e$key.onClick(record, index);
79
+ var _moreActions$e$key, _moreActions$e$key$on;
80
+ (_moreActions$e$key = moreActions[e.key]) === null || _moreActions$e$key === void 0 || (_moreActions$e$key$on = _moreActions$e$key.onClick) === null || _moreActions$e$key$on === void 0 || _moreActions$e$key$on.call(_moreActions$e$key, record, index);
81
81
  }
82
82
  },
83
83
  children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("a", {
@@ -14,30 +14,33 @@ function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e
14
14
  var genVtxStyle = function genVtxStyle(token) {
15
15
  var componentCls = token.componentCls,
16
16
  antCls = token.antCls;
17
- return _defineProperty({}, componentCls, _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({
17
+ return _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, componentCls, _defineProperty({
18
18
  position: 'relative',
19
- overflow: 'hidden'
20
- }, "".concat(antCls, "-table-wrapper"), _defineProperty(_defineProperty(_defineProperty({}, '.ant-spin', _defineProperty({
19
+ // overflow: 'hidden',
20
+ display: 'flex',
21
+ flexDirection: 'column'
22
+ }, "".concat(antCls, "-table-wrapper"), _defineProperty(_defineProperty(_defineProperty(_defineProperty({}, "table", {
23
+ // minWidth: "calc(100% - 2px) !important"
24
+ }), '.ant-spin', _defineProperty({
21
25
  height: '100%'
22
26
  }, '.ant-spin-container', _defineProperty({
23
- height: '100%'
24
- }, '.ant-table', {
27
+ height: '100%',
28
+ display: 'flex',
29
+ flexDirection: 'column'
30
+ }, '.ant-table', _defineProperty({
25
31
  // height: '100%',
26
- // ['.ant-table-container']: {
32
+ flex: 1
33
+ }, '.ant-table-container', _defineProperty(_defineProperty({}, '.ant-table-body', {
34
+ scrollbarWidth: "thin"
35
+ }), '.ant-table-content', _defineProperty({}, 'table', {
27
36
  // height: '100%',
28
- // ['.ant-table-content']: {
29
- // height: '100%',
30
- // ['table']: {
31
- // height: '100%',
32
- // }
33
- // }
34
- // }
35
- }))), '.ant-table', _defineProperty(_defineProperty(_defineProperty({}, '.ant-table-header', _defineProperty({}, '.ant-table-thead', {
37
+ // minWidth: "calc(100% - 1px) !important",
38
+ })))))), '.ant-table', _defineProperty(_defineProperty(_defineProperty({}, '.ant-table-header', _defineProperty({}, '.ant-table-thead', {
36
39
  '>tr>th': {
37
40
  background: token.colorBgContainer
38
41
  }
39
42
  })), '.ant-table-cell', {
40
- minWidth: 20
43
+ // minWidth: 10,
41
44
  }), '.ant-table-tbody', {
42
45
  '>tr.ant-table-placeholder': {
43
46
  position: 'absolute',
@@ -68,9 +71,9 @@ var genVtxStyle = function genVtxStyle(token) {
68
71
  }
69
72
  })), '.ant-pagination', _defineProperty({}, '.ant-pagination-item', {
70
73
  borderRadius: token.borderRadiusSM
71
- }))), "&-fit", {
74
+ })))), "".concat(componentCls, "-fit"), {
72
75
  height: '100%'
73
- }), "&-noFit", {}), "&-no-border", _defineProperty({}, "".concat(antCls, "-table-wrapper"), _defineProperty({}, "".concat(antCls, "-table"), _defineProperty({}, '>.ant-table-container', _defineProperty(_defineProperty({
76
+ }), "".concat(componentCls, "-noFit"), {}), "".concat(componentCls, "-no-border"), _defineProperty({}, "".concat(antCls, "-table-wrapper"), _defineProperty({}, "".concat(antCls, "-table"), _defineProperty({}, '>.ant-table-container', _defineProperty(_defineProperty({
74
77
  borderColor: 'transparent'
75
78
  }, '.ant-table-thead', {
76
79
  '>tr>th': {
@@ -84,7 +87,7 @@ var genVtxStyle = function genVtxStyle(token) {
84
87
  borderInlineColor: 'transparent !important',
85
88
  borderBottomColor: 'transparent !important'
86
89
  }
87
- }))))), "&.vtx-datagrid-striped", _defineProperty({}, "".concat(antCls, "-table-wrapper"), _defineProperty({}, "".concat(antCls, "-table"), _defineProperty({}, '>.ant-table-container', _defineProperty({}, '.ant-table-body', {
90
+ }))))), "".concat(componentCls, "-striped"), _defineProperty({}, "".concat(antCls, "-table-wrapper"), _defineProperty({}, "".concat(antCls, "-table"), _defineProperty({}, '>.ant-table-container', _defineProperty({}, '.ant-table-body', {
88
91
  '>table >tbody>tr:nth-child(odd)>td': {
89
92
  backgroundColor: token.colorBgLayoutTable,
90
93
  '&.ant-table-cell-row-hover': {
@@ -100,11 +103,11 @@ var genVtxStyle = function genVtxStyle(token) {
100
103
  backgroundColor: token.controlItemBgActiveHover
101
104
  }
102
105
  }
103
- }))))), "&.vtx-datagrid-header-background", _defineProperty({}, "".concat(antCls, "-table-wrapper"), _defineProperty({}, '.ant-table', _defineProperty({}, '.ant-table-header', _defineProperty({}, '.ant-table-thead', {
106
+ }))))), "".concat(componentCls, "-header-background"), _defineProperty({}, "".concat(antCls, "-table-wrapper"), _defineProperty({}, '.ant-table', _defineProperty({}, '.ant-table-header', _defineProperty({}, '.ant-table-thead', {
104
107
  '>tr>th': {
105
108
  background: token.colorBgLayoutTable
106
109
  }
107
- }))))));
110
+ })))));
108
111
  };
109
112
  function useStyle(prefix) {
110
113
  return (0, _vtxProvider.useStyle)(prefix, function (token) {
@@ -16,7 +16,9 @@ var genVtxEllipsisTextStyle = function genVtxEllipsisTextStyle(token) {
16
16
  return _defineProperty({}, componentCls, _defineProperty(_defineProperty({
17
17
  margin: 0,
18
18
  overflow: 'hidden',
19
- textOverflow: 'ellipsis'
19
+ textOverflow: 'ellipsis',
20
+ wordBreak: "break-all",
21
+ wordWrap: "break-word"
20
22
  }, "&--single", {
21
23
  whiteSpace: 'nowrap'
22
24
  }), "&--multi", {
@@ -16,6 +16,7 @@ var genVtxSplitPaneStyle = function genVtxSplitPaneStyle(token) {
16
16
  return _defineProperty({}, componentCls, {
17
17
  height: '100%',
18
18
  overflow: 'hidden',
19
+ backgroundColor: token.colorBgLayout,
19
20
  '.ant-splitter-bar .ant-splitter-bar-dragger::before': {
20
21
  background: 'transparent'
21
22
  },
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@vtx/components",
3
- "version": "4.0.0-beta.35",
3
+ "version": "4.0.0-beta.36",
4
4
  "description": "React components for Vortex",
5
5
  "keywords": [
6
6
  "react",
@@ -155,7 +155,7 @@
155
155
  "@vitest/coverage-istanbul": "^3.2.4",
156
156
  "@vitest/ui": "^3.2.4",
157
157
  "animated-scroll-to": "^2.3.2",
158
- "antd": "^6.3.1",
158
+ "antd": "^6.3.3",
159
159
  "chalk": "^4.1.2",
160
160
  "copy-to-clipboard": "^3.3.3",
161
161
  "cross-env": "^7.0.3",