@das-fed/ui 7.1.0-dev.1 → 7.1.0-dev.3

package/packages/business-components/video-dialog/index.js

@@ -1,60 +1,60 @@
 import '@das-fed/ui/packages/business-components/video-dialog/style.css';
-import { getCurrentScope as ce, onScopeDispose as ue, getCurrentInstance as de, onMounted as J, nextTick as P, unref as l, ref as w, watch as R, defineComponent as O, useCssVars as pe, computed as U, createElementBlock as S, openBlock as p, normalizeClass as ve, renderSlot as ee, createCommentVNode as b, Fragment as x, renderList as fe, createBlock as N, withCtx as y, withModifiers as _, createVNode as v, createElementVNode as f, toDisplayString as V, toRefs as me } from "vue";
-import { withInstall as ye } from "@das-fed/utils/with-install/index";
-import { t as C, setI18nRule as Ce } from "@das-fed/web/packages/i18n/index";
-import { DasDialog as ge } from "@das-fed/ui/packages/components/dialog/index";
-import { DasTooltip as h } from "@das-fed/ui/packages/components/tooltip/index";
-import { DasIconFullscreen2 as ke } from "@das-fed/ui/packages/icons/fullscreen-2/index";
-import { DasAutoRegisterIcon as _e, DasIcon as $ } from "@das-fed/ui/packages/components/icon/index";
+import { getCurrentScope as ue, onScopeDispose as de, getCurrentInstance as ve, onMounted as te, nextTick as P, unref as l, ref as h, watch as F, defineComponent as D, useCssVars as pe, computed as T, createElementBlock as S, openBlock as p, normalizeClass as fe, renderSlot as oe, createCommentVNode as I, Fragment as H, renderList as me, createBlock as R, withCtx as k, withModifiers as _, createVNode as f, createElementVNode as m, toDisplayString as j, toRefs as Ce } from "vue";
+import { withInstall as ge } from "@das-fed/utils/with-install/index";
+import { t as y, setI18nRule as ke } from "@das-fed/web/packages/i18n/index";
+import { DasDialog as ye } from "@das-fed/ui/packages/components/dialog/index";
+import { DasTooltip as w } from "@das-fed/ui/packages/components/tooltip/index";
+import { DasIconFullscreen2 as _e } from "@das-fed/ui/packages/icons/fullscreen-2/index";
+import { DasAutoRegisterIcon as he, DasIcon as $ } from "@das-fed/ui/packages/components/icon/index";
 import { DasLivePlayer as we } from "@das-fed/ui/packages/components/live-player/index";
-import { DasSpin as he } from "@das-fed/ui/packages/components/spin/index";
-import { DasHlsPlayer as be } from "@das-fed/ui/packages/components/hls-player/index";
-import Ie from "dayjs";
-import { createService as te } from "@das-fed/utils/api-services/src/create-service";
-import { getProjectInfo as A, getToken as Ee } from "@das-fed/utils/common-info";
-var Q;
-const j = typeof window < "u", Ne = (t) => typeof t == "string", Fe = () => {
+import { DasSpin as be } from "@das-fed/ui/packages/components/spin/index";
+import { DasHlsPlayer as Ie } from "@das-fed/ui/packages/components/hls-player/index";
+import Ee from "dayjs";
+import { createService as M } from "@das-fed/utils/api-services/src/create-service";
+import { getProjectInfo as q, getToken as Re } from "@das-fed/utils/common-info";
+var G;
+const A = typeof window < "u", Ne = (t) => typeof t == "string", Fe = () => {
 };
-j && ((Q = window == null ? void 0 : window.navigator) != null && Q.userAgent) && /iP(ad|hone|od)/.test(window.navigator.userAgent);
-function oe(t) {
+A && ((G = window == null ? void 0 : window.navigator) != null && G.userAgent) && /iP(ad|hone|od)/.test(window.navigator.userAgent);
+function ne(t) {
   return typeof t == "function" ? t() : l(t);
 }
-function Re(t) {
+function Se(t) {
   return t;
 }
-function ne(t) {
-  return ce() ? (ue(t), !0) : !1;
+function le(t) {
+  return ue() ? (de(t), !0) : !1;
 }
-function Se(t, n = !0) {
-  de() ? J(t) : n ? t() : P(t);
+function Le(t, n = !0) {
+  ve() ? te(t) : n ? t() : P(t);
 }
-function le(t) {
+function ie(t) {
   var n;
-  const e = oe(t);
+  const e = ne(t);
   return (n = e == null ? void 0 : e.$el) != null ? n : e;
 }
-const ze = j ? window : void 0, De = j ? window.document : void 0;
-function Oe(...t) {
-  let n, e, i, r;
-  if (Ne(t[0]) || Array.isArray(t[0]) ? ([e, i, r] = t, n = ze) : [n, e, i, r] = t, !n)
+const Oe = A ? window : void 0, ze = A ? window.document : void 0;
+function De(...t) {
+  let n, e, i, a;
+  if (Ne(t[0]) || Array.isArray(t[0]) ? ([e, i, a] = t, n = Oe) : [n, e, i, a] = t, !n)
     return Fe;
   Array.isArray(e) || (e = [e]), Array.isArray(i) || (i = [i]);
-  const o = [], a = () => {
-    o.forEach((c) => c()), o.length = 0;
-  }, g = (c, d, k, I) => (c.addEventListener(d, k, I), () => c.removeEventListener(d, k, I)), s = R(() => [le(n), oe(r)], ([c, d]) => {
-    a(), c && o.push(...e.flatMap((k) => i.map((I) => g(c, k, I, d))));
-  }, { immediate: !0, flush: "post" }), m = () => {
-    s(), a();
+  const o = [], s = () => {
+    o.forEach((r) => r()), o.length = 0;
+  }, C = (r, d, g, b) => (r.addEventListener(d, g, b), () => r.removeEventListener(d, g, b)), c = F(() => [ie(n), ne(a)], ([r, d]) => {
+    s(), r && o.push(...e.flatMap((g) => i.map((b) => C(r, g, b, d))));
+  }, { immediate: !0, flush: "post" }), u = () => {
+    c(), s();
   };
-  return ne(m), m;
+  return le(u), u;
 }
-function Le(t, n = !1) {
-  const e = w(), i = () => e.value = !!t();
-  return i(), Se(i, n), e;
+function Ue(t, n = !1) {
+  const e = h(), i = () => e.value = !!t();
+  return i(), Le(i, n), e;
 }
-const q = typeof globalThis < "u" ? globalThis : typeof window < "u" ? window : typeof global < "u" ? global : typeof self < "u" ? self : {}, G = "__vueuse_ssr_handlers__";
-q[G] = q[G] || {};
-const W = [
+const W = typeof globalThis < "u" ? globalThis : typeof window < "u" ? window : typeof global < "u" ? global : typeof self < "u" ? self : {}, Y = "__vueuse_ssr_handlers__";
+W[Y] = W[Y] || {};
+const Z = [
   [
     "requestFullscreen",
     "exitFullscreen",
@@ -96,54 +96,54 @@ const W = [
     "MSFullscreenError"
   ]
 ];
-function ie(t, n = {}) {
-  const { document: e = De, autoExit: i = !1 } = n, r = t || (e == null ? void 0 : e.querySelector("html")), o = w(!1);
-  let a = W[0];
-  const g = Le(() => {
+function ae(t, n = {}) {
+  const { document: e = ze, autoExit: i = !1 } = n, a = t || (e == null ? void 0 : e.querySelector("html")), o = h(!1);
+  let s = Z[0];
+  const C = Ue(() => {
     if (e) {
-      for (const F of W)
-        if (F[1] in e)
-          return a = F, !0;
+      for (const N of Z)
+        if (N[1] in e)
+          return s = N, !0;
     } else
       return !1;
     return !1;
-  }), [s, m, c, , d] = a;
-  async function k() {
-    g.value && (e != null && e[c] && await e[m](), o.value = !1);
+  }), [c, u, r, , d] = s;
+  async function g() {
+    C.value && (e != null && e[r] && await e[u](), o.value = !1);
   }
-  async function I() {
-    if (!g.value)
+  async function b() {
+    if (!C.value)
       return;
-    await k();
-    const F = le(r);
-    F && (await F[s](), o.value = !0);
+    await g();
+    const N = ie(a);
+    N && (await N[c](), o.value = !0);
   }
   async function L() {
-    o.value ? await k() : await I();
+    o.value ? await g() : await b();
   }
-  return e && Oe(e, d, () => {
-    o.value = !!(e != null && e[c]);
-  }, !1), i && ne(k), {
-    isSupported: g,
+  return e && De(e, d, () => {
+    o.value = !!(e != null && e[r]);
+  }, !1), i && le(g), {
+    isSupported: C,
     isFullscreen: o,
-    enter: I,
-    exit: k,
+    enter: b,
+    exit: g,
     toggle: L
   };
 }
-var Y;
+var K;
 (function(t) {
   t.UP = "UP", t.RIGHT = "RIGHT", t.DOWN = "DOWN", t.LEFT = "LEFT", t.NONE = "NONE";
-})(Y || (Y = {}));
-var $e = Object.defineProperty, Z = Object.getOwnPropertySymbols, Pe = Object.prototype.hasOwnProperty, Ue = Object.prototype.propertyIsEnumerable, K = (t, n, e) => n in t ? $e(t, n, { enumerable: !0, configurable: !0, writable: !0, value: e }) : t[n] = e, xe = (t, n) => {
+})(K || (K = {}));
+var $e = Object.defineProperty, X = Object.getOwnPropertySymbols, Pe = Object.prototype.hasOwnProperty, Te = Object.prototype.propertyIsEnumerable, J = (t, n, e) => n in t ? $e(t, n, { enumerable: !0, configurable: !0, writable: !0, value: e }) : t[n] = e, xe = (t, n) => {
   for (var e in n || (n = {}))
-    Pe.call(n, e) && K(t, e, n[e]);
-  if (Z)
-    for (var e of Z(n))
-      Ue.call(n, e) && K(t, e, n[e]);
+    Pe.call(n, e) && J(t, e, n[e]);
+  if (X)
+    for (var e of X(n))
+      Te.call(n, e) && J(t, e, n[e]);
   return t;
 };
-const Te = {
+const He = {
   easeInSine: [0.12, 0, 0.39, 0],
   easeOutSine: [0.61, 1, 0.88, 1],
   easeInOutSine: [0.37, 0, 0.63, 1],
@@ -170,9 +170,9 @@ const Te = {
   easeInOutBack: [0.68, -0.6, 0.32, 1.6]
 };
 xe({
-  linear: Re
-}, Te);
-const Be = /* @__PURE__ */ O({
+  linear: Se
+}, He);
+const Be = /* @__PURE__ */ D({
   __name: "GridItem",
   props: {
     active: { type: Boolean },
@@ -180,38 +180,38 @@ const Be = /* @__PURE__ */ O({
   },
   emits: ["itemClick"],
   setup(t, { emit: n }) {
-    pe((c) => ({
-      "9b3a2c32": m.value
+    pe((r) => ({
+      "9b3a2c32": u.value
     }));
-    const e = t, i = n, r = w(), { toggle: o, isFullscreen: a } = ie(r), g = () => {
-      r.value != document.fullscreenElement && (a.value ? (a.value = !1, P(() => {
+    const e = t, i = n, a = h(), { toggle: o, isFullscreen: s } = ae(a), C = () => {
+      a.value != document.fullscreenElement && (s.value ? (s.value = !1, P(() => {
         o();
       })) : o());
-    }, s = () => {
+    }, c = () => {
       i("itemClick");
-    }, m = U(() => `calc(100% / ${Math.sqrt(e.gridNum)})`);
-    return (c, d) => (p(), S(
+    }, u = T(() => `calc(100% / ${Math.sqrt(e.gridNum)})`);
+    return (r, d) => (p(), S(
       "div",
       {
         ref_key: "containerRef",
-        ref: r,
-        class: ve(["wrapper", { "is-active": e.active }]),
-        onDblclick: d[0] || (d[0] = (k) => g()),
-        onClick: d[1] || (d[1] = (k) => s())
+        ref: a,
+        class: fe(["wrapper", { "is-active": e.active }]),
+        onDblclick: d[0] || (d[0] = (g) => C()),
+        onClick: d[1] || (d[1] = (g) => c())
       },
       [
-        ee(c.$slots, "default", {}, void 0, !0)
+        oe(r.$slots, "default", {}, void 0, !0)
       ],
       34
       /* CLASS, NEED_HYDRATION */
     ));
   }
-}), T = (t, n) => {
+}), B = (t, n) => {
   const e = t.__vccOpts || t;
-  for (const [i, r] of n)
-    e[i] = r;
+  for (const [i, a] of n)
+    e[i] = a;
   return e;
-}, He = /* @__PURE__ */ T(Be, [["__scopeId", "data-v-100b67ca"]]), Ve = { class: "layout-wrapper" }, je = /* @__PURE__ */ O({
+}, Ve = /* @__PURE__ */ B(Be, [["__scopeId", "data-v-100b67ca"]]), je = { class: "layout-wrapper" }, Me = /* @__PURE__ */ D({
   __name: "GridLayout",
   props: {
     gridNum: {},
@@ -220,24 +220,24 @@ const Be = /* @__PURE__ */ O({
   },
   emits: ["update:activeIndex"],
   setup(t, { emit: n }) {
-    const e = t, i = n, r = (o) => {
+    const e = t, i = n, a = (o) => {
       i("update:activeIndex", o);
     };
-    return (o, a) => (p(), S("div", Ve, [
-      b(' :active="index === activeIndex" '),
+    return (o, s) => (p(), S("div", je, [
+      I(' :active="index === activeIndex" '),
       (p(!0), S(
-        x,
+        H,
         null,
-        fe(e.gridNum, (g, s) => (p(), N(He, {
+        me(e.gridNum, (C, c) => (p(), R(Ve, {
           active: !1,
           "grid-num": e.gridNum,
-          onItemClick: (m) => r(s)
+          onItemClick: (u) => a(c)
         }, {
-          default: y(() => [
-            o.showFn(s) ? ee(o.$slots, "default", {
+          default: k(() => [
+            o.showFn(c) ? oe(o.$slots, "default", {
               key: 0,
-              index: s
-            }, void 0, !0) : b("v-if", !0)
+              index: c
+            }, void 0, !0) : I("v-if", !0)
           ]),
           _: 2
           /* DYNAMIC */
@@ -247,123 +247,123 @@ const Be = /* @__PURE__ */ O({
       ))
     ]));
   }
-}), Me = /* @__PURE__ */ T(je, [["__scopeId", "data-v-661e2289"]]), Ae = /* @__PURE__ */ O({
+}), Ae = /* @__PURE__ */ B(Me, [["__scopeId", "data-v-661e2289"]]), Qe = /* @__PURE__ */ D({
   __name: "DirectionControl",
   emits: ["change"],
   setup(t, { emit: n }) {
-    const e = n, i = (r) => {
-      e("change", r);
+    const e = n, i = (a) => {
+      e("change", a);
     };
-    return (r, o) => (p(), S(
+    return (a, o) => (p(), S(
       "div",
       {
         class: "direction-control",
-        onDblclick: o[9] || (o[9] = _((a) => a.stopPropagation(), ["stop"]))
+        onDblclick: o[9] || (o[9] = _((s) => s.stopPropagation(), ["stop"]))
       },
       [
-        v(l(h), {
-          content: l(C)("左上")
+        f(l(w), {
+          content: l(y)("左上")
         }, {
-          default: y(() => [
-            f("div", {
+          default: k(() => [
+            m("div", {
               class: "icon icon-top-left",
-              onClick: o[0] || (o[0] = _((a) => i("leftUp"), ["stop"]))
+              onClick: o[0] || (o[0] = _((s) => i("leftUp"), ["stop"]))
             })
           ]),
           _: 1
           /* STABLE */
         }, 8, ["content"]),
-        v(l(h), {
-          content: l(C)("上")
+        f(l(w), {
+          content: l(y)("上")
         }, {
-          default: y(() => [
-            f("div", {
+          default: k(() => [
+            m("div", {
               class: "icon icon-top",
-              onClick: o[1] || (o[1] = _((a) => i("up"), ["stop"]))
+              onClick: o[1] || (o[1] = _((s) => i("up"), ["stop"]))
             })
           ]),
           _: 1
           /* STABLE */
         }, 8, ["content"]),
-        v(l(h), {
-          content: l(C)("右上")
+        f(l(w), {
+          content: l(y)("右上")
         }, {
-          default: y(() => [
-            f("div", {
+          default: k(() => [
+            m("div", {
               class: "icon icon-top-right",
-              onClick: o[2] || (o[2] = _((a) => i("rightUp"), ["stop"]))
+              onClick: o[2] || (o[2] = _((s) => i("rightUp"), ["stop"]))
             })
           ]),
           _: 1
           /* STABLE */
         }, 8, ["content"]),
-        v(l(h), {
-          content: l(C)("左")
+        f(l(w), {
+          content: l(y)("左")
         }, {
-          default: y(() => [
-            f("div", {
+          default: k(() => [
+            m("div", {
               class: "icon icon-left",
-              onClick: o[3] || (o[3] = _((a) => i("left"), ["stop"]))
+              onClick: o[3] || (o[3] = _((s) => i("left"), ["stop"]))
             })
           ]),
           _: 1
           /* STABLE */
         }, 8, ["content"]),
-        v(l(h), {
-          content: l(C)("自动")
+        f(l(w), {
+          content: l(y)("自动")
         }, {
-          default: y(() => [
-            f("div", {
+          default: k(() => [
+            m("div", {
               class: "icon icon-auto",
-              onClick: o[4] || (o[4] = _((a) => i("auto"), ["stop"]))
+              onClick: o[4] || (o[4] = _((s) => i("auto"), ["stop"]))
             })
           ]),
           _: 1
           /* STABLE */
         }, 8, ["content"]),
-        v(l(h), {
-          content: l(C)("右")
+        f(l(w), {
+          content: l(y)("右")
         }, {
-          default: y(() => [
-            f("div", {
+          default: k(() => [
+            m("div", {
               class: "icon icon-right",
-              onClick: o[5] || (o[5] = _((a) => i("right"), ["stop"]))
+              onClick: o[5] || (o[5] = _((s) => i("right"), ["stop"]))
             })
           ]),
           _: 1
           /* STABLE */
         }, 8, ["content"]),
-        v(l(h), {
-          content: l(C)("左下")
+        f(l(w), {
+          content: l(y)("左下")
         }, {
-          default: y(() => [
-            f("div", {
+          default: k(() => [
+            m("div", {
               class: "icon icon-bottom-left",
-              onClick: o[6] || (o[6] = _((a) => i("leftDown"), ["stop"]))
+              onClick: o[6] || (o[6] = _((s) => i("leftDown"), ["stop"]))
             })
           ]),
           _: 1
           /* STABLE */
         }, 8, ["content"]),
-        v(l(h), {
-          content: l(C)("下")
+        f(l(w), {
+          content: l(y)("下")
         }, {
-          default: y(() => [
-            f("div", {
+          default: k(() => [
+            m("div", {
               class: "icon icon-bottom",
-              onClick: o[7] || (o[7] = _((a) => i("down"), ["stop"]))
+              onClick: o[7] || (o[7] = _((s) => i("down"), ["stop"]))
             })
           ]),
           _: 1
           /* STABLE */
         }, 8, ["content"]),
-        v(l(h), {
-          content: l(C)("右下")
+        f(l(w), {
+          content: l(y)("右下")
         }, {
-          default: y(() => [
-            f("div", {
+          default: k(() => [
+            m("div", {
               class: "icon icon-bottom-right",
-              onClick: o[8] || (o[8] = _((a) => i("rightDown"), ["stop"]))
+              onClick: o[8] || (o[8] = _((s) => i("rightDown"), ["stop"]))
             })
           ]),
           _: 1
@@ -374,10 +374,10 @@ const Be = /* @__PURE__ */ O({
       /* NEED_HYDRATION */
     ));
   }
-}), Qe = /* @__PURE__ */ T(Ae, [["__scopeId", "data-v-db2e8ec2"]]), qe = { class: "video-wrapper" }, Ge = { class: "video-top" }, We = { class: "video-top_l" }, Ye = { class: "video-title-wrapper" }, Ze = { class: "video-title" }, Ke = { class: "video-top_r" }, Xe = {
+}), qe = /* @__PURE__ */ B(Qe, [["__scopeId", "data-v-db2e8ec2"]]), Ge = { class: "video-wrapper" }, We = { class: "video-top" }, Ye = { class: "video-top_l" }, Ze = { class: "video-title-wrapper" }, Ke = { class: "video-title" }, Xe = { class: "video-top_r" }, Je = {
   key: 0,
   class: "play-status"
-}, Je = { class: "video-bottom" }, et = { class: "video-bottom_r" }, tt = /* @__PURE__ */ O({
+}, et = { class: "video-bottom" }, tt = { class: "video-bottom_r" }, ot = /* @__PURE__ */ D({
   __name: "index",
   props: {
     videoUrl: {},
@@ -391,252 +391,254 @@ const Be = /* @__PURE__ */ O({
     isHls: { type: Boolean, default: !1 },
     onReplay: {}
   },
-  emits: ["close", "directionControl", "zoomControl"],
+  emits: ["close", "directionControl", "zoomControl", "handleClick"],
   setup(t, { emit: n }) {
     const e = t, i = n;
-    _e({
+    he({
       muted: import("@das-fed/ui/packages/icons/muted"),
       volume: import("@das-fed/ui/packages/icons/volume"),
       shrink: import("@das-fed/ui/packages/icons/shrink"),
       enlarge: import("@das-fed/ui/packages/icons/enlarge"),
-      "direction-control": import("@das-fed/ui/packages/icons/direction-control")
+      "direction-control": import("@das-fed/ui/packages/icons/direction-control"),
+      screenshot: import("@das-fed/ui/packages/icons/screenshot")
     });
-    const r = w(!0), o = w(), a = w(!1), g = w(), s = U(() => {
-      var u;
-      return (u = g.value) == null ? void 0 : u.video;
-    }), m = w(!1), c = w(!0), d = (u) => {
-      o.value = u, !e.isHls && o.value.on(window.mpegts.Events.ERROR, (E) => {
+    const a = h(!0), o = h(), s = h(!1), C = h(), c = T(() => {
+      var v;
+      return (v = C.value) == null ? void 0 : v.video;
+    }), u = h(!1), r = h(!0), d = (v) => {
+      o.value = v, !e.isHls && o.value.on(window.mpegts.Events.ERROR, (E) => {
       });
-    }, k = () => {
-      r.value = !r.value, o.value && (o.value.muted = r.value);
-    }, I = () => {
-      a.value = !a.value;
-    }, L = w(""), F = () => {
-      const u = document.createElement("canvas");
-      if (s.value) {
-        u.width = s.value.clientWidth, u.height = s.value.clientHeight;
-        const E = u.getContext("2d");
-        E == null || E.drawImage(s.value, 0, 0, u.width, u.height);
-        const D = u.toDataURL("image/jpg"), ae = `【${e.title}】${Ie().format("YYYYMMDDHHmmss").toString()}.jpg`;
-        if (L.value = D, "download" in document.createElement("a")) {
-          const z = document.createElement("a");
-          z.download = ae, z.style.display = "none", z.href = D, document.body.appendChild(z), document.body.appendChild(u), z.click(), URL.revokeObjectURL(z.href), document.body.removeChild(z), document.body.removeChild(u);
+    }, g = () => {
+      a.value = !a.value, i("handleClick", a.value ? "MUTE" : "UNMUTE"), o.value && (o.value.muted = a.value);
+    }, b = () => {
+      s.value = !s.value;
+    }, L = h(""), N = () => {
+      const v = document.createElement("canvas");
+      if (i("handleClick", "SCREENSHOT"), c.value) {
+        v.width = c.value.clientWidth, v.height = c.value.clientHeight;
+        const E = v.getContext("2d");
+        E == null || E.drawImage(c.value, 0, 0, v.width, v.height);
+        const z = v.toDataURL("image/jpg"), ce = `【${e.title}】${Ee().format("YYYYMMDDHHmmss").toString()}.jpg`;
+        if (L.value = z, "download" in document.createElement("a")) {
+          const O = document.createElement("a");
+          O.download = ce, O.style.display = "none", O.href = z, document.body.appendChild(O), document.body.appendChild(v), O.click(), URL.revokeObjectURL(O.href), document.body.removeChild(O), document.body.removeChild(v);
         }
       }
-    }, B = (u) => {
-      i("directionControl", u);
-    }, M = (u) => {
-      i("zoomControl", u);
-    }, H = (u) => e.authType.includes(u);
-    return R(
-      () => s.value,
+    }, V = (v) => {
+      i("directionControl", v);
+    }, x = (v) => {
+      i("zoomControl", v);
+    }, U = (v) => e.authType.includes(v);
+    return F(
+      () => c.value,
       () => {
-        s.value && s.value.addEventListener("ended", () => {
-          m.value = !0, e.type === "playback" && (c.value = !1);
+        c.value && c.value.addEventListener("ended", () => {
+          u.value = !0, e.type === "playback" && (r.value = !1);
         });
       }
-    ), R(
-      () => s.value,
+    ), F(
+      () => c.value,
       () => {
-        s.value && P(() => {
-          s.value.playbackRate = e.playbackRate || 1;
+        c.value && P(() => {
+          c.value.playbackRate = e.playbackRate || 1;
         });
       }
-    ), R(
+    ), F(
       () => o.value,
       () => {
         o.value && P(() => {
-          o.value.muted = r.value;
+          o.value.muted = a.value;
         });
       }
-    ), R(
+    ), F(
       () => e.playbackRate,
       () => {
-        s.value && (s.value.playbackRate = e.playbackRate || 1);
+        c.value && (c.value.playbackRate = e.playbackRate || 1);
       },
       {
         immediate: !0
       }
-    ), R(
+    ), F(
       () => e.paused,
       () => {
         o.value && (e.paused ? o.value.pause() : o.value.play());
       }
-    ), R(
+    ), F(
       () => e.videoUrl,
       () => {
-        c.value = !1, P(() => {
-          c.value = !0;
+        r.value = !1, P(() => {
+          r.value = !0;
         });
       }
-    ), (u, E) => (p(), S("div", qe, [
-      v(l(he), {
+    ), (v, E) => (p(), S("div", Ge, [
+      f(l(be), {
         spinning: e.loading,
         type: "component",
-        tip: l(C)("加载中...")
+        tip: l(y)("加载中...")
       }, {
-        default: y(() => [
-          f("div", Ge, [
-            f("div", We, [
-              f("div", Ye, [
-                f(
+        default: k(() => [
+          m("div", We, [
+            m("div", Ye, [
+              m("div", Ze, [
+                m(
                   "div",
-                  Ze,
-                  V(e.title.length > 20 ? e.title.slice(0, 19) + "..." : e.title),
+                  Ke,
+                  j(e.title.length > 20 ? e.title.slice(0, 19) + "..." : e.title),
                   1
                   /* TEXT */
                 )
               ])
             ]),
-            f("div", Ke, [
-              ["live"].includes(u.type) ? (p(), S(
+            m("div", Xe, [
+              ["live"].includes(v.type) ? (p(), S(
                 "span",
-                Xe,
-                V(l(C)("正在实时预览")),
+                Je,
+                j(l(y)("正在实时预览")),
                 1
                 /* TEXT */
-              )) : b("v-if", !0),
-              b(' <das-icon v-if="isFullscreen" class="icon close-icon" icon="close" @click.stop="handleClose"></das-icon> ')
+              )) : I("v-if", !0),
+              I(' <das-icon v-if="isFullscreen" class="icon close-icon" icon="close" @click.stop="handleClose"></das-icon> ')
             ])
           ]),
-          u.isHls ? (p(), S(
-            x,
+          v.isHls ? (p(), S(
+            H,
             { key: 1 },
             [
-              e.videoUrl && c.value ? (p(), N(l(be), {
+              e.videoUrl && r.value ? (p(), R(l(Ie), {
                 key: 0,
                 ref_key: "dasLivePlayerRef",
-                ref: g,
-                muted: r.value,
+                ref: C,
+                muted: a.value,
                 onLoaded: d,
                 src: e.videoUrl
-              }, null, 8, ["muted", "src"])) : b("v-if", !0)
+              }, null, 8, ["muted", "src"])) : I("v-if", !0)
             ],
             64
             /* STABLE_FRAGMENT */
           )) : (p(), S(
-            x,
+            H,
             { key: 0 },
             [
-              e.videoUrl && c.value ? (p(), N(l(we), {
+              e.videoUrl && r.value ? (p(), R(l(we), {
                 key: 0,
                 type: "flv",
                 ref_key: "dasLivePlayerRef",
-                ref: g,
-                muted: r.value,
+                ref: C,
+                muted: a.value,
                 onLoaded: d,
                 src: e.videoUrl
-              }, null, 8, ["muted", "src"])) : b("v-if", !0)
+              }, null, 8, ["muted", "src"])) : I("v-if", !0)
             ],
             64
             /* STABLE_FRAGMENT */
           )),
-          f("div", Je, [
-            E[3] || (E[3] = f(
+          m("div", et, [
+            E[3] || (E[3] = m(
               "div",
               { class: "video-bottom_l" },
               null,
               -1
               /* CACHED */
             )),
-            f("div", et, [
-              f(
+            m("div", tt, [
+              m(
                 "div",
                 {
                   class: "controls",
-                  onDblclick: E[2] || (E[2] = _((D) => D.stopPropagation(), ["stop"]))
+                  onDblclick: E[2] || (E[2] = _((z) => z.stopPropagation(), ["stop"]))
                 },
                 [
-                  v(l(h), {
-                    content: l(C)("声音")
+                  f(l(w), {
+                    content: l(y)("声音")
                   }, {
-                    default: y(() => [
-                      v(l($), {
+                    default: k(() => [
+                      f(l($), {
                         class: "icon icon-volume",
-                        icon: r.value ? "muted" : "volume",
-                        onClick: _(k, ["stop"])
+                        icon: a.value ? "muted" : "volume",
+                        onClick: _(g, ["stop"])
                       }, null, 8, ["icon"])
                     ]),
                     _: 1
                     /* STABLE */
                   }, 8, ["content"]),
-                  v(l(h), {
-                    content: l(C)("截图")
+                  f(l(w), {
+                    content: l(y)("截图")
                   }, {
-                    default: y(() => [
-                      v(l($), {
+                    default: k(() => [
+                      f(l($), {
                         class: "icon icon-screenshot",
                         icon: "screenshot",
-                        onClick: _(F, ["stop"])
+                        onClick: _(N, ["stop"])
                       })
                     ]),
                     _: 1
                     /* STABLE */
                   }, 8, ["content"]),
-                  H("control") ? (p(), N(l(h), {
+                  U("control") ? (p(), R(l(w), {
                     key: 0,
-                    content: l(C)("聚焦-")
+                    content: l(y)("聚焦-")
                   }, {
-                    default: y(() => [
-                      ["live", "polling"].includes(e.type) ? (p(), N(l($), {
+                    default: k(() => [
+                      ["live", "polling"].includes(e.type) ? (p(), R(l($), {
                         key: 0,
                         class: "icon icon-shrink",
                         icon: "shrink",
-                        onClick: E[0] || (E[0] = _((D) => M("zoomOut"), ["stop"]))
-                      })) : b("v-if", !0)
+                        onClick: E[0] || (E[0] = _((z) => x("zoomOut"), ["stop"]))
+                      })) : I("v-if", !0)
                     ]),
                     _: 1
                     /* STABLE */
-                  }, 8, ["content"])) : b("v-if", !0),
-                  H("control") ? (p(), N(l(h), {
+                  }, 8, ["content"])) : I("v-if", !0),
+                  U("control") ? (p(), R(l(w), {
                     key: 1,
-                    content: l(C)("聚焦+")
+                    content: l(y)("聚焦+")
                   }, {
-                    default: y(() => [
-                      ["live", "polling"].includes(e.type) ? (p(), N(l($), {
+                    default: k(() => [
+                      ["live", "polling"].includes(e.type) ? (p(), R(l($), {
                         key: 0,
                         class: "icon icon-enlarge",
                         icon: "enlarge",
-                        onClick: E[1] || (E[1] = _((D) => M("zoomIn"), ["stop"]))
-                      })) : b("v-if", !0)
+                        onClick: E[1] || (E[1] = _((z) => x("zoomIn"), ["stop"]))
+                      })) : I("v-if", !0)
                     ]),
                     _: 1
                     /* STABLE */
-                  }, 8, ["content"])) : b("v-if", !0),
-                  H("control") ? (p(), N(l(h), {
+                  }, 8, ["content"])) : I("v-if", !0),
+                  U("control") ? (p(), R(l(w), {
                     key: 2,
-                    content: l(C)("方向控制")
+                    content: l(y)("方向控制")
                   }, {
-                    default: y(() => [
-                      ["live", "polling"].includes(e.type) ? (p(), N(l($), {
+                    default: k(() => [
+                      ["live", "polling"].includes(e.type) ? (p(), R(l($), {
                         key: 0,
                         class: "icon icon-direction-control",
                         icon: "direction-control",
-                        onClick: _(I, ["stop"])
-                      })) : b("v-if", !0)
+                        onClick: _(b, ["stop"])
+                      })) : I("v-if", !0)
                     ]),
                     _: 1
                     /* STABLE */
-                  }, 8, ["content"])) : b("v-if", !0)
+                  }, 8, ["content"])) : I("v-if", !0)
                 ],
                 32
                 /* NEED_HYDRATION */
               )
             ])
           ]),
-          a.value ? (p(), N(Qe, {
+          s.value ? (p(), R(qe, {
             key: 2,
-            onChange: B
-          })) : b("v-if", !0)
+            onChange: V
+          })) : I("v-if", !0)
         ]),
         _: 1
         /* STABLE */
       }, 8, ["spinning", "tip"])
     ]));
   }
-}), ot = /* @__PURE__ */ T(tt, [["__scopeId", "data-v-12f30393"]]), nt = "/api/device-relation/deviceproject/v1/project/device/video", lt = "v1", it = te(`/api/enterpriseright/permission/${lt}`), se = te(`${nt}`, st);
-function st(t) {
-  const n = A() ? A().id : 1;
+}), nt = /* @__PURE__ */ B(ot, [["__scopeId", "data-v-4db322a4"]]), lt = "/api/device-relation/deviceproject/v1/project/device/video", it = "v1", at = M(`/api/enterpriseright/permission/${it}`);
+let Q = M(`${lt}`, se);
+function se(t) {
+  const n = q() ? q().id : 1;
   return t.params || (t.params = {}), t.params.project = n, t.params.projectId = n, t;
 }
 function re(t) {
@@ -645,19 +647,24 @@ function re(t) {
     n.append(e, i);
   return n.toString();
 }
-function X(t) {
-  return se.post(`/ptz?${re(t)}`)().run();
+function ee(t) {
+  return Q.post(`/ptz?${re(t)}`)().run();
 }
+function st(t) {
+  return Q.post(`/url/preview?${re(t)}`)().run();
+}
+at.post("data/device-auth");
 function rt(t) {
-  return se.post(`/url/preview?${re(t)}`)().run();
+  return new Promise((n) => {
+    Q = M(t, se), n("");
+  });
 }
-it.post("data/device-auth");
-const at = (t) => {
-  const n = Ee();
+const ct = (t) => {
+  const n = Re();
   return `${t}?token=${n}`;
 };
-w([]);
-const ct = /* @__PURE__ */ O({
+h([]);
+const ut = /* @__PURE__ */ D({
   props: {
     deviceInfo: {
       type: Object,
@@ -669,6 +676,9 @@ const ct = /* @__PURE__ */ O({
     isHls: {
       type: Boolean,
       default: !1
+    },
+    baseURL: {
+      type: String
     }
   },
   setup(t, {
@@ -677,95 +687,101 @@ const ct = /* @__PURE__ */ O({
     const {
       deviceInfo: e,
       source: i,
-      isHls: r
-    } = me(t), o = w(!1), a = w(""), g = async () => {
-      var k;
-      if (!((k = e.value) != null && k.deviceId)) return;
-      o.value = !0;
-      const [c, d] = await rt({
+      isHls: a,
+      baseURL: o
+    } = Ce(t), s = h(!1), C = h(""), c = async () => {
+      var b;
+      if (!((b = e.value) != null && b.deviceId)) return;
+      s.value = !0;
+      const [d, g] = await st({
         productId: e.value.productId,
         deviceId: e.value.deviceId,
         source: i.value
       });
-      if (!c) {
-        let I = r.value ? "httpHlsStreamURL" : "wsFlvStreamURL";
-        a.value = at(d == null ? void 0 : d[I]);
+      if (!d) {
+        let L = a.value ? "httpHlsStreamURL" : "wsFlvStreamURL";
+        C.value = ct(g == null ? void 0 : g[L]);
       }
-      o.value = !1;
-    }, s = (c) => {
-      X({
+      s.value = !1;
+    }, u = (d) => {
+      ee({
         productId: e.value.productId,
         deviceId: e.value.deviceId,
-        direction: c,
+        direction: d,
         zoom: "",
         source: i.value || "web"
       });
-    }, m = (c) => {
-      X({
+    }, r = (d) => {
+      ee({
         productId: e.value.productId,
         deviceId: e.value.deviceId,
         direction: "",
-        zoom: c,
+        zoom: d,
         source: i.value || "web"
       });
     };
-    return J(() => {
-      g();
-    }), R(() => e.value, () => {
-      g();
+    return te(async () => {
+      o.value && await rt(o.value), c();
+    }), F(() => e.value, () => {
+      c();
     }, {
       deep: !0
-    }), () => v(x, null, [n.default({
-      videoUrl: a.value,
-      loading: o.value,
-      onDirectionControl: s,
-      onZoomControl: m,
-      isHls: r.value
+    }), () => f(H, null, [n.default({
+      videoUrl: C.value,
+      loading: s.value,
+      onDirectionControl: u,
+      onZoomControl: r,
+      isHls: a.value
     })]);
   }
 });
-function ut(t) {
-  const n = w(0), e = w(), {
+function dt(t) {
+  const n = h(0), e = h(), {
     toggle: i,
-    isFullscreen: r,
+    isFullscreen: a,
     exit: o
-  } = ie(e), a = (s, m) => {
-    r.value && o();
+  } = ae(e), s = (u, r) => {
+    a.value && o();
+  }, C = (u) => {
+    var r;
+    (r = t == null ? void 0 : t.handleClick) == null || r.call(t, u);
   };
   return {
-    render: () => v(Me, {
+    render: () => f(Ae, {
       ref: e,
       gridNum: t.gridNum,
       activeIndex: n.value,
-      "onUpdate:activeIndex": (s) => n.value = s,
-      showFn: (s) => !!t.deviceList[s]
+      "onUpdate:activeIndex": (u) => n.value = u,
+      showFn: (u) => !!t.deviceList[u]
     }, {
       default: ({
-        index: s
+        index: u
       }) => {
-        const m = t.deviceList[s], c = t.source, d = t.isHls;
-        return v(ct, {
-          deviceInfo: m,
-          source: c,
-          isHls: d
+        const r = t.deviceList[u], d = t.source, g = t.isHls, b = t.baseURL;
+        return f(ut, {
+          deviceInfo: r,
+          baseURL: b,
+          source: d,
+          isHls: g
         }, {
           default: ({
-            videoUrl: k,
-            onDirectionControl: I,
-            onZoomControl: L,
-            loading: F,
-            isHls: B
-          }) => v(ot, {
+            videoUrl: L,
+            onDirectionControl: N,
+            onZoomControl: V,
+            loading: x,
+            isHls: U
+          }) => f(nt, {
             type: "live",
-            loading: F,
-            isFullscreen: r.value,
-            videoUrl: k,
-            title: m.deviceName,
-            onClose: () => a(),
-            onDirectionControl: I,
-            onZoomControl: L,
-            authType: m.authType === 2 ? ["control"] : [],
-            isHls: B
+            loading: x,
+            isFullscreen: a.value,
+            videoUrl: L,
+            title: r.deviceName,
+            onClose: () => s(),
+            onDirectionControl: N,
+            onZoomControl: V,
+            onHandleClick: C,
+            authType: r.authType === 2 ? ["control"] : [],
+            isHls: U
           }, null)
         });
       }
@@ -773,73 +789,76 @@ function ut(t) {
     toggleFullscreen: i
   };
 }
-const dt = /* @__PURE__ */ O({
+const vt = /* @__PURE__ */ D({
   __name: "index",
   props: {
     visible: { type: Boolean, default: !1 },
     deviceList: { default: () => [] },
     gridNum: { default: 4 },
     source: {},
-    isHls: { type: Boolean, default: !1 }
+    isHls: { type: Boolean, default: !1 },
+    dialogTitle: { default: "" },
+    baseURL: { default: "" },
+    handleClick: {}
   },
   emits: ["update:visible"],
   setup(t, { emit: n }) {
-    const e = t, i = n, r = U({
+    const e = t, i = T(() => e.dialogTitle || y("视频监控")), a = n, o = T({
       get: () => e.visible,
-      set: (s) => i("update:visible", s)
-    }), { render: o, toggleFullscreen: a } = ut(e), g = U(() => {
-      let s = {};
+      set: (u) => a("update:visible", u)
+    }), { render: s, toggleFullscreen: C } = dt(e), c = T(() => {
+      let u = {};
       switch (e.gridNum) {
         case 1:
-          s = "one-video";
+          u = "one-video";
           break;
         case 4:
-          s = "four-video";
+          u = "four-video";
           break;
         case 9:
-          s = "nine-video";
+          u = "nine-video";
           break;
       }
-      return s;
+      return u;
     });
-    return (s, m) => (p(), N(l(ge), {
+    return (u, r) => (p(), R(l(ye), {
       size: "mini",
-      title: l(C)("视频监控"),
-      "custom-class": `das-linakge-video-dialog ${g.value}`,
-      modelValue: r.value,
-      "onUpdate:modelValue": m[0] || (m[0] = (c) => r.value = c),
+      title: i.value,
+      "custom-class": `das-linakge-video-dialog ${c.value}`,
+      modelValue: o.value,
+      "onUpdate:modelValue": r[0] || (r[0] = (d) => o.value = d),
       bodyStyle: { padding: 0 },
       "close-on-click-modal": !1,
       "close-on-press-escape": !1,
       modal: !1,
       "header-style": { display: "flex", justifyContent: "space-between", alignItems: "center" }
     }, {
-      header: y(() => [
-        f("div", null, [
-          f(
+      header: k(() => [
+        m("div", null, [
+          m(
             "span",
             null,
-            V(l(C)("视频监控")),
+            j(i.value),
             1
             /* TEXT */
           )
         ]),
-        v(l(h), {
-          content: l(C)("页面全屏")
+        f(l(w), {
+          content: l(y)("页面全屏")
         }, {
-          default: y(() => [
-            v(l(ke), {
+          default: k(() => [
+            f(l(_e), {
               class: "icon",
               color: "#999",
-              onClick: l(a)
+              onClick: l(C)
             }, null, 8, ["onClick"])
           ]),
           _: 1
           /* STABLE */
         }, 8, ["content"])
       ]),
-      default: y(() => [
-        r.value ? (p(), N(l(o), { key: 0 })) : b("v-if", !0)
+      default: k(() => [
+        o.value ? (p(), R(l(s), { key: 0 })) : I("v-if", !0)
       ]),
       _: 1
       /* STABLE */
@@ -867,10 +886,10 @@ const dt = /* @__PURE__ */ O({
   "聚焦-": { "zh-CN": "聚焦-", en: "Focus-", _appCode: "framework" },
   "聚焦+": { "zh-CN": "聚焦+", en: "Focus+", _appCode: "framework" }
 };
-Ce(pt);
-const Nt = ye(dt), Ft = () => w(null);
+ke(pt);
+const Nt = ge(vt), Ft = () => h(null);
 export {
   Nt as DasVideoDialog,
   Ft as DasVideoDialogRef,
-  ut as useVideo
+  dt as useVideo
 };