# loadTableBefore明细表查询前
<template>
// 在生成的edit.vue文件vol-edit标签添加:loadTableBefore="loadTableBefore"两个方法
<vol-edit ref="edit" :loadTableBefore="loadTableBefore"></vol-edit>
</template>
<script setup lang="jsx">
//明细表加载前方法
const loadTableBefore = (params, callback,table,item) => {
//params明细表查询参数
//table查询的明细表(一对多的明细表时才有值)
//item明细表配置(一对多的明细表时才有值)
callback(true);//返回false不会加载明细表数据
}
</script>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
# loadTableAfter明细表查询后
<template>
// 在生成的edit.vue文件vol-edit标签添加:loadTableAfter="loadTableAfter"两个方法
<vol-edit ref="edit" :loadTableAfter="loadTableAfter"></vol-edit>
</template>
<script setup lang="jsx">
//明细表从数据库加载后方法,可以给明细重新设置值
const loadTableBefore = (rows,result, callback,table,item) => {
//rows返回的明细表数据
//result接口返回的完整数据
//table查询的明细表(一对多的明细表时才有值)
//item明细表配置(一对多的明细表时才有值)
callback(true);//返回false不会加载明细表数据
}
</script>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
# 获取明细表格配置(主从表)
detail.columns
1
# 获取明细表格配置(一对多)
<template>
// 在生成的edit.vue文件vol-edit标签添加@initDetailColumns="initDetailColumns"两个方法
<vol-edit ref="edit"
@initDetailColumns="initDetailColumns"
@initSubDetailColumns="initSubDetailColumns"
></vol-edit>
</template>
<script setup lang="jsx">
//初始化一对多二级表格配置
const initDetailColumns = (detailColumns) => {
//detailColumns里面包括多张明细表按钮、表格等配置信息
}
//初始化一对多三级表格与按钮
const initSubDetailColumns = (subDetailColumns) => {
//操作同上initDetailColumns
}
//一对多二级表格配置可直接使用details对象
details[0].columns;
details.foEach(item=>{})
</script>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
# 明设置添加值设置默认值
<template>
// 在生成的edit.vue文件vol-edit标签添加
<vol-edit ref="edit" :addRow="addRow"
></vol-edit>
</template>
<script setup lang="jsx">
const addRow=(table,ops)=>{
//判断表,如果是一对一主从明细表不需要if判断
if(table==='表名'){
return {字段1:值2,字段2:值2}
}
}
</script>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
# 获取明细对象
edit.value.getTable('明细表表名')
1
# 获取明细表所有行数据
const rows= edit.value.getTable('明细表表名').rowData;
1
# 明细表添加行数据
const rows= edit.value.getTable('明细表表名').rowData;
//添加到最后一行
rows.push(...[{字段:"值"},{字段:"值"}])
//添加到第一行
rows.unshift(...[{字段:"值"},{字段:"值"}])
1
2
3
4
5
6
2
3
4
5
6
# 获取明细表选中的行
const rows= edit.value.getTable('明细表表名').getSelected();
1
# 设置明细表默认选中行
edit.value.getTable('明细表表名').toggleRowSelection(row);//row为需要选中的行
1
# 刷新明细表
edit.value.loadDetail('表名');//刷新指定明细表数据
1
← 主表表单操作