...
|
...
|
@@ -29,8 +29,9 @@ |
|
|
</el-table-column>
|
|
|
<el-table-column prop="roleSign" label="排序" width="100" sortable>
|
|
|
</el-table-column>
|
|
|
<el-table-column label="操作" min-width="150">
|
|
|
<el-table-column label="操作" min-width="260">
|
|
|
<template slot-scope="scope">
|
|
|
<el-button size="small" @click="setPerm(scope.$index, scope.row)">设置权限</el-button>
|
|
|
<el-button size="small" @click="handleEdit(scope.$index, scope.row)">编辑</el-button>
|
|
|
<el-button type="danger" size="small" @click="handleDel(scope.$index, scope.row)">删除</el-button>
|
|
|
</template>
|
...
|
...
|
@@ -87,13 +88,27 @@ |
|
|
<el-button type="primary" @click.native="addSubmit" :loading="addLoading">提交</el-button>
|
|
|
</div>
|
|
|
</el-dialog>
|
|
|
|
|
|
<!--权限设置界面-->
|
|
|
<el-dialog title="角色的权限设置" v-model="PermFormVisible" :close-on-click-modal="false">
|
|
|
<el-form :model="permForm" label-width="80px" ref="permForm">
|
|
|
<el-checkbox-group v-model="permIds" size="small">
|
|
|
<el-checkbox v-for="perm in permissons" :label="perm.permissionId" :key="perm.permissionId">{{perm.name}}</el-checkbox>
|
|
|
</el-checkbox-group>
|
|
|
</el-form>
|
|
|
<div slot="footer" class="dialog-footer">
|
|
|
<el-button @click.native="PermFormVisible = false">取消</el-button>
|
|
|
<el-button type="primary" @click.native="setPermSubmit" :loading="addLoading">提交</el-button>
|
|
|
</div>
|
|
|
</el-dialog>
|
|
|
</section>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
import util from '../../common/js/util'
|
|
|
//import NProgress from 'nprogress'
|
|
|
import { getList, remove, batchRemove, edit, add } from '../../api/role_api';
|
|
|
import NProgress from 'nprogress'
|
|
|
import { getList, remove, batchRemove, edit, add, updateRolePerm } from '../../api/role_api';
|
|
|
import { getList as permList } from '../../api/perm_api';
|
|
|
import moment from 'moment'
|
|
|
export default {
|
|
|
data() {
|
...
|
...
|
@@ -102,6 +117,8 @@ |
|
|
roleName: ''
|
|
|
},
|
|
|
roles: [],
|
|
|
permissons: [],
|
|
|
permIds: [],
|
|
|
total: 0,
|
|
|
pageNum: 1,
|
|
|
pageSize: 5,
|
...
|
...
|
@@ -122,8 +139,12 @@ |
|
|
roleName: '',
|
|
|
roleSign: 1
|
|
|
},
|
|
|
|
|
|
addFormVisible: false,//新增界面是否显示
|
|
|
//设置权限数据
|
|
|
setPermForm: {},
|
|
|
//新增界面是否显示
|
|
|
addFormVisible: false,
|
|
|
//设置权限界面是否显示
|
|
|
PermFormVisible: false,
|
|
|
addLoading: false,
|
|
|
addFormRules: {
|
|
|
roleName: [
|
...
|
...
|
@@ -138,6 +159,13 @@ |
|
|
description: '',
|
|
|
roleName: '',
|
|
|
roleSign: 1
|
|
|
},
|
|
|
permForm: {
|
|
|
roleId: 1,
|
|
|
description: '',
|
|
|
roleName: '',
|
|
|
roleSign: 1,
|
|
|
permissions: []
|
|
|
}
|
|
|
|
|
|
}
|
...
|
...
|
@@ -154,7 +182,7 @@ |
|
|
this.pageNum = val;
|
|
|
this.getRoles();
|
|
|
},
|
|
|
//获取列表
|
|
|
//获取角色列表
|
|
|
getRoles() {
|
|
|
let para = {
|
|
|
pageNum: this.pageNum,
|
...
|
...
|
@@ -184,6 +212,27 @@ |
|
|
});
|
|
|
|
|
|
},
|
|
|
//获取权限列表
|
|
|
getPermList() {
|
|
|
let para = {
|
|
|
pageNum: 1,
|
|
|
pageSize: 200
|
|
|
};
|
|
|
NProgress.start();
|
|
|
permList(para).then((res) => {
|
|
|
this.permissons = res.data.list;
|
|
|
NProgress.done();
|
|
|
}).catch((error) => {
|
|
|
if(null!= error.response && error.response!==undefined){
|
|
|
let status= error.response.status;
|
|
|
let msg = error.response.statusText;
|
|
|
alert(status+msg);
|
|
|
}else {
|
|
|
alert(error);
|
|
|
}
|
|
|
});
|
|
|
|
|
|
},
|
|
|
//删除
|
|
|
handleDel: function (index, row) {
|
|
|
this.$confirm('确认删除该记录吗?', '提示', {
|
...
|
...
|
@@ -215,6 +264,21 @@ |
|
|
this.editFormVisible = true;
|
|
|
this.editForm = Object.assign({}, row);
|
|
|
},
|
|
|
setPerm: function (index, row) {
|
|
|
var _this = this;
|
|
|
this.permIds = [];
|
|
|
this.PermFormVisible = true;
|
|
|
this.permForm = Object.assign({}, row);
|
|
|
let rolePerms = this.permForm.permissions;
|
|
|
if (util.checkNull(rolePerms)){
|
|
|
rolePerms.forEach(function (perm,v_index,v_arr) {
|
|
|
if(util.checkNull(perm)){
|
|
|
_this.permIds[v_index] = perm.permissionId;
|
|
|
}
|
|
|
});
|
|
|
}
|
|
|
this.getPermList();
|
|
|
},
|
|
|
//显示新增界面,每次点开初始化数据
|
|
|
handleAdd: function () {
|
|
|
this.addFormVisible = true;
|
...
|
...
|
@@ -274,7 +338,6 @@ |
|
|
this.addLoading = true;
|
|
|
//NProgress.start();
|
|
|
let para = Object.assign({}, this.addForm);
|
|
|
para.birth = (!para.birth || para.birth == '') ? '' : util.formatDate.format(new Date(para.birth), 'yyyy-MM-dd');
|
|
|
add(para).then((res) => {
|
|
|
this.addLoading = false;
|
|
|
//NProgress.done();
|
...
|
...
|
@@ -290,6 +353,34 @@ |
|
|
}
|
|
|
});
|
|
|
},
|
|
|
//设置角色提交
|
|
|
setPermSubmit: function () {
|
|
|
this.$refs.permForm.validate((valid) => {
|
|
|
if (valid) {
|
|
|
this.$confirm('确认提交吗?', '提示', {}).then(() => {
|
|
|
this.addLoading = true;
|
|
|
//NProgress.start();
|
|
|
let role = Object.assign({}, this.permForm);
|
|
|
let roleId = role.roleId;
|
|
|
let permissionIds = this.permIds
|
|
|
let para = {roleId,permissionIds};
|
|
|
updateRolePerm(para).then((res) => {
|
|
|
this.addLoading = false;
|
|
|
if (res.status ===200) {
|
|
|
this.$message({
|
|
|
message: '提交成功',
|
|
|
type: 'success'
|
|
|
});
|
|
|
this.$refs['permForm'].resetFields();
|
|
|
}
|
|
|
//NProgress.done();
|
|
|
this.PermFormVisible = false;
|
|
|
this.getRoles();
|
|
|
}).catch(error => alert(error));
|
|
|
});
|
|
|
}
|
|
|
});
|
|
|
},
|
|
|
selsChange: function (sels) {
|
|
|
this.sels = sels;
|
|
|
},
|
...
|
...
|
|