AIPlatform/src/js/roleManager.js

const $ = require('jquery');
require("../css/roleManager.less");
require('./../resource/jquery-ui/jquery-ui.min.js');
require('./modal.js');
const {api} = require('./api.js')
const {post, initScroll} = require('./utils.js')
const switchIconOpen = require("./../images/btn_open.png")
const switchIconClose = require("./../images/btn_close.png")
const iconDown= require("./../images/arrow_down.png")
const iconUp = require("./../images/arrow_up.png")
const arrowLeft= require("./../images/arrow_left.png")
const arrowRight = require("./../images/arrow_right.png")

$(function(){
    let curId="",curData="",curTreeData=[],permissionIdLis=[],menuIdLis=[];
    $(window).resize(function(){
        $(".role .leftMenu").css("height",$(window).height()-128+'px')
        $(".role .rightMenu").css({"height":$(window).height()-88+'px',"width":$(".filterBox").width()-400+'px'})
        $(".role .mainSysWrap").css({"height":$(window).height()-145+'px'})
    })
    $(".role .mainSysWrap").css({"height":$(window).height()-145+'px'})
    $(".role .leftMenu").css("height",$(window).height()-128+'px')
    $(".role .rightMenu").css({"height":$(window).height()-88+'px',"width":$(".filterBox").width()-400+'px'})
    $(".saveRoleSet").click(function(){//保存角色设置
        getParams()
        $.alerModal({type:"loading"});
        let params = {
            "roleId": curId,
            "sysMenuSaveVOList": menuIdLis,
            "sysPermissionSaveVOList": permissionIdLis
        }
        saveRoleMenu(params)
    })
    getRoleList()
    getRoleMenu()
    // saveRoleMenu()
    function getRoleMenu(id){
        if(!id)return
        post(api.getRoleMenu,{roleId:id}).then(res =>{
            let data = res.data;
            if(data.code == '0'){
                curData = data.data
                roleSetLis(data.data)
            }else{}
        }).catch((e) =>{
        
        })
    }
    function getRoleList(){
        post(api.list).then(res =>{
            let data = res.data;
            if(data.code == '0'){
                roleLeftLis(data.data)
                curId=data.data.length>0&&data.data[0].id||''
                getRoleMenu(curId)
            }else{}
        }).catch((e) =>{
        
        })
    }
    function saveRoleMenu(params){
        post(api.saveRoleMenu,params).then(res =>{
            let data = res.data;
            $(".loading").remove()
            if(data.code == '0'){
                $.alerModal({type:"tip",message:"保存成功"});
            }else{

            }
        }).catch((e) =>{
            $(".loading").remove()
        })
    }
    function roleSetLis(data){
        let str = '',sonStr=''
        for(let i = 0;i < data.length;i++){
            let tmp = data[i]
            str += `
                <div class="mainSys" data-index="${i}" data-menuId="${data[i].menuId}">
                    <div class="parentSet">
                    <span data-menuId="${data[i].menuId}" data-haveMenu="${data[i].haveMenu}" data-parentId="${data[i].parentId}" class="selectToggle"><img src="${data[i].haveMenu == 1?require('../images/icon_check.png'):require('../images/icon_unchecked.png')}" alt=""> ${data[i].menuName}</span>
                    </div>
                    ${
                        (function(tmp){
                            if(tmp.sonMenuDTOList&&tmp.sonMenuDTOList.length>0){
                                return getTwoLis(tmp.sonMenuDTOList)
                            }else if(tmp.sysPermissionDTOList&&tmp.sysPermissionDTOList.length>0){
                                return getOneLis(tmp.sysPermissionDTOList)
                            }
                        })(tmp)
                    }
                </div>
            `
        }
        $(".mainSysWrap").html(str)
        saveAllSet()
        initScroll("mainSysWrap","Y",1)
    }
    function saveAllSet(){
        $(".selectToggle").click(function(){//点击修改curTreeData，curData
            let permissionId = $(this).attr("data-permissionId")
            let menuId = $(this).attr("data-menuId")
            let parentId = $(this).attr("data-parentId")
            let haveMenu = $(this).attr("data-haveMenu")
            let grandParentId = $(this).parents(".mainSys").attr("data-menuId")
            let grandIndex = $(this).parents(".mainSys").attr("data-index")
            let tmpSelectData = null,tmpSelectDataOr=[];
            if(grandParentId == 3||grandParentId == 2||grandParentId==17||grandParentId==18){//循环
                // console.log(curData[grandIndex])
                let tmpData = curData[grandIndex];
                let tmpDataLis = curData[grandIndex].sonMenuDTOList;
                if(parentId == -1&&menuId&&menuId == tmpData.menuId) {//第一层，全选反选,
                    tmpData.haveMenu = haveMenu==0?'1':'0'
                    for(let i = 0;i < tmpDataLis.length;i++){
                        let num = 0
                        let tmpPer = tmpDataLis[i].sysPermissionDTOList
                        tmpDataLis[i].haveMenu = haveMenu==0?'1':'0'
                        for(let m = 0;m < tmpPer.length;m++){//所有相同id联动
                            tmpPer[m].havePermission = haveMenu==0?'1':'0'
                        }
                    }
                }else if(permissionId){//第三层
                    let tmpNum = 0
                    for(let i = 0;i < tmpDataLis.length;i++){
                        let num = 0
                        let tmpPer = tmpDataLis[i].sysPermissionDTOList
                        for(let m = 0;m < tmpPer.length;m++){//所有相同id联动
                            if(tmpPer[m].permissionId == permissionId){//当前选中或者取消
                                tmpPer[m].havePermission = haveMenu==0?'1':'0'
                            }
                            if(tmpPer[m].havePermission == 0){
                                ++num
                            }
                        }
                        if(num == tmpPer.length){//内层全部都取消了，父级取消选中
                            // tmpDataLis[i].haveMenu = '0'
                        }else{
                            tmpDataLis[i].haveMenu = '1'
                        }
                        //二层否有选中，有则第一层选中，否则第一层不选中
                        if(tmpDataLis[i].haveMenu == 0){
                            ++tmpNum
                        }
                    }
                    if(tmpNum == tmpDataLis.length){//二层都是取消状态，一层选中取消掉否则选中
                        tmpData.haveMenu = 0
                    }else{
                        tmpData.haveMenu = 1
                    }
                }else{//第二层,内层全选反选
                    let tmpNum = 0
                    for(let i = 0;i < tmpDataLis.length;i++){
                        let tmpPer = tmpDataLis[i].sysPermissionDTOList
                        if(menuId&&menuId == tmpDataLis[i].menuId){//第二层,里面的全部选中或者全部取消
                            tmpSelectData = tmpDataLis[i]
                            tmpDataLis[i].haveMenu = haveMenu==0?'1':'0'
                            for(let m = 0;m < tmpPer.length;m++){//所有相同id联动
                                tmpPer[m].havePermission = haveMenu==0?'1':'0'
                            }
                        }
                        //二层否有选中，有则第一层选中，否则第一层不选中
                        if(tmpDataLis[i].haveMenu == 0){
                            ++tmpNum
                        }
                    }
                    if(tmpNum == tmpDataLis.length){//二层都是取消状态，一层选中取消掉否则选中
                        tmpData.haveMenu = 0
                    }else{
                        tmpData.haveMenu = 1
                    }
                    //全选后遍历统计数据中有相同id的也要选中,三级自动选中后二级要判断是取消还是选中
                    for(let i = 0;i < tmpDataLis.length;i++){//二级循环
                        let num = 0
                        if(menuId&&menuId != tmpDataLis[i].menuId){//第二层,没有点击，自动选中第三层相同id的
                            let tmpPer = tmpDataLis[i].sysPermissionDTOList
                            for(let m = 0;m < tmpPer.length;m++){//所有相同id联动,三级循环
                                for(let n = 0;n < tmpSelectData.sysPermissionDTOList.length;n++){
                                    if(tmpSelectData.sysPermissionDTOList[n].permissionId == tmpPer[m].permissionId){
                                       tmpPer[m].havePermission = haveMenu==0?'1':'0'
                                    }
                                }
                            }
                        }
                    }
                    for(let i = 0;i < tmpDataLis.length;i++){//二级循环
                        let num = 0
                        let tmpPer = tmpDataLis[i].sysPermissionDTOList
                        for(let m = 0;m < tmpPer.length;m++){//所有相同id联动，三级循环
                            if(tmpPer[m].havePermission == 0){
                                ++num
                            }
                        }
                        if(num == tmpPer.length&&tmpPer.length>0){//内层全部都取消了，父级取消选中
                            tmpDataLis[i].haveMenu = '0'
                        }else{
                            tmpDataLis[i].haveMenu = '1'
                        }
                    }
                }
            }else{
                let tmpData = curData[grandIndex];
                let tmpDataLis = curData[grandIndex].sysPermissionDTOList;
                if(permissionId&&parentId==tmpData.menuId){//当前第二层
                    let num = 0;
                    for(let i = 0;i < tmpDataLis.length;i++){//判断当前点的是第几层
                        let tmpPer = tmpDataLis[i]
                        if(tmpPer.permissionId == permissionId){//当前选中或者取消
                            tmpPer.havePermission = haveMenu==0?'1':'0'
                        }
                        if(tmpPer.havePermission == 0){
                            ++num
                        }
                    }
                    if(num == tmpDataLis.length){//内层全部都取消了，父级取消选中
                        tmpData.haveMenu = '0'
                    }else{
                        tmpData.haveMenu = '1'
                    }
                }else if(menuId&&menuId == tmpData.menuId){//第一层，全选反选
                    tmpData.haveMenu = haveMenu==0?'1':'0'
                    for(let i = 0;i < tmpDataLis.length;i++){
                        let tmpPer = tmpDataLis[i]
                        tmpPer.havePermission = haveMenu==0?'1':'0'
                    }
                }
            }
            roleSetLis(curData)
            getParams()
        })
    }
    function getParams(){//type=0删除，1添加，共三层
        permissionIdLis=[],menuIdLis=[];
        for(let i = 0;i < curData.length;i++){//最外层的
            let tmpData = curData[i]
            if(tmpData.haveMenu == 1){//第一层选中了，继续遍历第二层
                menuIdLis.push({menuId:tmpData.menuId})
                if(tmpData.sonMenuDTOList&&tmpData.sonMenuDTOList.length > 0){//说明有第三层
                    let tmpSon = tmpData.sonMenuDTOList
                    for(let m = 0;m < tmpSon.length;m++){
                        let tmpSym = tmpSon[m]
                        if(tmpSym.haveMenu == 1){//有选中，遍历第三层
                            menuIdLis.push({menuId:tmpSym.menuId})
                            for(let n =0;n < tmpSym.sysPermissionDTOList.length;n++){
                                if(tmpSym.sysPermissionDTOList[n].havePermission == 1){
                                    permissionIdLis.push({permissionId:tmpSym.sysPermissionDTOList[n].permissionId})
                                }
                            }
                        }
                    }
                }else{//只有两层
                    if(tmpData.haveMenu == 1){
                        for(let j = 0;j < tmpData.sysPermissionDTOList.length;j++){
                            let tmpS =  tmpData.sysPermissionDTOList[j]
                            if(tmpS.havePermission == 1){
                                permissionIdLis.push({permissionId:tmpS.permissionId})
                            }
                        }
                    }
                }
            }
        }
        // console.log(permissionIdLis,menuIdLis)
    }
    function getOneLis(data){
        let tmpstr = ''
        for(let i = 0;i <data.length;i++){
            tmpstr += `
                <li>
                <span data-permissionId="${data[i].permissionId}" data-haveMenu="${data[i].havePermission}" data-parentId="${data[i].parentId}" class="selectToggle"><img src="${data[i].havePermission==1?require('../images/icon_check.png'):require('../images/icon_unchecked.png')}" alt=""> ${data[i].permissionName}</span>
                </li>
            `
        }
        return '<ul class="sonSet clearfix">'+tmpstr+'</ul>'
    }
    function getTwoLis(data){
        curTreeData = data
        let tmpstr = ''
        for(let i = 0;i <data.length;i++){
            tmpstr += `
                <div class="sysWrap">
                    <div class="parentSet">
                        <span data-menuId="${data[i].menuId}" data-haveMenu="${data[i].haveMenu}" data-parentId="${data[i].parentId}" class="selectToggle"><img src="${data[i].haveMenu == 1?require('../images/icon_check.png'):require('../images/icon_unchecked.png')}" alt=""> ${data[i].menuName}</span>
                    </div>
                    <ul class="sonSet clearfix">
                        ${getTreeLis(data[i].sysPermissionDTOList,data[i].menuId)}
                    </ul>
                </div>
            `
        }
        return tmpstr
    }
    function getTreeLis(data){
        let tmpstr = ''
        for(let i = 0;i <data.length;i++){
            tmpstr += `
                <li>
                    <span data-permissionId="${data[i].permissionId}" data-haveMenu="${data[i].havePermission}" data-parentId="${data[i].parentId}" class="selectToggle"><img src="${data[i].havePermission==1?require('../images/icon_check.png'):require('../images/icon_unchecked.png')}" alt=""> ${data[i].permissionName}</span>
                </li>
            `
        }
        return tmpstr
    }
    function roleLeftLis(data){
        let str = ''
        for(let i = 0;i < data.length;i++){
            str+=`
                <li class="ellipsis editRole" style="background:${i == 0?'#F0F5FF':'#fff'}" data-id="${data[i].id}">${data[i].name}</li>
            `
        }
        $(".leftMenu ul").html(str)
        changeRole()
    }
    function changeRole(){
        $(".editRole").click(function(){
            let id = $(this).attr("data-id")
            curId = id
            permissionIdLis=[],menuIdLis=[];
            $(".mainSysWrap").scrollTop(0)
            $(this).css({"background-color":"#F0F5FF"}).siblings().css("background-color","#fff")
            getRoleMenu(id)
        })
    }
})