提交

ruoyi-ui/src/views/system/permissions/index.vue

@@ -21,7 +21,7 @@
           </div>
         </div>
         <div class="searList">
-          <div class="searItem" v-for="item in roleList" :key="item.roleName" :class="{'active': false}" @click="jieese(item.id)">
+          <div class="searItem" v-for="(item,index) in roleList" :key="item.roleName" :class="[indexdw == index? 'active' : '']" @click="jieese(item.id,index)">
             {{item.roleName}}
           </div>
         </div>
@@ -45,10 +45,10 @@
             </el-row>
           </el-col>
           </el-row>
-        <div class="roleContrBox">
+        <div class="roleContrBox roleContrBoxthy">
           <el-col :span="24">
             <div class="searContLeft">
-              <el-table v-loading="loading" :data="cloumns" @selection-change="handleSelectionChange">
+              <el-table v-loading="loading" :data="cloumns" @selection-change="handleSelectionChange" :max-height="tableHeight">
                 <el-table-column type="selection" width="55" align="center" />
                 <el-table-column label="序号" align="center"  prop="id" />
                 <el-table-column label="用户角色" align="center" prop="roleName" />
@@ -66,9 +66,18 @@
               </el-table>
             </div>
           </el-col>
+        <pagination
+           v-show="total>0"
+           :total="total"
+           :page.sync="queryParamstr.pageNum"
+           :limit.sync="queryParamstr.pageSize"
+           @pagination="getDeptTreeselect"
+         />
         </div>
+
       </el-col>
     </el-row>
+
     <!-- 添加或修改对话框 -->
     <el-dialog :close-on-click-modal="false" :title="title" :visible.sync="open" width="600px" append-to-body>
       <el-form ref="form" :model="form" :rules="rules" label-width="120px">
@@ -149,6 +158,8 @@
           status: undefined
         },
         queryParamstr:{
+          pageNum: 1,
+          pageSize: 10,
           roleId: undefined,
         },
         // 表单参数
@@ -175,7 +186,8 @@
         relationType: [],
         // 表格的高度
         tableHeight: document.documentElement.scrollHeight - 245 + "px",
-        ijeudid:-1
+        ijeudid:-1,
+        indexdw:-1
       };
     },
 
@@ -220,7 +232,7 @@
               this.roleList.push({roleName:'暂无数据'})
             }
 
-            this.total = response.total;
+            // this.total = response.total;
             this.loading = false;
           }
         );
@@ -236,6 +248,7 @@
         listPostporen(this.queryParamstr).then(response => {
           console.log(response.rows)
           this.cloumns = response.rows;
+          this.total = response.total
           // this.cloumns.
           this.cloumns.filter(route => {
             console.log(route)
@@ -440,7 +453,10 @@
        this.getDeptTreeselect()
       },
       // 点击角色id
-      jieese(id){
+      jieese(id,index){
+        console.log(id)
+        console.log(index)
+        this.indexdw = index
         this.ijeudid = id
         this.queryParamstr.roleId = id
         this.getDeptTreeselect()
@@ -449,6 +465,18 @@
     }
   };
 </script>
+<style lang="scss">
+  .roleContrBoxthy{
+    position: relative;
+    .pagination-container{
+      // position: fixed;
+      position: absolute;
+      bottom: 10px;
+      right: 20px;
+      margin-top: 87px;
+    }
+  }
+</style>
 <style lang="scss" scoped>
   .roleContrBox {
     background-color: #fff;