/my/post/list 路由对应页面的数据获取

src/views/my/My.vue

@@ -1,6 +1,6 @@
 <template>
   <el-container>
-    <el-aside>
+    <el-aside id="aside-style">
       <!--    <el-radio-group v-model="isCollapse" style="margin-bottom: 20px;">
       <el-radio-button :label="false">展开</el-radio-button>
       <el-radio-button :label="true">收起</el-radio-button>
@@ -145,9 +145,7 @@ export default {
     return {
       isCollapse: false,
       navList: [
-        { path: '/post/publish', name: '发布', icon: 'el-icon-upload' },
-        { path: '/post/list', name: '稿件', icon: 'el-icon-files' },
-        { path: '/post/analysis', name: '数据', icon: 'el-icon-data-analysis' }
+        { path: '/my/account', name: '我的帐号', icon: 'el-icon-upload' }
       ]
     }
   },
@@ -176,4 +174,10 @@ export default {
   width: 200px;
   min-height: 800px;
 }
+
+#aside-style {
+  min-width: 120px;
+  max-width: 240px;
+  width: 30%;
+}
 </style>

src/views/post/ArticlePost.vue

@@ -6,45 +6,51 @@
         style="width: 100%"
       >
         <el-table-column
-          type="index">
-        </el-table-column>
+          type="index"
+        />
         <el-table-column
           prop="createAt"
-          label="发布时间">
-        </el-table-column>
+          label="发布时间"
+        />
         <el-table-column
           prop="title"
-          label="文章标题">
+          label="文章标题"
+        >
           <template slot-scope="scope">
             <router-link target="_blank" :to="`/article/${scope.row.articleId}`">
-              <span>{{scope.row.title}}</span>
+              <span>{{ scope.row.title }}</span>
             </router-link>
           </template>
         </el-table-column>
         <el-table-column
           prop="scope"
-          label="可见范围">
+          label="可见范围"
+        >
           <template slot-scope="scope">
             <el-tooltip class="item" effect="dark" content="点击修改可见范围" placement="top-end">
               <el-button
                 v-if="scope.row.scope === 1"
                 size="mini"
-                @click="handleScope(scope.$index, scope.row)">本人可见</el-button>
+                @click="handleScope(scope.$index, scope.row)"
+              >本人可见</el-button>
               <el-button
                 v-else-if="scope.row.scope === 2"
                 size="mini"
                 type="success"
-                @click="handleScope(scope.$index, scope.row)">所有人可见</el-button>
+                @click="handleScope(scope.$index, scope.row)"
+              >所有人可见</el-button>
               <el-button
                 v-else-if="scope.row.scope === 3"
                 size="mini"
                 type="warning"
-                @click="handleScope(scope.$index, scope.row)">VIP 可见</el-button>
+                @click="handleScope(scope.$index, scope.row)"
+              >VIP 可见</el-button>
               <el-button
                 v-else
                 size="mini"
                 type="danger"
-                @click="handleScope(scope.$index, scope.row)">验证码可见</el-button>
+                @click="handleScope(scope.$index, scope.row)"
+              >验证码可见</el-button>
             </el-tooltip>
           </template>
         </el-table-column>
@@ -52,11 +58,13 @@
           <template slot-scope="scope">
             <el-button
               size="mini"
-              @click="handleEdit(scope.$index, scope.row)">编辑</el-button>
+              @click="handleEdit(scope.$index, scope.row)"
+            >编辑</el-button>
             <el-button
               size="mini"
               type="danger"
-              @click="handleDelete(scope.$index, scope.row)">删除</el-button>
+              @click="handleDelete(scope.$index, scope.row)"
+            >删除</el-button>
           </template>
         </el-table-column>
       </el-table>
@@ -88,19 +96,22 @@
 </template>
 
 <script>
-import { updateArticleScope, deleteArticle } from "@/api/article";
+import { updateArticleScope, deleteArticle, getArticlePosts } from '@/api/article'
+import { getVideoPosts } from '@/api/video'
+import { getUserAlbums } from '@/api/image'
+import { getAudioPosts } from '@/api/audio'
 
 export default {
   name: 'ArticlePost',
-  props: {
-    dataList: {
-      type: Array,
-      default: []
-    },
-  },
-  components: {},
   data() {
     return {
+      // 屏幕宽度, 为了控制分页条的大小
+      screenWidth: document.body.clientWidth,
+      currentPage: 1,
+      pageSize: 12,
+      totalSize: 0,
+      dataList: [],
+      // **********************************************************************
       showEditScopeDialog: false,
       form: {
         articleId: null,
@@ -109,11 +120,35 @@ export default {
     }
   },
   created() {
+    document.title = '文章稿件'
+    this.getData()
   },
   methods: {
+    handleCurrentChange(pageNumber) {
+      this.currentPage = pageNumber
+      this.getData()
+      // 回到顶部
+      scrollTo(0, 0)
+    },
+    getData() {
+      this.currentPage = 1
+      getArticlePosts(this.currentPage).then(resp => {
+        if (resp.code === 0) {
+          this.dataList = resp.data.list
+          this.totalSize = resp.data.totalSize
+        } else {
+          this.$notify({
+            title: '提示',
+            message: resp.msg,
+            type: 'warning',
+            duration: 3000
+          })
+        }
+      })
+    },
     handleScope(index, row) {
       this.form.articleId = row.articleId
-      this.form.scope = ''+row.scope
+      this.form.scope = '' + row.scope
       this.showEditScopeDialog = true
     },
     handleEdit(index, row) {

src/views/post/AudioPost.vue

@@ -104,19 +104,22 @@
 </template>
 
 <script>
-import { updateAudioScope, deleteAudioPost } from '@/api/audio'
+import {updateAudioScope, deleteAudioPost, getAudioPosts} from '@/api/audio'
+import {getVideoPosts} from "@/api/video";
+import {getUserAlbums} from "@/api/image";
+import {getArticlePosts} from "@/api/article";
 
 export default {
   name: 'AudioPost',
-  components: {},
-  props: {
-    dataList: {
-      type: Array,
-      default: []
-    }
-  },
   data() {
     return {
+      // 屏幕宽度, 为了控制分页条的大小
+      screenWidth: document.body.clientWidth,
+      currentPage: 1,
+      pageSize: 12,
+      totalSize: 0,
+      dataList: [],
+      // **********************************************************************
       showEditScopeDialog: false,
       form: {
         audioId: null,
@@ -125,8 +128,33 @@ export default {
     }
   },
   created() {
+    document.title = '音频稿件'
+    this.getData()
   },
   methods: {
+    handleCurrentChange(pageNumber) {
+      this.currentPage = pageNumber
+      this.getData()
+      // 回到顶部
+      scrollTo(0, 0)
+    },
+    getData() {
+      this.dataList = []
+      this.currentPage = 1
+      getAudioPosts(this.currentPage).then(resp => {
+        if (resp.code === 0) {
+          this.dataList = resp.data.list
+          this.totalSize = resp.data.totalSize
+        } else {
+          this.$notify({
+            title: '提示',
+            message: resp.msg,
+            type: 'warning',
+            duration: 3000
+          })
+        }
+      })
+    },
     handleScope(index, row) {
       this.form.audioId = row.audioId
       this.form.scope = '' + row.scope

src/views/post/ImagePost.vue

@@ -105,19 +105,22 @@
 </template>
 
 <script>
-import { updateAlbumScope, deleteAlbum } from "@/api/image";
+import {updateAlbumScope, deleteAlbum, getUserAlbums} from "@/api/image";
+import {getVideoPosts} from "@/api/video";
+import {getAudioPosts} from "@/api/audio";
+import {getArticlePosts} from "@/api/article";
 
 export default {
   name: 'ImagePost',
-  props: {
-    dataList: {
-      type: Array,
-      default: []
-    },
-  },
-  components: {},
   data() {
     return {
+      // 屏幕宽度, 为了控制分页条的大小
+      screenWidth: document.body.clientWidth,
+      currentPage: 1,
+      pageSize: 12,
+      totalSize: 0,
+      dataList: [],
+      // **********************************************************************
       showEditScopeDialog: false,
       form: {
         albumId: null,
@@ -126,8 +129,32 @@ export default {
     }
   },
   created() {
+    document.title = '相册稿件'
+    this.getData()
   },
   methods: {
+    handleCurrentChange(pageNumber) {
+      this.currentPage = pageNumber
+      this.getData()
+      // 回到顶部
+      scrollTo(0, 0)
+    },
+    getData() {
+      this.dataList = []
+      getUserAlbums(this.userId).then(resp => {
+        if (resp.code === 0) {
+          this.dataList = resp.data.list
+          this.totalSize = resp.data.totalSize
+        } else {
+          this.$notify({
+            title: '提示',
+            message: resp.msg,
+            type: 'warning',
+            duration: 3000
+          })
+        }
+      })
+    },
     handleScope(index, row) {
       this.form.albumId = row.albumId
       this.form.scope = ''+row.scope
@@ -150,7 +177,7 @@ export default {
               type: 'warning',
               duration: 3000
             })
-            //this.$router.go(0)
+            // this.$router.go(0)
           }
         })
       }).catch(() => {

src/views/post/PostList1.vue

@@ -1,186 +0,0 @@
-<template>
-  <el-row class="movie-list">
-    <el-col :md="4">
-      <el-row style="padding-right: 5px; padding-left: 5px; padding-bottom: 5px">
-        <el-card class="box-card">
-          <div class="text item" v-for="(item,i) in navList" :key="i">
-            <el-row>
-              <span>
-                <i :class="item.icon" />
-                <router-link target="_blank" :to="`${item.path}`">
-                </router-link>
-                <span slot="title">{{ item.name }}</span>
-              </span>
-            </el-row>
-          </div>
-        </el-card>
-      </el-row>
-    </el-col>
-    <el-col :md="20">
-      <el-row style="padding-right: 5px; padding-left: 5px; padding-bottom: 5px">
-        <el-card class="box-card">
-          <div class="text item" v-for="(item, index) in dataList" :key="index" :md="6" :sm="12" :xs="12">
-            <el-row>
-              <el-col :md="4">
-                <router-link target="_blank" :to="`/article/${item.articleId}`">
-                  <el-image
-                    lazy
-                    fit="cover"
-                    :src="item.coverUrl"
-                    class="coverImg"
-                  />
-                </router-link>
-              </el-col>
-              <el-col :md="20">
-                <router-link target="_blank" :to="`/article/${item.articleId}`">
-                  <el-row>
-                    <div style="padding: 14px">
-                      <span style="left: 0;margin-bottom: 0px;color: black;">{{ item.title | ellipsis }}</span>
-                    </div>
-                  </el-row>
-                </router-link>
-                <el-row>
-                  <div style="padding: 14px">
-                    <span style="left: 0;margin-bottom: 0px;color: black;">{{ item.excerpt }}</span>
-                  </div>
-                </el-row>
-              </el-col>
-            </el-row>
-            <el-row>
-              <div style="padding: 14px">
-                <span style="left: 0;margin-bottom: 0px;color: black;">发布于: {{ item.publishAt }}</span>
-              </div>
-            </el-row>
-            <el-divider />
-          </div>
-          <el-col :span="18" class="pagination">
-            <el-pagination
-              :small="screenWidth <= 768"
-              layout="prev, pager, next"
-              :page-size="pageSize"
-              :current-page="currentPage"
-              :total="totalSize"
-              @current-change="handleCurrentChange"
-            />
-          </el-col>
-        </el-card>
-      </el-row>
-    </el-col>
-  </el-row>
-</template>
-
-<script>
-import {getArticles} from "@/api/article";
-
-export default {
-  name: 'Article',
-  filters: {
-    ellipsis(value) {
-      if (!value) return ''
-      const max = 50
-      if (value.length > max) {
-        return value.slice(0, max) + '...'
-      }
-      return value
-    }
-  },
-  components: {},
-  data() {
-    return {
-      navList: [
-        { path: '/post/publish', name: '发布', icon: 'el-icon-upload' },
-        { path: '/post/list', name: '稿件', icon: 'el-icon-files' },
-        { path: '/post/analysis', name: '数据', icon: 'el-icon-data-analysis' }
-      ],
-      // 屏幕宽度, 为了控制分页条的大小
-      screenWidth: document.body.clientWidth,
-      currentPage: 1,
-      pageSize: 12,
-      totalSize: 0,
-      dataList: [],
-    }
-  },
-  created() {
-    document.title = '文章主页'
-
-    this.getArticlesWrapper(this.currentPage)
-  },
-  mounted() {
-    // 当窗口宽度改变时获取屏幕宽度
-    window.onresize = () => {
-      return () => {
-        window.screenWidth = document.body.clientWidth
-        this.screenWidth = window.screenWidth
-      }
-    }
-  },
-  methods: {
-    handleCurrentChange(currentPage) {
-      this.currentPage = currentPage
-      this.getArticlesWrapper(this.currentPage)
-      // 回到顶部
-      scrollTo(0, 0)
-    },
-    getArticlesWrapper(page) {
-      getArticles(page).then(resp => {
-        if (resp.code === 0) {
-          const respData = resp.data
-          this.dataList = respData.list
-          this.totalSize = respData.totalSize
-        }
-      })
-    },
-    refresh() {
-      this.$notify({
-        message: '接口未实现',
-        type: 'info',
-        duration: 3000
-      })
-    }
-  }
-}
-</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: 120px;
-  display: block;
-}
-
-.clearfix:before,
-.clearfix:after {
-  display: table;
-  content: "";
-}
-
-.clearfix:after {
-  clear: both;
-}
-
-.not-result {
-  padding-top: 100px;
-  padding-bottom: 100px;
-  text-align: center;
-}
-
-</style>

src/views/post/VideoPost.vue

@@ -1,134 +1,162 @@
 <template>
   <el-row>
-    <el-row :md="6" :sm="12" :xs="12">
-      <el-table
-        :data="dataList"
-        border
-        style="width: 100%"
+    <el-table
+      :data="dataList"
+      border
+      style="width: 100%"
+    >
+      <el-table-column
+        fixed="left"
+        label="No"
+        type="index"
+      />
+      <el-table-column
+        prop="pubDate"
+        label="发布时间"
+        width="150"
+      />
+      <el-table-column
+        prop="coverUrl"
+        label="封面"
+        width="90"
       >
-        <el-table-column
-          fixed="left"
-          label="No"
-          type="index">
-        </el-table-column>
-        <el-table-column
-          prop="pubDate"
-          label="发布时间"
-          width="150">
-        </el-table-column>
-        <el-table-column
-          prop="coverUrl"
-          label="封面"
-          width="90">
-          <template slot-scope="scope">
-            <el-image :src="scope.row.coverUrl" min-width="30" height="20" />
-          </template>
-        </el-table-column>
-        <el-table-column
-          prop="videoId"
-          label="视频 ID"
-          width="120">
-          <template slot-scope="scope">
-            <router-link target="_blank" :to="`/video/${scope.row.videoId}`">
-              <span>{{scope.row.videoId}}</span>
-            </router-link>
-          </template>
-        </el-table-column>
-        <el-table-column
-          prop="title"
-          label="标题"
-          width="150">
-        </el-table-column>
-        <el-table-column
-          prop="description"
-          label="描述">
-          <template slot-scope="scope">
-            <span v-if="scope.row.description !== null">-</span>
-            <span v-else>{{scope.row.description}}</span>
-          </template>
-        </el-table-column>
-        <el-table-column
-          prop="duration"
-          label="时长">
-        </el-table-column>
-        <el-table-column
-          prop="direction"
-          label="方向">
-        </el-table-column>
-        <el-table-column
-          label="视频资源">
-          <template slot-scope="scope">
+        <template slot-scope="scope">
+          <el-image :src="scope.row.coverUrl" min-width="30" height="20" />
+        </template>
+      </el-table-column>
+      <el-table-column
+        prop="videoId"
+        label="视频 ID"
+        width="120"
+      >
+        <template slot-scope="scope">
+          <router-link target="_blank" :to="`/video/${scope.row.videoId}`">
+            <span>{{ scope.row.videoId }}</span>
+          </router-link>
+        </template>
+      </el-table-column>
+      <el-table-column
+        prop="title"
+        label="标题"
+        width="150"
+      />
+      <el-table-column
+        prop="description"
+        label="描述"
+      >
+        <template slot-scope="scope">
+          <span v-if="scope.row.description !== null">-</span>
+          <span v-else>{{ scope.row.description }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column
+        prop="duration"
+        label="时长"
+      />
+      <el-table-column
+        prop="direction"
+        label="方向"
+      />
+      <el-table-column
+        label="视频资源"
+      >
+        <template slot-scope="scope">
+          <el-button
+            size="mini"
+            @click="handleVideoResource(scope.$index, scope.row)"
+          >查看</el-button>
+        </template>
+      </el-table-column>
+      <el-table-column
+        prop="scope"
+        label="可见范围"
+        width="120"
+      >
+        <template slot-scope="scope">
+          <el-tooltip class="item" effect="dark" content="点击修改可见范围" placement="top-end">
             <el-button
+              v-if="scope.row.scope === 1"
               size="mini"
-              @click="handleVideoResource(scope.$index, scope.row)">查看</el-button>
-          </template>
-        </el-table-column>
-        <el-table-column
-          prop="scope"
-          label="可见范围"
-          width="120">
-          <template slot-scope="scope">
-            <el-tooltip class="item" effect="dark" content="点击修改可见范围" placement="top-end">
-              <el-button
-                v-if="scope.row.scope === 1"
-                size="mini"
-                @click="handleScope(scope.$index, scope.row)">本人可见</el-button>
-              <el-button
-                v-else-if="scope.row.scope === 2"
-                size="mini"
-                type="success"
-                @click="handleScope(scope.$index, scope.row)">所有人可见</el-button>
-              <el-button
-                v-else-if="scope.row.scope === 3"
-                size="mini"
-                type="warning"
-                @click="handleScope(scope.$index, scope.row)">VIP 可见</el-button>
-              <el-button
-                v-else
-                size="mini"
-                type="danger"
-                @click="handleScope(scope.$index, scope.row)">验证码可见</el-button>
-            </el-tooltip>
-          </template>
-        </el-table-column>
-        <el-table-column
-          prop="scope"
-          label="审核状态"
-          width="120">
-          <template slot-scope="scope">
-            <el-tag v-if="scope.row.status === 1" :type="'warning'" disable-transitions>
-              审核中
-            </el-tag>
-            <el-tag v-else-if="scope.row.status === 2" :type="'success'" disable-transitions>
-              审核通过
-            </el-tag>
-            <el-tag v-else-if="scope.row.status === 3" :type="'danger'" disable-transitions>
-              审核未通过
-            </el-tag>
-            <el-tag v-else :type="'danger'" disable-transitions>
-              下架
-            </el-tag>
-          </template>
-        </el-table-column>
-        <el-table-column
-          fixed="right"
-          label="操作"
-          width="280">
-          <template slot-scope="scope">
+              @click="handleScope(scope.$index, scope.row)"
+            >本人可见</el-button>
             <el-button
+              v-else-if="scope.row.scope === 2"
               size="mini"
-              @click="handlePreview(scope.$index, scope.row)">预览</el-button>
+              type="success"
+              @click="handleScope(scope.$index, scope.row)"
+            >所有人可见</el-button>
             <el-button
+              v-else-if="scope.row.scope === 3"
               size="mini"
-              @click="handleEdit(scope.$index, scope.row)">编辑</el-button>
+              type="warning"
+              @click="handleScope(scope.$index, scope.row)"
+            >VIP 可见</el-button>
             <el-button
+              v-else
               size="mini"
               type="danger"
-              @click="handleDelete(scope.$index, scope.row)">删除</el-button>
-          </template>
-        </el-table-column>
-      </el-table>
-    </el-row>
+              @click="handleScope(scope.$index, scope.row)"
+            >验证码可见</el-button>
+          </el-tooltip>
+        </template>
+      </el-table-column>
+      <el-table-column
+        prop="scope"
+        label="审核状态"
+        width="120"
+      >
+        <template slot-scope="scope">
+          <el-tag v-if="scope.row.status === 1" :type="'warning'" disable-transitions>
+            审核中
+          </el-tag>
+          <el-tag v-else-if="scope.row.status === 2" :type="'success'" disable-transitions>
+            审核通过
+          </el-tag>
+          <el-tag v-else-if="scope.row.status === 3" :type="'danger'" disable-transitions>
+            审核未通过
+          </el-tag>
+          <el-tag v-else-if="scope.row.status === 4" :type="'danger'" disable-transitions>
+            下架
+          </el-tag>
+          <el-tag v-else-if="scope.row.status === 5" :type="'danger'" disable-transitions>
+            待缓存
+          </el-tag>
+          <el-tag v-else-if="scope.row.status === 6" :type="'danger'" disable-transitions>
+            缓存中
+          </el-tag>
+          <el-tag v-else-if="scope.row.status === 7" :type="'danger'" disable-transitions>
+            缓存失败
+          </el-tag>
+          <el-tag v-else-if="scope.row.status === 8" :type="'danger'" disable-transitions>
+            封面不存在
+          </el-tag>
+          <el-tag v-else :type="'danger'" disable-transitions>
+            视频不存在
+          </el-tag>
+        </template>
+      </el-table-column>
+      <el-table-column
+        fixed="right"
+        label="操作"
+        width="280"
+      >
+        <template slot-scope="scope">
+          <el-button
+            size="mini"
+            @click="handlePreview(scope.$index, scope.row)"
+          >预览</el-button>
+          <el-button
+            size="mini"
+            @click="handleEdit(scope.$index, scope.row)"
+          >编辑</el-button>
+          <el-button
+            size="mini"
+            type="danger"
+            @click="handleDelete(scope.$index, scope.row)"
+          >删除</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
 
     <!-- 视频资源对话框 -->
     <el-dialog
@@ -144,40 +172,42 @@
       >
         <el-table-column
           label="No"
-          type="index">
-        </el-table-column>
+          type="index"
+        />
         <el-table-column
           prop="videoCodec"
-          label="原始视频">
-        </el-table-column>
+          label="原始视频"
+        />
         <el-table-column
           prop="videoCodec"
-          label="视频编码">
-        </el-table-column>
+          label="视频编码"
+        />
         <el-table-column
           prop="audioCodec"
-          label="音频编码">
-        </el-table-column>
+          label="音频编码"
+        />
         <el-table-column
           prop="quality"
-          label="画质">
-        </el-table-column>
+          label="画质"
+        />
         <el-table-column
           prop="urlType"
-          label="URL 类型">
-        </el-table-column>
+          label="URL 类型"
+        />
         <el-table-column
           prop="url"
-          label="URL">
-        </el-table-column>
+          label="URL"
+        />
         <el-table-column
           fixed="right"
           label="操作"
-          width="280">
+          width="280"
+        >
           <template slot-scope="scope">
             <el-button
               size="mini"
-              @click="handleConvert(scope.$index, scope.row)">转码</el-button>
+              @click="handleConvert(scope.$index, scope.row)"
+            >转码</el-button>
           </template>
         </el-table-column>
       </el-table>
@@ -214,7 +244,7 @@
       center
     >
       <template>
-        <video-preview-player :video-prop.sync="this.videoProp"/>
+        <video-preview-player :video-prop.sync="this.videoProp" />
       </template>
     </el-dialog>
   </el-row>
@@ -222,19 +252,20 @@
 
 <script>
 import VideoPreviewPlayer from 'components/VideoPreviewPlayer'
-import { updateVideoScope, videoInfo, deleteVideoPost, getVideoResource, convertVideo } from "@/api/video";
+import { updateVideoScope, videoInfo, deleteVideoPost, getVideoResource, convertVideo, getVideoPosts } from '@/api/video'
 
 export default {
   name: 'VideoPost',
-  props: {
-    dataList: {
-      type: Array,
-      default: []
-    },
-  },
   components: { VideoPreviewPlayer },
   data() {
     return {
+      // 屏幕宽度, 为了控制分页条的大小
+      screenWidth: document.body.clientWidth,
+      currentPage: 1,
+      pageSize: 12,
+      totalSize: 0,
+      dataList: [],
+      // **********************************************************************
       videoProp: null,
       showVideoResourceDialog: false,
       showEditScopeDialog: false,
@@ -247,8 +278,39 @@ export default {
     }
   },
   created() {
+    document.title = '视频稿件'
+    this.getData()
   },
   methods: {
+    handleCurrentChange(pageNumber) {
+      this.currentPage = pageNumber
+      this.getData()
+      // 回到顶部
+      scrollTo(0, 0)
+    },
+    getData() {
+      this.dataList = []
+      getVideoPosts(this.currentPage).then(resp => {
+        if (resp.code === 0) {
+          this.dataList = resp.data.list
+          this.totalSize = resp.data.totalSize
+        } else {
+          this.$notify({
+            title: '提示',
+            message: resp.msg,
+            type: 'warning',
+            duration: 3000
+          })
+        }
+      }).catch(error => {
+        this.$notify({
+          title: '提示',
+          message: error.message,
+          type: 'error',
+          duration: 3000
+        })
+      })
+    },
     handleVideoResource(index, row) {
       const videoId = row.videoId
       this.showVideoResourceDialog = true
@@ -261,7 +323,7 @@ export default {
     },
     handleScope(index, row) {
       this.form.videoId = row.videoId
-      this.form.scope = ''+row.scope
+      this.form.scope = '' + row.scope
       this.showEditScopeDialog = true
     },
     handleDialogClose(done) {