与mock连接

main/manager-web/src/apis/api.js

@@ -1,6 +1,6 @@
 // 引入各个模块的请求
 import user from './module/user.js'
-
+import admin from './module/admin.js'
 /**
  * 接口地址
  * 当前8002端口接口还没开发完成，暂时用 apifoxmock 接口代替

main/manager-web/src/apis/module/admin.js

@@ -0,0 +1,20 @@
+import RequestService from '../httpRequest'
+import {getServiceUrl} from '../api'
+
+
+export default {
+    // 用户列表
+    getUserList(callback) {
+        RequestService.sendRequest().url(`${getServiceUrl()}/api/v1/admin/users`)
+            .method('GET')
+            .success((res) => {
+                RequestService.clearRequestTime()
+                callback(res)
+            })
+            .fail(() => {
+                RequestService.reAjaxFun(() => {
+                    this.getList()
+                })
+            }).send()
+    },
+}

main/manager-web/src/views/UserManagement.vue

@@ -24,9 +24,9 @@
             type="selection"
             width="55">
             </el-table-column>
-          <el-table-column label="用户Id" prop="userId"></el-table-column>
-          <el-table-column label="手机号码" prop="phone"></el-table-column>
-          <el-table-column label="设备数量" prop="deviceCount"></el-table-column>
+          <el-table-column label="用户Id" prop="user_id"></el-table-column>
+          <el-table-column label="手机号码" prop="mobile"></el-table-column>
+          <el-table-column label="设备数量" prop="device_count"></el-table-column>
           <el-table-column label="状态" prop="status"></el-table-column>
           <el-table-column label="操作">
             <template slot-scope="scope">
@@ -72,6 +72,9 @@
 
 <script>
 import HeaderBar from "@/components/HeaderBar.vue";
+import Api from '@/apis/api';
+import adminApi from '@/apis/module/admin';
+
 
 export default {
   components: { HeaderBar },
@@ -89,6 +92,13 @@ export default {
       total: 20
     };
   },
+  created() {
+    adminApi.getUserList(({data}) => {
+      //mock偶尔会返回-1导致出错，又会返回两个list，所以这里只取第一个
+      this.userList = data.data[0].list;
+      console.log('用户列表：', this.userList);
+    })
+  },
   methods: {
     handleSearch() {
       // 模拟搜索逻辑