import { defineComponent, toRefs, ref, computed, watch, resolveComponent, openBlock, createBlock, withCtx, createVNode, unref, createElementBlock, Fragment, renderList, createElementVNode, toDisplayString, resolveDynamicComponent, createCommentVNode } from "vue";
import { u as useChartEditStore, N as loadAsyncComponent, i as icon, _ as _export_sfc } from "./index-67bc0910.js";
import { C as ContentBox } from "./index-42e17fe3.js";
import { u as useChartLayoutStore, C as ChartLayoutStoreEnum } from "./chartLayoutStore-de4e7ebb.js";
var TabsEnum = /* @__PURE__ */ ((TabsEnum2) => {
  TabsEnum2["PAGE_SETTING"] = "pageSetting";
  TabsEnum2["CHART_SETTING"] = "chartSetting";
  TabsEnum2["CHART_ANIMATION"] = "chartAnimation";
  TabsEnum2["CHART_DATA"] = "chartData";
  TabsEnum2["CHART_EVENT"] = "chartEvent";
  return TabsEnum2;
})(TabsEnum || {});
const _sfc_main = /* @__PURE__ */ defineComponent({
  __name: "index",
  setup(__props) {
    const { getDetails } = toRefs(useChartLayoutStore());
    const { setItem } = useChartLayoutStore();
    const chartEditStore = useChartEditStore();
    const { ConstructIcon, FlashIcon, DesktopOutlineIcon, LeafIcon, RocketIcon } = icon.ionicons5;
    const ContentEdit = loadAsyncComponent(() => import("./index-b9067d4c.js"));
    const CanvasPage = loadAsyncComponent(() => import("./index-1ca50571.js"));
    const ChartSetting = loadAsyncComponent(() => import("./index-080cc22c.js"));
    const ChartData = loadAsyncComponent(() => import("./index-904b39c1.js").then((n) => n.i));
    loadAsyncComponent(() => import("./index-2fb343cc.js"));
    loadAsyncComponent(() => import("./index-17fdadc8.js"));
    const collapsed = ref(getDetails.value);
    const tabsSelect = ref(TabsEnum.CHART_SETTING);
    const collapsedHandle = () => {
      collapsed.value = true;
      setItem(ChartLayoutStoreEnum.DETAILS, true);
    };
    const expandHandle = () => {
      collapsed.value = false;
      setItem(ChartLayoutStoreEnum.DETAILS, false);
    };
    const selectTarget = computed(() => {
      const selectId = chartEditStore.getTargetChart.selectId;
      if (selectId.length !== 1)
        return void 0;
      const target = chartEditStore.componentList[chartEditStore.fetchTargetIndex()];
      if (target == null ? void 0 : target.isGroup) {
        tabsSelect.value = TabsEnum.CHART_SETTING;
      }
      return target;
    });
    watch(getDetails, (newData) => {
      if (newData) {
        collapsedHandle();
      } else {
        expandHandle();
      }
    });
    const globalTabList = [
      {
        key: TabsEnum.PAGE_SETTING,
        title: "页面配置",
        icon: DesktopOutlineIcon,
        render: CanvasPage
      }
    ];
    const chartsDefaultTabList = [
      {
        key: TabsEnum.CHART_SETTING,
        title: "参数设置",
        icon: ConstructIcon,
        render: ChartSetting
      }
      // {
      //   key: TabsEnum.CHART_ANIMATION,
      //   title: '动画',
      //   icon: LeafIcon,
      //   render: ChartAnimation
      // }
    ];
    const chartsTabList = [
      ...chartsDefaultTabList,
      {
        key: TabsEnum.CHART_DATA,
        title: "数据源",
        icon: FlashIcon,
        render: ChartData
      }
      // {
      //   key: TabsEnum.CHART_EVENT,
      //   title: '事件',
      //   icon: RocketIcon,
      //   render: ChartEvent
      // }
    ];
    return (_ctx, _cache) => {
      const _component_n_layout_content = resolveComponent("n-layout-content");
      const _component_n_icon = resolveComponent("n-icon");
      const _component_n_space = resolveComponent("n-space");
      const _component_n_tab_pane = resolveComponent("n-tab-pane");
      const _component_n_tabs = resolveComponent("n-tabs");
      const _component_n_layout_sider = resolveComponent("n-layout-sider");
      const _component_n_layout = resolveComponent("n-layout");
      return openBlock(), createBlock(_component_n_layout, {
        "has-sider": "",
        "sider-placement": "right"
      }, {
        default: withCtx(() => [
          createVNode(_component_n_layout_content, null, {
            default: withCtx(() => [
              createVNode(unref(ContentEdit))
            ]),
            _: 1
          }),
          createVNode(_component_n_layout_sider, {
            "collapse-mode": "transform",
            "collapsed-width": 0,
            width: 350,
            collapsed: collapsed.value,
            "native-scrollbar": false,
            "show-trigger": "bar",
            onCollapse: collapsedHandle,
            onExpand: expandHandle
          }, {
            default: withCtx(() => [
              createVNode(unref(ContentBox), {
                class: "go-content-configurations go-boderbox",
                "show-top": false,
                depth: 2
              }, {
                default: withCtx(() => [
                  !selectTarget.value ? (openBlock(), createBlock(_component_n_tabs, {
                    key: 0,
                    class: "tabs-box",
                    size: "small",
                    type: "segment"
                  }, {
                    default: withCtx(() => [
                      (openBlock(), createElementBlock(Fragment, null, renderList(globalTabList, (item) => {
                        return createVNode(_component_n_tab_pane, {
                          key: item.key,
                          name: item.key,
                          size: "small",
                          "display-directive": "show:lazy"
                        }, {
                          tab: withCtx(() => [
                            createVNode(_component_n_space, null, {
                              default: withCtx(() => [
                                createElementVNode("span", null, toDisplayString(item.title), 1),
                                createVNode(_component_n_icon, {
                                  size: "16",
                                  class: "icon-position"
                                }, {
                                  default: withCtx(() => [
                                    (openBlock(), createBlock(resolveDynamicComponent(item.icon)))
                                  ]),
                                  _: 2
                                }, 1024)
                              ]),
                              _: 2
                            }, 1024)
                          ]),
                          default: withCtx(() => [
                            (openBlock(), createBlock(resolveDynamicComponent(item.render)))
                          ]),
                          _: 2
                        }, 1032, ["name"]);
                      }), 64))
                    ]),
                    _: 1
                  })) : createCommentVNode("", true),
                  selectTarget.value ? (openBlock(), createBlock(_component_n_tabs, {
                    key: 1,
                    value: tabsSelect.value,
                    "onUpdate:value": _cache[0] || (_cache[0] = ($event) => tabsSelect.value = $event),
                    class: "tabs-box",
                    size: "small",
                    type: "segment"
                  }, {
                    default: withCtx(() => [
                      (openBlock(true), createElementBlock(Fragment, null, renderList(selectTarget.value.isGroup ? chartsDefaultTabList : chartsTabList, (item) => {
                        return openBlock(), createBlock(_component_n_tab_pane, {
                          key: item.key,
                          name: item.key,
                          size: "small",
                          "display-directive": "show:lazy"
                        }, {
                          tab: withCtx(() => [
                            createVNode(_component_n_space, null, {
                              default: withCtx(() => [
                                createElementVNode("span", null, toDisplayString(item.title), 1),
                                createVNode(_component_n_icon, {
                                  size: "16",
                                  class: "icon-position"
                                }, {
                                  default: withCtx(() => [
                                    (openBlock(), createBlock(resolveDynamicComponent(item.icon)))
                                  ]),
                                  _: 2
                                }, 1024)
                              ]),
                              _: 2
                            }, 1024)
                          ]),
                          default: withCtx(() => [
                            (openBlock(), createBlock(resolveDynamicComponent(item.render)))
                          ]),
                          _: 2
                        }, 1032, ["name"]);
                      }), 128))
                    ]),
                    _: 1
                  }, 8, ["value"])) : createCommentVNode("", true)
                ]),
                _: 1
              })
            ]),
            _: 1
          }, 8, ["collapsed"])
        ]),
        _: 1
      });
    };
  }
});
const index_vue_vue_type_style_index_0_scoped_ccb2e89a_lang = "";
const index = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-ccb2e89a"]]);
export {
  index as default
};
