|
|
@@ -20,30 +20,44 @@
|
|
|
v-show="showSearch"
|
|
|
label-width="68px"
|
|
|
>
|
|
|
- <el-form-item label="用户名称" prop="username">
|
|
|
+ <el-form-item label="用户账号" prop="username">
|
|
|
<el-input
|
|
|
v-model="queryParams.username"
|
|
|
- placeholder="请输入用户名称"
|
|
|
+ placeholder="请输入用户账号"
|
|
|
clearable
|
|
|
- style="width: 240px"
|
|
|
+ style="width: 200px"
|
|
|
@keyup.enter.native="handleQuery"
|
|
|
/>
|
|
|
</el-form-item>
|
|
|
- <el-form-item label="手机号码" prop="phone">
|
|
|
- <el-input
|
|
|
+ <el-form-item label="用户角色" prop="roleIds">
|
|
|
+ <!-- <el-input
|
|
|
v-model="queryParams.phone"
|
|
|
placeholder="请输入手机号码"
|
|
|
clearable
|
|
|
- style="width: 240px"
|
|
|
+ style="width: 200px"
|
|
|
@keyup.enter.native="handleQuery"
|
|
|
- />
|
|
|
+ /> -->
|
|
|
+ <!-- @visible-change="selectAllRoles" -->
|
|
|
+ <el-select
|
|
|
+ style="width: 200px"
|
|
|
+ clearable
|
|
|
+ v-model="queryParams.roleId"
|
|
|
+ placeholder="请选择角色"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in role_options"
|
|
|
+ :key="item.id"
|
|
|
+ :label="item.roleName"
|
|
|
+ :value="item.id"
|
|
|
+ ></el-option>
|
|
|
+ </el-select>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="状态" prop="isLock">
|
|
|
<el-select
|
|
|
v-model="queryParams.isLock"
|
|
|
placeholder="用户状态"
|
|
|
clearable
|
|
|
- style="width: 240px"
|
|
|
+ style="width: 200px"
|
|
|
>
|
|
|
<el-option
|
|
|
v-for="dict in dict.type.sys_normal_disable"
|
|
|
@@ -119,52 +133,59 @@
|
|
|
></right-toolbar>
|
|
|
</el-row>
|
|
|
<el-table
|
|
|
+ border
|
|
|
+ height="485"
|
|
|
+ size="small"
|
|
|
v-loading="loading"
|
|
|
:data="userList"
|
|
|
@selection-change="handleSelectionChange"
|
|
|
>
|
|
|
+ <el-table-column fixed label="序号" align="center" min-width="50">
|
|
|
+ <template v-slot:default="scope">
|
|
|
+ <span v-text="getPageIndex(scope.$index)"> </span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
<el-table-column
|
|
|
- v-if="false"
|
|
|
- type="selection"
|
|
|
- width="50"
|
|
|
- align="center"
|
|
|
- />
|
|
|
- <el-table-column
|
|
|
- label="用户名称"
|
|
|
+ label="用户账号"
|
|
|
align="center"
|
|
|
key="username"
|
|
|
prop="username"
|
|
|
+ width="120"
|
|
|
v-if="columns[0].visible"
|
|
|
/>
|
|
|
<el-table-column
|
|
|
- label="用户昵称"
|
|
|
+ label="用户姓名"
|
|
|
align="center"
|
|
|
key="name"
|
|
|
prop="name"
|
|
|
+ width="120"
|
|
|
v-if="columns[1].visible"
|
|
|
:show-overflow-tooltip="true"
|
|
|
/>
|
|
|
|
|
|
<el-table-column
|
|
|
label="所属机构"
|
|
|
- align="center"
|
|
|
+ align="left"
|
|
|
key="orgName"
|
|
|
prop="orgName"
|
|
|
+ width="200"
|
|
|
v-if="columns[3].visible"
|
|
|
:show-overflow-tooltip="true"
|
|
|
/>
|
|
|
<el-table-column
|
|
|
label="用户角色"
|
|
|
- align="center"
|
|
|
+ align="left"
|
|
|
prop="roles"
|
|
|
+ width="160"
|
|
|
v-if="columns[2].visible"
|
|
|
:show-overflow-tooltip="true"
|
|
|
>
|
|
|
<template slot-scope="scope">
|
|
|
- <template v-for="item in scope.row.roles">
|
|
|
+ <!-- <template v-for="item in scope.row.roles">
|
|
|
{{ item.roleName }}
|
|
|
<br />
|
|
|
- </template>
|
|
|
+ </template> -->
|
|
|
+ <div class="cell" v-html="formatter(scope.row.roleNames)"></div>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
<el-table-column
|
|
|
@@ -214,6 +235,7 @@
|
|
|
label="操作"
|
|
|
align="center"
|
|
|
width="160"
|
|
|
+ fixed="right"
|
|
|
class-name="small-padding fixed-width"
|
|
|
>
|
|
|
<template slot-scope="scope" >
|
|
|
@@ -291,25 +313,25 @@
|
|
|
</el-row>
|
|
|
</layoutCom>
|
|
|
|
|
|
- <!-- 添加或修改用户配置对话框 -->
|
|
|
+ <!-- 添加或编辑配置对话框 -->
|
|
|
<DialogCom :title="title" :visible.sync="open" width="800px" append-to-body>
|
|
|
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
|
|
|
<el-row>
|
|
|
<el-col :span="10">
|
|
|
- <el-form-item label="用户名称" prop="username">
|
|
|
+ <el-form-item label="用户账号" prop="username">
|
|
|
<el-input
|
|
|
v-model="form.username"
|
|
|
- placeholder="请输入用户名"
|
|
|
+ placeholder="请输入用户账号"
|
|
|
maxlength="30"
|
|
|
:readonly="form.source == 1"
|
|
|
/>
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
<el-col :span="10">
|
|
|
- <el-form-item label="用户昵称" prop="name">
|
|
|
+ <el-form-item label="用户名称" prop="name">
|
|
|
<el-input
|
|
|
v-model="form.name"
|
|
|
- placeholder="请输入用户昵称"
|
|
|
+ placeholder="请输入用户名称"
|
|
|
maxlength="30"
|
|
|
:readonly="form.source == 1"
|
|
|
/>
|
|
|
@@ -387,25 +409,7 @@
|
|
|
</el-col> -->
|
|
|
</el-row>
|
|
|
<el-row>
|
|
|
- <!-- <el-col :span="10">
|
|
|
- <el-form-item v-if="!form.id" label="用户名称" prop="username">
|
|
|
- <el-input v-model="form.username" placeholder="请输入用户名称" maxlength="30" />
|
|
|
- </el-form-item>
|
|
|
- </el-col> -->
|
|
|
- <el-col :span="14">
|
|
|
- <el-form-item v-if="!form.id" label="用户密码" prop="password">
|
|
|
- <el-input
|
|
|
- v-model="form.password"
|
|
|
- placeholder="请输入用户密码"
|
|
|
- type="password"
|
|
|
- maxlength="20"
|
|
|
- show-password
|
|
|
- />
|
|
|
- </el-form-item>
|
|
|
- </el-col>
|
|
|
- </el-row>
|
|
|
- <el-row>
|
|
|
- <el-col :span="14">
|
|
|
+ <el-col :span="10">
|
|
|
<el-form-item label="状态">
|
|
|
<el-radio-group v-model="form.isLock">
|
|
|
<el-radio
|
|
|
@@ -418,6 +422,17 @@
|
|
|
</el-radio-group>
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
+ <el-col :span="10">
|
|
|
+ <el-form-item v-if="!form.id" label="用户密码" prop="password">
|
|
|
+ <el-input
|
|
|
+ v-model="form.password"
|
|
|
+ placeholder="请输入用户密码"
|
|
|
+ type="password"
|
|
|
+ maxlength="20"
|
|
|
+ show-password
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
</el-row>
|
|
|
</el-form>
|
|
|
<div slot="footer" class="dialog-footer">
|
|
|
@@ -486,6 +501,7 @@ import { getToken } from "@/utils/auth";
|
|
|
import { deptTreeSelect } from "@/api/system/public";
|
|
|
import tableList from "@/mixins/tableList";
|
|
|
import {getInfo}from "@/api/login";
|
|
|
+import {getRoles}from "@/api/system/public";
|
|
|
export default {
|
|
|
name: "User",
|
|
|
dicts: ["sys_normal_disable", "sys_user_sex","sys_user_is_lock"],
|
|
|
@@ -527,6 +543,8 @@ export default {
|
|
|
postOptions: [],
|
|
|
// 角色选项
|
|
|
roleOptions: [],
|
|
|
+ //所有角色用于查询
|
|
|
+ role_options: [],
|
|
|
// 表单参数
|
|
|
form: {},
|
|
|
// 用户导入参数
|
|
|
@@ -552,7 +570,7 @@ export default {
|
|
|
phone: null,
|
|
|
status: null,
|
|
|
orgId: null,
|
|
|
- checkSub: true,
|
|
|
+ checkSub: true
|
|
|
},
|
|
|
// 列信息
|
|
|
columns: [
|
|
|
@@ -568,16 +586,16 @@ export default {
|
|
|
// 表单校验
|
|
|
rules: {
|
|
|
username: [
|
|
|
- { required: true, message: "用户名称不能为空", trigger: "blur" },
|
|
|
+ { required: true, message: "用户账号不能为空", trigger: "blur" },
|
|
|
{
|
|
|
min: 2,
|
|
|
max: 20,
|
|
|
- message: "用户名称长度必须介于 2 和 20 之间",
|
|
|
+ message: "用户账号长度必须介于 2 和 20 之间",
|
|
|
trigger: "blur",
|
|
|
},
|
|
|
],
|
|
|
name: [
|
|
|
- { required: true, message: "用户昵称不能为空", trigger: "blur" },
|
|
|
+ { required: true, message: "用户名称不能为空", trigger: "blur" },
|
|
|
],
|
|
|
roleIds: [
|
|
|
{ required: true, message: "用户角色不能为空", trigger: "blur" },
|
|
|
@@ -626,12 +644,11 @@ export default {
|
|
|
},
|
|
|
|
|
|
created() {
|
|
|
- this.getDeptTree();
|
|
|
- getInfo().then((response)=>{
|
|
|
- this.roleOptions ==response.roles;
|
|
|
- })
|
|
|
+
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ this.getAllRoles();
|
|
|
},
|
|
|
- mounted() {},
|
|
|
watch: {
|
|
|
'form.orgId': {
|
|
|
handler(newValue, oldValue) {
|
|
|
@@ -647,10 +664,34 @@ export default {
|
|
|
deep: true
|
|
|
}},
|
|
|
methods: {
|
|
|
+ formatter(content){
|
|
|
+ if(content){
|
|
|
+ const strArr = content.toString().split(',');
|
|
|
+ let rel = "";
|
|
|
+ strArr.forEach(function(item,index,arr){
|
|
|
+ let ops = `<span style="color: #008CD6;"> ${item} </span> `;
|
|
|
+ rel = rel == "" ? ops: rel +" || "+ops;
|
|
|
+ })
|
|
|
+ return rel;
|
|
|
+ }
|
|
|
+ return "";
|
|
|
+
|
|
|
+ },
|
|
|
+ getPageIndex($index) {
|
|
|
+ //表格序号
|
|
|
+ return (
|
|
|
+ (this.queryParams.pageNum - 1) * this.queryParams.pageSize + $index + 1
|
|
|
+ );
|
|
|
+ },
|
|
|
cleanRoles(){
|
|
|
this.roleOptions=[];
|
|
|
|
|
|
},
|
|
|
+ getAllRoles(){
|
|
|
+ getRoles().then((response) =>{
|
|
|
+ this.role_options = response;
|
|
|
+ });
|
|
|
+ },
|
|
|
selectRoles(){
|
|
|
selectrolesByOrgId({orgId:this.form.orgId}).then((res)=>{
|
|
|
// console.log(res);
|
|
|
@@ -795,7 +836,7 @@ export default {
|
|
|
this.postOptions = response.posts;
|
|
|
this.roleOptions = response.roles;
|
|
|
this.open = true;
|
|
|
- this.title = "添加用户";
|
|
|
+ this.title = "新增";
|
|
|
this.form.password = this.initPassword;
|
|
|
});
|
|
|
},
|
|
|
@@ -812,7 +853,7 @@ export default {
|
|
|
this.$set(this.form, "postIds", response.postIds);
|
|
|
this.$set(this.form, "roleIds", response.roleIds);
|
|
|
this.open = true;
|
|
|
- this.title = "修改用户";
|
|
|
+ this.title = "编辑";
|
|
|
this.form.password = "";
|
|
|
});
|
|
|
},
|
gaoxiong