Skip to content

Commit 2fa7907

Browse files
sendyasendya
committed
feat: update form to 1.1.10
1 parent 86e93e7 commit 2fa7907

File tree

7 files changed

+264
-249
lines changed

7 files changed

+264
-249
lines changed

‎package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@
99
},
1010
"dependencies": {
1111
"@antv/data-set": "^0.10.1",
12-
"ant-design-vue": "^1.1.10-beta",
12+
"ant-design-vue": "^1.1.10",
1313
"axios": "^0.18.0",
1414
"dayjs": "^1.7.5",
1515
"enquire.js": "^2.1.6",

‎src/views/form/BasicForm.vue

Lines changed: 22 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -6,10 +6,10 @@
66
:labelCol="{lg: {span: 7}, sm: {span: 7}}"
77
:wrapperCol="{lg: {span: 10}, sm: {span: 17} }">
88
<a-input
9-
v-decorator="{
10-
id: 'name',
11-
options: {rules: [{ required: true, message: '请输入标题' }]}
12-
}"
9+
v-decorator="[
10+
'name',
11+
{rules: [{ required: true, message: '请输入标题' }]}
12+
]"
1313
name="name"
1414
placeholder="给目标起个名字" />
1515
</a-form-item>
@@ -20,45 +20,45 @@
2020
<a-range-picker
2121
name="buildTime"
2222
style="width: 100%"
23-
v-decorator="{
24-
id: 'buildTime',
25-
options: {rules: [{ required: true, message: '请选择起止日期' }]}
26-
}" />
23+
v-decorator="[
24+
'buildTime',
25+
{rules: [{ required: true, message: '请选择起止日期' }]}
26+
]" />
2727
</a-form-item>
2828
<a-form-item
2929
label="目标描述"
3030
:labelCol="{lg: {span: 7}, sm: {span: 7}}"
3131
:wrapperCol="{lg: {span: 10}, sm: {span: 17} }">
3232
<a-textarea
33-
v-decorator="{
34-
id: 'description',
35-
options: {rules: [{ required: true, message: '请输入目标描述' }]}
36-
}"
3733
rows="4"
38-
placeholder="请输入你阶段性工作目标" />
34+
placeholder="请输入你阶段性工作目标"
35+
v-decorator="[
36+
'description',
37+
{rules: [{ required: true, message: '请输入目标描述' }]}
38+
]" />
3939
</a-form-item>
4040
<a-form-item
4141
label="衡量标准"
4242
:labelCol="{lg: {span: 7}, sm: {span: 7}}"
4343
:wrapperCol="{lg: {span: 10}, sm: {span: 17} }">
4444
<a-textarea
45-
v-decorator="{
46-
id: 'type',
47-
options: {rules: [{ required: true, message: '请输入衡量标准' }]}
48-
}"
4945
rows="4"
50-
placeholder="请输入衡量标准" />
46+
placeholder="请输入衡量标准"
47+
v-decorator="[
48+
'type',
49+
{rules: [{ required: true, message: '请输入衡量标准' }]}
50+
]" />
5151
</a-form-item>
5252
<a-form-item
5353
label="客户"
5454
:labelCol="{lg: {span: 7}, sm: {span: 7}}"
5555
:wrapperCol="{lg: {span: 10}, sm: {span: 17} }">
5656
<a-input
5757
placeholder="请描述你服务的客户，内部客户直接 @姓名／工号"
58-
v-decorator="{
59-
id: 'customer',
60-
options: {rules: [{ required: true, message: '请描述你服务的客户' }]}
61-
}" />
58+
v-decorator="[
59+
'customer',
60+
{rules: [{ required: true, message: '请描述你服务的客户' }]}
61+
]" />
6262
</a-form-item>
6363
<a-form-item
6464
label="邀评人"

‎src/views/form/advancedForm/AdvancedForm.vue

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -38,7 +38,7 @@
3838
<span v-else>
3939
<a @click="saveRow(record.key)">保存</a>
4040
<a-divider type="vertical" />
41-
<a @click="cancle(record.key)">取消</a>
41+
<a @click="cancel(record.key)">取消</a>
4242
</span>
4343
</template>
4444
<span v-else>
@@ -50,7 +50,7 @@
5050
</span>
5151
</template>
5252
</a-table>
53-
<a-button style="width: 100%; margin-top: 16px; margin-bottom: 8px" type="dashed" icon="plus" @click="newMeber">新增成员</a-button>
53+
<a-button style="width: 100%; margin-top: 16px; margin-bottom: 8px" type="dashed" icon="plus" @click="newMember">新增成员</a-button>
5454
</form>
5555
</a-card>
5656

@@ -136,7 +136,7 @@
136136
handleSubmit (e) {
137137
e.preventDefault()
138138
},
139-
newMeber () {
139+
newMember () {
140140
this.data.push({
141141
key: '-1',
142142
name: '',
@@ -163,7 +163,7 @@
163163
const data = this.data
164164
return (newData || data).filter(item => item.key === key)[0]
165165
},
166-
cancle (key) {
166+
cancel (key) {
167167
let target = this.data.filter(item => item.key === key)[0]
168168
target.editable = false
169169
},

‎src/views/form/advancedForm/RepositoryForm.vue

Lines changed: 118 additions & 110 deletions
Original file line numberDiff line numberDiff line change
@@ -1,111 +1,119 @@
1-
<template>
2-
<a-form @submit="handleSubmit" :autoFormCreate="(form) => this.form = form" class="form">
3-
<a-row class="form-row" :gutter="16">
4-
<a-col :lg="6" :md="12" :sm="24">
5-
<a-form-item
6-
label="仓库名"
7-
fieldDecoratorId="repository.name"
8-
:fieldDecoratorOptions="{rules: [{ required: true, message: '请输入仓库名称', whitespace: true}]}"
9-
>
10-
<a-input placeholder="请输入仓库名称" />
11-
</a-form-item>
12-
</a-col>
13-
<a-col :xl="{span: 7, offset: 1}" :lg="{span: 8}" :md="{span: 12}" :sm="24">
14-
<a-form-item
15-
label="仓库域名"
16-
fieldDecoratorId="repository.domain"
17-
:fieldDecoratorOptions="{rules: [{ required: true, message: '请输入仓库域名', whitespace: true}, {validator: validate}]}"
18-
>
19-
<a-input addonBefore="http://" addonAfter=".com" placeholder="请输入"/>
20-
</a-form-item>
21-
</a-col>
22-
<a-col :xl="{span: 9, offset: 1}" :lg="{span: 10}" :md="{span: 24}" :sm="24">
23-
<a-form-item
24-
label="仓库管理员"
25-
fieldDecoratorId="repository.manager"
26-
:fieldDecoratorOptions="{rules: [{ required: true, message: '请选择管理员'}]}"
27-
>
28-
<a-select placeholder="请选择管理员">
29-
<a-select-option value="王同学">王同学</a-select-option>
30-
<a-select-option value="李同学">李同学</a-select-option>
31-
<a-select-option value="黄同学">黄同学</a-select-option>
32-
</a-select>
33-
</a-form-item>
34-
</a-col>
35-
</a-row>
36-
<a-row class="form-row" :gutter="16">
37-
<a-col :lg="6" :md="12" :sm="24">
38-
<a-form-item
39-
label="审批人"
40-
fieldDecoratorId="repository.auditor"
41-
:fieldDecoratorOptions="{rules: [{ required: true, message: '请选择审批员'}]}"
42-
>
43-
<a-select placeholder="请选择审批员">
44-
<a-select-option value="王晓丽">王晓丽</a-select-option>
45-
<a-select-option value="李军">李军</a-select-option>
46-
</a-select>
47-
</a-form-item>
48-
</a-col>
49-
<a-col :xl="{span: 7, offset: 1}" :lg="{span: 8}" :md="{span: 12}" :sm="24">
50-
<a-form-item
51-
label="生效日期"
52-
fieldDecoratorId="repository.effectiveDate"
53-
:fieldDecoratorOptions="{rules: [{ required: true, message: '请选择生效日期'}]}"
54-
>
55-
<a-range-picker style="width: 100%" />
56-
</a-form-item>
57-
</a-col>
58-
<a-col :xl="{span: 9, offset: 1}" :lg="{span: 10}" :md="{span: 24}" :sm="24">
59-
<a-form-item
60-
label="仓库类型"
61-
fieldDecoratorId="repository.type"
62-
:fieldDecoratorOptions="{rules: [{ required: true, message: '请选择仓库类型'}]}"
63-
>
64-
<a-select placeholder="请选择仓库类型">
65-
<a-select-option value="公开">公开</a-select-option>
66-
<a-select-option value="私密">私密</a-select-option>
67-
</a-select>
68-
</a-form-item>
69-
</a-col>
70-
</a-row>
71-
<a-form-item v-if="showSubmit">
72-
<a-button htmlType="submit" >Submit</a-button>
73-
</a-form-item>
74-
</a-form>
75-
</template>
76-
77-
<script>
78-
export default {
79-
name: "RepositoryForm",
80-
props: {
81-
showSubmit: {
82-
type: Boolean,
83-
default: false
84-
}
85-
},
86-
methods: {
87-
handleSubmit (e) {
88-
e.preventDefault()
89-
this.form.validateFields((err, values) => {
90-
if (!err) {
91-
this.$notification['error']({
92-
message: 'Received values of form:',
93-
description: values
94-
})
95-
}
96-
})
97-
},
98-
validate (rule, value, callback) {
99-
const regex = /^user-(.*)$/
100-
if (!regex.test(value)) {
101-
callback('需要以 user- 开头')
102-
}
103-
callback()
104-
}
105-
}
106-
}
107-
</script>
108-
109-
<style scoped>
110-
1+
<template>
2+
<a-form @submit="handleSubmit" :form="form" class="form">
3+
<a-row class="form-row" :gutter="16">
4+
<a-col :lg="6" :md="12" :sm="24">
5+
<a-form-item label="仓库名">
6+
<a-input
7+
placeholder="请输入仓库名称"
8+
v-decorator="[
9+
'repository.name',
10+
{rules: [{ required: true, message: '请输入仓库名称', whitespace: true}]}
11+
]" />
12+
</a-form-item>
13+
</a-col>
14+
<a-col :xl="{span: 7, offset: 1}" :lg="{span: 8}" :md="{span: 12}" :sm="24">
15+
<a-form-item
16+
label="仓库域名">
17+
<a-input
18+
addonBefore="http://"
19+
addonAfter=".com"
20+
placeholder="请输入"
21+
v-decorator="[
22+
'repository.domain',
23+
{rules: [{ required: true, message: '请输入仓库域名', whitespace: true}, {validator: validate}]}
24+
]" />
25+
</a-form-item>
26+
</a-col>
27+
<a-col :xl="{span: 9, offset: 1}" :lg="{span: 10}" :md="{span: 24}" :sm="24">
28+
<a-form-item
29+
label="仓库管理员">
30+
<a-select placeholder="请选择管理员" v-decorator="[ 'repository.manager', {rules: [{ required: true, message: '请选择管理员'}]} ]">
31+
<a-select-option value="王同学">王同学</a-select-option>
32+
<a-select-option value="李同学">李同学</a-select-option>
33+
<a-select-option value="黄同学">黄同学</a-select-option>
34+
</a-select>
35+
</a-form-item>
36+
</a-col>
37+
</a-row>
38+
<a-row class="form-row" :gutter="16">
39+
<a-col :lg="6" :md="12" :sm="24">
40+
<a-form-item
41+
label="审批人">
42+
<a-select placeholder="请选择审批员" v-decorator="[ 'repository.auditor', {rules: [{ required: true, message: '请选择审批员'}]} ]">
43+
<a-select-option value="王晓丽">王晓丽</a-select-option>
44+
<a-select-option value="李军">李军</a-select-option>
45+
</a-select>
46+
</a-form-item>
47+
</a-col>
48+
<a-col :xl="{span: 7, offset: 1}" :lg="{span: 8}" :md="{span: 12}" :sm="24">
49+
<a-form-item
50+
label="生效日期">
51+
<a-range-picker
52+
style="width: 100%"
53+
v-decorator="[
54+
'repository.effectiveDate',
55+
{rules: [{ required: true, message: '请选择生效日期'}]}
56+
]" />
57+
</a-form-item>
58+
</a-col>
59+
<a-col :xl="{span: 9, offset: 1}" :lg="{span: 10}" :md="{span: 24}" :sm="24">
60+
<a-form-item
61+
label="仓库类型">
62+
<a-select
63+
placeholder="请选择仓库类型"
64+
v-decorator="[
65+
'repository.type',
66+
{rules: [{ required: true, message: '请选择仓库类型'}]}
67+
]" >
68+
<a-select-option value="公开">公开</a-select-option>
69+
<a-select-option value="私密">私密</a-select-option>
70+
</a-select>
71+
</a-form-item>
72+
</a-col>
73+
</a-row>
74+
<a-form-item v-if="showSubmit">
75+
<a-button htmlType="submit" >Submit</a-button>
76+
</a-form-item>
77+
</a-form>
78+
</template>
79+
80+
<script>
81+
export default {
82+
name: "RepositoryForm",
83+
props: {
84+
showSubmit: {
85+
type: Boolean,
86+
default: false
87+
}
88+
},
89+
data () {
90+
return {
91+
form: this.$form.createForm(this)
92+
}
93+
},
94+
methods: {
95+
handleSubmit (e) {
96+
e.preventDefault()
97+
this.form.validateFields((err, values) => {
98+
if (!err) {
99+
this.$notification['error']({
100+
message: 'Received values of form:',
101+
description: values
102+
})
103+
}
104+
})
105+
},
106+
validate (rule, value, callback) {
107+
const regex = /^user-(.*)$/
108+
if (!regex.test(value)) {
109+
callback('需要以 user- 开头')
110+
}
111+
callback()
112+
}
113+
}
114+
}
115+
</script>
116+
117+
<style scoped>
118+
111119
</style>

0 commit comments

Comments
 (0)