0
点赞
收藏
分享

微信扫一扫

Vue项目中引入html页面(vue.js中引入echarts数据大屏html [静态非数据传递!] )

舍予兄 04-02 13:00 阅读 1

技术选型

【后端】:Java
【框架】:springboot
【前端】:vue
【JDK版本】:JDK1.8
【服务器】:tomcat7+
【数据库】:mysql 5.7+

功能设计

 系统的整体模块,就是用模块儿图的形式把系统的所有功能进行一个表现,那么对于我们来说,可以更清楚的明白系统模块之间的关系以及系统的功能。就像我们生活中最常见的场景一样,装修房子的时候会把各个屋子的模块图进行一个画出,然后通过模块儿图的形式进行一个房间一个房间的装修。那么我们系统软件的开发也是一样,首先将各个模块划分出来,然后在开发的过程中,一个模块一个模块进行开发。如下:

功能截图

首页页面

首页在设计的时候就是按照我们系统的所有功能进行的设计,那我们首页最能凸显主题的就是我们的背景图片,通过我们的背景图片以及功能按钮的画风,能够让用户第一时间就看到我们是做什么的,还是需要怎么做都有。如下图所示:

登录页面

系统在安全性的验证方面究竟做了什么功能呢?在做之前我们也进行了思量,那么其中最简单一个就是用户的认证,那么对于用户及权限的认证是系统的最基本功能,通过用户和权限的认证,能够将功能进行分离,能够将一些恶意登录的用户进行过滤,保证了网站或者系统的安全性,这一点是非常重要的,也是我们日常中最常见的。那么此次呢,为了更加安全,防止机器破译的方式,所以我们在登录的页面当中还加了一些验证码的规则,通过人工输入才能进行一个有效的验证。如下图所示:

用户管理页面

系统的管理对于系统来说是非常重要的,那么系统的用户也是系统的生命命脉,那么系统最重要的一点是有可行可用的用户,如果在用户当中是没有的活动的用户或者系统当中无法进行用户管理那么系统的用户管理的功能可能有些欠缺。所以此次我们就将用户管理的界面放在系统首要的位置上,能够让系统管理员一眼就可以看到,这样的方式也能够帮助我们进行管理。如下图所示:

缴费登记添加页面

添加信息的页面在系统管理当中一定是必不可少的,系统的信息除了初始化数据之外,其他的信息都是在日常运营或运维过程中产生的,那么试运营过程中就要有信息的入口,那么信息的管理不仅有添加,还会有删除等等,这样的方式我们还会有多种多样,那么此次呢,我们还是采用左边菜单,右边操作区域的方式。如下图所示:

文档参考

推荐项目

https://blog.csdn.net/qq_38470315/category_12580608.html

源码获取

举报

相关推荐

0 条评论