<template>
|
<basic-container>
|
<avue-crud
|
ref="userCrud"
|
:data="tableData"
|
:option="option"
|
:page.sync="page"
|
:table-loading="tableLoading"
|
@on-load="getTableList"
|
@refresh-change="handleRefresh"
|
@search-change="handleSearch"
|
@search-reset="handleReset"
|
@size-change="sizeChange"
|
@current-change="currentChange"
|
@selection-change="selectChange"
|
@row-click="rowClickHandler"
|
>
|
<template slot="status" slot-scope="{row}">
|
<el-tag v-if="row.status === 0" type="success">启用</el-tag>
|
<el-tag v-if="row.status === 1" type="danger">停用</el-tag>
|
</template>
|
|
<template slot="lockFlag" slot-scope="{row}">
|
<el-tag v-if="!row.lockFlag" type="success">未锁定</el-tag>
|
<el-tag v-if="row.lockFlag" type="danger">锁定</el-tag>
|
</template>
|
|
<template #menu="{row,index,size}">
|
<el-button size="small" type="text" @click="stopUserHandler(row)">
|
<span v-if="row.status === 0" style="color: #fa3434"><i class="el-icon-video-pause"></i> 停用</span>
|
<span v-if="row.status === 1" style="color: #55b61d"><i class="el-icon-video-pause"></i> 启用</span>
|
</el-button>
|
</template>
|
|
<template slot="menuLeft" slot-scope="scope">
|
<el-button icon="el-icon-delete" plain size="small" type="danger">删除</el-button>
|
<el-button icon="el-icon-user" plain size="small" type="primary" @click="roleHandler">分配角色</el-button>
|
<el-button icon="el-icon-school" plain size="small" type="primary">分配部门</el-button>
|
<el-button icon="el-icon-key" plain size="small" type="success">设置密码策略</el-button>
|
<el-button icon="el-icon-upload2" plain size="small" type="primary">导入人员</el-button>
|
<el-button icon="el-icon-download" plain size="small" type="primary">下载导入模板</el-button>
|
</template>
|
</avue-crud>
|
<transfer ref="transfer" :left-role-data="leftRoleData" :right-role-data="rightRoleData" :transferTitle="transferTitle" title="分配角色"
|
@transferSend="roleSendHandler"></transfer>
|
</basic-container>
|
</template>
|
|
<script>
|
import basicOption from '@/util/basic-option'
|
import {getDataUsers, stopUser, gridRoles, listRoleByUserOid, saveRights, addUser, updateUser, deleteUser} from '@/api/system/user/api'
|
import {column} from "./option"
|
import func from '@/util/func'
|
|
export default {
|
name: "userManage",
|
data() {
|
return {
|
tableLoading: false,
|
tableData: [],
|
option: {
|
...basicOption,
|
calcHeight: -60,
|
column: column
|
},
|
page: {
|
currentPage: 1,
|
pageSize: 10,
|
total: 0,
|
pageSizes: [10, 30, 50, 100],
|
},
|
searchParams: {},
|
selectList: [],
|
leftRoleData: [], // 分配角色穿梭框左侧初始数据
|
rightRoleData: [], // 分配角色穿梭框右侧初始数据
|
transferTitle:['现有角色', '拥有角色']
|
}
|
},
|
created() {
|
},
|
methods: {
|
// 表格请求
|
getTableList() {
|
this.tableLoading = true;
|
getDataUsers(this.page.currentPage, this.page.pageSize, this.searchParams).then(res => {
|
const data = res.data.data;
|
this.tableData = data;
|
this.page.total = res.data.total;
|
this.tableLoading = false;
|
}).catch(err => {
|
this.$message.error(err)
|
});
|
},
|
|
// 表格右侧刷新图标
|
handleRefresh() {
|
this.getTableList();
|
},
|
|
// 搜索查询
|
handleSearch(params, done) {
|
if (!func.isEmptyObject(params)) {
|
for (let key in params) {
|
if (params.hasOwnProperty(key)) {
|
// 判断如果 key 是 'pkPersonName'，则改为 'pkPerson' 分别为显示值和保存值
|
let newKey = key === 'pkPersonName' ? 'pkPerson' : key;
|
this.searchParams[`conditionMap["${newKey}"]`] = params[key];
|
}
|
}
|
} else {
|
this.searchParams = {};
|
}
|
this.getTableList();
|
done();
|
},
|
|
// 重置搜索条件
|
handleReset() {
|
this.searchParams = {};
|
this.getTableList();
|
},
|
|
// 条数
|
sizeChange(val) {
|
this.page.pageSize = val;
|
},
|
|
// 页码
|
currentChange(val) {
|
this.page.currentPage = val;
|
},
|
|
// 停用启用
|
stopUserHandler(row) {
|
let params = {};
|
params = {
|
ids: row.oid,
|
flag: row.status === 0 ? true : false
|
}
|
stopUser(params).then(res => {
|
this.$message.success(res.data.obj);
|
this.getTableList();
|
}).catch(err => {
|
this.$message.error(err)
|
})
|
},
|
|
// 选择框
|
selectChange(row) {
|
this.selectList = row;
|
},
|
|
// 点击行
|
rowClickHandler(row) {
|
this.$refs.userCrud.toggleRowSelection(row);
|
},
|
|
// 分配角色
|
roleHandler() {
|
if (this.selectList.length > 1) {
|
this.$message.warning('只能选择一条数据进行分配！');
|
return;
|
}
|
|
if (this.selectList.length < 1) {
|
this.$message.warning('至少选择一条数据进行分配！');
|
return;
|
}
|
this.leftRoleData = [];
|
this.rightRoleData = [];
|
const userOid = this.selectList[0].oid;
|
gridRoles(1, -1).then(res => {
|
this.leftRoleData = res.data.data;
|
listRoleByUserOid(userOid).then(res => {
|
this.rightRoleData = res.data.data.map(item => item.oid);
|
})
|
}).catch(err => {
|
this.$message.error(err)
|
})
|
this.$refs.transfer.visible = true;
|
},
|
|
// 穿梭框组件回填
|
roleSendHandler(row) {
|
let params = {
|
userOid: this.selectList[0].oid,
|
roleIds: row.join(',')
|
}
|
saveRights(params).then(res => {
|
this.$message.success(res.data.obj);
|
this.getTableList();
|
}).catch(err => {
|
this.$message.error(err)
|
})
|
}
|
}
|
|
}
|
</script>
|
|
<style scoped>
|
|
</style>
|
