1.文件替换

loulijun2021

2024-05-07 dc1879fd0713eed48b2c75af5f29a1085291d276

 src/views/basicSettings/powerDivider.vue

@@ -52,12 +52,12 @@
          >保 存
          </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
                  ref="scrollLeft"
                  style="border-right: 1px solid rgba(0,0,0,0.2);width:260px;
                  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()"
@@ -68,8 +68,8 @@
                  </div>

                  <el-tree
                    ref="treeCenterRef"
                    style="padding-top: 10px;width: 199px;"
                    ref="treeCenterPCRef"
                    style="padding-top: 10px;"
                    :data="treeCenter"
                    highlight-current
                    :props="defaultPropsCenter"
@@ -81,58 +81,87 @@
                    @node-click="getLeftTreeNode"
                  />
                </div>
                <!--                <div-->
                <!--                  ref="scrollCenter"-->
                <!--                  style="width: calc(100% - 260px );padding-left: 10px;overflow-y: auto;"-->
                <!--                  :style="{height:(tableHeight-40)+'px'}"-->
                <!--                  @scroll="scrollCenterScroll()"-->
                <!--                  @mouseover="isScroll='center'"-->
                <!--                >-->
                <!--                  <div style=" ">-->
                <!--                    <i class="el-icon-s-operation" :style="{color:$store.state.settings.theme}" /> 按钮权限-->
                <!--                  </div>-->

                <!--                  <el-checkbox-->
                <!--                    v-model="buttonIsChecked"-->
                <!--                    style="height: 26px;display:flex;align-items: center;margin-top:10px;width:200px"-->
                <!--                    @change=" handleCheckAllChange "-->
                <!--                  >全选-->
                <!--                  </el-checkbox>-->

                <!--                  <div v-if="treeCenter.length>0">-->
                <!--                    <div v-for="(item,index) in treeCenter[0].children" :key="item.menucode">-->

                <!--                      <div-->
                <!--                        v-if="!item.buttoncodelist"-->
                <!--                        style="margin-left: 40px;height:26px;display: flex;"-->
                <!--                      />-->

                <!--                      <el-checkbox-group-->
                <!--                        v-for="it in item.children"-->
                <!--                        v-if="item.expanded"-->
                <!--                        :key="it.menucode"-->
                <!--                        v-model="it.buttonChecked"-->
                <!--                        style="margin-left: 40px;height:26px;display: flex;"-->
                <!--                        @change="val=>handleCheckedButtonChange(val,it.menucode,it.buttonChecked)"-->
                <!--                      >-->

                <!--                        <el-checkbox-->
                <!--                          v-for="i in it.buttoncodelist"-->
                <!--                          :key="i"-->
                <!--                          :label="i"-->
                <!--                          style="display:flex;align-items: center;"-->
                <!--                        />-->
                <!--                      </el-checkbox-group>-->

                <!--                    </div>-->

                <!--                  </div>-->

                <!--                </div>-->
              </div>
            </el-tab-pane>
            <el-tab-pane label="APP端" name="APP">
              <div style="display: flex;">
                <div
                  ref="scrollCenter"
                  style="width: calc(100% - 260px );padding-left: 10px;overflow-y: auto"
                  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="scrollCenterScroll()"
                  @mouseover="isScroll='center'"
                  @scroll="scrollLeftScroll()"
                  @mouseover="isScroll='left'"
                >
                  <div style=" ">
                    <i class="el-icon-s-operation" :style="{color:$store.state.settings.theme}" /> 按钮权限
                    <i class="el-icon-s-operation" :style="{color:$store.state.settings.theme}" /> 菜单权限
                  </div>

                  <el-checkbox
                    v-model="buttonIsChecked"
                    style="height: 26px;display:flex;align-items: center;margin-top:10px;width:200px"
                    @change=" handleCheckAllChange "
                  >全选
                  </el-checkbox>

                  <div v-if="treeCenter.length>0">
                    <div v-for="(item,index) in treeCenter[0].children" :key="item.menucode">

                      <div
                        v-if="!item.buttoncodelist"
                        style="margin-left: 40px;height:26px;display: flex;"
                      />

                      <el-checkbox-group
                        v-for="it in item.children"
                        v-if="item.expanded"
                        :key="it.menucode"
                        v-model="it.buttonChecked"
                        style="margin-left: 40px;height:26px;display: flex;"
                        @change="val=>handleCheckedButtonChange(val,it.menucode,it.buttonChecked)"
                      >

                        <el-checkbox
                          v-for="i in it.buttoncodelist"
                          :key="i"
                          :label="i"
                          style="display:flex;align-items: center;"
                        />
                      </el-checkbox-group>

                    </div>

                  </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="APP端" name="APP">APP端</el-tab-pane>
            <el-tab-pane label="工控端" name="工控端">工控端</el-tab-pane>
            <!--            <el-tab-pane label="工控端" name="工控端">工控端</el-tab-pane>-->
          </el-tabs>

        </div>
@@ -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) {