@touchvue/ui 1.0.0-beta.2 → 1.0.0-beta.3

package/es/packages/components/calendar/src/calendar.vue2.mjs

@@ -0,0 +1,1256 @@
+import { defineComponent, ref, computed, watch, onMounted, openBlock, createElementBlock, normalizeClass, normalizeStyle, unref, createElementVNode, toDisplayString, withDirectives, Fragment, renderList, vShow, createCommentVNode, renderSlot, createBlock, withCtx, createTextVNode, createVNode, nextTick } from 'vue';
+import { t } from '../../../locale/index.mjs';
+import { calendarProps } from './calendar.mjs';
+import { ToButton } from '../../button/index.mjs';
+import { ToGrid, ToGridItem } from '../../grid/index.mjs';
+import { ToHeader } from '../../header/index.mjs';
+import { ToInput } from '../../input/index.mjs';
+import { ToPadding } from '../../padding/index.mjs';
+import { ToCard } from '../../card/index.mjs';
+import { ToTag } from '../../tag/index.mjs';
+import { ToScroll } from '../../scroll/index.mjs';
+import vDis from '../../../directives/dis/src/dis.mjs';
+import tipDirective from '../../../directives/tip/src/tip.mjs';
+import { useWidthStyle } from '../../../hooks/useWidthStyle.mjs';
+import { isPromise } from '../../../utils/types.mjs';
+import { handleBeforeChange } from '../../../utils/beforeChange.mjs';
+
+const __default__ = defineComponent({
+  name: "ToCalendar"
+});
+var _sfc_main = /* @__PURE__ */ defineComponent({
+  ...__default__,
+  props: calendarProps,
+  emits: ["change", "beforeChange", "close", "update:modelValue"],
+  setup(__props, { expose: __expose, emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const changeFrom = ref("out");
+    const submitValue = ref("");
+    const curYear = ref((/* @__PURE__ */ new Date()).getFullYear());
+    const curMonth = ref((/* @__PURE__ */ new Date()).getMonth() + 1);
+    const curDay = ref((/* @__PURE__ */ new Date()).getDate());
+    const year = ref(0);
+    const month = ref(0);
+    const day = ref(null);
+    const hour = ref("0");
+    const minute = ref("0");
+    const second = ref("0");
+    const years = ref([]);
+    const days = ref([]);
+    const hours = ref([]);
+    const minutes = ref([]);
+    const seconds = ref([]);
+    const monthLayer = ref(false);
+    const timeLayer = ref(false);
+    const tempYear = ref(0);
+    const yearsPage = ref(0);
+    const start = ref({
+      year: 0,
+      month: 0,
+      day: 0
+    });
+    const end = ref({
+      year: 0,
+      month: 0,
+      day: 0
+    });
+    const { widthStyle } = useWidthStyle(props.width);
+    const dayText = computed(() => {
+      return (val) => {
+        const dayStr = year.value + "-" + addZero(month.value) + "-" + addZero(val);
+        if (props.holiday.length > 0 && props.holiday.indexOf(dayStr) > -1) {
+          return t("to.calendar.day.holiday");
+        } else {
+          return val;
+        }
+      };
+    });
+    const pointColor = computed(() => {
+      return (val) => {
+        if (val === -1) {
+          return "danger";
+        }
+        if (val === 0) {
+          return "primary";
+        }
+        if (val === 1) {
+          return "success";
+        }
+      };
+    });
+    const hourz = computed({
+      get() {
+        return addZero(hour.value);
+      },
+      set(val) {
+        hour.value = val;
+      }
+    });
+    const minutez = computed({
+      get() {
+        return addZero(minute.value);
+      },
+      set(val) {
+        minute.value = val;
+      }
+    });
+    const secondz = computed({
+      get() {
+        return addZero(second.value);
+      },
+      set(val) {
+        second.value = val;
+      }
+    });
+    const iValue = computed(() => {
+      if (props.range) {
+        const startVal = start.value.day || start.value.month ? getStringValue(start.value) : "";
+        const endVal = end.value.day || end.value.month ? getStringValue(end.value) : "";
+        return `${startVal},${endVal}`;
+      } else {
+        return getStringValue();
+      }
+    });
+    const maxHour = computed(() => {
+      let max;
+      if (typeof props.max === "string") {
+        max = props.max.replace(/-/gi, "/");
+      } else {
+        max = props.max;
+      }
+      return new Date(max).getHours();
+    });
+    const isDisableDay = computed(() => {
+      return (item) => {
+        if (year.value && month.value && item.value) {
+          let dateString = `${year.value}/${month.value}/${Number(item.value)}`;
+          let min;
+          if (typeof props.min === "string") {
+            min = props.min.replace(/-/gi, "/");
+          } else {
+            min = props.min;
+          }
+          let max;
+          if (typeof props.max === "string") {
+            max = props.max.replace(/-/gi, "/");
+          } else {
+            max = props.max;
+          }
+          if (min && max) {
+            return new Date(dateString) < new Date(min) || new Date(dateString) > new Date(max);
+          }
+          if (props.disabledDate) {
+            return props.disabledDate(new Date(dateString));
+          }
+          return false;
+        } else {
+          return false;
+        }
+      };
+    });
+    const isDisableHour = computed(() => {
+      return (item) => {
+        if (year.value && month.value && day.value !== null) {
+          let dateString = `${year.value}/${month.value}/${day.value} ${Number(item)}:00:00`;
+          let min;
+          if (typeof props.min === "string") {
+            min = props.min.replace(/-/gi, "/");
+          } else {
+            min = props.min;
+          }
+          let max;
+          if (typeof props.max === "string") {
+            max = props.max.replace(/-/gi, "/");
+          } else {
+            max = props.max;
+          }
+          if (min && max) {
+            return new Date(dateString) < new Date(min) || new Date(dateString) > new Date(max);
+          }
+          return false;
+        } else {
+          return false;
+        }
+      };
+    });
+    const isDisableMinute = computed(() => {
+      return (item) => {
+        if (year.value && month.value && day.value !== null && hour.value) {
+          let dateString = `${year.value}/${month.value}/${day.value} ${hour.value}:${Number(item)}:00`;
+          let min;
+          if (typeof props.min === "string") {
+            min = props.min.replace(/-/gi, "/");
+          } else {
+            min = props.min;
+          }
+          let max;
+          if (typeof props.max === "string") {
+            max = props.max.replace(/-/gi, "/");
+          } else {
+            max = props.max;
+          }
+          if (min && max) {
+            return new Date(dateString) < new Date(min) || new Date(dateString) > new Date(max);
+          }
+          return false;
+        } else {
+          return false;
+        }
+      };
+    });
+    const isDisableSecond = computed(() => {
+      return (item) => {
+        if (year.value && month.value && day.value !== null && hour.value && minute.value) {
+          let dateString = `${year.value}/${month.value}/${day.value} ${hour.value}:${minute.value}:${Number(item)}`;
+          let min;
+          if (typeof props.min === "string") {
+            min = props.min.replace(/-/gi, "/");
+          } else {
+            min = props.min;
+          }
+          let max;
+          if (typeof props.max === "string") {
+            max = props.max.replace(/-/gi, "/");
+          } else {
+            max = props.max;
+          }
+          if (min && max) {
+            return new Date(dateString) < new Date(min) || new Date(dateString) > new Date(max);
+          }
+          return false;
+        } else {
+          return false;
+        }
+      };
+    });
+    watch(
+      () => props.modelValue,
+      (val) => {
+        setData();
+        if (changeFrom.value === "out") {
+          submitValue.value = val;
+        }
+      }
+    );
+    watch(submitValue, (val) => {
+      emit("change", val);
+      emit("update:modelValue", val);
+      changeFrom.value = "in";
+      setTimeout(() => {
+        changeFrom.value = "out";
+      }, 100);
+    });
+    watch(
+      () => props.min,
+      () => {
+      }
+    );
+    watch(
+      () => props.max,
+      () => {
+      }
+    );
+    watch(
+      () => props.point,
+      () => {
+        setDayData();
+      },
+      { deep: true }
+    );
+    const initCalendar = () => {
+      if (props.type === "time") {
+        showTimeLayer();
+      } else {
+        timeLayer.value = false;
+      }
+    };
+    const getValue = (arg) => {
+      return (/* @__PURE__ */ new Date(
+        `${arg.year || year.value}/${arg.month || month.value}/${arg.day || day.value || "01"}`
+      )).getTime();
+    };
+    const getStringValue = (arg = {}) => {
+      const yearVal = arg.year || year.value;
+      const monthVal = arg.month || month.value;
+      const dayVal = arg.day || day.value;
+      const hourVal = arg.hour || hourz.value;
+      const minuteVal = arg.minute || minutez.value;
+      const secondVal = arg.second || secondz.value;
+      const imonth = `${yearVal}-${addZero(monthVal)}`;
+      const iday = dayVal !== null && dayVal !== void 0 ? `${addZero(dayVal)}` : "01";
+      const itime = `${hourVal}:${minuteVal}:${secondVal}`;
+      if (props.type === "month") {
+        return imonth;
+      } else if (props.type === "datetime" || props.type === "time") {
+        return `${imonth}-${iday} ${itime}`;
+      } else {
+        return `${imonth}-${iday}`;
+      }
+    };
+    const getObjectValue = (str) => {
+      const date = new Date(str);
+      if (isDate(str) && str) {
+        return {
+          year: date.getFullYear(),
+          month: date.getMonth() + 1,
+          day: date.getDate()
+        };
+      } else if (isMonth(str) && str) {
+        return {
+          year: date.getFullYear(),
+          month: date.getMonth() + 1,
+          day: 0
+        };
+      } else {
+        return {
+          year: 0,
+          month: 0,
+          day: 0
+        };
+      }
+    };
+    const setData = () => {
+      setCurrent();
+      setYearData();
+      setDayData();
+      setTimeData();
+    };
+    const setCurrent = () => {
+      year.value = 0;
+      month.value = 0;
+      day.value = null;
+      if (props.range) {
+        let arr = props.modelValue.split(",");
+        const startVal = arr[0];
+        const endVal = arr[1];
+        if (!startVal || isDate(startVal) || isMonth(startVal)) {
+          start.value = getObjectValue(startVal);
+          if (!endVal || isDate(endVal) || isMonth(endVal)) {
+            end.value = getObjectValue(endVal);
+          }
+        }
+        if (props.rangeType === "end") {
+          year.value = year.value || (/* @__PURE__ */ new Date()).getFullYear();
+          if ((end.value.day || end.value.month) && isAnyDate(getStringValue(end.value))) {
+            if (props.type === "month") {
+              if (start.value.year === end.value.year) {
+                year.value = end.value.year + 1;
+              } else {
+                year.value = end.value.year;
+              }
+              month.value = 1;
+            } else {
+              if (start.value.month === end.value.month) {
+                if (Number(month.value) === 12) {
+                  year.value = end.value.year + 1;
+                  month.value = 1;
+                } else {
+                  month.value = end.value.month + 1;
+                }
+              } else {
+                month.value = end.value.month;
+              }
+            }
+          } else {
+            month.value = month.value || (/* @__PURE__ */ new Date()).getMonth() + 2;
+          }
+          if (month.value > 12) {
+            month.value = 1;
+            year.value += 1;
+          }
+        } else {
+          if ((start.value.day || start.value.month) && isAnyDate(getStringValue(start.value))) {
+            year.value = start.value.year;
+            month.value = start.value.month;
+          } else {
+            year.value = year.value || (/* @__PURE__ */ new Date()).getFullYear();
+            month.value = month.value || (/* @__PURE__ */ new Date()).getMonth() + 1;
+          }
+        }
+      } else {
+        if (props.modelValue && !isNaN(new Date(props.modelValue).getTime())) {
+          year.value = new Date(props.modelValue).getFullYear();
+          month.value = new Date(props.modelValue).getMonth() + 1;
+          day.value = new Date(props.modelValue).getDate();
+          hour.value = String(new Date(props.modelValue).getHours());
+          minute.value = String(new Date(props.modelValue).getMinutes());
+          second.value = String(new Date(props.modelValue).getSeconds());
+        } else if (props.modelValue && isNaN(new Date(props.modelValue).getTime()) && !isNaN(new Date(props.modelValue.replace(/-/g, "/")).getTime())) {
+          const value = props.modelValue.replace(/-/g, "/");
+          year.value = new Date(value).getFullYear();
+          month.value = new Date(value).getMonth() + 1;
+          day.value = new Date(value).getDate();
+          hour.value = String(new Date(value).getHours());
+          minute.value = String(new Date(value).getMinutes());
+          second.value = String(new Date(value).getSeconds());
+        } else {
+          year.value = (/* @__PURE__ */ new Date()).getFullYear();
+          month.value = (/* @__PURE__ */ new Date()).getMonth() + 1;
+          day.value = null;
+          hour.value = "0";
+          minute.value = "0";
+          second.value = "0";
+        }
+      }
+    };
+    const setYearData = (yearVal) => {
+      yearVal = yearVal || year.value;
+      let arr = [];
+      for (let i = 0; i < 10; i++) {
+        arr.push(Math.floor(yearVal / 10) * 10 + i);
+      }
+      years.value = arr;
+    };
+    const setDayData = () => {
+      let yearVal = new Date(props.modelValue).getFullYear();
+      let monthVal = new Date(props.modelValue).getMonth() + 1;
+      let dayVal = new Date(props.modelValue).getDate();
+      if (year.value === yearVal && month.value === monthVal) {
+        day.value = dayVal;
+      } else {
+        day.value = null;
+      }
+      const dayCount = getMonthDays(`${year.value}/${month.value}/1`);
+      const thisMonthFirstDay = /* @__PURE__ */ new Date(`${year.value}/${month.value}/1`);
+      thisMonthFirstDay.setMonth(thisMonthFirstDay.getMonth(), 1);
+      const emptyLength = new Date(thisMonthFirstDay.setMonth(thisMonthFirstDay.getMonth(), 1)).getDay();
+      days.value = (() => {
+        let arr = [];
+        for (let i = 0; i < emptyLength; i++) {
+          arr.push({});
+        }
+        for (let i = 1; i < dayCount + 1; i++) {
+          let obj = {};
+          obj.value = i;
+          if ((i + emptyLength) % 7 === 1) {
+            obj.sun = true;
+          }
+          if ((i + emptyLength) % 7 === 0) {
+            obj.sat = true;
+          }
+          const point = props.point.filter((item) => {
+            return item.day === `${year.value}-${addZero(month.value)}-${addZero(i)}`;
+          });
+          obj.point = point;
+          arr.push(obj);
+        }
+        return arr;
+      })();
+    };
+    const setTimeData = () => {
+      hours.value = genNumbers(0, 23);
+      minutes.value = genNumbers(0, 59);
+      seconds.value = genNumbers(0, 59);
+      const hourVal = String(new Date(props.modelValue).getHours());
+      const minuteVal = String(new Date(props.modelValue).getMinutes());
+      const secondVal = String(new Date(props.modelValue).getSeconds());
+      if (props.time) {
+        const arr = props.time.split(":");
+        hour.value = arr[0] || "0";
+        minute.value = arr[1] || "0";
+        second.value = arr[2] || "0";
+      }
+      if (!isNaN(Number(hourVal)) && !isNaN(Number(minuteVal)) && !isNaN(Number(secondVal))) {
+        hour.value = hourVal;
+        minute.value = minuteVal;
+        second.value = secondVal;
+      }
+    };
+    const selectYear = (item) => {
+      year.value = item;
+    };
+    const selectMonth = (item) => {
+      if (item) {
+        if (props.range && props.type === "month") {
+          let startVal = {};
+          let endVal = {};
+          if (!start.value.month && !end.value.month) {
+            startVal.year = year.value;
+            startVal.month = item;
+            startVal.day = "";
+          }
+          if (start.value.month) {
+            if (end.value.month) {
+              startVal.year = year.value;
+              startVal.month = item;
+              startVal.day = "";
+              endVal.year = "";
+              endVal.month = "";
+              endVal.day = "";
+            } else {
+              if (getValue(start.value) > getValue({ month: item })) {
+                endVal.year = start.value.year;
+                endVal.month = start.value.month;
+                endVal.day = "";
+                startVal.year = year.value;
+                startVal.month = item;
+                startVal.day = "";
+              } else {
+                startVal = JSON.parse(JSON.stringify(start.value));
+                endVal.year = year.value;
+                endVal.month = item;
+                endVal.day = "";
+              }
+            }
+          }
+          start.value = JSON.parse(JSON.stringify(startVal));
+          end.value = JSON.parse(JSON.stringify(endVal));
+          submitValue.value = iValue.value;
+        } else {
+          if (props.type === "month") {
+            emit(
+              "beforeChange",
+              getStringValue({
+                month: item
+              })
+            );
+          }
+          if (props.beforeChange) {
+            const fn = props.beforeChange(
+              getStringValue({
+                month: item
+              })
+            );
+            if (fn && isPromise(fn)) {
+              fn.then(() => {
+                selectMonthAction(item);
+              }).catch(() => {
+              });
+            } else {
+              if (fn) {
+                selectMonthAction(item);
+              }
+            }
+          } else {
+            selectMonthAction(item);
+          }
+        }
+      }
+    };
+    const selectMonthAction = (item) => {
+      month.value = item;
+      monthLayer.value = false;
+      setDayData();
+      if (props.type === "month") {
+        day.value = 1;
+        submitValue.value = iValue.value;
+      }
+    };
+    const selectDay = (item) => {
+      if (item.value) {
+        if (props.range) {
+          let startVal = {};
+          let endVal = {};
+          if (!start.value.day && !end.value.day) {
+            startVal.year = year.value;
+            startVal.month = month.value;
+            startVal.day = item.value;
+          }
+          if (start.value.day) {
+            if (end.value.day) {
+              startVal.year = year.value;
+              startVal.month = month.value;
+              startVal.day = item.value;
+              endVal.year = "";
+              endVal.month = "";
+              endVal.day = "";
+            } else {
+              if (getValue(start.value) > getValue({ day: item.value })) {
+                endVal.year = start.value.year;
+                endVal.month = start.value.month;
+                endVal.day = start.value.day;
+                startVal.year = year.value;
+                startVal.month = month.value;
+                startVal.day = item.value;
+              } else {
+                startVal = JSON.parse(JSON.stringify(start.value));
+                endVal.year = year.value;
+                endVal.month = month.value;
+                endVal.day = item.value;
+              }
+            }
+          }
+          start.value = JSON.parse(JSON.stringify(startVal));
+          end.value = JSON.parse(JSON.stringify(endVal));
+          submitValue.value = iValue.value;
+        } else {
+          let val = getStringValue({
+            day: item.value
+          });
+          if (!props.type || props.type === "date") {
+            emit("beforeChange", val);
+            handleBeforeChange(
+              props.beforeChange,
+              getStringValue({
+                day: item.value
+              })
+            ).then(() => {
+              selectDayAction(item);
+            }).catch(() => {
+            });
+          } else {
+            selectDayAction(item);
+          }
+        }
+      }
+    };
+    const selectDayAction = (item) => {
+      day.value = Number(item.value);
+      if (!props.type || props.type === "date") {
+        submitValue.value = iValue.value;
+      }
+    };
+    const selectTime = () => {
+      if (day.value === null && !props.min && !props.max) {
+        day.value = (/* @__PURE__ */ new Date()).getDate();
+      } else if (day.value === null && props.min && props.max) {
+        return;
+      }
+      emit("beforeChange", getStringValue());
+      if (props.beforeChange) {
+        const fn = props.beforeChange(getStringValue());
+        if (fn && isPromise(fn)) {
+          fn.then(() => {
+            selectTimeAction();
+          });
+        } else {
+          if (fn) {
+            selectTimeAction();
+          }
+        }
+      } else {
+        selectTimeAction();
+      }
+    };
+    const selectTimeAction = () => {
+      timeLayer.value = false;
+      submitValue.value = iValue.value;
+      emit("close");
+    };
+    const setYearClass = (item) => {
+      return {
+        cur: curYear.value === item,
+        on: year.value === item
+      };
+    };
+    const setMonthClass = (item) => {
+      let arr = [];
+      if (year.value === curYear.value && curMonth.value === item) {
+        arr.push("cur");
+      }
+      if (props.range && props.type === "month") {
+        if (year.value === start.value.year && item === start.value.month) {
+          if (end.value.month) {
+            arr.push("start");
+          } else {
+            arr.push("on");
+          }
+        }
+        if (year.value === end.value.year && item === end.value.month) {
+          arr.push("end");
+        }
+        const value = getValue({
+          year: year.value,
+          month: item,
+          day: 1
+        });
+        if ((value > getValue(start.value) || value === getValue(start.value)) && value < getValue(end.value)) {
+          arr.push("range");
+        }
+      } else {
+        if (month.value === item) {
+          arr.push("on");
+        }
+      }
+      if (item && (props.min || props.max)) {
+        let curData = year.value + "/" + (item > 9 ? item : "0" + item) + "/01";
+        let date = /* @__PURE__ */ new Date();
+        let hourVal = date.getHours();
+        let minuteVal = date.getMinutes();
+        let secondVal = date.getSeconds();
+        curData = curData + " " + (hourVal > 9 ? hourVal : "0" + hourVal) + ":" + (minuteVal > 9 ? minuteVal : "0" + minuteVal) + ":" + (secondVal > 9 ? secondVal : "0" + secondVal);
+        let curTime = new Date(curData).getTime();
+        let min = new Date(props.min).getTime();
+        let maxTime = new Date(props.max).getTime();
+        let cur = curData.split(" ")[0];
+        let yearVal = new Date(props.max).getFullYear();
+        let monthVal = new Date(props.max).getMonth() + 1;
+        let dayVal = new Date(props.max).getDate();
+        let max = yearVal + "/" + (monthVal > 9 ? monthVal : "0" + monthVal) + "/" + (dayVal > 9 ? dayVal : "0" + dayVal);
+        if (min === maxTime && cur !== max) {
+          if (curTime > maxTime) {
+            arr.push("to-dis");
+          }
+          if (curTime < min) {
+            arr.push("to-dis");
+          }
+        } else if (min !== maxTime && cur !== max) {
+          if (curTime > maxTime) {
+            arr.push("to-dis");
+          }
+          if (curTime < min) {
+            arr.push("to-dis");
+          }
+        }
+      }
+      return arr;
+    };
+    const setDayClass = (item) => {
+      let arr = [];
+      if (item.sat) {
+        arr.push("sat");
+      }
+      if (item.sun) {
+        arr.push("sun");
+      }
+      if (year.value === curYear.value && month.value === curMonth.value && curDay.value === item.value) {
+        arr.push("cur");
+      }
+      if (props.range) {
+        if (year.value === start.value.year && month.value === start.value.month && item.value === start.value.day) {
+          if (end.value.day) {
+            arr.push("start");
+          } else {
+            arr.push("on");
+          }
+        }
+        if (year.value === end.value.year && month.value === end.value.month && item.value === end.value.day) {
+          arr.push("end");
+        }
+        const value = getValue({
+          year: year.value,
+          month: month.value,
+          day: item.value
+        });
+        if (value > getValue(start.value) && value < getValue(end.value)) {
+          arr.push("range");
+        }
+      } else {
+        if (day.value === item.value) {
+          arr.push("on");
+        }
+      }
+      return arr;
+    };
+    const nextMonth = () => {
+      if (month.value === 12) {
+        year.value += 1;
+        month.value = 1;
+      } else {
+        month.value += 1;
+      }
+      setDayData();
+    };
+    const lastMonth = () => {
+      if (month.value === 1) {
+        year.value -= 1;
+        month.value = 12;
+      } else {
+        month.value -= 1;
+      }
+      setDayData();
+    };
+    const lastYears = () => {
+      yearsPage.value -= 1;
+      setYearData(year.value + 10 * yearsPage.value);
+    };
+    const nextYears = () => {
+      yearsPage.value += 1;
+      setYearData(year.value + 10 * yearsPage.value);
+    };
+    const nextYear = () => {
+      year.value += 1;
+      let yearVal = new Date(props.modelValue).getFullYear();
+      let monthVal = new Date(props.modelValue).getMonth() + 1;
+      let dayVal = new Date(props.modelValue).getDate();
+      if (year.value === yearVal && month.value === monthVal) {
+        day.value = dayVal;
+      } else {
+        day.value = null;
+      }
+    };
+    const lastYear = () => {
+      year.value -= 1;
+      let yearVal = new Date(props.modelValue).getFullYear();
+      let monthVal = new Date(props.modelValue).getMonth() + 1;
+      let dayVal = new Date(props.modelValue).getDate();
+      if (year.value === yearVal && month.value === monthVal) {
+        day.value = dayVal;
+      } else {
+        day.value = null;
+      }
+    };
+    const toggleMonthSelector = () => {
+      if (!monthLayer.value) {
+        monthLayer.value = true;
+        tempYear.value = year.value;
+        setYearData(year.value);
+      } else {
+        monthLayer.value = false;
+      }
+    };
+    const hourScroll = ref();
+    const minuteScroll = ref();
+    const secondScroll = ref();
+    const showTimeLayer = () => {
+      timeLayer.value = true;
+      nextTick(() => {
+        var _a, _b, _c;
+        (_a = hourScroll.value) == null ? void 0 : _a.adjust();
+        (_b = minuteScroll.value) == null ? void 0 : _b.adjust();
+        (_c = secondScroll.value) == null ? void 0 : _c.adjust();
+      });
+    };
+    const closeTimeLayer = () => {
+      if (props.type === "time") {
+        timeLayer.value = false;
+        emit("close");
+      } else {
+        timeLayer.value = false;
+      }
+    };
+    const isDate = (date) => {
+      const DateExp = /^[1-2][0-9]{3}-(0[1-9]|1[0-2])-(0[1-9]|[1-2][0-9]|3[0-1])$/;
+      if (DateExp.test(date)) {
+        return new Date(date).getDate() === Number(date.substring(date.length - 2));
+      } else {
+        return false;
+      }
+    };
+    const isMonth = (date) => {
+      const DateExp = /^[1-2][0-9]{3}-(0[1-9]|1[0-2])$/;
+      if (DateExp.test(date)) {
+        return (/* @__PURE__ */ new Date(date + "-01")).getDate() === Number(1);
+      } else {
+        return false;
+      }
+    };
+    const isDatetime = (time) => {
+      if (typeof time === "string") {
+        var reg = /^(\d{4})-(\d{2})-(\d{2})\s+(\d{2}):(\d{2}):(\d{2})$/;
+        return reg.test(time);
+      } else {
+        return false;
+      }
+    };
+    const isAnyDate = (date) => {
+      return isDate(date) || isMonth(date) || isDatetime(date);
+    };
+    const getMonthDays = (date) => {
+      const d = new Date(date);
+      d.setMonth(d.getMonth() + 1, 0);
+      return d.getDate();
+    };
+    const genNumbers = (min, max, step = 1) => {
+      const arr = [];
+      for (let i = min; i <= max; i += step) {
+        arr.push(String(i));
+      }
+      return arr;
+    };
+    const addZero = (str) => {
+      if (Number(str) < 10) {
+        return "0" + Number(str);
+      } else {
+        return String(str);
+      }
+    };
+    onMounted(() => {
+      setData();
+      initCalendar();
+    });
+    __expose({
+      initCalendar,
+      setData,
+      addZero,
+      year,
+      month,
+      day,
+      hour,
+      minute,
+      second
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        class: normalizeClass(["to-calendar", {
+          "to-calendar-type-month": _ctx.type === "month",
+          "to-calendar-size-large": _ctx.size === "large"
+        }]),
+        style: normalizeStyle(unref(widthStyle))
+      }, [
+        createElementVNode("div", { class: "header" }, [
+          createElementVNode("div", {
+            class: "prevYear",
+            onClick: lastYear
+          }),
+          createElementVNode("div", {
+            class: "prev",
+            onClick: lastMonth
+          }),
+          createElementVNode("div", {
+            class: normalizeClass(["info", { "info-unfold": _ctx.type !== "month" }]),
+            onClick: toggleMonthSelector
+          }, [
+            createElementVNode("span", { class: "year" }, toDisplayString(year.value), 1),
+            createElementVNode("span", { class: "month" }, toDisplayString(addZero(month.value)), 1)
+          ], 2),
+          createElementVNode("div", {
+            class: "next",
+            onClick: nextMonth
+          }),
+          createElementVNode("div", {
+            class: "nextYear",
+            onClick: nextYear
+          })
+        ]),
+        withDirectives(createElementVNode("div", { class: "select" }, [
+          createElementVNode("div", { class: "year" }, [
+            createElementVNode("span", {
+              class: "prev",
+              onClick: lastYears
+            }),
+            createElementVNode("ul", null, [
+              (openBlock(true), createElementBlock(Fragment, null, renderList(years.value, (item, index) => {
+                return openBlock(), createElementBlock("li", {
+                  key: index,
+                  class: normalizeClass(setYearClass(item)),
+                  onClick: ($event) => selectYear(item)
+                }, toDisplayString(item), 11, ["onClick"]);
+              }), 128))
+            ]),
+            createElementVNode("span", {
+              class: "next",
+              onClick: nextYears
+            })
+          ]),
+          createElementVNode("div", { class: "month" }, [
+            createElementVNode("ul", null, [
+              createElementVNode("li", {
+                class: normalizeClass(setMonthClass(1)),
+                onClick: ($event) => selectMonth(1)
+              }, toDisplayString(unref(t)("to.calendar.month.m1")), 11, ["onClick"]),
+              createElementVNode("li", {
+                class: normalizeClass(setMonthClass(2)),
+                onClick: ($event) => selectMonth(2)
+              }, toDisplayString(unref(t)("to.calendar.month.m2")), 11, ["onClick"]),
+              createElementVNode("li", {
+                class: normalizeClass(setMonthClass(3)),
+                onClick: ($event) => selectMonth(3)
+              }, toDisplayString(unref(t)("to.calendar.month.m3")), 11, ["onClick"]),
+              createElementVNode("li", {
+                class: normalizeClass(setMonthClass(4)),
+                onClick: ($event) => selectMonth(4)
+              }, toDisplayString(unref(t)("to.calendar.month.m4")), 11, ["onClick"]),
+              createElementVNode("li", {
+                class: normalizeClass(setMonthClass(5)),
+                onClick: ($event) => selectMonth(5)
+              }, toDisplayString(unref(t)("to.calendar.month.m5")), 11, ["onClick"]),
+              createElementVNode("li", {
+                class: normalizeClass(setMonthClass(6)),
+                onClick: ($event) => selectMonth(6)
+              }, toDisplayString(unref(t)("to.calendar.month.m6")), 11, ["onClick"]),
+              createElementVNode("li", {
+                class: normalizeClass(setMonthClass(7)),
+                onClick: ($event) => selectMonth(7)
+              }, toDisplayString(unref(t)("to.calendar.month.m7")), 11, ["onClick"]),
+              createElementVNode("li", {
+                class: normalizeClass(setMonthClass(8)),
+                onClick: ($event) => selectMonth(8)
+              }, toDisplayString(unref(t)("to.calendar.month.m8")), 11, ["onClick"]),
+              createElementVNode("li", {
+                class: normalizeClass(setMonthClass(9)),
+                onClick: ($event) => selectMonth(9)
+              }, toDisplayString(unref(t)("to.calendar.month.m9")), 11, ["onClick"]),
+              createElementVNode("li", {
+                class: normalizeClass(setMonthClass(10)),
+                onClick: ($event) => selectMonth(10)
+              }, toDisplayString(unref(t)("to.calendar.month.m10")), 11, ["onClick"]),
+              createElementVNode("li", {
+                class: normalizeClass(setMonthClass(11)),
+                onClick: ($event) => selectMonth(11)
+              }, toDisplayString(unref(t)("to.calendar.month.m11")), 11, ["onClick"]),
+              createElementVNode("li", {
+                class: normalizeClass(setMonthClass(12)),
+                onClick: ($event) => selectMonth(12)
+              }, toDisplayString(unref(t)("to.calendar.month.m12")), 11, ["onClick"])
+            ])
+          ])
+        ], 512), [
+          [vShow, monthLayer.value || _ctx.type === "month"]
+        ]),
+        _ctx.type !== "month" ? (openBlock(), createElementBlock("div", {
+          key: 0,
+          class: "week"
+        }, [
+          createElementVNode("ul", null, [
+            createElementVNode("li", null, toDisplayString(unref(t)("to.calendar.week.w0")), 1),
+            createElementVNode("li", null, toDisplayString(unref(t)("to.calendar.week.w1")), 1),
+            createElementVNode("li", null, toDisplayString(unref(t)("to.calendar.week.w2")), 1),
+            createElementVNode("li", null, toDisplayString(unref(t)("to.calendar.week.w3")), 1),
+            createElementVNode("li", null, toDisplayString(unref(t)("to.calendar.week.w4")), 1),
+            createElementVNode("li", null, toDisplayString(unref(t)("to.calendar.week.w5")), 1),
+            createElementVNode("li", null, toDisplayString(unref(t)("to.calendar.week.w6")), 1)
+          ])
+        ])) : createCommentVNode("", true),
+        _ctx.type !== "month" ? (openBlock(), createElementBlock("div", {
+          key: 1,
+          class: "day"
+        }, [
+          createElementVNode("ul", null, [
+            (openBlock(true), createElementBlock(Fragment, null, renderList(days.value, (item, index) => {
+              return withDirectives((openBlock(), createElementBlock("li", {
+                key: index,
+                class: normalizeClass(setDayClass(item)),
+                onClick: ($event) => selectDay(item)
+              }, [
+                renderSlot(_ctx.$slots, "default", {
+                  item,
+                  index
+                }, () => [
+                  item.value ? (openBlock(), createElementBlock("span", {
+                    key: 0,
+                    class: "solar"
+                  }, toDisplayString(dayText.value(item.value)), 1)) : createCommentVNode("", true),
+                  item.point && item.point.length > 0 ? (openBlock(), createElementBlock("span", {
+                    key: 1,
+                    class: "to-calendar-points"
+                  }, [
+                    (openBlock(true), createElementBlock(Fragment, null, renderList(item.point, (ipoint, pointIndex) => {
+                      return withDirectives((openBlock(), createBlock(unref(ToTag), {
+                        key: pointIndex,
+                        type: _ctx.size === "large" ? "dot" : "",
+                        color: pointColor.value(ipoint.type),
+                        fillet: _ctx.size === "large" ? "" : "round"
+                      }, {
+                        default: withCtx(() => [
+                          createTextVNode(toDisplayString(ipoint.count), 1)
+                        ]),
+                        _: 2
+                      }, 1032, ["type", "color", "fillet"])), [
+                        [unref(tipDirective), ipoint.tooltip ? ipoint.tooltip : ""]
+                      ]);
+                    }), 128))
+                  ])) : createCommentVNode("", true)
+                ])
+              ], 10, ["onClick"])), [
+                [unref(vDis), isDisableDay.value(item)]
+              ]);
+            }), 128))
+          ])
+        ])) : createCommentVNode("", true),
+        _ctx.legend ? (openBlock(), createElementBlock("div", {
+          key: 2,
+          class: "to-calendar-legend"
+        }, [
+          renderSlot(_ctx.$slots, "legend")
+        ])) : createCommentVNode("", true),
+        _ctx.type === "datetime" || _ctx.type === "time" ? (openBlock(), createElementBlock("div", {
+          key: 3,
+          class: "time"
+        }, [
+          createElementVNode("div", { class: "input to-calendar-time-input" }, [
+            createVNode(unref(ToInput), {
+              modelValue: hour.value,
+              "onUpdate:modelValue": ($event) => hour.value = $event,
+              type: "number",
+              mode: "none",
+              placeholder: unref(t)("to.calendar.time.hPlaceholder"),
+              width: "full",
+              maxlength: 2,
+              max: maxHour.value,
+              min: 0,
+              onClick: showTimeLayer
+            }, null, 8, ["modelValue", "onUpdate:modelValue", "placeholder", "max"])
+          ]),
+          createElementVNode("span", { class: "text" }, ":"),
+          createElementVNode("span", { class: "input to-calendar-time-input" }, [
+            createVNode(unref(ToInput), {
+              modelValue: minute.value,
+              "onUpdate:modelValue": ($event) => minute.value = $event,
+              type: "number",
+              mode: "none",
+              placeholder: unref(t)("to.calendar.time.mPlaceholder"),
+              width: "full",
+              maxlength: 2,
+              max: new Date(_ctx.max).getMinutes(),
+              min: 0,
+              onClick: showTimeLayer
+            }, null, 8, ["modelValue", "onUpdate:modelValue", "placeholder", "max"])
+          ]),
+          createElementVNode("span", { class: "text" }, ":"),
+          createElementVNode("span", { class: "input to-calendar-time-input" }, [
+            createVNode(unref(ToInput), {
+              modelValue: second.value,
+              "onUpdate:modelValue": ($event) => second.value = $event,
+              type: "number",
+              mode: "none",
+              placeholder: unref(t)("to.calendar.time.sPlaceholder"),
+              width: "full",
+              maxlength: 2,
+              max: new Date(_ctx.max).getSeconds(),
+              min: 0,
+              onClick: showTimeLayer
+            }, null, 8, ["modelValue", "onUpdate:modelValue", "placeholder", "max"])
+          ]),
+          createVNode(unref(ToButton), {
+            color: "primary",
+            onClick: selectTime
+          }, {
+            default: withCtx(() => [
+              createTextVNode(toDisplayString(unref(t)("to.common.confirm")), 1)
+            ]),
+            _: 1
+          }),
+          withDirectives(createElementVNode("div", { class: "option" }, [
+            createVNode(unref(ToHeader), {
+              title: unref(t)("to.calendar.time.title"),
+              color: "primary",
+              mode: "fill"
+            }, {
+              default: withCtx(() => [
+                createVNode(unref(ToButton), {
+                  mode: "none",
+                  color: "bg",
+                  icon: "close",
+                  onClick: closeTimeLayer
+                })
+              ]),
+              _: 1
+            }, 8, ["title"]),
+            createElementVNode("div", { class: "content" }, [
+              createVNode(unref(ToScroll), {
+                ref_key: "hourScroll",
+                ref: hourScroll,
+                vitrual: false,
+                "bar-display": "hover"
+              }, {
+                default: withCtx(() => [
+                  createVNode(unref(ToPadding), { value: 0.5 }, {
+                    default: withCtx(() => [
+                      createVNode(unref(ToGrid), { col: 2 }, {
+                        default: withCtx(() => [
+                          (openBlock(true), createElementBlock(Fragment, null, renderList(hours.value, (item) => {
+                            return openBlock(), createBlock(unref(ToGridItem), { key: item }, {
+                              default: withCtx(() => [
+                                withDirectives((openBlock(), createBlock(unref(ToCard), {
+                                  fillet: "normal",
+                                  color: hour.value === item ? "warning" : "default",
+                                  mode: hour.value === item ? "fill" : "none",
+                                  link: "",
+                                  onClick: ($event) => hour.value = item
+                                }, {
+                                  default: withCtx(() => [
+                                    createTextVNode(toDisplayString(item), 1)
+                                  ]),
+                                  _: 2
+                                }, 1032, ["color", "mode", "onClick"])), [
+                                  [unref(vDis), isDisableHour.value(item)]
+                                ])
+                              ]),
+                              _: 2
+                            }, 1024);
+                          }), 128))
+                        ]),
+                        _: 1
+                      })
+                    ]),
+                    _: 1
+                  })
+                ]),
+                _: 1
+              }, 512),
+              createVNode(unref(ToScroll), {
+                ref_key: "minuteScroll",
+                ref: minuteScroll,
+                vitrual: false,
+                "bar-display": "hover"
+              }, {
+                default: withCtx(() => [
+                  createVNode(unref(ToPadding), { value: 0.5 }, {
+                    default: withCtx(() => [
+                      createVNode(unref(ToGrid), { col: 2 }, {
+                        default: withCtx(() => [
+                          (openBlock(true), createElementBlock(Fragment, null, renderList(minutes.value, (item) => {
+                            return openBlock(), createBlock(unref(ToGridItem), { key: item }, {
+                              default: withCtx(() => [
+                                withDirectives((openBlock(), createBlock(unref(ToCard), {
+                                  fillet: "normal",
+                                  color: minute.value === item ? "warning" : "default",
+                                  mode: minute.value === item ? "fill" : "none",
+                                  link: "",
+                                  onClick: ($event) => minute.value = item
+                                }, {
+                                  default: withCtx(() => [
+                                    createTextVNode(toDisplayString(item), 1)
+                                  ]),
+                                  _: 2
+                                }, 1032, ["color", "mode", "onClick"])), [
+                                  [unref(vDis), isDisableMinute.value(item)]
+                                ])
+                              ]),
+                              _: 2
+                            }, 1024);
+                          }), 128))
+                        ]),
+                        _: 1
+                      })
+                    ]),
+                    _: 1
+                  })
+                ]),
+                _: 1
+              }, 512),
+              createVNode(unref(ToScroll), {
+                ref_key: "secondScroll",
+                ref: secondScroll,
+                vitrual: false,
+                "bar-display": "hover"
+              }, {
+                default: withCtx(() => [
+                  createVNode(unref(ToPadding), { value: 0.5 }, {
+                    default: withCtx(() => [
+                      createVNode(unref(ToGrid), { col: 2 }, {
+                        default: withCtx(() => [
+                          (openBlock(true), createElementBlock(Fragment, null, renderList(seconds.value, (item) => {
+                            return openBlock(), createBlock(unref(ToGridItem), { key: item }, {
+                              default: withCtx(() => [
+                                withDirectives((openBlock(), createBlock(unref(ToCard), {
+                                  fillet: "normal",
+                                  color: second.value === item ? "warning" : "default",
+                                  mode: second.value === item ? "fill" : "none",
+                                  link: "",
+                                  onClick: ($event) => second.value = item
+                                }, {
+                                  default: withCtx(() => [
+                                    createTextVNode(toDisplayString(item), 1)
+                                  ]),
+                                  _: 2
+                                }, 1032, ["color", "mode", "onClick"])), [
+                                  [unref(vDis), isDisableSecond.value(item)]
+                                ])
+                              ]),
+                              _: 2
+                            }, 1024);
+                          }), 128))
+                        ]),
+                        _: 1
+                      })
+                    ]),
+                    _: 1
+                  })
+                ]),
+                _: 1
+              }, 512)
+            ])
+          ], 512), [
+            [vShow, timeLayer.value]
+          ])
+        ])) : createCommentVNode("", true)
+      ], 6);
+    };
+  }
+});
+
+export { _sfc_main as default };
+//# sourceMappingURL=calendar.vue2.mjs.map