bkui-vue 0.0.1-beta.217 → 0.0.1-beta.218

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 (37) hide show
  1. package/dist/index.cjs.js +40 -40
  2. package/dist/index.esm.js +444 -81
  3. package/dist/index.umd.js +54 -54
  4. package/dist/style.css +1 -1
  5. package/dist/style.variable.css +1 -1
  6. package/lib/date-picker/base/date-table.d.ts +4 -4
  7. package/lib/date-picker/date-picker.css +5 -0
  8. package/lib/date-picker/date-picker.d.ts +2 -2
  9. package/lib/date-picker/date-picker.less +6 -0
  10. package/lib/date-picker/date-picker.variable.css +5 -0
  11. package/lib/date-picker/index.d.ts +4 -4
  12. package/lib/date-picker/index.js +1 -1
  13. package/lib/date-picker/interface.d.ts +3 -2
  14. package/lib/date-picker/panel/date-range.d.ts +39 -183
  15. package/lib/date-picker/panel/date.d.ts +20 -364
  16. package/lib/date-picker/panel/time-range.d.ts +489 -0
  17. package/lib/date-picker/panel/time.d.ts +1 -3
  18. package/lib/date-picker/props.d.ts +2 -2
  19. package/lib/date-picker/time-picker.d.ts +2 -2
  20. package/lib/table/const.d.ts +2 -1
  21. package/lib/table/index.d.ts +16 -1
  22. package/lib/table/index.js +1 -1
  23. package/lib/table/plugins/head-filter.css +2 -3
  24. package/lib/table/plugins/head-filter.less +9 -10
  25. package/lib/table/plugins/head-filter.variable.css +2 -3
  26. package/lib/table/plugins/head-sort.css +6 -3
  27. package/lib/table/plugins/head-sort.less +6 -3
  28. package/lib/table/plugins/head-sort.variable.css +6 -3
  29. package/lib/table/props.d.ts +19 -0
  30. package/lib/table/table.css +8 -6
  31. package/lib/table/table.d.ts +7 -0
  32. package/lib/table/table.variable.css +8 -6
  33. package/lib/table/use-common.d.ts +1 -0
  34. package/lib/table/utils.d.ts +8 -0
  35. package/lib/table-column/index.js +1 -1
  36. package/lib/time-picker/index.d.ts +4 -4
  37. package/package.json +1 -1
package/dist/index.esm.js CHANGED
@@ -16266,9 +16266,10 @@ var SORT_OPTION = /* @__PURE__ */ ((SORT_OPTION2) => {
16266
16266
  SORT_OPTION2["ASC"] = "asc";
16267
16267
  SORT_OPTION2["DESC"] = "desc";
16268
16268
  SORT_OPTION2["NULL"] = "null";
16269
+ SORT_OPTION2["CUSTOM"] = "custom";
16269
16270
  return SORT_OPTION2;
16270
16271
  })(SORT_OPTION || {});
16271
- const SORT_OPTIONS = ["asc", "desc", "null"];
16272
+ const SORT_OPTIONS = ["asc", "desc", "null", "custom"];
16272
16273
  var SortScope = /* @__PURE__ */ ((SortScope2) => {
16273
16274
  SortScope2["CURRENT"] = "current";
16274
16275
  SortScope2["ALL"] = "all";
@@ -16284,7 +16285,8 @@ const IColumnType = {
16284
16285
  showOverflowTooltip: PropTypes.oneOfType([PropTypes.bool, PropTypes.shape({
16285
16286
  content: PropTypes.string.def(""),
16286
16287
  disabled: PropTypes.bool.def(false),
16287
- watchCellResize: PropTypes.bool.def(true)
16288
+ watchCellResize: PropTypes.bool.def(true),
16289
+ mode: PropTypes.commonType(["static", "auto"], "showOverflowTooltipMode").def("auto")
16288
16290
  })]).def(void 0),
16289
16291
  type: PropTypes.commonType(["selection", "index", "expand", "none"], "columnType").def("none"),
16290
16292
  resizable: PropTypes.bool.def(true),
@@ -16370,11 +16372,16 @@ const tableProps = {
16370
16372
  showOverflowTooltip: PropTypes.oneOfType([PropTypes.bool, PropTypes.shape({
16371
16373
  content: PropTypes.string.def(""),
16372
16374
  disabled: PropTypes.bool.def(false),
16373
- watchCellResize: PropTypes.bool.def(true)
16375
+ watchCellResize: PropTypes.bool.def(true),
16376
+ mode: PropTypes.commonType(["static", "auto"], "showOverflowTooltipMode").def("auto")
16374
16377
  })]).def(false),
16375
16378
  asyncData: PropTypes.bool.def(false),
16376
16379
  rowHover: PropTypes.oneOf(ROW_HOVER_OPTIONS).def(ROW_HOVER.HIGHLIGHT),
16377
- defaultSort: PropTypes.shape({}).def({})
16380
+ defaultSort: PropTypes.shape({}).def({}),
16381
+ isRowSelectEnable: PropTypes.oneOfType([
16382
+ PropTypes.func.def(() => true),
16383
+ PropTypes.bool.def(true)
16384
+ ]).def(true)
16378
16385
  };
16379
16386
  var Column = defineComponent({
16380
16387
  name: "TableColumn",
@@ -17204,6 +17211,70 @@ const resolveCellSpan = (column, colIndex, row, rowIndex) => {
17204
17211
  rowspan
17205
17212
  };
17206
17213
  };
17214
+ const getSortFn = (column, sortType) => {
17215
+ var _a, _b;
17216
+ const fieldName = column.field;
17217
+ const getVal = (row) => getRowText(row, fieldName, column);
17218
+ const sortFn0 = (a2, b2) => {
17219
+ const val0 = getVal(a2);
17220
+ const val1 = getVal(b2);
17221
+ if (typeof val0 === "number" && typeof val1 === "number") {
17222
+ return val0 - val1;
17223
+ }
17224
+ return String.prototype.localeCompare.call(val0, val1);
17225
+ };
17226
+ const sortFn = typeof ((_a = column.sort) == null ? void 0 : _a.sortFn) === "function" ? (_b = column.sort) == null ? void 0 : _b.sortFn : sortFn0;
17227
+ return sortType === SORT_OPTION.NULL ? () => true : (_a2, _b2) => sortFn(_a2, _b2) * (sortType === SORT_OPTION.DESC ? -1 : 1);
17228
+ };
17229
+ const getNextSortType = (sortType) => {
17230
+ const steps2 = {
17231
+ [SORT_OPTION.NULL]: 0,
17232
+ [SORT_OPTION.ASC]: 1,
17233
+ [SORT_OPTION.DESC]: 2
17234
+ };
17235
+ if (sortType === void 0) {
17236
+ return SORT_OPTION.NULL;
17237
+ }
17238
+ return Object.keys(steps2)[(steps2[sortType] + 1) % 3];
17239
+ };
17240
+ const resolveSort = (sort) => {
17241
+ if (typeof sort === "string") {
17242
+ return {
17243
+ value: sort
17244
+ };
17245
+ }
17246
+ if (typeof sort === "boolean" && sort) {
17247
+ return {
17248
+ value: SORT_OPTION.ASC
17249
+ };
17250
+ }
17251
+ if (typeof sort === "object" && sort !== null) {
17252
+ if (typeof sort.sortFn) {
17253
+ return __spreadValues({
17254
+ value: "custom"
17255
+ }, sort);
17256
+ }
17257
+ return sort;
17258
+ }
17259
+ return null;
17260
+ };
17261
+ const isRowSelectEnable = (props2, {
17262
+ row,
17263
+ index,
17264
+ isCheckAll
17265
+ }) => {
17266
+ if (typeof props2.isRowSelectEnable === "boolean") {
17267
+ return props2.isRowSelectEnable;
17268
+ }
17269
+ if (typeof props2.isRowSelectEnable === "function") {
17270
+ return props2.isRowSelectEnable({
17271
+ row,
17272
+ index,
17273
+ isCheckAll
17274
+ });
17275
+ }
17276
+ return true;
17277
+ };
17207
17278
  var TableCell = defineComponent({
17208
17279
  name: "TableCell",
17209
17280
  props: {
@@ -17236,6 +17307,7 @@ var TableCell = defineComponent({
17236
17307
  const resolveTooltipOption = () => {
17237
17308
  let disabled = true;
17238
17309
  let content = refRoot.value.innerText;
17310
+ let mode = "auto";
17239
17311
  if (typeof showOverflowTooltip === "boolean") {
17240
17312
  disabled = !showOverflowTooltip;
17241
17313
  }
@@ -17245,10 +17317,12 @@ var TableCell = defineComponent({
17245
17317
  content = showOverflowTooltip.content(props2.column, props2.row);
17246
17318
  }
17247
17319
  content = showOverflowTooltip.content || refRoot.value.innerText;
17320
+ mode = showOverflowTooltip.mode || "auto";
17248
17321
  }
17249
17322
  return {
17250
17323
  disabled,
17251
- content
17324
+ content,
17325
+ mode
17252
17326
  };
17253
17327
  };
17254
17328
  const resolveOverflowTooltip = () => {
@@ -17256,14 +17330,20 @@ var TableCell = defineComponent({
17256
17330
  return;
17257
17331
  }
17258
17332
  const {
17259
- content
17333
+ content,
17334
+ mode
17260
17335
  } = resolveTooltipOption();
17261
- const textWidth = getElementTextWidth(refRoot.value, content);
17262
- const cellWidth = refRoot.value.clientWidth;
17263
- const computedStyle = window.getComputedStyle(refRoot.value);
17264
- const paddingWidth = ["padding-left", "padding-right"].reduce((width, prop) => width + Number(computedStyle.getPropertyValue(prop).replace("px", "")), 0);
17265
- const cellInnerWidth = cellWidth - paddingWidth;
17266
- isTipsEnabled.value = textWidth > cellInnerWidth;
17336
+ if (mode === "auto") {
17337
+ const textWidth = getElementTextWidth(refRoot.value, content);
17338
+ const cellWidth = refRoot.value.clientWidth;
17339
+ const computedStyle = window.getComputedStyle(refRoot.value);
17340
+ const paddingWidth = ["padding-left", "padding-right"].reduce((width, prop) => width + Number(computedStyle.getPropertyValue(prop).replace("px", "")), 0);
17341
+ const cellInnerWidth = cellWidth - paddingWidth;
17342
+ isTipsEnabled.value = textWidth > cellInnerWidth;
17343
+ }
17344
+ if (mode === "static") {
17345
+ isTipsEnabled.value = true;
17346
+ }
17267
17347
  if (isTipsEnabled.value) {
17268
17348
  const bindings = ref(resolveTooltipOption());
17269
17349
  if (bkEllipsisIns === null) {
@@ -17499,36 +17579,28 @@ var HeadSort = defineComponent({
17499
17579
  var _a, _b;
17500
17580
  const defSort = ((_b = (_a = props2.column) == null ? void 0 : _a.sort) == null ? void 0 : _b.value) || props2.defaultSort || SORT_OPTION.NULL;
17501
17581
  const sortType = ref(defSort);
17582
+ watch(() => [props2.defaultSort], ([val]) => {
17583
+ sortType.value = val;
17584
+ });
17502
17585
  const handleSortClick = (e, type) => {
17503
- var _a2, _b2;
17504
17586
  e.stopImmediatePropagation();
17505
17587
  e.stopPropagation();
17506
17588
  e.preventDefault();
17507
- if (sortType.value === type) {
17508
- sortType.value = SORT_OPTION.NULL;
17509
- } else {
17510
- sortType.value = type;
17589
+ let currentSort = type;
17590
+ if (type === SORT_OPTION.NULL) {
17591
+ currentSort = getNextSortType(type);
17511
17592
  }
17512
- if (props2.column.sort === "custom") {
17513
- emit("change", null, type);
17593
+ const sort = resolveSort(props2.column.sort);
17594
+ if ((sort == null ? void 0 : sort.value) === "custom") {
17595
+ emit("change", null, currentSort);
17514
17596
  return;
17515
17597
  }
17516
- const fieldName = props2.column.field;
17517
- const getVal = (row) => getRowText(row, fieldName, props2.column);
17518
- const sortFn0 = (a2, b2) => {
17519
- const val0 = getVal(a2);
17520
- const val1 = getVal(b2);
17521
- if (typeof val0 === "number" && typeof val1 === "number") {
17522
- return val0 - val1;
17523
- }
17524
- return String.prototype.localeCompare.call(val0, val1);
17525
- };
17526
- const sortFn = typeof ((_a2 = props2.column.sort) == null ? void 0 : _a2.sortFn) === "function" ? (_b2 = props2.column.sort) == null ? void 0 : _b2.sortFn : sortFn0;
17527
- const execFn = sortType.value === SORT_OPTION.NULL ? () => true : (_a3, _b3) => sortFn(_a3, _b3) * (type === SORT_OPTION.DESC ? -1 : 1);
17528
- emit("change", execFn, type);
17598
+ const execFn = getSortFn(props2.column, currentSort);
17599
+ emit("change", execFn, currentSort);
17529
17600
  };
17530
17601
  return () => createVNode("span", {
17531
- "class": resolveClassName("head-cell-sort")
17602
+ "class": resolveClassName("head-cell-sort"),
17603
+ "onClick": (e) => handleSortClick(e, SORT_OPTION.NULL)
17532
17604
  }, [createVNode(angleDownFill, {
17533
17605
  "class": ["sort-action", "sort-asc", sortType.value === SORT_OPTION.ASC ? "active" : ""],
17534
17606
  "onClick": (e) => handleSortClick(e, SORT_OPTION.ASC)
@@ -17984,14 +18056,32 @@ class TableRender {
17984
18056
  });
17985
18057
  }
17986
18058
  }
17987
- handleColumnHeadClick(index) {
18059
+ handleColumnHeadClick(index, column) {
17988
18060
  if (this.props.columnPick !== "disabled") {
17989
18061
  this.setColumnActive(index, this.props.columnPick === "single");
17990
18062
  this.context.emit(EMIT_EVENTS.COLUMN_PICK, this.propActiveCols);
17991
18063
  }
18064
+ if (column.sort && !column.filter) {
18065
+ const columnName = resolvePropVal(column, ["field", "type"], [column, index]);
18066
+ const nextSort = getNextSortType(this.reactiveProp.defaultSort[columnName]);
18067
+ Object.assign(this.reactiveProp.defaultSort, {
18068
+ [columnName]: nextSort
18069
+ });
18070
+ const sortFn = getSortFn(column, nextSort);
18071
+ this.emitEvent(EVENTS$1.ON_SORT_BY_CLICK, [{
18072
+ sortFn,
18073
+ column,
18074
+ index,
18075
+ nextSort
18076
+ }]);
18077
+ }
17992
18078
  }
17993
18079
  getSortCell(column, index) {
18080
+ const columnName = resolvePropVal(column, ["field", "type"], [column, index]);
17994
18081
  const handleSortClick = (sortFn, type) => {
18082
+ Object.assign(this.reactiveProp.defaultSort, {
18083
+ [columnName]: type
18084
+ });
17995
18085
  this.emitEvent(EVENTS$1.ON_SORT_BY_CLICK, [{
17996
18086
  sortFn,
17997
18087
  column,
@@ -17999,16 +18089,10 @@ class TableRender {
17999
18089
  type
18000
18090
  }]);
18001
18091
  };
18002
- let defaultSort = SORT_OPTION.NULL;
18003
- if (typeof this.props.defaultSort === "object" && this.props.defaultSort !== null) {
18004
- const columnName = resolvePropVal(column, ["field", "type"], [column, index]);
18005
- if (Object.prototype.hasOwnProperty.call(this.props.defaultSort, columnName)) {
18006
- defaultSort = this.props.defaultSort[columnName];
18007
- }
18008
- }
18092
+ const nextSort = this.reactiveProp.defaultSort[columnName];
18009
18093
  return createVNode(HeadSort, {
18010
18094
  "column": column,
18011
- "defaultSort": defaultSort,
18095
+ "defaultSort": nextSort,
18012
18096
  "onChange": handleSortClick
18013
18097
  }, null);
18014
18098
  }
@@ -18085,7 +18169,7 @@ class TableRender {
18085
18169
  "rowspan": 1,
18086
18170
  "class": this.getHeadColumnClass(column, index),
18087
18171
  "style": resolveFixedColumnStyle(column),
18088
- "onClick": () => this.handleColumnHeadClick(index)
18172
+ "onClick": () => this.handleColumnHeadClick(index, column)
18089
18173
  }, resolveEventListener(column)), [createVNode(TableCell, null, _isSlot$1(_slot = renderHeadCell(column, index)) ? _slot : {
18090
18174
  default: () => [_slot]
18091
18175
  })]);
@@ -18220,8 +18304,14 @@ class TableRender {
18220
18304
  }]);
18221
18305
  };
18222
18306
  const indeterminate = isAll && !!this.reactiveProp.rowActions.get(TABLE_ROW_ATTRIBUTE.ROW_SELECTION_INDETERMINATE);
18307
+ const isEnable = isRowSelectEnable(this.props, {
18308
+ row,
18309
+ index,
18310
+ isCheckAll: isAll
18311
+ });
18223
18312
  return createVNode(BkCheckbox, {
18224
18313
  "onChange": handleChecked,
18314
+ "disabled": !isEnable,
18225
18315
  "modelValue": row[TABLE_ROW_ATTRIBUTE.ROW_SELECTION],
18226
18316
  "indeterminate": indeterminate
18227
18317
  }, null);
@@ -18625,6 +18715,14 @@ const useInit = (props2, targetColumns) => {
18625
18715
  resetResizeEvents();
18626
18716
  registerResizeEvent();
18627
18717
  }, { immediate: true, deep: true });
18718
+ const defSort = props2.columns.reduce((out, col, index) => {
18719
+ const columnName = resolvePropVal(col, ["field", "type"], [col, index]);
18720
+ const sort = resolveSort(col.sort);
18721
+ if (sort) {
18722
+ return __spreadProps(__spreadValues({}, out || {}), { [columnName]: sort == null ? void 0 : sort.value });
18723
+ }
18724
+ return out;
18725
+ }, null);
18628
18726
  const reactiveSchema = reactive({
18629
18727
  rowActions: /* @__PURE__ */ new Map(),
18630
18728
  scrollTranslateY: 0,
@@ -18637,7 +18735,8 @@ const useInit = (props2, targetColumns) => {
18637
18735
  setting: {
18638
18736
  size: (_a = props2.settings) == null ? void 0 : _a.size,
18639
18737
  height: SETTING_SIZE[(_b = props2.settings) == null ? void 0 : _b.size]
18640
- }
18738
+ },
18739
+ defaultSort: defSort || props2.defaultSort
18641
18740
  });
18642
18741
  const isRowExpand = (rowId) => {
18643
18742
  var _a2;
@@ -21717,11 +21816,14 @@ var Confirm = defineComponent({
21717
21816
  "class": "bk-picker-confirm",
21718
21817
  "ref": "elRef",
21719
21818
  "onKeydown": this.handleTab
21720
- }, [this.showTime ? createVNode("a", {
21721
- "href": "javascript: void(0);",
21819
+ }, [this.showTime ? createVNode(BkButton, {
21820
+ "text": true,
21722
21821
  "class": "bk-picker-confirm-time",
21822
+ "disabled": this.timeDisabled,
21723
21823
  "onClick": this.handleToggleTime
21724
- }, [this.labels.time]) : "", this.clearable ? createVNode("a", {
21824
+ }, {
21825
+ default: () => [this.labels.time]
21826
+ }) : "", this.clearable ? createVNode("a", {
21725
21827
  "href": "javascript: void(0);",
21726
21828
  "onClick": this.handleClear,
21727
21829
  "onKeydown": this.handleClear
@@ -23901,7 +24003,7 @@ const formatDate = (val, type, multiple, format2) => {
23901
24003
  const datePickerKey = Symbol("date-picker");
23902
24004
  const timePickerKey = Symbol("time-picker");
23903
24005
  function findChildComponents(context, componentName) {
23904
- return context.$children.reduce((components2, child) => {
24006
+ return (context.$children || []).reduce((components2, child) => {
23905
24007
  if (child.$options.name === componentName) {
23906
24008
  components2.push(child);
23907
24009
  }
@@ -23999,7 +24101,7 @@ const dateTableProps = {
23999
24101
  type: Date,
24000
24102
  required: true
24001
24103
  },
24002
- disableDate: Function,
24104
+ disabledDate: Function,
24003
24105
  selectionMode: {
24004
24106
  type: String,
24005
24107
  required: true
@@ -24048,7 +24150,7 @@ var DateTable = defineComponent({
24048
24150
  const rangeStart = props2.rangeState.from && clearHours(props2.rangeState.from);
24049
24151
  const rangeEnd = props2.rangeState.to && clearHours(props2.rangeState.to);
24050
24152
  const isRange = props2.selectionMode === "range";
24051
- const disableTestFn = typeof props2.disableDate === "function" && props2.disableDate;
24153
+ const disableTestFn = typeof props2.disabledDate === "function" && props2.disabledDate;
24052
24154
  return calendar.value(tableYear, tableMonth, (cell) => {
24053
24155
  if (cell.date instanceof Date) {
24054
24156
  cell.date.setTime(cell.date.getTime() + cell.date.getTimezoneOffset() * 6e4);
@@ -24253,7 +24355,7 @@ const datePickerProps = {
24253
24355
  return ["simplicity", "normal"].indexOf(v2) > -1;
24254
24356
  }
24255
24357
  },
24256
- disableDate: Function,
24358
+ disabledDate: Function,
24257
24359
  withValidate: {
24258
24360
  type: Boolean,
24259
24361
  default: true
@@ -24649,7 +24751,7 @@ const timeProps = {
24649
24751
  }
24650
24752
  };
24651
24753
  var TimePanel = defineComponent({
24652
- name: "TimePickerPanel",
24754
+ name: "TimePanel",
24653
24755
  props: __spreadValues(__spreadValues(__spreadValues({}, datePickerProps), timePanelProps), timeProps),
24654
24756
  emits: ["pick", "pick-click"],
24655
24757
  setup(props2, {
@@ -24792,7 +24894,6 @@ const datePanelProps = {
24792
24894
  startDate: {
24793
24895
  type: Date
24794
24896
  },
24795
- disableDate: Function,
24796
24897
  focusedDate: {
24797
24898
  type: Date,
24798
24899
  required: true
@@ -24812,6 +24913,10 @@ const datePanelProps = {
24812
24913
  disabledDate: {
24813
24914
  type: Function,
24814
24915
  default: () => false
24916
+ },
24917
+ timePickerOptions: {
24918
+ type: Object,
24919
+ default: () => ({})
24815
24920
  }
24816
24921
  };
24817
24922
  var DatePanel = defineComponent({
@@ -24841,7 +24946,6 @@ var DatePanel = defineComponent({
24841
24946
  const timeSpinnerRef = ref(null);
24842
24947
  const timeSpinnerEndRef = ref(null);
24843
24948
  watch(() => state.currentView, (val) => {
24844
- console.error(11111, val);
24845
24949
  emit("selection-mode-change", val);
24846
24950
  if (state.currentView === "time") {
24847
24951
  nextTick(() => {
@@ -24854,6 +24958,11 @@ var DatePanel = defineComponent({
24854
24958
  state.currentView = type;
24855
24959
  state.pickerTable = getTableType(type);
24856
24960
  });
24961
+ watch(() => props2.modelValue, (newVal) => {
24962
+ state.dates = newVal;
24963
+ const panelDate = props2.multiple ? state.dates[state.dates.length - 1] : props2.startDate || state.dates[0];
24964
+ state.panelDate = panelDate || new Date();
24965
+ });
24857
24966
  const resetView = () => {
24858
24967
  setTimeout(() => {
24859
24968
  state.currentView = props2.selectionMode;
@@ -25034,7 +25143,7 @@ var DatePanel = defineComponent({
25034
25143
  case "date-table":
25035
25144
  return createVNode(DateTable, {
25036
25145
  "tableDate": this.panelDate,
25037
- "disableDate": this.disableDate,
25146
+ "disabledDate": this.disabledDate,
25038
25147
  "selectionMode": this.selectionMode,
25039
25148
  "modelValue": this.dates,
25040
25149
  "focusedDate": this.focusedDate,
@@ -25049,11 +25158,14 @@ var DatePanel = defineComponent({
25049
25158
  "format": this.format,
25050
25159
  "disabledDate": this.disabledDate,
25051
25160
  "onPick": this.handlePick,
25161
+ "onPick-click": this.handlePickClick,
25052
25162
  "onPick-clear": this.handlePickClear,
25053
- "onPick-success": this.handlePickSuccess
25163
+ "onPick-success": this.handlePickSuccess,
25164
+ "onPick-toggle-time": this.handleToggleTime
25054
25165
  }, null)]), this.confirm ? createVNode(Confirm, {
25055
25166
  "clearable": this.clearable,
25056
25167
  "showTime": this.showTime,
25168
+ "timeDisabled": this.timeDisabled,
25057
25169
  "isTime": this.isTime,
25058
25170
  "onPick-toggle-time": this.handleToggleTime,
25059
25171
  "onPick-clear": this.handlePickClear,
@@ -25063,6 +25175,154 @@ var DatePanel = defineComponent({
25063
25175
  }, [(_c = (_b = (_a = this.$slots).shortcuts) == null ? void 0 : _b.call(_a)) != null ? _c : null]) : null]);
25064
25176
  }
25065
25177
  });
25178
+ const timeRangeProps = {
25179
+ steps: {
25180
+ type: Array,
25181
+ default: () => []
25182
+ },
25183
+ format: {
25184
+ type: String,
25185
+ default: "HH:mm:ss"
25186
+ },
25187
+ value: {
25188
+ type: Array,
25189
+ required: true
25190
+ },
25191
+ allowCrossDay: {
25192
+ type: Boolean,
25193
+ default: false
25194
+ }
25195
+ };
25196
+ var TimeRangePanel = defineComponent({
25197
+ name: "TimeRangePanel",
25198
+ props: __spreadValues(__spreadValues(__spreadValues({}, datePickerProps), timePanelProps), timeRangeProps),
25199
+ emits: ["pick", "pick-click"],
25200
+ setup(props2, {
25201
+ emit
25202
+ }) {
25203
+ const [dateStart, dateEnd] = props2.value.slice();
25204
+ const state = reactive({
25205
+ showDate: false,
25206
+ dateStart: dateStart || initTime(),
25207
+ dateEnd: dateEnd || initTime()
25208
+ });
25209
+ const parentProvide = inject(timePickerKey);
25210
+ const showSeconds = computed(() => !(props2.format || "").match(/mm$/));
25211
+ const leftDatePanelLabel = computed(() => fecha.format(parentProvide.dates[0], props2.format));
25212
+ const rightDatePanelLabel = computed(() => fecha.format(parentProvide.dates[1], props2.format));
25213
+ watch(() => props2.value, (dates) => {
25214
+ const [dateStart2, dateEnd2] = dates.slice();
25215
+ state.dateStart = dateStart2 || initTime();
25216
+ state.dateEnd = dateEnd2 || initTime();
25217
+ });
25218
+ onMounted(() => {
25219
+ if (parentProvide && parentProvide.parentName === "DatePanel") {
25220
+ state.showDate = true;
25221
+ }
25222
+ });
25223
+ function handlePickClick() {
25224
+ emit("pick-click");
25225
+ }
25226
+ function handleChange(idx, start2, end2, isEmit = true) {
25227
+ let dateStart2 = new Date(state.dateStart);
25228
+ let dateEnd2 = new Date(state.dateEnd);
25229
+ Object.keys(start2).forEach((type) => {
25230
+ dateStart2[`set${capitalize(type)}`](start2[type]);
25231
+ });
25232
+ Object.keys(end2).forEach((type) => {
25233
+ dateEnd2[`set${capitalize(type)}`](end2[type]);
25234
+ });
25235
+ if (!props2.allowCrossDay && dateEnd2 < dateStart2) {
25236
+ if (idx === "start") {
25237
+ dateEnd2 = dateStart2;
25238
+ }
25239
+ if (idx === "end") {
25240
+ dateStart2 = dateEnd2;
25241
+ }
25242
+ }
25243
+ if (isEmit) {
25244
+ emit("pick", [dateStart2, dateEnd2], true, "time");
25245
+ }
25246
+ }
25247
+ function handleStartChange(date) {
25248
+ handleChange("start", date, {});
25249
+ }
25250
+ function handleEndChange(date) {
25251
+ handleChange("end", {}, date);
25252
+ }
25253
+ const timeSpinnerRef = ref(null);
25254
+ const timeSpinnerEndRef = ref(null);
25255
+ function updateScroll() {
25256
+ var _a, _b;
25257
+ (_a = timeSpinnerRef == null ? void 0 : timeSpinnerRef.value) == null ? void 0 : _a.updateScroll();
25258
+ (_b = timeSpinnerEndRef == null ? void 0 : timeSpinnerEndRef.value) == null ? void 0 : _b.updateScroll();
25259
+ }
25260
+ return __spreadProps(__spreadValues({}, toRefs(state)), {
25261
+ showSeconds,
25262
+ leftDatePanelLabel,
25263
+ rightDatePanelLabel,
25264
+ handleStartChange,
25265
+ handleEndChange,
25266
+ handlePickClick,
25267
+ updateScroll,
25268
+ timeSpinnerRef,
25269
+ timeSpinnerEndRef
25270
+ });
25271
+ },
25272
+ render() {
25273
+ return createVNode("div", {
25274
+ "class": ["bk-picker-panel-body-wrapper", "bk-time-picker-with-range", this.showSeconds ? "bk-time-picker-with-seconds" : ""],
25275
+ "onMousedown": (e) => {
25276
+ e.preventDefault();
25277
+ }
25278
+ }, [createVNode("div", {
25279
+ "class": "bk-picker-panel-body",
25280
+ "style": {
25281
+ width: `${this.width * 2}px`
25282
+ }
25283
+ }, [createVNode("div", {
25284
+ "class": "bk-picker-panel-content bk-picker-panel-content-left",
25285
+ "style": {
25286
+ width: `${this.width}px`
25287
+ }
25288
+ }, [this.showDate ? createVNode("div", {
25289
+ "class": "bk-time-picker-header"
25290
+ }, [this.leftDatePanelLabel]) : "", createVNode(TimeSpinner, {
25291
+ "ref": "timeSpinnerRef",
25292
+ "steps": this.steps,
25293
+ "showSeconds": this.showSeconds,
25294
+ "hours": this.value[0] && this.dateStart.getHours(),
25295
+ "minutes": this.value[0] && this.dateStart.getMinutes(),
25296
+ "seconds": this.value[0] && this.dateStart.getSeconds(),
25297
+ "disabledHours": this.disabledHours,
25298
+ "disabledMinutes": this.disabledMinutes,
25299
+ "disabledSeconds": this.disabledSeconds,
25300
+ "hideDisabledOptions": this.hideDisabledOptions,
25301
+ "onChange": this.handleStartChange,
25302
+ "onPick-click": this.handlePickClick
25303
+ }, null)]), createVNode("div", {
25304
+ "class": "bk-picker-panel-content bk-picker-panel-content-right",
25305
+ "style": {
25306
+ width: `${this.width}px`
25307
+ }
25308
+ }, [this.showDate ? createVNode("div", {
25309
+ "class": "bk-time-picker-header"
25310
+ }, [this.rightDatePanelLabel]) : "", createVNode(TimeSpinner, {
25311
+ "ref": "timeSpinnerEndRef",
25312
+ "steps": this.steps,
25313
+ "showSeconds": this.showSeconds,
25314
+ "hours": this.value[1] && this.dateEnd.getHours(),
25315
+ "minutes": this.value[1] && this.dateEnd.getMinutes(),
25316
+ "seconds": this.value[1] && this.dateEnd.getSeconds(),
25317
+ "disabledHours": this.disabledHours,
25318
+ "disabledMinutes": this.disabledMinutes,
25319
+ "disabledSeconds": this.disabledSeconds,
25320
+ "hideDisabledOptions": this.hideDisabledOptions,
25321
+ "onChange": this.handleEndChange,
25322
+ "onPick-click": this.handlePickClick
25323
+ }, null)])])]);
25324
+ }
25325
+ });
25066
25326
  const dateRangePanelProps = {
25067
25327
  modelValue: {
25068
25328
  type: [Date, String, Number, Array]
@@ -25117,7 +25377,7 @@ const dateRangePanelProps = {
25117
25377
  type: Boolean,
25118
25378
  default: false
25119
25379
  },
25120
- disableDate: Function,
25380
+ disabledDate: Function,
25121
25381
  focusedDate: {
25122
25382
  type: Date,
25123
25383
  required: true
@@ -25125,12 +25385,20 @@ const dateRangePanelProps = {
25125
25385
  confirm: {
25126
25386
  type: Boolean,
25127
25387
  default: false
25388
+ },
25389
+ format: {
25390
+ type: String,
25391
+ default: "yyyy-MM-dd"
25392
+ },
25393
+ timePickerOptions: {
25394
+ type: Object,
25395
+ default: () => ({})
25128
25396
  }
25129
25397
  };
25130
25398
  var DateRangePanel = defineComponent({
25131
25399
  name: "DateRangePanel",
25132
25400
  props: dateRangePanelProps,
25133
- emits: ["pick", "pick-success"],
25401
+ emits: ["pick", "pick-success", "pick-clear", "pick-click"],
25134
25402
  setup(props2, {
25135
25403
  slots,
25136
25404
  emit
@@ -25151,6 +25419,13 @@ var DateRangePanel = defineComponent({
25151
25419
  upToNowEnable: false,
25152
25420
  dates: props2.modelValue
25153
25421
  });
25422
+ const {
25423
+ proxy
25424
+ } = getCurrentInstance();
25425
+ provide(timePickerKey, {
25426
+ dates: state.dates,
25427
+ parentName: proxy.$options.name
25428
+ });
25154
25429
  const dateSorter = (a2, b2) => {
25155
25430
  if (!a2 || !b2) {
25156
25431
  return 0;
@@ -25243,7 +25518,6 @@ var DateRangePanel = defineComponent({
25243
25518
  emit("pick", state.dates, visible, type || props2.type);
25244
25519
  };
25245
25520
  const handleRangePick = (val, type) => {
25246
- console.warn("handleRangePick");
25247
25521
  if (state.rangeState.selecting || state.currentView === "time") {
25248
25522
  if (state.currentView === "time") {
25249
25523
  state.dates = val;
@@ -25302,9 +25576,26 @@ var DateRangePanel = defineComponent({
25302
25576
  const handleChangeRange = (val) => {
25303
25577
  state.rangeState.to = val;
25304
25578
  };
25579
+ function setPanelDates(leftPanelDate2) {
25580
+ state.leftPanelDate = leftPanelDate2;
25581
+ const rightPanelDate = new Date(leftPanelDate2.getFullYear(), leftPanelDate2.getMonth() + 1, 1);
25582
+ const splitRightPanelDate = state.dates[1] ? state.dates[1].getTime() : state.dates[1];
25583
+ state.rightPanelDate = props2.splitPanels ? new Date(Math.max(splitRightPanelDate, rightPanelDate.getTime())) : rightPanelDate;
25584
+ }
25305
25585
  watch(() => props2.selectionMode, (v2) => {
25306
25586
  state.currentView = v2 || "range";
25307
25587
  });
25588
+ watch(() => props2.modelValue, (newVal) => {
25589
+ const minDate2 = newVal[0] ? toDate(newVal[0]) : null;
25590
+ const maxDate2 = newVal[1] ? toDate(newVal[1]) : null;
25591
+ state.dates = [minDate2, maxDate2].sort(dateSorter);
25592
+ state.rangeState = {
25593
+ from: state.dates[0],
25594
+ to: state.dates[1],
25595
+ selecting: false
25596
+ };
25597
+ setPanelDates(props2.startDate || state.dates[0] || new Date());
25598
+ });
25308
25599
  const isTime = computed(() => state.currentView === "time");
25309
25600
  const leftDatePanelLabel = computed(() => panelLabelConfig("left"));
25310
25601
  const rightDatePanelLabel = computed(() => panelLabelConfig("right"));
@@ -25329,6 +25620,26 @@ var DateRangePanel = defineComponent({
25329
25620
  var _a;
25330
25621
  return slots.shortcuts || ((_a = props2.shortcuts) == null ? void 0 : _a.length);
25331
25622
  });
25623
+ const handleToggleTime = () => {
25624
+ state.currentView = state.currentView === "time" ? "date" : "time";
25625
+ };
25626
+ const resetView = () => {
25627
+ setTimeout(() => {
25628
+ state.currentView = props2.selectionMode;
25629
+ }, 500);
25630
+ };
25631
+ const handlePickSuccess = () => {
25632
+ resetView();
25633
+ emit("pick-success");
25634
+ };
25635
+ const handlePickClear = () => {
25636
+ resetView();
25637
+ emit("pick-clear");
25638
+ };
25639
+ function handlePickClick() {
25640
+ emit("pick-click");
25641
+ }
25642
+ const timeDisabled = computed(() => !(state.dates[0] && state.dates[1]));
25332
25643
  return __spreadProps(__spreadValues({}, toRefs(state)), {
25333
25644
  isTime,
25334
25645
  hasShortcuts,
@@ -25346,14 +25657,39 @@ var DateRangePanel = defineComponent({
25346
25657
  rightShowLabelSecond,
25347
25658
  preSelecting,
25348
25659
  panelPickerHandlers,
25660
+ timeDisabled,
25349
25661
  handleShortcutClick,
25350
25662
  reset: reset2,
25351
25663
  onToggleVisibility,
25352
25664
  handleRangePick,
25353
- handleChangeRange
25665
+ handleChangeRange,
25666
+ handleToggleTime,
25667
+ handlePickSuccess,
25668
+ handlePickClear,
25669
+ handlePickClick
25354
25670
  });
25355
25671
  },
25356
25672
  render() {
25673
+ let shortcuts = null;
25674
+ if (this.hasShortcuts) {
25675
+ let inner = "";
25676
+ if (this.$slots.shortcuts) {
25677
+ inner = typeof this.$slots.shortcuts === "function" ? this.$slots.shortcuts() : this.$slots.shortcuts;
25678
+ } else {
25679
+ if (this.shortcuts.length) {
25680
+ inner = createVNode("div", {
25681
+ "class": "bk-picker-panel-shortcuts"
25682
+ }, [this.shortcuts.map((item, index) => createVNode("div", {
25683
+ "key": index,
25684
+ "class": "shortcuts-item",
25685
+ "onClick": () => this.handleShortcutClick(item, index)
25686
+ }, [item.text]))]);
25687
+ }
25688
+ }
25689
+ shortcuts = createVNode("div", {
25690
+ "class": "bk-picker-panel-sidebar"
25691
+ }, [inner]);
25692
+ }
25357
25693
  return createVNode("div", {
25358
25694
  "class": ["bk-picker-panel-body-wrapper", "bk-date-picker-with-range", this.shortcuts.length || this.$slots.shortcuts ? "bk-picker-panel-with-sidebar" : ""],
25359
25695
  "onMousedown": (e) => {
@@ -25410,7 +25746,7 @@ var DateRangePanel = defineComponent({
25410
25746
  return createVNode(DateTable, {
25411
25747
  "selectionMode": "range",
25412
25748
  "tableDate": this.leftPanelDate,
25413
- "disableDate": this.disableDate,
25749
+ "disabledDate": this.disabledDate,
25414
25750
  "rangeState": this.rangeState,
25415
25751
  "modelValue": this.preSelecting.left ? [this.dates[0]] : this.dates,
25416
25752
  "focusedDate": this.focusedDate,
@@ -25479,7 +25815,7 @@ var DateRangePanel = defineComponent({
25479
25815
  return createVNode(DateTable, {
25480
25816
  "selectionMode": "range",
25481
25817
  "tableDate": this.rightPanelDate,
25482
- "disableDate": this.disableDate,
25818
+ "disabledDate": this.disabledDate,
25483
25819
  "rangeState": this.rangeState,
25484
25820
  "modelValue": this.preSelecting.right ? [this.dates[this.dates.length - 1]] : this.dates,
25485
25821
  "focusedDate": this.focusedDate,
@@ -25489,15 +25825,25 @@ var DateRangePanel = defineComponent({
25489
25825
  default:
25490
25826
  return null;
25491
25827
  }
25492
- })() : ""]), [[vShow, !this.isTime]])]), this.hasShortcuts ? createVNode("div", {
25493
- "class": "bk-picker-panel-sidebar"
25494
- }, [this.$slots.shortcuts ? typeof this.$slots.shortcuts === "function" ? this.$slots.shortcuts() : this.$slots.shortcuts : this.shortcuts.length ? createVNode("div", {
25495
- "class": "bk-picker-panel-shortcuts"
25496
- }, [this.shortcuts.map((item, index) => createVNode("div", {
25497
- "key": index,
25498
- "class": "shortcuts-item",
25499
- "onClick": () => this.handleShortcutClick(item, index)
25500
- }, [item.text]))]) : ""]) : null]);
25828
+ })() : ""]), [[vShow, !this.isTime]]), this.isTime ? createVNode(TimeRangePanel, {
25829
+ "ref": "timePickerRef",
25830
+ "value": this.dates,
25831
+ "format": this.format,
25832
+ "disabledDate": this.disabledDate,
25833
+ "onPick": this.handleRangePick,
25834
+ "onPick-click": this.handlePickClick,
25835
+ "onPick-clear": this.handlePickClear,
25836
+ "onPick-success": this.handlePickSuccess,
25837
+ "onPick-toggle-time": this.handleToggleTime
25838
+ }, null) : "", this.confirm ? createVNode(Confirm, {
25839
+ "clearable": this.clearable,
25840
+ "showTime": this.showTime,
25841
+ "timeDisabled": this.timeDisabled,
25842
+ "isTime": this.isTime,
25843
+ "onPick-toggle-time": this.handleToggleTime,
25844
+ "onPick-clear": this.handlePickClear,
25845
+ "onPick-success": this.handlePickSuccess
25846
+ }, null) : ""]), shortcuts]);
25501
25847
  }
25502
25848
  });
25503
25849
  var Component$a = defineComponent({
@@ -25729,7 +26075,7 @@ var Component$a = defineComponent({
25729
26075
  const newValue = e.target.value;
25730
26076
  const newDate = parseDate(newValue, props2.type, props2.multiple, props2.format);
25731
26077
  const valueToTest = isArrayValue ? newDate : newDate[0];
25732
- const isDisabled = (_a = props2.disableDate) == null ? void 0 : _a.call(props2, valueToTest);
26078
+ const isDisabled = (_a = props2.disabledDate) == null ? void 0 : _a.call(props2, valueToTest);
25733
26079
  const isValidDate = newDate.reduce((valid, date) => valid && date instanceof Date, true);
25734
26080
  if (newValue !== oldValue && !isDisabled && isValidDate) {
25735
26081
  emitChange(props2.type);
@@ -25995,15 +26341,18 @@ var Component$a = defineComponent({
25995
26341
  }, [(_c2 = (_b2 = (_a2 = this.$slots).header) == null ? void 0 : _b2.call(_a2)) != null ? _c2 : null]) : null, this.panel === "DateRangePanel" ? createVNode(DateRangePanel, {
25996
26342
  "ref": "pickerPanelRef",
25997
26343
  "type": this.type,
26344
+ "showTime": this.type === "datetime" || this.type === "datetimerange",
25998
26345
  "confirm": this.isConfirm,
25999
26346
  "shortcuts": this.shortcuts,
26000
26347
  "shortcutClose": this.shortcutClose,
26001
26348
  "modelValue": this.internalValue,
26002
26349
  "selectionMode": this.selectionMode,
26003
26350
  "startDate": this.startDate,
26004
- "disableDate": this.disableDate,
26351
+ "disabledDate": this.disabledDate,
26005
26352
  "focusedDate": this.focusedDate,
26353
+ "timePickerOptions": this.timePickerOptions,
26006
26354
  "onPick": this.onPick,
26355
+ "onPick-clear": this.handleClear,
26007
26356
  "onPick-success": this.onPickSuccess,
26008
26357
  "onSelection-mode-change": this.onSelectionModeChange
26009
26358
  }, shortcutsSlot) : createVNode(DatePanel, {
@@ -26017,8 +26366,9 @@ var Component$a = defineComponent({
26017
26366
  "selectionMode": this.selectionMode,
26018
26367
  "modelValue": this.internalValue,
26019
26368
  "startDate": this.startDate,
26020
- "disableDate": this.disableDate,
26369
+ "disabledDate": this.disabledDate,
26021
26370
  "focusedDate": this.focusedDate,
26371
+ "timePickerOptions": this.timePickerOptions,
26022
26372
  "onPick": this.onPick,
26023
26373
  "onPick-clear": this.handleClear,
26024
26374
  "onPick-success": this.onPickSuccess,
@@ -26268,7 +26618,7 @@ var TimePicker = defineComponent({
26268
26618
  const newValue = e.target.value;
26269
26619
  const newDate = parseDate(newValue, props2.type, props2.multiple, props2.format);
26270
26620
  const valueToTest = isArrayValue ? newDate : newDate[0];
26271
- const isDisabled = (_a = props2.disableDate) == null ? void 0 : _a.call(props2, valueToTest);
26621
+ const isDisabled = (_a = props2.disabledDate) == null ? void 0 : _a.call(props2, valueToTest);
26272
26622
  const isValidDate = newDate.reduce((valid, date) => valid && date instanceof Date, true);
26273
26623
  if (newValue !== oldValue && !isDisabled && isValidDate) {
26274
26624
  emitChange(props2.type);
@@ -26290,8 +26640,8 @@ var TimePicker = defineComponent({
26290
26640
  }
26291
26641
  };
26292
26642
  const reset2 = () => {
26293
- var _a;
26294
- (_a = pickerPanelRef == null ? void 0 : pickerPanelRef.value) == null ? void 0 : _a.reset();
26643
+ var _a, _b;
26644
+ (_b = (_a = pickerPanelRef == null ? void 0 : pickerPanelRef.value) == null ? void 0 : _a.reset) == null ? void 0 : _b.call(_a);
26295
26645
  };
26296
26646
  const handleBlur = (e) => {
26297
26647
  var _a, _b;
@@ -26403,8 +26753,6 @@ var TimePicker = defineComponent({
26403
26753
  emit("shortcut-change", state.shortcut, shortcutIndex);
26404
26754
  };
26405
26755
  const triggerRef = ref(null);
26406
- console.error(panel);
26407
- console.error(panel.value);
26408
26756
  return __spreadProps(__spreadValues({}, toRefs(state)), {
26409
26757
  panel,
26410
26758
  publicStringValue,
@@ -26538,7 +26886,22 @@ var TimePicker = defineComponent({
26538
26886
  var _a2, _b2, _c2, _d, _e, _f;
26539
26887
  return [this.hasHeader ? createVNode("div", {
26540
26888
  "class": ["bk-date-picker-top-wrapper", this.headerSlotCls]
26541
- }, [(_c2 = (_b2 = (_a2 = this.$slots).header) == null ? void 0 : _b2.call(_a2)) != null ? _c2 : null]) : null, createVNode(TimePanel, {
26889
+ }, [(_c2 = (_b2 = (_a2 = this.$slots).header) == null ? void 0 : _b2.call(_a2)) != null ? _c2 : null]) : null, this.panel === "RangeTimePickerPanel" ? createVNode(TimeRangePanel, {
26890
+ "ref": "pickerPanelRef",
26891
+ "clearable": this.clearable,
26892
+ "shortcuts": this.shortcuts,
26893
+ "multiple": this.multiple,
26894
+ "shortcutClose": this.shortcutClose,
26895
+ "value": this.internalValue,
26896
+ "startDate": this.startDate,
26897
+ "disabledDate": this.disabledDate,
26898
+ "onPick": this.onPick,
26899
+ "onPick-clear": this.handleClear,
26900
+ "onPick-success": this.onPickSuccess,
26901
+ "disabledHours": this.ownPickerProps.disabledHours,
26902
+ "disabledMinutes": this.ownPickerProps.disabledMinutes,
26903
+ "disabledSeconds": this.ownPickerProps.disabledSeconds
26904
+ }, shortcutsSlot) : createVNode(TimePanel, {
26542
26905
  "ref": "pickerPanelRef",
26543
26906
  "clearable": this.clearable,
26544
26907
  "confirm": this.isConfirm,
@@ -26547,7 +26910,7 @@ var TimePicker = defineComponent({
26547
26910
  "shortcutClose": this.shortcutClose,
26548
26911
  "value": this.internalValue,
26549
26912
  "startDate": this.startDate,
26550
- "disableDate": this.disableDate,
26913
+ "disabledDate": this.disabledDate,
26551
26914
  "onPick": this.onPick,
26552
26915
  "onPick-clear": this.handleClear,
26553
26916
  "onPick-success": this.onPickSuccess,