概述
下面的表格列举了DWF的前端脚本提供的基础调用,以及一些控件的用法要领:
- 全局变量:DWF脚本引擎中可以直接访问到的变量数据
- 查询条件:在查询条件配置界面和URL操作的链接中可以使用的全局变量
- 应用配置:可以用来控制app端的一系列函数,例如:在应用打开的时候把那些模块展开
- 数据交互:DWF脚本访问数据或者通过接口访问数据,与前端进行消息通讯等
- 表单交互:DWF脚本实现表单直接的切换,表单本身数据的更新,表单间参数传递
- 控件访问:DWF脚本直接访问表单的控件、获取控件上的方法等
- 控件要领:对部分控件的脚本使用要领
评论区则是在实战中积累的经验,作为备忘尚未整理但是在解决实际问题时肯定会用到的脚本。
详情
序号 | 功能分类 | 脚本名称/关键字 | 功能描述 | 适用范围/场景 | 脚本示例说明 |
---|
1 |
全局变量 | this.obj | 表单绑定的类的对象,如果没有条件限制默认获取的是绑定类的最新一条记录 是一个JSON对象 this.obj是当前表单绑定类的对象,可以通过类上的属性获取返回对象的某一项的值 调试查看this.obj的返回值: console.log(this.obj); | 1)操作动作为visit/edit时,this.obj有数据 2)操作的前处理脚本中写了return{obj:obj},表单的this.obj会有对应值 使用范围: 在表单上绑定的前端脚本均可用 | 实体类:
|
关联类:
|
this.obj是当前表单绑定类的对象,可以通过类上的属性获取返回对象的某一项的值
调试查看this.obj的返回值:
console.log(this.obj);2 | this.selectedObjs | 表单中含有唯一的多对象控件时,通过此数组获得用户选中的对象,如果是有多个多对象控件可以在表单设置中绑定多对象控件 是一个JSON对象数组 | 使用范围: 表单中有多对象控件(表格),并且在表单的基础配置中设置了默认多对象控件,该脚本有效,否则为null |
| |||||
3 | this.data | 打开表单的初始化参数 在表单中的任何操作的前端脚本都可以直接使用this.data获取初始化参数 是一个JSON对象 | 可以使用的场景有两类: 1)操作的前处理脚本,通过return{ data:this.obj} 可以传递json对象到打开的表单 2)使用脚本打开表单传参,可用的有:this.openTab,this.openForm,this.openDrawer |
|
| ||
4 | this.env | 当前DWF前端的上下文信息,返回一个JSON对象,JSON对象属性包括:
|
|
| 可以用在所有的前端脚本中,不限位置 |
|
|
|
|
|
|
| |||||||||
5 | this.user | 当前登录用户的基本信息,返回一个JSON对象,包括属性如下:
| 需要获取到用户的基本信息的时候,可以使用this.user |
|
|
|
|
|
| |||||||||
6 | this.store | DWF内部变量,缓存了当前访问表单的基本信息 是一个JSON对象,可用的对象如下:
| 需要获取到配置系统的配置信息的时候可以使用this.store |
|
|
|
| |
7 | this. |
confirmData | 弹窗表单新增对象/编辑对象成功后提交的表单数据,在后处理脚本中可用 | 仅适用于操作的后处理脚本中 |
| |||||||||
8 | this.className | 表单所属的实体类或者关联类的名称 | 任何表单的脚本中都可以使用 |
| |||||
9 | this.generateUUID() | 生成uuid的函数 |
| ||||||
10 | 查询条件关键字 | $env |
仅在拼接过滤条件等场景下使用,获取当前环境的基本信息,返回一个JSON对象,包括属性如下:
|
let mySelect =
this
.getAddinById(
'SelectInput1'
);
//绑定选择框,这个绑定的控件id需要根据自己的表单内的控件调整
let result = mySelect.getValue();
var
place =
this
.getAddinById(
"CheckBox1"
);
//绑定复选框
place.setValue(
'nanjing'
);
//设置地点的值
var
place =
this
.getAddinById(
"CheckBox1"
);
//绑定复选框
place.setValue(
'nanjing'
);
//设置地点的值
place.triggerEvent(
'valueChanged'
)
//触发控件上绑定的值变化事件
var grid = this.getAddinById('Grid1');
var index = Math.round(Math.random() * 10)
var cellData = grid.getCellData(); //获取当前单元格数据集
var cellValue = cellData.value
var toolTipContent = `<p>${cellValue}</p>`
grid.setTooltip(toolTipContent);
//控件的id可在app端开发者工具中拾取,后期可在modeler中直接拷贝
var
addinElement =
this
.GetAddinById(
"指定控件的id"
);
//设置控件在界面中的错误信息提示
addinElement.setError(
"存在异常"
);
//$el为指定控件的dom元素,可以直接对dom元素修改其样式
addinElement.$el.style.display =
"none"
;
|
debugger;
let _this = this;
var grid = this.GetAddinById("id");
let query = `and obj.department1 = '${this.user.userGroups[0].oid}'
and obj.attributeName ='${this.store.state.user.userId}'
and obj.attributeName= '${this.user.userName}'
and obj.attributeName= '${this.user.userId}'
and obj.attributeName= '${this.user.oid}'
and obj.attributeName= '${this.user.token}'
and obj.attributeName= '${this.user.userGroups[0].name}'
and obj.attributeName= '${this.user.userGroups[0].comment}'
and obj.attributeName= '${env.serverURL}
and obj.attributeName= '${env.serverIp}`;//以此类推可以自定义增加或减少env和user
debugger;
grid.freshData(query);
this.msgbox.success("已刷新!");
debugger;
let _this = this;
var grid = this.GetAddinById("id");
let query = `and obj.department1 = '${this.user.userGroups[0].oid}'
and obj.attributeName ='${this.store.state.user.userId}'
and obj.attributeName= '${this.user.userName}'
and obj.attributeName= '${this.user.userId}'
and obj.attributeName= '${this.user.oid}'
and obj.attributeName= '${this.user.token}'
and obj.attributeName= '${this.user.userGroups[0].name}'
and obj.attributeName= '${this.user.userGroups[0].comment}'
and obj.attributeName= '${env.serverURL}
and obj.attributeName= '${env.serverIp}`;//以此类推可以自定义增加或减少env和user
debugger;
grid.freshData(query);
this.msgbox.success("已刷新!");
obj.attributeName=$obj.attributeName
Data
()//查询条件
let queryConditon = {
targetClass:
"Part"
,
query:{query:`and obj.id=
'${this.obj.name}'
`},
fresh:
true
//是否从后台强制刷新查询(建议默认值为true)
};
//基于DB进行查询
this
.handleQueryData(queryConditon).then(res => {
//针对res值(查询返回值)直接处理…
});
支持实体类和关联类表单中执行新增操作
- 实体类:this.create(obj,className,{showMessage:true/false})
- 关联类this.create(obj,className,{isRelation:false,showMessage:true/false})
//系统新增时控制是否弹出信息
this.create(obj, "WorkOrder", {showMessage:true});
//关联类表单新增实体类并控制是否弹出信息
this.create/edit(obj, "WorkOrderToPart", {
isRelation:true,
relationClass:'WorkOrderToPart',
leftClass:'WorkOrder',
rightClass:'Part',
showMessage:true});
let obj = this.createObj(this.className).then((res) => {
console.log("新增内存对象oid=");
console.log(obj)
debugger
this.returnSync({
obj: res.data
})
})
console.log("新增内存对象oid=" + obj.oid);
return {sync:true}
let param =
[{
"woTitle":""}]
支持实体类和关联类表单中执行编辑操作
- 实体类:this.edit(obj,className,{showMessage:true/false})
- 关联类this.edit(obj,className,{isRelation:false,showMessage:true/false})
//系统编辑时控制是否弹出信息
this.edit(obj, "WorkOrder", {showMessage:true});
//关联类表单新增实体类并控制是否弹出信息
this.edit(obj, "WorkOrderToPart", {
isRelation:true,
relationClass:'WorkOrderToPart',
leftClass:'WorkOrder',
rightClass:'Part',
showMessage:true});
支持实体类和关联类表单中执行删除操作
- 实体类:this.delete(obj,className,{showMessage:true/false})
- 关联类this.delete(obj,className,{isRelation:false,showMessage:true/false}
//系统删除时控制是否弹出信息
this.delete(obj, "WorkOrder", {
showMessage:true});
//关联类表单删除实体类并控制是否弹出信息
this.delete(obj, "WorkOrder", {isRelation:false,
showMessage:true});
在回调中处理
调用app的restful API示例1
//this.dwf_axios.post(`http://192.168.30.63/workorder/init`,param);
let param = {
};
this
.dwf_axios.post(`/workorder/init?tyWorkOrderOid=${
this
.obj.oid}`,param).then(initRes => {
//在回调中处理
if
(initRes && initRes.data && initRes.data.result && initRes.data.result ==
true
){
this
.msgbox.success(
'已完成基于专家库作业信息的初始创建!'
);
}
else
if
(initRes && initRes.data && initRes.data.msg){
alert(initRes.data.msg);
}
});
this.dwf_modeler_axios()
//获取当前服务器端IP
var
curServerIP =
this
.env.serverIp;
//获取当前登录用户
var
curUserId =
this
.user.oid;
//调用modeler端的restful API
this
.dwf_modeler_axios(
"/dwf/v1/org/users/${curUserId}/groups"
);
store中
查询//查询条件
let queryConditon = {
targetClass:
"Part"
,
query:{query:`and obj.id=
'${this.obj.name}'
`},
fresh:
true
//是否从后台强制刷新查询(建议默认值为true)
};
//该接口主要在store中进行查询(不查询后台DB)
let queryResult =
this
.QueryResultAll(queryConditon);
//TODO:查询结果queryResult处理
通过getOperation获取到已有的操作(需要存储到数据库中),再通过executeOperation进行调用,并且允许修改已有操作的操作样式和动作。
@param targetClass:已有操作绑定的目标类;
@param operName:已有操作的英文名
//调用已有的操作
this
.getOperation(
"WorkOrder"
,
"createWO"
).then(res =>{
//先取出原始操作
var
opr = res.data.data;
// 替代前处理脚本,不用的话可以不写
opr.beforeExecute = () => {
//新的前处理脚本
return
{
obj:{...},
//选填,对象
query:
""
,
//选填,查询条件
data:{...}}
//选填,自定义属性
}
// 替代原来操作的后处理脚本,不用的话可以不写
opr.afterExecute = () => {
//新的后处理脚本,可根据
...
}
this
.executeOperation(opr)
});
this
.getOperation(
this
.className,
'obj'
).then(res => {
var
operation = res.data.data;
operation.beforeExecute = () => {
console.log(`自定义前处理`)
return
{
// obj: {
// obj:this.selectedObjs[0]
// },
query: `and obj.woTitle like
'%工单%'
`,
data: {
woDesc1:
'getOperation执行已有操作'
}
}
}
operation.afterExecute = () => {
var
data =
this
.confirmData;
this
.msgbox.info(
"getOperation执行已有操作结束"
)
}
this
.executeOperation(operation).then((opr) => {
console.log(opr)
debugger
});
})
这两个脚本不知道怎么描述功能?
在回调中处理resMetaObj值…
//获取实体类的元模型信息
this
.queryEntity(targetClassName).then(resMetaObj => {
//在回调中处理resMetaObj值…
});
//获取关联类的元模型信息
this
.queryRelation(targetClassName).then(resMetaObj => {
//在回调中处理resMetaObj值…
});
//获取实体类的元模型信息
this
.queryEntity(targetClassName).then(resMetaObj => {
//在回调中处理resMetaObj值…
});
//获取关联类的元模型信息
this
.queryRelation(targetClassName).then(resMetaObj => {
//在回调中处理resMetaObj值…
});
var
targetClass =
'part'
;
var
viewName =
'allPartList'
;
var
args = {};
//args是{ conditionExpre: 查询条件, params: 初始化脚本 },如果没有args可以传空
this
.openForm(targetClass, viewName, args);
let obj = this.createObj(this.className).then((res) => {
console.log("新增内存对象oid=");
console.log(obj)
debugger
this.returnSync({
obj: res.data
})
})
console.log("新增内存对象oid=" + obj.oid);
return {sync:true}
let param =
[{
"woTitle":""}]
queryOpr中的参数
@param targetClass:表示对应的类
@param viewName:表示需要打开的表单名称
@param action:动作
@param authority:英文名
@param extSettings:是否打开默认操作
@param args中的参数
- initParams:object,与操作中的前处理脚本中return { obj:{...}, query: {...}, data: {...}} 返回的格式一致,可以设置对象,查询条件和夹带的数据
- displayType:create/edit/visit
var
grid=
this
.getAddinById(
"D0050C68B42743D79C646E1F8FB7D397"
);
obj=grid.getSelected();
var
queryOpr = {
targetClass:
this
.className,
viewName:
'SingleWO'
,
action:
'edit'
,
//动作
authority:
'hihilalal'
,
//英文名
displayName:
'设置的显示名'
,
//显示名
extSettings: JSON.stringify({needDefaultOpr:
true
})
}
var
args = {
initScript:`
return
{
obj:
this
.selectedObjs[0]
// obj:obj[0]
}`,
displayType:
'edit'
}
this
.openTab(queryOpr, args);
分为不带参数和带参数两种方式。他们的功能分别是关闭tab和关闭tab传值到后处理
- 不带参数:this.closeTab()
- 带参数:this.closeTab(data)
//不带参数:关闭tab
this.closeTab();
//带参数:关闭tab传值到后处理
this.closeTab(data);
分为不带参数和带参数两种方式。他们的功能分别是关闭指定tab和指定tab关闭传值。
- 不带参数:this.closeTabById()
- 带参数:this.closeTabById(data)
this.closeTabById('moduleName-authority');不知道这个moduleName-authority什么意思,无法说明这里面填了个什么值进去
this.closeTabById('moduleName-authority',data);
支持打开滑窗的功能,规则如下:
opendrawer(targetClass
,viewName ,'left'/'right', null,displayType,initParams)
@param targetClass:表示对应的类
@param viewName:表示需要打开的表单名称
@param left/right:表示右滑窗还是左滑窗
@param args:打开表单时的其他参数,在之前的实现保持不变的前提下,保证兼容性,推荐使用null
@param displaType:tab页签打开时的状态
@param initParams:nitParams:object,与操作中的前处理脚本中return { obj:{...}, query: {...}, data: {...}} 返回的格式一致,可以设置对象,查询条件和夹带的数据
debugger
//传入初始化脚本,可以传一个对象obj,也支持query,也支持自定义内容data
let initParams={
obj:
this
.selectedObjs[0],
data:{
woDesc1:
'cheney'
}
}
this
.openDrawer(
this
.className,
'SingleWOTest'
,
'left'
,
null
,
'edit'
,initParams);
//目前如下几种消息提示都是在界面上方提示后自动关闭
this
.msgbox.success(
"成功的提示"
);
this
.msgbox.info(
"一般的提示"
);
this
.msgbox.error(
"错误的提示"
);
//建议补充模态弹窗提示后需手动关闭的msg提示框,参考如下:
this
.msgboxDialog.success(“title标题”,
"成功的提示"
);
this
.msgboxDialog.info(“title标题”,
"一般的提示"
);
this
.msgboxDialog.error(“title标题”,
"错误的提示"
);
//@扩展点(暂不支持)
//建议补充comfirm确认弹窗(包括确认与取消按钮)
this
.msgboxDialog.confirm (“title标题”,
"请确认是否删除?"
, <
function
>(点击确定之后的回调函数), <
function
>(点击取消之后的回调函数));
console.log('表单验证成功')
}else{
console.log('表单验证失败')
}
不带参数:this
.freshData()
带参数:没看到带参的脚本
//不带参数
this
.freshData();
this
.msgbox.info(
"fresh success"
)
var
grdiAddin =
this
.GetAddinById(
"控件的id"
);
// this.getSourceAddin();
console.log(this.getSourceAddin.args.text)
label =this.getAddinById("Label4");
label.setValue(this.getSourceAddin.args.text)
自定义操作对象(在现在的脚本中定义操作对象,无需事先定义操作)通过executeOperation进行调用
- opr:定义的操作对象
- targetClass:目标类的类名
- viewName:目标类中的表单名称
- oprName:操作英文名
- displayName: 操作中文名
- displayType:动作支持create、edit、visit、next_create、url
- url: 如果displayType是url需要增加这个参数来传url地址
- oprStyle:操作样式dialog、tab、drawerL、 drawerR
- displayOperation:默认操作 true、false
- beforeExecute:表示前处理函数,代表前处理脚本
- afterExecute:表示后处理函数,代表后处理脚本
//定义新的create动作的dialog样式的操作
var
opr = {
targetClass:
"WorkOrder"
,
//目标类的类名
viewName:
"SinlgeWO"
,
//目标类中的表单名称
oprName:
"openCreatedial"
,
//操作英文名,生造操作时可以自定义
displayName:
"创建工单"
,
//操作中文名
displayType:
"create"
,
//动作支持create、edit、visit、next_create、url
oprStyle:
"dialog"
,
//操作样式dialog、tab、drawer
displayOperation:
true
,
//默认操作 true、false
beforeExecute:() => {
//前处理函数,代表前处理脚本
//新的前处理脚本
return
{
obj:
this
.selectedObjs[0],
//选填,当前表单多对象控件选中的对象
//query:"and obj.woTitle = '工单1'", //选填,非必填
data:{
"woDesc1"
:
"自定义属性"
//选填,woDesc1是自定义的属性,非实体了上绑定的已有属性;,需要在打开表单页面增加初始化操作,接收前处理脚本传入的自定义属性值
}
}
},
afterExecute:() => {
//表示后处理函数,代表后处理脚本
//新的后处理脚本,可根据实际情况维护
var
data =
this
.confirmData;
console.log(`自定义后处理`)
console.log(data)
}
}
this
.executeOperation(opr);
| 1、操作动作为url的时候,在URL地址中可用$env 2、在过滤条件中可以使用$env 3、嵌入网页的连接地址中可以使用$env 4、功能模型->应用管理->编辑应用中的起始操作可以使用$env | ||||||||||||||
11 | $user | 仅在拼接过滤条件等场景下使用,当前登录用户的基本信息,返回一个JSON对象,包括属性如下:
| 1、操作动作为url的时候,在URL地址中可用$user 2、在过滤条件中可以使用$user 3、嵌入网页的连接地址中可以使用$user 4、功能模型->应用管理->编辑应用中的起始操作可以使用$user | ||||||||||||
12 | $obj | 仅在拼接过滤条件等场景下使用,表单绑定的类的对象,如果没有条件限制默认获取的是绑定类的最新一条记录 是一个JSON对象 | 1、在表单中的事件操作动作为url的时候,在URL地址中可用$obj 2、在过滤条件中可以使用$obj 3、嵌入网页控件的连接地址中可以使用$obj 注意:当表单以create状态打开,如果未初始化数据$obj的各项属性为空,慎用 | obj.[attributeName类属性英文名]=$obj.[attributeName类属性英文名] | |||||||||||
13 | $form | 获取表单的单对象控件的取值 示例:$form["控件代号"] | 该关键字可用到过滤条件中,并且仅对单对象控件有效(有getValue方法的有效) 注意:如果是单选框、复选框、选择框等设置了数据的回填和显示属性不一致,则此处返回的是该控件的回填属性的取值 | 在过滤obj.attributeName= '$form["id"]' | |||||||||||
14 | 应用配置 | this.env.setCollapsed(); |
| PC应用菜单 |
| ||||||||||
15 | this.env.setOpenNames | 指定某些菜单展开
| PC应用菜单 |
| |||||||||||
数据访问 | this.handleQueryData() | 获取DWF定制的实体类、关联类的数据对象的脚本,支持回调,入参的查询条件为JSON对象,分别是:(返回方式为异步请求,如果在前端脚本要等待返回成功做处理需要将处理内容写到回调函数中)
| 表格后台数据强制刷新/查询 |
| |||||||||||
17 | this.handleQueryBySQL() | 提供在DWF数据库中接入的数据源,执行原始SQL语句的能力,接受一个对象,包含下面的属性:
返回结果:
| 切记,不要一次查询上巨量数据,例如:上百万量级,导致OOM(Out Of Memory) |
| |||||||||||
18 | this.handleQueryByApi() | 要求先在DWF建模工具中的“数据集成”-“API接口管理”的功能下面将外部接入的API先配置好,给其设定一个名字,如:“新闻报道”,在脚本中,直接将这个名字传递给函数,获得返回结果。 | 要先配置好API,并且为其命名才能起作用。 |
| |||||||||||
19 | this.create() | 支持实体类和关联类表单中执行新增操作
| 用于系统新增时控制是否弹出信息和关联类表单新增实体类并控制是否弹出信息 | 新增实体类对象
新增关联类对象
| |||||||||||
20 | this.createObj() | 在前端创建内存对象,临时对象不保存到数据库。 | 如果在异步调用的响应函数then中,使用this.returnSync({obj: res}),则会实现同步传递。 |
| |||||||||||
21 | this.edit() | 支持实体类和关联类表单中执行编辑操作
| 用于系统编辑时控制是否弹出信息和关联类表单编辑实体类并控制是否弹出信息 | 实体类编辑
关联类编辑
| |||||||||||
22 | this.delete() | 支持实体类和关联类表单中执行删除操作
| 用于系统编辑时控制是否弹出信息和关联类表单删除实体类并控制是否弹出信息 |
| |||||||||||
23 | this.deleteByCondition(condition, className) | 根据条件删除类对象 参数: condition:查询条件 className:要操作的目标类 |
| ||||||||||||
24 | this.axios | 在前端调用接口可能的第三方接口 | 需要在config中补充接口信息,如headers: {'Authorization': this.user.token}。 由于是前端调用,要密切注意不会出现跨域调用被拒绝的问题CORS,如果出现该问题,改用后端脚本实现调用。 |
| |||||||||||
25 | this.dwf_axios | 在前端调用APP端的restfull接口,主要是实体类、关联类等数据的增删改查的接口,同时该接口还支持调用第三方服务的接口 支持post、get 注意:
| 由于是前端调用,要密切注意不会出现跨域调用被拒绝的问题CORS,如果出现该问题,改用后端脚本实现调用。 |
| |||||||||||
26 | this.dwf_modeler_axios | 在前端调用modeler端的restful接口,主要是一些模型类的数据、用户、授权、应用等建模相关接口 注意:
| 调用modeler端的restful API |
| |||||||||||
27 | this.QueryResultAll() | 根据查询条件获取Store中缓存的数据 | 该接口已经不推荐使用! |
| |||||||||||
28 | this.getOperation() | 根据类、操作名称获取操作的定义,通过getOperation获取到已有的操作(需要存储到数据库中),再通过executeOperation进行调用,并且允许修改已有操作的操作样式和动作。
| 在前端脚本中需要调用定义的其他前后端脚本操作,可以利用getOperation得到对应的脚本,然后借助executeOperation实现交互 |
| |||||||||||
29 | this.queryEntity() | 获取实体类的元模型信息,传入字符串表示的实体类的类名 |
| ||||||||||||
30 | this.queryRelation() | 获取关联类的元模型信息,传入字符串表示的关联类的类名 |
| ||||||||||||
31 | this.cudBatchObjs() | 传入一个代表增删改事件的数组,批量增删改对象,在包含多个不同类型的实体类的复杂结构表单中,利用数据容器控件的this.getObj()提取对象,然后一次性提交数据修改,非常方便。 this.cudBtachObjs接受的是一个代表批量操作的动作数组,数组中的每个元素是一个JSON对象,包含下面的属性:
返回值为,被传入的动作数组,照原样返回,其中objs是实际增删改的数据。 |
| ||||||||||||
32 | 表单间交互 | this.openForm() | 脚本打开弹窗,参数如下:
如果,initialScript中初始化了返回的对象与initParams的含义冲突,以initParam里面的为准。 |
| |||||||||||
33 | this.getRootForm() | 在有多层弹窗的情况下可以使用该方法获取最底层表单的句柄 | |||||||||||||
34 | this.getParentForm() | 出现弹窗的时候想在弹窗中获取父表单的控件可以使用该方法获取父表单句柄 | |||||||||||||
35 | 前处理脚本:return false 表单默认操作:return false | 如果无异步调用,在操作的前处理脚本中可用,并且操作样式为弹框方式,使用return false表示不继续弹窗。 同样的,在操作控制以弹框的方式显示表单,在默认操作里面使用retrun false也会阻止弹框的关闭。 | |||||||||||||
36 | this.returnSync() | 当前端调用后端服务接口需要等待返回后在执行返回操作可以使用该方法 | 这样的话就能够保证在前处理中请求接口数据初始化弹框的内容 , var _this = this; |
| |||||||||||
37 | this.closeDialog() | 表单以弹窗样式打开,该方法有效,关闭当前弹窗,可以传递一个confirmData,在操作回到后处理脚本的时候,利用this.confirmData得到这个对象。 | 在弹框的操作脚本中调用
在弹框关闭后触发的后处理脚本中通过this.confirmData获得
| ||||||||||||
38 | this.openTab() | 以tab页签方式打开表单,传入两个参数,queryOpr和args: queryOpr:object,中的参数 targetClass:表示对应的类 viewName:表示需要打开的表单名称 action:动作 authority:英文名 extSettings:是否打开默认操作 args中的参数 initScript:object,与操作中的前处理脚本中return { obj:{...}, query: {...}, data: {...}} 返回的格式一致,可以设置对象,查询条件和夹带的数据 displayType:create/edit/visit |
| ||||||||||||
39 | this.closeTab() | 分为不带参数和带参数两种方式。他们的功能分别是关闭tab和关闭tab传值到后处理 不带参数:this.closeTab() 带参数:this.closeTab(data) | 关闭tab和关闭tab传值到后处理 |
| |||||||||||
40 | this.closeTabById() | 分为不带参数和带参数两种方式。他们的功能分别是关闭指定tab和指定tab关闭传值。 不带参数:this.closeTabById(id) 带参数:this.closeTabById(id, data) 页签的ID获取方式:moduleName-authority moduleName:新建操作的时候的模块名,即打开页签的操作所在的类名 authority:打开页签操作的操作名即打开页签操作的英文名 data为回传给后处理脚本的参数,可以在后处理脚本中利用this.confirmData获取 |
| ||||||||||||
41 | this.openDrawer() | 支持打开滑窗的功能,规则如下: targetClass:字符串,表示对应的类 viewName:字符串,表示需要打开的表单名称 direction:字符串,表示右滑窗还是左滑窗分成'left','right','top','buttom'四种 args:JSON对象,如果打算不传要使用null作为占位符,包含弹框的大小和高度,标题,初始化脚本和后处理脚本,具体有: curDrawerWidth:字符串,抽屉宽度,仅对左右抽屉效果有效,取值为数值和单位的字符串,例如:'800px' curDrawerHight:字符串,抽屉高度,仅对上下抽屉效果有效,取值为数值和单位的字符串,例如:'800px' needDialogDefaultOpr:布尔,是否显示默认操作的按钮 displayName:字符串,弹窗以后标题的名字 initialScript:字符串,可以不传,前处理脚本 afterScript:字符串,可以不传,后处理脚本 displayType:字符串,打开方式,包含'edit', 'create', 'visit'。 initParams:JSON对象,用于完成弹窗打开前的初始化,与操作中的前处理脚本中return { obj:{...}, query: {...}, data: {...}} 返回的格式一致,可以设置对象,查询条件和夹带的数据 obj:对象,用于初始化的对象 query:字符串,默认查询条件 data:对象,外部带入的数据 如果,initialScript中初始化了返回的对象与initParams的含义冲突,以initParam里面的为准。 | 脚本打开滑窗 |
| |||||||||||
42 | this.msgbox() | 消息提示,支持三种: this.msgbox.success 早期版本只接受一个字符串,后来发现有时候要停留更长时间,所以增加了输入一个配置的JSON对象的方法,这个JSON对象的具体的属性为: content:字符串,表示消息内容 duration:数字,表示停留时间,单位为秒 |
更多的参数设置如下: | ||||||||||||
43 | this.msgboxDialog() | 模态弹窗提示后需手动关闭的msg提示框,支持确定和取消两种回调方式,示例脚本如下: 注意:comfirm有点击确定和取消的回调函数,可以自行编辑,由于使用函数作为参数,使用回调里面需要对this进行重定义,否则无法使用相关方法。 |
| ||||||||||||
44 | this.spinShow() | 表单遮罩,该脚本执行会弹出一个遮罩层,防止表单此时再去编辑 弹出遮罩 | 防止重复提交,数据混淆,主要用在异步请求数据接口调用的时候 |
| |||||||||||
45 | this.spinHide() | 关闭遮罩 | 事件处理完成,关闭遮罩,在异步交口调用完成后可以关闭遮罩 |
| |||||||||||
46 | this.validateForm() | 表单单对象控件规则校验 | 提交保存表单之前,可以使用该脚本校验单对象控件是否满足设定的规则 |
| |||||||||||
47 | this.freshData() | 使用原有查询条件控制表单刷新,更新数据会触发原有页面初始化事件 | 当数据同步被修改,可以利用this.freshData()获取到最新数据 |
| |||||||||||
48 | 使用控件 | this.getAddinById() | 根据控件代号获取控件对象,以便能够操作控件 | 在表单的前端脚本中都可以获取到当前表单的控件对象 |
| ||||||||||
49 | this.getTargetAddin() | 获取控件绑定的多对象控件,这种用法不必在脚本里面使用字符串常量去得到目标控件。 | 仅在按钮上有效,获取的是按钮绑定的多对象控件 |
| |||||||||||
50 | this.getSourceAddin() | 获取当前操作绑定的控件,无需控件代号,避免了复用操作对应的脚本时,使用this.getAddinById必须指定字符串常量的局限性。 |
| ||||||||||||
51 | this.getSocketId(); | 获取当前客户端的socketId | |||||||||||||
52 | 脚本互相调用 | this.executeOperation() | 调用并执行已有的后端脚本,支持回调 自定义操作对象(在现在的脚本中定义操作对象,无需事先定义操作)通过executeOperation进行调用 opr:定义的操作对象,包含下面的属性: targetClass:目标类的类名 viewName:目标类中的表单名称 oprName:操作英文名 displayName: 操作中文名 displayType:动作支持create、edit、visit、next_create、url url: 如果displayType是url需要增加这个参数来传url地址 oprStyle:操作样式dialog、tab、drawerL、 drawerR displayOperation:默认操作 true、false beforeExecute:表示前处理函数,代表前处理脚本 afterExecute:表示后处理函数,代表后处理脚本 | 可以和getOperation配合使用 |
| ||||||||||
53 | 前端脚本调用后端脚本 | this.callServer().then(res => {}) | 完成前后端脚本的配合,传入参数并获得返回结果。 参数说明: customData:对象,调用后端脚本准备传递过去的自定义参数,JSON格式,后端脚本通过this.customData获取传递过去的参数结果。 scriptName:字符串,默认为“default”,后端脚本的脚本名称,在配置操作的时候,可以一次性新建多个后端脚本,每个后端脚本有一个英文名,传递这个英文名就意味着指示激活哪个后端脚本,也可以不传。 返回结果: callServer的调用为异步调用,如果希望从后端脚本向前端返回数据,方法是给后端脚本的this.res赋值: res:对象,通过this.res向前端脚本传参,一般是结果。 注意: 在同一个操作内编写的后端接口获取前端脚本传参可以利用this.customData获取callServer的第一个参数 返回结果需要通过this.res={}来给前端赋值回调结果 | 该方法属于操作内方法,调用的后端脚本仅支持在同一个操作内新建的后端脚本操作,如图: | 一个操作中的前端脚本:
统一操作中的后端脚本(default):
结果: 打开console控制台,可以看到控制台输出了两行记录: 后端回调结果 后端脚本执行成功 | ||||||||||
54 | 布局控件 | showTab() | 控制指定页签的显示,属于控件自身的函数 | 标签页 |
| ||||||||||
55 | hideTab() | 控制指定页签的隐藏 | 标签页 |
| |||||||||||
56 | getSelectedTab() | 获取Tab控件当前选中的子页签 | 标签页 |
| |||||||||||
57 | turnTo() | 跳转激活子页签 | 标签页 |
| |||||||||||
58 | dropName() | 获取点击次数 | 标签页 |
| |||||||||||
59 | 导入导出按钮控件 | responseData | responseData: code: 200 data: Object allNum: 导入的数据条数 failedNum: 导入数据的失败条数 msg: "succeed"/“failed” succeedNum: 导入数据的成功条数 message: "OK" success: true | 数据导入控件绑定数据导入完成事件 |
| ||||||||||
60 | this.exportData(['属性名'], '类名', `查询条件`) | 数据导出并下载文件 | 数据导出控件绑定点击事件 |
| |||||||||||
61 | setDisable() | 设置控件禁用/可用 | 按钮、数据导入按钮、数据导出按钮、标签页 |
| |||||||||||
62 | 单对象表单控件脚本 | this.getAddinById("控件代号").getValue() | 获取控件取值 | 除按钮外的单对象控件,包括:数字框、文本框、标签、富文本、选择框、单选框、复选框、对象标签。 |
| ||||||||||
63 | this.getAddinById("控件代号").getDisplayValue() | 获取界面显示的值,该方法仅在单选框、选择框、复选框中有效 | 单选框、选择框、复选框控件有效 |
| |||||||||||
64 | this.getAddinById("控件代号").setValue() | 给控件设置取值,并在控件上展示 | 单对象控件 |
| |||||||||||
65 | this.getAddinById("控件代号").args | 获取控件上的其他配置参数 示例: args.hided //控件的显示隐藏 true 隐藏 false:显示 | 所有控件 |
| |||||||||||
66 | this.getAddinById("控件代号").triggerEvent() | 需要被触发的事件名称,跟中文名一样,例如:在控件的选项区中发现有:“值变化事件”,那么事件的名称即为:“值变化” |
| ||||||||||||
67 | this.getAddinById("控件代号").setTooltip() | 设置控件的鼠标悬停事件 |
| ||||||||||||
68 | this.getAddinById("控件代号").setError() | 设置控件的提示信息 | 设置信息 |
| |||||||||||
69 | this.getAddinById("控件代号").getSelected() | 获取选中的对象信息 | 仅支持多对象控件,如:表格、卡片、目录树、关联结构树 |
| |||||||||||
70 | this.getAddinById("控件代号").getKVValue() | 获取动态参数看的KV键值数据 | 仅支持动态参数控件 |
| |||||||||||
71 | this.getAddinById("控件代号").getSelectedFileList() | 点击预览事件,获得被点击的文件列表 | 多文件上传控件 |
| |||||||||||
72 | this.getAddinById("控件代号").getDeleteFileList() | 针对删除文件事件,获取已经删除的文件列表 | 多文件上传控件 |
| |||||||||||
73 | this.getAddinById("控件代号").getFileList(withUrl:false); | 获得上传成功的所有文件列表,默认不获取全部URL,withUrl为真表示获取全部Url,自动拼接好 | 多文件上传控件 |
| |||||||||||
74 | 多对象表单控件脚本(卡片还有特殊包含的关键字) | setExternalOprConfig(config) | 表格操作列样式设置,其中用到uniLabel、type、shape、disabled、color | 表格控件 |
| ||||||||||
75 | setRowClass | 设置行样式,是一个函数,表格会遍历每行,传入名为params的参数,其中params包含: node:表示每行的信息,如rowIndex表示行号 data:表示每行显示的JSON对象。 可设置的配置项如下: .grid-font-color-red | 表格控件 |
| |||||||||||
76 | setColumnDefs | 设置列定义 | 表格控件 |
| |||||||||||
77 | setColumnVisible | 设置列可见 | 表格控件 |
| |||||||||||
78 | setRowData | 设置表格数据 | 表格控件 |
| |||||||||||
79 | getRowData | 获取表格数据 | 表格控件 | ||||||||||||
80 | deleteRowData | 删除表格数据(参数对应行) | 表格控件 | ||||||||||||
81 | updateRowData | 修改表格数据 | 表格控件 | ||||||||||||
82 | getAll | 获取表格的所有数据 | 表格控件 |
| |||||||||||
83 | getDefaultColumnDef | 获取一列的默认列定义 | 表格控件 |
| |||||||||||
84 | setPageInfo | 设置当前页码 | 表格控件 | ||||||||||||
85 | getPageInfo | 获取表格页码信息 | 表格控件 |
| |||||||||||
86 | setTooltip | 表格单元格的鼠标悬停事件 | 表格控件 |
| |||||||||||
87 | setDisplayType() | 设置卡片的展示类型,支持 craete、visit、edit | 卡片控件 | ||||||||||||
88 | getSelected | 获取选中行数据,支持多选对象 | 表格控件、卡片控件 |
| |||||||||||
89 | getParentAddin | 获取卡片控件所在的表单 | 卡片控件 |
| |||||||||||
90 | updateShow | 刷新子表单的数据显示 | 卡片控件 |
| |||||||||||
91 | getRootAddin | 获取控件 | 卡片控件,子表单中使用 | var subFormAddin = this .getRootAddin( ); | |||||||||||
92 | freshObj(res) | 修改信息后刷新卡片,只是前端刷新 | 卡片控件 |
| |||||||||||
93 | freshObj(res) | 关联类修改信息后刷新卡片 | 卡片控件 |
| |||||||||||
94 | editNodeObj() | 编辑树 | 树控件 |
| |||||||||||
95 | start(args) | 启动消息订阅 | 订阅控件 |
| |||||||||||
96 | pause() | 暂停消息订阅 | 订阅控件 |
| |||||||||||
97 | resume() | 恢复消息订阅 | 订阅控件 |
| |||||||||||
98 | stop() | 停止消息订阅 | 订阅控件 |
| |||||||||||
99 | this.param | 获取后端返回值,当调用后端脚本完成后,后端脚本返回的数据会存储在this.param变量中,需要的时候可以取到 | 调用后端脚本或restful接口返回的结果存储在this.param中,当调用后该对象有值 |
| |||||||||||
100 | getValue(); | 获取查询框中控件的取值 | 查询框 |
| |||||||||||
101 | freshData | 获取查询框中的查询条件和 重新执行查询条件 | 查询框 |
| |||||||||||
102 | freshObj | 支持返回结果,如改用API查询或者自定义sql查询 | 查询框 |
| |||||||||||
103 | 可视化表单控件脚本 | this.getAddinById('可视化控件代号').clickData | 获取选中系列 | 可视化控件 |
| ||||||||||
104 | freshData(query) | 根据过滤条件更新数据 | 多对象控件、可视化控件 |
| |||||||||||
105 | freshData(extendArr, extendGrid, extendSTime, extendETime) | @param extendArr 外部选择的序列集合 @param extendGrid 外部指定图表排列方式 @param extendSTime 外部指定查询起始时间 @param extendETime 外部指定查询结束时间, | 时序看板 | ||||||||||||
106 | getToolsSeries() | 返回当前工具栏所选全部序列 | 时序看板 | ||||||||||||
107 | getToolsGridType() | 返回当前工具栏所选图标排列方式 | 时序看板 | ||||||||||||
108 | getToolsStartTime() | 返回当前工具栏日期起始时间 | 时序看板 | ||||||||||||
109 | getToolsEndTime() | 返回当前工具栏日期结束时间 | 时序看板 | ||||||||||||
110 | option.legend | 设置图例位置 | 可视化控件 |
| |||||||||||
111 | 编码扩展表单控件脚本 | HTML | 超级控件扩展,支持Html和Vue两种格式 在控件内可以通过dwf_ctx调用dwf脚本引擎中的方法 获取dwf_ctx句柄的方法: var _this = window.parent.dwf_ctx; //获取dwf的脚本句柄 | 1)自定义复杂的交互逻辑,如根据设置数据自动增加可控件等 2)酷炫的可视化看板功能 |
| ||||||||||
112 | VUE | vue-超级控件 | 支持Iview的组件,如需其他组件需要在服务器安装后才可以被引用,如要使用elementUI的组件库,可以预先在dwf服务器下载安装,然后才能再此处加入引用 |
|