import { defineComponent as p, useCssVars as k, unref as t, ref as a, toRefs as l, openBlock as r, createElementBlock as c, createElementVNode as n, createVNode as f, Fragment as x, renderList as y, isRef as b } from "vue";
import m from "../../../NComponents/configCommon/refConfig.vue_vue_type_script_setup_true_lang.mjs";
import B from "./images/righttitle1.mjs";
import E from "./images/righttitle2.mjs";
import V from "./images/lefttitle1.mjs";
import N from "./images/lefttitle2.mjs";
const R = { class: "header" }, $ = { class: "header_content" }, j = { class: "btnBox" }, q = ["src", "onClick"], w = p({ name: "EHeader02" }), I = /* @__PURE__ */ p({
  ...w,
  props: {
    chartConfig: {
      type: Object,
      required: !0
    }
  },
  setup(u) {
    const s = u;
    k((v) => ({
      "90cba342": t(h) + "px",
      c3fd05e4: t(C) + "px"
    }));
    let _ = a([
      {
        default: B,
        act: E
      },
      {
        default: V,
        act: N
      }
    ]), e = a(0);
    const { titleConfig: d, imageConfig: g } = l(s.chartConfig.option), { w: h, h: C } = l(s.chartConfig.attr);
    return (v, F) => (r(), c("div", null, [
      n("div", R, [
        n("div", $, [
          f(m, {
            config: t(g),
            type: "img",
            class: "img"
          }, null, 8, ["config"]),
          f(m, {
            config: t(d),
            type: "text"
          }, null, 8, ["config"])
        ])
      ]),
      n("div", j, [
        (r(!0), c(x, null, y(t(_), (i, o) => (r(), c("img", {
          key: o,
          src: t(e) == o ? i.act : i.default,
          onClick: (H) => b(e) ? e.value = o : e = o
        }, null, 8, q))), 128))
      ])
    ]));
  }
});
export {
  I as default
};
