@eampwd/ant-old-component
v1.0.0
Published
## UI
Downloads
2
Readme
内部老项目,请不要使用
UI
1.useQueryTable / useQueryList
const { loading, submit, reset, baseButton, baseForm, baseTable, ...getFunc }
= useQueryTable(QueryTableProps, QueryData)
QueryTableProps
| 参数 | 说明 | 类型 | 默认值 | 是否必传 | | :-------- | :------- | --- | --- |--- | | url | 接口url | string | - | 是 | | useRequest | 设置为true时第一次不加载 | boolean | - | 是 | | handlePayload | 调接口前修改参数 | (payload: any) => (undefined | false | any) | - | 否 | | getTableData | 获取数据方法 | BaseResult<any, any[]> | baseTableGetData | 否 | | cacheKey | 唯一缓存值,将用作表单字段前缀 | string | - | 否 | | manual | 设置为true时第一次不加载 | boolean | - | 否 | | service | useRequest的service其它参数 | - | - | 否 | | options | useRequest的options其它参数 | - | - | 否 |
QueryData 用于设置初始查询条件,非必传
| 参数 | 说明 | 类型 | 默认值 | 是否必传 | | :-------- | :------- | --- | --- | --- | | pageIndex | 分页 | number | 1 | 否 | | pageSize | 一页数据条数 | number | 10 | 否 | | formData | 查询表单参数 | object | {} | 否 | | sorter | 排序查询条件 | SorterResult | — | 否 | | filters | 筛选查询条件 | Record<string, Key[] | null> | — | 否 |
Result useQueryTable返回参数结果
| 参数 | 说明 | 类型 | | :-------- | :------- | --- | | loading | 接口loading状态 | boolean | | submit | 手动触发列表查询 | (data?: QueryData) => Promise | | reset | 手动触发重置查询条件查询 | () => Promise | | baseButton | 查询重置按钮 | ReactNode | | baseForm | 传入Form参数 | antd 的 Form的参数 | | baseTable | 传入Form参数 | antd 的 Table的参数 | | getFunc | useRequest的其它Result | |
2.formClearEmpty 清除不用字段
function formClearEmpty(fieldsValue: { [key: string]: any } | undefined): object
3.baseTablePropsFunc 处理antd 的 Table 传参数
4.FormGroup 表单查询组件集合
<FormGroup
baseSpan={6} // 表示一个字段占多少份,默认值6,按一行分24等分
marginBottom={24} // 行之间距离,默认24
comList={[ // 小数组表示占一行,超出换行
[
{ // 属性和FormItem相同 多了个span字段
name: 'fireUnit',
label: '标题',
children: <Input />
},
{
span: 8,
name: 'unitName',
children: <FormSearch placeholder="请输入单位名称" allowClear />
}
]
]}
/>
3.Star 表单必传星号组件
方法
1.自定义缓存数据方法
setCache,
getCache,
getCacheData,
removeCache,
MyCache
2.浏览器通知方法
// 弹出获取通知权限框
setNotification(): Promise<boolean>
// 获取是否有通知权限
getNotificationPermission(): boolean
// 获取当前浏览器是否在显示
useShowPage(callback: (bool: boolean) => void)
// 弹出通知
createNotification(title: string, options?: NotificationOptions): Notification | false
3.解析出url 内所有参数
getQueryObject(url?: string): object
4.深入处理树结构数据
// 修改树字段
changeTreeInfo(list: any[], obj: { [key: string]: string }, childrenName: string = 'children'): any[]
// 查找id为某某的项,返回父级所有id
queryIdTreeInfo(list: CascaderOptionType[], id: string | number): string[]