import { defineComponent as I, useCssVars as T, ref as g, computed as C, watch as E, onMounted as A, resolveComponent as G, createElementBlock as l, createCommentVNode as z, openBlock as u, createVNode as H, normalizeStyle as d, Fragment as J, renderList as M, createElementVNode as w, toDisplayString as $, unref as p, withCtx as P } from "vue";
import { debounce as f, cloneDeep as y, isEqual as V } from "lodash";
import { nanoid as O } from "nanoid";
import { RecycleScroller as K } from "vue-virtual-scroller";
import "vue-virtual-scroller/dist/vue-virtual-scroller.css";
import { SHJDatasourceV2 as Q } from "../../commons/core/datasource/index.mjs";
const U = ["onClick", "onMouseenter", "onMouseout"], X = ["onClick"], Y = I({ name: "zv-text-table-basic" }), se = /* @__PURE__ */ I({
  ...Y,
  props: {
    basicOption: {},
    useEvents: {},
    sources: {},
    uuid: {}
  },
  emits: ["on-click-item", "on-click-row", "on-mouseenter-row", "on-mouseout-row"],
  setup(D, { expose: L, emit: R }) {
    T((e) => ({
      "832a4e1c": e.basicOption.css.table.borderWidth + "px",
      "52e7b726": e.basicOption.css.table.borderStyle,
      "5203c8d8": e.basicOption.css.table.borderColor,
      "3e50e718": e.basicOption.css.table.paddingLeft + "px",
      "08a0254c": e.basicOption.css.table.alignItems,
      "51512c30": e.basicOption.css.table.justifyContent,
      "0d5408e0": e.basicOption.css.header.background,
      "6d4373e4": e.basicOption.css.header.height + "px",
      e220d87e: e.basicOption.css.header.color,
      "4b2ea07b": e.basicOption.css.header.fontSize + "px",
      "1cf72a09": e.basicOption.css.header.fontWeight,
      "619d0000": e.basicOption.css.header.fontStyle,
      "8311940e": e.basicOption.css.body.height + "px",
      "2a6e799b": e.basicOption.css.body.background,
      e1c58a54: e.basicOption.css.body.color,
      "1e7a3150": e.basicOption.css.body.fontSize + "px",
      "4e0fa814": e.basicOption.css.body.fontWeight,
      "235b9495": e.basicOption.css.body.fontStyle
    }));
    const b = R, m = g(O()), r = g([]), i = D, W = () => {
      if (!r.value.length) return;
      const e = Object.keys(r.value[0]), o = i.basicOption.columns || [], s = e.map((t, a) => {
        const n = o.find((S) => S.name === t) || {};
        return {
          name: n.name || t,
          // 如果用户没有提供 name，使用 key 作为 name
          label: n.label || t,
          // 如果用户没有提供 label，使用 key 作为 label
          visible: n.visible !== void 0 ? n.visible : !0,
          // 如果用户没有提供 visible，默认可见
          index: n.index !== void 0 ? n.index : a,
          // 如果用户没有提供 index，使用默认顺序
          width: n.width || { auto: !0, width: 100 },
          // 如果用户没有提供 width，使用默认宽度
          font: n.font || { auto: !0, color: "#ffffff", fontSize: 12, fontStyle: "normal" }
          // 如果用户没有提供 font，使用默认字体
        };
      });
      i.basicOption.columns = s.sort((t, a) => t.index - a.index);
    }, v = C(() => i.basicOption.columns || []), h = C(() => v.value.filter((e) => e.visible).map((e) => e.name)), c = () => {
      Q.parse({
        tId: i.uuid,
        sources: i.sources,
        callback: (e) => {
          try {
            window.SHJParseEvent(i.useEvents, "dataListener", r), m.value = O(), r.value = y(e.data[0].data).map((o, s) => ({
              id: o.id || s,
              // 使用索引作为 id
              ...o
            })), W();
          } catch {
            window.SHJParseEvent(i.useEvents, "dataListener", null), m.value = O(), r.value = [];
          }
        }
      });
    }, k = (e) => {
      const o = v.value.find((s) => s.name === e);
      return o != null && o.width.auto ? null : `${o == null ? void 0 : o.width.width}px`;
    }, B = (e) => {
      const o = v.value.find((t) => t.name === e);
      if (!o) return {};
      const s = {
        whiteSpace: "nowrap",
        // 默认不换行
        textOverflow: "ellipsis",
        // 默认溢出省略号
        overflow: "hidden"
        // 默认隐藏溢出内容
      };
      return {
        color: o.font.color,
        fontSize: `${o.font.fontSize}px`,
        fontStyle: o.font.fontStyle,
        ...s,
        ...o.textStyle
        // 用户自定义样式
      };
    }, N = f((e, o) => {
      const s = { row: e, rowIndex: o };
      b("on-click-row", s), window.SHJParseEvent(i.useEvents, "on-click-row", s);
    }, 100), j = f((e, o) => {
      const s = { row: e, rowIndex: o };
      b("on-mouseenter-row", s), window.SHJParseEvent(i.useEvents, "on-mouseenter-row", s);
    }, 100), q = f((e, o) => {
      const s = { row: e, rowIndex: o };
      b("on-mouseout-row", s), window.SHJParseEvent(i.useEvents, "on-mouseout-row", s);
    }, 100), F = f((e, o, s, t) => {
      const a = { row: e, item: o, rowIndex: s, columnIndex: t };
      b("on-click-item", a), window.SHJParseEvent(i.useEvents, "on-click-item", a);
    }, 100);
    return E(() => y(i.sources), (e, o) => {
      V(e, o) || c();
    }, { deep: !0 }), E(() => y(i.basicOption), (e, o) => {
      V(e, o) || c();
    }, { deep: !0 }), A(() => c()), L({
      refresh: () => c(),
      refreshView: () => c(),
      refreshData: () => c()
    }), (e, o) => {
      const s = G("el-tooltip");
      return r.value.length > 0 ? (u(), l("div", {
        key: m.value,
        class: "table-scroll"
      }, [
        e.basicOption.css.header.show ? (u(), l("div", {
          key: 0,
          class: "table-header",
          style: d({
            "--header-background-image": `url(${e.basicOption.css.header.background})`
          })
        }, [
          (u(!0), l(J, null, M(h.value, (t) => (u(), l("div", {
            key: t,
            class: "th",
            style: d({ width: k(t) })
          }, [
            w("p", null, $(t), 1)
          ], 4))), 128))
        ], 4)) : z("", !0),
        H(p(K), {
          id: "",
          class: "table-body",
          items: r.value,
          "item-size": e.basicOption.css.body.height,
          "key-field": "id"
        }, {
          default: P(({ item: t, index: a }) => [
            w("div", {
              class: "tr",
              style: d({
                "--row-hover": e.basicOption.css.hoverColor,
                "--odd-background": e.basicOption.css.oddBackground
              }),
              onClick: (n) => p(N)(t, a),
              onMouseenter: (n) => p(j)(t, a),
              onMouseout: (n) => p(q)(t, a)
            }, [
              (u(!0), l(J, null, M(h.value, (n) => (u(), l("div", {
                key: n,
                class: "td",
                style: d({ width: k(n) }),
                onClick: (S) => p(F)(t, t[n], a, h.value.indexOf(n))
              }, [
                H(s, {
                  content: t[n]
                }, {
                  default: P(() => [
                    w("p", {
                      style: d(B(n))
                    }, $(t[n]), 5)
                  ]),
                  _: 2
                }, 1032, ["content"])
              ], 12, X))), 128))
            ], 44, U)
          ]),
          _: 1
        }, 8, ["items", "item-size"])
      ])) : z("", !0);
    };
  }
});
export {
  se as default
};
