-
Notifications
You must be signed in to change notification settings - Fork 445
/
test.querySchema.js
149 lines (143 loc) · 5.3 KB
/
test.querySchema.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
import React from 'react';
import {Icon} from 'antd';
// 定义某个表的querySchema
// schema的结构和含义参考下面的例子
// 注意: 所有的key不能重复
module.exports = [
{
key: 'name', // 传递给后端的字段名
title: '用户名', // 前端显示的名称
placeholder: '请输入用户名', // 提示语, 可选
// 数据类型, 前端会根据数据类型展示不同的输入框
// 目前可用的dataType: int/float/varchar/datetime
// 为啥我会把字符串定义为varchar而不是string呢...我也不知道, 懒得改了...
dataType: 'varchar',
// 显示类型, 一些可枚举的字段, 比如type, 可以被显示为单选框或下拉框
// 默认显示类型是normal, 就是一个普通的输入框, 这时可以省略showType字段
// 目前可用的showType: normal/select/radio/between/checkbox/multiSelect/cascader
// between只能用于int/float/datetime, 会显示2个输入框, 用于范围查询
showType: 'normal',
// 有一点要注意, 就算showType是normal, 也不意味是等值查询, 只是说传递给后台的是单独的一个值
// 至于后台用这个值做等值/大于/小于/like, 前端不关心
// 对于varchar类型的字段, 可以设置前置标签和后置标签
addonBefore: (<Icon type="user"/>),
defaultValue: 'foolbear', // 默认值
},
{
key: 'blog',
title: 'BLOG',
placeholder: '请输入网址',
dataType: 'varchar',
showType: 'normal',
addonBefore: 'http://', // 这个前置和后置标签的值不能被传到后端, 其实作用很有限, 也就是美观点而已, antd官方的例子中还有用select做addon的, 感觉也没啥大用...
addonAfter: '.me',
defaultValue: 'jxy',
},
{
key: 'age',
title: '年龄',
placeholder: '请输入年龄',
dataType: 'int',
defaultValue: 18,
// 对于数字类型(int/float), 可以配置max/min
min: 0,
max: 99,
},
{
key: 'weight',
title: '体重(kg)',
dataType: 'float', // 小数会统一保留2位
defaultValue: 50.1,
min: 0,
max: 99.9,
},
{
key: 'type',
title: '类型',
dataType: 'int',
showType: 'select', // 下拉框选择, antd版本升级后, option的key要求必须是string, 否则会有个warning, 后端反序列化时要注意
options: [{key: '1', value: '类型1'}, {key: '2', value: '类型2'}],
defaultValue: '1', // 这个defaultValue必须和options中的key是对应的
},
{
key: 'userType',
title: '用户类型',
dataType: 'varchar', // 理论上来说, 这里的dataType可以是int/float/varchar甚至datetime, 反正对前端而言都是字符串, 只是后端反序列化时有区别
showType: 'radio', // 单选框, 和下拉框schema是一样的, 只是显示时有差别
options: [{key: 'typeA', value: '类型A'}, {key: 'typeB', value: '类型B'}],
defaultValue: 'typeB',
},
{
key: 'score',
title: '分数',
dataType: 'int',
showType: 'between', // 整数范围查询, 对于范围查询, 会自动生成xxBegin/xxEnd两个key传递给后端
defaultValueBegin: 9, // 对于between类型不搞max/min了, 太繁琐
defaultValueEnd: 99,
},
{
key: 'gpa',
title: 'GPA',
dataType: 'float',
showType: 'between', // 小数也可以范围查询, 固定两位小数
placeholderBegin: '哈哈', // 对于范围查询, 可以定义placeholderBegin和placeholderBegin, 用于两个框的提示语
placeholderEnd: '切克闹', // 如果不定义, 对于int/float的范围查询, 提示语是"最小值"/"最大值", 对于日期的范围查询, 提示语是"开始日期"/"结束日期"
defaultValueEnd: 99.9,
},
{
key: 'height',
title: '身高(cm)',
placeholder: '哈哈哈',
dataType: 'float', // 小数等值查询
},
{
key: 'duoxuan1',
title: '多选1',
dataType: 'int', // 跟select一样, 这里的值其实也可以是int/float/varchar/datetime
showType: 'checkbox', // checkbox
options: [{key: '1', value: '类型1'}, {key: '2', value: '类型2'}], // 同样注意, option的key必须是字符串
defaultValue: ['1', '2'], // 多选的defaultValue是个数组
},
{
key: 'duoxuan2',
title: '多选2',
dataType: 'varchar',
showType: 'multiSelect', // 另一种多选
options: [{key: 'type1', value: '类型1'}, {key: 'type2', value: '类型2'}],
defaultValue: ['type1'],
},
{
key: 'work',
title: '工作年限',
dataType: 'int',
min: 3,
},
{
key: 'duoxuan3',
title: '多选3',
dataType: 'varchar',
showType: 'multiSelect',
options: [{key: 'K', value: '开'}, {key: 'F', value: '封'}, {key: 'C', value: '菜'}],
defaultValue: ['K', 'F', 'C'],
},
{
key: 'primarySchool',
title: '入学日期',
dataType: 'datetime', // 日期范围查询, 日期范围查询占用的显示空间会很大, 注意排版
showType: 'between',
defaultValueBegin: '2016-01-01 12:34:56', // 注意日期类型defaultValue的格式
defaultValueEnd: '2016-12-01 22:33:44',
},
{
key: 'birthday',
title: '出生日期',
dataType: 'datetime',
showType: 'between',
defaultValueBegin: '2016-01-01 12:34:56',
},
{
key: 'xxbirthday',
title: 'XX日期',
dataType: 'datetime', // 日期等值查询
},
];