|
@@ -26,6 +26,19 @@ table{
|
|
|
float: right;
|
|
|
}
|
|
|
}
|
|
|
+.dialog-style{
|
|
|
+ div{
|
|
|
+ text-align: center;
|
|
|
+ margin: 5px;
|
|
|
+ /deep/ .el-input{
|
|
|
+ display: inline-block;
|
|
|
+ width: 200px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+.center-text{
|
|
|
+ text-align: center;
|
|
|
+}
|
|
|
</style>
|
|
|
<template>
|
|
|
<div>
|
|
@@ -66,9 +79,9 @@ table{
|
|
|
<td>{{item.region}}</td>
|
|
|
<td>{{gradeMap[item.grade]}}</td>
|
|
|
<td>
|
|
|
- <a>修改</a>
|
|
|
+ <a @click="passChange = true;changeUser.id = item.id">修改密码</a>
|
|
|
|
|
|
- <a>删除</a>
|
|
|
+ <a @click="visibleDelete = true;deleteId = item.id">删除</a>
|
|
|
</td>
|
|
|
</tr>
|
|
|
</tbody>
|
|
@@ -78,17 +91,67 @@ table{
|
|
|
title="编辑"
|
|
|
:visible.sync="dialogVisible"
|
|
|
width="500px">
|
|
|
-
|
|
|
+ <div>
|
|
|
+ <label>姓名:</label>
|
|
|
+ <el-input name="name" v-model="user.name" placeholder="请输入姓名" required="required"></el-input>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <label>年级:</label>
|
|
|
+ <el-select v-model="user.grade" placeholder="请选择">
|
|
|
+ <el-option
|
|
|
+ v-for="item in options"
|
|
|
+ :key="item.value"
|
|
|
+ :label="item.label"
|
|
|
+ :value="item.value">
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <label>手机:</label>
|
|
|
+ <el-input v-model="user.username" placeholder="请输入手机" required="required"></el-input>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <label>密码:</label>
|
|
|
+ <el-input placeholder="请输入密码" v-model="user.password" show-password required="required"></el-input>
|
|
|
+ </div>
|
|
|
<span slot="footer" class="dialog-footer">
|
|
|
<el-button type="primary" @click="addUser">确 定</el-button>
|
|
|
<el-button type="primary" @click="dialogVisible = false">取消</el-button>
|
|
|
</span>
|
|
|
</el-dialog>
|
|
|
+ <el-dialog
|
|
|
+ title="提示"
|
|
|
+ :visible.sync="visibleDelete"
|
|
|
+ width="200px">
|
|
|
+ <p class="center-text">确认删除?</p>
|
|
|
+ <span slot="footer" class="dialog-footer">
|
|
|
+ <el-button @click="visibleDelete = false">取 消</el-button>
|
|
|
+ <el-button type="primary" @click="deleteUser">确 定</el-button>
|
|
|
+ </span>
|
|
|
+ </el-dialog>
|
|
|
+ <el-dialog
|
|
|
+ class="dialog-style"
|
|
|
+ title="修改密码"
|
|
|
+ :visible.sync="passChange"
|
|
|
+ width="500px">
|
|
|
+ <div>
|
|
|
+ <label>旧密码:</label>
|
|
|
+ <el-input placeholder="请输入旧密码" v-model="changeUser.oldPass" show-password required="required"></el-input>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <label>新密码:</label>
|
|
|
+ <el-input placeholder="请输入新密码" v-model="changeUser.newPass" show-password required="required"></el-input>
|
|
|
+ </div>
|
|
|
+ <span slot="footer" class="dialog-footer">
|
|
|
+ <el-button @click="passChange = false">取 消</el-button>
|
|
|
+ <el-button type="primary" @click="updateUser">确 定</el-button>
|
|
|
+ </span>
|
|
|
+ </el-dialog>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-import { getUserList } from '@/api/user';
|
|
|
+import { getUserList,addUser,updateUser,deleteUser } from '@/api/user';
|
|
|
|
|
|
export default {
|
|
|
name: 'UserList',
|
|
@@ -96,7 +159,14 @@ export default {
|
|
|
},
|
|
|
data () {
|
|
|
return {
|
|
|
+ user:{},
|
|
|
+ changeUser:{},
|
|
|
userList:[],
|
|
|
+ search:{
|
|
|
+ name:'',
|
|
|
+ grade:'',
|
|
|
+ },
|
|
|
+ deleteId: -1,
|
|
|
options: [{
|
|
|
value: '6X',
|
|
|
label: '六年级上'
|
|
@@ -122,10 +192,6 @@ export default {
|
|
|
value: '9Y',
|
|
|
label: '初三下'
|
|
|
}],
|
|
|
- search:{
|
|
|
- name:'',
|
|
|
- grade:'',
|
|
|
- },
|
|
|
gradeMap:{
|
|
|
'6X':'六年级上',
|
|
|
'6Y':'六年级下',
|
|
@@ -136,7 +202,9 @@ export default {
|
|
|
'9X':'初三上',
|
|
|
'9Y':'初三下',
|
|
|
},
|
|
|
- dialogVisible:false
|
|
|
+ dialogVisible:false,
|
|
|
+ visibleDelete:false,
|
|
|
+ passChange:false,
|
|
|
}
|
|
|
},
|
|
|
created() {
|
|
@@ -149,7 +217,25 @@ export default {
|
|
|
})
|
|
|
},
|
|
|
addUser(){
|
|
|
-
|
|
|
+ addUser(this.user).then((result) => {
|
|
|
+ alert(result.message);
|
|
|
+ this.dialogVisible = false
|
|
|
+ this.searchUser();
|
|
|
+ })
|
|
|
+ },
|
|
|
+ updateUser(){
|
|
|
+ updateUser(this.changeUser).then((result) => {
|
|
|
+ alert(result.message);
|
|
|
+ this.passChange = false
|
|
|
+ this.searchUser();
|
|
|
+ })
|
|
|
+ },
|
|
|
+ deleteUser(){
|
|
|
+ deleteUser(this.deleteId).then((result) => {
|
|
|
+ alert(result?'删除成功':'删除失败');
|
|
|
+ this.visibleDelete = false
|
|
|
+ this.searchUser();
|
|
|
+ })
|
|
|
}
|
|
|
}
|
|
|
}
|