|
|
|
|
@ -1,155 +1,163 @@
|
|
|
|
|
<template>
|
|
|
|
|
<div>
|
|
|
|
|
<el-form :inline="true" :model="query" class="query-form" size="mini">
|
|
|
|
|
<el-form-item class="query-form-item">
|
|
|
|
|
<el-input v-model="query.name" placeholder="角色名称"></el-input>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<!-- <el-form-item class="query-form-item">-->
|
|
|
|
|
<!-- <el-select v-model="query.status" placeholder="状态">-->
|
|
|
|
|
<!-- <el-option label="全部" value=""></el-option>-->
|
|
|
|
|
<!-- <el-option label="禁用" value="0"></el-option>-->
|
|
|
|
|
<!-- <el-option label="正常" value="1"></el-option>-->
|
|
|
|
|
<!-- </el-select>-->
|
|
|
|
|
<!-- </el-form-item>-->
|
|
|
|
|
<div>
|
|
|
|
|
<el-form :inline="true" :model="query" class="query-form" size="mini">
|
|
|
|
|
<el-form-item class="query-form-item">
|
|
|
|
|
<el-input v-model="query.name" placeholder="角色名称"></el-input>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<!-- <el-form-item class="query-form-item">-->
|
|
|
|
|
<!-- <el-select v-model="query.status" placeholder="状态">-->
|
|
|
|
|
<!-- <el-option label="全部" value=""></el-option>-->
|
|
|
|
|
<!-- <el-option label="禁用" value="0"></el-option>-->
|
|
|
|
|
<!-- <el-option label="正常" value="1"></el-option>-->
|
|
|
|
|
<!-- </el-select>-->
|
|
|
|
|
<!-- </el-form-item>-->
|
|
|
|
|
|
|
|
|
|
<el-form-item>
|
|
|
|
|
<el-button-group>
|
|
|
|
|
<el-button
|
|
|
|
|
type="primary"
|
|
|
|
|
icon="el-icon-refresh"
|
|
|
|
|
@click="onReset"
|
|
|
|
|
></el-button>
|
|
|
|
|
<el-button type="primary" icon="search" @click="onSubmit"
|
|
|
|
|
>查询</el-button
|
|
|
|
|
>
|
|
|
|
|
<el-button type="primary" @click.native="handleForm(null, null)"
|
|
|
|
|
>新增</el-button
|
|
|
|
|
>
|
|
|
|
|
</el-button-group>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
</el-form>
|
|
|
|
|
<el-table v-loading="loading" :data="list" style="width: 100%">
|
|
|
|
|
<el-table-column type="index" label="序号" width="50"></el-table-column>
|
|
|
|
|
<el-table-column label="角色名称" prop="name"> </el-table-column>
|
|
|
|
|
<el-table-column label="状态">
|
|
|
|
|
<template slot-scope="scope">
|
|
|
|
|
<el-tag :type="scope.row.status | statusFilterType">{{
|
|
|
|
|
scope.row.status | statusFilterName
|
|
|
|
|
}}</el-tag>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
<el-table-column label="备注说明" :show-overflow-tooltip="true">
|
|
|
|
|
<template slot-scope="scope">
|
|
|
|
|
<span>{{ scope.row.remark }}</span>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
<el-table-column label="操作" fixed="right" width="200">
|
|
|
|
|
<template slot-scope="scope">
|
|
|
|
|
<el-button
|
|
|
|
|
type="text"
|
|
|
|
|
size="small"
|
|
|
|
|
@click.native="handleAuth(scope.row.id)"
|
|
|
|
|
>授权</el-button
|
|
|
|
|
>
|
|
|
|
|
<el-button
|
|
|
|
|
type="text"
|
|
|
|
|
size="small"
|
|
|
|
|
@click.native="handleForm(scope.$index, scope.row)"
|
|
|
|
|
>编辑</el-button
|
|
|
|
|
>
|
|
|
|
|
<el-button
|
|
|
|
|
type="text"
|
|
|
|
|
size="small"
|
|
|
|
|
@click.native="handleDel(scope.$index, scope.row)"
|
|
|
|
|
:loading="deleteLoading"
|
|
|
|
|
>删除</el-button
|
|
|
|
|
>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
</el-table>
|
|
|
|
|
<el-form-item>
|
|
|
|
|
<el-button-group>
|
|
|
|
|
<el-button
|
|
|
|
|
type="primary"
|
|
|
|
|
icon="el-icon-refresh"
|
|
|
|
|
@click="onReset"
|
|
|
|
|
></el-button>
|
|
|
|
|
<el-button type="primary" icon="search" @click="onSubmit"
|
|
|
|
|
>查询
|
|
|
|
|
</el-button
|
|
|
|
|
>
|
|
|
|
|
<el-button type="primary" @click.native="handleForm(null, null)"
|
|
|
|
|
>新增
|
|
|
|
|
</el-button
|
|
|
|
|
>
|
|
|
|
|
</el-button-group>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
</el-form>
|
|
|
|
|
<el-table v-loading="loading" :data="list" style="width: 100%">
|
|
|
|
|
<el-table-column type="index" label="序号" width="50"></el-table-column>
|
|
|
|
|
<el-table-column label="角色名称" prop="name"></el-table-column>
|
|
|
|
|
<el-table-column label="状态">
|
|
|
|
|
<template slot-scope="scope">
|
|
|
|
|
<el-tag :type="scope.row.status | statusFilterType">{{
|
|
|
|
|
scope.row.status | statusFilterName
|
|
|
|
|
}}
|
|
|
|
|
</el-tag>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
<el-table-column label="备注说明" :show-overflow-tooltip="true">
|
|
|
|
|
<template slot-scope="scope">
|
|
|
|
|
<span>{{ scope.row.remark }}</span>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
<el-table-column label="操作" fixed="right" width="200">
|
|
|
|
|
<template slot-scope="scope">
|
|
|
|
|
<el-button
|
|
|
|
|
type="text"
|
|
|
|
|
size="small"
|
|
|
|
|
@click.native="handleAuth(scope.row)"
|
|
|
|
|
>授权
|
|
|
|
|
</el-button
|
|
|
|
|
>
|
|
|
|
|
<el-button
|
|
|
|
|
type="text"
|
|
|
|
|
size="small"
|
|
|
|
|
@click.native="handleForm(scope.$index, scope.row)"
|
|
|
|
|
>编辑
|
|
|
|
|
</el-button
|
|
|
|
|
>
|
|
|
|
|
<el-button
|
|
|
|
|
type="text"
|
|
|
|
|
size="small"
|
|
|
|
|
@click.native="handleDel(scope.$index, scope.row)"
|
|
|
|
|
:loading="deleteLoading"
|
|
|
|
|
>删除
|
|
|
|
|
</el-button
|
|
|
|
|
>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
</el-table>
|
|
|
|
|
|
|
|
|
|
<el-pagination
|
|
|
|
|
:page-size="query.limit"
|
|
|
|
|
@current-change="handleCurrentChange"
|
|
|
|
|
layout="prev, pager, next"
|
|
|
|
|
:total="total"
|
|
|
|
|
>
|
|
|
|
|
</el-pagination>
|
|
|
|
|
<el-pagination
|
|
|
|
|
:page-size="query.limit"
|
|
|
|
|
@current-change="handleCurrentChange"
|
|
|
|
|
layout="prev, pager, next"
|
|
|
|
|
:total="total"
|
|
|
|
|
>
|
|
|
|
|
</el-pagination>
|
|
|
|
|
|
|
|
|
|
<!--授权界面-->
|
|
|
|
|
<el-dialog
|
|
|
|
|
title="授权"
|
|
|
|
|
:visible.sync="authFormVisible"
|
|
|
|
|
:close-on-click-modal="false"
|
|
|
|
|
:close-on-press-escape="false"
|
|
|
|
|
class="dialog"
|
|
|
|
|
>
|
|
|
|
|
<el-tree
|
|
|
|
|
style="max-height: 75vh; overflow-y: auto"
|
|
|
|
|
:data="authList"
|
|
|
|
|
show-checkbox=""
|
|
|
|
|
default-expand-all=""
|
|
|
|
|
node-key="id"
|
|
|
|
|
ref="tree"
|
|
|
|
|
:props="defaultProps"
|
|
|
|
|
:default-checked-keys="authDefaultCheckedKeys"
|
|
|
|
|
>
|
|
|
|
|
</el-tree>
|
|
|
|
|
<div slot="footer" class="dialog-footer">
|
|
|
|
|
<el-button @click.native="authFormVisible = !authFormVisible"
|
|
|
|
|
>取消</el-button
|
|
|
|
|
<!--授权界面-->
|
|
|
|
|
<el-dialog
|
|
|
|
|
:title="authTitle"
|
|
|
|
|
:visible.sync="authFormVisible"
|
|
|
|
|
:close-on-click-modal="false"
|
|
|
|
|
:close-on-press-escape="false"
|
|
|
|
|
class="dialog"
|
|
|
|
|
>
|
|
|
|
|
<el-button
|
|
|
|
|
type="primary"
|
|
|
|
|
@click.native="authSubmit()"
|
|
|
|
|
:loading="authLoading"
|
|
|
|
|
>提交
|
|
|
|
|
</el-button>
|
|
|
|
|
</div>
|
|
|
|
|
</el-dialog>
|
|
|
|
|
<el-tree
|
|
|
|
|
style="max-height: 75vh; overflow-y: auto"
|
|
|
|
|
:data="authList"
|
|
|
|
|
show-checkbox=""
|
|
|
|
|
default-expand-all=""
|
|
|
|
|
node-key="id"
|
|
|
|
|
ref="tree"
|
|
|
|
|
:props="defaultProps"
|
|
|
|
|
:default-checked-keys="authDefaultCheckedKeys"
|
|
|
|
|
>
|
|
|
|
|
</el-tree>
|
|
|
|
|
<div slot="footer" class="dialog-footer">
|
|
|
|
|
<el-button @click.native="authFormVisible = !authFormVisible"
|
|
|
|
|
>取消
|
|
|
|
|
</el-button
|
|
|
|
|
>
|
|
|
|
|
<el-button
|
|
|
|
|
type="primary"
|
|
|
|
|
@click.native="authSubmit()"
|
|
|
|
|
:loading="authLoading"
|
|
|
|
|
>提交
|
|
|
|
|
</el-button>
|
|
|
|
|
</div>
|
|
|
|
|
</el-dialog>
|
|
|
|
|
|
|
|
|
|
<!--表单-->
|
|
|
|
|
<el-dialog
|
|
|
|
|
:title="formMap[formName]"
|
|
|
|
|
:visible.sync="formVisible"
|
|
|
|
|
:close-on-click-modal="false"
|
|
|
|
|
:close-on-press-escape="false"
|
|
|
|
|
:before-close="hideForm"
|
|
|
|
|
width="85%"
|
|
|
|
|
top="5vh"
|
|
|
|
|
>
|
|
|
|
|
<el-form :model="formData" :rules="formRules" ref="dataForm">
|
|
|
|
|
<el-form-item label="角色名称" prop="name">
|
|
|
|
|
<el-input v-model="formData.name" auto-complete="off"></el-input>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item label="排序" prop="listorder">
|
|
|
|
|
<el-input
|
|
|
|
|
type=""
|
|
|
|
|
v-model="formData.listorder"
|
|
|
|
|
auto-complete="off"
|
|
|
|
|
></el-input>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item label="状态" prop="status">
|
|
|
|
|
<el-radio-group v-model="formData.status" :disabled="true">
|
|
|
|
|
<el-radio :label="0">禁用</el-radio>
|
|
|
|
|
<el-radio :label="1">正常</el-radio>
|
|
|
|
|
</el-radio-group>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item label="备注说明">
|
|
|
|
|
<el-input type="textarea" v-model="formData.remark"></el-input>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
</el-form>
|
|
|
|
|
<div slot="footer" class="dialog-footer">
|
|
|
|
|
<el-button @click.native="hideForm">取消</el-button>
|
|
|
|
|
<el-button
|
|
|
|
|
type="primary"
|
|
|
|
|
@click.native="formSubmit()"
|
|
|
|
|
:loading="formLoading"
|
|
|
|
|
>提交</el-button
|
|
|
|
|
<!--表单-->
|
|
|
|
|
<el-dialog
|
|
|
|
|
:title="formMap[formName]"
|
|
|
|
|
:visible.sync="formVisible"
|
|
|
|
|
:close-on-click-modal="false"
|
|
|
|
|
:close-on-press-escape="false"
|
|
|
|
|
:before-close="hideForm"
|
|
|
|
|
width="85%"
|
|
|
|
|
top="5vh"
|
|
|
|
|
>
|
|
|
|
|
</div>
|
|
|
|
|
</el-dialog>
|
|
|
|
|
</div>
|
|
|
|
|
<el-form :model="formData" :rules="formRules" ref="dataForm">
|
|
|
|
|
<el-form-item label="角色名称" prop="name">
|
|
|
|
|
<el-input v-model="formData.name" auto-complete="off"></el-input>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item label="排序" prop="listorder">
|
|
|
|
|
<el-input
|
|
|
|
|
type=""
|
|
|
|
|
v-model="formData.listorder"
|
|
|
|
|
auto-complete="off"
|
|
|
|
|
></el-input>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item label="状态" prop="status">
|
|
|
|
|
<el-radio-group v-model="formData.status" :disabled="true">
|
|
|
|
|
<el-radio :label="0">禁用</el-radio>
|
|
|
|
|
<el-radio :label="1">正常</el-radio>
|
|
|
|
|
</el-radio-group>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item label="备注说明">
|
|
|
|
|
<el-input type="textarea" v-model="formData.remark"></el-input>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
</el-form>
|
|
|
|
|
<div slot="footer" class="dialog-footer">
|
|
|
|
|
<el-button @click.native="hideForm">取消</el-button>
|
|
|
|
|
<el-button
|
|
|
|
|
type="primary"
|
|
|
|
|
@click.native="formSubmit()"
|
|
|
|
|
:loading="formLoading"
|
|
|
|
|
>提交
|
|
|
|
|
</el-button
|
|
|
|
|
>
|
|
|
|
|
</div>
|
|
|
|
|
</el-dialog>
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
<script>
|
|
|
|
|
@ -160,6 +168,7 @@ import {
|
|
|
|
|
authRoleSave,
|
|
|
|
|
authRoleDelete
|
|
|
|
|
} from "../../../api/auth/authRole";
|
|
|
|
|
|
|
|
|
|
const formJson = {
|
|
|
|
|
id: "",
|
|
|
|
|
name: "",
|
|
|
|
|
@ -202,13 +211,14 @@ export default {
|
|
|
|
|
formData: formJson,
|
|
|
|
|
formRules: {
|
|
|
|
|
name: [
|
|
|
|
|
{ required: true, message: "请输入名称", trigger: "blur" }
|
|
|
|
|
{required: true, message: "请输入名称", trigger: "blur"}
|
|
|
|
|
],
|
|
|
|
|
status: [
|
|
|
|
|
{ required: true, message: "请选择状态", trigger: "change" }
|
|
|
|
|
{required: true, message: "请选择状态", trigger: "change"}
|
|
|
|
|
]
|
|
|
|
|
},
|
|
|
|
|
deleteLoading: false
|
|
|
|
|
deleteLoading: false,
|
|
|
|
|
authTitle: "授权",
|
|
|
|
|
};
|
|
|
|
|
},
|
|
|
|
|
methods: {
|
|
|
|
|
@ -246,11 +256,12 @@ export default {
|
|
|
|
|
});
|
|
|
|
|
},
|
|
|
|
|
// 显示授权界面
|
|
|
|
|
handleAuth(roleId) {
|
|
|
|
|
this.authFormData.role_id = roleId;
|
|
|
|
|
handleAuth(row) {
|
|
|
|
|
this.authFormData.role_id = row.id;
|
|
|
|
|
this.authTitle = "授权角色<" + row.name + ">";
|
|
|
|
|
this.authFormData.auth_rules = [];
|
|
|
|
|
this.authList = [];
|
|
|
|
|
authRoleAuthList({ id: roleId })
|
|
|
|
|
authRoleAuthList({id: row.id})
|
|
|
|
|
.then(response => {
|
|
|
|
|
if (response.code != 20000) {
|
|
|
|
|
this.authFormVisible = false;
|
|
|
|
|
@ -260,6 +271,7 @@ export default {
|
|
|
|
|
});
|
|
|
|
|
return;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
this.authFormVisible = true;
|
|
|
|
|
this.authList = response.data.list || [];
|
|
|
|
|
console.log("this.authList=" + this.authList);
|
|
|
|
|
@ -267,11 +279,10 @@ export default {
|
|
|
|
|
let tempCheckedKeys = [];
|
|
|
|
|
let id = null;
|
|
|
|
|
let node = null;
|
|
|
|
|
let getTreeNode = function(arr, id) {
|
|
|
|
|
let getTreeNode = function (arr, id) {
|
|
|
|
|
for (let i in arr) {
|
|
|
|
|
let tempNode = arr[i];
|
|
|
|
|
if (tempNode.id === id) {
|
|
|
|
|
// 找到了，就不找了
|
|
|
|
|
node = tempNode;
|
|
|
|
|
}
|
|
|
|
|
// 如果还有子节点，再继续找
|
|
|
|
|
@ -290,11 +301,12 @@ export default {
|
|
|
|
|
this.authDefaultCheckedKeys = tempCheckedKeys;
|
|
|
|
|
// this.$refs.tree.setCheckedKeys(tempCheckedKeys);
|
|
|
|
|
})
|
|
|
|
|
.catch(() => {});
|
|
|
|
|
.catch(() => {
|
|
|
|
|
});
|
|
|
|
|
},
|
|
|
|
|
authSubmit() {
|
|
|
|
|
this.authLoading = true;
|
|
|
|
|
let getNodeParents = function(node) {
|
|
|
|
|
let getNodeParents = function (node) {
|
|
|
|
|
let arr = [];
|
|
|
|
|
let id = node.data.id || null;
|
|
|
|
|
if (id) {
|
|
|
|
|
@ -405,7 +417,7 @@ export default {
|
|
|
|
|
})
|
|
|
|
|
.then(() => {
|
|
|
|
|
this.deleteLoading = true;
|
|
|
|
|
let para = { id: row.id };
|
|
|
|
|
let para = {id: row.id};
|
|
|
|
|
authRoleDelete(para)
|
|
|
|
|
.then(response => {
|
|
|
|
|
this.deleteLoading = false;
|
|
|
|
|
@ -443,7 +455,8 @@ export default {
|
|
|
|
|
return statusMap[status];
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
mounted() {},
|
|
|
|
|
mounted() {
|
|
|
|
|
},
|
|
|
|
|
created() {
|
|
|
|
|
// 加载表格数据
|
|
|
|
|
this.getList();
|
|
|
|
|
|
