Merge pull request '宋文倩代码' (#2) from develop into master

master
19833906703 2 years ago
commit 160edcabab

@ -0,0 +1,51 @@
package com.config;
import com.domain.user;
import com.service.userService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.security.core.GrantedAuthority;
import org.springframework.security.core.authority.SimpleGrantedAuthority;
import org.springframework.security.core.userdetails.UserDetails;
import org.springframework.security.core.userdetails.UserDetailsService;
import org.springframework.security.core.userdetails.UsernameNotFoundException;
import org.springframework.security.crypto.password.PasswordEncoder;
import org.springframework.stereotype.Service;
import java.util.ArrayList;
import java.util.Collection;
@Service
public class UserService implements UserDetailsService {
@Autowired
public com.service.userService userService;
@Autowired(required = false)
private PasswordEncoder passwordEncoder;
@Override
public UserDetails loadUserByUsername(String username) throws UsernameNotFoundException {
// 根据用户查询用户信息
//User user = userMapper.findByUsername(username); //查询数据库
// user user = new user(1, username, "123456", 1);//注意:这里我就是用来测试的,实际应该从数据库中获取
user user=userService.selectByUserName(username);
if (user != null) {
// 根据用户查询用户对应权限
Collection<GrantedAuthority> authorities = new ArrayList<>();
/* //查询登录用户所拥有的角色
List<Role> list = RoleMapper.findByUserId(userId);
for (Role role : list) {
GrantedAuthority authority = new SimpleGrantedAuthority("ROLE_"+role.getRoleName());
authorities.add(authority);
}
*/
//创建一个授权对象
GrantedAuthority authority = new SimpleGrantedAuthority("ROLE_ADMIN"); //注意:这里我就是用来测试的,实际应该从数据库中获取
authorities.add(authority);
return new org.springframework.security.core.userdetails.User(
user.getUsername(),
// 因为数据库是明文,所以这里需加密密码
passwordEncoder.encode(user.getPassword()),
authorities);
}
return null;
}
}

@ -0,0 +1,96 @@
package com.config;
import com.fasterxml.jackson.databind.ObjectMapper;
import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.security.config.annotation.authentication.builders.AuthenticationManagerBuilder;
import org.springframework.security.config.annotation.web.builders.HttpSecurity;
import org.springframework.security.config.annotation.web.configuration.WebSecurityConfigurerAdapter;
import org.springframework.security.core.Authentication;
import org.springframework.security.core.AuthenticationException;
import org.springframework.security.core.userdetails.UserDetailsService;
import org.springframework.security.crypto.bcrypt.BCryptPasswordEncoder;
import org.springframework.security.crypto.password.PasswordEncoder;
import org.springframework.security.web.authentication.SimpleUrlAuthenticationFailureHandler;
import org.springframework.security.web.authentication.SimpleUrlAuthenticationSuccessHandler;
import javax.servlet.ServletException;
import javax.servlet.ServletOutputStream;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
@Configuration
public class WebSecurityConfig extends WebSecurityConfigurerAdapter {
@Bean
public UserDetailsService getUserService() {
return new UserService();
}
@Bean
public PasswordEncoder passwordEncoder() {
return new BCryptPasswordEncoder();
}
@Override
protected void configure(AuthenticationManagerBuilder auth) throws Exception {
auth.userDetailsService(getUserService()).passwordEncoder(passwordEncoder());
}
@Override
protected void configure(HttpSecurity http) throws Exception {
http.authorizeRequests()
.antMatchers( "/pages/login.html","/img/*","/plugins/**","/css/*","/js/*","/dist/**","/pages/regist.html","/user/Save").permitAll()// 无需认证
.anyRequest().authenticated() // 所有请求都需要验证
.and()
.headers().frameOptions().disable()
.and()
.formLogin() // 使用默认的登录页面
.loginPage("/pages/login.html")// 指定指定要的登录页面
.loginProcessingUrl("/login")// 处理认证路径的请求
//认证成功后的跳转页面 默认是get方式提交 自定义成功页面post方式提交
//在 controller中处理时要注意
// .defaultSuccessUrl("/pages/main.html")
// .failureForwardUrl("/pages/error.html")
.successHandler(new SimpleUrlAuthenticationSuccessHandler() {
@Override
public void onAuthenticationSuccess(HttpServletRequest httpServletRequest, HttpServletResponse httpServletResponse, Authentication authentication) throws IOException, ServletException {
httpServletResponse.setContentType("application/json;charset=utf-8");
ServletOutputStream out = httpServletResponse.getOutputStream();
ObjectMapper objectMapper = new ObjectMapper();
objectMapper.writeValue(out, "登录成功");
out.flush();
out.close();
}
}).failureHandler(new SimpleUrlAuthenticationFailureHandler() {
@Override
public void onAuthenticationFailure(HttpServletRequest httpServletRequest, HttpServletResponse httpServletResponse, AuthenticationException e) throws IOException, ServletException {
httpServletResponse.setContentType("application/json;charset=utf-8");
ServletOutputStream out = httpServletResponse.getOutputStream();
ObjectMapper objectMapper = new ObjectMapper();
objectMapper.writeValue(out, "登录失败");
out.flush();
out.close();
}
})
.and()
//开启cookie保存用户数据
// .rememberMe()
//设置cookie有效期
// .tokenValiditySeconds(60 * 60 * 24 * 7) //有效期一周
//设置cookie的私钥
// .key("")
// .and()
.logout()
.logoutUrl("/logout")
.logoutSuccessUrl("/pages/login.html")
// .invalidateHttpSession(true)
.and()
// .headers().frameOptions().disable().and()
.csrf().disable() //关闭跨域保护
.sessionManagement()
.maximumSessions(1);// 同一用户 只允许一个在线 自动踢出在线用户
}
}

@ -0,0 +1,224 @@
<!DOCTYPE html>
<html>
<head>
<!-- 页面meta -->
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>心理测评系统</title>
<meta content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no" name="viewport">
<!-- 引入样式 -->
<link rel="stylesheet" href="../plugins/elementui/index.css">
<link rel="stylesheet" href="../plugins/font-awesome/css/font-awesome.min.css">
<link rel="stylesheet" href="../css/style.css">
</head>
<body class="hold-transition">
<div id="app">
<div class="content-header">
<h1>用户模块<small>测试详情</small></h1>
<el-breadcrumb separator-class="el-icon-arrow-right" class="breadcrumb">
<el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
<el-breadcrumb-item>用户模块</el-breadcrumb-item>
<el-breadcrumb-item>测试详情</el-breadcrumb-item>
</el-breadcrumb>
</div>
<div class="app-container">
<div class="box">
<div style="width: 80%;margin: 0 auto">
<div v-for="item in dataList">
<h3><span>{{item.xuhao}}:</span>{{item.them}}</h3>
<el-radio-group v-model="item.da" >
<el-radio :label="item.one">A:{{item.one}}</el-radio>
<el-radio :label="item.two">B:{{item.two}}</el-radio>
<el-radio :label="item.three">C:{{item.three}}</el-radio>
<el-radio :label="item.four">D:{{item.four}}</el-radio>
</el-radio-group>
<div style="margin-top: 30px">
<span>得分:</span><span>{{item.fen}}分</span><span style="margin-left: 10px">正确答案:</span><span>{{item.ok}}</span>
<span style="margin-left: 10px">
<span>正确性:</span>
<img src="../img/错误.svg" v-if="item.fen==0" style="width: 20px">
<img src="../img/正确.svg" v-else style="width: 20px">
</span>
</div>
<hr>
</div>
</div>
</div>
</div>
</div>
</body>
<!-- 引入组件库 -->
<script src="../js/vue.js"></script>
<script src="../plugins/elementui/index.js"></script>
<script type="text/javascript" src="../js/jquery.min.js"></script>
<script src="../js/axios-0.18.0.js"></script>
<script>
var vue = new Vue({
el: '#app',
data:{
pagination: {//分页相关模型数据
currentPage: 1,//当前页码
pageSize:10,//每页显示的记录数
total:0,//总记录数
queryString:""//查询条件
},
dataList: [],//当前页要展示的分页列表数据
formData: {},//表单数据
dialogFormVisible: false,//增加表单是否可见
dialogFormVisible4Edit:false,//编辑表单是否可见
rules: {//校验规则
xuhao: [{ required: true, message: '题号为必填项', trigger: 'blur' }],
them: [{ required: true, message: '题目为必填项', trigger: 'blur' }],
one:[{ required: true, message: '选项A为必填项', trigger: 'blur' }],
two:[{ required: true, message: '选项B为必填项', trigger: 'blur' }],
three:[{ required: true, message: '选项C为必填项', trigger: 'blur' }],
four:[{ required: true, message: '选项D为必填项', trigger: 'blur' }],
ok:[{ required: true, message: '正确答案为必填项', trigger: 'blur' }],
},
options: [{
value: 1,
label: '用户'
},
{
value: 0,
label: '管理员'
}]
},
//钩子函数VUE对象初始化完成后自动执行
created(){
this.findPage();
},
methods:{
//编辑
handleEdit() {
//表单校验
this.$refs['dataEditForm'].validate((valid)=>{
if(valid){
//表单校验通过,发送请求
axios.put("/timu/Update",this.formData).then((response)=> {
this.dialogFormVisible4Edit = false;
this.$message({
message: "修改成功",
type: 'success'
});
}).finally(()=> {
//重新发送请求查询分页数据
this.findPage();
});
}else{
//表单校验失败
this.$message.error("表单数据校验失败");
return false;
}
});
},
//添加
handleAdd () {
let ji=0;
let userId=localStorage.getItem("userId");
this.dataList.forEach(function (e) {
if(e.da==null)
{
ji++;
}
});
if(ji>0)
{
this.$message.error("还存在未填写的题目");
}
else
{
this.dataList.forEach(function (e) {
e.userId=userId;
})
//表单数据校验通过发送ajax请求将表单数据提交到后台
axios.post("/ut/Save",this.dataList).then((response)=> {
//隐藏新增窗口
this.dialogFormVisible = false;
this.$message({
message: "答题成功",
type: 'success'
});
}).finally(()=> {
// this.findPage();
});
}
},
// 重置表单
resetForm() {
this.formData = {};
},
// 弹出添加窗口
handleCreate() {
this.resetForm();
this.dialogFormVisible = true;
},
// 弹出编辑窗口
handleUpdate(row) {
//发送请求获取检查项信息
axios.get("/timu/findById/" + row.id).then((res)=>{
//设置编辑窗口属性dialogFormVisible4Edit为true表示显示
this.dialogFormVisible4Edit = true;
//为模型数据设置值基于VUE双向数据绑定回显到页面
this.formData = res.data;
});
},
//切换页码
handleCurrentChange(currentPage) {
//currentPage为切换后的页码
this.pagination.currentPage = currentPage;
this.findPage();
},
//切换每页显示条数
handleSizeChange(pageSize){
this.pagination.pageSize =pageSize;
this.findPage();
},
// 删除
handleDelete(row) {
//alert(row.id);
this.$confirm("确认删除吗?","提示",{type:'warning'}).then(()=>{
//点击确定按钮时只需此处代码
//alert('用户点击的是确定按钮');
axios.delete("/timu/Delete/" + row.id).then((res)=> {
this.$message({
message: "删除成功",
type: 'success'
});
//调用分页,获取最新分页数据
this.findPage();
});
});
},
//分页查询
findPage() {
let mokuaiId=localStorage.getItem("mokuaiId");
let userId=localStorage.getItem("userId");
axios.get("/ut/selectDetails/"+userId+"/"+mokuaiId).then((response)=> {
this.dataList = response.data;
});
},
}
})
</script>
</html>

@ -0,0 +1,195 @@
.bg-primary {
background-color: #3F52E3 !important;
}
.text-primary {
color: #3F52E3 !important;
}
a {
color: #3F52E3;
}
a:hover {
color: #2d3db8;
}
.btn-primary {
background-color: #3F52E3;
border-color: transparent !important;
}
.btn-primary:focus,
.btn-primary:focus:active,
.btn-primary:active,
.btn-primary:hover {
background-color: #2d3db8 !important;
}
.btn-primary.disabled, .btn-primary:disabled {
background-color: #3F52E3;
border-color: #3F52E3;
}
.btn-outline-primary {
color: #3F52E3;
background-color: transparent;
background-image: none;
border-color: #3F52E3;
}
.btn-outline-primary:hover {
color: #fff;
background-color: #3F52E3;
border-color: #3F52E3;
}
.btn-outline-primary.disabled, .btn-outline-primary:disabled {
color: #3F52E3;
background-color: transparent;
}
.btn-outline-primary:not([disabled]):not(.disabled):active, .btn-outline-primary:not([disabled]):not(.disabled).active,
.show > .btn-outline-primary.dropdown-toggle {
color: #fff;
background-color: #3F52E3;
border-color: #3F52E3;
}
.btn-link {
font-weight: 400;
color: #3F52E3;
background-color: transparent;
}
.btn-link:hover {
color: #2d3db8;
}
.dropdown-item.active, .dropdown-item:active {
color: #fff;
background-color: #3F52E3;
}
.custom-control-input:checked ~ .custom-control-label::before {
color: #fff;
background-color: #3F52E3;
}
.custom-checkbox .custom-control-input:checked ~ .custom-control-label::before {
background-color: #3F52E3;
}
.custom-checkbox .custom-control-input:indeterminate ~ .custom-control-label::before {
background-color: #3F52E3;
}
.custom-radio .custom-control-input:checked ~ .custom-control-label::before {
background-color: #3F52E3;
}
.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
color: #fff;
background-color: #3F52E3;
}
.page-link {
color: #3F52E3;
background-color: #fff;
border: 1px solid #ededed;
}
.page-item.active .page-link {
color: #fff;
background-color: #3F52E3;
border-color: #3F52E3;
}
.page-link:focus, .page-link:hover {
color: #2d3db8;
}
.badge-primary {
color: #fff;
background-color: #3F52E3;
}
.progress-bar {
color: #fff;
background-color: #3F52E3;
}
.list-group-item.active {
color: #fff;
background-color: #3F52E3;
border-color: #3F52E3;
}
.bg-primary {
background-color: #3F52E3 !important;
}
.border-primary {
border-color: #3F52E3 !important;
}
.text-primary {
color: #3F52E3 !important;
}
.navbar.active {
background-color: #3F52E3;
}
.navbar-bg {
background-color: #3F52E3;
}
.form-control:focus {
border-color: #3F52E3;
}
.main-sidebar .sidebar-menu li.active a {
background-color: #f9f9f9;
color: #3F52E3;
}
.main-sidebar .sidebar-menu li ul.menu-dropdown li a:hover {
color: #3F52E3;
}
.main-sidebar .sidebar-menu li ul.menu-dropdown li.active a {
color: #3F52E3;
}
.alert.alert-primary {
background-color: #3F52E3;
}
.card.card-primary {
border-top: 2px solid #3F52E3;
}
.fc button.fc-state-active {
background-color: #3F52E3;
color: #fff;
}
.jqvmap-circle {
background-color: #3F52E3;
border: 1px solid #000;
}
.weather ul li {
border: 2px solid #3F52E3;
color: #3F52E3;
}
.card-chat .chat-content .chat-item.chat-right .chat-details .chat-text {
background-color: #3F52E3;
color: #fff;
}
.nav-tabs .nav-item .nav-link {
color: #3F52E3;
}
.nav-pills .nav-item .nav-link {
color: #3F52E3;
}
.swal-button.swal-button--confirm {
background-color: #3F52E3;
}
.page-item .page-link {
color: #3F52E3;
}
.page-item.active .page-link {
background-color: #3F52E3;
border-color: #3F52E3;
}
.btn-group .btn.active {
background-color: #3F52E3;
color: #fff;
}
.media .media-right {
color: #3F52E3;
}
.selectric-items li.selected,
.selectric-items li.highlighted {
background-color: #3F52E3;
color: #fff;
}
.dropzone {
border: 2px dashed #3F52E3;
}
.accordion .accordion-header[aria-expanded="true"] {
background-color: #3F52E3;
color: #fff;
}
.bootstrap-tagsinput .tag {
background-color: #3F52E3;
}

@ -0,0 +1,139 @@
<!DOCTYPE html>
<html>
<head>
<!-- 页面meta -->
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title></title>
<meta content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no" name="viewport">
<!-- 引入样式 -->
<link rel="stylesheet" href="../plugins/elementui/index.css">
<link rel="stylesheet" href="../plugins/font-awesome/css/font-awesome.min.css">
<link rel="stylesheet" href="../css/style.css">
</head>
<body class="hold-transition">
<div style="width:80%;margin:20px auto;background-color:white; border-radius: 5px; border: 1px solid gainsboro" id="app">
<h2 style="color:aqua;text-align: left;">交流</h2>
<hr style="margin-top: 10px;border: 0.5px solid whitesmoke"/>
<div style="width: 50%;margin: 50px auto">
<div style="margin-top: 10px;margin-bottom: 20px;color: aquamarine" v-html="content1" >
</div>
<el-input placeholder="内容" style="width: 300px;" class="filter-item" v-model="content" ></el-input>
<el-button type="primary" class="butT" @click="fa()">发送</el-button>
</div>
</div>
</body>
<!-- 引入组件库 -->
<script src="../js/vue.js"></script>
<script src="../plugins/elementui/index.js"></script>
<script type="text/javascript" src="../js/jquery.min.js"></script>
<script src="../js/axios-0.18.0.js"></script>
<script>
var vue = new Vue({
el: '#app',
data:{
userId:null,
userId1:null,
content:"",
content1:"",
userName:""
},
//钩子函数VUE对象初始化完成后自动执行
created(){
this.findPage();
let timer = setInterval(() => {
this.findPage();
},100)
},
methods:{
// 弹出添加窗口
handleCreate(val) {
this.isShow=true;
this.userId1=val;
let form={"one":this.userId,"two":this.userId1};
axios.post("/liaotian/Select",form).then((response)=> {
this.content1=response.data;
}).finally(()=> {
});
},
findPage() {
this.userId1=localStorage.getItem("userId1");
this.userId=localStorage.getItem("userId");
this.userName= localStorage.getItem("username");
let form={"one":this.userId,"two":this.userId1};
axios.post("/liaotian/Select",form).then((response)=> {
this.content1=response.data;
}).finally(()=> {
});
},
fa()
{
this.content="<div style=\"margin-top: 10px\">"+this.userName+"说:"+this.content+"</div>";
let form={"one":this.userId,"two":this.userId1,"content":this.content};
axios.post("/liaotian/Save",form).then((response)=> {
this.$message({
message: "发送成功",
type: 'success'
});
}).finally(()=> {
this.content="";
let form={"one":this.userId,"two":this.userId1};
axios.post("/liaotian/Select",form).then((response)=> {
this.content1=response.data;
}).finally(()=> {
});
});
},
shua()
{
let form={"one":this.userId,"two":this.userId1};
axios.post("/liaotian/Select",form).then((response)=> {
this.content1=response.data;
}).finally(()=> {
});
}
}
})
</script>
</html>

@ -0,0 +1,18 @@
package com.config;
import com.baomidou.mybatisplus.extension.plugins.MybatisPlusInterceptor;
import com.baomidou.mybatisplus.extension.plugins.inner.PaginationInnerInterceptor;
import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
@Configuration
public class myConfig {
@Bean
public MybatisPlusInterceptor mybatisPlusInterceptor()
{
MybatisPlusInterceptor mybatisPlusInterceptor=new MybatisPlusInterceptor();
mybatisPlusInterceptor.addInnerInterceptor(new PaginationInnerInterceptor());
return mybatisPlusInterceptor;
}
}

@ -0,0 +1,319 @@
.ordersetting .el-input__inner {
height: 36px;
line-height: 36px;
}
.ordersetting {
background: #f5f5f5;
box-shadow: none;
border-top: none;
}
.gotoday {
border: 1px solid #d5d9df
}
.calendar p {
margin: 0;
}
.filebtn {
padding: 9px 20px;
border: none;
font-size: 18px;
background: #0ebffc;
}
.month {
width: 100%;
line-height: 3;
/* background: #00B8EC; */
}
.month ul {
margin: 0;
padding: 0;
display: flex;
}
.year-month {
display: flex;
flex-direction: column;
align-items: center;
justify-content: space-around;
}
.year-month:hover {
background: rgba(150, 2, 12, 0.1);
}
.choose-year {
padding-left: 20px;
font-size: 1.2rem;
}
.choose-month {
text-align: center;
font-size: 1.2rem;
}
.arrow {
padding: 30px;
}
.arrow:hover {
background: rgba(100, 2, 12, 0.1);
}
.month ul li {
color: white;
font-size: 20px;
text-transform: uppercase;
letter-spacing: 3px;
}
.caldate {
box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.1), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
}
.weekdays {
margin: 0;
padding: 0;
background-color: #fff;
display: flex;
flex-wrap: wrap;
color: #333;
justify-content: space-around;
border-bottom: 1px solid #ededed;
border-top: 2px solid #0ebffc;
}
.weekdays li {
display: inline-block;
width: 14%;
text-align: center;
padding: 10px 0;
border-right: 1px solid #f1efef;
color: #000;
font-size: 20px;
}
.days {
padding: 0;
margin: 0;
display: flex;
flex-wrap: wrap;
justify-content: space-around;
}
.days li {
height: 160px;
list-style-type: none;
display: inline-block;
width: 14%;
text-align: right;
font-size: 1rem;
color: #000;
list-style-type: none;
display: inline-block;
width: 14.2%;
font-size: 1rem;
color: #000;
border-bottom: 1px solid #fff;
}
.everyday {
height: 160px;
border-bottom: 1px solid #f1efefef;
position: relative;
background: #fff;
}
.everyday .datenumber {
position: absolute;
right: 10px;
top: 10px;
}
.everyday .usual {
height: 100%;
background: #1ed7fc;
text-align: center;
color: #fff;
display: flex;
flex-direction: column;
justify-content: center;
font-size: 20px;
line-height: 1.5;
}
.everyday .fulled {
height: 100%;
background: #ff9c9d;
text-align: center;
color: #fff;
display: flex;
flex-direction: column;
justify-content: center;
font-size: 20px;
}
.everyday .nochoose {
height: 100%;
background: #effbff;
}
.everyday .orderbtn {
position: absolute;
right: 10px;
bottom: 10px;
cursor: pointer;
border: none;
background: #d6ffff;
padding: 3px 10px;
color: #0ebffc;
border-radius: 4px;
font-size: 16px;
}
.days li .active {
padding: 6px 10px;
border-radius: 50%;
background: #00B8EC;
color: #fff;
}
.days li .other-month {
padding: 10px;
height: 140px;
color: gainsboro;
background: #f9f9f9;
}
/* .singlebtn {
font-size: 18px;
}
.mutiplebtn {
font-size: 18px;
} */
.filebox {
position: relative;
}
.el-card__body {
position: relative;
}
.el-upload--text {
position: absolute;
left: 22%;
top: 14px;
}
.el-upload--text .el-button {
background: #0ebffc;
border: none
}
.el-upload-list {
width: 20%;
}
.filebtns {
position: relative
}
.multifile {
width: 100%;
}
.mutibtn {
position: absolute;
left: 12%;
top: 0;
}
.uploadfile{
padding: 4px 10px;
height: 20px;
line-height: 20px;
position: relative;
border: 1px solid #999;
text-decoration: none;
color: #666;
}
.change{
position: absolute;
overflow: hidden;
right: 0;
top: 0;
opacity: 0;
}
.singleuploaded {
}
.mutiuploaded {
left: 31.5%;
}
.outputloaded {
left: 43%;
}
.inputfile-text {
height: 33px;
width: 233px;
display: inline-block;
border: 1px solid #ccc;
line-height: 36px;
border-radius: 7px;
cursor: pointer;
}
.inputfile-text span {
padding-left: 11px;
color: #aba7a7;
}
.days li .current-month .full {
background: #ff8a8a;
text-align: center;
line-height: 100px;
color: #fff;
}
.days li .current-month .full .full-text {
font-size: 26px;
}
.clearfix {clear: both}
.month .currentdate { float: left}
.month .choose {
float: right;
line-height: 57px;
padding-right: 30px;
color: #676767
}
.month .choose span {
background: #fff;
padding: 5px 10px;
cursor: pointer;
}
/* upload */
.file {
display: flex;
width: 60px;
height: 33px;
overflow: hidden;
border: 1px solid #ccc;
width: 20%;
margin-top: -4px;
border-radius: 7px;
position: relative;
}
.file .defaulttext {
position: absolute;
top: 5px;
left: 10px;
color: #bdbdbd;
}
.file input {
width: 100%;
height: 40px;
position: relative;
top: -10px;
font-size: 0;
opacity: 0;
cursor: pointer;
}
.el-card__body #span {
font-size: 14px;
padding-left: 20px;
color: #555;
margin-top: 10px;
display: block;
width: 20%;
}

@ -0,0 +1,55 @@
package com.domain;
import com.baomidou.mybatisplus.annotation.IdType;
import com.baomidou.mybatisplus.annotation.TableField;
import com.baomidou.mybatisplus.annotation.TableId;
import com.baomidou.mybatisplus.annotation.TableName;
@TableName("user")
public class user {
@TableId(type= IdType.AUTO)
private int id;
@TableField("username")
private String username;
public int getId() {
return id;
}
public void setId(int id) {
this.id = id;
}
public String getUsername() {
return username;
}
public void setUsername(String username) {
this.username = username;
}
public String getPassword() {
return password;
}
public void setPassword(String password) {
this.password = password;
}
public int getType() {
return type;
}
public void setType(int type) {
this.type = type;
}
@TableField("password")
private String password;
@TableField("type")
private int type;
}

@ -0,0 +1,323 @@
<!DOCTYPE html>
<html>
<head>
<!-- 页面meta -->
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>聊天</title>
<meta content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no" name="viewport">
<!-- 引入样式 -->
<link rel="stylesheet" href="../plugins/elementui/index.css">
<link rel="stylesheet" href="../plugins/font-awesome/css/font-awesome.min.css">
<link rel="stylesheet" href="../css/style.css">
</head>
<body class="hold-transition">
<div id="app">
<div class="content-header">
<h1>聊天模块<small>选择用户</small></h1>
<el-breadcrumb separator-class="el-icon-arrow-right" class="breadcrumb">
<el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
<el-breadcrumb-item>聊天模块</el-breadcrumb-item>
<el-breadcrumb-item>选择用户</el-breadcrumb-item>
</el-breadcrumb>
</div>
<div class="app-container">
<div class="box">
<div class="filter-container">
<el-input placeholder="用户名" v-model="pagination.queryString" style="width: 200px;" class="filter-item"></el-input>
<el-button @click="findPage()" class="dalfBut">查询</el-button>
</div>
<el-table size="small" current-row-key="id" :data="dataList" stripe highlight-current-row>
<el-table-column type="index" align="center" label="序号"></el-table-column>
<el-table-column prop="username" label="用户名" align="center"></el-table-column>
<el-table-column prop="password" label="密码" align="center"></el-table-column>
<el-table-column label="角色" align="center">
<template slot-scope="scope">
<span>{{ scope.row.type == '0' ? '管理员' : '用户'}}</span>
</template>
</el-table-column>
<el-table-column label="操作" align="center">
<template slot-scope="scope">
<el-button type="primary" size="mini" @click="handleUpdate(scope.row)">聊天</el-button>
</template>
</el-table-column>
</el-table>
<div class="pagination-container">
<el-pagination
class="pagiantion"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="pagination.currentPage"
:page-sizes="[10, 20, 30, 40]"
:page-size="pagination.pageSize"
layout="total, sizes,prev, pager, next, jumper"
:total="pagination.total">
</el-pagination>
</div>
<!-- 新增标签弹层 -->
<div class="add-form">
<el-dialog title="新增用户" :visible.sync="dialogFormVisible">
<el-form ref="dataAddForm" :model="formData" :rules="rules" label-position="right" label-width="100px">
<el-row>
<el-col :span="12">
<el-form-item label="用户名" prop="username">
<el-input v-model="formData.username"/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="密码" prop="password">
<el-input v-model="formData.password"/>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="角色" prop="type">
<el-select v-model="formData.type" placeholder="请选择角色">
<el-option
v-for="item in options"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="dialogFormVisible = false">取消</el-button>
<el-button type="primary" @click="handleAdd()">确定</el-button>
</div>
</el-dialog>
</div>
<!-- 编辑标签弹层 -->
<div class="add-form">
<el-dialog title="编辑用户" :visible.sync="dialogFormVisible4Edit">
<el-form ref="dataEditForm" :model="formData" :rules="rules" label-position="right" label-width="100px">
<el-row>
<el-col :span="12">
<el-form-item label="用户名" prop="username">
<el-input v-model="formData.username"/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="密码" prop="password">
<el-input v-model="formData.password"/>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="角色" prop="type">
<el-select v-model="formData.type" placeholder="请选择角色">
<el-option
v-for="item in options"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="dialogFormVisible4Edit = false">取消</el-button>
<el-button type="primary" @click="handleEdit()">确定</el-button>
</div>
</el-dialog>
</div>
</div>
</div>
</div>
</body>
<!-- 引入组件库 -->
<script src="../js/vue.js"></script>
<script src="../plugins/elementui/index.js"></script>
<script type="text/javascript" src="../js/jquery.min.js"></script>
<script src="../js/axios-0.18.0.js"></script>
<script>
var vue = new Vue({
el: '#app',
data:{
pagination: {//分页相关模型数据
currentPage: 1,//当前页码
pageSize:10,//每页显示的记录数
total:0,//总记录数
queryString:""//查询条件
},
dataList: [],//当前页要展示的分页列表数据
formData: {},//表单数据
dialogFormVisible: false,//增加表单是否可见
dialogFormVisible4Edit:false,//编辑表单是否可见
rules: {//校验规则
username: [{ required: true, message: '用户名为必填项', trigger: 'blur' }],
password: [{ required: true, message: '密码为必填项', trigger: 'blur' }],
type:[{ required: true, message: '角色为必选项', trigger: 'blur' }],
idCard:[{ required: true, message: '身份证号必填项', trigger: 'blur' }]
},
options: [{
value: 1,
label: '用户'
},
{
value: 0,
label: '管理员'
}]
},
//钩子函数VUE对象初始化完成后自动执行
created(){
this.findPage();
},
methods:{
//编辑
handleEdit() {
//表单校验
this.$refs['dataEditForm'].validate((valid)=>{
if(valid){
//表单校验通过,发送请求
axios.put("/user/Update",this.formData).then((response)=> {
this.dialogFormVisible4Edit = false;
this.$message({
message: "修改成功",
type: 'success'
});
}).finally(()=> {
//重新发送请求查询分页数据
this.findPage();
});
}else{
//表单校验失败
this.$message.error("表单数据校验失败");
return false;
}
});
},
//添加
handleAdd () {
//校验表单输入项是否合法
this.$refs['dataAddForm'].validate((valid) => {
if (valid) {
this.formData.status="拉黑";
//表单数据校验通过发送ajax请求将表单数据提交到后台
axios.post("/user/Save",this.formData).then((response)=> {
//隐藏新增窗口
this.dialogFormVisible = false;
this.$message({
message: "添加成功",
type: 'success'
});
}).finally(()=> {
this.findPage();
});
} else {
this.$message.error("表单数据校验失败");
return false;
}
});
},
// 重置表单
resetForm() {
this.formData = {};
},
// 弹出添加窗口
handleCreate() {
this.resetForm();
this.dialogFormVisible = true;
},
// 弹出编辑窗口
handleUpdate(row) {
localStorage.setItem("userId1",row.id);
window.parent.document.getElementById("f").src="liao.html";
},
//切换页码
handleCurrentChange(currentPage) {
//currentPage为切换后的页码
this.pagination.currentPage = currentPage;
this.findPage();
},
//切换每页显示条数
handleSizeChange(pageSize){
this.pagination.pageSize =pageSize;
this.findPage();
},
// 删除
handleDelete(row) {
//alert(row.id);
this.$confirm("确认删除吗?","提示",{type:'warning'}).then(()=>{
//点击确定按钮时只需此处代码
//alert('用户点击的是确定按钮');
axios.delete("/user/Delete/" + row.id).then((res)=> {
this.$message({
message: "删除成功",
type: 'success'
});
//调用分页,获取最新分页数据
this.findPage();
});
});
},
//分页查询
findPage() {
let userId=localStorage.getItem("userId");
param="?username="+this.pagination.queryString+"&id="+userId;//查询条件
//请求后台
axios.get("/user/SelectPageStudent/"+this.pagination.pageSize+"/"+this.pagination.currentPage+param).then((response)=> {
this.dataList = response.data.rows;
this.pagination.total = response.data.total;
});
},
c(row)
{
axios.get("/user/findById/" + row.id).then((res)=>{
this.formData=res.data;
if(this.formData.status=="拉黑")
{
this.formData.status="已拉黑"
}
else
{
this.formData.status="拉黑"
}
axios.put("/user/Update",this.formData).then((response)=> {
}).finally(()=> {
//重新发送请求查询分页数据
this.findPage();
});
});
}
}
})
</script>
</html>

@ -0,0 +1,46 @@
.navbar.active {
background-color: #fff;
}
.navbar-bg {
background-color: #fff;
}
.navbar .nav-link {
color: #2C2E3E;
}
.navbar .nav-link:hover {
color: #3f4257;
}
.navbar .form-inline .form-control {
background-color: #f2f2f2;
}
.navbar .form-inline .btn {
background-color: #f2f2f2;
}
.main-sidebar {
background-color: #212330;
}
.main-sidebar .sidebar-brand {
background-color: #1f202e;
}
.main-sidebar .sidebar-brand a {
color: #fff;
}
.main-sidebar .sidebar-menu li.active a {
background-color: #1f202e;
color: #fff;
}
.main-sidebar .sidebar-menu li ul.menu-dropdown li a {
color: #868e96;
}
.main-sidebar .sidebar-menu li ul.menu-dropdown li.active a {
color: #fff;
}
.main-sidebar .sidebar-menu li a:hover {
background-color: #1f202e;
}
.main-sidebar .sidebar-menu li.menu-header {
color: #3f4257;
}
.main-sidebar .sidebar-user .sidebar-user-details .user-name {
color: #ededed;
}

@ -0,0 +1,195 @@
.bg-primary {
background-color: #39065A !important;
}
.text-primary {
color: #39065A !important;
}
a {
color: #39065A;
}
a:hover {
color: #c9253d;
}
.btn-primary {
background-color: #39065A;
border-color: transparent !important;
}
.btn-primary:focus,
.btn-primary:focus:active,
.btn-primary:active,
.btn-primary:hover {
background-color: #c9253d !important;
}
.btn-primary.disabled, .btn-primary:disabled {
background-color: #39065A;
border-color: #39065A;
}
.btn-outline-primary {
color: #39065A;
background-color: transparent;
background-image: none;
border-color: #39065A;
}
.btn-outline-primary:hover {
color: #fff;
background-color: #39065A;
border-color: #39065A;
}
.btn-outline-primary.disabled, .btn-outline-primary:disabled {
color: #39065A;
background-color: transparent;
}
.btn-outline-primary:not([disabled]):not(.disabled):active, .btn-outline-primary:not([disabled]):not(.disabled).active,
.show > .btn-outline-primary.dropdown-toggle {
color: #fff;
background-color: #39065A;
border-color: #39065A;
}
.btn-link {
font-weight: 400;
color: #39065A;
background-color: transparent;
}
.btn-link:hover {
color: #c9253d;
}
.dropdown-item.active, .dropdown-item:active {
color: #fff;
background-color: #39065A;
}
.custom-control-input:checked ~ .custom-control-label::before {
color: #fff;
background-color: #39065A;
}
.custom-checkbox .custom-control-input:checked ~ .custom-control-label::before {
background-color: #39065A;
}
.custom-checkbox .custom-control-input:indeterminate ~ .custom-control-label::before {
background-color: #39065A;
}
.custom-radio .custom-control-input:checked ~ .custom-control-label::before {
background-color: #39065A;
}
.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
color: #fff;
background-color: #39065A;
}
.page-link {
color: #39065A;
background-color: #fff;
border: 1px solid #ededed;
}
.page-item.active .page-link {
color: #fff;
background-color: #39065A;
border-color: #39065A;
}
.page-link:focus, .page-link:hover {
color: #c9253d;
}
.badge-primary {
color: #fff;
background-color: #39065A;
}
.progress-bar {
color: #fff;
background-color: #39065A;
}
.list-group-item.active {
color: #fff;
background-color: #39065A;
border-color: #39065A;
}
.bg-primary {
background-color: #39065A !important;
}
.border-primary {
border-color: #39065A !important;
}
.text-primary {
color: #39065A !important;
}
.navbar.active {
background-color: #39065A;
}
.navbar-bg {
background-color: #39065A;
}
.form-control:focus {
border-color: #39065A;
}
.main-sidebar .sidebar-menu li.active a {
background-color: #f9f9f9;
color: #39065A;
}
.main-sidebar .sidebar-menu li ul.menu-dropdown li a:hover {
color: #39065A;
}
.main-sidebar .sidebar-menu li ul.menu-dropdown li.active a {
color: #39065A;
}
.alert.alert-primary {
background-color: #39065A;
}
.card.card-primary {
border-top: 2px solid #39065A;
}
.fc button.fc-state-active {
background-color: #39065A;
color: #fff;
}
.jqvmap-circle {
background-color: #39065A;
border: 1px solid #000;
}
.weather ul li {
border: 2px solid #39065A;
color: #39065A;
}
.card-chat .chat-content .chat-item.chat-right .chat-details .chat-text {
background-color: #39065A;
color: #fff;
}
.nav-tabs .nav-item .nav-link {
color: #39065A;
}
.nav-pills .nav-item .nav-link {
color: #39065A;
}
.swal-button.swal-button--confirm {
background-color: #39065A;
}
.page-item .page-link {
color: #39065A;
}
.page-item.active .page-link {
background-color: #39065A;
border-color: #39065A;
}
.btn-group .btn.active {
background-color: #39065A;
color: #fff;
}
.media .media-right {
color: #39065A;
}
.selectric-items li.selected,
.selectric-items li.highlighted {
background-color: #39065A;
color: #fff;
}
.dropzone {
border: 2px dashed #39065A;
}
.accordion .accordion-header[aria-expanded="true"] {
background-color: #39065A;
color: #fff;
}
.bootstrap-tagsinput .tag {
background-color: #39065A;
}

@ -0,0 +1,96 @@
.demo-settings {
position: fixed;
bottom: 20px;
right: 20px;
z-index: 2002;
}
.demo-settings .demo-settings-toggle {
transition: all .5s;
-webkit-transition: all .5s;
-o-transition: all .5s;
-moz-transition: all .5s;
width: 50px;
height: 50px;
border-radius: 50%;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
-ms-border-radius: 50%;
-o-border-radius: 50%;
background-color: #F73F52;
color: #fff;
box-shadow: 0 10px 30px rgba(0, 0, 0, .2);
text-align: center;
line-height: 60px;
cursor: pointer;
}
.demo-settings .demo-settings-toggle i {
font-size: 24px;
}
.demo-settings .demo-settings-options {
transition: all .5s;
-webkit-transition: all .5s;
-o-transition: all .5s;
-moz-transition: all .5s;
transition-delay: .3s;
-webkit-transition-delay: .3s;
-o-transition-delay: .3s;
-moz-transition-delay: .3s;
z-index: -1;
position: absolute;
left: -170px;
top: 0;
height: 50px;
width: 50px;
background-color: #fff;
box-shadow: 0 0 40px rgba(0, 0, 0, 0.05);
border-radius: 30px;
visibility: hidden;
opacity: 0;
}
.demo-settings .demo-settings-options ul {
padding: 0;
margin: 0;
width: 100%;
display: inline-block;
margin-left: 20px;
}
.demo-settings .demo-settings-options ul li {
width: 20px;
height: 20px;
background-color: #000;
margin-right: 10px;
margin-top: 15px;
border-radius: 3px;
display: inline-block;
cursor: pointer;
opacity: 0;
transition: all .5s;
-webkit-transition: all .5s;
-o-transition: all .5s;
-moz-transition: all .5s;
}
.demo-settings .demo-settings-options ul li:hover {
opacity: .8;
}
.demo-settings.active .demo-settings-toggle {
margin: 5px;
box-shadow: none;
line-height: 50px;
width: 40px;
height: 40px;
transform: rotate(90deg);
}
.demo-settings.active .demo-settings-options {
visibility: visible;
opacity: 1;
width: 220px;
}
.demo-settings.active .demo-settings-options ul li {
opacity: 1;
transition-delay: .3s;
-webkit-transition-delay: .3s;
-moz-transition-delay: .3s;
-o-transition-delay: .3s;
}
/*# sourceMappingURL=demo.css.map */

@ -0,0 +1,120 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>注册</title>
<link rel="stylesheet" href="../dist/modules/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" href="../dist/modules/ionicons/css/ionicons.min.css">
<link rel="stylesheet" href="../dist/modules/fontawesome/web-fonts-with-css/css/fontawesome-all.min.css">
<link rel="stylesheet" href="../dist/css/demo.css">
<link rel="stylesheet" href="../dist/css/style.css">
<!-- 引入样式 -->
<link rel="stylesheet" href="../plugins/elementui/index.css" type="text/css">
<link rel="stylesheet" href="../plugins/font-awesome/css/font-awesome.min.css" type="text/css">
<link rel="stylesheet" href="../css/style.css" type="text/css">
<!-- 引入组件库 -->
<script src="../js/vue.js"></script>
<script src="../plugins/elementui/index.js"></script>
<script type="text/javascript" src="../js/jquery.min.js"></script>
<script src="../js/axios-0.18.0.js"></script>
</head>
<body >
<div id="app">
<section class="section">
<div class="container mt-5">
<div class="row">
<div class="col-12 col-sm-8 offset-sm-2 col-md-6 offset-md-3 col-lg-6 offset-lg-3 col-xl-4 offset-xl-4">
<div class="login-brand">
心理测评
</div>
<div class="card card-primary">
<div class="card-header"><h4>注册</h4></div>
<div class="card-body">
<div class="needs-validation" novalidate="">
<div class="form-group">
<label for="name">账号</label>
<input id="name" type="text" class="form-control" v-model="username" tabindex="1" required autofocus>
<div class="invalid-feedback">
Please fill in your email
</div>
</div>
<div class="form-group">
<label for="password" class="d-block">密码
</label>
<input id="password" type="password" class="form-control" v-model="password" tabindex="2" required>
<div class="invalid-feedback">
please fill in your password
</div>
</div>
<div class="form-group">
<button class="btn btn-primary btn-block" tabindex="4" @click="add()">
注册
</button>
<label for="password" class="d-block">
<div class="float-right">
<a href="login.html">
前往登录?
</a>
</div>
</label>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
</div>
</body>
</html>
<script>
var vue = new Vue({
el: '#app',
data: {
formData:{},
username:"",
password:"",
rules: {//校验规则
username: [{ required: true, message: '用户名为必填项', trigger: 'blur' }],
password: [{ required: true, message: '密码为必填项', trigger: 'blur' }],
idCard: [{ required: true, message: '身份证必填项', trigger: 'blur' }],
},
}
,methods:{
add()
{
if(this.username.trim()==""||this.password.trim()=="")
{
alert("请输入用户名和密码");
return
}
this.formData.username=this.username;
this.formData.password=this.password;
this.formData.type=1;
//表单数据校验通过发送ajax请求将表单数据提交到后台
axios.post("/user/Save",this.formData).then((response)=> {
this.$message({
message: "注册成功",
type: 'success'
});
})
}
}
});
</script>

@ -0,0 +1,334 @@
<!DOCTYPE html>
<html>
<head>
<!-- 页面meta -->
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title></title>
<meta content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no" name="viewport">
<!-- 引入样式 -->
<link rel="stylesheet" href="../plugins/elementui/index.css">
<link rel="stylesheet" href="../plugins/font-awesome/css/font-awesome.min.css">
<link rel="stylesheet" href="../css/style.css">
</head>
<body class="hold-transition">
<div id="app">
<div class="content-header">
<h1>管理员模块<small>用户管理</small></h1>
<el-breadcrumb separator-class="el-icon-arrow-right" class="breadcrumb">
<el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
<el-breadcrumb-item>管理员模块</el-breadcrumb-item>
<el-breadcrumb-item>用户管理</el-breadcrumb-item>
</el-breadcrumb>
</div>
<div class="app-container">
<div class="box">
<div class="filter-container">
<el-input placeholder="用户名" v-model="pagination.queryString" style="width: 200px;" class="filter-item"></el-input>
<el-button @click="findPage()" class="dalfBut">查询</el-button>
<el-button type="primary" class="butT" @click="handleCreate()">新建</el-button>
</div>
<el-table size="small" current-row-key="id" :data="dataList" stripe highlight-current-row>
<el-table-column type="index" align="center" label="序号"></el-table-column>
<el-table-column prop="username" label="用户名" align="center"></el-table-column>
<el-table-column prop="password" label="密码" align="center"></el-table-column>
<el-table-column label="角色" align="center">
<template slot-scope="scope">
<span>{{ scope.row.type == '0' ? '管理员' : '用户'}}</span>
</template>
</el-table-column>
<el-table-column label="操作" align="center">
<template slot-scope="scope">
<el-button type="primary" size="mini" @click="handleUpdate(scope.row)">编辑</el-button>
<el-button size="mini" type="danger" @click="handleDelete(scope.row)">删除</el-button>
</template>
</el-table-column>
</el-table>
<div class="pagination-container">
<el-pagination
class="pagiantion"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="pagination.currentPage"
:page-sizes="[10, 20, 30, 40]"
:page-size="pagination.pageSize"
layout="total, sizes,prev, pager, next, jumper"
:total="pagination.total">
</el-pagination>
</div>
<!-- 新增标签弹层 -->
<div class="add-form">
<el-dialog title="新增用户" :visible.sync="dialogFormVisible">
<el-form ref="dataAddForm" :model="formData" :rules="rules" label-position="right" label-width="100px">
<el-row>
<el-col :span="12">
<el-form-item label="用户名" prop="username">
<el-input v-model="formData.username"/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="密码" prop="password">
<el-input v-model="formData.password"/>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="角色" prop="type">
<el-select v-model="formData.type" placeholder="请选择角色">
<el-option
v-for="item in options"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="dialogFormVisible = false">取消</el-button>
<el-button type="primary" @click="handleAdd()">确定</el-button>
</div>
</el-dialog>
</div>
<!-- 编辑标签弹层 -->
<div class="add-form">
<el-dialog title="编辑用户" :visible.sync="dialogFormVisible4Edit">
<el-form ref="dataEditForm" :model="formData" :rules="rules" label-position="right" label-width="100px">
<el-row>
<el-col :span="12">
<el-form-item label="用户名" prop="username">
<el-input v-model="formData.username"/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="密码" prop="password">
<el-input v-model="formData.password"/>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="角色" prop="type">
<el-select v-model="formData.type" placeholder="请选择角色">
<el-option
v-for="item in options"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="dialogFormVisible4Edit = false">取消</el-button>
<el-button type="primary" @click="handleEdit()">确定</el-button>
</div>
</el-dialog>
</div>
</div>
</div>
</div>
</body>
<!-- 引入组件库 -->
<script src="../js/vue.js"></script>
<script src="../plugins/elementui/index.js"></script>
<script type="text/javascript" src="../js/jquery.min.js"></script>
<script src="../js/axios-0.18.0.js"></script>
<script>
var vue = new Vue({
el: '#app',
data:{
pagination: {//分页相关模型数据
currentPage: 1,//当前页码
pageSize:10,//每页显示的记录数
total:0,//总记录数
queryString:""//查询条件
},
dataList: [],//当前页要展示的分页列表数据
formData: {},//表单数据
dialogFormVisible: false,//增加表单是否可见
dialogFormVisible4Edit:false,//编辑表单是否可见
rules: {//校验规则
username: [{ required: true, message: '用户名为必填项', trigger: 'blur' }],
password: [{ required: true, message: '密码为必填项', trigger: 'blur' }],
type:[{ required: true, message: '角色为必选项', trigger: 'blur' }],
idCard:[{ required: true, message: '身份证号必填项', trigger: 'blur' }]
},
options: [{
value: 1,
label: '用户'
},
{
value: 0,
label: '管理员'
}]
},
//钩子函数VUE对象初始化完成后自动执行
created(){
this.findPage();
},
methods:{
//编辑
handleEdit() {
//表单校验
this.$refs['dataEditForm'].validate((valid)=>{
if(valid){
//表单校验通过,发送请求
axios.put("/user/Update",this.formData).then((response)=> {
this.dialogFormVisible4Edit = false;
this.$message({
message: "修改成功",
type: 'success'
});
}).finally(()=> {
//重新发送请求查询分页数据
this.findPage();
});
}else{
//表单校验失败
this.$message.error("表单数据校验失败");
return false;
}
});
},
//添加
handleAdd () {
//校验表单输入项是否合法
this.$refs['dataAddForm'].validate((valid) => {
if (valid) {
this.formData.status="拉黑";
//表单数据校验通过发送ajax请求将表单数据提交到后台
axios.post("/user/Save",this.formData).then((response)=> {
//隐藏新增窗口
this.dialogFormVisible = false;
this.$message({
message: "添加成功",
type: 'success'
});
}).finally(()=> {
this.findPage();
});
} else {
this.$message.error("表单数据校验失败");
return false;
}
});
},
// 重置表单
resetForm() {
this.formData = {};
},
// 弹出添加窗口
handleCreate() {
this.resetForm();
this.dialogFormVisible = true;
},
// 弹出编辑窗口
handleUpdate(row) {
//发送请求获取检查项信息
axios.get("/user/findById/" + row.id).then((res)=>{
//设置编辑窗口属性dialogFormVisible4Edit为true表示显示
this.dialogFormVisible4Edit = true;
//为模型数据设置值基于VUE双向数据绑定回显到页面
this.formData = res.data;
});
},
//切换页码
handleCurrentChange(currentPage) {
//currentPage为切换后的页码
this.pagination.currentPage = currentPage;
this.findPage();
},
//切换每页显示条数
handleSizeChange(pageSize){
this.pagination.pageSize =pageSize;
this.findPage();
},
// 删除
handleDelete(row) {
//alert(row.id);
this.$confirm("确认删除吗?","提示",{type:'warning'}).then(()=>{
//点击确定按钮时只需此处代码
//alert('用户点击的是确定按钮');
axios.delete("/user/Delete/" + row.id).then((res)=> {
this.$message({
message: "删除成功",
type: 'success'
});
//调用分页,获取最新分页数据
this.findPage();
});
});
},
//分页查询
findPage() {
//分页参数
// var param = {
// // currentPage:this.pagination.currentPage,//页码
// // pageSize:this.pagination.pageSize,//每页显示的记录数
// username:this.pagination.queryString//查询条件
// };
param="?username="+this.pagination.queryString;//查询条件
//请求后台
axios.get("/user/SelectPage/"+this.pagination.pageSize+"/"+this.pagination.currentPage+param).then((response)=> {
this.dataList = response.data.rows;
this.dataList.forEach(function (e) {
e.h="拉黑";
})
this.pagination.total = response.data.total;
});
},
c(row)
{
axios.get("/user/findById/" + row.id).then((res)=>{
this.formData=res.data;
if(this.formData.status=="拉黑")
{
this.formData.status="已拉黑"
}
else
{
this.formData.status="拉黑"
}
axios.put("/user/Update",this.formData).then((response)=> {
}).finally(()=> {
//重新发送请求查询分页数据
this.findPage();
});
});
}
}
})
</script>
</html>

@ -0,0 +1,227 @@
<!DOCTYPE html>
<html>
<head>
<!-- 页面meta -->
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>火车票销售系统</title>
<meta content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no" name="viewport">
<!-- 引入样式 -->
<link rel="stylesheet" href="../plugins/elementui/index.css">
<link rel="stylesheet" href="../plugins/font-awesome/css/font-awesome.min.css">
<link rel="stylesheet" href="../css/style.css">
</head>
<body class="hold-transition">
<div id="app">
<div class="content-header">
<h1>个人模块<small>账号管理</small></h1>
<el-breadcrumb separator-class="el-icon-arrow-right" class="breadcrumb">
<el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
<el-breadcrumb-item>个人模块</el-breadcrumb-item>
<el-breadcrumb-item>账号管理</el-breadcrumb-item>
</el-breadcrumb>
</div>
<div class="app-container">
<div class="box">
<el-table size="small" current-row-key="id" :data="dataList" stripe highlight-current-row>
<el-table-column type="index" align="center" label="序号"></el-table-column>
<el-table-column prop="username" label="用户名" align="center"></el-table-column>
<el-table-column prop="password" label="密码" align="center"></el-table-column>
<el-table-column label="角色" align="center">
<template slot-scope="scope">
<!-- <span>{{ scope.row.type == '0' ? '管理员' : '学生'}}</span>-->
<span>{{ scope.row.type == '0' ? '管理员' : '用户'}}</span>
</template>
</el-table-column>
<el-table-column label="操作" align="center">
<template slot-scope="scope">
<el-button type="primary" size="mini" @click="handleUpdate(scope.row)">编辑</el-button>
</template>
</el-table-column>
</el-table>
<!-- 编辑标签弹层 -->
<div class="add-form">
<el-dialog title="修改" :visible.sync="dialogFormVisible4Edit">
<el-form ref="dataEditForm" :model="formData" :rules="rules" label-position="right" label-width="100px">
<el-row>
<el-col :span="12">
<el-form-item label="用户名" prop="username">
<el-input v-model="formData.username"/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="密码" prop="password">
<el-input v-model="formData.password"/>
</el-form-item>
</el-col>
</el-row>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="dialogFormVisible4Edit = false">取消</el-button>
<el-button type="primary" @click="handleEdit()">确定</el-button>
</div>
</el-dialog>
</div>
</div>
</div>
</div>
</body>
<!-- 引入组件库 -->
<script src="../js/vue.js"></script>
<script src="../plugins/elementui/index.js"></script>
<script type="text/javascript" src="../js/jquery.min.js"></script>
<script src="../js/axios-0.18.0.js"></script>
<script>
var vue = new Vue({
el: '#app',
data:{
pagination: {//分页相关模型数据
currentPage: 1,//当前页码
pageSize:10,//每页显示的记录数
total:0,//总记录数
queryString:""//查询条件
},
dataList: [],//当前页要展示的分页列表数据
formData: {},//表单数据
dialogFormVisible: false,//增加表单是否可见
dialogFormVisible4Edit:false,//编辑表单是否可见
rules: {//校验规则
username: [{ required: true, message: '用户名为必填项', trigger: 'blur' }],
password: [{ required: true, message: '密码为必填项', trigger: 'blur' }],
type:[{ required: true, message: '角色为必选项', trigger: 'blur' }],
idCard:[{ required: true, message: '身份证号必填项', trigger: 'blur' }]
},
options: [{
value: 1,
label: '用户'
},
{
value: 0,
label: '管理员'
}]
},
//钩子函数VUE对象初始化完成后自动执行
created(){
this.findPage();
},
methods:{
//编辑
handleEdit() {
//表单校验
this.$refs['dataEditForm'].validate((valid)=>{
if(valid){
//表单校验通过,发送请求
axios.put("/user/Update",this.formData).then((response)=> {
this.dialogFormVisible4Edit = false;
this.$message({
message: "修改成功",
type: 'success'
});
}).finally(()=> {
//重新发送请求查询分页数据
this.findPage();
});
}else{
//表单校验失败
this.$message.error("表单数据校验失败");
return false;
}
});
},
//添加
handleAdd () {
//校验表单输入项是否合法
this.$refs['dataAddForm'].validate((valid) => {
if (valid) {
//表单数据校验通过发送ajax请求将表单数据提交到后台
axios.post("/user/Save",this.formData).then((response)=> {
//隐藏新增窗口
this.dialogFormVisible = false;
this.$message({
message: "添加成功",
type: 'success'
});
}).finally(()=> {
this.findPage();
});
} else {
this.$message.error("表单数据校验失败");
return false;
}
});
},
// 重置表单
resetForm() {
this.formData = {};
},
// 弹出添加窗口
handleCreate() {
this.resetForm();
this.dialogFormVisible = true;
},
// 弹出编辑窗口
handleUpdate(row) {
//发送请求获取检查项信息
axios.get("/user/findById/" + row.id).then((res)=>{
//设置编辑窗口属性dialogFormVisible4Edit为true表示显示
this.dialogFormVisible4Edit = true;
//为模型数据设置值基于VUE双向数据绑定回显到页面
this.formData = res.data;
});
},
//切换页码
handleCurrentChange(currentPage) {
//currentPage为切换后的页码
this.pagination.currentPage = currentPage;
this.findPage();
},
//切换每页显示条数
handleSizeChange(pageSize){
this.pagination.pageSize =pageSize;
this.findPage();
},
// 删除
handleDelete(row) {
//alert(row.id);
this.$confirm("确认删除吗?","提示",{type:'warning'}).then(()=>{
//点击确定按钮时只需此处代码
//alert('用户点击的是确定按钮');
axios.delete("/user/Delete/" + row.id).then((res)=> {
this.$message({
message: "删除成功",
type: 'success'
});
//调用分页,获取最新分页数据
this.findPage();
});
});
},
//分页查询
findPage() {
let userId=localStorage.getItem("userId");
this.dataList=[];
axios.get("/user/findById/" + userId).then((res)=>{
this.formData = res.data;
this.dataList.push(this.formData);
});
}
}
})
</script>
</html>

@ -0,0 +1,142 @@
package com.domain;
import com.baomidou.mybatisplus.annotation.IdType;
import com.baomidou.mybatisplus.annotation.TableField;
import com.baomidou.mybatisplus.annotation.TableId;
import com.baomidou.mybatisplus.annotation.TableName;
@TableName("ut")
public class ut {
@TableId(type= IdType.AUTO)
private int id;
@TableField("userId")
private int userId;
public int getUserId() {
return userId;
}
public void setUserId(int userId) {
this.userId = userId;
}
public String getDa() {
return da;
}
public void setDa(String da) {
this.da = da;
}
@TableField("xuhao")
private int xuhao;
@TableField("them")
private String them;
public int getId() {
return id;
}
public void setId(int id) {
this.id = id;
}
public int getXuhao() {
return xuhao;
}
public void setXuhao(int xuhao) {
this.xuhao = xuhao;
}
public String getThem() {
return them;
}
public void setThem(String them) {
this.them = them;
}
public String getOne() {
return one;
}
public void setOne(String one) {
this.one = one;
}
public String getTwo() {
return two;
}
public void setTwo(String two) {
this.two = two;
}
public String getThree() {
return three;
}
public void setThree(String three) {
this.three = three;
}
public String getFour() {
return four;
}
public void setFour(String four) {
this.four = four;
}
public String getOk() {
return ok;
}
public void setOk(String ok) {
this.ok = ok;
}
@TableField("one")
private String one;
@TableField("two")
private String two;
public double getFen() {
return fen;
}
public void setFen(double fen) {
this.fen = fen;
}
@TableField("three")
private String three;
@TableField("four")
private String four;
@TableField("ok")
private String ok;
public int getMokuaiId() {
return mokuaiId;
}
public void setMokuaiId(int mokuaiId) {
this.mokuaiId = mokuaiId;
}
@TableField("da")
private String da;
@TableField("fen")
private double fen;
@TableField("mokuaiId")
private int mokuaiId;
}
Loading…
Cancel
Save