用户列表页面添加查询条件

src/api/admin.js

@@ -19,7 +19,7 @@ export function updateSiteNotice(data) {
 
 // 获取用户列表
 export function getUserList(page) {
-  return get(adminApi.userListApi + '?page=' + page)
+  return get(adminApi.userListApi, page)
 }
 
 // 获取稿件列表

src/views/admin/UserList.vue

@@ -1,6 +1,20 @@
 <template>
   <el-row>
     <el-row>
+      <el-form :inline="true" :model="searchForm" class="demo-form-inline">
+        <el-form-item>
+          <el-select v-model="searchForm.type" placeholder="查询类型">
+            <el-option label="用户名" value="1" />
+            <el-option label="用户 ID" value="2" />
+          </el-select>
+        </el-form-item>
+        <el-form-item>
+          <el-input v-model="searchForm.content" placeholder="" />
+        </el-form-item>
+        <el-form-item>
+          <el-button size="mini" type="warning" @click="search">查询</el-button>
+        </el-form-item>
+      </el-form>
       <el-table
         :data="dataList"
         border
@@ -158,23 +172,28 @@ export default {
         videoId: null,
         scope: '1'
       },
-      videoResources: []
+      searchForm: {
+        page: 1,
+        type: '1',
+        content: null
+      }
     }
   },
   created() {
     document.title = '用户列表'
-    this.getData()
+    this.getData(this.searchForm)
   },
   methods: {
     handleCurrentChange(pageNumber) {
       this.currentPage = pageNumber
-      this.getData()
+      this.searchForm.page = this.currentPage
+      this.getData(this.searchForm)
       // 回到顶部
       scrollTo(0, 0)
     },
-    getData() {
+    getData(searchForm) {
       this.dataList = []
-      getUserList(this.currentPage).then(resp => {
+      getUserList(searchForm).then(resp => {
         if (resp.code === 0) {
           this.dataList = resp.data.list
           this.totalSize = resp.data.totalSize
@@ -210,6 +229,11 @@ export default {
         type: 'warning',
         duration: 3000
       })
+    },
+    search() {
+      this.currentPage = 1
+      this.searchForm.page = this.currentPage
+      this.getData(this.searchForm)
     }
   }
 }