update views/my

src/router/my.js

@@ -5,7 +5,7 @@ const MyProfile = () => import('views/my/MyProfile')
 const MyContact = () => import('views/my/MyContact')
 const MyRealname = () => import('views/my/MyRealname')
 const MyOAuth = () => import('views/my/MyOAuth')
-const MessageIndex = () => import('views/my/Message')
+const MyMessage = () => import('views/my/MyMessage')
 const MyVip = () => import('views/my/MyVip')
 const MyWallet = () => import('views/my/MyWallet')
 
@@ -48,7 +48,7 @@ export default {
     {
       path: '/my/message',
       name: '我的消息',
-      component: MessageIndex,
+      component: MyMessage,
       meta: { needAuth: true }
     },
     {

src/views/my/FavlistImage.vue

@@ -1,244 +0,0 @@
-<template>
-  <div id="collection-list">
-    <!--搜索结果面包屑-->
-    <el-breadcrumb
-      class="bread"
-      separator-class="el-icon-arrow-right"
-    >
-      <el-breadcrumb-item>我的收藏：共 <span class="reslut">{{ totalSize }}</span> 条</el-breadcrumb-item>
-    </el-breadcrumb>
-
-    <el-row v-if="totalSize !== 0" class="movie-list">
-      <el-col style="text-align: right">
-        <el-button
-          type="danger"
-          size="mini"
-          icon="el-icon-delete"
-          @click="removeFavlist"
-        >删除收藏夹</el-button>
-      </el-col>
-      <el-col v-for="(item,index) in dataList" :key="index" :md="6" :sm="8" :xs="12">
-        <div>
-          <el-card :body-style="{ padding: '0px' }" class="card">
-            <div class="imgs">
-              <el-image
-                lazy
-                fit="cover"
-                class="coverImg"
-                :src="item.thumbnailUrl"
-                @click="showImages(index)"
-              />
-            </div>
-          </el-card>
-        </div>
-        <el-button
-          type="danger"
-          size="mini"
-          icon="el-icon-delete"
-          title="删除本收藏"
-          @click.stop="removeCollection(item)"
-        />
-      </el-col>
-      <el-col class="pagination">
-        <el-pagination
-          background
-          :small="screenWidth <= 768"
-          hide-on-single-page
-          layout="prev, pager, next"
-          :page-size="pageSize"
-          :current-page="currentPage"
-          :total="totalSize"
-          @current-change="handleCurrentChange"
-          @prev-click="handleCurrentChange"
-          @next-click="handleCurrentChange"
-        />
-      </el-col>
-    </el-row>
-    <el-row v-else class="not-result">
-      <el-col :span="12" :offset="6">
-        <img src="@/assets/img/icon/not-collection.png">
-        <div>你还没有收藏任何东西呢</div>
-      </el-col>
-    </el-row>
-  </div>
-</template>
-
-<script>
-import {
-  deleteFavlist,
-  getFavlist,
-  collectItem
-} from '@/api/collect'
-
-export default {
-  name: 'FavlistImage',
-  data() {
-    return {
-      // 屏幕宽度, 为了控制分页条的大小
-      screenWidth: document.body.clientWidth,
-      currentPage: 1,
-      pageSize: 12,
-      totalSize: 0,
-      dataList: [],
-      favlistId: 1,
-      contentType: 1001
-    }
-  },
-  created() {
-    this.getFavlistWrapper(this.favlistId, this.contentType, this.currentPage)
-    document.title = '图片收藏夹'
-  },
-  methods: {
-    handleCurrentChange(pageNumber) {
-      this.currentPage = pageNumber
-      this.dataList = []
-      this.getFavlistWrapper(this.favlistId, this.contentType, this.currentPage)
-      // 回到顶部
-      scrollTo(0, 0)
-    },
-    getFavlistWrapper(favlistId, conentType, page) {
-      getFavlist(favlistId, conentType, page).then(resp => {
-        if (resp.code === 0) {
-          const respData = resp.data
-          this.dataList = respData.list
-          this.totalSize = respData.totalSize
-        }
-      })
-    },
-    showImages(index) {
-      const imageUrls = []
-      for (const i of this.dataList) {
-        imageUrls.push(i.originalUrl)
-      }
-
-      this.$viewerApi({
-        images: imageUrls,
-        options: {
-          initialViewIndex: index,
-          movable: true,
-          fullscreen: false,
-          keyboard: true
-        }
-      })
-    },
-    // 移除收藏
-    removeCollection(item) {
-      this.$confirm('确认删除本收藏？', '提示', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning'
-      }).then(() => {
-        const jsonData = {}
-        jsonData.contentType = 1001
-        jsonData.contentId = item.imageFileId
-        jsonData.collected = false
-        collectItem(jsonData).then(res => {
-          if (res.code === 0) {
-            this.$message({
-              type: 'success',
-              message: '移除成功!'
-            })
-            this.$router.go(0)
-          }
-        })
-      }).catch(() => {
-        this.$message({
-          type: 'info',
-          message: '已取消'
-        })
-      })
-    },
-    // 删除收藏夹
-    removeFavlist() {
-      // 移除所有收藏
-      this.$confirm('确认要删除收藏夹？', '提示', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning'
-      }).then(() => {
-        deleteFavlist(this.favlistId).then(res => {
-          if (res.code === 0) {
-            this.$message({
-              type: 'success',
-              message: '收藏夹已清空!'
-            })
-
-            this.$router.go(0)
-          }
-        })
-      }).catch(() => {
-        this.$message({
-          type: 'info',
-          message: '已取消'
-        })
-      })
-    }
-  }
-}
-</script>
-
-<style scoped>
-/*处于手机屏幕时*/
-@media screen and (max-width: 768px){
-  .movie-list {
-    padding-top: 8px;
-    padding-left: 0.5%;
-    padding-right: 0.5%;
-  }
-
-  .coverImg {
-    height: 120px !important;
-  }
-}
-
-.movie-list {
-  padding-top: 15px;
-  padding-left: 6%;
-  padding-right: 6%;
-}
-
-.coverImg {
-  width: 100%;
-  height: 320px;
-  display: block;
-}
-
-.card {
-  margin-bottom: 20px;
-  transition: all 0.6s; /*所有属性变化在0.6秒内执行动画*/
-}
-
-.imgs {
-  position: relative;
-}
-
-#collection-list {
-  padding-left: 6%;
-  padding-right: 6%;
-  padding-top: 30px;
-}
-
-.bread {
-  font-size: 15px;
-}
-
-.movie-list {
-  padding-top: 15px;
-}
-
-.reslut {
-  color: red;
-}
-
-.not-result {
-  padding-top: 100px;
-  padding-bottom: 100px;
-  text-align: center;
-}
-
-.remove-slot {
-  position: absolute;
-  right: 5px;
-  bottom: 2px;
-}
-</style>

src/views/my/FavlistVideo.vue

@@ -1,262 +0,0 @@
-<template>
-  <div id="collection-list">
-    <el-row>
-      <el-col :md="12">
-        <div class="category-btn">
-          <el-button
-            v-for="(item, index) in videoFavlist"
-            :key="index"
-            type="warning"
-            size="mini"
-            :plain="currentFavlistId !== item.favlistId"
-            @click="chooseVideoFavlist(item)"
-          >{{ item.favlistName }}
-          </el-button>
-        </div>
-      </el-col>
-    </el-row>
-
-    <!--搜索结果面包屑-->
-    <el-breadcrumb
-      v-if="currentFavlistName !== null"
-      class="bread"
-      separator-class="el-icon-arrow-right"
-    >
-      <el-breadcrumb-item>
-        <span class="reslut">{{ currentFavlistName }}</span> 中共有 <span class="reslut">{{ totalSize }}</span> 条数据
-      </el-breadcrumb-item>
-    </el-breadcrumb>
-
-    <el-row v-if="totalSize !== 0" class="movie-list">
-      <el-col style="text-align: right">
-        <el-button
-          type="danger"
-          size="mini"
-          icon="el-icon-delete"
-          @click="removeFavlist"
-        >删除收藏夹</el-button>
-      </el-col>
-      <el-col v-for="(item,index) in dataList" :key="index" :md="6" :sm="8" :xs="12">
-        <div>
-          <video-card :video="item" />
-        </div>
-        <el-button
-          type="danger"
-          size="mini"
-          icon="el-icon-delete"
-          title="删除本收藏"
-          @click.stop="removeCollection(item)"
-        />
-      </el-col>
-      <el-col class="pagination">
-        <el-pagination
-          background
-          :small="screenWidth <= 768"
-          hide-on-single-page
-          layout="prev, pager, next"
-          :page-size="pageSize"
-          :current-page="currentPage"
-          :total="totalSize"
-          @current-change="handleCurrentChange"
-          @prev-click="handleCurrentChange"
-          @next-click="handleCurrentChange"
-        />
-      </el-col>
-    </el-row>
-    <el-row v-else class="not-result">
-      <el-col :span="12" :offset="6">
-        <img src="@/assets/img/icon/not-collection.png">
-        <div>你还没有收藏任何东西呢</div>
-      </el-col>
-    </el-row>
-  </div>
-</template>
-
-<script>
-import VideoCard from '@/components/card/VideoCard'
-import {
-  deleteFavlist, collectItem, getUserFavlist, getVideoFavlist
-} from '@/api/collect'
-
-export default {
-  name: 'FavlistVideo',
-  components: { VideoCard },
-  data() {
-    return {
-      // 屏幕宽度, 为了控制分页条的大小
-      screenWidth: document.body.clientWidth,
-      currentPage: 1,
-      pageSize: 12,
-      totalSize: 0,
-      dataList: [],
-      currentFavlistId: 0,
-      currentFavlistName: null,
-      videoFavlist: []
-    }
-  },
-  created() {
-    getUserFavlist().then(resp => {
-      if (resp.code === 0) {
-        this.videoFavlist = resp.data
-      }
-    })
-    document.title = '视频收藏夹'
-  },
-  methods: {
-    handleCurrentChange(pageNumber) {
-      this.currentPage = pageNumber
-      this.dataList = []
-      this.getVideoFavlistWrapper(this.currentFavlistId, this.currentPage)
-      // 回到顶部
-      scrollTo(0, 0)
-    },
-    chooseVideoFavlist(item) {
-      this.currentFavlistId = item.favlistId
-      this.currentFavlistName = item.favlistName
-      this.currentPage = 1
-      this.getVideoFavlistWrapper(this.currentFavlistId, this.currentPage)
-    },
-    getVideoFavlistWrapper(favlistId) {
-      this.currentFavlistId = favlistId
-      getVideoFavlist(favlistId, this.currentPage).then(resp => {
-        if (resp.code === 0) {
-          const respData = resp.data
-          this.dataList = respData.list
-          this.totalSize = respData.totalSize
-        }
-      })
-    },
-    // 移除收藏
-    removeCollection(item) {
-      this.$confirm('确认删除本收藏？', '提示', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning'
-      }).then(() => {
-        const jsonData = {}
-        jsonData.contentType = 1001
-        jsonData.contentId = item.imageFileId
-        jsonData.collected = false
-        collectItem(jsonData).then(res => {
-          if (res.code === 0) {
-            this.$message({
-              type: 'success',
-              message: '移除成功!'
-            })
-            this.$router.go(0)
-          }
-        })
-      }).catch(() => {
-        this.$message({
-          type: 'info',
-          message: '已取消'
-        })
-      })
-    },
-    // 删除收藏夹
-    removeFavlist() {
-      // 移除所有收藏
-      this.$confirm('确认要删除收藏夹？', '提示', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning'
-      }).then(() => {
-        deleteFavlist(this.currentFavlistId).then(res => {
-          if (res.code === 0) {
-            this.$message({
-              type: 'success',
-              message: '收藏夹已清空!'
-            })
-
-            this.$router.go(0)
-          }
-        })
-      }).catch(() => {
-        this.$message({
-          type: 'info',
-          message: '已取消'
-        })
-      })
-    }
-  }
-}
-</script>
-
-<style scoped>
-/*处于手机屏幕时*/
-@media screen and (max-width: 768px){
-  .movie-list {
-    padding-top: 8px;
-    padding-left: 0.5%;
-    padding-right: 0.5%;
-  }
-
-  .coverImg {
-    height: 120px !important;
-  }
-
-  .category-btn {
-    padding-left: 0.5%;
-    padding-right: 0.5%;
-    padding-top: 3%;
-    text-align: center;
-  }
-}
-
-.movie-list {
-  padding-top: 15px;
-  padding-left: 6%;
-  padding-right: 6%;
-}
-
-.coverImg {
-  width: 100%;
-  height: 320px;
-  display: block;
-}
-
-.card {
-  margin-bottom: 20px;
-  transition: all 0.6s; /*所有属性变化在0.6秒内执行动画*/
-}
-
-.imgs {
-  position: relative;
-}
-
-#collection-list {
-  padding-left: 6%;
-  padding-right: 6%;
-  padding-top: 30px;
-}
-
-.bread {
-  font-size: 15px;
-}
-
-.movie-list {
-  padding-top: 15px;
-}
-
-.reslut {
-  color: red;
-}
-
-.not-result {
-  padding-top: 100px;
-  padding-bottom: 100px;
-  text-align: center;
-}
-
-.remove-slot {
-  position: absolute;
-  right: 5px;
-  bottom: 2px;
-}
-
-.category-btn {
-  padding-left: 14%;
-  padding-right: 6%;
-  padding-top: 20px;
-}
-</style>

src/views/my/MyContact.vue

@@ -2,21 +2,15 @@
   <el-row class="movie-list">
     <el-row style="padding-right: 5px; padding-left: 5px; padding-bottom: 5px">
       <el-col :md="12">
-        <el-form :inline="true" :model="searchForm">
-          <el-form-item>
-            <el-badge class="item">
-              <el-input v-model="searchForm.title" placeholder="用户名" />
-            </el-badge>
-          </el-form-item>
-          <el-form-item>
-            <el-badge class="item">
-              <el-button size="mini" type="warning" @click="search">查询</el-button>
-            </el-badge>
-          </el-form-item>
-        </el-form>
         <el-card class="box-card">
           <div slot="header" class="clearfix">
             <span>我的联系人</span>
+            <el-button style="float: right; padding: 3px;" type="text" @click="showAddContactDialog">添加</el-button>
+            <el-badge :value="msgCount" :max="99">
+              <el-button style="float: right; padding: 3px;" type="text" @click="showNewContactDialog">
+                新联系人
+              </el-button>
+            </el-badge>
           </div>
           <div class="text item">
             <el-table
@@ -111,7 +105,7 @@
           <el-col :md="12">
             <el-form-item>
               <el-input
-                v-model="searchUserForm.keyword"
+                v-model="searchUserForm.mobile"
                 placeholder="手机号"
                 style="width: 90%; padding-right: 2px"
                 clearable
@@ -121,7 +115,8 @@
           <el-col :md="12">
             <el-form-item>
               <el-button
-                type="primary"
+                size="mini"
+                type="warning"
                 @click="onSearchUser"
               >查询</el-button>
             </el-form-item>
@@ -158,7 +153,7 @@
                 />
               </el-form-item>
               <el-form-item>
-                <el-button size="mini" type="warning" @click="addContact(userContact.userId)">添加</el-button>
+                <el-button size="mini" type="warning" @click="addContact">添加</el-button>
               </el-form-item>
             </el-form>
           </el-row>
@@ -368,9 +363,7 @@ export default {
         keyword: null
       },
       searchUserForm: {
-        page: 1,
-        type: 1,
-        keyword: null
+        mobile: null
       },
       addContactForm: {
         friendId: null,
@@ -403,7 +396,7 @@ export default {
 
     getApplyContactCount().then(resp => {
       if (resp.code === 0) {
-        this.msgCount = resp.data
+        this.msgCount = resp.data.unreadNum
       }
     })
   },
@@ -499,8 +492,8 @@ export default {
     handleDialogClose1(done) {
       done()
     },
-    addContact(userId) {
-      this.addContactForm.friendId = userId
+    addContact() {
+      this.addContactForm.friendId = this.userContact.id
       addUserContact(this.addContactForm).then(resp => {
         if (resp.code === 0) {
           this.showUserList = true
@@ -528,9 +521,6 @@ export default {
         })
       })
     },
-    search() {
-      console.log('search')
-    },
     approve(row) {
       var payload = {}
       payload.applyId = row.applyId

src/views/my/MyProfile.vue

@@ -12,24 +12,24 @@
                 <el-input v-model="loginUser.userId" style="padding-right: 1px" readonly />
               </el-form-item>
               <el-form-item label="用户名">
-                <el-input v-model="loginUser.username" style="width: 70%; padding-right: 10px" />
-                <el-button size="mini" type="info" @click="updateScreenName">更新</el-button>
+                <el-input v-model="loginUser.username" style="width: 70%; padding-right: 10px" readonly />
+                <el-button size="mini" type="info" @click="showUpdateDialog(1)">更新</el-button>
               </el-form-item>
               <el-form-item label="邮箱">
-                <el-input v-model="loginUser.email" style="width: 70%; padding-right: 10px" />
-                <el-button size="mini" type="info" @click="updateScreenName">更新</el-button>
+                <el-input v-model="loginUser.email" style="width: 70%; padding-right: 10px" readonly />
+                <el-button size="mini" type="info" @click="showUpdateDialog(2)">更新</el-button>
               </el-form-item>
               <el-form-item label="手机">
-                <el-input v-model="loginUser.mobile" style="width: 70%; padding-right: 10px" />
-                <el-button size="mini" type="info" @click="updateScreenName">更新</el-button>
+                <el-input v-model="loginUser.mobile" style="width: 70%; padding-right: 10px" readonly />
+                <el-button size="mini" type="info" @click="showUpdateDialog(3)">更新</el-button>
               </el-form-item>
               <el-form-item label="显示名">
-                <el-input v-model="loginUser.screenName" style="width: 70%; padding-right: 10px" />
-                <el-button size="mini" type="info" @click="updateScreenName">更新</el-button>
+                <el-input v-model="loginUser.screenName" style="width: 70%; padding-right: 10px" readonly />
+                <el-button size="mini" type="info" @click="showUpdateDialog(4)">更新</el-button>
               </el-form-item>
               <el-form-item label="签名">
-                <el-input v-model="loginUser.signature" style="width: 70%; padding-right: 10px" />
-                <el-button size="mini" type="info" @click="updateSignature">更新</el-button>
+                <el-input v-model="loginUser.signature" type="textarea" style="width: 70%; padding-right: 10px" readonly />
+                <el-button size="mini" type="info" @click="showUpdateDialog(5)">更新</el-button>
               </el-form-item>
             </el-form>
           </div>
@@ -62,6 +62,34 @@
         </el-card>
       </el-row>
     </el-col>
+
+    <el-dialog
+      :title="updateTitle"
+      append-to-body
+      :visible.sync="updateDialog"
+      width="30%"
+      center
+    >
+      <el-row>
+        <el-col :md="12" style="padding-right: 5px; padding-left: 5px; padding-bottom: 5px">
+          <el-row>
+            <el-form :inline="true" :model="updateForm">
+              <el-form-item>
+                <el-input
+                  v-model="updateForm.value"
+                  type="textarea"
+                  :rows="3"
+                  placeholder="添加留言..."
+                />
+              </el-form-item>
+              <el-form-item>
+                <el-button size="mini" type="warning" @click="onUpdate">更新</el-button>
+              </el-form-item>
+            </el-form>
+          </el-row>
+        </el-col>
+      </el-row>
+    </el-dialog>
   </el-row>
 </template>
 
@@ -83,7 +111,14 @@ export default {
       },
       coverUrl: null,
       // ****************************************************************************************************************
-      loginUser: null
+      loginUser: null,
+      updateDialog: false,
+      updateType: 1,
+      updateTitle: '',
+      updateForm: {
+        type: 1,
+        value: null
+      }
     }
   },
   created() {
@@ -157,11 +192,28 @@ export default {
       }
     },
     // ****************************************************************************************************************
-    updateScreenName() {
-      console.log('更新显示名')
+    showUpdateDialog(type) {
+      if (type === 1) {
+        this.updateType = 1
+        this.updateTitle = '更新用户名'
+      } else if (type === 2) {
+        this.updateType = 2
+        this.updateTitle = '更新用户邮箱'
+      } else if (type === 3) {
+        this.updateType = 3
+        this.updateTitle = '更新用户手机号'
+      } else if (type === 4) {
+        this.updateType = 4
+        this.updateTitle = '更新用户显示名'
+      } else if (type === 5) {
+        this.updateType = 5
+        this.updateTitle = '更新用户签名'
+      }
+      this.updateDialog = true
     },
-    updateSignature() {
-      console.log('更新签名')
+    onUpdate() {
+      this.$message.info('更新用户资料')
+      this.updateDialog = false
     }
   }
 }

src/views/my/MyVip.vue

@@ -49,10 +49,10 @@
     >
       <el-form ref="form" :model="planForm">
         <el-form-item>
-          <el-radio-group v-model="planForm.planId">
-            <el-radio label="1" border>月度会员(9.9 元每月)</el-radio>
-            <el-radio label="2" border>季度会员(28.9 元每季度)</el-radio>
-            <el-radio label="3" border>年度会员(99.9 元每年)</el-radio>
+          <el-radio-group v-for="(item, index) in vipPlans" :key="index" v-model="planForm.planId">
+            <el-radio style="margin-right: 5px" :label="item.planId" border>
+              {{ item.name }} (<span style="color: red">¥{{ item.price }}</span> 元)
+            </el-radio>
           </el-radio-group>
         </el-form-item>
         <el-form-item>

src/views/my/MyWallet.vue

@@ -5,11 +5,12 @@
         <el-card class="box-card">
           <div slot="header" class="clearfix">
             <span>我的钱包</span>
-            <el-button style="float: right; padding: 3px 0" type="text" @click="showChargeDialog">充值</el-button>
+            <el-button style="float: right; padding: 3px; color: red" type="text" @click="showTransferDialog">转帐</el-button>
+            <el-button style="float: right; padding: 3px; color: green" type="text" @click="showChargeDialog">充值</el-button>
           </div>
           <div class="text item">
             <el-row>
-              <h1>余额: <span style="color: red">￥{{ wallet.balance }}</span></h1>
+              <h1>余额: <span style="color: green">￥{{ wallet.balance }} 元</span></h1>
             </el-row>
           </div>
         </el-card>
@@ -20,7 +21,7 @@
             <span>我的账单</span>
           </div>
           <el-table
-            :data="billList"
+            :data="dataList"
             style="width: 100%"
           >
             <el-table-column
@@ -31,12 +32,19 @@
               prop="type"
               label="类型"
             >
+              <template slot-scope="scope">
+                <span v-if="scope.row.type === '支出'" style="color: red">
+                  {{ scope.row.type }}
+                </span>
+                <span v-else style="color: green">
+                  {{ scope.row.type }}
+                </span>
+              </template>
             </el-table-column>
             <el-table-column
               prop="quantity"
               label="金额"
-            >
-            </el-table-column>
+            />
             <el-table-column label="操作">
               <template slot-scope="scope">
                 <el-button
@@ -46,6 +54,16 @@
               </template>
             </el-table-column>
           </el-table>
+          <el-pagination
+            :small="screenWidth <= 768"
+            layout="prev, pager, next"
+            :page-size="pageSize"
+            :current-page="currentPage"
+            :total="totalSize"
+            @current-change="handleCurrentChange"
+            @prev-click="handleCurrentChange"
+            @next-click="handleCurrentChange"
+          />
         </el-card>
       </el-col>
     </el-row>
@@ -69,6 +87,35 @@
         </el-form-item>
       </el-form>
     </el-dialog>
+    <el-dialog
+      title="转账"
+      append-to-body
+      :visible.sync="transferDialog"
+      width="30%"
+      center
+    >
+      <el-form ref="form" :model="transferForm">
+        <el-form-item label="转账给">
+          <el-select v-model="transferForm.userId" placeholder="请选择联系人">
+            <el-option
+              v-for="item in contactList"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value"
+            />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="转帐金额">
+          <el-input-number v-model="transferForm.quantity" :min="1" :max="10000" style="margin-left: 5px" />
+        </el-form-item>
+        <el-form-item>
+          <el-button
+            type="primary"
+            @click="transferTo"
+          >确定</el-button>
+        </el-form-item>
+      </el-form>
+    </el-dialog>
   </el-main>
 </template>
 
@@ -79,14 +126,25 @@ export default {
   name: 'MyWallet',
   data() {
     return {
+      // 屏幕宽度, 为了控制分页条的大小
+      screenWidth: document.body.clientWidth,
+      currentPage: 1,
+      pageSize: 20,
+      totalSize: 0,
+      dataList: [],
       chargeDialog: false,
       chargeForm: {
         quantity: null
       },
+      contactList: [],
+      transferDialog: false,
+      transferForm: {
+        userId: 0,
+        quantity: null
+      },
       wallet: {
         balance: '0.00'
-      },
-      billList: []
+      }
     }
   },
   created() {
@@ -100,6 +158,8 @@ export default {
     this.getBillRecord()
   },
   methods: {
+    handleCurrentChange(pageNumber) {
+    },
     showChargeDialog() {
       this.chargeDialog = true
     },
@@ -133,10 +193,17 @@ export default {
         })
       })
     },
+    showTransferDialog() {
+      this.transferDialog = true
+      this.$message.info('获取联系人')
+    },
+    transferTo() {
+      this.$message.info('转帐')
+    },
     getBillRecord() {
       getWalletBill().then(resp => {
         if (resp.code === 0) {
-          this.billList = resp.data
+          this.dataList = resp.data
         }
       })
     },