@opendesign-plus/components 0.0.1-rc.4 → 0.0.1-rc.41

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

@@ -0,0 +1,417 @@
+import { defineComponent, ref, computed, watch, nextTick, openBlock, createElementBlock, normalizeClass, renderSlot, createBlock, unref, withCtx, Fragment, renderList, createElementVNode, createVNode, normalizeStyle, resolveDynamicComponent, toDisplayString, createTextVNode, createCommentVNode, withModifiers } from "vue";
+import { useMessage, isClient, OCollapse, OCollapseItem, OIcon, OTag, ODivider, OButton } from "@opensig/opendesign";
+import _sfc_main$1 from "./OMeetingDetail.vue.mjs";
+import './OMeetingDetail.css';
+import IconCopy from "../../../_virtual/icon-copy.mjs";
+import { MeetingGroupType, CalendarDataType } from "../types.mjs";
+import IconChevronRight from "../../../_virtual/icon-chevron-right.mjs";
+import { INTERVAL_DAY, INTERVAL_WEEK, INTERVAL_MONTH } from "../config.mjs";
+import { formatDate } from "../utils.mjs";
+import { useMeetingConfig } from "../composables/useMeetingConfig.mjs";
+import { useActivityConfig } from "../../activity/composables/useActivityConfig.mjs";
+import _sfc_main$2 from "../../common/TooltipText.vue.mjs";
+import '../../common/TooltipText.css';
+import dayjs from "dayjs";
+const _hoisted_1 = { class: "meet-title-left" };
+const _hoisted_2 = ["title"];
+const _hoisted_3 = { class: "text" };
+const _hoisted_4 = { class: "item-title-text" };
+const _hoisted_5 = {
+  key: 0,
+  class: "tag-wrapper"
+};
+const _hoisted_6 = { class: "start-time" };
+const _hoisted_7 = { class: "btn-wrapper" };
+const _hoisted_8 = { class: "calendar-info" };
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "OMeetingCalendarList",
+  props: {
+    list: { default: () => [] },
+    groupType: {},
+    disableFormat: { type: Boolean }
+  },
+  setup(__props) {
+    const { activityTypeMap } = useActivityConfig();
+    const props = __props;
+    const { t, locale, getConfig, getPointStr } = useMeetingConfig();
+    const detailRefs = ref([]);
+    const message = useMessage(null);
+    const copyInfo = async (idx) => {
+      const instance = detailRefs.value[idx];
+      await instance.copyInfo();
+      message.success({
+        content: t("common.copySuccess")
+      });
+    };
+    const collapseNames = ref([]);
+    const i18n = computed(() => {
+      return {
+        SIG_GROUP: `${props.groupType === MeetingGroupType.GROUP ? t("meeting.groups") : t("meeting.sigs")}: `,
+        NEW_DATE: t("meeting.latestMeeting"),
+        EMPTY_TEXT: t("meeting.meetingEmptyText"),
+        LEARN_MORE: t("common.seeMore"),
+        JOIN_MEETING: t("meeting.joinMeeting"),
+        SIGN: t("meeting.sign"),
+        DETAILS: t("meeting.detail")
+      };
+    });
+    const meetInfoRef = ref();
+    let resizeObserver = null;
+    watch(
+      [() => props.list, () => isClient],
+      () => {
+        if (props.list.length === 1) {
+          collapseNames.value = [props.list[0].id];
+        } else {
+          collapseNames.value = [];
+        }
+        if (isClient) {
+          nextTick(() => {
+            var _a;
+            if (!resizeObserver) {
+              resizeObserver = new ResizeObserver((entries) => {
+                for (let entry of entries) {
+                  const { height } = entry.contentRect;
+                  entry.target.classList.remove("hidden-divider");
+                  if (height >= 30) {
+                    entry.target.classList.add("hidden-divider");
+                  }
+                }
+              });
+            } else {
+              resizeObserver.disconnect();
+            }
+            (_a = meetInfoRef.value) == null ? void 0 : _a.forEach((targetDiv) => {
+              resizeObserver.observe(targetDiv);
+            });
+          });
+        }
+      }
+    );
+    const computedList = computed(() => {
+      return props.list.map((v) => {
+        var _a, _b;
+        const type = v.type;
+        let dateRange = "";
+        let start_date_time = "";
+        let end_date_time = "";
+        let isExpired = false;
+        if (type !== CalendarDataType.MEETING) {
+          let activity_type = (_a = activityTypeMap.value.get(v.activity_type)) == null ? void 0 : _a.label;
+          const isSameDay = v.start_date && (v.start_date === v.end_date || !v.end_date);
+          if (v.start_date) {
+            dateRange = props.disableFormat ? v.start_date : formatDate(v.start_date);
+          }
+          if (isSameDay) {
+            if (v.start) {
+              dateRange += `${dateRange ? " " : ""}${v.start}`;
+              if (v.end) {
+                dateRange += `${dateRange ? " - " : ""}${v.end}`;
+              }
+            }
+          } else {
+            if (v.start) {
+              dateRange += `${dateRange ? " " : ""}${v.start}`;
+            }
+            if (v.end_date) {
+              dateRange += `${dateRange ? " - " : ""}${props.disableFormat ? v.end_date : formatDate(v.end_date)}`;
+              if (v.end) {
+                dateRange += `${dateRange ? " " : ""}${v.end}`;
+              }
+            }
+          }
+          if (v.start_date) {
+            start_date_time = props.disableFormat ? v.start_date : formatDate(v.start_date);
+          }
+          if (v.start) {
+            start_date_time += `${start_date_time ? " " : ""}${v.start}`;
+          }
+          if (v.end_date) {
+            end_date_time = props.disableFormat ? v.end_date : formatDate(v.end_date);
+          }
+          if (v.end) {
+            end_date_time += `${end_date_time ? " " : ""}${v.end}`;
+          }
+          const expiredTime = `${v.end_date || v.start_date} ${v.end || v.start}`;
+          if (dayjs(expiredTime).isValid()) {
+            isExpired = dayjs().isAfter(dayjs(expiredTime));
+          }
+          return {
+            ...v,
+            activity_type,
+            dateRange,
+            start_date_time,
+            end_date_time,
+            isExpired
+          };
+        }
+        const {
+          is_cycle,
+          date,
+          start,
+          end,
+          cycle_start_date,
+          cycle_end_date,
+          cycle_start,
+          cycle_end,
+          cycle_type,
+          cycle_interval,
+          cycle_point
+        } = v;
+        dateRange = props.disableFormat ? date : formatDate(date);
+        if (start && end) {
+          dateRange += `${dateRange ? " " : ""}${start} - ${end}`;
+        } else if (start || end) {
+          dateRange += `${dateRange ? " " : ""}${start || end}`;
+        }
+        if (is_cycle) {
+          dateRange = `${props.disableFormat ? cycle_start_date : formatDate(cycle_start_date)} - ${props.disableFormat ? cycle_end_date : formatDate(cycle_end_date)}`;
+        }
+        let timeRange = "";
+        if (start && end) {
+          timeRange = `${start} - ${end}`;
+        } else {
+          if (start) {
+            timeRange = start;
+          }
+          if (end) {
+            timeRange = end;
+          }
+        }
+        let replay_url = null;
+        let hasObsData = false;
+        const obsData = ((_b = v.obs_data) == null ? void 0 : _b.filter((v2) => v2.text_video_url)) || [];
+        if (is_cycle) {
+          let cycleType = "";
+          if (cycle_type === INTERVAL_DAY) {
+            cycleType = t("meeting.cycleDay");
+          }
+          if (cycle_type === INTERVAL_WEEK) {
+            if (cycle_interval > 1) {
+              cycleType = t("meeting.cycleWeek.other", [getPointStr(cycle_type, cycle_point), cycle_interval]);
+            } else {
+              cycleType = t("meeting.cycleWeek.one", [getPointStr(cycle_type, cycle_point)]);
+            }
+          }
+          if (cycle_type === INTERVAL_MONTH) {
+            cycleType = t("meeting.cycleMonth", [getPointStr(cycle_type, cycle_point)]);
+          }
+          timeRange = t("meeting.cycleMeetingText2", {
+            startDate: formatDate(cycle_start_date),
+            endDate: formatDate(cycle_end_date),
+            startTime: cycle_start,
+            endTime: cycle_end,
+            cycleType
+          });
+          hasObsData = obsData.some((t2) => {
+            var _a2;
+            return t2.sub_id === ((_a2 = v.cycle_sub.find((z) => z.date === date)) == null ? void 0 : _a2.sub_id);
+          });
+        } else {
+          hasObsData = obsData.length > 0;
+        }
+        if (hasObsData) {
+          replay_url = `${location.origin}/${locale.value}/video/${v.group_name}/${v.mid}/${date}`;
+        }
+        return {
+          ...v,
+          dateRange,
+          timeRange,
+          replay_url,
+          isExpired: dayjs().isAfter(dayjs(`${v.date} ${v.end || v.cycle_end}`))
+        };
+      });
+    });
+    return (_ctx, _cache) => {
+      var _a, _b;
+      return openBlock(), createElementBlock("div", {
+        class: normalizeClass(["o-meeting-calendar-list", !((_a = computedList.value) == null ? void 0 : _a.length) ? "is-empty" : ""])
+      }, [
+        !((_b = computedList.value) == null ? void 0 : _b.length) ? renderSlot(_ctx.$slots, "empty", { key: 0 }) : (openBlock(), createBlock(unref(OCollapse), {
+          key: 1,
+          modelValue: collapseNames.value,
+          "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => collapseNames.value = $event),
+          style: { "--collapse-padding": "0" }
+        }, {
+          default: withCtx(() => [
+            (openBlock(true), createElementBlock(Fragment, null, renderList(computedList.value, (item, index) => {
+              return openBlock(), createBlock(unref(OCollapseItem), {
+                key: item.id,
+                value: item.id,
+                class: normalizeClass({ "is-expired": item.isExpired })
+              }, {
+                title: withCtx(() => [
+                  createElementVNode("div", _hoisted_1, [
+                    createElementVNode("div", {
+                      class: "meet-title",
+                      title: item.topic || item.name || item.title
+                    }, [
+                      createVNode(unref(OIcon), {
+                        style: normalizeStyle({
+                          backgroundColor: `${unref(getConfig)(item.type, "color")}`
+                        })
+                      }, {
+                        default: withCtx(() => [
+                          (openBlock(), createBlock(resolveDynamicComponent(unref(getConfig)(item.type, "icon"))))
+                        ]),
+                        _: 2
+                      }, 1032, ["style"]),
+                      createElementVNode("div", _hoisted_3, [
+                        createVNode(_sfc_main$2, null, {
+                          default: withCtx(() => [
+                            createElementVNode("span", _hoisted_4, toDisplayString(item.topic || item.name || item.title), 1)
+                          ]),
+                          _: 2
+                        }, 1024)
+                      ]),
+                      item.is_cycle ? (openBlock(), createElementBlock("div", _hoisted_5, [
+                        createVNode(unref(OTag), {
+                          color: "primary",
+                          variant: "outline"
+                        }, {
+                          default: withCtx(() => [
+                            createTextVNode(toDisplayString(unref(t)("meeting.cycle")), 1)
+                          ]),
+                          _: 1
+                        })
+                      ])) : createCommentVNode("", true)
+                    ], 8, _hoisted_2),
+                    createElementVNode("div", {
+                      class: "meet-info",
+                      ref_for: true,
+                      ref_key: "meetInfoRef",
+                      ref: meetInfoRef
+                    }, [
+                      createElementVNode("span", _hoisted_6, [
+                        createElementVNode("span", null, toDisplayString(item.dateRange), 1)
+                      ]),
+                      item.group_name || item.activity_type ? (openBlock(), createBlock(unref(ODivider), {
+                        key: 0,
+                        direction: "v"
+                      })) : createCommentVNode("", true),
+                      createElementVNode("div", null, [
+                        item.group_name ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
+                          createTextVNode(toDisplayString(i18n.value.SIG_GROUP) + " " + toDisplayString(item.group_name), 1)
+                        ], 64)) : createCommentVNode("", true),
+                        item.activity_type ? (openBlock(), createElementBlock(Fragment, { key: 1 }, [
+                          createTextVNode(toDisplayString(item.activity_type), 1)
+                        ], 64)) : createCommentVNode("", true)
+                      ])
+                    ], 512),
+                    createElementVNode("div", _hoisted_7, [
+                      item.url ? (openBlock(), createBlock(unref(OButton), {
+                        key: 0,
+                        variant: "text",
+                        href: item.url,
+                        target: "_blank",
+                        class: "jump-detail-link"
+                      }, {
+                        suffix: withCtx(() => [
+                          createVNode(unref(OIcon), null, {
+                            default: withCtx(() => [
+                              createVNode(unref(IconChevronRight))
+                            ]),
+                            _: 1
+                          })
+                        ]),
+                        default: withCtx(() => [
+                          createElementVNode("span", null, toDisplayString(i18n.value.LEARN_MORE), 1)
+                        ]),
+                        _: 1
+                      }, 8, ["href"])) : createCommentVNode("", true),
+                      item.join_url && !item.isExpired ? (openBlock(), createBlock(unref(OButton), {
+                        key: 1,
+                        variant: "text",
+                        href: item.join_url,
+                        target: "_blank",
+                        class: "jump-detail-link"
+                      }, {
+                        suffix: withCtx(() => [
+                          createVNode(unref(OIcon), null, {
+                            default: withCtx(() => [
+                              createVNode(unref(IconChevronRight))
+                            ]),
+                            _: 1
+                          })
+                        ]),
+                        default: withCtx(() => [
+                          createElementVNode("span", null, toDisplayString(i18n.value.JOIN_MEETING), 1)
+                        ]),
+                        _: 1
+                      }, 8, ["href"])) : createCommentVNode("", true),
+                      item.content_url ? (openBlock(), createBlock(unref(OButton), {
+                        key: 2,
+                        variant: "text",
+                        href: item.content_url,
+                        target: "_blank",
+                        class: "jump-detail-link"
+                      }, {
+                        suffix: withCtx(() => [
+                          createVNode(unref(OIcon), null, {
+                            default: withCtx(() => [
+                              createVNode(unref(IconChevronRight))
+                            ]),
+                            _: 1
+                          })
+                        ]),
+                        default: withCtx(() => [
+                          createElementVNode("span", null, toDisplayString(i18n.value.DETAILS), 1)
+                        ]),
+                        _: 1
+                      }, 8, ["href"])) : createCommentVNode("", true),
+                      item.register_url && !item.isExpired ? (openBlock(), createBlock(unref(OButton), {
+                        key: 3,
+                        variant: "text",
+                        href: item.register_url,
+                        target: "_blank",
+                        class: "jump-detail-link"
+                      }, {
+                        suffix: withCtx(() => [
+                          createVNode(unref(OIcon), null, {
+                            default: withCtx(() => [
+                              createVNode(unref(IconChevronRight))
+                            ]),
+                            _: 1
+                          })
+                        ]),
+                        default: withCtx(() => [
+                          createElementVNode("span", null, toDisplayString(i18n.value.SIGN), 1)
+                        ]),
+                        _: 1
+                      }, 8, ["href"])) : createCommentVNode("", true)
+                    ])
+                  ]),
+                  createVNode(unref(OIcon), {
+                    onClick: withModifiers(() => copyInfo(index), ["stop"]),
+                    class: "copy-icon"
+                  }, {
+                    default: withCtx(() => [
+                      createVNode(unref(IconCopy))
+                    ]),
+                    _: 1
+                  }, 8, ["onClick"])
+                ]),
+                default: withCtx(() => [
+                  createElementVNode("div", _hoisted_8, [
+                    createVNode(_sfc_main$1, {
+                      show: collapseNames.value.includes(item.id),
+                      data: item,
+                      ref_for: true,
+                      ref: (insRef) => detailRefs.value[index] = insRef,
+                      from: "home"
+                    }, null, 8, ["show", "data"])
+                  ])
+                ]),
+                _: 2
+              }, 1032, ["value", "class"]);
+            }), 128))
+          ]),
+          _: 1
+        }, 8, ["modelValue"]))
+      ], 2);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

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

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