@dt-frames/ui 2.0.11 → 2.0.12

package/es/components/table/index.js

@@ -1,5 +1,5 @@
-import { useAppStore, useSlots, error, http, useApp, getDynamicProps, isBoolean, isFunction, getPopupContainer, useI18n, isNumber, isArray, isObject, isString, useMessage, isNullAndUnDef, windowResizeFn, getDictValueByCode, formatNumber, isVnode } from "@dt-frames/core";
-import { useSlots as useSlots$1, unref, ref, watch, onUnmounted, defineComponent, useAttrs, resolveDirective, openBlock, createElementBlock, Fragment, renderList, withDirectives, createVNode, withCtx, createTextVNode, toDisplayString, createElementVNode, normalizeClass, normalizeStyle, createCommentVNode, createBlock, provide, inject, h as h$1, computed, mergeProps, nextTick, toRaw as toRaw$1, reactive, watchEffect, normalizeProps, renderSlot, onMounted, createSlots, guardReactiveProps } from "vue";
+import { useAppStore, useSlots, error, http, useApp, getDynamicProps, isBoolean, isFunction, getPopupContainer, useI18n, isNumber, isArray, isObject, isString, useMessage, isNullAndUnDef, windowResizeFn, off, on, getDictValueByCode, formatNumber, isVnode } from "@dt-frames/core";
+import { useSlots as useSlots$1, unref, ref, watch, onUnmounted, defineComponent, useAttrs, resolveDirective, openBlock, createElementBlock, Fragment, renderList, withDirectives, createVNode, withCtx, createTextVNode, toDisplayString, createElementVNode, normalizeClass, normalizeStyle, createCommentVNode, createBlock, provide, inject, h as h$1, computed as computed$1, mergeProps, nextTick, toRaw as toRaw$1, reactive, watchEffect, normalizeProps, renderSlot, onMounted, createSlots, guardReactiveProps } from "vue";
 import { useHeader } from "../../theme";
 import { Tooltip, MenuItem, Menu, Dropdown, Checkbox as Checkbox$1, Divider, Col, Row, Button, CheckboxGroup, Popover as Popover$1, Table } from "ant-design-vue/es";
 import "ant-design-vue/es/table/style";
@@ -7,7 +7,7 @@ import { omit, cloneDeep, isEqual } from "lodash-es";
 import "ant-design-vue/es/dropdown/style";
 import "ant-design-vue/es/menu/style";
 import "ant-design-vue/es/tooltip/style";
-import { useDebounceFn, useFullscreen, isFunction as isFunction$1 } from "@vueuse/core";
+import { useDebounceFn, useFullscreen, isFunction as isFunction$1, tryOnMounted } from "@vueuse/core";
 import { Input, InputNumber, Select, TreeSelect, Switch, Checkbox, DatePicker, TimePicker, Popover } from "ant-design-vue";
 import { DtFormButtons } from "../form";
 import { useModal, DtModal, useModalOut } from "../modal";
@@ -237,7 +237,7 @@ const _sfc_main$9 = /* @__PURE__ */ defineComponent({
               }, 1024)
             ])), [
               [_directive_auth, item.auth]
-            ]) : createCommentVNode("", true)
+            ]) : createCommentVNode("v-if", true)
           ], 64);
         }), 256))
       ])) : (openBlock(), createBlock(_component_ADropdown, {
@@ -264,7 +264,7 @@ const _sfc_main$9 = /* @__PURE__ */ defineComponent({
                       createElementVNode("span", _hoisted_5$1, toDisplayString(item.label()), 1)
                     ]),
                     _: 2
-                  }, 1032, ["onClick"])) : createCommentVNode("", true)
+                  }, 1032, ["onClick"])) : createCommentVNode("v-if", true)
                 ])), [
                   [_directive_auth, item.auth]
                 ]);
@@ -281,6 +281,14 @@ const _sfc_main$9 = /* @__PURE__ */ defineComponent({
     };
   }
 });
+const _export_sfc = (sfc, props2) => {
+  const target = sfc.__vccOpts || sfc;
+  for (const [key, val] of props2) {
+    target[key] = val;
+  }
+  return target;
+};
+const TableAction = /* @__PURE__ */ _export_sfc(_sfc_main$9, [["__file", "D:/dt/dt-frame-front/dt-frames/frames/packages/ui/src/components/table/src/components/TableAction.vue"]]);
 const tableKey = Symbol("dt-page");
 function createTableInstance(instance) {
   provide(tableKey, instance);
@@ -349,14 +357,14 @@ const _sfc_main$8 = /* @__PURE__ */ defineComponent({
     const ruleVisible = ref(false);
     const optionsRef = ref([]);
     const currentValueRef = ref(props2.value);
-    const getComponent = computed(() => props2.column?.editComponent || "Input");
-    const getRuleVisible = computed(() => {
+    const getComponent = computed$1(() => props2.column?.editComponent || "Input");
+    const getRuleVisible = computed$1(() => {
       return unref(ruleMessage) && unref(ruleVisible);
     });
-    const getWrapperClass = computed(() => {
+    const getWrapperClass = computed$1(() => {
       return `edit-cell-align-${align}`;
     });
-    const getIsCheckComp = computed(() => {
+    const getIsCheckComp = computed$1(() => {
       const component = unref(getComponent);
       return ["Checkbox", "Switch"].includes(component);
     });
@@ -369,15 +377,15 @@ const _sfc_main$8 = /* @__PURE__ */ defineComponent({
     const setTableValue = () => {
       props2.record[props2.column.dataIndex] = unref(currentValueRef);
     };
-    const getComponentProps = computed(() => {
+    const getComponentProps = computed$1(() => {
       const isCheckValue = unref(getIsCheckComp);
       const valueField = isCheckValue ? "checked" : "value";
       const val = unref(currentValueRef);
       const value = isCheckValue ? isNumber(val) && isBoolean(val) ? val : !!val : val;
       let compProps = props2.column?.editComponentProps ?? {};
-      const { record, column, index } = props2;
+      const { record, column, index: index2 } = props2;
       if (isFunction(compProps)) {
-        compProps = compProps({ text: val, record, column, index }) ?? {};
+        compProps = compProps({ text: val, record, column, index: index2 }) ?? {};
       }
       if (unref(getComponent) === "InputNumber") {
         compProps = {
@@ -457,8 +465,9 @@ const _sfc_main$8 = /* @__PURE__ */ defineComponent({
     };
   }
 });
+const EditableCell = /* @__PURE__ */ _export_sfc(_sfc_main$8, [["__file", "D:/dt/dt-frame-front/dt-frames/frames/packages/ui/src/components/table/src/components/editTable/EditTableCell.vue"]]);
 function renderEditCell(column) {
-  return ({ text: value, record, index }) => {
+  return ({ text: value, record, index: index2 }) => {
     record.onValid = async () => {
       if (isArray(record?.validCbs)) {
         const validFns = (record?.validCbs || []).map((fn) => fn());
@@ -486,11 +495,11 @@ function renderEditCell(column) {
       }
       return true;
     };
-    return h(_sfc_main$8, {
+    return h(EditableCell, {
       value,
       record,
       column,
-      index
+      index: index2
     });
   };
 }
@@ -526,7 +535,7 @@ function handleChildren(children, ellipsis) {
 function handleIndexColumn(propsRef, getPaginationRef, columns) {
   const { getIsZH } = useHeader();
   const { t } = useI18n("UI");
-  const { showIndexColumn, indexColumnProps, isTreeTable } = unref(propsRef);
+  const { showIndexColumn, indexColumnProps, isTreeTable, virtual } = unref(propsRef);
   let pushIndexColumns = false;
   if (unref(isTreeTable)) {
     return;
@@ -547,15 +556,17 @@ function handleIndexColumn(propsRef, getPaginationRef, columns) {
     width: unref(getIsZH) ? 50 : 70,
     title: t("NUMBER"),
     align: "center",
-    customRender: ({ index }) => {
+    customRender: ({ index: index2, renderIndex, record }) => {
+      if (virtual && record?.index)
+        return record?.index;
       const getPagination = unref(getPaginationRef);
       const { appConf } = useAppStore();
       const { defaultPageSize } = appConf.ui.table;
       if (isBoolean(getPagination)) {
-        return `${index + 1}`;
+        return `${index2 + 1}`;
       }
       const { current = 1, pageSize = defaultPageSize } = getPagination;
-      return ((current < 1 ? 1 : current) - 1) * pageSize + index + 1;
+      return ((current < 1 ? 1 : current) - 1) * pageSize + index2 + 1;
     },
     ...isFixedLeft ? {
       fixed: "left"
@@ -593,13 +604,13 @@ function handleActionColumn(propsRef, columns) {
     };
     columns.push({
       ...columnObj,
-      customRender: ({ record, index }) => {
+      customRender: ({ record, index: index2 }) => {
         return h$1(
-          _sfc_main$9,
+          TableAction,
           omit({
             ...columnObj,
             record,
-            index
+            index: index2
           }, "align")
         );
       }
@@ -633,10 +644,10 @@ function useColumns(propsRef, getPaginationRef, tableElRef) {
   const columnsRef = ref(unref(propsRef).columns);
   let cacheColumns = unref(propsRef).columns;
   const { appConf } = useAppStore();
-  const getColumnsRef = computed(() => {
+  const getColumnsRef = computed$1(() => {
     const columns = cloneDeep(unref(columnsRef));
     const { ellipsis } = unref(propsRef);
-    columns.forEach((it, index) => {
+    columns.forEach((it, index2) => {
       it.class = it.class ?? "";
       if (!it.class.split(" ").includes("__column")) {
         it.class = `${it.class} __column`;
@@ -656,7 +667,7 @@ function useColumns(propsRef, getPaginationRef, tableElRef) {
     handleActionColumn(propsRef, columns);
     return columns;
   });
-  const getViewColumns = computed(() => {
+  const getViewColumns = computed$1(() => {
     const viewColumns = sortFixedColumn(unref(getColumnsRef));
     const columns = cloneDeep(viewColumns);
     return columns.filter((column) => isIfShow(column)).map((column) => {
@@ -770,7 +781,7 @@ function useColumns(propsRef, getPaginationRef, tableElRef) {
   };
 }
 function useCustomRow(propsRef, { setSelectedRowKeys, getSelectedRowKeys, clearSelectedRowKeys, emits }) {
-  const customRow = (record, index) => {
+  const customRow = (record, index2) => {
     return {
       onClick: (e) => {
         e?.stopPropagation();
@@ -824,19 +835,19 @@ function useCustomRow(propsRef, { setSelectedRowKeys, getSelectedRowKeys, clearS
           }
         }
         handleClick();
-        emits("row-click", record, index, e);
+        emits("row-click", record, index2, e);
       },
       onDblclick: (event) => {
-        emits("row-dbClick", record, index, event);
+        emits("row-dbClick", record, index2, event);
       },
       onContextmenu: (event) => {
-        emits("row-contextmenu", record, index, event);
+        emits("row-contextmenu", record, index2, event);
       },
       onMouseenter: (event) => {
-        emits("row-mouseenter", record, index, event);
+        emits("row-mouseenter", record, index2, event);
       },
       onMouseleave: (event) => {
-        emits("row-mouseleave", record, index, event);
+        emits("row-mouseleave", record, index2, event);
       }
     };
   };
@@ -859,7 +870,7 @@ function useDataSource(propsRef, {
       immediate: true
     }
   );
-  const getDataSourceRef = computed(() => {
+  const getDataSourceRef = computed$1(() => {
     return unref(dataSourceRef);
   });
   function handleTableChange(pagination, filters, sorter) {
@@ -958,7 +969,7 @@ const _sfc_main$7 = /* @__PURE__ */ defineComponent({
       const _component_ATooltip = Tooltip;
       return openBlock(), createBlock(_component_ATooltip, { placement: "top" }, {
         title: withCtx(() => [
-          !unref(isFullscreen) ? (openBlock(), createElementBlock("span", _hoisted_1$6, toDisplayString(unref(t)("FULLSCREEN")), 1)) : createCommentVNode("", true)
+          !unref(isFullscreen) ? (openBlock(), createElementBlock("span", _hoisted_1$6, toDisplayString(unref(t)("FULLSCREEN")), 1)) : createCommentVNode("v-if", true)
         ]),
         default: withCtx(() => [
           createElementVNode("span", {
@@ -975,6 +986,7 @@ const _sfc_main$7 = /* @__PURE__ */ defineComponent({
     };
   }
 });
+const FullscreenSetting = /* @__PURE__ */ _export_sfc(_sfc_main$7, [["__file", "D:/dt/dt-frame-front/dt-frames/frames/packages/ui/src/components/table/src/components/tableSetting/Fullscreen.vue"]]);
 const _hoisted_1$5 = { class: "column-select" };
 const _sfc_main$6 = /* @__PURE__ */ defineComponent({
   __name: "DownloadCtrl",
@@ -1046,7 +1058,7 @@ const _sfc_main$6 = /* @__PURE__ */ defineComponent({
             createVNode(_component_ADivider, { dashed: "" }),
             createVNode(_component_ARow, null, {
               default: withCtx(() => [
-                (openBlock(true), createElementBlock(Fragment, null, renderList(modalData.value, (it, index) => {
+                (openBlock(true), createElementBlock(Fragment, null, renderList(modalData.value, (it, index2) => {
                   return openBlock(), createBlock(_component_ACol, { span: 8 }, {
                     default: withCtx(() => [
                       createVNode(_component_ACheckbox, {
@@ -1072,6 +1084,7 @@ const _sfc_main$6 = /* @__PURE__ */ defineComponent({
     };
   }
 });
+const DownloadCtrl = /* @__PURE__ */ _export_sfc(_sfc_main$6, [["__file", "D:/dt/dt-frame-front/dt-frames/frames/packages/ui/src/components/table/src/components/tableSetting/DownloadCtrl.vue"]]);
 const _hoisted_1$4 = /* @__PURE__ */ createElementVNode("span", { class: "flex" }, [
   /* @__PURE__ */ createElementVNode("i", { class: "i ic:baseline-download w-7 leading-7 text-center cursor-pointer" })
 ], -1);
@@ -1087,13 +1100,14 @@ const _sfc_main$5 = /* @__PURE__ */ defineComponent({
     const table = getTableInstance();
     const [registerDialog, { openModal }] = useModalOut();
     const { appConf } = useAppStore();
+    const getPopupContainer$1 = () => document.getElementById("dt-layout-content") || getPopupContainer();
     const { t } = useI18n("UI");
     const isInclude = (type) => {
       return isBoolean(props2.download) && props2.download && appConf?.ui?.table?.exportTable.includes(type) || isArray(props2.download) && props2.download.includes(type);
     };
-    const showCurrentDownload = computed(() => isInclude("current"));
-    const showSelectedDownload = computed(() => isInclude("select"));
-    const showBackDownload = computed(() => isInclude("all"));
+    const showCurrentDownload = computed$1(() => isInclude("current"));
+    const showSelectedDownload = computed$1(() => isInclude("select"));
+    const showBackDownload = computed$1(() => isInclude("all"));
     function handleTitleClick({ key }) {
       const { onDownload, columns: allColumns, dataSource } = unref(table.getBind);
       const excludesFlag = ["ACTION", "CHECKBOX", "RADIO"];
@@ -1119,7 +1133,7 @@ const _sfc_main$5 = /* @__PURE__ */ defineComponent({
           createVNode(_component_ADropdown, {
             placement: "bottom",
             trigger: ["click"],
-            getPopupContainer: unref(getPopupContainer)
+            getPopupContainer: getPopupContainer$1
           }, {
             overlay: withCtx(() => [
               createVNode(_component_AMenu, { onClick: handleTitleClick }, {
@@ -1129,19 +1143,19 @@ const _sfc_main$5 = /* @__PURE__ */ defineComponent({
                       createElementVNode("span", null, toDisplayString(unref(t)("EXPORT_CURRENT_PAGE")), 1)
                     ]),
                     _: 1
-                  })) : createCommentVNode("", true),
+                  })) : createCommentVNode("v-if", true),
                   unref(showSelectedDownload) ? (openBlock(), createBlock(_component_AMenuItem, { key: "select" }, {
                     default: withCtx(() => [
                       createElementVNode("span", null, toDisplayString(unref(t)("EXPORT_SELECT_COLUMN")), 1)
                     ]),
                     _: 1
-                  })) : createCommentVNode("", true),
+                  })) : createCommentVNode("v-if", true),
                   unref(showBackDownload) ? (openBlock(), createBlock(_component_AMenuItem, { key: "all" }, {
                     default: withCtx(() => [
                       createElementVNode("span", null, toDisplayString(unref(t)("EXPORT_ALL")), 1)
                     ]),
                     _: 1
-                  })) : createCommentVNode("", true)
+                  })) : createCommentVNode("v-if", true)
                 ]),
                 _: 1
               })
@@ -1150,14 +1164,15 @@ const _sfc_main$5 = /* @__PURE__ */ defineComponent({
               _hoisted_1$4
             ]),
             _: 1
-          }, 8, ["getPopupContainer"]),
-          createVNode(_sfc_main$6, { onRegister: unref(registerDialog) }, null, 8, ["onRegister"])
+          }),
+          createVNode(DownloadCtrl, { onRegister: unref(registerDialog) }, null, 8, ["onRegister"])
         ]),
         _: 1
       });
     };
   }
 });
+const Download = /* @__PURE__ */ _export_sfc(_sfc_main$5, [["__file", "D:/dt/dt-frame-front/dt-frames/frames/packages/ui/src/components/table/src/components/tableSetting/Download.vue"]]);
 const _hoisted_1$3 = /* @__PURE__ */ createElementVNode("i", { class: "i ant-design:drag-outlined drag-icon cursor-pointer" }, null, -1);
 const _hoisted_2$1 = ["onClick"];
 const _hoisted_3$1 = ["onClick"];
@@ -1180,7 +1195,7 @@ const _sfc_main$4 = /* @__PURE__ */ defineComponent({
     const columnListRef = ref(null);
     const checkIndex = ref(false);
     const checkSelect = ref(false);
-    const getValues = computed(() => {
+    const getValues = computed$1(() => {
       return unref(table?.getBind);
     });
     let sortable;
@@ -1190,7 +1205,7 @@ const _sfc_main$4 = /* @__PURE__ */ defineComponent({
       checkedList: [],
       defaultCheckList: []
     });
-    const indeterminate = computed(() => {
+    const indeterminate = computed$1(() => {
       let len = plainOptions.value.length;
       let checkedLen = state.checkedList.length;
       unref(checkIndex) && checkedLen--;
@@ -1300,9 +1315,9 @@ const _sfc_main$4 = /* @__PURE__ */ defineComponent({
         return;
       const columns = getColumns();
       const isFixed = item.fixed === fixed ? false : fixed;
-      const index = columns.findIndex((col) => col.dataIndex === item.dataIndex);
-      if (index !== -1) {
-        columns[index].fixed = isFixed;
+      const index2 = columns.findIndex((col) => col.dataIndex === item.dataIndex);
+      if (index2 !== -1) {
+        columns[index2].fixed = isFixed;
       }
       item.fixed = isFixed;
       if (isFixed && !item.width) {
@@ -1338,7 +1353,7 @@ const _sfc_main$4 = /* @__PURE__ */ defineComponent({
       state.checkedList = checkList;
     }
     function getPopupContainer$1() {
-      return isFunction$1(attrs.getPopupContainer) ? attrs.getPopupContainer() : getPopupContainer();
+      return isFunction$1(attrs.getPopupContainer) ? attrs.getPopupContainer() : document.getElementById("dt-layout-content") || getPopupContainer();
     }
     return (_ctx, _cache) => {
       const _component_ACheckbox = Checkbox$1;
@@ -1493,6 +1508,7 @@ const _sfc_main$4 = /* @__PURE__ */ defineComponent({
     };
   }
 });
+const ColumnSetting = /* @__PURE__ */ _export_sfc(_sfc_main$4, [["__file", "D:/dt/dt-frame-front/dt-frames/frames/packages/ui/src/components/table/src/components/tableSetting/Column.vue"]]);
 const _hoisted_1$2 = { class: "flex dt-table-setting" };
 const _sfc_main$3 = /* @__PURE__ */ defineComponent({
   __name: "index",
@@ -1505,7 +1521,7 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
   emits: ["columns-change"],
   setup(__props, { emit: emits }) {
     const props2 = __props;
-    const getSetting = computed(() => {
+    const getSetting = computed$1(() => {
       return {
         download: true,
         setting: true,
@@ -1518,16 +1534,17 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
     }
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", _hoisted_1$2, [
-        unref(getSetting).download ? (openBlock(), createBlock(_sfc_main$5, normalizeProps(mergeProps({ key: 0 }, unref(getSetting))), null, 16)) : createCommentVNode("", true),
-        unref(getSetting).setting ? (openBlock(), createBlock(_sfc_main$4, {
+        unref(getSetting).download ? (openBlock(), createBlock(Download, normalizeProps(mergeProps({ key: 0 }, unref(getSetting))), null, 16)) : createCommentVNode("v-if", true),
+        unref(getSetting).setting ? (openBlock(), createBlock(ColumnSetting, {
           key: 1,
           onColumnsChange: handleColumnChange
-        })) : createCommentVNode("", true),
-        unref(getSetting).fullscreen ? (openBlock(), createBlock(_sfc_main$7, { key: 2 })) : createCommentVNode("", true)
+        })) : createCommentVNode("v-if", true),
+        unref(getSetting).fullscreen ? (openBlock(), createBlock(FullscreenSetting, { key: 2 })) : createCommentVNode("v-if", true)
       ]);
     };
   }
 });
+const DtTableSetting = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["__file", "D:/dt/dt-frame-front/dt-frames/frames/packages/ui/src/components/table/src/components/tableSetting/index.vue"]]);
 const _hoisted_1$1 = { class: "dt-table-header" };
 const _hoisted_2 = { class: "flex flex-row justify-between" };
 const _hoisted_3 = { class: "flex flex-row flex-1" };
@@ -1559,23 +1576,24 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
       return openBlock(), createElementBlock("div", _hoisted_1$1, [
         createElementVNode("div", _hoisted_2, [
           createElementVNode("div", _hoisted_3, [
-            unref(getActionsProps)?.buttonList.length ? (openBlock(), createBlock(unref(DtFormButtons), normalizeProps(mergeProps({ key: 0 }, unref(getActionsProps))), null, 16)) : createCommentVNode("", true),
+            unref(getActionsProps)?.buttonList.length ? (openBlock(), createBlock(unref(DtFormButtons), normalizeProps(mergeProps({ key: 0 }, unref(getActionsProps))), null, 16)) : createCommentVNode("v-if", true),
             renderSlot(_ctx.$slots, "toolbar")
           ]),
           __props.tableSetting ? (openBlock(), createElementBlock("div", _hoisted_4, [
-            createVNode(_sfc_main$3, { setting: __props.tableSetting }, null, 8, ["setting"])
-          ])) : createCommentVNode("", true)
+            createVNode(DtTableSetting, { setting: __props.tableSetting }, null, 8, ["setting"])
+          ])) : createCommentVNode("v-if", true)
         ]),
         _ctx.$slots.headerTop ? (openBlock(), createElementBlock("div", _hoisted_5, [
           renderSlot(_ctx.$slots, "headerTop")
-        ])) : createCommentVNode("", true)
+        ])) : createCommentVNode("v-if", true)
       ]);
     };
   }
 });
+const TableHeader = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__file", "D:/dt/dt-frame-front/dt-frames/frames/packages/ui/src/components/table/src/components/TableHeader.vue"]]);
 function useTableHeader(propsRef, slots, handlers) {
   const { t } = useI18n("UI");
-  const getHeaderProps = computed(() => {
+  const getHeaderProps = computed$1(() => {
     const TABLE_TOOLS = [
       { t: "\u65B0\u589E", label: t("ADD"), preIcon: "mdi:plus", type: "primary", onClick: unref(propsRef).onOPenAddDialog },
       { t: "\u5220\u9664", label: t("DELETE"), preIcon: "mdi:delete-outline", onClick: unref(propsRef).onDeletes }
@@ -1585,7 +1603,7 @@ function useTableHeader(propsRef, slots, handlers) {
     const hideTitle = (!toolbar || !toolbar.filter((it) => it.show ?? true).length) && !slots.toolbar && !slots.headerTop && !tableSetting;
     return {
       title: hideTitle ? null : () => h$1(
-        _sfc_main$2,
+        TableHeader,
         {
           tableSetting,
           toolbar,
@@ -1635,7 +1653,7 @@ function usePagination(props2) {
       }
     }
   );
-  const getPaginationInfo = computed(() => {
+  const getPaginationInfo = computed$1(() => {
     const { appConf } = useAppStore();
     let { pagination } = unref(props2);
     if (isBoolean(pagination) && !pagination) {
@@ -1688,7 +1706,7 @@ const DEFAULT_CONFIG = {
 function useRowSelection(propsRef, emit) {
   const selectedRowKeysRef = ref([]);
   const selectedRowRef = ref([]);
-  const getRowSelectionRef = computed(() => {
+  const getRowSelectionRef = computed$1(() => {
     const { rowSelection, showCheckboxColumn, checkStrictly } = unref(propsRef);
     if (!rowSelection && !showCheckboxColumn)
       return null;
@@ -1776,13 +1794,19 @@ function useRowSelection(propsRef, emit) {
     setSelectedRowKeys
   };
 }
+var TABLE_SIZE_HEIGHT = /* @__PURE__ */ ((TABLE_SIZE_HEIGHT2) => {
+  TABLE_SIZE_HEIGHT2[TABLE_SIZE_HEIGHT2["large"] = 56] = "large";
+  TABLE_SIZE_HEIGHT2[TABLE_SIZE_HEIGHT2["middle"] = 47] = "middle";
+  TABLE_SIZE_HEIGHT2[TABLE_SIZE_HEIGHT2["small"] = 32] = "small";
+  return TABLE_SIZE_HEIGHT2;
+})(TABLE_SIZE_HEIGHT || {});
 function useTableScroll(propsRef, tableElRef, columnsRef, rowSelectionRef) {
   const tableHeightRef = ref(0), filterSource = ref([]);
-  ref(null);
   let footerEl, bodyEl;
+  let oldPageNum = -1;
   const debounceRedoHeight = useDebounceFn(redoHeight, 100);
   windowResizeFn(calcTableHeight, 280);
-  const getCanResize = computed(() => {
+  const getCanResize = computed$1(() => {
     const { canResize, scroll } = unref(propsRef);
     return canResize && !(scroll || {}).y;
   });
@@ -1835,7 +1859,9 @@ function useTableScroll(propsRef, tableElRef, columnsRef, rowSelectionRef) {
     if (!unref(getCanResize) || !unref(tableData))
       return;
     await nextTick();
-    let headerHeight = 0, paginationHeight = 2, footerHeight = 0, titleHeight = tableEl.querySelector(".ant-table-title")?.offsetHeight ?? 0, marginHeight = 15;
+    let headerHeight = 0, paginationHeight = 2, footerHeight = 0, titleHeight = tableEl.querySelector(".ant-table-title")?.offsetHeight ?? 0;
+    const { paddingBottom, paddingTop, marginTop, marginBottom } = getComputedStyle(tableEl, null);
+    const marginHeight = parseInt(paddingBottom) + parseInt(paddingTop) + parseInt(marginTop) + parseInt(marginBottom);
     const headEl = tableEl.querySelector(".ant-table-thead ");
     if (headEl) {
       headerHeight = headEl.offsetHeight;
@@ -1855,7 +1881,7 @@ function useTableScroll(propsRef, tableElRef, columnsRef, rowSelectionRef) {
         footerHeight += offsetHeight || 0;
       }
     } else {
-      paginationHeight = -8;
+      paginationHeight = 0;
     }
     const tableHeight = table?.$el?.offsetHeight ?? 0;
     if (tableData.length === 0)
@@ -1866,9 +1892,9 @@ function useTableScroll(propsRef, tableElRef, columnsRef, rowSelectionRef) {
     bodyEl.style.height = `${height}px`;
     if (tableData.length === 0)
       return;
-    filterSource.value = unref(propsRef)?.dataSource;
+    virtual ? calcTableScroll() : filterSource.value = unref(propsRef)?.dataSource;
   }
-  const getScrollX = computed(() => {
+  const getScrollX = computed$1(() => {
     let width = 0;
     if (unref(rowSelectionRef)) {
       width += 32;
@@ -1882,11 +1908,11 @@ function useTableScroll(propsRef, tableElRef, columnsRef, rowSelectionRef) {
     const tableWidth = table?.$el?.offsetWidth ?? 0;
     return tableWidth > width ? "100%" : width;
   });
-  const hideScrollX = computed(() => {
+  const hideScrollX = computed$1(() => {
     let operations = unref(propsRef).operations;
     return !operations || isObject(operations) && operations?.btns && !operations?.btns?.length || isArray(operations) && !operations.length;
   });
-  const getScrollRef = computed(() => {
+  const getScrollRef = computed$1(() => {
     const tableHeight = unref(tableHeightRef);
     const { canResize, scroll } = unref(propsRef);
     return {
@@ -1896,24 +1922,74 @@ function useTableScroll(propsRef, tableElRef, columnsRef, rowSelectionRef) {
       ...scroll
     };
   });
-  onMounted(() => {
-    calcTableHeight();
-    nextTick(() => debounceRedoHeight());
-  });
+  async function calcTableScroll() {
+    const tableEl = unref(tableElRef)?.$el;
+    bodyEl = tableEl.querySelector(".ant-table-body");
+    const { getUiSize } = useHeader();
+    const rowHeight = TABLE_SIZE_HEIGHT[unref(getUiSize)];
+    const itemSize = Math.ceil(tableHeightRef.value / rowHeight);
+    createScrollWrap(bodyEl, rowHeight * itemSize * 2);
+    calcScroll(bodyEl, rowHeight, itemSize);
+    const fn = () => calcScroll(bodyEl, rowHeight, itemSize);
+    tryOnMounted(() => off(bodyEl, "scroll", fn));
+    on(bodyEl, "scroll", fn);
+  }
+  function createScrollWrap(el, prefixH) {
+    let data = unref(propsRef)?.dataSource?.length;
+    const { getUiSize } = useHeader();
+    const rowHeight = TABLE_SIZE_HEIGHT[unref(getUiSize)];
+    let scrollWrap = el.querySelector(".tableScrollWrap");
+    let wrapHeight = data * rowHeight - prefixH + "px";
+    if (scrollWrap) {
+      scrollWrap.style.height = wrapHeight;
+    } else {
+      let div = document.createElement("div");
+      div.className = "tableScrollWrap";
+      div.style.height = wrapHeight;
+      el.insertBefore(div, el.querySelector("table")[0]);
+    }
+  }
+  function changeSize(bodyEl2, pageNum, itemH, itemSize) {
+    requestAnimationFrame(() => {
+      if (pageNum > 0) {
+        if (oldPageNum === pageNum)
+          return;
+        else
+          oldPageNum = pageNum;
+        let data = unref(propsRef)?.dataSource?.length;
+        let maxIndex = (pageNum + 2) * itemSize;
+        let minIndex = (pageNum - 1) * itemSize;
+        if (maxIndex > data) {
+          maxIndex = data;
+          minIndex = data - itemSize * 2;
+        }
+        bodyEl2.querySelector("table").style.transform = `translateY(${minIndex * itemH}px)`;
+        filterSource.value = unref(propsRef)?.dataSource.slice(minIndex, maxIndex);
+      } else {
+        bodyEl2.querySelector("table").style.transform = `translateY(0px)`;
+        filterSource.value = unref(propsRef)?.dataSource.slice(0, itemSize * 3);
+      }
+    });
+  }
+  async function calcScroll(el, itemH, itemSize) {
+    const scrollTop = el.scrollTop;
+    const currentPage = Math.floor(scrollTop / (itemH * itemSize));
+    changeSize(el, currentPage, itemH, itemSize);
+  }
   return {
     getScrollRef,
     filterSource
   };
 }
 function useRows(propsRef) {
-  function getRowClassName(record, index) {
+  function getRowClassName(record, index2) {
     const { striped, rowClassName } = unref(propsRef);
     const classNames = [];
     if (striped) {
-      classNames.push(index % 2 === 1 ? "table-striped" : "");
+      classNames.push(index2 % 2 === 1 ? "table-striped" : "");
     }
     if (rowClassName && isFunction(rowClassName)) {
-      classNames.push(rowClassName(record, index));
+      classNames.push(rowClassName(record, index2));
     }
     return classNames.join(" ");
   }
@@ -1943,7 +2019,7 @@ const _sfc_main$1 = {
       const {
         column,
         record,
-        index
+        index: index2
       } = props2;
       const {
         render,
@@ -1966,10 +2042,10 @@ const _sfc_main$1 = {
           if (!apiStruc) {
             error(`${struc}\u672A\u5728structure\u4E2D\u914D\u7F6E`);
           } else {
-            renderText = getDictValueByCode(text, apiStruc);
+            renderText = computed(() => getDictValueByCode(text, apiStruc));
           }
         } else if (dict) {
-          renderText = getDictValueByCode(text, dict);
+          renderText = computed(() => getDictValueByCode(text, dict));
         } else if (date) {
           renderText.value = (text && dayjs(text).format(date || "YYYY-MM-DD")) ?? "";
         } else if (number) {
@@ -1985,7 +2061,7 @@ const _sfc_main$1 = {
           });
         }
       } else if (isFunction(render)) {
-        let afterRenderData = render(record, index, text);
+        let afterRenderData = render(record, index2, text);
         if (afterRenderData.__v_isRef) {
           renderText = afterRenderData;
         } else if (afterRenderData["setup"]) {
@@ -2003,6 +2079,7 @@ const _sfc_main$1 = {
     return () => createVNode("span", null, [unref(renderText)]);
   }
 };
+const TableRender = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__file", "D:/dt/dt-frame-front/dt-frames/frames/packages/ui/src/components/table/src/components/TableRender.vue"]]);
 const DEFAULT_SORT_FN = (sortInfo) => {
   const { field, order } = sortInfo;
   return field && order ? { field, order } : {};
@@ -2026,7 +2103,7 @@ const TableProps = {
     }
   },
   rowKey: {
-    type: String,
+    type: [String, Number],
     default: "id"
   },
   columnCode: { type: String, default: "" },
@@ -2104,11 +2181,11 @@ const TableProps = {
   },
   onOpenUpdateDialog: {
     type: Function,
-    default: (row, index) => ({})
+    default: (row, index2) => ({})
   },
   onDelete: {
     type: Function,
-    default: (row, index) => ({})
+    default: (row, index2) => ({})
   },
   onDeletes: {
     type: Function,
@@ -2139,11 +2216,11 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     const attrs = useAttrs();
     const slots = useSlots$1();
     const innerPropsRef = ref();
-    const getProps = computed(() => {
+    const getProps = computed$1(() => {
       return { ...props2, ...unref(innerPropsRef) };
     });
     const { getRowClassName } = useRows(getProps);
-    const tableCls = computed(() => {
+    const tableCls = computed$1(() => {
       return [
         "dt-table",
         "box-border",
@@ -2185,7 +2262,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         clearSelectedRowKeys
       }
     );
-    const getBind = computed(() => {
+    const getBind = computed$1(() => {
       return {
         ...attrs,
         ...unref(getProps),
@@ -2256,15 +2333,16 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         rowClassName: unref(getRowClassName),
         onChange: unref(handleTableChange)
       }), createSlots({
-        bodyCell: withCtx(({ column, record, index }) => [
-          _ctx.$slots.bodyCell ? renderSlot(_ctx.$slots, "bodyCell", normalizeProps(mergeProps({ key: 0 }, { column, record, index }))) : createCommentVNode("", true),
-          column.slot ? renderSlot(_ctx.$slots, column.slot, normalizeProps(mergeProps({ key: 1 }, { column, record, index }))) : createCommentVNode("", true),
-          column?.render && !column.slot && !_ctx.$slots.bodyCell ? (openBlock(), createBlock(_sfc_main$1, {
+        bodyCell: withCtx(({ column, record, index: index2 }) => [
+          _ctx.$slots.bodyCell ? renderSlot(_ctx.$slots, "bodyCell", normalizeProps(mergeProps({ key: 0 }, { column, record, index: index2 }))) : createCommentVNode("v-if", true),
+          column.slot ? renderSlot(_ctx.$slots, column.slot, normalizeProps(mergeProps({ key: 1 }, { column, record, index: index2 }))) : createCommentVNode("v-if", true),
+          createCommentVNode(" \u9759\u6001\u7684\u6570\u636E\u53EF\u4EE5\u901A\u8FC7customRender, \u4F46\u662F\u54CD\u5E94\u5F0F\u6570\u636E, \u5F02\u6B65\u51FD\u6570,\u7EC4\u4EF6\u7B49\u9700\u8981\u4F7F\u7528bodyCell\u6E32\u67D3 "),
+          column?.render && !column.slot && !_ctx.$slots.bodyCell ? (openBlock(), createBlock(TableRender, {
             key: 2,
             column,
             record,
-            index
-          }, null, 8, ["column", "record", "index"])) : createCommentVNode("", true)
+            index: index2
+          }, null, 8, ["column", "record", "index"])) : createCommentVNode("v-if", true)
         ]),
         emptyText: withCtx(() => [
           _hoisted_1
@@ -2283,7 +2361,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     };
   }
 });
+const index = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "D:/dt/dt-frame-front/dt-frames/frames/packages/ui/src/components/table/src/index.vue"]]);
 export {
-  _sfc_main as DtTable,
+  index as DtTable,
   useTable
 };