Просмотр исходного кода

调整状态页面布局
调整 card 组件位置

reghao 3 лет назад
Родитель
Сommit
03e3a0ff8c

+ 6 - 0
src/api/media/video.js

@@ -1,6 +1,7 @@
 import $axios from '../index'
 
 const videoApi = {
+  videoTimelineApi: '/api/media/video/post/timeline',
   videoRecommendApi: '/api/media/video/post/recommend',
   similarVideoApi: '/api/media/video/post/similar',
   videoInfoApi: '/api/media/video/post/detail',
@@ -11,6 +12,11 @@ const videoApi = {
   userVideoListApi: '/api/media/video/post/user'
 }
 
+// 视频推荐接口
+export function videoTimeline(page) {
+  return $axios.get(videoApi.videoTimelineApi + '/' + page)
+}
+
 // 视频推荐接口
 export function videoRecommend(page) {
   return $axios.get(videoApi.videoRecommendApi + '/' + page)

+ 0 - 0
src/components/item-card.vue → src/components/card/item-card.vue


+ 1 - 3
src/components/status/status-card.vue → src/components/card/status-card.vue

@@ -1,9 +1,7 @@
 <template>
   <v-card
     class-name="mx-auto"
-    color="#000000"
-    dark
-    max-width="400"
+    color="white"
   >
     <v-card-title>
       <v-avatar>

+ 0 - 0
src/components/player/video-card.vue → src/components/card/video-card.vue


+ 1 - 1
src/store/modules/user.js

@@ -64,6 +64,7 @@ const actions = {
           resolve()
         } else {
           alert(res.data)
+          console.log(res.data)
         }
       }).catch(error => {
         reject(error)
@@ -80,7 +81,6 @@ const actions = {
   logout({ commit, state }) {
     return new Promise((resolve, reject) => {
       logout(state.token).then(() => {
-        console.log('1.用户注销...')
         removeToken() // must remove  token  first
         commit('RESET_STATE')
         resolve()

+ 0 - 1
src/utils/auth.js

@@ -11,6 +11,5 @@ export function setToken(token) {
 }
 
 export function removeToken() {
-  console.log('删除 token')
   return Cookies.remove(TokenKey)
 }

+ 1 - 1
src/views/home/index.vue

@@ -15,7 +15,7 @@
 
 <script>
 import { videoRecommend } from '@/api/media/video'
-import VideoCared from '@/components/player/video-card.vue'
+import VideoCared from '@/components/card/video-card.vue'
 
 export default {
   name: 'Index',

+ 57 - 32
src/views/home/mblog.vue

@@ -1,33 +1,9 @@
 <template>
   <v-container class="grey lighten-5">
     <v-row justify="space-between">
-      <v-col md="4">
-        <v-card
-          class="mx-auto"
-          color="#26c6da"
-          dark
-          max-width="400"
-        >
-          <v-card-title>
-            <v-icon
-              small
-              left
-            >
-              mdi-twitter
-            </v-icon>
-            <span class="text-h6 font-weight-light">用户名</span>
-          </v-card-title>
-          <v-card-text class="text-h5 font-weight-light">
-            用户签名
-          </v-card-text>
-          <v-card-text class="text-h5 font-weight-light">
-            关注 | 被关注
-          </v-card-text>
-        </v-card>
-      </v-col>
-      <v-col md="4">
+      <v-col>
         <v-row dense>
-          <v-col cols="12">
+          <v-col>
             <v-card
               color="#385F73"
               dark
@@ -39,7 +15,7 @@
                   falt
                   filled
                   auto-grow
-                  label="想和大家分享点什么呢?"
+                  label="点什么呢?"
                   rows="3"
                 />
               </v-row>
@@ -60,7 +36,7 @@
               </v-row>
             </v-card>
           </v-col>
-          <v-col cols="12">
+          <v-col>
             <v-sheet
               class="mx-auto"
               max-width="700"
@@ -109,7 +85,6 @@
           <v-col
             v-for="item in list"
             :key="item.statusId"
-            cols="12"
           >
             <status-card :item="item" />
           </v-col>
@@ -117,6 +92,30 @@
       </v-col>
       <v-col md="4">
         <v-row dense>
+          <v-col cols="12">
+            <v-card
+              class="mx-auto"
+              color="#26c6da"
+              dark
+            >
+              <v-card-title>
+                <v-avatar size="32">
+                  <v-img
+                    :src="this.$store.state.user.userInfo.avatarUrl"
+                    :alt="this.$store.state.user.userInfo.username"
+                    :title="this.$store.state.user.userInfo.username"
+                  />
+                </v-avatar>
+                <span class="text-h6 font-weight-light">{{ this.$store.state.user.userInfo.username }}</span>
+              </v-card-title>
+              <v-card-text class="text-h5 font-weight-light">
+                {{ this.$store.state.user.userInfo.intro }}
+              </v-card-text>
+              <v-card-text class="text-h5 font-weight-light">
+                关注 {{ this.$store.state.user.userInfo.followingCount }} | 被关注 {{ this.$store.state.user.userInfo.followerCount }}
+              </v-card-text>
+            </v-card>
+          </v-col>
           <v-col cols="12">
             <v-card
               color="#385F73"
@@ -180,7 +179,8 @@
 <script>
 import { mapActions, mapGetters } from 'vuex'
 import { pubStatus, statusRecommend } from '@/api/mblog/status'
-import StatusCard from '@/components/status/status-card'
+import { videoTimeline } from '@/api/media/video'
+import StatusCard from '@/components/card/status-card'
 import FilePondUploadImage from '@/components/upload/filepond-image.vue'
 
 export default {
@@ -231,6 +231,7 @@ export default {
   },
   created() {
     this.getFollowingStatus(this.page)
+    this.getTimeline(this.page)
   },
   mounted() {
   },
@@ -244,6 +245,25 @@ export default {
         this.getFollowingStatus(this.page)
       }, 1000)
     },
+    getTimeline(page) {
+      videoTimeline(page)
+        .then(res => {
+          if (res.code === 0) {
+            for (const item of res.data.list) {
+              console.log(item)
+            }
+            this.page += 1
+            this.busy = false
+          } else {
+            this.message = res.msg
+            this.showMessage = true
+          }
+        })
+        .catch(error => {
+          this.message = error.message
+          this.showMessage = true
+        })
+    },
     getFollowingStatus(page) {
       statusRecommend(page)
         .then(res => {
@@ -254,11 +274,13 @@ export default {
             this.page += 1
             this.busy = false
           } else {
-            console.error(res.msg)
+            this.message = res.msg
+            this.showMessage = true
           }
         })
         .catch(error => {
-          console.error(error.message)
+          this.message = error.message
+          this.showMessage = true
         })
     },
     myContent(page) {
@@ -282,6 +304,9 @@ export default {
         this.showMessage = true
       }
     },
+    setFile() {
+      console.log('选择文件')
+    },
     publish() {
       if (this.statusPost.content === '') {
         this.message = '内容不能为空'

+ 1 - 1
src/views/home/search-result.vue

@@ -33,7 +33,7 @@
 
 <script>
 import { videoQuery } from '@/api/search/search'
-import ItemCard from '@/components/item-card.vue'
+import ItemCard from '@/components/card/item-card.vue'
 
 export default {
   name: 'SearchResult',

+ 1 - 1
src/views/user/home.vue

@@ -114,7 +114,7 @@
 import { userVideoList } from '@/api/media/video'
 import { getUserInfo } from '@/api/user/account'
 import Power from '@/utils/check-power.vue'
-import ItemCard from '@/components/item-card.vue'
+import ItemCard from '@/components/card/item-card.vue'
 import TimeUtil from '@/utils/time-util.vue'
 
 export default {

+ 1 - 1
src/views/video/video.vue

@@ -231,7 +231,7 @@
 
 <script>
 import { similarVideo, videoInfo } from '@/api/media/video'
-import VideoCared from '@/components/player/video-card.vue'
+import VideoCared from '@/components/card/video-card.vue'
 import VideoPlayer from '@/components/player/player.vue'
 import TimeUtil from '@/utils/time-util.vue'
 import Comment from '@/components/comment/video-comment.vue'