@opendesign-plus/components 0.0.1-rc.5 → 0.0.1-rc.51

package/dist/treeshaking/components/meeting/components/OMeetingSigAside.vue.mjs

@@ -0,0 +1,152 @@
+import { defineComponent, ref, watch, nextTick, openBlock, createElementBlock, createVNode, unref, withCtx, Fragment, renderList, createElementVNode, toDisplayString, normalizeClass, createBlock, normalizeStyle, resolveDynamicComponent, createCommentVNode } from "vue";
+import { OScroller, OIcon, OIconArrowLeft, OIconArrowRight } from "@opensig/opendesign";
+import { useMeetingConfig } from "../composables/useMeetingConfig.mjs";
+import { CalendarDataType } from "../types.mjs";
+const _hoisted_1 = { class: "o-sig-meeting-aside" };
+const _hoisted_2 = { class: "month" };
+const _hoisted_3 = { class: "days" };
+const _hoisted_4 = ["onClick"];
+const _hoisted_5 = { class: "day-d" };
+const _hoisted_6 = { class: "day-c" };
+const _hoisted_7 = { class: "arrow-wrapper" };
+const STEP = 1;
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "OMeetingSigAside",
+  props: {
+    data: {},
+    current: {},
+    total: {},
+    active: {},
+    meetingDates: {},
+    eventsDates: {}
+  },
+  emits: ["click-date", "change-month"],
+  setup(__props, { emit: __emit }) {
+    const { getConfig } = useMeetingConfig();
+    const props = __props;
+    const emits = __emit;
+    const clickDate = (date) => {
+      emits("click-date", date);
+    };
+    const changeMonth = (step) => {
+      if (props.current + step >= props.total || props.current + step < 0) return;
+      emits("change-month", step);
+    };
+    const scrollerRef = ref(null);
+    const scrollToActiveTop = () => {
+      var _a, _b;
+      const containerEl = ((_b = (_a = scrollerRef.value) == null ? void 0 : _a.getContainerEl) == null ? void 0 : _b.call(_a)) ?? null;
+      if (!containerEl) return false;
+      const activeEl = containerEl.querySelector(".day-item.active");
+      if (!activeEl) return false;
+      const containerRect = containerEl.getBoundingClientRect();
+      const activeRect = activeEl.getBoundingClientRect();
+      containerEl.scrollTop += activeRect.top - containerRect.top;
+      return true;
+    };
+    let scrolled = false;
+    const stopActiveWatch = watch(
+      [() => props.active, () => props.data],
+      () => {
+        if (scrolled || !props.active) {
+          return;
+        }
+        nextTick(() => {
+          if (scrolled) return;
+          if (scrollToActiveTop()) {
+            scrolled = true;
+            stopActiveWatch();
+          }
+        });
+      },
+      { immediate: true, flush: "post" }
+    );
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", _hoisted_1, [
+        createVNode(unref(OScroller), {
+          ref_key: "scrollerRef",
+          ref: scrollerRef,
+          class: "month-wrapper",
+          "show-type": "hover",
+          size: "small"
+        }, {
+          default: withCtx(() => [
+            (openBlock(true), createElementBlock(Fragment, null, renderList(__props.data, (d, dIdx) => {
+              return openBlock(), createElementBlock(Fragment, { key: dIdx }, [
+                (openBlock(true), createElementBlock(Fragment, null, renderList(d, (m) => {
+                  return openBlock(), createElementBlock("div", {
+                    key: m.month,
+                    class: "month-item"
+                  }, [
+                    createElementVNode("div", _hoisted_2, toDisplayString(m.month.replace(/-/g, "/")), 1),
+                    createElementVNode("div", _hoisted_3, [
+                      (openBlock(true), createElementBlock(Fragment, null, renderList(m.days, (d2) => {
+                        return openBlock(), createElementBlock("div", {
+                          class: normalizeClass(["day-item", __props.active === `${m.month}-${d2}` && "active"]),
+                          key: d2,
+                          onClick: ($event) => clickDate(`${m.month}-${d2}`)
+                        }, [
+                          createElementVNode("div", _hoisted_5, toDisplayString(d2), 1),
+                          createElementVNode("div", _hoisted_6, [
+                            __props.meetingDates.includes(`${m.month}-${d2}`) ? (openBlock(), createBlock(unref(OIcon), {
+                              key: 0,
+                              style: normalizeStyle({
+                                zIndex: unref(getConfig)(unref(CalendarDataType).MEETING, "zIndex"),
+                                backgroundColor: unref(getConfig)(unref(CalendarDataType).MEETING, "color")
+                              })
+                            }, {
+                              default: withCtx(() => [
+                                (openBlock(), createBlock(resolveDynamicComponent(unref(getConfig)(unref(CalendarDataType).MEETING, "icon"))))
+                              ]),
+                              _: 1
+                            }, 8, ["style"])) : createCommentVNode("", true),
+                            __props.eventsDates.includes(`${m.month}-${d2}`) ? (openBlock(), createBlock(unref(OIcon), {
+                              key: 1,
+                              style: normalizeStyle({
+                                zIndex: unref(getConfig)(unref(CalendarDataType).EVENTS, "zIndex"),
+                                backgroundColor: unref(getConfig)(unref(CalendarDataType).EVENTS, "color")
+                              })
+                            }, {
+                              default: withCtx(() => [
+                                (openBlock(), createBlock(resolveDynamicComponent(unref(getConfig)(unref(CalendarDataType).EVENTS, "icon"))))
+                              ]),
+                              _: 1
+                            }, 8, ["style"])) : createCommentVNode("", true)
+                          ])
+                        ], 10, _hoisted_4);
+                      }), 128))
+                    ])
+                  ]);
+                }), 128))
+              ], 64);
+            }), 128))
+          ]),
+          _: 1
+        }, 512),
+        createElementVNode("div", _hoisted_7, [
+          createVNode(unref(OIcon), {
+            onClick: _cache[0] || (_cache[0] = ($event) => changeMonth(0 - STEP)),
+            class: normalizeClass(__props.current - STEP < 0 && "disabled")
+          }, {
+            default: withCtx(() => [
+              createVNode(unref(OIconArrowLeft))
+            ]),
+            _: 1
+          }, 8, ["class"]),
+          createVNode(unref(OIcon), {
+            onClick: _cache[1] || (_cache[1] = ($event) => changeMonth(STEP)),
+            class: normalizeClass(__props.current + STEP >= __props.total && "disabled")
+          }, {
+            default: withCtx(() => [
+              createVNode(unref(OIconArrowRight))
+            ]),
+            _: 1
+          }, 8, ["class"])
+        ])
+      ]);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/dist/treeshaking/components/meeting/components/OMeetingSigAside.vue3.mjs

@@ -0,0 +1,5 @@
+import _sfc_main from "./OMeetingSigAside.vue.mjs";
+import './OMeetingSigAside.css';
+export {
+  _sfc_main as default
+};

package/dist/treeshaking/components/meeting/composables/useMeetingConfig.d.ts

@@ -0,0 +1,14 @@
+import { CalendarDataType, meetingTabT, OptionItemT } from '../types';
+export declare const useMeetingConfig: () => {
+    t: (key: string, ...args: any[]) => string;
+    locale: import('vue').ComputedRef<string>;
+    meetingTabs: import('vue').ComputedRef<meetingTabT[]>;
+    cycleTypeOptions0: import('vue').ComputedRef<OptionItemT[]>;
+    cycleTypeOptions: import('vue').ComputedRef<OptionItemT[]>;
+    weekDay: import('vue').ComputedRef<string[]>;
+    intervalWeekOptions: import('vue').ComputedRef<OptionItemT[]>;
+    getPointStr: (cycleType: number, points: (number | string)[]) => string;
+    getConfig: (val: CalendarDataType, key: keyof meetingTabT) => string;
+    getPlatformLabel: (platform: string) => string;
+    getWeekFromDate: (date: string | Date) => string;
+};

package/dist/treeshaking/components/meeting/composables/useMeetingConfig.mjs

@@ -0,0 +1,97 @@
+import { computed } from "vue";
+import dayjs from "dayjs";
+import { useI18n } from "../../../i18n/index.mjs";
+import IconAll from "../../../_virtual/icon-all.mjs";
+import IconEvent from "../../../_virtual/icon-event.mjs";
+import IconMeeting from "../../../_virtual/icon-meet.mjs";
+import IconSummit from "../../../_virtual/icon-summit.mjs";
+import { CalendarDataType } from "../types.mjs";
+import { TYPE_COLOR_MAP, INTERVAL_DAY, INTERVAL_WEEK, INTERVAL_MONTH } from "../config.mjs";
+const useMeetingConfig = () => {
+  const { t, locale } = useI18n();
+  const meetingTabs = computed(() => [
+    { label: t("meeting.meetingTypeAll"), value: CalendarDataType.ALL, icon: IconAll },
+    { label: t("meeting.meetingTypeMeet"), value: CalendarDataType.MEETING, icon: IconMeeting, color: TYPE_COLOR_MAP.meeting, zIndex: 3 },
+    { label: t("meeting.meetingTypeEvents"), value: CalendarDataType.EVENTS, icon: IconEvent, color: TYPE_COLOR_MAP.events, zIndex: 2 },
+    { label: t("meeting.meetingTypeSummit"), value: CalendarDataType.SUMMIT, icon: IconSummit, color: TYPE_COLOR_MAP.summit, zIndex: 1 }
+  ]);
+  const cycleTypeOptions0 = computed(() => [
+    { label: t("meeting.day0"), value: INTERVAL_DAY, max: 7 },
+    { label: t("meeting.week0"), value: INTERVAL_WEEK, max: 2 },
+    { label: t("meeting.month0"), value: INTERVAL_MONTH, max: 1 }
+  ]);
+  const cycleTypeOptions = computed(() => [
+    { label: t("meeting.day"), value: INTERVAL_DAY, max: 7 },
+    { label: t("meeting.week"), value: INTERVAL_WEEK, max: 2 },
+    { label: t("meeting.month"), value: INTERVAL_MONTH, max: 1 }
+  ]);
+  const weekDay = computed(() => [
+    t("meeting.sunday"),
+    t("meeting.monday"),
+    t("meeting.tuesday"),
+    t("meeting.wednesday"),
+    t("meeting.thursday"),
+    t("meeting.friday"),
+    t("meeting.saturday")
+  ]);
+  const intervalWeekOptions = computed(() => {
+    const list = [];
+    for (let i = 1; i <= 7; i++) {
+      const idx = i % 7;
+      list.push({ value: idx, label: weekDay.value[idx] });
+    }
+    return list;
+  });
+  const getPointStr = (cycleType, points) => {
+    if (cycleType === INTERVAL_WEEK) {
+      return points.sort((a, b) => {
+        const aIdx = intervalWeekOptions.value.findIndex((v) => v.value === a || v.value.toString() === a);
+        const bIdx = intervalWeekOptions.value.findIndex((v) => v.value === b || v.value.toString() === b);
+        return aIdx - bIdx;
+      }).map((point) => {
+        const opt = intervalWeekOptions.value.find((v) => v.value === point || v.value.toString() === point);
+        return (opt == null ? void 0 : opt.label) || String(point);
+      }).join(t("meeting.cycleSplit"));
+    }
+    if (cycleType === INTERVAL_MONTH) {
+      return points.join(t("meeting.cycleSplit"));
+    }
+    return "";
+  };
+  const getConfig = (val, key) => {
+    let value = val;
+    const find = meetingTabs.value.find((v) => v.value === value);
+    return (find == null ? void 0 : find[key]) || "";
+  };
+  const getPlatformLabel = (platform) => {
+    switch (platform) {
+      case "WELINK":
+        return "WeLink";
+      case "ZOOM":
+        return "Zoom";
+      case "TENCENT":
+        return locale.value === "zh" ? "腾讯会议" : "Tencent";
+      default:
+        return platform;
+    }
+  };
+  const getWeekFromDate = (date) => {
+    return weekDay.value[dayjs(date).day()];
+  };
+  return {
+    t,
+    locale,
+    meetingTabs,
+    cycleTypeOptions0,
+    cycleTypeOptions,
+    weekDay,
+    intervalWeekOptions,
+    getPointStr,
+    getConfig,
+    getPlatformLabel,
+    getWeekFromDate
+  };
+};
+export {
+  useMeetingConfig
+};

package/dist/treeshaking/components/meeting/config.d.ts

@@ -0,0 +1,12 @@
+import { meetingTabT } from './types.ts';
+export declare const TYPE_COLOR_MAP: {
+    summit: string;
+    events: string;
+    meeting: string;
+};
+export declare const INTERVAL_DAY = 0;
+export declare const INTERVAL_WEEK = 1;
+export declare const INTERVAL_MONTH = 2;
+export declare const EMAIL_REGEX: RegExp;
+export declare const PROGRESS_COLORS: string[];
+export declare const getMeetingTabs: (t: (key: string) => string) => meetingTabT[];

package/dist/treeshaking/components/meeting/config.mjs

@@ -0,0 +1,19 @@
+import "vue";
+const TYPE_COLOR_MAP = {
+  summit: "rgba(var(--o-orange-6))",
+  events: "rgba(var(--o-cyan-6))",
+  meeting: "rgba(var(--o-deepblue-6))"
+};
+const INTERVAL_DAY = 0;
+const INTERVAL_WEEK = 1;
+const INTERVAL_MONTH = 2;
+const EMAIL_REGEX = /^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/;
+const PROGRESS_COLORS = ["var(--o-color-auxiliary5)", "var(--o-color-auxiliary6)", "var(--o-color-auxiliary7)", "var(--o-color-auxiliary8)", "var(--o-color-auxiliary1)", "var(--o-color-auxiliary2)"];
+export {
+  EMAIL_REGEX,
+  INTERVAL_DAY,
+  INTERVAL_MONTH,
+  INTERVAL_WEEK,
+  PROGRESS_COLORS,
+  TYPE_COLOR_MAP
+};