@aplus-frontend/ui 0.0.9 → 0.0.10

package/es/src/ap-table/ap-table.vue.d.ts

@@ -47,6 +47,7 @@ declare const _default: __VLS_WithTemplateSlots< DefineComponent<__VLS_WithDefau
     searchForm: undefined;
     loading: undefined;
     manual: boolean;
+    adaptive: boolean;
 }>, {
     submit: () => void;
     reset: () => void;
@@ -71,6 +72,7 @@ declare const _default: __VLS_WithTemplateSlots< DefineComponent<__VLS_WithDefau
     searchForm: undefined;
     loading: undefined;
     manual: boolean;
+    adaptive: boolean;
 }>>>, {
     loading: boolean | Partial< ExtractPropTypes<{
         prefixCls: StringConstructor;
@@ -164,6 +166,7 @@ declare const _default: __VLS_WithTemplateSlots< DefineComponent<__VLS_WithDefau
     childrenColumnName: string;
     card: boolean;
     searchForm: false | ApFormSearchFormProps;
+    adaptive: boolean;
 }, {}>, Partial<Record<NonNullable<keyof ApTableSlots>, (_: any) => any>> & {
     title?(_: {}): any;
 }>;

package/es/src/ap-table/ap-table.vue.mjs

@@ -1,19 +1,20 @@
-import { defineComponent as $, computed as d, createVNode as s, mergeProps as c, unref as r, watch as H, openBlock as p, createElementBlock as m, normalizeClass as h, normalizeStyle as x, withCtx as f, Fragment as G, renderList as B, createBlock as Q, resolveDynamicComponent as U, createCommentVNode as P, createElementVNode as I, renderSlot as v, createSlots as J, toDisplayString as X, normalizeProps as Y, guardReactiveProps as Z } from "vue";
-import { Typography as ee, Table as ae, Tooltip as te } from "ant-design-vue";
-import { ApForm as oe } from "../ap-form/index.mjs";
-import { apTableRenderItemMap as re, noRenderAsFormItemValueList as k, apTableFormItemMap as le } from "./constants.mjs";
+import { defineComponent as U, computed as d, createVNode as s, mergeProps as f, unref as l, watch as J, openBlock as i, createElementBlock as m, normalizeClass as F, normalizeStyle as x, withCtx as g, Fragment as X, renderList as B, createBlock as Y, resolveDynamicComponent as Z, createCommentVNode as v, createElementVNode as P, renderSlot as I, createSlots as ee, toDisplayString as ae, normalizeProps as te, guardReactiveProps as oe } from "vue";
+import { Typography as re, Table as le, Tooltip as ne } from "ant-design-vue";
+import { ApForm as de } from "../ap-form/index.mjs";
+import { apTableRenderItemMap as se, noRenderAsFormItemValueList as k, apTableFormItemMap as ue } from "./constants.mjs";
 import "../config-provider/index.mjs";
-import { useTablePaging as ne } from "./hooks/use-table-paging.mjs";
-import { isUndefined as de, omit as se } from "lodash-unified";
+import { useTablePaging as ie } from "./hooks/use-table-paging.mjs";
+import { isUndefined as pe, omit as ce } from "lodash-unified";
 import "./style/ap-table.css";
-import { QuestionCircleOutlined as ue } from "@ant-design/icons-vue";
-import { apColumnToColumn as pe, getTableRenderType as ie, getTableRenderProps as ce, getColumnOrder as O, updateFormProps as me, getFieldProps as fe, getPlaceholder as ge } from "./utils.mjs";
-import { useLocale as ye } from "../config-provider/hooks/use-locale.mjs";
-import { useNamespace as be } from "../config-provider/hooks/use-namespace.mjs";
-import { useGlobalConfig as he } from "../config-provider/hooks/use-global-config.mjs";
-const Ce = {
+import { QuestionCircleOutlined as fe } from "@ant-design/icons-vue";
+import { apColumnToColumn as me, getTableRenderType as ge, getTableRenderProps as ye, getColumnOrder as O, updateFormProps as be, getFieldProps as he, getPlaceholder as Ce } from "./utils.mjs";
+import Fe from "./hooks/use-table-content-height.mjs";
+import { useLocale as Se } from "../config-provider/hooks/use-locale.mjs";
+import { useNamespace as Re } from "../config-provider/hooks/use-namespace.mjs";
+import { useGlobalConfig as we } from "../config-provider/hooks/use-global-config.mjs";
+const Te = {
   key: 0
-}, Ee = /* @__PURE__ */ $({
+}, _e = /* @__PURE__ */ U({
   name: "ApTable",
   __name: "ap-table",
   props: {
@@ -120,21 +121,28 @@ const Ce = {
     },
     size: {
       default: "middle"
+    },
+    adaptive: {
+      type: Boolean,
+      default: !1
     }
   },
   setup(z, {
     expose: E
   }) {
-    const l = z, {
+    const r = z, {
       t: L
-    } = ye(), {
-      e: C,
-      b: g
-    } = be("ap-table"), V = he("uiMode"), y = d(() => {
+    } = Se(), {
+      e: y,
+      b: p
+    } = Re("ap-table"), V = we("uiMode"), {
+      height: N,
+      contentRef: D
+    } = Fe(), b = d(() => {
       var t;
-      let e = ((t = l.columns) == null ? void 0 : t.filter((a) => !a.hideInTable)) || [];
+      let e = ((t = r.columns) == null ? void 0 : t.filter((a) => !a.hideInTable)) || [];
       return e = e.map((a) => ({
-        ...pe(a),
+        ...me(a),
         customRender({
           value: o,
           ...n
@@ -147,24 +155,24 @@ const Ce = {
               column: a
             });
           else {
-            const T = ie(a), q = re[T], K = ce(a, {
+            const T = ge(a), G = se[T], Q = ye(a, {
               value: o,
               ...n
             });
-            u = s(q, c(K, {
+            u = s(G, f(Q, {
               mode: "read"
             }), null);
           }
-          return A(a, o, u);
+          return H(a, o, u);
         }
       })), e;
-    }), F = d(() => {
+    }), S = d(() => {
       var e, t, a;
-      return ((a = (t = (e = l.columns) == null ? void 0 : e.filter((o) => !o.hideInSearch && o.dataIndex && (o.valueType || o.customRenderFormItem) && !k.includes(o.valueType))) == null ? void 0 : t.sort((o, n) => {
+      return ((a = (t = (e = r.columns) == null ? void 0 : e.filter((o) => !o.hideInSearch && o.dataIndex && (o.valueType || o.customRenderFormItem) && !k.includes(o.valueType))) == null ? void 0 : t.sort((o, n) => {
         let u = O(o.order);
         return O(n.order) - u;
       })) == null ? void 0 : a.map((o) => {
-        const n = me(o, fe(o.fieldProps));
+        const n = be(o, he(o.fieldProps));
         return {
           ...o,
           fieldProps: {
@@ -172,42 +180,50 @@ const Ce = {
             name: o.dataIndex,
             ...n || {},
             // 格式化placeholder
-            placeholder: ge(L, o.valueType, n == null ? void 0 : n.placeholder)
+            placeholder: Ce(L, o.valueType, n == null ? void 0 : n.placeholder)
           }
         };
       })) || [];
-    }), N = d(() => r(y).filter((e) => e.sorter === !0).map((e) => e.dataIndex)), D = d(() => r(y).filter((e) => e.filters && !e.onFilter).map((e) => e.dataIndex)), {
-      formRef: b,
-      submit: S,
-      reset: R,
-      tableProps: i,
+    }), W = d(() => l(b).filter((e) => e.sorter === !0).map((e) => e.dataIndex)), _ = d(() => l(b).filter((e) => e.filters && !e.onFilter).map((e) => e.dataIndex)), {
+      formRef: h,
+      submit: R,
+      reset: w,
+      tableProps: c,
       handleTableChange: j,
-      data: w
-    } = ne({
+      data: C
+    } = ie({
       async request(e) {
         var a, o;
-        const t = await ((a = l.request) == null ? void 0 : a.call(l, e));
-        return (o = l.onLoad) == null || o.call(l, (t == null ? void 0 : t.data) || []), {
+        const t = await ((a = r.request) == null ? void 0 : a.call(r, e));
+        return (o = r.onLoad) == null || o.call(r, (t == null ? void 0 : t.data) || []), {
           data: (t == null ? void 0 : t.data) || [],
           total: (t == null ? void 0 : t.total) || 0
         };
       },
-      filterFields: r(D),
-      sortFields: r(N),
-      defaultParams: l.params,
-      defaultData: l.defaultData,
-      manual: l.manual,
-      defaultCurrent: l.pagination ? l.pagination.defaultCurrent : void 0,
-      defaultPageSize: l.pagination ? l.pagination.defaultPageSize : void 0,
-      formatParams: l.beforeSearchSubmit
-    }), W = d(() => ({
-      ...l,
-      ...r(i),
-      loading: de(l.loading) ? r(i).loading : l.loading,
-      pagination: l.pagination === !1 ? !1 : r(i).pagination
-    }));
-    function A(e, t, a) {
-      return k.includes(e.valueType) ? a : e.copyable || e.ellipsis ? s(ee.Text, {
+      filterFields: l(_),
+      sortFields: l(W),
+      defaultParams: r.params,
+      defaultData: r.defaultData,
+      manual: r.manual,
+      defaultCurrent: r.pagination ? r.pagination.defaultCurrent : void 0,
+      defaultPageSize: r.pagination ? r.pagination.defaultPageSize : void 0,
+      formatParams: r.beforeSearchSubmit
+    }), A = d(() => {
+      if (r.scroll)
+        return r.scroll;
+      if (r.adaptive && C.value.total > 0)
+        return {
+          y: l(N)
+        };
+    }), M = d(() => ({
+      ...r,
+      ...l(c),
+      loading: pe(r.loading) ? l(c).loading : r.loading,
+      pagination: r.pagination === !1 ? !1 : l(c).pagination,
+      scroll: l(A)
+    })), q = d(() => [r.card ? null : p("wrapper"), r.adaptive ? p("adaptive") : null].filter(Boolean));
+    function H(e, t, a) {
+      return k.includes(e.valueType) ? a : e.copyable || e.ellipsis ? s(re.Text, {
         copyable: e.copyable ? {
           text: t,
           tooltip: !1
@@ -218,76 +234,78 @@ const Ce = {
         content: a
       }, null) : a;
     }
-    H(() => r(w).loading, (e) => {
+    J(() => l(C).loading, (e) => {
       var t;
-      (t = l.onLoadingChange) == null || t.call(l, e);
+      (t = r.onLoadingChange) == null || t.call(r, e);
     });
-    function M(e) {
+    function K(e) {
       var t, a, o;
-      (o = (a = (t = b.value) == null ? void 0 : t.apForm) == null ? void 0 : a.setFieldsValue) == null || o.call(a, e);
+      (o = (a = (t = h.value) == null ? void 0 : t.apForm) == null ? void 0 : a.setFieldsValue) == null || o.call(a, e);
     }
-    function _() {
+    function $() {
       var e, t, a;
-      return (a = (t = (e = b.value) == null ? void 0 : e.apForm) == null ? void 0 : t.getFieldsValue) == null ? void 0 : a.call(t, !0);
+      return (a = (t = (e = h.value) == null ? void 0 : e.apForm) == null ? void 0 : t.getFieldsValue) == null ? void 0 : a.call(t, !0);
     }
     return E({
-      submit: () => S(),
-      reset: () => R(),
-      setSearchFormValues: M,
-      getSearchFormValues: _,
-      dataSource: d(() => r(w).records)
-    }), (e, t) => (p(), m("div", {
-      class: h(e.card ? null : r(g)("wrapper"))
-    }, [e.searchForm !== !1 && F.value.length > 0 ? (p(), m("div", {
+      submit: () => R(),
+      reset: () => w(),
+      setSearchFormValues: K,
+      getSearchFormValues: $,
+      dataSource: d(() => l(C).records)
+    }), (e, t) => (i(), m("div", {
+      class: F(q.value)
+    }, [e.searchForm !== !1 && S.value.length > 0 ? (i(), m("div", {
       key: 0,
-      class: h(e.card ? r(C)("search-wrapper") : null),
+      class: F(e.card ? l(y)("search-wrapper") : null),
       style: x(e.searchFormWrapperStyle)
-    }, [s(r(oe).SearchForm, c(e.searchForm || {}, {
+    }, [s(l(de).SearchForm, f(e.searchForm || {}, {
       ref_key: "formRef",
-      ref: b,
+      ref: h,
       "custom-reset": "",
-      onSubmit: r(S),
-      onReset: r(R),
-      "submit-loading": r(i).loading
+      onSubmit: l(R),
+      onReset: l(w),
+      "submit-loading": l(c).loading
     }), {
-      default: f(() => [(p(!0), m(G, null, B(F.value, (a) => (p(), Q(U(a.customRenderFormItem ? a.customRenderFormItem(a) : r(le)[a.valueType || "text"]), c({
+      default: g(() => [(i(!0), m(X, null, B(S.value, (a) => (i(), Y(Z(a.customRenderFormItem ? a.customRenderFormItem(a) : l(ue)[a.valueType || "text"]), f({
         key: a.dataIndex,
         ref_for: !0
       }, a.fieldProps || {}, {
         span: a.span
       }), null, 16, ["span"]))), 128))]),
       _: 1
-    }, 16, ["onSubmit", "onReset", "submit-loading"])], 6)) : P("", !0), I("div", {
-      class: h(e.card ? r(C)("table-wrapper") : null),
+    }, 16, ["onSubmit", "onReset", "submit-loading"])], 6)) : v("", !0), P("div", {
+      ref_key: "contentRef",
+      ref: D,
+      class: F([l(y)("table-wrapper"), e.card ? l(y)("table-wrapper-card") : null]),
       style: x(e.tableWrapperStyle)
-    }, [v(e.$slots, "title"), s(r(ae), c({
-      class: r(V) === "admin" ? r(g)("table-admin") : r(g)("table")
-    }, W.value, {
-      onChange: r(j),
-      columns: y.value
-    }), J({
-      headerCell: f(({
+    }, [I(e.$slots, "title"), s(l(le), f({
+      class: l(V) === "admin" ? l(p)("table-admin") : l(p)("table")
+    }, M.value, {
+      onChange: l(j),
+      columns: b.value
+    }), ee({
+      headerCell: g(({
         column: a,
         title: o
-      }) => [a.tooltip ? (p(), m("span", Ce, [I("span", null, X(o), 1), s(r(te), {
+      }) => [a.tooltip ? (i(), m("span", Te, [P("span", null, ae(o), 1), s(l(ne), {
         title: a.tooltip,
         placement: "bottom"
       }, {
-        default: f(() => [s(r(ue), {
+        default: g(() => [s(l(fe), {
           style: {
             color: "#0070ff",
             "padding-left": "4px"
           }
         })]),
         _: 2
-      }, 1032, ["title"])])) : P("", !0)]),
+      }, 1032, ["title"])])) : v("", !0)]),
       _: 2
-    }, [B(r(se)(e.$slots, "title"), (a, o) => ({
+    }, [B(l(ce)(e.$slots, "title"), (a, o) => ({
       name: o,
-      fn: f((n) => [v(e.$slots, o, Y(Z(n || {})))])
+      fn: g((n) => [I(e.$slots, o, te(oe(n || {})))])
     }))]), 1040, ["class", "onChange", "columns"])], 6)], 2));
   }
 });
 export {
-  Ee as default
+  _e as default
 };

package/es/src/ap-table/hooks/use-table-content-height.d.ts

@@ -0,0 +1,9 @@
+import { Ref, ComputedRef } from 'vue';
+export type TableContentHeightOptions = {
+    offset?: number;
+};
+declare const useTableContentHeight: (options?: TableContentHeightOptions) => {
+    contentRef: Ref<HTMLDivElement | undefined>;
+    height: ComputedRef<number>;
+};
+export default useTableContentHeight;

package/es/src/ap-table/hooks/use-table-content-height.mjs

@@ -0,0 +1,39 @@
+import { useElementSize as d } from "@vueuse/core";
+import { ref as g, computed as H, unref as l, onUpdated as S } from "vue";
+function f(t) {
+  if (!t)
+    return 0;
+  const e = parseFloat(t);
+  return Number.isNaN(e) ? 0 : e;
+}
+function h(t) {
+  if (!t)
+    return 0;
+  const e = getComputedStyle(t);
+  return t.clientHeight + f(e.marginTop) + f(e.marginBottom);
+}
+const v = (t) => {
+  const e = g(), { height: s } = d(e), a = g();
+  let i = !1;
+  const m = H(() => {
+    var o, u, c;
+    const r = ((u = (o = e.value) == null ? void 0 : o.querySelector(".ant-table-header")) == null ? void 0 : u.clientHeight) || 47, n = (c = e.value) == null ? void 0 : c.querySelector(".ant-pagination"), p = n ? h(n) : l(a);
+    return n && (i = !0), Math.ceil(
+      l(s) - r - (p || 0) - ((t == null ? void 0 : t.offset) || 0)
+    );
+  });
+  return S(() => {
+    var n;
+    if (i)
+      return;
+    const r = (n = e.value) == null ? void 0 : n.querySelector(".ant-pagination");
+    if (!r) {
+      a.value = 0;
+      return;
+    }
+    a.value = h(r), i = !0;
+  }), { contentRef: e, height: m };
+};
+export {
+  v as default
+};

package/es/src/ap-table/interface.d.ts

@@ -199,6 +199,10 @@ export type ApTableProps<RecordType = any, ParamsType = any, ValueType extends k
      * 表格尺寸（只支持中等大小和小尺寸）
      */
     size?: 'middle' | 'small';
+    /**
+     * 表格是否自适应高度
+     */
+    adaptive?: boolean;
 };
 export type ApTableExpose<SearchParamsType = Recordable, RecordType = any> = {
     /**

package/es/src/ap-table/style/ap-table.css

@@ -2,6 +2,30 @@
   padding: 16px;
   background-color: #fff;
 }
+.aplus-ap-table-adaptive {
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+}
+.aplus-ap-table-adaptive .ant-table-wrapper,
+.aplus-ap-table-adaptive .ant-spin-nested-loading,
+.aplus-ap-table-adaptive .ant-spin-container {
+  height: 100%;
+}
+.aplus-ap-table-adaptive .ant-spin-container {
+  display: flex;
+  flex-direction: column;
+}
+.aplus-ap-table-adaptive .ant-table {
+  flex: 1;
+}
+.aplus-ap-table-adaptive .ant-table-container,
+.aplus-ap-table-adaptive .ant-table-content {
+  height: 100%;
+}
+.aplus-ap-table-adaptive .ant-table-content > table {
+  height: 100%;
+}
 .aplus-ap-table__search-wrapper {
   padding: 16px;
   padding-bottom: 0;
@@ -9,8 +33,12 @@
   margin-bottom: 16px;
 }
 .aplus-ap-table__table-wrapper {
+  flex: 1;
+}
+.aplus-ap-table__table-wrapper-card {
   padding: 16px;
   background-color: #fff;
+  overflow: hidden;
 }
 .aplus-ap-table-table .ant-pagination {
   margin-bottom: 0 !important;

package/es/src/theme/ap-table/ap-table.css

@@ -2,6 +2,30 @@
   padding: 16px;
   background-color: #fff;
 }
+.aplus-ap-table-adaptive {
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+}
+.aplus-ap-table-adaptive .ant-table-wrapper,
+.aplus-ap-table-adaptive .ant-spin-nested-loading,
+.aplus-ap-table-adaptive .ant-spin-container {
+  height: 100%;
+}
+.aplus-ap-table-adaptive .ant-spin-container {
+  display: flex;
+  flex-direction: column;
+}
+.aplus-ap-table-adaptive .ant-table {
+  flex: 1;
+}
+.aplus-ap-table-adaptive .ant-table-container,
+.aplus-ap-table-adaptive .ant-table-content {
+  height: 100%;
+}
+.aplus-ap-table-adaptive .ant-table-content > table {
+  height: 100%;
+}
 .aplus-ap-table__search-wrapper {
   padding: 16px;
   padding-bottom: 0;
@@ -9,8 +33,12 @@
   margin-bottom: 16px;
 }
 .aplus-ap-table__table-wrapper {
+  flex: 1;
+}
+.aplus-ap-table__table-wrapper-card {
   padding: 16px;
   background-color: #fff;
+  overflow: hidden;
 }
 .aplus-ap-table-table .ant-pagination {
   margin-bottom: 0 !important;

package/lib/src/ap-table/ap-table.vue.d.ts

@@ -47,6 +47,7 @@ declare const _default: __VLS_WithTemplateSlots< DefineComponent<__VLS_WithDefau
     searchForm: undefined;
     loading: undefined;
     manual: boolean;
+    adaptive: boolean;
 }>, {
     submit: () => void;
     reset: () => void;
@@ -71,6 +72,7 @@ declare const _default: __VLS_WithTemplateSlots< DefineComponent<__VLS_WithDefau
     searchForm: undefined;
     loading: undefined;
     manual: boolean;
+    adaptive: boolean;
 }>>>, {
     loading: boolean | Partial< ExtractPropTypes<{
         prefixCls: StringConstructor;
@@ -164,6 +166,7 @@ declare const _default: __VLS_WithTemplateSlots< DefineComponent<__VLS_WithDefau
     childrenColumnName: string;
     card: boolean;
     searchForm: false | ApFormSearchFormProps;
+    adaptive: boolean;
 }, {}>, Partial<Record<NonNullable<keyof ApTableSlots>, (_: any) => any>> & {
     title?(_: {}): any;
 }>;

package/lib/src/ap-table/ap-table.vue.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),m=require("ant-design-vue"),O=require("../ap-form/index.js"),i=require("./constants.js");require("../config-provider/index.js");const z=require("./hooks/use-table-paging.js"),F=require("lodash-unified");require("./style/ap-table.css");const L=require("@ant-design/icons-vue"),d=require("./utils.js"),D=require("../config-provider/hooks/use-locale.js"),j=require("../config-provider/hooks/use-namespace.js"),M=require("../config-provider/hooks/use-global-config.js"),_={key:0},A=e.defineComponent({name:"ApTable",__name:"ap-table",props:{dropdownPrefixCls:{},loading:{type:[Boolean,Object],default:void 0},bordered:{type:Boolean,default:!1},locale:{},onChange:{},onResizeColumn:{},rowSelection:{},getPopupContainer:{},scroll:{},sortDirections:{default:()=>["ascend","descend"]},showSorterTooltip:{type:[Boolean,Object],default:!0},prefixCls:{},rowKey:{default:"key"},tableLayout:{},rowClassName:{},title:{},footer:{},id:{},showHeader:{type:Boolean,default:!0},components:{},customRow:{},customHeaderRow:{},direction:{},expandFixed:{type:[String,Boolean],default:!1},expandColumnWidth:{},expandedRowKeys:{},defaultExpandedRowKeys:{},expandedRowRender:{},expandRowByClick:{type:Boolean,default:!1},expandIcon:{},onExpand:{},onExpandedRowsChange:{},defaultExpandAllRows:{type:Boolean,default:!1},indentSize:{default:15},expandIconColumnIndex:{},showExpandColumn:{type:Boolean,default:!0},expandedRowClassName:{},childrenColumnName:{default:"children"},rowExpandable:{},sticky:{type:[Boolean,Object]},transformCellText:{},columns:{},card:{type:Boolean,default:!1},params:{},searchFormRender:{},request:{},onLoad:{},defaultData:{},onLoadingChange:{},searchForm:{type:[Boolean,Object],default:void 0},beforeSearchSubmit:{},pagination:{type:[Boolean,Object],default:void 0},searchFormWrapperStyle:{},tableWrapperStyle:{},manual:{type:Boolean,default:!1},size:{default:"middle"}},setup(w,{expose:R}){const o=w,{t:B}=D.useLocale(),{e:g,b:c}=j.useNamespace("ap-table"),x=M.useGlobalConfig("uiMode"),p=e.computed(()=>{var n;let a=((n=o.columns)==null?void 0:n.filter(t=>!t.hideInTable))||[];return a=a.map(t=>({...d.apColumnToColumn(t),customRender({value:r,...l}){let u;if(t.customRender)u=t.customRender({value:r,...l,column:t});else{const S=d.getTableRenderType(t),N=i.apTableRenderItemMap[S],E=d.getTableRenderProps(t,{value:r,...l});u=e.createVNode(N,e.mergeProps(E,{mode:"read"}),null)}return v(t,r,u)}})),a}),y=e.computed(()=>{var a,n,t;return((t=(n=(a=o.columns)==null?void 0:a.filter(r=>!r.hideInSearch&&r.dataIndex&&(r.valueType||r.customRenderFormItem)&&!i.noRenderAsFormItemValueList.includes(r.valueType)))==null?void 0:n.sort((r,l)=>{let u=d.getColumnOrder(r.order);return d.getColumnOrder(l.order)-u}))==null?void 0:t.map(r=>{const l=d.updateFormProps(r,d.getFieldProps(r.fieldProps));return{...r,fieldProps:{label:r.title,name:r.dataIndex,...l||{},placeholder:d.getPlaceholder(B,r.valueType,l==null?void 0:l.placeholder)}}}))||[]}),T=e.computed(()=>e.unref(p).filter(a=>a.sorter===!0).map(a=>a.dataIndex)),P=e.computed(()=>e.unref(p).filter(a=>a.filters&&!a.onFilter).map(a=>a.dataIndex)),{formRef:f,submit:b,reset:h,tableProps:s,handleTableChange:k,data:C}=z.useTablePaging({async request(a){var t,r;const n=await((t=o.request)==null?void 0:t.call(o,a));return(r=o.onLoad)==null||r.call(o,(n==null?void 0:n.data)||[]),{data:(n==null?void 0:n.data)||[],total:(n==null?void 0:n.total)||0}},filterFields:e.unref(P),sortFields:e.unref(T),defaultParams:o.params,defaultData:o.defaultData,manual:o.manual,defaultCurrent:o.pagination?o.pagination.defaultCurrent:void 0,defaultPageSize:o.pagination?o.pagination.defaultPageSize:void 0,formatParams:o.beforeSearchSubmit}),I=e.computed(()=>({...o,...e.unref(s),loading:F.isUndefined(o.loading)?e.unref(s).loading:o.loading,pagination:o.pagination===!1?!1:e.unref(s).pagination}));function v(a,n,t){return i.noRenderAsFormItemValueList.includes(a.valueType)?t:a.copyable||a.ellipsis?e.createVNode(m.Typography.Text,{copyable:a.copyable?{text:n,tooltip:!1}:!1,ellipsis:a.ellipsis?{tooltip:n}:!1,content:t},null):t}e.watch(()=>e.unref(C).loading,a=>{var n;(n=o.onLoadingChange)==null||n.call(o,a)});function V(a){var n,t,r;(r=(t=(n=f.value)==null?void 0:n.apForm)==null?void 0:t.setFieldsValue)==null||r.call(t,a)}function q(){var a,n,t;return(t=(n=(a=f.value)==null?void 0:a.apForm)==null?void 0:n.getFieldsValue)==null?void 0:t.call(n,!0)}return R({submit:()=>b(),reset:()=>h(),setSearchFormValues:V,getSearchFormValues:q,dataSource:e.computed(()=>e.unref(C).records)}),(a,n)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(a.card?null:e.unref(c)("wrapper"))},[a.searchForm!==!1&&y.value.length>0?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(a.card?e.unref(g)("search-wrapper"):null),style:e.normalizeStyle(a.searchFormWrapperStyle)},[e.createVNode(e.unref(O.ApForm).SearchForm,e.mergeProps(a.searchForm||{},{ref_key:"formRef",ref:f,"custom-reset":"",onSubmit:e.unref(b),onReset:e.unref(h),"submit-loading":e.unref(s).loading}),{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(y.value,t=>(e.openBlock(),e.createBlock(e.resolveDynamicComponent(t.customRenderFormItem?t.customRenderFormItem(t):e.unref(i.apTableFormItemMap)[t.valueType||"text"]),e.mergeProps({key:t.dataIndex,ref_for:!0},t.fieldProps||{},{span:t.span}),null,16,["span"]))),128))]),_:1},16,["onSubmit","onReset","submit-loading"])],6)):e.createCommentVNode("",!0),e.createElementVNode("div",{class:e.normalizeClass(a.card?e.unref(g)("table-wrapper"):null),style:e.normalizeStyle(a.tableWrapperStyle)},[e.renderSlot(a.$slots,"title"),e.createVNode(e.unref(m.Table),e.mergeProps({class:e.unref(x)==="admin"?e.unref(c)("table-admin"):e.unref(c)("table")},I.value,{onChange:e.unref(k),columns:p.value}),e.createSlots({headerCell:e.withCtx(({column:t,title:r})=>[t.tooltip?(e.openBlock(),e.createElementBlock("span",_,[e.createElementVNode("span",null,e.toDisplayString(r),1),e.createVNode(e.unref(m.Tooltip),{title:t.tooltip,placement:"bottom"},{default:e.withCtx(()=>[e.createVNode(e.unref(L.QuestionCircleOutlined),{style:{color:"#0070ff","padding-left":"4px"}})]),_:2},1032,["title"])])):e.createCommentVNode("",!0)]),_:2},[e.renderList(e.unref(F.omit)(a.$slots,"title"),(t,r)=>({name:r,fn:e.withCtx(l=>[e.renderSlot(a.$slots,r,e.normalizeProps(e.guardReactiveProps(l||{})))])}))]),1040,["class","onChange","columns"])],6)],2))}});exports.default=A;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),y=require("ant-design-vue"),D=require("../ap-form/index.js"),c=require("./constants.js");require("../config-provider/index.js");const j=require("./hooks/use-table-paging.js"),F=require("lodash-unified");require("./style/ap-table.css");const M=require("@ant-design/icons-vue"),u=require("./utils.js"),W=require("./hooks/use-table-content-height.js"),A=require("../config-provider/hooks/use-locale.js"),H=require("../config-provider/hooks/use-namespace.js"),K=require("../config-provider/hooks/use-global-config.js"),$={key:0},G=e.defineComponent({name:"ApTable",__name:"ap-table",props:{dropdownPrefixCls:{},loading:{type:[Boolean,Object],default:void 0},bordered:{type:Boolean,default:!1},locale:{},onChange:{},onResizeColumn:{},rowSelection:{},getPopupContainer:{},scroll:{},sortDirections:{default:()=>["ascend","descend"]},showSorterTooltip:{type:[Boolean,Object],default:!0},prefixCls:{},rowKey:{default:"key"},tableLayout:{},rowClassName:{},title:{},footer:{},id:{},showHeader:{type:Boolean,default:!0},components:{},customRow:{},customHeaderRow:{},direction:{},expandFixed:{type:[String,Boolean],default:!1},expandColumnWidth:{},expandedRowKeys:{},defaultExpandedRowKeys:{},expandedRowRender:{},expandRowByClick:{type:Boolean,default:!1},expandIcon:{},onExpand:{},onExpandedRowsChange:{},defaultExpandAllRows:{type:Boolean,default:!1},indentSize:{default:15},expandIconColumnIndex:{},showExpandColumn:{type:Boolean,default:!0},expandedRowClassName:{},childrenColumnName:{default:"children"},rowExpandable:{},sticky:{type:[Boolean,Object]},transformCellText:{},columns:{},card:{type:Boolean,default:!1},params:{},searchFormRender:{},request:{},onLoad:{},defaultData:{},onLoadingChange:{},searchForm:{type:[Boolean,Object],default:void 0},beforeSearchSubmit:{},pagination:{type:[Boolean,Object],default:void 0},searchFormWrapperStyle:{},tableWrapperStyle:{},manual:{type:Boolean,default:!1},size:{default:"middle"},adaptive:{type:Boolean,default:!1}},setup(R,{expose:w}){const o=R,{t:B}=A.useLocale(),{e:p,b:s}=H.useNamespace("ap-table"),T=K.useGlobalConfig("uiMode"),{height:x,contentRef:v}=W.default(),f=e.computed(()=>{var n;let a=((n=o.columns)==null?void 0:n.filter(t=>!t.hideInTable))||[];return a=a.map(t=>({...u.apColumnToColumn(t),customRender({value:r,...l}){let d;if(t.customRender)d=t.customRender({value:r,...l,column:t});else{const S=u.getTableRenderType(t),L=c.apTableRenderItemMap[S],_=u.getTableRenderProps(t,{value:r,...l});d=e.createVNode(L,e.mergeProps(_,{mode:"read"}),null)}return E(t,r,d)}})),a}),b=e.computed(()=>{var a,n,t;return((t=(n=(a=o.columns)==null?void 0:a.filter(r=>!r.hideInSearch&&r.dataIndex&&(r.valueType||r.customRenderFormItem)&&!c.noRenderAsFormItemValueList.includes(r.valueType)))==null?void 0:n.sort((r,l)=>{let d=u.getColumnOrder(r.order);return u.getColumnOrder(l.order)-d}))==null?void 0:t.map(r=>{const l=u.updateFormProps(r,u.getFieldProps(r.fieldProps));return{...r,fieldProps:{label:r.title,name:r.dataIndex,...l||{},placeholder:u.getPlaceholder(B,r.valueType,l==null?void 0:l.placeholder)}}}))||[]}),P=e.computed(()=>e.unref(f).filter(a=>a.sorter===!0).map(a=>a.dataIndex)),k=e.computed(()=>e.unref(f).filter(a=>a.filters&&!a.onFilter).map(a=>a.dataIndex)),{formRef:m,submit:h,reset:C,tableProps:i,handleTableChange:I,data:g}=j.useTablePaging({async request(a){var t,r;const n=await((t=o.request)==null?void 0:t.call(o,a));return(r=o.onLoad)==null||r.call(o,(n==null?void 0:n.data)||[]),{data:(n==null?void 0:n.data)||[],total:(n==null?void 0:n.total)||0}},filterFields:e.unref(k),sortFields:e.unref(P),defaultParams:o.params,defaultData:o.defaultData,manual:o.manual,defaultCurrent:o.pagination?o.pagination.defaultCurrent:void 0,defaultPageSize:o.pagination?o.pagination.defaultPageSize:void 0,formatParams:o.beforeSearchSubmit}),q=e.computed(()=>{if(o.scroll)return o.scroll;if(o.adaptive&&g.value.total>0)return{y:e.unref(x)}}),V=e.computed(()=>({...o,...e.unref(i),loading:F.isUndefined(o.loading)?e.unref(i).loading:o.loading,pagination:o.pagination===!1?!1:e.unref(i).pagination,scroll:e.unref(q)})),N=e.computed(()=>[o.card?null:s("wrapper"),o.adaptive?s("adaptive"):null].filter(Boolean));function E(a,n,t){return c.noRenderAsFormItemValueList.includes(a.valueType)?t:a.copyable||a.ellipsis?e.createVNode(y.Typography.Text,{copyable:a.copyable?{text:n,tooltip:!1}:!1,ellipsis:a.ellipsis?{tooltip:n}:!1,content:t},null):t}e.watch(()=>e.unref(g).loading,a=>{var n;(n=o.onLoadingChange)==null||n.call(o,a)});function O(a){var n,t,r;(r=(t=(n=m.value)==null?void 0:n.apForm)==null?void 0:t.setFieldsValue)==null||r.call(t,a)}function z(){var a,n,t;return(t=(n=(a=m.value)==null?void 0:a.apForm)==null?void 0:n.getFieldsValue)==null?void 0:t.call(n,!0)}return w({submit:()=>h(),reset:()=>C(),setSearchFormValues:O,getSearchFormValues:z,dataSource:e.computed(()=>e.unref(g).records)}),(a,n)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(N.value)},[a.searchForm!==!1&&b.value.length>0?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(a.card?e.unref(p)("search-wrapper"):null),style:e.normalizeStyle(a.searchFormWrapperStyle)},[e.createVNode(e.unref(D.ApForm).SearchForm,e.mergeProps(a.searchForm||{},{ref_key:"formRef",ref:m,"custom-reset":"",onSubmit:e.unref(h),onReset:e.unref(C),"submit-loading":e.unref(i).loading}),{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(b.value,t=>(e.openBlock(),e.createBlock(e.resolveDynamicComponent(t.customRenderFormItem?t.customRenderFormItem(t):e.unref(c.apTableFormItemMap)[t.valueType||"text"]),e.mergeProps({key:t.dataIndex,ref_for:!0},t.fieldProps||{},{span:t.span}),null,16,["span"]))),128))]),_:1},16,["onSubmit","onReset","submit-loading"])],6)):e.createCommentVNode("",!0),e.createElementVNode("div",{ref_key:"contentRef",ref:v,class:e.normalizeClass([e.unref(p)("table-wrapper"),a.card?e.unref(p)("table-wrapper-card"):null]),style:e.normalizeStyle(a.tableWrapperStyle)},[e.renderSlot(a.$slots,"title"),e.createVNode(e.unref(y.Table),e.mergeProps({class:e.unref(T)==="admin"?e.unref(s)("table-admin"):e.unref(s)("table")},V.value,{onChange:e.unref(I),columns:f.value}),e.createSlots({headerCell:e.withCtx(({column:t,title:r})=>[t.tooltip?(e.openBlock(),e.createElementBlock("span",$,[e.createElementVNode("span",null,e.toDisplayString(r),1),e.createVNode(e.unref(y.Tooltip),{title:t.tooltip,placement:"bottom"},{default:e.withCtx(()=>[e.createVNode(e.unref(M.QuestionCircleOutlined),{style:{color:"#0070ff","padding-left":"4px"}})]),_:2},1032,["title"])])):e.createCommentVNode("",!0)]),_:2},[e.renderList(e.unref(F.omit)(a.$slots,"title"),(t,r)=>({name:r,fn:e.withCtx(l=>[e.renderSlot(a.$slots,r,e.normalizeProps(e.guardReactiveProps(l||{})))])}))]),1040,["class","onChange","columns"])],6)],2))}});exports.default=G;

package/lib/src/ap-table/hooks/use-table-content-height.d.ts

@@ -0,0 +1,9 @@
+import { Ref, ComputedRef } from 'vue';
+export type TableContentHeightOptions = {
+    offset?: number;
+};
+declare const useTableContentHeight: (options?: TableContentHeightOptions) => {
+    contentRef: Ref<HTMLDivElement | undefined>;
+    height: ComputedRef<number>;
+};
+export default useTableContentHeight;

package/lib/src/ap-table/hooks/use-table-content-height.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const m=require("@vueuse/core"),r=require("vue");function g(t){if(!t)return 0;const e=parseFloat(t);return Number.isNaN(e)?0:e}function s(t){if(!t)return 0;const e=getComputedStyle(t);return t.clientHeight+g(e.marginTop)+g(e.marginBottom)}const p=t=>{const e=r.ref(),{height:f}=m.useElementSize(e),u=r.ref();let a=!1;const h=r.computed(()=>{var o,c,l;const i=((c=(o=e.value)==null?void 0:o.querySelector(".ant-table-header"))==null?void 0:c.clientHeight)||47,n=(l=e.value)==null?void 0:l.querySelector(".ant-pagination"),d=n?s(n):r.unref(u);return n&&(a=!0),Math.ceil(r.unref(f)-i-(d||0)-((t==null?void 0:t.offset)||0))});return r.onUpdated(()=>{var n;if(a)return;const i=(n=e.value)==null?void 0:n.querySelector(".ant-pagination");if(!i){u.value=0;return}u.value=s(i),a=!0}),{contentRef:e,height:h}};exports.default=p;

package/lib/src/ap-table/interface.d.ts

@@ -199,6 +199,10 @@ export type ApTableProps<RecordType = any, ParamsType = any, ValueType extends k
      * 表格尺寸（只支持中等大小和小尺寸）
      */
     size?: 'middle' | 'small';
+    /**
+     * 表格是否自适应高度
+     */
+    adaptive?: boolean;
 };
 export type ApTableExpose<SearchParamsType = Recordable, RecordType = any> = {
     /**

package/lib/src/ap-table/style/ap-table.css

@@ -2,6 +2,30 @@
   padding: 16px;
   background-color: #fff;
 }
+.aplus-ap-table-adaptive {
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+}
+.aplus-ap-table-adaptive .ant-table-wrapper,
+.aplus-ap-table-adaptive .ant-spin-nested-loading,
+.aplus-ap-table-adaptive .ant-spin-container {
+  height: 100%;
+}
+.aplus-ap-table-adaptive .ant-spin-container {
+  display: flex;
+  flex-direction: column;
+}
+.aplus-ap-table-adaptive .ant-table {
+  flex: 1;
+}
+.aplus-ap-table-adaptive .ant-table-container,
+.aplus-ap-table-adaptive .ant-table-content {
+  height: 100%;
+}
+.aplus-ap-table-adaptive .ant-table-content > table {
+  height: 100%;
+}
 .aplus-ap-table__search-wrapper {
   padding: 16px;
   padding-bottom: 0;
@@ -9,8 +33,12 @@
   margin-bottom: 16px;
 }
 .aplus-ap-table__table-wrapper {
+  flex: 1;
+}
+.aplus-ap-table__table-wrapper-card {
   padding: 16px;
   background-color: #fff;
+  overflow: hidden;
 }
 .aplus-ap-table-table .ant-pagination {
   margin-bottom: 0 !important;

package/lib/src/theme/ap-table/ap-table.css

@@ -2,6 +2,30 @@
   padding: 16px;
   background-color: #fff;
 }
+.aplus-ap-table-adaptive {
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+}
+.aplus-ap-table-adaptive .ant-table-wrapper,
+.aplus-ap-table-adaptive .ant-spin-nested-loading,
+.aplus-ap-table-adaptive .ant-spin-container {
+  height: 100%;
+}
+.aplus-ap-table-adaptive .ant-spin-container {
+  display: flex;
+  flex-direction: column;
+}
+.aplus-ap-table-adaptive .ant-table {
+  flex: 1;
+}
+.aplus-ap-table-adaptive .ant-table-container,
+.aplus-ap-table-adaptive .ant-table-content {
+  height: 100%;
+}
+.aplus-ap-table-adaptive .ant-table-content > table {
+  height: 100%;
+}
 .aplus-ap-table__search-wrapper {
   padding: 16px;
   padding-bottom: 0;
@@ -9,8 +33,12 @@
   margin-bottom: 16px;
 }
 .aplus-ap-table__table-wrapper {
+  flex: 1;
+}
+.aplus-ap-table__table-wrapper-card {
   padding: 16px;
   background-color: #fff;
+  overflow: hidden;
 }
 .aplus-ap-table-table .ant-pagination {
   margin-bottom: 0 !important;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@aplus-frontend/ui",
-  "version": "0.0.9",
+  "version": "0.0.10",
   "main": "lib/index.js",
   "module": "es/index.mjs",
   "files": [