From afa92f097732a5881fabfc3641bffc17f1038493 Mon Sep 17 00:00:00 2001
From: callmeyan <yaclty2@gamil.com>
Date: Sat, 22 Jun 2019 22:04:08 +0800
Subject: [PATCH] todo user index

---
 src/pages/user/Index.vue | 94 ++++++++++++++++++++++++++--------------
 src/service/api.js       |  3 ++
 2 files changed, 65 insertions(+), 32 deletions(-)

diff --git a/src/pages/user/Index.vue b/src/pages/user/Index.vue
index c445127..dd8e382 100644
--- a/src/pages/user/Index.vue
+++ b/src/pages/user/Index.vue
@@ -3,23 +3,23 @@
         <div class="search-bar">
             <el-form :inline="true" :model="searchModel" class="demo-form-inline">
                 <el-form-item>
-                    <el-select v-model="searchModel.first_to_tibet" placeholder="活动区域">
-                        <el-option label="是否第一次进藏" value=""></el-option>
-                        <el-option label="第一次进藏" value="1"></el-option>
+                    <el-select v-model="searchModel.is_first" placeholder="活动区域">
+                        <el-option label="是否首次进藏" value="-1"></el-option>
+                        <el-option label="首次进藏" value="1"></el-option>
                         <el-option label="多次进藏" value="0"></el-option>
                     </el-select>
                 </el-form-item>
                 <el-form-item>
-                    <el-select class="select-sex" v-model="searchModel.first_to_tibet">
-                        <el-option label="性别" value=""></el-option>
+                    <el-select class="select-sex" v-model="searchModel.gender">
+                        <el-option label="性别" value="-1"></el-option>
                         <el-option label="男" value="1"></el-option>
                         <el-option label="女" value="0"></el-option>
                     </el-select>
                 </el-form-item>
                 <el-form-item>
                     <el-select v-model="searchModel.province" @change="handleProvinceChange">
-                        <el-option label="省份" value=""></el-option>
-                        <el-option v-for="c in provinces" :key="c.code" :label="c.name" :value="c.code"></el-option>
+                        <el-option value="-1" label="省份"></el-option>
+                        <el-option v-for="c in provinces" :key="c.code" :value="c.code" :label="c.name"></el-option>
                     </el-select>
                 </el-form-item>
                 <el-form-item>
@@ -27,13 +27,11 @@
                         <template v-if="cities.length > 0">
                             <el-option v-for="c in cities" :key="c.code" :label="c.name" :value="c.code"></el-option>
                         </template>
-                        <el-option v-else label="城市" value=""></el-option>
-
-
+                        <el-option v-else label="城市" value="-1"></el-option>
                     </el-select>
                 </el-form-item>
                 <el-form-item>
-                    <el-input v-model="searchModel.name" placeholder="姓名/微信号"></el-input>
+                    <el-input v-model="searchModel.name" placeholder="姓名/openid"></el-input>
                 </el-form-item>
                 <el-form-item>
                     <el-button type="info" @click="onSearch">查询</el-button>
@@ -42,15 +40,15 @@
         </div>
         <div class="data-list">
             <el-table :data="userList" class="table-border">
-                <el-table-column label="微信" width="230">
+                <el-table-column label="微信" width="300">
                     <template slot-scope="scope">
                         <div class="user-head-name">
                             <div class="img">
-                                <img src="../../assets/imgs/avatar.jpg" alt="">
+                                <img :src="scope.row.avatar" alt="">
                             </div>
-                            <div class="info">
-                                <p>昵称:{{ scope.row.nickname }}</p>
-                                <p>OpenId:{{ scope.row.open_id }}</p>
+                            <div class="info" style="width: 200px;overflow: hidden">
+                                <p class="nickname">昵称:{{ scope.row.nickname }}</p>
+                                <p class="open-id">OpenId:{{ scope.row.open_id }}</p>
                             </div>
                         </div>
                     </template>
@@ -68,16 +66,21 @@
                 </el-table-column>
                 <el-table-column prop="address" label="久居城市"/>
                 <el-table-column prop="smoke" label="抽烟量"/>
-                <el-table-column prop="drink" label="饮酒量"/>
-                <el-table-column label="首次进藏">
-                    <template slot-scope="scope">{{scope.row.is_first_to_tibet | firstToTibet}}</template>
+                <el-table-column label="长期饮酒">
+                    <template slot-scope="scope">{{scope.row.drink | formatYesNo}}</template>
+                </el-table-column>
+                <el-table-column label="首次进藏">
+                    <template slot-scope="scope">{{scope.row.is_first_to_tibet | formatYesNo}}</template>
+                </el-table-column>
+                <el-table-column width="320" label="既往病史">
+                    <template slot-scope="scope">{{scope.row.medical_history | formatMedical}}</template>
                 </el-table-column>
-                <el-table-column width="320" prop="medical_history_data" label="既往病史"/>
             </el-table>
         </div>
         <div class="data-page text-right">
             <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
-                           :current-page="currentPage" :page-sizes="[20, 50, 100, 200]" :page-size="20"
+                           :current-page="searchModel.page" :page-sizes="[20, 50, 100, 200]"
+                           :page-size="searchModel.pageSize"
                            layout="total, prev, pager, next,sizes, jumper" :total="totalCount">
             </el-pagination>
         </div>
@@ -94,13 +97,14 @@
         height: 176,
         weight: 106,
         address: '北京',
-        smoke: '北京',
-        drink: '北京',
+        smoke: '不抽烟',
+        drink: '是',
         is_first_to_tibet: 1,
         medical_history: 1,
         medical_history_data: '反流性食道炎、、结肠炎',
     }
     import cities from '../../utils/distpicker';
+    import {userSearch} from './../../service/api';
 
     export default {
         name: "Index",
@@ -109,17 +113,24 @@
                 provinces: cities,
                 cities: [],
                 searchModel: {
-                    first_to_tibet: '',
-                    province: '',
-                    city: ''
+                    is_first: '-1',
+                    province: '-1',
+                    city: '-1',
+                    gender: '-1',
+                    page: 1,
+                    pageSize: 20,
+                    name: ''
                 },
-                userList: Array(5).fill(userObj),
-                currentPage: 1,
+                userList: [],
                 totalCount: 401
             }
         },
         filters: {
-            firstToTibet(v) {
+            formatMedical(v) {
+                if (!!v && Array.isArray(v)) return v.join('、');
+                return '无';
+            },
+            formatYesNo(v) {
                 return v == 1 ? "是" : "否";
             },
             formatGender(v) {
@@ -132,6 +143,9 @@
                 return v + 'kg';
             }
         },
+        mounted() {
+            this.onSearch();
+        },
         methods: {
             handleProvinceChange(provinceId) {
                 for (var i = 0; i < cities.length; i++) {
@@ -141,8 +155,10 @@
                     }
                 }
             },
-            onSearch() {
-
+            async onSearch() {
+                let data = await userSearch(this.searchModel);
+                this.userList = data.list;
+                this.totalCount = data.totalCount;
             },
             handleSizeChange() {
 
@@ -178,13 +194,27 @@
             border-radius: 50%;
         }
         .info {
-            float: left;
             vertical-align: middle;
             padding-left: 10px;
+            position: relative;
+            height: 80px;
+            padding-top: 10px;
+            margin-left: 80px;
             p {
                 height: 30px;
                 line-height: 30px;
             }
+            .open-id {
+                position: absolute;
+                top: 40px;
+                left: 10px;
+                overflow: hidden;
+            }
+        }
+        &:hover {
+            .open-id {
+                overflow: visible;
+            }
         }
     }
 </style>
\ No newline at end of file
diff --git a/src/service/api.js b/src/service/api.js
index 9255e46..38e2c28 100644
--- a/src/service/api.js
+++ b/src/service/api.js
@@ -17,6 +17,9 @@ export async function adminLogin(params = {}) {
 export async function evaluationSearch(params = {}) {
     return get(`/admin/searchEvaluation?${stringify(params)}`);
 }
+export async function userSearch(params = {}) {
+    return get(`/admin/searchUser?${stringify(params)}`);
+}
 
 export async function queryNews(params = {}) {
     return get(`/news/index?${stringify(params)}`);