Merge branch 'ehs' of https://e.coding.net/ctcdevteam/ehs/ehs_web into ehs
This commit is contained in:
曹前明
commit
64bb493494
|
|
@ -2,22 +2,6 @@ import config from "@/config"
|
|||
import http from "@/utils/request"
|
||||
|
||||
export default {
|
||||
menu: {
|
||||
myMenus: {
|
||||
url: `${config.API_URL}/system/menu/my/1.6.1`,
|
||||
name: "获取我的菜单",
|
||||
get: async function(){
|
||||
return await http.get(this.url);
|
||||
}
|
||||
},
|
||||
list: {
|
||||
url: `${config.API_URL}/system/menu/list`,
|
||||
name: "获取菜单",
|
||||
get: async function(){
|
||||
return await http.get(this.url);
|
||||
}
|
||||
}
|
||||
},
|
||||
dept: {
|
||||
list: {
|
||||
url: `${config.API_URL}/system/dept/`,
|
||||
|
|
@ -45,7 +29,7 @@ export default {
|
|||
delete: {
|
||||
name: "删除部门",
|
||||
req: async function(id){
|
||||
return await http.delete(`${config.API_URL}/hrm/employee/${id}/`);
|
||||
return await http.delete(`${config.API_URL}/system/employee/${id}/`);
|
||||
}
|
||||
}
|
||||
},
|
||||
|
|
@ -158,28 +142,71 @@ export default {
|
|||
},
|
||||
role: {
|
||||
list: {
|
||||
url: `${config.API_URL}/system/role/list2`,
|
||||
url: `${config.API_URL}/system/role`,
|
||||
name: "获取角色列表",
|
||||
get: async function(params){
|
||||
return await http.get(this.url, params);
|
||||
req: async function(data){
|
||||
return await http.get(this.url, data);
|
||||
}
|
||||
}
|
||||
},
|
||||
create: {
|
||||
url: `${config.API_URL}/system/role/`,
|
||||
name: "新增角色",
|
||||
req: async function(data){
|
||||
return await http.post(this.url,data);
|
||||
}
|
||||
},
|
||||
update: {
|
||||
name: "更新角色",
|
||||
req: async function(id, data){
|
||||
return await http.put(
|
||||
`${config.API_URL}/system/role/${id}/`,
|
||||
data
|
||||
);
|
||||
}
|
||||
},
|
||||
delete: {
|
||||
name: "删除菜单权限",
|
||||
req: async function(id){
|
||||
return await http.delete(`${config.API_URL}/system/role/${id}/`);
|
||||
}
|
||||
},
|
||||
},
|
||||
|
||||
user: {
|
||||
list: {
|
||||
url: `${config.API_URL}/system/user/list`,
|
||||
name: "获取用户列表",
|
||||
get: async function(params){
|
||||
req: async function(params){
|
||||
return await http.get(this.url, params);
|
||||
}
|
||||
}
|
||||
},
|
||||
create: {
|
||||
url: `${config.API_URL}/system/user/`,
|
||||
name: "新增用户",
|
||||
req: async function(data){
|
||||
return await http.post(this.url,data);
|
||||
}
|
||||
},
|
||||
update: {
|
||||
name: "更新用户",
|
||||
req: async function(id, data){
|
||||
return await http.put(
|
||||
`${config.API_URL}/system/user/${id}/`,
|
||||
data
|
||||
);
|
||||
}
|
||||
},
|
||||
delete: {
|
||||
name: "删除用户",
|
||||
req: async function(id){
|
||||
return await http.delete(`${config.API_URL}/system/user/${id}/`);
|
||||
}
|
||||
},
|
||||
},
|
||||
log: {
|
||||
list: {
|
||||
url: `${config.API_URL}/system/log/list`,
|
||||
name: "日志列表",
|
||||
get: async function(params){
|
||||
req: async function(params){
|
||||
return await http.get(this.url, params);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -314,7 +314,7 @@ export default {
|
|||
} else {
|
||||
dataList = response.rows || [];
|
||||
}
|
||||
if(this.$route.path==='/sys/dept'||this.$route.path==='/sys/perm'){
|
||||
if(this.$route.path==='/sys/dept'||this.$route.path==='/ops/menu'){
|
||||
this.tableData = this.redata(dataList);
|
||||
debugger;
|
||||
console.log(this.tableData)
|
||||
|
|
|
|||
|
|
@ -230,6 +230,15 @@ const routes = [
|
|||
},
|
||||
"component": "am/area"
|
||||
},
|
||||
{
|
||||
"name": "eqm",
|
||||
"path": "/am/eqm",
|
||||
"meta": {
|
||||
"title": "门禁通道",
|
||||
"icon": "el-icon-menu",
|
||||
},
|
||||
"component": "am/em1"
|
||||
},
|
||||
]
|
||||
},
|
||||
{
|
||||
|
|
|
|||
|
|
@ -0,0 +1,340 @@
|
|||
<template>
|
||||
<el-container>
|
||||
<el-header>
|
||||
<div class="left-panel">
|
||||
<el-button type="primary" icon="el-icon-plus" @click="addDept"></el-button>
|
||||
<el-button type="danger" plain icon="el-icon-delete" :disabled="selection.length==0" @click="batch_del"></el-button>
|
||||
</div>
|
||||
<div class="right-panel">
|
||||
<div class="right-panel-search">
|
||||
<el-input v-model="search.keyword" placeholder="部门名称" clearable></el-input>
|
||||
<el-button type="primary" icon="el-icon-search" @click="upsearch"></el-button>
|
||||
</div>
|
||||
</div>
|
||||
</el-header>
|
||||
<el-main class="nopadding">
|
||||
<scTable ref="table" :apiObj="apiObj" :params="params" row-key="id" @selection-change="selectionChange"
|
||||
hidePagination>
|
||||
<el-table-column type="selection" width="50"></el-table-column>
|
||||
<el-table-column label="#" type="index" width="50"></el-table-column>
|
||||
<el-table-column label="菜单名称" prop="name" min-width="200"></el-table-column>
|
||||
<el-table-column label="类型" prop="type" min-width="200">
|
||||
<template #default="scope">
|
||||
<span>{{types[scope.row.type]}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="代号" prop="codes" min-width="200"></el-table-column>
|
||||
<el-table-column label="排序" prop="sort" min-width="200"></el-table-column>
|
||||
<el-table-column label="操作" fixed="right" align="center" width="200">
|
||||
<template #default="scope">
|
||||
<el-button type="text" size="small" @click="editDept(scope.row, scope.$index)">编辑</el-button>
|
||||
<el-divider direction="vertical"></el-divider>
|
||||
<el-popconfirm title="确定删除吗？" @confirm="delDept(scope.row, scope.$index)">
|
||||
<template #reference>
|
||||
<el-button type="text" size="small">删除</el-button>
|
||||
</template>
|
||||
</el-popconfirm>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</scTable>
|
||||
</el-main>
|
||||
</el-container>
|
||||
<el-dialog :title="titleMap[type]" v-model="limitedVisible" :width="600">
|
||||
<el-form :model="addForm" :rules="rules" ref="addForm" label-width="100px" label-position="right">
|
||||
<el-form-item label="类型" prop="type">
|
||||
<el-radio-group v-model="addForm.type">
|
||||
<el-radio :label="10">目录</el-radio>
|
||||
<el-radio :label="20">菜单</el-radio>
|
||||
<el-radio :label="30">按钮</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="名称" prop="name">
|
||||
<el-input v-model="addForm.name" clearable></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="标识">
|
||||
<el-input v-model="codes" clearable style="width: 90%;"></el-input>
|
||||
<!--<el-button class="formAddButton" type="primary" icon="el-icon-plus" @click="addCodes"></el-button>
|
||||
<div v-if="codesLimited" style="display: flex">
|
||||
<el-input v-model="codes" clearable style="width: 50%;flex: 1"></el-input>
|
||||
<div style="width: 50%;display: inline-block;position: relative;flex: 1">
|
||||
<el-button class="formSaveButton" type="success" icon="el-icon-check" @click="saveCodes"></el-button>
|
||||
<el-button class="formDelButton" type="danger" icon="el-icon-close" @click="delCodes"></el-button>
|
||||
</div>
|
||||
|
||||
</div>-->
|
||||
</el-form-item>
|
||||
<el-form-item label="父级">
|
||||
<el-cascader
|
||||
v-model="addForm.parent"
|
||||
:options="group"
|
||||
:props="groupsProps"
|
||||
:show-all-levels="false"
|
||||
clearable
|
||||
style="width: 100%"
|
||||
@change="handleChange"
|
||||
></el-cascader>
|
||||
<!--<el-input v-model="addForm.parent" clearable></el-input>-->
|
||||
</el-form-item>
|
||||
<el-form-item label="排序">
|
||||
<el-input-number v-model="addForm.sort" controls-position="right" :min="1"
|
||||
style="width: 100%;"></el-input-number>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<el-button @click="limitedVisible=false">取 消</el-button>
|
||||
<el-button type="primary" :loading="isSaving" @click="submitHandle()">保 存</el-button>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'dept',
|
||||
data() {
|
||||
return {
|
||||
dialog: {
|
||||
save: false,
|
||||
permission: false
|
||||
},
|
||||
apiObj: this.$API.system.permission.list,
|
||||
selection: [],
|
||||
search: {
|
||||
keyword: null
|
||||
},
|
||||
params: {
|
||||
page: 0
|
||||
},
|
||||
isSaving: false,
|
||||
codesLimited: false,
|
||||
limitedVisible: false,
|
||||
type: "add",
|
||||
codes:'',
|
||||
titleMap: {
|
||||
add: '新增',
|
||||
edit: '编辑',
|
||||
},
|
||||
|
||||
//表单数据
|
||||
addForm: {
|
||||
id: "",
|
||||
name: "",
|
||||
codes:[],
|
||||
type: 10,
|
||||
sort: 1,
|
||||
parent: null,
|
||||
},
|
||||
//验证规则
|
||||
rules: {
|
||||
name: [
|
||||
{required: true, message: '请输入名称'}
|
||||
],
|
||||
type: [
|
||||
{required: true, message: '请选择类型'}
|
||||
],
|
||||
},
|
||||
types:{
|
||||
10:'目录',
|
||||
20:'菜单',
|
||||
30:'按钮',
|
||||
},
|
||||
groupsProps: {
|
||||
value: "id",
|
||||
multiple: false,
|
||||
checkStrictly: true,
|
||||
},
|
||||
group: [],
|
||||
permList: [],
|
||||
permCodes: [],
|
||||
}
|
||||
},
|
||||
|
||||
mounted() {
|
||||
this.getGroup();
|
||||
this.getPermCodes();
|
||||
},
|
||||
methods: {
|
||||
getPermCodes(){
|
||||
this.permCodes = this.$API.system.permission.codes.req();
|
||||
},
|
||||
handleChange(value) {
|
||||
// this.menu.checked = check.checkedKeys;
|
||||
debugger;
|
||||
console.log(value);
|
||||
console.log(this.addForm.parent);
|
||||
},
|
||||
//加载树数据
|
||||
async getGroup() {
|
||||
var res = await this.$API.system.permission.list.req({page: 0});
|
||||
debugger;
|
||||
let permList = res;
|
||||
this.permList = res;
|
||||
let posts = [];
|
||||
permList.forEach(item => {
|
||||
let obj = new Object();
|
||||
obj.id = item.id;
|
||||
obj.label = item.name;
|
||||
obj.parent = item.parent;
|
||||
posts.push(obj)
|
||||
});
|
||||
let obj = posts.reduce((res, v) => (res[v.id] = v , res), {});//Object
|
||||
let arr = [];
|
||||
for (let item of posts) {
|
||||
if (item.parent == null) {
|
||||
arr.push(item);
|
||||
continue
|
||||
}
|
||||
let parent = obj[item.parent];
|
||||
parent.children = parent.children ? parent.children : [];
|
||||
parent.children.push(item);
|
||||
}
|
||||
debugger;
|
||||
this.group = arr;
|
||||
},
|
||||
|
||||
//添加
|
||||
addDept() {
|
||||
this.type = 'add';
|
||||
this.limitedVisible = true;
|
||||
},
|
||||
addCodes(){
|
||||
this.codesLimited = true;
|
||||
},
|
||||
saveCodes(){
|
||||
debugger;console.log(this.addForm.codes);
|
||||
this.addForm.codes.push(this.codes);
|
||||
this.codes = ''
|
||||
},
|
||||
delCodes(){
|
||||
this.codesLimited = false;
|
||||
this.codes = ''
|
||||
},
|
||||
//编辑
|
||||
editDept(row) {
|
||||
// debugger;
|
||||
this.type = 'edit';
|
||||
this.addForm.id = row.id;
|
||||
this.addForm.name = row.name;
|
||||
debugger;
|
||||
console.log(row.codes);
|
||||
this.codes = row.codes.join(',');
|
||||
let parent = row.parent!==null?this.findParents(this.permList, row.parent):'';
|
||||
this.addForm.parent = parent;
|
||||
this.addForm.type = row.type ;
|
||||
/*debugger;
|
||||
console.log(row.type);
|
||||
console.log(this.addForm.type);*/
|
||||
this.addForm.sort = row.sort;
|
||||
this.limitedVisible = true;
|
||||
},
|
||||
findParents(arr, parent) {
|
||||
debugger;
|
||||
let data = [];
|
||||
arr.forEach(item => {
|
||||
if (item.id === parent) {
|
||||
data.unshift(item.id);
|
||||
if (item.parent !== null) {
|
||||
this.findParents(arr, item.parent)
|
||||
} else {
|
||||
return data
|
||||
}
|
||||
}
|
||||
});
|
||||
debugger;
|
||||
return data
|
||||
},
|
||||
//删除
|
||||
delDept(row) {
|
||||
var id = row.id;
|
||||
var res = this.$API.system.permDel.delete(id);
|
||||
if (res.code == 200) {
|
||||
this.$refs.table.refresh();
|
||||
this.$message.success("删除成功")
|
||||
} else {
|
||||
this.$alert(res.message, "提示", {type: 'error'})
|
||||
}
|
||||
},
|
||||
submitHandle() {
|
||||
let that = this;
|
||||
debugger;
|
||||
console.log(this.addForm.parent);
|
||||
debugger;
|
||||
if (this.addForm.parent !== null) {
|
||||
this.addForm.parent = this.addForm.parent[this.addForm.parent.length - 1];
|
||||
} else {
|
||||
this.addForm.parent = ""
|
||||
}
|
||||
debugger;
|
||||
console.log(this.codes);
|
||||
|
||||
if(this.codes.indexOf(','>-1)){
|
||||
this.addForm.codes = this.codes.split(',');
|
||||
}else{
|
||||
this.addForm.codes.push(this.codes)
|
||||
}
|
||||
debugger;
|
||||
console.log(this.addForm.codes);
|
||||
this.$refs.addForm.validate((valid) => {
|
||||
debugger;
|
||||
if (valid) {
|
||||
this.isSaveing = true;
|
||||
var res;
|
||||
if (this.type === 'add') {
|
||||
res = this.$API.system.permission.create.req(that.addForm);
|
||||
} else {
|
||||
res = this.$API.system.permission.update.req(that.addForm.id, that.addForm);
|
||||
}
|
||||
this.isSaveing = false;
|
||||
this.limitedVisible = false;
|
||||
this.$refs.table.refresh();
|
||||
console.log(res);
|
||||
debugger;
|
||||
}
|
||||
})
|
||||
},
|
||||
//表格选择后回调事件
|
||||
selectionChange(selection) {
|
||||
this.selection = selection;
|
||||
},
|
||||
//搜索
|
||||
upsearch() {
|
||||
|
||||
},
|
||||
//本地更新数据
|
||||
handleSaveSuccess(data, mode) {
|
||||
if (mode == 'add') {
|
||||
this.$refs.table.refresh()
|
||||
} else if (mode == 'edit') {
|
||||
this.$refs.table.refresh()
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.formAddButton{
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
padding: 0;
|
||||
text-align: center;
|
||||
line-height: 32px;
|
||||
border-radius: 16px;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top : 0
|
||||
}
|
||||
.formSaveButton,.formDelButton{
|
||||
padding: 0;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
text-align: center;
|
||||
line-height: 30px;
|
||||
border-radius: 15px;
|
||||
position: absolute;
|
||||
left: 20px;
|
||||
top : 0
|
||||
}
|
||||
.formDelButton{
|
||||
left: 60px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -52,8 +52,8 @@
|
|||
</el-form-item>
|
||||
<el-form-item label="类型">
|
||||
<el-select v-model="addForm.type" placeholder="Select" style="width: 100%;">
|
||||
<el-option label="公司" value="10"></el-option>
|
||||
<el-option label="部门" value="20"></el-option>
|
||||
<el-option label="公司" value="company"></el-option>
|
||||
<el-option label="部门" value="dept"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="排序">
|
||||
|
|
@ -96,7 +96,7 @@
|
|||
addForm: {
|
||||
id:"",
|
||||
name: "",
|
||||
type: "10",
|
||||
type: "dept",
|
||||
sort: 1,
|
||||
parent: "",
|
||||
},
|
||||
|
|
@ -193,7 +193,7 @@
|
|||
//删除
|
||||
delDept(row){
|
||||
var id = row.id;
|
||||
var res = this.$API.system.deptDel.delete(id);
|
||||
var res = this.$API.system.dept.delete.req(id);
|
||||
if(res.code == 200){
|
||||
this.$refs.table.refresh();
|
||||
this.$message.success("删除成功")
|
||||
|
|
@ -213,9 +213,9 @@
|
|||
this.isSaveing = true;
|
||||
var res;
|
||||
if(this.type==='add'){
|
||||
res = this.$API.system.deptAdd.post(that.addForm);
|
||||
res = this.$API.system.dept.create.req(that.addForm);
|
||||
}else{
|
||||
res = this.$API.system.deptEdit.put(that.addForm.id,that.addForm);
|
||||
res = this.$API.system.dept.update.req(that.addForm.id,that.addForm);
|
||||
}
|
||||
this.isSaveing = false;
|
||||
this.limitedVisible = false;
|
||||
|
|
|
|||
|
|
@ -0,0 +1,254 @@
|
|||
<template>
|
||||
<el-container>
|
||||
<el-header>
|
||||
<div class="left-panel">
|
||||
<el-button type="primary" icon="el-icon-plus" @click="roleAdd"></el-button>
|
||||
<el-button type="danger" plain icon="el-icon-delete" :disabled="selection.length!==1" @click="batch_del"></el-button>
|
||||
<!--<el-button type="primary" plain :disabled="selection.length!=1" @click="permission">权限设置</el-button>-->
|
||||
</div>
|
||||
<div class="right-panel">
|
||||
<div class="right-panel-search">
|
||||
<el-input v-model="search.keyword" placeholder="角色名称" clearable></el-input>
|
||||
<el-button type="primary" icon="el-icon-search" @click="upsearch"></el-button>
|
||||
</div>
|
||||
</div>
|
||||
</el-header>
|
||||
<el-main class="nopadding">
|
||||
<scTable ref="table" :apiObj="apiObj" row-key="id" @selection-change="selectionChange" hidePagination>
|
||||
<el-table-column type="selection" width="50"></el-table-column>
|
||||
<el-table-column label="#" type="index" width="50"></el-table-column>
|
||||
<el-table-column label="角色名称" prop="name" width="250"></el-table-column>
|
||||
<el-table-column label="角色标识" prop="code" width="150"></el-table-column>
|
||||
<el-table-column label="角色描述" prop="description" width="150"></el-table-column>
|
||||
<el-table-column label="操作" fixed="right" align="center" width="140">
|
||||
<template #default="scope">
|
||||
<el-button type="text" size="small" @click="roleEdit(scope.row, scope.$index)">编辑</el-button>
|
||||
<el-divider direction="vertical"></el-divider>
|
||||
<el-popconfirm title="确定删除吗？" @confirm="roleDel(scope.row, scope.$index)">
|
||||
<template #reference>
|
||||
<el-button type="text" size="small">删除</el-button>
|
||||
</template>
|
||||
</el-popconfirm>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</scTable>
|
||||
</el-main>
|
||||
</el-container>
|
||||
<el-dialog :title="titleMap[type]" v-model="limitedVisible" :width="600">
|
||||
<el-form :model="addForm" :rules="rules" ref="addForm" autocomplete =‘off’ label-width="100px" label-position="left">
|
||||
<el-form-item label="角色" prop="name" auto>
|
||||
<el-input v-model="addForm.name" clearable></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="角色标识">
|
||||
<el-input v-model="addForm.code" clearable></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="描述">
|
||||
<el-input v-model="addForm.description" clearable></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="权限功能">
|
||||
<div class="treeMain">
|
||||
<el-tree
|
||||
ref="menu"
|
||||
node-key="id"
|
||||
show-checkbox
|
||||
:data="menu.list"
|
||||
:props="menu.props"
|
||||
:default-checked-keys="menu.checked"
|
||||
@check="handleChange"
|
||||
></el-tree>
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<el-button @click="limitedVisible=false" >取 消</el-button>
|
||||
<el-button v-if="type!=='show'" type="primary" :loading="isSaving" @click="submitHandle()">保 存</el-button>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
<script>
|
||||
const defaultForm = {
|
||||
id:"",
|
||||
name: "",
|
||||
code: "",
|
||||
description: "",
|
||||
perms:[],
|
||||
};
|
||||
export default {
|
||||
name: 'dept',
|
||||
data() {
|
||||
return {
|
||||
apiObj: this.$API.system.role.list,
|
||||
selection: [],
|
||||
checkList: [],
|
||||
search: {
|
||||
keyword: null
|
||||
},
|
||||
isSaving: false,
|
||||
limitedVisible : false,
|
||||
type: "add",
|
||||
titleMap: {
|
||||
add: '新增',
|
||||
edit: '编辑',
|
||||
show: '查看'
|
||||
},
|
||||
|
||||
//表单数据
|
||||
addForm: defaultForm,
|
||||
//验证规则
|
||||
rules: {
|
||||
name: [
|
||||
{required: true, message: '请输入角色名称'}
|
||||
],
|
||||
},
|
||||
menu: {
|
||||
list: [],
|
||||
checked: [],
|
||||
props: {
|
||||
children: 'children',
|
||||
label: 'name',
|
||||
/*label: (data)=>{
|
||||
return data.meta.title
|
||||
}*/
|
||||
}
|
||||
},
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.getList();
|
||||
this.getGroup();
|
||||
},
|
||||
methods: {
|
||||
handleChange(item, check) {
|
||||
this.menu.checked = check.checkedKeys;
|
||||
debugger;
|
||||
console.log(check);
|
||||
console.log(this.checkList);
|
||||
},
|
||||
//加载树数据
|
||||
async getGroup() {
|
||||
var res = await this.$API.system.dept.list.req({page: 0});
|
||||
let postList = res;
|
||||
let posts = [];
|
||||
postList.forEach(item => {
|
||||
let obj = new Object();
|
||||
obj.id = item.id;
|
||||
obj.name = item.name;
|
||||
obj.parentId = item.parent;
|
||||
obj.label=item.name;
|
||||
posts.push(obj)
|
||||
});
|
||||
let obj = posts.reduce((res, v) => (res[v.id] = v , res), {});//Object
|
||||
let arr = [];
|
||||
// debugger;
|
||||
console.log(obj);
|
||||
for (let item of posts) {
|
||||
debugger;
|
||||
if (item.parentId == null) {
|
||||
arr.push(item);
|
||||
continue
|
||||
}
|
||||
let parent = obj[item.parentId];
|
||||
parent.children = parent.children ? parent.children : [];
|
||||
parent.children.push(item);
|
||||
}
|
||||
this.menu.list = arr;
|
||||
},
|
||||
//获取角色列表
|
||||
getList(){
|
||||
var res = this.$API.system.role.list.req();
|
||||
this.tableData = res.results;
|
||||
},
|
||||
//添加角色
|
||||
roleAdd(){
|
||||
this.limitedVisible = true;
|
||||
this.addForm = defaultForm;
|
||||
},
|
||||
/*handleChange(value){
|
||||
debugger;
|
||||
console.log(value);
|
||||
console.log(this.menu.list);
|
||||
},*/
|
||||
submitHandle(){
|
||||
debugger;
|
||||
let that = this;
|
||||
debugger;
|
||||
this.addForm.perms = this.menu.checked;
|
||||
this.$refs.addForm.validate( (valid) => {
|
||||
debugger;
|
||||
if (valid) {
|
||||
this.isSaveing = true;
|
||||
var res;
|
||||
if(this.type==='add'){
|
||||
res = this.$API.system.role.create.req(that.addForm);
|
||||
}else{
|
||||
res = this.$API.system.role.update.req(that.addForm.id,that.addForm);
|
||||
}
|
||||
this.isSaveing = false;
|
||||
this.limitedVisible = false;
|
||||
this.$refs.table.refresh();
|
||||
console.log(res);
|
||||
debugger;
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
//编辑角色
|
||||
roleEdit(row){
|
||||
this.type='edit';
|
||||
this.limitedVisible = true;
|
||||
this.addForm.id=row.id;
|
||||
this.addForm.name=row.name;
|
||||
this.addForm.code=row.code;
|
||||
this.addForm.description=row.description;
|
||||
},
|
||||
|
||||
//删除角色
|
||||
async roleDel(row){
|
||||
var id = row.id;
|
||||
var res = await this.$API.system.roleDel.delete(id);
|
||||
if(res.err_msg){
|
||||
this.$message.error(res.err_msg)
|
||||
}else{
|
||||
this.$refs.table.refresh();
|
||||
this.$message.success("删除成功")
|
||||
// this.$alert(res.message, "提示", {type: 'error'})
|
||||
}
|
||||
},
|
||||
//表格选择后回调事件
|
||||
selectionChange(selection){
|
||||
this.selection = selection;
|
||||
},
|
||||
//搜索
|
||||
upsearch(){
|
||||
|
||||
},
|
||||
//根据ID获取树结构
|
||||
filterTree(id){
|
||||
var target = null;
|
||||
function filter(tree){
|
||||
tree.forEach(item => {
|
||||
if(item.id == id){
|
||||
target = item
|
||||
}
|
||||
if(item.children){
|
||||
filter(item.children)
|
||||
}
|
||||
})
|
||||
}
|
||||
filter(this.$refs.table.tableData)
|
||||
return target
|
||||
},
|
||||
//本地更新数据
|
||||
handleSaveSuccess(data, type){
|
||||
if(type=='add'){
|
||||
this.$refs.table.refresh()
|
||||
}else if(type=='edit'){
|
||||
this.$refs.table.refresh()
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
.treeMain {height:280px;overflow: auto;border: 1px solid #dcdfe6;margin-bottom: 10px;}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,507 @@
|
|||
<template>
|
||||
<el-container>
|
||||
<el-aside width="200px" v-loading="showGrouploading">
|
||||
<el-container>
|
||||
<el-header style="border-bottom: none">
|
||||
<el-input
|
||||
placeholder="输入关键字进行过滤"
|
||||
v-model="groupFilterText"
|
||||
clearable
|
||||
></el-input>
|
||||
</el-header>
|
||||
<el-main class="nopadding">
|
||||
<el-tree
|
||||
ref="group"
|
||||
class="menu"
|
||||
node-key="id"
|
||||
:data="group"
|
||||
:current-node-key="''"
|
||||
:highlight-current="true"
|
||||
:expand-on-click-node="false"
|
||||
:filter-node-method="groupFilterNode"
|
||||
@node-click="groupClick"
|
||||
></el-tree>
|
||||
</el-main>
|
||||
</el-container>
|
||||
</el-aside>
|
||||
<el-container>
|
||||
<el-header>
|
||||
<div class="left-panel">
|
||||
<el-button
|
||||
type="primary"
|
||||
icon="el-icon-plus"
|
||||
@click="add"
|
||||
></el-button>
|
||||
<el-button
|
||||
type="danger"
|
||||
plain
|
||||
icon="el-icon-delete"
|
||||
:disabled="selection.length == 0"
|
||||
@click="batch_del"
|
||||
></el-button>
|
||||
<!--<el-button
|
||||
type="primary"
|
||||
plain
|
||||
:disabled="selection.length == 0"
|
||||
>分配角色
|
||||
</el-button>-->
|
||||
<el-button
|
||||
type="primary"
|
||||
plain
|
||||
:disabled="selection.length == 0"
|
||||
>密码重置
|
||||
</el-button>
|
||||
</div>
|
||||
<div class="right-panel">
|
||||
<div class="right-panel-search">
|
||||
<el-input
|
||||
v-model="search.name"
|
||||
placeholder="登录账号 / 姓名"
|
||||
clearable
|
||||
></el-input>
|
||||
<el-button
|
||||
type="primary"
|
||||
icon="el-icon-search"
|
||||
@click="upsearch"
|
||||
></el-button>
|
||||
</div>
|
||||
</div>
|
||||
</el-header>
|
||||
<el-main class="nopadding">
|
||||
<!--:data="userList"
|
||||
:params="tableParams"-->
|
||||
<scTable
|
||||
ref="table"
|
||||
:apiObj="apiObj"
|
||||
stripe
|
||||
remoteSort
|
||||
remoteFilter
|
||||
@selection-change="selectionChange"
|
||||
>
|
||||
<el-table-column
|
||||
type="selection"
|
||||
width="50"
|
||||
></el-table-column>
|
||||
<el-table-column
|
||||
label="ID"
|
||||
prop="id"
|
||||
></el-table-column>
|
||||
<el-table-column
|
||||
label="头像"
|
||||
width="80"
|
||||
column-key="filterAvatar"
|
||||
:filters="[
|
||||
{ text: '已上传', value: '1' },
|
||||
{ text: '未上传', value: '0' },
|
||||
]"
|
||||
>
|
||||
<template #default="scope">
|
||||
<el-avatar
|
||||
:src="getImgUrl(scope.row.avatar)"
|
||||
size="small"
|
||||
></el-avatar>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="登录账号"
|
||||
prop="username"
|
||||
min-width="150"
|
||||
sortable="custom"
|
||||
></el-table-column>
|
||||
<!--<el-table-column
|
||||
label="姓名"
|
||||
prop="name"
|
||||
min-width="150"
|
||||
></el-table-column>-->
|
||||
<!--<el-table-column
|
||||
min-width="150"
|
||||
label="部门">
|
||||
<template #default="scope">{{ scope.row.dept_.name }}</template>
|
||||
</el-table-column>-->
|
||||
<!--<el-table-column
|
||||
label="所属角色"
|
||||
prop="groupName"
|
||||
min-width="120"
|
||||
sortable="custom"
|
||||
>
|
||||
<template #default="scope">
|
||||
<span v-for="item in scope.row.roles_" :key="item.id">{{item.name}}</span>
|
||||
<span v-if="scope.row.roles===[]">系统管理员</span>
|
||||
</template>
|
||||
|
||||
</el-table-column>-->
|
||||
<el-table-column
|
||||
label="加入时间"
|
||||
prop="create_time"
|
||||
min-width="150"
|
||||
sortable="custom"
|
||||
></el-table-column>
|
||||
<el-table-column
|
||||
label="操作"
|
||||
fixed="right"
|
||||
align="center"
|
||||
width="140"
|
||||
>
|
||||
<template #default="scope">
|
||||
<el-button
|
||||
type="text"
|
||||
size="small"
|
||||
@click="formEdit(scope.row,'1')"
|
||||
>查看
|
||||
</el-button>
|
||||
<el-button
|
||||
type="text"
|
||||
size="small"
|
||||
@click="formEdit(scope.row, '2')"
|
||||
>编辑
|
||||
</el-button>
|
||||
<el-popconfirm
|
||||
title="确定删除吗？"
|
||||
@confirm="table_del(scope.row, scope.$index)"
|
||||
>
|
||||
<template #reference>
|
||||
<el-button type="text" size="small">
|
||||
删除
|
||||
</el-button>
|
||||
</template>
|
||||
</el-popconfirm>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</scTable>
|
||||
</el-main>
|
||||
</el-container>
|
||||
</el-container>
|
||||
<el-dialog
|
||||
:title="titleMap[type]"
|
||||
v-model="limitedVisible"
|
||||
:width="600"
|
||||
>
|
||||
<el-form
|
||||
:model="addForm"
|
||||
:rules="rules"
|
||||
ref="addForm"
|
||||
label-width="100px"
|
||||
label-position="left"
|
||||
>
|
||||
<el-form-item label="登录账号" prop="username">
|
||||
<el-input
|
||||
v-model="addForm.username"
|
||||
placeholder="用于登录系统"
|
||||
clearable
|
||||
></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="姓名">
|
||||
<el-input
|
||||
v-model="addForm.name"
|
||||
placeholder="请输入完整的真实姓名"
|
||||
clearable
|
||||
></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="手机">
|
||||
<el-input
|
||||
v-model="addForm.phone"
|
||||
placeholder="请输入完整的真实姓名"
|
||||
clearable
|
||||
></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="邮箱">
|
||||
<el-input
|
||||
v-model="addForm.email"
|
||||
placeholder="请输入完整的真实姓名"
|
||||
clearable
|
||||
></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="所属部门">
|
||||
<el-cascader
|
||||
v-model="addForm.belong_dept"
|
||||
:options="group"
|
||||
:props="groupsProps"
|
||||
:show-all-levels="false"
|
||||
clearable
|
||||
style="width: 100%"
|
||||
></el-cascader>
|
||||
</el-form-item>
|
||||
<el-form-item label="是否在用">
|
||||
<el-switch v-model="addForm.is_active" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<el-button @click="limitedVisible = false">取 消</el-button>
|
||||
<el-button
|
||||
v-if="type !== 'show'"
|
||||
type="primary"
|
||||
:loading="isSaveing"
|
||||
@click="submit()"
|
||||
>保 存
|
||||
</el-button
|
||||
>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import baseUrl from "@/config";
|
||||
export default {
|
||||
name: "user",
|
||||
data() {
|
||||
return {
|
||||
baseUrl : baseUrl.API_URL,
|
||||
type: "add",
|
||||
titleMap: {
|
||||
add: "新增用户",
|
||||
edit: "编辑用户",
|
||||
show: "查看",
|
||||
},
|
||||
//表单数据
|
||||
addForm: {
|
||||
id: "",
|
||||
username: "",
|
||||
name: "",
|
||||
email: "",
|
||||
phone: "",
|
||||
belong_dept: [],
|
||||
is_active:true
|
||||
},
|
||||
//验证规则
|
||||
rules: {
|
||||
username: [{required: true, message: "请输入登录账号"}],
|
||||
name: [{required: true, message: "请输入真实姓名"}],
|
||||
password: [
|
||||
{required: true, message: "请输入登录密码"},
|
||||
{
|
||||
validator: (rule, value, callback) => {
|
||||
if (this.form.password2 !== "") {
|
||||
this.$refs.addForm.validateField(
|
||||
"password2"
|
||||
);
|
||||
}
|
||||
callback();
|
||||
},
|
||||
},
|
||||
],
|
||||
password2: [
|
||||
{required: true, message: "请再次输入密码"},
|
||||
{
|
||||
validator: (rule, value, callback) => {
|
||||
if (value !== this.form.password) {
|
||||
callback(new Error("两次输入密码不一致!"));
|
||||
} else {
|
||||
callback();
|
||||
}
|
||||
},
|
||||
},
|
||||
],
|
||||
group: [{required: true, message: "请选择所属角色"}],
|
||||
},
|
||||
//所需数据选项
|
||||
groups: [],
|
||||
groupsProps: {
|
||||
value: "id",
|
||||
multiple: false,
|
||||
checkStrictly: true,
|
||||
},
|
||||
isSaveing: false,
|
||||
limitedVisible: false,
|
||||
showGrouploading: false,
|
||||
groupFilterText: "",
|
||||
group: [],
|
||||
userList: [],
|
||||
selection: [],
|
||||
search: {
|
||||
name: null,
|
||||
},
|
||||
imageUrl: "",
|
||||
filterParams: {},
|
||||
tableParams: {},
|
||||
apiObj: this.$API.system.user.list,
|
||||
temp:[],
|
||||
postList:[],
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
groupFilterText(val) {
|
||||
this.$refs.group.filter(val);
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
this.getList();
|
||||
this.getGroup();
|
||||
},
|
||||
methods: {
|
||||
getImgUrl (img) {
|
||||
return 'http://49.232.14.174:2226'+ img;
|
||||
},
|
||||
//添加
|
||||
add() {
|
||||
this.type = "add";
|
||||
this.limitedVisible = true;
|
||||
},
|
||||
//编辑
|
||||
formEdit(row,index) {
|
||||
debugger;
|
||||
console.log(row);
|
||||
this.limitedVisible = true;
|
||||
if(index==='1'){
|
||||
this.type = "show";
|
||||
}else{
|
||||
this.type = "edit";
|
||||
}
|
||||
this.addForm.id = row.id;
|
||||
this.addForm.name = row.name;
|
||||
this.addForm.username = row.username;
|
||||
this.addForm.phone = row.phone;
|
||||
this.addForm.email = row.email;
|
||||
debugger;
|
||||
console.log();
|
||||
let belong_dept = this.findParents(this.postList,row.belong_dept);
|
||||
this.addForm.belong_dept=belong_dept.reverse();
|
||||
this.addForm.is_active = row.is_active;
|
||||
},
|
||||
findParents(arr,belong_dept){
|
||||
let that = this;
|
||||
arr.forEach(item=>{
|
||||
if(item.id===belong_dept){
|
||||
that.temp.push(item.id);
|
||||
if(item.parent!==null){
|
||||
this.findParents(arr,item.parent)
|
||||
}else{
|
||||
return that.temp
|
||||
}
|
||||
}
|
||||
});
|
||||
return that.temp
|
||||
},
|
||||
//查看
|
||||
table_show(row) {
|
||||
this.limitedVisible = true;
|
||||
this.type = "show";
|
||||
this.addForm.id = row.id;
|
||||
},
|
||||
//删除
|
||||
async table_del(row, index) {
|
||||
var reqData = {id: row.id};
|
||||
var res = await this.$API.system.user.delete.req(reqData);
|
||||
if (res.code == 200) {
|
||||
//这里选择刷新整个表格 OR 插入/编辑现有表格数据
|
||||
this.$refs.table.tableData.splice(index, 1);
|
||||
this.$message.success("删除成功");
|
||||
} else {
|
||||
this.$alert(res.message, "提示", {type: "error"});
|
||||
}
|
||||
},
|
||||
//表格选择后回调事件
|
||||
selectionChange(selection) {
|
||||
this.selection = selection;
|
||||
},
|
||||
//加载树数据
|
||||
async getGroup() {
|
||||
this.showGrouploading = true;
|
||||
var res = await this.$API.system.dept.list.req({page: 0});
|
||||
this.showGrouploading = false;
|
||||
// var allNode = { id: "", label: "所有" };
|
||||
// res.data.unshift(allNode);
|
||||
let postList = res;
|
||||
this.postList = res;
|
||||
let posts = [];
|
||||
postList.forEach(item => {
|
||||
let obj = new Object();
|
||||
obj.id = item.id;
|
||||
obj.label = item.name;
|
||||
obj.parentId = item.parent;
|
||||
posts.push(obj)
|
||||
});
|
||||
let obj = posts.reduce((res, v) => (res[v.id] = v , res), {});//Object
|
||||
let arr = [];
|
||||
for (let item of posts) {
|
||||
// debugger;
|
||||
if (item.parentId == null) {
|
||||
arr.push(item);
|
||||
continue
|
||||
}
|
||||
let parent = obj[item.parentId];
|
||||
parent.children = parent.children ? parent.children : [];
|
||||
parent.children.push(item);
|
||||
}
|
||||
this.group = arr;
|
||||
},
|
||||
//树过滤
|
||||
groupFilterNode(value, data) {
|
||||
if (!value) return true;
|
||||
return data.label.indexOf(value) !== -1;
|
||||
},
|
||||
//树点击事件
|
||||
groupClick(data) {
|
||||
// var params = {dept: data.id};
|
||||
debugger;
|
||||
console.log(data);
|
||||
debugger;
|
||||
this.tableParams = {dept: data.id};
|
||||
this.$refs.table.reload(this.tableParams);
|
||||
},
|
||||
//搜索
|
||||
upsearch() {
|
||||
this.$refs.table.upData(this.search);
|
||||
},
|
||||
//本地更新数据
|
||||
handleSuccess(data, mode) {
|
||||
if (mode == "add") {
|
||||
data.id = new Date().getTime();
|
||||
this.$refs.table.tableData.unshift(data);
|
||||
} else if (mode == "edit") {
|
||||
this.$refs.table.tableData
|
||||
.filter((item) => item.id === data.id)
|
||||
.forEach((item) => {
|
||||
Object.assign(item, data);
|
||||
});
|
||||
}
|
||||
},
|
||||
getList() {
|
||||
let that = this;
|
||||
this.$API.system.user.list.req({page:1,page_size:20}).then((res) => {
|
||||
debugger;
|
||||
console.log(res);
|
||||
that.userList = res.results;
|
||||
});
|
||||
},
|
||||
//表单提交方法
|
||||
submit(){
|
||||
debugger;
|
||||
this.$refs.addForm.validate(async (valid) => {
|
||||
if (valid) {
|
||||
debugger;
|
||||
this.isSaveing = true;
|
||||
this.addForm.belong_dept = this.addForm.belong_dept[this.addForm.belong_dept.length - 1];
|
||||
let res;
|
||||
if(this.type==='add'){
|
||||
res = await this.$API.system.user.create.req(this.addForm);
|
||||
}else if(this.type==='edit'){
|
||||
res = await this.$API.system.user.update.req(this.addForm.id,this.addForm);
|
||||
}
|
||||
this.isSaveing = false;
|
||||
if(res.code == 200){
|
||||
this.visible = false;
|
||||
this.$message.success("操作成功")
|
||||
}else{
|
||||
this.visible = false;
|
||||
this.$alert(res.message, "提示", {type: 'error'});
|
||||
}
|
||||
}else{
|
||||
return false;
|
||||
}
|
||||
})
|
||||
},
|
||||
//表单注入数据
|
||||
setData(data){
|
||||
this.addForm.id = data.id;
|
||||
this.addForm.username = data.username;
|
||||
this.addForm.avatar = data.avatar;
|
||||
this.addForm.name = data.name;
|
||||
this.addForm.group = data.group;
|
||||
//可以和上面一样单个注入，也可以像下面一样直接合并进去
|
||||
//Object.assign(this.form, data)
|
||||
}
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style></style>
|
||||
Loading…
Reference in New Issue