1.新增APP菜单

loulijun2021

2023-10-17 644bf8e20a9a3aedb11a49fe8e7295dea2b79776

 src/views/basicSettings/powerDivider.vue

@@ -52,7 +52,7 @@
          >保 存
          </el-button>

          <el-tabs v-model="activeName" type="border-card">
          <el-tabs v-model="activeName" type="border-card" @tab-click="tabClick">
            <el-tab-pane label="PC端" name="PC">
              <div style="display: flex;">
                <div
@@ -68,7 +68,7 @@
                  </div>

                  <el-tree
                    ref="treeCenterRef"
                    ref="treeCenterPCRef"
                    style="padding-top: 10px;"
                    :data="treeCenter"
                    highlight-current
@@ -131,7 +131,36 @@
<!--                </div>-->
              </div>
            </el-tab-pane>
            <el-tab-pane label="APP端" name="APP">APP端</el-tab-pane>
            <el-tab-pane label="APP端" name="APP">
              <div style="display: flex;">
                <div
                  ref="scrollLeft"
                  style="border-right: 1px solid rgba(0,0,0,0.2);width:100%;
                                overflow-y: auto;overflow-x:hidden;"
                  :style="{height:(tableHeight-40)+'px'}"
                  @scroll="scrollLeftScroll()"
                  @mouseover="isScroll='left'"
                >
                  <div style=" ">
                    <i class="el-icon-s-operation" :style="{color:$store.state.settings.theme}" /> 菜单权限
                  </div>

                  <el-tree
                    ref="treeCenterAPPRef"
                    style="padding-top: 10px;"
                    :data="treeCenter"
                    highlight-current
                    :props="defaultPropsCenter"
                    show-checkbox
                    node-key="menucode"
                    :default-expand-all="true"
                    @check-change="handleTreeCenterCheckChange"
                    @check="handleTreeCenterCheck"
                    @node-click="getLeftTreeNode"
                  />
                </div>
              </div>
            </el-tab-pane>
            <el-tab-pane label="工控端" name="工控端">工控端</el-tab-pane>
          </el-tabs>

@@ -220,6 +249,11 @@
        this.$notify.error('请先建相对应的角色！')
      }
    },
    async tabClick() {
      this.treeCenter = []
      await this.getRolePermissionSearchRoleMenuButton(this.$refs.treeLeftRef.getCurrentKey())// 用于数据回显
      await this.getRolePermissionSearchRoleMenu(this.$refs.treeLeftRef.getCurrentKey())// 用于渲染页面
    },

    // 获取菜单权限对应的按钮
    async getRolePermissionSearchRoleMenuButton(rolecode) {
@@ -264,7 +298,12 @@
    handleData() {
      this.menuCheckedCodeArr = this.allButtonData.map(i => i.menucode)
      this.$nextTick(() => {
        this.$refs.treeCenterRef.setCheckedKeys(this.menuCheckedCodeArr)
        if (this.activeName === 'PC') {
          this.$refs.treeCenterPCRef.setCheckedKeys(this.menuCheckedCodeArr)
        }
        if (this.activeName === 'APP') {
          this.$refs.treeCenterAPPRef.setCheckedKeys(this.menuCheckedCodeArr)
        }
      })

      this.treeCenter[0].children.forEach(item => {
@@ -301,7 +340,13 @@

    // 全选改变
    handleCheckAllChange(val) {
      const checkedKeys = this.$refs.treeCenterRef.getCheckedKeys()
      let checkedKeys
      if (this.activeName === 'PC') {
        checkedKeys = this.$refs.treeCenterPCRef.getCheckedKeys()
      }
      if (this.activeName === 'APP') {
        checkedKeys = this.$refs.treeCenterAPPRef.getCheckedKeys()
      }

      if (val) {
        this.treeCenter[0].children.forEach(item => {
@@ -335,7 +380,12 @@
        } else if (this.menuCheckedCodeArr.includes(code) && oldValue.length === 1 && newValue.length === 0) { // 是
          this.menuCheckedCodeArr = this.menuCheckedCodeArr.filter(i => i !== code)
        }
        this.$refs.treeCenterRef.setCheckedKeys(this.menuCheckedCodeArr)
        if (this.activeName === 'PC') {
          this.$refs.treeCenterPCRef.setCheckedKeys(this.menuCheckedCodeArr)
        }
        if (this.activeName === 'APP') {
          this.$refs.treeCenterAPPRef.setCheckedKeys(this.menuCheckedCodeArr)
        }
      }

      // 这里是判断全选checkbox 是否选中
@@ -420,7 +470,14 @@
    async saveClick() {
      const rolecode = this.$refs.treeLeftRef.getCurrentKey()
      const datacode = this.treeLeft.find(i => i.code === rolecode).datarange !== 'CUSTOM' ? this.treeLeft.find(i => i.code === rolecode).datarange : this.treeLeft.find(i => i.code === rolecode).datapermissions
      const menuKeyArr = this.$refs.treeCenterRef.getCheckedKeys()
      let menuKeyArr
      if (this.activeName === 'PC') {
        menuKeyArr = this.$refs.treeCenterPCRef.getCheckedKeys()
      }
      if (this.activeName === 'APP') {
        menuKeyArr = this.$refs.treeCenterAPPRef.getCheckedKeys()
      }

      const arr = []
      this.treeCenter[0].children.forEach(item => {
        if (item.children && item.children.length) {