Kaynağa Gözat

update Timeline.vue

reghao 2 yıl önce
ebeveyn
işleme
c7ec9d8c07

+ 1 - 1
src/components/card/TextCard.vue

@@ -7,7 +7,7 @@
       placeholder="有什么新鲜事想分享给大家?"
     />
     <el-upload
-      action="https://jsonplaceholder.typicode.com/posts/"
+      action="https://api.reghao.cn/api/content/timeline"
     >
       <el-button><i class="el-icon-picture-outline">图片</i></el-button>
     </el-upload>

+ 6 - 6
src/components/card/UserAvatarCard.vue

@@ -12,12 +12,12 @@
           </el-col>
           <el-col :md="16">
             <el-row>
-              <span v-html="userAvatar.screenName"></span>
+              <span v-html="userAvatar.screenName" />
             </el-row>
             <el-row>
-              <span>关注 {{userAvatar.following}}</span>
+              <span>关注 {{ userAvatar.following }}</span>
               <span v-html="'&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;'" />
-              <span>粉丝 {{userAvatar.follower}}</span>
+              <span>粉丝 {{ userAvatar.follower }}</span>
             </el-row>
           </el-col>
         </el-row>
@@ -31,7 +31,7 @@
               :icon="followButton.icon"
               @click="followUser(userAvatar.userId)"
             >
-              <span>{{followButton.text}}</span>
+              <span>{{ followButton.text }}</span>
             </el-button>
             <el-button
               type="danger"
@@ -49,7 +49,7 @@
 </template>
 
 <script>
-import { checkRelation, followUser, unfollowUser } from "@/api/user";
+import { checkRelation, followUser, unfollowUser } from '@/api/user'
 
 export default {
   name: 'UserAvatarCard',
@@ -79,7 +79,7 @@ export default {
       followButton: {
         icon: 'el-icon-plus',
         text: '关注'
-      },
+      }
     }
   },
   created() {

+ 4 - 4
src/components/card/UserCard.vue

@@ -18,7 +18,7 @@
           <span>粉丝 33</span>
         </el-row>
         <el-row>
-          <span v-if="user.signature !== undefined">{{user.signature}}</span>
+          <span v-if="user.signature !== undefined">{{ user.signature }}</span>
           <span v-if="user.signature === undefined">无签名</span>
         </el-row>
         <el-row>
@@ -28,7 +28,7 @@
             :icon="followButton.icon"
             @click="followUser(user.userId)"
           >
-            <span>{{followButton.text}}</span>
+            <span>{{ followButton.text }}</span>
           </el-button>
         </el-row>
       </el-col>
@@ -37,7 +37,7 @@
 </template>
 
 <script>
-import { getUserInfo, getUserFollowing, getUserFollower, checkRelation, followUser, unfollowUser } from "@/api/user";
+import { getUserInfo, getUserFollowing, getUserFollower, checkRelation, followUser, unfollowUser } from '@/api/user'
 
 export default {
   name: 'UserCard',
@@ -67,7 +67,7 @@ export default {
       followButton: {
         icon: 'el-icon-plus',
         text: '关注'
-      },
+      }
     }
   },
   methods: {

+ 22 - 6
src/views/home/Timeline.vue

@@ -1,12 +1,15 @@
 <template>
   <div>
     <el-row class="movie-list">
-      <el-col :md="12">
+      <el-col :md="8">
+        <user-avatar-card v-if="userInfo !== null" :user-avatar="userInfo" />
+      </el-col>
+      <el-col :md="16">
         <el-row>
           <text-card />
         </el-row>
         <el-row>
-          <el-tabs v-model="activeName" @tab-click='tabClick'>
+          <el-tabs v-model="activeName" @tab-click="tabClick">
             <el-tab-pane label="视频" name="video">
               <div v-if="activeName === 'video'">
                 <el-col :md="8">
@@ -36,13 +39,15 @@
 import TextCard from '@/components/card/TextCard'
 import StatusCard from '@/components/card/StatusCard'
 import VideoCard from '@/components/card/VideoCard'
+import UserAvatarCard from '@/components/card/UserAvatarCard'
 
 import { statusTimeline, videoTimeline } from '@/api/timeline'
-import {getMyInfo} from "@/api/user";
+import { getUserInfo } from '@/api/user'
+import Vue from 'vue'
 
 export default {
   name: 'Timeline',
-  components: { TextCard, StatusCard, VideoCard },
+  components: { TextCard, StatusCard, VideoCard, UserAvatarCard },
   data() {
     return {
       // 屏幕宽度, 为了控制分页条的大小
@@ -56,12 +61,23 @@ export default {
     }
   },
   created() {
-    getMyInfo().then(res => {
+    const userdata = Vue.$cookies.get('USERDATA')
+    if (userdata == null) {
+      return null
+    }
+    const userId = userdata.split(':')[0]
+    getUserInfo(userId).then(resp => {
+      if (resp.code === 0) {
+        this.userInfo = resp.data
+        document.title = this.userInfo.screenName + '的时间线'
+      }
+    })
+    /* getMyInfo().then(res => {
       if (res.code === 0) {
         this.userInfo = res.data
         document.title = this.userInfo.screenName + '的时间线'
       }
-    })
+    })*/
     this.videoTimelineWrapper(this.nextId)
   },
   mounted() {

+ 27 - 28
src/views/user/Home.vue

@@ -7,7 +7,7 @@
             <el-row>
               <el-col :md="1">
                 <el-avatar>
-                  <el-image :src="user.avatarUrl"/>
+                  <el-image :src="user.avatarUrl" />
                 </el-avatar>
               </el-col>
               <el-col :md="23">
@@ -19,7 +19,7 @@
                   :icon="followButton.icon"
                   @click="followUser(user.userId)"
                 >
-                  <span>{{followButton.text}}</span>
+                  <span>{{ followButton.text }}</span>
                 </el-button>
                 <el-button
                   type="danger"
@@ -32,8 +32,7 @@
               </el-col>
             </el-row>
             <el-row>
-              <span v-if="user.signature !== null" v-html="user.signature">
-              </span>
+              <span v-if="user.signature !== null" v-html="user.signature" />
               <span v-if="user.signature === undefined || user.signature === null">-</span>
             </el-row>
             <el-row>
@@ -52,10 +51,10 @@
     </el-row>
     <el-row>
       <el-col :md="24" class="movie-list">
-        <el-tabs v-model="activeName" @tab-click='tabClick'>
+        <el-tabs v-model="activeName" @tab-click="tabClick">
           <el-tab-pane name="video">
             <span slot="label">
-              视频<el-badge :value="userContentData.videoCount" :max="9999" class="item" type="warning"/>
+              视频<el-badge :value="userContentData.videoCount" :max="9999" class="item" type="warning" />
             </span>
             <div v-if="activeName === 'video'">
               <el-col v-for="(video, index) in dataList" :key="index" :md="6" :sm="12" :xs="12">
@@ -65,27 +64,27 @@
           </el-tab-pane>
           <el-tab-pane name="audio">
             <span slot="label">
-              音频<el-badge :value="userContentData.audioCount" :max="9999" class="item" type="warning"/>
+              音频<el-badge :value="userContentData.audioCount" :max="9999" class="item" type="warning" />
             </span>
             <div v-if="activeName === 'audio'">
               <el-col v-for="(audio, index) in dataList" :key="index" :md="6" :sm="12" :xs="12">
-                <audio-card :audio="audio"/>
+                <audio-card :audio="audio" />
               </el-col>
             </div>
           </el-tab-pane>
           <el-tab-pane name="image">
             <span slot="label">
-              相册<el-badge :value="userContentData.albumCount" :max="9999" class="item" type="warning"/>
+              相册<el-badge :value="userContentData.albumCount" :max="9999" class="item" type="warning" />
             </span>
             <div v-if="activeName === 'image'">
               <el-col v-for="(album, index) in dataList" :key="index" :md="6" :sm="12" :xs="12">
-                <image-album-card :imageAlbum="album" />
+                <image-album-card :image-album="album" />
               </el-col>
             </div>
           </el-tab-pane>
           <el-tab-pane name="article">
             <span slot="label">
-              文章<el-badge :value="userContentData.articleCount" :max="9999" class="item" type="warning"/>
+              文章<el-badge :value="userContentData.articleCount" :max="9999" class="item" type="warning" />
             </span>
             <div v-if="activeName === 'article'">
               <el-col v-for="(article, index) in dataList" :key="index" :md="6" :sm="12" :xs="12">
@@ -93,7 +92,7 @@
               </el-col>
             </div>
           </el-tab-pane>
-<!--          <el-tab-pane name="status">
+          <!--          <el-tab-pane name="status">
             <span slot="label">
               状态<el-badge :value="userContentData.statusCount" :max="9999" class="item" type="warning"/>
             </span>
@@ -138,12 +137,12 @@ import AudioCard from '@/components/card/AudioCard'
 import ImageAlbumCard from '@/components/card/ImageAlbumCard'
 import ArticleCard from '@/components/card/ArticleCard'
 
-import { getUserInfo, checkRelation, followUser, unfollowUser } from "@/api/user";
-import { getUserContentData, getUserVideos } from "@/api/video";
-import { getUserAlbums1 } from "@/api/image";
-import { getUserAudios } from "@/api/audio";
-import { getUserArticles } from "@/api/article";
-import { userStatus } from "@/api/status";
+import { getUserInfo, checkRelation, followUser, unfollowUser } from '@/api/user'
+import { getUserContentData, getUserVideos } from '@/api/video'
+import { getUserAlbums1 } from '@/api/image'
+import { getUserAudios } from '@/api/audio'
+import { getUserArticles } from '@/api/article'
+import { userStatus } from '@/api/status'
 
 export default {
   name: 'Home',
@@ -167,25 +166,30 @@ export default {
       userContentData: null
     }
   },
+  watch: {
+    $route() {
+      this.$router.go()
+    }
+  },
   created() {
     this.userId = this.$route.params.id
     getUserInfo(this.userId).then(resp => {
       if (resp.code === 0) {
         this.user = resp.data
         const path = this.$route.path
-        if (path.endsWith("video")) {
+        if (path.endsWith('video')) {
           this.activeName = 'video'
           document.title = this.user.screenName + '的视频'
-        } else if (path.endsWith("image")) {
+        } else if (path.endsWith('image')) {
           this.activeName = 'image'
           document.title = this.user.screenName + '的相册'
-        } else if (path.endsWith("audio")) {
+        } else if (path.endsWith('audio')) {
           this.activeName = 'audio'
           document.title = this.user.screenName + '的音频'
-        } else if (path.endsWith("article")) {
+        } else if (path.endsWith('article')) {
           this.activeName = 'article'
           document.title = this.user.screenName + '的文章'
-        } else if (path.endsWith("status")) {
+        } else if (path.endsWith('status')) {
           this.activeName = 'status'
           document.title = this.user.screenName + '的状态'
         } else {
@@ -217,11 +221,6 @@ export default {
       }
     }
   },
-  watch: {
-    $route(){
-      this.$router.go()
-    }
-  },
   methods: {
     followUser(userId) {
       if (this.followButton.text === '关注') {