Added search in UserManagement.

ui/src/pages/info/StaffManagement.vue

@@ -314,6 +314,7 @@ export default {
             this.searchInput = _.cloneDeep(this.inputInput)
             this.searchGender = _.cloneDeep(this.selectedGender)
             this.searchBirth = _.cloneDeep(this.selectedBirth)
+            this.currentPage = 1
             this.loadStaffTable()
         },
         handleClear() {
@@ -321,7 +322,6 @@ export default {
             this.inputInput = ''
             this.selectedGender = -1
             this.selectedBirth = []
-            this.currentPage = 1
             this.handleQuery()
         }
     },

ui/src/pages/power/GroupManagement.vue

@@ -368,6 +368,7 @@ export default {
             this.searchName = this.inputName
             this.searchRole = this.selectedRole
             this.searchEnable = this.selectedEnable
+            this.currentPage = 1
             this.loadGroupTable()
         },
         handleClear() {

ui/src/pages/power/RoleManagement.vue

@@ -432,13 +432,13 @@ export default {
             this.searchName = _.cloneDeep(this.inputName)
             this.searchPower = _.cloneDeep(this.selectedPower)
             this.searchEnable = _.cloneDeep(this.selectedEnable)
+            this.currentPage = 1
             this.loadRoleTable()
         },
         handleClear() {
             this.inputName = ''
             this.selectedPower = []
             this.selectedEnable = -1
-            this.currentPage = 1
             this.handleQuery()
         }
     },

ui/src/pages/power/UserManagement.vue

@@ -1,19 +1,89 @@
 <template>
-    <el-button bg style="background-color: white" :loading="tableLoading" @click="loadUserTable">
-        <template #icon>
-            <el-icon>
-                <icon-pinnacle-refresh />
-            </el-icon>
-        </template>
-    </el-button>
-    <el-button type="primary" @click="handleAddBtn">
-        <template #icon>
-            <el-icon>
-                <icon-pinnacle-plus />
-            </el-icon>
-        </template>
-        <template #default> 添加 </template>
-    </el-button>
+    <el-row :gutter="5">
+        <el-col :span="-1">
+            <el-button
+                bg
+                style="background-color: white"
+                :loading="tableLoading"
+                @click="loadUserTable"
+            >
+                <template #icon>
+                    <el-icon>
+                        <icon-pinnacle-refresh />
+                    </el-icon>
+                </template>
+            </el-button>
+        </el-col>
+        <el-col :span="-1">
+            <el-button type="primary" @click="handleAddBtn">
+                <template #icon>
+                    <el-icon>
+                        <icon-pinnacle-plus />
+                    </el-icon>
+                </template>
+            </el-button>
+        </el-col>
+        <el-col :span="4">
+            <el-form-item label="名称" class="fill-with">
+                <el-input
+                    v-model="inputName"
+                    maxlength="20"
+                    show-word-limit
+                    placeholder="请输入内容"
+                    @keyup.enter="handleQuery"
+                />
+            </el-form-item>
+        </el-col>
+        <el-col :span="5">
+            <el-select
+                v-model="selectedRole"
+                class="fill-with"
+                clearable
+                collapse-tags
+                collapse-tags-tooltip
+                multiple
+                filterable
+            >
+                <el-option
+                    v-for="item in roleOptions"
+                    :key="item.id"
+                    :value="item.id"
+                    :label="item.name"
+                />
+            </el-select>
+        </el-col>
+        <el-col :span="5">
+            <el-select
+                v-model="selectedGroup"
+                class="fill-with"
+                clearable
+                collapse-tags
+                collapse-tags-tooltip
+                multiple
+                filterable
+            >
+                <el-option
+                    v-for="item in groupOptions"
+                    :key="item.id"
+                    :value="item.id"
+                    :label="item.name"
+                />
+            </el-select>
+        </el-col>
+        <el-col :span="3">
+            <el-form-item label="状态" class="fill-with">
+                <el-select v-model="selectedEnable" class="fill-with">
+                    <el-option label="全部" :value="-1" />
+                    <el-option label="启用" :value="1" />
+                    <el-option label="禁用" :value="0" />
+                </el-select>
+            </el-form-item>
+        </el-col>
+        <el-col :span="-1">
+            <el-button type="primary" @click="handleQuery">查询</el-button>
+            <el-button @click="handleClear">清空</el-button>
+        </el-col>
+    </el-row>
     <common-table
         :table-date="userTable"
         :table-loading="tableLoading"
@@ -114,8 +184,8 @@
         </template>
         <template #footer>
             <el-button type="primary" @click="handleSubmit" :disabled="dialogLoading"
-                >提交</el-button
-            >
+                >提交
+            </el-button>
             <el-button @click="handleCancel" :disabled="dialogLoading">取消</el-button>
         </template>
     </el-dialog>
@@ -145,6 +215,16 @@ export default {
             dialogVisible: false,
             tableLoading: true,
             dialogLoading: true,
+            roleOptions: [],
+            groupOptions: [],
+            searchName: '',
+            searchRole: [],
+            searchGroup: [],
+            searchEnable: -1,
+            inputName: '',
+            selectedRole: [],
+            selectedGroup: [],
+            selectedEnable: -1,
             currentPage: 1,
             pageSize: 50,
             totalCount: 0,
@@ -191,7 +271,14 @@ export default {
         loadUserTable() {
             this.tableLoading = true
             request
-                .get('/user', { currentPage: this.currentPage, pageSize: this.pageSize })
+                .get('/user', {
+                    currentPage: this.currentPage,
+                    pageSize: this.pageSize,
+                    searchName: this.searchName,
+                    searchRole: this.searchRole + '',
+                    searchGroup: this.searchGroup + '',
+                    searchEnable: this.searchEnable
+                })
                 .then((res) => {
                     const response = res.data
                     if (response.code === DATABASE_SELECT_OK) {
@@ -229,6 +316,7 @@ export default {
             request.get('/role/list').then((res) => {
                 const response = res.data
                 if (response.code === DATABASE_SELECT_OK) {
+                    this.roleOptions = response.data
                     this.roles = response.data
                     this.getGroups()
                 } else {
@@ -243,6 +331,7 @@ export default {
             request.get('/group/list').then((res) => {
                 const response = res.data
                 if (response.code === DATABASE_SELECT_OK) {
+                    this.groupOptions = response.data
                     this.groups = response.data
                     this.dialogLoading = false
                 } else {
@@ -402,10 +491,26 @@ export default {
         handleCurrentChange(currentPage) {
             this.currentPage = currentPage
             this.loadUserTable()
+        },
+        handleQuery() {
+            this.searchName = this.inputName
+            this.searchRole = this.selectedRole
+            this.searchGroup = this.selectedGroup
+            this.searchEnable = this.selectedEnable
+            this.currentPage = 1
+            this.loadUserTable()
+        },
+        handleClear() {
+            this.inputName = ''
+            this.selectedRole = []
+            this.selectedGroup = []
+            this.selectedEnable = -1
+            this.handleQuery()
         }
     },
     mounted() {
         this.loadUserTable()
+        this.getRoles()
     }
 }
 </script>