@aplus-frontend/ui 0.0.1-beta.39 → 0.0.1-beta.40

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

@@ -0,0 +1,55 @@
+import "../ap-action/index.mjs";
+import "../ap-field/index.mjs";
+import "../ap-form/index.mjs";
+import "./components/index/index.vue.mjs";
+import m from "../ap-form/items/date/index.vue.mjs";
+import o from "../ap-form/items/date-range/index.vue.mjs";
+import r from "../ap-form/items/number/index.vue.mjs";
+import i from "../ap-form/items/radio/index.vue.mjs";
+import t from "../ap-form/items/select/index.vue.mjs";
+import f from "../ap-form/items/switch/index.vue.mjs";
+import a from "../ap-form/items/text/index.vue.mjs";
+import _ from "../ap-form/items/text-area/index.vue.mjs";
+import c from "../ap-form/items/checkbox/index.vue.mjs";
+import e from "../ap-field/date/index.vue.mjs";
+import n from "../ap-field/date-range/index.vue.mjs";
+import p from "../ap-field/number/index.vue.mjs";
+import s from "../ap-field/radio/index.vue.mjs";
+import $ from "../ap-field/select/index.vue.mjs";
+import d from "../ap-field/switch/index.vue.mjs";
+import x from "../ap-field/text/index.vue.mjs";
+import b from "../ap-field/text-area/index.vue.mjs";
+import h from "../ap-field/checkbox/index.vue.mjs";
+import l from "../ap-action/group/index.vue.mjs";
+import R from "./components/index/index.vue2.mjs";
+const N = {
+  date: m,
+  dateRange: o,
+  number: r,
+  radio: i,
+  select: t,
+  switch: f,
+  text: a,
+  textArea: _,
+  checkbox: c
+}, O = {
+  date: e,
+  dateRange: n,
+  number: p,
+  radio: s,
+  select: $,
+  switch: d,
+  text: x,
+  textArea: b,
+  checkbox: h,
+  action: l,
+  index: R
+}, P = [
+  "action",
+  "index"
+];
+export {
+  N as apTableFormItemMap,
+  O as apTableRenderItemMap,
+  P as noRenderAsFormItemValueList
+};

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

@@ -25,6 +25,10 @@ export type UseTablePagingParams<DataType, ParamsType> = {
      * 额外的默认请求参数，这个参数变更不会触发网络请求
      */
     defaultParams?: ParamsType;
+    /**
+     * 默认的数据源
+     */
+    defaultData?: DataType[];
     /**
      * 数据请求前格式化请求参数
      * @param values
@@ -48,7 +52,7 @@ export type UseTablePagingParams<DataType, ParamsType> = {
      */
     sortFields?: string[];
 };
-export declare const useTablePaging: <DataType = any, ParamsType = Record<string, any>>({ manual, defaultCurrent, defaultPageSize, request, defaultParams, formatParams, paramsValueTypeMap, resetFieldsIgnores, filterFields, sortFields }: UseTablePagingParams<DataType, ParamsType>) => {
+export declare const useTablePaging: <DataType = any, ParamsType = Record<string, any>>({ manual, defaultCurrent, defaultPageSize, request, defaultParams, defaultData, formatParams, paramsValueTypeMap, resetFieldsIgnores, filterFields, sortFields }: UseTablePagingParams<DataType, ParamsType>) => {
     formRef: Ref<ApFormSearchFormExpose | undefined>;
     submit: () => void;
     reset: () => void;

package/es/src/ap-table/hooks/use-table-paging.mjs

@@ -0,0 +1,142 @@
+import { ref as v, unref as r, onMounted as N, computed as j } from "vue";
+import { parseFieldValue as U, dataIndexToStr as W } from "../utils.mjs";
+import { isArray as X } from "lodash-unified";
+import "../../config-provider/index.mjs";
+import { useLocale as Y } from "../../config-provider/hooks/use-locale.mjs";
+const ae = ({
+  manual: x = !1,
+  defaultCurrent: y = 1,
+  defaultPageSize: S = 10,
+  request: D,
+  defaultParams: R = {},
+  defaultData: A = [],
+  formatParams: T,
+  paramsValueTypeMap: z,
+  resetFieldsIgnores: P,
+  filterFields: B = [],
+  sortFields: E = []
+}) => {
+  let F = 0, f = {};
+  const L = (e) => T ? T(e) : e, c = v(), l = v(y), g = v(S), { t: C } = Y(), n = v({
+    total: 0,
+    records: A,
+    loading: !1
+  }), V = async (e) => {
+    var o;
+    const a = L(e), t = Date.now();
+    F = t, n.value.loading = !0;
+    try {
+      const s = await D({
+        ...R,
+        ...a
+      });
+      F === t && (n.value.total = s.total || ((o = s.data) == null ? void 0 : o.length) || 0, n.value.records = [...s.data || []]);
+    } catch {
+      F === t && (n.value.records = [], n.value.total = 0);
+    } finally {
+      n.value.loading = !1;
+    }
+  }, b = (e) => {
+    const a = {};
+    return Object.entries(e).forEach(([t, o]) => {
+      if (a[t] = o, z && o) {
+        const s = z[t];
+        s && (a[t] = U(s, o));
+      }
+    }), a;
+  }, M = (e) => {
+    var o, s, d, p, m, u, i;
+    const a = ((s = (o = c.value) == null ? void 0 : o.apForm) == null ? void 0 : s.getFieldsValue()) || {}, t = {};
+    Object.entries(a).forEach(([$, K]) => {
+      P && P.indexOf($) > -1 && (t[$] = K);
+    }), (p = (d = c.value) == null ? void 0 : d.apForm) == null || p.resetFields(), (i = (u = (m = c.value) == null ? void 0 : m.apForm) == null ? void 0 : u.setFieldsValue) == null || i.call(u, t), e == null || e();
+  }, h = (e) => {
+    f = e;
+    const a = b(e);
+    V(a);
+  }, q = (e) => {
+    h({
+      ...f,
+      ...e
+    });
+  }, w = () => {
+    var a, t;
+    const e = ((t = (a = c.value) == null ? void 0 : a.apForm) == null ? void 0 : t.getFieldsValue(!0)) || {};
+    h({
+      ...e,
+      pageCurrent: 1,
+      pageSize: f.pageSize || S
+    });
+  }, J = () => {
+    M(w);
+  }, Q = () => {
+    h(f);
+  }, G = (e) => {
+    const a = r(n).total - e, t = Math.ceil(a / r(g)), o = r(l) > t ? t : r(l);
+    q({
+      current: o > 0 ? o : 1
+    });
+  }, O = (e, a, t) => {
+    var m, u;
+    const o = ((u = (m = c.value) == null ? void 0 : m.apForm) == null ? void 0 : u.getFieldsValue(!0)) || {};
+    l.value = e.current, g.value = e.pageSize;
+    const s = X(t) ? [...t] : [t], d = {};
+    for (const i of s)
+      E.includes(i.field) && (d[W(i.field)] = i.order);
+    const p = {};
+    for (const i of Object.keys(a))
+      B.includes(i) && (p[i] = a[i]);
+    h({
+      ...o,
+      filter: p,
+      sort: d,
+      current: e.current,
+      pageSize: e.pageSize
+    });
+  };
+  N(() => {
+    var a, t;
+    const e = ((t = (a = c.value) == null ? void 0 : a.apForm) == null ? void 0 : t.getFieldsValue(!0)) || {};
+    if (f = {
+      current: r(l),
+      pageSize: r(g),
+      ...e
+    }, !x) {
+      const o = b(f);
+      V(o);
+    }
+  });
+  const H = j(() => r(n).total === 0 ? "-" : `${r(l.value)}/${Math.ceil(
+    r(n).total / r(g)
+  )}`), I = j(() => ({
+    loading: r(n).loading,
+    pagination: {
+      current: r(l),
+      pageSize: r(g),
+      total: r(n).total,
+      showSizeChanger: !0,
+      showQuickJumper: !0,
+      showTotal: (e) => `${C("ap.apTable.pagination.totalLeft", { total: e })} ${C(
+        "ap.apTable.pagination.totalRight",
+        { page: r(H) }
+      )}`
+    },
+    onChange: O,
+    dataSource: r(n).records
+  }));
+  return {
+    formRef: c,
+    submit: w,
+    reset: J,
+    refresh: Q,
+    refreshByDelete: G,
+    data: n,
+    current: l,
+    pageSize: g,
+    handleTableChange: O,
+    tableProps: I
+  };
+};
+export {
+  ae as useTablePaging
+};

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

@@ -0,0 +1,5 @@
+import { default as ApTable } from './ap-table.vue';
+
+export { ApTable };
+export * from './interface';
+export * from './hooks/use-table-paging';

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

@@ -0,0 +1,6 @@
+import "./ap-table.vue2.mjs";
+import "./interface.mjs";
+import { useTablePaging as m } from "./hooks/use-table-paging.mjs";
+export {
+  m as useTablePaging
+};

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

@@ -1,8 +1,11 @@
 import { ColumnType, TableProps } from 'ant-design-vue/es/table';
-import { CompareFn } from 'ant-design-vue/es/table/interface';
+import { CompareFn, SortOrder } from 'ant-design-vue/es/table/interface';
 import { ApFormSearchFormProps } from '../ap-form';
-import { ApFormItemDateProps, ApFormItemDateRangeProps, ApFormItemNumberProps, ApFormItemRadioProps, ApFormItemSelectProps, ApFormItemSwitchProps, ApFormItemTextAreaProps, ApFormItemTextProps } from 'src/ap-form/items/interface';
+import { ApFormItemCheckboxProps, ApFormItemDateProps, ApFormItemDateRangeProps, ApFormItemNumberProps, ApFormItemRadioProps, ApFormItemSelectProps, ApFormItemSwitchProps, ApFormItemTextAreaProps, ApFormItemTextProps } from 'src/ap-form/items/interface';
+import { Recordable } from '../type';
 import { CSSProperties } from 'vue';
+import { ApActionGroupProps } from '../ap-action';
+import { ApTableIndexProps } from './components/interface';
 
 type ValueEnmuTyType = {
     text: string;
@@ -13,7 +16,7 @@ type ValueEnmuTyType = {
 /**
  * ApTable默认支持的值类型（将会用于表单生成和默认值格式化）
  */
-export type ApTableFormFields = {
+export type ApTableValueFields = {
     /** 日期选择器 */
     date: ApFormItemDateProps;
     /** 日期范围选择器 */
@@ -30,8 +33,18 @@ export type ApTableFormFields = {
     text: ApFormItemTextProps;
     /** 多行文本输入 */
     textArea: ApFormItemTextAreaProps;
+    /** 多选 */
+    checkbox: ApFormItemCheckboxProps;
+    /**
+     * 操作列
+     */
+    action: ApActionGroupProps;
+    /**
+     * 索引列
+     */
+    index: ApTableIndexProps;
 };
-type ValueEnum = Record<string, ValueEnmuTyType>;
+export type ValueEnum = Record<string, ValueEnmuTyType>;
 export type ExtraProColumnType<T> = Omit<ColumnType<T>, 'children'> & {
     sorter?: string | boolean | CompareFn<T> | {
         compare?: CompareFn<T>;
@@ -39,7 +52,7 @@ export type ExtraProColumnType<T> = Omit<ColumnType<T>, 'children'> & {
         multiple?: number;
     };
 };
-export type ApColumnType<ValueType extends keyof ApTableFormFields = 'text'> = ExtraProColumnType<any> & {
+export type ApColumnType<ValueType extends keyof ApTableValueFields = 'text'> = ExtraProColumnType<any> & {
     children?: ApColumnType[];
     /**
      * 表单项所占据的格子数（1-24格）
@@ -63,36 +76,37 @@ export type ApColumnType<ValueType extends keyof ApTableFormFields = 'text'> = E
     hideInTable?: boolean;
     /**
      * 值的枚举，会自动转化把值当成 key 来取出要显示的内容（也会作为select的选项）
+     * @deprecated 未实现请使用`fieldProps.options`
      */
     valueEnum?: ValueEnum;
     /**
      * 自定义查询表单渲染
      */
-    customRenderFormItem?: () => any;
+    customRenderFormItem?: (config: ApColumnType) => any;
     /**
      * 指定值类型（将会用于默认渲染和查询表单生成）
      */
-    valueType?: keyof ApTableFormFields;
+    valueType?: keyof ApTableValueFields;
     /**
      * 值类型额外配置的参数（用于查询表单渲染）
      */
-    fieldProps?: ApTableFormFields[ValueType];
+    fieldProps?: ApTableValueFields[ValueType];
 };
 export type RequestData<T> = {
     data: T[] | undefined;
     total: number;
 } & Record<string, any>;
-export type ApTableProps<RecordType = any, ParamsType = any, ValueType extends keyof ApTableFormFields = 'text'> = Omit<TableProps<RecordType>, 'columns' | 'pagination'> & {
+export type ApTableProps<RecordType = any, ParamsType = any, ValueType extends keyof ApTableValueFields = 'text'> = Omit<TableProps<RecordType>, 'columns' | 'pagination' | 'dataSource' | 'size'> & {
     /**
      * 列配置
      */
-    columns?: ApColumnType<ValueType>[];
+    columns?: ApColumnType<any>[];
     /**
      * 是否启用卡片样式
      */
     card?: boolean;
     /**
-     * request请求参数，修改后会自动触发更新
+     * request额外请求的参数，这些参数在变更时将不会自动发起网络请求
      */
     params?: ParamsType;
     /**
@@ -110,6 +124,8 @@ export type ApTableProps<RecordType = any, ParamsType = any, ValueType extends k
     request?: (params: ParamsType & {
         pageSize?: number;
         current?: number;
+        sort?: Record<string, SortOrder>;
+        filter?: Recordable<any>;
     }) => Promise<Partial<RequestData<RecordType>>>;
     /**
      * 数据加载完成后触发
@@ -118,7 +134,7 @@ export type ApTableProps<RecordType = any, ParamsType = any, ValueType extends k
      */
     onLoad?: (data: RecordType[]) => void;
     /**
-     * 表格的默认数据源
+     * 表格的默认数据源，这些数据源将会在第一次请求后被替换
      */
     defaultData?: RecordType[];
     /**
@@ -138,9 +154,12 @@ export type ApTableProps<RecordType = any, ParamsType = any, ValueType extends k
      */
     beforeSearchSubmit?: (params: Partial<ParamsType>) => any;
     /**
-     * 是否显示分页器（特定的分页器）
+     * 是否显示分页器（特定的分页器）或者指定默认的当前页和pageSize
      */
-    pagination?: boolean;
+    pagination?: false | {
+        defaultCurrent?: number;
+        defaultPageSize?: number;
+    };
     /**
      * 自定义查询表单容器样式
      */
@@ -149,5 +168,13 @@ export type ApTableProps<RecordType = any, ParamsType = any, ValueType extends k
      * 自定义表格样式
      */
     tableWrapperStyle?: CSSProperties;
+    /**
+     * 是否手动发起第一次网络请求
+     */
+    manual?: boolean;
+    /**
+     * 表格尺寸（只支持中等大小和小尺寸）
+     */
+    size?: 'middle' | 'small';
 };
 export {};

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

@@ -0,0 +1 @@
+

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

@@ -18,3 +18,29 @@
 .aplus-ap-table-table .ant-pagination .ant-pagination-total-text {
   flex: 1;
 }
+.aplus-ap-table-table tr > th.ant-table-cell {
+  background-color: #F2F6F9;
+  border-bottom-color: #E9EDF3;
+}
+.aplus-ap-table-table tr > th.ant-table-cell::before {
+  display: none;
+}
+.aplus-ap-table-table tr > td.ant-table-cell {
+  border-top-color: #E9EDF3;
+}
+.aplus-ap-table-table-admin .ant-pagination {
+  margin-bottom: 0 !important;
+}
+.aplus-ap-table-table-admin .ant-pagination .ant-pagination-total-text {
+  flex: 1;
+}
+.aplus-ap-table-table-admin tr > th.ant-table-cell {
+  background-color: #FAFAFA;
+  border-bottom-color: #E9E9E9;
+}
+.aplus-ap-table-table-admin tr > th.ant-table-cell::before {
+  display: none;
+}
+.aplus-ap-table-table-admin tr > td.ant-table-cell {
+  border-top-color: #E9E9E9;
+}

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

@@ -0,0 +1,35 @@
+import { isObject as t, isArray as c } from "lodash-unified";
+const f = (e, r, s) => {
+  let a = {};
+  return t(e) ? Object.keys(e).forEach((n) => {
+    t(e[n]) ? a[n] = f(e[n], r[n], s) : a[n] = s(e[n], r);
+  }) : a = s(e, r), a;
+}, u = (e, r) => {
+  switch (e) {
+    case "dayjs":
+      return r.valueOf();
+    case "dayjsRange":
+      return r.map((s) => s.valueOf());
+    case "dayjsDayRange": {
+      const [s, a] = r;
+      return [s.startOf("day").valueOf(), a.endOf("day").valueOf()];
+    }
+    case "multiple":
+    case "multipleNumber":
+      return c(r) ? r : [r];
+    case "boolean":
+      return r;
+    case "object":
+      return r;
+    default:
+      return r;
+  }
+};
+function O(e) {
+  return c(e) ? e.join(".") : e;
+}
+export {
+  O as dataIndexToStr,
+  f as formatParamsValueType,
+  u as parseFieldValue
+};

package/es/src/config-provider/config-provider-props.d.ts

@@ -0,0 +1,152 @@
+import { ExtractPropTypes, PropType } from 'vue';
+import { LocaleType } from '../locale/interface';
+import { ApiType, ScrollbarGlobalConfig, TableDefaultConfig } from './constants';
+import { default as __DTS_DEFAULT_0__ } from 'ant-design-vue/es/config-provider/renderEmpty';
+import { TransformCellTextProps } from 'ant-design-vue/es/table/interface';
+import { CSPConfig, SizeType, ThemeConfig } from 'ant-design-vue/es/config-provider/context';
+import { Locale } from 'ant-design-vue/es/locale';
+import { ValidateMessages } from 'ant-design-vue/es/form/interface';
+import { RequiredMark } from 'ant-design-vue/es/form/Form';
+
+export declare const configProviderProps: () => {
+    iconPrefixCls: StringConstructor;
+    getTargetContainer: {
+        type: PropType<() => HTMLElement | Window>;
+    };
+    getPopupContainer: {
+        type: PropType<(triggerNode?: HTMLElement | undefined) => HTMLElement>;
+    };
+    prefixCls: StringConstructor;
+    getPrefixCls: {
+        type: PropType<(suffixCls?: string | undefined, customizePrefixCls?: string | undefined) => string>;
+    };
+    renderEmpty: {
+        type: PropType< __DTS_DEFAULT_0__>;
+    };
+    transformCellText: {
+        type: PropType<(tableProps: TransformCellTextProps) => any>;
+    };
+    csp: {
+        type: PropType< CSPConfig>;
+        default: CSPConfig;
+    };
+    input: {
+        type: PropType<{
+            autocomplete?: string | undefined;
+        }>;
+        default: {
+            autocomplete?: string | undefined;
+        };
+    };
+    autoInsertSpaceInButton: {
+        type: BooleanConstructor;
+        default: any;
+    };
+    locale: {
+        type: PropType< Locale>;
+        default: Locale;
+    };
+    pageHeader: {
+        type: PropType<{
+            ghost?: boolean | undefined;
+        }>;
+        default: {
+            ghost?: boolean | undefined;
+        };
+    };
+    componentSize: {
+        type: PropType< SizeType>;
+    };
+    componentDisabled: {
+        type: BooleanConstructor;
+        default: any;
+    };
+    direction: {
+        type: PropType<"ltr" | "rtl">;
+        default: string;
+    };
+    space: {
+        type: PropType<{
+            size?: number | SizeType;
+        }>;
+        default: {
+            size?: number | SizeType;
+        };
+    };
+    virtual: {
+        type: BooleanConstructor;
+        default: any;
+    };
+    dropdownMatchSelectWidth: {
+        type: (BooleanConstructor | NumberConstructor)[];
+        default: boolean;
+    };
+    form: {
+        type: PropType<{
+            validateMessages?: ValidateMessages | undefined;
+            requiredMark?: RequiredMark | undefined;
+            colon?: boolean | undefined;
+        }>;
+        default: {
+            validateMessages?: ValidateMessages | undefined;
+            requiredMark?: RequiredMark | undefined;
+            colon?: boolean | undefined;
+        };
+    };
+    pagination: {
+        type: PropType<{
+            showSizeChanger?: boolean | undefined;
+        }>;
+        default: {
+            showSizeChanger?: boolean | undefined;
+        };
+    };
+    theme: {
+        type: PropType< ThemeConfig>;
+        default: ThemeConfig;
+    };
+    select: {
+        type: PropType<{
+            showSearch?: boolean | undefined;
+        }>;
+        default: {
+            showSearch?: boolean | undefined;
+        };
+    };
+    wave: {
+        type: PropType<{
+            disabled?: boolean | undefined;
+        }>;
+        default: {
+            disabled?: boolean | undefined;
+        };
+    };
+    /**
+     * @description aplus-ui的locale
+     */
+    aplusLocale: {
+        type: PropType<LocaleType>;
+    };
+    namespace: {
+        type: StringConstructor;
+        default: string;
+    };
+    api: {
+        type: PropType<ApiType>;
+        default: () => {};
+    };
+    table: {
+        type: PropType<TableDefaultConfig>;
+    };
+    scrollbar: {
+        type: PropType<ScrollbarGlobalConfig>;
+        default: () => {
+            native: boolean;
+        };
+    };
+    uiMode: {
+        type: PropType<"aplus" | "admin">;
+        default: string;
+    };
+};
+export type ConfigProviderProps = Partial<ExtractPropTypes<ReturnType<typeof configProviderProps>>>;