From f1cb71044cc60353f1c8971c3ff7b72aa2f80230 Mon Sep 17 00:00:00 2001
From: xing <fthvgb1@163.com>
Date: Thu, 18 Jun 2020 11:11:35 +0800
Subject: [PATCH] =?UTF-8?q?=E5=88=97=E8=A1=A8=E6=95=B0=E6=8D=AE=EF=BC=8C?=
 =?UTF-8?q?=E5=8D=95=E5=88=97=E8=87=AA=E5=AE=9A=E4=B9=89=E6=98=BE=E7=A4=BA?=
 =?UTF-8?q?=E5=86=85=E5=AE=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/assets/css/globel.css      |  5 +++
 src/components/users/users.vue | 56 +++++++++++++++++++++++++++++++++-
 2 files changed, 60 insertions(+), 1 deletion(-)

diff --git a/src/assets/css/globel.css b/src/assets/css/globel.css
index bae904e..1587906 100644
--- a/src/assets/css/globel.css
+++ b/src/assets/css/globel.css
@@ -10,4 +10,9 @@ html,body,#app{
 
 .el-card {
     box-shadow: 0 1px 1px rgba(0,0,0, .15) !important;
+}
+
+.el-table {
+    margin-top: 15px;
+    font-size: 15px;
 }
\ No newline at end of file
diff --git a/src/components/users/users.vue b/src/components/users/users.vue
index 57d5ebc..2a28cfc 100644
--- a/src/components/users/users.vue
+++ b/src/components/users/users.vue
@@ -18,14 +18,68 @@
           <el-button type="primary">添加用户</el-button>
         </el-col>
       </el-row>
+
+      <!--列表table-->
+      <el-table border stripe :data="userList" style="width: 100%">
+        <el-table-column label="#" type="index"></el-table-column>
+        <el-table-column prop="username" label="姓名" width="180"></el-table-column>
+        <el-table-column prop="email" label="邮箱" width="180"></el-table-column>
+        <el-table-column prop="mobile" label="电话" width="100"></el-table-column>
+        <el-table-column prop="role_name" label="角色" width="100"></el-table-column>
+        <el-table-column  width="100" label="状态" >
+          <template slot-scope="scope">
+            <el-switch
+              v-model="scope.row.mg_state" @change="changeState">
+            </el-switch>
+          </template>
+        </el-table-column>
+        <el-table-column  label="操作" >
+          <template >
+            <el-button size="mini" type="primary" icon="el-icon-edit"></el-button>
+            <el-button size="mini" type="danger" icon="el-icon-delete"></el-button>
+            <el-tooltip effect="dark" content="分配角色" placement="top" :enterable="false">
+              <el-button  size="mini" type="warning" icon="el-icon-setting"></el-button>
+            </el-tooltip>
+          </template>
+        </el-table-column>
+      </el-table>
     </el-card>
+
   </div>
 
 </template>
 
 <script>
 export default {
-  name: 'users'
+  data () {
+    return {
+      queryInfo: {
+        query: '',
+        pagenum: 1,
+        pagesize: 10
+      },
+      userList: [],
+      total: 0
+    }
+  },
+  methods: {
+    changeState (state) {
+      console.log(state)
+    },
+    async getUserList () {
+      const { data: res } = await this.$http.get('users', {
+        params: this.queryInfo
+      })
+      if (res.meta.status !== 200) {
+        return this.$message.error(res.meta.msg)
+      }
+      this.userList = res.data.users
+      this.total = res.data.total
+    }
+  },
+  created () {
+    this.getUserList()
+  }
 }
 </script>
 <style lang="less" scoped></style>