更新 MyContact.vue 联系人页面, contact 目前只在 views/disk 模块的分享中使用

src/views/my/MyContact.vue

@@ -13,12 +13,17 @@
             style="width: 100%"
           >
             <el-table-column
-              prop="createAt"
-              label="时间"
-            />
+              prop="avatarUrl"
+              label="头像"
+              width="90"
+            >
+              <template slot-scope="scope">
+                <el-image :src="scope.row.avatarUrl" min-width="30" height="20" />
+              </template>
+            </el-table-column>
             <el-table-column
-              prop="title"
-              label="标题"
+              prop="username"
+              label="名字"
             />
             <el-table-column
               label="操作"
@@ -26,11 +31,11 @@
               <template slot-scope="scope">
                 <el-button
                   size="mini"
-                  @click="view(scope.row)"
-                >查看</el-button>
+                  @click="viewContact(scope.row)"
+                >详情</el-button>
                 <el-button
                   size="mini"
-                  @click="delete(scope.row)"
+                  @click="deleteContact(scope.row)"
                 >删除</el-button>
               </template>
             </el-table-column>
@@ -46,6 +51,8 @@
 </template>
 
 <script>
+import { getUserContact } from '@/api/user'
+
 export default {
   name: 'MyContact',
   data() {
@@ -57,9 +64,23 @@ export default {
   },
   created() {
     document.title = '我的联系人'
+    this.getData()
   },
   methods: {
-    view(row) {
+    getData() {
+      getUserContact(1).then(resp => {
+        if (resp.code === 0) {
+          this.dataList = resp.data
+        } else {
+          this.$message.error(resp.msg)
+        }
+      })
+    },
+    viewContact(row) {
+      this.$message.info('get ' + row.username + ' detail')
+    },
+    deleteContact(row) {
+      this.$message.info('delete contact ' + row.username)
     },
     onCloseDialog() {
       this.messageContent = ''