calendar2.mjs 7.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202
  1. import { defineComponent, computed, openBlock, createElementBlock, normalizeClass, unref, createElementVNode, renderSlot, toDisplayString, createVNode, withCtx, createTextVNode, createCommentVNode, createSlots, normalizeProps, guardReactiveProps, Fragment, renderList, createBlock, mergeProps } from 'vue';
  2. import { ElButtonGroup, ElButton } from '../../button/index.mjs';
  3. import DateTable from './date-table2.mjs';
  4. import { useCalendar } from './use-calendar.mjs';
  5. import { calendarProps, calendarEmits } from './calendar.mjs';
  6. import SelectController from './select-controller2.mjs';
  7. import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
  8. import { useNamespace } from '../../../hooks/use-namespace/index.mjs';
  9. import { useLocale } from '../../../hooks/use-locale/index.mjs';
  10. const COMPONENT_NAME = "ElCalendar";
  11. const _sfc_main = defineComponent({
  12. ...{
  13. name: COMPONENT_NAME
  14. },
  15. __name: "calendar",
  16. props: calendarProps,
  17. emits: calendarEmits,
  18. setup(__props, { expose: __expose, emit: __emit }) {
  19. const ns = useNamespace("calendar");
  20. const props = __props;
  21. const emit = __emit;
  22. const {
  23. calculateValidatedDateRange,
  24. date,
  25. pickDay,
  26. realSelectedDay,
  27. selectDate,
  28. validatedRange,
  29. handleDateChange
  30. } = useCalendar(props, emit, COMPONENT_NAME);
  31. const { t } = useLocale();
  32. const i18nDate = computed(() => {
  33. const pickedMonth = `el.datepicker.month${date.value.format("M")}`;
  34. return `${date.value.year()} ${t("el.datepicker.year")} ${t(pickedMonth)}`;
  35. });
  36. __expose({
  37. selectedDay: realSelectedDay,
  38. pickDay,
  39. selectDate,
  40. calculateValidatedDateRange
  41. });
  42. return (_ctx, _cache) => {
  43. return openBlock(), createElementBlock(
  44. "div",
  45. {
  46. class: normalizeClass(unref(ns).b())
  47. },
  48. [
  49. createElementVNode(
  50. "div",
  51. {
  52. class: normalizeClass(unref(ns).e("header"))
  53. },
  54. [
  55. renderSlot(_ctx.$slots, "header", { date: i18nDate.value }, () => [
  56. createElementVNode(
  57. "div",
  58. {
  59. class: normalizeClass(unref(ns).e("title"))
  60. },
  61. toDisplayString(i18nDate.value),
  62. 3
  63. ),
  64. unref(validatedRange).length === 0 && _ctx.controllerType === "button" ? (openBlock(), createElementBlock(
  65. "div",
  66. {
  67. key: 0,
  68. class: normalizeClass(unref(ns).e("button-group"))
  69. },
  70. [
  71. createVNode(unref(ElButtonGroup), null, {
  72. default: withCtx(() => [
  73. createVNode(unref(ElButton), {
  74. size: "small",
  75. onClick: _cache[0] || (_cache[0] = ($event) => unref(selectDate)("prev-month"))
  76. }, {
  77. default: withCtx(() => [
  78. createTextVNode(
  79. toDisplayString(unref(t)("el.datepicker.prevMonth")),
  80. 1
  81. )
  82. ]),
  83. _: 1
  84. }),
  85. createVNode(unref(ElButton), {
  86. size: "small",
  87. onClick: _cache[1] || (_cache[1] = ($event) => unref(selectDate)("today"))
  88. }, {
  89. default: withCtx(() => [
  90. createTextVNode(
  91. toDisplayString(unref(t)("el.datepicker.today")),
  92. 1
  93. )
  94. ]),
  95. _: 1
  96. }),
  97. createVNode(unref(ElButton), {
  98. size: "small",
  99. onClick: _cache[2] || (_cache[2] = ($event) => unref(selectDate)("next-month"))
  100. }, {
  101. default: withCtx(() => [
  102. createTextVNode(
  103. toDisplayString(unref(t)("el.datepicker.nextMonth")),
  104. 1
  105. )
  106. ]),
  107. _: 1
  108. })
  109. ]),
  110. _: 1
  111. })
  112. ],
  113. 2
  114. )) : unref(validatedRange).length === 0 && _ctx.controllerType === "select" ? (openBlock(), createElementBlock(
  115. "div",
  116. {
  117. key: 1,
  118. class: normalizeClass(unref(ns).e("select-controller"))
  119. },
  120. [
  121. createVNode(SelectController, {
  122. date: unref(date),
  123. formatter: _ctx.formatter,
  124. onDateChange: unref(handleDateChange)
  125. }, null, 8, ["date", "formatter", "onDateChange"])
  126. ],
  127. 2
  128. )) : createCommentVNode("v-if", true)
  129. ])
  130. ],
  131. 2
  132. ),
  133. unref(validatedRange).length === 0 ? (openBlock(), createElementBlock(
  134. "div",
  135. {
  136. key: 0,
  137. class: normalizeClass(unref(ns).e("body"))
  138. },
  139. [
  140. createVNode(DateTable, {
  141. date: unref(date),
  142. "selected-day": unref(realSelectedDay),
  143. onPick: unref(pickDay)
  144. }, createSlots({
  145. _: 2
  146. }, [
  147. _ctx.$slots["date-cell"] ? {
  148. name: "date-cell",
  149. fn: withCtx((data) => [
  150. renderSlot(_ctx.$slots, "date-cell", normalizeProps(guardReactiveProps(data)))
  151. ]),
  152. key: "0"
  153. } : void 0
  154. ]), 1032, ["date", "selected-day", "onPick"])
  155. ],
  156. 2
  157. )) : (openBlock(), createElementBlock(
  158. "div",
  159. {
  160. key: 1,
  161. class: normalizeClass(unref(ns).e("body"))
  162. },
  163. [
  164. (openBlock(true), createElementBlock(
  165. Fragment,
  166. null,
  167. renderList(unref(validatedRange), (range_, index) => {
  168. return openBlock(), createBlock(DateTable, {
  169. key: index,
  170. date: range_[0],
  171. "selected-day": unref(realSelectedDay),
  172. range: range_,
  173. "hide-header": index !== 0,
  174. onPick: unref(pickDay)
  175. }, createSlots({
  176. _: 2
  177. }, [
  178. _ctx.$slots["date-cell"] ? {
  179. name: "date-cell",
  180. fn: withCtx((data) => [
  181. renderSlot(_ctx.$slots, "date-cell", mergeProps({ ref_for: true }, data))
  182. ]),
  183. key: "0"
  184. } : void 0
  185. ]), 1032, ["date", "selected-day", "range", "hide-header", "onPick"]);
  186. }),
  187. 128
  188. ))
  189. ],
  190. 2
  191. ))
  192. ],
  193. 2
  194. );
  195. };
  196. }
  197. });
  198. var Calendar = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "/home/runner/work/element-plus/element-plus/packages/components/calendar/src/calendar.vue"]]);
  199. export { Calendar as default };
  200. //# sourceMappingURL=calendar2.mjs.map