用户管理修改

master
wanglei 7 months ago
parent 7991825176
commit 0786f6aae9

@ -136,9 +136,10 @@ export function updateAuthRole(data) {
} }
// 查询部门下拉树结构 // 查询部门下拉树结构
export function deptTreeSelect() { export function deptTreeSelect(data) {
return request({ return request({
url: '/system/user/deptTree', url: '/system/user/deptTree',
method: 'get' method: 'get',
params: data
}) })
} }

@ -1,207 +1,224 @@
<template> <template>
<div class="app-container"> <div class="app-container">
<el-row :gutter="20">
<!--部门数据--> <div class="company" v-if="!$store.state.user.tenantId">
<el-col :span="4" :xs="24"> <el-input
<div class="head-container"> style="width: 200px"
<el-input placeholder="公司名称"
v-model="deptName" size="small"
placeholder="请输入部门名称" prefix-icon="el-icon-search"
clearable v-model="gsInfo.tenantName"
size="small" @keyup.enter.native="getGsInfoList">
prefix-icon="el-icon-search" </el-input>
style="margin-bottom: 20px" <div class="cp-content" style="width: 200px">
/> <div :class="gsInfo.active_id===item.id?'cp-item active':'cp-item'" @click="changCompany(item.id)" v-for="item in gsInfo.list">{{ item.name }}</div>
</div> </div>
<div class="head-container"> </div>
<el-tree
:data="deptOptions" <div :class="$store.state.user.tenantId?'content-all':'content'">
:props="defaultProps" <el-row :gutter="20">
:expand-on-click-node="false" <!--部门数据-->
:filter-node-method="filterNode" <el-col :span="4" :xs="24">
ref="tree" <div class="head-container">
node-key="id"
default-expand-all
highlight-current
@node-click="handleNodeClick"
/>
</div>
</el-col>
<!--用户数据-->
<el-col :span="20" :xs="24">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
<el-form-item label="用户名称" prop="userName">
<el-input <el-input
v-model="queryParams.userName" v-model="deptName"
placeholder="请输入用户名称" placeholder="请输入部门名称"
clearable clearable
style="width: 240px" size="small"
@keyup.enter.native="handleQuery" prefix-icon="el-icon-search"
style="margin-bottom: 20px"
/> />
</el-form-item> </div>
<el-form-item label="手机号码" prop="phonenumber"> <div class="head-container">
<el-input <el-tree
v-model="queryParams.phonenumber" :data="deptOptions"
placeholder="请输入手机号码" :props="defaultProps"
clearable :expand-on-click-node="false"
style="width: 240px" :filter-node-method="filterNode"
@keyup.enter.native="handleQuery" ref="tree"
node-key="id"
default-expand-all
highlight-current
@node-click="handleNodeClick"
/> />
</el-form-item> </div>
<el-form-item label="状态" prop="status"> </el-col>
<el-select <!--用户数据-->
v-model="queryParams.status" <el-col :span="20" :xs="24">
placeholder="用户状态" <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
clearable <el-form-item label="用户名称" prop="userName">
style="width: 240px" <el-input
> v-model="queryParams.userName"
<el-option placeholder="请输入用户名称"
v-for="dict in dict.type.sys_normal_disable" clearable
:key="dict.value" style="width: 240px"
:label="dict.label" @keyup.enter.native="handleQuery"
:value="dict.value"
/> />
</el-select> </el-form-item>
</el-form-item> <el-form-item label="手机号码" prop="phonenumber">
<el-form-item label="创建时间"> <el-input
<el-date-picker v-model="queryParams.phonenumber"
v-model="dateRange" placeholder="请输入手机号码"
style="width: 240px" clearable
value-format="yyyy-MM-dd HH:mm:ss" style="width: 240px"
type="daterange" @keyup.enter.native="handleQuery"
range-separator="-" />
start-placeholder="开始日期" </el-form-item>
end-placeholder="结束日期" <el-form-item label="状态" prop="status">
:default-time="['00:00:00', '23:59:59']" <el-select
></el-date-picker> v-model="queryParams.status"
</el-form-item> placeholder="用户状态"
<el-form-item> clearable
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery"></el-button> style="width: 240px"
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery"></el-button> >
</el-form-item> <el-option
</el-form> v-for="dict in dict.type.sys_normal_disable"
:key="dict.value"
<el-row :gutter="10" class="mb8"> :label="dict.label"
<el-col :span="1.5"> :value="dict.value"
<el-button />
type="primary" </el-select>
plain </el-form-item>
icon="el-icon-plus" <el-form-item label="创建时间">
size="mini" <el-date-picker
@click="handleAdd" v-model="dateRange"
v-hasPermi="['system:user:add']" style="width: 240px"
>新增</el-button> value-format="yyyy-MM-dd HH:mm:ss"
</el-col> type="daterange"
<el-col :span="1.5"> range-separator="-"
<el-button start-placeholder="开始日期"
type="success" end-placeholder="结束日期"
plain :default-time="['00:00:00', '23:59:59']"
icon="el-icon-edit" ></el-date-picker>
size="mini" </el-form-item>
:disabled="single" <el-form-item>
@click="handleUpdate" <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery"></el-button>
v-hasPermi="['system:user:edit']" <el-button icon="el-icon-refresh" size="mini" @click="resetQuery"></el-button>
>修改</el-button> </el-form-item>
</el-col> </el-form>
<el-col :span="1.5">
<el-button
type="danger"
plain
icon="el-icon-delete"
size="mini"
:disabled="multiple"
@click="handleDelete"
v-hasPermi="['system:user:remove']"
>删除</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="info"
plain
icon="el-icon-upload2"
size="mini"
@click="handleImport"
v-hasPermi="['system:user:import']"
>导入</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="warning"
plain
icon="el-icon-download"
size="mini"
@click="handleExport"
v-hasPermi="['system:user:export']"
>导出</el-button>
</el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList" :columns="columns"></right-toolbar>
</el-row>
<el-table v-loading="loading" :data="userList" @selection-change="handleSelectionChange"> <el-row :gutter="10" class="mb8">
<el-table-column type="selection" width="50" align="center" /> <el-col :span="1.5">
<el-table-column label="用户编号" align="center" key="userId" prop="userId" v-if="columns[0].visible" />
<el-table-column label="用户名称" align="center" key="userName" prop="userName" v-if="columns[1].visible" :show-overflow-tooltip="true" />
<el-table-column label="用户昵称" align="center" key="nickName" prop="nickName" v-if="columns[2].visible" :show-overflow-tooltip="true" />
<el-table-column label="部门" align="center" key="deptName" prop="dept.deptName" v-if="columns[3].visible" :show-overflow-tooltip="true" />
<el-table-column label="手机号码" align="center" key="phonenumber" prop="phonenumber" v-if="columns[4].visible" width="120" />
<el-table-column label="状态" align="center" key="status" v-if="columns[5].visible">
<template slot-scope="scope">
<el-switch
v-model="scope.row.status"
active-value="0"
inactive-value="1"
@change="handleStatusChange(scope.row)"
></el-switch>
</template>
</el-table-column>
<el-table-column label="创建时间" align="center" prop="createTime" v-if="columns[6].visible" width="160">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.createTime) }}</span>
</template>
</el-table-column>
<el-table-column
label="操作"
align="center"
width="160"
class-name="small-padding fixed-width"
>
<template slot-scope="scope" v-if="scope.row.userId !== 1">
<el-button <el-button
type="primary"
plain
icon="el-icon-plus"
size="mini" size="mini"
type="text" @click="handleAdd"
v-hasPermi="['system:user:add']"
>新增</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="success"
plain
icon="el-icon-edit" icon="el-icon-edit"
@click="handleUpdate(scope.row)" size="mini"
:disabled="single"
@click="handleUpdate"
v-hasPermi="['system:user:edit']" v-hasPermi="['system:user:edit']"
>修改</el-button> >修改</el-button>
</el-col>
<el-col :span="1.5">
<el-button <el-button
size="mini" type="danger"
type="text" plain
icon="el-icon-delete" icon="el-icon-delete"
@click="handleDelete(scope.row)" size="mini"
:disabled="multiple"
@click="handleDelete"
v-hasPermi="['system:user:remove']" v-hasPermi="['system:user:remove']"
>删除</el-button> >删除</el-button>
<el-dropdown size="mini" @command="(command) => handleCommand(command, scope.row)" v-hasPermi="['system:user:resetPwd', 'system:user:edit']"> </el-col>
<el-button size="mini" type="text" icon="el-icon-d-arrow-right">更多</el-button> <el-col :span="1.5">
<el-dropdown-menu slot="dropdown"> <el-button
<el-dropdown-item command="handleResetPwd" icon="el-icon-key" type="info"
v-hasPermi="['system:user:resetPwd']">重置密码</el-dropdown-item> plain
<el-dropdown-item command="handleAuthRole" icon="el-icon-circle-check" icon="el-icon-upload2"
v-hasPermi="['system:user:edit']">分配角色</el-dropdown-item> size="mini"
</el-dropdown-menu> @click="handleImport"
</el-dropdown> v-hasPermi="['system:user:import']"
</template> >导入</el-button>
</el-table-column> </el-col>
</el-table> <el-col :span="1.5">
<el-button
type="warning"
plain
icon="el-icon-download"
size="mini"
@click="handleExport"
v-hasPermi="['system:user:export']"
>导出</el-button>
</el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList" :columns="columns"></right-toolbar>
</el-row>
<el-table v-loading="loading" :data="userList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="50" align="center" />
<el-table-column label="用户编号" align="center" key="userId" prop="userId" v-if="columns[0].visible" />
<el-table-column label="用户名称" align="center" key="userName" prop="userName" v-if="columns[1].visible" :show-overflow-tooltip="true" />
<el-table-column label="用户昵称" align="center" key="nickName" prop="nickName" v-if="columns[2].visible" :show-overflow-tooltip="true" />
<el-table-column label="部门" align="center" key="deptName" prop="dept.deptName" v-if="columns[3].visible" :show-overflow-tooltip="true" />
<el-table-column label="手机号码" align="center" key="phonenumber" prop="phonenumber" v-if="columns[4].visible" width="120" />
<el-table-column label="状态" align="center" key="status" v-if="columns[5].visible">
<template slot-scope="scope">
<el-switch
v-model="scope.row.status"
active-value="0"
inactive-value="1"
@change="handleStatusChange(scope.row)"
></el-switch>
</template>
</el-table-column>
<el-table-column label="创建时间" align="center" prop="createTime" v-if="columns[6].visible" width="160">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.createTime) }}</span>
</template>
</el-table-column>
<el-table-column
label="操作"
align="center"
width="160"
class-name="small-padding fixed-width"
>
<template slot-scope="scope" v-if="scope.row.userId !== 1">
<el-button
size="mini"
type="text"
icon="el-icon-edit"
@click="handleUpdate(scope.row)"
v-hasPermi="['system:user:edit']"
>修改</el-button>
<el-button
size="mini"
type="text"
icon="el-icon-delete"
@click="handleDelete(scope.row)"
v-hasPermi="['system:user:remove']"
>删除</el-button>
<el-dropdown size="mini" @command="(command) => handleCommand(command, scope.row)" v-hasPermi="['system:user:resetPwd', 'system:user:edit']">
<el-button size="mini" type="text" icon="el-icon-d-arrow-right">更多</el-button>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item command="handleResetPwd" icon="el-icon-key"
v-hasPermi="['system:user:resetPwd']">重置密码</el-dropdown-item>
<!-- <el-dropdown-item command="handleAuthRole" icon="el-icon-circle-check"
v-hasPermi="['system:user:edit']">分配角色</el-dropdown-item>-->
</el-dropdown-menu>
</el-dropdown>
</template>
</el-table-column>
</el-table>
<pagination <pagination
v-show="total>0" v-show="total>0"
:total="total" :total="total"
:page.sync="queryParams.pageNum" :page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize" :limit.sync="queryParams.pageSize"
@pagination="getList" @pagination="getList"
/> />
</el-col> </el-col>
</el-row> </el-row>
</div>
<!-- 添加或修改用户配置对话框 --> <!-- 添加或修改用户配置对话框 -->
<el-dialog :title="title" :visible.sync="open" width="600px" append-to-body> <el-dialog :title="title" :visible.sync="open" width="600px" append-to-body>
@ -268,19 +285,6 @@
</el-col> </el-col>
</el-row> </el-row>
<el-row> <el-row>
<el-col :span="12">
<el-form-item label="岗位">
<el-select v-model="form.postIds" multiple placeholder="请选择岗位">
<el-option
v-for="item in postOptions"
:key="item.postId"
:label="item.postName"
:value="item.postId"
:disabled="item.status == 1"
></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="角色"> <el-form-item label="角色">
<el-select v-model="form.roleIds" multiple placeholder="请选择角色"> <el-select v-model="form.roleIds" multiple placeholder="请选择角色">
@ -344,6 +348,8 @@
<script> <script>
import { listUser, getUser, delUser, addUser, updateUser, resetUserPwd, changeUserStatus, deptTreeSelect } from "@/api/system/user"; import { listUser, getUser, delUser, addUser, updateUser, resetUserPwd, changeUserStatus, deptTreeSelect } from "@/api/system/user";
import { getToken } from "@/utils/auth"; import { getToken } from "@/utils/auth";
import { listRole } from "@/api/system/role";
import { listTenant } from "@/api/pay/tenant";
import Treeselect from "@riophae/vue-treeselect"; import Treeselect from "@riophae/vue-treeselect";
import "@riophae/vue-treeselect/dist/vue-treeselect.css"; import "@riophae/vue-treeselect/dist/vue-treeselect.css";
@ -353,6 +359,12 @@ export default {
components: { Treeselect }, components: { Treeselect },
data() { data() {
return { return {
//
gsInfo:{
tenantName:'',
active_id:this.$store.state.user.tenantId,
list:[]
},
// //
loading: true, loading: true,
// //
@ -379,8 +391,6 @@ export default {
initPassword: undefined, initPassword: undefined,
// //
dateRange: [], dateRange: [],
//
postOptions: [],
// //
roleOptions: [], roleOptions: [],
// //
@ -444,11 +454,15 @@ export default {
} }
], ],
phonenumber: [ phonenumber: [
{ required: true, message: "手机号码不能为空", trigger: "blur" },
{ {
pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/, pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/,
message: "请输入正确的手机号码", message: "请输入正确的手机号码",
trigger: "blur" trigger: "blur"
} }
],
tenantId:[
{ required: true, message: "所属公司不能为空", trigger: "blur" },
] ]
} }
}; };
@ -460,16 +474,47 @@ export default {
} }
}, },
created() { created() {
this.getList(); if (!this.$store.state.user.tenantId) {
this.getDeptTree(); this.getGsInfoList()
}else {
this.gsInfo.active_id = this.$store.state.user.tenantId
this.getList();
this.getRoleList()
this.getDeptTree();
}
this.getConfigKey("sys.user.initPassword").then(response => { this.getConfigKey("sys.user.initPassword").then(response => {
this.initPassword = response.msg; this.initPassword = response.msg;
}); });
}, },
methods: { methods: {
//
getGsInfoList(){
listTenant({ name: this.gsInfo.tenantName }).then(response => {
if(response.rows.length>0){
this.gsInfo.list = response.rows;
this.gsInfo.active_id = this.gsInfo.list[0].id
this.getList()
this.getRoleList()
this.getDeptTree();
}else{
this.$alert(`没有查到相关公司,暂无数据!`, `提示`, {
type: 'warning'
});
}
});
},
//
changCompany(id){
this.gsInfo.active_id = id
this.getList()
this.getDeptTree();
this.getRoleList()
},
/** 查询用户列表 */ /** 查询用户列表 */
getList() { getList() {
this.loading = true; this.loading = true;
this.queryParams.tenantId = this.gsInfo.active_id;
listUser(this.addDateRange(this.queryParams, this.dateRange)).then(response => { listUser(this.addDateRange(this.queryParams, this.dateRange)).then(response => {
this.userList = response.rows; this.userList = response.rows;
this.total = response.total; this.total = response.total;
@ -477,9 +522,18 @@ export default {
} }
); );
}, },
/** 查询角色列表 */
getRoleList() {
listRole({
tenantId:this.gsInfo.active_id
}).then(response => {
this.roleOptions = response.rows;
}
);
},
/** 查询部门下拉树结构 */ /** 查询部门下拉树结构 */
getDeptTree() { getDeptTree() {
deptTreeSelect().then(response => { deptTreeSelect({tenantId: this.gsInfo.active_id}).then(response => {
this.deptOptions = response.data; this.deptOptions = response.data;
}); });
}, },
@ -522,7 +576,6 @@ export default {
sex: undefined, sex: undefined,
status: "0", status: "0",
remark: undefined, remark: undefined,
postIds: [],
roleIds: [] roleIds: []
}; };
this.resetForm("form"); this.resetForm("form");
@ -552,9 +605,9 @@ export default {
case "handleResetPwd": case "handleResetPwd":
this.handleResetPwd(row); this.handleResetPwd(row);
break; break;
case "handleAuthRole": /*case "handleAuthRole":
this.handleAuthRole(row); this.handleAuthRole(row);
break; break;*/
default: default:
break; break;
} }
@ -563,8 +616,6 @@ export default {
handleAdd() { handleAdd() {
this.reset(); this.reset();
getUser().then(response => { getUser().then(response => {
this.postOptions = response.data.posts;
this.roleOptions = response.data.roles;
this.open = true; this.open = true;
this.title = "添加用户"; this.title = "添加用户";
this.form.password = this.initPassword; this.form.password = this.initPassword;
@ -576,9 +627,6 @@ export default {
const userId = row.userId || this.ids; const userId = row.userId || this.ids;
getUser(userId).then(response => { getUser(userId).then(response => {
this.form = response.data.user; this.form = response.data.user;
this.postOptions = response.data.posts;
this.roleOptions = response.data.roles;
this.$set(this.form, "postIds", response.data.postIds);
this.$set(this.form, "roleIds", response.data.roleIds); this.$set(this.form, "roleIds", response.data.roleIds);
this.open = true; this.open = true;
this.title = "修改用户"; this.title = "修改用户";
@ -600,14 +648,15 @@ export default {
}).catch(() => {}); }).catch(() => {});
}, },
/** 分配角色操作 */ /** 分配角色操作 */
handleAuthRole: function(row) { /*handleAuthRole: function(row) {
const userId = row.userId; const userId = row.userId;
this.$router.push("/system/user-auth/role/" + userId); this.$router.push("/system/user-auth/role/" + userId);
}, },*/
/** 提交按钮 */ /** 提交按钮 */
submitForm: function() { submitForm: function() {
this.$refs["form"].validate(valid => { this.$refs["form"].validate(valid => {
if (valid) { if (valid) {
this.form.tenantId = this.gsInfo.active_id;
if (this.form.userId != undefined) { if (this.form.userId != undefined) {
updateUser(this.form).then(response => { updateUser(this.form).then(response => {
this.$modal.msgSuccess("修改成功"); this.$modal.msgSuccess("修改成功");
@ -669,3 +718,43 @@ export default {
} }
}; };
</script> </script>
<style scoped lang="scss">
.app-container {
display: flex;
.company {
border-radius: 5px;
width: 230px;
height: calc(100vh - 115px);
overflow-y: auto;
.cp-content {
margin-top: 20px;
.cp-item {
cursor: pointer;
padding: 6px 10px 6px 5px;
color: #424242;
font-size: 14px;
&:hover {
background: #f6f6f6;
}
}
.active{
background: #edf6ff;
}
}
}
.content{
padding-left: 15px;
width: calc(100% - 250px);
.el-button--medium {
padding: 2px 0px;
}
}
.content-all{
width: 100%;
.el-button--medium {
padding: 2px 0px;
}
}
}
</style>

Loading…
Cancel
Save