PanelBody.js 3.0 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495
  1. import _extends from "@babel/runtime/helpers/esm/extends";
  2. import { createVNode as _createVNode } from "vue";
  3. import { useInjectPanel } from '../PanelContext';
  4. import { getLastDay } from '../utils/timeUtil';
  5. import { getCellDateDisabled } from '../utils/dateUtil';
  6. import classNames from '../../_util/classNames';
  7. import useMergeProps from '../hooks/useMergeProps';
  8. function PanelBody(_props) {
  9. const {
  10. prefixCls,
  11. disabledDate,
  12. onSelect,
  13. picker,
  14. rowNum,
  15. colNum,
  16. prefixColumn,
  17. rowClassName,
  18. baseDate,
  19. getCellClassName,
  20. getCellText,
  21. getCellNode,
  22. getCellDate,
  23. generateConfig,
  24. titleCell,
  25. headerCells
  26. } = useMergeProps(_props);
  27. const {
  28. onDateMouseenter,
  29. onDateMouseleave,
  30. mode
  31. } = useInjectPanel();
  32. const cellPrefixCls = `${prefixCls}-cell`;
  33. // =============================== Body ===============================
  34. const rows = [];
  35. for (let i = 0; i < rowNum; i += 1) {
  36. const row = [];
  37. let rowStartDate;
  38. for (let j = 0; j < colNum; j += 1) {
  39. const offset = i * colNum + j;
  40. const currentDate = getCellDate(baseDate, offset);
  41. const disabled = getCellDateDisabled({
  42. cellDate: currentDate,
  43. mode: mode.value,
  44. disabledDate,
  45. generateConfig
  46. });
  47. if (j === 0) {
  48. rowStartDate = currentDate;
  49. if (prefixColumn) {
  50. row.push(prefixColumn(rowStartDate));
  51. }
  52. }
  53. const title = titleCell && titleCell(currentDate);
  54. row.push(_createVNode("td", {
  55. "key": j,
  56. "title": title,
  57. "class": classNames(cellPrefixCls, _extends({
  58. [`${cellPrefixCls}-disabled`]: disabled,
  59. [`${cellPrefixCls}-start`]: getCellText(currentDate) === 1 || picker === 'year' && Number(title) % 10 === 0,
  60. [`${cellPrefixCls}-end`]: title === getLastDay(generateConfig, currentDate) || picker === 'year' && Number(title) % 10 === 9
  61. }, getCellClassName(currentDate))),
  62. "onClick": e => {
  63. e.stopPropagation();
  64. if (!disabled) {
  65. onSelect(currentDate);
  66. }
  67. },
  68. "onMouseenter": () => {
  69. if (!disabled && onDateMouseenter) {
  70. onDateMouseenter(currentDate);
  71. }
  72. },
  73. "onMouseleave": () => {
  74. if (!disabled && onDateMouseleave) {
  75. onDateMouseleave(currentDate);
  76. }
  77. }
  78. }, [getCellNode ? getCellNode(currentDate) : _createVNode("div", {
  79. "class": `${cellPrefixCls}-inner`
  80. }, [getCellText(currentDate)])]));
  81. }
  82. rows.push(_createVNode("tr", {
  83. "key": i,
  84. "class": rowClassName && rowClassName(rowStartDate)
  85. }, [row]));
  86. }
  87. return _createVNode("div", {
  88. "class": `${prefixCls}-body`
  89. }, [_createVNode("table", {
  90. "class": `${prefixCls}-content`
  91. }, [headerCells && _createVNode("thead", null, [_createVNode("tr", null, [headerCells])]), _createVNode("tbody", null, [rows])])]);
  92. }
  93. PanelBody.displayName = 'PanelBody';
  94. PanelBody.inheritAttrs = false;
  95. export default PanelBody;