wangyifang
/
mkw-visit-web
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

up

Browse Source
master
刘翔宇-旅管家 3 years ago
parent a37f0794a8
commit acb3114d76
1 changed files with 305 additions and 312 deletions
Show Stats Download Patch File Download Diff File

171
src/views/system/permission.vue
Unescape View File

@ -3,7 +3,7 @@
<!-- 查询配置 --> <!-- 查询配置 -->
<div> <div>
<div ref="lxHeader"> <div ref="lxHeader">
<LxHeader icon="md-apps" text="权限管理" style="margin-bottom: 10px; border: 0px; margin-top: 15px"> <LxHeader icon="md-apps" style="margin-bottom: 10px; border: 0px; margin-top: 15px" text="权限管理">
<div slot="content"></div> <div slot="content"></div>
<slot> <slot>
</slot> </slot>
@ -17,10 +17,10 @@
<div slot="title" class="clearfix" style="height: 32px;line-height: 32px;"> <div slot="title" class="clearfix" style="height: 32px;line-height: 32px;">
<span>角色列表</span> <span>角色列表</span>
</div> </div>
<div style="overflow: auto;" :style="{height:height+'px'}"> <div :style="{height:height+'px'}" style="overflow: auto;">
<el-scrollbar style="flex: 1"> <el-scrollbar style="flex: 1">
<el-tabs tab-position="left" v-model="activeRole" @tab-click="roleChange"> <el-tabs v-model="activeRole" tab-position="left" @tab-click="roleChange">
<el-tab-pane :label="item.name" :name="item.rowid" v-for="(item,index) in rolelist"> <el-tab-pane v-for="(item,index) in rolelist" :key="item.id" :label="item.name" :name="item.rowid">
</el-tab-pane> </el-tab-pane>
</el-tabs> </el-tabs>
</el-scrollbar> </el-scrollbar>
@ -34,17 +34,19 @@
<Button style="float: right;" type="primary" @click="savepermission">保存</Button> <Button style="float: right;" type="primary" @click="savepermission">保存</Button>
</div> </div>
<div style="overflow: auto;" :style="{height:height+'px'}"> <div :style="{height:height+'px'}" style="overflow: auto;">
<el-scrollbar style="flex: 1"> <el-scrollbar style="flex: 1">
<el-tree ref="tree" :data="tree" show-checkbox style="padding: 15px" node-key="id" default-expand-all <el-tree ref="tree" :data="tree" :expand-on-click-node="false" default-expand-all node-key="id" show-checkbox
:expand-on-click-node="false"> style="padding: 15px"
<div class="action-group" slot-scope="{ node, data }"> >
<div class="action-text" :style="{ width: (4 - data.lv) * 18 + 150 + 'px' }"> <div slot-scope="{ node, data }" class="action-group">
<div :style="{ width: (4 - data.lv) * 18 + 150 + 'px' }" class="action-text">
{{ data.name }} {{ data.name }}
</div> </div>
<div class="action-item"> <div class="action-item">
<el-checkbox v-for="(item, index) in data.auth_node_tags_array" :key="index" <el-checkbox v-for="(item, index) in data.auth_node_tags_array" :key="index"
v-model="item.checked" @change="() => {}"> v-model="item.checked" @change="()=>{}"
>
{{ item.name }} {{ item.name }}
</el-checkbox> </el-checkbox>
</div> </div>
@ -60,27 +62,26 @@
</template> </template>
<script> <script>
import LxHeader from "@/components/LxHeader/index.vue"; import LxHeader from '@/components/LxHeader/index.vue'
import { import {
list list
} from "../../api/system/role.js"; } from '../../api/system/role.js'
import { import {
listmenu listmenu
} from "../../api/system/menu.js"; } from '../../api/system/menu.js'
import { import {
setPermissions setPermissions
} from "../../api/system/permission.js" } from '../../api/system/permission.js'
export default { export default {
components: { components: {
LxHeader LxHeader
}, },
created() { mounted() {
}, },
mounted() {},
data() { data() {
return { return {
activeRole: "", activeRole: '',
rolelist: [], rolelist: [],
selectIndex: -1, selectIndex: -1,
checked: false, checked: false,
@ -91,145 +92,137 @@
} }
}, },
created() { created() {
var that = this; var that = this
this.initLoad(); this.initLoad()
this.load(function() { this.load(function() {
that.loadrole(); that.loadrole()
}); })
}, },
methods: { methods: {
initLoad() { initLoad() {
var that = this; var that = this
var clientHeight = document.documentElement.clientHeight var clientHeight = document.documentElement.clientHeight
var lxHeader_height = 67; //查询 头部 var lxHeader_height = 67 //查询 头部
var card_Height = 109; //分页的高度 var card_Height = 109 //分页的高度
var topHeight = 50; //页面 头部 var topHeight = 50 //页面 头部
let height = clientHeight - lxHeader_height - topHeight - card_Height; let height = clientHeight - lxHeader_height - topHeight - card_Height
that.height = height; that.height = height
}, },
loadrole() { loadrole() {
var that = this; var that = this
list().then(response => { list().then(response => {
let cur = 0; let cur = 0
that.rolelist = response; that.rolelist = response
for (var mod of response) { for (let mod of response) {
mod.rowid = mod.id.toString(); mod.rowid = mod.id.toString()
console.log(mod)
if (cur == 0) { if (cur == 0) {
that.activeRole = mod.rowid; that.activeRole = mod.rowid
that.loadPermisstions(0, that.activeRole); that.loadPermisstions(0, that.activeRole)
} }
cur++; cur++
} }
}).catch(error => { }).catch(error => {
//reject(error)
}) })
}, },
load(callback) { load(callback) {
var that = this; var that = this
listmenu().then(response => { listmenu().then(response => {
this.tree = response; this.tree = response
this.tree.map((tree, index1) => { this.tree.forEach((tree, index1) => {
let children = tree.children let children = tree.children
children.map((menu, index3) => { children.forEach((menu, index3) => {
menu.auth_node_tags_array.map((m, index4) => { menu.auth_node_tags_array.map((m, index4) => {
m.checked = false; m.checked = false
that.$forceUpdate(); that.$forceUpdate()
}) })
}) })
}) })
callback()
callback();
}).catch(error => { }).catch(error => {
//reject(error)
}) })
}, },
roleChange(tab, event) { roleChange(tab, event) {
this.loadPermisstions(parseInt(tab.index), tab.name) this.loadPermisstions(parseInt(tab.index), tab.name)
}, },
loadPermisstions(index, name) { loadPermisstions(index, name) {
let select = this.rolelist[index].permissions; let select = this.rolelist[index].permissions
this.$refs.tree.setCheckedKeys([]); this.$refs.tree.setCheckedKeys([])
this.activeRole = name; this.activeRole = name
let that = this
let that = this; this.tree.forEach((tree, index1) => {
this.tree.map((tree, index1) => { let children = tree.children
let children = tree.children; select.forEach((item, index2) => {
select.map((item, index2) => {
let selectMenu = children.filter(m => { let selectMenu = children.filter(m => {
return m.id == item.id return m.id == item.id
}); })
selectMenu.map((menu, index3) => { selectMenu.forEach((menu, index3) => {
if (item.has_auth_node_tags.length > 0) { if (item.has_auth_node_tags.length > 0) {
menu.auth_node_tags_array.map((m, index4) => { menu.auth_node_tags_array.forEach((m, index4) => {
if (item.has_auth_node_tags.indexOf(m.tag) > -1) { if (item.has_auth_node_tags.indexOf(m.tag) > -1) {
that.$set(that.tree[index1].children[index3].auth_node_tags_array[index4], that.$set(m,
"checked", true); 'checked', true)
} } else {
else{ that.$set(m,
that.$set(that.tree[index1].children[index3].auth_node_tags_array[index4], 'checked', false)
"checked", false);
} }
}) })
} else { } else {
menu.auth_node_tags_array.map(m => { menu.auth_node_tags_array.map(m => {
m.checked = false; m.checked = false
}) })
} }
}) })
}) })
this.$refs.tree.updateKeyChildren(tree.id, JSON.parse(JSON.stringify(children))) this.$refs.tree.updateKeyChildren(tree.id, JSON.parse(JSON.stringify(children)))
}) })
this.$refs.tree.setCheckedNodes(select)
that.$forceUpdate()
this.$refs.tree.setCheckedNodes(select);
that.$forceUpdate();
}, },
savepermission() { savepermission() {
var checkedList = this.$refs.tree.getCheckedNodes(); var checkedList = this.$refs.tree.getCheckedNodes()
console.log(checkedList) console.log(checkedList)
if (checkedList.length == 0) { if (checkedList.length == 0) {
this.$message.error("请选择菜单"); this.$message.error('请选择菜单')
return false; return false
} }
let data = {}; let data = {}
data.id = this.activeRole; data.id = this.activeRole
let permission = []; let permission = []
for (var m of checkedList) { for (var m of checkedList) {
let tags = []; let tags = []
var mod = {}; var mod = {}
mod.permission_id = m.id; mod.permission_id = m.id
m.auth_node_tags_array.map(item => { m.auth_node_tags_array.map(item => {
if (item.checked) { if (item.checked) {
tags.push(item.tag); tags.push(item.tag)
} }
}); })
mod.auth_node_tags = tags.join(","); mod.auth_node_tags = tags.join(',')
permission.push(mod); permission.push(mod)
} }
data.permission_list = permission; data.permission_list = permission
setPermissions(data).then(response => { setPermissions(data).then(response => {
console.log(response) console.log(response)
this.$Message.success('操作成功'); this.$Message.success('操作成功')
that.dialogFormVisible = false; that.dialogFormVisible = false
that.load(); that.load()
}).catch(error => { }).catch(error => {
//reject(error)
}) })
} }
} }
}; }
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>

Write Preview
Loading…
Cancel
Save