import { defineComponent, ref, watch, resolveComponent, openBlock, createBlock, withCtx, createVNode, unref, createCommentVNode } from "vue";
import { bl as echartOptionProfixHandle, bm as LinearGradient, bn as use, bo as B, bp as install, bq as install$1, br as install$2, bs as install$3, bt as install$4, bu as install$5, bv as install$6 } from "./index-67bc0910.js";
const includes$1 = ["legend", "xAxis", "yAxis", "grid"];
const seriesHandle$1 = (color) => {
  const numHandle = (numsi, i) => parseInt(`${numsi * Math.random()}`, 10) * 2;
  const nums = [260, 251, 200, 334, 366, 256, 253];
  return color.map((item, index) => ({
    name: `data${index + 1}`,
    type: "bar",
    data: nums.map((numsItem, numsi) => numHandle(numsItem))
  }));
};
const option$1 = (color) => {
  return echartOptionProfixHandle(
    {
      tooltip: {
        trigger: "axis",
        showContent: false,
        axisPointer: {
          type: "shadow"
        }
      },
      grid: {
        left: "3%",
        right: "4%",
        bottom: "3%",
        containLabel: true
      },
      xAxis: {
        type: "category",
        data: color.map((e, i) => `data${i + 1}`),
        axisTick: {
          alignWithLabel: true
        }
      },
      yAxis: {
        show: true,
        type: "value"
      },
      series: seriesHandle$1(color || [])
    },
    includes$1
  );
};
const includes = ["legend", "xAxis", "yAxis", "grid"];
const seriesHandle = (color) => {
  const numHandle = (numsi, i) => parseInt(`${numsi * Math.random()}`, 10) * 2;
  const nums = [130, 251, 200, 334, 366, 456, 223];
  return color.map((item, index) => ({
    name: `data${index + 1}`,
    type: "line",
    smooth: true,
    lineStyle: {
      width: 1,
      type: "solid"
    },
    emphasis: {
      focus: "series"
    },
    areaStyle: {
      opacity: 0.8,
      color: new LinearGradient(0, 0, 0, 1, [
        {
          offset: 1,
          color: item
        },
        {
          offset: 0,
          color: item
        }
      ])
    },
    showSymbol: false,
    data: nums.reverse().map((numsItem, numsi) => numHandle(numsItem))
  }));
};
const option = (color) => {
  return echartOptionProfixHandle(
    {
      tooltip: {
        trigger: "axis",
        showContent: false,
        axisPointer: {
          type: "shadow"
        }
      },
      grid: {
        left: "3%",
        right: "4%",
        bottom: "3%",
        containLabel: true
      },
      xAxis: {
        type: "category",
        boundaryGap: false,
        data: color.map((e, i) => `data${i + 1}`),
        axisTick: {
          alignWithLabel: true
        }
      },
      yAxis: {
        show: true,
        type: "value"
      },
      series: seriesHandle(color || [])
    },
    includes
  );
};
const _sfc_main = /* @__PURE__ */ defineComponent({
  __name: "index",
  props: {
    color: {
      type: Array,
      required: true
    }
  },
  setup(__props) {
    const props = __props;
    use([install, install$1, install$2, install$3, install$4, install$5, install$6]);
    const barOption = ref();
    const lineOption = ref();
    const chartStyle = {
      width: "528px",
      height: "200px"
    };
    watch(
      () => props.color,
      (newData) => {
        barOption.value = option$1(newData);
        lineOption.value = option(newData);
      },
      {
        immediate: true,
        deep: true
      }
    );
    return (_ctx, _cache) => {
      const _component_n_tab_pane = resolveComponent("n-tab-pane");
      const _component_n_tabs = resolveComponent("n-tabs");
      const _component_n_card = resolveComponent("n-card");
      const _component_n_space = resolveComponent("n-space");
      return openBlock(), createBlock(_component_n_space, null, {
        default: withCtx(() => [
          barOption.value ? (openBlock(), createBlock(_component_n_card, {
            key: 0,
            class: "go-mt-3",
            bordered: false,
            role: "dialog",
            size: "small",
            "aria-modal": "true"
          }, {
            default: withCtx(() => [
              createVNode(_component_n_tabs, {
                type: "segment",
                size: "small",
                animated: ""
              }, {
                default: withCtx(() => [
                  createVNode(_component_n_tab_pane, {
                    name: "柱状图",
                    tab: "柱状图"
                  }, {
                    default: withCtx(() => [
                      createVNode(unref(B), {
                        ref: "vChartRefBar",
                        theme: { color: __props.color },
                        option: barOption.value,
                        "manual-update": true,
                        autoresize: "",
                        style: chartStyle
                      }, null, 8, ["theme", "option"])
                    ]),
                    _: 1
                  }),
                  createVNode(_component_n_tab_pane, {
                    name: "折线图",
                    tab: "折线图"
                  }, {
                    default: withCtx(() => [
                      createVNode(unref(B), {
                        ref: "vChartRefLine",
                        theme: { color: __props.color },
                        option: lineOption.value,
                        "manual-update": true,
                        autoresize: "",
                        style: chartStyle
                      }, null, 8, ["theme", "option"])
                    ]),
                    _: 1
                  })
                ]),
                _: 1
              })
            ]),
            _: 1
          })) : createCommentVNode("", true)
        ]),
        _: 1
      });
    };
  }
});
export {
  _sfc_main as default
};
