Merge branch 'master' into positec

king

2025-05-13 1779677cece5864b62a65df4b01a4a69496e149a

 src/tabviews/rolemanage/index.jsx

@@ -1,31 +1,33 @@
import React, {Component} from 'react'
import PropTypes from 'prop-types'
import { is, fromJS } from 'immutable'
import { Card, Col, Row, Icon, Menu, notification, Spin, Input, Tabs, Button, Tree, Empty } from 'antd'
import { Card, Col, Row, Menu, notification, Spin, Input, Tabs, Button, Tree, Empty, Select } from 'antd'
import { BankOutlined } from '@ant-design/icons'
import md5 from 'md5'

import Api from '@/api'
import Utils from '@/utils/utils.js'
import zhCN from '@/locales/zh-CN/role.js'
import enUS from '@/locales/en-US/role.js'
import MKEmitter from '@/utils/events.js'
import './index.scss'

const { Search } = Input
const { TabPane } = Tabs
const { TreeNode, DirectoryTree } = Tree
let checkedKeysMap = null
let linkMap = null

let linkMap = new Map()
let selectMap = null

export default class RoleManage extends Component {
  static propTpyes = {
    MenuNo: PropTypes.string, // 菜单参数
    MenuID: PropTypes.string // 菜单Id
    MenuID: PropTypes.string  // 菜单Id
  }

  state = {
    dict: sessionStorage.getItem('lang') !== 'en-US' ? zhCN : enUS,
    loading: true,
    loadingTree: false,
    loadingAppTree: false,
    roleList: null,
    filterRoleList: [],
    selectRoleId: '',
    mainMenus: null,
    menuTrees: null,
@@ -34,11 +36,22 @@
    selectMenuTrees: null,
    selectMenuOpenKeys: [],
    primarykey: '',
    tabKey: '',
    submitloading: false,
    initCheckKeys: null
    initCheckKeys: null,
    activeKey: 'manage',
    appTrees: null,
    appCheckedKeys: [],
    appOpenKeys: [],
    applist: [],
    selectApp: null,
    selectSubApp: null,
    selectAppTrees: null,
    selectAppOpenKeys: [],
  }

  /**
   * @description 获取角色列表
   */
  getRoleList = async () => {
    let param = {
      func: 's_rolemenu_get_list'
@@ -48,31 +61,63 @@
    if (result.status) {
      this.setState({
        roleList: result.data,
        loading: false
        filterRoleList: result.data || []
      })
    } else {
      this.setState({
        loading: false
      })
      notification.warning({
        top: 92,
        message: result.message,
        duration: 10
        duration: 5
      })
    }
  }

  getAppList = () => {
    let param = {
      func: 's_get_kei'
    }

    Api.getSystemConfig(param).then(result => {
      if (result.status) {
        let applist = result.data.map(item => {
          item.sublist = item.data_detail || []
          item.sublist = item.sublist.map(cell => {
            cell.ID = cell.d_id
            return cell
          })

          return item
        })
        let selectApp = applist[0] || null

        this.setState({ applist, selectApp })
      } else {
        notification.warning({
          top: 92,
          message: result.message,
          duration: 5
        })
      }
    })
  }

  /**
   * @description 获取一级菜单，用于构建结构树
   */
  getMainMenuList = async () => {
    let param = {
      func: 's_rolemenu_get_FstMenu'
      func: 's_rolemenu_get_FstMenu',
      version: 1
    }
    let result = await Api.getSystemConfig(param)

    if (result.status) {
      this.setState({
        loadingTree: true,
        loading: false,
        mainMenus: result.data.map(item => {
          return {
            title: item.MenuName,
            title: item.langname ? item.MenuName + '(' + item.langname + ')' : item.MenuName,
            key: item.MenuID,
            children: [],
            selected: true
@@ -82,83 +127,237 @@
        this.getAllMenuList()
      })
    } else {
      notification.warning({
        top: 92,
        message: result.message,
        duration: 10
      })
    }
  }

  getAllMenuList = async () => {
    const { selectRoleId, mainMenus, tabKey } = this.state

    let param = {
      func: 's_rolemenu_get_FunMenu',
      RoleID: selectRoleId,
      SelectedType: tabKey
    }

    let result = await Api.getSystemConfig(param)

    if (result.status) {
      let _tree = null
      let _openKeys = []

      let _state = {
        loading: false
      }

      if (tabKey === '') {
        let _initCheckKeys = [] // 初始选中的菜单id
        checkedKeysMap = new Map()
        linkMap = new Map()
        selectMap = new Map()

        result.data.forEach(item => {
          if (item.Selected !== 'true') return

          checkedKeysMap.set(item.MenuID, true)
          _initCheckKeys.push(item.MenuID)
        })

        _initCheckKeys = Array.from(new Set(_initCheckKeys))

        _tree = this.getTree(JSON.parse(JSON.stringify(mainMenus)), result.data)

        if (_tree[0]) {
          this.getOpenNode(_tree[0], _openKeys)
        }

        _state.menuTrees = _tree
        _state.initCheckKeys = _initCheckKeys
        _state.checkedKeys = Array.from(checkedKeysMap.keys())
        _state.menuOpenKeys = _openKeys
      } else {
        _tree = this.getSelectTree(JSON.parse(JSON.stringify(mainMenus)), result.data)
        _tree = _tree.filter(node => node.children)

        if (_tree[0]) {
          this.getOpenNode(_tree[0], _openKeys)
        }

        _state.selectMenuTrees = _tree
        _state.selectMenuOpenKeys = _openKeys
      }

      this.setState(_state)
    } else {
      this.setState({
        loading: false
      })
      notification.warning({
        top: 92,
        message: result.message,
        duration: 10
        duration: 5
      })
    }
  }

  /**
   * @description 获取所有菜单节点，形成权限树
   */
  getAllMenuList = async () => {
    const { selectRoleId, mainMenus } = this.state

    let param = {
      func: 's_rolemenu_get_FunMenu',
      RoleID: selectRoleId,
      SelectedType: '',
      version: 1
    }

    let result = await Api.getSystemConfig(param)

    if (result.status) {
      let _openKeys = []
      // MenuID（菜单Id）、MenuName（菜单名称）、OnlySelf（值为true，表示三级菜单，增加-仅页面）、Type（菜单级别）
      // ParentID（父级Id）、Selected（是否选中-已失效）、Tabs（ 标签类型）、TypeCharOne 菜单类型PC或其他
      // result.data.forEach(item => { // 测试
      //   if (item.ParentID === '0') {
      //     item.ParentID = item.TypeCharOne
      //   }
      // })
      // let map = new Map() // 去重

      // result.data = result.data.filter(item => {
      //   if (map.has(item.ParentID + item.MenuID)) return false

      //   map.set(item.ParentID + item.MenuID, true)
        
      //   return true
      // })

      let _tree = this.getTree(fromJS(mainMenus).toJS(), result.data)
      if (_tree[0]) {
        if (_tree[0].key.indexOf('PC') > -1 && _tree[0].children) {
          // _openKeys = _tree[0].children.map(cell => cell.key)
          this.getOpenNode(_tree[0].children[0], _openKeys)
        } else {
          this.getOpenNode(_tree[0], _openKeys)
        }
      }

      this.setState({
        loadingTree: false,
        menuTrees: _tree,
        menuOpenKeys: _openKeys
      })
    } else {
      this.setState({
        loadingTree: false
      })
      notification.warning({
        top: 92,
        message: result.message,
        duration: 5
      })
    }
  }

  /**
   * @description 选择角色且存在权限树时，获取已分配结构
   */
  getSelectMenuList = async () => {
    const { selectRoleId, menuTrees, activeKey } = this.state
    if (!menuTrees || !selectRoleId || activeKey !== 'manage') return

    let param = {
      func: 's_rolemenu_get_Menulist',
      RoleID: selectRoleId,
      version: 1
    }

    this.setState({
      loadingTree: true
    })

    let result = await Api.getSystemConfig(param)

    if (result.status) {
      let _openKeys = []

      let _initKeys = result.data.map(item => item.MenuID)
      _initKeys = Array.from(new Set(_initKeys))

      selectMap = new Map()
      this.getCheckedKeys(fromJS(menuTrees).toJS(), _initKeys)

      if (menuTrees[0]) {
        if (menuTrees[0].key.indexOf('PC') > -1 && menuTrees[0].children) {
          this.getOpenNode(menuTrees[0].children[0], _openKeys)
        } else {
          this.getOpenNode(menuTrees[0], _openKeys)
        }
      }

      let _openkeys = []
      let Keys = result.data.map(item => item.MenuID)
      let _tree = this.getSelectTree(fromJS(menuTrees).toJS(), Keys)

      if (_tree[0]) {
        if (_tree[0].key.indexOf('PC') > -1 && _tree[0].children) {
          this.getOpenNode(_tree[0].children[0], _openkeys)
        } else {
          this.getOpenNode(_tree[0], _openkeys)
        }
      }

      this.setState({
        loadingTree: false,
        initCheckKeys: _initKeys,
        checkedKeys: Array.from(selectMap.keys()),
        menuOpenKeys: _openKeys,
        selectMenuTrees: _tree,
        selectMenuOpenKeys: _openkeys
      })
    } else {
      this.setState({
        loadingTree: false
      })
      notification.warning({
        top: 92,
        message: result.message,
        duration: 5
      })
    }
  }

  /**
   * @description 选择角色且存在权限树时，获取已分配结构
   */
  getSelectAppNodeList = async () => {
    const { selectRoleId, selectSubApp, selectApp, appTrees, activeKey } = this.state

    if (!appTrees || !selectRoleId || activeKey !== 'app' || !selectSubApp || !selectApp) return

    let param = {
      func: 's_rolemenu_get_Menulist',
      RoleID: selectRoleId,
      TypeCharOne: selectApp.kei_no,
      typename: selectSubApp.typename,
      lang: selectSubApp.lang,
      version: 1
    }

    this.setState({
      loadingAppTree: true
    })

    let result = await Api.getSystemConfig(param)

    if (result.status) {
      let _initKeys = result.data.map(item => item.MenuID)
      _initKeys = Array.from(new Set(_initKeys))
      let _checkedKeys = []

      let getCheckedKeys = (parents) => {
        parents.forEach(item => {
          if (_initKeys.includes(item.key)) {
            if (item.children && item.children.length > 0) {
              getCheckedKeys(item.children)
            } else {
              _checkedKeys.push(item.key)
            }
          }
        })
      }

      getCheckedKeys(appTrees)

      let _openKeys = []
      let getOpenNode = (parentNode) => {
        if (parentNode && parentNode.children && parentNode.children.length > 0) {
          _openKeys.push(parentNode.key)
          parentNode.children.forEach(node => {
            getOpenNode(node)
          })
        }
      }
      getOpenNode(appTrees[0])

      let Keys = result.data.map(item => item.MenuID)
      let _tree = this.getSelectTree(fromJS(appTrees).toJS(), Keys)


      let _openkeys = []
      let _getOpenNode = (parentNode) => {
        if (parentNode && parentNode.children && parentNode.children.length > 0) {
          _openkeys.push(parentNode.key)
          parentNode.children.forEach(node => {
            _getOpenNode(node)
          })
        }
      }
      _getOpenNode(_tree[0])

      this.setState({
        loadingAppTree: false,
        appInitCheckKeys: _initKeys,
        appCheckedKeys: _checkedKeys,
        appOpenKeys: _openKeys,
        selectAppTrees: _tree,
        selectAppOpenKeys: _openkeys
      })
    } else {
      this.setState({
        loadingAppTree: false
      })
      notification.warning({
        top: 92,
        message: result.message,
        duration: 5
      })
    }
  }

  /**
   * @description 获取展开节点
   */
  getOpenNode = (parentNode, keys) => {
    if (parentNode.children) {
      keys.push(parentNode.key)
@@ -168,117 +367,130 @@
    }
  }

  getTree = (parents, options) => {
  /**
   * @description 获取权限分配树
   */
  getTree = (parents, options, addSelf) => {
    parents.forEach(parent => {
      parent.children = []

      // 添加菜单的子元素
      options.forEach(option => {
        if (option.ParentID === parent.key) {
          parent.children.push({
            title: option.MenuName,
            key: option.MenuID,
            selected: parent.selected && option.Selected === 'true',
            addSelf: option.OnlySelf === 'true',
            tabs: option.Tabs
            // tabs: option.Tabs
          })
        }
      })
      

      if (parent.children.length === 0) {
        parent.children = null
        if (parent.tabs) {
          let _uuid = Utils.getuuid()
          linkMap.set(_uuid, parent.key)
        // 针对标签，生成新的id，并保存关联关系（标签不唯一）
        // if (parent.tabs) {
        //   let _uuid = Utils.getuuid()
        //   linkMap.set(_uuid, parent.key)

          if (parent.selected) {
            checkedKeysMap.set(_uuid, true)
            checkedKeysMap.delete(parent.key)

            selectMap.set(_uuid, parent.key)
          }

          parent.key = _uuid
        }
        //   parent.originKey = parent.key
        //   parent.key = _uuid
        // }
      } else {
        if (parent.selected) {
          checkedKeysMap.delete(parent.key)
        }
        // 三级菜单创建子项
        if (parent.addSelf) {
          let _uuid = Utils.getuuid()
          linkMap.set(_uuid, parent.key)

          if (parent.selected) {
            checkedKeysMap.set(_uuid, true)
          }
          parent.subKey = _uuid

          parent.children.unshift({
            title: parent.title + '(仅页面)',
            key: _uuid,
            // isSubView: true
          })
        }

        if (parent.tabs) {
        } else if (addSelf) {
          let _uuid = Utils.getuuid()
          linkMap.set(_uuid, parent.key)
          parent.subKey = _uuid

          if (parent.selected) {
            selectMap.set(_uuid, parent.key)
          }

          parent.key = _uuid
        }

        parent.children = this.getTree(parent.children, options)
      }
    })

    return parents
  }

  getSelectTree = (parents, options) => {
    parents.forEach(parent => {
      parent.children = []

      options.forEach(option => {
        if (option.ParentID === parent.key) {
          parent.children.push({
            title: option.MenuName,
            key: option.MenuID,
            tabs: option.Tabs
          parent.children.unshift({
            title: parent.title + '(表格)',
            key: _uuid,
          })
        }
      })
      

      parent.key = Utils.getuuid()
      if (parent.children.length === 0) {
        parent.children = null
      } else {
        parent.children = this.getSelectTree(parent.children, options)
        // 针对标签，生成新的id，并保存关联关系（标签不唯一）
        // if (parent.tabs) {
        //   let _uuid = Utils.getuuid()
        //   linkMap.set(_uuid, parent.key)
          
        //   parent.originKey = parent.key
        //   parent.key = _uuid
        // }

        parent.children = this.getTree(parent.children, options, parent.addSelf)
      }
    })

    return parents
  }

  /**
   * @description 获取已选择的节点
   */
  getCheckedKeys = (parents, initKeys) => {
    parents.forEach(parent => {
      if ((parent.originKey && initKeys.indexOf(parent.originKey) > -1) || initKeys.indexOf(parent.key) > -1) {
        if (parent.children) {
          if (parent.subKey) {
            selectMap.set(parent.subKey, true)
          }
          this.getCheckedKeys(parent.children, initKeys)
        } else {
          selectMap.set(parent.key, true)
        }
      }
    })
  }

  /**
   * @description 生成已分配权限的结构树
   */
  getSelectTree = (parents, options) => {
    return parents.filter(parent => {
      if ((parent.originKey && options.indexOf(parent.originKey) > -1) || options.indexOf(parent.key) > -1) {
        if (parent.children) {
          parent.children = this.getSelectTree(parent.children, options)
          if (parent.children.length === 0) {
            parent.children = null
          }
        }
        return true
      // } else if (parent.isSubView) {
      //   return true
      }
      return false
    })
  }

  /**
   * @description 角色切换
   */
  changeRole = (role) => {
    const { selectRoleId } = this.state

    if (selectRoleId === role.RoleID) return

    this.setState({
      selectRoleId: role.RoleID,
      menuTrees: null,
      checkedKeys: [],
      menuOpenKeys: [],
      selectMenuTrees: null,
      selectMenuOpenKeys: []
      selectRoleId: role.RoleID
    }, () => {
      this.getAllMenuList()
      this.getSelectMenuList()
      this.getSelectAppNodeList()
    })
  }

  /**
   * @description 获取树节点
   */
  renderTreeNodes = (data) => {
    return data.map(item => {
      if (item.children) {
@@ -292,6 +504,9 @@
    })
  }

  /**
   * @description 节点选择事件
   */
  onCheck = (checkedKeys, info) => {
    this.setState({
      checkedKeys: checkedKeys,
@@ -300,19 +515,21 @@
    })
  }

  changeTab = (key) => {
    const { menuTrees, selectMenuTrees } = this.state

  /**
   * @description 节点选择事件
   */
  onAppCheck = (checkedKeys, info) => {
    this.setState({
      tabKey: key === 'selected' ? key : ''
    }, () => {
      if ((key === 'selected' && !selectMenuTrees) || (key === 'all' && !menuTrees)) {
        this.getAllMenuList()
      }
      appCheckedKeys: checkedKeys,
      appHalfCheckedKeys: info.halfCheckedKeys,
      appInitCheckKeys: null
    })
  }

  roleSubmit = async () => {
  /**
   * @description 提交已选的权限
   */
  roleSubmit = () => {
    const { checkedKeys, halfCheckedKeys, selectRoleId, initCheckKeys } = this.state

    let _keys = []
@@ -328,67 +545,320 @@
          _keys.push(key)
        }
      })
      _cKeys = new Map(_cKeys.map(key => [key, true]))
      _keys = new Map(_keys.map(key => [key, true]))

      Array.from(selectMap.keys()).forEach(key => {
        if (!_cKeys.has(key)) {
          _keys.delete(selectMap.get(key))
        }
      })

      _keys = Array.from(_keys.keys())
      _keys = Array.from(new Set(_keys))
    }
    
    // let _LText = _keys.map(key => `select '${key}' as MenuID`)
    // _LText = _LText.join(' union all ')

    let param = {
      func: 's_rolemenu_sub',
      RoleID: selectRoleId,
      // LText: Utils.formatOptions(_LText)
      RoleMenu: _keys.map(key => {
        return {MenuID: key}
      })
    }

    let localParam = fromJS(param).toJS()
    localParam.func = 's_rolemenu_sub_local'

    this.setState({
      submitloading: true
    })

    let result = await Api.getSystemConfig(param)
    Api.getSystemConfig(param).then(result => {
      if (result.status) {
        notification.success({
          top: 92,
          message: '保存成功',
          duration: 2
        })
        this.setState({
          submitloading: false
        }, () => {
          this.getSelectMenuList()
          this.clearBackSqlCache()
        })
        if (window.GLOB.mainSystemApi) {
          Api.genericInterface(localParam).then(res => {
            if (!res.status) {
              notification.warning({
                top: 92,
                message: res.message,
                duration: 5
              })
            }
          })
        }
      } else {
        this.setState({
          submitloading: false
        })
        notification.warning({
          top: 92,
          message: result.message,
          duration: 5
        })
      }
    })
  }

    if (result.status) {
      notification.success({
        top: 92,
        message: '保存成功',
        duration: 2
      })
      this.setState({
        submitloading: false,
        menuTrees: null,
        checkedKeys: [],
        menuOpenKeys: [],
        selectMenuTrees: null,
        selectMenuOpenKeys: []
      }, () => {
        this.getAllMenuList()
      })
  clearBackSqlCache = () => {
    if (!window.backend) return

    Api.cacheInterface({}).then(res => {
      if (!res.status) {
        notification.warning({
          top: 92,
          message: res.message || '缓存清空失败！',
          duration: 5
        })
      }
    })
  }

  /**
   * @description 提交已选的权限
   */
  appRoleSubmit = () => {
    const { selectApp, selectSubApp, appCheckedKeys, appHalfCheckedKeys, selectRoleId, appInitCheckKeys } = this.state

    let _keys = []

    if (appInitCheckKeys) {
      _keys = appInitCheckKeys
    } else {
      notification.warning({
        top: 92,
        message: result.message,
        duration: 10
      })
      this.setState({
        submitloading: false
      _keys = appCheckedKeys.concat(appHalfCheckedKeys)
    }

    let param = {
      func: 's_rolemenu_sub',
      RoleID: selectRoleId,
      TypeCharOne: selectApp.kei_no,
      typename: selectSubApp.typename,
      lang: selectSubApp.lang,
      RoleMenu: _keys.map(key => {
        return {MenuID: key}
      })
    }

    let localParam = fromJS(param).toJS()
    localParam.func = 's_rolemenu_sub_local'

    this.setState({
      submitloading: true
    })

    Api.getSystemConfig(param).then(result => {
      if (result.status) {
        notification.success({
          top: 92,
          message: '保存成功',
          duration: 2
        })
        this.setState({
          submitloading: false
        }, () => {
          this.getSelectAppNodeList()
        })
        
        if (window.GLOB.mainSystemApi) {
          Api.genericInterface(localParam).then(res => {
            if (!res.status) {
              notification.warning({
                top: 92,
                message: res.message,
                duration: 5
              })
            }
          })
        }
      } else {
        this.setState({
          submitloading: false
        })
        notification.warning({
          top: 92,
          message: result.message,
          duration: 5
        })
      }
    })
  }

  reloadMenuView = (menuId) => {
    const { MenuID } = this.props

    if (MenuID !== menuId) return

    this.setState({
      loading: true,
      loadingTree: false,
      roleList: null,
      filterRoleList: [],
      selectRoleId: '',
      mainMenus: null,
      menuTrees: null,
      checkedKeys: [],
      appCheckedKeys: [],
      menuOpenKeys: [],
      selectMenuTrees: null,
      selectMenuOpenKeys: [],
      primarykey: '',
      submitloading: false,
      initCheckKeys: null,
      appInitCheckKeys: null,
      activeKey: 'manage',
      appTrees: null,
      appOpenKeys: [],
      applist: [],
      selectApp: null,
      selectSubApp: null,
      selectAppTrees: null,
      selectAppOpenKeys: []
    })
    this.getRoleList()
    this.getMainMenuList()
    this.getAppList()
  }

  filterRole = () => {
    const { primarykey, roleList } = this.state

    let _roleList  = []

    if (roleList && roleList.length > 0) {
      _roleList = roleList.filter(role => role.RoleName.toLowerCase().indexOf(primarykey.toLowerCase()) >= 0)
    }

    this.setState({filterRoleList: _roleList})
  }

  getTreeList = () => {
    const { selectApp, selectSubApp } = this.state
    let param = {
      func: 's_get_menus_roles_tree',
      typecharone: selectApp.kei_no,
      lang: selectSubApp.lang
    }

    param.upid = md5(window.GLOB.appkey + selectApp.kei_no + selectSubApp.typename + selectSubApp.lang)

    this.setState({loadingAppTree: true})

    Api.getSystemConfig(param).then(result => {
      if (result.status) {
        if (!result.data || result.data.length === 0) {
          this.setState({loadingAppTree: false, appTrees: [], appInitCheckKeys: null, appCheckedKeys: [], appOpenKeys: [], selectAppTrees: [], selectAppOpenKeys: []})
        } else {
          this.initTrees(result.data)
        }
      } else {
        this.setState({loadingAppTree: false, appTrees: [], appInitCheckKeys: null, appCheckedKeys: [], appOpenKeys: [], selectAppTrees: [], selectAppOpenKeys: []})
        notification.warning({
          top: 92,
          message: result.message,
          duration: 5
        })
      }
    })
  }

  initTrees = (data) => {
    let trees = []
    let map = new Map()
    let _data = data.sort((a, b) => {
      return a.sort - b.sort
    })

    _data.forEach(menu => {
      if (menu.ParentID === 'top') {
        trees.push({
          key: menu.MenuID,
          title: menu.MenuName,
          children: []
        })
      } else {
        map.set(menu.MenuID, menu)
      }
    })

    let reset = (m) => {
      return m.map(n => {
        [...map.keys()].forEach(key => {
          if (map.get(key).ParentID === n.key) {
            let c = map.get(key)
            n.children.push({
              key: c.MenuID,
              title: c.MenuName,
              children: []
            })
            map.delete(key)
          }
        })
        if (n.children.length > 0) {
          n.children = reset(n.children)
        }
        return n
      })
    }

    trees = reset(trees)

    let expandedKeys = this.getExpandedKeys(trees, 0, [])

    this.setState({loadingAppTree: false, appInitCheckKeys: null, appCheckedKeys: [], selectAppTrees: [], selectAppOpenKeys: [], appTrees: trees, appOpenKeys: expandedKeys}, () => {
      this.getSelectAppNodeList()
    })
  }

  getExpandedKeys = (trees, i, keys) => {
    if (i >= 3 || !trees[0]) return keys

    keys.push(trees[0].key)

    i++

    if (trees[0].children && trees[0].children.length > 0) {
      keys = this.getExpandedKeys(trees[0].children, i, keys)
    }

    return keys
  }

  changeType = (val) => {
    this.setState({
      activeKey: val
    }, () => {
      this.getSelectMenuList()
      this.getSelectAppNodeList()
    })
  }

  changeApp = (val) => {
    const { applist } = this.state

    let app = applist.filter(item => item.ID === val)[0]

    this.setState({selectApp: app, selectSubApp: null})
  }
  
  changeSubApp = (val) => {
    const { selectApp } = this.state

    let subapp = selectApp.sublist.filter(item => item.ID === val)[0]

    this.setState({selectSubApp: subapp}, () => {
      this.getTreeList()
    })
  }

  UNSAFE_componentWillMount () {
    this.getRoleList()
    this.getMainMenuList()
    this.getAppList()
  }

  componentDidMount () {
    MKEmitter.addListener('reloadMenuView', this.reloadMenuView)
  }

  /**
@@ -398,6 +868,7 @@
    this.setState = () => {
      return
    }
    MKEmitter.removeListener('reloadMenuView', this.reloadMenuView)
  }

  shouldComponentUpdate (nextProps, nextState) {
@@ -405,66 +876,134 @@
  }

  render() {
    const { roleList, loading, primarykey, menuTrees, checkedKeys, menuOpenKeys, selectMenuTrees, tabKey, selectRoleId, selectMenuOpenKeys, submitloading } = this.state

    let _roleList  = []

    if (roleList && roleList.length > 0) {
      _roleList = roleList.filter(role => role.RoleName.toLowerCase().indexOf(primarykey.toLowerCase()) >= 0)
    }
    const { activeKey, filterRoleList, applist, selectApp, selectSubApp, loading, loadingTree, loadingAppTree, primarykey, menuTrees, appTrees, checkedKeys, appCheckedKeys, menuOpenKeys, selectMenuTrees, selectAppTrees, selectRoleId, selectMenuOpenKeys, selectAppOpenKeys, submitloading, appOpenKeys } = this.state

    return (
      <div className="rolemanage">
      <div className={'rolemanage' + (applist.length === 0 ? ' manager' : '')}>
        {loading && <Spin size="large" />}
        <Row gutter={16}>
          <Col span={5}>
            <Card
              className="role-list"
              title={
                <span className="role-title">
                  <Icon type="bank" />
                  <span className="title">{this.state.dict['role.title']}</span>
                  <Search placeholder="" onSearch={value => this.setState({primarykey: value})} />
                </span>
              }
              bordered={false}
            >
              <Menu
                onClick={this.handleClick}
                mode="inline"
              >
                {_roleList.map((role, index) =>
                  <Menu.Item key={index} onClick={() => this.changeRole(role)}>{role.RoleName}</Menu.Item>
                )}
              </Menu>
            </Card>
          </Col>
          <Col span={19}>
            <Tabs defaultActiveKey="all" tabBarExtraContent={!tabKey && selectRoleId ? <Button type="primary" loading={submitloading} onClick={this.roleSubmit}>提交</Button> : null} onChange={this.changeTab}>
              <TabPane tab="菜单列表" key="all">
                {menuTrees && menuTrees.length > 0 ? <Tree
                  checkable
                  selectable={false}
                  defaultExpandedKeys={menuOpenKeys}
                  autoExpandParent={true}
                  onCheck={this.onCheck}
                  checkedKeys={checkedKeys}
        <Tabs activeKey={activeKey} type="card" onChange={this.changeType}>
          <TabPane tab="管理系统" key="manage">
            <Row gutter={16}>
              <Col span={5}>
                <Card
                  className="role-list"
                  title={
                    <span className="role-title">
                      <BankOutlined />
                      <span className="title">角色</span>
                      <Search placeholder="" value={primarykey} onChange={e => this.setState({primarykey: e.target.value})} onSearch={this.filterRole} />
                    </span>
                  }
                  bordered={false}
                >
                  {this.renderTreeNodes(menuTrees)}
                </Tree> : null}
                {menuTrees && menuTrees.length === 0 ? <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} /> : null}
                {!loading && !menuTrees ? <Spin className="load-tree" /> : null}
              </TabPane>
              <TabPane tab="已授权菜单" key="selected">
                {selectMenuTrees && selectMenuTrees.length > 0 ? <DirectoryTree multiple defaultExpandedKeys={selectMenuOpenKeys}>
                  {this.renderTreeNodes(selectMenuTrees)}
                </DirectoryTree> : null}
                {selectMenuTrees && selectMenuTrees.length === 0 ? <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} /> : null}
                {!loading && !selectMenuTrees ? <Spin className="load-tree" /> : null}
              </TabPane>
            </Tabs>
          </Col>
        </Row>
                  <Menu selectedKeys={[selectRoleId]} mode="inline">
                    {filterRoleList.map((role) =>
                      <Menu.Item key={role.RoleID} onClick={() => this.changeRole(role)}>{role.RoleName}</Menu.Item>
                    )}
                  </Menu>
                </Card>
              </Col>
              <Col span={19}>
                <Tabs defaultActiveKey="all">
                  <TabPane tab="权限" key="all">
                    {selectRoleId ? <Button className="submitBtn" type="primary" loading={submitloading} onClick={this.roleSubmit}>提交</Button> : null}
                    {!loadingTree && menuTrees && menuTrees.length > 0 ? <Tree
                      checkable
                      selectable={false}
                      defaultExpandedKeys={menuOpenKeys}
                      autoExpandParent={true}
                      onCheck={this.onCheck}
                      checkedKeys={checkedKeys}
                    >
                      {this.renderTreeNodes(menuTrees)}
                    </Tree> : null}
                    {!loadingTree && (!menuTrees || menuTrees.length === 0) ? <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} /> : null}
                    {loadingTree ? <Spin className="load-tree" /> : null}
                  </TabPane>
                  <TabPane tab="已授权" key="selected">
                    {!loadingTree && selectMenuTrees && selectMenuTrees.length > 0 ? <DirectoryTree multiple defaultExpandedKeys={selectMenuOpenKeys}>
                      {this.renderTreeNodes(selectMenuTrees)}
                    </DirectoryTree> : null}
                    {!loadingTree && (!selectMenuTrees || selectMenuTrees.length === 0) ? <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} /> : null}
                    {loadingTree ? <Spin className="load-tree" /> : null}
                  </TabPane>
                </Tabs>
              </Col>
            </Row>
          </TabPane>
          <TabPane tab="应用" key="app">
            <div className="app-select">
              <div className="mk-form-item">
                <label>应用:</label>
                <Select value={selectApp ? selectApp.ID : ''} onChange={this.changeApp}>
                  {applist.map(option =>
                    <Select.Option key={option.ID} value={option.ID}>{option.remark}</Select.Option>
                  )}
                </Select>
              </div>
              <div className="mk-form-item">
                <label>子应用:</label>
                <Select value={selectSubApp ? selectSubApp.ID : ''} onChange={this.changeSubApp}>
                  {selectApp && selectApp.sublist.map(option =>
                    <Select.Option key={option.ID} value={option.ID}>{`${option.typename}（${option.lang}）`}</Select.Option>
                  )}
                </Select>
              </div>
            </div>
            <Row gutter={16}>
              <Col span={5}>
                <Card
                  className="role-list"
                  title={
                    <span className="role-title">
                      <BankOutlined />
                      <span className="title">角色</span>
                      <Search placeholder="" value={primarykey} onChange={e => this.setState({primarykey: e.target.value})} onSearch={this.filterRole} />
                    </span>
                  }
                  bordered={false}
                >
                  <Menu selectedKeys={[selectRoleId]} mode="inline">
                    {filterRoleList.map((role) =>
                      <Menu.Item key={role.RoleID} onClick={() => this.changeRole(role)}>{role.RoleName}</Menu.Item>
                    )}
                  </Menu>
                </Card>
              </Col>
              <Col span={19}>
                <Tabs defaultActiveKey="all">
                  <TabPane tab="权限" key="all">
                    {selectSubApp && selectRoleId ? <Button className="submitBtn" type="primary" loading={submitloading} onClick={this.appRoleSubmit}>提交</Button> : null}
                    {selectSubApp ? <div>
                      {!loadingAppTree && appTrees && appTrees.length > 0 ? <Tree
                        checkable
                        selectable={false}
                        defaultExpandedKeys={appOpenKeys}
                        autoExpandParent={true}
                        onCheck={this.onAppCheck}
                        checkedKeys={appCheckedKeys}
                      >
                        {this.renderTreeNodes(appTrees)}
                      </Tree> : null}
                      {!loadingAppTree && (!appTrees || appTrees.length === 0) ? <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} /> : null}
                      {loadingAppTree ? <Spin className="load-tree" /> : null}
                    </div> : <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} description={'请选择子应用'} />}
                  </TabPane>
                  <TabPane tab="已授权" key="selected">
                    {selectSubApp ? <div>
                      {!loadingAppTree && selectAppTrees && selectAppTrees.length > 0 ? <DirectoryTree multiple defaultExpandedKeys={selectAppOpenKeys}>
                        {this.renderTreeNodes(selectAppTrees)}
                      </DirectoryTree> : null}
                      {!loadingAppTree && (!selectAppTrees || selectAppTrees.length === 0) ? <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} /> : null}
                      {loadingAppTree ? <Spin className="load-tree" /> : null}
                    </div> : <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} description={'请选择子应用'} />}
                  </TabPane>
                </Tabs>
              </Col>
            </Row>
          </TabPane>
        </Tabs>
        
      </div>
    )
  }