用户管理列表 添加按角色搜索

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

@@ -16,10 +16,17 @@
         <!--用户数据-->
         <pane size="84">
           <el-col>
-            <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
+            <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="70px">
               <el-form-item label="用户名称" prop="userName">
                 <el-input v-model="queryParams.userName" placeholder="请输入用户名称" clearable style="width: 240px" @keyup.enter.native="handleQuery" />
               </el-form-item>
+              <el-form-item label="角色" prop="roleId">
+                <el-select v-model="queryParams.roleId" placeholder="请选择角色">
+                  <el-option v-for="item in roleOptions" :key="item.roleId" :label="item.roleName"
+                             :value="item.roleId" :disabled="item.status == 1"></el-option>
+                </el-select>
+              </el-form-item>
+
               <el-form-item label="手机号码" prop="phonenumber">
                 <el-input v-model="queryParams.phonenumber" placeholder="请输入手机号码" clearable style="width: 240px" @keyup.enter.native="handleQuery" />
               </el-form-item>
@@ -287,6 +294,7 @@ export default {
         userName: undefined,
         phonenumber: undefined,
         status: undefined,
+        roleId: undefined,
         deptId: undefined
       },
       // 列信息
@@ -344,6 +352,7 @@ export default {
 
     this.getList()
     this.getDeptTree()
+    this.getRolels()
     this.getConfigKey("sys.user.initPassword").then(response => {
       this.initPassword = response.msg
     })
@@ -565,6 +574,11 @@ export default {
     // 提交上传文件
     submitFileForm() {
       this.$refs.upload.submit()
+    },
+    getRolels(){
+      getUser().then(response => {
+        this.roleOptions = response.roles
+      })
     }
   }
 }