BuildRun低代码开发教程第五节 | 设备管理开发

课程概述

由于设备管理中需要关联产品和设备组,需要定义动态列表,因此将设备管理相关功能的构建单独作为一个课程来介绍,本课程涉及到主要的新知识点:

  • 动态值列表定义
  • 查询区域使用值列表
  • 新增和更新区域使用值列表
  • 详细信息页面只读信息查看

课程内容

1. 创建 设备 页面

  1. 选择右上角的 创建 链接进入创建页面窗口,录入如下信息:

    1. 名称设备
    2. 编码DEVICES
    3. 标题设备管理
  2. 填写信息完成后,点击创建页面窗口左下角的 “创建” 按钮完成页面创建后进入页面设计视图。
  3. 点击顶端的 数据源图标,切换到 数据源定义 视图。
  4. 点击左上角的 (➕) 加号,从弹出的列表中选择 设备 创建产品数据源。
  5. 点击顶端的 页面设计 图标,切换到页面设计界面。

1.1 定义设备列表Section

  1. 左边页面结构视图中展开 设备 节点,选择下面的 默认Section 节点,在右侧的 Section属性 下修改信息为:

    1. 名称设备列表
    2. 编码listDevices
  2. 拖动右侧 组件列表 下的 数据组件->列表 组件到中间区域,看到虚框出现后释放会弹出 组件添加数据源 窗口,看到已经默认选中 设备 这个数据源,直接点击 确定 按钮。
  3. 左边页面结构视图中展开 设备 节点,选择下面的 产品列表->表格组件 节点,从右侧 字段 下拖动字段到中间配置区域:

    1. 搜索(高级搜索)默认字段:产品、设备组、设备名称
    2. 列表字段:设备名称、所属产品(产品->产品名称)、云端协议、设备组(设备组->组名称)
  4. 中间配置区域添加如下按钮:

    1. 列表按钮:添加
    2. 列表行内按钮:详情(自定义按钮)、编辑
  5. 点击右上角的保存编辑按钮保存。

1.2 定义创建设备Section

  1. 鼠标移动到左边页面结构视图中设备节点后面的加号,选择 添加Section 弹出 在页面”设备“中创建Section 窗口中输入信息:

    1. 名称新增设备
    2. 编码createDevice
  2. 选择 新增设备 Section,拖动右侧 组件列表 下的 数据组件->表单 组件到中间区域,看到虚框出现后释放会弹出 组件添加数据源 窗口,看到已经默认选中 设备 这个数据源,直接点击 确定 按钮。
  3. 左边页面结构视图中选择 新增设备->表单组件 节点,从右侧 字段 下拖动字段到中间配置区域,形成两栏布局:

    1. 第一行:设备名称、产品
    2. 第二行:上联系统、设备组
    3. 第三行:运营商、上联网络
    4. 第四行:MAC、制造商
    5. 第五行:序列号、软件版本
    6. 第六行:硬件版本、设备位置
    7. 第七行:位置经度、位置纬度
    8. 第八行:连接用户名、设备秘钥
  4. 选中 新增设备 Section
  5. Section按钮区添加 增加 按钮:

    1. 按钮文字增加** ;
    2. 按钮图标add
    3. 数据源设备
    4. dataset方法提交
    5. 后处理动作关闭Section
    6. 后处理动作关闭的Section新增设备
  6. Section按钮区添加 取消 按钮:

    1. 按钮文字取消
    2. 按钮图标cancel
    3. 数据源设备
    4. dataset方法删除
    5. 操作的记录当前记录
    6. 后处理动作关闭Section
    7. 后处理动作关闭的Section新增设备
  7. 点击右上角的保存编辑按钮保存。

5.1createDevice.png

1.3 定义查看设备Section

  1. 鼠标移动到左边页面结构视图中设备节点后面的加号,选择 添加Section 弹出 在页面”设备“中创建Section 窗口中输入信息:

    1. 名称查看设备
    2. 编码viewDevice
  2. 选择 查看设备 Section,拖动右侧 组件列表 下的 数据组件->表单 组件到中间区域,看到虚框出现后释放会弹出 组件添加数据源 窗口,看到已经默认选中 设备 这个数据源,直接点击 确定 按钮。
  3. 左边页面结构视图中选择 新增设备->表单组件 节点。
  4. 字段 下拖动字段到中间配置区域,形成两栏布局,并设置所有字段 组件属性 下的 是否可编辑

    1. 第一行:设备名称、所属产品(产品->产品名称)
    2. 第二行:上联系统、设备组(设备组->组名称)
    3. 第三行:运营商、上联网络
    4. 第四行:MAC、制造商
    5. 第五行:序列号、软件版本
    6. 第六行:硬件版本、设备位置
    7. 第七行:设备编号
    8. 第八行:创建时间、创建人(创建人->用户名)
  5. 选中 查看设备 Section
  6. Section按钮区添加 关闭 按钮:

    1. 按钮文字关闭** ;
    2. 按钮图标close
    3. 数据源设备
    4. 逻辑类型
    5. 后处理动作关闭Section
    6. 后处理动作关闭的Section查看设备
  7. 点击右上角的保存编辑按钮保存。

5.2viewDevice.png

1.4 定义更新设备Section

  1. 鼠标移动到左边页面结构视图中设备节点后面的加号,选择 添加Section 弹出 在页面”设备“中创建Section 窗口中输入信息:

    1. 名称更新设备
    2. 编码updateDevice
  2. 拖动右侧 组件列表 下的 数据组件->表单 组件到中间区域,看到虚框出现后释放会弹出 组件添加数据源 窗口,看到已经默认选中 设备 这个数据源,直接点击 确定 按钮。
  3. 左边页面结构视图中选择 更新产品->表单组件 节点,从右侧 字段 下拖动字段到中间配置区域,形成两栏的布局:

    1. 第一行:设备名称、产品(不可编辑)
    2. 第二行:上联系统、设备组
    3. 第三行:运营商、上联网络
    4. 第四行:MAC、制造商
    5. 第五行:序列号、软件版本
    6. 第六行:硬件版本、设备位置
    7. 第七行:位置经度、位置纬度
  4. 点击右上角的保存编辑按钮保存。
  5. 选中更新设备Section
  6. Section按钮区添加 更新 按钮:

    1. 按钮文字更新** ;
    2. 按钮图标save
    3. 数据源设备
    4. dataset方法提交
    5. 后处理动作关闭Section
    6. 后处理动作关闭的Section更新设备
  7. Section按钮区添加 取消 按钮:

    1. 按钮文字取消
    2. 按钮图标cancel
    3. 数据源设备
    4. dataset方法重置
    5. 操作的记录当前记录
    6. 后处理动作关闭Section
    7. 后处理动作关闭的Section更新设备
  8. 点击右上角的保存编辑按钮保存。

1.5 设备列表Section中关联创建设备和更新设备Section

  1. 左边页面结构视图中选择 设备列表->表格组件
  2. 设置 列表按钮 添加 的属性:

    1. 按钮图标add
    2. 后处理动作打开Section
    3. 弹出Section宽度
    4. 后处理动作打开的Section新增设备
  3. 设置 列表行内按钮 详情 的属性:

    1. 按钮图标details
    2. 数据源设备
    3. dataset方法查询
    4. 后处理动作打开Section
    5. 弹出Section宽度
    6. 后处理动作打开的Section查看设备
  4. 设置 列表行内按钮 编辑 的属性:

    1. 按钮图标:mode_edit
    2. 后处理动作:打开Section
    3. 弹出Section宽度:中
    4. 后处理动作打开的Section:更新设备
  5. 点击右上角的保存编辑按钮保存。

2. 菜单设置

选择应用设计器左侧的菜单管理图标进入菜单管理界面,在 物联网管理 菜单下添加菜单项:

  • 导航名称设备管理
  • 图标scissors
  • 跳转页面设备

3. 发布和运行应用

选择应用设计器顶部右上角 发布 按钮发布应用,选择 物联网低代码服务(试用配置) 发布配置,点击 确定 按钮开始发布应用,等待应用发布完成。

5.3deviceApp.png

4. 持续优化应用

5.4deviceAppSearch.png

5.5addDeviceLOV.png

图中红圈的字段,希望能够是动态的值列表,通过选择已经在设备组和产品管理维护好的值。

4.1 定义设备组和产品的动态值列表

从业务对象关系图中的实体对象 设备组 上方点击图标进入业务对象属性查看界面:

  1. 选择 关联值列表 标签进入关联值界面,点击 创建关联值列表 进入 创建关联值列表 界面,输入如下信息:

    1. 名称设备组
    2. 描述
  2. 点击 创建 按钮创建 设备组 ,选择 设备组 进入编辑关联值列表界面;
  3. 右侧 关联值列表属性 中设置 是否可搜索
  4. 从右侧 字段 下拖动字段到中间配置区域:

    1. 搜索(高级搜索)默认字段:组名称
    2. 列表:组名称、组描述
  5. 点击 保存 按钮完成编辑
  6. 进入 产品 业务对象创建关联值列表 产品

    1. 搜索(高级搜索)默认字段:产品名称
    2. 列表:产品名称、产品类型、云端协议、产品描述

5.6editLOV.png

4.2 为设备列表搜索和创建设备界面设置关联值列表

  1. 选择页面 设备 进入页面设计器中;
  2. 选择 设备列表 Section中的 表格组件
  3. 选择 搜索(高级搜索)默认字段 中的:

    1. 产品:值列表为 产品
    2. 设备组 值列表为 设备组
  4. 选择 新增设备 Section中的 表单组件
  5. 选择如下字段设置:

    1. 产品:值列表为 产品
    2. 设备组 值列表为 设备组
  6. 选择 更新设备 Section中的 表单组件
  7. 选择如下字段设置:

    1. 设备组 值列表为 设备组

4.3 发布运行应用

5.7BriotApp.png

点击 设备列表行内的 详情 链接查看设备详情:

5.7.1viewDevice.png

查询区域字段使用关联值列表选择值:

5.8listDevicesSearchLov.png

新增设备表单中使用关联值列表选择值:

5.9createDeviceLov.png

--To be continued--

这一节完成了设备管理相关功能的构建,下一节将介绍如何我们在第二节中规划的V1.5版本相关的功能构建,本系列开发教程每周一更,请持续关注。

前四节课程回顾▼

BuildRun低代码开发教程第一节 | 项目环境准备

BuildRun低代码开发教程第二节 | 功能需求梳理和任务定义

BuildRun低代码开发教程第三节 | 数据模型设计和定义

BuildRun低代码开发教程第四节 | 产品和设备组管理开发

遇到问题怎么办

在Buildrun使用过程中,任何平台的问题和建议,都可以点击页面右下角用户反馈按钮来提交反馈给我们,我们会在第一时间处理。

feedback.png

BuildRun带来了多云架构环境下基于视觉的企业级应用创建、集成、部署、生命周期管理和分发的能力,由开源Choerodon猪齿鱼核心团队创立的BuildRun公司(上海翘腾科技有限公司)的使命是以云原生的现代化软件架构来帮助企业提升软件开发生产力和业务敏捷性,它提供企业级DevOps平台和企业级低代码开发平台,帮助隐藏应用所依赖的基础环境的复杂性,让每个人都只需要专注在业务逻辑上,以新的方式让团队能够快速、持续地将他们的想法转化为真正的商业价值。

欢迎免费注册,体验试用低代码应用开发

你可能感兴趣的:(企业应用,敏捷开发,开发工具,devops,构建工具)