@yimou6/common-ui 1.13.12 → 1.13.13

package/lib/components/monitor-playback/src/monitor-playback.vue.d.ts

@@ -426,6 +426,9 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     retryCount: number;
     MAX_RETRY: number;
     currentUrl: import("vue").Ref<string, string>;
+    starttimeDefault: import("vue").ComputedRef<string>;
+    datetimeValue: import("vue").Ref<string, string>;
+    onDatetimeChange: (val: string) => void;
     playStartTimeMs: number;
     lastPtsMs: number;
     playTimerId: number | null;
@@ -440,6 +443,211 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     destroyPlayer: () => Promise<void>;
     onTimelineSeek: (sec: number) => void;
     startPlayTimer: () => void;
+    IDatePicker: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+        modelValue: {
+            type: import("vue").PropType<string | string[]>;
+            default: null;
+        };
+        placeholder: {
+            type: StringConstructor;
+            default: string;
+        };
+        startPlaceholder: {
+            type: StringConstructor;
+            default: string;
+        };
+        endPlaceholder: {
+            type: StringConstructor;
+            default: string;
+        };
+        disabled: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        clearable: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        size: {
+            type: StringConstructor;
+        };
+        type: {
+            type: StringConstructor;
+            default: string;
+        };
+        format: {
+            type: StringConstructor;
+            default: null;
+        };
+        valueFormat: {
+            type: StringConstructor;
+            default: null;
+        };
+        shortcuts: {
+            type: import("vue").PropType<import("../../date-picker/src/date-picker").Shortcuts[]>;
+            default: () => never[];
+        };
+        disabledDate: {
+            type: FunctionConstructor;
+            default: () => boolean;
+        };
+        rangeSeparator: {
+            type: StringConstructor;
+            default: string;
+        };
+    }>, {
+        MonthPicker: any;
+        QuarterPicker: any;
+        RangePicker: any;
+        WeekPicker: any;
+        YearPicker: any;
+        props: import("@vue/shared").LooseRequired<Readonly<import("vue").ExtractPropTypes<{
+            modelValue: {
+                type: import("vue").PropType<string | string[]>;
+                default: null;
+            };
+            placeholder: {
+                type: StringConstructor;
+                default: string;
+            };
+            startPlaceholder: {
+                type: StringConstructor;
+                default: string;
+            };
+            endPlaceholder: {
+                type: StringConstructor;
+                default: string;
+            };
+            disabled: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            clearable: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            size: {
+                type: StringConstructor;
+            };
+            type: {
+                type: StringConstructor;
+                default: string;
+            };
+            format: {
+                type: StringConstructor;
+                default: null;
+            };
+            valueFormat: {
+                type: StringConstructor;
+                default: null;
+            };
+            shortcuts: {
+                type: import("vue").PropType<import("../../date-picker/src/date-picker").Shortcuts[]>;
+                default: () => never[];
+            };
+            disabledDate: {
+                type: FunctionConstructor;
+                default: () => boolean;
+            };
+            rangeSeparator: {
+                type: StringConstructor;
+                default: string;
+            };
+        }>> & Readonly<{
+            "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
+            onChange?: ((...args: any[]) => any) | undefined;
+            onClear?: ((...args: any[]) => any) | undefined;
+            onSelect?: ((...args: any[]) => any) | undefined;
+        }> & {}>;
+        inputValue: import("vue").Ref<string | string[], string | string[]>;
+        emit: (event: "clear" | "update:modelValue" | "change" | "select", ...args: any[]) => void;
+        onChange: (value: any) => void;
+        onSelect: (value: any) => void;
+        realShortcuts: import("vue").ComputedRef<{
+            label: string | undefined;
+            value: any;
+        }[]>;
+        defaultProps: import("vue").ComputedRef<{
+            format: string;
+            valueFormat: string;
+            shortcuts: {
+                label: string | undefined;
+                value: any;
+            }[];
+        }>;
+        realPlaceholder: import("vue").ComputedRef<string | string[]>;
+        readonly DatePicker: any;
+    }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("clear" | "update:modelValue" | "change" | "select")[], "clear" | "update:modelValue" | "change" | "select", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+        modelValue: {
+            type: import("vue").PropType<string | string[]>;
+            default: null;
+        };
+        placeholder: {
+            type: StringConstructor;
+            default: string;
+        };
+        startPlaceholder: {
+            type: StringConstructor;
+            default: string;
+        };
+        endPlaceholder: {
+            type: StringConstructor;
+            default: string;
+        };
+        disabled: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        clearable: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        size: {
+            type: StringConstructor;
+        };
+        type: {
+            type: StringConstructor;
+            default: string;
+        };
+        format: {
+            type: StringConstructor;
+            default: null;
+        };
+        valueFormat: {
+            type: StringConstructor;
+            default: null;
+        };
+        shortcuts: {
+            type: import("vue").PropType<import("../../date-picker/src/date-picker").Shortcuts[]>;
+            default: () => never[];
+        };
+        disabledDate: {
+            type: FunctionConstructor;
+            default: () => boolean;
+        };
+        rangeSeparator: {
+            type: StringConstructor;
+            default: string;
+        };
+    }>> & Readonly<{
+        "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
+        onChange?: ((...args: any[]) => any) | undefined;
+        onClear?: ((...args: any[]) => any) | undefined;
+        onSelect?: ((...args: any[]) => any) | undefined;
+    }>, {
+        modelValue: string | string[];
+        format: string;
+        type: string;
+        disabled: boolean;
+        placeholder: string;
+        startPlaceholder: string;
+        endPlaceholder: string;
+        clearable: boolean;
+        valueFormat: string;
+        shortcuts: import("../../date-picker/src/date-picker").Shortcuts[];
+        disabledDate: Function;
+        rangeSeparator: string;
+    }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
     ITimelineRuler: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
         startTime: {
             type: DateConstructor;

package/lib/components/monitor-playback/src/monitor-playback.vue2.js

@@ -3,19 +3,22 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var vue = require('vue');
+require('../../date-picker/src/date-picker.vue.js');
 require('../timeline-ruler/src/timeline-ruler.vue.js');
 var monitorPlayback = require('./monitor-playback.js');
+var datePicker_vue_vue_type_script_setup_true_lang = require('../../date-picker/src/date-picker.vue2.js');
 var timelineRuler_vue_vue_type_script_setup_true_lang = require('../timeline-ruler/src/timeline-ruler.vue2.js');
 
 var __defProp = Object.defineProperty;
 var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
 const _hoisted_1 = { class: "replay-page" };
-const _hoisted_2 = { class: "player-wrap" };
-const _hoisted_3 = {
+const _hoisted_2 = { class: "replay-toolbar" };
+const _hoisted_3 = { class: "player-wrap" };
+const _hoisted_4 = {
   key: 0,
   class: "player-error"
 };
-const _hoisted_4 = { class: "player-error__text" };
+const _hoisted_5 = { class: "player-error__text" };
 const MAX_RETRY = 3;
 var _sfc_main = /* @__PURE__ */ vue.defineComponent({
   ...{
@@ -36,6 +39,31 @@ var _sfc_main = /* @__PURE__ */ vue.defineComponent({
     const currentUrl = vue.ref(
       props.url || "ws://cms.abaixun.com/websocket/0402b0580060f0df/0000000001.flv?starttime=20260502T150217&duration=3600&uuid=s1vwaoh0rse31rpgars33u1d68384buc"
     );
+    const starttimeDefault = vue.computed(() => {
+      const m = currentUrl.value.match(/starttime=(\d{8}T\d{6})/i);
+      if (m) {
+        const raw = m[1];
+        const y = raw.slice(0, 4);
+        const mo = raw.slice(4, 6);
+        const d = raw.slice(6, 8);
+        const h = raw.slice(9, 11);
+        const mi = raw.slice(11, 13);
+        const s = raw.slice(13, 15);
+        return `${y}-${mo}-${d} ${h}:${mi}:${s}`;
+      }
+      return "";
+    });
+    const datetimeValue = vue.ref(starttimeDefault.value);
+    function onDatetimeChange(val) {
+      if (!val) return;
+      const ts = val.replace(/[- :]/g, "").replace(/(\d{8})(\d{6})/, "$1T$2");
+      currentUrl.value = currentUrl.value.replace(
+        /starttime=\d{8}T\d{6}/i,
+        `starttime=${ts}`
+      );
+      commitWithTime(Math.floor(new Date(val.replace(" ", "T")).getTime() / 1e3));
+    }
+    __name(onDatetimeChange, "onDatetimeChange");
     let playStartTimeMs = 0;
     let lastPtsMs = 0;
     let playTimerId = null;
@@ -222,8 +250,25 @@ var _sfc_main = /* @__PURE__ */ vue.defineComponent({
     });
     return (_ctx, _cache) => {
       return vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
-        vue.createCommentVNode(" \u64AD\u653E\u5668 "),
+        vue.createCommentVNode(" \u65E5\u671F\u65F6\u95F4\u9009\u62E9\u5668 "),
         vue.createElementVNode("div", _hoisted_2, [
+          _cache[1] || (_cache[1] = vue.createElementVNode(
+            "span",
+            { class: "replay-toolbar__label" },
+            "\u56DE\u653E\u5F00\u59CB\u65F6\u95F4",
+            -1
+            /* CACHED */
+          )),
+          vue.createVNode(datePicker_vue_vue_type_script_setup_true_lang.default, {
+            modelValue: datetimeValue.value,
+            "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => datetimeValue.value = $event),
+            type: "datetime",
+            "value-format": "YYYY-MM-DD HH:mm:ss",
+            onChange: onDatetimeChange
+          }, null, 8, ["modelValue"])
+        ]),
+        vue.createCommentVNode(" \u64AD\u653E\u5668 "),
+        vue.createElementVNode("div", _hoisted_3, [
           vue.withDirectives(vue.createElementVNode(
             "div",
             {
@@ -237,8 +282,8 @@ var _sfc_main = /* @__PURE__ */ vue.defineComponent({
           ), [
             [vue.vShow, !errorMsg.value]
           ]),
-          errorMsg.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_3, [
-            _cache[0] || (_cache[0] = vue.createElementVNode(
+          errorMsg.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_4, [
+            _cache[2] || (_cache[2] = vue.createElementVNode(
               "div",
               { class: "player-error__icon" },
               "\u26A0",
@@ -247,7 +292,7 @@ var _sfc_main = /* @__PURE__ */ vue.defineComponent({
             )),
             vue.createElementVNode(
               "div",
-              _hoisted_4,
+              _hoisted_5,
               vue.toDisplayString(errorMsg.value),
               1
               /* TEXT */

package/lib/components/monitor-playback/src/monitor-playback.vue2.js.map

@@ -1 +1 @@
-{"version":3,"file":"monitor-playback.vue2.js","sources":["../../../../../../../packages/components/monitor-playback/src/monitor-playback.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { onBeforeUnmount, onMounted, ref } from \"vue\";\nimport ITimelineRuler from \"../timeline-ruler/src/timeline-ruler.vue\";\nimport { MonitorPlaybackProps } from \"./monitor-playback\";\n\ndefineOptions({\n  name: \"IMonitorPlayback\",\n});\n\n// ==================== Props / State ====================\nconst props = defineProps(MonitorPlaybackProps);\n\n// ==================== DOM Refs ====================\nconst playerContainerRef = ref<HTMLDivElement | null>(null);\nconst timelineRef = ref<InstanceType<typeof ITimelineRuler> | null>(null);\n\n// ==================== UI State ====================\nconst kbpsInfo = ref(\"-- KB/s\");\nconst overlayTimeText = ref(\"2026-05-02 15:02:17\");\nconst errorMsg = ref(\"\");\n\n// ==================== Player State ====================\nlet jessibuca: any = null;\nlet isDestroying = false;\nlet retryCount = 0;\nconst MAX_RETRY = 3;\nconst currentUrl = ref(\n  props.url ||\n    \"ws://cms.abaixun.com/websocket/0402b0580060f0df/0000000001.flv?starttime=20260502T150217&duration=3600&uuid=s1vwaoh0rse31rpgars33u1d68384buc\",\n);\n\n// 记录播放起始时间，用于结合 timeUpdate 计算当前播放进度\nlet playStartTimeMs = 0;\nlet lastPtsMs = 0;\n\n// Timer ref\nlet playTimerId: ReturnType<typeof setInterval> | null = null;\n\n// ==================== Utils ====================\nfunction pad(n: number) {\n  return String(n).padStart(2, \"0\");\n}\n\nfunction syncStartTimeToUrl(unixSec: number) {\n  const d = new Date(unixSec * 1000);\n  const val = `${\n    pad(d.getFullYear()) + pad(d.getMonth() + 1) + pad(d.getDate())\n  }T${pad(d.getHours())}${pad(d.getMinutes())}${pad(d.getSeconds())}`;\n  currentUrl.value = currentUrl.value.replace(\n    /starttime=\\d{8}T\\d{6}/i,\n    `starttime=${val}`,\n  );\n}\n\nfunction commitWithTime(sec: number) {\n  syncStartTimeToUrl(sec);\n  playStream(currentUrl.value);\n}\n\nfunction fmtTF(s: number) {\n  const d = new Date(s * 1000);\n  return `${pad(d.getHours())}:${pad(d.getMinutes())}:${pad(d.getSeconds())}`;\n}\n\nfunction fmtD(s: number) {\n  const d = new Date(s * 1000);\n  return `${d.getFullYear()}-${pad(d.getMonth() + 1)}-${pad(d.getDate())}`;\n}\n\n// ==================== Player Functions ====================\nfunction parseStartTime(url: string): Date | number | null {\n  const m = url.match(/starttime=(\\d{8}T\\d{6})/i);\n  if (m)\n    return new Date(\n      m[1].replace(\n        /^(\\d{4})(\\d{2})(\\d{2})T(\\d{2})(\\d{2})(\\d{2})/,\n        \"$1-$2-$3T$4:$5:$6\",\n      ),\n    );\n  const dm = url.match(/duration=(\\d+)/i);\n  if (dm) return parseInt(dm[1]);\n  return null;\n}\n\nasync function playStream(url: string) {\n  if (!url) return;\n\n  // 如果正在销毁，延迟等待后再执行\n  if (isDestroying) {\n    await new Promise<void>((r) => setTimeout(r, 600));\n    return playStream(url);\n  }\n\n  await destroyPlayer();\n  errorMsg.value = \"\";\n\n  const st = parseStartTime(url);\n  let dur = 3600;\n  const dm = url.match(/duration=(\\d+)/i);\n  if (dm) dur = parseInt(dm[1]);\n\n  // 记录播放起始时间\n  if (st instanceof Date) {\n    playStartTimeMs = st.getTime();\n  }\n\n  if (st && timelineRef.value) {\n    timelineRef.value.initRuler(st as Date, dur);\n  }\n\n  // 创建 Jessibuca 实例\n  createJessibuca(url);\n}\n\nfunction createJessibuca(url: string) {\n  const win = window as any;\n  if (!win.Jessibuca) {\n    errorMsg.value = \"Jessibuca 播放器未加载\";\n    return;\n  }\n\n  jessibuca = new win.Jessibuca({\n    container: playerContainerRef.value!,\n    decoder: \"./plugins/jessibuca/decoder.js\",\n    videoBuffer: 0.2,\n    isResize: false,\n    isFullResize: false,\n    hasAudio: true,\n    debug: props.debug,\n    supportDblclickFullscreen: true,\n    showBandwidth: true,\n    operateBtns: {\n      fullscreen: true,\n      screenshot: true,\n      play: true,\n      audio: true,\n      record: true,\n    },\n    // 优先使用 WASM 软解，支持 H.265\n    useMSE: false,\n    useWCS: false,\n    autoWasm: true,\n    isNotMute: false,\n    timeout: 10,\n    heartTimeout: 10,\n    loadingTimeout: 10,\n    heartTimeoutReplay: true,\n    heartTimeoutReplayTimes: MAX_RETRY,\n    loadingTimeoutReplay: true,\n    loadingTimeoutReplayTimes: MAX_RETRY,\n  });\n\n  // ---- 事件监听 ----\n  jessibuca.on(\"play\", () => {\n    retryCount = 0;\n  });\n\n  jessibuca.on(\"timeUpdate\", (ts: number) => {\n    // ts 是当前帧的 pts（毫秒）\n    lastPtsMs = ts;\n  });\n\n  jessibuca.on(\"kBps\", (kbps: number) => {\n    kbpsInfo.value = `${Math.round(kbps)}KB/s`;\n  });\n\n  jessibuca.on(\"videoInfo\", (info: any) => {\n    if (props.debug) {\n      console.log(\"[Jessibuca] videoInfo:\", info);\n    }\n  });\n\n  jessibuca.on(\"error\", (err: any) => {\n    console.error(\"[Jessibuca] error:\", err);\n    const errCode = err?.code || \"\";\n    const errMsg = String(err?.message || err || \"\");\n    if (\n      errCode === \"mediaSourceH265NotSupport\" ||\n      errCode === \"webcodecsH265NotSupport\" ||\n      errMsg.includes(\"H265\") ||\n      errMsg.includes(\"h265\") ||\n      errMsg.includes(\"HEVC\")\n    ) {\n      errorMsg.value =\n        \"当前浏览器不支持 H.265/HEVC 编码播放，请使用支持 HEVC 硬解的浏览器\";\n      destroyPlayer();\n    }\n  });\n\n  jessibuca.on(\"timeout\", () => {\n    if (retryCount < MAX_RETRY) {\n      retryCount++;\n      console.warn(`[Jessibuca] 超时，第 ${retryCount}/${MAX_RETRY} 次重试...`);\n      // Jessibuca 内置重连，此处仅记录\n    }\n  });\n\n  jessibuca.on(\"streamEnd\", () => {\n    if (props.debug) {\n      console.log(\"[Jessibuca] streamEnd: 流结束\");\n    }\n  });\n\n  // 开始播放\n  jessibuca.play(url);\n}\n\nasync function destroyPlayer() {\n  if (!jessibuca) return;\n  isDestroying = true;\n  try {\n    await jessibuca.destroy();\n  } catch (_e) {}\n  jessibuca = null;\n\n  // destroy 完成后再清理容器内残留 DOM，避免 removeChild 冲突\n  const container = playerContainerRef.value;\n  if (container) {\n    container.innerHTML = \"\";\n  }\n\n  // 等待 WebGL/Worker 资源释放\n  await new Promise<void>((r) => setTimeout(r, 200));\n  isDestroying = false;\n}\n\n/** 时间轴 seek 跳转 */\nfunction onTimelineSeek(sec: number) {\n  commitWithTime(sec);\n}\n\n// ==================== Lifecycle ====================\nonMounted(() => {\n  const win = window as any;\n  if (!win.Jessibuca) {\n    errorMsg.value =\n      \"Jessibuca 播放器未加载，请检查 HTML 是否引入了 jessibuca.js\";\n    return;\n  }\n  playStream(currentUrl.value);\n  startPlayTimer();\n});\n\n/** 定时同步播放进度到时间轴 */\nfunction startPlayTimer() {\n  playTimerId = setInterval(() => {\n    if (!jessibuca || !timelineRef.value) return;\n\n    // 使用 playStartTimeMs + lastPtsMs 计算当前播放时间\n    // 对于回放流，pts 通常是从0开始的偏移量\n    if (playStartTimeMs > 0 && lastPtsMs >= 0) {\n      const timeMs = playStartTimeMs + lastPtsMs;\n      timelineRef.value.updateRulerTime(timeMs);\n      timelineRef.value.autoFollow();\n\n      // 更新叠加时间\n      overlayTimeText.value = `${fmtD(timeMs / 1000)} ${fmtTF(timeMs / 1000)}`;\n    }\n  }, 250);\n}\n\nonBeforeUnmount(() => {\n  if (playTimerId) clearInterval(playTimerId);\n  destroyPlayer();\n});\n</script>\n\n<template>\n  <div class=\"replay-page\">\n    <!-- 播放器 -->\n    <div class=\"player-wrap\">\n      <div\n        v-show=\"!errorMsg\"\n        ref=\"playerContainerRef\"\n        class=\"jessibuca-container\"\n      />\n      <div v-if=\"errorMsg\" class=\"player-error\">\n        <div class=\"player-error__icon\">⚠</div>\n        <div class=\"player-error__text\">{{ errorMsg }}</div>\n      </div>\n    </div>\n\n    <!-- 刻度尺时间轴 -->\n    <ITimelineRuler ref=\"timelineRef\" @seek=\"onTimelineSeek\" />\n  </div>\n</template>\n"],"names":["ref","onMounted","onBeforeUnmount","_openBlock","_createElementBlock","_createCommentVNode","_createElementVNode","_toDisplayString","_createVNode","ITimelineRuler"],"mappings":"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"}
+{"version":3,"file":"monitor-playback.vue2.js","sources":["../../../../../../../packages/components/monitor-playback/src/monitor-playback.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, onBeforeUnmount, onMounted, ref } from \"vue\";\nimport IDatePicker from \"../../date-picker/src/date-picker.vue\";\nimport ITimelineRuler from \"../timeline-ruler/src/timeline-ruler.vue\";\nimport { MonitorPlaybackProps } from \"./monitor-playback\";\n\ndefineOptions({\n  name: \"IMonitorPlayback\",\n});\n\n// ==================== Props / State ====================\nconst props = defineProps(MonitorPlaybackProps);\n\n// ==================== DOM Refs ====================\nconst playerContainerRef = ref<HTMLDivElement | null>(null);\nconst timelineRef = ref<InstanceType<typeof ITimelineRuler> | null>(null);\n\n// ==================== UI State ====================\nconst kbpsInfo = ref(\"-- KB/s\");\nconst overlayTimeText = ref(\"2026-05-02 15:02:17\");\nconst errorMsg = ref(\"\");\n\n// ==================== Player State ====================\nlet jessibuca: any = null;\nlet isDestroying = false;\nlet retryCount = 0;\nconst MAX_RETRY = 3;\nconst currentUrl = ref(\n  props.url ||\n    \"ws://cms.abaixun.com/websocket/0402b0580060f0df/0000000001.flv?starttime=20260502T150217&duration=3600&uuid=s1vwaoh0rse31rpgars33u1d68384buc\",\n);\n\n// 日期时间选择器 - 从 currentUrl 的 starttime 解析初始值\nconst starttimeDefault = computed(() => {\n  const m = currentUrl.value.match(/starttime=(\\d{8}T\\d{6})/i);\n  if (m) {\n    const raw = m[1]; // 20260502T150217\n    const y = raw.slice(0, 4);\n    const mo = raw.slice(4, 6);\n    const d = raw.slice(6, 8);\n    const h = raw.slice(9, 11);\n    const mi = raw.slice(11, 13);\n    const s = raw.slice(13, 15);\n    return `${y}-${mo}-${d} ${h}:${mi}:${s}`; // 2026-05-02 15:02:17\n  }\n  return \"\";\n});\nconst datetimeValue = ref(starttimeDefault.value);\n\n// 日期时间变更 → 更新 URL 并重新播放\nfunction onDatetimeChange(val: string) {\n  if (!val) return;\n  // \"2026-05-02 15:02:17\" → \"20260502T150217\"\n  const ts = val.replace(/[- :]/g, \"\").replace(/(\\d{8})(\\d{6})/, \"$1T$2\");\n  currentUrl.value = currentUrl.value.replace(\n    /starttime=\\d{8}T\\d{6}/i,\n    `starttime=${ts}`,\n  );\n  commitWithTime(Math.floor(new Date(val.replace(\" \", \"T\")).getTime() / 1000));\n}\n\n// 记录播放起始时间，用于结合 timeUpdate 计算当前播放进度\nlet playStartTimeMs = 0;\nlet lastPtsMs = 0;\n\n// Timer ref\nlet playTimerId: ReturnType<typeof setInterval> | null = null;\n\n// ==================== Utils ====================\nfunction pad(n: number) {\n  return String(n).padStart(2, \"0\");\n}\n\nfunction syncStartTimeToUrl(unixSec: number) {\n  const d = new Date(unixSec * 1000);\n  const val = `${\n    pad(d.getFullYear()) + pad(d.getMonth() + 1) + pad(d.getDate())\n  }T${pad(d.getHours())}${pad(d.getMinutes())}${pad(d.getSeconds())}`;\n  currentUrl.value = currentUrl.value.replace(\n    /starttime=\\d{8}T\\d{6}/i,\n    `starttime=${val}`,\n  );\n}\n\nfunction commitWithTime(sec: number) {\n  syncStartTimeToUrl(sec);\n  playStream(currentUrl.value);\n}\n\nfunction fmtTF(s: number) {\n  const d = new Date(s * 1000);\n  return `${pad(d.getHours())}:${pad(d.getMinutes())}:${pad(d.getSeconds())}`;\n}\n\nfunction fmtD(s: number) {\n  const d = new Date(s * 1000);\n  return `${d.getFullYear()}-${pad(d.getMonth() + 1)}-${pad(d.getDate())}`;\n}\n\n// ==================== Player Functions ====================\nfunction parseStartTime(url: string): Date | number | null {\n  const m = url.match(/starttime=(\\d{8}T\\d{6})/i);\n  if (m)\n    return new Date(\n      m[1].replace(\n        /^(\\d{4})(\\d{2})(\\d{2})T(\\d{2})(\\d{2})(\\d{2})/,\n        \"$1-$2-$3T$4:$5:$6\",\n      ),\n    );\n  const dm = url.match(/duration=(\\d+)/i);\n  if (dm) return parseInt(dm[1]);\n  return null;\n}\n\nasync function playStream(url: string) {\n  if (!url) return;\n\n  // 如果正在销毁，延迟等待后再执行\n  if (isDestroying) {\n    await new Promise<void>((r) => setTimeout(r, 600));\n    return playStream(url);\n  }\n\n  await destroyPlayer();\n  errorMsg.value = \"\";\n\n  const st = parseStartTime(url);\n  let dur = 3600;\n  const dm = url.match(/duration=(\\d+)/i);\n  if (dm) dur = parseInt(dm[1]);\n\n  // 记录播放起始时间\n  if (st instanceof Date) {\n    playStartTimeMs = st.getTime();\n  }\n\n  if (st && timelineRef.value) {\n    timelineRef.value.initRuler(st as Date, dur);\n  }\n\n  // 创建 Jessibuca 实例\n  createJessibuca(url);\n}\n\nfunction createJessibuca(url: string) {\n  const win = window as any;\n  if (!win.Jessibuca) {\n    errorMsg.value = \"Jessibuca 播放器未加载\";\n    return;\n  }\n\n  jessibuca = new win.Jessibuca({\n    container: playerContainerRef.value!,\n    decoder: \"./plugins/jessibuca/decoder.js\",\n    videoBuffer: 0.2,\n    isResize: false,\n    isFullResize: false,\n    hasAudio: true,\n    debug: props.debug,\n    supportDblclickFullscreen: true,\n    showBandwidth: true,\n    operateBtns: {\n      fullscreen: true,\n      screenshot: true,\n      play: true,\n      audio: true,\n      record: true,\n    },\n    // 优先使用 WASM 软解，支持 H.265\n    useMSE: false,\n    useWCS: false,\n    autoWasm: true,\n    isNotMute: false,\n    timeout: 10,\n    heartTimeout: 10,\n    loadingTimeout: 10,\n    heartTimeoutReplay: true,\n    heartTimeoutReplayTimes: MAX_RETRY,\n    loadingTimeoutReplay: true,\n    loadingTimeoutReplayTimes: MAX_RETRY,\n  });\n\n  // ---- 事件监听 ----\n  jessibuca.on(\"play\", () => {\n    retryCount = 0;\n  });\n\n  jessibuca.on(\"timeUpdate\", (ts: number) => {\n    // ts 是当前帧的 pts（毫秒）\n    lastPtsMs = ts;\n  });\n\n  jessibuca.on(\"kBps\", (kbps: number) => {\n    kbpsInfo.value = `${Math.round(kbps)}KB/s`;\n  });\n\n  jessibuca.on(\"videoInfo\", (info: any) => {\n    if (props.debug) {\n      console.log(\"[Jessibuca] videoInfo:\", info);\n    }\n  });\n\n  jessibuca.on(\"error\", (err: any) => {\n    console.error(\"[Jessibuca] error:\", err);\n    const errCode = err?.code || \"\";\n    const errMsg = String(err?.message || err || \"\");\n    if (\n      errCode === \"mediaSourceH265NotSupport\" ||\n      errCode === \"webcodecsH265NotSupport\" ||\n      errMsg.includes(\"H265\") ||\n      errMsg.includes(\"h265\") ||\n      errMsg.includes(\"HEVC\")\n    ) {\n      errorMsg.value =\n        \"当前浏览器不支持 H.265/HEVC 编码播放，请使用支持 HEVC 硬解的浏览器\";\n      destroyPlayer();\n    }\n  });\n\n  jessibuca.on(\"timeout\", () => {\n    if (retryCount < MAX_RETRY) {\n      retryCount++;\n      console.warn(`[Jessibuca] 超时，第 ${retryCount}/${MAX_RETRY} 次重试...`);\n      // Jessibuca 内置重连，此处仅记录\n    }\n  });\n\n  jessibuca.on(\"streamEnd\", () => {\n    if (props.debug) {\n      console.log(\"[Jessibuca] streamEnd: 流结束\");\n    }\n  });\n\n  // 开始播放\n  jessibuca.play(url);\n}\n\nasync function destroyPlayer() {\n  if (!jessibuca) return;\n  isDestroying = true;\n  try {\n    await jessibuca.destroy();\n  } catch (_e) {}\n  jessibuca = null;\n\n  // destroy 完成后再清理容器内残留 DOM，避免 removeChild 冲突\n  const container = playerContainerRef.value;\n  if (container) {\n    container.innerHTML = \"\";\n  }\n\n  // 等待 WebGL/Worker 资源释放\n  await new Promise<void>((r) => setTimeout(r, 200));\n  isDestroying = false;\n}\n\n/** 时间轴 seek 跳转 */\nfunction onTimelineSeek(sec: number) {\n  commitWithTime(sec);\n}\n\n// ==================== Lifecycle ====================\nonMounted(() => {\n  const win = window as any;\n  if (!win.Jessibuca) {\n    errorMsg.value =\n      \"Jessibuca 播放器未加载，请检查 HTML 是否引入了 jessibuca.js\";\n    return;\n  }\n  playStream(currentUrl.value);\n  startPlayTimer();\n});\n\n/** 定时同步播放进度到时间轴 */\nfunction startPlayTimer() {\n  playTimerId = setInterval(() => {\n    if (!jessibuca || !timelineRef.value) return;\n\n    // 使用 playStartTimeMs + lastPtsMs 计算当前播放时间\n    // 对于回放流，pts 通常是从0开始的偏移量\n    if (playStartTimeMs > 0 && lastPtsMs >= 0) {\n      const timeMs = playStartTimeMs + lastPtsMs;\n      timelineRef.value.updateRulerTime(timeMs);\n      timelineRef.value.autoFollow();\n\n      // 更新叠加时间\n      overlayTimeText.value = `${fmtD(timeMs / 1000)} ${fmtTF(timeMs / 1000)}`;\n    }\n  }, 250);\n}\n\nonBeforeUnmount(() => {\n  if (playTimerId) clearInterval(playTimerId);\n  destroyPlayer();\n});\n</script>\n\n<template>\n  <div class=\"replay-page\">\n    <!-- 日期时间选择器 -->\n    <div class=\"replay-toolbar\">\n      <span class=\"replay-toolbar__label\">回放开始时间</span>\n      <IDatePicker\n        v-model=\"datetimeValue\"\n        type=\"datetime\"\n        value-format=\"YYYY-MM-DD HH:mm:ss\"\n        @change=\"onDatetimeChange\"\n      />\n    </div>\n\n    <!-- 播放器 -->\n    <div class=\"player-wrap\">\n      <div\n        v-show=\"!errorMsg\"\n        ref=\"playerContainerRef\"\n        class=\"jessibuca-container\"\n      />\n      <div v-if=\"errorMsg\" class=\"player-error\">\n        <div class=\"player-error__icon\">⚠</div>\n        <div class=\"player-error__text\">{{ errorMsg }}</div>\n      </div>\n    </div>\n\n    <!-- 刻度尺时间轴 -->\n    <ITimelineRuler ref=\"timelineRef\" @seek=\"onTimelineSeek\" />\n  </div>\n</template>\n\n<style scoped></style>\n"],"names":["ref","computed","onMounted","onBeforeUnmount","_openBlock","_createElementBlock","_createCommentVNode","_createElementVNode","_createVNode","IDatePicker","_toDisplayString","ITimelineRuler"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@yimou6/common-ui",
-  "version": "1.13.12",
+  "version": "1.13.13",
   "description": "Vue3 Component Library",
   "author": "yimou6",
   "license": "MIT",

package/theme-default/i-monitor-playback.css

@@ -1 +1 @@
-.i-monitor-playback,.replay-page{display:flex;flex-direction:column;width:100%;height:100%;background:#151c28;overflow:hidden;border-radius:8px;font-family:"Space Mono",-apple-system,"Microsoft YaHei",monospace;color:#ddd;-webkit-user-select:none;user-select:none}.i-monitor-playback .player-wrap,.replay-page .player-wrap{position:relative;flex:1;height:0;width:100%;overflow:hidden;background:#000;border-radius:6px 6px 4px 4px}.i-monitor-playback .player-wrap #player,.i-monitor-playback .player-wrap .jessibuca-container,.replay-page .player-wrap #player,.replay-page .player-wrap .jessibuca-container{width:100%;height:100%;display:block;object-fit:fill;background:#000}.i-monitor-playback .player-wrap .jessibuca-container :deep(canvas),.replay-page .player-wrap .jessibuca-container :deep(canvas){width:100%!important;height:100%!important}.i-monitor-playback .player-wrap .player-error,.replay-page .player-wrap .player-error{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;height:100%;background:#000;color:#8899b4;gap:12px}.i-monitor-playback .player-wrap .player-error__icon,.replay-page .player-wrap .player-error__icon{font-size:48px;opacity:.6}.i-monitor-playback .player-wrap .player-error__text,.replay-page .player-wrap .player-error__text{font-size:14px;text-align:center;line-height:1.6;padding:0 24px;max-width:480px}.i-monitor-playback .player-wrap .video-overlay,.replay-page .player-wrap .video-overlay{position:absolute;top:8px;left:10px;z-index:5;pointer-events:none}.i-monitor-playback .player-wrap .video-overlay .timestamp,.replay-page .player-wrap .video-overlay .timestamp{font-size:16px;font-weight:700;color:#fff;text-shadow:1px 1px 2px rgba(0,0,0,.8);letter-spacing:1px}.i-monitor-playback .player-wrap .video-overlay .location,.replay-page .player-wrap .video-overlay .location{position:absolute;bottom:34px;left:0;font-size:18px;color:#fff;font-weight:700;text-shadow:1px 1px 3px rgba(0,0,0,.9)}.i-monitor-playback .player-wrap .status-bar,.replay-page .player-wrap .status-bar{display:flex;justify-content:space-between;align-items:center;padding:2px 10px;background:linear-gradient(#222,#1a1d28);font-size:11px;color:#888}.i-monitor-playback .player-wrap .status-bar-right,.replay-page .player-wrap .status-bar-right{display:flex;gap:12px;align-items:center}.i-monitor-playback .player-wrap .status-bar-right span,.replay-page .player-wrap .status-bar-right span{cursor:pointer;opacity:.7;transition:opacity .15s}.i-monitor-playback .player-wrap .status-bar-right span:hover,.replay-page .player-wrap .status-bar-right span:hover{opacity:1}.i-monitor-playback .player-wrap .toolbar,.replay-page .player-wrap .toolbar{position:absolute;right:10px;bottom:10px;display:flex;gap:8px;z-index:10}.i-monitor-playback .player-wrap .toolbar .btn-fullscreen,.replay-page .player-wrap .toolbar .btn-fullscreen{width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:4px;background:rgba(0,0,0,.55);color:#fff;font-size:16px;cursor:pointer;transition:background .2s;-webkit-user-select:none;user-select:none}.i-monitor-playback .player-wrap .toolbar .btn-fullscreen:hover,.replay-page .player-wrap .toolbar .btn-fullscreen:hover{background:rgba(255,45,45,.7)}.i-monitor-playback .ruler-panel,.replay-page .ruler-panel{position:relative;width:100%;background:#111827;border-top:1px solid #252f42;border-radius:0 0 4px 4px;padding:4px 12px 8px;flex-shrink:0;overflow:hidden}.i-monitor-playback .ruler-panel .time-display,.replay-page .ruler-panel .time-display{display:flex;align-items:baseline;gap:10px;padding:2px 20px 4px 4px;text-align:center;border-bottom:1px solid #252f42;background:rgba(0,0,0,.15)}.i-monitor-playback .ruler-panel .time-display .time-big,.replay-page .ruler-panel .time-display .time-big{font-size:18px;font-weight:700;color:#e8ecf1;font-variant-numeric:tabular-nums;letter-spacing:.5px;line-height:1}.i-monitor-playback .ruler-panel .time-display .time-big .sep,.replay-page .ruler-panel .time-display .time-big .sep{color:#ff2d2d;margin:0 1px;font-weight:400;animation:blink-sep 1s step-end infinite}.i-monitor-playback .ruler-panel .time-display .time-date,.replay-page .ruler-panel .time-display .time-date{font-size:11px;color:#5a6a82;font-variant-numeric:tabular-nums;letter-spacing:.5px}.i-monitor-playback .ruler-panel .rec-track,.replay-page .ruler-panel .rec-track{position:relative;height:4px;margin:2px 0;background:rgba(46,125,255,.04)}.i-monitor-playback .ruler-panel .rec-track .rec-seg,.replay-page .ruler-panel .rec-track .rec-seg{position:absolute;top:0;height:100%;background:#3b82f6;border-radius:2px;border:1px solid #3b82f6}.i-monitor-playback .ruler-panel .ruler-area,.replay-page .ruler-panel .ruler-area{position:relative;background:#1a2030;border-bottom:1px solid #252f42;overflow:hidden;touch-action:none;-webkit-user-select:none;user-select:none}.i-monitor-playback .ruler-panel .ruler-area .ruler-canvas,.replay-page .ruler-panel .ruler-area .ruler-canvas{display:block;width:100%;cursor:grab}.i-monitor-playback .ruler-panel .ruler-area .ruler-canvas:active,.replay-page .ruler-panel .ruler-area .ruler-canvas:active{cursor:grabbing}.i-monitor-playback .ruler-panel .ruler-area .tip,.replay-page .ruler-panel .ruler-area .tip{position:absolute;top:4px;pointer-events:none;background:rgba(15,23,36,.92);border:1px solid #252f42;border-radius:4px;padding:3px 8px;font-size:11px;color:#8899b4;white-space:nowrap;opacity:0;transition:opacity .1s;z-index:10}.i-monitor-playback .ruler-panel .ruler-area .tip.show,.replay-page .ruler-panel .ruler-area .tip.show{opacity:1}.i-monitor-playback .ruler-panel .ruler-area .zoom-tag,.replay-page .ruler-panel .ruler-area .zoom-tag{position:absolute;right:8px;bottom:4px;font-size:9px;color:#5a6a82;opacity:.5;font-variant-numeric:tabular-nums;letter-spacing:.5px;z-index:5}.i-monitor-playback .speed-bar,.replay-page .speed-bar{display:flex;align-items:center;gap:4px;padding:4px 10px 4px 0}.i-monitor-playback .speed-bar .label,.replay-page .speed-bar .label{font-size:11px;color:#666;margin-right:2px}.i-monitor-playback .speed-bar button,.replay-page .speed-bar button{padding:2px 8px;font-size:11px;border-radius:3px;background:0 0;color:#888;border:none;cursor:pointer;font-family:"Space Mono",monospace;transition:all .15s}.i-monitor-playback .speed-bar button:hover,.replay-page .speed-bar button:hover{color:#ccc;background:rgba(255,255,255,.06)}.i-monitor-playback .speed-bar button.active,.replay-page .speed-bar button.active{background:#00c07f;color:#000;font-weight:600}@keyframes blink-sep{0%,100%{opacity:1}}
+.i-monitor-playback,.replay-page{display:flex;flex-direction:column;width:100%;height:100%;overflow:hidden;border-radius:8px;font-family:"Space Mono",-apple-system,"Microsoft YaHei",monospace;color:#ddd;-webkit-user-select:none;user-select:none}.i-monitor-playback .player-wrap,.replay-page .player-wrap{position:relative;flex:1;height:0;width:100%;overflow:hidden;background:#000;border-radius:6px 6px 4px 4px}.i-monitor-playback .player-wrap #player,.i-monitor-playback .player-wrap .jessibuca-container,.replay-page .player-wrap #player,.replay-page .player-wrap .jessibuca-container{width:100%;height:100%;display:block;object-fit:fill;background:#000}.i-monitor-playback .player-wrap .jessibuca-container :deep(canvas),.replay-page .player-wrap .jessibuca-container :deep(canvas){width:100%!important;height:100%!important}.i-monitor-playback .player-wrap .player-error,.replay-page .player-wrap .player-error{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;height:100%;background:#000;color:#8899b4;gap:12px}.i-monitor-playback .player-wrap .player-error__icon,.replay-page .player-wrap .player-error__icon{font-size:48px;opacity:.6}.i-monitor-playback .player-wrap .player-error__text,.replay-page .player-wrap .player-error__text{font-size:14px;text-align:center;line-height:1.6;padding:0 24px;max-width:480px}.i-monitor-playback .player-wrap .video-overlay,.replay-page .player-wrap .video-overlay{position:absolute;top:8px;left:10px;z-index:5;pointer-events:none}.i-monitor-playback .player-wrap .video-overlay .timestamp,.replay-page .player-wrap .video-overlay .timestamp{font-size:16px;font-weight:700;color:#fff;text-shadow:1px 1px 2px rgba(0,0,0,.8);letter-spacing:1px}.i-monitor-playback .player-wrap .video-overlay .location,.replay-page .player-wrap .video-overlay .location{position:absolute;bottom:34px;left:0;font-size:18px;color:#fff;font-weight:700;text-shadow:1px 1px 3px rgba(0,0,0,.9)}.i-monitor-playback .player-wrap .status-bar,.replay-page .player-wrap .status-bar{display:flex;justify-content:space-between;align-items:center;padding:2px 10px;background:linear-gradient(#222,#1a1d28);font-size:11px;color:#888}.i-monitor-playback .player-wrap .status-bar-right,.replay-page .player-wrap .status-bar-right{display:flex;gap:12px;align-items:center}.i-monitor-playback .player-wrap .status-bar-right span,.replay-page .player-wrap .status-bar-right span{cursor:pointer;opacity:.7;transition:opacity .15s}.i-monitor-playback .player-wrap .status-bar-right span:hover,.replay-page .player-wrap .status-bar-right span:hover{opacity:1}.i-monitor-playback .player-wrap .toolbar,.replay-page .player-wrap .toolbar{position:absolute;right:10px;bottom:10px;display:flex;gap:8px;z-index:10}.i-monitor-playback .player-wrap .toolbar .btn-fullscreen,.replay-page .player-wrap .toolbar .btn-fullscreen{width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:4px;background:rgba(0,0,0,.55);color:#fff;font-size:16px;cursor:pointer;transition:background .2s;-webkit-user-select:none;user-select:none}.i-monitor-playback .player-wrap .toolbar .btn-fullscreen:hover,.replay-page .player-wrap .toolbar .btn-fullscreen:hover{background:rgba(255,45,45,.7)}.i-monitor-playback .ruler-panel,.replay-page .ruler-panel{position:relative;width:100%;background:#111827;border-top:1px solid #252f42;border-radius:0 0 4px 4px;padding:4px 12px 8px;flex-shrink:0;overflow:hidden}.i-monitor-playback .ruler-panel .time-display,.replay-page .ruler-panel .time-display{display:flex;align-items:baseline;gap:10px;padding:2px 20px 4px 4px;text-align:center;border-bottom:1px solid #252f42;background:rgba(0,0,0,.15)}.i-monitor-playback .ruler-panel .time-display .time-big,.replay-page .ruler-panel .time-display .time-big{font-size:18px;font-weight:700;color:#e8ecf1;font-variant-numeric:tabular-nums;letter-spacing:.5px;line-height:1}.i-monitor-playback .ruler-panel .time-display .time-big .sep,.replay-page .ruler-panel .time-display .time-big .sep{color:#ff2d2d;margin:0 1px;font-weight:400;animation:blink-sep 1s step-end infinite}.i-monitor-playback .ruler-panel .time-display .time-date,.replay-page .ruler-panel .time-display .time-date{font-size:11px;color:#5a6a82;font-variant-numeric:tabular-nums;letter-spacing:.5px}.i-monitor-playback .ruler-panel .rec-track,.replay-page .ruler-panel .rec-track{position:relative;height:4px;margin:2px 0;background:rgba(46,125,255,.04)}.i-monitor-playback .ruler-panel .rec-track .rec-seg,.replay-page .ruler-panel .rec-track .rec-seg{position:absolute;top:0;height:100%;background:#3b82f6;border-radius:2px;border:1px solid #3b82f6}.i-monitor-playback .ruler-panel .ruler-area,.replay-page .ruler-panel .ruler-area{position:relative;background:#1a2030;border-bottom:1px solid #252f42;overflow:hidden;touch-action:none;-webkit-user-select:none;user-select:none}.i-monitor-playback .ruler-panel .ruler-area .ruler-canvas,.replay-page .ruler-panel .ruler-area .ruler-canvas{display:block;width:100%;cursor:grab}.i-monitor-playback .ruler-panel .ruler-area .ruler-canvas:active,.replay-page .ruler-panel .ruler-area .ruler-canvas:active{cursor:grabbing}.i-monitor-playback .ruler-panel .ruler-area .tip,.replay-page .ruler-panel .ruler-area .tip{position:absolute;top:4px;pointer-events:none;background:rgba(15,23,36,.92);border:1px solid #252f42;border-radius:4px;padding:3px 8px;font-size:11px;color:#8899b4;white-space:nowrap;opacity:0;transition:opacity .1s;z-index:10}.i-monitor-playback .ruler-panel .ruler-area .tip.show,.replay-page .ruler-panel .ruler-area .tip.show{opacity:1}.i-monitor-playback .ruler-panel .ruler-area .zoom-tag,.replay-page .ruler-panel .ruler-area .zoom-tag{position:absolute;right:8px;bottom:4px;font-size:9px;color:#5a6a82;opacity:.5;font-variant-numeric:tabular-nums;letter-spacing:.5px;z-index:5}.i-monitor-playback .speed-bar,.replay-page .speed-bar{display:flex;align-items:center;gap:4px;padding:4px 10px 4px 0}.i-monitor-playback .speed-bar .label,.replay-page .speed-bar .label{font-size:11px;color:#666;margin-right:2px}.i-monitor-playback .speed-bar button,.replay-page .speed-bar button{padding:2px 8px;font-size:11px;border-radius:3px;background:0 0;color:#888;border:none;cursor:pointer;font-family:"Space Mono",monospace;transition:all .15s}.i-monitor-playback .speed-bar button:hover,.replay-page .speed-bar button:hover{color:#ccc;background:rgba(255,255,255,.06)}.i-monitor-playback .speed-bar button.active,.replay-page .speed-bar button.active{background:#00c07f;color:#000;font-weight:600}.i-monitor-playback .replay-toolbar,.replay-page .replay-toolbar{display:flex;align-items:center;gap:8px;width:320px;color:#000;margin-bottom:10px}.i-monitor-playback .replay-toolbar__label,.replay-page .replay-toolbar__label{white-space:nowrap;flex-shrink:0}.i-monitor-playback .replay-toolbar :deep(.i-date-picker),.replay-page .replay-toolbar :deep(.i-date-picker){flex:1}@keyframes blink-sep{0%,100%{opacity:1}}