@ditari/bsui 1.1.48 → 5.0.2

package/dist/esm/components/tab/Tab.vue2.mjs

@@ -0,0 +1,226 @@
+import { defineComponent, computed, watch, resolveComponent, createElementBlock, openBlock, normalizeClass, unref, createElementVNode, createVNode, isRef, withCtx, Fragment, renderList, createBlock, toDisplayString, h, normalizeStyle } from 'vue';
+import { useRoute, useRouter } from 'vue-router';
+import { theme } from 'ant-design-vue';
+import { storeToRefs } from 'pinia';
+import { CloseOutlined, SearchOutlined } from '@ant-design/icons-vue';
+import { useNavTabStore } from '@ditari/store';
+import { css } from '@emotion/css';
+
+"use strict";
+const _hoisted_1 = { class: "d-tabs-nav" };
+const _hoisted_2 = { style: { "padding": "0 10px" } };
+const _hoisted_3 = { class: "tab-item" };
+const _hoisted_4 = { class: "tab-close" };
+const _hoisted_5 = ["onClick"];
+var _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "Tab",
+  setup(__props) {
+    const { token, tabsNavStyle, tabHoverBgStyle, closeBtnStyle } = useStyle();
+    const { activeKey, list, onChange, onClose } = useTab();
+    function useStyle() {
+      const { useToken } = theme;
+      const { token: token2 } = useToken();
+      const dynamicValue = "green";
+      const tabsNavStyle2 = computed(() => {
+        return css`
+      --my-color: ${dynamicValue};
+      background: ${token2.value.colorBgContainer};
+      padding-top: 10px;
+    `;
+      });
+      const tabHoverBgStyle2 = computed(() => {
+        return css`
+      &:before {
+        background: ${token2.value.colorPrimaryBgHover};
+      }
+    `;
+      });
+      const closeBtnStyle2 = computed(() => {
+        return css`
+      &:hover {
+        background: ${token2.value.colorPrimaryBorderHover};
+        border-radius: 50%;
+      }
+    `;
+      });
+      return {
+        token: token2,
+        tabsNavStyle: tabsNavStyle2,
+        tabHoverBgStyle: tabHoverBgStyle2,
+        closeBtnStyle: closeBtnStyle2
+      };
+    }
+    function useTab() {
+      const route = useRoute();
+      const router = useRouter();
+      const store = useNavTabStore();
+      const { list: list2, activeKey: activeKey2 } = storeToRefs(store);
+      const { save, deleteTabs } = store;
+      watch(
+        () => route.fullPath,
+        () => {
+          save(route);
+        },
+        {
+          immediate: true
+        }
+      );
+      watch(
+        () => route.fullPath,
+        (val) => {
+          activeKey2.value = val;
+        },
+        {
+          immediate: true
+        }
+      );
+      const onChange2 = (key) => {
+        if (key !== route.path) {
+          const rs = list2.value.filter((item) => item.path === key)[0];
+          router.push(rs);
+        }
+      };
+      const onClose2 = ($event, key) => {
+        if (!key) return;
+        $event.stopPropagation();
+        deleteTabs(key);
+        const backRoute = list2.value[list2.value.length - 1];
+        if (backRoute.fullPath) {
+          router.push(backRoute.fullPath);
+        }
+      };
+      return {
+        activeKey: activeKey2,
+        list: list2,
+        onChange: onChange2,
+        onClose: onClose2
+      };
+    }
+    return (_ctx, _cache) => {
+      const _component_a_input = resolveComponent("a-input");
+      const _component_a_button = resolveComponent("a-button");
+      const _component_a_popover = resolveComponent("a-popover");
+      const _component_a_tab_pane = resolveComponent("a-tab-pane");
+      const _component_a_tabs = resolveComponent("a-tabs");
+      return openBlock(), createElementBlock(
+        "div",
+        {
+          class: normalizeClass(["tabs-nav-wrapper", unref(tabsNavStyle)])
+        },
+        [
+          createElementVNode("div", _hoisted_1, [
+            createVNode(_component_a_tabs, {
+              size: "small",
+              activeKey: unref(activeKey),
+              "onUpdate:activeKey": _cache[0] || (_cache[0] = ($event) => isRef(activeKey) ? activeKey.value = $event : null),
+              type: "card",
+              "hide-add": "",
+              onChange: unref(onChange)
+            }, {
+              leftExtra: withCtx(() => [
+                createElementVNode("div", _hoisted_2, [
+                  createVNode(_component_a_popover, { placement: "bottomRight" }, {
+                    content: withCtx(() => [
+                      createVNode(_component_a_input, {
+                        bordered: false,
+                        placeholder: "\u641C\u7D22\u6807\u7B7E\u9875"
+                      }, {
+                        prefix: withCtx(() => [
+                          createVNode(unref(SearchOutlined))
+                        ]),
+                        suffix: withCtx(() => [
+                          createElementVNode(
+                            "span",
+                            {
+                              style: normalizeStyle({ color: unref(token).colorTextTertiary })
+                            },
+                            "Ctrl+Shift+S",
+                            4
+                            /* STYLE */
+                          )
+                        ]),
+                        _: 1
+                        /* STABLE */
+                      })
+                    ]),
+                    default: withCtx(() => [
+                      createVNode(_component_a_button, {
+                        size: "small",
+                        shape: "circle",
+                        icon: h(unref(SearchOutlined)),
+                        title: "\u641C\u7D22\u6807\u7B7E\u9875"
+                      }, null, 8, ["icon"])
+                    ]),
+                    _: 1
+                    /* STABLE */
+                  })
+                ])
+              ]),
+              default: withCtx(() => [
+                (openBlock(true), createElementBlock(
+                  Fragment,
+                  null,
+                  renderList(unref(list), (item) => {
+                    return openBlock(), createBlock(_component_a_tab_pane, {
+                      key: item.fullPath,
+                      closable: false,
+                      class: normalizeClass({ active: unref(activeKey) === item.fullPath })
+                    }, {
+                      tab: withCtx(() => {
+                        var _a;
+                        return [
+                          createElementVNode(
+                            "div",
+                            {
+                              class: normalizeClass(["tab-hover-bg", unref(tabHoverBgStyle)])
+                            },
+                            null,
+                            2
+                            /* CLASS */
+                          ),
+                          _cache[1] || (_cache[1] = createElementVNode(
+                            "div",
+                            { class: "tab-dividers" },
+                            null,
+                            -1
+                            /* HOISTED */
+                          )),
+                          createElementVNode(
+                            "div",
+                            _hoisted_3,
+                            toDisplayString(((_a = item.meta) == null ? void 0 : _a.title) || "\u65E0\u6807\u9898"),
+                            1
+                            /* TEXT */
+                          ),
+                          createElementVNode("div", _hoisted_4, [
+                            createElementVNode("div", {
+                              class: normalizeClass(["close-btn", unref(closeBtnStyle)]),
+                              onClick: ($event) => unref(onClose)($event, item.fullPath)
+                            }, [
+                              createVNode(unref(CloseOutlined))
+                            ], 10, _hoisted_5)
+                          ])
+                        ];
+                      }),
+                      _: 2
+                      /* DYNAMIC */
+                    }, 1032, ["class"]);
+                  }),
+                  128
+                  /* KEYED_FRAGMENT */
+                ))
+              ]),
+              _: 1
+              /* STABLE */
+            }, 8, ["activeKey", "onChange"])
+          ])
+        ],
+        2
+        /* CLASS */
+      );
+    };
+  }
+});
+
+export { _sfc_main as default };
+//# sourceMappingURL=Tab.vue2.mjs.map

package/dist/esm/components/tab/Tab.vue2.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tab.vue2.mjs","sources":["../../../../src/components/tab/Tab.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport { computed, type ComputedRef, h, watch } from \"vue\";\r\nimport { useRoute, useRouter } from \"vue-router\";\r\nimport { theme } from \"ant-design-vue\";\r\nimport { storeToRefs } from \"pinia\";\r\n\r\nimport { CloseOutlined, SearchOutlined } from \"@ant-design/icons-vue\";\r\nimport { useNavTabStore } from \"@ditari/store\";\r\nimport { css } from \"@emotion/css\";\r\nimport type { GlobalToken } from \"ant-design-vue/es/theme/interface\";\r\n\r\nconst { token, tabsNavStyle, tabHoverBgStyle, closeBtnStyle } = useStyle();\r\n\r\nconst { activeKey, list, onChange, onClose } = useTab();\r\n\r\nfunction useStyle(): {\r\n  token: ComputedRef<GlobalToken>;\r\n  tabsNavStyle: ComputedRef<string>;\r\n  tabHoverBgStyle: ComputedRef<string>;\r\n  closeBtnStyle: ComputedRef<string>;\r\n} {\r\n  const { useToken } = theme;\r\n  const { token }: { token: ComputedRef<GlobalToken> } = useToken();\r\n  const dynamicValue = \"green\"; // 动态值，可以是从 state 或 props 中获取的\r\n  const tabsNavStyle = computed(() => {\r\n    return css`\r\n      --my-color: ${dynamicValue};\r\n      background: ${token.value.colorBgContainer};\r\n      padding-top: 10px;\r\n    `;\r\n  });\r\n\r\n  const tabHoverBgStyle = computed(() => {\r\n    return css`\r\n      &:before {\r\n        background: ${token.value.colorPrimaryBgHover};\r\n      }\r\n    `;\r\n  });\r\n\r\n  const closeBtnStyle = computed(() => {\r\n    return css`\r\n      &:hover {\r\n        background: ${token.value.colorPrimaryBorderHover};\r\n        border-radius: 50%;\r\n      }\r\n    `;\r\n  });\r\n\r\n  return {\r\n    token,\r\n    tabsNavStyle,\r\n    tabHoverBgStyle,\r\n    closeBtnStyle\r\n  };\r\n}\r\n\r\nfunction useTab() {\r\n  const route = useRoute();\r\n  const router = useRouter();\r\n\r\n  const store = useNavTabStore();\r\n  const { list, activeKey } = storeToRefs(store);\r\n  const { save, deleteTabs } = store;\r\n\r\n  watch(\r\n    () => route.fullPath,\r\n    () => {\r\n      save(route);\r\n    },\r\n    {\r\n      immediate: true\r\n    }\r\n  );\r\n\r\n  watch(\r\n    () => route.fullPath,\r\n    val => {\r\n      activeKey.value = val;\r\n    },\r\n    {\r\n      immediate: true\r\n    }\r\n  );\r\n\r\n  const onChange = (key: string) => {\r\n    if (key !== route.path) {\r\n      // 匹配打开的标签路由数据\r\n      const rs = list.value.filter(item => item.path === key)[0];\r\n      router.push(rs);\r\n    }\r\n  };\r\n\r\n  const onClose = ($event: Event, key: string | undefined) => {\r\n    if (!key) return;\r\n    //阻止冒泡\r\n    $event.stopPropagation();\r\n    // 删除标签\r\n    deleteTabs(key);\r\n    // 重新push已打开的路由\r\n    const backRoute = list.value[list.value.length - 1];\r\n    if (backRoute.fullPath) {\r\n      router.push(backRoute.fullPath);\r\n    }\r\n  };\r\n\r\n  return {\r\n    activeKey,\r\n    list,\r\n    onChange,\r\n    onClose\r\n  };\r\n}\r\n</script>\r\n<template>\r\n  <div class=\"tabs-nav-wrapper\" :class=\"tabsNavStyle\">\r\n    <div class=\"d-tabs-nav\">\r\n      <a-tabs\r\n        size=\"small\"\r\n        v-model:activeKey=\"activeKey\"\r\n        type=\"card\"\r\n        hide-add\r\n        @change=\"onChange\"\r\n      >\r\n        <template #leftExtra>\r\n          <div style=\"padding: 0 10px\">\r\n            <a-popover placement=\"bottomRight\">\r\n              <template #content>\r\n                <a-input :bordered=\"false\" placeholder=\"搜索标签页\">\r\n                  <template #prefix>\r\n                    <SearchOutlined />\r\n                  </template>\r\n                  <template #suffix>\r\n                    <span :style=\"{ color: token.colorTextTertiary }\"\r\n                      >Ctrl+Shift+S</span\r\n                    >\r\n                  </template>\r\n                </a-input>\r\n              </template>\r\n              <a-button\r\n                size=\"small\"\r\n                shape=\"circle\"\r\n                :icon=\"h(SearchOutlined)\"\r\n                title=\"搜索标签页\"\r\n              />\r\n            </a-popover>\r\n          </div>\r\n        </template>\r\n        <a-tab-pane\r\n          :key=\"item.fullPath\"\r\n          :closable=\"false\"\r\n          v-for=\"item in list\"\r\n          :class=\"{ active: activeKey === item.fullPath }\"\r\n        >\r\n          <template #tab>\r\n            <div class=\"tab-hover-bg\" :class=\"tabHoverBgStyle\"></div>\r\n            <div class=\"tab-dividers\"></div>\r\n            <div class=\"tab-item\">{{ item.meta?.title || \"无标题\" }}</div>\r\n            <div class=\"tab-close\">\r\n              <div\r\n                class=\"close-btn\"\r\n                :class=\"closeBtnStyle\"\r\n                @click=\"onClose($event, item.fullPath)\"\r\n              >\r\n                <CloseOutlined />\r\n              </div>\r\n            </div>\r\n          </template>\r\n        </a-tab-pane>\r\n      </a-tabs>\r\n    </div>\r\n  </div>\r\n</template>\r\n\r\n<style lang=\"scss\"></style>\r\n"],"names":["token","tabsNavStyle","tabHoverBgStyle","closeBtnStyle","list","activeKey","onChange","onClose"],"mappings":"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"}

package/dist/esm/components/tab/index.mjs

@@ -0,0 +1,10 @@
+import './Tab.vue.mjs';
+import _sfc_main from './Tab.vue2.mjs';
+
+"use strict";
+_sfc_main.install = (app) => {
+  app.component("DTab", _sfc_main);
+};
+
+export { _sfc_main as default };
+//# sourceMappingURL=index.mjs.map

package/dist/esm/components/tab/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","sources":["../../../../src/components/tab/index.ts"],"sourcesContent":["import type { App } from \"vue\";\r\n\r\nimport Tab from \"./Tab.vue\";\r\n\r\nTab.install = (app: App) => {\r\n  app.component(\"DTab\", Tab);\r\n};\r\n\r\nexport default Tab;\r\n"],"names":["Tab"],"mappings":";;;;AAIAA,SAAI,CAAA,OAAA,GAAU,CAAC,GAAa,KAAA;AAC1B,EAAI,GAAA,CAAA,SAAA,CAAU,QAAQA,SAAG,CAAA;AAC3B,CAAA;;;;"}

package/dist/esm/components/table/Table.mjs

@@ -0,0 +1,380 @@
+import { defineComponent, ref, onMounted, computed, watch, nextTick, createVNode } from 'vue';
+import { Flex, Table, Pagination } from 'ant-design-vue';
+import { css } from '@emotion/css';
+import { merge } from 'lodash';
+
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+const tableProps = () => ({
+  height: {
+    type: Number,
+    default: 0
+  },
+  data: {
+    type: Array,
+    default: () => []
+  },
+  // 泛型约束
+  loading: {
+    type: Boolean,
+    default: false
+  },
+  rowKey: {
+    type: String,
+    default: "id"
+  },
+  bordered: {
+    type: Boolean,
+    default: false
+  },
+  size: {
+    type: String,
+    default: "small"
+  },
+  keys: {
+    type: Array,
+    default: () => []
+  },
+  config: {
+    type: Object,
+    required: true
+  }
+});
+const defaultPaginationProps = {
+  defaultPageSize: 20,
+  disabled: false,
+  hideOnSinglePage: false,
+  pageSize: 20,
+  pageSizeOptions: ["20", "40", "60", "80", "99"],
+  responsive: false,
+  showLessItems: false,
+  showQuickJumper: true,
+  showSizeChanger: true,
+  // 默认展示切换器
+  showTotal: (total) => `\u603B\u5171 ${total} \u6761\u6570\u636E`,
+  simple: false,
+  size: "default",
+  total: 0
+};
+const defaultConfig = {
+  columns: [],
+  pagination: void 0,
+  paginationConfig: defaultPaginationProps,
+  activeRowClass: "",
+  selection: "N",
+  keepSelected: false
+};
+const paginationStyle = css`
+  display: flex;
+  justify-content: center;
+`;
+const DTable = /* @__PURE__ */ defineComponent({
+  name: "DTable",
+  props: tableProps(),
+  // 初始泛型设置为 `unknown`
+  emits: ["update:keys"],
+  setup(props, {
+    emit,
+    slots
+  }) {
+    const selectedRowKeys = ref(props.keys || []);
+    const {
+      columns,
+      data,
+      pagination
+    } = useProps();
+    const {
+      tableSlots
+    } = useSlots();
+    const {
+      paginationConfig,
+      onPaginationChange
+    } = usePagination();
+    const {
+      tableRef,
+      tableHeight,
+      antTableBodyRef
+    } = useHeight();
+    const rowSelection = useRowSelection();
+    onMounted(() => {
+    });
+    function useProps() {
+      const _config = computed(() => merge({}, defaultConfig, props.config));
+      const columns2 = computed(() => _config.value.columns);
+      const data2 = computed(() => props.data || []);
+      const pagination2 = computed(() => _config.value.pagination || false);
+      return {
+        columns: columns2,
+        data: data2,
+        pagination: pagination2
+      };
+    }
+    function useSlots() {
+      const tableSlots2 = {
+        bodyCell: (params) => {
+          var _a;
+          return (_a = slots.bodyCell) == null ? void 0 : _a.call(slots, params);
+        },
+        summary: () => {
+          var _a;
+          return (_a = slots.summary) == null ? void 0 : _a.call(slots);
+        }
+      };
+      return {
+        tableSlots: tableSlots2
+      };
+    }
+    function useHeight() {
+      const tableRef2 = ref();
+      const tableHeight2 = ref(0);
+      let headerHeight = 0, tableEl;
+      const antTableBodyRef2 = ref();
+      watch(() => props.height, (val) => {
+        if (val !== 0) {
+          nextTick(() => {
+            _tableBodyHeight(val);
+          });
+        }
+      }, {
+        immediate: true
+      });
+      function _tableBodyHeight(height) {
+        var _a, _b, _c;
+        tableEl = (_a = tableRef2 == null ? void 0 : tableRef2.value) == null ? void 0 : _a.$el;
+        headerHeight = useEleHeight(tableEl.getElementsByClassName("ant-table-header")[0]);
+        const paginationEl = tableEl.getElementsByClassName("ant-pagination")[0];
+        let paginationHeight = 0;
+        if (paginationEl) {
+          paginationEl.style.marginBottom = "0";
+          paginationHeight = (_b = useEleHeight(paginationEl)) != null ? _b : 0;
+        }
+        let summaryHeight = 0;
+        const summaryEl = tableEl.getElementsByClassName("ant-table-summary")[0];
+        if (summaryEl) {
+          summaryHeight = (_c = useEleHeight(summaryEl)) != null ? _c : 0;
+        }
+        tableHeight2.value = height - paginationHeight - headerHeight - summaryHeight;
+        antTableBodyRef2.value = tableEl.getElementsByClassName("ant-table-body")[0];
+        if (antTableBodyRef2.value) {
+          antTableBodyRef2.value.style.height = tableHeight2.value + "px";
+        }
+      }
+      return {
+        tableRef: tableRef2,
+        tableHeight: tableHeight2,
+        antTableBodyRef: antTableBodyRef2
+      };
+    }
+    function usePagination() {
+      const {
+        changePagination
+      } = props.config;
+      const paginationConfig2 = computed(() => {
+        return __spreadValues(__spreadValues({
+          position: ["bottomCenter"],
+          // 符合类型的分页位置
+          total: 0
+        }, defaultPaginationProps), pagination.value);
+      });
+      const onPaginationChange2 = (page, pageSize) => {
+        const {
+          selection,
+          keepSelected
+        } = props.config;
+        changePagination == null ? void 0 : changePagination(page, pageSize);
+        antTableBodyRef.value.scrollTop = 0;
+        if (selection === "S" || !keepSelected) {
+          if (selectedRowKeys.value.length > 0) {
+            selectedRowKeys.value = [];
+            emit("update:keys", selectedRowKeys.value);
+          }
+        }
+      };
+      return {
+        paginationConfig: paginationConfig2,
+        onPaginationChange: onPaginationChange2
+      };
+    }
+    function useCustomRow() {
+      return (record, index) => {
+        let clickTimeout = 0;
+        const {
+          rowKey,
+          config: {
+            click,
+            dbClick,
+            selection,
+            getCheckboxProps
+          } = {}
+        } = props;
+        const id = record[rowKey];
+        const onClick = () => {
+          var _a;
+          const checkEnable = getCheckboxProps === void 0 ? false : (_a = getCheckboxProps(record)) == null ? void 0 : _a.disabled;
+          if (selection === "N" || checkEnable) {
+            return;
+          }
+          const haveState = selectedRowKeys.value.some((key) => key === id);
+          if (haveState) {
+            selectedRowKeys.value = selectedRowKeys.value.filter((key) => key !== id);
+          } else {
+            if (selection === "S") {
+              selectedRowKeys.value = [];
+              selectedRowKeys.value.push(id);
+            } else {
+              selectedRowKeys.value.push(id);
+            }
+          }
+          emit("update:keys", selectedRowKeys.value);
+        };
+        function activeRowBackground(event) {
+          const {
+            activeRowClass
+          } = props.config;
+          if (!activeRowClass) return;
+          const curEl = event.target;
+          if (curEl instanceof HTMLElement) {
+            const parentElement = curEl.parentNode;
+            if (parentElement && parentElement.classList.contains(activeRowClass)) {
+              parentElement.classList.remove(activeRowClass);
+            } else {
+              parentElement == null ? void 0 : parentElement.classList.add(activeRowClass);
+            }
+          }
+        }
+        return {
+          onClick: (event) => {
+            clearTimeout(clickTimeout);
+            clickTimeout = window.setTimeout(() => {
+              activeRowBackground(event);
+              onClick();
+              click == null ? void 0 : click(record, index);
+            }, 200);
+          },
+          // 点击行
+          onDblclick: () => {
+            clearTimeout(clickTimeout);
+            dbClick == null ? void 0 : dbClick(record, index);
+          }
+        };
+      };
+    }
+    function useRowSelection() {
+      const rowSelection2 = ref(void 0);
+      const {
+        rowKey,
+        config: {
+          getCheckboxProps,
+          selection
+        } = {}
+      } = props;
+      const onSelect = (record, selected) => {
+        const data2 = record;
+        if (selection === "S") {
+          selectedRowKeys.value = [];
+          selectedRowKeys.value = selected ? [data2[rowKey]] : [];
+        } else {
+          selectedRowKeys.value = selected ? selectedRowKeys.value.concat(data2[rowKey]) : selectedRowKeys.value.filter((key) => key !== data2[rowKey]);
+        }
+        emit("update:keys", selectedRowKeys.value);
+      };
+      const onChange = (rowKeys, selectedRows) => {
+        const data2 = selectedRows;
+        const selected = data2.length !== 0;
+        const _ids = props.data.map((record) => record[rowKey]);
+        selectedRowKeys.value = selected ? selectedRowKeys.value.concat(rowKeys.filter((key) => !selectedRowKeys.value.includes(key))) : selectedRowKeys.value.filter((key) => !_ids.includes(key));
+        emit("update:keys", selectedRowKeys.value);
+      };
+      watch(() => props.keys, (val) => {
+        selectedRowKeys.value = val;
+      });
+      watch(() => {
+        var _a;
+        return (_a = props.config) == null ? void 0 : _a.selection;
+      }, (val) => {
+        if (val !== "N") {
+          rowSelection2.value = {
+            selectedRowKeys,
+            onSelect,
+            onChange,
+            fixed: true,
+            columnTitle: selection === "S" ? "\u9009\u62E9" : null,
+            columnWidth: selection === "S" ? 60 : 40,
+            getCheckboxProps
+          };
+        } else {
+          rowSelection2.value = void 0;
+        }
+      }, {
+        immediate: true
+      });
+      return rowSelection2;
+    }
+    return () => createVNode(Flex, {
+      "vertical": true,
+      "ref": tableRef
+    }, {
+      default: () => [createVNode(Table, {
+        "loading": props.loading,
+        "size": props.size,
+        "bordered": props.bordered,
+        "dataSource": data.value,
+        "columns": columns.value,
+        "rowSelection": rowSelection.value,
+        "customRow": useCustomRow(),
+        "pagination": false,
+        "rowKey": props.rowKey,
+        "scroll": {
+          y: tableHeight.value,
+          x: "100%",
+          scrollToFirstRowOnChange: true
+        }
+      }, tableSlots), createVNode("div", {
+        "class": paginationStyle
+      }, [pagination && createVNode(Pagination, {
+        "style": {
+          marginTop: "16px"
+        },
+        "current": paginationConfig.value.current,
+        "onUpdate:current": ($event) => paginationConfig.value.current = $event,
+        "pageSize": paginationConfig.value.pageSize,
+        "onUpdate:pageSize": ($event) => paginationConfig.value.pageSize = $event,
+        "total": paginationConfig.value.total,
+        "disabled": props.loading,
+        "show-size-changer": true,
+        "size": "default",
+        "hide-on-single-page": paginationConfig.value.hideOnSinglePage,
+        "show-quick-jumper": paginationConfig.value.showQuickJumper,
+        "default-page-size": paginationConfig.value.defaultPageSize,
+        "page-size-options": paginationConfig.value.pageSizeOptions,
+        "show-total": paginationConfig.value.showTotal,
+        "onChange": onPaginationChange
+      }, null)])]
+    });
+  }
+});
+const useEleHeight = (node) => {
+  const list = ["margin-top", "margin-bottom", "border-top", "border-bottom", "padding-top", "padding-bottom", "height"];
+  const style = getComputedStyle(node);
+  return list.map((k) => parseInt(style.getPropertyValue(k), 10)).reduce((prev, cur) => {
+    return prev + cur;
+  });
+};
+
+export { DTable as default, tableProps, useEleHeight };
+//# sourceMappingURL=Table.mjs.map