status 页面后端接口

src/api/bugu/status.js

@@ -0,0 +1,16 @@
+import $axios from '../index'
+
+const statusApi = {
+  statusRecommendApi: '/api/bugu/status',
+  statusSubmitApi: '/api/bugu/status'
+}
+
+// 状态获取接口
+export function statusRecommend(page) {
+  return $axios.get(statusApi.statusRecommendApi + '/' + page)
+}
+
+// 状态发布接口
+export function submitStatus(videoPost) {
+  return $axios.post(statusApi.statusSubmitApi, videoPost)
+}

src/api/media/video.js

@@ -3,7 +3,7 @@ import $axios from '../index'
 const videoApi = {
   videoRecommendApi: '/api/media/video/post/recommend',
   similarVideoApi: '/api/media/video/post/similar',
-  videoInfoApi: '/api/media/video/post',
+  videoInfoApi: '/api/media/video/post/detail',
   videoUrlApi: '/api/media/video/url',
   videoCategoryApi: '/api/media/video/category',
   videoPostSubmitApi: '/api/media/video/submit'

src/components/status/status-card.vue

@@ -8,30 +8,29 @@
     <v-card-title>
       <v-avatar>
         <img
-          v-if="x.user"
-          :src="x.user.avatar_large"
+          :src="item.avatarUrl"
           alt="social"
         >
       </v-avatar>
-      <span class="text-body-1 font-weight-light">{{ x.user.name }}</span>
-      <span class="text-body-1 font-weight-light">{{ formatTime(x.created_at) }}</span>
+      <span class="text-body-1 font-weight-light">{{ item.username }}</span>
+      <span class="text-body-1 font-weight-light">{{ item.createAt }}</span>
     </v-card-title>
 
     <v-card-text class-name="text-h5 font-weight-bold">
-      <span v-html="formatContent(x.text)" />
-      <v-row>
+      <span v-html="formatContent(item.text)" />
+      <v-row v-if="item.imageUrls.length !== 0">
         <v-col
-          v-for="y in x.pic_urls"
-          :key="y.thumbnail_pic"
+          v-for="imageUrl in item.imageUrls"
+          :key="imageUrl"
           class="d-flex child-flex"
           cols="4"
         >
           <v-img
-            :src="y.thumbnail_pic"
-            :lazy-src="y.thumbnail_pic"
+            :src="imageUrl"
+            :lazy-src="imageUrl"
             aspect-ratio="1"
             class="grey lighten-2"
-            @click="showImage(y.thumbnail_pic)"
+            @click="showImage(item.imageUrls)"
           >
             <template v-slot:placeholder>
               <v-row
@@ -66,7 +65,7 @@ import { mapActions } from 'vuex'
 export default {
   name: 'StatusCard',
   props: {
-    x: {
+    item: {
       type: Object,
       default: () => {
       }
@@ -82,10 +81,8 @@ export default {
       'setDetailContent'
     ]),
     showImage(imgs) {
-      const arr = []
-      arr[0] = imgs
       this.$viewerApi({
-        images: arr,
+        images: imgs,
         options: {
           movable: false,
           fullscreen: false,
@@ -94,7 +91,7 @@ export default {
       })
     },
     goDetailContent() {
-      this.setDetailContent(this.x)
+      this.setDetailContent(this.item)
       this.$router.push({ name: 'detail-content' })
     },
     formatTime(time) {

src/views/home/status.vue

@@ -100,11 +100,11 @@
             </v-card>
           </v-col>
           <v-col
-            v-for="x in list"
-            :key="x.id"
+            v-for="item in list"
+            :key="item.statusId"
             cols="12"
           >
-            <status-card :x="x" />
+            <status-card :item="item" />
           </v-col>
         </v-row>
       </v-col>
@@ -154,6 +154,7 @@
 
 <script>
 import { mapActions, mapGetters } from 'vuex'
+import { statusRecommend } from '@/api/bugu/status'
 import StatusCard from '@/components/status/status-card'
 
 export default {
@@ -164,6 +165,8 @@ export default {
   data() {
     return {
       list: [],
+      busy: false,
+      page: 1,
       model: null
     }
   },
@@ -194,10 +197,10 @@ export default {
     }
   },
   created() {
-    this.myContent(1)
+    // this.myContent(1)
+    this.getFollowingStatus(this.page)
   },
   mounted() {
-
   },
   activated() {
     window.addEventListener('scroll', this.scrollBar)
@@ -209,6 +212,34 @@ export default {
     ...mapActions([
       'getMyContent'
     ]),
+    /*    loadMore: function() {
+      this.busy = true
+      setTimeout(() => {
+        this.getFollowingStatus(this.page)
+      }, 1000)
+    },*/
+    getFollowingStatus(page) {
+      statusRecommend(page)
+        .then(res => {
+          if (res.code === 0) {
+            for (const item of res.data.list) {
+              this.list.push(item)
+            }
+            this.page += 1
+            this.busy = false
+          } else {
+            this.$notify({
+              title: res.code,
+              message: res.msg,
+              type: 'warning',
+              duration: 500
+            })
+          }
+        })
+        .catch(error => {
+          console.error(error.message)
+        })
+    },
     myContent(page) {
       this.getMyContent(page)
     },