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

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

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require("../ap-action/index.js");require("../ap-field/index.js");require("../ap-form/index.js");require("./components/index/index.vue.js");const e=require("../ap-form/items/date/index.vue.js"),t=require("../ap-form/items/date-range/index.vue.js"),_=require("../ap-form/items/number/index.vue.js"),u=require("../ap-form/items/radio/index.vue.js"),r=require("../ap-form/items/select/index.vue.js"),n=require("../ap-form/items/switch/index.vue.js"),i=require("../ap-form/items/text/index.vue.js"),s=require("../ap-form/items/text-area/index.vue.js"),a=require("../ap-form/items/checkbox/index.vue.js"),p=require("../ap-field/date/index.vue.js"),c=require("../ap-field/date-range/index.vue.js"),d=require("../ap-field/number/index.vue.js"),l=require("../ap-field/radio/index.vue.js"),v=require("../ap-field/select/index.vue.js"),o=require("../ap-field/switch/index.vue.js"),x=require("../ap-field/text/index.vue.js"),g=require("../ap-field/text-area/index.vue.js"),q=require("../ap-field/checkbox/index.vue.js"),f=require("../ap-action/group/index.vue.js"),y=require("./components/index/index.vue2.js"),$={date:e.default,dateRange:t.default,number:_.default,radio:u.default,select:r.default,switch:n.default,text:i.default,textArea:s.default,checkbox:a.default},m={date:p.default,dateRange:c.default,number:d.default,radio:l.default,select:v.default,switch:o.default,text:x.default,textArea:g.default,checkbox:q.default,action:f.default,index:y.default},b=["action","index"];exports.apTableFormItemMap=$;exports.apTableRenderItemMap=m;exports.noRenderAsFormItemValueList=b;

package/lib/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/lib/src/ap-table/hooks/use-table-paging.js

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

package/lib/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/lib/src/ap-table/index.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require("./ap-table.vue2.js");require("./interface.js");const e=require("./hooks/use-table-paging.js");exports.useTablePaging=e.useTablePaging;

package/lib/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/lib/src/ap-table/interface.js

@@ -0,0 +1 @@
+"use strict";

package/lib/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/lib/src/ap-table/utils.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("lodash-unified"),o=(e,r,a)=>{let s={};return n.isObject(e)?Object.keys(e).forEach(t=>{n.isObject(e[t])?s[t]=o(e[t],r[t],a):s[t]=a(e[t],r)}):s=a(e,r),s},c=(e,r)=>{switch(e){case"dayjs":return r.valueOf();case"dayjsRange":return r.map(a=>a.valueOf());case"dayjsDayRange":{const[a,s]=r;return[a.startOf("day").valueOf(),s.endOf("day").valueOf()]}case"multiple":case"multipleNumber":return n.isArray(r)?r:[r];case"boolean":return r;case"object":return r;default:return r}};function u(e){return n.isArray(e)?e.join("."):e}exports.dataIndexToStr=u;exports.formatParamsValueType=o;exports.parseFieldValue=c;

package/lib/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>>>;