检测到您已登录华为云国际站账号,为了您更好的体验,建议您访问国际站服务网站 https://www.huaweicloud.com/intl/zh-cn
不再显示此消息
当用户开发的高级页面应用于多种设备时,如何才能保证在不同大小的设备上,能够呈现同样的网页?为此,AstroZero提供了高级页面的电脑端和移动端两种终端视图、流式布局的响应式布局,并为绝对布局提供“拉伸”功能辅助自适应。另外,为确保自定义组件能够自适应不同分辨率设备,在组件开发中用户需要
组装“编辑设备”页面 组装页面包括拼装页面组件、定义组件的事件代码,并通过公共接口调用“编辑设备”脚本。 页面分析 如果要实现将前端页面上输入的设备信息保存到数据库中,需要创建与前端组件绑定的自定义模型,以及与后端逻辑关联的服务模型,如图2所示。 图1 编辑设备页面预览 页面上包
创建“查询设备”脚本 管理设备页面中,实现输入设备的信息,查询出对应设备的全部信息功能,需要开发“查询设备”脚本和服务编排。 操作步骤 进入创建“设备维修管理系统”应用中创建的应用。 在“Equipment”目录中,将鼠标放在“Script”上,单击界面上出现的,在弹出菜单中选择“脚本”。
创建“查询设备”服务编排 “查询设备”脚本创建完成后,创建一个“服务编排”,并在服务编排中引用脚本,改造和配置服务编排的输入输出参数,使其更适用于前端页面调用。 操作步骤 进入创建“设备维修管理系统”应用中创建的应用。 在“Equipment”目录中,将鼠标放在“Flow”上,单
再配置相关参数,来实现登录功能。 操作步骤 创建高级页面。 进入AstroZero经典版开发环境首页,在“项目 > 我的应用”中,单击“设备维修管理系统”,进入应用。 单击,进入工作目录。 在“User”目录下,将鼠标放在“Page”上,单击界面上出现的“+”,在弹出菜单中选择“高级页面”。
开发“管理设备”功能 背景及原理(服务编排) 创建业务逻辑 组装“设备管理”页面 父主题: 设备管理开发
创建“查询设备列表”脚本 查询设备列表脚本是为了实现将查询的所有设备并以选项列表的形式返回,并通过页面调用将查询结果展示到页面上,此脚本将会在开发“生成工单”功能章节被调用。 操作步骤 进入创建“设备维修管理系统”应用中创建的应用。 在“Equipment”目录中,将鼠标放在“S
创建“编辑设备”脚本 “编辑设备”脚本实现的功能是向设备对象中插入1条新记录,或者更新1条记录。 操作步骤 进入创建“设备维修管理系统”应用中创建的应用。 在“Equipment”目录中,将鼠标放在“Script”上,单击界面上出现的“+”,在弹出菜单中选择“脚本”。 在弹窗中,
实现工单在客服人员、派单人员、维修人员之间流转过程,如图1。 图1 工单流转大致流程 电梯客服人员受理用户投诉,并创建维修工单。 派单人员收到客服人员的维修工单后,派发给维修工程师。 维修工程师进行现场修理,并在处理完成后关闭维修单。 父主题: 工单管理开发
创建业务逻辑 “编辑设备”功能主要通过调用并执行一个具有“编辑设备”功能的脚本,实现编辑设备信息功能,并在修改设备信息时,能够根据设备id号,直接修改设备信息,因此需要在开发页面前,先创建一个“编辑设备”和“按ID查询设备详情”脚本。 创建“编辑设备”脚本 创建“按ID查询设备详情”脚本 创建公共服务接口
在应用中,单击下方“服务”,进入公共接口创建页面。 图1 创建公共接口入口 单击“新建”,进入新建公共接口页面。 图2 公共接口创建 创建“编辑设备”脚本“HW__editEquipment”的公共接口。 设置接口参数信息,设置标签和操作名称为“editEquipment”,版本为“1
业务数据的增、删、改、查等基础功能。 标准页面主要是通过对前端页面组件的组合编排,以及为组件配置属性、关联事件实现业务功能的,在组装“编辑设备”页面章节,则会详细介绍组件、组件属性以及事件之间的调用及相关配置。 标准页面的编辑环境也称为UI Builder,UI Builder是
在输入查询条件后,查询设备 HW__queryEquipments queryEquipments HW__deleteEquipment 删除设备 不涉及 deleteEquipment HW__equipmentSelectListQuery 查询所有设备并以选项列表的形式返回
有编辑设备功能的脚本,实现编辑设备信息功能。在进行开发前,您需要先了解脚本、公共接口以及标准页面的相关知识。 学习地图 如图1所示,通过本章的学习和实践,您将了解“标准页面”的能力,并掌握脚本的开发方法。 图1 学习地图 脚本 公共接口 标准页面 父主题: 开发“编辑设备”功能
脚本 对应相对复杂的业务逻辑,AstroZero提供了脚本、服务编排等后台逻辑形式。本章节主要带您了解脚本的基础知识。 AstroZero的脚本引擎采用TypeScript语言。脚本执行时,TypeScript语言会被翻译成JavaScript语言,由JavaScript引擎执行。在JavaScript
创建业务逻辑 创建“查询设备”脚本 创建“查询设备”服务编排 创建“删除设备”脚本 创建“查询设备列表”脚本 创建公共接口 父主题: 开发“管理设备”功能
”,在移动端的布局形式,如图12所示。当在“PC”选择左到右三个“栏”的布局形式时,移动端的屏幕较小,仍然选择从左到右布局可能导致页面元素显示不全或变形,这时可以在“phone”中选择在移动端下“栏”转换为从上到下排列,此时单击页面上方的“全屏”,手机图标就可以模拟在移动端展示的效果,如图15。
公共接口 公共接口是对脚本、服务编排和对象进行再包装的一种方式。将创建的脚本、服务编排、对象包装成一个新公共服务,可以使得接口的URL地址的表达形式更规范,方便让前端页面或第三方系统进行调用。 因此,在创建完后台逻辑后(服务编排、脚本、对象),就需要先将此接口包装成标准的公共接口
在应用菜单中,选择“设备管理”,在设备管理页面中,单击“新增设备”,在“设备详情”页,设置需要新增的设备信息,然后单击“保存”。 图1 设备管理 图2 设置设备详细 设备保存后,返回到设备管理页面,查看设备列表中是否已存在上一步添加的设备。 选择一条设备记录,单击“操作”中的“编
可,脚本则不需要重复创建。 操作步骤 进入创建“设备维修管理系统”应用中创建的应用。 单击页面下方的“服务”,进入公共接口创建页面。 图1 创建公共接口入口 单击“新建”,进入公共接口创建页面。 图2 公共接口创建 创建“删除设备”脚本对应的“HW__deleteEquipment”的公共接口。