use-date-table.js 3.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105
  1. 'use strict';
  2. Object.defineProperty(exports, '__esModule', { value: true });
  3. var vue = require('vue');
  4. var dayjs = require('dayjs');
  5. var localeData = require('dayjs/plugin/localeData.js');
  6. require('../../../hooks/index.js');
  7. require('../../time-picker/index.js');
  8. require('../../../constants/index.js');
  9. var dateTable = require('./date-table.js');
  10. var index = require('../../../hooks/use-locale/index.js');
  11. var utils = require('../../time-picker/src/utils.js');
  12. var date = require('../../../constants/date.js');
  13. function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
  14. var dayjs__default = /*#__PURE__*/_interopDefaultLegacy(dayjs);
  15. var localeData__default = /*#__PURE__*/_interopDefaultLegacy(localeData);
  16. const useDateTable = (props, emit) => {
  17. dayjs__default["default"].extend(localeData__default["default"]);
  18. const firstDayOfWeek = dayjs__default["default"].localeData().firstDayOfWeek();
  19. const { t, lang } = index.useLocale();
  20. const now = dayjs__default["default"]().locale(lang.value);
  21. const isInRange = vue.computed(() => !!props.range && !!props.range.length);
  22. const rows = vue.computed(() => {
  23. let days = [];
  24. if (isInRange.value) {
  25. const [start, end] = props.range;
  26. const currentMonthRange = utils.rangeArr(end.date() - start.date() + 1).map((index) => ({
  27. text: start.date() + index,
  28. type: "current"
  29. }));
  30. let remaining = currentMonthRange.length % 7;
  31. remaining = remaining === 0 ? 0 : 7 - remaining;
  32. const nextMonthRange = utils.rangeArr(remaining).map((_, index) => ({
  33. text: index + 1,
  34. type: "next"
  35. }));
  36. days = currentMonthRange.concat(nextMonthRange);
  37. } else {
  38. const firstDay = props.date.startOf("month").day();
  39. const prevMonthDays = dateTable.getPrevMonthLastDays(props.date, (firstDay - firstDayOfWeek + 7) % 7).map((day) => ({
  40. text: day,
  41. type: "prev"
  42. }));
  43. const currentMonthDays = dateTable.getMonthDays(props.date).map((day) => ({
  44. text: day,
  45. type: "current"
  46. }));
  47. days = [...prevMonthDays, ...currentMonthDays];
  48. const remaining = 7 - (days.length % 7 || 7);
  49. const nextMonthDays = utils.rangeArr(remaining).map((_, index) => ({
  50. text: index + 1,
  51. type: "next"
  52. }));
  53. days = days.concat(nextMonthDays);
  54. }
  55. return dateTable.toNestedArr(days);
  56. });
  57. const weekDays = vue.computed(() => {
  58. const start = firstDayOfWeek;
  59. if (start === 0) {
  60. return date.WEEK_DAYS.map((_) => t(`el.datepicker.weeks.${_}`));
  61. } else {
  62. return date.WEEK_DAYS.slice(start).concat(date.WEEK_DAYS.slice(0, start)).map((_) => t(`el.datepicker.weeks.${_}`));
  63. }
  64. });
  65. const getFormattedDate = (day, type) => {
  66. switch (type) {
  67. case "prev":
  68. return props.date.startOf("month").subtract(1, "month").date(day);
  69. case "next":
  70. return props.date.startOf("month").add(1, "month").date(day);
  71. case "current":
  72. return props.date.date(day);
  73. }
  74. };
  75. const handlePickDay = ({ text, type }) => {
  76. const date = getFormattedDate(text, type);
  77. emit("pick", date);
  78. };
  79. const getSlotData = ({ text, type }) => {
  80. const day = getFormattedDate(text, type);
  81. return {
  82. isSelected: day.isSame(props.selectedDay),
  83. type: `${type}-month`,
  84. day: day.format("YYYY-MM-DD"),
  85. date: day.toDate()
  86. };
  87. };
  88. return {
  89. now,
  90. isInRange,
  91. rows,
  92. weekDays,
  93. getFormattedDate,
  94. handlePickDay,
  95. getSlotData
  96. };
  97. };
  98. exports.useDateTable = useDateTable;
  99. //# sourceMappingURL=use-date-table.js.map