venus-design 1.0.5 → 1.0.7

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.
@@ -8,6 +8,8 @@ export declare const defaultConfig: {
8
8
  HEADER_BG_COLOR: string;
9
9
  ENABLE_EDIT_SINGLE_CLICK: boolean;
10
10
  HEIGHT: number;
11
+ ENABLE_KEYBOARD: boolean;
12
+ HIGHLIGHT_HOVER_ROW: boolean;
11
13
  TREE_INDENT: number;
12
14
  HEADER_CELL_STYLE_METHOD: ({ column }: any) => {
13
15
  color: string;
@@ -19,8 +19,10 @@ export var defaultConfig = {
19
19
  //单击进入编辑
20
20
  HEIGHT: 300,
21
21
  // 高度
22
- //ENABLE_KEYBOARD: true, // 开启键盘操作
23
- //HIGHLIGHT_HOVER_ROW:true, // 开启行悬停高亮
22
+ ENABLE_KEYBOARD: true,
23
+ // 开启键盘操作
24
+ HIGHLIGHT_HOVER_ROW: true,
25
+ // 开启行悬停高亮
24
26
  //HIGHLIGHT_HOVER_ROW_COLOR:"#eeeeeeff",//悬停高亮颜色
25
27
  //HIGHLIGHT_SELECTED_ROW:true, // 开启选中行高亮
26
28
  //HIGHLIGHT_SELECTED_ROW_COLOR:"#d5f2ffff",//选中高亮颜色
@@ -653,6 +653,8 @@ export default function VirtTable(props) {
653
653
  }
654
654
  }, [editorType, editorCell, editorStyle, selectValue, numberValue, dateValue, selevelValue, userValue, deptValue]);
655
655
  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
656
+ className: "virt-table-all"
657
+ }, /*#__PURE__*/React.createElement("div", {
656
658
  className: "virt-table-header"
657
659
  }, /*#__PURE__*/React.createElement("div", {
658
660
  className: "virt-table-header-title"
@@ -708,5 +710,5 @@ export default function VirtTable(props) {
708
710
  })));
709
711
  }));
710
712
  }));
711
- }))));
713
+ })))));
712
714
  }
@@ -17,8 +17,13 @@ export default class Body {
17
17
  private visibleHeight;
18
18
  private visibleWidth;
19
19
  private containerRect;
20
+ private addRowBtnRect;
21
+ private addRowBtnHover;
22
+ private mousePollTimer;
20
23
  private data;
21
24
  constructor(ctx: Context);
25
+ private startMousePoll;
26
+ private stopMousePoll;
22
27
  private init;
23
28
  private initResizeRow;
24
29
  private resizeRow;
@@ -27,5 +32,6 @@ export default class Body {
27
32
  private binarySearch;
28
33
  update(): void;
29
34
  updateAutoHeight(): void;
35
+ private drawAddRowButton;
30
36
  draw(): void;
31
37
  }
@@ -8,6 +8,7 @@ function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e
8
8
  import Row from "./Row";
9
9
  var Body = /*#__PURE__*/function () {
10
10
  function Body(ctx) {
11
+ var _this = this;
11
12
  _classCallCheck(this, Body);
12
13
  _defineProperty(this, "resizeTarget", null);
13
14
  //调整行大小的目标
@@ -31,12 +32,53 @@ var Body = /*#__PURE__*/function () {
31
32
  _defineProperty(this, "visibleHeight", 0);
32
33
  _defineProperty(this, "visibleWidth", 0);
33
34
  _defineProperty(this, "containerRect", void 0);
35
+ /* 1. 在 class 顶部加:按钮条缓存 */
36
+ _defineProperty(this, "addRowBtnRect", null);
37
+ _defineProperty(this, "addRowBtnHover", false);
38
+ // ← 新增
39
+ _defineProperty(this, "mousePollTimer", null);
40
+ // 轮询句柄
34
41
  _defineProperty(this, "data", []);
35
42
  this.ctx = ctx;
36
43
  this.init();
44
+ this.startMousePoll(); // 启动轮询
45
+ ctx.on('destroy', function () {
46
+ return _this.stopMousePoll();
47
+ });
37
48
  this.initResizeRow();
38
49
  }
50
+ /* 轮询:每 100ms 检查一次鼠标是否还在按钮热区 */
39
51
  _createClass(Body, [{
52
+ key: "startMousePoll",
53
+ value: function startMousePoll() {
54
+ var _this2 = this;
55
+ if (this.mousePollTimer) return;
56
+ this.mousePollTimer = window.setInterval(function () {
57
+ if (!_this2.addRowBtnRect) return;
58
+ // 当前鼠标位置(EventBrowser 里已实时缓存到 Context)
59
+ var _ref = _this2.ctx.lastMouseMoveEvent ? _this2.ctx.getOffset(_this2.ctx.lastMouseMoveEvent) : {
60
+ offsetX: -9999,
61
+ offsetY: -9999
62
+ },
63
+ offsetX = _ref.offsetX,
64
+ offsetY = _ref.offsetY;
65
+ var by = _this2.addRowBtnRect.y - _this2.ctx.scrollY;
66
+ var inside = offsetX >= _this2.addRowBtnRect.x && offsetX <= _this2.addRowBtnRect.x + _this2.addRowBtnRect.w && offsetY >= by && offsetY <= by + _this2.addRowBtnRect.h;
67
+ if (inside !== _this2.addRowBtnHover) {
68
+ _this2.addRowBtnHover = inside;
69
+ _this2.ctx.emit('draw'); // 立即重画
70
+ }
71
+ }, 100);
72
+ }
73
+ }, {
74
+ key: "stopMousePoll",
75
+ value: function stopMousePoll() {
76
+ if (this.mousePollTimer) {
77
+ clearInterval(this.mousePollTimer);
78
+ this.mousePollTimer = null;
79
+ }
80
+ }
81
+ }, {
40
82
  key: "init",
41
83
  value: function init() {
42
84
  var _this$ctx = this.ctx,
@@ -90,8 +132,8 @@ var Body = /*#__PURE__*/function () {
90
132
  containerHeight += footerHeight;
91
133
  var stageHeight = containerHeight;
92
134
  var windowInnerHeight = window.innerHeight;
93
- var _ref = this.containerRect || this.ctx.containerElement.getBoundingClientRect(),
94
- top = _ref.top;
135
+ var _ref2 = this.containerRect || this.ctx.containerElement.getBoundingClientRect(),
136
+ top = _ref2.top;
95
137
  if (windowInnerHeight > top && ENABLE_OFFSET_HEIGHT && !HEIGHT) {
96
138
  var visibleHeight = windowInnerHeight - top;
97
139
  var _stageHeight = visibleHeight - OFFSET_HEIGHT;
@@ -154,115 +196,115 @@ var Body = /*#__PURE__*/function () {
154
196
  }, {
155
197
  key: "initResizeRow",
156
198
  value: function initResizeRow() {
157
- var _this = this;
199
+ var _this3 = this;
158
200
  this.ctx.on('resize', function () {
159
- if (!_this.ctx.config.ENABLE_RESIZE_ROW) {
201
+ if (!_this3.ctx.config.ENABLE_RESIZE_ROW) {
160
202
  return;
161
203
  }
162
- _this.containerRect = _this.ctx.containerElement.getBoundingClientRect();
204
+ _this3.containerRect = _this3.ctx.containerElement.getBoundingClientRect();
163
205
  });
164
206
  this.ctx.on('resizeObserver', function () {
165
- if (!_this.ctx.config.ENABLE_RESIZE_ROW) {
207
+ if (!_this3.ctx.config.ENABLE_RESIZE_ROW) {
166
208
  return;
167
209
  }
168
- _this.containerRect = _this.ctx.containerElement.getBoundingClientRect();
210
+ _this3.containerRect = _this3.ctx.containerElement.getBoundingClientRect();
169
211
  });
170
212
  // 鼠标移动
171
213
  this.ctx.on('mouseup', function () {
172
- if (!_this.ctx.config.ENABLE_RESIZE_ROW) {
214
+ if (!_this3.ctx.config.ENABLE_RESIZE_ROW) {
173
215
  return;
174
216
  }
175
- _this.isMouseDown = false;
176
- if (_this.resizeDiff !== 0 && _this.resizeTarget) {
217
+ _this3.isMouseDown = false;
218
+ if (_this3.resizeDiff !== 0 && _this3.resizeTarget) {
177
219
  // 调整宽度
178
- _this.resizeRow(_this.resizeTarget, _this.resizeDiff);
220
+ _this3.resizeRow(_this3.resizeTarget, _this3.resizeDiff);
179
221
  }
180
- _this.resizeTarget = null;
181
- _this.resizeDiff = 0;
182
- _this.isResizing = false;
222
+ _this3.resizeTarget = null;
223
+ _this3.resizeDiff = 0;
224
+ _this3.isResizing = false;
183
225
  //加个延时,修复拖动时,开始编辑的问题
184
226
  setTimeout(function () {
185
- _this.ctx.rowResizing = false;
227
+ _this3.ctx.rowResizing = false;
186
228
  }, 0);
187
- _this.clientY = 0;
229
+ _this3.clientY = 0;
188
230
  });
189
231
  this.ctx.on('mousedown', function (e) {
190
- if (!_this.ctx.config.ENABLE_RESIZE_ROW) {
232
+ if (!_this3.ctx.config.ENABLE_RESIZE_ROW) {
191
233
  return;
192
234
  }
193
- if (!_this.ctx.isTarget(e)) {
235
+ if (!_this3.ctx.isTarget(e)) {
194
236
  return;
195
237
  }
196
- _this.clientY = e.clientY;
197
- if (_this.resizeTarget) {
198
- _this.isResizing = true;
238
+ _this3.clientY = e.clientY;
239
+ if (_this3.resizeTarget) {
240
+ _this3.isResizing = true;
199
241
  // 传递给上下文,防止其他事件触发,行调整大小时,不触发选择器
200
- _this.ctx.rowResizing = true;
242
+ _this3.ctx.rowResizing = true;
201
243
  } else {
202
- _this.isResizing = false;
203
- _this.ctx.rowResizing = false;
244
+ _this3.isResizing = false;
245
+ _this3.ctx.rowResizing = false;
204
246
  }
205
- _this.isMouseDown = true;
247
+ _this3.isMouseDown = true;
206
248
  });
207
249
  this.ctx.on('mousemove', function (e) {
208
- if (!_this.ctx.config.ENABLE_RESIZE_ROW) {
250
+ if (!_this3.ctx.config.ENABLE_RESIZE_ROW) {
209
251
  return;
210
252
  }
211
253
  // 编辑中不触发mousemove
212
- if (_this.ctx.editing) return;
213
- var _this$ctx$getOffset = _this.ctx.getOffset(e),
214
- offsetY = _this$ctx$getOffset.offsetY,
215
- offsetX = _this$ctx$getOffset.offsetX;
254
+ if (_this3.ctx.editing) return;
255
+ var _this3$ctx$getOffset = _this3.ctx.getOffset(e),
256
+ offsetY = _this3$ctx$getOffset.offsetY,
257
+ offsetX = _this3$ctx$getOffset.offsetX;
216
258
  var y = offsetY;
217
259
  var x = offsetX;
218
260
  var clientY = e.clientY;
219
- var _this$ctx2 = _this.ctx,
220
- stageHeight = _this$ctx2.stageHeight,
221
- scrollY = _this$ctx2.scrollY,
222
- _this$ctx2$config$RES = _this$ctx2.config.RESIZE_ROW_MIN_HEIGHT,
223
- RESIZE_ROW_MIN_HEIGHT = _this$ctx2$config$RES === void 0 ? 0 : _this$ctx2$config$RES;
224
- if (_this.isResizing && _this.resizeTarget) {
225
- var resizeTargetHeight = _this.resizeTarget.height;
226
- var diff = clientY - _this.clientY;
227
- var calculatedHeight = _this.resizeTarget.calculatedHeight;
261
+ var _this3$ctx = _this3.ctx,
262
+ stageHeight = _this3$ctx.stageHeight,
263
+ scrollY = _this3$ctx.scrollY,
264
+ _this3$ctx$config$RES = _this3$ctx.config.RESIZE_ROW_MIN_HEIGHT,
265
+ RESIZE_ROW_MIN_HEIGHT = _this3$ctx$config$RES === void 0 ? 0 : _this3$ctx$config$RES;
266
+ if (_this3.isResizing && _this3.resizeTarget) {
267
+ var resizeTargetHeight = _this3.resizeTarget.height;
268
+ var diff = clientY - _this3.clientY;
269
+ var calculatedHeight = _this3.resizeTarget.calculatedHeight;
228
270
  var minHeight = calculatedHeight === -1 ? RESIZE_ROW_MIN_HEIGHT : calculatedHeight;
229
271
  if (diff + resizeTargetHeight < minHeight) {
230
272
  diff = -(resizeTargetHeight - minHeight);
231
273
  }
232
- _this.resizeDiff = diff;
233
- _this.ctx.emit('draw');
274
+ _this3.resizeDiff = diff;
275
+ _this3.ctx.emit('draw');
234
276
  } else {
235
- _this.resizeTarget = null;
277
+ _this3.resizeTarget = null;
236
278
  // 按下时不改变样式,有可能是多选表头
237
- if (_this.isMouseDown) {
279
+ if (_this3.isMouseDown) {
238
280
  return;
239
281
  }
240
282
  // 鼠标移动时,判断是否在行的范围内
241
- if (x < 0 || x > _this.ctx.body.visibleWidth || y < 0 || y > _this.ctx.header.visibleHeight + _this.ctx.body.visibleHeight) {
242
- if (_this.ctx.stageElement.style.cursor === 'row-resize') {
283
+ if (x < 0 || x > _this3.ctx.body.visibleWidth || y < 0 || y > _this3.ctx.header.visibleHeight + _this3.ctx.body.visibleHeight) {
284
+ if (_this3.ctx.stageElement.style.cursor === 'row-resize') {
243
285
  // 恢复默认样式
244
- _this.ctx.stageElement.style.cursor = 'default';
286
+ _this3.ctx.stageElement.style.cursor = 'default';
245
287
  }
246
288
  return;
247
289
  }
248
290
  // 如果是拖动选择
249
- if (_this.ctx.stageElement.style.cursor === 'crosshair') {
291
+ if (_this3.ctx.stageElement.style.cursor === 'crosshair') {
250
292
  return;
251
293
  }
252
- if (_this.ctx.stageElement.style.cursor === 'row-resize') {
294
+ if (_this3.ctx.stageElement.style.cursor === 'row-resize') {
253
295
  // 恢复默认样式
254
- _this.ctx.stageElement.style.cursor = 'default';
296
+ _this3.ctx.stageElement.style.cursor = 'default';
255
297
  }
256
- for (var i = 0; i < _this.renderRows.length; i++) {
257
- var row = _this.renderRows[i];
298
+ for (var i = 0; i < _this3.renderRows.length; i++) {
299
+ var row = _this3.renderRows[i];
258
300
  var isYRange = y > row.y - scrollY + row.height - 1.5 && y < row.y - scrollY + row.height + 1.5 && y < stageHeight - 4;
259
301
  if (isYRange) {
260
302
  for (var j = 0; j < row.cells.length; j++) {
261
303
  var cell = row.cells[j];
262
304
  if (x > cell.drawX + 10 && x < cell.drawX + cell.width - 10 && cell.rowspan === 1 //没有被合并的单元格
263
305
  ) {
264
- _this.ctx.stageElement.style.cursor = 'row-resize';
265
- _this.resizeTarget = row;
306
+ _this3.ctx.stageElement.style.cursor = 'row-resize';
307
+ _this3.resizeTarget = row;
266
308
  }
267
309
  }
268
310
  }
@@ -293,10 +335,10 @@ var Body = /*#__PURE__*/function () {
293
335
  key: "drawTipLine",
294
336
  value: function drawTipLine() {
295
337
  if (this.isResizing && this.resizeTarget) {
296
- var _this$ctx3 = this.ctx,
297
- stageWidth = _this$ctx3.stageWidth,
298
- scrollY = _this$ctx3.scrollY,
299
- RESIZE_ROW_LINE_COLOR = _this$ctx3.config.RESIZE_ROW_LINE_COLOR;
338
+ var _this$ctx2 = this.ctx,
339
+ stageWidth = _this$ctx2.stageWidth,
340
+ scrollY = _this$ctx2.scrollY,
341
+ RESIZE_ROW_LINE_COLOR = _this$ctx2.config.RESIZE_ROW_LINE_COLOR;
300
342
  var resizeTargetDrawY = this.resizeTarget.y - scrollY;
301
343
  var resizeTargetHeight = this.resizeTarget.height;
302
344
  var y = resizeTargetDrawY + resizeTargetHeight + this.resizeDiff - 0.5;
@@ -310,15 +352,15 @@ var Body = /*#__PURE__*/function () {
310
352
  }, {
311
353
  key: "drawFixedShadow",
312
354
  value: function drawFixedShadow() {
313
- var _this$ctx4 = this.ctx,
314
- fixedLeftWidth = _this$ctx4.fixedLeftWidth,
315
- fixedRightWidth = _this$ctx4.fixedRightWidth,
316
- scrollX = _this$ctx4.scrollX,
317
- header = _this$ctx4.header,
318
- stageWidth = _this$ctx4.stageWidth,
319
- _this$ctx4$config = _this$ctx4.config,
320
- HEADER_BG_COLOR = _this$ctx4$config.HEADER_BG_COLOR,
321
- SCROLLER_TRACK_SIZE = _this$ctx4$config.SCROLLER_TRACK_SIZE;
355
+ var _this$ctx3 = this.ctx,
356
+ fixedLeftWidth = _this$ctx3.fixedLeftWidth,
357
+ fixedRightWidth = _this$ctx3.fixedRightWidth,
358
+ scrollX = _this$ctx3.scrollX,
359
+ header = _this$ctx3.header,
360
+ stageWidth = _this$ctx3.stageWidth,
361
+ _this$ctx3$config = _this$ctx3.config,
362
+ HEADER_BG_COLOR = _this$ctx3$config.HEADER_BG_COLOR,
363
+ SCROLLER_TRACK_SIZE = _this$ctx3$config.SCROLLER_TRACK_SIZE;
322
364
  if (scrollX > 0 && fixedLeftWidth !== 0) {
323
365
  this.ctx.paint.drawShadow(this.x, this.y, fixedLeftWidth, this.height, {
324
366
  fillColor: HEADER_BG_COLOR,
@@ -364,11 +406,11 @@ var Body = /*#__PURE__*/function () {
364
406
  key: "update",
365
407
  value: function update() {
366
408
  this.init();
367
- var _this$ctx5 = this.ctx,
368
- header = _this$ctx5.header,
369
- database = _this$ctx5.database,
370
- scrollY = _this$ctx5.scrollY,
371
- CELL_HEIGHT = _this$ctx5.config.CELL_HEIGHT;
409
+ var _this$ctx4 = this.ctx,
410
+ header = _this$ctx4.header,
411
+ database = _this$ctx4.database,
412
+ scrollY = _this$ctx4.scrollY,
413
+ CELL_HEIGHT = _this$ctx4.config.CELL_HEIGHT;
372
414
  var offset = scrollY;
373
415
  var _database$getData2 = database.getData(),
374
416
  data = _database$getData2.data,
@@ -401,6 +443,17 @@ var Body = /*#__PURE__*/function () {
401
443
  var row = new Row(this.ctx, index, 0, top + this.y, header.width, height, _data);
402
444
  rows.push(row);
403
445
  }
446
+ if (this.ctx.config.ENABLE_ADD_ROW_BUTTON) {
447
+ var dataBottom = this.height; // 数据总高
448
+ this.addRowBtnRect = {
449
+ x: 0,
450
+ y: dataBottom,
451
+ w: this.width,
452
+ h: this.ctx.config.CELL_HEIGHT
453
+ };
454
+ } else {
455
+ this.addRowBtnRect = null;
456
+ }
404
457
  this.renderRows = rows;
405
458
  this.ctx.body.renderRows = rows;
406
459
  }
@@ -428,6 +481,39 @@ var Body = /*#__PURE__*/function () {
428
481
  });
429
482
  this.ctx.database.setBatchCalculatedRowHeight(heights);
430
483
  }
484
+ }, {
485
+ key: "drawAddRowButton",
486
+ value: function drawAddRowButton() {
487
+ if (!this.addRowBtnRect) return;
488
+ var _this$addRowBtnRect = this.addRowBtnRect,
489
+ x = _this$addRowBtnRect.x,
490
+ y = _this$addRowBtnRect.y,
491
+ w = _this$addRowBtnRect.w,
492
+ h = _this$addRowBtnRect.h;
493
+ var _this$ctx5 = this.ctx,
494
+ paint = _this$ctx5.paint,
495
+ config = _this$ctx5.config;
496
+
497
+ // 背景色:悬浮/默认 二选一
498
+ var bgColor = this.addRowBtnHover ? config.ADD_ROW_BUTTON_HOVER_BG_COLOR : config.ADD_ROW_BUTTON_BG_COLOR;
499
+
500
+ // 文字颜色:悬浮/默认 二选一
501
+ var textColor = this.addRowBtnHover ? config.ADD_ROW_BUTTON_HOVER_TEXT_COLOR : config.ADD_ROW_BUTTON_TEXT_COLOR;
502
+ paint.drawRect(x, y - this.ctx.scrollY, w, h, {
503
+ fillColor: bgColor,
504
+ borderColor: config.BORDER_COLOR,
505
+ borderWidth: 1
506
+ });
507
+ paint.drawText(config.ADD_ROW_BUTTON_TEXT, x, y - this.ctx.scrollY, w, h, {
508
+ align: config.ADD_ROW_BUTTON_TEXT_ALIGN,
509
+ // ← 新增
510
+ padding: config.ADD_ROW_BUTTON_TEXT_PADDING,
511
+ // ← 新增
512
+ verticalAlign: 'middle',
513
+ color: textColor,
514
+ font: "".concat(config.ADD_ROW_BUTTON_FONT_SIZE, "px normal Arial")
515
+ });
516
+ }
431
517
  }, {
432
518
  key: "draw",
433
519
  value: function draw() {
@@ -446,6 +532,8 @@ var Body = /*#__PURE__*/function () {
446
532
  row.drawFixed();
447
533
  });
448
534
  this.drawTipLine();
535
+ /* 画按钮条 */
536
+ this.drawAddRowButton();
449
537
  }
450
538
  }]);
451
539
  return Body;
@@ -1,3 +1,4 @@
1
+ import EVirtTable from './EVirtTable';
1
2
  import { IconType } from './Icons';
2
3
  import { Align, BeforeAutofillDataMethod, BeforeCellValueChangeMethod, BeforeCopyMethod, BeforePasteDataMethod, BeforeSetAutofillMethod, BeforeSetSelectorMethod, CellEditorMethod, CellHeaderStyleMethod, CellHoverIconMethod, CellReadonlyMethod, CellRenderMethod, CellRulesMethod, CellStyleMethod, CellTypeMethod, ConfigType, ExpandLazyMethod, FooterPosition, FormatterMethod, MenuItem, SelectableMethod, SelectorCellValueType, SpanMethod, TreeSelectMode, VerticalAlign } from './types';
3
4
  export default class Config {
@@ -307,6 +308,27 @@ export default class Config {
307
308
  BEFORE_SET_AUTOFILL_METHOD?: BeforeSetAutofillMethod;
308
309
  /** 数据复制前回调 */
309
310
  BEFORE_COPY_METHOD?: BeforeCopyMethod;
311
+ ENABLE_ADD_ROW_BUTTON: boolean;
312
+ ADD_ROW_BUTTON_TEXT: string;
313
+ ADD_ROW_BUTTON_CLICK?: (params: {
314
+ table: EVirtTable;
315
+ }) => void;
316
+ /** 添加一行按钮-文字大小 */
317
+ ADD_ROW_BUTTON_FONT_SIZE: number;
318
+ /** 添加一行按钮-文字颜色 */
319
+ ADD_ROW_BUTTON_TEXT_COLOR: string;
320
+ /** 添加一行按钮-悬浮鼠标样式 */
321
+ ADD_ROW_BUTTON_CURSOR: string;
322
+ /** 添加一行按钮-默认背景色 */
323
+ ADD_ROW_BUTTON_BG_COLOR: string;
324
+ /** 添加一行按钮-悬浮背景色 */
325
+ ADD_ROW_BUTTON_HOVER_BG_COLOR: string;
326
+ /** 添加一行按钮-悬浮文字颜色 */
327
+ ADD_ROW_BUTTON_HOVER_TEXT_COLOR: string;
328
+ /** 添加一行按钮-文字水平对齐方式 */
329
+ ADD_ROW_BUTTON_TEXT_ALIGN: 'left' | 'center' | 'right';
330
+ /** 添加一行按钮-文字左右边距(px) */
331
+ ADD_ROW_BUTTON_TEXT_PADDING: number;
310
332
  constructor(config: Partial<Config>);
311
333
  /** 初始化 */
312
334
  init(config: ConfigType): void;
@@ -333,6 +333,25 @@ var Config = /*#__PURE__*/function () {
333
333
  _defineProperty(this, "BEFORE_SET_AUTOFILL_METHOD", void 0);
334
334
  /** 数据复制前回调 */
335
335
  _defineProperty(this, "BEFORE_COPY_METHOD", void 0);
336
+ _defineProperty(this, "ENABLE_ADD_ROW_BUTTON", false);
337
+ _defineProperty(this, "ADD_ROW_BUTTON_TEXT", '添加一行');
338
+ _defineProperty(this, "ADD_ROW_BUTTON_CLICK", void 0);
339
+ /** 添加一行按钮-文字大小 */
340
+ _defineProperty(this, "ADD_ROW_BUTTON_FONT_SIZE", 12);
341
+ /** 添加一行按钮-文字颜色 */
342
+ _defineProperty(this, "ADD_ROW_BUTTON_TEXT_COLOR", '#1890ff');
343
+ /** 添加一行按钮-悬浮鼠标样式 */
344
+ _defineProperty(this, "ADD_ROW_BUTTON_CURSOR", 'pointer');
345
+ /** 添加一行按钮-默认背景色 */
346
+ _defineProperty(this, "ADD_ROW_BUTTON_BG_COLOR", '#ffffff');
347
+ /** 添加一行按钮-悬浮背景色 */
348
+ _defineProperty(this, "ADD_ROW_BUTTON_HOVER_BG_COLOR", '#e6f7ff');
349
+ /** 添加一行按钮-悬浮文字颜色 */
350
+ _defineProperty(this, "ADD_ROW_BUTTON_HOVER_TEXT_COLOR", '#096dd9');
351
+ /** 添加一行按钮-文字水平对齐方式 */
352
+ _defineProperty(this, "ADD_ROW_BUTTON_TEXT_ALIGN", 'center');
353
+ /** 添加一行按钮-文字左右边距(px) */
354
+ _defineProperty(this, "ADD_ROW_BUTTON_TEXT_PADDING", 12);
336
355
  this._config = config;
337
356
  this.updateCssVar();
338
357
  }
@@ -119,6 +119,7 @@ export default class Context {
119
119
  focusCellHeader?: CellHeader;
120
120
  hoverCellHeader?: CellHeader;
121
121
  body: BodyOptions;
122
+ bodyInstance?: Body;
122
123
  footer: FooterOptions;
123
124
  header: HeaderOptions;
124
125
  selector: SelectorOptions;
@@ -129,6 +130,7 @@ export default class Context {
129
130
  drawTime: number;
130
131
  pickedRowIndex: number;
131
132
  placeholderIndex: number;
133
+ lastMouseMoveEvent?: MouseEvent;
132
134
  constructor(containerOptions: containerElementOptions, options: EVirtTableOptions);
133
135
  setConfig(config: Config): void;
134
136
  setItemValueByEditor(rowKey: string, key: string, value: any, history?: boolean, reDraw?: boolean, checkReadonly?: boolean): void;
@@ -22,7 +22,8 @@ import Config from "./Config";
22
22
  import Icons from "./Icons";
23
23
  import EventTable from "./EventTable";
24
24
  var Context = /*#__PURE__*/function () {
25
- // 空位所在索引
25
+ // 新增:最后一次鼠标事件
26
+
26
27
  function Context(containerOptions, options) {
27
28
  _classCallCheck(this, Context);
28
29
  _defineProperty(this, "eventBus", void 0);
@@ -102,6 +103,8 @@ var Context = /*#__PURE__*/function () {
102
103
  renderRows: [],
103
104
  data: []
104
105
  });
106
+ _defineProperty(this, "bodyInstance", void 0);
107
+ // ← 新增:指向真正的 Body 实例
105
108
  _defineProperty(this, "footer", {
106
109
  x: 0,
107
110
  y: 0,
@@ -145,6 +148,8 @@ var Context = /*#__PURE__*/function () {
145
148
  _defineProperty(this, "pickedRowIndex", -1);
146
149
  // -1 表示没有抓起
147
150
  _defineProperty(this, "placeholderIndex", -1);
151
+ // 空位所在索引
152
+ _defineProperty(this, "lastMouseMoveEvent", void 0);
148
153
  var containerElement = containerOptions.containerElement,
149
154
  stageElement = containerOptions.stageElement,
150
155
  canvasElement = containerOptions.canvasElement,
@@ -75,6 +75,9 @@ var EVirtTable = /*#__PURE__*/function () {
75
75
  this.loading = new Loading(this.ctx);
76
76
  this.filterPanel = new FilterPanel(this.ctx); // <-- 新增
77
77
  // 注入到 Context 中
78
+ this.body = new Body(this.ctx);
79
+ //@ts-ignore
80
+ this.ctx.bodyInstance = this.body; // ← 新增
78
81
  this.ctx.filterPanel = this.filterPanel;
79
82
  // ↓↓↓ 再加一行,让 Context 能把“表头过滤按钮点击”事件广播出去
80
83
  this.ctx.on('filterClick', function (cellHeader) {
@@ -16,6 +16,7 @@ var EventBrowser = /*#__PURE__*/function () {
16
16
  _createClass(EventBrowser, [{
17
17
  key: "init",
18
18
  value: function init() {
19
+ var _this = this;
19
20
  this.bind(window, 'resize', this.handleResize.bind(this));
20
21
  this.bind(window, 'mouseup', this.handleMouseUp.bind(this));
21
22
  this.bind(window, 'mousemove', this.handleMousemove.bind(this));
@@ -39,7 +40,12 @@ var EventBrowser = /*#__PURE__*/function () {
39
40
  this.bind(this.ctx.stageElement, 'mouseover', this.handleMouseover.bind(this));
40
41
  this.bind(this.ctx.stageElement, 'mouseout', this.handleMouseout.bind(this));
41
42
  document.addEventListener('selectionchange', this.selectionchange.bind(this));
43
+ // EventBrowser.ts -> init()
44
+ this.bind(document, 'mouseleave', function () {
45
+ _this.ctx.emit('globalMouseLeave');
46
+ });
42
47
  }
48
+ // EventBrowser.ts -> handleMousemove
43
49
  }, {
44
50
  key: "selectionchange",
45
51
  value: function selectionchange() {
@@ -60,9 +66,9 @@ var EventBrowser = /*#__PURE__*/function () {
60
66
  }, {
61
67
  key: "destroy",
62
68
  value: function destroy() {
63
- var _this = this;
69
+ var _this2 = this;
64
70
  this.eventTasks.forEach(function (fn, event) {
65
- _this.unbind(window, event, fn);
71
+ _this2.unbind(window, event, fn);
66
72
  });
67
73
  document.removeEventListener('selectionchange', this.selectionchange.bind(this));
68
74
  this.eventTasks.clear();
@@ -89,6 +95,8 @@ var EventBrowser = /*#__PURE__*/function () {
89
95
  }, {
90
96
  key: "handleMousemove",
91
97
  value: function handleMousemove(e) {
98
+ var me = e;
99
+ this.ctx.lastMouseMoveEvent = me; // ← 新增缓存
92
100
  this.ctx.emit('mousemove', e);
93
101
  }
94
102
  }, {
@@ -123,6 +123,24 @@ var EventTable = /*#__PURE__*/function () {
123
123
  });
124
124
  // 可视区
125
125
  _this.handleBodyEvent(x, y, _this.ctx.body.renderRows, function (cell) {
126
+ var _this$ctx$bodyInstanc;
127
+ /* 0. 先检查是否点在按钮条上 */
128
+ /* 0. 先检查是否点在按钮条上 */
129
+ //@ts-ignore
130
+ var btn = (_this$ctx$bodyInstanc = _this.ctx.bodyInstance) === null || _this$ctx$bodyInstanc === void 0 ? void 0 : _this$ctx$bodyInstanc.addRowBtnRect; // ← 注意这里
131
+ if (btn) {
132
+ var by = btn.y - _this.ctx.scrollY;
133
+ if (x >= btn.x && x <= btn.x + btn.w && y >= by && y <= by + btn.h) {
134
+ var ADD_ROW_BUTTON_CLICK = _this.ctx.config.ADD_ROW_BUTTON_CLICK;
135
+ if (typeof ADD_ROW_BUTTON_CLICK === 'function') {
136
+ console.log(_this.ctx);
137
+ ADD_ROW_BUTTON_CLICK({
138
+ table: _this.ctx
139
+ });
140
+ }
141
+ return;
142
+ }
143
+ }
126
144
  _this.ctx.clickCell = cell;
127
145
  _this.ctx.emit('cellClick', cell, e);
128
146
  _this.selectionClick(cell, e);
@@ -177,6 +195,7 @@ var EventTable = /*#__PURE__*/function () {
177
195
  }
178
196
  });
179
197
  this.ctx.on('mousemove', function (e) {
198
+ var _this$ctx$bodyInstanc2;
180
199
  // 是否忙碌,进行其他操作
181
200
  if (_this.isBusy(e)) {
182
201
  return;
@@ -202,6 +221,23 @@ var EventTable = /*#__PURE__*/function () {
202
221
  _this.visibleHoverCell = undefined; // 清除可视区hover
203
222
  _this.ctx.emit('cellHeaderHoverChange', cell, e);
204
223
  });
224
+ //@ts-ignore
225
+ var btn = (_this$ctx$bodyInstanc2 = _this.ctx.bodyInstance) === null || _this$ctx$bodyInstanc2 === void 0 ? void 0 : _this$ctx$bodyInstanc2.addRowBtnRect;
226
+ var body = _this.ctx.bodyInstance;
227
+ if (btn && body) {
228
+ var by = btn.y - _this.ctx.scrollY;
229
+ var inside = x >= btn.x && x <= btn.x + btn.w && y >= by && y <= by + btn.h;
230
+ //@ts-ignore
231
+ if (inside !== body.addRowBtnHover) {
232
+ //@ts-ignore
233
+ body.addRowBtnHover = inside;
234
+ _this.ctx.emit('draw'); // 重画一次即可换色
235
+ }
236
+ if (inside) {
237
+ _this.ctx.stageElement.style.cursor = _this.ctx.config.ADD_ROW_BUTTON_CURSOR;
238
+ return;
239
+ }
240
+ }
205
241
  // 可视区
206
242
  _this.handleBodyEvent(x, y, _this.ctx.body.renderRows, function (cell) {
207
243
  // selection移入移除事件
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "venus-design",
3
- "version": "1.0.5",
3
+ "version": "1.0.7",
4
4
  "description": "venus all compoments",
5
5
  "module": "dist/index.js",
6
6
  "types": "dist/index.d.ts",