'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var vue = require('vue');
var vueVirtualScroller_esm = require('../../../../node_modules/.pnpm/vue-virtual-scroller@2.0.0-beta.8_vue@3.2.37/node_modules/vue-virtual-scroller/dist/vue-virtual-scroller.esm.js');
var pluginVue_exportHelper = require('../../../../_virtual/plugin-vue_export-helper.js');

const _hoisted_1 = { class: "qd-table-v3__row-cell--fixed flex" };
const _hoisted_2 = { class: "qd-table-v3__row-cell--fixed flex" };
const __default__ = vue.defineComponent({
  name: "ElTableV3"
});
const _sfc_main = /* @__PURE__ */ vue.defineComponent({
  ...__default__,
  props: {
    width: { type: Number, required: true },
    itemSize: { type: Number, required: true, default: 80 },
    columns: { type: Array, required: true },
    dataList: { type: Array, required: true },
    height: { type: Number, required: true },
    keyField: { type: String, required: true, default: "id" },
    headerHeight: { type: Number, required: true, default: 60 },
    rowClass: { type: Function, required: true, default: () => "" }
  },
  setup(__props) {
    const props = __props;
    const scrollBarRef = vue.ref();
    const scrollerRef = vue.ref();
    const fixedLeftColumns = vue.computed(() => {
      return props.columns.filter((e) => e.fixed === "left");
    });
    const noFixedColumns = vue.computed(() => {
      return props.columns.filter((e) => e.fixed !== "left");
    });
    const totalWidth = vue.computed(() => {
      return props.columns.reduce((acc, item) => acc + item.width, 0);
    });
    vue.onMounted(() => {
      if (scrollBarRef.value && scrollerRef.value) {
        scrollBarRef.value.update();
      }
    });
    return (_ctx, _cache) => {
      var _a;
      const _component_el_scrollbar = vue.resolveComponent("el-scrollbar");
      return vue.openBlock(), vue.createBlock(_component_el_scrollbar, {
        ref_key: "scrollBarRef",
        ref: scrollBarRef,
        class: "qd-table-v3",
        "custom-el": (_a = scrollerRef.value) == null ? void 0 : _a.$el,
        "custom-extra-gap": __props.headerHeight,
        style: vue.normalizeStyle({
          "--row-total-width": vue.unref(totalWidth) + "px",
          "--vertical-bar-top": __props.headerHeight + 2 + "px"
        })
      }, {
        default: vue.withCtx(() => {
          var _a2;
          return [
            vue.createVNode(vue.unref(vueVirtualScroller_esm.RecycleScroller), {
              ref_key: "scrollerRef",
              ref: scrollerRef,
              items: __props.dataList,
              "item-size": __props.itemSize,
              style: vue.normalizeStyle({
                height: __props.height + "px",
                width: __props.width + "px"
              }),
              "key-field": __props.keyField,
              class: "qd-table-v3__table",
              onScroll: (_a2 = scrollBarRef.value) == null ? void 0 : _a2.handleScroll
            }, {
              before: vue.withCtx(() => [
                vue.createElementVNode("div", {
                  class: "qd-table-v3__header-row relative",
                  style: vue.normalizeStyle({
                    width: vue.unref(totalWidth) + "px"
                  })
                }, [
                  vue.createElementVNode("div", _hoisted_1, [
                    (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(vue.unref(fixedLeftColumns), (columnItem, columnIndex) => {
                      return vue.openBlock(), vue.createElementBlock("div", {
                        key: columnIndex,
                        style: vue.normalizeStyle({
                          width: columnItem.width + "px"
                        }),
                        class: vue.normalizeClass(["qd-table-v3__header-cell", columnItem.headerClass])
                      }, [
                        columnItem.headerCellRenderer ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(columnItem.headerCellRenderer), { key: 0 })) : (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 1 }, [
                          vue.createTextVNode(vue.toDisplayString(columnItem.title), 1)
                        ], 64))
                      ], 6);
                    }), 128))
                  ]),
                  (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(vue.unref(noFixedColumns), (columnItem, columnIndex) => {
                    return vue.openBlock(), vue.createElementBlock("div", {
                      key: columnIndex,
                      style: vue.normalizeStyle({
                        width: columnItem.width + "px"
                      }),
                      class: vue.normalizeClass(["qd-table-v3__header-cell", columnItem.headerClass])
                    }, [
                      columnItem.headerCellRenderer ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(columnItem.headerCellRenderer), { key: 0 })) : (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 1 }, [
                        vue.createTextVNode(vue.toDisplayString(columnItem.title), 1)
                      ], 64))
                    ], 6);
                  }), 128))
                ], 4)
              ]),
              default: vue.withCtx(({ item }) => [
                vue.createElementVNode("div", {
                  class: vue.normalizeClass(["qd-table-v3__row relative", __props.rowClass(item)]),
                  style: vue.normalizeStyle({
                    height: __props.itemSize + "px",
                    width: vue.unref(totalWidth) + "px"
                  })
                }, [
                  vue.createElementVNode("div", _hoisted_2, [
                    (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(vue.unref(fixedLeftColumns), (columnItem, columnIndex) => {
                      return vue.openBlock(), vue.createElementBlock("div", {
                        key: columnIndex,
                        style: vue.normalizeStyle({
                          width: columnItem.width + "px"
                        }),
                        class: vue.normalizeClass(["qd-table-v3__row-cell", columnItem.class])
                      }, [
                        (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(columnItem.cellRenderer({
                          rowData: item,
                          rowIndex: columnIndex
                        }))))
                      ], 6);
                    }), 128))
                  ]),
                  (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(vue.unref(noFixedColumns), (columnItem, columnIndex) => {
                    return vue.openBlock(), vue.createElementBlock("div", {
                      key: columnIndex,
                      style: vue.normalizeStyle({
                        width: columnItem.width + "px"
                      }),
                      class: vue.normalizeClass(["qd-table-v3__row-cell", columnItem.class])
                    }, [
                      (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(columnItem.cellRenderer({
                        rowData: item,
                        rowIndex: columnIndex
                      }))))
                    ], 6);
                  }), 128))
                ], 6)
              ]),
              _: 1
            }, 8, ["items", "item-size", "style", "key-field", "onScroll"])
          ];
        }),
        _: 1
      }, 8, ["custom-el", "custom-extra-gap", "style"]);
    };
  }
});
var TableV3 = /* @__PURE__ */ pluginVue_exportHelper["default"](_sfc_main, [["__file", "/home/judai/code/ddll-element-plus/packages/components/table-v3/src/table-v3.vue"]]);

exports["default"] = TableV3;
//# sourceMappingURL=table-v32.js.map
