@arim-aisdc/public-components 2.3.83 → 2.3.85

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.
@@ -81,6 +81,9 @@ var VirtualRow = function VirtualRow(_ref) {
81
81
  var timerRef = useRef();
82
82
  var clickCountRef = useRef(0);
83
83
 
84
+ // 拖拽时的鼠标位置跟踪
85
+ var dragStartPosRef = useRef(null);
86
+
84
87
  // 优化:使用useMemo缓存计算结果
85
88
  var dropPreviewLineClassName = useMemo(function () {
86
89
  if (hoverRowIndex === row.index) {
@@ -114,7 +117,7 @@ var VirtualRow = function VirtualRow(_ref) {
114
117
  return row.getVisibleCells();
115
118
  }, [row, table.getState().columnVisibility]);
116
119
 
117
- // 拖拽相关逻辑保持不变
120
+ // 拖拽相关逻辑
118
121
  var _useDrop = useDrop({
119
122
  accept: 'TABLE_ROW',
120
123
  drop: function drop(formDatas) {
@@ -125,7 +128,9 @@ var VirtualRow = function VirtualRow(_ref) {
125
128
  });
126
129
  },
127
130
  hover: function hover(item, monitor) {
128
- if (monitor.isOver() && monitor.canDrop()) {
131
+ var clientOffset = monitor.getClientOffset();
132
+ if (clientOffset && monitor.isOver() && monitor.canDrop()) {
133
+ // 在hover时传递鼠标位置,触发滚动
129
134
  changeHoverRow({
130
135
  target: row,
131
136
  origin: item
@@ -149,14 +154,30 @@ var VirtualRow = function VirtualRow(_ref) {
149
154
  return row.index;
150
155
  });
151
156
  var isMultipleDrag = selectedRowsNumber > 1 && selectedRowsIndexList.includes(row.index);
157
+
158
+ // 记录拖拽开始时的位置
159
+ dragStartPosRef.current = {
160
+ x: 0,
161
+ y: 0
162
+ };
152
163
  return {
153
164
  draggedRow: row,
154
165
  isMultipleDrag: isMultipleDrag,
155
166
  draggedRows: isMultipleDrag ? selectedRows : [row],
156
- sourceTableId: tableId
167
+ sourceTableId: tableId,
168
+ dragStartTime: Date.now()
157
169
  };
158
170
  },
159
- type: 'TABLE_ROW'
171
+ type: 'TABLE_ROW',
172
+ end: function end(item, monitor) {
173
+ // 拖拽结束时的清理
174
+ dragStartPosRef.current = null;
175
+ var didDrop = monitor.didDrop();
176
+ if (!didDrop) {
177
+ // 拖拽取消时的处理
178
+ console.log('Drag cancelled');
179
+ }
180
+ }
160
181
  }),
161
182
  _useDrag2 = _slicedToArray(_useDrag, 3),
162
183
  isDragging = _useDrag2[0].isDragging,
@@ -168,17 +189,17 @@ var VirtualRow = function VirtualRow(_ref) {
168
189
  captureDraggingState: true
169
190
  });
170
191
  }
171
- }, [canRowDrag]);
192
+ }, [canRowDrag, preview]);
172
193
  useEffect(function () {
173
194
  if (setSelectedRowDragging && row.getIsSelected()) {
174
195
  setSelectedRowDragging(isDragging);
175
196
  }
176
- }, [isDragging, row.getIsSelected()]);
197
+ }, [isDragging, row.getIsSelected(), setSelectedRowDragging]);
177
198
  useUpdateEffect(function () {
178
199
  if (!isDragging) {
179
200
  clearHoverRowIndex();
180
201
  }
181
- }, [isDragging]);
202
+ }, [isDragging, clearHoverRowIndex]);
182
203
  var handleCellRightClick = useCallback(function (e, cell) {
183
204
  onCellContextMenu(e, cell);
184
205
  }, [onCellContextMenu]);
@@ -203,7 +224,7 @@ var VirtualRow = function VirtualRow(_ref) {
203
224
  return baseStyle;
204
225
  }, [isDragging, selectedRowDragging, row.getIsSelected(), canRowDrag, editting, disableDragRowIds, row.id, rowStyle, virtualRowStart]);
205
226
 
206
- // 点击事件处理逻辑保持不变
227
+ // 点击事件处理逻辑
207
228
  var handleRowClick = useCallback(function (evt) {
208
229
  clickCountRef.current++;
209
230
  if (clickCountRef.current === 1) {
@@ -225,7 +246,7 @@ var VirtualRow = function VirtualRow(_ref) {
225
246
  timerRef.current = undefined;
226
247
  }
227
248
  }
228
- }, [row, table, canSelection, selectionWithoutChecked, setRowHighLightId, setRowSelectedId, selectedRowChange, onSelectChange, selectRowWhenClick, editting, onRowMouseClick, onRowMouseDoubleClick, canEditRowWhenDClick, handleEditRowWhenDClick, table.getState().columnSizing]);
249
+ }, [row, table, canSelection, selectionWithoutChecked, setRowHighLightId, setRowSelectedId, selectedRowChange, onSelectChange, selectRowWhenClick, editting, onRowMouseClick, onRowMouseDoubleClick, canEditRowWhenDClick, handleEditRowWhenDClick]);
229
250
  var handleSingleClick = useCallback(function (evt) {
230
251
  onRowMouseClick === null || onRowMouseClick === void 0 || onRowMouseClick(row);
231
252
  if (!row.getCanSelect()) {
@@ -240,7 +261,7 @@ var VirtualRow = function VirtualRow(_ref) {
240
261
  } else {
241
262
  handleSingleSelection(evt);
242
263
  }
243
- }, [row, canSelection, selectRowWhenClick, setRowHighLightId]);
264
+ }, [row, canSelection, selectRowWhenClick, setRowHighLightId, onRowMouseClick]);
244
265
  var handleDoubleClick = useCallback(function (evt) {
245
266
  onRowMouseDoubleClick === null || onRowMouseDoubleClick === void 0 || onRowMouseDoubleClick(row);
246
267
  if (canEditRowWhenDClick) {
@@ -248,10 +269,70 @@ var VirtualRow = function VirtualRow(_ref) {
248
269
  }
249
270
  }, [row, onRowMouseDoubleClick, canEditRowWhenDClick, handleEditRowWhenDClick]);
250
271
 
251
- // 其他事件处理函数保持不变...
272
+ // 选择点击处理
252
273
  var handleSelectionClick = useCallback(function (evt) {
253
- // ... 选择逻辑保持不变
274
+ if (selectionWithoutChecked) {
275
+ if (evt.ctrlKey) {
276
+ handleCtrlSelection();
277
+ } else if (evt.shiftKey) {
278
+ handleShiftSelection();
279
+ } else {
280
+ handleSingleRowSelection();
281
+ }
282
+ } else {
283
+ if (evt.shiftKey) {
284
+ handleShiftSelectionWithCheckbox();
285
+ } else {
286
+ handleToggleSelection();
287
+ }
288
+ }
254
289
  }, [row, table, selectionWithoutChecked]);
290
+ var handleCtrlSelection = useCallback(function () {
291
+ var selectionConfig = _objectSpread({}, table.getState().rowSelection);
292
+ if (!row.getIsSelected()) {
293
+ selectionConfig[row.id] = true;
294
+ } else if (Object.keys(selectionConfig).length > 1) {
295
+ delete selectionConfig[row.id];
296
+ }
297
+ // setRowSelection({ ...selectionConfig });
298
+ }, [row, table]);
299
+ var handleShiftSelection = useCallback(function () {
300
+ var min = Math.min(initselectedIndex || 0, row.index);
301
+ var max = Math.max(initselectedIndex || 0, row.index);
302
+ var selectionConfig = {};
303
+ table.getRowModel().rows.filter(function (row) {
304
+ return row.index >= min && row.index <= max;
305
+ }).forEach(function (row) {
306
+ selectionConfig[row.id] = true;
307
+ });
308
+
309
+ // setRowSelection(selectionConfig);
310
+ }, [row, table]);
311
+ var handleSingleRowSelection = useCallback(function () {
312
+ initselectedIndex = row.index;
313
+ // setRowSelection({ [row?.id]: true });
314
+ }, [row, table]);
315
+ var handleShiftSelectionWithCheckbox = useCallback(function () {
316
+ var selectionConfig = _objectSpread({}, table.getState().rowSelection);
317
+ var min = Math.min(initselectedIndex || 0, row.index);
318
+ var max = Math.max(initselectedIndex || 0, row.index);
319
+ table.getRowModel().rows.filter(function (row) {
320
+ return row.index >= min && row.index <= max;
321
+ }).forEach(function (row) {
322
+ selectionConfig[row.id] = true;
323
+ });
324
+
325
+ // setRowSelection(selectionConfig);
326
+ }, [row, table]);
327
+ var handleToggleSelection = useCallback(function () {
328
+ if (!row.getIsSelected()) {
329
+ initselectedIndex = row.index;
330
+ }
331
+ var selectionConfig = _objectSpread(_objectSpread({}, table.getState().rowSelection), {}, _defineProperty({}, row.id, !row.getIsSelected()));
332
+ if (row.getCanSelect()) {
333
+ // setRowSelection(selectionConfig);
334
+ }
335
+ }, [row, table]);
255
336
  var handleSingleSelection = useCallback(function (evt) {
256
337
  setRowSelectedId === null || setRowSelectedId === void 0 || setRowSelectedId(row === null || row === void 0 ? void 0 : row.id);
257
338
  selectedRowChange === null || selectedRowChange === void 0 || selectedRowChange(row);
@@ -371,9 +452,7 @@ var VirtualRow = function VirtualRow(_ref) {
371
452
  console.error('Error rendering row:', error);
372
453
  return null;
373
454
  }
374
- }, [
375
- // 依赖项保持不变
376
- row, row.id, rowEditing, tableId, editting, canRowDrag, disableDragRowIds, isDragging, selectedRowDragging, rowStyle, handleRowClick, rowMouseEnter, rowMouseLeave, rowClassNames, cellClassName, theme, table, handleCellRightClick, getCellProps, tableTooltip, onEditValueChange, dateFormat, row.getVisibleCells(), row.getIsSelected(), rowStyles, table.getState().columnSizing, row.getIsExpanded(), table.getExpandedRowModel()]);
455
+ }, [row, row.id, rowEditing, tableId, editting, canRowDrag, disableDragRowIds, isDragging, selectedRowDragging, rowStyle, handleRowClick, rowMouseEnter, rowMouseLeave, rowClassNames, cellClassName, theme, table, handleCellRightClick, getCellProps, tableTooltip, onEditValueChange, dateFormat, rowStyles, row.getVisibleCells(), row.getIsSelected(), row.getIsExpanded(), table.getState().columnSizing]);
377
456
  var rowCom = function rowCom() {
378
457
  var renderCell = function renderCell(cell) {
379
458
  var _cellClassName2;
@@ -0,0 +1,62 @@
1
+ import { DropSide, OnSelectChangeType } from "../type";
2
+ import { Table } from '@tanstack/react-table';
3
+ import React, { Dispatch, ReactNode, SetStateAction } from 'react';
4
+ import './index.less';
5
+ type IRowProps = {
6
+ table: Table<any>;
7
+ tableId: string;
8
+ row: any;
9
+ rowSelectedId?: string;
10
+ setRowSelectedId?: Dispatch<SetStateAction<string | undefined>>;
11
+ rowHighLightId: string;
12
+ setRowHighLightId?: Dispatch<SetStateAction<string | undefined>>;
13
+ selectedRowChange?: (row: any) => void;
14
+ onSelectChange?: OnSelectChangeType;
15
+ tableBodyRef: any;
16
+ canSelection?: boolean;
17
+ selectionWithoutChecked?: boolean;
18
+ reorderRow?: (targetRowIndex: any, draggedRowIndex: any) => void;
19
+ canRowDrag?: boolean;
20
+ rowClassName?: (row: any) => string[];
21
+ cellClassName?: (cell: any) => string[];
22
+ rowStyle?: object;
23
+ getCellProps?: (ctx: any) => object;
24
+ editting?: boolean;
25
+ rowEditing?: boolean;
26
+ renderSubComponent?: (value: {
27
+ row: any;
28
+ }) => ReactNode;
29
+ selectedRowDragging?: boolean;
30
+ setSelectedRowDragging?: Dispatch<SetStateAction<boolean>>;
31
+ onRowMouseEnter?: (row: any) => void;
32
+ onRowMouseLeave?: (row: any) => void;
33
+ onRowMouseClick?: (row: any) => void;
34
+ onRowMouseDoubleClick?: (row: any) => void;
35
+ disableDragRowIds?: any[];
36
+ selectRowWhenClick: boolean;
37
+ handleEditRowWhenDClick: (row: any) => void;
38
+ canEditRowWhenDClick: boolean;
39
+ theme: string;
40
+ dragBeforeStart?: (datas: any) => boolean;
41
+ rowKey?: string;
42
+ onCellContextMenu: (e: React.MouseEvent, cell: any) => void;
43
+ /**获取行hover时的tip信息 */
44
+ getRowHoverTipConfig?: (row: any) => {
45
+ title: string;
46
+ color: string;
47
+ };
48
+ tableTooltip: boolean;
49
+ changeHoverRow: (params: {
50
+ target?: any;
51
+ origin?: any;
52
+ }) => void;
53
+ clearHoverRowIndex: () => void;
54
+ hoverRowIndex: number;
55
+ dropSide: DropSide;
56
+ onEditValueChange?: (field: string, value: any, extra?: any) => void;
57
+ setRowSelection?: Function;
58
+ openMemo?: boolean;
59
+ virtualRowStart?: number;
60
+ };
61
+ declare const VirtualRow: ({ tableBodyRef, table, tableId, row, rowSelectedId, setRowSelectedId, rowHighLightId, setRowHighLightId, selectedRowChange, onSelectChange, canSelection, selectionWithoutChecked, reorderRow, canRowDrag, rowClassName, cellClassName, rowStyle, getCellProps, editting, rowEditing, renderSubComponent, selectedRowDragging, setSelectedRowDragging, onRowMouseEnter, onRowMouseLeave, onRowMouseClick, onRowMouseDoubleClick, disableDragRowIds, selectRowWhenClick, handleEditRowWhenDClick, canEditRowWhenDClick, theme, dragBeforeStart, onCellContextMenu, getRowHoverTipConfig, tableTooltip, changeHoverRow, clearHoverRowIndex, hoverRowIndex, dropSide, onEditValueChange, setRowSelection, openMemo, virtualRowStart, }: IRowProps) => import("react/jsx-runtime").JSX.Element;
62
+ export { VirtualRow };
@@ -0,0 +1,560 @@
1
+ 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); }
2
+ function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
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
+ function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
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); }
11
+ function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
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."); }
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); }
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; }
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; } }
16
+ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
17
+ import { DropSide } from "../type";
18
+ import { flexRender } from '@tanstack/react-table';
19
+ import { useUpdateEffect } from 'ahooks';
20
+ import { Tooltip } from 'antd';
21
+ import React, { useEffect, useMemo, useRef, useState, useCallback } from 'react';
22
+ import { useDrag, useDrop } from 'react-dnd';
23
+ import { getEmptyImage } from 'react-dnd-html5-backend';
24
+ import { getPinningStyle } from "../TableHeader/utils";
25
+ import { EditableCell } from "../components/ColumnEdit";
26
+ import "./index.less";
27
+ import dayjs from 'dayjs';
28
+ import { useConfig } from "../../ConfigProvider";
29
+ import { jsx as _jsx } from "react/jsx-runtime";
30
+ import { Fragment as _Fragment } from "react/jsx-runtime";
31
+ import { jsxs as _jsxs } from "react/jsx-runtime";
32
+ var initselectedIndex;
33
+ var VirtualRow = function VirtualRow(_ref) {
34
+ var _tableBodyRef$current, _tableBodyRef$current2;
35
+ var tableBodyRef = _ref.tableBodyRef,
36
+ table = _ref.table,
37
+ tableId = _ref.tableId,
38
+ row = _ref.row,
39
+ rowSelectedId = _ref.rowSelectedId,
40
+ setRowSelectedId = _ref.setRowSelectedId,
41
+ rowHighLightId = _ref.rowHighLightId,
42
+ setRowHighLightId = _ref.setRowHighLightId,
43
+ selectedRowChange = _ref.selectedRowChange,
44
+ onSelectChange = _ref.onSelectChange,
45
+ canSelection = _ref.canSelection,
46
+ selectionWithoutChecked = _ref.selectionWithoutChecked,
47
+ reorderRow = _ref.reorderRow,
48
+ canRowDrag = _ref.canRowDrag,
49
+ rowClassName = _ref.rowClassName,
50
+ cellClassName = _ref.cellClassName,
51
+ rowStyle = _ref.rowStyle,
52
+ getCellProps = _ref.getCellProps,
53
+ editting = _ref.editting,
54
+ rowEditing = _ref.rowEditing,
55
+ renderSubComponent = _ref.renderSubComponent,
56
+ selectedRowDragging = _ref.selectedRowDragging,
57
+ setSelectedRowDragging = _ref.setSelectedRowDragging,
58
+ onRowMouseEnter = _ref.onRowMouseEnter,
59
+ onRowMouseLeave = _ref.onRowMouseLeave,
60
+ onRowMouseClick = _ref.onRowMouseClick,
61
+ onRowMouseDoubleClick = _ref.onRowMouseDoubleClick,
62
+ disableDragRowIds = _ref.disableDragRowIds,
63
+ selectRowWhenClick = _ref.selectRowWhenClick,
64
+ handleEditRowWhenDClick = _ref.handleEditRowWhenDClick,
65
+ canEditRowWhenDClick = _ref.canEditRowWhenDClick,
66
+ theme = _ref.theme,
67
+ dragBeforeStart = _ref.dragBeforeStart,
68
+ onCellContextMenu = _ref.onCellContextMenu,
69
+ getRowHoverTipConfig = _ref.getRowHoverTipConfig,
70
+ tableTooltip = _ref.tableTooltip,
71
+ changeHoverRow = _ref.changeHoverRow,
72
+ clearHoverRowIndex = _ref.clearHoverRowIndex,
73
+ hoverRowIndex = _ref.hoverRowIndex,
74
+ dropSide = _ref.dropSide,
75
+ onEditValueChange = _ref.onEditValueChange,
76
+ setRowSelection = _ref.setRowSelection,
77
+ openMemo = _ref.openMemo,
78
+ virtualRowStart = _ref.virtualRowStart;
79
+ var _useConfig = useConfig(),
80
+ dateFormat = _useConfig.dateFormat;
81
+ var timerRef = useRef();
82
+ var clickCountRef = useRef(0);
83
+
84
+ // 拖拽时的鼠标位置跟踪
85
+ var dragStartPosRef = useRef(null);
86
+
87
+ // 优化:使用useMemo缓存计算结果
88
+ var dropPreviewLineClassName = useMemo(function () {
89
+ if (hoverRowIndex === row.index) {
90
+ return dropSide === DropSide.Top ? 'showTopBorder' : 'showBottomBorder';
91
+ }
92
+ return '';
93
+ }, [hoverRowIndex, dropSide, row.index]);
94
+ var highLightClassName = useMemo(function () {
95
+ if (!canSelection && String(row.id) === String(rowSelectedId)) {
96
+ return 'tbody-tr-highlight';
97
+ } else if (canSelection) {
98
+ if (String(row.id) === String(rowHighLightId)) {
99
+ return 'tbody-tr-highlight';
100
+ } else if (row.getIsSelected()) {
101
+ return 'tbody-tr-selected';
102
+ }
103
+ }
104
+ return '';
105
+ }, [row.id, row.getIsSelected(), rowSelectedId, rowHighLightId, canSelection]);
106
+ var rowClassNames = useMemo(function () {
107
+ var _rowClassName;
108
+ var baseClass = "tbody-tr ".concat(highLightClassName, " ").concat(dropPreviewLineClassName);
109
+ var customClasses = (rowClassName === null || rowClassName === void 0 || (_rowClassName = rowClassName(row)) === null || _rowClassName === void 0 ? void 0 : _rowClassName.map(function (item) {
110
+ return "".concat(item, "-").concat(theme);
111
+ }).join(' ')) || '';
112
+ return "".concat(baseClass, " ").concat(customClasses).trim();
113
+ }, [highLightClassName, dropPreviewLineClassName, rowClassName, row, theme]);
114
+
115
+ // 获取所有可见单元格
116
+ var visibleCells = useMemo(function () {
117
+ return row.getVisibleCells();
118
+ }, [row, table.getState().columnVisibility]);
119
+
120
+ // 拖拽相关逻辑
121
+ var _useDrop = useDrop({
122
+ accept: 'TABLE_ROW',
123
+ drop: function drop(formDatas) {
124
+ clearHoverRowIndex();
125
+ return reorderRow === null || reorderRow === void 0 ? void 0 : reorderRow(formDatas, {
126
+ hoverRow: row,
127
+ targetTableId: tableId
128
+ });
129
+ },
130
+ hover: function hover(item, monitor) {
131
+ var clientOffset = monitor.getClientOffset();
132
+ if (clientOffset && monitor.isOver() && monitor.canDrop()) {
133
+ // 在hover时传递鼠标位置,触发滚动
134
+ changeHoverRow({
135
+ target: row,
136
+ origin: item
137
+ });
138
+ }
139
+ }
140
+ }),
141
+ _useDrop2 = _slicedToArray(_useDrop, 2),
142
+ dropRef = _useDrop2[1];
143
+ var _useDrag = useDrag({
144
+ collect: function collect(monitor) {
145
+ return {
146
+ isDragging: monitor !== null && monitor !== void 0 && monitor.getItem() ? dragBeforeStart === null || dragBeforeStart === void 0 ? void 0 : dragBeforeStart(monitor === null || monitor === void 0 ? void 0 : monitor.getItem()) : monitor.isDragging()
147
+ };
148
+ },
149
+ item: function item() {
150
+ var _table$getSelectedRow;
151
+ var selectedRows = ((_table$getSelectedRow = table.getSelectedRowModel()) === null || _table$getSelectedRow === void 0 ? void 0 : _table$getSelectedRow.rows) || [];
152
+ var selectedRowsNumber = (selectedRows === null || selectedRows === void 0 ? void 0 : selectedRows.length) || 0;
153
+ var selectedRowsIndexList = selectedRows === null || selectedRows === void 0 ? void 0 : selectedRows.map(function (row) {
154
+ return row.index;
155
+ });
156
+ var isMultipleDrag = selectedRowsNumber > 1 && selectedRowsIndexList.includes(row.index);
157
+
158
+ // 记录拖拽开始时的位置
159
+ dragStartPosRef.current = {
160
+ x: 0,
161
+ y: 0
162
+ };
163
+ return {
164
+ draggedRow: row,
165
+ isMultipleDrag: isMultipleDrag,
166
+ draggedRows: isMultipleDrag ? selectedRows : [row],
167
+ sourceTableId: tableId,
168
+ dragStartTime: Date.now()
169
+ };
170
+ },
171
+ type: 'TABLE_ROW',
172
+ end: function end(item, monitor) {
173
+ // 拖拽结束时的清理
174
+ dragStartPosRef.current = null;
175
+ var didDrop = monitor.didDrop();
176
+ if (!didDrop) {
177
+ // 拖拽取消时的处理
178
+ console.log('Drag cancelled');
179
+ }
180
+ }
181
+ }),
182
+ _useDrag2 = _slicedToArray(_useDrag, 3),
183
+ isDragging = _useDrag2[0].isDragging,
184
+ dragRef = _useDrag2[1],
185
+ preview = _useDrag2[2];
186
+ useEffect(function () {
187
+ if (canRowDrag) {
188
+ preview(getEmptyImage(), {
189
+ captureDraggingState: true
190
+ });
191
+ }
192
+ }, [canRowDrag, preview]);
193
+ useEffect(function () {
194
+ if (setSelectedRowDragging && row.getIsSelected()) {
195
+ setSelectedRowDragging(isDragging);
196
+ }
197
+ }, [isDragging, row.getIsSelected(), setSelectedRowDragging]);
198
+ useUpdateEffect(function () {
199
+ if (!isDragging) {
200
+ clearHoverRowIndex();
201
+ }
202
+ }, [isDragging, clearHoverRowIndex]);
203
+ var handleCellRightClick = useCallback(function (e, cell) {
204
+ onCellContextMenu(e, cell);
205
+ }, [onCellContextMenu]);
206
+
207
+ // 行样式(支持虚拟行定位)
208
+ var rowStyles = useMemo(function () {
209
+ var baseStyle = _objectSpread({
210
+ opacity: isDragging || selectedRowDragging && row.getIsSelected() ? 0.5 : 1,
211
+ cursor: canRowDrag && !editting && !(disableDragRowIds !== null && disableDragRowIds !== void 0 && disableDragRowIds.includes(row.id)) ? 'move' : 'auto'
212
+ }, rowStyle);
213
+
214
+ // 如果是虚拟行,添加定位样式
215
+ if (virtualRowStart !== undefined) {
216
+ return _objectSpread(_objectSpread({}, baseStyle), {}, {
217
+ position: 'absolute',
218
+ top: 0,
219
+ left: 0,
220
+ width: '100%',
221
+ transform: "translateY(".concat(virtualRowStart, "px)")
222
+ });
223
+ }
224
+ return baseStyle;
225
+ }, [isDragging, selectedRowDragging, row.getIsSelected(), canRowDrag, editting, disableDragRowIds, row.id, rowStyle, virtualRowStart]);
226
+
227
+ // 点击事件处理逻辑
228
+ var handleRowClick = useCallback(function (evt) {
229
+ clickCountRef.current++;
230
+ if (clickCountRef.current === 1) {
231
+ timerRef.current = setTimeout(function () {
232
+ if (clickCountRef.current === 1) {
233
+ handleSingleClick(evt);
234
+ }
235
+ clickCountRef.current = 0;
236
+ if (timerRef.current) {
237
+ clearTimeout(timerRef.current);
238
+ timerRef.current = undefined;
239
+ }
240
+ }, 200);
241
+ } else if (clickCountRef.current === 2) {
242
+ handleDoubleClick(evt);
243
+ clickCountRef.current = 0;
244
+ if (timerRef.current) {
245
+ clearTimeout(timerRef.current);
246
+ timerRef.current = undefined;
247
+ }
248
+ }
249
+ }, [row, table, canSelection, selectionWithoutChecked, setRowHighLightId, setRowSelectedId, selectedRowChange, onSelectChange, selectRowWhenClick, editting, onRowMouseClick, onRowMouseDoubleClick, canEditRowWhenDClick, handleEditRowWhenDClick]);
250
+ var handleSingleClick = useCallback(function (evt) {
251
+ onRowMouseClick === null || onRowMouseClick === void 0 || onRowMouseClick(row);
252
+ if (!row.getCanSelect()) {
253
+ return;
254
+ }
255
+ if (canSelection && !selectRowWhenClick) {
256
+ setRowHighLightId === null || setRowHighLightId === void 0 || setRowHighLightId(row.id);
257
+ return;
258
+ }
259
+ if (canSelection) {
260
+ handleSelectionClick(evt);
261
+ } else {
262
+ handleSingleSelection(evt);
263
+ }
264
+ }, [row, canSelection, selectRowWhenClick, setRowHighLightId, onRowMouseClick]);
265
+ var handleDoubleClick = useCallback(function (evt) {
266
+ onRowMouseDoubleClick === null || onRowMouseDoubleClick === void 0 || onRowMouseDoubleClick(row);
267
+ if (canEditRowWhenDClick) {
268
+ handleEditRowWhenDClick(row);
269
+ }
270
+ }, [row, onRowMouseDoubleClick, canEditRowWhenDClick, handleEditRowWhenDClick]);
271
+
272
+ // 选择点击处理
273
+ var handleSelectionClick = useCallback(function (evt) {
274
+ if (selectionWithoutChecked) {
275
+ if (evt.ctrlKey) {
276
+ handleCtrlSelection();
277
+ } else if (evt.shiftKey) {
278
+ handleShiftSelection();
279
+ } else {
280
+ handleSingleRowSelection();
281
+ }
282
+ } else {
283
+ if (evt.shiftKey) {
284
+ handleShiftSelectionWithCheckbox();
285
+ } else {
286
+ handleToggleSelection();
287
+ }
288
+ }
289
+ }, [row, table, selectionWithoutChecked]);
290
+ var handleCtrlSelection = useCallback(function () {
291
+ var selectionConfig = _objectSpread({}, table.getState().rowSelection);
292
+ if (!row.getIsSelected()) {
293
+ selectionConfig[row.id] = true;
294
+ } else if (Object.keys(selectionConfig).length > 1) {
295
+ delete selectionConfig[row.id];
296
+ }
297
+ // setRowSelection({ ...selectionConfig });
298
+ }, [row, table]);
299
+ var handleShiftSelection = useCallback(function () {
300
+ var min = Math.min(initselectedIndex || 0, row.index);
301
+ var max = Math.max(initselectedIndex || 0, row.index);
302
+ var selectionConfig = {};
303
+ table.getRowModel().rows.filter(function (row) {
304
+ return row.index >= min && row.index <= max;
305
+ }).forEach(function (row) {
306
+ selectionConfig[row.id] = true;
307
+ });
308
+
309
+ // setRowSelection(selectionConfig);
310
+ }, [row, table]);
311
+ var handleSingleRowSelection = useCallback(function () {
312
+ initselectedIndex = row.index;
313
+ // setRowSelection({ [row?.id]: true });
314
+ }, [row, table]);
315
+ var handleShiftSelectionWithCheckbox = useCallback(function () {
316
+ var selectionConfig = _objectSpread({}, table.getState().rowSelection);
317
+ var min = Math.min(initselectedIndex || 0, row.index);
318
+ var max = Math.max(initselectedIndex || 0, row.index);
319
+ table.getRowModel().rows.filter(function (row) {
320
+ return row.index >= min && row.index <= max;
321
+ }).forEach(function (row) {
322
+ selectionConfig[row.id] = true;
323
+ });
324
+
325
+ // setRowSelection(selectionConfig);
326
+ }, [row, table]);
327
+ var handleToggleSelection = useCallback(function () {
328
+ if (!row.getIsSelected()) {
329
+ initselectedIndex = row.index;
330
+ }
331
+ var selectionConfig = _objectSpread(_objectSpread({}, table.getState().rowSelection), {}, _defineProperty({}, row.id, !row.getIsSelected()));
332
+ if (row.getCanSelect()) {
333
+ // setRowSelection(selectionConfig);
334
+ }
335
+ }, [row, table]);
336
+ var handleSingleSelection = useCallback(function (evt) {
337
+ setRowSelectedId === null || setRowSelectedId === void 0 || setRowSelectedId(row === null || row === void 0 ? void 0 : row.id);
338
+ selectedRowChange === null || selectedRowChange === void 0 || selectedRowChange(row);
339
+ onSelectChange === null || onSelectChange === void 0 || onSelectChange(row, row === null || row === void 0 ? void 0 : row.original, true, evt);
340
+ }, [row, setRowSelectedId, selectedRowChange, onSelectChange]);
341
+ var rowMouseEnter = useCallback(function () {
342
+ onRowMouseEnter === null || onRowMouseEnter === void 0 || onRowMouseEnter(row);
343
+ }, [row, onRowMouseEnter]);
344
+ var rowMouseLeave = useCallback(function () {
345
+ onRowMouseLeave === null || onRowMouseLeave === void 0 || onRowMouseLeave(row);
346
+ }, [row, onRowMouseLeave]);
347
+ var _useState = useState({
348
+ title: ' ',
349
+ color: ''
350
+ }),
351
+ _useState2 = _slicedToArray(_useState, 2),
352
+ tooltipConfig = _useState2[0],
353
+ setTooltipConfig = _useState2[1];
354
+ var onOpenChange = useCallback(function (open) {
355
+ if (open) {
356
+ setTooltipConfig((getRowHoverTipConfig === null || getRowHoverTipConfig === void 0 ? void 0 : getRowHoverTipConfig(row.original)) || {
357
+ title: ' ',
358
+ color: ''
359
+ });
360
+ }
361
+ }, [getRowHoverTipConfig, row.original]);
362
+
363
+ // 清理定时器
364
+ useEffect(function () {
365
+ return function () {
366
+ if (timerRef.current) {
367
+ clearTimeout(timerRef.current);
368
+ }
369
+ };
370
+ }, []);
371
+ var rowComMemo = useMemo(function () {
372
+ // 添加数据验证
373
+ if (!(row !== null && row !== void 0 && row.getVisibleCells)) {
374
+ console.warn('Row data not ready');
375
+ return null;
376
+ }
377
+ var renderCell = function renderCell(cell) {
378
+ var _cell$column, _cell$getValue, _cell$getValue2, _cellClassName;
379
+ // 确保 cell.column.columnDef 存在
380
+ if (!(cell !== null && cell !== void 0 && (_cell$column = cell.column) !== null && _cell$column !== void 0 && _cell$column.columnDef)) {
381
+ console.warn('Cell column definition missing', cell);
382
+ return null;
383
+ }
384
+ var _cell$column$columnDe = cell.column.columnDef,
385
+ columnEditable = _cell$column$columnDe.editable,
386
+ accessorKey = _cell$column$columnDe.accessorKey,
387
+ header = _cell$column$columnDe.header,
388
+ columnClassName = _cell$column$columnDe.columnClassName,
389
+ columnId = _cell$column$columnDe.id,
390
+ filterType = _cell$column$columnDe.filterType;
391
+
392
+ // 多重保障确保列ID不为undefined
393
+ var safeColumnId = columnId || accessorKey || (cell === null || cell === void 0 ? void 0 : cell.id) || "cell-".concat(Math.random().toString(36).slice(2, 9));
394
+ var columnEditing = rowEditing && columnEditable;
395
+ var rawValue = (_cell$getValue = (_cell$getValue2 = cell.getValue) === null || _cell$getValue2 === void 0 ? void 0 : _cell$getValue2.call(cell)) !== null && _cell$getValue !== void 0 ? _cell$getValue : '';
396
+
397
+ // 检查必要的函数是否存在
398
+ if (typeof cell.getContext !== 'function') {
399
+ console.warn('cell.getContext is not a function', cell);
400
+ return null;
401
+ }
402
+ var originalContext = cell.getContext();
403
+ var enhancedContext = _objectSpread(_objectSpread({}, originalContext), {}, {
404
+ getValue: function getValue() {
405
+ return rawValue;
406
+ },
407
+ getFormattedValue: function getFormattedValue() {
408
+ var _cell$column$columnDe2;
409
+ return isDateColumn(cell.column.columnDef) ? formatDate(rawValue, ((_cell$column$columnDe2 = cell.column.columnDef) === null || _cell$column$columnDe2 === void 0 || (_cell$column$columnDe2 = _cell$column$columnDe2.meta) === null || _cell$column$columnDe2 === void 0 ? void 0 : _cell$column$columnDe2.dateFormat) || dateFormat) : rawValue;
410
+ },
411
+ renderValue: function renderValue() {
412
+ return enhancedContext.getFormattedValue();
413
+ }
414
+ });
415
+ var cellClassNames = [columnEditing ? 'tbody-tr-td-editting' : '', columnClassName ? columnClassName.join(' ') : ''].concat(_toConsumableArray((cellClassName === null || cellClassName === void 0 || (_cellClassName = cellClassName(cell)) === null || _cellClassName === void 0 ? void 0 : _cellClassName.map(function (item) {
416
+ return "".concat(item, "-").concat(theme);
417
+ })) || []), ['tbody-tr-td']).filter(Boolean).join(' ');
418
+ return /*#__PURE__*/_jsx("td", _objectSpread(_objectSpread({
419
+ className: cellClassNames,
420
+ style: _objectSpread({}, getPinningStyle(cell, table, false)),
421
+ onContextMenu: function onContextMenu(e) {
422
+ return handleCellRightClick(e, cell);
423
+ }
424
+ }, getCellProps === null || getCellProps === void 0 ? void 0 : getCellProps(cell.getContext())), {}, {
425
+ children: EditableCell(_objectSpread(_objectSpread({}, cell.column.columnDef), {}, {
426
+ width: cell.column.getSize(),
427
+ tableTooltip: tableTooltip,
428
+ editing: columnEditing,
429
+ dataIndex: accessorKey,
430
+ title: header,
431
+ onEditValueChange: onEditValueChange,
432
+ children: flexRender(cell.column.columnDef.cell, enhancedContext)
433
+ }))
434
+ }), cell.id);
435
+ };
436
+ try {
437
+ var cells = row.getVisibleCells();
438
+ return /*#__PURE__*/_jsx("tr", {
439
+ id: rowEditing ? "".concat(tableId, "-tbody-tr-editing") : undefined,
440
+ ref: function ref(node) {
441
+ dropRef(node && !editting ? node : null);
442
+ dragRef(node && canRowDrag && !editting && !(disableDragRowIds !== null && disableDragRowIds !== void 0 && disableDragRowIds.includes(row.id)) ? node : null);
443
+ },
444
+ style: rowStyles,
445
+ onClick: handleRowClick,
446
+ onMouseEnter: rowMouseEnter,
447
+ onMouseLeave: rowMouseLeave,
448
+ className: rowClassNames,
449
+ children: cells.map(renderCell)
450
+ });
451
+ } catch (error) {
452
+ console.error('Error rendering row:', error);
453
+ return null;
454
+ }
455
+ }, [row, row.id, rowEditing, tableId, editting, canRowDrag, disableDragRowIds, isDragging, selectedRowDragging, rowStyle, handleRowClick, rowMouseEnter, rowMouseLeave, rowClassNames, cellClassName, theme, table, handleCellRightClick, getCellProps, tableTooltip, onEditValueChange, dateFormat, rowStyles]);
456
+ var rowCom = function rowCom() {
457
+ var renderCell = function renderCell(cell) {
458
+ var _cellClassName2;
459
+ var _cell$column$columnDe3 = cell.column.columnDef,
460
+ columnEditable = _cell$column$columnDe3.editable,
461
+ accessorKey = _cell$column$columnDe3.accessorKey,
462
+ header = _cell$column$columnDe3.header,
463
+ columnClassName = _cell$column$columnDe3.columnClassName,
464
+ id = _cell$column$columnDe3.id,
465
+ filterType = _cell$column$columnDe3.filterType;
466
+ var columnEditing = rowEditing && columnEditable;
467
+ var rawValue = cell.getValue();
468
+
469
+ // 创建增强上下文
470
+ var originalContext = cell.getContext();
471
+ var enhancedContext = _objectSpread(_objectSpread({}, originalContext), {}, {
472
+ getValue: function getValue() {
473
+ return rawValue;
474
+ },
475
+ getFormattedValue: function getFormattedValue() {
476
+ var _cell$column$columnDe4;
477
+ return isDateColumn(cell.column.columnDef) ? formatDate(rawValue, ((_cell$column$columnDe4 = cell.column.columnDef) === null || _cell$column$columnDe4 === void 0 || (_cell$column$columnDe4 = _cell$column$columnDe4.meta) === null || _cell$column$columnDe4 === void 0 ? void 0 : _cell$column$columnDe4.dateFormat) || dateFormat) : rawValue;
478
+ },
479
+ renderValue: function renderValue() {
480
+ return enhancedContext.getFormattedValue();
481
+ }
482
+ });
483
+ var cellClassNames = [columnEditing ? 'tbody-tr-td-editting' : '', columnClassName ? columnClassName.join(' ') : ''].concat(_toConsumableArray((cellClassName === null || cellClassName === void 0 || (_cellClassName2 = cellClassName(cell)) === null || _cellClassName2 === void 0 ? void 0 : _cellClassName2.map(function (item) {
484
+ return "".concat(item, "-").concat(theme);
485
+ })) || []), ['tbody-tr-td']).filter(Boolean).join(' ');
486
+ return /*#__PURE__*/_jsx("td", _objectSpread(_objectSpread({
487
+ className: cellClassNames,
488
+ style: _objectSpread({}, getPinningStyle(cell, table, false)),
489
+ onContextMenu: function onContextMenu(e) {
490
+ return handleCellRightClick(e, cell);
491
+ }
492
+ }, getCellProps === null || getCellProps === void 0 ? void 0 : getCellProps(cell.getContext())), {}, {
493
+ children: EditableCell(_objectSpread(_objectSpread({}, cell.column.columnDef), {}, {
494
+ width: cell.column.getSize(),
495
+ tableTooltip: tableTooltip,
496
+ editing: columnEditing,
497
+ dataIndex: accessorKey,
498
+ title: header,
499
+ onEditValueChange: onEditValueChange,
500
+ children: flexRender(cell.column.columnDef.cell, enhancedContext)
501
+ }))
502
+ }), cell.id);
503
+ };
504
+ return /*#__PURE__*/_jsx("tr", {
505
+ id: rowEditing ? "".concat(tableId, "-tbody-tr-editing") : undefined,
506
+ ref: function ref(node) {
507
+ dropRef(node && !editting ? node : null);
508
+ dragRef(node && canRowDrag && !editting && !(disableDragRowIds !== null && disableDragRowIds !== void 0 && disableDragRowIds.includes(row.id)) ? node : null);
509
+ },
510
+ style: rowStyles,
511
+ onClick: handleRowClick,
512
+ onMouseEnter: rowMouseEnter,
513
+ onMouseLeave: rowMouseLeave,
514
+ className: rowClassNames,
515
+ children: row.getVisibleCells().map(renderCell)
516
+ });
517
+ };
518
+ return /*#__PURE__*/_jsxs(_Fragment, {
519
+ children: [!!getRowHoverTipConfig ? /*#__PURE__*/_jsx(Tooltip, _objectSpread(_objectSpread({}, tooltipConfig), {}, {
520
+ onOpenChange: onOpenChange,
521
+ destroyTooltipOnHide: {
522
+ keepParent: false
523
+ },
524
+ overlayClassName: "table-max-row-tooltip-wrapper",
525
+ getPopupContainer: function getPopupContainer() {
526
+ return tableBodyRef.current || document.body;
527
+ },
528
+ children: openMemo ? rowComMemo : rowCom()
529
+ })) : openMemo ? rowComMemo : rowCom(), row.getIsExpanded() && /*#__PURE__*/_jsx("tr", {
530
+ className: "tbody-tr-subrow",
531
+ children: /*#__PURE__*/_jsx("td", {
532
+ colSpan: visibleCells.length,
533
+ style: {
534
+ padding: 0
535
+ },
536
+ children: !!(tableBodyRef !== null && tableBodyRef !== void 0 && (_tableBodyRef$current = tableBodyRef.current) !== null && _tableBodyRef$current !== void 0 && _tableBodyRef$current.clientWidth) && /*#__PURE__*/_jsx("div", {
537
+ id: "".concat(tableId, "_expand-table"),
538
+ className: "subRowWrapper",
539
+ style: {
540
+ width: "".concat(tableBodyRef === null || tableBodyRef === void 0 || (_tableBodyRef$current2 = tableBodyRef.current) === null || _tableBodyRef$current2 === void 0 ? void 0 : _tableBodyRef$current2.clientWidth, "px")
541
+ },
542
+ children: renderSubComponent && renderSubComponent({
543
+ row: row
544
+ })
545
+ })
546
+ })
547
+ })]
548
+ });
549
+ };
550
+ function formatDate(dateValue) {
551
+ var pattern = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : "YYYY-MM-DD HH:mm";
552
+ if (!dateValue) return '';
553
+ var date = dayjs(dateValue);
554
+ return date.isValid() ? date.format(pattern) : 'Invalid Date';
555
+ }
556
+ function isDateColumn(column) {
557
+ var _column$meta;
558
+ return (column === null || column === void 0 || (_column$meta = column.meta) === null || _column$meta === void 0 ? void 0 : _column$meta.isDate) || false;
559
+ }
560
+ export { VirtualRow };
@@ -15,7 +15,7 @@ import { useDrop } from 'react-dnd';
15
15
  import { CustomDragLayer } from "../components/CustomDragerLayer";
16
16
  import { DropSide } from "../type";
17
17
  import { events, useEventBus } from "../../..";
18
- import React, { useCallback, useMemo, useState } from 'react';
18
+ import React, { useCallback, useEffect, useMemo, useState, useRef } from 'react';
19
19
  import { createPortal } from 'react-dom';
20
20
  import { useConfig } from "../../ConfigProvider";
21
21
  import Empty from "../../Empty";
@@ -28,6 +28,162 @@ import { useVirtualCalculations } from "../hooks/useVirtualCalculations";
28
28
  import { jsx as _jsx } from "react/jsx-runtime";
29
29
  import { jsxs as _jsxs } from "react/jsx-runtime";
30
30
  import { Fragment as _Fragment } from "react/jsx-runtime";
31
+ // 自定义的拖拽自动滚动 Hook
32
+ var useDragAutoScroll = function useDragAutoScroll(tableBodyRef, tableContentRef, canRowDrag, rowVirtualizer, table) {
33
+ var autoScrollIntervalRef = useRef(null);
34
+ var lastScrollTimeRef = useRef(0);
35
+ var SCROLL_THROTTLE = 16; // ~60fps
36
+ var SCROLL_ZONE = 80; // 触发滚动的边缘区域
37
+
38
+ var scrollStep = useCallback(function (direction) {
39
+ if (!(tableBodyRef !== null && tableBodyRef !== void 0 && tableBodyRef.current)) return;
40
+ var container = tableBodyRef.current;
41
+ var now = Date.now();
42
+
43
+ // 节流控制
44
+ if (now - lastScrollTimeRef.current < SCROLL_THROTTLE) return;
45
+ var baseScrollAmount = 25;
46
+ var currentScrollTop = container.scrollTop;
47
+ var maxScroll = container.scrollHeight - container.clientHeight;
48
+
49
+ // 动态计算滚动速度:距离边缘越近,滚动越慢
50
+ var dynamicSpeed = baseScrollAmount;
51
+ if (direction > 0) {
52
+ // 向下滚动
53
+ var distanceToBottom = maxScroll - currentScrollTop;
54
+ if (distanceToBottom < 100) {
55
+ dynamicSpeed = Math.max(5, distanceToBottom * 0.3);
56
+ }
57
+ } else {
58
+ // 向上滚动
59
+ if (currentScrollTop < 100) {
60
+ dynamicSpeed = Math.max(5, currentScrollTop * 0.3);
61
+ }
62
+ }
63
+ if (direction > 0) {
64
+ // 向下滚动
65
+ var newScrollTop = Math.min(maxScroll, currentScrollTop + dynamicSpeed);
66
+ container.scrollTop = newScrollTop;
67
+ } else {
68
+ // 向上滚动
69
+ var _newScrollTop = Math.max(0, currentScrollTop - dynamicSpeed);
70
+ container.scrollTop = _newScrollTop;
71
+ }
72
+ lastScrollTimeRef.current = now;
73
+ }, [tableBodyRef]);
74
+ var startAutoScroll = useCallback(function (direction) {
75
+ if (autoScrollIntervalRef.current || !(tableBodyRef !== null && tableBodyRef !== void 0 && tableBodyRef.current)) return;
76
+
77
+ // 立即执行一次滚动
78
+ scrollStep(direction);
79
+
80
+ // 然后开始定时滚动
81
+ autoScrollIntervalRef.current = setInterval(function () {
82
+ scrollStep(direction);
83
+ }, SCROLL_THROTTLE);
84
+ }, [scrollStep, tableBodyRef]);
85
+ var stopAutoScroll = useCallback(function () {
86
+ if (autoScrollIntervalRef.current) {
87
+ clearInterval(autoScrollIntervalRef.current);
88
+ autoScrollIntervalRef.current = null;
89
+ }
90
+ }, []);
91
+ var checkAndScroll = useCallback(function (clientY) {
92
+ if (!(tableBodyRef !== null && tableBodyRef !== void 0 && tableBodyRef.current) || !canRowDrag) return;
93
+ var container = tableBodyRef.current;
94
+ var rect = container.getBoundingClientRect();
95
+
96
+ // 检查鼠标是否在表格区域内
97
+ var isInTableArea = clientY >= rect.top && clientY <= rect.bottom;
98
+ if (!isInTableArea) {
99
+ stopAutoScroll();
100
+ return;
101
+ }
102
+
103
+ // 计算鼠标距离容器顶部和底部的距离
104
+ var distanceFromTop = clientY - rect.top;
105
+ var distanceFromBottom = rect.bottom - clientY;
106
+
107
+ // 在边缘区域触发滚动
108
+ if (distanceFromTop < SCROLL_ZONE) {
109
+ // 距离顶部很近,向上滚动
110
+ var intensity = 1 - distanceFromTop / SCROLL_ZONE;
111
+ startAutoScroll(-intensity);
112
+ } else if (distanceFromBottom < SCROLL_ZONE) {
113
+ // 距离底部很近,向下滚动
114
+ var _intensity = 1 - distanceFromBottom / SCROLL_ZONE;
115
+ startAutoScroll(_intensity);
116
+ } else {
117
+ stopAutoScroll();
118
+ }
119
+ }, [startAutoScroll, stopAutoScroll, tableBodyRef, canRowDrag]);
120
+
121
+ // 针对虚拟化表格的特殊滚动检查
122
+ var checkVirtualScroll = useCallback(function (clientY) {
123
+ if (!(tableBodyRef !== null && tableBodyRef !== void 0 && tableBodyRef.current) || !rowVirtualizer || !table) {
124
+ checkAndScroll(clientY);
125
+ return;
126
+ }
127
+ var container = tableBodyRef.current;
128
+ var rect = container.getBoundingClientRect();
129
+
130
+ // 检查鼠标是否在表格区域内
131
+ var isInTableArea = clientY >= rect.top && clientY <= rect.bottom;
132
+ if (!isInTableArea) {
133
+ stopAutoScroll();
134
+ return;
135
+ }
136
+
137
+ // 计算鼠标距离容器顶部和底部的距离
138
+ var distanceFromTop = clientY - rect.top;
139
+ var distanceFromBottom = rect.bottom - clientY;
140
+ var virtualRows = rowVirtualizer.getVirtualItems();
141
+ var totalRows = table.getRowModel().rows.length;
142
+ var shouldScroll = false;
143
+ var scrollDirection = 0;
144
+
145
+ // 检查是否需要滚动到虚拟化的边界
146
+ if (distanceFromTop < SCROLL_ZONE) {
147
+ if (virtualRows.length > 0 && virtualRows[0].index > 0) {
148
+ // 还有更多行在上方,向上滚动
149
+ shouldScroll = true;
150
+ scrollDirection = -1;
151
+ } else if (container.scrollTop > 0) {
152
+ // 虚拟行已经到顶部,但容器还有滚动空间
153
+ shouldScroll = true;
154
+ scrollDirection = -1;
155
+ }
156
+ } else if (distanceFromBottom < SCROLL_ZONE) {
157
+ if (virtualRows.length > 0 && virtualRows[virtualRows.length - 1].index < totalRows - 1) {
158
+ // 还有更多行在下方,向下滚动
159
+ shouldScroll = true;
160
+ scrollDirection = 1;
161
+ } else if (container.scrollTop < container.scrollHeight - container.clientHeight) {
162
+ // 虚拟行已经到底部,但容器还有滚动空间
163
+ shouldScroll = true;
164
+ scrollDirection = 1;
165
+ }
166
+ }
167
+ if (shouldScroll) {
168
+ var intensity = scrollDirection > 0 ? 1 - distanceFromBottom / SCROLL_ZONE : 1 - distanceFromTop / SCROLL_ZONE;
169
+ startAutoScroll(scrollDirection * intensity);
170
+ } else {
171
+ stopAutoScroll();
172
+ }
173
+ }, [tableBodyRef, rowVirtualizer, table, startAutoScroll, stopAutoScroll, checkAndScroll]);
174
+
175
+ // 清理函数
176
+ useEffect(function () {
177
+ return function () {
178
+ stopAutoScroll();
179
+ };
180
+ }, []);
181
+ return {
182
+ checkAndScroll: checkVirtualScroll,
183
+ stopAutoScroll: stopAutoScroll,
184
+ startAutoScroll: startAutoScroll
185
+ };
186
+ };
31
187
  var VirtualTableBody = function VirtualTableBody(_ref) {
32
188
  var _headerGroups, _table$getRowModel$ro2;
33
189
  var tableBodyRef = _ref.tableBodyRef,
@@ -115,6 +271,11 @@ var VirtualTableBody = function VirtualTableBody(_ref) {
115
271
  dropSide = _useState6[0],
116
272
  setDropSide = _useState6[1];
117
273
 
274
+ // 使用自定义的拖拽自动滚动 Hook
275
+ var _useDragAutoScroll = useDragAutoScroll(tableBodyRef, tableContentRef, canRowDrag, rowVirtualizer, table),
276
+ checkAndScroll = _useDragAutoScroll.checkAndScroll,
277
+ stopAutoScroll = _useDragAutoScroll.stopAutoScroll;
278
+
118
279
  // 清除hover行信息
119
280
  var clearHoverRowIndex = useCallback(function () {
120
281
  setHoverRowIndex(undefined);
@@ -191,9 +352,36 @@ var VirtualTableBody = function VirtualTableBody(_ref) {
191
352
  visible: false
192
353
  }));
193
354
  }, []);
355
+
356
+ // 添加全局拖拽监听,实现自动滚动
357
+ useEffect(function () {
358
+ var handleGlobalDragOver = function handleGlobalDragOver(e) {
359
+ if (canRowDrag) {
360
+ e.preventDefault();
361
+ checkAndScroll(e.clientY);
362
+ }
363
+ };
364
+ var handleDragEnd = function handleDragEnd() {
365
+ stopAutoScroll();
366
+ };
367
+ if (canRowDrag) {
368
+ document.addEventListener('dragover', handleGlobalDragOver, {
369
+ passive: false
370
+ });
371
+ document.addEventListener('dragend', handleDragEnd);
372
+ document.addEventListener('drop', handleDragEnd);
373
+ }
374
+ return function () {
375
+ document.removeEventListener('dragover', handleGlobalDragOver);
376
+ document.removeEventListener('dragend', handleDragEnd);
377
+ document.removeEventListener('drop', handleDragEnd);
378
+ stopAutoScroll();
379
+ };
380
+ }, [canRowDrag, checkAndScroll, stopAutoScroll]);
194
381
  var _useDrop = useDrop({
195
382
  accept: 'TABLE_ROW',
196
383
  drop: function drop(formDatas) {
384
+ stopAutoScroll();
197
385
  return reorderRow === null || reorderRow === void 0 ? void 0 : reorderRow(formDatas, {
198
386
  hoverRow: {
199
387
  index: 0
@@ -210,6 +398,7 @@ var VirtualTableBody = function VirtualTableBody(_ref) {
210
398
  if (monitor.didDrop()) {
211
399
  return undefined;
212
400
  }
401
+ stopAutoScroll();
213
402
  clearHoverRowIndex();
214
403
  return reorderRow === null || reorderRow === void 0 ? void 0 : reorderRow(formDatas, {
215
404
  hoverRow: undefined,
@@ -217,9 +406,11 @@ var VirtualTableBody = function VirtualTableBody(_ref) {
217
406
  });
218
407
  },
219
408
  hover: function hover(item, monitor) {
220
- if (monitor.isOver({
409
+ var clientOffset = monitor.getClientOffset();
410
+ if (clientOffset && monitor.isOver({
221
411
  shallow: true
222
412
  }) && monitor.canDrop()) {
413
+ checkAndScroll(clientOffset.y);
223
414
  addToLast();
224
415
  }
225
416
  }
@@ -282,14 +473,7 @@ var VirtualTableBody = function VirtualTableBody(_ref) {
282
473
  dropSide: dropSide,
283
474
  onEditValueChange: onEditValueChange,
284
475
  setRowSelection: setRowSelection,
285
- openMemo: openMemo
286
- // virtualColumns={virtualColumns}
287
- // scrollableColumns={scrollableColumns}
288
- // virtualPaddingLeft={virtualPaddingLeft}
289
- // virtualPaddingRight={virtualPaddingRight}
290
- // leftPinnedColumns={leftPinnedColumns}
291
- // rightPinnedColumns={rightPinnedColumns}
292
- ,
476
+ openMemo: openMemo,
293
477
  virtualRowStart: virtualRow.start
294
478
  }, row.id);
295
479
  });
@@ -348,7 +532,6 @@ var VirtualTableBody = function VirtualTableBody(_ref) {
348
532
  });
349
533
  };
350
534
  var tBodyHeight = useMemo(function () {
351
- // if (!openVirtualRows || !rowVirtualizer?.getTotalSize()) return 'auto';
352
535
  if (!(rowVirtualizer !== null && rowVirtualizer !== void 0 && rowVirtualizer.getTotalSize())) return 'auto';
353
536
  return (rowVirtualizer === null || rowVirtualizer === void 0 ? void 0 : rowVirtualizer.getTotalSize()) + (hasTotalRow ? rowHeight : 0);
354
537
  }, [openVirtualRows, hasTotalRow, rowVirtualizer === null || rowVirtualizer === void 0 ? void 0 : rowVirtualizer.getTotalSize(), rowHeight]);
@@ -363,20 +546,7 @@ var VirtualTableBody = function VirtualTableBody(_ref) {
363
546
  table: table,
364
547
  tableId: tableId,
365
548
  compactMode: compactMode
366
- }), root ? document.querySelector(root) : document.body), showTable ?
367
- /*#__PURE__*/
368
- // <div
369
- // className="table-max-table-body-table-wrapper"
370
- // ref={dropTableEmptyRef}
371
- // >
372
- // <table>
373
- // <colgroup>
374
- // {headers.map((header: any) => {
375
- // let size: number = header?.column?.getSize() || 120;
376
- // return <col key={header.id} width={size}></col>;
377
- // })}
378
- // </colgroup>
379
- _jsxs("tbody", {
549
+ }), root ? document.querySelector(root) : document.body), showTable ? /*#__PURE__*/_jsxs("tbody", {
380
550
  ref: dropTableEmptyRef,
381
551
  id: "table-max-tableBody-tbody-".concat(tableId),
382
552
  style: {
@@ -388,10 +558,7 @@ var VirtualTableBody = function VirtualTableBody(_ref) {
388
558
  table: table,
389
559
  totalDatas: totalDatas
390
560
  })]
391
- })
392
- // // {/* </table> */}
393
- // </div>
394
- : /*#__PURE__*/_jsx("tbody", {
561
+ }) : /*#__PURE__*/_jsx("tbody", {
395
562
  ref: dropEmptyRef,
396
563
  children: /*#__PURE__*/_jsx("tr", {
397
564
  className: "empty-container",
@@ -1,13 +1,13 @@
1
1
  import { TableMaxColumnType } from "../../type";
2
- export declare const numberSortFn: (rowA: any, rowB: any, columnId: string) => 1 | 0 | -1;
3
- export declare const stringSortFn: (rowA: any, rowB: any, columnId: string) => 1 | 0 | -1;
4
- export declare const numberOrStringSortFn: (rowA: any, rowB: any, columnId: string) => 1 | 0 | -1;
5
- export declare const timeSortFn: (rowA: any, rowB: any, columnId: string) => 1 | 0 | -1;
2
+ export declare const numberSortFn: (rowA: any, rowB: any, columnId: string) => 0 | 1 | -1;
3
+ export declare const stringSortFn: (rowA: any, rowB: any, columnId: string) => 0 | 1 | -1;
4
+ export declare const numberOrStringSortFn: (rowA: any, rowB: any, columnId: string) => 0 | 1 | -1;
5
+ export declare const timeSortFn: (rowA: any, rowB: any, columnId: string) => 0 | 1 | -1;
6
6
  declare const customSortFns: {
7
- numberSortFn: (rowA: any, rowB: any, columnId: string) => 1 | 0 | -1;
8
- stringSortFn: (rowA: any, rowB: any, columnId: string) => 1 | 0 | -1;
9
- timeSortFn: (rowA: any, rowB: any, columnId: string) => 1 | 0 | -1;
10
- numberOrStringSortFn: (rowA: any, rowB: any, columnId: string) => 1 | 0 | -1;
7
+ numberSortFn: (rowA: any, rowB: any, columnId: string) => 0 | 1 | -1;
8
+ stringSortFn: (rowA: any, rowB: any, columnId: string) => 0 | 1 | -1;
9
+ timeSortFn: (rowA: any, rowB: any, columnId: string) => 0 | 1 | -1;
10
+ numberOrStringSortFn: (rowA: any, rowB: any, columnId: string) => 0 | 1 | -1;
11
11
  };
12
12
  export default customSortFns;
13
13
  export type SortFnType = keyof typeof customSortFns | undefined;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@arim-aisdc/public-components",
3
- "version": "2.3.83",
3
+ "version": "2.3.85",
4
4
  "description": "前端组件库",
5
5
  "license": "MIT",
6
6
  "main": "dist/index.js",