Skip to content

Commit 27545c4

Browse files
sendyasendya
committed
fix: advancedForm
1 parent ff39204 commit 27545c4

File tree

2 files changed

+212
-212
lines changed

2 files changed

+212
-212
lines changed

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

Lines changed: 110 additions & 110 deletions
Original file line numberDiff line numberDiff line change
@@ -1,111 +1,111 @@
1-
<template>
2-
<a-form @submit="handleSubmit" :autoFormCreate="(form) => this.form = form" class="form">
3-
<a-row class="form-row">
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=".github.io" 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">
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" :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+
111111
</style>

0 commit comments

Comments
 (0)