bkui-vue 0.0.1-beta.41 → 0.0.1-beta.44

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.
Files changed (65) hide show
  1. package/dist/index.cjs.js +20 -20
  2. package/dist/index.esm.js +193 -43
  3. package/dist/index.umd.js +20 -20
  4. package/dist/style.css +1 -1
  5. package/lib/alert/alert.variable.css +1 -0
  6. package/lib/backtop/backtop.variable.css +1 -0
  7. package/lib/badge/badge.variable.css +1 -0
  8. package/lib/breadcrumb/breadcrumb.variable.css +1 -0
  9. package/lib/button/button.variable.css +1 -0
  10. package/lib/card/card.variable.css +1 -0
  11. package/lib/checkbox/checkbox.variable.css +1 -0
  12. package/lib/code-diff/code-diff.js +1 -1
  13. package/lib/code-diff/code-diff.variable.css +1 -0
  14. package/lib/date-picker/date-picker.variable.css +1 -0
  15. package/lib/divider/divider.variable.css +1 -0
  16. package/lib/dropdown/dropdown.variable.css +1 -0
  17. package/lib/exception/exception.variable.css +1 -0
  18. package/lib/fixed-navbar/fixed-navbar.variable.css +1 -0
  19. package/lib/form/form.css +1 -0
  20. package/lib/form/form.js +1 -1
  21. package/lib/form/form.less +1 -0
  22. package/lib/form/form.variable.css +1 -0
  23. package/lib/input/input.css +3 -3
  24. package/lib/input/input.less +3 -3
  25. package/lib/input/input.variable.css +4 -3
  26. package/lib/link/link.variable.css +1 -0
  27. package/lib/loading/loading.variable.css +1 -0
  28. package/lib/menu/menu.variable.css +1 -0
  29. package/lib/menu/submenu.variable.css +1 -0
  30. package/lib/message/message.css +11 -2
  31. package/lib/message/message.js +1 -1
  32. package/lib/message/message.less +12 -1
  33. package/lib/message/message.variable.css +12 -2
  34. package/lib/message/messageConstructor.d.ts +37 -4
  35. package/lib/navigation/navigation.variable.css +1 -0
  36. package/lib/notify/notify.js +1 -1
  37. package/lib/notify/notify.variable.css +1 -0
  38. package/lib/pagination/pagination.variable.css +1 -0
  39. package/lib/popover/popover.variable.css +1 -0
  40. package/lib/process/process.variable.css +1 -0
  41. package/lib/progress/progress.variable.css +1 -0
  42. package/lib/radio/radio.variable.css +1 -0
  43. package/lib/resize-layout/resize-layout.variable.css +1 -0
  44. package/lib/select/select.variable.css +1 -0
  45. package/lib/sideslider/sideslider.variable.css +1 -0
  46. package/lib/slider/slider.variable.css +1 -0
  47. package/lib/steps/steps.variable.css +1 -0
  48. package/lib/styles/themes/themes.less +1 -0
  49. package/lib/switcher/switcher.variable.css +1 -0
  50. package/lib/tab/tab.variable.css +1 -0
  51. package/lib/table/index.d.ts +4 -0
  52. package/lib/table/props.d.ts +20 -1
  53. package/lib/table/render.d.ts +32 -0
  54. package/lib/table/table.css +29 -3
  55. package/lib/table/table.d.ts +2 -0
  56. package/lib/table/table.js +1 -1
  57. package/lib/table/table.less +31 -5
  58. package/lib/table/table.variable.css +32 -5
  59. package/lib/table/utils.d.ts +13 -0
  60. package/lib/tag/tag.variable.css +1 -0
  61. package/lib/tag-input/tag-input.variable.css +1 -0
  62. package/lib/timeline/timeline.variable.css +1 -0
  63. package/lib/transfer/transfer.variable.css +1 -0
  64. package/lib/tree/tree.variable.css +1 -0
  65. package/package.json +2 -2
package/dist/index.esm.js CHANGED
@@ -2370,29 +2370,38 @@ bkIcon.inheritAttrs = false;
2370
2370
  bkIcon.displayName = "bkIcon";
2371
2371
  JSON.parse('{"type":"element","name":"svg","attributes":{"xmlns":"http://www.w3.org/2000/svg","viewBox":"0 0 1024 1024","style":"width: 1em; height: 1em; vertical-align: middle;fill: currentColor;overflow: hidden;"},"elements":[{"type":"element","name":"path","attributes":{"d":"M512 744.64L789.6 462.72 880 554.56 512 928 144 554.56 234.4 462.72 512 744.64z"}},{"type":"element","name":"path","attributes":{"d":"M144 187.68L234.4 96 512 377.76 789.6 96 880 187.68 512 561.28 144 187.68z"}}]}');
2372
2372
  JSON.parse('{"type":"element","name":"svg","attributes":{"xmlns":"http://www.w3.org/2000/svg","viewBox":"0 0 1024 1024","style":"width: 1em; height: 1em; vertical-align: middle;fill: currentColor;overflow: hidden;"},"elements":[{"type":"element","name":"path","attributes":{"d":"M279.36 512L561.28 789.6 469.44 880 96 512 469.44 144 561.28 234.4 279.36 512z"}},{"type":"element","name":"path","attributes":{"d":"M836.32 144L928 234.4 646.08 512 928 789.6 836.32 880 462.72 512 836.32 144z"}}]}');
2373
- const data$w = JSON.parse('{"type":"element","name":"svg","attributes":{"xmlns":"http://www.w3.org/2000/svg","viewBox":"0 0 1024 1024","style":"width: 1em; height: 1em; vertical-align: middle;fill: currentColor;overflow: hidden;"},"elements":[{"type":"element","name":"path","attributes":{"d":"M697.6 281.6l48 48-176 176 176 176-48 48-224-224L697.6 281.6z"}},{"type":"element","name":"path","attributes":{"d":"M505.6 281.6l48 48-176 176 176 176-48 48-224-224L505.6 281.6z"}}]}');
2373
+ const data$x = JSON.parse('{"type":"element","name":"svg","attributes":{"xmlns":"http://www.w3.org/2000/svg","viewBox":"0 0 1024 1024","style":"width: 1em; height: 1em; vertical-align: middle;fill: currentColor;overflow: hidden;"},"elements":[{"type":"element","name":"path","attributes":{"d":"M697.6 281.6l48 48-176 176 176 176-48 48-224-224L697.6 281.6z"}},{"type":"element","name":"path","attributes":{"d":"M505.6 281.6l48 48-176 176 176 176-48 48-224-224L505.6 281.6z"}}]}');
2374
2374
  const angleDoubleLeft = (props, context) => {
2375
2375
  const p2 = __spreadValues(__spreadValues({}, props), context.attrs);
2376
2376
  return createVNode(bkIcon, mergeProps(p2, {
2377
- "data": data$w,
2377
+ "data": data$x,
2378
2378
  "name": "angleDoubleLeft"
2379
2379
  }), null);
2380
2380
  };
2381
2381
  angleDoubleLeft.displayName = "angleDoubleLeft";
2382
2382
  angleDoubleLeft.inheritAttrs = false;
2383
2383
  JSON.parse('{"type":"element","name":"svg","attributes":{"xmlns":"http://www.w3.org/2000/svg","viewBox":"0 0 1024 1024","style":"width: 1em; height: 1em; vertical-align: middle;fill: currentColor;overflow: hidden;"},"elements":[{"type":"element","name":"path","attributes":{"d":"M744.64 512L462.72 789.6 554.56 880 928 512 554.56 144 462.72 234.4 744.64 512z"}},{"type":"element","name":"path","attributes":{"d":"M187.68 144L96 234.4 377.76 512 96 789.6 187.68 880 561.28 512 187.68 144z"}}]}');
2384
- const data$v = JSON.parse('{"type":"element","name":"svg","attributes":{"xmlns":"http://www.w3.org/2000/svg","viewBox":"0 0 1024 1024","style":"width: 1em; height: 1em; vertical-align: middle;fill: currentColor;overflow: hidden;"},"elements":[{"type":"element","name":"path","attributes":{"d":"M358.4 729.6l-48-48 176-176-176-176 48-48 224 224L358.4 729.6z"}},{"type":"element","name":"path","attributes":{"d":"M550.4 729.6l-48-48 176-176-176-176 48-48 224 224L550.4 729.6z"}}]}');
2384
+ const data$w = JSON.parse('{"type":"element","name":"svg","attributes":{"xmlns":"http://www.w3.org/2000/svg","viewBox":"0 0 1024 1024","style":"width: 1em; height: 1em; vertical-align: middle;fill: currentColor;overflow: hidden;"},"elements":[{"type":"element","name":"path","attributes":{"d":"M358.4 729.6l-48-48 176-176-176-176 48-48 224 224L358.4 729.6z"}},{"type":"element","name":"path","attributes":{"d":"M550.4 729.6l-48-48 176-176-176-176 48-48 224 224L550.4 729.6z"}}]}');
2385
2385
  const angleDoubleRight = (props, context) => {
2386
2386
  const p2 = __spreadValues(__spreadValues({}, props), context.attrs);
2387
2387
  return createVNode(bkIcon, mergeProps(p2, {
2388
- "data": data$v,
2388
+ "data": data$w,
2389
2389
  "name": "angleDoubleRight"
2390
2390
  }), null);
2391
2391
  };
2392
2392
  angleDoubleRight.displayName = "angleDoubleRight";
2393
2393
  angleDoubleRight.inheritAttrs = false;
2394
2394
  JSON.parse('{"type":"element","name":"svg","attributes":{"xmlns":"http://www.w3.org/2000/svg","viewBox":"0 0 1024 1024","style":"width: 1em; height: 1em; vertical-align: middle;fill: currentColor;overflow: hidden;"},"elements":[{"type":"element","name":"path","attributes":{"d":"M512 279.36L789.6 561.28 880 469.44 512 96 144 469.44 234.4 561.28 512 279.36z"}},{"type":"element","name":"path","attributes":{"d":"M144 836.32L234.4 928 512 646.08 789.6 928 880 836.32 512 462.72 144 836.32z"}}]}');
2395
- JSON.parse('{"type":"element","name":"svg","attributes":{"xmlns":"http://www.w3.org/2000/svg","viewBox":"0 0 1024 1024","style":"width: 1em; height: 1em; vertical-align: middle;fill: currentColor;overflow: hidden;"},"elements":[{"type":"element","name":"path","attributes":{"d":"M512 256L96 704 187.04 704 512 704 836.96 704 928 704 512 256z"}}]}');
2395
+ const data$v = JSON.parse('{"type":"element","name":"svg","attributes":{"xmlns":"http://www.w3.org/2000/svg","viewBox":"0 0 1024 1024","style":"width: 1em; height: 1em; vertical-align: middle;fill: currentColor;overflow: hidden;"},"elements":[{"type":"element","name":"path","attributes":{"d":"M512 256L96 704 187.04 704 512 704 836.96 704 928 704 512 256z"}}]}');
2396
+ const angleDownFill = (props, context) => {
2397
+ const p2 = __spreadValues(__spreadValues({}, props), context.attrs);
2398
+ return createVNode(bkIcon, mergeProps(p2, {
2399
+ "data": data$v,
2400
+ "name": "angleDownFill"
2401
+ }), null);
2402
+ };
2403
+ angleDownFill.displayName = "angleDownFill";
2404
+ angleDownFill.inheritAttrs = false;
2396
2405
  JSON.parse('{"type":"element","name":"svg","attributes":{"xmlns":"http://www.w3.org/2000/svg","viewBox":"0 0 1024 1024","style":"width: 1em; height: 1em; vertical-align: middle;fill: currentColor;overflow: hidden;"},"elements":[{"type":"element","name":"path","attributes":{"d":"M512 762.56L98.72 349.28 189.28 258.72 512 581.44 834.72 258.72 925.28 349.28 512 762.56z"}}]}');
2397
2406
  const data$u = JSON.parse('{"type":"element","name":"svg","attributes":{"xmlns":"http://www.w3.org/2000/svg","viewBox":"0 0 1024 1024","style":"width: 1em; height: 1em; vertical-align: middle;fill: currentColor;overflow: hidden;"},"elements":[{"type":"element","name":"path","attributes":{"d":"M288 448L336 400 512 576 688 400 736 448 512 672z"}}]}');
2398
2407
  const angleDown = (props, context) => {
@@ -11969,13 +11978,24 @@ var Component$6 = defineComponent({
11969
11978
  });
11970
11979
  const BkVirtualRender = withInstall(Component$6);
11971
11980
  const BORDER_OPRIONS = ["none", "row", "col", "outer"];
11981
+ var SortScope = /* @__PURE__ */ ((SortScope2) => {
11982
+ SortScope2["CURRENT"] = "current";
11983
+ SortScope2["ALL"] = "all";
11984
+ return SortScope2;
11985
+ })(SortScope || {});
11972
11986
  const tableProps = {
11973
11987
  data: PropTypes.arrayOf(PropTypes.any).def([]),
11974
11988
  columns: PropTypes.arrayOf(PropTypes.shape({
11975
11989
  label: PropTypes.oneOfType([PropTypes.func.def(() => ""), PropTypes.string.def("")]),
11976
11990
  field: PropTypes.oneOfType([PropTypes.func.def(() => ""), PropTypes.string.def("")]),
11977
11991
  render: PropTypes.oneOfType([PropTypes.func.def(() => ""), PropTypes.string.def("")]),
11978
- width: PropTypes.oneOfType([PropTypes.number.def(void 0), PropTypes.string.def("auto")])
11992
+ width: PropTypes.oneOfType([PropTypes.number.def(void 0), PropTypes.string.def("auto")]),
11993
+ type: PropTypes.commonType(["selection", "index", "expand"], "columnType").def(""),
11994
+ sort: PropTypes.oneOfType([PropTypes.shape({
11995
+ sortby: PropTypes.string.def(""),
11996
+ sortFn: PropTypes.func.def(null),
11997
+ sortScope: PropTypes.commonType(Object.values(SortScope)).def("current")
11998
+ }), PropTypes.bool]).def(false)
11979
11999
  })),
11980
12000
  activeColumn: PropTypes.oneOfType([PropTypes.number.def(-1), PropTypes.arrayOf(PropTypes.number.def(-1))]),
11981
12001
  columnPick: PropTypes.commonType(["multi", "single", "disabled"], "columnPick").def("disabled"),
@@ -11984,6 +12004,11 @@ const tableProps = {
11984
12004
  rowHeight: PropTypes.oneOfType([PropTypes.number, PropTypes.func]).def(40),
11985
12005
  headHeight: PropTypes.number.def(40),
11986
12006
  showHead: PropTypes.bool.def(true),
12007
+ thead: PropTypes.shape({
12008
+ height: PropTypes.number.def(40),
12009
+ isShow: PropTypes.bool.def(true),
12010
+ cellFn: PropTypes.func.def(null)
12011
+ }),
11987
12012
  virtualEnabled: PropTypes.bool.def(false),
11988
12013
  border: PropTypes.arrayOf(PropTypes.commonType(BORDER_OPRIONS, "border")).def(["row"]),
11989
12014
  pagination: PropTypes.oneOfType([PropTypes.bool.def(false), PropTypes.object.def({})]).def(false),
@@ -12575,6 +12600,26 @@ const resolvePaginationOption = (propPagination, defVal) => {
12575
12600
  }
12576
12601
  return {};
12577
12602
  };
12603
+ const resolveHeadConfig = (props) => {
12604
+ const {
12605
+ showHead,
12606
+ headHeight,
12607
+ thead = {}
12608
+ } = props;
12609
+ return Object.assign({}, {
12610
+ isShow: showHead,
12611
+ height: headHeight
12612
+ }, __spreadValues({}, thead));
12613
+ };
12614
+ let EVENTS;
12615
+ (function(EVENTS2) {
12616
+ EVENTS2["ON_SORT_BY_CLICK"] = "onSortByClick";
12617
+ })(EVENTS || (EVENTS = {}));
12618
+ let SortType;
12619
+ (function(SortType2) {
12620
+ SortType2["ASC"] = "asc";
12621
+ SortType2["DESC"] = "desc";
12622
+ })(SortType || (SortType = {}));
12578
12623
  class TableRender {
12579
12624
  constructor(props, ctx, reactiveProp, colgroups) {
12580
12625
  __publicField(this, "getColumnClass", (colIndex) => `${this.uuid}-column-${colIndex}`);
@@ -12584,11 +12629,18 @@ class TableRender {
12584
12629
  this.colgroups = colgroups;
12585
12630
  this.plugins = new TablePlugins(props, ctx);
12586
12631
  this.uuid = random(8);
12632
+ this.events = /* @__PURE__ */ new Map();
12587
12633
  }
12588
12634
  get propActiveCols() {
12589
12635
  return this.reactiveProp.activeColumns;
12590
12636
  }
12591
12637
  renderTableHeadSchema() {
12638
+ const {
12639
+ isShow = true
12640
+ } = resolveHeadConfig(this.props);
12641
+ if (!isShow) {
12642
+ return null;
12643
+ }
12592
12644
  return createVNode("table", {
12593
12645
  "cellpadding": 0,
12594
12646
  "cellspacing": 0
@@ -12607,6 +12659,26 @@ class TableRender {
12607
12659
  "onChange": (current) => this.hanlePageChange(current)
12608
12660
  }), null);
12609
12661
  }
12662
+ on(eventName, wartcher) {
12663
+ if (!this.events.has(eventName)) {
12664
+ this.events.set(eventName, []);
12665
+ }
12666
+ this.events.get(eventName).push(wartcher);
12667
+ return this;
12668
+ }
12669
+ destroy() {
12670
+ this.events.clear();
12671
+ this.events = null;
12672
+ }
12673
+ emitEvent(eventName, args) {
12674
+ if (this.events.has(eventName)) {
12675
+ this.events.get(eventName).forEach((evet) => {
12676
+ if (typeof evet === "function") {
12677
+ Reflect.apply(evet, this, args);
12678
+ }
12679
+ });
12680
+ }
12681
+ }
12610
12682
  handlePageLimitChange(limit) {
12611
12683
  Object.assign(this.props.pagination, {
12612
12684
  limit
@@ -12640,8 +12712,61 @@ class TableRender {
12640
12712
  }
12641
12713
  }
12642
12714
  renderHeader() {
12715
+ const config = resolveHeadConfig(this.props);
12716
+ const {
12717
+ cellFn
12718
+ } = config;
12643
12719
  const rowStyle = {
12644
- "--row-height": `${resolvePropVal(this.props, "headHeight", ["thead"])}px`
12720
+ "--row-height": `${resolvePropVal(config, "height", ["thead"])}px`
12721
+ };
12722
+ const hanldeSortClick = (e, column, index, type) => {
12723
+ var _a, _b;
12724
+ e.stopImmediatePropagation();
12725
+ e.stopPropagation();
12726
+ e.preventDefault();
12727
+ const fieldName = column.field;
12728
+ const getVal = (row) => this.getRowText(row, fieldName, column);
12729
+ const sortFn0 = (a2, b2) => {
12730
+ const val0 = getVal(a2);
12731
+ const val1 = getVal(b2);
12732
+ if (typeof val0 === "number" && typeof val1 === "number") {
12733
+ return val0 - val1;
12734
+ }
12735
+ return String.prototype.localeCompare.call(val0, val1);
12736
+ };
12737
+ Object.assign(column, {
12738
+ _sort_reg: type
12739
+ });
12740
+ const sortFn = typeof ((_a = column.sort) == null ? void 0 : _a.sortFn) === "function" ? (_b = column.sort) == null ? void 0 : _b.sortFn : sortFn0;
12741
+ const execFn = (_a2, _b2) => sortFn(_a2, _b2) * (type === SortType.DESC ? -1 : 1);
12742
+ this.emitEvent(EVENTS.ON_SORT_BY_CLICK, [{
12743
+ sortFn: execFn,
12744
+ column,
12745
+ index,
12746
+ type
12747
+ }]);
12748
+ };
12749
+ const renderHeadCell = (column, index) => {
12750
+ const cells = [];
12751
+ if (column.sort) {
12752
+ const sortReg = column["_sort_reg"];
12753
+ const sortCell = createVNode("span", {
12754
+ "class": "head-cell-sort"
12755
+ }, [createVNode(angleDownFill, {
12756
+ "class": ["sort-action", "sort-asc", sortReg === SortType.ASC ? "active" : ""],
12757
+ "onClick": (e) => hanldeSortClick(e, column, index, SortType.ASC)
12758
+ }, null), createVNode(angleUpFill, {
12759
+ "class": ["sort-action", "sort-desc", sortReg === SortType.DESC ? "active" : ""],
12760
+ "onClick": (e) => hanldeSortClick(e, column, index, SortType.DESC)
12761
+ }, null)]);
12762
+ cells.push(sortCell);
12763
+ }
12764
+ if (typeof cellFn === "function") {
12765
+ cells.unshift(cellFn(column, index));
12766
+ return cells;
12767
+ }
12768
+ cells.unshift(resolvePropVal(column, "label", [column, index]));
12769
+ return cells;
12645
12770
  };
12646
12771
  return createVNode("thead", {
12647
12772
  "style": rowStyle
@@ -12654,24 +12779,24 @@ class TableRender {
12654
12779
  "onClick": () => this.handleColumnHeadClick(index)
12655
12780
  }, [createVNode("div", {
12656
12781
  "class": "cell"
12657
- }, [resolvePropVal(column, "label", [column])])]))])]);
12782
+ }, [renderHeadCell(column, index)])]))])]);
12658
12783
  }
12659
12784
  renderTBody(rows) {
12660
- return createVNode("tbody", null, [rows.map((row, index) => {
12785
+ return createVNode("tbody", null, [rows.map((row, rowIndex) => {
12661
12786
  const rowStyle = {
12662
- "--row-height": `${resolvePropVal(this.props, "rowHeight", ["tbody", row, index])}px`
12787
+ "--row-height": `${resolvePropVal(this.props, "rowHeight", ["tbody", row, rowIndex])}px`
12663
12788
  };
12664
12789
  return createVNode("tr", {
12665
12790
  "style": rowStyle,
12666
- "onClick": (e) => this.handleRowClick(e, row, index, rows),
12667
- "onDblclick": (e) => this.handleRowDblClick(e, row, index, rows)
12668
- }, [this.props.columns.map((column, index2) => createVNode("td", {
12669
- "class": this.getColumnClass(index2),
12791
+ "onClick": (e) => this.handleRowClick(e, row, rowIndex, rows),
12792
+ "onDblclick": (e) => this.handleRowDblClick(e, row, rowIndex, rows)
12793
+ }, [this.props.columns.map((column, index) => createVNode("td", {
12794
+ "class": this.getColumnClass(index),
12670
12795
  "colspan": 1,
12671
12796
  "rowspan": 1
12672
12797
  }, [createVNode("div", {
12673
12798
  "class": "cell"
12674
- }, [this.renderCell(row, column, index2, rows)])]))]);
12799
+ }, [this.renderCell(row, column, rowIndex, rows)])]))]);
12675
12800
  })]);
12676
12801
  }
12677
12802
  handleRowClick(e, row, index, rows) {
@@ -12680,8 +12805,14 @@ class TableRender {
12680
12805
  handleRowDblClick(e, row, index, rows) {
12681
12806
  this.context.emit("rowDblClick", e, row, index, rows, this);
12682
12807
  }
12808
+ getRowText(row, key, column) {
12809
+ if (column.type === "index") {
12810
+ return row.__$table_row_index;
12811
+ }
12812
+ return row[key];
12813
+ }
12683
12814
  renderCell(row, column, index, rows) {
12684
- const cell = row[resolvePropVal(column, "field", [column, row])];
12815
+ const cell = this.getRowText(row, resolvePropVal(column, "field", [column, row]), column);
12685
12816
  if (typeof column.render === "function") {
12686
12817
  return column.render(cell, row, index, rows);
12687
12818
  }
@@ -12714,6 +12845,7 @@ var Component$4 = defineComponent({
12714
12845
  })));
12715
12846
  const startIndex = ref(0);
12716
12847
  const endIndex = ref(0);
12848
+ let columnSortFn = null;
12717
12849
  let pagination2 = reactive({
12718
12850
  count: 0,
12719
12851
  limit: 10,
@@ -12754,15 +12886,29 @@ var Component$4 = defineComponent({
12754
12886
  }, {
12755
12887
  deep: true
12756
12888
  });
12757
- const tableRender = new TableRender(props, ctx, reactiveProp, colgroups);
12758
- const wrapperStyle = computed(() => ({
12759
- minHeight: resolveNumberOrStringToPix(props.minHeight, "auto")
12760
- }));
12889
+ const indexData = computed(() => props.data.map((item, index) => __spreadProps(__spreadValues({}, item), {
12890
+ __$table_row_index: index + 1
12891
+ })));
12892
+ const pageData = reactive([]);
12761
12893
  watchEffect(() => {
12762
12894
  pagination2 = resolvePaginationOption(props.pagination, pagination2);
12763
12895
  resetStartEndIndex();
12896
+ pageData.splice(0, pageData.length, ...indexData.value.slice(startIndex.value, endIndex.value));
12897
+ if (typeof columnSortFn === "function") {
12898
+ pageData.sort(columnSortFn);
12899
+ }
12764
12900
  });
12765
- const pageData = computed(() => props.data.slice(startIndex.value, endIndex.value));
12901
+ const tableRender = new TableRender(props, ctx, reactiveProp, colgroups);
12902
+ tableRender.on(EVENTS.ON_SORT_BY_CLICK, (args) => {
12903
+ const {
12904
+ sortFn
12905
+ } = args;
12906
+ columnSortFn = sortFn;
12907
+ pageData.sort(columnSortFn);
12908
+ });
12909
+ const wrapperStyle = computed(() => ({
12910
+ minHeight: resolveNumberOrStringToPix(props.minHeight, "auto")
12911
+ }));
12766
12912
  const localPagination = computed(() => {
12767
12913
  if (!props.pagination) {
12768
12914
  return null;
@@ -12810,6 +12956,7 @@ var Component$4 = defineComponent({
12810
12956
  onBeforeUnmount(() => {
12811
12957
  observerIns.stop();
12812
12958
  observerIns = null;
12959
+ tableRender.destroy();
12813
12960
  });
12814
12961
  ctx.expose({
12815
12962
  plugins: tableRender.plugins
@@ -12820,11 +12967,11 @@ var Component$4 = defineComponent({
12820
12967
  "ref": root
12821
12968
  }, [createVNode("div", {
12822
12969
  "class": headClass
12823
- }, [props.showHead && tableRender.renderTableHeadSchema()]), createVNode(BkVirtualRender, {
12970
+ }, [tableRender.renderTableHeadSchema()]), createVNode(BkVirtualRender, {
12824
12971
  "lineHeight": props.rowHeight,
12825
12972
  "class": contentClass,
12826
12973
  "style": contentStyle.value,
12827
- "list": pageData.value,
12974
+ "list": pageData,
12828
12975
  "onContentScroll": handleScrollChanged,
12829
12976
  "throttleDelay": 0,
12830
12977
  "enabled": props.virtualEnabled
@@ -14294,28 +14441,28 @@ const Message$1 = (constructor, options) => {
14294
14441
  };
14295
14442
  }
14296
14443
  const userOnClose = options.onClose;
14297
- let verticalOffset = opts.offset || 20;
14444
+ let verticalOffset = opts.offsetY || 30;
14445
+ const { spacing = 10 } = opts;
14298
14446
  instances[position].forEach((vm2) => {
14299
- verticalOffset += (vm2.el.offsetHeight || 0) + 16;
14447
+ verticalOffset += (vm2.el.offsetHeight || 0) + spacing;
14300
14448
  });
14301
- verticalOffset += 16;
14302
14449
  seed += 1;
14303
14450
  const id = `message_${seed}`;
14304
14451
  opts = __spreadProps(__spreadValues({}, opts), {
14305
- offset: verticalOffset,
14452
+ offsetY: verticalOffset,
14306
14453
  id
14307
14454
  });
14308
14455
  const container = document.createElement("div");
14309
14456
  const vm = createVNode(constructor, opts);
14310
14457
  vm.props.onDestory = (id2) => {
14311
- close(id2, position, userOnClose);
14458
+ close(id2, position, spacing, userOnClose);
14312
14459
  render(null, container);
14313
14460
  };
14314
14461
  render(vm, container);
14315
14462
  instances[position].push(vm);
14316
14463
  document.body.appendChild(container.firstElementChild);
14317
14464
  };
14318
- function close(id, position, userOnClose) {
14465
+ function close(id, position, spacing, userOnClose) {
14319
14466
  userOnClose == null ? void 0 : userOnClose();
14320
14467
  const verticalProperty = position.startsWith("top") ? "top" : "bottom";
14321
14468
  let instanceIndex = -1;
@@ -14328,17 +14475,20 @@ function close(id, position, userOnClose) {
14328
14475
  const removeHeight = vm.el.offsetHeight;
14329
14476
  const len = instances[position].length;
14330
14477
  for (let i = instanceIndex; i < len; i++) {
14331
- const pos = parseInt(instances[position][i].el.style[verticalProperty], 10) - removeHeight - 16;
14332
- instances[position][i].component.props.offset = pos;
14478
+ const pos = parseInt(instances[position][i].el.style[verticalProperty], 10) - removeHeight - spacing;
14479
+ instances[position][i].component.props.offsetY = pos;
14333
14480
  }
14334
14481
  instances[position].splice(instanceIndex, 1);
14335
14482
  }
14336
14483
  const messageProps = {
14337
14484
  id: PropTypes.string.def(""),
14338
14485
  message: PropTypes.string.def(""),
14339
- theme: PropTypes.theme(["primary", "warning", "success", "danger"]).def("primary"),
14486
+ theme: PropTypes.theme(["primary", "warning", "success", "error"]).def("primary"),
14340
14487
  delay: PropTypes.number.def(3e3),
14341
- offset: PropTypes.number.def(0),
14488
+ dismissable: PropTypes.bool.def(true),
14489
+ offsetY: PropTypes.number.def(30),
14490
+ spacing: PropTypes.number.def(10),
14491
+ extCls: PropTypes.string.def(""),
14342
14492
  onClose: PropTypes.func
14343
14493
  };
14344
14494
  var MessageConstructor = defineComponent({
@@ -14348,10 +14498,10 @@ var MessageConstructor = defineComponent({
14348
14498
  setup(props, {
14349
14499
  emit
14350
14500
  }) {
14351
- const classNames = computed(() => ["bk-message", `bk-message-${props.theme}`]);
14501
+ const classNames = computed(() => ["bk-message", `bk-message-${props.theme}`, `${props.extCls}`]);
14352
14502
  const zIndex = bkZIndexManager.getMessageNextIndex();
14353
14503
  const styles = computed(() => ({
14354
- top: `${props.offset}px`,
14504
+ top: `${props.offsetY}px`,
14355
14505
  zIndex
14356
14506
  }));
14357
14507
  const visible = ref(false);
@@ -14361,11 +14511,11 @@ var MessageConstructor = defineComponent({
14361
14511
  visible.value = false;
14362
14512
  }, props.delay);
14363
14513
  };
14364
- const handleClose = () => {
14514
+ const close2 = () => {
14365
14515
  visible.value = false;
14366
14516
  };
14367
14517
  onMounted(() => {
14368
- startTimer();
14518
+ props.delay && startTimer();
14369
14519
  visible.value = true;
14370
14520
  });
14371
14521
  onUnmounted(() => {
@@ -14380,7 +14530,7 @@ var MessageConstructor = defineComponent({
14380
14530
  classNames,
14381
14531
  styles,
14382
14532
  visible,
14383
- handleClose
14533
+ close: close2
14384
14534
  };
14385
14535
  },
14386
14536
  render() {
@@ -14389,12 +14539,12 @@ var MessageConstructor = defineComponent({
14389
14539
  primary: createVNode(info, null, null),
14390
14540
  warning: createVNode(warn, null, null),
14391
14541
  success: createVNode(success, null, null),
14392
- danger: createVNode(close$1, null, null)
14542
+ error: createVNode(close$1, null, null)
14393
14543
  };
14394
14544
  return iconMap[this.theme];
14395
14545
  };
14396
14546
  return createVNode(Transition, {
14397
- "name": "bk-message-fade"
14547
+ "name": "bk-fade"
14398
14548
  }, {
14399
14549
  default: () => [withDirectives(createVNode("div", {
14400
14550
  "class": this.classNames,
@@ -14403,9 +14553,9 @@ var MessageConstructor = defineComponent({
14403
14553
  "class": "bk-message-content"
14404
14554
  }, [createVNode("div", {
14405
14555
  "class": "bk-message-icon"
14406
- }, [renderIcon()]), this.message]), createVNode(error, {
14556
+ }, [renderIcon()]), this.message]), this.dismissable && createVNode(error, {
14407
14557
  "class": "bk-message-icon bk-message-close",
14408
- "onClick": this.handleClose
14558
+ "onClick": this.close
14409
14559
  }, null)]), [[vShow, this.visible]])]
14410
14560
  });
14411
14561
  }
@@ -19895,7 +20045,7 @@ var Form = defineComponent({
19895
20045
  var validator = {
19896
20046
  required: (value) => {
19897
20047
  console.log("required");
19898
- return value !== "";
20048
+ return value !== "" && value !== void 0 && value !== null;
19899
20049
  },
19900
20050
  min: (value, min2) => {
19901
20051
  console.log("min");