Skip to content

Commit f6cfc7c

Browse files
BingBlogBingBlog
committed
Merge pull request #3 from Tobin1990/master
sectioned
1 parent cf4f9f6 commit f6cfc7c

File tree

3 files changed

+232
-5
lines changed

3 files changed

+232
-5
lines changed

‎packages/cp-example/src/page/form/mock/form/sectionedData.json

Lines changed: 162 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,162 @@
1+
{
2+
"errno": 0,
3+
"data": {
4+
"fields": [
5+
{
6+
"type": "Divider",
7+
"label": "任务通用配置",
8+
"orientation": "left",
9+
"dashed": true,
10+
"size": "small"
11+
},
12+
{
13+
"type": "Input",
14+
"label": "任务名称",
15+
"model": "taskName",
16+
"placeholder": "请输入任务名称",
17+
"rules": [
18+
{
19+
"type": "string",
20+
"required": true,
21+
"pattern": "^[\\u4e00-\\u9fa5]+$",
22+
"message": "请输入中文姓名"
23+
}
24+
]
25+
},
26+
{
27+
"label": "展示客户端",
28+
"type": "Checkbox",
29+
"model": "showClient",
30+
"options": [
31+
{
32+
"label": "好看",
33+
"value": "1"
34+
},
35+
{
36+
"label": "手百lite",
37+
"value": "2"
38+
},
39+
{
40+
"label": "百度地图",
41+
"value": "3"
42+
}
43+
],
44+
"required": true
45+
},
46+
{
47+
"type": "Select",
48+
"label": "关联任务方",
49+
"model": "relationTask",
50+
"placeholder": "请输入性别",
51+
"required": true,
52+
"options": [
53+
{
54+
"label": "任务1",
55+
"value": "1"
56+
},
57+
{
58+
"label": "任务2",
59+
"value": "2"
60+
},
61+
{
62+
"label": "任务3",
63+
"value": "3"
64+
}
65+
]
66+
},
67+
{
68+
"type": "Divider",
69+
"label": "任务分端配置",
70+
"orientation": "left",
71+
"dashed": true,
72+
"size": "small"
73+
},
74+
{
75+
"type": "Input",
76+
"label": "任务标题",
77+
"model": "taskHead",
78+
"placeholder": "请输入任务标题",
79+
"required": true,
80+
"max": 150,
81+
"min": 0
82+
},
83+
{
84+
"type": "Input",
85+
"label": "任务说明",
86+
"model": "taskExplain",
87+
"placeholder": "请输入任务说明",
88+
"required": true,
89+
"max": 150,
90+
"min": 0
91+
},
92+
{
93+
"type": "Input",
94+
"label": "任务提示信息",
95+
"model": "taskToolTips",
96+
"placeholder": "请输入任务提示信息",
97+
"required": true,
98+
"max": 150,
99+
"min": 0
100+
},
101+
{
102+
"type": "Divider",
103+
"label": "任务规则配置",
104+
"orientation": "left",
105+
"dashed": true,
106+
"size": "small"
107+
},
108+
{
109+
"type": "Input",
110+
"label": "任务周期",
111+
"model": "taskCycle",
112+
"placeholder": "请输入任务周期",
113+
"required": true,
114+
"max": 150,
115+
"min": 0
116+
},
117+
{
118+
"type": "Input",
119+
"label": "任务次数",
120+
"model": "taskNumber",
121+
"placeholder": "请输入任务次数",
122+
"required": true,
123+
"max": 150,
124+
"min": 0
125+
},
126+
{
127+
"type": "Select",
128+
"label": "任务排序",
129+
"api": "/selectApi",
130+
"apiParams": ["province"],
131+
"model": "taskSort",
132+
"defaultHide": true
133+
},
134+
{
135+
"type": "Submit",
136+
"subtype": "primary",
137+
"text": "保存",
138+
"labelWidth": 0,
139+
"width": 100,
140+
"inline": true
141+
},
142+
{
143+
"type": "Reset",
144+
"subtype": "primary",
145+
"text": "重置",
146+
"width": "50%",
147+
"labelWidth": 0,
148+
"inline": true
149+
}
150+
],
151+
"options": {
152+
"labelWidth": 120,
153+
"title": "分组表单",
154+
"labelPosition": "left",
155+
"tip": {
156+
"title": "规则",
157+
"content": "规则内容"
158+
}
159+
}
160+
},
161+
"msg": "ok"
162+
}

‎packages/cp-example/src/page/form/service.js

Lines changed: 10 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -46,6 +46,14 @@ const getWizardFormData = (params = {}) => {
4646
};
4747
};
4848

49+
const getSenctionedFormData = (params = {}) => {
50+
return {
51+
url: "/api/form/sectionedData",
52+
method: "get",
53+
params
54+
};
55+
};
56+
4957
const formSubmit = (params = {}) => {
5058
return {
5159
url: "/api/form/submit",
@@ -61,5 +69,6 @@ export default {
6169
getList,
6270
getTakeoverFormData,
6371
getTakeoverModel,
64-
getWizardFormData
72+
getWizardFormData,
73+
getSenctionedFormData
6574
};

‎packages/cp-example/src/page/form/views/sectioned.vue

Lines changed: 60 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,68 @@
11
<template>
2-
<div>sectioned</div>
2+
<div class="container">
3+
<FormGenerator
4+
ref="FormGenerator"
5+
:fields="fieldsData"
6+
:model="model"
7+
:options="optionsData"
8+
@on-submit="handleSave"
9+
/>
10+
</div>
311
</template>
412
<script>
13+
import services from "@/service";
14+
const { getSenctionedFormData } = services["form"];
515
export default {
616
data() {
7-
return {};
17+
return {
18+
pageConfig: {},
19+
model: {}
20+
};
821
},
9-
methods: {}
22+
mounted() {
23+
this.handleSectionedFormData();
24+
},
25+
computed: {
26+
fieldsData() {
27+
if (this.pageConfig) {
28+
return this.pageConfig.fields;
29+
}
30+
return [];
31+
},
32+
optionsData() {
33+
if (this.pageConfig) {
34+
return this.pageConfig.options;
35+
}
36+
return [];
37+
}
38+
},
39+
methods: {
40+
handleSectionedFormData() {
41+
getSenctionedFormData().then(res => {
42+
if (res.msg === "ok") {
43+
this.pageConfig = res.data;
44+
}
45+
});
46+
},
47+
handleSave() {
48+
this.$refs.FormGenerator.submit()
49+
.then(data => {
50+
// eslint-disable-next-line no-console
51+
console.log("update model", data);
52+
this.value = false;
53+
})
54+
.catch(valid => {
55+
// eslint-disable-next-line no-console
56+
this.valid = valid;
57+
console.log("valid", valid);
58+
});
59+
}
60+
}
1061
};
1162
</script>
12-
<style lang="less"></style>
63+
<style lang="less">
64+
.container {
65+
width: 70%;
66+
margin: 10px 50px;
67+
}
68+
</style>

0 commit comments

Comments
 (0)