@aplus-frontend/ui 0.4.34 → 0.5.0-beta.1

package/es/index.mjs

@@ -113,12 +113,13 @@ import { default as Nt } from "./src/scroll-view/index.vue.mjs";
 import { default as wt } from "./src/portal/index.vue.mjs";
 import { default as Bt } from "./src/full-screen/index.vue.mjs";
 import { default as Kt } from "./src/resize-observer/index.vue.mjs";
-import { useMessage as Ut } from "./src/hooks/useMessage.mjs";
-import { useControllableValue as Vt } from "./src/hooks/useControllableValue.mjs";
-import { useManualRef as _t } from "./src/hooks/useManualRef.mjs";
-import { useThrottleRef as $t } from "./src/hooks/useThrottleRef.mjs";
-import { useFullScreen as qt } from "./src/hooks/useFullScreen.mjs";
-import { useResize as Qt } from "./src/hooks/useResize.mjs";
+import { default as Ut } from "./src/ap-grid/index.vue.mjs";
+import { useMessage as Vt } from "./src/hooks/useMessage.mjs";
+import { useControllableValue as _t } from "./src/hooks/useControllableValue.mjs";
+import { useManualRef as $t } from "./src/hooks/useManualRef.mjs";
+import { useThrottleRef as qt } from "./src/hooks/useThrottleRef.mjs";
+import { useFullScreen as Qt } from "./src/hooks/useFullScreen.mjs";
+import { useResize as Yt } from "./src/hooks/useResize.mjs";
 const a = {
   install: (r) => {
     for (const t in o) {
@@ -188,6 +189,7 @@ export {
   ge as ApFormProvider,
   de as ApFormSearchForm,
   ce as ApFormSet,
+  Ut as ApGrid,
   at as ApGroupSearch,
   hr as ApImage,
   ho as ApInfoLayout,
@@ -254,19 +256,19 @@ export {
   l as pathMap,
   F as provideGlobalConfig,
   D as translate,
-  Vt as useControllableValue,
-  qt as useFullScreen,
+  _t as useControllableValue,
+  Qt as useFullScreen,
   R as useGetDerivedNamespace,
   I as useGlobalConfig,
   g as useLocale,
-  _t as useManualRef,
-  Ut as useMessage,
+  $t as useManualRef,
+  Vt as useMessage,
   M as useNamespace,
   Wr as usePageListApTable,
-  Qt as useResize,
+  Yt as useResize,
   or as useTableModal,
   ct as useTablePaging,
   Hr as useTableRefresh,
   tr as useTableSelectModal,
-  $t as useThrottleRef
+  qt as useThrottleRef
 };

package/es/src/ap-grid/constants.d.ts

@@ -0,0 +1,9 @@
+export declare const sizeMap: {
+    readonly mini: undefined;
+    readonly small: "small";
+    readonly medium: "middle";
+};
+export declare const sizeReverseMap: {
+    readonly small: "small";
+    readonly middle: "medium";
+};

package/es/src/ap-grid/constants.mjs

@@ -0,0 +1,12 @@
+const m = {
+  mini: void 0,
+  small: "small",
+  medium: "middle"
+}, e = {
+  small: "small",
+  middle: "medium"
+};
+export {
+  m as sizeMap,
+  e as sizeReverseMap
+};

package/es/src/ap-grid/hooks/use-inner-params.d.ts

@@ -0,0 +1,10 @@
+import { ApGridProps } from '../interface';
+import { VxeTableEvents } from 'vxe-table';
+/**
+ * 用于管理内部生成的查询参数（排序/筛选/分页等）
+ */
+export declare const useInnerParams: <RecordType>(tableChangeCallback: ApGridProps["onChange"]) => {
+    sortChangeEvent: VxeTableEvents.SortChange<RecordType>;
+    filterChangeEvent: VxeTableEvents.FilterChange<RecordType>;
+    paginationChangeEvent: (page: number, pageSize: number) => void;
+};

package/es/src/ap-grid/hooks/use-inner-params.mjs

@@ -0,0 +1,41 @@
+import { DEFAULT_PAGE_SIZE as g, DEFAULT_CURRENT as E } from "../../ap-table/hooks/use-table-paging-ng.mjs";
+const a = {
+  asc: "ascend",
+  desc: "descend"
+}, v = (o) => {
+  const t = {};
+  let c = {};
+  const s = {
+    current: E,
+    pageSize: g
+  };
+  function i(n) {
+    o == null || o(s, c, t, {
+      currentDataSource: [],
+      action: n
+    });
+  }
+  return {
+    sortChangeEvent: ({
+      field: n,
+      order: e,
+      column: r
+    }) => {
+      t.column = r, t.order = e ? a[e] : null, t.field = n, i("sort");
+    },
+    filterChangeEvent: ({
+      filterList: n
+    }) => {
+      const e = {};
+      for (const r of n)
+        e[r.field] = r.values;
+      c = e, i("filter");
+    },
+    paginationChangeEvent: (n, e) => {
+      s.current = n, s.pageSize = e, i("paginate");
+    }
+  };
+};
+export {
+  v as useInnerParams
+};

package/es/src/ap-grid/hooks/use-render-columns.d.ts

@@ -0,0 +1,6 @@
+import { Ref, ComputedRef } from 'vue';
+import { ApGridColumnType } from '../interface';
+export declare const useRenderColumns: <RecordType>(columns: Ref<ApGridColumnType<RecordType>[]>) => {
+    renderConfig: ComputedRef<import("vue/jsx-runtime").JSX.Element[]>;
+    updateSignal: Ref<number, number>;
+};

package/es/src/ap-grid/hooks/use-render-columns.mjs

@@ -0,0 +1,29 @@
+import { ref as a, watch as u, computed as m, unref as p } from "vue";
+import { useToken as i } from "@aplus-frontend/antdv/es/theme/internal";
+import "../../config-provider/index.mjs";
+import { renderWithColumns as l } from "../utils/renderer.mjs";
+import { useNamespace as s } from "../../config-provider/hooks/use-namespace.mjs";
+import { useGlobalConfig as f } from "../../config-provider/hooks/use-global-config.mjs";
+const w = (e) => {
+  const [, o] = i(), { be: t } = s("ap-grid"), n = f("valueTypeMap"), r = a(Date.now());
+  return u(
+    () => e.value,
+    () => {
+      r.value = Date.now();
+    },
+    {
+      deep: !0
+    }
+  ), {
+    renderConfig: m(() => l(
+      e.value,
+      o.value.colorPrimary,
+      t("table-header", "title"),
+      p(n)
+    )),
+    updateSignal: r
+  };
+};
+export {
+  w as useRenderColumns
+};

package/es/src/ap-grid/index.d.ts

@@ -0,0 +1,3 @@
+import { default as ApGrid } from './index.vue';
+export { ApGrid };
+export * from './interface';

package/es/src/ap-grid/index.mjs

@@ -0,0 +1,2 @@
+import "./index.vue2.mjs";
+import "./interface.mjs";

package/es/src/ap-grid/index.vue.d.ts

@@ -0,0 +1,44 @@
+import { VxeTableSlots } from 'vxe-table';
+import { ApGridColumnType, ApGridExpose, ApGridProps } from './interface';
+import { VNodeProps, AllowedComponentProps, ComponentCustomProps, PublicProps, ShallowUnwrapRef, VNode } from 'vue';
+declare const _default: <RecordType>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
+    props: __VLS_PrettifyLocal<Pick<Partial<{}> & Omit<{} & VNodeProps & AllowedComponentProps & ComponentCustomProps, never>, never> & ApGridProps<RecordType> & Partial<{}>> & PublicProps;
+    expose(exposed: ShallowUnwrapRef<ApGridExpose>): void;
+    attrs: any;
+    slots: Readonly<VxeTableSlots<RecordType> & {
+        /**
+         * 自定义查询表单额外的区域
+         */
+        searchFormExtra?: any;
+        /**
+         * 自定义表格上部查询表单下部分区域的渲染
+         */
+        title?: (params: {
+            selectedRows: RecordType[];
+            selectedRowKeys: (string | number)[];
+            shownColumns: ApGridColumnType<RecordType>[];
+            clearAll: () => void;
+        }) => any;
+    }> & VxeTableSlots<RecordType> & {
+        /**
+         * 自定义查询表单额外的区域
+         */
+        searchFormExtra?: any;
+        /**
+         * 自定义表格上部查询表单下部分区域的渲染
+         */
+        title?: (params: {
+            selectedRows: RecordType[];
+            selectedRowKeys: (string | number)[];
+            shownColumns: ApGridColumnType<RecordType>[];
+            clearAll: () => void;
+        }) => any;
+    };
+    emit: {};
+}>) => VNode & {
+    __ctx?: Awaited<typeof __VLS_setup>;
+};
+export default _default;
+type __VLS_PrettifyLocal<T> = {
+    [K in keyof T]: T[K];
+} & {};

package/es/src/ap-grid/index.vue.mjs

@@ -0,0 +1,356 @@
+import { defineComponent as ye, getCurrentInstance as Se, useSlots as we, ref as w, computed as n, unref as a, watchEffect as ve, watch as $, createElementBlock as v, openBlock as s, normalizeClass as b, createCommentVNode as R, createElementVNode as H, normalizeStyle as U, createVNode as be, mergeProps as c, createSlots as q, withCtx as f, Fragment as M, renderList as P, createBlock as u, resolveDynamicComponent as E, renderSlot as N, normalizeProps as Re, guardReactiveProps as xe } from "vue";
+import { VxeTable as Fe, VxeColumn as G } from "vxe-table";
+import ke from "vxe-pc-ui";
+import "vxe-table/lib/style.css";
+import "vxe-pc-ui/lib/style.css";
+import { isUndefined as x, omit as Be } from "lodash-unified";
+import { ApForm as Ie } from "../ap-form/index.mjs";
+import "../config-provider/index.mjs";
+import { noRenderAsFormItemValueList as Pe } from "../ap-table/constants.mjs";
+import { getColumnOrder as X, updateFormProps as Ee, getFieldProps as Ne, getSearchFormItemRenderNode as ze, recursionApColumns as J } from "../ap-table/utils.mjs";
+import { useTablePaging as Te } from "../ap-table/hooks/use-table-paging-ng.mjs";
+import { Pagination as Ve } from "@aplus-frontend/antdv";
+import { useInnerParams as _e } from "./hooks/use-inner-params.mjs";
+import { toVxeProps as Ae, getRowExpandProps as Oe, getRowSelectionProps as Le } from "./utils/table.mjs";
+import De from "../ap-table/hooks/use-table-row-selection.mjs";
+import { useProvideApTable as Ke } from "../ap-table/context.mjs";
+import { sizeReverseMap as je, sizeMap as We } from "./constants.mjs";
+import { useRenderColumns as $e } from "./hooks/use-render-columns.mjs";
+import { useToken as He } from "@aplus-frontend/antdv/es/theme/internal";
+import { useNamespace as Ue } from "../config-provider/hooks/use-namespace.mjs";
+import { useGlobalConfig as qe } from "../config-provider/hooks/use-global-config.mjs";
+const ga = /* @__PURE__ */ ye({
+  name: "ApGrid",
+  __name: "index",
+  props: {
+    dropdownPrefixCls: {},
+    loading: { type: [Boolean, Object], default: void 0 },
+    bordered: { type: Boolean, default: !1 },
+    locale: {},
+    onChange: {},
+    onResizeColumn: {},
+    getPopupContainer: {},
+    scroll: {},
+    sortDirections: { default: () => ["ascend", "descend"] },
+    showSorterTooltip: { type: [Boolean, Object], default: !1 },
+    prefixCls: {},
+    tableLayout: {},
+    title: {},
+    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: {},
+    rowClassName: {},
+    stripe: { type: Boolean },
+    headerRowClassName: {},
+    footerRowClassName: {},
+    cellClassName: {},
+    headerCellClassName: {},
+    footerCellClassName: {},
+    rowStyle: {},
+    headerRowStyle: {},
+    footerRowStyle: {},
+    cellStyle: {},
+    headerCellStyle: {},
+    footerCellStyle: {},
+    height: {},
+    minHeight: {},
+    maxHeight: {},
+    mergeCells: {},
+    mergeFooterItems: {},
+    cellConfig: {},
+    columns: {},
+    rowSelection: { type: Boolean },
+    card: { type: Boolean, default: !1 },
+    params: {},
+    request: {},
+    defaultData: {},
+    dataSource: {},
+    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: "medium" },
+    adaptive: { type: Boolean, default: !1 },
+    columnResizable: { type: [Boolean, Object], default: !1 },
+    rowKey: { default: "key" },
+    footer: {},
+    virtual: { type: [Boolean, Object], default: void 0 },
+    expandable: {}
+  },
+  setup(Q, { expose: Y }) {
+    var W;
+    const m = (W = Se()) == null ? void 0 : W.appContext.app;
+    m && !m.__VXE_PC_UI_INSTALLED__ && (m.use(ke), m.__VXE_PC_UI_INSTALLED__ = !0);
+    const z = we(), o = Q, { e: F, b: g, be: Z } = Ue("ap-grid"), ee = qe("valueTypeMap"), d = w([]), T = w([]), h = w(), k = w(o.size), [, ae] = He(), { renderConfig: oe, updateSignal: te } = $e(d);
+    let V = 0;
+    const _ = n(() => {
+      var e, l, r;
+      return V++, ((r = (l = (e = o.columns) == null ? void 0 : e.filter(
+        (t) => !t.hideInSearch && t.dataIndex && (t.valueType || t.customRenderFormItem) && !Pe.includes(t.valueType)
+      )) == null ? void 0 : l.sort((t, i) => {
+        let p = X(t.order);
+        return X(i.order) - p;
+      })) == null ? void 0 : r.map((t) => {
+        const i = Ee(
+          t,
+          Ne(t.fieldProps, {})
+        ), p = {
+          ...t,
+          fieldProps: {
+            label: t.title,
+            name: t.dataIndex,
+            ...i || {},
+            _signal: V
+          },
+          renderNode: void 0
+        };
+        return p.renderNode = ze(
+          p,
+          a(ee)
+        ), p;
+      })) || [];
+    }), re = n(() => [g(), o.card ? null : g("wrapper")].filter(Boolean)), A = n(() => J(a(d), (e) => {
+      if (e.sorter === !0)
+        return e.key || e.dataIndex;
+    }).filter(Boolean)), O = n(() => J(a(d), (e) => {
+      if (e.filters && !e.onFilter)
+        return e.key || e.dataIndex;
+    }).filter(Boolean)), {
+      formRef: B,
+      submit: L,
+      reset: D,
+      refresh: le,
+      data: C,
+      tableProps: ne,
+      setDataSource: se,
+      handleTableChange: de
+    } = Te({
+      async request(e) {
+        var r;
+        if (!S.value.preserveSelectedRowKeys && x(o.dataSource) && I(), !x(o.dataSource)) {
+          const t = e.pageSize * (e.current - 1);
+          return {
+            data: (o.pagination === !1 ? o.dataSource : o.dataSource.slice(t, t + e.pageSize)) || [],
+            total: o.dataSource.length || 0
+          };
+        }
+        const l = await ((r = o.request) == null ? void 0 : r.call(o, e));
+        return {
+          data: (l == null ? void 0 : l.data) || [],
+          total: (l == null ? void 0 : l.total) || 0
+        };
+      },
+      namespace: "ap-grid",
+      filterFields: O,
+      sortFields: A,
+      defaultParams: o.params,
+      defaultData: o.defaultData,
+      manual: o.manual,
+      formatParams: o.beforeSearchSubmit,
+      pagination: o.pagination
+    }), { sortChangeEvent: ie, filterChangeEvent: ue, paginationChangeEvent: ce } = _e(de);
+    Ke({
+      columns: n(() => d.value),
+      columnsBackup: n(() => T.value),
+      size: n(() => We[k.value]),
+      updateColumns(e) {
+        d.value = e;
+      },
+      updateSize(e) {
+        k.value = je[e];
+      },
+      renderConfig: n(() => ({
+        className: Z("table-header", "title"),
+        color: ae.value.colorPrimary
+      }))
+    });
+    const K = n(
+      () => d.value.some(
+        (e) => e.fixed === "left" || e.fixed === !0
+      ) ? "left" : void 0
+    ), pe = n(
+      () => x(o.dataSource) ? C.records : o.dataSource
+    ), { selectedRows: y, rowSelection: S, ...fe } = De({
+      ...o.rowSelection === !0 ? {} : o.rowSelection,
+      dataSource: pe,
+      rowKey: o.rowKey
+    }), j = () => {
+      const e = h.value;
+      e && (y.value = [
+        ...e.getCheckboxReserveRecords(),
+        ...e.getCheckboxRecords()
+      ]);
+    }, me = () => {
+      const e = h.value;
+      e && (y.value = [e.getRadioRecord()]);
+    };
+    function ge() {
+      var e;
+      return ((e = o.columns) == null ? void 0 : e.filter((l) => !l.hideInTable)) || [];
+    }
+    function he(e) {
+      var l, r, t;
+      (t = (r = (l = B.value) == null ? void 0 : l.apForm) == null ? void 0 : r.setFieldsValue) == null || t.call(r, e);
+    }
+    function Ce(e = !1) {
+      var r, t, i;
+      const l = e ? "getFieldsValueTransformed" : "getFieldsValue";
+      return (i = (t = (r = B.value) == null ? void 0 : r.apForm) == null ? void 0 : t[l]) == null ? void 0 : i.call(t, !0);
+    }
+    function I() {
+      fe.clearAll();
+      const e = h.value;
+      e && (S.value.type === "radio" ? (e.clearRadioRow(), e.clearRadioReserve()) : (e.clearCheckboxRow(), e.clearCheckboxReserve()));
+    }
+    return ve(() => {
+      const e = ge();
+      d.value = e, T.value = e;
+    }), $(
+      () => o.dataSource,
+      (e) => {
+        se(e);
+      },
+      { immediate: !0 }
+    ), $(
+      () => a(C).loading,
+      (e) => {
+        var l;
+        (l = o.onLoadingChange) == null || l.call(o, e);
+      }
+    ), Y({
+      submit: L,
+      reset: D,
+      refresh: le,
+      setSearchFormValues: he,
+      getSearchFormValues: Ce,
+      getShowColumns: () => a(d),
+      rowSelection: {
+        selectedRows: n(() => y.value),
+        clearAll: I
+      }
+    }), (e, l) => (s(), v("div", {
+      class: b(re.value)
+    }, [
+      a(x)(e.dataSource) && e.searchForm !== !1 && _.value.length > 0 ? (s(), v("div", {
+        key: 0,
+        class: b(e.card ? a(F)("search-wrapper") : null),
+        style: U(e.searchFormWrapperStyle)
+      }, [
+        be(a(Ie).SearchForm, c(e.searchForm || {}, {
+          ref_key: "formRef",
+          ref: B,
+          "custom-reset": "",
+          "submit-loading": !1,
+          onSubmit: a(L),
+          onReset: a(D)
+        }), q({
+          default: f(() => [
+            (s(!0), v(M, null, P(_.value, (r) => (s(), u(E(r.renderNode.Comp), c({
+              key: r.dataIndex,
+              item: r,
+              ref_for: !0
+            }, r.fieldProps || {}, {
+              span: r.span,
+              "custom-render": r.renderNode.render
+            }), null, 16, ["item", "span", "custom-render"]))), 128))
+          ]),
+          _: 2
+        }, [
+          z.searchFormExtra ? {
+            name: "extra",
+            fn: f(() => [
+              N(e.$slots, "searchFormExtra")
+            ]),
+            key: "0"
+          } : void 0
+        ]), 1040, ["onSubmit", "onReset"])
+      ], 6)) : R("", !0),
+      H("div", {
+        class: b([a(F)("table-wrapper"), e.card ? a(F)("table-wrapper-card") : null]),
+        style: U(e.tableWrapperStyle)
+      }, [
+        H("div", {
+          class: b(a(g)("header-wrapper"))
+        }, [
+          N(e.$slots, "title", {
+            selectedRows: a(y),
+            selectedRowKeys: a(S).selectedRowKeys,
+            shownColumns: d.value,
+            clearAll: I
+          })
+        ], 2),
+        (s(), u(a(Fe), c(a(Ae)(o), {
+          ref_key: "tableRef",
+          ref: h,
+          key: a(te),
+          data: a(C).records,
+          "sort-config": { remote: A.value.length > 0 },
+          "filter-config": { remote: O.value.length > 0 },
+          loading: a(C).loading,
+          "row-config": {
+            isHover: !0,
+            keyField: o.rowKey
+          },
+          size: k.value,
+          onSortChange: a(ie),
+          onFilterChange: a(ue),
+          onCheckboxChange: j,
+          onCheckboxAll: j,
+          onRadioChange: me
+        }), q({
+          default: f(() => [
+            o.expandable ? (s(), u(a(G), c({ key: 0 }, a(Oe)(e.expandable), { fixed: K.value }), {
+              content: f((r) => [
+                (s(), u(E(o.expandable.renderContent(r))))
+              ]),
+              _: 1
+            }, 16, ["fixed"])) : R("", !0),
+            o.rowSelection ? (s(), u(a(G), c({ key: 1 }, a(Le)(a(S)), { fixed: K.value }), null, 16, ["fixed"])) : R("", !0),
+            (s(!0), v(M, null, P(a(oe), (r) => (s(), u(E(r), {
+              key: r.props.colId
+            }))), 128))
+          ]),
+          _: 2
+        }, [
+          P(a(Be)(z, ["searchFormExtra"]), (r, t) => ({
+            name: t,
+            fn: f((i) => [
+              N(e.$slots, t, Re(xe(i || {})))
+            ])
+          }))
+        ]), 1040, ["data", "sort-config", "filter-config", "loading", "row-config", "size", "onSortChange", "onFilterChange"])),
+        e.pagination !== !1 ? (s(), u(a(Ve), c({
+          key: 0,
+          class: a(g)("pagination")
+        }, a(ne).pagination, { onChange: a(ce) }), null, 16, ["class", "onChange"])) : R("", !0)
+      ], 6)
+    ], 2));
+  }
+});
+export {
+  ga as default
+};

package/es/src/ap-grid/index.vue2.mjs

@@ -0,0 +1,4 @@
+import f from "./index.vue.mjs";
+export {
+  f as default
+};