import { defineComponent as lo, useCssVars as So, computed as J, watch as x, nextTick as oo, ref as r, onMounted as Co, onBeforeUnmount as ko, resolveComponent as A, createElementBlock as s, openBlock as l, createElementVNode as i, createCommentVNode as y, normalizeClass as z, Fragment as E, renderList as L, normalizeStyle as Oo, toDisplayString as N, createVNode as V, createTextVNode as wo, withDirectives as eo, vModelText as Io, createBlock as Eo, withCtx as to, withModifiers as H, vShow as Lo, pushScopeId as No, popScopeId as Vo } from "vue";
import { ElMessage as $o } from "element-plus";
import Mo from "./video-surveillance/video-common.vue.mjs";
import "../../text-text-basic/index.mjs";
import "../../text-table-basic/index.mjs";
import "../../chart-other-gauge/index.mjs";
import "../../chart-other-gauge-stage/index.mjs";
import "../../chart-other-gauge-grade/index.mjs";
import "../../chart-other-word-cloud/index.mjs";
import "../../chart-other-liquidfill/index.mjs";
import "../../chart-other-funnel/index.mjs";
import "../../chart-other-force/index.mjs";
import "../../chart-other-radar/index.mjs";
import "../../chart-other-funnel-split/index.mjs";
import "../../chart-other-funnel-contrast/index.mjs";
import "../../chart-other-candlestick-basic/index.mjs";
import "../../chart-other-candlestick-shanghai/index.mjs";
import "../../chart-other-candlestick-demo/index.mjs";
import "../../chart-other-heatmap/index.mjs";
import "../../chart-other-force2/index.mjs";
import "../../chart-other-graph-basic/index.mjs";
import "../../chart-other-graph-basic2/index.mjs";
import "../../chart-other-graph-calendar/index.mjs";
import "../../chart-other-tree-line/index.mjs";
import "../../chart-other-treemap-basic/index.mjs";
import "../../chart-other-sunburst-basic/index.mjs";
import "../../chart-other-sunburst-basic2/index.mjs";
import "../../chart-other-sunburst-basic3/index.mjs";
import "../../chart-other-sunburst-basic4/index.mjs";
import "../../chart-other-sunburst-book/index.mjs";
import "../../chart-other-sunburst-radius/index.mjs";
import "../../chart-other-sunburst-flavors/index.mjs";
import "../../chart-other-parallel-basic/index.mjs";
import "../../chart-other-parallel-mul/index.mjs";
import "../../chart-other-circular-graph/index.mjs";
import "../../map-earth-basic/index.mjs";
import "../../map-earth-cool-tech/index.mjs";
import "../../map-earth-particle/index.mjs";
import "../../map-earth-hacker/index.mjs";
import "../../map-earth-fly-line/index.mjs";
import "../../chart-other-grid-percentage/index.mjs";
import "../../chart-other-radar-stack/index.mjs";
import "../../chart-other-funnel2/index.mjs";
import "../../chart-other-label-gauge/index.mjs";
import "../../chart-other-theme-river/index.mjs";
import "../../chart-other-tree/index.mjs";
import "../../chart-other-treemap/index.mjs";
import "../../commons-product-model/index.mjs";
import "../../commons-vr-photo/index.mjs";
import "../../commons-vr-video/index.mjs";
import "../../commons-three-loader/index.mjs";
import "../../commons-three-loader3/index.mjs";
import "../../commons-loop-iterator/index.mjs";
import "../../commons-gaussian-splatting-view/index.mjs";
import "../../commons-babylon/index.mjs";
import "../../commons-svg/index.mjs";
import "../../commons-weather/index.mjs";
import "../../commons-weather-dynamic/index.mjs";
import "../../media-wavesurfer/index.mjs";
import "../../interaction-tabs/index.mjs";
import "../../interaction-tabs2/index.mjs";
import "../../interaction-button/index.mjs";
import "../../interaction-button-image/index.mjs";
import "../../interaction-select/index.mjs";
import "../../interaction-input/index.mjs";
import "../../interaction-radio/index.mjs";
import "../../interaction-slider/index.mjs";
import "../../interaction-switch/index.mjs";
import "../../interaction-data-picker/index.mjs";
import "../../interaction-button-refresh/index.mjs";
import "../../media-image/index.mjs";
import "../../text-title/index.mjs";
import "../../commons-qrcode/index.mjs";
import "../../media-video/index.mjs";
import "../../media-audio/index.mjs";
import "../../text-real-time/index.mjs";
import "../../media-carousel/index.mjs";
import "../../media-carousel-slides/index.mjs";
import "../../media-iframe-carousel/index.mjs";
import "../../media-iframe/index.mjs";
import "../../media-m3u8/index.mjs";
import "../../media-m3u8-dynamic/index.mjs";
import "../../media-audio-dynamic/index.mjs";
import "../../media-video-dynamic/index.mjs";
import "../../media-image-dynamic/index.mjs";
import "../../media-iframe-dynamic/index.mjs";
import "../../media-flv/index.mjs";
import "../../commons-echarts/index.mjs";
import "../../text-over-number/index.mjs";
import "../../text-table-scroll/index.mjs";
import "../../text-carousel/index.mjs";
import "../../text-row-scroll/index.mjs";
import "../../text-text-dynamic/index.mjs";
import "../../text-count-down/index.mjs";
import "../../graphical-circle/index.mjs";
import "../../graphical-diamond/index.mjs";
import "../../graphical-hexagon/index.mjs";
import "../../graphical-isosceles-triangle/index.mjs";
import "../../graphical-pentagon/index.mjs";
import "../../graphical-rect/index.mjs";
import "../../graphical-right-triangle/index.mjs";
import "../../scene-map3d/index.mjs";
import "../../scene-amap2d/index.mjs";
import "../../scene-amap3d/index.mjs";
import "../../scene-vr/index.mjs";
import "../../scene-unity-iframe/index.mjs";
import "../../scene-unity-webgl/index.mjs";
import "../../scene-ue-iframe/index.mjs";
import "../../scene-ue-shj/index.mjs";
import "../../scene-default/index.mjs";
import "../../interaction/tabs/index.mjs";
import "../../interaction/tabs-icon/index.mjs";
import "../../interaction/button/index.mjs";
import "../../interaction/date-picker/src/date-picker/index.mjs";
import "../../interaction/date-picker/src/date-picker-range/index.mjs";
import "../../text/list/index.mjs";
import "../../chart/src/bar/basic/index.mjs";
import "../../chart/src/bar/animation/index.mjs";
import "../../chart/src/bar/contrast/index.mjs";
import "../../chart/src/bar/contrast2/index.mjs";
import "../../chart/src/bar/contrast3/index.mjs";
import "../../chart/src/bar/gradient-column-chart/index.mjs";
import "../../chart/src/bar/horizontal/index.mjs";
import "../../chart/src/bar/horizontal-stack/index.mjs";
import "../../chart/src/bar/line-bar/index.mjs";
import "../../chart/src/bar/line-bar2/index.mjs";
import "../../chart/src/bar/loop/index.mjs";
import "../../chart/src/bar/mini/index.mjs";
import "../../chart/src/bar/polar/index.mjs";
import "../../chart/src/bar/polar-stack/index.mjs";
import "../../chart/src/bar/polar2/index.mjs";
import "../../chart/src/bar/radius-circle/index.mjs";
import "../../chart/src/bar/rank/index.mjs";
import "../../chart/src/bar/segmented-progress/index.mjs";
import "../../chart/src/bar/spire/index.mjs";
import "../../chart/src/bar/stack/index.mjs";
import "../../chart/src/bar/stack-line/index.mjs";
import "../../chart/src/bar/stack2/index.mjs";
import "../../chart/src/bar/stack3/index.mjs";
import "../../chart/src/bar/staggered/index.mjs";
import "../../chart/src/bar/three/index.mjs";
import "../../chart/src/bar/waterfall/index.mjs";
import "../../chart/src/bar/zebra/index.mjs";
import "../../chart/src/line/area-gradient/index.mjs";
import "../../chart/src/line/area-highlight/index.mjs";
import "../../chart/src/line/area-highlight2/index.mjs";
import "../../chart/src/line/basic/index.mjs";
import "../../chart/src/line/bump/index.mjs";
import "../../chart/src/line/dashed/index.mjs";
import "../../chart/src/line/ladder/index.mjs";
import "../../chart/src/line/logarithm/index.mjs";
import "../../chart/src/line/multix/index.mjs";
import "../../chart/src/line/polar-double/index.mjs";
import "../../chart/src/line/rain-flow/index.mjs";
import "../../chart/src/line/scale/index.mjs";
import "../../chart/src/line/smooth/index.mjs";
import "../../chart/src/line/smooth-area/index.mjs";
import "../../chart/src/line/stack/index.mjs";
import "../../chart/src/line/stack-area/index.mjs";
import "../../chart/src/line/temp/index.mjs";
import "../../chart/src/line/vertical/index.mjs";
import "../../chart/src/map/basic/index.mjs";
import "../../chart/src/map/bmap-basic/index.mjs";
import "../../chart/src/map/bmap-heatmap/index.mjs";
import "../../chart/src/map/bmap-rich/index.mjs";
import "../../chart/src/map/customize/index.mjs";
import "../../chart/src/map/lines/index.mjs";
import "../../chart/src/map/scatter/index.mjs";
import "../../chart/src/pie/3d/index.mjs";
import "../../chart/src/pie/basic/index.mjs";
import "../../chart/src/pie/basic2/index.mjs";
import "../../chart/src/pie/customized/index.mjs";
import "../../chart/src/pie/index/index.mjs";
import "../../chart/src/pie/interval/index.mjs";
import "../../chart/src/pie/legend-scroll/index.mjs";
import "../../chart/src/pie/radius/index.mjs";
import "../../chart/src/pie/rose/index.mjs";
import "../../chart/src/pie/round/index.mjs";
import "../../chart/src/pie/sunburst/index.mjs";
import "../../chart/src/scatter/basic/index.mjs";
import "../../chart/src/scatter/basic2/index.mjs";
import "../../chart/src/scatter/bubble/index.mjs";
import "../../chart/src/scatter/ripples/index.mjs";
import "../zv-hj-tree-list/index.mjs";
import "../zv-hj-model-resource/index.mjs";
import "../zv-hj-one-map-config/index.mjs";
import "../zv-hj-video-control/index.mjs";
import "./index.mjs";
import "../zv-hj-password-input/index.mjs";
import "../zv-hj-carousel/index.mjs";
import "../zv-hj-video-monitor/index.mjs";
import "../zv-hj-scene-amap2d/index.mjs";
import "../zv-hj-scene-amap3d/index.mjs";
import "../zv-hj-person-face/index.mjs";
import "../zv-hj-resource-type-phone/index.mjs";
import "../zv-hj-tree-list-phone/index.mjs";
import "../zv-hj-video-page-phone/index.mjs";
import "../zv-hj-model-resource-phone/index.mjs";
import "../zv-hj-bottom-suspend/index.mjs";
import "../zv-hj-pagination/index.mjs";
import "../zv-hj-password-input-phone/index.mjs";
/* empty css                           */
/* empty css                                  */
import "lodash";
import "../../../plugins/datasource/utils/request.mjs";
import "../../../plugins/datasource/utils/wsManager.mjs";
import { HJLYDatasourceApi as G } from "../../../plugins/datasource/hjly/index.mjs";
import { SHJParseEvent as io } from "../../../plugins/event/index.mjs";
const v = (S) => (No("data-v-f1445cdd"), S = S(), Vo(), S), Ao = { class: "video" }, zo = {
  key: 0,
  class: "video__head"
}, Ho = { class: "video__left" }, Bo = { class: "video__grids" }, To = ["alt", "title", "onClick"], Do = { class: "video__right" }, Fo = {
  key: 0,
  class: "video__control"
}, Po = { class: "video__control-box" }, qo = /* @__PURE__ */ v(() => /* @__PURE__ */ i("div", { class: "video__control-yougan-top" }, null, -1)), Jo = /* @__PURE__ */ v(() => /* @__PURE__ */ i("div", { class: "video__control-yougan-bottom" }, null, -1)), Go = /* @__PURE__ */ v(() => /* @__PURE__ */ i("div", { class: "video__control-yougan-top-div" }, null, -1)), Uo = /* @__PURE__ */ v(() => /* @__PURE__ */ i("div", { class: "video__control-yougan-bottom-div" }, null, -1)), Wo = { class: "video__control-tabs" }, jo = ["onClick"], Ro = /* @__PURE__ */ v(() => /* @__PURE__ */ i("div", { class: "video__control-line" }, null, -1)), Yo = {
  key: 0,
  class: "video__control-search"
}, Ko = /* @__PURE__ */ v(() => /* @__PURE__ */ i("span", { class: "video__square-left" }, null, -1)), Qo = ["placeholder"], Xo = /* @__PURE__ */ v(() => /* @__PURE__ */ i("span", { class: "video__square-right" }, null, -1)), Zo = ["src"], xo = { class: "video__control-scroll-content" }, oe = ["src"], ee = ["onClick"], te = ["src"], ie = { class: "video__title" }, le = ["title"], se = {
  key: 0,
  class: "video__dian"
}, ne = /* @__PURE__ */ v(() => /* @__PURE__ */ i("span", { class: "video__circle" }, null, -1)), re = [
  ne
], ce = { class: "video__status" }, ae = {
  key: 0,
  class: "video__status-title video__green"
}, pe = {
  key: 1,
  class: "video__status-title"
}, de = ["src", "onClick"], ue = ["src", "onClick"], me = {
  key: 1,
  class: "video__collapse video__collect"
}, ve = { class: "video__collapse-item" }, _e = { class: "el-collapse-item__wrap" }, ge = { class: "el-collapse-item__content" }, he = ["onClick"], fe = ["src"], be = { class: "video__title" }, ye = ["title"], Se = {
  key: 0,
  class: "video__dian"
}, Ce = /* @__PURE__ */ v(() => /* @__PURE__ */ i("span", { class: "video__circle" }, null, -1)), ke = [
  Ce
], Oe = { class: "video__status" }, we = {
  key: 0,
  class: "video__status-title video__green"
}, Ie = {
  key: 1,
  class: "video__status-title"
}, Ee = ["src", "onClick"], Le = ["src", "onClick"], Ne = { class: "control" }, Ve = /* @__PURE__ */ v(() => /* @__PURE__ */ i("div", { class: "control__title" }, "云台控制", -1)), $e = { class: "control__content" }, Me = { class: "control__image" }, Ae = ["src"], ze = ["src"], He = ["src"], Be = ["src"], Te = ["src"], De = { class: "control__progress" }, Fe = lo({ name: "zv-hj-video-page" }), As = /* @__PURE__ */ lo({
  ...Fe,
  props: {
    basicOption: {},
    sources: {},
    useEvents: {},
    uuid: {}
  },
  emits: [
    "on-click",
    "on-click-control-direction",
    "on-click-control-percentage",
    "on-click-control-tab"
  ],
  setup(S, { emit: so }) {
    So((o) => ({
      "986516b0": o.basicOption.headerConfig.gridConfig.width + "px",
      "10697d05": o.basicOption.headerConfig.gridConfig.height + "px",
      "380515f6": o.basicOption.headerConfig.closeAllConfig.width + "px",
      "338cef70": o.basicOption.headerConfig.closeAllConfig.height + "px",
      "65d879f3": no.value,
      ed91849a: o.basicOption.headerConfig.fullScreenConfig.width + "px",
      "2f8e554c": o.basicOption.headerConfig.fullScreenConfig.height + "px",
      "521dc9a1": ro.value,
      "559029e4": "url(" + o.basicOption.groupStyle.backgroundStyle.image + ")",
      cdd17994: o.basicOption.searchStyle.backgroundColor,
      "0b042b78": o.basicOption.searchStyle.borderColor,
      "66d1f642": o.basicOption.searchStyle.searchIcon.right + "px",
      "65f871f4": o.basicOption.searchStyle.searchIcon.top + "px",
      "378f1142": o.basicOption.groupStyle.iconStyle.width + "px",
      "25425da4": o.basicOption.groupStyle.iconStyle.height + "px",
      fcfdf726: o.basicOption.groupStyle.iconStyle.x + "px",
      "2d3b9d68": o.basicOption.groupStyle.iconStyle.y + "px",
      c8bedbee: o.basicOption.groupStyle.iconStyle.height + o.basicOption.groupStyle.iconStyle.y * 2 + "px",
      "4f0a2b12": o.basicOption.groupStyle.x + "px",
      "405c1756": o.basicOption.groupStyle.y + "px",
      "34a6c141": o.basicOption.groupStyle.color,
      "1deaedfb": o.basicOption.groupStyle.fontSize + "px",
      "4295ed80": o.basicOption.groupStyle.fontStyle,
      ad9de260: o.basicOption.groupStyle.lineHeight + "px",
      "404305b6": o.basicOption.cardStyle.backgroundSize,
      b3b5c438: o.basicOption.cardStyle.iconStyle.width + "px",
      "6906fb49": o.basicOption.cardStyle.iconStyle.height + "px",
      "27e7b572": o.basicOption.cardStyle.iconStyle.x + "px",
      e06e3b5e: o.basicOption.cardStyle.iconStyle.y + "px",
      "29c3e690": o.basicOption.titleStyle.x + "px",
      dcb5d922: o.basicOption.titleStyle.y + "px",
      "326fe3c8": o.basicOption.titleStyle.color,
      "18cbd3c2": o.basicOption.titleStyle.fontSize + "px",
      a4ec4ca6: o.basicOption.tagsStyle.fontSize + "px",
      "0017f29c": o.basicOption.tagsStyle.fontStyle,
      19040152: "url(" + o.basicOption.controlStyle.bottomStyle.increase.image + ")",
      "32575fb3": "url(" + o.basicOption.controlStyle.bottomStyle.decrease.image + ")"
    }));
    const c = S, U = so, no = J(() => c.basicOption.headerConfig.closeAllConfig.show && c.basicOption.headerConfig.closeAllConfig.backgroundImage ? `url(${c.basicOption.headerConfig.closeAllConfig.backgroundImage})` : "none"), ro = J(() => c.basicOption.headerConfig.fullScreenConfig.show && c.basicOption.headerConfig.fullScreenConfig.backgroundImage ? `url(${c.basicOption.headerConfig.fullScreenConfig.backgroundImage})` : "none"), C = J(() => {
      const o = [];
      return c.basicOption.headerConfig.gridConfig.grid.forEach((e, n) => {
        e.show && o.push(e);
      }), o;
    });
    x(() => c.basicOption.videoConfig.type, () => {
      q(), oo(() => {
        c.basicOption.videoConfig.type !== "onepage" && (P(C.value[0], 0), F(k.value[0].childList[0])), I();
      });
    }), x(() => c.basicOption.headerConfig.defaultGridIndex, () => {
      const o = C.value, e = c.basicOption.headerConfig.defaultGridIndex;
      P(o[e], e);
    });
    const k = r([]), O = r(c.basicOption.headerConfig.defaultGridIndex), b = r(), _ = r(), W = r([0]), h = r(0), co = r([
      {
        id: 0,
        name: "视频监控"
      },
      {
        id: 1,
        name: "收藏夹"
      }
    ]), j = r(""), ao = r(0), po = r("#E0C770"), uo = r("#000000"), B = r(!1), f = r(0), g = r(1), T = r([]), R = r([]), Y = r(0), K = r(0), mo = r(), D = r("");
    Co(() => {
      window.addEventListener("resize", I), I(), Q({});
    });
    const Q = (o = {}) => {
      let e = {
        typeId: "27",
        // 视频监控
        checkListCode: "A3-05-05"
      };
      e = Object.assign(e, o), G.loadResourceMonitorCheckList(e).then((n) => {
        var m;
        const p = ((m = n == null ? void 0 : n.data) == null ? void 0 : m.listRet) || [];
        k.value = p, k.value.forEach((d) => {
          var t;
          d.childList = d.listDeviceVos, d.listDeviceVos = null, (t = d == null ? void 0 : d.childList) == null || t.forEach((u) => {
            u.collectId && (T.value.push(u), R.value.push(u.resourceId));
          });
        });
      });
    }, F = (o) => {
      const e = JSON.parse(JSON.stringify(o));
      if (b.value = e, U("on-click", b.value), io.parseEvents(c.useEvents, "on-click", b.value), b.value.offlineFlag === 1)
        return $o({
          message: "设备已离线",
          type: "error"
        });
      _.value.showVideo(b.value.resourceId, null, 1, b.value);
    }, $ = (o, e) => {
      o.target.nodeName ? f.value || (f.value = Date.now(), _.value.changeControl(e, 0)) : f.value = 0;
    }, vo = () => {
      g.value = 1, _.value.changeScale(g.value);
    }, X = (o) => {
      o === 1 ? g.value -= 0.1 : g.value += 0.1, g.value > 2 ? g.value = 2 : g.value < 0.5 && (g.value = 0.5), _.value.changeScale(g.value);
    }, M = (o, e) => {
      const n = Date.now() - f.value;
      o.target.nodeName ? n < 300 ? setTimeout(() => {
        _.value.changeControl(e, 1), f.value = 0;
      }, 120) : (_.value.changeControl(e, 1), f.value = 0) : f.value = 0;
    }, _o = (o, e) => {
      h.value = e, U("on-click-control-tab", h.value), io.parseEvents(
        c.useEvents,
        "on-click-control-tab",
        h.value
      );
    }, w = (o) => {
      const e = o.resourceId, n = R.value, p = T.value, m = n.indexOf(e);
      m !== -1 ? (n.splice(m, 1), p.splice(
        p.findIndex(
          (d) => d.resourceId === e
        ),
        1
      ), G.videoNotCollect({
        resourceId: o.resourceId
      }).then((d) => {
        o.collectId = 0;
      })) : (n.push(e), p.push(o), G.videoCollect({
        resourceId: o.resourceId,
        typeId: o == null ? void 0 : o.typeId,
        videoType: (o == null ? void 0 : o.protocolId) || (o == null ? void 0 : o.videoType) || 1
        // videoType参数后端没有用到
      }).then((d) => {
        o.collectId = 1;
      }));
    }, I = () => {
      var n, p;
      const o = ((n = document.querySelector(".video__body")) == null ? void 0 : n.clientWidth) || 300, e = ((p = document.querySelector(".video__body")) == null ? void 0 : p.clientHeight) || 200;
      Y.value = o, K.value = e;
    }, P = (o, e) => {
      e !== O.value && (O.value = e, oo(() => {
        _.value.changeGrid(o, e);
      }));
    };
    (() => {
      if (!window.JSPlugin)
        return new Promise((o, e) => {
          const n = document.createElement("script");
          n.src = `${c.basicOption.videoConfig.hk.videoJSUrl}`, n.onload = o, n.onerror = e, document.head.appendChild(n);
        });
    })();
    const q = () => {
      B.value = !1, _.value.destoryVideoAll();
    }, go = () => {
      const o = document.querySelector(".video__body");
      o.requestFullscreen && o.requestFullscreen(), I();
    }, ho = (o) => {
      let e = null;
      k.value.forEach((n) => {
        var p;
        (p = n == null ? void 0 : n.childList) == null || p.forEach((m) => {
          m.resourceId === o.resourceId && (e = m);
        });
      }), e && w(e);
    }, fo = () => {
      const o = { filter: D.value };
      Q(o);
    }, bo = (o) => {
      B.value = o;
    };
    return ko(() => {
      window.removeEventListener("resize", I), q();
    }), (o, e) => {
      const n = A("el-collapse-item"), p = A("el-collapse"), m = A("el-progress"), d = A("el-button");
      return l(), s("div", Ao, [
        i("div", {
          class: z(["video__left", [o.basicOption.videoConfig.type === "onepage" ? "video__left_onepage" : ""]])
        }, [
          o.basicOption.videoConfig.type === "onepage" ? (l(), s("div", zo, [
            i("div", Ho, [
              i("div", Bo, [
                (l(!0), s(E, null, L(C.value, (t, u) => (l(), s("div", {
                  key: t.title,
                  class: "video__grid",
                  style: Oo({
                    background: `url(${O.value != u ? t.backgroundImage : t.activeBackgroundImage})`
                  }),
                  alt: t.title,
                  title: t.title,
                  onClick: (a) => P(t, u)
                }, null, 12, To))), 128))
              ])
            ]),
            i("div", Do, [
              i("div", {
                class: "video__closeall",
                onClick: q
              }, N(o.basicOption.headerConfig.closeAllConfig.title), 1),
              i("div", {
                class: "video__fullscreen",
                onClick: go
              }, N(o.basicOption.headerConfig.fullScreenConfig.title), 1)
            ])
          ])) : y("", !0),
          i("div", {
            ref_key: "videoBody",
            ref: mo,
            class: "video__body"
          }, [
            V(Mo, {
              ref_key: "videoControl",
              ref: _,
              row: C.value[O.value].row,
              col: C.value[O.value].col,
              width: Y.value,
              height: K.value,
              "is-video-center": !1,
              "basic-option": o.basicOption,
              "source-type": o.basicOption.videoConfig.type,
              onCollect: ho,
              onControlConfig: bo
            }, null, 8, ["row", "col", "width", "height", "basic-option", "source-type"])
          ], 512)
        ], 2),
        o.basicOption.videoConfig.type === "onepage" ? (l(), s("div", Fo, [
          i("div", Po, [
            qo,
            Jo,
            Go,
            Uo,
            i("div", Wo, [
              (l(!0), s(E, null, L(co.value, (t, u) => (l(), s("div", {
                key: t.id,
                class: z(["video__tab", h.value === t.id ? "active" : ""]),
                onClick: (a) => _o(t, u)
              }, [
                wo(N(t.name) + " ", 1),
                Ro
              ], 10, jo))), 128))
            ]),
            h.value == 0 ? (l(), s("div", Yo, [
              Ko,
              eo(i("input", {
                "onUpdate:modelValue": e[0] || (e[0] = (t) => D.value = t),
                class: "video__search",
                type: "text",
                placeholder: o.basicOption.searchStyle.placeholder
              }, null, 8, Qo), [
                [
                  Io,
                  D.value,
                  void 0,
                  { trim: !0 }
                ]
              ]),
              Xo,
              i("img", {
                class: "video__search-icon",
                src: o.basicOption.searchStyle.searchIcon.url,
                alt: "",
                onClick: fo
              }, null, 8, Zo)
            ])) : y("", !0),
            i("div", {
              class: z(["video__control-scroll", [h.value === 1 ? "video__control-scroll-collect" : ""]])
            }, [
              i("div", xo, [
                h.value == 0 ? (l(!0), s(E, { key: 0 }, L(k.value, (t, u) => (l(), Eo(p, {
                  modelValue: W.value,
                  "onUpdate:modelValue": e[1] || (e[1] = (a) => W.value = a),
                  key: u,
                  class: "video__collapse"
                }, {
                  default: to(() => [
                    i("img", {
                      class: "video__group",
                      src: o.basicOption.groupStyle.iconStyle.image
                    }, null, 8, oe),
                    V(n, {
                      name: `${u}`,
                      title: t.groupName,
                      class: "video__collapse-item"
                    }, {
                      default: to(() => [
                        (l(!0), s(E, null, L(t.childList, (a, yo) => (l(), s("div", {
                          key: yo,
                          class: "video__list",
                          onClick: (Z) => F(a)
                        }, [
                          i("img", {
                            class: "video__icon",
                            src: o.basicOption.groupStyle.videoStyle.image
                          }, null, 8, te),
                          i("div", ie, [
                            i("span", {
                              class: "text",
                              title: a.resourceName
                            }, N(a.resourceName), 9, le),
                            a.offlineFlag === 0 ? (l(), s("span", se, re)) : y("", !0)
                          ]),
                          i("div", ce, [
                            a.offlineFlag === 0 ? (l(), s("span", ae, " 在线 ")) : (l(), s("span", pe, "离线")),
                            a.collectId ? (l(), s("img", {
                              key: 2,
                              class: "video__collect",
                              src: o.basicOption.groupStyle.collectStyle.image,
                              onClick: H((Z) => w(a), ["stop"])
                            }, null, 8, de)) : (l(), s("img", {
                              key: 3,
                              class: "video__collect",
                              src: o.basicOption.groupStyle.unCollectStyle.image,
                              onClick: H((Z) => w(a), ["stop"])
                            }, null, 8, ue))
                          ])
                        ], 8, ee))), 128))
                      ]),
                      _: 2
                    }, 1032, ["name", "title"])
                  ]),
                  _: 2
                }, 1032, ["modelValue"]))), 128)) : (l(), s("div", me, [
                  i("div", ve, [
                    i("div", _e, [
                      i("div", ge, [
                        (l(!0), s(E, null, L(T.value, (t, u) => (l(), s("div", {
                          key: u,
                          class: "video__list",
                          onClick: (a) => F(t)
                        }, [
                          i("img", {
                            class: "video__icon",
                            src: o.basicOption.groupStyle.videoStyle.image
                          }, null, 8, fe),
                          i("div", be, [
                            i("span", {
                              class: "text",
                              title: t.resourceName
                            }, N(t.resourceName), 9, ye),
                            t.offlineFlag === 0 ? (l(), s("span", Se, ke)) : y("", !0)
                          ]),
                          i("div", Oe, [
                            t.offlineFlag === 0 ? (l(), s("span", we, " 在线 ")) : (l(), s("span", Ie, "离线")),
                            t.collectId ? (l(), s("img", {
                              key: 2,
                              class: "video__collect",
                              src: o.basicOption.groupStyle.collectStyle.image,
                              onClick: H((a) => w(t), ["stop"])
                            }, null, 8, Ee)) : (l(), s("img", {
                              key: 3,
                              class: "video__collect",
                              src: o.basicOption.groupStyle.unCollectStyle.image,
                              onClick: H((a) => w(t), ["stop"])
                            }, null, 8, Le))
                          ])
                        ], 8, he))), 128))
                      ])
                    ])
                  ])
                ]))
              ]),
              eo(i("div", Ne, [
                Ve,
                i("div", $e, [
                  i("div", Me, [
                    i("img", {
                      class: "control__icon",
                      src: o.basicOption.controlStyle.refreshStyle.image,
                      onClick: vo
                    }, null, 8, Ae),
                    i("img", {
                      class: "control__icon-top",
                      src: o.basicOption.controlStyle.directStyle.image,
                      onMousedown: e[2] || (e[2] = (t) => $(t, 2)),
                      onMouseup: e[3] || (e[3] = (t) => M(t, 2))
                    }, null, 40, ze),
                    i("img", {
                      class: "control__icon-right",
                      src: o.basicOption.controlStyle.directStyle.image,
                      onMousedown: e[4] || (e[4] = (t) => $(t, 1)),
                      onMouseup: e[5] || (e[5] = (t) => M(t, 1))
                    }, null, 40, He),
                    i("img", {
                      class: "control__icon-bottom",
                      src: o.basicOption.controlStyle.directStyle.image,
                      onMousedown: e[6] || (e[6] = (t) => $(t, 3)),
                      onMouseup: e[7] || (e[7] = (t) => M(t, 3))
                    }, null, 40, Be),
                    i("img", {
                      class: "control__icon-left",
                      src: o.basicOption.controlStyle.directStyle.image,
                      onMousedown: e[8] || (e[8] = (t) => $(t, 0)),
                      onMouseup: e[9] || (e[9] = (t) => M(t, 0))
                    }, null, 40, Te),
                    j.value ? (l(), s("img", {
                      key: 0,
                      class: z(["control__icon-select", j.value]),
                      src: "https://guidedev.fxo2opt.com/document/shi/zv-hj-video-control/control-yes.png"
                    }, null, 2)) : y("", !0)
                  ]),
                  i("div", De, [
                    V(m, {
                      percentage: ao.value,
                      color: po.value,
                      "define-back-color": uo.value
                    }, null, 8, ["percentage", "color", "define-back-color"]),
                    V(d, {
                      class: "control__increase",
                      onClick: e[10] || (e[10] = (t) => X(2))
                    }),
                    V(d, {
                      class: "control__decrease",
                      onClick: e[11] || (e[11] = (t) => X(1))
                    })
                  ])
                ])
              ], 512), [
                [Lo, B.value]
              ])
            ], 2)
          ])
        ])) : y("", !0)
      ]);
    };
  }
});
export {
  As as default
};
