- 低代码时代的呼叫中心(一)
- 低代码时代的呼叫中心(二)
- 低代码时代的呼叫中心(三)
- 低代码时代的呼叫中心(四)
- 低代码时代的呼叫中心(五)
- 低代码时代的呼叫中心(六)
- 低代码时代的呼叫中心(七)
- 低代码时代的呼叫中心(八)
- 低代码时代的呼叫中心(九)
1、页面的属性设置
属性编辑是低代码平台最常用的功能之一。属性面板位于右侧边栏的下部,与“事件”、“样式”组成多标签页。
![](http://www.ctiforum.com/uploadfile/2021/1111/20211111093136131.jpg)
1)值编辑
在属性面板中,根据属性值类型不同,采用不同的值编辑方式。下面逐一介绍这些值编辑方式。
A、文本
文本类型的属性是最常用的。如果属性是文本类型,则用文本框编辑属性的值。例如:
![](http://www.ctiforum.com/uploadfile/2021/1111/20211111093201392.jpg)
B、数字
数字类型的属性使用数字编辑框编辑。例如:
![](http://www.ctiforum.com/uploadfile/2021/1111/20211111093217315.jpg)
C、枚举
有些属性的值需要从固定的列表中选择。这类属性用下拉框编辑。下拉列表可以是固定的,也可以是从服务端加载的。这取决于控件。例如:
![](http://www.ctiforum.com/uploadfile/2021/1111/20211111093302681.jpg)
D、尺寸
对于尺寸类型的属性,使用特殊的尺寸编辑框。尺寸可以分为两类:像素、百分百。在尺寸编辑器中可以选择。某些控件属性只接收一种类型,另一种类型是禁用的。
![](http://www.ctiforum.com/uploadfile/2021/1111/20211111093510713.jpg)
E、布尔
布尔类型的属性,使用滑块按钮编辑。按钮灰色表示“false”,按钮蓝色表示“true”。
![](http://www.ctiforum.com/uploadfile/2021/1111/20211111093321843.jpg)
F、表达式
表达式类型的属性值比较特殊。表达式是javascript格式的语句。根据属性的不同,要求的表达式结果也不同。比如“是否显示”属性,要求表达式执行结果是布尔值。
写表达式的时候一定要注意,表达式内的值一定要符合javascript规范,否则会导致表达式异常,从而使页面加载失败。比如字符串、日期时间要用英文单引号括起来的。
表达式中允许引用页面定义的数据项。引用这些数据项时,要加this。限定符。例如页面内定义了一个名为“strval”的数据项,下面的表达式判断strval的值等于'hello'时,才显示控件。
![](http://www.ctiforum.com/uploadfile/2021/1111/20211111093537117.jpg)
G、数据项绑定
在低代码平台中,表单类的控件需要绑定数据项才能使用。这些控件的值是存储在绑定的数据项中的。当控件拖入页面时,平台会自动为控件创建数据项,并绑定。有时候,我们需要改变一个控件的数据项绑定。例如两个控件绑定同一个数据项。这时候就需要手动修改数据项绑定。
数据项绑定属性的编辑器是一个下拉框。下拉框中以树状结构显示页面内所有数据项。包括普通变量、计算值、页面的参数等。
![](http://www.ctiforum.com/uploadfile/2021/1111/20211111093559424.jpg)
H、图标
某些控件有图标类型的属性。例如按钮控件,允许设置按钮图标。图标属性使用特殊的图标编辑器修改。图标属性编辑器是一个文本框,右侧有一个按钮()。点击这个按钮会弹出图标选择对话框。在这个对话框中选择图标。
![](http://www.ctiforum.com/uploadfile/2021/1111/20211111093618553.jpg)
I、键值对
键值对类型的属性值,是JSON的数组结构。数组每个元素都是一个JSON对象,至少有键和值两个元素。键和值的具体名称,根据不同控件,有所不同。有些控件中,这两个名称是可配置的。
JSON结构允许多层,即每个数组元素还可以有自己的下层数组。这根据控件属性的要求而定。
典型的键值对属性,是下拉框的选项数据。下拉框的选项数据中的键和值名称是可配置的。分别在值字段(选项数据中的键)、文本字段(选项数据中的值)属性中配置。
![](http://www.ctiforum.com/uploadfile/2021/1111/20211111093639427.jpg)
点击键值对编辑框右侧的编辑按钮““,可以打开键值对编辑对话框。在对话框中,用可视化方式编辑键值对数据。也可以直接编辑JSON数据。对话框右上角有使用帮助。
![](http://www.ctiforum.com/uploadfile/2021/1111/20211111093658203.jpg)
2)运行时属性
一般情况下,都是在属性面板中,静态编辑属性的。如果希望在页面运行时,使用脚本来实时改变属性值。可以将属性做运行时绑定。
不是所有属性都支持运行时绑定。只有部分属性支持运行时绑定。例如文本框控件的标签、后缀标签、占位文本、选项数据等属性支持运行时绑定。按钮的按钮文本支持运行时绑定。支持运行时绑定的属性,在属性编辑框右侧有一个绑定按钮”“。
A、绑定
将属性做运行时绑定的方法,是在属性编辑器中,点击属性后端的绑定按钮。如下图。
![](http://www.ctiforum.com/uploadfile/2021/1111/20211111093724457.jpg)
当属性没有绑定为运行时数据项时,会显示蓝色的()按钮。点击后,弹出确认框。点击确定后,就绑定了运行时数据项。同时,按钮变为红色的()按钮。
B、取消绑定
点击红色的取消绑定按钮,就取消了属性的运行时绑定。
![](http://www.ctiforum.com/uploadfile/2021/1111/20211111093746414.jpg)
C、查看绑定
所有已经绑定的运行时属性,都可以在数据项面板中查看。
![](http://www.ctiforum.com/uploadfile/2021/1111/20211111093805670.jpg)
D、初始值
已经绑定的运行时属性,属性编辑器中设置的值作为属性的初始值。
![](http://www.ctiforum.com/uploadfile/2021/1111/20211111093821470.jpg)
D、使用
在脚本编辑器中,通过”this。rt['控件ID']['属性']“格式可以读写运行时属性。同时,脚本编辑器也提供了自动补全的辅助功能。
![](http://www.ctiforum.com/uploadfile/2021/1111/20211111093838481.jpg)
![](http://www.ctiforum.com/uploadfile/2021/1111/20211111093854620.jpg)
2、事件和脚本
低代码平台通过事件和脚本来完成业务功能。例如,当点击按钮时,会触发按钮点击事件。从而执行编写好的处理脚本,完成所需要的功能。
1)事件
事件面板在右侧边栏的下部。当选中一个控件后,事件面板中列出这个控件的所有事件。
![](http://www.ctiforum.com/uploadfile/2021/1111/20211111093922513.jpg)
双击某个事件,或点击这个事件右侧的编辑按钮”“,就可以切换到事件脚本编辑界面。在脚本编辑区域,可以编辑事件的脚本。
2)脚本
在工具栏右侧按钮中,点击”脚本“按钮,可以切换到脚本视图。在脚本视图中,可以检索、编辑脚本,还可以添加自定义的方法。
脚本视图分为两部分:方法导航和编辑区。
方法导航中可以添加方法、删除方法、检索方法。这里列出的方法包括事件处理方法和自定义方法。检索方法使用的条件可以是方法名、事件名、事件名拼音或拼音缩写、控件ID、控件类型、控件类型拼音或拼音缩写、方法内容。方法列表的顶部是”所有方法视图“。点击这个视图,可以在编辑器显示所有方法的内容,但是不能编辑。
编辑区内可以编辑方法内容。编辑内容的时候,会有智能提示辅助功能。
![](http://www.ctiforum.com/uploadfile/2021/1111/20211111093947379.jpg)
U-Agent低代码平台是一款基于Web的快速业务实现平台。使用U-Agent低代码平台配合U-Agent强大的平台基础能力,可以快速实现客户的业务页面。在U-Agent低代码
3、样式
低代码平台的样式面板,在右侧边栏的下方,与”属性“、”事件“组成多标签页。
![](http://www.ctiforum.com/uploadfile/2021/1111/20211111094007169.jpg)
低代码平台提供两种样式编辑方式:可视化方式和CSS方式。
一般情况下,可以使用可视化方式编辑样式,简单方便。可视化方式支持背景色、边框、字体大小、字体颜色、字体样式、对齐方式、布局的编辑。可视化编辑视图的顶部,显示当前正在编辑的控件或控件内元素。
![](http://www.ctiforum.com/uploadfile/2021/1111/20211111094025741.jpg)
某些情况下,需要修改可视化方式以外的样式。或者对样式做更高级的定制。这种情况下可以直接编辑CSS内容。点击样式面板右上角的切换按钮”“““就可以在可视化和CSS方式之间切换。
![](http://www.ctiforum.com/uploadfile/2021/1111/20211111094046266.jpg)
4、数据服务
低代码平台用数据服务提供数据的访问功能。通过编写SQL语句的方式访问数据。SQL语句在开发阶段编写。语句内可以提供参数。运行时前后端交互中,没有SQL语句,前端只向服务端传递数据服务名和参数。避免了安全问题。同时,参数是预先编译的,避免了SQL注入问题。
低代码平台将页面内数据服务,封装为数据对象(页面内的数据项)。从而简化使用数据服务时的工作。使用数据服务对象有以下优点:
1)简化脚本代码。一般情况下,使用数据服务对象不需要在then和catch中处理数据服务的返回和异常。数据服务对象将这些都做了封装。包括参数取值、返回结果赋值给数据项、结果到控件的显示、异常处理、日志记录、消息提示等。
2)脚本更灵活。如果在某种情况下确实需要对结果进行处理,也可以使用then来实现。处理更加灵活。
3)简化控件使用。常用控件对数据服务对象进行了适配,能够自动处理数据服务对象的返回结果。
![](http://www.ctiforum.com/uploadfile/2021/1111/20211111094140637.jpg)
数据服务的测试如下图:
![](http://www.ctiforum.com/uploadfile/2021/1111/20211111094201184.jpg)
查询数据的操作如下图:
![](http://www.ctiforum.com/uploadfile/2021/1111/20211111094213830.jpg)
在”界面“视图,选中”查询“按钮。在右侧的”事件“面板,双击”点击“事件,为按钮添加事件代码。
在点击事件的代码中,输入”this。ds$。“,会提示刚才添加的数据服务。如下图:
![](http://www.ctiforum.com/uploadfile/2021/1111/20211111094224563.jpg)
![](http://www.ctiforum.com/uploadfile/2021/1012/20211012091655920.jpg)
邮箱:huanghe@utry.cn
电话:18600895885
电话:18600895885