"use strict";
Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
require("../../../../../../../../node_modules/.pnpm/vue@3.3.4/node_modules/vue/dist/vue.runtime.esm-bundler.js");
const cloneDeep = require("../../../../../../../../node_modules/.pnpm/lodash@4.17.21/node_modules/lodash/cloneDeep.js");
const chartEditStore = require("../../../../../../../store/modules/chartEditStore/chartEditStore.js");
const chartEditStore_d = require("../../../../../../../store/modules/chartEditStore/chartEditStore.d.js");
const designStore = require("../../../../../../../store/modules/designStore/designStore.js");
require("../../../../../../../../node_modules/.pnpm/screenfull@6.0.2/node_modules/screenfull/index.js");
require("../../../../../../../../node_modules/.pnpm/lodash@4.17.21/node_modules/lodash/_root.js");
require("../../../../../../../../node_modules/.pnpm/lodash@4.17.21/node_modules/lodash/_baseGetTag.js");
require("../../../../../../../../node_modules/.pnpm/html2canvas@1.4.1/node_modules/html2canvas/dist/html2canvas.esm.js");
require("../../../../../../../../node_modules/.pnpm/crypto-js@4.1.1/node_modules/crypto-js/index.js");
require("../../../../../../../enums/pageEnum.js");
require("../../../../../../../router/index.js");
const style = require("../../../../../../../utils/style.js");
require("../../../../../../../../node_modules/.pnpm/vue3-lazyload@0.2.5-beta_a6dezdz3je235ci4e3tu4rayna/node_modules/vue3-lazyload/dist/vue3-lazyload.esm.js");
require("../../../../../../../components/GoSkeleton/index.vue.js");
require("../../../../../../../components/GoLoading/index.js");
const icon = require("../../../../../../../plugins/icon.js");
require("../../../../../../../settings/designSetting.js");
const components = require("../../../../../../../utils/components.js");
const runtimeCore_esmBundler = require("../../../../../../../../node_modules/.pnpm/@vue_runtime-core@3.3.4/node_modules/@vue/runtime-core/dist/runtime-core.esm-bundler.js");
const runtimeDom_esmBundler = require("../../../../../../../../node_modules/.pnpm/@vue_runtime-dom@3.3.4/node_modules/@vue/runtime-dom/dist/runtime-dom.esm-bundler.js");
const reactivity_esmBundler = require("../../../../../../../../node_modules/.pnpm/@vue_reactivity@3.3.4/node_modules/@vue/reactivity/dist/reactivity.esm-bundler.js");
const shared_esmBundler = require("../../../../../../../../node_modules/.pnpm/@vue_shared@3.3.4/node_modules/@vue/shared/dist/shared.esm-bundler.js");
const _withScopeId = (n) => (runtimeCore_esmBundler.pushScopeId("data-v-4ce90fea"), n = n(), runtimeCore_esmBundler.popScopeId(), n);
const _hoisted_1 = { class: "go-chart-theme-color" };
const _hoisted_2 = /* @__PURE__ */ _withScopeId(() => /* @__PURE__ */ runtimeCore_esmBundler.createElementVNode("span", null, "自定义颜色", -1));
const _hoisted_3 = { class: "go-flex-items-center" };
const _sfc_main = /* @__PURE__ */ runtimeCore_esmBundler.defineComponent({
  __name: "index",
  setup(__props) {
    runtimeDom_esmBundler.useCssVars((_ctx) => ({
      "d133daf6": themeColor.value
    }));
    const CreateColor = components.loadAsyncComponent(() => Promise.resolve().then(() => require("../CreateColor/index.vue.js")));
    const { SquareIcon, AddIcon } = icon.icon.ionicons5;
    const chartEditStore$1 = chartEditStore.useChartEditStore();
    const designStore$1 = designStore.useDesignStore();
    const createColorModelShow = reactivity_esmBundler.ref(false);
    const comChartColors = runtimeCore_esmBundler.computed(() => {
      return style.colorCustomMerge(chartEditStore$1.getEditCanvasConfig.chartCustomThemeColorInfo);
    });
    const themeColor = runtimeCore_esmBundler.computed(() => {
      return designStore$1.getAppTheme;
    });
    const selectName = runtimeCore_esmBundler.computed(() => {
      return chartEditStore$1.getEditCanvasConfig.chartThemeColor;
    });
    const createColorHandle = () => {
      createColorModelShow.value = true;
    };
    const colorBackgroundImage = (item) => {
      return `linear-gradient(to right, ${item.color[0]} 0%, ${item.color[5]} 100%)`;
    };
    const fetchShowColors = (colors) => {
      return cloneDeep.default(colors).splice(0, 6);
    };
    const selectTheme = (theme) => {
      chartEditStore$1.setEditCanvasConfig(chartEditStore_d.EditCanvasConfigEnum.CHART_THEME_COLOR, theme);
    };
    return (_ctx, _cache) => {
      const _component_n_icon = runtimeCore_esmBundler.resolveComponent("n-icon");
      const _component_n_text = runtimeCore_esmBundler.resolveComponent("n-text");
      const _component_n_card = runtimeCore_esmBundler.resolveComponent("n-card");
      const _component_n_ellipsis = runtimeCore_esmBundler.resolveComponent("n-ellipsis");
      return runtimeCore_esmBundler.openBlock(), runtimeCore_esmBundler.createElementBlock("div", _hoisted_1, [
        runtimeCore_esmBundler.createVNode(_component_n_card, {
          class: "card-box",
          size: "small",
          hoverable: "",
          embedded: "",
          onClick: createColorHandle
        }, {
          default: runtimeCore_esmBundler.withCtx(() => [
            runtimeCore_esmBundler.createVNode(_component_n_text, { class: "go-flex-items-center" }, {
              default: runtimeCore_esmBundler.withCtx(() => [
                _hoisted_2,
                runtimeCore_esmBundler.createVNode(_component_n_icon, { size: "16" }, {
                  default: runtimeCore_esmBundler.withCtx(() => [
                    runtimeCore_esmBundler.createVNode(reactivity_esmBundler.unref(AddIcon))
                  ]),
                  _: 1
                })
              ]),
              _: 1
            })
          ]),
          _: 1
        }),
        (runtimeCore_esmBundler.openBlock(true), runtimeCore_esmBundler.createElementBlock(runtimeCore_esmBundler.Fragment, null, runtimeCore_esmBundler.renderList(comChartColors.value, (value, key) => {
          return runtimeCore_esmBundler.openBlock(), runtimeCore_esmBundler.createBlock(_component_n_card, {
            key,
            class: shared_esmBundler.normalizeClass(["card-box", { selected: key === selectName.value }]),
            size: "small",
            hoverable: "",
            embedded: "",
            onClick: ($event) => selectTheme(key)
          }, {
            default: runtimeCore_esmBundler.withCtx(() => [
              runtimeCore_esmBundler.createElementVNode("div", _hoisted_3, [
                runtimeCore_esmBundler.createVNode(_component_n_ellipsis, { style: { "text-align": "left", "width": "60px" } }, {
                  default: runtimeCore_esmBundler.withCtx(() => [
                    runtimeCore_esmBundler.createTextVNode(shared_esmBundler.toDisplayString(value.name), 1)
                  ]),
                  _: 2
                }, 1024),
                (runtimeCore_esmBundler.openBlock(true), runtimeCore_esmBundler.createElementBlock(runtimeCore_esmBundler.Fragment, null, runtimeCore_esmBundler.renderList(fetchShowColors(value.color), (colorItem) => {
                  return runtimeCore_esmBundler.openBlock(), runtimeCore_esmBundler.createElementBlock("span", {
                    class: "theme-color-item",
                    key: colorItem,
                    style: shared_esmBundler.normalizeStyle({ backgroundColor: colorItem })
                  }, null, 4);
                }), 128))
              ]),
              runtimeCore_esmBundler.createElementVNode("div", {
                class: "theme-bottom",
                style: shared_esmBundler.normalizeStyle({ backgroundImage: colorBackgroundImage(value) })
              }, null, 4)
            ]),
            _: 2
          }, 1032, ["class", "onClick"]);
        }), 128)),
        runtimeCore_esmBundler.createVNode(reactivity_esmBundler.unref(CreateColor), {
          modelShow: createColorModelShow.value,
          "onUpdate:modelShow": _cache[0] || (_cache[0] = ($event) => createColorModelShow.value = $event)
        }, null, 8, ["modelShow"])
      ]);
    };
  }
});
exports.default = _sfc_main;
