@opendesign-plus-test/components 0.0.1-rc.116 → 0.0.1-rc.118

package/dist/treeshaking/components/meeting/OMeetingPlayback.vue.d.ts

@@ -38,6 +38,7 @@ declare function __VLS_template(): {
             captions: CaptionItemT[];
             vtt: string;
         }> | null;
+        contentRef: HTMLDivElement;
     };
     rootEl: HTMLDivElement;
 };
@@ -84,6 +85,7 @@ declare const __VLS_component: import('vue').DefineComponent<MeetingPlaybackProp
         captions: CaptionItemT[];
         vtt: string;
     }> | null;
+    contentRef: HTMLDivElement;
 }, HTMLDivElement>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;

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

@@ -1,4 +1,4 @@
-import { defineComponent, ref, computed, watchEffect, onMounted, onUnmounted, openBlock, createElementBlock, createElementVNode, createVNode, withCtx, createTextVNode, toDisplayString, createBlock, unref, Fragment, renderList, createCommentVNode, normalizeClass, normalizeStyle, renderSlot } from "vue";
+import { defineComponent, ref, computed, watchEffect, watch, nextTick, onMounted, onUnmounted, openBlock, createElementBlock, createElementVNode, createVNode, withCtx, createTextVNode, toDisplayString, createBlock, unref, Fragment, renderList, createCommentVNode, normalizeClass, normalizeStyle, renderSlot } from "vue";
 import { transformSeconds, speakerNum, transformTime } from "./utils.mjs";
 import { OSelect, OOption, OTab, OTabPane, OScroller, OIcon, OIconChevronDown } from "@opensig/opendesign";
 import _sfc_main$3 from "./components/OMeetingPlaybackSubtitles.vue.mjs";
@@ -33,6 +33,7 @@ const _hoisted_13 = {
   class: "subject-progress"
 };
 const _hoisted_14 = ["data-start", "data-end"];
+const COLLAPSE_THRESHOLD = 168;
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "OMeetingPlayback",
   props: {
@@ -177,16 +178,40 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       cancelAnimationFrame(raf);
       raf = requestAnimationFrame(updateHeight);
     };
+    const contentRef = ref(null);
+    const showMoreBtn = ref(false);
+    const checkMoreBtn = () => {
+      const el = contentRef.value;
+      if (el) {
+        showMoreBtn.value = el.offsetHeight > COLLAPSE_THRESHOLD;
+      }
+    };
+    let contentRaf = null;
+    let contentObserver = null;
+    const debouncedCheckMoreBtn = () => {
+      cancelAnimationFrame(contentRaf);
+      contentRaf = requestAnimationFrame(checkMoreBtn);
+    };
+    watch(tab, () => {
+      nextTick(checkMoreBtn);
+    });
     onMounted(() => {
       if (leftRef.value) {
         observer = new ResizeObserver(debouncedUpdate);
         observer.observe(leftRef.value);
         updateHeight();
       }
+      if (contentRef.value) {
+        contentObserver = new ResizeObserver(debouncedCheckMoreBtn);
+        contentObserver.observe(contentRef.value);
+        checkMoreBtn();
+      }
     });
     onUnmounted(() => {
       cancelAnimationFrame(raf);
       observer == null ? void 0 : observer.disconnect();
+      cancelAnimationFrame(contentRaf);
+      contentObserver == null ? void 0 : contentObserver.disconnect();
     });
     const expanded = ref(false);
     const toggleExpanded = () => {
@@ -266,68 +291,74 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
               _: 1
             }, 8, ["modelValue"]),
             createVNode(unref(OScroller), {
-              class: normalizeClass(["tab-content", `tab-content-${tab.value}`, expanded.value ? "is-expanded" : ""]),
+              class: normalizeClass(["tab-content", `tab-content-${tab.value}`, expanded.value ? "is-expanded" : "", showMoreBtn.value ? "is-collapsible" : ""]),
               "show-type": "hover"
             }, {
               default: withCtx(() => {
                 var _a2;
                 return [
-                  tab.value === tabOptions.value[0].value ? (openBlock(), createElementBlock("div", _hoisted_6, [
-                    createElementVNode("div", _hoisted_7, [
-                      createElementVNode("span", null, toDisplayString(unref(t)("meeting.item1")), 1),
-                      createElementVNode("span", null, toDisplayString(__props.detail.sponsor), 1)
-                    ]),
-                    createElementVNode("div", _hoisted_8, [
-                      createElementVNode("span", null, toDisplayString(unref(t)("meeting.item2")), 1),
-                      createElementVNode("span", null, toDisplayString(__props.detail.groupName), 1)
-                    ]),
-                    createElementVNode("div", _hoisted_9, [
-                      createElementVNode("span", null, toDisplayString(unref(t)("meeting.item3")), 1),
-                      createElementVNode("span", null, toDisplayString(__props.detail.date) + "  " + toDisplayString(__props.detail.start) + "~" + toDisplayString(__props.detail.end), 1)
-                    ]),
-                    createElementVNode("div", _hoisted_10, [
-                      createElementVNode("span", null, toDisplayString(unref(t)("meeting.item4")), 1),
-                      createElementVNode("span", null, toDisplayString(__props.detail.agenda || "-"), 1)
-                    ])
-                  ])) : createCommentVNode("", true),
-                  tab.value === ((_a2 = tabOptions.value[1]) == null ? void 0 : _a2.value) ? (openBlock(), createElementBlock("div", _hoisted_11, [
-                    mouseTime.value ? (openBlock(), createElementBlock("div", {
-                      key: 0,
-                      class: "mouse-current-time",
-                      style: normalizeStyle({
-                        top: mousePosition.value[1],
-                        left: mousePosition.value[0]
-                      })
-                    }, toDisplayString(mouseTime.value), 5)) : createCommentVNode("", true),
-                    (openBlock(true), createElementBlock(Fragment, null, renderList(subjectList.value, (sub, idx) => {
-                      return openBlock(), createElementBlock("div", {
-                        class: "subject-item",
-                        key: sub.title
-                      }, [
-                        createElementVNode("div", _hoisted_12, toDisplayString(sub.title), 1),
-                        playerDuration.value ? (openBlock(), createElementBlock("div", _hoisted_13, [
-                          createElementVNode("div", {
-                            class: "subject-progress-item",
-                            onClick: changeTime,
-                            onMousemove: mouseOverItem,
-                            onMouseleave: mouseLeaveItem,
-                            "data-start": sub.startTime,
-                            "data-end": sub.endTime,
-                            style: normalizeStyle({
-                              "--start": (sub.startTimeNumber < 0 ? 0 : sub.startTimeNumber) / playerDuration.value,
-                              "--end": (sub.endTimeNumber > playerDuration.value ? playerDuration.value : sub.endTimeNumber) / playerDuration.value,
-                              background: getProgressColor(idx)
-                            })
-                          }, null, 44, _hoisted_14)
-                        ])) : createCommentVNode("", true)
-                      ]);
-                    }), 128))
-                  ])) : createCommentVNode("", true),
+                  createElementVNode("div", {
+                    class: "tab-content-inner",
+                    ref_key: "contentRef",
+                    ref: contentRef
+                  }, [
+                    tab.value === tabOptions.value[0].value ? (openBlock(), createElementBlock("div", _hoisted_6, [
+                      createElementVNode("div", _hoisted_7, [
+                        createElementVNode("span", null, toDisplayString(unref(t)("meeting.item1")), 1),
+                        createElementVNode("span", null, toDisplayString(__props.detail.sponsor), 1)
+                      ]),
+                      createElementVNode("div", _hoisted_8, [
+                        createElementVNode("span", null, toDisplayString(unref(t)("meeting.item2")), 1),
+                        createElementVNode("span", null, toDisplayString(__props.detail.groupName || __props.detail.group_name), 1)
+                      ]),
+                      createElementVNode("div", _hoisted_9, [
+                        createElementVNode("span", null, toDisplayString(unref(t)("meeting.item3")), 1),
+                        createElementVNode("span", null, toDisplayString(__props.detail.date) + "  " + toDisplayString(__props.detail.start) + "~" + toDisplayString(__props.detail.end), 1)
+                      ]),
+                      createElementVNode("div", _hoisted_10, [
+                        createElementVNode("span", null, toDisplayString(unref(t)("meeting.item4")), 1),
+                        createElementVNode("span", null, toDisplayString(__props.detail.agenda || "-"), 1)
+                      ])
+                    ])) : createCommentVNode("", true),
+                    tab.value === ((_a2 = tabOptions.value[1]) == null ? void 0 : _a2.value) ? (openBlock(), createElementBlock("div", _hoisted_11, [
+                      mouseTime.value ? (openBlock(), createElementBlock("div", {
+                        key: 0,
+                        class: "mouse-current-time",
+                        style: normalizeStyle({
+                          top: mousePosition.value[1],
+                          left: mousePosition.value[0]
+                        })
+                      }, toDisplayString(mouseTime.value), 5)) : createCommentVNode("", true),
+                      (openBlock(true), createElementBlock(Fragment, null, renderList(subjectList.value, (sub, idx) => {
+                        return openBlock(), createElementBlock("div", {
+                          class: "subject-item",
+                          key: sub.title
+                        }, [
+                          createElementVNode("div", _hoisted_12, toDisplayString(sub.title), 1),
+                          playerDuration.value ? (openBlock(), createElementBlock("div", _hoisted_13, [
+                            createElementVNode("div", {
+                              class: "subject-progress-item",
+                              onClick: changeTime,
+                              onMousemove: mouseOverItem,
+                              onMouseleave: mouseLeaveItem,
+                              "data-start": sub.startTime,
+                              "data-end": sub.endTime,
+                              style: normalizeStyle({
+                                "--start": (sub.startTimeNumber < 0 ? 0 : sub.startTimeNumber) / playerDuration.value,
+                                "--end": (sub.endTimeNumber > playerDuration.value ? playerDuration.value : sub.endTimeNumber) / playerDuration.value,
+                                background: getProgressColor(idx)
+                              })
+                            }, null, 44, _hoisted_14)
+                          ])) : createCommentVNode("", true)
+                        ]);
+                      }), 128))
+                    ])) : createCommentVNode("", true)
+                  ], 512),
                   createElementVNode("span", {
                     class: "more-btn",
                     onClick: toggleExpanded
                   }, [
-                    createElementVNode("span", null, toDisplayString(unref(t)("meeting.viewMore")), 1),
+                    createElementVNode("span", null, toDisplayString(expanded.value ? unref(t)("common.collapse") : unref(t)("common.viewMore")), 1),
                     createVNode(unref(OIcon), null, {
                       default: withCtx(() => [
                         createVNode(unref(OIconChevronDown))