import { defineComponent, useCssVars, unref, toRefs, reactive, computed, onMounted, watch, openBlock, createElementBlock, normalizeClass, toDisplayString, createCommentVNode, Fragment, renderList, normalizeStyle, createElementVNode, createVNode, mergeProps, withCtx } from "vue";
import { Vue3SeamlessScroll } from "vue3-seamless-scroll";
import "./index.vue_vue_type_style_index_0_scoped_true_lang.mjs";
import _export_sfc from "../../../../_virtual/plugin-vue_export-helper.mjs";
const _hoisted_1 = { class: "seamless_scroll_box" };
const _hoisted_2 = {
  key: 0,
  class: "order_cloum header_item"
};
const _hoisted_3 = ["align"];
const _hoisted_4 = {
  key: 0,
  class: "order_cloum"
};
const _hoisted_5 = ["align"];
const __default__ = defineComponent({ name: "ETableGeneral" });
const _sfc_main = /* @__PURE__ */ defineComponent({
  ...__default__,
  props: {
    chartConfig: {
      type: Object,
      required: true
    }
  },
  setup(__props) {
    const props = __props;
    useCssVars((_ctx) => ({
      "4287fb1c": status.gap[0] + "px",
      "776e365d": status.gap[1] + "px",
      "6e8917d8": status.mergedConfig.tableType == 1 ? status.mergedConfig.headerBGC : "",
      "87e71428": status.mergedConfig.tableType == 1 ? status.mergedConfig.borderRadius + "px" : 0,
      "100eb969": status.mergedConfig.headerFW,
      "2805781e": status.mergedConfig.headerFS + "px",
      "100eb955": status.mergedConfig.headerFC,
      "681b6838": status.mergedConfig.headerHeight + "px",
      "4d2fe666": !status.mergedConfig.modelValue ? "auto" : "hidden",
      "074d1526": status.mergedConfig.tableType == 1 && status.mergedConfig.borderRadius + "px",
      "6daeca06": status.mergedConfig.dataFW,
      "b04f7cbe": status.mergedConfig.dataFS + "px",
      "6daec9f2": status.mergedConfig.dataFC,
      "a4fe828a": status.mergedConfig.tableType == 1 && status.mergedConfig.oddRowBGC,
      "35b0fe9a": status.mergedConfig.tableType == 2 && status.mergedConfig.oddRowBGC,
      "5377664c": status.mergedConfig.tableType == 2 && status.mergedConfig.borderRadius + "px",
      "387a39d4": status.mergedConfig.tableType == 1 && status.mergedConfig.evenRowBGC,
      "619a9f17": status.mergedConfig.tableType == 2 && status.mergedConfig.evenRowBGC,
      "7650c688": unref(rowsHeight) + "px",
      "7d5afaa0": status.mergedConfig.orderWidth + "px",
      "01e6ecda": status.mergedConfig.orderHighLight && status.mergedConfig.orderBR + "px",
      "39b2c254": status.mergedConfig.orderHighLight && status.mergedConfig.orderFZ + "px",
      "5a8aea4e": status.mergedConfig.orderHighLight && status.mergedConfig.orderFZ * 1.5 + "px",
      "0f287af8": status.mergedConfig.tableType == 2 && status.mergedConfig.headerBGC
    }));
    const { w, h } = toRefs(props.chartConfig.attr);
    console.log(props.chartConfig, w, h, "wh");
    const status = reactive({
      defaultConfig: {
        tableType: 1,
        borderRadius: 4,
        columnWidth: [],
        align: [],
        gap: [0, 0],
        header: [],
        headerShow: true,
        headerBGC: "#00BAFF",
        headerFS: 24,
        headerFW: 600,
        headerFC: "#ffffff",
        headerHeight: 35,
        dataset: [],
        oddRowBGC: "#003B51",
        evenRowBGC: "#003B51",
        dataFS: 24,
        dataFW: 600,
        dataFC: "gray",
        modelValue: true,
        step: 0.3,
        limitScrollNum: 5,
        hover: true,
        singleWaitTime: 1e3,
        ease: "ease",
        wheel: true,
        orderName: "\u5E8F\u53F7",
        orderShow: true,
        orderWidth: 100,
        orderFC: "#ffffff",
        orderFZ: 28,
        orderHighLight: false,
        orderHC: ["#ff0000", "#ff8f1f", "#e4c91c"],
        orderBW: 2,
        orderBR: 2
      },
      mergedConfig: props.chartConfig.option,
      header: [],
      rowsData: [],
      columnWidth: [],
      aligns: [],
      gap: [10, 10],
      orderHC: []
    });
    const rowsHeight = computed(
      () => (h.value - status.gap[0] * status.mergedConfig.limitScrollNum - (status.mergedConfig.headerShow && status.header.length ? status.mergedConfig.headerHeight : 0)) / (status.mergedConfig.limitScrollNum - 1)
    );
    const calcData = () => {
      mergeConfig();
      calcAligns();
      calcColumnWidth();
      calcGap();
      calcHeaderData();
      calcOrderHC();
      calcRowsData();
    };
    onMounted(() => {
      calcData();
    });
    const mergeConfig = () => {
      status.mergedConfig = {
        ...status.defaultConfig,
        ...props.chartConfig.option
      };
      console.log(status.header.length, status.mergedConfig, "wh");
    };
    const calcColumnWidth = () => {
      let { columnWidth } = status.mergedConfig;
      if (!columnWidth.length) {
        status.aligns = [];
        return;
      }
      columnWidth = [...columnWidth];
      status.columnWidth = columnWidth;
    };
    const calcAligns = () => {
      let { align } = status.mergedConfig;
      if (!align.length) {
        status.aligns = [];
        return;
      }
      align = [...align];
      status.aligns = align;
    };
    const calcGap = () => {
      let { rowGap, columnGap } = status.mergedConfig;
      status.gap = [columnGap, rowGap];
    };
    const calcHeaderData = () => {
      let { header } = status.mergedConfig;
      if (!header.length) {
        status.header = [];
        return;
      }
      header = [...header];
      status.header = header;
    };
    const calcOrderHC = () => {
      let { orderHC } = status.mergedConfig;
      if (!orderHC.length) {
        status.orderHC = [];
        return;
      }
      orderHC = [...orderHC];
      status.orderHC = orderHC;
    };
    const calcRowsData = () => {
      let { dataset } = status.mergedConfig;
      console.log(dataset, "dataset");
      if (!dataset.length) {
        status.rowsData = [];
        return;
      }
      dataset = [...dataset];
      status.rowsData = dataset;
    };
    const onRestart = () => {
      try {
        if (!status.mergedConfig)
          return;
        calcData();
      } catch (error) {
      }
    };
    watch(
      () => props.chartConfig.option,
      () => {
        onRestart();
      },
      { deep: true }
    );
    const Vue3SeamlessData = reactive({
      list: computed(() => status.rowsData),
      modelValue: computed(() => status.mergedConfig.modelValue),
      copyNum: computed(() => status.mergedConfig.modelValue ? 1 : 0),
      step: computed(() => status.mergedConfig.step),
      limitScrollNum: computed(() => status.mergedConfig.limitScrollNum),
      hover: computed(() => status.mergedConfig.hover),
      singleWaitTime: computed(() => status.mergedConfig.singleWaitTime),
      ease: computed(() => status.mergedConfig.ease),
      wheel: computed(() => status.mergedConfig.wheel)
    });
    return (_ctx, _cache) => {
      return openBlock(), createElementBlock("div", _hoisted_1, [
        status.mergedConfig.headerShow && status.header.length ? (openBlock(), createElementBlock("div", {
          key: 0,
          class: normalizeClass(["header", {
            scroll_bar_header: !status.mergedConfig.modelValue && status.rowsData.length >= status.mergedConfig.limitScrollNum
          }])
        }, [
          status.mergedConfig.orderShow ? (openBlock(), createElementBlock("div", _hoisted_2, toDisplayString(status.mergedConfig.orderName), 1)) : createCommentVNode("", true),
          (openBlock(true), createElementBlock(Fragment, null, renderList(status.header, (headerItem, i) => {
            return openBlock(), createElementBlock("div", {
              class: "header_item header_item",
              key: headerItem,
              style: normalizeStyle(`
        ${status.columnWidth[i] == "auto" ? "flex-grow:1;" : "width:" + status.columnWidth[i] + "px"};
      `),
              align: status.aligns[i]
            }, toDisplayString(headerItem), 13, _hoisted_3);
          }), 128))
        ], 2)) : createCommentVNode("", true),
        createElementVNode("div", {
          class: normalizeClass({
            scroll_bar: !status.mergedConfig.modelValue && status.rowsData.length >= status.mergedConfig.limitScrollNum
          }),
          style: normalizeStyle(`height: ${unref(h) - (status.mergedConfig.headerShow ? status.mergedConfig.headerHeight + status.gap[0] : 0)}px;`)
        }, [
          createVNode(unref(Vue3SeamlessScroll), mergeProps({ class: "Vue3_SeamlessScroll" }, { ...Vue3SeamlessData }), {
            default: withCtx(() => [
              (openBlock(true), createElementBlock(Fragment, null, renderList(status.rowsData, (rowData, index) => {
                return openBlock(), createElementBlock("div", {
                  key: index,
                  class: "list_row"
                }, [
                  status.mergedConfig.orderShow ? (openBlock(), createElementBlock("div", _hoisted_4, [
                    createElementVNode("div", {
                      style: normalizeStyle(`${status.mergedConfig.orderHighLight && `
              color:${status.orderHC[index] || status.mergedConfig.orderFC};
              border:${status.mergedConfig.orderBW}px solid ${status.mergedConfig.orderHC[index] || status.mergedConfig.orderFC};
              `}`)
                    }, toDisplayString(index + 1), 5)
                  ])) : createCommentVNode("", true),
                  (openBlock(true), createElementBlock(Fragment, null, renderList(rowData, (item, i) => {
                    return openBlock(), createElementBlock("div", {
                      key: i,
                      class: "data_cloum",
                      style: normalizeStyle(`${status.columnWidth[i] == "auto" ? "flex-grow:1;" : "width:" + status.columnWidth[i] + "px"};`),
                      align: status.aligns[i]
                    }, toDisplayString(item), 13, _hoisted_5);
                  }), 128))
                ]);
              }), 128))
            ]),
            _: 1
          }, 16)
        ], 6)
      ]);
    };
  }
});
var _ETableGeneral = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-6c0113ab"]]);
export { _ETableGeneral as default };
