Files
demo/demo-web-ui/src/views/system-admin/UserAdminister/components/user.vue
fengdong777 f2bac630c2 1
2023-04-29 14:25:40 +08:00

283 lines
9.9 KiB
Vue

<template>
<div>
<div class="tab-header">
<el-form ref="form" :inline="true" :model="search" label-width="80px">
<el-row :gutter="20">
<el-col :span="24">
<el-form-item label="用户姓名">
<el-input v-model="search.xm" clearable></el-input>
</el-form-item>
<el-form-item label="部门名称">
<el-input v-model="search.deptmentName" clearable></el-input>
</el-form-item>
<el-button @click="getOrgUserList()">查询</el-button>
</el-col>
</el-row>
</el-form>
</div>
<!-- table -->
<div class="table-describe clearfix">
<h4 style="">本单位用户列表</h4>
<pagination class="pagesize" layout="sizes" :total="page.total" :page.sync="page.current" :limit.sync="page.size"
@pagination="pagination"/>
</div>
<el-table :data="userTable" border style="width: 100%;">
<el-table-column label="序号" width="50px" type="index" align="center">
</el-table-column>
<el-table-column label="操作" width="300px" align="center">
<template slot-scope="scope">
<el-button @click="setRole(scope.row)" type="primary" size="mini">
设置角色
</el-button>
<el-button @click="setOrg(scope.row)" type="primary" size="mini">
设置部门
</el-button>
<el-button @click="initPwd(scope.row)" type="danger" size="mini">
初始化密码
</el-button>
</template>
</el-table-column>
<el-table-column prop="userName" label="用户名" align="center">
<template slot-scope="scope">
<span class="tablerow-click" @click="userinfo(scope.row)">{{scope.row.userName}}</span>
</template>
</el-table-column>
<el-table-column prop="roleName" label="角色名称" align="center">
</el-table-column>
<el-table-column prop="idNo" label="身份证号码" align="center">
</el-table-column>
<el-table-column prop="name" label="真实姓名" width="120px" align="center">
</el-table-column>
<el-table-column prop="mobile" label="手机号码" align="center" width="140px">
</el-table-column>
<el-table-column prop="deptmentName" label="所属部门" align="center">
</el-table-column>
</el-table>
<pagination :total="page.total" :page.sync="page.current" :limit.sync="page.size" @pagination="pagination"/>
<!-- 角色设置 -->
<el-dialog title="设置角色" :visible.sync="roleDialog" width="30%">
<el-form :model="roleForm" :rules="rules" ref="roleForm">
<el-form-item label="角色名称" :label-width="formLabelWidth" prop="roleSid">
<el-select v-model="roleForm.roleSid" placeholder="请选择">
<el-option v-for="item in roleList"
:key="item.sid"
:label="item.roleName"
:value="item.sid"
></el-option>
</el-select>
<el-button type="primary" size='mini' @click="toNav('RoleAdminister')" style="margin-left: 10px;" circle
icon="el-icon-plus"></el-button>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="saveRole('roleForm')"> </el-button>
<el-button @click="roleDialog = false"> </el-button>
</div>
</el-dialog>
<!-- 部门设置 -->
<el-dialog title="部门设置" :visible.sync="bm_Dialog" width="30%">
<el-form :model="bm_Form" :rules="rules" ref="bm_Form">
<el-form-item label="部门名称" :label-width="formLabelWidth" prop="departmentSid">
<!-- <el-select v-model="bm_Form.departmentSid" placeholder="请选择">
<el-option v-for="item in bm_List"
:key="item.departmentSid"
:label="item.departmentName"
:value="item.departmentSid"
></el-option>
</el-select> -->
<el-cascader
v-model="bm_Form.departmentSid"
:options="treedata"
:props="props"></el-cascader>
<el-button type="primary" size='mini' @click="toNav('deptManage')" style="margin-left: 10px;" circle
icon="el-icon-plus"></el-button>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="saveOrg('bm_Form')"> </el-button>
<el-button @click="bm_Dialog = false"> </el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import {orgUserList} from '@/api/system/userAdminister/index.js'
import {orgrolesList, saveOrgRole, getOrgList, saveDepartment} from '@/api/system/userAdminister/index.js'
import {initPwd} from '@/api/system/user/Auser.js'
import {getOrgTree} from '@/api/system/departments/departments.js'
export default {
data() {
return {
activeName: 'first',
search: {
userName: '',
xm: '',
orgSid: this.$store.getters.userInfo.orgSid
},
props: {
value: "sid",
label: "name",
children: "orgDepartmentVoList"
},
treedata: null,
page: {
total: 0, // 默认数据总数
current: 1, // 默认开始页面
size: 10, // 每页的数据条数
},
userTable: [],
clientTable: [],
// 设置角色
formLabelWidth: '100',
roleDialog: false,
roleList: [],
roleForm: {
orgSid: this.$store.getters.userInfo.orgSid,
roleSid: "",
userSid: ""
},
// 部门
bm_Dialog: false,
bm_Form: {departmentSid: ''},
bm_List: [],
rules: {
roleSid: [
{required: true, message: '请选择角色名称', trigger: 'change'}
],
departmentSid: [
{required: true, message: '请选择部门名称', trigger: 'change'}
],
}
};
},
mounted() {
this.getOrgUserList()
orgrolesList({orgSid: this.$store.getters.userInfo.orgSid, roleName: ''}).then(res => {
this.roleList = res.data
})
this.getOrgTree()
getOrgList(this.$store.getters.userInfo.orgSid).then(res => {
this.bm_List = res.data
})
},
methods: {
// 列表 + 初始化
getOrgUserList() {
let params = this.page
params.params = this.search
orgUserList(this.page).then(res => {
this.page.total = res.data.total
this.userTable = res.data.records
})
},
// 分页
pagination(val) {
this.page.current = val.pageNum
this.page.size = val.pageSize
this.getOrgUserList()
},
getOrgTree() { // 获取部门树形列表
function treeArr(data) {
if (data.length > 0) {
for (var i = 0; i < data.length; i++) {
if (data[i].orgDepartmentVoList.length > 0) {
treeArr(data[i].orgDepartmentVoList)
} else {
delete data[i].orgDepartmentVoList
}
}
}
}
getOrgTree({organizationSid: this.$store.getters.userInfo.orgSid}).then(res => {
let tree = res.data[0].orgDepartmentVoList
treeArr(tree)
this.treedata = tree
})
},
//设置角色 设置 用户ID
setRole(row) {
this.roleDialog = true
this.roleForm.userSid = row.sid
},
//设置角色 提交
saveRole(formName) {
this.$refs[formName].validate((valid) => {
if (valid) {
saveOrgRole(this.roleForm).then(res => {
if (res.code == "200") {
this.roleDialog = false
this.getOrgUserList()
this.$message({
message: res.msg,
type: 'success'
})
}
})
} else {
console.log('error submit!!');
return false;
}
});
},
//设置部门 获取 用户ID
setOrg(row) {
this.bm_Dialog = true
this.bm_Form.departmentSid = ''
this.$set(this.bm_Form, 'staffSid', row.staffSid)
},
//设置部门 提交
saveOrg(formName) {
this.$refs[formName].validate((valid) => {
if (valid) {
let params = { // 请求的参数
departmentSid: this.bm_Form.departmentSid[this.bm_Form.departmentSid.length - 1],
staffSid: this.bm_Form.staffSid,
}
saveDepartment(params).then(res => {
if (res.code == "200") {
this.getOrgUserList()
this.bm_Dialog = false
this.$message({
message: res.msg,
type: 'success'
})
}
})
} else {
console.log('error submit!!');
return false;
}
});
},
initPwd(row) {
this.$confirm('此操作将初始化该用户密码, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
initPwd({sid: row.sid}).then(res => {
this.$message({
type: 'success',
message: res.msg
});
})
})
},
toNav(src) {
this.$router.push("/" + src);
}
}
};
</script>
<style scoped="scoped">
.el-select > .el-input {
display: block;
width: 300px;
}
</style>