import { defineComponent as x, ref as p, toRefs as R, openBlock as f, createElementBlock as s, createElementVNode as n, Fragment as v, renderList as _, unref as i, createVNode as t, withCtx as m } from "vue";
import o from "../../../NComponents/configCommon/refConfig.vue_vue_type_script_setup_true_lang.mjs";
import j from "./images/img1.mjs";
import q from "./images/img1_1.mjs";
import O from "./images/img2.mjs";
import J from "./images/img2_1.mjs";
import K from "./images/img3.mjs";
import M from "./images/img3_1.mjs";
import P from "./images/bg.mjs";
import A from "./images/bg_active.mjs";
import S from "./images/search.mjs";
import Q from "./images/boxBG.mjs";
import D from "./images/1688633308407.mjs";
import T from "./images/yellowCircle.mjs";
import U from "./images/grayCircle.mjs";
import W from "./images/videoBgActive.mjs";
import X from "./images/videobg.mjs";
const Y = { class: "videoList" }, Z = { class: "t2" }, ii = { class: "EComponent21VIdeo" }, ti = ["onClick"], oi = { class: "t3" }, ei = { class: "" }, gi = { class: "showHeader" }, ni = { class: "t4" }, ci = ["onClick"], ui = { class: "showHeader" }, fi = x({ name: "EComponent21VIdeo" }), bi = /* @__PURE__ */ x({
  ...fi,
  props: {
    chartConfig: {
      type: Object,
      required: !0
    }
  },
  setup(w) {
    var h;
    const y = w;
    let B = {
      list: [
        {
          iconConfigDefault: {
            imgSrc: q
          },
          iconConfigActive: {
            imgSrc: j
          },
          textConfig: {
            text: "\u5DE5\u5730\u76D1\u63A7"
          }
        },
        {
          iconConfigDefault: {
            imgSrc: J
          },
          iconConfigActive: {
            imgSrc: O
          },
          textConfig: {
            text: "\u8F66\u8F86\u76D1\u63A7"
          }
        },
        {
          iconConfigDefault: {
            imgSrc: M
          },
          iconConfigActive: {
            imgSrc: K
          },
          textConfig: {
            text: "\u6D88\u7EB3\u76D1\u63A7"
          }
        }
      ],
      iconConfig: {
        width: 12,
        height: 12
      },
      titleCofingDefalult: {
        fontSize: 16,
        color: "RGBA(129, 129, 130, 1)"
      },
      titleCofingActive: {
        fontSize: 16,
        color: "rgba(255, 255, 255, 1)"
      },
      bgImageConfigDefault: {
        imgSrc: P,
        width: 94,
        height: 29
      },
      bgImageConfigActive: {
        imgSrc: A,
        width: 94,
        height: 29
      },
      searchConfig: {
        imgSrc: S,
        width: 29,
        height: 29
      },
      showVideoBgConfig: {
        imgSrc: Q,
        width: 479,
        height: 287
      },
      showVideoConfig: {
        imgSrc: D,
        width: 469,
        height: 277
      },
      videolist: [
        {
          imgSrc: D,
          text: "\u7403\u673A\u76D1\u63A7-48",
          address: "\u6210\u90FD\u5E02\u6B66\u4FAF\u533A\u5929\u4EC1\u5317\u4E8C\u8857",
          status: 0
        },
        {
          imgSrc: S,
          text: "\u7403\u673A\u76D1\u63A7-48",
          address: "\u6210\u90FD\u5E02\u6B66\u4FAF\u533A\u5929\u4EC1\u5317\u4E8C\u88572",
          status: 1
        },
        {
          imgSrc: A,
          text: "\u7403\u673A\u76D1\u63A7-48",
          address: "\u6210\u90FD\u5E02\u6B66\u4FAF\u533A\u5929\u4EC1\u5317\u4E8C\u88573",
          status: 0
        }
      ],
      singleVideoConfig: {
        width: 143,
        height: 87
      },
      singleVideoBgConfigDefault: {
        width: 153,
        height: 97,
        imgSrc: X
      },
      singleVideoBgConfigActive: {
        width: 153,
        height: 97,
        imgSrc: W
      },
      videotitleCofing: {
        fontSize: 14,
        color: "rgba(255, 255, 255, 0.6)"
      },
      statusConfig1: {
        imgSrc: T,
        width: 10,
        height: 10
      },
      statusConfig0: {
        imgSrc: U,
        width: 10,
        height: 10
      }
    };
    const l = p(0), c = p(0), {
      list: E,
      titleCofingDefalult: b,
      titleCofingActive: V,
      bgImageConfigDefault: F,
      bgImageConfigActive: I,
      iconConfig: a,
      searchConfig: k,
      showVideoBgConfig: z,
      showVideoConfig: $,
      videotitleCofing: r,
      singleVideoBgConfigActive: G,
      singleVideoBgConfigDefault: H,
      singleVideoConfig: L,
      videolist: u,
      statusConfig1: d,
      statusConfig0: C
    } = R(((h = y.chartConfig) == null ? void 0 : h.option) || B);
    return (si, li) => (f(), s("div", Y, [
      n("div", Z, [
        n("div", ii, [
          (f(!0), s(v, null, _(i(E), (e, g) => (f(), s("div", {
            onClick: (N) => l.value = g
          }, [
            t(o, {
              config: g == l.value ? i(I) : i(F),
              type: "bgImg",
              class: "wrapper"
            }, {
              default: m(() => [
                t(o, {
                  config: g == l.value ? { ...e.iconConfigActive, ...i(a) } : { ...e.iconConfigDefault, ...i(a) },
                  type: "img"
                }, null, 8, ["config"]),
                t(o, {
                  config: g == l.value ? { ...e.textConfig, ...i(V) } : { ...e.textConfig, ...i(b) },
                  type: "text"
                }, null, 8, ["config"])
              ]),
              _: 2
            }, 1032, ["config"])
          ], 8, ti))), 256))
        ]),
        t(o, {
          class: "searchIcon",
          config: i(k),
          type: "img"
        }, null, 8, ["config"])
      ]),
      n("div", oi, [
        n("div", ei, [
          t(o, {
            config: i(z),
            type: "bgImg",
            class: "videoBox"
          }, {
            default: m(() => [
              n("div", gi, [
                n("div", null, [
                  t(o, {
                    config: i(u)[c.value].status ? i(d) : i(C),
                    type: "img"
                  }, null, 8, ["config"]),
                  t(o, {
                    config: {
                      ...i(r),
                      text: i(u)[c.value].text
                    },
                    type: "text",
                    style: { "margin-left": "7px" }
                  }, null, 8, ["config"])
                ]),
                t(o, {
                  config: {
                    ...i(r),
                    text: i(u)[c.value].address
                  },
                  type: "text"
                }, null, 8, ["config"])
              ]),
              t(o, {
                config: {
                  ...i($),
                  imgSrc: i(u)[c.value].imgSrc
                },
                type: "img"
              }, null, 8, ["config"])
            ]),
            _: 1
          }, 8, ["config"])
        ])
      ]),
      n("div", ni, [
        (f(!0), s(v, null, _(i(u), (e, g) => (f(), s("div", {
          key: g,
          onClick: (N) => c.value = g
        }, [
          t(o, {
            config: g == c.value ? i(G) : i(H),
            type: "bgImg",
            class: "t4list"
          }, {
            default: m(() => [
              n("div", ui, [
                t(o, {
                  config: { ...i(r), text: e.text },
                  type: "text"
                }, null, 8, ["config"]),
                t(o, {
                  config: e.status ? i(d) : i(C),
                  type: "img"
                }, null, 8, ["config"])
              ]),
              t(o, {
                config: { imgSrc: e.imgSrc, ...i(L) },
                type: "img"
              }, null, 8, ["config"])
            ]),
            _: 2
          }, 1032, ["config"])
        ], 8, ci))), 128))
      ])
    ]));
  }
});
export {
  bi as default
};
