@opendesign-plus-test/components 0.0.1-rc.64 → 0.0.1-rc.66

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

@@ -0,0 +1,246 @@
+import { defineComponent as ne, ref as r, computed as le, watchEffect as se, onMounted as oe, onUnmounted as ie, openBlock as s, createElementBlock as d, createElementVNode as a, toDisplayString as l, createBlock as I, unref as u, withCtx as j, Fragment as R, renderList as $, createCommentVNode as g, createVNode as P, normalizeClass as ce, normalizeStyle as D, renderSlot as re } from "vue";
+import { transformSeconds as ue, speakerNum as de, transformTime as J } from "./utils.mjs";
+import { OSelect as me, OOption as ve, OTab as fe, OTabPane as pe, OScroller as ge } from "@opensig/opendesign";
+import he from "./components/OMeetingPlaybackSubtitles.vue.mjs";
+import './components/OMeetingPlaybackSubtitles.css';
+import './components/OMeetingPlaybackSubtitles2.css';
+import ke from "./components/OMeetingPlaybackVideo.vue.mjs";
+import './components/OMeetingPlaybackVideo.css';
+import { useI18n as be } from "../../i18n/index.mjs";
+import { PROGRESS_COLORS as ye } from "./config.mjs";
+const Te = { class: "o-meeting-playback" }, xe = { class: "video-header" }, Ie = { class: "video-title" }, je = { class: "video-content" }, we = { class: "info-wrapper" }, Oe = {
+  key: 0,
+  class: "base-info"
+}, Ne = { class: "info-item" }, _e = { class: "info-item" }, Ce = { class: "info-item" }, Se = { class: "info-item" }, Re = {
+  key: 1,
+  class: "subject-list"
+}, $e = { class: "subject-title" }, Pe = {
+  key: 0,
+  class: "subject-progress"
+}, De = ["data-start", "data-end"], Ue = /* @__PURE__ */ ne({
+  __name: "OMeetingPlayback",
+  props: {
+    dates: { default: () => [] },
+    detail: { default: () => ({}) },
+    data: { default: () => ({}) }
+  },
+  emits: ["change-date"],
+  setup(n, { emit: M }) {
+    const h = n, A = M, { t: m } = be(), w = r(null), G = (e) => {
+      w.value = e;
+    }, O = r(0), U = (e) => {
+      O.value = e;
+    }, N = r([]), z = async (e) => {
+      const o = await (await fetch(e)).json();
+      N.value = (o.segments || []).map((c) => {
+        const v = de(c.speaker);
+        return {
+          ...c,
+          contentHtml: c.content,
+          speakerIdx: v,
+          speakerLabel: `${m("meeting.speaker")}${v}`
+        };
+      });
+    }, _ = r([]), q = (e) => ye[e % 3], p = r(0), X = (e) => {
+      p.value = e;
+    }, L = r(), T = r(""), x = r([0, 0]);
+    function V(e, t) {
+      const o = t.getBoundingClientRect(), v = (e.clientX - o.left) / o.width;
+      return x.value[1] = `${t.offsetTop + t.parentElement.offsetTop}px`, x.value[0] = `${v * 100}%`, v * p.value;
+    }
+    const E = (e) => {
+      let t = e;
+      for (; t && t.className !== "subject-progress"; )
+        t = t.parentElement;
+      return t;
+    }, K = (e) => {
+      let t = E(e.target);
+      t && (T.value = ue(V(e, t)));
+    }, Q = () => {
+      T.value = "";
+    }, W = (e) => {
+      var o;
+      let t = E(e.target);
+      t && ((o = L.value) == null || o.changeTime(V(e, t)));
+    }, Y = async (e) => {
+      const o = await (await fetch(e)).json();
+      _.value = (o || []).map((c) => ({
+        ...c,
+        startTimeNumber: J(c.startTime),
+        endTimeNumber: J(c.endTime)
+      }));
+    }, k = r("info"), C = le(() => {
+      const e = [
+        {
+          label: m("meeting.baseInfo"),
+          value: "info"
+        }
+      ];
+      return _.value.length && e.push({
+        label: m("meeting.subject"),
+        value: "subject"
+      }), e;
+    }), Z = () => {
+      h.data && (h.data.textJson && z(h.data.textJson), h.data.topicJson && Y(h.data.topicJson));
+    };
+    se(() => {
+      Z();
+    });
+    const ee = (e) => {
+      A("change-date", e);
+    }, b = r(null), B = r("auto");
+    let y = null, S = null;
+    const F = () => {
+      b.value && (B.value = `${b.value.offsetHeight}px`);
+    }, te = () => {
+      cancelAnimationFrame(S), S = requestAnimationFrame(F);
+    };
+    return oe(() => {
+      b.value && (y = new ResizeObserver(te), y.observe(b.value), F());
+    }), ie(() => {
+      cancelAnimationFrame(S), y == null || y.disconnect();
+    }), (e, t) => {
+      var o, c, v, H;
+      return s(), d("div", Te, [
+        a("div", {
+          class: "left-card card-wrapper",
+          ref_key: "leftRef",
+          ref: b
+        }, [
+          a("div", xe, [
+            a("div", Ie, l((o = n.detail) == null ? void 0 : o.topic) + "(" + l((c = n.detail) == null ? void 0 : c.date) + ")", 1),
+            (v = n.dates) != null && v.length ? (s(), I(u(me), {
+              key: 0,
+              size: "large",
+              clearable: !1,
+              "model-value": (H = n.detail) == null ? void 0 : H.date,
+              placeholder: u(m)("meeting.selectDate"),
+              onChange: ee
+            }, {
+              default: j(() => [
+                (s(!0), d(R, null, $(n.dates, (i) => (s(), I(u(ve), {
+                  key: i,
+                  value: i,
+                  label: i
+                }, null, 8, ["value", "label"]))), 128))
+              ]),
+              _: 1
+            }, 8, ["model-value", "placeholder"])) : g("", !0)
+          ]),
+          a("div", je, [
+            n.data ? (s(), I(ke, {
+              key: 0,
+              ref_key: "playerRef",
+              ref: L,
+              src: n.data.video,
+              vtt: n.data.textVtt,
+              poster: n.data.poster,
+              captions: N.value,
+              onGetDuration: X,
+              instance: w.value,
+              onGetInstance: G,
+              trackIdx: O.value,
+              onSetTrackIdx: U
+            }, null, 8, ["src", "vtt", "poster", "captions", "instance", "trackIdx"])) : g("", !0)
+          ]),
+          a("div", we, [
+            P(u(fe), {
+              modelValue: k.value,
+              "onUpdate:modelValue": t[0] || (t[0] = (i) => k.value = i),
+              "max-show": 9999
+            }, {
+              default: j(() => [
+                (s(!0), d(R, null, $(C.value, (i) => (s(), I(u(pe), {
+                  key: i.value,
+                  value: i.value,
+                  label: i.label
+                }, null, 8, ["value", "label"]))), 128))
+              ]),
+              _: 1
+            }, 8, ["modelValue"]),
+            P(u(ge), {
+              class: ce(["tab-content", `tab-content-${k.value}`]),
+              "show-type": "hover"
+            }, {
+              default: j(() => {
+                var i;
+                return [
+                  k.value === C.value[0].value ? (s(), d("div", Oe, [
+                    a("div", Ne, [
+                      a("span", null, l(u(m)("meeting.item1")), 1),
+                      a("span", null, l(n.detail.sponsor), 1)
+                    ]),
+                    a("div", _e, [
+                      a("span", null, l(u(m)("meeting.item2")), 1),
+                      a("span", null, l(n.detail.groupName), 1)
+                    ]),
+                    a("div", Ce, [
+                      a("span", null, l(u(m)("meeting.item3")), 1),
+                      a("span", null, l(n.detail.date) + "  " + l(n.detail.start) + "~" + l(n.detail.end), 1)
+                    ]),
+                    a("div", Se, [
+                      a("span", null, l(u(m)("meeting.item4")), 1),
+                      a("span", null, l(n.detail.agenda || "-"), 1)
+                    ])
+                  ])) : g("", !0),
+                  k.value === ((i = C.value[1]) == null ? void 0 : i.value) ? (s(), d("div", Re, [
+                    T.value ? (s(), d("div", {
+                      key: 0,
+                      class: "mouse-current-time",
+                      style: D({
+                        top: x.value[1],
+                        left: x.value[0]
+                      })
+                    }, l(T.value), 5)) : g("", !0),
+                    (s(!0), d(R, null, $(_.value, (f, ae) => (s(), d("div", {
+                      class: "subject-item",
+                      key: f.title
+                    }, [
+                      a("div", $e, l(f.title), 1),
+                      p.value ? (s(), d("div", Pe, [
+                        a("div", {
+                          class: "subject-progress-item",
+                          onClick: W,
+                          onMousemove: K,
+                          onMouseleave: Q,
+                          "data-start": f.startTime,
+                          "data-end": f.endTime,
+                          style: D({
+                            "--start": (f.startTimeNumber < 0 ? 0 : f.startTimeNumber) / p.value,
+                            "--end": (f.endTimeNumber > p.value ? p.value : f.endTimeNumber) / p.value,
+                            background: q(ae)
+                          })
+                        }, null, 44, De)
+                      ])) : g("", !0)
+                    ]))), 128))
+                  ])) : g("", !0)
+                ];
+              }),
+              _: 1
+            }, 8, ["class"])
+          ])
+        ], 512),
+        a("div", {
+          class: "right-card card-wrapper",
+          style: D({
+            height: B.value
+          })
+        }, [
+          P(he, {
+            captions: N.value,
+            trackIdx: O.value,
+            instance: w.value
+          }, {
+            empty: j(() => [
+              re(e.$slots, "empty")
+            ]),
+            _: 3
+          }, 8, ["captions", "trackIdx", "instance"])
+        ], 4)
+      ]);
+    };
+  }
+});
+export {
+  Ue as default
+};

package/dist/esm/components/meeting/OMeetingPlayback.vue3.mjs

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

package/dist/esm/components/meeting/OMeetingSigCalendar.css

@@ -0,0 +1,423 @@
+.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);
+}
+}
+:root {
+  --el-color-primary: var(--o-color-primary1);
+  --el-border-color: var(--o-color-control1);
+  --el-input-placeholder-color: var(--el-text-color-placeholder);
+  --el-input-hover-border-color: var(--el-border-color-hover);
+  --el-input-clear-hover-color: var(--el-text-color-secondary);
+  --el-component-size-large: 36px;
+}
+@media (max-width: 840px) {
+:root {
+    --el-component-size-large: var(--o-control_size-l);
+}
+}
+:root .el-date-editor.el-date-editor--daterange {
+  padding: 0 13px 0 15px;
+}
+:root .el-date-editor.el-date-editor--timerange {
+  padding: 0 16px;
+}
+:root .el-date-editor input {
+  text-align: left;
+  font-size: 16px;
+  line-height: 24px;
+}
+@media (min-width: 1201px) and (max-width: 1680px) {
+:root .el-date-editor input {
+    font-size: 14px;
+    line-height: 22px;
+}
+}
+@media (min-width: 841px) and (max-width: 1200px) {
+:root .el-date-editor input {
+    font-size: 14px;
+    line-height: 22px;
+}
+}
+@media (min-width: 601px) and (max-width: 840px) {
+:root .el-date-editor input {
+    font-size: 14px;
+    line-height: 22px;
+}
+}
+@media (max-width: 600px) {
+:root .el-date-editor input {
+    font-size: 12px;
+    line-height: 18px;
+}
+}
+@media (max-width: 600px) {
+:root .el-date-editor input {
+    font-size: 18px;
+    line-height: 26px;
+}
+}
+@media (max-width: 600px) and (min-width: 1201px) and (max-width: 1680px) {
+:root .el-date-editor input {
+    font-size: 16px;
+    line-height: 24px;
+}
+}
+@media (max-width: 600px) and (min-width: 841px) and (max-width: 1200px) {
+:root .el-date-editor input {
+    font-size: 14px;
+    line-height: 22px;
+}
+}
+@media (max-width: 600px) and (min-width: 601px) and (max-width: 840px) {
+:root .el-date-editor input {
+    font-size: 14px;
+    line-height: 22px;
+}
+}
+@media (max-width: 600px) and (max-width: 600px) {
+:root .el-date-editor input {
+    font-size: 14px;
+    line-height: 22px;
+}
+}
+:root .el-date-editor .el-select__wrapper {
+  gap: 0;
+}
+:root .el-date-editor .el-input__wrapper .el-input__prefix {
+  order: 1;
+  font-size: 16px;
+}
+:root .el-date-editor .el-input__icon {
+  height: 100%;
+  order: 1;
+  font-size: 24px;
+  margin-right: 2px;
+  color: var(--o-color-info1);
+  background-color: var(--o-color-info2);
+  mask: url("data:image/svg+xml;charset=utf-8;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjI0IiBoZWlnaHQ9IjI0IiAgdmlld0JveD0iMCAwIDI0IDI0Ij4KICAgIDxwYXRoIGQ9Ik02LjQ2MyA0Ljk3NmEuNy43IDAgMCAxIC4wOTUgMS4zOTRsLS4wOTUuMDA2SDQuNDcxYS4xNC4xNCAwIDAgMC0uMTMuMDkzbC0uMDA3LjA0M3YxLjg1NmgxNS4zMjlsLjAwMS0xLjg1NmEuMTQuMTQgMCAwIDAtLjA5My0uMTNsLS4wNDMtLjAwN2gtMi4wNTVhLjcuNyAwIDAgMS0uMDk1LTEuMzk0bC4wOTUtLjAwNmgyLjA1NWMuODAxIDAgMS40Ni42MTQgMS41MyAxLjM5N2wuMDA2LjE0djEyLjM1OWMwIC44MDEtLjYxNCAxLjQ2LTEuMzk3IDEuNTNsLS4xNC4wMDZINC40N2MtLjgwMSAwLTEuNDYtLjYxNC0xLjUzLTEuMzk3bC0uMDA2LS4xNFY2LjUxMWMwLS44MDEuNjE0LTEuNDYgMS4zOTctMS41M2wuMTQtLjAwNnptMTMuMjAxIDQuNzkySDQuMzM1djkuMTAzYzAgLjA2LjAzOS4xMTEuMDkzLjEzbC4wNDMuMDA3aDE1LjA1N2MuMDYgMCAuMTExLS4wMzkuMTMtLjA5M2wuMDA3LS4wNDMtLjAwMS05LjEwM3ptLTMuNDgyIDUuNjYzYS43LjcgMCAwIDEgLjA5NSAxLjM5NGwtLjA5NS4wMDZINy44MTdhLjcuNyAwIDAgMS0uMDk1LTEuMzk0bC4wOTUtLjAwNnptMC0zLjM0NmEuNy43IDAgMCAxIC4wOTUgMS4zOTRsLS4wOTUuMDA2SDcuODE3YS43LjcgMCAwIDEtLjA5NS0xLjM5NGwuMDk1LS4wMDZ6bS0uNjk2LTguNDY3Yy4zNTQgMCAuNjQ3LjI2My42OTQuNjA1bC4wMDYuMDk1djIuODA0YS43LjcgMCAwIDEtMS4zOTQuMDk1bC0uMDA2LS4wOTVWNC4zMThhLjcuNyAwIDAgMSAuNy0uN20tNi45MzctLjAyNmMuMzU0IDAgLjY0Ny4yNjMuNjk0LjYwNWwuMDA2LjA5NXYyLjgwNGEuNy43IDAgMCAxLTEuMzk0LjA5NWwtLjAwNi0uMDk1VjQuMjkyYS43LjcgMCAwIDEgLjctLjdtNC45NDYgMS4zODRhLjcuNyAwIDAgMSAuMDk1IDEuMzk0bC0uMDk1LjAwNkgxMC41M2EuNy43IDAgMCAxLS4wOTUtMS4zOTRsLjA5NS0uMDA2eiI+PC9wYXRoPgo8L3N2Zz4=") no-repeat center;
+  background-size: 24px;
+  background-repeat: no-repeat;
+  background-position: center center;
+}
+:root .el-date-editor .el-input__icon svg {
+  display: none;
+}
+:root .el-popper .el-popper__arrow {
+  display: none;
+}
+:root .el-popper .el-picker-panel {
+  --cell-row-gap: 6px;
+  --cell-radius: var(--o-radius-xs);
+  color: var(--o-color-info1);
+}
+:root .el-popper .el-picker-panel .el-date-picker__header {
+  padding: 12px 24px;
+  height: 48px;
+  border-bottom: 1px solid var(--o-color-control4);
+}
+:root .el-popper .el-picker-panel .el-date-picker__header .el-date-picker__header-label {
+  font-weight: 500;
+}
+:root .el-popper .el-picker-panel .el-picker-panel__content .el-date-table th {
+  border-bottom: none;
+  height: 24px;
+  color: inherit;
+  padding: 0 0 var(--cell-row-gap);
+}
+:root .el-popper .el-picker-panel .el-picker-panel__content .el-date-table td {
+  padding: var(--cell-row-gap) 0px;
+}
+:root .el-popper .el-picker-panel .el-picker-panel__content .el-date-table td .el-date-table-cell {
+  padding: 0;
+  height: 24px;
+  line-height: 22px;
+  border: 1px solid transparent;
+  border-radius: var(--cell-radius);
+}
+:root .el-popper .el-picker-panel .el-picker-panel__content .el-date-table td:hover:not(.disabled) .el-date-table-cell {
+  border-color: var(--o-color-primary1);
+}
+:root .el-popper .el-picker-panel .el-picker-panel__content .el-date-table td.disabled .el-date-table-cell, :root .el-popper .el-picker-panel .el-picker-panel__content .el-date-table td.prev-month .el-date-table-cell, :root .el-popper .el-picker-panel .el-picker-panel__content .el-date-table td.next-month .el-date-table-cell {
+  background: none;
+  color: var(--o-color-info4);
+}
+:root .el-popper .el-picker-panel .el-picker-panel__content .el-date-table td.today .el-date-table-cell {
+  background: var(--o-color-control2-light);
+}
+:root .el-popper .el-picker-panel .el-picker-panel__content .el-date-table td.today .el-date-table-cell .el-date-table-cell__text {
+  font-weight: normal;
+  color: var(--o-color-info1);
+}
+:root .el-popper .el-picker-panel .el-picker-panel__content .el-date-table td.current .el-date-table-cell, :root .el-popper .el-picker-panel .el-picker-panel__content .el-date-table td.start-date .el-date-table-cell, :root .el-popper .el-picker-panel .el-picker-panel__content .el-date-table td.end-date .el-date-table-cell {
+  background: var(--o-color-primary1);
+}
+:root .el-popper .el-picker-panel .el-picker-panel__content .el-date-table td.current .el-date-table-cell .el-date-table-cell__text, :root .el-popper .el-picker-panel .el-picker-panel__content .el-date-table td.start-date .el-date-table-cell .el-date-table-cell__text, :root .el-popper .el-picker-panel .el-picker-panel__content .el-date-table td.end-date .el-date-table-cell .el-date-table-cell__text {
+  background: none;
+  color: #fff;
+}
+:root .el-popper .el-picker-panel .el-picker-panel__content .el-date-table td.in-range:not(:hover) .el-date-table-cell {
+  border-radius: 0;
+}
+:root .el-popper .el-picker-panel .el-picker-panel__content .el-date-table td.in-range:not(:hover).start-date .el-date-table-cell {
+  border-radius: var(--cell-radius) 0 0 var(--cell-radius);
+}
+:root .el-popper .el-picker-panel .el-picker-panel__content .el-date-table td.in-range:not(:hover).end-date .el-date-table-cell {
+  border-radius: 0 var(--cell-radius) var(--cell-radius) 0;
+}
+:root .el-input {
+  --el-border-color: var(--o-color-control1);
+  --el-input-border-color: var(--o-color-control1);
+  --el-input-hover-border-color: var(--o-color-primary2);
+  --el-input-focus-border-color: var(--o-color-primary3);
+}
+:root .el-table {
+  --el-table-border-color: var(--o-color-control4) ;
+}
+:root .el-input__wrapper {
+  background: var(--o-color-fill2);
+  box-shadow: none;
+  border: 1px solid var(--el-input-border-color);
+}
+:root .el-select__wrapper {
+  background: var(--o-color-fill2);
+}
+:root .el-calendar .el-calendar-table {
+  width: 100%;
+}
+:root .el-calendar .el-calendar-table th {
+  color: var(--o-color-info3);
+  font-weight: 400;
+  padding: 4px 0 16px 0;
+  text-align: center;
+}
+:root .el-calendar .el-calendar-table td.prev .date-calender, :root .el-calendar .el-calendar-table td.next .date-calender {
+  color: var(--o-color-info4);
+}
+:root .el-select .el-select__placeholder {
+  font-size: 16px;
+  line-height: 24px;
+}
+@media (min-width: 1201px) and (max-width: 1680px) {
+:root .el-select .el-select__placeholder {
+    font-size: 14px;
+    line-height: 22px;
+}
+}
+@media (min-width: 841px) and (max-width: 1200px) {
+:root .el-select .el-select__placeholder {
+    font-size: 14px;
+    line-height: 22px;
+}
+}
+@media (min-width: 601px) and (max-width: 840px) {
+:root .el-select .el-select__placeholder {
+    font-size: 14px;
+    line-height: 22px;
+}
+}
+@media (max-width: 600px) {
+:root .el-select .el-select__placeholder {
+    font-size: 12px;
+    line-height: 18px;
+}
+}
+@media (max-width: 600px) {
+:root .el-select .el-select__placeholder {
+    font-size: 18px;
+    line-height: 26px;
+}
+}
+@media (max-width: 600px) and (min-width: 1201px) and (max-width: 1680px) {
+:root .el-select .el-select__placeholder {
+    font-size: 16px;
+    line-height: 24px;
+}
+}
+@media (max-width: 600px) and (min-width: 841px) and (max-width: 1200px) {
+:root .el-select .el-select__placeholder {
+    font-size: 14px;
+    line-height: 22px;
+}
+}
+@media (max-width: 600px) and (min-width: 601px) and (max-width: 840px) {
+:root .el-select .el-select__placeholder {
+    font-size: 14px;
+    line-height: 22px;
+}
+}
+@media (max-width: 600px) and (max-width: 600px) {
+:root .el-select .el-select__placeholder {
+    font-size: 14px;
+    line-height: 22px;
+}
+}
+:root .el-input-number {
+  --el-component-size-large: 34px;
+}
+@media (max-width: 840px) {
+:root .el-input-number {
+    --el-component-size-large: calc(var(--o-control_size-l) - 2px);
+}
+}
+:root .el-input-number .el-input-number__decrease:hover ~ .el-input:not(.is-disabled) .el-input__wrapper,
+:root .el-input-number .el-input-number__increase:hover ~ .el-input:not(.is-disabled) .el-input__wrapper {
+  box-shadow: none;
+}
+:root .el-input-number.el-input-number--large {
+  line-height: var(--el-component-size-large);
+}
+.o-sig-meeting-calendar {
+  --meeting-card-radius: var(--o-radius-xs);
+  --meeting-input-radius: var(--o-radius-xs);
+  --meeting-cell-radius: var(--o-radius-xs);
+  width: 100%;
+  background-color: var(--o-color-fill2);
+  border-radius: var(--meeting-card-radius);
+  margin-top: var(--o-gap-5);
+}
+@media (max-width: 600px) {
+.o-sig-meeting-calendar .meeting-card-header {
+    padding: var(--o-gap-3) var(--o-gap-4) 0;
+}
+.o-sig-meeting-calendar .meeting-card-header .el-input {
+    flex-grow: 1;
+}
+.o-sig-meeting-calendar .meeting-divide {
+    width: calc(100% - 32px);
+}
+}
+.o-sig-meeting-calendar .date-select {
+  padding: var(--o-gap-4);
+}
+.o-sig-meeting-calendar .date-select .o-select {
+  width: 100%;
+}
+.o-sig-meeting-calendar .meeting-card-header {
+  font-weight: 500;
+  display: flex;
+  align-items: center;
+  padding: var(--o-gap-3) var(--o-gap-6) 0;
+  font-size: 16px;
+  line-height: 24px;
+}
+@media (min-width: 1201px) and (max-width: 1680px) {
+.o-sig-meeting-calendar .meeting-card-header {
+    font-size: 14px;
+    line-height: 22px;
+}
+}
+@media (min-width: 841px) and (max-width: 1200px) {
+.o-sig-meeting-calendar .meeting-card-header {
+    font-size: 14px;
+    line-height: 22px;
+}
+}
+@media (min-width: 601px) and (max-width: 840px) {
+.o-sig-meeting-calendar .meeting-card-header {
+    font-size: 14px;
+    line-height: 22px;
+}
+}
+@media (max-width: 600px) {
+.o-sig-meeting-calendar .meeting-card-header {
+    font-size: 12px;
+    line-height: 18px;
+}
+}
+@media (max-width: 1200px) {
+.o-sig-meeting-calendar .meeting-card-header {
+    padding: var(--o-gap-3) var(--o-gap-4) 0;
+}
+}
+@media (max-width: 840px) {
+.o-sig-meeting-calendar .meeting-card-header {
+    display: none;
+}
+}
+.o-sig-meeting-calendar .meeting-card-header .date-meeting {
+  max-width: var(--el-date-editor-width);
+  width: auto;
+}
+.o-sig-meeting-calendar .meeting-card-header .header-left {
+  width: 35%;
+  padding-bottom: var(--o-gap-3);
+  color: var(--o-color-info1);
+  font-size: 16px;
+  line-height: 24px;
+}
+@media (min-width: 1201px) and (max-width: 1680px) {
+.o-sig-meeting-calendar .meeting-card-header .header-left {
+    font-size: 14px;
+    line-height: 22px;
+}
+}
+@media (min-width: 841px) and (max-width: 1200px) {
+.o-sig-meeting-calendar .meeting-card-header .header-left {
+    font-size: 14px;
+    line-height: 22px;
+}
+}
+@media (min-width: 601px) and (max-width: 840px) {
+.o-sig-meeting-calendar .meeting-card-header .header-left {
+    font-size: 14px;
+    line-height: 22px;
+}
+}
+@media (max-width: 600px) {
+.o-sig-meeting-calendar .meeting-card-header .header-left {
+    font-size: 12px;
+    line-height: 18px;
+}
+}
+.o-sig-meeting-calendar .meeting-card-header .o-tab {
+  display: flex;
+  align-items: center;
+  flex-grow: 1;
+  justify-content: center;
+  position: relative;
+}
+.o-sig-meeting-calendar .meeting-card-header .o-tab .o-tab-nav {
+  padding-bottom: var(--o-gap-3);
+}
+.o-sig-meeting-calendar .meeting-card-header .o-tab .o-tab-nav svg path {
+  fill: currentColor;
+}
+.o-sig-meeting-calendar .el-input__prefix {
+  display: none;
+}
+.o-sig-meeting-calendar .tips {
+  margin-left: 10px;
+  cursor: pointer;
+  font-size: 16px;
+  color: var(--o-color-info1);
+  position: relative;
+  top: 2px;
+}
+.o-sig-meeting-calendar .tips path {
+  opacity: 1;
+}
+.o-sig-meeting-calendar .meeting-divider {
+  width: 100%;
+  --o-divider-gap: 0;
+}
+.o-sig-meeting-calendar .meeting-card-content {
+  display: flex;
+}
+.o-sig-meeting-calendar .content-divider {
+  height: 400px;
+  --o-divider-label-gap: 0;
+}
+.o-sig-meeting-calendar .list-content {
+  min-width: 0;
+  flex-grow: 1;
+  height: 360px;
+}
+@media (max-width: 840px) {
+.o-sig-meeting-calendar .list-content {
+    height: auto;
+}
+}