stk-table-vue 0.1.0 → 0.2.1

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.
@@ -20,7 +20,7 @@ try {
20
20
  console.error("Cannot get Chrome version", e);
21
21
  }
22
22
  const Is_Legacy_Mode = _chromeVersion < 56;
23
- function useAutoResize({ tableContainer, initVirtualScroll, scrollTo, props, debounceMs }) {
23
+ function useAutoResize({ tableContainer, initVirtualScroll, props, debounceMs }) {
24
24
  let resizeObserver = null;
25
25
  onMounted(() => {
26
26
  initResizeObserver();
@@ -70,6 +70,110 @@ function useAutoResize({ tableContainer, initVirtualScroll, scrollTo, props, deb
70
70
  }, debounceMs);
71
71
  }
72
72
  }
73
+ function insertToOrderedArray(sortState, newItem, targetArray) {
74
+ const { dataIndex, order } = sortState;
75
+ let { sortType } = sortState;
76
+ if (!sortType)
77
+ sortType = typeof newItem[dataIndex];
78
+ const data = [...targetArray];
79
+ if (!order) {
80
+ data.unshift(newItem);
81
+ return data;
82
+ }
83
+ let sIndex = 0;
84
+ let eIndex = data.length - 1;
85
+ const targetVal = newItem[dataIndex];
86
+ while (sIndex <= eIndex) {
87
+ const midIndex = Math.floor((sIndex + eIndex) / 2);
88
+ const midVal = data[midIndex][dataIndex];
89
+ const compareRes = strCompare(midVal, targetVal, sortType);
90
+ if (compareRes === 0) {
91
+ sIndex = midIndex;
92
+ break;
93
+ } else if (compareRes === -1) {
94
+ if (order === "asc")
95
+ sIndex = midIndex + 1;
96
+ else
97
+ eIndex = midIndex - 1;
98
+ } else {
99
+ if (order === "asc")
100
+ eIndex = midIndex - 1;
101
+ else
102
+ sIndex = midIndex + 1;
103
+ }
104
+ }
105
+ data.splice(sIndex, 0, newItem);
106
+ return data;
107
+ }
108
+ function strCompare(a, b, type) {
109
+ if (type === "number") {
110
+ if (+a > +b)
111
+ return 1;
112
+ else if (+a === +b)
113
+ return 0;
114
+ else
115
+ return -1;
116
+ } else {
117
+ return String(a).localeCompare(b);
118
+ }
119
+ }
120
+ function tableSort(sortOption, order, dataSource) {
121
+ if (!(dataSource == null ? void 0 : dataSource.length))
122
+ return dataSource || [];
123
+ let targetDataSource = [...dataSource];
124
+ if (typeof sortOption.sorter === "function") {
125
+ const customSorterData = sortOption.sorter(targetDataSource, { order, column: sortOption });
126
+ if (customSorterData)
127
+ targetDataSource = customSorterData;
128
+ } else if (order) {
129
+ const sortField = sortOption.sortField || sortOption.dataIndex;
130
+ let { sortType } = sortOption;
131
+ if (!sortType)
132
+ sortType = typeof dataSource[0][sortField];
133
+ if (sortType === "number") {
134
+ const nanArr = [];
135
+ const numArr = [];
136
+ for (let i = 0; i < targetDataSource.length; i++) {
137
+ const row = targetDataSource[i];
138
+ if (row[sortField] === null || row[sortField] === "" || typeof row[sortField] === "boolean" || Number.isNaN(+row[sortField])) {
139
+ nanArr.push(row);
140
+ } else {
141
+ numArr.push(row);
142
+ }
143
+ }
144
+ if (order === "asc") {
145
+ numArr.sort((a, b) => +a[sortField] - +b[sortField]);
146
+ targetDataSource = [...nanArr, ...numArr];
147
+ } else {
148
+ numArr.sort((a, b) => +b[sortField] - +a[sortField]);
149
+ targetDataSource = [...numArr, ...nanArr];
150
+ }
151
+ } else {
152
+ if (order === "asc") {
153
+ targetDataSource.sort((a, b) => String(a[sortField]).localeCompare(b[sortField]));
154
+ } else {
155
+ targetDataSource.sort((a, b) => String(a[sortField]).localeCompare(b[sortField]) * -1);
156
+ }
157
+ }
158
+ }
159
+ return targetDataSource;
160
+ }
161
+ function howDeepTheHeader(arr, level = 1) {
162
+ const levels = [level];
163
+ arr.forEach((item) => {
164
+ var _a;
165
+ if ((_a = item.children) == null ? void 0 : _a.length) {
166
+ levels.push(howDeepTheHeader(item.children, level + 1));
167
+ }
168
+ });
169
+ return Math.max(...levels);
170
+ }
171
+ function getColWidth(col) {
172
+ if (typeof (col == null ? void 0 : col.width) === "number") {
173
+ return Math.floor(col.width ?? Default_Col_Width);
174
+ }
175
+ return parseInt((col == null ? void 0 : col.width) ?? Default_Col_Width);
176
+ }
73
177
  function useColResize({
74
178
  tableContainer,
75
179
  tableHeaderLast,
@@ -137,7 +241,7 @@ function useColResize({
137
241
  const { lastCol, startX, startOffsetTableX } = colResizeState;
138
242
  const { clientX } = e;
139
243
  let moveX = clientX - startX;
140
- const currentColWidth = parseInt((lastCol == null ? void 0 : lastCol.width) || Default_Col_Width);
244
+ const currentColWidth = getColWidth(lastCol);
141
245
  if (currentColWidth + moveX < props.colMinWidth) {
142
246
  moveX = -currentColWidth;
143
247
  }
@@ -152,7 +256,7 @@ function useColResize({
152
256
  const { startX, lastCol } = colResizeState;
153
257
  const { clientX } = e;
154
258
  const moveX = clientX - startX;
155
- let width = parseInt((lastCol == null ? void 0 : lastCol.width) || Default_Col_Width) + moveX;
259
+ let width = getColWidth(lastCol) + moveX;
156
260
  if (width < props.colMinWidth)
157
261
  width = props.colMinWidth;
158
262
  const curCol = tableHeaderLast.value.find((it) => colKeyGen(it) === colKeyGen(lastCol));
@@ -190,6 +294,64 @@ function useColResize({
190
294
  onThResizeMouseUp
191
295
  };
192
296
  }
297
+ function useFixedCol({ props, tableHeaderLast, tableContainer }) {
298
+ const fixedShadow = ref({
299
+ showL: false,
300
+ showR: false
301
+ });
302
+ let fixedShadowCols = [];
303
+ function dealFixedColShadow() {
304
+ if (!props.fixedColShadow)
305
+ return;
306
+ fixedShadowCols = [];
307
+ let lastLeftCol = null;
308
+ for (let i = tableHeaderLast.value.length - 1; i >= 0; i--) {
309
+ const col = tableHeaderLast.value[i];
310
+ if (col.fixed === "left") {
311
+ lastLeftCol = col;
312
+ break;
313
+ }
314
+ }
315
+ let node = { __PARENT__: lastLeftCol };
316
+ while (node = node.__PARENT__) {
317
+ if (node.fixed) {
318
+ fixedShadowCols.push(node);
319
+ }
320
+ }
321
+ const lastRightCol = tableHeaderLast.value.find((it) => it.fixed === "right");
322
+ node = { __PARENT__: lastRightCol };
323
+ while (node = node.__PARENT__) {
324
+ if (node.fixed) {
325
+ fixedShadowCols.push(node);
326
+ }
327
+ }
328
+ }
329
+ function getFixedColClass(col) {
330
+ const { showR, showL } = fixedShadow.value;
331
+ const showShadow = props.fixedColShadow && col.fixed && (showL && col.fixed === "left" || showR && col.fixed === "right") && fixedShadowCols.includes(col);
332
+ const classObj = {
333
+ "fixed-cell": col.fixed,
334
+ ["fixed-cell--" + col.fixed]: col.fixed,
335
+ "fixed-cell--shadow": showShadow
336
+ };
337
+ return classObj;
338
+ }
339
+ function updateFixedShadow() {
340
+ if (!props.fixedColShadow)
341
+ return;
342
+ const { clientWidth, scrollWidth, scrollLeft } = tableContainer.value;
343
+ fixedShadow.value.showL = Boolean(scrollLeft);
344
+ fixedShadow.value.showR = Math.abs(scrollWidth - scrollLeft - clientWidth) > 0.5;
345
+ }
346
+ return {
347
+ /** 固定列class */
348
+ getFixedColClass,
349
+ /** 处理固定列阴影 */
350
+ dealFixedColShadow,
351
+ /** 滚动条变化时,更新需要展示阴影的列 */
352
+ updateFixedShadow
353
+ };
354
+ }
193
355
  function useFixedStyle({ props, tableHeaderLast, virtualScroll, virtualScrollX, virtualX_on, virtualX_offsetRight }) {
194
356
  const fixedColumnsPositionStore = computed(() => {
195
357
  const store = {};
@@ -200,7 +362,7 @@ function useFixedStyle({ props, tableHeaderLast, virtualScroll, virtualScrollX,
200
362
  const item = cols[i];
201
363
  if (item.fixed === "left") {
202
364
  store[item.dataIndex] = left;
203
- left += parseInt(item.width || Default_Col_Width);
365
+ left += getColWidth(item);
204
366
  }
205
367
  if (!rightStartIndex && item.fixed === "right") {
206
368
  rightStartIndex = i;
@@ -211,7 +373,7 @@ function useFixedStyle({ props, tableHeaderLast, virtualScroll, virtualScrollX,
211
373
  const item = cols[i];
212
374
  if (item.fixed === "right") {
213
375
  store[item.dataIndex] = right;
214
- right += parseInt(item.width || Default_Col_Width);
376
+ right += getColWidth(item);
215
377
  }
216
378
  }
217
379
  return store;
@@ -413,37 +575,59 @@ function useKeyboardArrowScroll(targetElement, { props, scrollTo, virtualScroll,
413
575
  isMouseOver = true;
414
576
  }
415
577
  }
416
- function useThDrag({ emits }) {
578
+ function useThDrag({ props, emits }) {
417
579
  let dragStartKey = void 0;
580
+ function findParentTH(el) {
581
+ let n = el;
582
+ while (n) {
583
+ if (n.tagName === "TH")
584
+ return n;
585
+ n = n.parentElement;
586
+ }
587
+ }
418
588
  function onThDragStart(e) {
419
- dragStartKey = e.target.dataset.colKey;
589
+ const th = findParentTH(e.target);
590
+ if (!th)
591
+ return;
592
+ dragStartKey = th.dataset.colKey;
420
593
  emits("th-drag-start", dragStartKey);
421
594
  }
422
595
  function onThDragOver(e) {
596
+ const th = findParentTH(e.target);
597
+ if (!th)
598
+ return;
599
+ const isHeaderDraggable2 = th.getAttribute("draggable") === "true";
600
+ if (!isHeaderDraggable2) {
601
+ return;
602
+ }
423
603
  e.preventDefault();
424
604
  }
425
605
  function onThDrop(e) {
426
- let th = e.target;
427
- while (th) {
428
- if (th.tagName === "TH")
429
- break;
430
- th = th.parentNode;
431
- }
606
+ const th = findParentTH(e.target);
607
+ if (!th)
608
+ return;
432
609
  if (dragStartKey !== th.dataset.colKey) {
433
610
  emits("col-order-change", dragStartKey, th.dataset.colKey);
434
611
  }
435
612
  emits("th-drop", th.dataset.colKey);
436
613
  }
614
+ const isHeaderDragFun = typeof props.headerDrag === "function";
615
+ function isHeaderDraggable(col) {
616
+ if (isHeaderDragFun) {
617
+ return props.headerDrag(col);
618
+ } else {
619
+ return props.headerDrag;
620
+ }
621
+ }
437
622
  return {
438
623
  onThDragStart,
439
624
  onThDragOver,
440
- onThDrop
625
+ onThDrop,
626
+ isHeaderDraggable
441
627
  };
442
628
  }
443
- function getCalcWidth(col) {
444
- return parseInt(col.minWidth || col.width || Default_Col_Width);
445
- }
446
- function useVirtualScroll({ tableContainer, props, dataSourceCopy, tableHeaderLast }) {
629
+ const VUE2_SCROLL_TIMEOUT_MS = 200;
630
+ function useVirtualScroll({ props, tableContainer, dataSourceCopy, tableHeaderLast }) {
447
631
  const virtualScroll = ref({
448
632
  containerHeight: 0,
449
633
  rowHeight: props.rowHeight,
@@ -476,7 +660,7 @@ function useVirtualScroll({ tableContainer, props, dataSourceCopy, tableHeaderLa
476
660
  return (dataSourceCopy.value.length - startIndex - virtual_dataSourcePart.value.length) * rowHeight;
477
661
  });
478
662
  const virtualX_on = computed(() => {
479
- return props.virtualX && tableHeaderLast.value.reduce((sum, col) => sum += getCalcWidth(col), 0) > virtualScrollX.value.containerWidth + 100;
663
+ return props.virtualX && tableHeaderLast.value.reduce((sum, col) => sum += getColWidth(col), 0) > virtualScrollX.value.containerWidth + 100;
480
664
  });
481
665
  const virtualX_columnPart = computed(() => {
482
666
  if (virtualX_on.value) {
@@ -505,7 +689,7 @@ function useVirtualScroll({ tableContainer, props, dataSourceCopy, tableHeaderLa
505
689
  for (let i = virtualScrollX.value.endIndex; i < tableHeaderLast.value.length; i++) {
506
690
  const col = tableHeaderLast.value[i];
507
691
  if (col.fixed !== "right") {
508
- width += getCalcWidth(col);
692
+ width += getColWidth(col);
509
693
  }
510
694
  }
511
695
  return width;
@@ -539,23 +723,37 @@ function useVirtualScroll({ tableContainer, props, dataSourceCopy, tableHeaderLa
539
723
  initVirtualScrollY(height);
540
724
  initVirtualScrollX();
541
725
  }
726
+ let vue2ScrollYTimeout = null;
542
727
  function updateVirtualScrollY(sTop = 0) {
543
- const { rowHeight, pageSize } = virtualScroll.value;
728
+ const { rowHeight, pageSize, scrollTop, startIndex: oldStartIndex } = virtualScroll.value;
544
729
  const startIndex = Math.floor(sTop / rowHeight);
730
+ const offsetTop = startIndex * rowHeight;
545
731
  let endIndex = startIndex + pageSize;
546
732
  if (endIndex > dataSourceCopy.value.length) {
547
733
  endIndex = dataSourceCopy.value.length;
548
734
  }
549
- Object.assign(virtualScroll.value, {
550
- startIndex,
551
- offsetTop: startIndex * rowHeight,
552
- // startIndex之前的高度
553
- endIndex
554
- });
735
+ if (vue2ScrollYTimeout) {
736
+ window.clearTimeout(vue2ScrollYTimeout);
737
+ }
738
+ if (!props.optimizeVue2Scroll || sTop <= scrollTop || Math.abs(oldStartIndex - startIndex) >= pageSize) {
739
+ Object.assign(virtualScroll.value, {
740
+ startIndex,
741
+ offsetTop,
742
+ endIndex,
743
+ scrollTop: sTop
744
+ });
745
+ } else {
746
+ Object.assign(virtualScroll.value, { endIndex, scrollTop: sTop });
747
+ vue2ScrollYTimeout = window.setTimeout(() => {
748
+ Object.assign(virtualScroll.value, { startIndex, offsetTop });
749
+ }, VUE2_SCROLL_TIMEOUT_MS);
750
+ }
555
751
  }
752
+ let vue2ScrollXTimeout = null;
556
753
  function updateVirtualScrollX(sLeft = 0) {
557
754
  var _a;
558
755
  const headerLength = (_a = tableHeaderLast.value) == null ? void 0 : _a.length;
756
+ const { scrollLeft } = virtualScrollX.value;
559
757
  if (!headerLength)
560
758
  return;
561
759
  let startIndex = 0;
@@ -566,7 +764,7 @@ function useVirtualScroll({ tableContainer, props, dataSourceCopy, tableHeaderLa
566
764
  const col = tableHeaderLast.value[colIndex];
567
765
  if (col.fixed === "left")
568
766
  continue;
569
- const colWidth = getCalcWidth(col);
767
+ const colWidth = getColWidth(col);
570
768
  colWidthSum += colWidth;
571
769
  if (colWidthSum >= sLeft) {
572
770
  offsetLeft = colWidthSum - colWidth;
@@ -576,9 +774,9 @@ function useVirtualScroll({ tableContainer, props, dataSourceCopy, tableHeaderLa
576
774
  }
577
775
  colWidthSum = 0;
578
776
  let endIndex = headerLength;
579
- for (let colIndex = startIndex; colIndex < headerLength; colIndex++) {
777
+ for (let colIndex = startIndex + 1; colIndex < headerLength; colIndex++) {
580
778
  const col = tableHeaderLast.value[colIndex];
581
- colWidthSum += getCalcWidth(col);
779
+ colWidthSum += getColWidth(col);
582
780
  if (colWidthSum >= virtualScrollX.value.containerWidth) {
583
781
  endIndex = colIndex + 1;
584
782
  break;
@@ -587,7 +785,17 @@ function useVirtualScroll({ tableContainer, props, dataSourceCopy, tableHeaderLa
587
785
  if (endIndex > headerLength) {
588
786
  endIndex = headerLength;
589
787
  }
590
- Object.assign(virtualScrollX.value, { startIndex, endIndex, offsetLeft });
788
+ if (vue2ScrollXTimeout) {
789
+ window.clearTimeout(vue2ScrollXTimeout);
790
+ }
791
+ if (!props.optimizeVue2Scroll || sLeft <= scrollLeft) {
792
+ Object.assign(virtualScrollX.value, { startIndex, endIndex, offsetLeft, scrollLeft: sLeft });
793
+ } else {
794
+ Object.assign(virtualScrollX.value, { endIndex, scrollLeft: sLeft });
795
+ vue2ScrollXTimeout = window.setTimeout(() => {
796
+ Object.assign(virtualScrollX.value, { startIndex, offsetLeft });
797
+ }, VUE2_SCROLL_TIMEOUT_MS);
798
+ }
591
799
  }
592
800
  return {
593
801
  virtualScroll,
@@ -605,114 +813,10 @@ function useVirtualScroll({ tableContainer, props, dataSourceCopy, tableHeaderLa
605
813
  updateVirtualScrollX
606
814
  };
607
815
  }
608
- function insertToOrderedArray(sortState, newItem, targetArray) {
609
- const { dataIndex, order } = sortState;
610
- let { sortType } = sortState;
611
- if (!sortType)
612
- sortType = typeof newItem[dataIndex];
613
- const data = [...targetArray];
614
- if (!order) {
615
- data.unshift(newItem);
616
- return data;
617
- }
618
- let sIndex = 0;
619
- let eIndex = data.length - 1;
620
- const targetVal = newItem[dataIndex];
621
- while (sIndex <= eIndex) {
622
- const midIndex = Math.floor((sIndex + eIndex) / 2);
623
- const midVal = data[midIndex][dataIndex];
624
- const compareRes = strCompare(midVal, targetVal, sortType);
625
- if (compareRes === 0) {
626
- sIndex = midIndex;
627
- break;
628
- } else if (compareRes === -1) {
629
- if (order === "asc")
630
- sIndex = midIndex + 1;
631
- else
632
- eIndex = midIndex - 1;
633
- } else {
634
- if (order === "asc")
635
- eIndex = midIndex - 1;
636
- else
637
- sIndex = midIndex + 1;
638
- }
639
- }
640
- data.splice(sIndex, 0, newItem);
641
- return data;
642
- }
643
- function strCompare(a, b, type) {
644
- if (type === "number") {
645
- if (+a > +b)
646
- return 1;
647
- else if (+a === +b)
648
- return 0;
649
- else
650
- return -1;
651
- } else {
652
- return String(a).localeCompare(b);
653
- }
654
- }
655
- function tableSort(sortOption, order, dataSource) {
656
- if (!(dataSource == null ? void 0 : dataSource.length))
657
- return dataSource || [];
658
- let targetDataSource = [...dataSource];
659
- if (typeof sortOption.sorter === "function") {
660
- const customSorterData = sortOption.sorter(targetDataSource, { order, column: sortOption });
661
- if (customSorterData)
662
- targetDataSource = customSorterData;
663
- } else if (order) {
664
- const sortField = sortOption.sortField || sortOption.dataIndex;
665
- let { sortType } = sortOption;
666
- if (!sortType)
667
- sortType = typeof dataSource[0][sortField];
668
- if (sortType === "number") {
669
- const nanArr = [];
670
- const numArr = [];
671
- for (let i = 0; i < targetDataSource.length; i++) {
672
- const row = targetDataSource[i];
673
- if (row[sortField] === null || row[sortField] === "" || typeof row[sortField] === "boolean" || Number.isNaN(+row[sortField])) {
674
- nanArr.push(row);
675
- } else {
676
- numArr.push(row);
677
- }
678
- }
679
- if (order === "asc") {
680
- numArr.sort((a, b) => +a[sortField] - +b[sortField]);
681
- targetDataSource = [...nanArr, ...numArr];
682
- } else {
683
- numArr.sort((a, b) => +b[sortField] - +a[sortField]);
684
- targetDataSource = [...numArr, ...nanArr];
685
- }
686
- } else {
687
- if (order === "asc") {
688
- targetDataSource.sort((a, b) => String(a[sortField]).localeCompare(b[sortField]));
689
- } else {
690
- targetDataSource.sort((a, b) => String(a[sortField]).localeCompare(b[sortField]) * -1);
691
- }
692
- }
693
- }
694
- return targetDataSource;
695
- }
696
- function howDeepTheHeader(arr, level = 1) {
697
- const levels = [level];
698
- arr.forEach((item) => {
699
- var _a;
700
- if ((_a = item.children) == null ? void 0 : _a.length) {
701
- levels.push(howDeepTheHeader(item.children, level + 1));
702
- }
703
- });
704
- return Math.max(...levels);
705
- }
706
- const _hoisted_1 = {
707
- key: 0
708
- };
816
+ const _hoisted_1 = { key: 0 };
709
817
  const _hoisted_2 = ["data-col-key", "draggable", "rowspan", "colspan", "title", "onClick"];
710
- const _hoisted_3 = {
711
- class: "table-header-cell-wrapper"
712
- };
713
- const _hoisted_4 = {
714
- class: "table-header-title"
715
- };
818
+ const _hoisted_3 = { class: "table-header-cell-wrapper" };
819
+ const _hoisted_4 = { class: "table-header-title" };
716
820
  const _hoisted_5 = {
717
821
  key: 2,
718
822
  class: "table-header-sorter"
@@ -722,155 +826,78 @@ const _hoisted_6 = /* @__PURE__ */ createElementVNode("svg", {
722
826
  width: "16px",
723
827
  height: "16px",
724
828
  viewBox: "0 0 16 16"
725
- }, [/* @__PURE__ */ createElementVNode("polygon", {
726
- class: "arrow-up",
727
- fill: "#757699",
728
- points: "8 2 4.8 6 11.2 6"
729
- }), /* @__PURE__ */ createElementVNode("polygon", {
730
- class: "arrow-down",
731
- transform: "translate(8, 12) rotate(-180) translate(-8, -12) ",
732
- points: "8 10 4.8 14 11.2 14"
733
- })], -1);
734
- const _hoisted_7 = [_hoisted_6];
829
+ }, [
830
+ /* @__PURE__ */ createElementVNode("polygon", {
831
+ class: "arrow-up",
832
+ fill: "#757699",
833
+ points: "8 2 4.8 6 11.2 6"
834
+ }),
835
+ /* @__PURE__ */ createElementVNode("polygon", {
836
+ class: "arrow-down",
837
+ transform: "translate(8, 12) rotate(-180) translate(-8, -12) ",
838
+ points: "8 10 4.8 14 11.2 14"
839
+ })
840
+ ], -1);
841
+ const _hoisted_7 = [
842
+ _hoisted_6
843
+ ];
735
844
  const _hoisted_8 = ["onMousedown"];
736
845
  const _hoisted_9 = ["onMousedown"];
737
846
  const _hoisted_10 = {
738
847
  key: 0,
739
848
  class: "virtual-x-left",
740
- style: {
741
- "padding": "0"
742
- }
849
+ style: { "padding": "0" }
743
850
  };
744
851
  const _hoisted_11 = ["data-row-key", "onClick", "onDblclick", "onContextmenu", "onMouseover"];
745
852
  const _hoisted_12 = {
746
853
  key: 0,
747
854
  class: "virtual-x-left",
748
- style: {
749
- "padding": "0"
750
- }
855
+ style: { "padding": "0" }
751
856
  };
752
857
  const _hoisted_13 = ["data-index", "onClick"];
753
858
  const _hoisted_14 = ["title"];
754
859
  const _sfc_main = /* @__PURE__ */ defineComponent({
755
860
  __name: "StkTable",
756
861
  props: {
757
- width: {
758
- default: ""
759
- },
760
- minWidth: {
761
- default: ""
762
- },
763
- maxWidth: {
764
- default: ""
765
- },
766
- stripe: {
767
- type: Boolean,
768
- default: false
769
- },
770
- fixedMode: {
771
- type: Boolean,
772
- default: false
773
- },
774
- headless: {
775
- type: Boolean,
776
- default: false
777
- },
778
- theme: {
779
- default: "light"
780
- },
781
- rowHeight: {
782
- default: Default_Row_Height
783
- },
784
- headerRowHeight: {
785
- default: null
786
- },
787
- virtual: {
788
- type: Boolean,
789
- default: false
790
- },
791
- virtualX: {
792
- type: Boolean,
793
- default: false
794
- },
795
- columns: {
796
- default: () => []
797
- },
798
- dataSource: {
799
- default: () => []
800
- },
801
- rowKey: {
802
- type: [String, Function],
803
- default: ""
804
- },
805
- colKey: {
806
- type: [String, Function],
807
- default: "dataIndex"
808
- },
809
- emptyCellText: {
810
- default: "--"
811
- },
812
- noDataFull: {
813
- type: Boolean,
814
- default: false
815
- },
816
- showNoData: {
817
- type: Boolean,
818
- default: true
819
- },
820
- sortRemote: {
821
- type: Boolean,
822
- default: false
823
- },
824
- showHeaderOverflow: {
825
- type: Boolean,
826
- default: false
827
- },
828
- showOverflow: {
829
- type: Boolean,
830
- default: false
831
- },
832
- showTrHoverClass: {
833
- type: Boolean,
834
- default: false
835
- },
836
- headerDrag: {
837
- type: Boolean,
838
- default: false
839
- },
840
- rowClassName: {
841
- type: Function,
842
- default: () => ""
843
- },
844
- colResizable: {
845
- type: Boolean,
846
- default: false
847
- },
848
- colMinWidth: {
849
- default: 10
850
- },
851
- bordered: {
852
- type: [Boolean, String],
853
- default: true
854
- },
855
- autoResize: {
856
- type: [Boolean, Function],
857
- default: true
858
- },
859
- fixedColShadow: {
860
- type: Boolean,
861
- default: false
862
- }
862
+ width: { default: "" },
863
+ minWidth: { default: "" },
864
+ maxWidth: { default: "" },
865
+ stripe: { type: Boolean, default: false },
866
+ fixedMode: { type: Boolean, default: false },
867
+ headless: { type: Boolean, default: false },
868
+ theme: { default: "light" },
869
+ rowHeight: { default: Default_Row_Height },
870
+ headerRowHeight: { default: null },
871
+ virtual: { type: Boolean, default: false },
872
+ virtualX: { type: Boolean, default: false },
873
+ columns: { default: () => [] },
874
+ dataSource: { default: () => [] },
875
+ rowKey: { type: [String, Function], default: "" },
876
+ colKey: { type: [String, Function], default: "dataIndex" },
877
+ emptyCellText: { default: "--" },
878
+ noDataFull: { type: Boolean, default: false },
879
+ showNoData: { type: Boolean, default: true },
880
+ sortRemote: { type: Boolean, default: false },
881
+ showHeaderOverflow: { type: Boolean, default: false },
882
+ showOverflow: { type: Boolean, default: false },
883
+ showTrHoverClass: { type: Boolean, default: false },
884
+ headerDrag: { type: [Boolean, Function], default: false },
885
+ rowClassName: { type: Function, default: () => "" },
886
+ colResizable: { type: Boolean, default: false },
887
+ colMinWidth: { default: 10 },
888
+ bordered: { type: [Boolean, String], default: true },
889
+ autoResize: { type: [Boolean, Function], default: true },
890
+ fixedColShadow: { type: Boolean, default: false },
891
+ optimizeVue2Scroll: { type: Boolean, default: false }
863
892
  },
864
893
  emits: ["sort-change", "row-click", "current-change", "row-dblclick", "header-row-menu", "row-menu", "cell-click", "header-cell-click", "scroll", "scroll-x", "col-order-change", "th-drag-start", "th-drop", "update:columns"],
865
- setup(__props, {
866
- expose: __expose,
867
- emit: __emit
868
- }) {
894
+ setup(__props, { expose: __expose, emit: __emit }) {
869
895
  const props = __props;
870
896
  const emits = __emit;
871
897
  const tableContainer = ref();
872
898
  const colResizeIndicator = ref();
873
899
  const currentItem = ref(null);
900
+ const currentItemKey = ref(null);
874
901
  const currentHover = ref(null);
875
902
  let sortCol = ref();
876
903
  let sortOrderIndex = ref(0);
@@ -878,19 +905,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
878
905
  const tableHeaders = ref([]);
879
906
  const tableHeaderLast = ref([]);
880
907
  const dataSourceCopy = shallowRef([...props.dataSource]);
881
- const fixedShadow = ref({
882
- /** 是否展示左侧固定列阴影 */
883
- showL: false,
884
- /** 是否展示右侧固定列阴影 */
885
- showR: false,
886
- /** 保存需要出现阴影的列 */
887
- cols: []
888
- });
889
908
  const rowKeyGenStore = /* @__PURE__ */ new WeakMap();
890
- const {
891
- isColResizing,
892
- onThResizeMouseDown
893
- } = useColResize({
909
+ const { isColResizing, onThResizeMouseDown } = useColResize({
894
910
  props,
895
911
  emits,
896
912
  colKeyGen,
@@ -898,13 +914,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
898
914
  tableContainer,
899
915
  tableHeaderLast
900
916
  });
901
- const {
902
- onThDragStart,
903
- onThDragOver,
904
- onThDrop
905
- } = useThDrag({
906
- emits
907
- });
917
+ const { onThDragStart, onThDragOver, onThDrop, isHeaderDraggable } = useThDrag({ props, emits });
908
918
  const {
909
919
  virtualScroll,
910
920
  virtualScrollX,
@@ -919,15 +929,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
919
929
  initVirtualScrollX,
920
930
  updateVirtualScrollY,
921
931
  updateVirtualScrollX
922
- } = useVirtualScroll({
923
- tableContainer,
924
- props,
925
- dataSourceCopy,
926
- tableHeaderLast
927
- });
928
- const {
929
- getFixedStyle
930
- } = useFixedStyle({
932
+ } = useVirtualScroll({ tableContainer, props, dataSourceCopy, tableHeaderLast });
933
+ const { getFixedStyle } = useFixedStyle({
931
934
  props,
932
935
  tableHeaderLast,
933
936
  virtualScroll,
@@ -935,22 +938,9 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
935
938
  virtualX_on,
936
939
  virtualX_offsetRight
937
940
  });
938
- const {
939
- setHighlightDimCell,
940
- setHighlightDimRow
941
- } = useHighlight({
942
- props,
943
- tableContainer,
944
- rowKeyGen
945
- });
941
+ const { setHighlightDimCell, setHighlightDimRow } = useHighlight({ props, tableContainer, rowKeyGen });
946
942
  if (props.autoResize) {
947
- useAutoResize({
948
- tableContainer,
949
- initVirtualScroll,
950
- scrollTo,
951
- props,
952
- debounceMs: 500
953
- });
943
+ useAutoResize({ tableContainer, initVirtualScroll, props, debounceMs: 200 });
954
944
  }
955
945
  useKeyboardArrowScroll(tableContainer, {
956
946
  props,
@@ -959,31 +949,44 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
959
949
  virtualScrollX,
960
950
  tableHeaders
961
951
  });
962
- watch(() => props.columns, () => {
963
- dealColumns();
964
- initVirtualScrollX();
952
+ const { getFixedColClass, dealFixedColShadow, updateFixedShadow } = useFixedCol({
953
+ props,
954
+ tableContainer,
955
+ tableHeaderLast
965
956
  });
966
- dealColumns();
967
- watch(() => props.dataSource, (val) => {
968
- if (!val) {
969
- console.warn("invalid dataSource");
970
- return;
971
- }
972
- let needInitVirtualScrollY = false;
973
- if (dataSourceCopy.value.length !== val.length) {
974
- needInitVirtualScrollY = true;
957
+ watch(
958
+ () => props.columns,
959
+ () => {
960
+ dealColumns();
961
+ initVirtualScrollX();
975
962
  }
976
- dataSourceCopy.value = [...val];
977
- if (needInitVirtualScrollY)
978
- initVirtualScrollY();
979
- if (sortCol.value) {
980
- const column = tableHeaderLast.value.find((it) => it.dataIndex === sortCol.value);
981
- onColumnSort(column, false);
963
+ );
964
+ dealColumns();
965
+ watch(
966
+ () => props.dataSource,
967
+ (val) => {
968
+ if (!val) {
969
+ console.warn("invalid dataSource");
970
+ return;
971
+ }
972
+ let needInitVirtualScrollY = false;
973
+ if (dataSourceCopy.value.length !== val.length) {
974
+ needInitVirtualScrollY = true;
975
+ }
976
+ dataSourceCopy.value = [...val];
977
+ if (needInitVirtualScrollY)
978
+ initVirtualScrollY();
979
+ if (sortCol.value) {
980
+ const column = tableHeaderLast.value.find((it) => it.dataIndex === sortCol.value);
981
+ onColumnSort(column, false);
982
+ }
983
+ updateFixedShadow();
984
+ },
985
+ {
986
+ deep: false
982
987
  }
983
- updateFixedShadow();
984
- }, {
985
- deep: false
986
- });
988
+ );
989
+ watch(() => props.fixedColShadow, dealFixedColShadow);
987
990
  onMounted(() => {
988
991
  initVirtualScroll();
989
992
  updateFixedShadow();
@@ -1032,50 +1035,9 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
1032
1035
  tableHeaderLast.value = tempHeaderLast;
1033
1036
  dealFixedColShadow();
1034
1037
  }
1035
- function dealFixedColShadow() {
1036
- if (!props.fixedColShadow)
1037
- return;
1038
- fixedShadow.value.cols = [];
1039
- const lastLeftCol = tableHeaderLast.value.findLast((it) => it.fixed === "left");
1040
- const lastRightCol = tableHeaderLast.value.find((it) => it.fixed === "right");
1041
- let node = {
1042
- __PARENT__: lastLeftCol
1043
- };
1044
- while (node = node.__PARENT__) {
1045
- if (node.fixed) {
1046
- fixedShadow.value.cols.push(node);
1047
- }
1048
- }
1049
- node = {
1050
- __PARENT__: lastRightCol
1051
- };
1052
- while (node = node.__PARENT__) {
1053
- if (node.fixed) {
1054
- fixedShadow.value.cols.push(node);
1055
- }
1056
- }
1057
- }
1058
- function getFixedColClass(col) {
1059
- const {
1060
- showR,
1061
- showL,
1062
- cols
1063
- } = fixedShadow.value;
1064
- const classArr = [col.fixed ? "fixed-cell" : "", col.fixed ? "fixed-cell--" + col.fixed : "", props.fixedColShadow && col.fixed && (showL && col.fixed === "left" || showR && col.fixed === "right") && cols.includes(col) ? "fixed-cell--shadow" : ""];
1065
- return classArr;
1066
- }
1067
- function updateFixedShadow() {
1068
- if (!props.fixedColShadow)
1069
- return;
1070
- const {
1071
- clientWidth,
1072
- scrollWidth,
1073
- scrollLeft
1074
- } = tableContainer.value;
1075
- fixedShadow.value.showL = Boolean(scrollLeft);
1076
- fixedShadow.value.showR = Math.abs(scrollWidth - scrollLeft - clientWidth) > 0.5;
1077
- }
1078
1038
  function rowKeyGen(row) {
1039
+ if (!row)
1040
+ return;
1079
1041
  let key = rowKeyGenStore.get(row);
1080
1042
  if (!key) {
1081
1043
  key = typeof props.rowKey === "function" ? props.rowKey(row) : row[props.rowKey];
@@ -1116,11 +1078,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
1116
1078
  function onColumnSort(col, click = true, options = {}) {
1117
1079
  if (!(col == null ? void 0 : col.sorter))
1118
1080
  return;
1119
- options = {
1120
- force: false,
1121
- emit: false,
1122
- ...options
1123
- };
1081
+ options = { force: false, emit: false, ...options };
1124
1082
  if (sortCol.value !== col.dataIndex) {
1125
1083
  sortCol.value = col.dataIndex;
1126
1084
  sortOrderIndex.value = 0;
@@ -1138,9 +1096,10 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
1138
1096
  }
1139
1097
  function onRowClick(e, row) {
1140
1098
  emits("row-click", e, row);
1141
- if (currentItem.value === row)
1099
+ if (props.rowKey ? currentItemKey.value === rowKeyGen(row) : currentItem.value === row)
1142
1100
  return;
1143
1101
  currentItem.value = row;
1102
+ currentItemKey.value = rowKeyGen(row);
1144
1103
  emits("current-change", e, row);
1145
1104
  }
1146
1105
  function onRowDblclick(e, row) {
@@ -1168,37 +1127,24 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
1168
1127
  function onTableScroll(e) {
1169
1128
  if (!(e == null ? void 0 : e.target))
1170
1129
  return;
1171
- const {
1172
- scrollTop,
1173
- scrollLeft
1174
- } = e.target;
1175
- const {
1176
- scrollTop: vScrollTop,
1177
- startIndex,
1178
- endIndex
1179
- } = virtualScroll.value;
1180
- const {
1181
- scrollLeft: vScrollLeft
1182
- } = virtualScrollX.value;
1130
+ const { scrollTop, scrollLeft } = e.target;
1131
+ const { scrollTop: vScrollTop } = virtualScroll.value;
1132
+ const { scrollLeft: vScrollLeft } = virtualScrollX.value;
1183
1133
  const isYScroll = scrollTop !== vScrollTop;
1184
1134
  const isXScroll = scrollLeft !== vScrollLeft;
1185
- if (isYScroll) {
1186
- virtualScroll.value.scrollTop = scrollTop;
1187
- }
1188
- if (virtual_on.value) {
1135
+ if (isYScroll && virtual_on.value) {
1189
1136
  updateVirtualScrollY(scrollTop);
1190
1137
  }
1191
1138
  if (isXScroll) {
1192
- virtualScrollX.value.scrollLeft = scrollLeft;
1193
1139
  updateFixedShadow();
1140
+ if (virtualX_on.value) {
1141
+ updateVirtualScrollX(scrollLeft);
1142
+ } else {
1143
+ virtualScrollX.value.scrollLeft = scrollLeft;
1144
+ }
1194
1145
  }
1195
- if (virtualX_on.value) {
1196
- updateVirtualScrollX(scrollLeft);
1197
- }
1198
- const data = {
1199
- startIndex,
1200
- endIndex
1201
- };
1146
+ const { startIndex, endIndex } = virtualScroll.value;
1147
+ const data = { startIndex, endIndex };
1202
1148
  if (isYScroll) {
1203
1149
  emits("scroll", e, data);
1204
1150
  }
@@ -1211,33 +1157,24 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
1211
1157
  currentHover.value = rowKeyGen(row);
1212
1158
  }
1213
1159
  }
1214
- function setCurrentRow(rowKey, option = {
1215
- silent: false
1216
- }) {
1160
+ function setCurrentRow(rowKey, option = { silent: false }) {
1217
1161
  if (!dataSourceCopy.value.length)
1218
1162
  return;
1219
1163
  currentItem.value = dataSourceCopy.value.find((it) => rowKeyGen(it) === rowKey);
1164
+ currentItemKey.value = rowKeyGen(currentItem.value);
1220
1165
  if (!option.silent) {
1221
1166
  emits("current-change", null, currentItem.value);
1222
1167
  }
1223
1168
  }
1224
1169
  function setSorter(dataIndex, order, option = {}) {
1225
1170
  var _a;
1226
- const newOption = {
1227
- silent: true,
1228
- sortOption: null,
1229
- sort: true,
1230
- ...option
1231
- };
1171
+ const newOption = { silent: true, sortOption: null, sort: true, ...option };
1232
1172
  sortCol.value = dataIndex;
1233
1173
  sortOrderIndex.value = sortSwitchOrder.findIndex((it) => it === order);
1234
1174
  if (newOption.sort && ((_a = dataSourceCopy.value) == null ? void 0 : _a.length)) {
1235
1175
  const column = newOption.sortOption || tableHeaderLast.value.find((it) => it.dataIndex === sortCol.value);
1236
1176
  if (column)
1237
- onColumnSort(column, false, {
1238
- force: true,
1239
- emit: !newOption.silent
1240
- });
1177
+ onColumnSort(column, false, { force: true, emit: !newOption.silent });
1241
1178
  else
1242
1179
  console.warn("Can not find column by dataIndex:", sortCol.value);
1243
1180
  }
@@ -1259,6 +1196,12 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
1259
1196
  function getTableData() {
1260
1197
  return toRaw(dataSourceCopy.value);
1261
1198
  }
1199
+ function getSortColumns() {
1200
+ const sortOrder = sortSwitchOrder[sortOrderIndex.value];
1201
+ if (!sortOrder)
1202
+ return [];
1203
+ return [{ dataIndex: sortCol.value, order: sortOrder }];
1204
+ }
1262
1205
  __expose({
1263
1206
  /** 初始化横向纵向虚拟滚动 */
1264
1207
  initVirtualScroll,
@@ -1274,6 +1217,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
1274
1217
  setHighlightDimRow,
1275
1218
  /** 表格排序列dataIndex */
1276
1219
  sortCol,
1220
+ /** 获取当前排序状态 */
1221
+ getSortColumns,
1277
1222
  /** 设置排序 */
1278
1223
  setSorter,
1279
1224
  /** 重置排序 */
@@ -1300,137 +1245,173 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
1300
1245
  "border-body-v": props.bordered === "body-v",
1301
1246
  stripe: props.stripe
1302
1247
  }]),
1303
- style: normalizeStyle(_ctx.virtual && {
1304
- "--row-height": unref(virtualScroll).rowHeight + "px",
1305
- "--header-row-height": (props.headerRowHeight || props.rowHeight) + "px"
1306
- }),
1248
+ style: normalizeStyle(
1249
+ _ctx.virtual && {
1250
+ "--row-height": unref(virtualScroll).rowHeight + "px",
1251
+ "--header-row-height": (props.headerRowHeight || props.rowHeight) + "px"
1252
+ }
1253
+ ),
1307
1254
  onScroll: onTableScroll,
1308
1255
  onWheel: onTableWheel
1309
- }, [withDirectives(createElementVNode("div", {
1310
- ref_key: "colResizeIndicator",
1311
- ref: colResizeIndicator,
1312
- class: "column-resize-indicator"
1313
- }, null, 512), [[vShow, _ctx.colResizable]]), createElementVNode("table", {
1314
- class: normalizeClass(["stk-table-main", {
1315
- "fixed-mode": props.fixedMode
1316
- }]),
1317
- style: normalizeStyle({
1318
- width: _ctx.width,
1319
- minWidth: _ctx.minWidth,
1320
- maxWidth: _ctx.maxWidth
1321
- })
1322
- }, [!_ctx.headless ? (openBlock(), createElementBlock("thead", _hoisted_1, [(openBlock(true), createElementBlock(Fragment, null, renderList(tableHeaders.value, (row, rowIndex) => {
1323
- return openBlock(), createElementBlock("tr", {
1324
- key: rowIndex,
1325
- onContextmenu: _cache[3] || (_cache[3] = (e) => onHeaderMenu(e))
1326
- }, [unref(virtualX_on) ? (openBlock(), createElementBlock("th", {
1256
+ }, [
1257
+ withDirectives(createElementVNode("div", {
1258
+ ref_key: "colResizeIndicator",
1259
+ ref: colResizeIndicator,
1260
+ class: "column-resize-indicator"
1261
+ }, null, 512), [
1262
+ [vShow, _ctx.colResizable]
1263
+ ]),
1264
+ createElementVNode("table", {
1265
+ class: normalizeClass(["stk-table-main", {
1266
+ "fixed-mode": props.fixedMode
1267
+ }]),
1268
+ style: normalizeStyle({ width: _ctx.width, minWidth: _ctx.minWidth, maxWidth: _ctx.maxWidth })
1269
+ }, [
1270
+ !_ctx.headless ? (openBlock(), createElementBlock("thead", _hoisted_1, [
1271
+ (openBlock(true), createElementBlock(Fragment, null, renderList(tableHeaders.value, (row, rowIndex) => {
1272
+ return openBlock(), createElementBlock("tr", {
1273
+ key: rowIndex,
1274
+ onContextmenu: _cache[3] || (_cache[3] = (e) => onHeaderMenu(e))
1275
+ }, [
1276
+ unref(virtualX_on) ? (openBlock(), createElementBlock("th", {
1277
+ key: 0,
1278
+ class: "virtual-x-left",
1279
+ style: normalizeStyle({
1280
+ minWidth: unref(virtualScrollX).offsetLeft + "px",
1281
+ width: unref(virtualScrollX).offsetLeft + "px"
1282
+ })
1283
+ }, null, 4)) : createCommentVNode("", true),
1284
+ (openBlock(true), createElementBlock(Fragment, null, renderList(unref(virtualX_on) && rowIndex === tableHeaders.value.length - 1 ? unref(virtualX_columnPart) : row, (col, colIndex) => {
1285
+ return openBlock(), createElementBlock("th", {
1286
+ key: col.dataIndex,
1287
+ "data-col-key": colKeyGen(col),
1288
+ draggable: unref(isHeaderDraggable)(col) ? "true" : "false",
1289
+ rowspan: unref(virtualX_on) ? 1 : col.rowSpan,
1290
+ colspan: col.colSpan,
1291
+ style: normalizeStyle(getCellStyle(1, col, rowIndex)),
1292
+ title: col.title,
1293
+ class: normalizeClass([
1294
+ col.sorter ? "sortable" : "",
1295
+ col.dataIndex === unref(sortCol) && unref(sortOrderIndex) !== 0 && "sorter-" + sortSwitchOrder[unref(sortOrderIndex)],
1296
+ _ctx.showHeaderOverflow ? "text-overflow" : "",
1297
+ col.headerClassName,
1298
+ unref(getFixedColClass)(col)
1299
+ ]),
1300
+ onClick: (e) => {
1301
+ onColumnSort(col);
1302
+ onHeaderCellClick(e, col);
1303
+ },
1304
+ onDragstart: _cache[0] || (_cache[0] = //@ts-ignore
1305
+ (...args) => unref(onThDragStart) && unref(onThDragStart)(...args)),
1306
+ onDrop: _cache[1] || (_cache[1] = //@ts-ignore
1307
+ (...args) => unref(onThDrop) && unref(onThDrop)(...args)),
1308
+ onDragover: _cache[2] || (_cache[2] = //@ts-ignore
1309
+ (...args) => unref(onThDragOver) && unref(onThDragOver)(...args))
1310
+ }, [
1311
+ createElementVNode("div", _hoisted_3, [
1312
+ col.customHeaderCell ? (openBlock(), createBlock(resolveDynamicComponent(col.customHeaderCell), {
1313
+ key: 0,
1314
+ col
1315
+ }, null, 8, ["col"])) : renderSlot(_ctx.$slots, "tableHeader", {
1316
+ key: 1,
1317
+ col
1318
+ }, () => [
1319
+ createElementVNode("span", _hoisted_4, toDisplayString(col.title), 1)
1320
+ ]),
1321
+ col.sorter ? (openBlock(), createElementBlock("span", _hoisted_5, _hoisted_7)) : createCommentVNode("", true),
1322
+ _ctx.colResizable && colIndex > 0 ? (openBlock(), createElementBlock("div", {
1323
+ key: 3,
1324
+ class: "table-header-resizer left",
1325
+ onMousedown: (e) => unref(onThResizeMouseDown)(e, col, true)
1326
+ }, null, 40, _hoisted_8)) : createCommentVNode("", true),
1327
+ _ctx.colResizable ? (openBlock(), createElementBlock("div", {
1328
+ key: 4,
1329
+ class: "table-header-resizer right",
1330
+ onMousedown: (e) => unref(onThResizeMouseDown)(e, col)
1331
+ }, null, 40, _hoisted_9)) : createCommentVNode("", true)
1332
+ ])
1333
+ ], 46, _hoisted_2);
1334
+ }), 128)),
1335
+ unref(virtualX_on) ? (openBlock(), createElementBlock("th", {
1336
+ key: 1,
1337
+ class: "virtual-x-right",
1338
+ style: normalizeStyle({
1339
+ minWidth: unref(virtualX_offsetRight) + "px",
1340
+ width: unref(virtualX_offsetRight) + "px"
1341
+ })
1342
+ }, null, 4)) : createCommentVNode("", true)
1343
+ ], 32);
1344
+ }), 128))
1345
+ ])) : createCommentVNode("", true),
1346
+ createElementVNode("tbody", null, [
1347
+ unref(virtual_on) ? (openBlock(), createElementBlock("tr", {
1348
+ key: 0,
1349
+ style: normalizeStyle({ height: `${unref(virtualScroll).offsetTop}px` }),
1350
+ class: "padding-top-tr"
1351
+ }, [
1352
+ unref(virtualX_on) && _ctx.fixedMode && _ctx.headless ? (openBlock(), createElementBlock("td", _hoisted_10)) : createCommentVNode("", true),
1353
+ _ctx.fixedMode && _ctx.headless ? (openBlock(true), createElementBlock(Fragment, { key: 1 }, renderList(unref(virtualX_columnPart), (col) => {
1354
+ return openBlock(), createElementBlock("td", {
1355
+ key: col.dataIndex,
1356
+ style: normalizeStyle(getCellStyle(2, col))
1357
+ }, null, 4);
1358
+ }), 128)) : createCommentVNode("", true)
1359
+ ], 4)) : createCommentVNode("", true),
1360
+ (openBlock(true), createElementBlock(Fragment, null, renderList(unref(virtual_dataSourcePart), (row, i) => {
1361
+ return openBlock(), createElementBlock("tr", {
1362
+ key: _ctx.rowKey ? rowKeyGen(row) : i,
1363
+ "data-row-key": _ctx.rowKey ? rowKeyGen(row) : i,
1364
+ class: normalizeClass({
1365
+ active: _ctx.rowKey ? rowKeyGen(row) === rowKeyGen(currentItem.value) : row === currentItem.value,
1366
+ hover: _ctx.rowKey ? rowKeyGen(row) === currentHover.value : row === currentHover.value,
1367
+ [_ctx.rowClassName(row, i)]: true
1368
+ }),
1369
+ style: normalizeStyle({
1370
+ backgroundColor: row._bgc
1371
+ }),
1372
+ onClick: (e) => onRowClick(e, row),
1373
+ onDblclick: (e) => onRowDblclick(e, row),
1374
+ onContextmenu: (e) => onRowMenu(e, row),
1375
+ onMouseover: (e) => onTrMouseOver(e, row)
1376
+ }, [
1377
+ unref(virtualX_on) ? (openBlock(), createElementBlock("td", _hoisted_12)) : createCommentVNode("", true),
1378
+ (openBlock(true), createElementBlock(Fragment, null, renderList(unref(virtualX_columnPart), (col) => {
1379
+ return openBlock(), createElementBlock("td", {
1380
+ key: col.dataIndex,
1381
+ "data-index": col.dataIndex,
1382
+ class: normalizeClass([col.className, _ctx.showOverflow ? "text-overflow" : "", unref(getFixedColClass)(col)]),
1383
+ style: normalizeStyle(getCellStyle(2, col)),
1384
+ onClick: (e) => onCellClick(e, row, col)
1385
+ }, [
1386
+ col.customCell ? (openBlock(), createBlock(resolveDynamicComponent(col.customCell), {
1387
+ key: 0,
1388
+ col,
1389
+ row,
1390
+ "cell-value": row[col.dataIndex]
1391
+ }, null, 8, ["col", "row", "cell-value"])) : (openBlock(), createElementBlock("div", {
1392
+ key: 1,
1393
+ class: "table-cell-wrapper",
1394
+ title: row[col.dataIndex]
1395
+ }, toDisplayString(row[col.dataIndex] ?? _ctx.emptyCellText), 9, _hoisted_14))
1396
+ ], 14, _hoisted_13);
1397
+ }), 128))
1398
+ ], 46, _hoisted_11);
1399
+ }), 128)),
1400
+ unref(virtual_on) ? (openBlock(), createElementBlock("tr", {
1401
+ key: 1,
1402
+ style: normalizeStyle({ height: `${unref(virtual_offsetBottom)}px` })
1403
+ }, null, 4)) : createCommentVNode("", true)
1404
+ ])
1405
+ ], 6),
1406
+ (!dataSourceCopy.value || !dataSourceCopy.value.length) && _ctx.showNoData ? (openBlock(), createElementBlock("div", {
1327
1407
  key: 0,
1328
- class: "virtual-x-left",
1329
- style: normalizeStyle({
1330
- minWidth: unref(virtualScrollX).offsetLeft + "px",
1331
- width: unref(virtualScrollX).offsetLeft + "px"
1332
- })
1333
- }, null, 4)) : createCommentVNode("", true), (openBlock(true), createElementBlock(Fragment, null, renderList(unref(virtualX_on) && rowIndex === tableHeaders.value.length - 1 ? unref(virtualX_columnPart) : row, (col, colIndex) => {
1334
- return openBlock(), createElementBlock("th", {
1335
- key: col.dataIndex,
1336
- "data-col-key": colKeyGen(col),
1337
- draggable: _ctx.headerDrag ? "true" : "false",
1338
- rowspan: unref(virtualX_on) ? 1 : col.rowSpan,
1339
- colspan: col.colSpan,
1340
- style: normalizeStyle(getCellStyle(1, col, rowIndex)),
1341
- title: col.title,
1342
- class: normalizeClass([col.sorter ? "sortable" : "", col.dataIndex === unref(sortCol) && unref(sortOrderIndex) !== 0 && "sorter-" + sortSwitchOrder[unref(sortOrderIndex)], _ctx.showHeaderOverflow ? "text-overflow" : "", col.headerClassName, ...getFixedColClass(col)]),
1343
- onClick: (e) => {
1344
- onColumnSort(col);
1345
- onHeaderCellClick(e, col);
1346
- },
1347
- onDragstart: _cache[0] || (_cache[0] = //@ts-ignore
1348
- (...args) => unref(onThDragStart) && unref(onThDragStart)(...args)),
1349
- onDrop: _cache[1] || (_cache[1] = //@ts-ignore
1350
- (...args) => unref(onThDrop) && unref(onThDrop)(...args)),
1351
- onDragover: _cache[2] || (_cache[2] = //@ts-ignore
1352
- (...args) => unref(onThDragOver) && unref(onThDragOver)(...args))
1353
- }, [createElementVNode("div", _hoisted_3, [col.customHeaderCell ? (openBlock(), createBlock(resolveDynamicComponent(col.customHeaderCell), {
1354
- key: 0,
1355
- col
1356
- }, null, 8, ["col"])) : renderSlot(_ctx.$slots, "tableHeader", {
1357
- key: 1,
1358
- col
1359
- }, () => [createElementVNode("span", _hoisted_4, toDisplayString(col.title), 1)]), col.sorter ? (openBlock(), createElementBlock("span", _hoisted_5, _hoisted_7)) : createCommentVNode("", true), _ctx.colResizable && colIndex > 0 ? (openBlock(), createElementBlock("div", {
1360
- key: 3,
1361
- class: "table-header-resizer left",
1362
- onMousedown: (e) => unref(onThResizeMouseDown)(e, col, true)
1363
- }, null, 40, _hoisted_8)) : createCommentVNode("", true), _ctx.colResizable ? (openBlock(), createElementBlock("div", {
1364
- key: 4,
1365
- class: "table-header-resizer right",
1366
- onMousedown: (e) => unref(onThResizeMouseDown)(e, col)
1367
- }, null, 40, _hoisted_9)) : createCommentVNode("", true)])], 46, _hoisted_2);
1368
- }), 128)), unref(virtualX_on) ? (openBlock(), createElementBlock("th", {
1369
- key: 1,
1370
- class: "virtual-x-right",
1371
- style: normalizeStyle({
1372
- minWidth: unref(virtualX_offsetRight) + "px",
1373
- width: unref(virtualX_offsetRight) + "px"
1374
- })
1375
- }, null, 4)) : createCommentVNode("", true)], 32);
1376
- }), 128))])) : createCommentVNode("", true), createElementVNode("tbody", null, [unref(virtual_on) ? (openBlock(), createElementBlock("tr", {
1377
- key: 0,
1378
- style: normalizeStyle({
1379
- height: `${unref(virtualScroll).offsetTop}px`
1380
- }),
1381
- class: "padding-top-tr"
1382
- }, [unref(virtualX_on) && _ctx.fixedMode && _ctx.headless ? (openBlock(), createElementBlock("td", _hoisted_10)) : createCommentVNode("", true), _ctx.fixedMode && _ctx.headless ? (openBlock(true), createElementBlock(Fragment, {
1383
- key: 1
1384
- }, renderList(unref(virtualX_columnPart), (col) => {
1385
- return openBlock(), createElementBlock("td", {
1386
- key: col.dataIndex,
1387
- style: normalizeStyle(getCellStyle(2, col))
1388
- }, null, 4);
1389
- }), 128)) : createCommentVNode("", true)], 4)) : createCommentVNode("", true), (openBlock(true), createElementBlock(Fragment, null, renderList(unref(virtual_dataSourcePart), (row, i) => {
1390
- return openBlock(), createElementBlock("tr", {
1391
- key: _ctx.rowKey ? rowKeyGen(row) : i,
1392
- "data-row-key": _ctx.rowKey ? rowKeyGen(row) : i,
1393
- class: normalizeClass({
1394
- active: _ctx.rowKey ? rowKeyGen(row) === (currentItem.value && rowKeyGen(currentItem.value)) : row === currentItem.value,
1395
- hover: _ctx.rowKey ? rowKeyGen(row) === currentHover.value : row === currentHover.value,
1396
- [_ctx.rowClassName(row, i)]: true
1397
- }),
1398
- style: normalizeStyle({
1399
- backgroundColor: row._bgc
1400
- }),
1401
- onClick: (e) => onRowClick(e, row),
1402
- onDblclick: (e) => onRowDblclick(e, row),
1403
- onContextmenu: (e) => onRowMenu(e, row),
1404
- onMouseover: (e) => onTrMouseOver(e, row)
1405
- }, [unref(virtualX_on) ? (openBlock(), createElementBlock("td", _hoisted_12)) : createCommentVNode("", true), (openBlock(true), createElementBlock(Fragment, null, renderList(unref(virtualX_columnPart), (col) => {
1406
- return openBlock(), createElementBlock("td", {
1407
- key: col.dataIndex,
1408
- "data-index": col.dataIndex,
1409
- class: normalizeClass([col.className, _ctx.showOverflow ? "text-overflow" : "", ...getFixedColClass(col)]),
1410
- style: normalizeStyle(getCellStyle(2, col)),
1411
- onClick: (e) => onCellClick(e, row, col)
1412
- }, [col.customCell ? (openBlock(), createBlock(resolveDynamicComponent(col.customCell), {
1413
- key: 0,
1414
- col,
1415
- row,
1416
- "cell-value": row[col.dataIndex]
1417
- }, null, 8, ["col", "row", "cell-value"])) : (openBlock(), createElementBlock("div", {
1418
- key: 1,
1419
- class: "table-cell-wrapper",
1420
- title: row[col.dataIndex]
1421
- }, toDisplayString(row[col.dataIndex] ?? _ctx.emptyCellText), 9, _hoisted_14))], 14, _hoisted_13);
1422
- }), 128))], 46, _hoisted_11);
1423
- }), 128)), unref(virtual_on) ? (openBlock(), createElementBlock("tr", {
1424
- key: 1,
1425
- style: normalizeStyle({
1426
- height: `${unref(virtual_offsetBottom)}px`
1427
- })
1428
- }, null, 4)) : createCommentVNode("", true)])], 6), (!dataSourceCopy.value || !dataSourceCopy.value.length) && _ctx.showNoData ? (openBlock(), createElementBlock("div", {
1429
- key: 0,
1430
- class: normalizeClass(["stk-table-no-data", {
1431
- "no-data-full": _ctx.noDataFull
1432
- }])
1433
- }, [renderSlot(_ctx.$slots, "empty", {}, () => [createTextVNode("暂无数据")])], 2)) : createCommentVNode("", true)], 38);
1408
+ class: normalizeClass(["stk-table-no-data", { "no-data-full": _ctx.noDataFull }])
1409
+ }, [
1410
+ renderSlot(_ctx.$slots, "empty", {}, () => [
1411
+ createTextVNode("暂无数据")
1412
+ ])
1413
+ ], 2)) : createCommentVNode("", true)
1414
+ ], 38);
1434
1415
  };
1435
1416
  }
1436
1417
  });