@TOC
springboot0786在线答疑系统文件
第1章 绪论
1.1课题背景
计算机的普及和互联网时代的到来使信息的发布和传播更加方便快捷。人们可以通过计算机上的浏览器访问多个应用系统,从中获取一些可以满足学生生活需求的管理系统。网站系统有时更像是一个大型“展示平台”,人们可以选择所需的信息进行在线查看满足学生需求。
系统所要实现的功能分析,对于现在网络方便的管理,据数据调查显示,对于网上学生的数达到5.6亿,相比过去增长较快,人们通过网上登录的方式已经形成了一种依赖,不管需要什么信息内容,直接上网查找,参考比较大,对在线答疑系统的类型和特点的内容信息有了详细的了解,让学生更有针对性的选择。这也给学生带来非常大的方便,学生可以不用像传统的方式进行查看信息,这样不仅耽误自己的时间,而且比对过程比较单一,所以在线答疑系统的开发不仅仅是能满足学生的需求,还能提高管理员的工作效率,减少原有不必要的工作量。
1.2研究意义
随着社会的发展和科学技术的进步,互联网技术越来越受欢迎。网络传播的生活方式逐渐受到广大人民群众的喜爱。越来越多的互联网爱好者开始在互联网上满足他们的基本需求,同时逐渐进入各个学生的生活起居。互联网具有许多优点,例如便利性,速度,高效率和低成本。因此,类似于在线答疑系统,满足学生工作繁忙的需求,不仅是方便学生随时查看信息的途径,而且还能提高管理效率。
本文首先以在线答疑系统过程的基本问题作为研究对象。在开发系统之前,我们对现有状况进行了详细的调查和分析。最后,我们利用计算机技术开发了一套完整合适的在线答疑系统。该系统的实现主要优势是:该系统主要采用计算机技术开发,它方便快捷;系统可以通过管理员界面查看系统所涉及的在线答疑系统所有信息管理。
在线答疑系统软件是一款方便、快捷、实用的信息服务查询软件。随着智能网络在全球市场的不断普及以及各种智能平台的使用,作为中国主流智能的技术开发系统,自然需要这样的软件来满足更多学生的需求和体验。系统的开发与人们的日常需求相关,如通过管理系统获取到首页、个人中心、学生管理、教师管理、问题发布管理、疑难解答管理等信息详细情况,了解最新资讯信息等。
虽然目前已有很多基于java平台的在线答疑系统相关的平台系统,但尚未出现更详细的功能显示和信息查询。经过分析,学生的第一眼往往是看到一个软件的外观,一个漂亮的界面将吸引学生下一次点击和理解。为了让学生通过无意识的点击尝试进入每个界面和每个按钮,学生可以进一步了解软件的质量,因此良好的软件界面将是吸引学生注意力的第一步。因此,对于每个软件界面设计工作来说,一个应用程序是占据非常重要的一部分,在高端大气中吸引学生界面,满足学生体验将进一步完成整个应用程序的各项功能,良好的学生体验度将继续使用并经常打开并使用此软件。
1.3研究内容
本在线答疑系统平台,使用的是比较成熟的java技术和比较完善的MySQL数据库,将网络在线答疑系统信息管理系统可以更安全、技术性更强的满足网站所有信息的管理。
在线答疑系统平台主要实现了管理员模块、学生、教师模块三大部分。通过本在线答疑系统平台可以提高管理人员的工作效率,减少出错率,对于数据存储及查找有了更方便的操作。
详细内容介绍,将在以下五章中详细阐述:
第一章、绪论,介绍了研究课题选择的背景及意义、研究现状,简要介绍了本文的章节内容。
第二章、引入技术知识,通过引入关键技术进行开发,向系统中涉及直观表达的技术知识。
第三章、重点分析了系统的分析,从系统强大的供需市场出发,对系统开发的可行性,系统流程以及系统性能和功能进行了探讨。
第四章、介绍了系统的详细设计方案,包括系统结构设计和数据库设计。
第五章、系统设计的实现,通过对系统功能设计的详细说明,论证了系统的结构。
第六章、系统的整体测试,评判系统是否可以上线运行。
第2章 技术介绍
2.1相关技术
在线答疑系统是在java + MySQL开发环境的基础上开发的。java是一种服务器端脚本语言,易于学习,实用且面向学生。全球超过35%的java驱动的互联网站点使用java。MySQL是一个数据库管理系统,因为它的体积小但速度快,成本低,或者开源受到中小型网站的青睐。因此,java + MySQL作为一个成熟的开发环境,可以满足在线答疑系统设计和开发所需的稳定性,安全性和可扩展性要求。
2.2java技术
java是JAVA的成员,所以java具有平台无关性,即实现跨平台功能,实现了学生界面和程序代码的解耦合,是的业务逻辑与代码的耦合度更低,开发人员可以在不更改java程序的情况下修改学生的界面。
java页面实质上也是一个HTML页面,只不过它包含了用于产生动态网页内容的JAVA代码,这些JAVA代码可以是JAVA Bean、SQL语句、RMI对象等。例如一个java页面包含了用于产生静态网页的HTML代码,同时也包含了连接数据库的JDBC代码,那么当网页在浏览器中显示时,它既包含了静态的HTML代码,又包含了从数据库中取得的动态内容,正因为如此才能称之为动态网页。
java程序简单实用,面向学生。在同一系统中体现的java技术优势只需要写一次; 同一系统下的多平台设计和开发;灵活且能够在多个服务器上运行;拥有各种强大的免费工具支持;在网页运行时实现服务器端组件。
在网站访问频率不是很高的环境中用作Web应用程序服务器。它是免费的开源,是java程序开发和调试的首选对象。
2.3 MySQL数据库
数据库是系统开发过程中不可或缺的一部分。 在WEB应用方面,MySQL AB开发了一个具有很大优势的MySQL关系数据库管理系统。 MySQL可以将数据存储在不同的表中,这非常灵活,并且还可以提高系统在实际应用中的速度。 数据库访问最常用于标准SQL语言,MySQL用于SQL语言,因此它具有高度兼容性。数据库的操作是必不可少的,包括对数据库表的增加、删除、修改、查询等功能。现如今,数据库可以分为关系型数据库和非关系型数据库,Mysql属于关系性数据库,Mysql数据库是一款小型的关系型数据库,它以其自身特点:体积小、速度快、成本低等,Mysql数据库是目前最受欢迎的开源数据库。
在WEB应用技术中, Mysql数据库支持不同的操作系统平台,虽然在不同平台下的安装和配置都不相同,但是差别也不是很大,Mysql在Windows平台下两种安装方式,二进制版和免安装版。安装完Mysql数据库之后,需要启动服务进程,相应的客户端就可以连接数据库,客户端可通过命令行或者图形界面工具登录数据库。
2.4 Tomcat介绍
Tomcat 虽然是Apache的扩展,但是它们都是可以独立运行的,二者是不互相干扰的。当配置正确的时候,Apache服务器为HTML页面的运行提供技术支持,Tomcat 的任务则是运行Servle和java 页面。Tomca也具有一定的HTML页面处理功能。Tomcat属于一种轻型的服务器,所以说在中小企业中并不具有普适性。但是当程序员需要开发或调试java 程序时,则通常会将该服务器作为首选。对于一个仅具有计算机基础知识的人来说,计算机系统具有一个好的Apache服务器,可以很好的对HTML 页面进行访问。Tomcat是非常受欢迎的服务器,因为它具有较好的扩展性,而且在运行的时候不需要太多的系统资源,拥有程序员所需要的收发邮件功能,还能够支持负载平衡,该程序能够不断的更新,程序员能够根据自己的需要增加新的功能。
2.5 Spring Boot框架
Spring Boot是Pivotal团队的一个新框架,旨在简化新Spring应用程序的初始设置和开发。该框架使用特定的配置方法,无需开发人员定义样板配置。通过这种方式,Spring Boot旨在成为蓬勃发展的快速应用程序开发领域的领导者。 Spring Boot特点: 1、创建一个单独的Spring应用程序; 2、嵌入式Tomcat,无需部署WAR文件; 3、简化Maven配置; 4、自动配置Spring; 5、提供生产就绪功能,如指标,健康检查和外部配置; 6、绝对没有代码生成和XML的配置要求; 安装步骤:
最基本的是,Spring Boot是一个可以被任何项目的构建系统使用的库集合。 为简单起见,该框架还提供了一个命令行界面,可用于运行和测试Boot应用程序。 可以从Spring存储库手动下载和安装框架的已发布版本,包括集成的CLI(命令行界面)。 更简单的方法是使用Groovy enVironment Manager(GVM),它负责处理Boot版本的安装和管理。 可以从GVM命令行GVM install springboot安装Boot及其CLI。 在OS X上安装Boot时可以使用Homebrew包管理器。要完成安装,首先使用brew tap pivotal / tap切换到pivotal存储库,然后执行brew install springboot命令。
第3章 需求分析
3.1需求分析概述
任何一个项目在开发研究前,都需要对研发系统本身的需求做一个认真的分析,市场的调研是不可忽视的,从实际场景中确定使用人员的功能需求,从而明确目标,对整个系统的开发有一个更加准确的定位,在这个章节,需要对系统的性能分析,业务流程分析,和数据等进行分析,在线答疑系统的整体界面简单,功能完善。
需求的可行性是分析和讨论发达的系统能达到什么样的要求。开发的系统平台是否符合之前的要求。只有在预先评估系统的开发中,才能在系统开发和实施之前完成需求。如果您不具备开发一个功能不合格的系统的可行性,那就是开发失败。开发系统是否有用,可以完成之前讨论过的需求,以下分析了在线答疑系统的实际需求。
系统设计需要从学生和教师、管理员的实际需求开始,以了解他们需要实施哪些功能以及他们可以包括哪些管理工作。
考虑到在线答疑系统设计的特点,应满足几个要求:
(1)它可以通过网络开展学生在线答疑系统工作,促进对我的收藏管理的统一管理。
(2)学习方法变得更加多样化,管理更加标准化;
(3)它提供了一个免费的渠道,以确保数据的实时有效沟通。
3.2可行性分析
可行性分析目的是根据所开发系统的学生需求,明确研究方向和目标,通过可行性分析确定系统的框架和功能模块。
可行性分析是对任何管理系统的需求、技术和经济的分析。其中最重要的技术方面的可行性,技术可行性是分析软件开发技术的应用开发系统是可行的。其次,分析软件系统的需求,分析软件需求能否满足预先设计的功能需求。最后讨论了系统的操作可行性和经济可行性。
3.2.1经济可行性
在开发任何软件系统之前,它将考虑其后来的经济可行性,即开发和设计软件所需的成本及其在以后运行中可带来的经济效益是否可以匹配,以及软件是否能带来经济效益给学生。在本交互式学生管理软件的设计中,本文的主要目的是为管理员提供一个新的在线答疑系统平台,这在经济上是完全可行的。
3.2.2技术可行性
系统比较重要的一个分析就是技术可行分析,没有好的技术,再好的设计也是达不到系统的要求,并且对于技术的设计,使用的技术,如何更好的利用技术将所要实现的功能模块进行详细的分析,需要对技术进行详细的了解及自己的所学知识的一个综合使用。技术可行性主要取决于系统设计和开发中使用的各种硬件设施和软件设置,是否可以更好的结合,发挥他们的优势避开他们的弊端进行完美结合,确保技术的安全使用及正常的操作。
在线答疑系统主要是基于springboot技术开发,到目前为止,springboot技术的发展已经非常成熟。同时,它也受到许多开发人员的青睐。而且,在技术层面,Windows平台决定可以完成开发在线答疑系统的任务。因此,系统开发在技术上是可行的。
3.3系统功能设计
软件的学生界面是最直接接触的对象,包括是否允许学生使用简单方便,请求的响应时间,主图像的整体质量,整体布局的质量。
在线答疑系统的设计基于现有的网络平台,可以实现学生管理及数据信息管理等功能。方便管理员对首页、个人中心、学生管理、教师管理、问题发布管理、疑难解答管理有详细的了解及统计分析,随时查看信息状态。
系统功能设计是在系统开发和设计思想的总体任务的基础上完成的。该系统的主要任务是在线答疑管理,使学生可以通过指令完成整个在线答疑系统的操作。
从上面的描述中可以基本可以实现软件的功能:
1、开发实现在线答疑系统的整个系统程序;
2、管理员;首页、个人中心、学生管理、教师管理、问题发布管理、疑难解答管理等模块信息的查看及相应操作;
3、教师权限:首页、个人中心、疑难解答管理、试卷管理、试题管理、考试管理等相应操作;
4、学生权限;首页、个人中心、问题发布管理、疑难解答管理、考试管理等相应操作;
5、基础数据管理:实现系统基本信息的添加、修改及删除等操作,并且根据需求进行留言、评论信息的查看及回复相应操作。
第4章 系统设计
4.1系统结构设计
在线答疑系统的设计主要是为了满足学生的实际需求。 因此,它需要通过Internet实现,因此它必须具备硬件和软件基础。该平台最终可以通过科学技术和各种方式达到支持智能化的信息管理的目的。因此,它必须具备网络在线答疑系统所需的环境和各种资料,并保证实现开放性,模块性和实用性三个原则。
在线答疑系统,主要包括管理员、教师、学生三个用户角色,对于学生角色不同,所使用的功能模块相应不同。
管理员权限;首页、个人中心、学生管理、教师管理、问题发布管理、疑难解答管理
教师权限:首页、个人中心、疑难解答管理、试卷管理、试题管理、考试管理。
学生权限;首页、个人中心、问题发布管理、疑难解答管理、考试管理等功能模块的管理维护等操作,系统结构图如下图4-1所示。
图4-1 系统功能图
4.2数据库设计
数据库是信息系统的基础和核心。数据库设计的好坏直接影响到信息系统开发的成败。创建数据库表首先确定实体的属性和实体之间的关系。根据关系创建一个数据表。
4.2.1实体ER图
数据库是整个软件编程中最重要的一个步骤,对于数据库问题主要是判定数据库的数量和结构公式的创建。在线答疑系统使用的是Mysql进行对数据库进行管理,进行保证数据的安全性、稳定性等。
概念模型的设计是为了抽象真实世界的信息,并对信息世界进行建模。它是数据库设计的强大工具。数据库概念模型设计可以通过E-R图描述现实世界的概念模型。系统的E-R图显示了系统中实体之间的链接。而且Mysql数据库是自我保护能力比较强的数据库,下图主要是对数据库实体的E-R图:
管理员信息实体属性图如图4-2所示。
图4-2管理员信息实体属性图
学生信息实体属性图如图4-3所示。
图4-3学生信息实体属性图
教师信息实体属性图如图4-4所示。
图4-4教师信息实体属性图
试题信息实体属性图如图4-5所示。
图4-5试题信息实体属性图
4.2.2数据表
每个数据库的应用它们都是和区分开的,当运行到一定的程序当中,它就会与自己相关的协议。那么这个系统就会对使这些数据进行连接。当我们选择哪个桥段的时候,接下来就会简单的叙述这个数据库是如何来创建的。当点击完成按钮的时候就会自动在对话框内弹出数据源的名称,在进行点击下一步即可,直接在输入相对应的身份验证和登录密码。
根据系统功能设计的要求和功能模块的划分,在线答疑系统设计与实现一共涉及到四个数据表。下面就介绍一下各别主要数据库表的设计结构及其功能建立数据库表:
表4.jiaoshi表
Field | Type | Comment |
---|---|---|
id | int(11) | 主键 |
addtime | varchar(200) | 添加时间 |
gonghao | varchar(200) | 工号 |
mima | varchar(200) | 密码 |
xingming | varchar(200) | 姓名 |
xingbie | varchar(200) | 性别 |
touxiang | varchar(200) | 头像 |
xueyuan | varchar(200) | 学院 |
banji | varchar(200) | 班级 |
dianhua | varchar(200) | 电话 |
表4.2 xuesheng表
Field | Type | Comment |
---|---|---|
id | int(11) | 主键 |
addtime | varchar(200) | 添加时间 |
xuehao | varchar(200) | 学号 |
mima | varchar(200) | 密码 |
xingming | varchar(200) | 姓名 |
xingbie | varchar(200) | 性别 |
touxiang | varchar(200) | 头像 |
yuanxi | varchar(200) | 院校 |
banji | varchar(200) | 标题 |
shouji | varchar(200) | 手机 |
表4.wentifabu表
Field | Type | Comment |
---|---|---|
id | int(11) | 主键 |
addtime | varchar(200) | 添加时间 |
biaoti | varchar(200) | 标题 |
timu | varchar(200) | 题目 |
daan | varchar(200) | 答案 |
faburiqi | varchar(200) | 发表日期 |
xuehao | varchar(200) | 学号 |
xingming | varchar(200) | 姓名 |
sfsh | varchar(200) | 是否审核 |
shhf | varchar(200) | 审核回复 |
表4.yinanjieda表
Field | Type | Comment |
---|---|---|
id | int(11) | 主键 |
addtime | varchar(200) | 添加时间 |
mingcheng | varchar(200) | 名称 |
timu | varchar(200) | 题目 |
daan | varchar(200) | 答案 |
faburiqi | varchar(200) | 发布日期 |
gonghao | varchar(200) | 工号 |
xingming | varchar(200) | 姓名 |
5.1登陆功能介绍
管理员登录功能是系统中一个非常重要的功能模块。这个函数模块需要做的第一件事是设计系统的安全性。不能说任何打开登录界面的人都可以进入系统。我们想控制管理。成员的账号和密码,只有拥有权限的教师、学生才能通过这个登录界面进入系统界面,这是非常重要的。教师、学生想要登录和使用系统首先进入登录账户和登录密码,然后我们使用程序来检索,检索数据库中的账户信息一致输入账号密码,如果输入学号信息让学生登录时,如果它不存在,给一个提示,非法登陆,所以这个功能模块是非常重要的。如图5-1所示。
5.2管理员功能模块
管理员通过后台登录窗口进行输入自己的账号、密码、验证码等信息,进行登录,如图5-1所示。
图5-1管理员登录界面
管理员对个人中心进行操作填写原密码、新密码、确认密码并进行添加、删除、修改以及查看。,如图5-2所示。
图5-2个人中心界面
学生信息管理,管理员通过学生信息可以在线查看学号、密码、姓名、性别、头像、院校、班级、手机等信息,进行详情或修改、删除操作,如图5-3所示。
图5-3学生信息管理界面
教师管理,管理员通过教师管理可以在线查看工号、密码、 姓名、性别、头像、学院、班级、电话等信息,进行查看或修改、删除操作,如图5-4所示。
图5-4教师管理界面
5.3教师后台功能模块
教师通过后台登录窗口进行输入自己的账号、密码、验证码等信息,进行登录,如图5-5所示。
图5-5教师登陆界面
个人信息:通过在个人资料管理页面通过查看工号、密码、 姓名、性别、头像、学院、班级、电话可进行查看进行修改、删除等 ,如图5-6所示。
图5-6个人信息界面
试卷管理:教师通过列表可以获取试卷名称、考试时长(分钟)、试卷状态,进行查看添加、修改等信息操作,如图5-7所示。
图5-7试卷管理界面
试题管理:教师通过列表可以获取试卷、试题名称、分值、答案、类型等信息,进行添加、修改、查看等信息操作,如图5-8所示。
图5-8试题管理界面
考试管理:教师通过考试信息列表可以获取选择试卷、试题、类型、选项、答案/分数等信息,进行添加、修改、删除查看等信息操作,如图5-9所示。
图5-9考试管理界面
5.4学生功能模块
学生通过后台登录窗口进行输入自己的账号、密码等信息,进行登录,如图5-10所示。
图5-10学生登录界面
问题发布管理,学生通过问题发布管理可以在线查看标题、题目、发布时间、学号、姓名、答案进行详情并添加/修改、删除操作,如图5-11所示。
图5-11问题发布信息界面
疑难解答管理,学生通过疑难解答管理可以在线查看标题、题目、答案、发布时间、学号、姓名、审核回复等信息,进行查看查看提问操作,如图5-12所示。
图5-12疑难解答界面
考试管理,学生通过考试管理可以在线进行考试/查看答案等等操作,如图5-13所示。
图5-13考试管理界面图
第6章 系统测试
UserServiceImpl.java
package com.service.impl;
import java.util.List;
import java.util.Map;
import org.springframework.stereotype.Service;
import com.baomidou.mybatisplus.mapper.EntityWrapper;
import com.baomidou.mybatisplus.mapper.Wrapper;
import com.baomidou.mybatisplus.plugins.Page;
import com.baomidou.mybatisplus.service.impl.ServiceImpl;
import com.dao.UserDao;
import com.entity.UserEntity;
import com.service.UserService;
import com.utils.PageUtils;
import com.utils.Query;
/**
* 系统用户
* @author yangliyuan
* @date 2019年10月10日 上午9:17:59
*/
@Service("userService")
public class UserServiceImpl extends ServiceImpl<UserDao, UserEntity> implements UserService {
@Override
public PageUtils queryPage(Map<String, Object> params) {
Page<UserEntity> page = this.selectPage(
new Query<UserEntity>(params).getPage(),
new EntityWrapper<UserEntity>()
);
return new PageUtils(page);
}
@Override
public List<UserEntity> selectListView(Wrapper<UserEntity> wrapper) {
return baseMapper.selectListView(wrapper);
}
@Override
public PageUtils queryPage(Map<String, Object> params,
Wrapper<UserEntity> wrapper) {
Page<UserEntity> page =new Query<UserEntity>(params).getPage();
page.setRecords(baseMapper.selectListView(page,wrapper));
PageUtils pageUtil = new PageUtils(page);
return pageUtil;
}
}
JiaoshiServiceImpl.java
package com.service.impl;
import org.springframework.stereotype.Service;
import java.util.Map;
import java.util.List;
import com.baomidou.mybatisplus.mapper.Wrapper;
import com.baomidou.mybatisplus.mapper.EntityWrapper;
import com.baomidou.mybatisplus.plugins.Page;
import com.baomidou.mybatisplus.service.impl.ServiceImpl;
import com.utils.PageUtils;
import com.utils.Query;
import com.dao.JiaoshiDao;
import com.entity.JiaoshiEntity;
import com.service.JiaoshiService;
import com.entity.vo.JiaoshiVO;
import com.entity.view.JiaoshiView;
@Service("jiaoshiService")
public class JiaoshiServiceImpl extends ServiceImpl<JiaoshiDao, JiaoshiEntity> implements JiaoshiService {
@Override
public PageUtils queryPage(Map<String, Object> params) {
Page<JiaoshiEntity> page = this.selectPage(
new Query<JiaoshiEntity>(params).getPage(),
new EntityWrapper<JiaoshiEntity>()
);
return new PageUtils(page);
}
@Override
public PageUtils queryPage(Map<String, Object> params, Wrapper<JiaoshiEntity> wrapper) {
Page<JiaoshiView> page =new Query<JiaoshiView>(params).getPage();
page.setRecords(baseMapper.selectListView(page,wrapper));
PageUtils pageUtil = new PageUtils(page);
return pageUtil;
}
@Override
public List<JiaoshiVO> selectListVO(Wrapper<JiaoshiEntity> wrapper) {
return baseMapper.selectListVO(wrapper);
}
@Override
public JiaoshiVO selectVO(Wrapper<JiaoshiEntity> wrapper) {
return baseMapper.selectVO(wrapper);
}
@Override
public List<JiaoshiView> selectListView(Wrapper<JiaoshiEntity> wrapper) {
return baseMapper.selectListView(wrapper);
}
@Override
public JiaoshiView selectView(Wrapper<JiaoshiEntity> wrapper) {
return baseMapper.selectView(wrapper);
}
}
MybatisPlusConfig.java
package com.config;
import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import com.baomidou.mybatisplus.mapper.MetaObjectHandler;
import com.baomidou.mybatisplus.plugins.PaginationInterceptor;
/**
* mybatis-plus配置
* @author yangliyuan
* @date 2019年6月25日 上午10:41:15
*/
@Configuration
public class MybatisPlusConfig {
/**
* 分页插件
*/
@Bean
public PaginationInterceptor paginationInterceptor() {
return new PaginationInterceptor();
}
}
update-password.vue
<template>
<div>
<el-form
class="detail-form-content"
ref="ruleForm"
:rules="rules"
:model="ruleForm"
label-width="80px"
>
<el-form-item label="原密码" prop="password">
<el-input v-model="ruleForm.password"></el-input>
</el-form-item>
<el-form-item label="新密码" prop="newpassword">
<el-input v-model="ruleForm.newpassword"></el-input>
</el-form-item>
<el-form-item label="确认密码" prop="repassword">
<el-input v-model="ruleForm.repassword"></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="onUpdateHandler">确 定</el-button>
</el-form-item>
</el-form>
</div>
</template>
<script>
export default {
data() {
return {
dialogVisible: false,
ruleForm: {},
user: {},
rules: {
password: [
{
required: true,
message: "密码不能为空",
trigger: "blur"
}
],
newpassword: [
{
required: true,
message: "新密码不能为空",
trigger: "blur"
}
],
repassword: [
{
required: true,
message: "确认密码不能为空",
trigger: "blur"
}
]
}
};
},
mounted() {
this.$http({
url: `${this.$storage.get("sessionTable")}/session`,
method: "get"
}).then(({ data }) => {
if (data && data.code === 0) {
this.user = data.data;
} else {
this.$message.error(data.msg);
}
});
},
methods: {
onLogout() {
this.$storage.remove("Token");
this.$router.replace({ name: "login" });
},
// 修改密码
onUpdateHandler() {
this.$refs["ruleForm"].validate(valid => {
if (valid) {
var password = "";
if (this.user.mima) {
password = this.user.mima;
} else if (this.user.password) {
password = this.user.password;
}
if (this.ruleForm.password != password) {
this.$message.error("原密码错误");
return;
}
if (this.ruleForm.newpassword != this.ruleForm.repassword) {
this.$message.error("两次密码输入不一致");
return;
}
this.user.password = this.ruleForm.newpassword;
this.user.mima = this.ruleForm.newpassword;
this.$http({
url: `${this.$storage.get("sessionTable")}/update`,
method: "post",
data: this.user
}).then(({ data }) => {
if (data && data.code === 0) {
this.$message({
message: "修改密码成功,下次登录系统生效",
type: "success",
duration: 1500,
onClose: () => {
}
});
} else {
this.$message.error(data.msg);
}
});
}
});
}
}
};
</script>
<style lang="scss" scoped>
</style>