APP下载

基于Angular的运维管理系统研发概述

2020-10-12王宏峥

科学与信息化 2020年20期
关键词:组件界面运维

摘 要 基于Angular的运维管理系统是兼容PC端和移动端的跨平台设计,主要为实现公司的运维人员能够在运维现场也能通过手机及时记录设备运行的情况,设备出现的故障,更换零器件等功能。此系统替代纸质记录,保证数据的及时性、准确性和完整性,同时能够减轻运维人员的工作量,提高工作的效率。

关键词 Angular运维管理系统;兼容PC和移动端;跨平台

1开发背景

该项目利用Angular6.架构搭建网站系统,通过Angular搭建前端界面,登录界面、故障处理界面等通过组件的形式进行开发,以便模块化的方式创建,利用Angular 的http服务的post方法,请求tomcat服务器,服务器返回json数据给请求的浏览器,数据展示在浏览器的界面上[1]。

2项目开发工具

操作系统:Windows7 及以上版本

应用服务器:网关接收程序、缓存处理程序,web服务运行在Tomcat8.0以上

开发语言:JAVA,开发工具: IntelliJ IDEA

数据库: MySql 5.7数据库

浏览器:IE10以上、谷歌、火狐、360、Safari

3系统核心技术

(1)Angular。Angular集声明式模板、依赖注入、端到端工具和一些最佳实践于一身。Angular应用实现,是用Angular扩展语法编写HTML模板,用组件类管理这些模板,用服务添加应用逻辑,用模块打包发布组件与服务,用根模块来启动该应用,使它在浏览器中接管、展现应用的内容,并根据提供的操作指令响应用户的交互。Angular为开发者提升构建Web、手机或桌面应用的能力。

(2)Angular-CLI。Angular-CLI是Angular框架官方的一個构建工具,集成了大量的NodeJS模块,它通过一条命令就能自动创建项目的目录结构、自动生成Component骨架代码并自动添加依赖、自动热加载代码、对AngularMaterial2组件库提供了内置支持,使Angular框架的搭建更加简单,快捷。

(3)Angular Material。Angular Material是Angular框架之上的Material Design的具体实现,简单说是一种UI组件库,为Angular框架开发提供一些写好的UI组件和界面色彩主题,在界面开发时直接调用相应的组件,选择喜欢的主题,使用户界面设计更加简单,用户界面风格更加统一。

4系统的功能设计

(1)任务管理。①故障查询模块,主要有查询和记录处理故障的功能。查询功能:通过故障发生的时间和故障的类型进行筛选,查询到满足条件的未完成的故障任务;故障处理功能:通过在故障处理界面,填写处理故障完成的状态,选择是否已经报备,选择运维人员,填写处理故障的时间,故障发生的原因,报备故障的时间,勾选要更换的部件,上传故障图片,来记录当前设备的故障信息。②巡检任务模块,主要有查询功能和记录处理任务的功能。查询功能:通过任务发生的时间进行筛选,查询到满足条件的未完成的巡检任务;任务处理功能,通过进入任务处理界面,填写任务的基本信息,选择更换的部件,勾选巡检项列表,上传图片,及时保存任务信息。③校验任务模块,主要由查询功能和记录处理校验任务的功能,查询功能:主要是通过任务发生的时间进行筛选,查询到满足条件的未完成的校验任务;任务处理功能:通过点击“处理任务” 按钮,进入任务处理界面,填写校验任务完成的状态,处理任务时间,运维人员以及一些备注信息,上传处理任务的图片,保存任务信息。

(2)设备管理。①设备列表,查询功能:通过设备的序列号筛选,获取满足条件的设备列表。②新建故障任务,通过已知设备来创建故障任务,进入新建故障界面,设置故障类型,分配运维人员,指定运维负责人。③新建其他任务,通过指定设备创建任务,进入新建任务界面,设置任务类型,分配运维人员,指定运维负责人,填写任务描述。④已完成故障任务,通过故障处理的时间来筛选已完成的故障任务,以列表形式示。⑤已完成其他任务,通过处理时间,任务类型来筛选已完成的任务信息,结果以列表形式显示。⑥设备详细信息,进入设备信息详细界面,查看设备的详细信息,包括:设备名称,设备类型,设备型号,生产厂商,企业名称,站点名称,安装时间。

(3)未处理任务。主界面会显示未处理的各项任务,同时后端会推送消息通知,在此界面内实时的显示通知消息,发出提示音,提醒用户进行任务的处理。点击进入未处理信息的详细界面,可查看详细的信息,并可以指定运维人员进行维护,并可以下方短信消息给用户,通知运维人员及时维护。

(4)用户权限。基于浏览器和服务器模式多用户多权限(特色之一):用户隶属于权限组,不同权限组有不同权限。

多用户多权限,不同用户拥有不同的权限,操作不同的功能,根据人员角色的不同分配不同的权限,根据不同权限,运维人员对系统进行不同的操作。

(5)修改密码。输入原始密码,新密码,确定密码,原始密码输入正确且新密码和确认密码一致,则密码修改成功。

(6)数据接收。数据接收与指令推送(独立进程):通过网关系统(TCP或UDP)接收环保设备的监测数据和状态信息。

(7)安全考虑。由于系统的使用范围为环保民用领域,考虑到数据服务器可能与政府网路共享,因此设计时参照政府网络建设要求,符合环境信息系统安全技术规范,系统是拥有一个多用户、多权限的登录认证过程,所以在用户信息建立的时候,就需要严格设定其权限信息,根据权限设置其操作功能,并且在后期严格限制越权操作。

5结束语

基于Angular运维管理系统,为推动企业的信息化发展,提高企业运维效率,降低企业运维成本,合理安排运维工作,提高运维服务,提供了一个优秀的信息化的平台。

参考文献

[1] 王芃.Angular从零到一[M].北京:机械工业出版社,2017:179.

作者简介

王宏峥(1990-),女,天津人;学历:本科,职称:助理工程师,现就职单位:天津七一二通信广播股份有限公司,研究方向:计算机软件。

猜你喜欢

组件界面运维
创建Vue组件npm包实战分析
光伏组件热斑对发电性能的影响
智能机械臂
从零开始学用智能手机
基于GPS的电力运维轨迹定位系统
IT运维管理系统的设计及应用
电子政务甲方运维管理的全生命周期
嵌入式组件技术的研究及应用
基于XML的界面自动生成设计与实现