import __glob_6_0 from "./images/broaden-active.mjs";
import __glob_6_1 from "./images/broaden.mjs";
import __glob_6_2 from "./images/fullscreen-active.mjs";
import __glob_6_3 from "./images/fullscreen.mjs";
import __glob_6_4 from "./images/moxing-active.mjs";
import __glob_6_5 from "./images/moxing.mjs";
import __glob_6_6 from "./images/point-active.mjs";
import __glob_6_7 from "./images/point.mjs";
import __glob_6_8 from "./images/satellite-active.mjs";
import __glob_6_9 from "./images/satellite.mjs";
import __glob_6_10 from "./images/title-active.mjs";
import __glob_6_11 from "./images/title.mjs";
import { defineComponent, reactive, toRefs, openBlock, createElementBlock, createElementVNode, normalizeStyle, unref, normalizeClass, withDirectives, Fragment, renderList, vShow } from "vue";
import "./index.vue_vue_type_style_index_0_scoped_true_lang.mjs";
import _export_sfc from "../../../../_virtual/plugin-vue_export-helper.mjs";
const _hoisted_1 = { class: "tools-box" };
const _hoisted_2 = ["onClick"];
const __default__ = defineComponent({ name: "EComponent28" });
const _sfc_main = /* @__PURE__ */ defineComponent({
  ...__default__,
  props: {
    chartConfig: {
      type: Object,
      required: true,
      default: () => {
        return {
          option: {
            titleConfig: {
              active: true,
              img: __glob_6_11,
              imgActive: __glob_6_10,
              height: 119
            },
            btnsConfig: []
          }
        };
      }
    }
  },
  setup(__props) {
    var _a;
    const props = __props;
    const chartConfig = reactive(props.chartConfig);
    const { titleConfig, btnsConfig } = toRefs(chartConfig.option);
    const getImageUrl = (name) => {
      return new URL({ "./images/broaden-active.png": __glob_6_0, "./images/broaden.png": __glob_6_1, "./images/fullscreen-active.png": __glob_6_2, "./images/fullscreen.png": __glob_6_3, "./images/moxing-active.png": __glob_6_4, "./images/moxing.png": __glob_6_5, "./images/point-active.png": __glob_6_6, "./images/point.png": __glob_6_7, "./images/satellite-active.png": __glob_6_8, "./images/satellite.png": __glob_6_9, "./images/title-active.png": __glob_6_10, "./images/title.png": __glob_6_11 }[`./images/${name}.png`], self.location).href;
    };
    !((_a = btnsConfig.value) == null ? void 0 : _a.length) && ["satellite", "point", "moxing", "fullscreen"].forEach(
      (v) => btnsConfig.value.push({
        active: false,
        img: getImageUrl(v),
        imgActive: getImageUrl(v + "-active"),
        width: 121,
        height: 122
      })
    );
    const headerClick = () => {
      titleConfig.value.active = !titleConfig.value.active;
    };
    const btnClick = (item) => {
      item.active = !item.active;
    };
    return (_ctx, _cache) => {
      return openBlock(), createElementBlock("div", _hoisted_1, [
        createElementVNode("header", {
          style: normalizeStyle({
            height: unref(titleConfig).height + "px",
            backgroundImage: `url(${unref(titleConfig).active ? unref(titleConfig).imgActive : unref(titleConfig).img})`
          }),
          class: normalizeClass({ active: unref(titleConfig).active }),
          onClick: headerClick
        }, null, 6),
        withDirectives(createElementVNode("main", null, [
          (openBlock(true), createElementBlock(Fragment, null, renderList(unref(btnsConfig), (v) => {
            return openBlock(), createElementBlock("div", {
              class: "btn-box",
              key: v.img,
              style: normalizeStyle({
                width: v.width + "px",
                height: v.height + "px",
                backgroundImage: `url(${v.active ? v.imgActive : v.img})`
              }),
              onClick: ($event) => btnClick(v)
            }, null, 12, _hoisted_2);
          }), 128))
        ], 512), [
          [vShow, unref(titleConfig).active]
        ])
      ]);
    };
  }
});
var _EComponent28 = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-517cfd45"]]);
export { _EComponent28 as default };
