Skip to content

Commit ac71ef5

Browse files
committed
增加table使用示例及文档
1 parent 7b86272 commit ac71ef5

File tree

11 files changed

+905
-275
lines changed

11 files changed

+905
-275
lines changed

Vol.Vue/src/router/tables.js

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,11 @@ let tables = [
99
name: 'table2',
1010
component: () => import('@/views/tables/table2.vue')
1111
},
12+
{
13+
path: '/table3',
14+
name: 'table3',
15+
component: () => import('@/views/tables/table3.vue')
16+
},
1217
{
1318
path: '/tableForms',
1419
name: 'tableForms',

Vol.Vue/src/views/document/docApi/doc_table.vue

Lines changed: 5 additions & 50 deletions
Original file line numberDiff line numberDiff line change
@@ -174,55 +174,8 @@
174174
</div>
175175
<br />
176176
<br />
177-
<div class="vol-demo">
178-
<div >
179-
<VolHeader
180-
icon="md-apps"
181-
text="从api加载数据"
182-
style="margin-bottom: 10px; border: 0px; margin-top: 15px"
183-
>
184-
<div slot="content"></div>
185-
<slot>
186-
<div style="text-align: right">
187-
<Input
188-
style="width: 200px; margin-right: 10px"
189-
v-model.number="searchFields.UserName"
190-
placeholder="申请人"
191-
/>
192-
<DatePicker
193-
type="datetime"
194-
placeholder="申请时间"
195-
v-model="searchFields.CreateDate1"
196-
></DatePicker>
197-
-
198-
<DatePicker
199-
type="datetime"
200-
placeholder="申请时间"
201-
v-model="searchFields.CreateDate2"
202-
></DatePicker>
203-
<Button type="info" ghost @click="load2" style="margin-left: 20px"
204-
>查询</Button
205-
>
206-
<Button type="info" ghost @click="del2">删除行</Button>
207-
<Button type="info" ghost @click="getRows2">获取选中的行</Button>
208-
</div>
209-
</slot>
210-
</VolHeader>
211-
212-
<!-- table数据 -->
213-
<!-- :max-height="450" -->
214-
<vol-table
215-
ref="table"
216-
:loadKey="true"
217-
:columns="columns"
218-
:pagination-hide="false"
219-
:height="300"
220-
:url="url2"
221-
:index="true"
222-
@loadBefore="loadTableBefore2"
223-
@loadAfter="loadTableAfter2"
224-
></vol-table>
225-
</div>
177+
<div class="vol-demo" style="padding:0;">
178+
<table3></table3>
226179
</div>
227180
<div>
228181
<docParamTable name="voltable"></docParamTable>
@@ -272,10 +225,12 @@ import VolTable from "@/components/basic/VolTable.vue";
272225
import VolUpload from "@/components/basic/VolUpload.vue";
273226
import VolHeader from "@/components/basic/VolHeader.vue";
274227
import docParamTable from "./doc_ParamTable.vue";
228+
import table3 from "../../tables/table3";
275229
import { editTable, remoteColumns } from "./doc_tableOptions.js";
276230
import sourceCode from "./sourceCode.js";
277231
let $doc_vue;
278232
let doc_options = {
233+
components: { VolTable, VolBox, docParamTable, VolHeader, VolUpload, table3 },
279234
data() {
280235
return {
281236
//查询条件字段
@@ -687,7 +642,7 @@ let doc_options = {
687642
],
688643
};
689644
},
690-
components: { VolTable, VolBox, docParamTable, VolHeader, VolUpload },
645+
691646
mounted() {
692647
this.$refs.editTable1.summaryData[2] = 10;
693648
},

Vol.Vue/src/views/document/docApi/sourceCode.js

Lines changed: 384 additions & 65 deletions
Large diffs are not rendered by default.

Vol.Vue/src/views/forms/form1.vue

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
<VolForm
55
ref="myform"
66
:loadKey="loadKey"
7-
:formFileds="formFileds"
7+
:formFields="formFields"
88
:formRules="formRules"
99
></VolForm>
1010

@@ -25,9 +25,9 @@ export default {
2525
methods: {
2626
add() {
2727
//动态添加列
28-
this.formFileds = {};
28+
this.formFields = {};
2929
this.index += 1;
30-
this.formFileds["test" + this.index] = "";
30+
this.formFields["test" + this.index] = "";
3131
this.required = !this.required;
3232
this.formRules.splice(0);
3333
//如果有对列删除,必须重置表单,否则验证提示的标签显示位置会错措
@@ -52,7 +52,7 @@ export default {
5252
if (!this.$refs.myform.validate()) {
5353
return;
5454
}
55-
this.$message.error(JSON.stringify(this.formFileds));
55+
this.$message.error(JSON.stringify(this.formFields));
5656
},
5757
reset() {
5858
//重置表单,重置时可指定重置的值,如果没有指定重置的值,默认全部清空
@@ -66,7 +66,7 @@ export default {
6666
loadKey: true,
6767
index: 1,
6868
required: false,
69-
formFileds: {
69+
formFields: {
7070
Variety: "",
7171
AgeRange: "",
7272
DateRange: [],
@@ -98,13 +98,13 @@ export default {
9898
type: "select",
9999
onChange(value, param) {
100100
//设置选择数据时触发的事件
101-
$vue.formFileds.AvgPrice =
101+
$vue.formFields.AvgPrice =
102102
(Math.random(1, 1000) * 100).toFixed(2) * 1;
103103
$vue.$message(
104104
"当前选中的值为[" +
105105
value +
106106
"],选中后给成交均价赋一个随机值[" +
107-
$vue.formFileds.AvgPrice +
107+
$vue.formFields.AvgPrice +
108108
"]"
109109
);
110110
},

Vol.Vue/src/views/forms/form2.vue

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@
99
<VolForm
1010
ref="myform"
1111
:loadKey="loadKey"
12-
:formFileds="formFileds"
12+
:formFields="formFields"
1313
:formRules="formRules"
1414
></VolForm>
1515
<div style="text-align: center">
@@ -27,7 +27,7 @@ export default {
2727
if (!this.$refs.myform.validate()) {
2828
return;
2929
}
30-
this.$message.error(JSON.stringify(this.formFileds));
30+
this.$message.error(JSON.stringify(this.formFields));
3131
},
3232
reset() {
3333
//重置表单,重置时可指定重置的值,如果没有指定重置的值,默认全部清空
@@ -39,7 +39,7 @@ export default {
3939
data() {
4040
return {
4141
loadKey: true,
42-
formFileds: {
42+
formFields: {
4343
Variety: "",
4444
AgeRange: "",
4545
DateRange: [],

Vol.Vue/src/views/forms/form3.vue

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@
66
<VolForm
77
ref="myform"
88
:loadKey="loadKey"
9-
:formFileds="formFileds"
9+
:formFields="formFields"
1010
:formRules="formRules"
1111
></VolForm>
1212
<slot></slot>
@@ -28,7 +28,7 @@ export default {
2828
if (!this.$refs.myform.validate()) {
2929
return;
3030
}
31-
this.$message.error(JSON.stringify(this.formFileds));
31+
this.$message.error(JSON.stringify(this.formFields));
3232
},
3333
reset() {
3434
//重置表单,重置时可指定重置的值,如果没有指定重置的值,默认全部清空
@@ -40,7 +40,7 @@ export default {
4040
data() {
4141
return {
4242
loadKey: true,
43-
formFileds: {
43+
formFields: {
4444
Variety: "",
4545
AgeRange: "",
4646
DateRange: [],

Vol.Vue/src/views/forms/form4.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@ export default {
1818
components: { form3, vtable },
1919
methods: {
2020
getForm() {
21-
this.$message.error(JSON.stringify(this.$refs.form3.formFileds));
21+
this.$message.error(JSON.stringify(this.$refs.form3.formFields));
2222
},
2323
getRow() {
2424
let rows=this.$refs.table.getRows();

Vol.Vue/src/views/forms/form7.vue

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@
66
<Button type="text" icon="ios-search" size="small" @click="getForm">获取表单</Button>
77
</div>
88
</VolHeader>
9-
<VolForm ref="myform" :loadKey="loadKey" :formFileds="formFileds" :formRules="formRules"></VolForm>
9+
<VolForm ref="myform" :loadKey="loadKey" :formFields="formFields" :formRules="formRules"></VolForm>
1010
</div>
1111
</template>
1212
<script>
@@ -16,15 +16,15 @@ export default {
1616
components: { VolForm, VolHeader },
1717
methods: {
1818
getForm() {
19-
this.$message.error(JSON.stringify(this.formFileds));
19+
this.$message.error(JSON.stringify(this.formFields));
2020
},
2121
reset() {}
2222
},
2323
mounted() {},
2424
data() {
2525
return {
2626
loadKey: true,
27-
formFileds: {
27+
formFields: {
2828
Variety: "日用品",
2929
DateRange: "2019-09-01",
3030
City: "北京市",

0 commit comments

Comments
 (0)