Romesum
5 years ago
parent
94a40e7db4
commit
2ce13ea143
@ -0,0 +1,140 @@
|
|||||||
|
<template>
|
||||||
|
<div style="margin: 20px">
|
||||||
|
<el-row :gutter="20">
|
||||||
|
<el-col :span="8">
|
||||||
|
<el-input v-model="search" placeholder="输入关键字搜索" suffix-icon="el-icon-search"/>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="16" style="text-align: left">
|
||||||
|
<el-button type="success" style="width: 120px;text-align: left" icon="el-icon-circle-plus-outline"
|
||||||
|
@click="addUser">新增用户
|
||||||
|
</el-button>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
<el-table
|
||||||
|
ref="multipleTable"
|
||||||
|
:data="tableDataComputed"
|
||||||
|
border
|
||||||
|
style="width: 100%;margin-top: 20px">
|
||||||
|
<el-table-column type="selection" width="40" align="center"></el-table-column>
|
||||||
|
<el-table-column prop="username" label="工号" sortable></el-table-column>
|
||||||
|
<el-table-column prop="position" label="职位" sortable></el-table-column>
|
||||||
|
<el-table-column prop="nickname" label="姓名" sortable></el-table-column>
|
||||||
|
<el-table-column prop="tel" label="联系电话"></el-table-column>
|
||||||
|
<el-table-column prop="office" label="办公室" sortable></el-table-column>
|
||||||
|
<el-table-column prop="email" label="邮箱"></el-table-column>
|
||||||
|
<el-table-column fixed="right" label="操作" width="300">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<el-button @click="handleClick(scope.row)" size="mini" plain>查看课表</el-button>
|
||||||
|
<el-button @click="editUser(scope.row)" type="primary" size="mini" plain icon="el-icon-edit">编辑
|
||||||
|
</el-button>
|
||||||
|
<el-button @click="deleteUser(scope.row)" type="danger" size="mini" plain icon="el-icon-delete">删除
|
||||||
|
</el-button>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
</el-table>
|
||||||
|
<user-edit-form
|
||||||
|
:dialog-form-visible="dialogFormVisible"
|
||||||
|
:edit="edit"
|
||||||
|
:user-form="userForm"
|
||||||
|
@cancel="cancel"
|
||||||
|
@confirm="confirm"
|
||||||
|
></user-edit-form>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import {get, post} from "~/utils";
|
||||||
|
import {showDialog, showFail, showSuccess} from "~/utils/dialog";
|
||||||
|
import userEditForm from "~/components/supManager/userEditForm";
|
||||||
|
|
||||||
|
export default {
|
||||||
|
components: {userEditForm},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
search: '',
|
||||||
|
tableData: [{
|
||||||
|
nickname: "",
|
||||||
|
tel: "",
|
||||||
|
email: "",
|
||||||
|
username: "",
|
||||||
|
office: "",
|
||||||
|
position:'',
|
||||||
|
uid: 0
|
||||||
|
}],
|
||||||
|
dialogFormVisible: false,
|
||||||
|
edit: false,
|
||||||
|
userForm: {
|
||||||
|
nickname: "",
|
||||||
|
tel: "",
|
||||||
|
email: "",
|
||||||
|
username: "",
|
||||||
|
office: "",
|
||||||
|
position: ''
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
,
|
||||||
|
methods: {
|
||||||
|
async load() {
|
||||||
|
this.tableData = await get('lb/user/getUserList')
|
||||||
|
},
|
||||||
|
handleClick(row) {
|
||||||
|
console.log(row);
|
||||||
|
},
|
||||||
|
addUser() {
|
||||||
|
this.edit = false
|
||||||
|
this.userForm = {
|
||||||
|
nickname: "",
|
||||||
|
tel: "",
|
||||||
|
email: "",
|
||||||
|
username: "",
|
||||||
|
office: "",
|
||||||
|
position: ''
|
||||||
|
}
|
||||||
|
this.dialogFormVisible = true
|
||||||
|
},
|
||||||
|
// 删除用户
|
||||||
|
async deleteUser(item) {
|
||||||
|
await showDialog("确认要删除吗？", this)
|
||||||
|
await post('lb/user/deleteUser', {
|
||||||
|
uid: item.uid
|
||||||
|
}).then(() => {
|
||||||
|
showSuccess("删除成功", this)
|
||||||
|
this.load()
|
||||||
|
}).catch(e => {
|
||||||
|
showFail("删除失败 " + e.msg, this)
|
||||||
|
})
|
||||||
|
},
|
||||||
|
// 编辑用户
|
||||||
|
async editUser(item) {
|
||||||
|
await showDialog('确认编辑该用户吗？',this)
|
||||||
|
this.edit = true
|
||||||
|
this.userForm = item
|
||||||
|
this.dialogFormVisible = true
|
||||||
|
},
|
||||||
|
cancel(){
|
||||||
|
console.log(1)
|
||||||
|
this.dialogFormVisible = false
|
||||||
|
},
|
||||||
|
confirm(){
|
||||||
|
this.load()
|
||||||
|
this.cancel()
|
||||||
|
}
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
tableDataComputed() {
|
||||||
|
return this.tableData.filter(data => !this.search
|
||||||
|
|| data.username.toLowerCase().includes(this.search.toLowerCase())
|
||||||
|
|| data.tel.toLowerCase().includes(this.search.toLowerCase())
|
||||||
|
|| data.nickname.toLowerCase().includes(this.search.toLowerCase())
|
||||||
|
|| data.office.toLowerCase().includes(this.search.toLowerCase())
|
||||||
|
|| data.email.toLowerCase().includes(this.search.toLowerCase())
|
||||||
|
)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
async mounted() {
|
||||||
|
this.load()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
Loading…
Reference in new issue