@yimou6/common-ui 1.13.12 → 1.13.13

package/es/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/es/components/monitor-playback/src/monitor-playback.vue2.mjs

@@ -1,17 +1,20 @@
-import { defineComponent, ref, onMounted, onBeforeUnmount, openBlock, createElementBlock, createCommentVNode, createElementVNode, withDirectives, vShow, toDisplayString, createVNode } from 'vue';
+import { defineComponent, ref, computed, onMounted, onBeforeUnmount, openBlock, createElementBlock, createCommentVNode, createElementVNode, createVNode, withDirectives, vShow, toDisplayString } from 'vue';
+import '../../date-picker/src/date-picker.vue.mjs';
 import '../timeline-ruler/src/timeline-ruler.vue.mjs';
 import { MonitorPlaybackProps } from './monitor-playback.mjs';
-import _sfc_main$1 from '../timeline-ruler/src/timeline-ruler.vue2.mjs';
+import _sfc_main$1 from '../../date-picker/src/date-picker.vue2.mjs';
+import _sfc_main$2 from '../timeline-ruler/src/timeline-ruler.vue2.mjs';
 
 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__ */ defineComponent({
   ...{
@@ -32,6 +35,31 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
     const currentUrl = ref(
       props.url || "ws://cms.abaixun.com/websocket/0402b0580060f0df/0000000001.flv?starttime=20260502T150217&duration=3600&uuid=s1vwaoh0rse31rpgars33u1d68384buc"
     );
+    const starttimeDefault = 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 = 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;
@@ -218,8 +246,25 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
     });
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", _hoisted_1, [
-        createCommentVNode(" \u64AD\u653E\u5668 "),
+        createCommentVNode(" \u65E5\u671F\u65F6\u95F4\u9009\u62E9\u5668 "),
         createElementVNode("div", _hoisted_2, [
+          _cache[1] || (_cache[1] = createElementVNode(
+            "span",
+            { class: "replay-toolbar__label" },
+            "\u56DE\u653E\u5F00\u59CB\u65F6\u95F4",
+            -1
+            /* CACHED */
+          )),
+          createVNode(_sfc_main$1, {
+            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"])
+        ]),
+        createCommentVNode(" \u64AD\u653E\u5668 "),
+        createElementVNode("div", _hoisted_3, [
           withDirectives(createElementVNode(
             "div",
             {
@@ -233,8 +278,8 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
           ), [
             [vShow, !errorMsg.value]
           ]),
-          errorMsg.value ? (openBlock(), createElementBlock("div", _hoisted_3, [
-            _cache[0] || (_cache[0] = createElementVNode(
+          errorMsg.value ? (openBlock(), createElementBlock("div", _hoisted_4, [
+            _cache[2] || (_cache[2] = createElementVNode(
               "div",
               { class: "player-error__icon" },
               "\u26A0",
@@ -243,7 +288,7 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
             )),
             createElementVNode(
               "div",
-              _hoisted_4,
+              _hoisted_5,
               toDisplayString(errorMsg.value),
               1
               /* TEXT */
@@ -252,7 +297,7 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
         ]),
         createCommentVNode(" \u523B\u5EA6\u5C3A\u65F6\u95F4\u8F74 "),
         createVNode(
-          _sfc_main$1,
+          _sfc_main$2,
           {
             ref_key: "timelineRef",
             ref: timelineRef,

package/es/components/monitor-playback/src/monitor-playback.vue2.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"monitor-playback.vue2.mjs","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":["_openBlock","_createElementBlock","_createCommentVNode","_createElementVNode","_toDisplayString","_createVNode","ITimelineRuler"],"mappings":"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"}
+{"version":3,"file":"monitor-playback.vue2.mjs","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":["_openBlock","_createElementBlock","_createCommentVNode","_createElementVNode","_createVNode","IDatePicker","_toDisplayString","ITimelineRuler"],"mappings":"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"}

package/lib/components/monitor-playback/index.d.ts

@@ -426,6 +426,9 @@ export declare const IMonitorPlayback: import("../../types").SFCWithInstall<impo
     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 @@ export declare const IMonitorPlayback: import("../../types").SFCWithInstall<impo
     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;