华为云用户手册

如何使用Native服务图元 在Native服务中，拖拽所需的Native服务图元至画布中。 选中Native服务图元，单击，设置基本信息。 表1 基本信息参数说明 参数 参数说明 标签 图元的标签，用于在页面显示。系统会自动填入该值，格式为原生服务名+序号。序号从“0”开始，表示同类型图元序号。 名称 图元的标识，请确保在当前服务编排中唯一。 描述 图元的描述信息。 单击，在“Native服务”页面进行配置。 图2 配置Native服务图元 表2 Native服务图元配置参数说明 参数 参数说明 操作方法 原生服务中已自定义好的API接口。 入参/目标 当选择具体操作方法（API）后，API的输入参数将会显示在入参的目标列。 入参/源 服务编排中的变量，需要和目标的参数类型保持一致。该源会将服务编排中的变量，赋值给调用API的输入参数。 出参/源 当选择具体操作方法（API）后，API的输入参数将会显示在出参的源列。 出参/目标 服务编排中的变量，需要和输出参数的类型保持一致。将API中的输出参数赋值给服务编排中的变量，供服务编排中使用。

标准库模块 低代码平台中有些模块会被编译成二进制，预先加载到内存中。例如，decimal、context都是系统预置的标准库模块。 在低代码平台中，会优先加载标准库模块， 例如： import * as http from 'http'; 始终返回内置的HTTP模块，即使有同名自定义模块。如果需要返回自定义的模块，请使用相对路径语法： import * as http from './http';

循环依赖 当循环调用模块时，一个模块可能在未完成执行时被返回。因此，需要仔细地规划模块间调用，以允许循环模块依赖在应用程序内正常工作。 例如，脚本a： console.log('a 开始');exports.done = false;import * as b from 'b';console.log('在 a 中，b.done = ', b.done);exports.done = true;console.log('a 结束'); 脚本b： console.log('b 开始');exports.done = false;import * as a from 'a';console.log('在 b 中，a.done = ', a.done);exports.done = true;console.log('b 结束'); 脚本main： console.log('main 开始');import * as a from 'a';import * as b from 'b';console.log('在 main 中，a.done = ', a.done '，b.done = ', b.done); 当main加载a时，a又加载b。 此时，b又会尝试去加载a。 为了防止无限的循环，会返回一个a的exports对象的未完成的副本给b模块。然后b完成加载，并将exports对象提供给a模块。当main加载这两个模块时，它们都已完成加载，因此该程序的输出会是： main 开始a 开始b 开始在 b 中，a.done = falseb 结束在 a 中，b.done = truea 结束在 main 中，a.done=true，b.done=true

如何使用脚本图元 在基本中，拖拽“脚本”图元到右侧画布中。 选中画布中的脚本图元，单击，设置基本信息。 表1 基本信息参数说明 参数 参数说明 标签 脚本图元的名称，用于在页面显示。系统会自动填入该值，格式为Script序号，序号从“0”开始，表示同类型图元序号。 名称 图元的标识，请确保在当前服务编排中唯一。 描述 图元的描述信息。 单击，选择脚本、设置输入参数和输出参数。 图1 配置脚本 表2 脚本图元配置参数说明 参数 参数说明 脚本 调用的脚本名称，只有在启用状态下的脚本才能被服务编排调用。 输入参数/目标 脚本的输入参数名称。 单击“新增行”，在下拉框中选择脚本输入参数的名称。 输入参数/源 服务编排中的变量，为目标赋值。 可直接填写，也可以拖入全局上下文变量，将服务编排中的变量赋值给脚本中的输入参数。 输出参数/源 脚本的输出参数名称。 单击“新增行”，在下拉框中选择脚本输出参数的名称。 输出参数/目标 服务编排中的变量，脚本中的输出参数赋值给服务编排中的变量。 拖入全局上下文变量，将脚本的输出参数赋值给服务编排中的变量。

属性 在属性中，设置雷达图组件的位置、边框、背景等。 图2 属性 基础 组件标题：设置组件的标题。 组件名称：设置组件的名称。 位置 距离左端：组件到页面左侧的距离，单位为px。 距离顶端：组件到页面顶部的距离，单位为px。 宽度：组件的宽度，单位为px。 高度：组件的高度，单位为px。 堆叠顺序：设置组件层叠显示顺序。组件的堆叠顺序默认都是“1”，数字越大，显示越靠前。当需要让组件置底时，可设置堆叠顺序为“0”。 自适应高度：组件的高度是否随宽度改变。 边框：设置组件的边框样式，如全边框或角边框。 背景 样式：设置背景的样式，如普通、居中、拉伸等。 图片链接：背景图片URL。 颜色：设置背景的颜色。

扩展名 因为脚本实际上是存在数据库中的，所以脚本没有路径的概念，扩展名也没有特别的意义。 导入模块时，尽量采用不带扩展的方式。 import * as circle from './circle'; 平台只允许“.ts”扩展名文件存在，不允许包含“.js”后缀的模块，请尽量不要使用待扩展名的导入方式。如下方式等同上面的举例，但不推荐。 import * as circle from './circle.ts';

开发流程 开发Native Service前，请先了解整个Native Service的开发流程。 图1 流程图 创建Native Service AstroZero平台提供了创建原生服务工程的能力，原生服务工程本质上起到一种桥接的作用，用于将原生服务的API集成到AstroZero，使得运行于AstroZero之上的应用，更容易地使用原生服务的API。 配置Chart 通过AstroZero提供的图形化界面，配置部署Docker容器时需要的资源、存储和网络等一系列参数。配置后，生成Chart包并进行导出。导出后，可通过云容器引擎（Cloud Container Engine，简称CCE），在其他平台上部署安装Docker容器。 配置API 原生服务旨在帮助您在AstroZero平台上或外部系统，调用已开发好的服务。为了完成调用，需要知道服务开放了哪些接口，以及这些接口的请求参数、返回参数，完成设计API后，可在服务编排中进行调用，也可将API再封装为自定义公共接口，供外部系统调用自定义公共接口。 部署Native Service 配置完API后，还需要部署才可使用Native Service。请使用此前设计的Chart包，在CCE上完成服务的部署。 管理Native Service 部署Native Service后，您可以通过CCE控制台对其执行升级、查看日志、监控、伸缩、回退、删除等操作。 注册Native Service 注册Native Service后，才可以在AstroZero的其他组件内（如脚本、服务编排等）调用原生服务的接口，也可将该原生服务开放给第三方系统进行访问。 在服务编排或脚本中调用原生服务 Native Service部署成功且在AstroZero中接入服务实例后，系统会把在Native Service中配置的API接口生成相应的restaction。在服务编排中，可进行调用该restaction。 自定义公共接口 使用公共接口，可以将原生服务API发布到外部网关，第三方系统可以通过OAuth2.0调用AstroZero上的原生服务。 导出Native Service包给其他用户使用 当服务编排中，可以成功调用原生服务后，说明整个流程已经测通。此时，可以导出Native Service包给其他用户，其他用户可以在沙箱环境或者运行环境中安装该包，以便于使用该软件或进行定制。 父主题： 如何创建原生服务

属性 在属性中，设置散点图组件的位置、边框、背景等。 图2 属性 基础 组件标题：设置组件的标题。 组件名称：设置组件的名称。 位置 距离左端：组件到页面左侧的距离，单位为px。 距离顶端：组件到页面顶部的距离，单位为px。 宽度：组件的宽度，单位为px。 高度：组件的高度，单位为px。 堆叠顺序：设置组件层叠显示顺序。组件的堆叠顺序默认都是“1”，数字越大，显示越靠前。当需要让组件置底时，可设置堆叠顺序为“0”。 自适应高度：组件的高度是否随宽度改变。 边框：设置组件的边框样式，如全边框或角边框。 背景 样式：设置背景的样式，如普通、居中、拉伸等。 图片链接：背景图片URL。 颜色：设置背景的颜色。

应用安装场景 应用开发编译发布成应用包后，可在开发环境、沙箱环境和运行环境中安装使用。应用包典型安装场景，有如下两种： 应用包的开发者租户，可以在当前租户的运行环境以及沙箱环境安装应用资产包，安装后进行测试或直接部署运行该应用。 其他租户可以在开发环境安装应用源码包，进行二次开发、参考或查看。在沙箱环境、运行环境中安装应用资产包，进行测试或直接部署运行该应用。 什么是源码包？与资产包有什么区别，详细介绍请参见导入导出应用源码包。

安装应用有哪些方式 AstroZero低代码平台提供了如何通过导入方式安装应用和如何在我的仓库安装应用两种应用安装方式，请根据实际操作场景，选择安装应用的方式。应用安装场景及对应的安装方式介绍，如表1所示。 表1 应用安装场景及方式 场景 应用包来源 安装方式 安装环境 用途 安装当前租户 我的仓库 我的仓库 沙箱、运行环境 测试、部署运行 线下获取的应用资产包 导入方式 沙箱、运行环境 测试、部署运行 安装其他租户的应用 线下获取的应用源码包/资产包 导入方式 开发环境 二次开发、参考或查看 说明： 导入应用源码包支持二次开发，导入资产包只支持查看。如何编译应用包，请参见导入导出应用源码包。 线下获取的应用资产包 导入方式 沙箱、运行环境 测试、部署运行

服务编排与模块间调用关系 服务编排将平台提供的部分功能模块进行了封装，并提供了平台其他模块调用服务编排的能力，下面介绍其他模块与服务编排是如何进行相互调用的。 脚本 在服务编排中可以通过配置脚本图元，选择当前应用中的脚本进行脚本的调用。 在脚本中可以通过引入sys库，然后执行sys.invokeFlow({Flow_Name})，进行服务编排的调用。其中，Flow_Name为服务编排的名称。 对象 在服务编排中，可以通过配置记录创建、查询、更新、删除图元，对当前应用中的对象记录进行增删改查的操作，详情请参考如何使用服务编排开发数据的增删改查。 标准页面 在标准页面的模型视图中新建服务模型，能够绑定服务编排，进行服务编排的调用。 BPM 在BPM中可以通过配置“调用服务编排”活动，选择相应的服务编排进行服务编排的调用。 API接口 在新建接口时选择资源类型为“服务编排”，并选择相应的服务编排，即可将服务编排绑定到服务接口上，通过API接口进行服务编排的调用。 BO 在服务编排中调用BO（BO是封装了完整的数据模型、业务逻辑、页面展现的软件单元）进行使用，详情请参考BO图元。 连接器 在服务编排中调用与第三方系统对接的接口，如对接短信发送、 云存储 、系统中已定义的Action等，详情请参考连接器图元。

在标准页面中与BPM交互 在标准页面的自定义事件中，内置了一些交互的API ： 获取变量：context.$bpm.loadVariables(): Promise 提交任务、流程： context.$bpm.submitTask(variables: {[key: string]: any}): Promise 修改变量： context.$bpm.putVariables(variables: {[key: string]: any}): Promise 图2 在标准页面的事件代码中与BPM交互

服务编排基本能力 拖拉拽式编排流程 以往的传统编程，需要进行变量的声明并编写相应逻辑代码进行服务的开发。使用服务编排进行服务开发，能够通过拖拉拽的方式，将配置项创建的变量以及服务编排中提供的各种功能进行编排，并以流程的方式将服务所要实现的功能展现出来。整个开发过程中无需进行代码的编写，简单快捷，并能够图形化展示服务的逻辑。 逻辑处理 服务编排中提供了逻辑处理的图形化元件，包括赋值、循环、跳出循环、决策和等待。通过这些图元能够实现基本的逻辑处理，并图形化展示，便于开发者理解，详情可参考操作步骤中对逻辑处理图元的使用。 对象处理 服务编排中提供了对象处理的图形化元件，包括记录创建、记录查询、记录更新和记录删除。通过这些图元能够对通过平台创建的自定义对象或标准对象进行相应的增、删、改、查操作，简化处理对象数据的流程，提高开发效率，详情可参考如何使用服务编排开发数据的增删改查中对象处理图元的使用。 服务单元组合脚本、原生服务、BO、第三方服务 服务编排中提供了服务单元组合的图形化元件，包括脚本、子服务编排、原生服务、BO和连接器。通过这些图元能够将平台中已开发完成的服务集成到服务编排中，并重新进行组合，快速扩展出更丰富的业务功能。

开启日志监控 选择以下任意一种方式，进入日志跟踪页面。 方式一：在AstroZero经典版应用设计器中，单击左下角的，进入日志跟踪页面。 图1 在App开发页面开启日志跟踪 方式二：在AstroZero经典版环境配置中，单击页面右下角的，进入日志跟踪页面。 图2 进入日志跟踪页面 单击，可以开启十分钟内的AstroZero的后台日志追踪。 如果需要停止跟踪，可单击，将停止追踪且不会获取日志文件。 图3 开启日志跟踪 表1 日志跟踪参数说明 参数 说明 日志级别 日志级别，取值说明如下： 会话级：只打印当前会话的日志。 租户级：打印租户所有会话的日志。 日志类型 日志类型，取值说明如下： 业务日志：输出业务相关的跟踪日志。 完整日志：输出业务日志，以及数据库、中间件等的详细日志，主要用于AstroZero问题定位。 下载日志文件。 单击下载，可下载日志文件。下载后会自动停止跟踪，日志格式为“时间|操作ID|业务部件|动作描述”。 单击，可从新窗口打开日志跟踪页面。 单击，可最小化显示日志跟踪页面。 单击最小化图标后，日志跟踪页面将会被隐藏。在AstroZero管理中心页面的右下角，可以看到日志跟踪剩余时间。单击该时间，将重新弹出日志跟踪页面。 图4 日志跟踪时间

是否可以多人编辑服务编排 当多人编辑已有服务编排时，为防止多人篡改，低代码平台提供了一套保护机制。假设，A用户打开X服务编排，编辑前单击锁定服务编排，A用户进行编辑，此时B用户也打开X服务编排，B用户的服务编排编辑器将自动进入锁定模式。 保持A用户对X流程的编辑设计权限。A用户编辑完成后，需要单击，进行解锁或者单击启用按钮进行自动解锁。 当A用户锁定X流程后，系统会只读模式锁定B用户对X流程的操作，B用户的服务编排编辑器页面会有提示“该资源已经由A用户锁定，点击此处强制获得编辑权”。B用户如果按照提示强制获得编辑权，A用户的X流程编辑器画面会自动锁定。 当多人编辑已有BPM、触发器、标准页面或状态机时，AstroZero提供的保护机制是相同的，后续不再分别介绍。 父主题： 服务编排

如何使用决策图元 在逻辑中，拖拽“决策”图元至画布中。 选中决策图元，单击，设置基本信息。 表1 基本信息参数说明 参数 参数说明 标签 图元的标签，用于在页面显示。系统会自动填入该值，格式为Decision序号，序号从“0”开始，表示同类型图元序号。 名称 该图元的标识，请确保在当前服务编排中唯一。 描述 该图元的描述信息。 单击，在“决策”页面进行配置。 图1 配置决策图元 表2 决策图元配置参数说明 参数 参数说明 可编辑的结果 所有的判断条件。 可通过单击“新增”，新增判断条件分支，界面右侧区域配置分支条件。 默认：默认输出，当其他所有条件均不满足情况下，进入该分支。 可视 当选择“可视”时，可配置分支的判断条件。单击“新增”，可新增判断条件，条件显示为“资源”、“比较符”、“值”。 资源：从全局上下文拖拽变量或者直接输入“{!变量名}”。 比较符：从下拉框中选择。 值：从全局上下文拖拽变量或者直接输入“{!变量名}”，也可以是常量。 公式 可采用公式设置该分支条件。 公式中的变量，可从全局上下文拖拽变量或者直接输入变量。 选择连接条件 当选择“可视”并设置多条判断条件时，需要设置选择连接条件“或”或者“且”。 或：表示满足多条判断条件的其中一条，便可进入该分支。 且：表示必须同时满足多条判断条件，才可进入该分支。

如何使用跳出循环图元 在逻辑中，拖拽“跳出循环”图元至画布中。 选中跳出循环图元，单击，设置基本信息。 表1 基本信息参数说明 参数 参数说明 标签 图元的标签，用于在页面显示。系统会自动填入该值，格式为Break序号，序号从“0”开始，表示同类型图元序号。 名称 该图元的标识，请确保在当前服务编排中唯一。 描述 该图元的描述信息。 单击，在“跳出循环”页面的“循环”下拉框中，选择当前服务编排中需要中断的循环。 图1 配置跳出循环图元

如何使用记录更新图元 在基本中，拖拽“记录更新”图元至画布中。 选中记录更新图元，单击，设置基本信息。 表1 基本信息参数说明 参数 参数说明 标签 图元的标签，用于页面显示。系统会自动填入该值，格式为RecordUpdate序号，序号从“0”开始，表示同类型图元序号。 名称 该图元的标识，请确保在当前服务编排中唯一。 描述 该图元的描述信息。 使用快速更新模式 是否启用快速更新模式。 若勾选该参数，表示为快速模式。 根据对象变量中的记录ID，将对象变量更新到数据库中。更新的值，来源于对象变量中的值。如果对象变量为数组，则根据对象变量中的记录ID，批量将对象变量数组更新到数据库中。 不勾选，表示为普通模式。 根据条件更新对象记录，需要配置修改记录对应的对象名，更新条件，更新的各个字段的值。 默认不勾选。 单击，在“记录更新”页面进行配置。 若上一步勾选“使用快速更新模式”，则需要指定一个预先定义的对象变量或者对象变量数组，并将该对象变量或对象变量数组拖拽到“变量”输入框中。即可根据对象变量中的记录ID，将对象变量更新到数据库中，更新的值来源于对象变量中的值。如下图所示，根据对象变量“Accountupdate”中的记录ID将对象变量中的值更新到数据库中。 图1 快速更新模式 表2 快速更新模式参数说明 参数 参数说明 变量 预先定义的对象变量或者对象变量数组。 根据对象变量中的记录ID，将对象变量更新到数据库中。更新的值来源于对象变量中的值。如果变量为对象数组，则根据对象变量中的记录ID，批量将对象变量数组更新到数据库中。 从全局上下文拖拽或直接输入对象变量/对象变量数组。 当前服务编排出现错误时回滚 当前服务编排出现错误时回滚到上一个流程。 默认为勾选。若无特殊要求，请不要更改设置。 若上一步未勾选“使用快速更新模式”，则需要指定对象并在条件中，设置指定对象部分字段的值。在赋值中，设置需要更新的目标字段及更新值，最后根据条件查找符合条件的对象记录，并将赋值中的值更新到数据库中。如下图所示，更新“Account”对象“name”为“Lily”的记录，将变量“var_record_id”值更新到“id”字段。 图2 普通更新模式 表3 普通更新模式参数说明 参数 参数说明 对象 更新的具体对象名。 当前服务编排出现错误时回滚 当前服务编排出现错误时，回滚到上一个流程。 默认为勾选。若无特殊要求，请不要更改设置。 条件 选中对象后，该条件区域“字段”列会出现该对象的字段。单击“新增行”，可设置更新数据的条件。 在“字段”中选择要进行判断的对象字段。 在“比较符”中选择相应的比较符 “值”则可从全局上下文拖拽变量或者直接输入“{!变量名}”。 赋值 选中对象后，该赋值区域“目标”列会出现该对象的字段。如果需要给多个字段赋值，则单击“新增行”，定义其他字段的值。 在“目标”中选择需要赋值的对象字段。 “源”则可从全局上下文拖拽变量或者直接输入“{!变量名}”。

操作步骤 进入数据调试页面。 方式一：在AstroZero经典版应用设计器中，单击左下角的，进入数据调试页面。 图1 从应用开发页面进入数据调试页面 方式二：在AstroZero经典版环境配置中，单击页面右下角的，进入数据调试页面。 图2 从环境配置页面进入数据调试页面 方式三：直接在浏览器中，输入“https://AstroZero 域名 /studio/console.html”，进入控制台页面进行数据调试。 控制台页面如图3所示，界面分为多个区域，展示不同的内容。 图3 控制台 区域1：数据调试控制台支持的所有操作。 对象管理：关于对象表的操作。 缓存管理：对AstroZero系统的缓存进行管理，主要是清理所有缓存或清理某个特定缓存的命令。 任务查询：对AstroZero的一些历史任务或表数据统计的可用命令展示。 搜索管理：展示Elasticsearch中的可搜索表或字段。 区域2：根据区域1的操作从而展示对应的内容。 单击区域1的“对象管理”，则会在区域2中展示该用户有权限看到的所有表。 单击区域1“缓存管理”，则会在区域2中展示管理缓存相关的命令。 单击区域1“任务查询”，则会在区域2中展示任务管理相关的命令。 单击区域1“搜索管理”，则会在区域2中展示搜索管理相关的命令，支持根据应用进行过滤，默认显示“全部”，即搜索所有应用数据。 区域3：展示命令的说明或提示文字。 单击区域2展示的命令时，会在该区域展示该命令的简单说明或展示一些提示文字。 区域4：操作按钮区域。 单击“执行”（快捷键为Ctrl + Enter），可执行用户在区域5输入的命令。或者选中区域5输入的某个命令，单击“执行选择项”进行执行。命令执行完成后，单击“清除”，可清除执行结果的展示。 区域5：命令输入区，用户可以在该区域进行表数据查询，支持多种表操作的SQL语句。 例如：在单击区域1的“对象管理”时，会在区域2展示所有对象表，单击某个表，便可复制该表名。用户在区域5输入命令时，可快速复制粘贴要查询的表名。且对于区域2展示的所有命令，可通过双击鼠标左键，可直接将命令展示在该区域，然后单击区域4“执行”，执行该命令，减少了用户手动输入命令的动作。 区域6：展示相关命令的执行结果。 区域7：展示系统的发行版本和发行时间。 区域8：记录用户在区域5成功执行的所有命令。 单击该区域的命令，可将选中的命令填充到区域5，单击区域4的“执行”按钮，便可执行该历史命令。 根据 “支持SQL语句列表”提示，输入SQL查询语句，执行查询。 对象管理中除了系统预置的标准对象、用户定制的自定义对象、视图对象和聚合对象，还有一种系统对象，即AstroZero各项系统功能模块所使用到的对象，如服务编排、脚本。此类对象一般无需关注，若需要定位问题可在数据调试控制台使用SQL语句进行查询。 图4 执行SQL语句查询

属性 在属性中，设置仪表盘组件的位置、边框、背景等。 图2 属性 基础 组件标题：设置组件的标题。 组件名称：设置组件的名称。 位置 距离左端：组件到页面左侧的距离，单位为px。 距离顶端：组件到页面顶部的距离，单位为px。 宽度：组件的宽度，单位为px。 高度：组件的高度，单位为px。 堆叠顺序：设置组件层叠显示顺序。组件的堆叠顺序默认都是“1”，数字越大，显示越靠前。当需要让组件置底时，可设置堆叠顺序为“0”。 自适应高度：组件的高度是否随宽度改变。 边框：设置组件的边框样式，如全边框或角边框。 背景 样式：设置背景的样式，如普通、居中、拉伸等。 图片链接：背景图片URL。 颜色：设置背景的颜色。

测试场景下创建证书和私钥的操作方法 该方法创建的证书通常只适用于测试场景。 执行如下命令生成密钥文件tls.key。 openssl genrsa -out tls.key 2048 命令执行后将在当前目录生成一个tls.key的私钥文件。 生成的密钥格式必须为： ----BEGIN RSA PRIVATE KEY-----……………………………………………..-----END RSA PRIVATE KEY----- 用此私钥去签发生成自己的证书文件tls.crt。 openssl req -new -x509 -key tls.key -out tls.crt -days 3650 根据提示输入国家、省、市、公司、部门、申请人和邮箱，按回车键确认。 生成的证书格式必须为： -----BEGIN CERTIFICATE-----……………………………………………………………-----END CERTIFICATE-----

自定义布局样式 如果导航页面，想实现如下图所示布局效果，即整个页面不需要有滚动条，而其中导航组件区域和全局路由视图组件区域可随滚动条滚动时，可参考如下步骤实现。 图13 自定义布局样式页面效果 在头部组件的“.css”样式文件中，指定头部组件的高度。 样例代码如下： #headerWidget { height: 90px;} 参考基于预置组件进行自定义中操作，下载预置组件路由导航(示例)，解压global_NavigatorWidget.zip。 修改解压后的“Navigator_Widget.css”文件，该文件是Widget的样式文件，在该文件中编写Widget的css样式。 样例代码如下： html[app=desktop] body { overflow: hidden;} #navigatorWidget, #global_RouterViewWidget { height: calc(100% - 90px); overflow: scroll;} 将修改后的头部组件和组件路由导航组件文件，重新打成zip包。 参考基于预置组件进行自定义中操作，上传重新打包后的组件。 在高级页面设计器左上方，单击，拖出上传的头部组件、路由导航组件和预置的路由视图组件至设计页面。 单击页面上方的，保存页面。 保存成功后，单击，发布页面。 发布成功后，单击，可查看页面效果。

响应式组件开发基本原则 组件的响应式设计，是高级页面适配多终端的重要前提。为确保自定义组件能够自适应不同分辨率设备，在组件开发中用户需要遵从响应式设计的基本原则。 根据内容设计。 不专注于特定屏幕宽度，而是专注于内容设计，当屏幕越小或浏览器窗口越窄时，内容所占的垂直高度越来越多，内容就要向下方自然延伸。建议从小屏幕开始，逐步设置断点（例如设备宽度320px、768px、1024px），针对不同设备进行设计，形成流动布局。 针对复杂情况，可以使用 CSS 3的@media查询。针对不同的终端类型和不同屏幕分辨率的设备，定义不同样式，选择应用不同的 CS S规则。只有当该设定媒体查询与正在使用的设备匹配时，其对应的CSS规则才起作用。 CSS语法如下： @media mediatype and|not|only (media feature) { CSS-Code;} 其中，参数说明如表1所示。 表1 @media语法参数说明 参数 值 说明 mediatype all 用于所有设备。 screen 用于电脑屏幕、平板电脑、智能手机等。 print 用于打印机和打印预览。 media feature aspect-ratio 定义输出设备中，页面可见区域宽度与高度的比率。 max-width 定义输出设备中，页面最大可见区域的宽度。 max-height 定义输出设备中，页面最大可见区域的高度。 min-width 定义输出设备中，页面最小可见区域的宽度。 min-height 定义输出设备中，页面最小可见区域的高度。 设置示例：对页面宽度不同的设备，设定不同背景颜色。 /*媒体查询*//*页面宽度大于1200px 时，背景颜色为蓝色，主要用于大屏设备*/@media screen and (min-width: 1200px) { body { background-color:blue; }}/*页面宽度在992px和1200px之间，背景颜色为红色，用于中等屏幕PC端*/@media screen and (min-width: 992px){ body { background-color:red; }} 避免固定尺寸。 使用像px这样的绝对单位，来指定元素的宽高、边框和字体大小等，固定宽度容易破坏响应式布局。为了布局更加灵活，推荐使用百分比、em或rem等相对单位，这样可以保证浏览器字体大小调整和缩放时，能正常显示。常用相对单位，如表2所示。 表2 常用相对单位 单位 说明 em 在font-size中，使用相对于父元素的字体大小，在其他属性中使用相对于自身的字体大小，如width。 rem 相对根元素的字体大小。 ch 相对于数字“0”的宽度。 ex 相对于字符“x”的高度。 lh 相对于元素line-height计算值。 最大和最小值。 对于大屏页面和移动端，内容扩充占满整个屏幕宽度并不总是适用的。展示同样的内容，手机端可能更适宜充满屏幕宽度，而大屏则需要在宽度上留出一定边界，使得布局上更加美观。所以，设定最大值或最小值，可以帮助您设计更为合理的布局。例如，组件宽度设定100%，最大宽度设定1024px，那么内容扩充的最大宽度即为1024px，当屏幕宽度超出1024时，内容在宽度上不会再继续扩展。 嵌套对象。 对于关系紧密的多个元素，采用相对位置会使得元素难以控制。此时，可以考虑放置于同一容器中集中管理。在容器内部，可以考虑采用绝对单位固定其关系，这对于不需要扩展的按钮等元素来说非常有效。 图片的自适应。 自适应组件设计还需要满足图片的自适应，可以使用max-width，对图片宽度进行限制，确保图片宽度不会超过浏览器窗口或容器可视部分的宽度。 移动优先。 通常来说，移动端屏幕较小、视图简单，而大屏空间大、呈现更为复杂和多样。那么，从移动端小屏幕设计入手过渡到大屏幕设计，在开发中逐步增加CSS的复杂度，通过补充设计的方式逐步丰富布局。这样，通过移动优先，可以更轻松地开发响应式布局。

属性 在属性中，设置基本折线图组件的位置、边框、背景等。 图2 属性 基础 组件标题：设置组件的标题。 组件名称：设置组件的名称。 位置 距离左端：组件到页面左侧的距离，单位为px。 距离顶端：组件到页面顶部的距离，单位为px。 宽度：组件的宽度，单位为px。 高度：组件的高度，单位为px。 堆叠顺序：设置组件层叠显示顺序。组件的堆叠顺序默认都是“1”，数字越大，显示越靠前。当需要让组件置底时，可设置堆叠顺序为“0”。 自适应高度：组件的高度是否随宽度改变。 边框：设置组件的边框样式，如全边框或角边框。 背景 样式：设置背景的样式，如普通、居中、拉伸等。 图片链接：背景图片URL。 颜色：设置背景的颜色。

属性 数据绑定：通过建立不同类型的视图模型，将各种数据源和组件的返回值或者属性值进行关联，实现动态数据效果。 值绑定：设置组件绑定的数据模型，数据模型一般有以下几种。更多介绍，请参见值绑定。 自定义：由用户自定义的前端模型，可以在模型树上快速创建自定义字段。 对象：由后台对象模型映射创建，支持选择字段。 服务：由后台服务的出入参数模型创建，分别生成inputParam和outputParam节点。 事件：由后台事件的字段映射创建，并且支持websocket刷新模型数据。 属性值绑定，用于对该组件所有属性的动态设置。当某一属性被动态绑定时，以绑定值为准。更多介绍，请参见属性绑定。 基本属性：基本属性通过数据绑定后，在运行时以数据绑定的值为准。 内容或链接：设置扫描二维码后，要展示的文本内容或者跳转的链接地址。 宽度：二维码的宽度，单位像素。默认值为150。 容错级别：二维码被遮挡或残破时依然能被识别的几率，容错级别越高抗残破或遮挡的能力就越强。 空白间距：四周空白间距，单位像素。 前景色：二维码的颜色。 背景色：背景颜色。 中间Logo：二维码中间Logo图片，可不用设置。设置Logo后，如果扫描二维码识别失败，可以调高容错级别或调大二维码。 Logo大小：设置Logo的大小，单位像素。 公共 控件名称：当前组件的名称。 隐藏：是否隐藏该组件，此方式为静态配置该组件的隐藏。还可以将该组件属性值“隐藏”配置为布尔类型模型字段，在自定义JS代码中来控制模型字段取值，从而设置该组件是否隐藏，这种动态设置优先级是最高的。 样式 布局：设置组件的宽度、高度等。 字体：设置字体大小、字体样式、颜色等。 背景：设置背景颜色、透明度。 边框：设置边框颜色、宽度等，单位为px。 阴影：设置阴影颜色、模糊、扩散等，单位为px。 高级设置 样式源码：组件具体样式代码，组件样式设置后，样式代码将自动显示在“样式源码”中，也可以自定义样式代码，对组件进行详细配置，自定义代码支持多行输入，并高亮显示样式参数。 样式类：当前组件使用的CSS样式类名，可在CSS代码中进行引用。

属性 在属性中，设置基本柱图组件的位置、边框、背景等。 图2 属性 基础 组件标题：设置组件的标题。 组件名称：设置组件的名称。 位置 距离左端：组件到页面左侧的距离，单位为px。 距离顶端：组件到页面顶部的距离，单位为px。 宽度：组件的宽度，单位为px。 高度：组件的高度，单位为px。 堆叠顺序：设置组件层叠显示顺序。组件的堆叠顺序默认都是“1”，数字越大，显示越靠前。当需要让组件置底时，可设置堆叠顺序为“0”。 自适应高度：组件的高度是否随宽度改变。 边框：设置组件的边框样式，如全边框或角边框。 背景 样式：设置背景的样式，如普通、居中、拉伸等。 图片链接：背景图片URL。 颜色：设置背景的颜色。

如何设置数据系列 选择基本柱图组件，单击鼠标右键选择“高级设置”。 展开数据系列配置，单击旁边的“+”，添加数据系列。 图5 配置数据系列 在右侧“数据”页签，配置该数据系列的数据。 例如，在使用系统预置的静态数据基础上，添加如下加粗代码，配置新增数据系列的数据。也可以使用“动态数据”调用后台接口URL返回如下结构模型数据。 {"resCode": "0","resMsg": "成功","result": [{"order": {"dataX": ["保洁","安管","工程","绿化","消杀","特约"],"dataValue": [{"title": "工单总数","value": [411,965,427,630,85,800]},{"title": "费用","value": [500,1065,327,730,185,1000]}]}}]} 配置添加的数据系列柱状条颜色、柱状条宽度、柱条边框圆角、数值是否显示，柱状图上显示的数值对应上述静态数据中的数值。 设置完成后，单击“确定”。

如何导入导出数据 实例化数据可以通过AstroZero平台的“数据导出”功能，以对象的方式导出到本地。安装实例化数据，可以通过平台的“数据导入”功能实现。关于数据的导入导出操作，请参见如何导入导出数据。 数据修改后，升级没变化：不是同一条数据，即ID不一致。 对象存在，但数据导出里面找不到该表：开发界面里对象属性“允许API批量访问”未勾上。 报错“parsing request parameters content of JSON failed: 'record'”：表中存在lookup/masterdetail类型的字段，该字段的值必须为id，不能是普通的值。 报错“file server exception, receive response failed, TrackerTask RecvHeader recv resp status 28 != 0”：文件服务器异常，需要咨询运维处理。

什么是实例化数据包 实例化数据是应用需要自带的预设数据，用于支持应用的默认行为。 在AstroZero平台中，实例化数据包是由以下三种类型数据的整体或部分构成的数据压缩包： 系统对象数据 AstroZero系统定义的实例化数据主要是用户在开发应用过程中平台产生或用户使用平台功能生成的，在应用安装完成后能够进行配置的数据。 标准对象数据 AstroZero平台内部自带的或第三方提供的标准对象数据，标准对象实例化数据包括了平台内置的（例如Account、Contact）以及订购了基线应用所提供的对象的实例化数据。 自定义对象数据 由用户通过建立自定义对象，并通过界面或接口生成的记录数据。 应用在发布时，包含一些初始化的数据，可通过单击，使用SQL语句查询对象及对象的数据，详情可参考使用控制台分析查询SQL。

调试过程 单击页面上方的，输入参数后单击“运行”，运行服务编排。 在“输入参数”中，输入如下参数： { "ownerId":"123", "limit":3, "offset":1} 检查输出页签的结果，是否符合预期。 输出如下： { "interviewId": "002N000000P4ApgMJOM4", "outputs": { "resource": [ { "ownerId": "123", "resourceName": "Folder01", "status": "Waiting", "type": "Folder" }, { "ownerId": "123", "resourceName": "File02", "status": "Waiting", "type": "File" }, { "ownerId": "123", "resourceName": "Folder02", "status": "Waiting", "type": "Folder" } ], "totalCount": 100 }} 单击服务编排编辑器页面右上方的“跟踪”，打开“日志跟踪器”页面。 在“日志跟踪器”页面，可查看服务编排执行的每一步的详细信息。 图10 查看日志详情 单击页面上方的，启用服务编排。