函数表达式
共工函数是用于共工的低代码语言。它是一种强类型、声明性、一般用途的函数式编程语言。
共工函数以人性化的文本表达。 它是一种低代码语言。 低代码中的“低”是由于语言的简洁性和简单性,让使用人员和开发人员都可以轻松进行一般的编程任务。 它可以进行从面向没有编程经验的用户的无代码到面向经验丰富的专业人士的“专业代码”的全面开发,无需通过学习或重写来解决二者之间的差异,从而使不同的团队可以协作并节省时间和费用。
共工函数使用简洁而强大的公式描述业务逻辑。 大多数逻辑都可以简化为一行,其中包含丰富的表达能力和控制以满足更复杂的需求。
数字处理函数
AVERAGE
AVERAGE(number1, number2, …)
返回参数的平均值(算术平均值)。
AVERAGE(1,3,5),返回结果为 3
COUNT
COUNT(value1, value2, …)
统计参数个数,value 代表不同的值。
COUNT("张三","李四","王五","田二"),返回结果为 4
COUNTIF
COUNTIF(value1, value2, …, criteria)
统计满足条件的参数个数,value 代表不同的值,criteria 为判断条件。
COUNTIF([1,2,3,4], ">2"),返回结果为2
COUNTIF([1,2,3,4], "!=2"),返回结果为3
COUNTIF([1,2,3,4], ">=1"),返回结果为4
COUNTIF(["a", "b", "c"], "d"),返回结果为0
FIXED
FIXED(number, [decimals])
将数字舍入到指定的小数位数,以十进制数格式对该数进行格式设置,并以文本形式返回结果。
- number: 必需。 要进行舍入并转换为文本的数字。
- decimals: 可选。 小数点右边的位数。
INT(number)
将数字向下舍入到最接近的整数。
INT(数字)
MAX
MAX(number1, number2, …)
返回一组值中的最大值。
MAX(1,5,3),返回结果为 5
MIN
MIN(number1, number2, …)
返回一组值中的最小值。
MIN(1,5,3),返回结果为 1
MOD
MOD(number, divisor)
返回两数相除的余数。 结果的符号与除数相同。
- number: 必需。 要计算余数的被除数。
- divisor: 必需。 除数。
MOD(数字)
PRODUCT
PRODUCT(number1, [number2], …)
函数使所有以参数形式给出的数字相乘并返回乘积。
PRODUCT(数量,单价)
ROUND
ROUND(number, num_digits)
- number: 必需。 要四舍五入的数字。
- num_digits: 必需。 要进行四舍五入运算的位数。
将数字四舍五入到指定的位数。
ROUND(88/3,2),返回结果为 29.33
文本处理函数
CONCATENATE
CONCATENATE(text1,[text2], …)
将多个文本字符串合并成一个文本字符串。
例如函数 CONCATENATE(A,B,C),返回值为 ABC。
注:字段或者函数之间,用逗号隔开;如果是字符串,需要用引号包裹起来。
函数示例:将时间、姓名和学号连起来成为一个新的字符串
CONCATENATE(TEXT(DATE(时间),"yyyyMMdd"),"-","姓名","-","学号")
CHAR
CHAR(number)
CHAR 函数可将计算机其他类型的数字代码转换为字符。
Number:用于指定字符的数字。
示例:CHAR(10),即返回值为换行字符"\n"。
目前仅支持以下数字代码:
Number | 字符 | 含义 |
---|---|---|
9 | \t | 制表符 tab |
10 | \n | 换行字符 |
34 | " | 双引号 |
39 | ’ | 单引号 |
92 | \ | 反斜杠 |
EXACT
EXACT(text1,text2)
比较两个字符串是否完全相同(区分大小写)。完全相同则返回 true,否则返回 false。
IF(EXACT(中奖手机号码,手机号码),"恭喜您,中奖啦~~","很遗憾,没有中奖,下次再来哦~")
ISEMPTY
ISEMPTY(text)
判断值是否为空字符串、空对象或者空数组。
支持使用 ISEMPTY 函数的字段有:单行文本、多行文本、数字、日期时间、单选按钮组、复选框组、下拉框、下拉复选框、地址、定位、成员字段、部门字段、扩展字段。
以下三种方式,均表示该“单选”字段为空值。(注意,判断的是该单选字段被编辑后是否为空值)
ISEMPTY(文本字段);
ISEMPTY(文本字段)==TRUE();
ISEMPTY(文本字段)==1。
IF(ISEMPTY(单选按钮组),"未选择","已选择")
LEFT
LEFT(text,[num_chars])
从一个文本字符串的第一个字符开始返回指定个数的字符。
LEFT('身份证',3)
LEN
LEN(text)
返回文本字符串中的字符个数。(空格也将作为字符进行计数)
LEN(字符串)
LOWER
LOWER(text)
将一个文本字符串中的所有大写字母转换为小写字母。
LOWER(含大写的文本数据)
MID
MID(text, start_num, num_chars)
返回文本字符串中从指定位置开始的特定数目的字符,该数目由用户指定。
- text: 必需。 包含要提取字符的文本字符串。
- start_num: 必需。 文本中要提取的第一个字符的位置。 文本中第一个字符的 start_num 为 1,以此类推。
- num_chars: 必需。 指定希望从文本中返回字符的个数。
以身份证号中提取生日为例:通过 MID 函数提取身份证号的第 7 到 10 位,后面接“-”,提取身份证号的 11、12 位,接“-”,最后提取身份证号的 13、14 位。最后,采用 CONCATENATE 函数将提取出来数字和“-”连接符相连。
CONCATENATE(MID(身份证,7,4),"-",MID(身份证,11,2),"-",MID(身份证,13,2))
REPLACE
REPLACE(old_text, start_num, num_chars, new_text)
根据指定的字符数,将部分文本字符串替换为不同的文本字符串。
- old_text: 必需。要替换其部分字符的文本。
- start_num: 必需。old_text 中要替换为 new_text 的字符位置。
- num_chars: 必需。old_text 中希望使用 new_text 来进行替换的字符数。
- new_text: 必需。将替换 old_text 中字符的文本。
REPLACE(字符串 1,2,4,字符串 2),即将字符串 1 中的第 2 位之后的 4 位(即 2,3,4,5 位),用字符串 2 来替换。
REPLACE(原文本,2,4,替代内容)
SPLIT
SPLIT(text, text_separator)
将文本按指定字符串分割成数组。
SPLIT(文本字符串,'-')
TEXT
TEXT(num,text_format)
将数字转换成特定格式的文本。
其中 text_format 的含义如下:
- #:数字占位符。只显有意义的数据而不显示无意义的数据。小数点后数字如大于”#”的数量,则按”#”的位数四舍五入。小数点后数字如小于”#”的数量,则显示实际值。例:在文本框中输入:###.##,23.1 显示为 23.1,23.1578 显示为 23.16。
- 0:数字占位补位符。如果小数点前的数据的长度大于占位符,则显示实际数据,如果小于占位符的数量,则用 0 补足。小数点后的数据的长度大于占位符,则按“0”的位数四舍五入。小数点后数字如小于“0”的数量,则用“0”补足。例:在文本框中输入:000.00,23.1 显示为 023.10,23.1578 显示为 023.16。
- ,:千位分隔符。可插入“#”或“0”中使用,数字中插入千位分隔符。合法使用形式:
- 需要在小数点前使用。
- 需要在“#”或“0”之间。
- %:百分比。放在数字占位符或补位符之后。数据以百分比形式显示。例:代码:#%,23.1 显示为 2310%。
- [Num0] 显示原始数据。
- [Num1] 将数字转为中文小写。123 显示为一百二十三。
- [Num2] 将数字转为中文大写。123 显示为壹佰贰拾叁。
- 直接在 [Num0] 或 # 或 0 的之前加字符即是前缀,支持中文字符、英文大小写、¥、$ 及空格。
可根据自己需要自由组合。
示例:TEXT(123.7895,“#.##”)=123.79
TEXT(数字,"##.##")
TEXT(date, text_format)
将日期转换成特定格式的文本。
其中 text_format 的含义如下:
- yy 表示年,显示为 15
- yyyy 表示年,显示为 2015
- M 表示月,显示为 6
- MM 表示月,显示为 06
- MMM 表示月,显示为六月
- d 表示日,显示为 9
- dd 表示日,显示为 09
- HH 表示 24 小时制的时
- mm 表示分
- ss 表示秒
- E 表示星期,结果为 0~6,分别表示星期日~星期六
- EE 表示星期,例如:日、一、二等
- EEE 表示星期,例如:星期日、星期一、星期二等
使用举例:将日期转换为文本。
TEXT(DATE(日期时间),"yyyyMMdd")
UNION
UNION(文本 1,文本 2,文本 3,文本 4) 或 UNION([数组])
通过 UNION() 函数可以将重复数据自动剔除。
例:UNION(张三,李四,王五,张三,李四) 返回值为 [张三,李四,王五]。
UNION(项目报名.姓名)
UPPER
UPPER(text)
将一个文本字符串中的所有小写字母转换为大写字母。
UPPER(文本字符串)
VALUE
VALUE(text)
将内容为数字的文本转化为数字格式。
VALUE(评分1)+value(评分2)
逻辑函数
逻辑函数,是一类返回值为逻辑值 true
或逻辑值 false
的函数。
true
:代表判断后的结果是真的,正确的,也可以用 1 表示;
false
:代表判断后的结果是假的,错误的,也可以用 0 表示。
AND
AND(logical1, logical2, …)
在参数组中,任何一个参数逻辑值为 false,即返回 false;只有当所有参数逻辑值为 true,才返回 true。
即是说,AND 函数,是求括号里两个或多个逻辑式子共同满足 true(逗号隔开的逻辑式子都满足)的时候,返回的结果为 1,即 true。
AND(A,B),表示如果同时满足条件 A,B,则返回 true,否则返回 false。
AND(1<5,1<6),返回结果 true
AND(1<5,7<6),返回结果 false
AND 函数与 IF 函数组合使用示例:当三科成绩均大于 95 分时为“优秀”,否则为“其他”。
IF(AND(语文成绩>95,数学成绩>90,英语成绩>90),"优秀","其他")
IF
IF(logical_test,value_if_true, value_if_false)
判断一个条件能否满足;如果满足返回一个值,如果不满足则返回另外一个值。
IF(A,B1,B2),表示如果满足条件 A,那么返回 B1,否则返回 B2。
IF(成绩<60,"不及格","及格")
示例:60 以下,为不及格;60-79,为中;80-89,为良;90 以上,为优。
IF(成绩<60,"不及格",IF(成绩<80,"中",IF(成绩<90,"良","优")))
如题目:"一去二三里"的下一句是什么? A.烟村四五家 B.亭台六七座 C.八九十枝花
函数示例:选择 A 得 3 分,否则 0 分。
IF( 一去二三里 的下一句是什么?=="A.烟村四五家",3,0)
如题目:下列说法正确的是?(多选题) A.管理员可以在应用管理界面新建一个表单 B.可以通过导入 excel 创建一个表单 C.可以从当前应用或者其它应用复制一个表单
函数示例:全选得 3 分,否则 0 分。
IF(下列说法正确的是?(多选题)=="A.管理员可以在应用管理界面新建一个表单,B.可以通过导入excel创建一个表单,C.可以从当前应用或者其它应用复制一个表单",3,0)
IFS
IFS( logical_test1, value_if_true1, logical_test2, value_if_true2, … ,logical_testn, value_if_truen)
IFS 函数检查是否满足一个或多个条件,且返回符合第一个 true 条件的值。 IFS 可以取代多个嵌套 IF 语句,并且有多个条件时更方便阅读。
参数 | 描述 |
---|---|
logical_test1(必需) | 计算结果为 true 或 false 的条件。 |
value_if_true1(必需) | 当 logical_test1 的计算结果为 true 时要返回结果。 可以为空。 |
logical_test2…logical_test127(可选) | 计算结果为 true 或 false 的条件。 |
value_if_true2…value_if_true127(可选) | 当 logical_testn 的计算结果为 true 时要返回结果。 每个 value_if_truen 对应于一个条件 logical_testn。 可以为空。 |
n 的最大值为 127,即 IFS 函数最多允许 127 个不同的条件。
IFS(A1,B1,A2,B2,A3,B3…),表示满足条件 A1 时,返回结果 B1;满足条件 A2 时,返回结果 B2;满足条件 A3 时,返回结果 B3。依次类推。
函数示例:可以通过 IFS 函数来计算成绩的等级。
IFS(成绩<60,"不及格",成绩<=79,"及格",成绩<=89,"良好",成绩>=90,"优秀")
NOT
NOT(logical)
对参数逻辑值求反。
NOT 比较简单,就是把括号里为 true 的值变成 false,括号里为 false 的值变为 true。
NOT(50<60),返回 false;
NOT(90<60),返回 true;
NOT 函数与 IF 函数组合使用:当成绩不低于 60 分为合格,否则需要补考。
IF(NOT(成绩<60),"合格","补考")
OR
OR(logical1,logical2, …)
在参数组中,任何一个参数逻辑值为 true,即返回 true;只有当所有逻辑参数值为 false,才返回 false。
和 AND 函数一样,不同的地方在于,括号里只要有 1 个逻辑式为 true,返回的结果就是 1,也就是 true。
OR(A,B),表示如果满足条件 A,或者满足条件 B(即 2 个条件中满足一个或一个以上),则返回 true,否则返回 false。
OR(1<2,2<2),返回结果为 true
OR(3<2,2<2),返回结果为 false
OR 函数与 IF 函数组合使用示例:任意一门成绩大于 90,即为“优秀”,否则为“其他”。
IF(OR(语文成绩>90,数学成绩>90,英语成绩>90),"优秀","其他")
XOR
XOR(logical1,logical2, …)
返回所有参数的异或值。
异或的含义是:两个逻辑值相同,返回 false,两个逻辑值不同,返回 true。
XOR(80<90,95<90),返回 true
XOR(95<90,98<90),返回 false
XOR(75<90,68<90),返回 false
日期函数
日期时间字段的返回值为时间戳(timestamp),单位是毫秒;以下日期函数的参数可以直接使用日期字段。例如:YEAR(日期时间字段)
下面介绍关于日期函数的两个基本概念:
时间戳(timestamp):时间戳是计算机记录时间的一种格式。通常是一个字符序列,唯一地标识某一刻的时间。在共工中,「日期时间」字段便是由这样的序列来存储的。日期对象:可以理解为年月日时分秒;日期对象的格式为 Sat Aug 01 2015 00:00:00 GMT+0800(中国标准时间),即北京时间 2015 年 8 月 1 日 00:00:00,日期对象可以进行各种运算,比如日期加减法等等。DATE
DATE(timestamp)
将时间戳转换为日期对象。
DATE(year,month,day)
DATE(year,month,day,hour,minute,second)
将年月日(时分秒)转换为日期对象。
- year: 必需。年份。
- month: 必需。月份。
- day: 必需。天数。
- hour: 非必需。小时。
- minute: 非必需。分钟。
- second: 非必需。秒。
例如,2015 年 11 月 1 日的日期对象可以用如下表示:
DATE(2015,11,1)
DATE(1446307200000)
DATE(2015,11,1,0,0,0)
这三个都表示“Sun Nov 01 2015 00:00:00 GMT+0800 (中国标准时间)”
DATEDELTA
DATEDELTA(timestamp, deltadays)
将指定日期加/减指定天数。
- timestamp: 必需。初始日期。
- deltadays: 必需。需要加减的天数。正数为增加,负数为减少。
DATEDELTA(生产日期,保质期)
注意:DATEDELTA 函数必须在日期时间字段内使用。
DATEDIF(start_timestamp, end_timestamp, [unit])
计算出两个时间的差值。
- start_timestamp必需。 一个代表开始时间的日期。
- end_timestamp必需。 一个代表结束时间的日期。
- Unit可选。一个可选参数,默认为 “d”,可以是 “y” 、“M”、“d”、“h”、“m”、“s” ,分别代表计算两个日期相差的年数、月数、天数、小时数、分钟数、秒数。(区分大小写,大写 M 代表月,小写 m 代表分。)
根据需要,可以通过 DATEDIF 函数计算出相差的年数(“y”)、月数(“M”)、天数(“d”)、小时数(“h”)、分数(“m”)以及秒数(“s”)。
注意:如果结束日期小于开始日期,计算不出结果。
DAY
DAY(timestamp)
返回某日期的天数, 天数是介于 1 到 31 之间的整数。
DAY(日期)
DAYS(end_timestamp, start_timestamp)
返回两个日期之间的天数。
- end_timestamp: 必需。结束日期。
- start_timestamp: 必需。起始日期。
DAYS(结束日期,开始日期)
NOW
NOW()
返回当前时间。与 TODAY 函数相同。
TIMESTAMP
TIMESTAMP(<em>date</em>)
将日期对象转换成时间戳。
TIME
TIME(hour, minute, second)
返回特定时间的十进制数字。时间值为日期值的一部分,并用十进制数表示(例如 12:00 PM 可表示为 0.5,因为此时是一天的一半)。
- hour: 必需。0(零)到 32767 之间的数字,代表小时。 任何大于 23 的值都会除以 24,余数将作为小时值。 例如,TIME(27,0,0) = TIME(3,0,0) = .125
- minute: 必需。 0 到 32767 之间的数字,代表分钟。 任何大于 59 的值将转换为小时和分钟。 例如,TIME(0,750,0) = TIME(12,30,0) = .520833
- second: 必需。 0 到 32767 之间的数字,代表秒。 任何大于 59 的值将转换为小时、分钟和秒。 例如,TIME(0,0,2000) = TIME(0,33,20) = .023148
TODAY
TODAY 函数可用于获取当前系统的日期,可精确到秒。
函数用法:TODAY()
// TEXT 函数将获取的日期转换为文本格式,以获取年月日为例
TEXT(TODAY(),"yyyyMMdd")
YEAR
YEAR(<em>timestamp</em>)
返回某日期的年份。
复杂函数
OPENPAGE
OPENPAGE 函数用于打开页面
OPENPAGE(page)
参数 page 是具体的需要打开的页面
CLOSEPAGE
CLOSEPAGE 函数是关闭页面
CLOSEPAGE()
SAVETOKEN
用于同步第三方用户 token,仅限于应用的安全模式选择为第三方管理场景下,登录之后高级函数里回调使用,下面是使用 demo
/* 1. 表单校验 */
EditableLogin_WczEM.validate().then(() => {
/* 2. 校验成功之后调用登录接口连接器 */
API_externalLogin.request({
/*入参 账号 密码 验证码等*/
"username":EditableLogin_WczEM.getFormModel().count,
"password": EditableLogin_WczEM.getFormModel().passWord,
"code" : EditableLogin_WczEM.getFormModel().code,
"uuid" : DataView_aWLID.getFormModel().uuid
}).then(res => {
/*4. 登录接口调用回调处理 失败 提醒失败信息 */
if(res.error || (res.status == 400)) {
MESSAGE({
type: 'warning',
content: res.message
});
/*刷新验证码 */
DataView_aWLID.reload()
} else {
/* 3. 成功之后调用 SAVETOKEN()方法,这一步不可缺少! */
SAVETOKEN(res.data)
}
})
})
MESSAGE
全局提醒 MESSAGE,效果如下图所示:
调用方式
MESSAGE({
content: 'This is a success message',
type: 'warning'
})
连接器函数
连接器函数使用场景需要先了解连接器使用文档
在配置好连接器之后可以通过配置面板配置连接器,也可以通过高级函数(写表达式)来使用连接器,这时候就需要调用连接器函数,下面介绍如何使用连接器函数:
- 找到要使用的连接器,复制连接器的
code
如下图所示
- 选择需要使用连接器的组件,比如:数据容器的数据源,按钮的提交事件等
上图是一个数据表格,数据源选择连接器且使用高级函数的例子
具体代码:
API_datagrid.list(
{
pageSize: DataGrid_YJmJe.pageSize(),
pageNumber: DataGrid_YJmJe.pageNumber()
}
)
其中 API_datagrid.list()
就是调用函数连接器的表达式,API_
是所有连接器在应用中调用的方式,后面的 datagrid
是连接器的 code
,表达式书写的规则就是 API_连接器code.接口code()
连接器函数可以传参以及连接器调用成功后回调方法
上图是有回调方法的一个例子
连接器函数调用的完整代码:
API_datagrid.update(
{
id: DataView_DxqiP.getFormModel().id,
name: DataView_DxqiP.getFormModel().name,
remark: DataView_DxqiP.getFormModel().remark
},
() => CLOSEPAGE() // 连接器调用成功之后回调里面关闭当前页面
)
连接器函数里参数的写法支持 Object.assign()
, JSON.stringify()
等
如果觉得上面示例里 DataView_DxqiP
DataGrid_YJmJe
的使用有点迷惑,可以参考下文的【组件暴露的函数】介绍了每个组件可以在函数里使用的变量和方法,这里只做连接器函数使用方法的介绍。
用户角色获取
GetGlobalUserRole
: 函数是获取当前用户角色信息
GetGlobalUserRole(callback)
: 异步方法,需要在回调函数 callback
里面拿到用户角色信息
调用示例:
GetGlobalUserRole((res)=>{
console.log(res);
// 打印获取到的用户角色信息
})
获取用户部门信息
GetGlobalUserOrg
: 函数是获取当前用户的部门信息
GetGlobalUserOrg(callback)
: 异步方法,需要在回调函数 callback
里面拿到用户的部门信息
调用示例:
GetGlobalUserOrg((res)=>{
console.log(res);// 打印获取到的用户部门信息
})
获取环境变量
在环境变量配置页面定义要使用的变量,注意变量编码要在后面高级表达式配置中使用到,
在函数编辑器内输入 $_
就会联想出可以选择的环境变量,如下图所示:
组件特有的函数
数据视图
对外暴露方法:getFormModel()
: 数据视图的表单数据,提交表单数据的时候使用 getFormModel().xxxx
的方法读取表单的值
formInitData()
: 数据视图的初始数据
validate()
: 表单校验方法 返回 promise
setFormModel(key, value)
: 表单赋值
比如数据视图实体对象值为
{
name: '小明',
age: 12,
sex: '男'
}
$DataView_xxx.name
、$DataView_xxx.age
等方式获取数据视图的值,数据视图内的表格(或者其他数据容器等)入参依赖数据视图中的某个值,推荐使用 $DataView.xxxx
的方式
表格
对外暴露方法:pageNumber()
: 获取页码
getFormData()
: 获取内置搜索的数据
getPaginationRef()
: 获取分页组件 ref
tableData()
: 获取表格数据
pageSize()
: 获取表格每页展示的条数
getSelectRows()
: 获取表格选中数据 [{}]
getSelectRowKeys()
: 获取表格选中数据的主键 [key]
reload()
: 表格重新加载
setTableData()
: 表格赋值
changePagination(
page,
pageSize)
:表格设置分页,并刷新
setSelectedRowKeys
: 设置表格选中数据
树表格
对外暴露方法:pageNumber()
: 获取页码
getFormData()
: 获取内置搜索的数据
getPaginationRef()
: 获取分页组件 ref
tableData()
: 获取表格数据
pageSize()
: 获取表格每页展示的条数
getSelectRows()
: 获取表格选中数据
getSelectRowKeys()
: 获取表格选中数据的主键
reload()
: 表格重新加载
可编辑表格
对外暴露方法:pageNumber()
: 获取页码
getPaginationRef()
: 获取分页组件 ref
getFormData()
: 获取内置搜索的数据
tableData()
: 获取表格数据
pageSize()
: 获取表格每页展示的条数
getSelectRows()
: 获取表格选中数据
getSelectRowKeys()
: 获取表格选中数据的主键
getEditRows()
: 获取编辑的数据
reload()
: 表格重新加载
树视图
对外暴露方法:getSelectRows()
: 获取表格选中数据 [{}]
getSelectKeys()
: 获取表格选中数据的主键[主键]
标签面板
对外暴露方法:getSelectKey()
: 获取表格选中的主键
reload()
: 重新加载
检索容器
对外暴露方法:getSearchData()
: 获取检索容器当前检索值
图片上传
对外暴露方法:getFileTypeFile()
: 获取上传图片的 File 类型格式。
文件上传
对外暴露方法:getFileTypeFile()
: 获取上传文件的 File 类型格式。
事件回调多个组件重新刷新的方法
用 promise 异步处理多个调用多个属性
Promise.resolve().then(() => {
DataView_4r5ib.reload();DataView_4r5ib.reload();
})
函数编写示例
连接器调用
API_externalLogin.request({
/*入参*/
name: $DataView_xxx.name,
age: $DataView_xxx.age
}).then(res => {
/*res是连接器调用返回的值 连接器回调处理*/
if(res.code === 200) {
// 成功
DataView_xxx.reload(); /*刷新某个数据视图*/
CLOSEPAGE(); /*关闭当前弹窗*/
DataGrid_xxx.reload(); /*关闭弹窗后刷新外层表格*/
} else {
/*失败 tips提醒失败信息*/
MESSAGE({
type: 'warning',
content: res.message
});
}
})
数据视图
数据视图赋值 setFormModel
DataView_xxx.setFormModel('key', value)
数据视图校验 validate
DataView_WczEM.validate().then(() => {
/*表单校验成功处理*/
console.log('校验成功')
}).catch(() => {
console.log('失败')
})
数据视图数据变化,触发其他元件隐藏
方案一:主动设置,使用元件的改变事件触发,控制对应 code 元件的 dom 元素,使用原生的方式修改组件样式:
Promise.resolve().then(() => {
if(DataView_ubC1u.getFormModel().type === 0) {
document.querySelector('.Container_qpaxt').style.display='none';
} else {
document.querySelector('.Container_qpaxt').style.display='block';
}
})
方案二:被动监听,使用新旧表达式方式配置可见性,需要隐藏的元件配置
旧表达式模式:不支持复制粘贴
#currentObject.school_name == '测试'
支持复制粘贴直接拷贝使用
DataView_2PY56.getFormModel().school_name == '测试1'
数据表格
数据表格入参 带分页参数 pageSize(),pageNumber()
{
pageSize:DataGrid_s8USA?.pageSize() || 10,
pageNo:DataGrid_s8USA?.pageNumber() || 1
}
数据表格入参 带外部检索容器
方式一:
/*这里这样写 可以是入参字段自己定义*/
{
name:FilterContainer_DFHyw.getSearchData().fullName, /*这里的姓名是检索容器里面的全名字段*/
age:FilterContainer_DFHyw.getSearchData().age,
}
方式二:
/*如果检索容器里面的字段和入参字段是相同的 不需要转换的话 可以用以下方式写*/
Object.assign(FilterContainer_DFHyw.getSearchData())
数据表格入参 混合方式【里面有检索容器和分页参数】
方式一:入参字段自己定义
{
name:FilterContainer_DFHyw.getSearchData().fullName, /*这里的姓名是检索容器里面的全名字段*/
age:FilterContainer_DFHyw.getSearchData().age,
pageSize:DataGrid_s8USA.pageSize(), /*表格pageSize*/
pageNo:DataGrid_s8USA.pageNumber(), /*表格pageNumber*/
}
方式二:如果检索容器里面的字段和入参字段是相同的 不需要转换的话 可以用以下方式写
Object.assign(FilterContainer_DFHyw.getSearchData(),{
pageSize:DataGrid_s8USA.pageSize(), /* 表格pageSize */
pageNo:DataGrid_s8USA.pageNumber() /* 表格pageNumber */
})
方式三:带时间区间的入参转换
JSON.stringify(FilterContainer_nUKOH.getSearchData().applyTime) != undefined ? {
applyStartTime: FilterContainer_nUKOH.getSearchData().applyTime[0],
applyEndTime: FilterContainer_nUKOH.getSearchData().applyTime[1],
roomId: FilterContainer_nUKOH.getSearchData().roomId,
applyStatus: FilterContainer_nUKOH.getSearchData().applyStatus,
pageSize:DataGrid_CToTF.pageSize(), /*表格pageSize*/
pageNum:DataGrid_CToTF.pageNumber(),/*表格pageNumber*/
} : {
applyStatus: FilterContainer_nUKOH.getSearchData().applyStatus,
roomId: FilterContainer_nUKOH.getSearchData().roomId,
pageSize:DataGrid_CToTF.pageSize(), /*表格pageSize*/
pageNum:DataGrid_CToTF.pageNumber(), /* 表格pageNumber*/
}
弹出框选择列表数据回显能力
页面配置描述:
打开页面回显数据:
弹出框页面配置:
(data, currentContainer, ctx) => {
// 在这里编辑回调函数
// currentContainer 是当前组件实例,可以调用组件暴露出来的方法
// ctx 是页面上下文,可以获取所有组件实例
const {DataGridEdit_EfPF9, DataGrid_4yJI9 } = ctx;
var selectRows = DataGridEdit_EfPF9.tableData();
if(DataGrid_4yJI9) {
console.log('当前选中数据', DataGrid_4yJI9.getSelectRows(), DataGrid_4yJI9.getSelectRowKeys());
}
let keys = (selectRows||[]).map(item => item.id);
if(DataGrid_4yJI9.getSelectRows() && !DataGrid_4yJI9.getSelectRows().length) {
DataGrid_4yJI9.setSelectedRowKeys(keys);
}
}
选中数据,点击保存按钮:
参考代码:
Promise.resolve().then(()=>{
if(DataView_Oxzr1){
// 前一个页面可编辑表格数据
const historyData = DataGridEdit_EfPF9.tableData();
const currentData = DataGrid_4yJI9.getSelectRows();
const currentDataKeys = DataGrid_4yJI9.getSelectRowKeys() || [];
// 去重数据合并过滤数据
const mergeData = [...historyData, ...(currentData || []).filter((item) => item && !historyData.some((item1) => item1 && item1.id == item.id))].filter((data) => {
return data && currentDataKeys.includes(data.id)
});
console.log('currentData', mergeData);
// 填充数据视图的可编辑表格数据
DataView_Oxzr1.setFormModel('knowledgeList',mergeData);
}
CLOSEPAGE();
})
参考视频:
检索容器
检索入参/日期
{
applyStartTime: FilterContainer_oYbqA.getSearchData().applyTime[0], /*日期起始时间*/
applyEndTime: FilterContainer_oYbqA.getSearchData().applyTime[1], /* 日期截止时间*/
applyStatus: FilterContainer_oYbqA.getSearchData().applyStatus, /*其他检索字段*/
pageSize: DataGrid_O0hDU.pageSize(), /*表格pageSize*/*/
pageNum: DataGrid_O0hDU.pageNumber(), /*表格pageNumber
}
检索入参/未选择日期
JSON.stringify(FilterContainer_oYbqA.getSearchData().applyTime) != undefined ? {
applyStartTime: FilterContainer_oYbqA.getSearchData().applyTime[0],
applyEndTime: FilterContainer_oYbqA.getSearchData().applyTime[1],
applyStatus: FilterContainer_oYbqA.getSearchData().applyStatus,
pageSize:DataGrid_O0hDU.pageSize(),
pageNum:DataGrid_O0hDU.pageNumber(),
} : {
applyStatus: FilterContainer_oYbqA.getSearchData().applyStatus,
pageSize:DataGrid_O0hDU.pageSize(),
pageNum:DataGrid_O0hDU.pageNumber(),
}
登录组件
登录按钮/ login
校验-登录-SAVETOKEN
/* 1. 表单校验 */
EditableLogin_WczEM.validate().then(() => {
/* 2. 校验成功之后调用登录接口连接器 */
API_externalLogin.request({
/*入参 账号 密码 验证码等*/
"username":EditableLogin_WczEM.getFormModel().count,
"password": EditableLogin_WczEM.getFormModel().passWord,
"code" : EditableLogin_WczEM.getFormModel().code,
"uuid" : DataView_aWLID.getFormModel().uuid
}).then(res => {
/*4. 登录接口调用回调处理 失败 提醒失败信息 */
if(res.error || (res.status == 400)) {
MESSAGE({
type: 'warning',
content: res.message
});
/*刷新验证码 */
DataView_aWLID.reload()
} else {
/* 3. 成功之后调用 SAVETOKEN()方法,这一步不可缺少! */
SAVETOKEN(res.data)
}
})
})
按钮
按钮提交表单-关闭弹窗-刷新外层表格
API_xinzengguize.request(Object.assign(DataView_nGAwv.getFormModel(), {
"conditionVoList": (DataGridEdit_QLGiR.tableData() || []).map((item1) => item1.editValueRefs)
})).then(res => {
/* 在这里回调*/
CLOSEPAGE(); /* 关闭弹窗 */
DataGrid_Q8k2A.reload(); /* 刷新表格 */
})
图片
接口获取到 url 转换成平台内置图片格式 参数修剪
async (response) => {
let newData = response.data || {};
let imgUrls= newData.imgUrls
? newData.imgUrls.split(',').map((d) => {
return {
url: d
}
}) : []; /*服务器返回多个图片 转成成平台内置多个图片格式 */
let nodes = newData.signerNotes || [];
let signerNotes = nodes.map((d) => {
return {
signerContent: d
}
});
let imgUrl = JSON.stringify([{
url: newData.imgUrl || ''
}]); /*服务器url图片 转成平台内置的图片格式 */
return {
...newData,
imgUrl,
imgUrls
}
}
参数修剪插件
前置插件【时间区间修剪成开始时间和结束时间】
注意:如果连接器统一在插件处理就不需要在数据容器入参那里处理
async ({ prevData, utils }) => {
// 插件添加到连接器接口中,连接器接口执行步骤:调试参数/组件入参 -> 参数修剪 -> 前置插件 -> 发送api -> 后置插件 -> 响应修剪 -> 调试接收/组件接收
// 该插件接收prevData 和 utils,返回自定义
/**
* prevData来自上一个步骤的返回,可打印查看详情
* 如果为前置插件,应包含如下字段:
* query: Object; // http query
* body: Object; // http body
* header: Object; // http request header
* 如果为后置插件,应包含如下字段:
* requestBody: string; // 业务api返回的请求体
* requestHeader: Object; // 业务api返回的请求头
* requestMethod: string; // 业务api返回的请求方法
* requestUrl: string; // 业务api返回的请求地址
* responseBody: string; // 业务api返回的响应体
* responseHeader: Object; // 业务api返回的响应头
* responseStatusCode: number; // 业务api返回的响应状态码
* response: ; // 业务api返回的响应体被JSON解析:JSON.parse(responseBody)
* requestInfo: Object; // 业务api请求的payload:env(调试环境)、apiInfoId、httpApiCode、query、body、header
* utils为平台提供的工具函数:
* triggerHttpApi(apiParam) 调用连接器接口执行api,apiParam和prevData.requestInfo一致,返回api调用结果
* triggerHttpApiWithStep(connectorCode, apiCode, query, body, header) 调用连接器接口执行api,包括接口的参数修剪、响应修剪、插件的步骤。返回插件和修剪处理过的api调用结果
* getContextAuthorization() 返回平台的http request authorization
**/
// 这里的get请求获取参数是prevData.query post请求需要获取prevData.body
let times = { ...(prevData.query || {}) }; // 检索日期区间
let startTime = times?.operateTime && times?.operateTime?.length ? times?.operateTime[0] : '';// 开始时间
let endTime = times?.operateTime && times?.operateTime?.length ? times?.operateTime[1] : ''; // 结束时间
let queryN = {...prevData.query}; // 转换后的参数
delete queryN.operateTime; // 删除原始的时间区间
prevData.query = {
...queryN,
startTime,
endTime
}
return prevData;
}
后置插件【带分页的响应修剪】
async ({ prevData, utils }) => {
// 插件添加到连接器接口中,连接器接口执行步骤:调试参数/组件入参 -> 参数修剪 -> 前置插件 -> 发送api -> 后置插件 -> 响应修剪 -> 调试接收/组件接收
// 该插件接收prevData 和 utils,返回自定义
/**
* prevData来自上一个步骤的返回,可打印查看详情
* 如果为前置插件,应包含如下字段:
* query: Object; // http query
* body: Object; // http body
* header: Object; // http request header
* 如果为后置插件,应包含如下字段:
* requestBody: string; // 业务api返回的请求体
* requestHeader: Object; // 业务api返回的请求头
* requestMethod: string; // 业务api返回的请求方法
* requestUrl: string; // 业务api返回的请求地址
* responseBody: string; // 业务api返回的响应体
* responseHeader: Object; // 业务api返回的响应头
* responseStatusCode: number; // 业务api返回的响应状态码
* response: ; // 业务api返回的响应体被JSON解析:JSON.parse(responseBody)
* requestInfo: Object; // 业务api请求的payload:env(调试环境)、apiInfoId、httpApiCode、query、body、header
* utils为平台提供的工具函数:
* triggerHttpApi(apiParam) 调用连接器接口执行api,apiParam和prevData.requestInfo一致,返回api调用结果
* triggerHttpApiWithStep(connectorCode, apiCode, query, body, header) 调用连接器接口执行api,包括接口的参数修剪、响应修剪、插件的步骤。返回插件和修剪处理过的api调用结果
* getContextAuthorization() 返回平台的http request authorization
**/
// 这里code 为200 是平台的成功的返回 为500就是错误的返回
if (prevData?.response?.code === 200) { // 平台内部的分页结构return{total:总页数,actionResult:数据list}
return {
total: prevData?.response?.data?.totalSize,
actionResult: prevData?.response?.data?.data
}
} else if (prevData?.response?.code === -1) { // 根据项目需求是否需要 当登录为定制化外部登录的时候 code=-1是token失效 需要跳转到登录页
window.location.href = window.location.origin + '/extra/device-wjl/login#/'
} else { // 这里是判断code为其他的时候 需要弹框错误提示 这里也可以根据项目需求自定义成功提示信息和失败提示信息
return {
code: prevData?.response?.code == 1 ? 200 : 500,
successMessage: prevData?.response?.msg,
errorMessage: prevData?.response?.msg
}
}
}
后置插件【详情页的响应修剪】
async ({ prevData, utils }) => {
// 插件添加到连接器接口中,连接器接口执行步骤:调试参数/组件入参 -> 参数修剪 -> 前置插件 -> 发送api -> 后置插件 -> 响应修剪 -> 调试接收/组件接收
// 该插件接收prevData 和 utils,返回自定义
/**
* prevData来自上一个步骤的返回,可打印查看详情
* 如果为前置插件,应包含如下字段:
* query: Object; // http query
* body: Object; // http body
* header: Object; // http request header
* 如果为后置插件,应包含如下字段:
* requestBody: string; // 业务api返回的请求体
* requestHeader: Object; // 业务api返回的请求头
* requestMethod: string; // 业务api返回的请求方法
* requestUrl: string; // 业务api返回的请求地址
* responseBody: string; // 业务api返回的响应体
* responseHeader: Object; // 业务api返回的响应头
* responseStatusCode: number; // 业务api返回的响应状态码
* response: ; // 业务api返回的响应体被JSON解析:JSON.parse(responseBody)
* requestInfo: Object; // 业务api请求的payload:env(调试环境)、apiInfoId、httpApiCode、query、body、header
* utils为平台提供的工具函数:
* triggerHttpApi(apiParam) 调用连接器接口执行api,apiParam和prevData.requestInfo一致,返回api调用结果
* triggerHttpApiWithStep(connectorCode, apiCode, query, body, header) 调用连接器接口执行api,包括接口的参数修剪、响应修剪、插件的步骤。返回插件和修剪处理过的api调用结果
* getContextAuthorization() 返回平台的http request authorization
**/
// 这里code 为200 是平台的成功的返回 为500就是错误的返回
if (prevData?.response?.code === 200) { // 平台内部详情直接返回data对象数据
return prevData?.response?.data
} else if (prevData?.response?.code === -1) { // 根据项目需求是否需要 当登录为定制化外部登录的时候 code=-1是token失效 需要跳转到登录页
window.location.href = window.location.origin + '/extra/device-wjl/login#/'
} else { // 这里是判断code为其他的时候 需要弹框错误提示 这里也可以根据项目需求自定义成功提示信息和失败提示信息
return {
code: prevData?.response?.code == 1 ? 200 : 500,
successMessage: prevData?.response?.msg,
errorMessage: prevData?.response?.msg
}
}
}