0
  • 聊天消息
  • 系统消息
  • 评论与回复
登录后你可以
  • 下载海量资料
  • 学习在线课程
  • 观看威廉希尔官方网站 视频
  • 写文章/发帖/加入社区
会员中心
创作中心

完善资料让更多小伙伴认识你,还能领取20积分哦,立即完善>

3天内不再提示

AWTK 开源串口屏开发(10) - 告警信息的高级用法

ZLG致远电子 2024-02-24 08:23 次阅读

告警信息是串口屏常用的功能,之前我们介绍了告警信息的基本用法,实现了告警信息的显示和管理。本文介绍一下实现查询告警信息和查看告警信息详情的方法。

1. 功能

之前我们介绍了告警信息的基本用法,实现了告警信息的显示和管理。本文介绍告警信息的两种高级用法:

查询告警信息。如果告警信息比较多,我们需要通过查询,来快速找到我们想要的告警信息。

查看告警信息的详情。如果某条告警信息比较长,而且窗口比较小,我们需要通过查看详情,来查看完整的告警信息。

fb7e45aa-d2aa-11ee-9118-92fbcf53809c.png

虽然说是高级用法,其实也很简单,并不需要编写代码,设计界面并添加绑定规则即可。


2. 创建项目

从模板创建项目,将 hmi/template_app 拷贝 hmi/log_message 即可。

第一个项目最好不要放到其它目录,因为放到其它目录需要修改配置文件中的路径,等熟悉之后再考虑放到其它目录。路径中也不要中文和空格,避免不必要的麻烦。


3. 制作界面

用 AWStudio 打开上面 log_message 目录下的 project.json 文件。里面有一个空的窗口,在上面设计类似下面的界面:

  • 主窗口

fb8288ea-d2aa-11ee-9118-92fbcf53809c.png

  • 详情窗口

fb8add88-d2aa-11ee-9118-92fbcf53809c.png

4. 添加绑定规则

告警信息的显示和管理在前文已经介绍过了,这里只介绍查询和查看详情的绑定规则。

4.1 查询的数据绑定

4.1.1 告警级别

绑定属性

绑定规则

说明

v-data:value

{query.level}

4.1.2 告警开始日期

绑定属性

绑定规则

说明

v-data:value

{query.start_date}

4.1.3 告警结束日期

绑定属性绑定规则说明
v-data:value{query.end_date}

4.1.4告警设备

绑定属性绑定规则说明
v-data:value{query.device}

4.1.5关键字

绑定属性绑定规则说明
v-data:value{query.keywords}

4.1.6查询命令

绑定属性绑定规则说明
v-on:click{query,Args=clear}

参数clear表示清除查询

4.1.7查询命令

绑定属性绑定规则说明
v-on:click{query}

4.1.8 指定窗口的模型

指定窗口的模型为log_message

4.2 查看详情的数据绑定

4.2.1 告警级别

绑定属性

绑定规则

说明

v-data:value

{one_of(‘调试;信息;警告;错误’, level)}

4.2.2 告警日期时间

绑定属性

绑定规则

说明

v-data:value

{date_time_format(time, ‘Y-M-D hs’)}

4.2.3告警设备

绑定属性绑定规则说明
v-data:value{device}

4.2.4关键字

绑定属性绑定规则说明
v-data:value{message}

4.2.5 指定窗口的模型

  • 指定窗口的模型为log_message

查看详情的窗口的名称 (xml 文件与窗口名同名)是固定,必须为log_message_detail


5. 启用告警信息

修改 design/default/data/settings.json 文件,启用告警信息:

{ "name": "hmi_log_message3", "log_message": { "enable": true, /*是否启用告警信息*/ "fields": [ "level" /*告警级别*/, "time" /*日期时间*/, "device" /*设备*/, "message" /*信息*/ ], "fields_seperator": "|", /*字段之间的分隔符*/ "max_rows": 1000 /*告警信息最大行数*/ }}

6. 编译运行

运行 bin 目录下的 demo 程序。fb8ec4c0-d2aa-11ee-9118-92fbcf53809c.gif

7. 注意

本项目并没有编写界面相关的代码,AWStudio 在 src/pages 目录下生成了一些代码框架,这些代码并没有用到,可以删除也可以不用管它,但是不能加入编译。

实际使用时,在 demo_log_message3 基础上进行调整即可,无需重复上面的过程,但是最好了解其中的原理。

声明:本文内容及配图由入驻作者撰写或者入驻合作网站授权转载。文章观点仅代表作者本人,不代表电子发烧友网立场。文章及其配图仅供工程师学习之用,如有内容侵权或者其他违规问题,请联系本站处理。 举报投诉
  • 开源
    +关注

    关注

    3

    文章

    3075

    浏览量

    41844
  • 串口屏
    +关注

    关注

    8

    文章

    501

    浏览量

    36766
收藏 人收藏

    评论

    相关推荐

    AWTK 开源智能串口方案

    AWTK开源智能串口方案发布,旨在解决传统串口诸多痛点,为用户提供更开放、更易用、更强大的
    的头像 发表于 12-02 08:24 647次阅读
    <b class='flag-5'>AWTK</b> <b class='flag-5'>开源</b>智能<b class='flag-5'>串口</b><b class='flag-5'>屏</b>方案

    AWTK 串口开发(2) - 家居控制

    本文以一个家居控制应用程序为例,介绍AWTK串口开发流程和MVVM数据绑定的高级用法。1.功
    的头像 发表于 12-16 08:24 399次阅读
    <b class='flag-5'>AWTK</b> <b class='flag-5'>串口</b><b class='flag-5'>屏</b><b class='flag-5'>开发</b>(2) - 家居控制

    ​【AWTK开源智能串口方案】方案介绍和工作原理

    本篇文章介绍一下AWTK开源智能串口方案的基本原理和实际使用效果,包括主要特点、应用场景、工作原理以及简单的Demo演示。引言:AWTK-
    的头像 发表于 12-21 08:24 582次阅读
    ​【<b class='flag-5'>AWTK</b><b class='flag-5'>开源</b>智能<b class='flag-5'>串口</b><b class='flag-5'>屏</b>方案】方案介绍和工作原理

    AWTK 串口开发(3) - 告警信息

    告警信息是一个常用的功能。在AWTK开源串口中,内置告警
    的头像 发表于 12-23 08:24 254次阅读
    <b class='flag-5'>AWTK</b> <b class='flag-5'>串口</b><b class='flag-5'>屏</b><b class='flag-5'>开发</b>(3) - <b class='flag-5'>告警</b><b class='flag-5'>信息</b>

    AWTK 串口开发(4) - 数据采集

    数据采用是一个常用的功能。在AWTK开源串口中,内置数据采样模型,只需设计用户界面即可实现采样数据的显示和管理。1.功能数据采集是一个常用的功能,MCU定时采集数据(如环保设备定时采
    的头像 发表于 12-30 08:24 247次阅读
    <b class='flag-5'>AWTK</b> <b class='flag-5'>串口</b><b class='flag-5'>屏</b><b class='flag-5'>开发</b>(4) - 数据采集

    AWTK 串口开发(5) - MCU端 SDK 用法

    AWTK开源智能串口,不但开放了串口端全部源码,还提供了MCU端SDK,大大加快MCU软件的
    的头像 发表于 01-06 08:24 235次阅读
    <b class='flag-5'>AWTK</b> <b class='flag-5'>串口</b><b class='flag-5'>屏</b><b class='flag-5'>开发</b>(5) - MCU端 SDK <b class='flag-5'>用法</b>

    AWTK 开源串口开发(6) - 定时器的用法

    定时器是个常用的功能,AWTK串口提供了丰富的定时器函数,用于定时器的启动、停止、暂停、恢复、修改和重置等功能,本文以计时器的例子来介绍定时器的基本用法。定时器也是一个常用的功能,在
    的头像 发表于 01-13 08:24 287次阅读
    <b class='flag-5'>AWTK</b> <b class='flag-5'>开源</b><b class='flag-5'>串口</b><b class='flag-5'>屏</b><b class='flag-5'>开发</b>(6) - 定时器的<b class='flag-5'>用法</b>

    AWTK开源智能串口方案】HMI端程序移植编译及运行

    本篇文章介绍一下AWTK开源智能串口方案的串口端(即HMI端)的编译运行步骤,并介绍如何将H
    的头像 发表于 01-18 08:24 502次阅读
    【<b class='flag-5'>AWTK</b><b class='flag-5'>开源</b>智能<b class='flag-5'>串口</b><b class='flag-5'>屏</b>方案】HMI端程序移植编译及运行

    AWTK 开源串口开发(9) - 用户和权限管理

    AWTK串口中,内置用户管理和权限控制的模型,无需编码即可实现登录、登出、修改密码、权限控制、创建用户、删除用户等功能,本文介绍一下用户管理和权限控制的基本用法。用户管理和权限控制
    的头像 发表于 02-19 12:10 328次阅读
    <b class='flag-5'>AWTK</b> <b class='flag-5'>开源</b><b class='flag-5'>串口</b><b class='flag-5'>屏</b><b class='flag-5'>开发</b>(9) - 用户和权限管理

    AWTK开源智能串口方案】MCU SDK使用与编译运行

    代码智能串口方案,本系列文章介绍如何从零开发HMI程序,包括搭建开发环境、创建HMI运行时工程、修改应用界面以及开发MCU程序。MCU端简
    的头像 发表于 02-19 12:11 698次阅读
    【<b class='flag-5'>AWTK</b><b class='flag-5'>开源</b>智能<b class='flag-5'>串口</b><b class='flag-5'>屏</b>方案】MCU SDK使用与编译运行

    AWTK开源智能串口方案】设计UI界面并上传到串口

    本篇文章将介绍如何使用AWStudio设计串口端的UI界面和添加绑定规则,以及怎么将资源文件上传到串口端。引言:AWTK-HMI是基于
    的头像 发表于 02-22 08:24 369次阅读
    【<b class='flag-5'>AWTK</b><b class='flag-5'>开源</b>智能<b class='flag-5'>串口</b><b class='flag-5'>屏</b>方案】设计UI界面并上传到<b class='flag-5'>串口</b><b class='flag-5'>屏</b>

    AWTK 开源串口开发(11) - 天气预报

    AWTK串口内置了XML/JSON/INI等各种数据文件的模型,并支持用HTTP/HTTPS从网络获取数据。不用编写一行代码,即可实现天气预报、股票行情、航班查询和快递查询等功能。天气预报是一个很
    的头像 发表于 03-05 08:24 205次阅读
    <b class='flag-5'>AWTK</b> <b class='flag-5'>开源</b><b class='flag-5'>串口</b><b class='flag-5'>屏</b><b class='flag-5'>开发</b>(11) - 天气预报

    AWTK 开源串口开发(12) - 记事本应用

    传统的的串口中,开发一个记事本应用,即使可能,也是非常麻烦的事情。在AWTK串口中,内置文件
    的头像 发表于 03-09 08:23 200次阅读
    <b class='flag-5'>AWTK</b> <b class='flag-5'>开源</b><b class='flag-5'>串口</b><b class='flag-5'>屏</b><b class='flag-5'>开发</b>(12) - 记事本应用

    AWTK 开源串口开发(15) - 通过 MODBUS 访问远程数据

    AWTK串口内置MODBUSClient模型,支持用MODBUS协议从远程设备获取数据。不用编写代码即可实现对远程设备数据的显示和修改。在AWTK
    的头像 发表于 03-30 08:23 226次阅读
    <b class='flag-5'>AWTK</b> <b class='flag-5'>开源</b><b class='flag-5'>串口</b><b class='flag-5'>屏</b><b class='flag-5'>开发</b>(15) - 通过 MODBUS 访问远程数据

    AWTK 开源串口开发(16) - 提供 MODBUS 服务

    AWTK串口内置MODBUS从站模型,不用编写一行代码即可让串口提供MODBUS服务,让远程设备通过MODBUS协议访问
    的头像 发表于 04-13 08:24 213次阅读
    <b class='flag-5'>AWTK</b> <b class='flag-5'>开源</b><b class='flag-5'>串口</b><b class='flag-5'>屏</b><b class='flag-5'>开发</b>(16) - 提供 MODBUS 服务