App4
提示
App4 是由 App1 封装的组件。理论上支持其所有功能。【若发现暂不支持的属性,请及时反馈!!!】
# 一、属性
# height
number
组件高度。
# mainGrid
object
主表格配置项。
# mainGrid.onlyAdd 没什么用
boolean
是否只添加。
默认值: false
# mainGrid.clickMainFindDetail
boolean
点击主表是否需要查询细表。
默认值: true
# mainGrid.selectedFirst
boolean
主表查询后,是否默认选中第一条。
默认值: true
# mainGrid.flag
boolean
控制细表是否显示的标志。
提示
当 layout 为 'TopHeight'
时有效。
# detailGridList
array
细表格配置项。
# detailGridList[index].isEditInMain
boolean
在主页面中,细表是否为可编辑表格。
默认值: false
# layout
string
主细表采用哪种布局方式。
默认值: TopDown
可选值: TopDown
、LeftRight
# flex
object
主细表所占的比例。
layout 为 'TopDown'
时的默认值: { top: 5, down: 5 }
layout 为 'LeftRight'
时的默认值: { left: 2, right: 8 }
# selectedTreeNode
object
选中树节点的数据。
提示
当需要与 AppTree 关联时使用。
# app
string
标记当前组件是在哪个功能组件中使用的。
默认值: 'app4'
# topHeightOffset
number
topHeight 的偏移量。
默认值: 0
提示
部分功能,当 layout 为 'TopHeight'
时,上面的分页可能会被盖住,可通过此属性调整。
# 二、插槽
# mainTableTop
主表顶部插槽。
# mainTbarLeft
主表按钮组左侧插槽。
# mainTableCenter
主表中部插槽。
# betweeninapp4
主细表中间插槽。
提示
当 layout 为 'LeftRight'
时有效。
# detail[index]TableTop
细表顶部插槽。
注意
[index]
为表格索引位置。
当索引为 0 时,此插槽名为 detail0TableTop
;
当索引为 1 时,此插槽名为 detail1TableTop
;
...
# detail[index]TbarLeft
细表按钮组左侧插槽。
注意
[index]
为表格索引位置。
当索引为 0 时,此插槽名为 detail0TableTop
;
当索引为 1 时,此插槽名为 detail1TableTop
;
...
# detail[index]TableCenter
细表中部插槽。
注意
[index]
为表格索引位置。
当索引为 0 时,此插槽名为 detail0TableTop
;
当索引为 1 时,此插槽名为 detail1TableTop
;
...
# 三、方法
# getAppMain()
获取主表实例对象。相当于 AppGrid - getTable()。
# getAppDetail(index)
获取细表实例对象。相当于 AppGrid - getTable()。
# reload(params) & reloadMainTable(params)
重新加载主表数据。
# reloadDetailTable(index, params)
重新加载指定细表数据。
# reloadAllDetailTable(params)
重新加载所有细表数据。
# clearMainTable()
清理主表数据。
# clearDetailTable()
清理细表数据。
# tOk()
主表保存按钮事件。
提示
主表保存时,同时需要保存细表数据时使用。
# buildSaveData()
构建保存数据。
# detailTableCheckData()
主表接收细表选中的数据。
# 四、事件
# processData 待调整
({ that, grid, tableRef, mainAppTableData, detaildataCheckList, selectedTreeNode?, addDataMethod }) => void
选中细表数据,向主表中添加时的处理事件。
参数说明:
- obj
that: object
: 当前组件的实例对象 不建议使用grid: object
: 表格对象 推荐tableRef: object
: 表格对象mainAppTableData: array
: 主表数据列表detaildataCheckList: array
: 细表选中数据列表selectedTreeNode: object
: 选中的树节点对象addDataMethod: (detailData) => void
: 接收细表选中处理后的数据
# tSaveBefore
({ that, mainGridRef, detailGridRefs, data, proData, back }) => void
保存前事件。
参数说明:
- obj
that: object
: 当前组件的实例对象 不建议使用mainGridRef: object
: 主表实例对象detailGridRefs: array
: 细表实例对象列表data: object
: 主细表的数据proData: (data) => void
: 处理主细表数据back: (continueExec) => void
: 是否需要拦截后续代码时调用,默认继续执行。back(false)
即可拦截。
提示
- 该方法可直接挂载至 mainGrid 下。
mainGrid: { // ... tSaveBefore: ({ that, mainGridRef, detailGridRefs, data, proData, back }) => {} }
1
2
3
4 - 当调用 tOk 后有效
# tSaveAfter
({ that, mainGridRef, detailGridRefs, params, res, toolbar }) => void
保存后事件。
参数说明:
- obj
that: object
: 当前组件的实例对象 不建议使用mainGridRef: object
: 主表实例对象detailGridRefs: array
: 细表实例对象列表params: object
: 接口请求参数res: object
: 接口响应数据toolbar: object
: 当前按钮的配置对象
提示
- 该方法可直接挂载至 mainGrid 下。
mainGrid: { // ... tSaveAfter: ({ that, mainGridRef, detailGridRefs, params, res, toolbar }) => {} }
1
2
3
4 - 当调用 tOk 后有效