446 lines
12 KiB
Vue
446 lines
12 KiB
Vue
|
<template>
|
||
|
<div>
|
||
|
<div style="display: flex;height: 100%;">
|
||
|
<!-- <base-layout title="组织机构" ref="organLayout" style="width: 20%;" :bottonShow="false" :isPage="false "
|
||
|
:mainColor="mainColor" :bodyHight="orangTreeHight">
|
||
|
<div slot="main">
|
||
|
<base-tree ref="baseTree" :isCenter="false" :isSaveBtn="false" :Allshow="false"
|
||
|
:showCheckbox="false" :menuData="orangData" @handleNodeClick="orangClick"></base-tree>
|
||
|
</div>
|
||
|
</base-layout> -->
|
||
|
<base-layout ref="userLayout" @pageChange="pageChange" :showTitle="false" :buttonList="buttonList"
|
||
|
:defaultButtonSwitch="false" @onFuncBtn="getFuncBtn" :isPage="true">
|
||
|
<div slot="main" slot-scope="{ tableHeight }" style="height: 100%;">
|
||
|
<base-table ref="userCustomtable" :border="true" :showIndex="false" :tabLoading.sync="tabLoading"
|
||
|
@radioChange="userRadioChange" :slotrow="true" :tableHeight="tableHeight" :tableData="tableData"
|
||
|
:tableColumn="tableColumn">
|
||
|
|
||
|
</base-table>
|
||
|
</div>
|
||
|
</base-layout>
|
||
|
</div>
|
||
|
<base-dialog :closeEscape="true" :showClose="true" :closeModal="false" :dialogVisible.sync="settingDialog"
|
||
|
class="userDialog" title="权限设置" width="50vw" top="5vh" :footerShow="true"
|
||
|
@handleConfirmClick="settingConfirmClick">
|
||
|
<base-layout :bodyHight="settingTreeHight" :showTitle="false" :operateButtonSwitch="false">
|
||
|
<div slot="main">
|
||
|
<el-tabs v-model="activeName" type="card" @tab-click="handleClick" :before-leave="beforeLeave">
|
||
|
<el-tab-pane label="菜单权限" name="jurisdictionSetting">
|
||
|
<jurisdiction-Setting ref="jurisdictionSetting" :menuData="menuData"></jurisdiction-Setting>
|
||
|
</el-tab-pane>
|
||
|
<el-tab-pane label="按钮权限" name="buttonSetting">
|
||
|
<button-setting ref="buttonSetting"></button-setting>
|
||
|
</el-tab-pane>
|
||
|
<el-tab-pane label="数据权限" name="dataSetting">
|
||
|
<data-setting ref="dataSetting"></data-setting>
|
||
|
</el-tab-pane>
|
||
|
</el-tabs>
|
||
|
</div>
|
||
|
</base-layout>
|
||
|
</base-dialog>
|
||
|
</div>
|
||
|
</template>
|
||
|
|
||
|
<script>
|
||
|
import baseLayout from "@/components/base/baseLayout";
|
||
|
import baseTable from "@/components/base/baseTable";
|
||
|
import baseDialog from "@/components/base/BaseNewDialog/index.vue";
|
||
|
import baseForm from "@/components/base/baseNewForm/index.vue";
|
||
|
import baseTree from "@/components/base/BaseMenuTree/index.vue";
|
||
|
import jurisdictionSetting from "./jurisdictionSetting.vue";
|
||
|
import buttonSetting from "./buttonSetting.vue";
|
||
|
import dataSetting from "./dataSetting.vue"
|
||
|
import configData from "./configData";
|
||
|
import { getCompanyId } from '@/utils/auth'
|
||
|
import {
|
||
|
GetMenuTree,
|
||
|
} from '@/api/apis/menuManage'
|
||
|
import {
|
||
|
RoleGetBillList,
|
||
|
} from '@/api/apis/roleManagement'
|
||
|
import {
|
||
|
GetOrganTree,
|
||
|
} from '@/api/apis/organization'
|
||
|
import {
|
||
|
GetPppedomSet,
|
||
|
GetAllButton,
|
||
|
GetAllBillDataPepedom,
|
||
|
GetAllBilldata,
|
||
|
PopedomSaveData
|
||
|
} from '@/api/apis/jurisdiction'
|
||
|
export default {
|
||
|
name: "review",
|
||
|
components: {
|
||
|
buttonSetting,
|
||
|
dataSetting,
|
||
|
baseLayout,
|
||
|
baseTable,
|
||
|
baseDialog,
|
||
|
baseForm,
|
||
|
baseTree,
|
||
|
jurisdictionSetting
|
||
|
},
|
||
|
data() {
|
||
|
return {
|
||
|
activeName: 'jurisdictionSetting',
|
||
|
settingTreeHight: '500px',
|
||
|
radioIndex: false,
|
||
|
userRadioId: false,
|
||
|
settingDialog: false,
|
||
|
// orangTreeHight: 'calc(100vh - 119px)',
|
||
|
// tableHeight: 'calc(100vh - 189px)',
|
||
|
mainColor: '#f8f8f8',
|
||
|
tabLoading: false,
|
||
|
tableData: [],
|
||
|
// 搜索配置
|
||
|
menuData: [],
|
||
|
orangData: [],
|
||
|
buttonList: [{
|
||
|
'icon': 'el-icon-plus',
|
||
|
'menuName': '权限设置',
|
||
|
btnFunciton: 'setting'
|
||
|
},],
|
||
|
pageModel: {
|
||
|
page: 1,
|
||
|
limit: 20,
|
||
|
departmentID: '',
|
||
|
Sequence: '',
|
||
|
SequenceName: ''
|
||
|
},
|
||
|
defaultProps: {
|
||
|
children: 'children',
|
||
|
label: 'label'
|
||
|
},
|
||
|
buttonArray: [],
|
||
|
allButtonList: [],
|
||
|
menuIDs: [],
|
||
|
menuList: [],
|
||
|
menuPopedom: []
|
||
|
}
|
||
|
},
|
||
|
computed: {
|
||
|
// 表头配置
|
||
|
tableColumn() {
|
||
|
return configData.tableColumnJson
|
||
|
},
|
||
|
},
|
||
|
watch: {
|
||
|
settingDialog: {
|
||
|
deep: true,
|
||
|
handler(newValue, oldValue) {
|
||
|
if (newValue == false) {
|
||
|
this.$refs.dataSetting.dataList = []
|
||
|
this.$refs.jurisdictionSetting.$refs.menuTree.$refs.elTree.setCheckedKeys([])
|
||
|
// this.$refs.elTree.getCheckedKeys()
|
||
|
// this.$refs.jurisdictionSetting.$refs.menuTree.checkChange([])
|
||
|
this.$refs.buttonSetting.classifyButtonList = []
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
},
|
||
|
created() { },
|
||
|
onShow() { },
|
||
|
mounted() {
|
||
|
this.initPage()
|
||
|
},
|
||
|
filters: {
|
||
|
|
||
|
},
|
||
|
methods: {
|
||
|
beforeLeave(activeName, oldActiveName) {
|
||
|
if (oldActiveName == 'jurisdictionSetting' && activeName == "buttonSetting") {
|
||
|
this.menuPopedom = this.$refs.jurisdictionSetting.menuPopedom
|
||
|
if (this.menuPopedom.length == 0) {
|
||
|
this.$vmNews("请选择菜单")
|
||
|
return false
|
||
|
}
|
||
|
}
|
||
|
if (oldActiveName == 'dataSetting' && activeName == "buttonSetting") {
|
||
|
return false
|
||
|
}
|
||
|
},
|
||
|
// 切换tab
|
||
|
handleClick(tab, event) {
|
||
|
if (this.activeName == 'buttonSetting') {
|
||
|
let checkdata = this.$refs.jurisdictionSetting.checkdata
|
||
|
this.$refs.buttonSetting.GetAllButtonList(this.menuPopedom, checkdata)
|
||
|
}
|
||
|
if (this.activeName == 'dataSetting') {
|
||
|
this.$refs.dataSetting.inPage()
|
||
|
}
|
||
|
},
|
||
|
// 获取菜单选中
|
||
|
getMenuIDs(menuData) {
|
||
|
menuData.forEach(el => {
|
||
|
if (el.type) {
|
||
|
this.menuList.push(el)
|
||
|
this.menuIDs.push(el.id)
|
||
|
}
|
||
|
if (el.children != null && el.children && el.children.length) {
|
||
|
this.getMenuIDs(el.children)
|
||
|
}
|
||
|
})
|
||
|
},
|
||
|
// 初始化页面
|
||
|
initPage() {
|
||
|
this.getTableList()
|
||
|
this.getOrganList()
|
||
|
|
||
|
this.$refs.userCustomtable.clearRadioIndex()
|
||
|
},
|
||
|
//获取菜单树
|
||
|
async getMenuData() {
|
||
|
let res = await GetMenuTree({})
|
||
|
if (res.code == 1) {
|
||
|
let arr = JSON.parse(res.data[0])
|
||
|
this.menuData = JSON.parse(res.data[0])
|
||
|
this.changeMenu(this.menuData, 0)
|
||
|
// this.getButtonArray(this.menuData)
|
||
|
}
|
||
|
},
|
||
|
// 菜单树添加参数
|
||
|
changeMenu(data, num) {
|
||
|
let level = num
|
||
|
level = level + 1
|
||
|
data.forEach(el => {
|
||
|
el.buttonList = []
|
||
|
el.type = false
|
||
|
// el.level = level
|
||
|
if (el.children != null && el.children && el.children.length) {
|
||
|
this.changeMenu(el.children, level)
|
||
|
}
|
||
|
})
|
||
|
},
|
||
|
// 获取用户信息列表
|
||
|
async getTableList() {
|
||
|
this.tabLoading = true
|
||
|
this.tableData = []
|
||
|
let params = {
|
||
|
...this.pageModel
|
||
|
}
|
||
|
let res = await RoleGetBillList(params)
|
||
|
if (res.code === 1) {
|
||
|
this.tableData = res.data[1]
|
||
|
this.$nextTick(() => {
|
||
|
this.$refs.customtable.clearRadioIndex()
|
||
|
|
||
|
this.$refs.userLayout.setPageTotal(res.data[0])
|
||
|
})
|
||
|
this.tabLoading = false
|
||
|
}
|
||
|
},
|
||
|
|
||
|
getButtonArray(menuData) {
|
||
|
menuData.forEach((el, index) => {
|
||
|
this.allButtonList.forEach(item => {
|
||
|
if (el.id == item.MenuID) {
|
||
|
item.active = false
|
||
|
el.buttonList.push(item)
|
||
|
}
|
||
|
})
|
||
|
if (el.children != null && el.children && el.children.length) {
|
||
|
this.getButtonArray(el.children)
|
||
|
}
|
||
|
})
|
||
|
},
|
||
|
// 单选
|
||
|
userRadioChange(val) {
|
||
|
this.radioIndex = val.index
|
||
|
this.userRadioId = val.r_RoleID
|
||
|
},
|
||
|
// 获取组织列表
|
||
|
async getOrganList() {
|
||
|
let params = {
|
||
|
// CompanyID: "43"
|
||
|
CompanyID: this.$store.state.user.companyID ? this.$store.state.user.companyID : getCompanyId()
|
||
|
}
|
||
|
let res = await GetOrganTree(params)
|
||
|
this.orangData = JSON.parse(res.data[0])
|
||
|
},
|
||
|
|
||
|
// 树状图点击
|
||
|
orangClick(data) {
|
||
|
this.pageModel.departmentID = data.id
|
||
|
this.resetTable()
|
||
|
// this.result()
|
||
|
},
|
||
|
|
||
|
resetTable() {
|
||
|
this.pageModel.page = 1
|
||
|
this.userRadioId = false
|
||
|
this.radioIndex = false
|
||
|
this.$nextTick(() => {
|
||
|
this.$refs.userCustomtable.clearRadioIndex()
|
||
|
this.$refs.userLayout.pageClear()
|
||
|
})
|
||
|
this.getTableList()
|
||
|
},
|
||
|
// 操作按钮事件
|
||
|
getFuncBtn(btnEven) {
|
||
|
if (this.radioIndex === false) {
|
||
|
this.$vmNews("请选择一条数据")
|
||
|
return
|
||
|
}
|
||
|
this[btnEven.btnFunciton]()
|
||
|
},
|
||
|
setting() {
|
||
|
this.getMenuData()
|
||
|
if (this.radioIndex === false) {
|
||
|
this.$vmNews("请选择一条数据")
|
||
|
return
|
||
|
}
|
||
|
this.settingDialog = true
|
||
|
this.activeName = "jurisdictionSetting"
|
||
|
this.GetPppedomData()
|
||
|
|
||
|
},
|
||
|
async GetPppedomData() {
|
||
|
let params = {
|
||
|
objectID: this.userRadioId,
|
||
|
kindid: 2
|
||
|
}
|
||
|
let res = await GetPppedomSet(params)
|
||
|
if (res.code == 1) {
|
||
|
const data = res.data
|
||
|
let menuIDs = data[0].length > 0 ? data[0][0].fp_MenuIdList.split(',') : []
|
||
|
this.$refs.jurisdictionSetting.$refs.menuTree.selectData = menuIDs
|
||
|
this.$refs.jurisdictionSetting.$refs.menuTree.checkChange(menuIDs)
|
||
|
let buttonPopedom = this.getbuttonPopedomList(res.data[1])
|
||
|
this.$refs.buttonSetting.buttonPopedom = buttonPopedom
|
||
|
let activeList = this.getActiveList(res.data[2])
|
||
|
this.$refs.dataSetting.activeList = activeList
|
||
|
// selectData
|
||
|
}
|
||
|
},
|
||
|
getActiveList(data) {
|
||
|
let array = []
|
||
|
data.forEach(el => {
|
||
|
el.dp_popeList.split(',').forEach(item => {
|
||
|
array.push(item)
|
||
|
})
|
||
|
})
|
||
|
return array
|
||
|
},
|
||
|
getbuttonPopedomList(data) {
|
||
|
let array = []
|
||
|
data.forEach(el => {
|
||
|
el.op_OperateKindList.split(',').forEach(item => {
|
||
|
array.push(item)
|
||
|
})
|
||
|
})
|
||
|
return array
|
||
|
},
|
||
|
pageChange(model) {
|
||
|
this.pageModel.page = model.page
|
||
|
this.pageModel.limit = model.limit
|
||
|
this.getTableList()
|
||
|
},
|
||
|
settingConfirmClick() {
|
||
|
let menuPopedom = this.$refs.jurisdictionSetting.menuPopedom.join(",")
|
||
|
let buttonPopedom = this.getButtonPopedom(this.$refs.buttonSetting.classifyButtonList)
|
||
|
let dataPopedom = this.getDataPopedom(this.$refs.dataSetting.dataList)
|
||
|
let params = {
|
||
|
kindid: 2,
|
||
|
objectID: this.userRadioId,
|
||
|
menuPopedom: menuPopedom,
|
||
|
buttonPopedom: buttonPopedom,
|
||
|
dataPopedom: dataPopedom,
|
||
|
}
|
||
|
this.saveData(params)
|
||
|
},
|
||
|
async saveData(params) {
|
||
|
let res = await PopedomSaveData(params)
|
||
|
if (res.code == 1) {
|
||
|
this.$vmNews("保存成功", 'success')
|
||
|
this.activeName = "jurisdictionSetting"
|
||
|
this.settingDialog = false
|
||
|
}
|
||
|
},
|
||
|
getDataPopedom(dataPopedom) {
|
||
|
let array = []
|
||
|
dataPopedom.forEach(el => {
|
||
|
el.dp_popeList = []
|
||
|
el.buttonList.forEach(item => {
|
||
|
if (item.type) {
|
||
|
el.dp_popeList.push(item.id)
|
||
|
}
|
||
|
})
|
||
|
})
|
||
|
dataPopedom.forEach(el => {
|
||
|
if (el.dp_popeList.length > 0) {
|
||
|
let params = {
|
||
|
dp_billKindID: el.billKindID,
|
||
|
dp_popeList: el.dp_popeList.join(',')
|
||
|
}
|
||
|
array.push(params)
|
||
|
}
|
||
|
})
|
||
|
return array
|
||
|
},
|
||
|
getButtonPopedom(buttonPopedom) {
|
||
|
let array = []
|
||
|
// let op_OperateKindList = []
|
||
|
buttonPopedom.forEach(el => {
|
||
|
el.op_MenuID = el.id
|
||
|
el.op_OperateKindList = []
|
||
|
el.buttonList.forEach(item => {
|
||
|
if (item.type) {
|
||
|
el.op_OperateKindList.push(item.id)
|
||
|
}
|
||
|
})
|
||
|
})
|
||
|
buttonPopedom.forEach(el => {
|
||
|
if (el.op_OperateKindList.length > 0) {
|
||
|
let params = {
|
||
|
op_MenuID: el.op_MenuID,
|
||
|
op_OperateKindList: el.op_OperateKindList.join(',')
|
||
|
}
|
||
|
array.push(params)
|
||
|
}
|
||
|
})
|
||
|
return array
|
||
|
},
|
||
|
},
|
||
|
}
|
||
|
</script>
|
||
|
<style scoped>
|
||
|
>>>.el-dialog__body {
|
||
|
padding: 0 25px;
|
||
|
}
|
||
|
</style>
|
||
|
<style scoped lang='scss'>
|
||
|
.roleName {
|
||
|
padding: 10px 0;
|
||
|
width: 90px;
|
||
|
border: 2px solid #f2f2f2;
|
||
|
background-color: #f2f2f2;
|
||
|
margin: 0px 10px 10px 0px;
|
||
|
text-align: center;
|
||
|
cursor: pointer;
|
||
|
box-shadow: 0 0 0 2px #f2f2f2;
|
||
|
border-radius: 5px;
|
||
|
}
|
||
|
|
||
|
.active {
|
||
|
background-color: #00a490;
|
||
|
border: 2px solid #ffffff;
|
||
|
color: white;
|
||
|
box-shadow: 0 0 0 2px #00a490;
|
||
|
}
|
||
|
|
||
|
.bigTitle {
|
||
|
padding-bottom: 10px;
|
||
|
margin: 10px 0;
|
||
|
font-size: 16px;
|
||
|
font-weight: bold;
|
||
|
border-bottom: 1px solid #ccc;
|
||
|
}
|
||
|
|
||
|
.organizationBody {
|
||
|
display: flex;
|
||
|
justify-content: space-evenly;
|
||
|
background-color: #f2f3f4;
|
||
|
padding: 10px
|
||
|
}
|
||
|
</style>
|