"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 utils = require("../../../../../utils/utils.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 designStore = require("../../../../../store/modules/designStore/designStore.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");
require("../../../../../settings/designSetting.js");
const chartEditStore = require("../../../../../store/modules/chartEditStore/chartEditStore.js");
const chartLayoutStore_d = require("../../../../../store/modules/chartLayoutStore/chartLayoutStore.d.js");
const index$1 = require("../../../../../packages/index.js");
const index = require("../LayersStatus/index.vue.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 _hoisted_1 = { class: "go-flex-center item-content" };
const _hoisted_2 = { class: "list-text" };
const _sfc_main = /* @__PURE__ */ runtimeCore_esmBundler.defineComponent({
  __name: "index",
  props: {
    componentData: {
      type: Object,
      required: true
    },
    isGroup: {
      type: Boolean,
      default: false
    },
    layerMode: {
      type: String,
      default: chartLayoutStore_d.LayerModeEnum.THUMBNAIL
    }
  },
  setup(__props) {
    const props = __props;
    runtimeDom_esmBundler.useCssVars((_ctx) => ({
      "639cf5ae": themeColor.value
    }));
    const designStore$1 = designStore.useDesignStore();
    const chartEditStore$1 = chartEditStore.useChartEditStore();
    const imageInfo = reactivity_esmBundler.ref("");
    const fetchImageUrl = async () => {
      imageInfo.value = await index$1.fetchImages(props.componentData.chartConfig);
    };
    fetchImageUrl();
    const themeColor = runtimeCore_esmBundler.computed(() => {
      return designStore$1.getAppTheme;
    });
    const select = runtimeCore_esmBundler.computed(() => {
      const id = props.componentData.id;
      return chartEditStore$1.getTargetChart.selectId.find((e) => e === id);
    });
    const hover = runtimeCore_esmBundler.computed(() => {
      return props.componentData.id === chartEditStore$1.getTargetChart.hoverId;
    });
    const status = runtimeCore_esmBundler.computed(() => {
      return props.componentData.status;
    });
    const selectText = runtimeCore_esmBundler.computed(() => {
      return props.layerMode === chartLayoutStore_d.LayerModeEnum.TEXT;
    });
    return (_ctx, _cache) => {
      const _component_n_image = runtimeCore_esmBundler.resolveComponent("n-image");
      const _component_n_ellipsis = runtimeCore_esmBundler.resolveComponent("n-ellipsis");
      return runtimeCore_esmBundler.openBlock(), runtimeCore_esmBundler.createElementBlock("div", {
        class: shared_esmBundler.normalizeClass(["go-content-layers-list-item", { hover: hover.value, select: select.value, "list-mini": selectText.value }])
      }, [
        runtimeCore_esmBundler.createElementVNode("div", _hoisted_1, [
          runtimeCore_esmBundler.createVNode(_component_n_image, {
            class: "list-img",
            "object-fit": "contain",
            "preview-disabled": "",
            src: imageInfo.value,
            "fallback-src": reactivity_esmBundler.unref(utils.requireErrorImg)()
          }, null, 8, ["src", "fallback-src"]),
          runtimeCore_esmBundler.createVNode(_component_n_ellipsis, { style: { "margin-right": "auto" } }, {
            default: runtimeCore_esmBundler.withCtx(() => [
              runtimeCore_esmBundler.createElementVNode("span", _hoisted_2, shared_esmBundler.toDisplayString(props.componentData.chartConfig.title), 1)
            ]),
            _: 1
          }),
          runtimeCore_esmBundler.createVNode(reactivity_esmBundler.unref(index.default), {
            isGroup: __props.isGroup,
            hover: hover.value,
            status: status.value
          }, null, 8, ["isGroup", "hover", "status"])
        ]),
        runtimeCore_esmBundler.createElementVNode("div", {
          class: shared_esmBundler.normalizeClass({ "select-modal": select.value })
        }, null, 2)
      ], 2);
    };
  }
});
exports.default = _sfc_main;
