881 lines
33 KiB
Vue
881 lines
33 KiB
Vue
<template xmlns="">
|
||
<div>
|
||
<el-tabs class="my-tabs" v-model="activeName" type="card" @tab-click="handleClick">
|
||
<el-tab-pane label="角色列表" name="roleList">
|
||
<div class="container">
|
||
<div class="tab-header">
|
||
<el-form ref="form" :inline="true" :model="search" label-width="80px">
|
||
<el-row :gutter="20">
|
||
<el-col :span="16">
|
||
<el-form-item label="角色名称">
|
||
<el-input v-model="search.name" clearable></el-input>
|
||
</el-form-item>
|
||
<el-button @click="getroleOrgList(1)">查询</el-button>
|
||
</el-col>
|
||
</el-row>
|
||
</el-form>
|
||
</div>
|
||
<!-- table -->
|
||
<el-table :data="roleTable" border style="width: 100%;">
|
||
<el-table-column label="序号" width="50px" type="index" align="center">
|
||
</el-table-column>
|
||
<el-table-column label="操作" width="520px" align="center">
|
||
<template slot-scope="scope">
|
||
<el-button @click="sourceMenus(scope.row)" type="primary" size="mini">资源授权</el-button>
|
||
<el-button @click="funMenus(scope.row)" type="primary" size="mini">功能授权</el-button>
|
||
<el-button @click="roleMenus(scope.row)" type="primary" size="mini">菜单授权</el-button>
|
||
<el-button @click="mobileMenus(scope.row)" type="primary" size="mini">移动端授权</el-button>
|
||
<el-button @click="editRow(scope.row)" type="primary" size="mini">修改</el-button>
|
||
<el-button @click="delRow(scope.row)" type="danger" size="mini">删除</el-button>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column prop="name" label="角色名称" width="220px" align="center">
|
||
</el-table-column>
|
||
<el-table-column prop="postName" label="角色岗位" width="220px" align="center">
|
||
</el-table-column>
|
||
<el-table-column prop="roleTypeValue" label="组织层级" width="200px" align="center">
|
||
</el-table-column>
|
||
<el-table-column prop="remarks" label="备注" align="center">
|
||
</el-table-column>
|
||
<el-table-column prop="isEnableName" label="是否可用" align="center">
|
||
<template slot-scope="scope">
|
||
<el-switch
|
||
v-model="scope.row.isEnable"
|
||
active-value='1'
|
||
inactive-value='0'
|
||
active-color="#13ce66"
|
||
inactive-color="#ff4949"
|
||
@change="enabledChange($event,scope.row)">
|
||
</el-switch>
|
||
</template>
|
||
</el-table-column>
|
||
</el-table>
|
||
<pagination :total="page.total" :page.sync="page.current" :limit.sync="page.size" @pagination="pagination"/>
|
||
|
||
<!-- 编辑角色信息 -->
|
||
<el-dialog :title="dialogTitle + '角色信息'" :visible.sync="editDialog" width="40%">
|
||
<table class="e-table" cellspacing="0">
|
||
<tr>
|
||
<td>岗位</td>
|
||
<td>
|
||
<el-select v-model="roleForm.postSid" filterable style="width:300px" @change="changePost">
|
||
<el-option
|
||
v-for="(item, i) in postSidData"
|
||
:key="i"
|
||
:label="item.name"
|
||
:value="item.sid">
|
||
</el-option>
|
||
</el-select>
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<td>角色名称</td>
|
||
<td>
|
||
<el-input v-model="roleForm.name" style="width:300px"></el-input>
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<td>编码</td>
|
||
<td>
|
||
<el-input v-model="roleForm.code" style="width:300px"></el-input>
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<td>组织层级</td>
|
||
<td>
|
||
<el-select v-model="roleForm.roleTypeValue" style="width:300px" @change="changeOrgName">
|
||
<el-option
|
||
v-for="(item, i) in roleTypeValue_list"
|
||
:key="i"
|
||
:label="item.dictValue"
|
||
:value="item.dictValue">
|
||
</el-option>
|
||
</el-select>
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<td>排序</td>
|
||
<td>
|
||
<el-input v-model="roleForm.sort" style="width:300px"></el-input>
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<td>备注</td>
|
||
<td>
|
||
<el-input type="textarea" :autosize="{ minRows: 4, maxRows: 6}" v-model="roleForm.remarks"></el-input>
|
||
</td>
|
||
</tr>
|
||
</table>
|
||
<div style="margin-top: 20px; text-align: center;">
|
||
<el-button type="primary" @click="save()">保 存</el-button>
|
||
<el-button @click="editDialog = false">关 闭</el-button>
|
||
</div>
|
||
</el-dialog>
|
||
<!-- 资源授权 -->
|
||
<el-dialog title="资源授权" :visible.sync="sourceDialog" width="50%">
|
||
<table class="e-table" cellspacing="0">
|
||
<tr>
|
||
<td>角色名称</td>
|
||
<td>
|
||
<el-input v-model="roleForm.name" readonly></el-input>
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<td>可操作资源列表</td>
|
||
<td>
|
||
<el-tree v-loading="loading" :data="treedata" ref="sourceTree" show-checkbox accordion node-key="sid"
|
||
:default-expand-all='true'
|
||
:default-checked-keys="checkedId" :props="sourcedefaultProps" @check-change="checkchange">
|
||
</el-tree>
|
||
</td>
|
||
</tr>
|
||
</table>
|
||
<div slot="footer" class="text-center">
|
||
<el-button type="primary" @click="sourceSave">保 存</el-button>
|
||
<el-button @click="sourceDialog = false">关 闭</el-button>
|
||
</div>
|
||
</el-dialog>
|
||
<!-- 功能授权 -->
|
||
<el-dialog title="功能授权" :visible.sync="funDialog" width="50%">
|
||
<table class="e-table" cellspacing="0">
|
||
<tr>
|
||
<td>角色名称</td>
|
||
<td>
|
||
<el-input v-model="roleForm.name" readonly></el-input>
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<td>可操作功能列表</td>
|
||
<td>
|
||
<el-tree v-loading="loading" :data="treedata" ref="funTree" show-checkbox accordion node-key="sid"
|
||
:default-expand-all='true'
|
||
:default-checked-keys="checkedId" :props="defaultProps" @check-change="checkchange">
|
||
</el-tree>
|
||
</td>
|
||
</tr>
|
||
</table>
|
||
<div slot="footer" class="text-center">
|
||
<el-button type="primary" @click="funSave">保 存</el-button>
|
||
<el-button @click="funDialog = false">关 闭</el-button>
|
||
</div>
|
||
</el-dialog>
|
||
<!-- 菜单授权 -->
|
||
<el-dialog title="菜单授权" :visible.sync="roleDialog" width="50%">
|
||
<table class="e-table" cellspacing="0">
|
||
<tr>
|
||
<td>角色名称</td>
|
||
<td>
|
||
<el-input v-model="roleForm.name" readonly></el-input>
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<td>可操作菜单列表</td>
|
||
<td>
|
||
<div style="height:230px;line-height:120px;overflow:auto;overflow-x:hidden;">
|
||
<el-tree v-loading="loading" :data="treedata" ref="Tree" show-checkbox accordion node-key="sid"
|
||
:default-expand-all='true'
|
||
:default-checked-keys="checkedId"
|
||
:props="defaultProps"
|
||
@check-change="checkchange">
|
||
</el-tree>
|
||
</div>
|
||
</td>
|
||
</tr>
|
||
</table>
|
||
<div slot="footer" class="text-center">
|
||
<el-button type="primary" @click="getCheckedKeys">保 存</el-button>
|
||
<el-button @click="roleDialog = false">关 闭</el-button>
|
||
</div>
|
||
</el-dialog>
|
||
<el-dialog title="移动端授权" :visible.sync="mobileDialog" width="50%">
|
||
<table class="e-table" cellspacing="0">
|
||
<tr>
|
||
<td>角色名称</td>
|
||
<td>
|
||
<el-input v-model="roleForm.name" readonly></el-input>
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<td>可操作菜单列表</td>
|
||
<td>
|
||
<div style="height:230px;line-height:120px;overflow:auto;overflow-x:hidden;">
|
||
<el-tree v-loading="loading" :data="treedata" ref="mobileTree" show-checkbox accordion node-key="sid"
|
||
:default-expand-all="true"
|
||
:default-checked-keys="checkedId"
|
||
:props="defaultProps"
|
||
@check-change="checkchange">
|
||
</el-tree>
|
||
</div>
|
||
</td>
|
||
</tr>
|
||
</table>
|
||
<div slot="footer" class="text-center">
|
||
<el-button type="primary" @click="getCheckedMobile">保 存</el-button>
|
||
<el-button @click="mobileDialog = false">关 闭</el-button>
|
||
</div>
|
||
</el-dialog>
|
||
</div>
|
||
</el-tab-pane>
|
||
<!-- 新增角色 -->
|
||
<el-tab-pane label="新增角色" name="addrole">
|
||
<el-card class="box-card">
|
||
<table class="e-table" cellspacing="0">
|
||
<tr>
|
||
<td>岗位</td>
|
||
<td>
|
||
<el-select v-model="roleForm.postSid" filterable style="width:300px" @change="changePost">
|
||
<el-option v-for="item in postSidData" :key="item.sid" :label="item.name" :value="item.sid"></el-option>
|
||
</el-select>
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<td>角色名称</td>
|
||
<td>
|
||
<el-input v-model="roleForm.name" style="width:300px"></el-input>
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<td>编码</td>
|
||
<td>
|
||
<el-input v-model="roleForm.code" style="width:300px"></el-input>
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<td>组织层级</td>
|
||
<td>
|
||
<el-select v-model="roleForm.roleTypeValue" style="width:300px" @change="changeOrgName">
|
||
<el-option v-for="item in roleTypeValue_list" :key="item.dictKey" :label="item.dictValue" :value="item.dictValue"></el-option>
|
||
</el-select>
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<td>排序</td>
|
||
<td>
|
||
<el-input v-model="roleForm.sort" style="width:300px"></el-input>
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<td>备注</td>
|
||
<td>
|
||
<el-input type="textarea" :autosize="{ minRows: 4, maxRows: 6}" v-model="roleForm.remarks"></el-input>
|
||
</td>
|
||
</tr>
|
||
</table>
|
||
<div style="margin-top: 20px; text-align: center;">
|
||
<el-button type="primary" @click="save()">保 存</el-button>
|
||
</div>
|
||
</el-card>
|
||
</el-tab-pane>
|
||
</el-tabs>
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
import {
|
||
delOrgroles,
|
||
funMenuTree,
|
||
postList,
|
||
putOrgroles,
|
||
roleMenuTree,
|
||
roleOrgList,
|
||
getRoleMenuList,
|
||
saveRoleMenuList,
|
||
savefunMenu,
|
||
saveorgrolemenus,
|
||
saveOrgroles,
|
||
saveSource,
|
||
setRoleEnable,
|
||
sourceMenuTree,
|
||
typeValues
|
||
} from '@/api/system/roleAdminister/index.js'
|
||
|
||
export default {
|
||
data() {
|
||
return {
|
||
dialogTitle: '',
|
||
activeName: 'roleList',
|
||
roleForm: {
|
||
name: '',
|
||
code: '',
|
||
sort: '',
|
||
type: '2',
|
||
postSid: '',
|
||
remarks: '',
|
||
roleType: '',
|
||
roleTypeValue: ''
|
||
},
|
||
formBackup: {},
|
||
search: {
|
||
name: ''
|
||
},
|
||
page: {
|
||
total: 0, // 默认数据总数
|
||
current: 1, // 默认开始页面
|
||
size: 10 // 每页的数据条数
|
||
},
|
||
roleTable: [],
|
||
postSidData: [],
|
||
roleTypeValue_list: [], // 组织层级
|
||
editDialog: false,
|
||
// 树形
|
||
loading: false,
|
||
defaultProps: {
|
||
children: 'children',
|
||
label: 'name'
|
||
},
|
||
checkedId: [], // 菜单授权 已选中
|
||
treedata: [], // 菜单授权
|
||
chace: [],
|
||
roleDialog: false,
|
||
Thisrow: {},
|
||
// 资源授权
|
||
sourceDialog: false,
|
||
sourcetreedata: [],
|
||
sourcedefaultProps: {
|
||
children: 'children',
|
||
label: 'sourceName'
|
||
},
|
||
// 功能授权
|
||
funDialog: false,
|
||
// 移动端授权
|
||
mobileDialog: false
|
||
}
|
||
},
|
||
mounted() {
|
||
this.formBackup = Object.assign({}, this.roleForm)
|
||
this.getroleOrgList()
|
||
this.getPostList()
|
||
this.getType()
|
||
},
|
||
methods: {
|
||
pagination(val) { // 分页函数
|
||
this.page.current = val.pageNum
|
||
this.page.size = val.pageSize
|
||
this.getroleOrgList()
|
||
},
|
||
getPostList() {
|
||
postList().then((res) => {
|
||
if (res.success) {
|
||
this.postSidData = res.data
|
||
}
|
||
})
|
||
},
|
||
getType() {
|
||
typeValues({ type: 'roleType' }).then((res) => {
|
||
if (res.success) {
|
||
this.roleTypeValue_list = res.data
|
||
console.log('下拉框请求组织层级', res.data)
|
||
}
|
||
})
|
||
},
|
||
// 分页列表
|
||
getroleOrgList(flag) {
|
||
if (flag == '1') {
|
||
this.page.current = 1
|
||
}
|
||
let params = this.page
|
||
params.params = this.search
|
||
roleOrgList(params).then(res => {
|
||
this.page.total = res.data.total
|
||
this.roleTable = res.data.records
|
||
for (let i = 0; i < this.roleTable.length; i++) {
|
||
if (this.roleTable[i].isEnable == '1') {
|
||
this.roleTable[i].isEnableName = '是'
|
||
} else {
|
||
this.roleTable[i].isEnableName = '否'
|
||
}
|
||
}
|
||
})
|
||
},
|
||
changeOrgName(value) {
|
||
const choosetItem = this.roleTypeValue_list.filter((item) => item.dictValue === value)
|
||
this.roleForm.roleType = choosetItem[0].dictKey
|
||
console.log('组织层级', this.roleForm.roleType, this.roleForm.roleTypeValue)
|
||
},
|
||
changePost(value) {
|
||
const choosetItem = this.postSidData.filter((item) => item.sid === value)
|
||
this.roleForm.name = choosetItem[0].name
|
||
},
|
||
handleClick(tab, event) {
|
||
if (tab.name == 'addrole') {
|
||
this.dialogTitle = '新增'
|
||
this.roleForm = Object.assign({}, this.formBackup)
|
||
} else {
|
||
this.getroleOrgList()
|
||
}
|
||
},
|
||
editRow(row) {
|
||
this.dialogTitle = '编辑'
|
||
this.editDialog = true
|
||
this.roleForm = Object.assign({}, row)
|
||
},
|
||
delRow(row) {
|
||
this.$confirm('确定要删除该角色吗, 是否继续?', '提示', {
|
||
confirmButtonText: '确定',
|
||
cancelButtonText: '取消',
|
||
type: 'warning'
|
||
}).then(() => {
|
||
delOrgroles({ sid: row.sid }).then((res) => {
|
||
if (res.success) {
|
||
this.getroleOrgList()
|
||
this.$message({ showClose: true, type: 'success', message: '删除成功!' })
|
||
}
|
||
})
|
||
})
|
||
},
|
||
// 保存角色
|
||
save() {
|
||
if (this.roleForm.sid) {
|
||
putOrgroles(this.roleForm).then((res) => {
|
||
if (res.success) {
|
||
this.getroleOrgList()
|
||
this.editDialog = false
|
||
this.$message({ showClose: true, message: res.msg, type: 'success' })
|
||
}
|
||
})
|
||
} else {
|
||
saveOrgroles(this.roleForm).then((res) => {
|
||
if (res.success) {
|
||
this.$message({ showClose: true, message: res.msg, type: 'success' })
|
||
this.activeName = 'roleList'
|
||
this.getroleOrgList()
|
||
}
|
||
})
|
||
}
|
||
},
|
||
// 是否可用 按钮
|
||
enabledChange(value, row) {
|
||
setRoleEnable({
|
||
sid: row.sid,
|
||
isEnable: value
|
||
}).then((res) => {
|
||
if (res.success) {
|
||
this.$message({ showClose: true, type: 'success', message: res.msg })
|
||
}
|
||
})
|
||
},
|
||
sourceMenus(row) {
|
||
this.sourceDialog = true
|
||
this.checkedId = []
|
||
this.roleForm.name = row.name
|
||
this.Thisrow = row
|
||
this.loading = true
|
||
let params = {
|
||
roleSid: row.sid
|
||
}
|
||
sourceMenuTree(params).then(res => {
|
||
let data1 = res.data
|
||
for (let i = 0; i < data1.length; i++) {
|
||
if (data1[i].checked == 0) {
|
||
this.checkedId.push(data1[i].sid)
|
||
}
|
||
}
|
||
this.treedata = res.data
|
||
this.loading = false
|
||
})
|
||
},
|
||
funMenus(row) {
|
||
this.funDialog = true
|
||
this.checkedId = []
|
||
this.roleForm.name = row.name
|
||
this.Thisrow = row
|
||
this.loading = true
|
||
let params = {
|
||
roleSid: row.sid
|
||
}
|
||
funMenuTree(params).then(res => {
|
||
let data1 = res.data
|
||
// 如果菜单有子级菜单，说明是父级菜单，父级菜单不可以直接赋值已选中状态
|
||
for (let i = 0; i < data1.length; i++) {
|
||
if (data1[i].children) {
|
||
// data2各模块中的一级菜单
|
||
let data2 = data1[i].children
|
||
for (let j = 0; j < data2.length; j++) {
|
||
// 如果一级菜单有子级菜单（二级菜单），就循环查看二级菜单有无子级菜单
|
||
if (data2[j].children) {
|
||
// data3各模块中的二级菜单
|
||
const data3 = data2[j].children
|
||
for (let k = 0; k < data3.length; k++) {
|
||
// 如果二级菜单有子级菜单（三级菜单），就循环查看三级菜单有无子级菜单
|
||
if (data3[k].children) {
|
||
const data4 = data3[k].children
|
||
for (let l = 0; l < data4.length; l++) {
|
||
if (data4[l].checked == 0) {
|
||
this.checkedId.push(data4[l].sid)
|
||
}
|
||
}
|
||
}
|
||
// 如果二级菜单没有子级菜单（三级菜单），查看是否是选中状态
|
||
if (data3[k].children.length == 0 && data3[k].checked == 0) {
|
||
this.checkedId.push(data3[k].sid)
|
||
}
|
||
}
|
||
}
|
||
// 如果一级菜单没有子级菜单（二级菜单），查看是否是选中状态
|
||
if (data2[j].children.length == 0 && data2[j].checked == 0) {
|
||
this.checkedId.push(data2[j].sid)
|
||
}
|
||
}
|
||
}
|
||
}
|
||
// for (let i = 0; i < data1.length; i++) {
|
||
// if (data1[i].checked == 0) {
|
||
// this.checkedId.push(data1[i].sid)
|
||
// }
|
||
// for (let j = 0; j < data1[i].children.length; j++) {
|
||
// let data2 = data1[i].children
|
||
// if (data2[j].checked == 0) {
|
||
// this.checkedId.push(data2[j].sid)
|
||
// }
|
||
// for (let k = 0; k < data2[j].children.length; k++) {
|
||
// let data3 = data2[j].children
|
||
// if (data3[k].checked == 0) {
|
||
// this.checkedId.push(data3[k].sid)
|
||
// }
|
||
// }
|
||
// }
|
||
// }
|
||
this.treedata = res.data
|
||
this.loading = false
|
||
})
|
||
},
|
||
// 获取授权菜单树形
|
||
roleMenus(row) {
|
||
this.roleDialog = true
|
||
this.checkedId = []
|
||
this.roleForm.name = row.name
|
||
this.Thisrow = row
|
||
this.loading = true
|
||
let params = {
|
||
roleSid: row.sid
|
||
}
|
||
roleMenuTree(params).then(res => {
|
||
let data1 = res.data
|
||
// 如果菜单有子级菜单，说明是父级菜单，父级菜单不可以直接赋值已选中状态
|
||
for (let i = 0; i < data1.length; i++) {
|
||
if (data1[i].children) {
|
||
// data2各模块中的一级菜单
|
||
let data2 = data1[i].children
|
||
for (let j = 0; j < data2.length; j++) {
|
||
// 如果一级菜单有子级菜单（二级菜单），就循环查看二级菜单有无子级菜单
|
||
if (data2[j].children) {
|
||
// data3各模块中的二级菜单
|
||
const data3 = data2[j].children
|
||
for (let k = 0; k < data3.length; k++) {
|
||
// 如果二级菜单有子级菜单（三级菜单），就循环查看三级菜单有无子级菜单
|
||
if (data3[k].children) {
|
||
const data4 = data3[k].children
|
||
for (let l = 0; l < data4.length; l++) {
|
||
if (data4[l].checked == 0) {
|
||
this.checkedId.push(data4[l].sid)
|
||
}
|
||
}
|
||
}
|
||
// 如果二级菜单没有子级菜单（三级菜单），查看是否是选中状态
|
||
if (data3[k].children.length == 0 && data3[k].checked == 0) {
|
||
this.checkedId.push(data3[k].sid)
|
||
}
|
||
}
|
||
}
|
||
// 如果一级菜单没有子级菜单（二级菜单），查看是否是选中状态
|
||
if (data2[j].children.length == 0 && data2[j].checked == 0) {
|
||
this.checkedId.push(data2[j].sid)
|
||
}
|
||
}
|
||
}
|
||
}
|
||
// for (let i = 0; i < data1.length; i++) {
|
||
// if (data1[i].checked == 0) {
|
||
// this.checkedId.push(data1[i].sid)
|
||
// }
|
||
// for (let j = 0; j < data1[i].children.length; j++) {
|
||
// let data2 = data1[i].children
|
||
// if (data2[j].checked == 0) {
|
||
// this.checkedId.push(data2[j].sid)
|
||
// }
|
||
// for (let k = 0; k < data2[j].children.length; k++) {
|
||
// let data3 = data2[j].children
|
||
// if (data3[k].checked == 0) {
|
||
// this.checkedId.push(data3[k].sid)
|
||
// }
|
||
// }
|
||
// }
|
||
// }
|
||
console.log('112233', this.checkedId)
|
||
this.treedata = res.data
|
||
this.getTreeParentNode(res.data, this.checkedId)
|
||
this.getTreeParentid(res.data)
|
||
this.loading = false
|
||
})
|
||
},
|
||
mobileMenus(row) {
|
||
this.mobileDialog = true
|
||
this.checkedId = []
|
||
this.roleForm.name = row.name
|
||
this.Thisrow = row
|
||
this.loading = true
|
||
getRoleMenuList(row.sid).then(res => {
|
||
let data1 = res.data
|
||
// 如果菜单有子级菜单，说明是父级菜单，父级菜单不可以直接赋值已选中状态
|
||
for (let i = 0; i < data1.length; i++) {
|
||
if (data1[i].children) {
|
||
// data2各模块中的一级菜单
|
||
let data2 = data1[i].children
|
||
for (let j = 0; j < data2.length; j++) {
|
||
// 如果一级菜单有子级菜单（二级菜单），就循环查看二级菜单有无子级菜单
|
||
if (data2[j].children) {
|
||
// data3各模块中的二级菜单
|
||
const data3 = data2[j].children
|
||
for (let k = 0; k < data3.length; k++) {
|
||
// 如果二级菜单有子级菜单（三级菜单），就循环查看三级菜单有无子级菜单
|
||
if (data3[k].children) {
|
||
const data4 = data3[k].children
|
||
for (let l = 0; l < data4.length; l++) {
|
||
if (data4[l].checked == 0) {
|
||
this.checkedId.push(data4[l].sid)
|
||
}
|
||
}
|
||
}
|
||
// 如果二级菜单没有子级菜单（三级菜单），查看是否是选中状态
|
||
if (data3[k].children.length == 0 && data3[k].checked == 0) {
|
||
this.checkedId.push(data3[k].sid)
|
||
}
|
||
}
|
||
}
|
||
// 如果一级菜单没有子级菜单（二级菜单），查看是否是选中状态
|
||
if (data2[j].children.length == 0 && data2[j].checked == 0) {
|
||
this.checkedId.push(data2[j].sid)
|
||
}
|
||
}
|
||
}
|
||
}
|
||
// for (let i = 0; i < data1.length; i++) {
|
||
// if (data1[i].checked == 0) {
|
||
// this.checkedId.push(data1[i].sid)
|
||
// }
|
||
// for (let j = 0; j < data1[i].children.length; j++) {
|
||
// let data2 = data1[i].children
|
||
// if (data2[j].checked == 0) {
|
||
// this.checkedId.push(data2[j].sid)
|
||
// }
|
||
// for (let k = 0; k < data2[j].children.length; k++) {
|
||
// let data3 = data2[j].children
|
||
// if (data3[k].checked == 0) {
|
||
// this.checkedId.push(data3[k].sid)
|
||
// }
|
||
// }
|
||
// }
|
||
// }
|
||
console.log('112233', this.checkedId)
|
||
this.treedata = res.data
|
||
this.getTreeParentNode(res.data, this.checkedId)
|
||
// this.getTreeParentid(res.data)
|
||
this.loading = false
|
||
})
|
||
},
|
||
mobileMenus(row) {
|
||
this.mobileDialog = true
|
||
this.checkedId = []
|
||
this.roleForm.name = row.name
|
||
this.Thisrow = row
|
||
this.loading = true
|
||
getRoleMenuList(row.sid).then(res => {
|
||
let data1 = res.data
|
||
// 如果菜单有子级菜单，说明是父级菜单，父级菜单不可以直接赋值已选中状态
|
||
for (let i = 0; i < data1.length; i++) {
|
||
if (data1[i].children) {
|
||
// data2各模块中的一级菜单
|
||
let data2 = data1[i].children
|
||
for (let j = 0; j < data2.length; j++) {
|
||
// 如果一级菜单有子级菜单（二级菜单），就循环查看二级菜单有无子级菜单
|
||
if (data2[j].children) {
|
||
// data3各模块中的二级菜单
|
||
const data3 = data2[j].children
|
||
for (let k = 0; k < data3.length; k++) {
|
||
// 如果二级菜单有子级菜单（三级菜单），就循环查看三级菜单有无子级菜单
|
||
if (data3[k].children) {
|
||
const data4 = data3[k].children
|
||
for (let l = 0; l < data4.length; l++) {
|
||
if (data4[l].checked == 0) {
|
||
this.checkedId.push(data4[l].sid)
|
||
}
|
||
}
|
||
}
|
||
// 如果二级菜单没有子级菜单（三级菜单），查看是否是选中状态
|
||
if (data3[k].children.length == 0 && data3[k].checked == 0) {
|
||
this.checkedId.push(data3[k].sid)
|
||
}
|
||
}
|
||
}
|
||
// 如果一级菜单没有子级菜单（二级菜单），查看是否是选中状态
|
||
if (data2[j].children.length == 0 && data2[j].checked == 0) {
|
||
this.checkedId.push(data2[j].sid)
|
||
}
|
||
}
|
||
}
|
||
}
|
||
// for (let i = 0; i < data1.length; i++) {
|
||
// if (data1[i].checked == 0) {
|
||
// this.checkedId.push(data1[i].sid)
|
||
// }
|
||
// for (let j = 0; j < data1[i].children.length; j++) {
|
||
// let data2 = data1[i].children
|
||
// if (data2[j].checked == 0) {
|
||
// this.checkedId.push(data2[j].sid)
|
||
// }
|
||
// for (let k = 0; k < data2[j].children.length; k++) {
|
||
// let data3 = data2[j].children
|
||
// if (data3[k].checked == 0) {
|
||
// this.checkedId.push(data3[k].sid)
|
||
// }
|
||
// }
|
||
// }
|
||
// }
|
||
console.log('112233', this.checkedId)
|
||
this.treedata = res.data
|
||
this.getTreeParentNode(res.data, this.checkedId)
|
||
// this.getTreeParentid(res.data)
|
||
this.loading = false
|
||
})
|
||
},
|
||
// 递归查询所有上级数据
|
||
getTreeParentNode(menus, ids) {
|
||
for (var i = 0; i < menus.length; i++) {
|
||
if (menus[i].children && menus[i].children.length !== 0) {
|
||
this.getTreeParentNode(menus[i].children, ids)
|
||
} else if (menus[i].isCheck) {
|
||
ids.push(menus[i].sid)
|
||
}
|
||
}
|
||
},
|
||
// 所有一级菜单ID
|
||
getTreeParentid(menus) {
|
||
for (var i = 0; i < menus.length; i++) {
|
||
this.chace.push(menus[i].sid)
|
||
}
|
||
},
|
||
// 设置半选状态
|
||
setHalfCheckedNodes(sid) {
|
||
const node = this.$refs['Tree'].getNode(sid)
|
||
console.log('11111', sid)
|
||
console.log('11111', node)
|
||
if (node) { // 此处应判断当前节点的checked属性是否为true，是则不必半选
|
||
node.indeterminate = true
|
||
}
|
||
},
|
||
// 资源授权保存
|
||
sourceSave() {
|
||
let sourceMenus = this.$refs.sourceTree.getCheckedKeys()
|
||
let params = {
|
||
sorceSid: sourceMenus.toString(),
|
||
roleSid: this.Thisrow.sid
|
||
}
|
||
saveSource(params).then(res => {
|
||
this.sourceDialog = false
|
||
this.$message({
|
||
message: res.msg,
|
||
type: 'success'
|
||
})
|
||
})
|
||
},
|
||
// 功能授权保存
|
||
funSave() {
|
||
let funMenus = []
|
||
funMenus = this.$refs.funTree.getCheckedNodes(false, true)
|
||
// funMenus = this.$refs.Tree.getCheckedKeys()
|
||
console.log('已选节点、半选节点node', funMenus)
|
||
const funMenus_sid = []
|
||
for (var i = 0; i < funMenus.length; i++) {
|
||
funMenus_sid.push(funMenus[i].sid)
|
||
}
|
||
console.log('已选节点、半选节点sid', funMenus_sid)
|
||
// let funMenus = this.$refs.funTree.getCheckedKeys()
|
||
// let params = {
|
||
// functionSid: funMenus.toString(),
|
||
// roleSid: this.Thisrow.sid
|
||
// }
|
||
let params = {
|
||
functionSid: funMenus_sid.toString(),
|
||
roleSid: this.Thisrow.sid
|
||
}
|
||
savefunMenu(params).then(res => {
|
||
this.funDialog = false
|
||
this.$message({
|
||
message: res.msg,
|
||
type: 'success'
|
||
})
|
||
})
|
||
},
|
||
// 菜单授权
|
||
getCheckedKeys() {
|
||
let roleMenus = []
|
||
roleMenus = this.$refs.Tree.getCheckedNodes(false, true)
|
||
// roleMenus = this.$refs.Tree.getCheckedKeys()
|
||
console.log('已选节点、半选节点node', roleMenus)
|
||
const roleMenus_sid = []
|
||
for (var i = 0; i < roleMenus.length; i++) {
|
||
roleMenus_sid.push(roleMenus[i].sid)
|
||
}
|
||
console.log('已选节点、半选节点sid', roleMenus_sid)
|
||
// let parentTrue = this.$refs.Tree.getHalfCheckedKeys()
|
||
// for (let i = 0; i < parentTrue.length; i++) {
|
||
// for (let j = 0; j < this.chace.length; j++) {
|
||
// if (parentTrue[i] == this.chace[j]) {
|
||
// parentTrue.splice(i, 1);
|
||
// }
|
||
// }
|
||
// }
|
||
let params = {
|
||
menuSid: roleMenus_sid.toString(),
|
||
roleSid: this.Thisrow.sid
|
||
}
|
||
saveorgrolemenus(params).then(res => {
|
||
this.roleDialog = false
|
||
this.$message({
|
||
message: res.msg,
|
||
type: 'success'
|
||
})
|
||
})
|
||
},
|
||
getCheckedMobile() {
|
||
let roleMenus = []
|
||
roleMenus = this.$refs.mobileTree.getCheckedNodes(false, true)
|
||
// roleMenus = this.$refs.Tree.getCheckedKeys()
|
||
console.log('已选节点、半选节点node', roleMenus)
|
||
const roleMenus_sid = []
|
||
for (var i = 0; i < roleMenus.length; i++) {
|
||
roleMenus_sid.push(roleMenus[i].sid)
|
||
}
|
||
console.log('已选节点、半选节点sid', roleMenus_sid)
|
||
// let parentTrue = this.$refs.Tree.getHalfCheckedKeys()
|
||
// for (let i = 0; i < parentTrue.length; i++) {
|
||
// for (let j = 0; j < this.chace.length; j++) {
|
||
// if (parentTrue[i] == this.chace[j]) {
|
||
// parentTrue.splice(i, 1);
|
||
// }
|
||
// }
|
||
// }
|
||
let params = {
|
||
menuSid: roleMenus_sid.toString(),
|
||
roleSid: this.Thisrow.sid
|
||
}
|
||
saveRoleMenuList(params).then((res) => {
|
||
if (res.success) {
|
||
this.mobileDialog = false
|
||
this.$message({ showClose: true, message: res.msg, type: 'success' })
|
||
}
|
||
})
|
||
},
|
||
checkchange() {
|
||
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style scoped>
|
||
.my-tabs {
|
||
margin-top: 10px;
|
||
}
|
||
</style>
|