修改

src/getMenu.js

@@ -136,6 +136,9 @@ function parseMenu (arr) {
   const allMenus = newMenus.length
     ? newMenus.sort((a, b) => a.meta.show_index - b.meta.show_index)
     : []
+  allMenus.map(item => {
+    item.children = item.children.sort((a, b) => a.meta.show_index - b.meta.show_index)
+  })
   allMenus.push({
     path: '/:pathMatch(.*)',
     redirect: '/404',

src/views/systemSettings/views/newAuth/components/table.vue

@@ -353,6 +353,18 @@ export default {
       this.tableForm = row
     },
     headerClick (column) {
+      const dom = document.querySelector('.el-table .el-table__header-wrapper .el-table__header .has-gutter .' + column.id)
+      const domAll = document.querySelectorAll('.el-table .el-table__header-wrapper .el-table__header th')
+      if (domAll && domAll.length) {
+        domAll.forEach(item => {
+          item.style.background = ''
+          item.style.border = ''
+        })
+      }
+      if (dom) {
+        dom.style.background = '#E4F3F9'
+        dom.style.border = '1px solid #4A82D6'
+      }
       const datas = this.tableData.filter(item => item.columnName == column.property)
       this.tableName = column.property ? false : true
       if (datas && datas.length) {
@@ -398,9 +410,12 @@ export default {
       margin-top: 20px;
       height: calc(100% - 48px);
       ::v-deep .table {
-        // .el-table__body-wrapper {
-        //   display: none;
-        // }
+        .el-table__header {
+          .cell {
+            text-align: center;
+            color: #333;
+          }
+        }
       }
     }
   }

src/views/systemSettings/views/newAuth/index.vue

@@ -12,16 +12,16 @@
         </div>
         <div class="newAuth-content-left-tree">
           <el-scrollbar ref="scroll" style="height: 100%">
-            <el-tree ref="tree" :data="treeData" :props="defaultProps" highlight-current :filter-node-method="filterNode" node-key="auth_id" @node-click="handleNodeClick" :expand-on-click-node="false">
+            <el-tree ref="tree" :data="treeData" :props="defaultProps" :default-expanded-keys="expandedKeys" highlight-current :filter-node-method="filterNode" node-key="auth_id" @node-click="handleNodeClick" :expand-on-click-node="false">
               <span class="custom-tree-node" slot-scope="{ node, data }">
                 <span class="customTxt">{{ node.label }}</span>
                 <div>
-                  <template v-if="data.auth_type == 1 || data.auth_type == 2">
-                    <el-button @click.stop="handleUp(node,data)" type="text">上移</el-button>
-                    <el-button @click.stop="handleDown(node,data)" type="text">下移</el-button>
-                  </template>
                   <span v-show="treeCheckId == data.auth_id" class="customBtn">
-                    <span v-if="data.auth_id != 0" @click.stop="handleRemove(node, data)">删除</span>
+                    <template v-if="data.auth_type == 1 || data.auth_type == 2">
+                      <el-button @click.stop="handleUp(node,data)" type="text">上移</el-button>
+                      <el-button @click.stop="handleDown(node,data)" type="text">下移</el-button>
+                    </template>
+                    <el-button type="text" class="remBtn" v-if="data.auth_id != 0" @click.stop="handleRemove(node, data)">删除</el-button>
                   </span>
                 </div>
               </span>
@@ -128,7 +128,8 @@ export default {
       authNum: null,
       authDataArr: [],
       authTable: false,
-      treeDatas: []
+      treeDatas: [],
+      expandedKeys: []
     }
   },
   watch: {
@@ -156,9 +157,15 @@ export default {
     },
     //获取tree数据
     async setTreeData () {
+      const keys = []
       const result = await this.getQuery(this.queryId)
       const treeMenu = setTree(result, 'up_auth_id', 'auth_id')
-      const newTreeMenu = treeMenu.sort((a, b) => a.show_index - b.show_index)
+      const newTreeMenu = treeMenu && treeMenu.length ? treeMenu.sort((a, b) => a.show_index - b.show_index) : treeMenu
+      newTreeMenu.forEach(item => {
+        keys.push(item.auth_id)
+        item.children = item.children && item.children.length ? item.children.sort((a, b) => a.show_index - b.show_index) : item.children
+      })
+      this.expandedKeys = keys
       this.treeDatas = _.cloneDeep(newTreeMenu)
       this.authDataArr = result.filter(item => item.auth_type != 3)
       this.treeData[0].children = newTreeMenu
@@ -171,6 +178,9 @@ export default {
     },
     //树点击
     handleNodeClick (data) {
+      if (data.auth_id == 0 && data.up_auth_id == -1) {
+        return
+      }
       this.dataType = 'edit'
       const newObj = _.cloneDeep(data)
       this.treeCheckId = data.auth_id
@@ -192,19 +202,15 @@ export default {
     },
     //树上移
     async handleUp (node, data) {
-      const { auth_type, auth_id } = data
+      const { auth_type, auth_id, up_auth_id } = data
       const mulu = this.treeDatas
-      const nums = []
-      const numsObj = { min: null, max: null }
       if (auth_type == 1) {
+        const nums = []
+        const numsObj = { min: null, max: null }
         if (mulu && mulu.length) {
           mulu.forEach((item, index) => {
-            if (!item.show_index) {
-              item.show_index = index
-              nums.push(index)
-            } else {
-              nums.push(item.show_index)
-            }
+            item.show_index = index
+            nums.push(index)
           })
         }
         numsObj.min = Math.min(...nums)
@@ -229,14 +235,106 @@ export default {
           }
         }
       } else {
-        console.log(mulu)
+        const caidan = mulu.filter(item => item.auth_id == up_auth_id)
+        const caidanArr = caidan[0].children
+        const caidanNums = []
+        if (caidanArr && caidanArr.length) {
+          caidanArr.forEach((item, index) => {
+            item.show_index = index
+            caidanNums.push(index)
+          })
+        }
+        const min = Math.min(...caidanNums)
+        const list = caidanArr.filter(item => item.auth_id == auth_id)
+        const listObj = list[0]
+        const listIndex = listObj.show_index
+        if (listIndex == min) {
+          this.$message.error('当前已是最上级，无法移动')
+        } else {
+          const lastObj = caidanArr[listIndex - 1] //上一级数据
+          caidanArr[listIndex - 1] = listObj
+          caidanArr[listIndex - 1].show_index = listIndex - 1
+          caidanArr[listIndex] = lastObj
+          caidanArr[listIndex].show_index = listIndex
+          const code = await this.getChangeList(this.queryId, caidanArr, 2, 'auth_id')
+          if (code) {
+            this.$message.success('操作成功')
+            this.setTreeData()
+          } else {
+            this.$message.success('操作失败')
+          }
+        }
       }
     },
     //树下移
-    handleDown (node, data) { },
+    async handleDown (node, data) {
+      const { auth_type, auth_id, up_auth_id } = data
+      const mulu = this.treeDatas
+      if (auth_type == 1) {
+        const nums = []
+        const numsObj = { min: null, max: null }
+        if (mulu && mulu.length) {
+          mulu.forEach((item, index) => {
+            item.show_index = index
+            nums.push(index)
+          })
+        }
+        numsObj.min = Math.min(...nums)
+        numsObj.max = Math.max(...nums)
+        const list = mulu.filter(item => item.auth_id == auth_id)
+        const listObj = list[0]
+        const listIndex = listObj.show_index
+        if (listIndex == numsObj.max) {
+          this.$message.error('当前已是最下级，无法移动')
+        } else {
+          const lastObj = mulu[listIndex + 1] //上一级数据
+          mulu[listIndex + 1] = listObj
+          mulu[listIndex + 1].show_index = listIndex + 1
+          mulu[listIndex] = lastObj
+          mulu[listIndex].show_index = listIndex
+          const code = await this.getChangeList(this.queryId, mulu, 2, 'auth_id')
+          if (code) {
+            this.$message.success('操作成功')
+            this.setTreeData()
+          } else {
+            this.$message.success('操作失败')
+          }
+        }
+      } else {
+        const caidan = mulu.filter(item => item.auth_id == up_auth_id)
+        const caidanArr = caidan[0].children
+        const caidanNums = []
+        if (caidanArr && caidanArr.length) {
+          caidanArr.forEach((item, index) => {
+            item.show_index = index
+            caidanNums.push(index)
+          })
+        }
+        const max = Math.max(...caidanNums)
+        const list = caidanArr.filter(item => item.auth_id == auth_id)
+        const listObj = list[0]
+        const listIndex = listObj.show_index
+        if (listIndex == max) {
+          this.$message.error('当前已是最下级，无法移动')
+        } else {
+          const lastObj = caidanArr[listIndex + 1] //上一级数据
+          caidanArr[listIndex + 1] = listObj
+          caidanArr[listIndex + 1].show_index = listIndex + 1
+          caidanArr[listIndex] = lastObj
+          caidanArr[listIndex].show_index = listIndex
+          const code = await this.getChangeList(this.queryId, caidanArr, 2, 'auth_id')
+          if (code) {
+            this.$message.success('操作成功')
+            this.setTreeData()
+          } else {
+            this.$message.success('操作失败')
+          }
+        }
+      }
+    },
     //树删除-确定
     async tableRemove () {
-      const code = await this.generalDataReception(this.queryId, this.rmObj, 3)
+      const code = await this.getChangeList(this.queryId, this.rmObj, 3)
       if (code) {
         this.setTreeData()
         this.rmObj = {}
@@ -265,19 +363,21 @@ export default {
             }
           }
           if (this.dataType == 'add') {
-            const res = await this.generalDataReception(this.queryId, data, 1, true)
-            if (res && res.length) {
-              const { auth_id, Value } = res[0]
-              Value.auth_id = auth_id
-              this.authObj = Value
-            }
+            code = await this.getChangeList(this.queryId, data, 1)
+            // if (res && res.length) {
+            //   const { auth_id, Value } = res[0]
+            //   Value.auth_id = auth_id
+            //   this.authObj = Value
+            // }
           } else {
-            code = await this.generalDataReception(this.queryId, data, 2)
+            code = await this.getChangeList(this.queryId, data, 2)
+          }
+          if (code) {
+            this.$message.success('操作成功')
+            this.setTreeData()
+          } else {
+            this.$message.error('操作失败')
           }
-          // if (this.dataType == 'add') {
-          //   this.clearForm()
-          // }
-          this.setTreeData()
         } else {
           return false
         }
@@ -335,7 +435,9 @@ export default {
           padding-right: 8px;
           .customBtn {
             color: #dd3838;
-            margin-left: 10px;
+            .remBtn {
+              color: #dd3838;
+            }
           }
         }
       }