MonthBody.js 2.1 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162
  1. import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
  2. import { createVNode as _createVNode } from "vue";
  3. import { formatValue, isSameMonth } from '../../utils/dateUtil';
  4. import { useInjectRange } from '../../RangeContext';
  5. import useCellClassName from '../../hooks/useCellClassName';
  6. import PanelBody from '../PanelBody';
  7. import useMergeProps from '../../hooks/useMergeProps';
  8. export const MONTH_COL_COUNT = 3;
  9. const MONTH_ROW_COUNT = 4;
  10. function MonthBody(_props) {
  11. const props = useMergeProps(_props);
  12. const {
  13. prefixCls,
  14. locale,
  15. value,
  16. viewDate,
  17. generateConfig,
  18. monthCellRender
  19. } = props;
  20. const {
  21. rangedValue,
  22. hoverRangedValue
  23. } = useInjectRange();
  24. const cellPrefixCls = `${prefixCls}-cell`;
  25. const getCellClassName = useCellClassName({
  26. cellPrefixCls,
  27. value,
  28. generateConfig,
  29. rangedValue: rangedValue.value,
  30. hoverRangedValue: hoverRangedValue.value,
  31. isSameCell: (current, target) => isSameMonth(generateConfig, current, target),
  32. isInView: () => true,
  33. offsetCell: (date, offset) => generateConfig.addMonth(date, offset)
  34. });
  35. const monthsLocale = locale.shortMonths || (generateConfig.locale.getShortMonths ? generateConfig.locale.getShortMonths(locale.locale) : []);
  36. const baseMonth = generateConfig.setMonth(viewDate, 0);
  37. const getCellNode = monthCellRender ? date => monthCellRender({
  38. current: date,
  39. locale
  40. }) : undefined;
  41. return _createVNode(PanelBody, _objectSpread(_objectSpread({}, props), {}, {
  42. "rowNum": MONTH_ROW_COUNT,
  43. "colNum": MONTH_COL_COUNT,
  44. "baseDate": baseMonth,
  45. "getCellNode": getCellNode,
  46. "getCellText": date => locale.monthFormat ? formatValue(date, {
  47. locale,
  48. format: locale.monthFormat,
  49. generateConfig
  50. }) : monthsLocale[generateConfig.getMonth(date)],
  51. "getCellClassName": getCellClassName,
  52. "getCellDate": generateConfig.addMonth,
  53. "titleCell": date => formatValue(date, {
  54. locale,
  55. format: 'YYYY-MM',
  56. generateConfig
  57. })
  58. }), null);
  59. }
  60. MonthBody.displayName = 'MonthBody';
  61. MonthBody.inheritAttrs = false;
  62. export default MonthBody;