服务器管理平台(5)- 数据展示

数据展示

  1. Grafana导入MySQL数据源进行定制化数据展示,包括品牌分类饼图,详细数据列表等
  2. LayUI为开源前端框架,对系统概览、登录日志等信息,划分不同页面使用表格展示详细数据

1、Grafana

  • 对品牌、CPU型号、内存等数据使用饼图展示分类比例,详细数据使用table表格展示,支持字段筛选搜索

  • 系统概览显示简略信息,如需查看PCI设备、逻辑磁盘等详细信息,可以点击链接跳转界面查看

1.1、导入MySQL数据源

  • 添加MySQL数据源,填写数据库地址、用户名及密码等信息
    服务器管理平台(5)- 数据展示_第1张图片
  • 填写完成后进行保存和测试

1.2、定制化

  • 建立Panel进行定制化,选择图表形式,主题及SQL等,如下图为品牌分类饼状图

服务器管理平台(5)- 数据展示_第2张图片

  • 历史记录明细表

服务器管理平台(5)- 数据展示_第3张图片

1.3、数据展示

  • 系统概览图
    服务器管理平台(5)- 数据展示_第4张图片

  • PCI设备表
    服务器管理平台(5)- 数据展示_第5张图片

  • 历史记录数据表

服务器管理平台(5)- 数据展示_第6张图片

2、LayUI前端服务

  • 对系统概览、PCI设备、登录日志等信息,划分不同页面使用表格展示详细数据

  • 支持用户权限和密码修改,分为普通用户、系统管理员、超级管理员

  • 支持业务IP筛选搜索、编辑、查询、删除、导出Excel、打印等功能

  • 可参考LayUI框架官方文档进行操作

LayUI官网地址:https://layui.dev/        

2.1、认证登录流程

服务器管理平台(5)- 数据展示_第7张图片

2.2、前端处理流程

服务器管理平台(5)- 数据展示_第8张图片

2.3、登录界面

服务器管理平台(5)- 数据展示_第9张图片

2.4、业务信息界面

  • 系统概览图
    服务器管理平台(5)- 数据展示_第10张图片

  • 修改某条列表信息

服务器管理平台(5)- 数据展示_第11张图片

  • 查看某条详细信息

服务器管理平台(5)- 数据展示_第12张图片

End

  • 欢迎关注,感谢支持!

服务器管理平台(5)- 数据展示_第13张图片

你可能感兴趣的:(服务器管理平台,服务器,运维)