@opendesign-plus-test/components 0.0.1-rc.19 → 0.0.1-rc.191

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

@@ -0,0 +1,244 @@
+import { defineComponent, ref, watch, onMounted, onUnmounted, openBlock, createElementBlock, createElementVNode, normalizeClass, toDisplayString, createCommentVNode, nextTick } from "vue";
+import videojs from "../../../_virtual/video.js/dist/video.es.js.mjs";
+import '../../../_virtual/video.js/dist/video-js.css';
+import { transformTime } from "../utils.mjs";
+import defaultPoster from "../../../assets/meeting/transparent.png.mjs";
+const _hoisted_1 = { class: "o-meeting-playback-video" };
+const _hoisted_2 = {
+  key: 0,
+  class: "poster-title"
+};
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "OMeetingPlaybackVideo",
+  props: {
+    src: { default: "" },
+    vtt: { default: "" },
+    captions: { default: () => [] },
+    poster: {},
+    posterTitle: {},
+    instance: {},
+    trackIdx: {}
+  },
+  emits: ["getDuration", "getInstance", "setTrackIdx"],
+  setup(__props, { expose: __expose, emit: __emit }) {
+    const props = __props;
+    const timer = ref();
+    const colHeight = ref();
+    const playerRef = ref();
+    const emits = __emit;
+    const speakerMenuVisible = ref(false);
+    const closeSpeakerMenu = () => {
+      speakerMenuVisible.value = false;
+    };
+    const handleCue = (textTrack, init = false) => {
+      var _a, _b;
+      const player = props.instance;
+      if (!player) return;
+      const activeCue = (_a = textTrack.activeCues) == null ? void 0 : _a[0];
+      timer.value && clearInterval(timer.value);
+      if (activeCue) {
+        activeCue.text = ((_b = activeCue == null ? void 0 : activeCue.text) == null ? void 0 : _b.replace(/\[(SPEAKER_)\d+]: /g, "")) || "";
+        const arr = activeCue.text.split("\n");
+        const captionLength = arr.length;
+        const timeL = activeCue.endTime - activeCue.startTime;
+        const interval = parseFloat((timeL / captionLength).toFixed(3));
+        let index = 0;
+        if (init) {
+          const ratio = (player.currentTime() - activeCue.startTime) / (activeCue.endTime - activeCue.startTime);
+          while ((index + 1) / captionLength < ratio) {
+            index++;
+          }
+        }
+        if (index < captionLength) {
+          activeCue.text = arr.length ? arr[index] : activeCue == null ? void 0 : activeCue.text;
+        } else {
+          activeCue.text = arr.length ? arr[0] : activeCue == null ? void 0 : activeCue.text;
+        }
+        let timeInterval = interval * 1e3;
+        const startInterval = () => {
+          timer.value = setInterval(() => {
+            textTrack.mode = "hidden";
+            index++;
+            if (index > arr.length - 1) {
+              clearInterval(timer.value);
+            } else if (index === arr.length - 1) {
+              activeCue.text = arr[index];
+              clearInterval(timer.value);
+              timeInterval = interval * (captionLength - index) * 1e3;
+              startInterval();
+            } else {
+              activeCue.text = arr[index];
+            }
+            textTrack.mode = "showing";
+          }, timeInterval);
+        };
+        startInterval();
+      }
+    };
+    const checkedSpeakers = ref([]);
+    watch(
+      () => checkedSpeakers.value,
+      (val) => {
+        const player = props.instance;
+        if (player) {
+          const tracks = player.textTracks();
+          for (let i = 0; i < tracks.length; i++) {
+            if (tracks[i].kind === "subtitles") {
+              handleCue(tracks[i], true);
+              tracks[i].mode = !val.length ? "hidden" : "showing";
+            }
+          }
+        }
+      },
+      {
+        deep: true
+      }
+    );
+    const loaded = ref(false);
+    const playStatus = ref("init");
+    const videoInit = async () => {
+      if (!props.src) return;
+      const player = videojs("playerId", {
+        controls: true,
+        autoplay: false,
+        preload: "auto",
+        fluid: true,
+        poster: props.poster || defaultPoster,
+        // 控制栏
+        playbackRates: [0.5, 0.75, 1, 1.25, 1.5, 2],
+        controlBar: {
+          skipButtons: {
+            backward: 5,
+            forward: 5
+          },
+          children: {
+            playToggle: true,
+            SkipBackward: {
+              backward: 5
+            },
+            skipForward: {
+              forward: 5
+            },
+            currentTimeDisplay: true,
+            timeDivider: true,
+            durationDisplay: true,
+            progressControl: true,
+            PlaybackRateMenuButton: true,
+            volumePanel: {
+              inline: false
+            },
+            FullscreenToggle: true
+          }
+        }
+      });
+      emits("getInstance", player);
+      player.src(props.src);
+      player.addRemoteTextTrack({
+        kind: "subtitles",
+        src: props.vtt,
+        srclang: "zh",
+        label: "中文",
+        default: false
+      });
+      loaded.value = true;
+      class CustomSubsCapsButton extends videojs.getComponent("Button") {
+        constructor(player2, options) {
+          super(player2, options);
+          this.addClass("vjs-subtitle-toggle-button", "vjs-subtitle-hidden");
+          this.controlText("Toggle Subtitles");
+        }
+        buildCSSClass() {
+          return `vjs-subtitle-toggle-button ${super.buildCSSClass()}`;
+        }
+        handleClick() {
+          const tracks = this.player().textTracks();
+          for (let i = 0; i < tracks.length; i++) {
+            if (tracks[i].kind === "subtitles") {
+              handleCue(tracks[i], true);
+              tracks[i].mode = tracks[i].mode === "showing" ? "hidden" : "showing";
+              if (tracks[i].mode === "showing") {
+                this.removeClass("vjs-subtitle-hidden");
+                this.addClass("vjs-subtitle-showing");
+              } else {
+                this.removeClass("vjs-subtitle-showing");
+                this.addClass("vjs-subtitle-hidden");
+              }
+            }
+          }
+        }
+      }
+      if (props.vtt) {
+        videojs.registerComponent("SubtitleToggleButton", CustomSubsCapsButton);
+        if (!player.controlBar.children_.some((v) => v.name_ === "SubtitleToggleButton")) {
+          player.controlBar.addChild("SubtitleToggleButton", {}, 8);
+        }
+      }
+      const textTracks = player == null ? void 0 : player.textTracks().tracks_;
+      textTracks.forEach((textTrack) => {
+        textTrack == null ? void 0 : textTrack.addEventListener("cuechange", () => {
+          handleCue(textTrack);
+        });
+      });
+      player.on("play", () => {
+        playStatus.value = "playing";
+      });
+      player.on("timeupdate", () => {
+        const currentTime = player.currentTime() || 0;
+        const idx = props.captions.findIndex((item) => {
+          const startTime = transformTime(item.start_time);
+          return startTime > currentTime;
+        });
+        emits("setTrackIdx", idx);
+      });
+      player.one("loadedmetadata", () => {
+        emits("getDuration", player.duration());
+      });
+      nextTick(() => {
+        const container = document.getElementsByClassName("o-meeting-playback-video")[0];
+        colHeight.value = container.offsetHeight;
+      });
+      playerRef.value = player;
+    };
+    onMounted(() => {
+      videoInit();
+      document.addEventListener("click", closeSpeakerMenu);
+    });
+    watch(
+      () => props.src,
+      () => {
+        videoInit();
+      }
+    );
+    onUnmounted(() => {
+      var _a;
+      (_a = props == null ? void 0 : props.instance) == null ? void 0 : _a.dispose();
+      document.removeEventListener("click", closeSpeakerMenu);
+    });
+    __expose({
+      changeTime: (time) => {
+        var _a;
+        (_a = playerRef.value) == null ? void 0 : _a.currentTime(time);
+      }
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", _hoisted_1, [
+        createElementVNode("div", {
+          class: normalizeClass(["video-placeholder", {
+            loaded: loaded.value,
+            "no-poster": !__props.poster,
+            [playStatus.value]: true
+          }])
+        }, [
+          _cache[0] || (_cache[0] = createElementVNode("video", {
+            class: "video-js",
+            id: "playerId"
+          }, null, -1)),
+          __props.posterTitle ? (openBlock(), createElementBlock("div", _hoisted_2, toDisplayString(__props.posterTitle), 1)) : createCommentVNode("", true)
+        ], 2)
+      ]);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

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

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

package/dist/treeshaking/components/meeting/components/OMeetingSendMinutesDialog.css

@@ -0,0 +1,14 @@
+.hover-icon-rotate .o-icon[data-v-8f4f9074] {
+  transition: all var(--o-duration-m1) var(--o-easing-standard-in);
+}
+@media (hover: hover) {
+.hover-icon-rotate:hover .o-icon[data-v-8f4f9074] {
+    transform: rotate(-180deg);
+}
+}
+.o-meeting-send-minutes-footer[data-v-8f4f9074] {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  gap: var(--o-r-gap-4);
+}

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

@@ -0,0 +1,48 @@
+import { MeetingItemT, SendLogT } from '../types';
+type __VLS_Props = {
+    visible: boolean;
+    meeting: MeetingItemT | null;
+    prefill?: string[] | null;
+    sendMinutesRequest: any;
+};
+declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
+    "update:visible": (v: boolean) => any;
+    sent: (log: SendLogT) => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
+    "onUpdate:visible"?: ((v: boolean) => any) | undefined;
+    onSent?: ((log: SendLogT) => any) | undefined;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
+    formRef: import('vue').CreateComponentPublicInstanceWithMixins<Readonly<{
+        meeting: MeetingItemT | null;
+        prefill?: string[] | null;
+        sendMinutesRequest: any;
+    }> & Readonly<{
+        onSent?: ((log: SendLogT) => any) | undefined;
+    }>, {
+        send: () => Promise<void>;
+        sending: import('vue').Ref<boolean, boolean>;
+        reset: () => void;
+    }, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
+        sent: (log: SendLogT) => any;
+    }, import('vue').PublicProps, {}, false, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {
+        recipientInputRef: HTMLInputElement;
+    }, HTMLDivElement, import('vue').ComponentProvideOptions, {
+        P: {};
+        B: {};
+        D: {};
+        C: {};
+        M: {};
+        Defaults: {};
+    }, Readonly<{
+        meeting: MeetingItemT | null;
+        prefill?: string[] | null;
+        sendMinutesRequest: any;
+    }> & Readonly<{
+        onSent?: ((log: SendLogT) => any) | undefined;
+    }>, {
+        send: () => Promise<void>;
+        sending: import('vue').Ref<boolean, boolean>;
+        reset: () => void;
+    }, {}, {}, {}, {}> | null;
+}, any>;
+export default _default;

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

@@ -0,0 +1,7 @@
+import _sfc_main from "./OMeetingSendMinutesDialog.vue2.mjs";
+import './OMeetingSendMinutesDialog.css';
+import _export_sfc from "../../../_virtual/_plugin-vue_export-helper.mjs";
+const OMeetingSendMinutesDialog = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-8f4f9074"]]);
+export {
+  OMeetingSendMinutesDialog as default
+};

package/dist/treeshaking/components/meeting/components/OMeetingSendMinutesDialog.vue2.mjs

@@ -0,0 +1,92 @@
+import { defineComponent, ref, watch, openBlock, createBlock, unref, withCtx, createVNode, createElementVNode, createTextVNode, toDisplayString } from "vue";
+import { ODialog, OButton } from "@opensig/opendesign";
+import { useMeetingConfig } from "../composables/useMeetingConfig.mjs";
+import _OMeetingSendMinutesForm from "../OMeetingSendMinutesForm.vue.mjs";
+const _hoisted_1 = { class: "o-meeting-send-minutes-footer" };
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "OMeetingSendMinutesDialog",
+  props: {
+    visible: { type: Boolean },
+    meeting: {},
+    prefill: {},
+    sendMinutesRequest: {}
+  },
+  emits: ["update:visible", "sent"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const { t } = useMeetingConfig();
+    const formRef = ref(null);
+    watch(
+      () => props.visible,
+      (v) => {
+        var _a;
+        if (v) (_a = formRef.value) == null ? void 0 : _a.reset();
+      }
+    );
+    const onSent = (log) => {
+      emit("sent", log);
+      emit("update:visible", false);
+    };
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(ODialog), {
+        visible: __props.visible,
+        "onUpdate:visible": _cache[2] || (_cache[2] = (v) => emit("update:visible", v)),
+        class: "o-meeting-send-minutes-dialog"
+      }, {
+        header: withCtx(() => [
+          createTextVNode(toDisplayString(unref(t)("meeting.sendMinutesDialogTitle")), 1)
+        ]),
+        footer: withCtx(() => {
+          var _a;
+          return [
+            createElementVNode("div", _hoisted_1, [
+              createVNode(unref(OButton), {
+                color: "primary",
+                variant: "solid",
+                round: "pill",
+                size: "large",
+                loading: (_a = formRef.value) == null ? void 0 : _a.sending,
+                onClick: _cache[0] || (_cache[0] = ($event) => {
+                  var _a2;
+                  return (_a2 = formRef.value) == null ? void 0 : _a2.send();
+                })
+              }, {
+                default: withCtx(() => [
+                  createTextVNode(toDisplayString(unref(t)("meeting.sendMinutesSend")), 1)
+                ]),
+                _: 1
+              }, 8, ["loading"]),
+              createVNode(unref(OButton), {
+                color: "primary",
+                variant: "outline",
+                round: "pill",
+                size: "large",
+                onClick: _cache[1] || (_cache[1] = ($event) => emit("update:visible", false))
+              }, {
+                default: withCtx(() => [
+                  createTextVNode(toDisplayString(unref(t)("meeting.sendMinutesCancel")), 1)
+                ]),
+                _: 1
+              })
+            ])
+          ];
+        }),
+        default: withCtx(() => [
+          createVNode(_OMeetingSendMinutesForm, {
+            ref_key: "formRef",
+            ref: formRef,
+            meeting: __props.meeting,
+            prefill: __props.prefill,
+            "send-minutes-request": __props.sendMinutesRequest,
+            onSent
+          }, null, 8, ["meeting", "prefill", "send-minutes-request"])
+        ]),
+        _: 1
+      }, 8, ["visible"]);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/dist/treeshaking/components/meeting/components/OMeetingSigAside.css

@@ -0,0 +1,176 @@
+.hover-icon-rotate .o-icon {
+  transition: all var(--o-duration-m1) var(--o-easing-standard-in);
+}
+@media (hover: hover) {
+.hover-icon-rotate:hover .o-icon {
+    transform: rotate(-180deg);
+}
+}
+.o-sig-meeting-aside {
+  width: 35%;
+  flex-shrink: 0;
+  padding: var(--o-gap-4) var(--o-gap-5);
+  display: flex;
+  flex-direction: column;
+  border-right: 1px solid var(--o-color-control4);
+  justify-content: space-between;
+}
+@media (max-width: 1200px) {
+.o-sig-meeting-aside {
+    padding: var(--o-gap-4);
+}
+}
+@media (max-width: 840px) {
+.o-sig-meeting-aside {
+    border-right: none;
+}
+}
+@media (max-width: 600px) {
+.o-sig-meeting-aside {
+    padding: var(--o-gap-4);
+}
+.o-sig-meeting-aside .title {
+    margin-bottom: var(--o-gap-2);
+}
+}
+@media (max-width: 840px) {
+.o-sig-meeting-aside {
+    width: 100%;
+}
+}
+.o-sig-meeting-aside .month-wrapper {
+  --scrollbar-y-right: -12px;
+}
+.o-sig-meeting-aside .month-item {
+  height: calc(var(--height) * 1px - 24px - var(--o-gap-3));
+}
+.o-sig-meeting-aside .month-item .month {
+  color: var(--o-color-info3);
+  margin-bottom: var(--o-gap-2);
+  font-weight: bold;
+  font-size: 16px;
+  line-height: 24px;
+}
+@media (min-width: 1201px) and (max-width: 1680px) {
+.o-sig-meeting-aside .month-item .month {
+    font-size: 14px;
+    line-height: 22px;
+}
+}
+@media (min-width: 841px) and (max-width: 1200px) {
+.o-sig-meeting-aside .month-item .month {
+    font-size: 14px;
+    line-height: 22px;
+}
+}
+@media (min-width: 601px) and (max-width: 840px) {
+.o-sig-meeting-aside .month-item .month {
+    font-size: 14px;
+    line-height: 22px;
+}
+}
+@media (max-width: 600px) {
+.o-sig-meeting-aside .month-item .month {
+    font-size: 12px;
+    line-height: 18px;
+}
+}
+.o-sig-meeting-aside .month-item .days {
+  gap: var(--o-gap-2);
+  display: grid;
+  grid-template-columns: repeat(2, 1fr);
+}
+@media (max-width: 840px) {
+.o-sig-meeting-aside .month-item .days {
+    display: flex;
+}
+}
+.o-sig-meeting-aside .month-item .days .day-item {
+  height: 64px;
+  border-radius: var(--meeting-cell-radius);
+  background-color: var(--o-color-control2-light);
+  padding: 8px 12px;
+  cursor: pointer;
+  border: 1px solid transparent;
+}
+.o-sig-meeting-aside .month-item .days .day-item:hover {
+  background-color: var(--o-color-control3-light);
+}
+.o-sig-meeting-aside .month-item .days .day-item.active {
+  border-color: var(--o-color-primary1);
+}
+.o-sig-meeting-aside .month-item .days .day-item .day-d {
+  font-weight: 500;
+  margin-bottom: var(--o-gap-1);
+  color: var(--o-color-info1);
+  font-size: 14px;
+  line-height: 22px;
+}
+@media (min-width: 1201px) and (max-width: 1680px) {
+.o-sig-meeting-aside .month-item .days .day-item .day-d {
+    font-size: 14px;
+    line-height: 18px;
+}
+}
+@media (min-width: 841px) and (max-width: 1200px) {
+.o-sig-meeting-aside .month-item .days .day-item .day-d {
+    font-size: 12px;
+    line-height: 18px;
+}
+}
+@media (min-width: 601px) and (max-width: 840px) {
+.o-sig-meeting-aside .month-item .days .day-item .day-d {
+    font-size: 12px;
+    line-height: 18px;
+}
+}
+@media (max-width: 600px) {
+.o-sig-meeting-aside .month-item .days .day-item .day-d {
+    font-size: 12px;
+    line-height: 18px;
+}
+}
+.o-sig-meeting-aside .month-item .days .day-item .day-c {
+  color: rgb(var(--o-white));
+  display: flex;
+  flex-wrap: nowrap;
+}
+.o-sig-meeting-aside .month-item .days .day-item .day-c .o-icon {
+  width: 16px;
+  height: 16px;
+  font-size: 14px;
+  padding: 1px;
+  line-height: 1em;
+  position: relative;
+  border-radius: 50%;
+  margin-left: -6px;
+}
+.o-sig-meeting-aside .month-item .days .day-item .day-c .o-icon:first-child {
+  margin-left: 0;
+}
+.o-sig-meeting-aside .month-item .days .day-item .day-c .o-icon svg path {
+  fill: currentColor;
+}
+.o-sig-meeting-aside .arrow-wrapper {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  color: var(--o-color-primary1);
+  margin-top: var(--o-gap-3);
+}
+.o-sig-meeting-aside .arrow-wrapper .o-icon {
+  font-size: 24px;
+  cursor: pointer;
+}
+.o-sig-meeting-aside .arrow-wrapper .o-icon.disabled {
+  cursor: not-allowed;
+  color: var(--o-color-primary4);
+}
+.o-sig-meeting-aside .arrow-wrapper .o-icon:not(.disabled):hover {
+  color: var(--o-color-primary2);
+}
+@media (max-width: 840px) {
+.o-sig-meeting-aside .day-item {
+    width: min(128px, (100% - var(--o-gap-2)) / 2);
+}
+}