前一章初步介绍了DWF的脚本使用方法以及相关基本环境变量，本章将进一步介绍如何通过DWF的前端脚本访问加载到界面的业务对象数据。
1. 脚本基础
在介绍前端数据访问的脚本编程方法之前有必要先简单介绍一下前端数据的概念，在之前的定制培训过程中，读者应该初步了解到DWF的表单可以展示单个的对象，也可以展示多个对象，每当表单显示在用户面前的时候，DWF一方面按照表单的模板把表单的样子展示给了用户，同时，DWF还通过与服务器通讯，将用户希望展示的数据也填入了表单之中。这些填入到表单中的数据也就是前端的数据的组成。
1.1 访问前端数据的保留字
和上一章介绍的内容相同，DWF的提供了一系列用于访问前端数据的保留字，通过这些保留字可以实现对表单数据的访问，这些保留字包括：
...
- 首先，两幅表单都是用于展示设备类数据的表单，因此，this.className = 'Asset'。
- 当打开了单个设备编辑表单的时候，可以通过this.obj访问到该表单中显示的对象。
- 右边的显示了当打开多个设备的列表的时候，则可以通过this.selectedObjs访问当前选中的设备对象，结果为一个数组。
图-设备类表单中数据的访问示意
1.2 访问业务对象属性的取值
当拿到对象的引用之后，下一步是访问对象的属性取值，在DWF中存在实体类和关联类两种数据类型，这两种类型对应的对象属性的访问方式有所不同，分别介绍如下：
...
- 访问父件到子件类（Part2Part）的装配数量：this.obj.relation_number
- 访问父件到子件类（Part2Part）的父件Oid：this.obj.left_oid 或 this.obj.relation_leftOid
- 访问父件到子件类（Part2Part）的子件类型：this.obj.right_partType
1.3 与后端进行数据的交换
在前端的脚本中如果获得对象的引用之后，也可以直接通过脚本将变更对象传递到后端保存，后端对已经存在的对象进行修改保存，或者是删除，具体的用法如下：
...
| 代码块 | ||||
|---|---|---|---|---|
| ||||
this.edit(targetAsset, targetClass).then(result=>{
console.log(result);
this.msgbox.info(`更改设备${targetAsset.id}的状态`);
//刷新前端…
}) |
1.4. 脚本访问业务数据模型
为了减轻在DWF编写脚本的时候的记忆负担，DWF在脚本编辑工具之外提供了一个辅助工具用于帮助建模人员快速得到业务对象模型数据，即类名以及类的属性名。如下图所示：
图-前端数据模型信息获取辅助工具
2. 脚本案例
接下来，围绕设备状态管理的应用，做几个示例用于展示前端数据访问的方法。
2.1 访问被选中的设备并消息显示
首先，在设备类（Asset）的多设备列表浏览表单中（MultiAssets）添加一个按钮，增加绑定的操作，显示当前被选中设备的代号。
...
在App端打开以后，显示效果如下：
图-访问对象数据示例
2.2 访问单个设备对象并弹窗显示
接下来，在单个设备表单（SingleAsset）中放入一个按钮，按照同样的方法放入如下的单对象访问前端脚本，获取并显示单个设备对象的代号
| 代码块 | ||||||
|---|---|---|---|---|---|---|
| ||||||
console.log(this.obj, this.className);
if (this.obj) {
this.msgbox.info(`hello ${this.obj.id}`);
} |
图-单对象数据访问示例
2.3 将选中设备的状态变为“已安装”
在设备列表的表单（MultiAssets）之中，放入一个按钮，将其绑定到一个新的操作上，前端输入脚本如下：
...
点击该按钮可以改变设备的状态属性，如下所示：
图-更改设备状态的脚本操作示意
2.4 删除选中的设备
回到之前的设备列表表单（MuitiAssets），再放入一个按钮，将其绑定到一个新的操作上，命名为：删除选中设备，在前端代码中输入如下的代码
| 代码块 | ||||
|---|---|---|---|---|
| ||||
if (this.selectedObjs) {
if (this.selectedObjs.length > 0) {
var targetClass = this.className;
var targetObj = this.selectedObjs[0];
this.delete(targetObj, targetClass).then(result => {
console.log(result);
this.msgbox.info(`删除设备${targetObj.id}`);
//控制后端刷新
var addins = this.GetTargetAddin();
addins.forEach(x => {
x.freshData();
});
});
}
} |
点击此按钮后会将选中的设备对象从数据库中删除。
3. 小结
本章介绍了单对象表单和多对象表单的数据引用方法，并且结合四个例子展示了对象引用脚本的用途，其中需要记住的保留字如下：
...
下一章，将在数据的基础上进一步介绍操作表单中控件。
4. 附件
| View file | ||||
|---|---|---|---|---|
|
...