YearBody.js 2.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960
  1. import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
  2. import { createVNode as _createVNode } from "vue";
  3. import { YEAR_DECADE_COUNT } from '.';
  4. import useCellClassName from '../../hooks/useCellClassName';
  5. import { formatValue, isSameYear } from '../../utils/dateUtil';
  6. import { useInjectRange } from '../../RangeContext';
  7. import PanelBody from '../PanelBody';
  8. import useMergeProps from '../../hooks/useMergeProps';
  9. export const YEAR_COL_COUNT = 3;
  10. const YEAR_ROW_COUNT = 4;
  11. function YearBody(_props) {
  12. const props = useMergeProps(_props);
  13. const {
  14. prefixCls,
  15. value,
  16. viewDate,
  17. locale,
  18. generateConfig
  19. } = props;
  20. const {
  21. rangedValue,
  22. hoverRangedValue
  23. } = useInjectRange();
  24. const yearPrefixCls = `${prefixCls}-cell`;
  25. // =============================== Year ===============================
  26. const yearNumber = generateConfig.getYear(viewDate);
  27. const startYear = Math.floor(yearNumber / YEAR_DECADE_COUNT) * YEAR_DECADE_COUNT;
  28. const endYear = startYear + YEAR_DECADE_COUNT - 1;
  29. const baseYear = generateConfig.setYear(viewDate, startYear - Math.ceil((YEAR_COL_COUNT * YEAR_ROW_COUNT - YEAR_DECADE_COUNT) / 2));
  30. const isInView = date => {
  31. const currentYearNumber = generateConfig.getYear(date);
  32. return startYear <= currentYearNumber && currentYearNumber <= endYear;
  33. };
  34. const getCellClassName = useCellClassName({
  35. cellPrefixCls: yearPrefixCls,
  36. value,
  37. generateConfig,
  38. rangedValue: rangedValue.value,
  39. hoverRangedValue: hoverRangedValue.value,
  40. isSameCell: (current, target) => isSameYear(generateConfig, current, target),
  41. isInView,
  42. offsetCell: (date, offset) => generateConfig.addYear(date, offset)
  43. });
  44. return _createVNode(PanelBody, _objectSpread(_objectSpread({}, props), {}, {
  45. "rowNum": YEAR_ROW_COUNT,
  46. "colNum": YEAR_COL_COUNT,
  47. "baseDate": baseYear,
  48. "getCellText": generateConfig.getYear,
  49. "getCellClassName": getCellClassName,
  50. "getCellDate": generateConfig.addYear,
  51. "titleCell": date => formatValue(date, {
  52. locale,
  53. format: 'YYYY',
  54. generateConfig
  55. })
  56. }), null);
  57. }
  58. YearBody.displayName = 'YearBody';
  59. YearBody.inheritAttrs = false;
  60. export default YearBody;