CalendarDay.mjs 3.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129
  1. import { createVNode as _createVNode } from "vue";
  2. import { computed, defineComponent } from "vue";
  3. import { makeNumberProp, createNamespace, makeRequiredProp } from "../utils/index.mjs";
  4. import { bem } from "./utils.mjs";
  5. const [name] = createNamespace("calendar-day");
  6. var stdin_default = defineComponent({
  7. name,
  8. props: {
  9. item: makeRequiredProp(Object),
  10. color: String,
  11. index: Number,
  12. offset: makeNumberProp(0),
  13. rowHeight: String
  14. },
  15. emits: ["click"],
  16. setup(props, {
  17. emit,
  18. slots
  19. }) {
  20. const style = computed(() => {
  21. var _a;
  22. const {
  23. item,
  24. index,
  25. color,
  26. offset,
  27. rowHeight
  28. } = props;
  29. const style2 = {
  30. height: rowHeight
  31. };
  32. if (item.type === "placeholder") {
  33. style2.width = "100%";
  34. return style2;
  35. }
  36. if (index === 0) {
  37. style2.marginLeft = `${100 * offset / 7}%`;
  38. }
  39. if (color) {
  40. switch (item.type) {
  41. case "end":
  42. case "start":
  43. case "start-end":
  44. case "multiple-middle":
  45. case "multiple-selected":
  46. style2.background = color;
  47. break;
  48. case "middle":
  49. style2.color = color;
  50. break;
  51. }
  52. }
  53. if (offset + (((_a = item.date) == null ? void 0 : _a.getDate()) || 1) > 28) {
  54. style2.marginBottom = 0;
  55. }
  56. return style2;
  57. });
  58. const onClick = () => {
  59. if (props.item.type !== "disabled") {
  60. emit("click", props.item);
  61. }
  62. };
  63. const renderTopInfo = () => {
  64. const {
  65. topInfo
  66. } = props.item;
  67. if (topInfo || slots["top-info"]) {
  68. return _createVNode("div", {
  69. "class": bem("top-info")
  70. }, [slots["top-info"] ? slots["top-info"](props.item) : topInfo]);
  71. }
  72. };
  73. const renderBottomInfo = () => {
  74. const {
  75. bottomInfo
  76. } = props.item;
  77. if (bottomInfo || slots["bottom-info"]) {
  78. return _createVNode("div", {
  79. "class": bem("bottom-info")
  80. }, [slots["bottom-info"] ? slots["bottom-info"](props.item) : bottomInfo]);
  81. }
  82. };
  83. const renderContent = () => {
  84. const {
  85. item,
  86. color,
  87. rowHeight
  88. } = props;
  89. const {
  90. type,
  91. text
  92. } = item;
  93. const Nodes = [renderTopInfo(), text, renderBottomInfo()];
  94. if (type === "selected") {
  95. return _createVNode("div", {
  96. "class": bem("selected-day"),
  97. "style": {
  98. width: rowHeight,
  99. height: rowHeight,
  100. background: color
  101. }
  102. }, [Nodes]);
  103. }
  104. return Nodes;
  105. };
  106. return () => {
  107. const {
  108. type,
  109. className
  110. } = props.item;
  111. if (type === "placeholder") {
  112. return _createVNode("div", {
  113. "class": bem("day"),
  114. "style": style.value
  115. }, null);
  116. }
  117. return _createVNode("div", {
  118. "role": "gridcell",
  119. "style": style.value,
  120. "class": [bem("day", type), className],
  121. "tabindex": type === "disabled" ? void 0 : -1,
  122. "onClick": onClick
  123. }, [renderContent()]);
  124. };
  125. }
  126. });
  127. export {
  128. stdin_default as default
  129. };