更新文章稿件相关页面和接口

src/api/article.js

@@ -1,28 +1,45 @@
 import {delete0, get, post} from '@/utils/request'
 
 const articleApi = {
-  audioSubmitApi: '/api/content/post/article/submit',
-  userAudioApi: '/api/content/post/article/user',
-  audioInfoApi: '/api/content/post/article',
-  updateAudioScopeApi: '/api/content/post/article/scope',
+  articlePostApi: '/api/content/post/article',
+  updateArticleScopeApi: '/api/content/post/article/update/scope',
+  updateArticleContentApi: '/api/content/post/article/update/content',
+  articleApi: '/api/content/article',
+  userArticleApi: '/api/content/article/user',
 }
 
 export function submitArticle(data) {
-  return post(articleApi.audioSubmitApi, data)
+  return post(articleApi.articlePostApi, data)
 }
 
-export function updateArticleScope(audioScope) {
-  return post(articleApi.updateAudioScopeApi, audioScope)
+export function updateArticleScope(jsonData) {
+  return post(articleApi.updateArticleScopeApi, jsonData)
+}
+
+export function updateArticleContent(jsonData) {
+  return post(articleApi.updateArticleContentApi, jsonData)
 }
 
 export function deleteArticle(videoId) {
-  return delete0(articleApi.audioInfoApi + '/' + videoId)
+  return delete0(articleApi.articleApi + '/' + videoId)
+}
+
+export function getArticlePosts(page) {
+  return get(articleApi.articlePostApi + '?page=' + page)
+}
+
+export function getArticlePost(articleId) {
+  return get(articleApi.articlePostApi + '/' + articleId)
 }
 
 export function getArticles(page) {
-  return get(articleApi.userAudioApi + '?page=' + page)
+  return get(articleApi.articleApi + '?page=' + page)
+}
+
+export function getUserArticles(userId, page) {
+  return get(articleApi.userArticleApi + '?userId=' + userId + '&page=' + page)
 }
 
 export function getArticle(articleId) {
-  return get(articleApi.audioInfoApi + '/' + articleId)
+  return get(articleApi.articleApi + '/' + articleId)
 }

src/components/upload/RichText.vue → src/components/RichText.vue

@@ -1,7 +1,7 @@
 <template>
   <quill-editor
     ref="myTextEditor"
-    v-model="content"
+    v-model="text"
     class="editor"
     :options="editorOption"
     @change="onEditorChange($event)"
@@ -28,9 +28,15 @@ const toolbar = [
 
 export default {
   name: 'RichText',
+  props: {
+    text: {
+      type: String,
+      default: ''
+    }
+  },
   data() {
     return {
-      content: null, // 内容
+      content: '', // 内容
       editorOption: {
         modules: {
           toolbar

src/components/card/ArticleCard.vue

@@ -20,8 +20,6 @@
 </template>
 
 <script>
-import { handleVisited } from 'assets/js/utils'
-
 export default {
   name: 'ArticleCard',
   filters: {
@@ -46,87 +44,13 @@ export default {
     }
   },
   methods: {
-    getVisited(visited) {
-      return handleVisited(visited)
-    },
-    convertTimestamp(value) {
-      const date = new Date(value*1000)
-      var month = date.getMonth()
-      if (month < 10) {
-        if (month === 0) {
-          month = '01'
-        } else {
-          month = '0' + month
-        }
-      }
-
-      var day = date.getDay()
-      if (day < 10) {
-        day = '0' + day
-      }
-      return month + '-' + day
-    }
   }
 }
 </script>
 
 <style scoped>
-.time {
-  font-size: 15px;
-  color: #999;
-}
-
-.bottom {
-  margin-top: 13px;
-  line-height: 12px;
-}
-
-.tit {
-  font-weight: 700;
-  font-size: 18px;
-
-  height: 50px;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  display: -webkit-box;
-  -webkit-line-clamp: 2; /*行数*/
-  -webkit-box-orient: vertical;
-}
-
-.num {
-  position: relative;
-  font-size: 15px;
-  padding-top: 9px;
-}
-
 /*处于手机屏幕时*/
 @media screen and (max-width: 768px) {
-  .tit {
-    font-weight: 600;
-    font-size: 12px;
-    height: 32px;
-  }
-  .time {
-    font-size: 10px;
-    color: #999;
-  }
-  .num {
-    font-size: 9px;
-    padding-top: 3px;
-  }
-  .bottom {
-    margin-top: 2px;
-    line-height: 7px;
-  }
-  .coverImg {
-    height: 120px !important;
-  }
-}
-
-.coverImg {
-  width: 100%;
-  height: 175px;
-  display: block;
 }
 
 .clearfix:before,
@@ -138,25 +62,4 @@ export default {
 .clearfix:after {
   clear: both;
 }
-
-.card {
-  margin-bottom: 20px;
-  transition: all 0.6s; /*所有属性变化在0.6秒内执行动画*/
-}
-
-/*.card:hover {
-  !*鼠标放上之后元素变成1.06倍大小*!
-  transform: scale(1.06);
-}*/
-.imgs {
-  position: relative;
-}
-.play-icon {
-  position: absolute;
-  /*top: -15px;*/
-  right: 2%;
-  bottom: 5px;
-  z-index: 7;
-  width: 40px;
-}
 </style>

src/components/upload/EditArticle.vue

@@ -13,44 +13,26 @@
       <el-col :md="8" style="padding-right: 5px; padding-left: 5px; padding-bottom: 5px">
         <el-card class="box-card">
           <div slot="header" class="clearfix">
-            <span>更新音频稿件信息</span>
-            <el-button style="float: right; padding: 3px 0" type="text" @click="onUpdateVideoInfo">更新</el-button>
+            <span>更新文章标题</span>
+            <el-button style="float: right; padding: 3px 0" type="text" @click="onUpdateArticleTitle">更新</el-button>
           </div>
           <div class="text item">
-            <el-form ref="form" :model="form" label-width="80px">
+            <el-form ref="form" :model="titleForm" label-width="80px">
               <el-form-item label="标题">
-                <el-input v-model="form.title" style="width: 70%; padding-right: 2px" placeholder="标题不能超过 50 个字符" />
-              </el-form-item>
-              <el-form-item label="描述">
-                <el-input v-model="form.description" type="textarea" style="width: 70%; padding-right: 2px" />
+                <el-input v-model="titleForm.title" style="width: 70%; padding-right: 2px" placeholder="标题不能超过 50 个字符" />
               </el-form-item>
             </el-form>
           </div>
         </el-card>
       </el-col>
-      <el-col :md="12" style="padding-right: 5px; padding-left: 5px; padding-bottom: 5px">
+      <el-col :md="16" style="padding-right: 5px; padding-left: 5px; padding-bottom: 5px">
         <el-card class="box-card">
           <div slot="header" class="clearfix">
-            <span>更新音频文件</span>
-            <el-button style="float: right; padding: 3px 0" type="text" @click="onUpdateVideoFile">更新</el-button>
+            <span>更新文章内容</span>
+            <el-button style="float: right; padding: 3px 0" type="text" @click="onUpdateArticleContent">更新</el-button>
           </div>
-          <div class="text item">
-            <uploader
-              class="uploader-example"
-              :options="options"
-              :auto-start="true"
-              @file-added="onFileAdded"
-              @file-success="onFileSuccess"
-              @file-progress="onFileProgress"
-              @file-error="onFileError"
-            >
-              <uploader-unsupport />
-              <uploader-drop>
-                <p>拖动音频文件到此处或</p>
-                <uploader-btn :attrs="attrs">选择音频文件</uploader-btn>
-              </uploader-drop>
-              <uploader-list />
-            </uploader>
+          <div>
+            <rich-text :text="form.content" @content=processContent style="width: 80%; padding-right: 2px" />
           </div>
         </el-card>
       </el-col>
@@ -59,165 +41,72 @@
 </template>
 
 <script>
-import { getAudioPost, } from '@/api/audio'
+import RichText from '@/components/RichText'
+
+import {getArticlePost, updateArticleContent,} from '@/api/article'
 
 export default {
   name: 'EditArticle',
+  components: { RichText },
   data() {
     return {
-      /***********************************************************************/
-      options: {
-        target: '//oss.reghao.cn/',
-        chunkSize: 1024 * 1024 * 1024, // 1GiB
-        fileParameterName: 'file',
-        testChunks: false,
-        query: (file, chunk) => {
-          return {
-            channelId: 2
-          }
-        },
-        headers: {
-          Authorization: '1234567890'
-        }
-      },
-      attrs: {
-        accept: 'audio/*'
-      },
-      imgHeaders: {
-        Authorization: '1234567890'
-      },
-      imgData: {
-        channelId: 3
+      titleForm: {
+        articleId: null,
+        title: null,
       },
-      /***********************************************************************/
-      coverUrl: null,
-      coverFile: null,
-      imageList: [],
-      imageUrl: '',
-      // 提交给后端的数据
-      tagsStr: null,
       form: {
-        videoFileId: null,
-        coverUrl: null,
-        title: null,
-        description: null,
-        categoryId: 0,
-        tags: [],
-        scope: null,
-        width: 0,
-        height: 0,
-        duration: 0
+        articleId: null,
+        content: null,
       },
-      videoInfo: null
     }
   },
   created() {
-    document.title = '编辑音频'
+    document.title = '编辑文章稿件'
 
-    const audioId = this.$route.params.audioId
-    getAudioPost(audioId).then(res => {
-      if (res.code === 0) {
-        const audioInfo = res.data
-        this.imageUrl = audioInfo.coverUrl
-        this.form.title = audioInfo.title
-        this.form.description = audioInfo.description
-        this.form.scope = audioInfo.scope
+    const articleId = this.$route.params.articleId
+    getArticlePost(articleId).then(resp => {
+      if (resp.code === 0) {
+        const respData = resp.data
+        this.titleForm.articleId = respData.articleId
+        this.titleForm.title = respData.title
+
+        this.form.articleId = respData.articleId
+        this.form.content = respData.content
       } else {
       }
     })
   },
   methods: {
-    /***********************************************************************/
-    onFileAdded(file) {
-      if (file.file.size > 1024*1024*1024) {
-        file.cancel()
-        this.$notify(
-          {
-            title: '提示',
-            message: '音频文件应小于 1GiB',
-            type: 'warning',
-            duration: 3000
-          }
-        )
-        return
-      }
-      this.setTitle(file.file.name)
-      this.processVideo(file.file)
+    processContent(value) {
+      this.form.content = value
     },
-    onFileProgress(rootFile, file, chunk) {
+    onReturnArticle() {
+      this.$router.push('/post/article')
     },
-    onFileSuccess(rootFile, file, response, chunk) {
-      const res = JSON.parse(response)
-      if (res.code === 0) {
-        const resData = res.data
-        this.form.audioFileId = resData.uploadId
-
-        this.$notify(
-          {
-            title: '提示',
-            message: '音频已上传',
+    onUpdateArticleContent() {
+      updateArticleContent(this.form).then(resp => {
+        if (resp.code === 0) {
+          this.$notify({
+            message: '已更新',
+            type: 'info',
+            duration: 3000
+          })
+        } else {
+          this.$notify({
+            message: '更新失败',
             type: 'warning',
             duration: 3000
-          }
-        )
-      }
-    },
-    onFileError(rootFile, file, response, chunk) {
-      this.$notify(
-        {
-          title: '提示',
-          message: '文件上传错误',
-          type: 'warning',
-          duration: 3000
+          })
         }
-      )
-    },
-    /***********************************************************************/
-    beforeAvatarUpload(file) {
-      const isJPG = file.type === 'image/jpeg'
-      const isLt2M = file.size / 1024 / 1024 < 2
-      if (!isJPG) {
-        this.$message.error('上传头像图片只能是 JPG 格式!')
-      }
-      if (!isLt2M) {
-        this.$message.error('上传头像图片大小不能超过 2MB!')
-      }
-      return isJPG && isLt2M
-    },
-    handleAvatarSuccess(res, file) {
-      this.imageList.push(file)
-      this.imageUrl = URL.createObjectURL(file.raw)
-      if (res.code === 0) {
-        const resData = res.data
-        const uploadId = resData.uploadId
-        const url = resData.url
-      } else {
-
-      }
-    },
-    setTitle(title) {
-      if (title.length > 50) {
-        this.form.title = title.substring(0, 50)
-        this.form.description = title
-      } else {
-        this.form.title = title
-      }
+      })
     },
-    onReturnArticle() {
-      this.$router.push('/post/article')
-    },
-    onUpdateVideoFile() {
-      console.log('更新文章文件')
+    onUpdateArticleTitle() {
+      this.$notify({
+        message: '接口未实现',
+        type: 'warning',
+        duration: 3000
+      })
     },
-    onUpdateVideoCover() {
-      console.log('更新音频封面')
-    },
-    onUpdateVideoInfo() {
-      console.log('更新音频信息')
-    },
-    onUpdateVideoScope() {
-      console.log('更新音频作用域')
-    }
   }
 }
 </script>
@@ -230,10 +119,6 @@ export default {
     padding-left: 0.5%;
     padding-right: 0.5%;
   }
-
-  .coverImg {
-    height: 120px !important;
-  }
 }
 
 .movie-list {
@@ -241,45 +126,4 @@ export default {
   padding-left: 6%;
   padding-right: 6%;
 }
-
-.uploader-example {
-  width: 500px;
-  padding: 15px;
-  margin: 40px auto 0;
-  font-size: 12px;
-  box-shadow: 0 0 10px rgba(0, 0, 0, .4);
-}
-.uploader-example .uploader-btn {
-  margin-right: 4px;
-}
-.uploader-example .uploader-list {
-  max-height: 440px;
-  overflow: auto;
-  overflow-x: hidden;
-  overflow-y: auto;
-}
-
-.avatar-uploader .el-upload {
-  border: 1px dashed #d9d9d9;
-  border-radius: 6px;
-  cursor: pointer;
-  position: relative;
-  overflow: hidden;
-}
-.avatar-uploader .el-upload:hover {
-  border-color: #409EFF;
-}
-.avatar-uploader-icon {
-  font-size: 28px;
-  color: #8c939d;
-  width: 320px;
-  height: 240px;
-  line-height: 178px;
-  text-align: center;
-}
-.avatar {
-  width: 320px;
-  height: 240px;
-  display: block;
-}
 </style>

src/components/upload/PublishArticle.vue

@@ -22,7 +22,7 @@
 </template>
 
 <script>
-import RichText from '@/components/upload/RichText'
+import RichText from '@/components/RichText'
 import { submitArticle } from "@/api/article";
 
 export default {

src/router/index.js

@@ -31,6 +31,7 @@ const PostEditAudio = () => import('components/upload/EditAudio')
 const PostPublishAlbum = () => import('views/post/PostPublish')
 const PostEditAlbum = () => import('components/upload/EditImage')
 const PostPublishArticle = () => import('views/post/PostPublish')
+const PostEditArticle = () => import('components/upload/EditArticle')
 const PostList = () => import('views/post/PostList')
 const UserPostVideo = () => import('views/post/PostList')
 const UserPostAudio = () => import('views/post/PostList')
@@ -265,6 +266,11 @@ const routes = [
     name: 'PostPublishArticle',
     component: PostPublishArticle
   },
+  {
+    path: '/post/edit/article/:articleId',
+    name: 'PostEditArticle',
+    component: PostEditArticle
+  },
   {
     path: '/post/list',
     name: 'PostList',

src/views/home/Article.vue

@@ -1,6 +1,6 @@
 <template>
   <div>
-    <el-row v-if="!showEmpty" id="movie-list">
+    <el-row v-if="totalSize !== 0" id="movie-list">
       <el-col :md="24">
         <div>
           <el-col v-for="(item, index) in dataList"
@@ -29,7 +29,7 @@
         </el-col>
       </el-col>
     </el-row>
-    <el-row v-if="showEmpty" class="not-result">
+    <el-row v-else class="not-result">
       <el-col :span="12" :offset="6">
         <img src="@/assets/img/icon/not-result.png">
         <div>没有文章数据</div>
@@ -50,22 +50,15 @@ export default {
       // 屏幕宽度, 为了控制分页条的大小
       screenWidth: document.body.clientWidth,
       currentPage: 1,
-      videoList: [],
-      video: null,
-      showEmpty: true
+      pageSize: 12,
+      totalSize: 0,
+      dataList: [],
     }
   },
   created() {
     document.title = '文章主页'
 
-    this.currentPage = 1
-    getArticles(this.currentPage).then(res => {
-      if (res.code === 0) {
-        const resData = res.data
-        this.videoList = resData.list
-        this.video = resData.list[0]
-      }
-    })
+    this.getArticlesWrapper(this.currentPage)
   },
   mounted() {
     // 当窗口宽度改变时获取屏幕宽度
@@ -79,11 +72,20 @@ export default {
   methods: {
     handleCurrentChange(currentPage) {
       this.currentPage = currentPage
-      this.$store.commit('updatePage', currentPage)
-      this.$store.dispatch('getPageBean')
+      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
+          console.log(this.dataList)
+        }
+      })
+    },
   }
 }
 </script>

src/views/home/ArticlePage.vue

@@ -21,7 +21,7 @@
                   <span v-html="userAvatar.screenName"></span>
                 </el-row>
                 <el-row>
-                  <span>一路走好</span>
+                  <span>-</span>
                 </el-row>
               </el-col>
             </el-row>
@@ -47,20 +47,30 @@
       </el-row>
     </el-col>
     <el-col :md="6">
-      <user-avatar-card :userAvatar="userAvatar" />
-      <user-avatar-card :userAvatar="userAvatar" />
+      <el-row style="padding-right: 5px; padding-left: 5px; padding-bottom: 5px">
+        <el-card class="box-card">
+          <div slot="header" class="clearfix">
+            <el-row>
+              <span>推荐文章</span>
+            </el-row>
+          </div>
+          <div class="text item">
+            <el-row>
+            </el-row>
+          </div>
+        </el-card>
+      </el-row>
     </el-col>
   </el-row>
 </template>
 
 <script>
-import UserAvatarCard from '@/components/card/UserAvatarCard'
 import { getArticle } from "@/api/article";
 import {getUserInfo} from "@/api/user";
 
 export default {
   name: 'ArticlePage',
-  components: { UserAvatarCard },
+  components: {},
   filters: {
     ellipsis(value) {
       if (!value) return ''
@@ -81,28 +91,33 @@ export default {
   },
   created() {
     const articleId = this.$route.params.articleId
-    getArticle(articleId).then(res => {
-      if (res.code === 0) {
-        this.article = res.data
+    getArticle(articleId).then(resp => {
+      if (resp.code === 0) {
+        this.article = resp.data
         document.title = '文章 - ' + this.article.title
+
+        getUserInfo(this.article.userId).then(resp => {
+          if (resp.code === 0) {
+            this.userAvatar = resp.data
+          }
+        })
       } else {
       }
-
-      getUserInfo(10001).then(res => {
-        if (res.code === 0) {
-          this.userAvatar = res.data
-        }
-      })
     })
   },
   methods: {
     collectItem() {
+      this.$notify({
+        message: '接口未实现',
+        type: 'info',
+        duration: 3000
+      })
       if (this.collected) {
-        console.log('取消收藏音频')
+        console.log('取消收藏')
         this.collected = false
         this.collectedIcon = 'el-icon-star-off'
       } else {
-        console.log('收藏音频')
+        console.log('收藏')
         this.collected = true
         this.collectedIcon = 'el-icon-star-on'
       }

src/views/post/ArticlePost.vue

@@ -15,6 +15,11 @@
         <el-table-column
           prop="title"
           label="文章标题">
+          <template slot-scope="scope">
+            <router-link target="_blank" :to="`/article/${scope.row.articleId}`">
+              <span>{{scope.row.title}}</span>
+            </router-link>
+          </template>
         </el-table-column>
         <el-table-column
           prop="scope"
@@ -112,20 +117,31 @@ export default {
       this.showEditScopeDialog = true
     },
     handleEdit(index, row) {
-      const path = '/post/edit/audio/' + row.articleId
+      const path = '/post/edit/article/' + row.articleId
       this.$router.push(path)
     },
     handleDelete(index, row) {
-      deleteArticle(row.articleId).then(res => {
-         if (res.code === 0) {
-           this.$notify({
-             title: '提示',
-             message: '稿件已删除',
-             type: 'warning',
-             duration: 3000
-           })
-           this.$router.go(0)
-         }
+      this.$confirm('确定要删除 ' + row.title + '?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        deleteArticle(row.articleId).then(res => {
+          if (res.code === 0) {
+            this.$notify({
+              title: '提示',
+              message: '稿件已删除',
+              type: 'warning',
+              duration: 3000
+            })
+            // this.$router.go(0)
+          }
+        })
+      }).catch(() => {
+        this.$message({
+          type: 'info',
+          message: '已取消'
+        })
       })
     },
     onUpdateScope() {

src/views/post/PostList.vue

@@ -57,7 +57,7 @@ import ArticlePost from "@/views/post/ArticlePost";
 import { userVideoPost } from "@/api/video";
 import { getAudioPosts } from "@/api/audio";
 import { getUserAlbums } from "@/api/image";
-import { getArticles } from "@/api/article";
+import { getArticlePosts } from "@/api/article";
 
 export default {
   name: 'PostList',
@@ -190,7 +190,7 @@ export default {
       } else if (this.activeName === 'article') {
         this.currentPage = 1
         this.lastId = 0
-        getArticles(1).then(res => {
+        getArticlePosts(this.currentPage).then(res => {
           if (res.code === 0) {
             const resData = res.data.list
             if (resData.length !== 0) {

src/views/user/Home.vue

@@ -136,14 +136,14 @@ import StatusCard from '@/components/card/StatusCard'
 import VideoCard from '@/components/card/VideoCard'
 import AudioCard from '@/components/card/AudioCard'
 import ImageAlbumCard from '@/components/card/ImageAlbumCard'
-import ArticleCard from 'components/card/ArticleCard'
+import ArticleCard from '@/components/card/ArticleCard'
 
 import { getUserInfo, checkRelation, followUser, unfollowUser } from "@/api/user";
 import { getUserContentData, userVideoCard } from "@/api/video";
 import { getUserAlbums1 } from "@/api/image";
 import { getUserAudios } from "@/api/audio";
 import { userStatus } from "@/api/status";
-import { getArticles } from "@/api/article";
+import { getUserArticles } from "@/api/article";
 
 export default {
   name: 'Home',
@@ -169,9 +169,9 @@ export default {
   },
   created() {
     this.userId = this.$route.params.id
-    getUserInfo(this.userId).then(res => {
-      if (res.code === 0) {
-        this.user = res.data
+    getUserInfo(this.userId).then(resp => {
+      if (resp.code === 0) {
+        this.user = resp.data
         const path = this.$route.path
         if (path.endsWith("video")) {
           this.activeName = 'video'
@@ -194,17 +194,17 @@ export default {
         this.getData()
       }
     })
-    checkRelation(this.userId).then(res => {
-      if (res.code === 0) {
-        if (res.data) {
+    checkRelation(this.userId).then(resp => {
+      if (resp.code === 0) {
+        if (resp.data) {
           this.followButton.text = '已关注'
           this.followButton.icon = 'el-icon-check'
         }
       }
     })
-    getUserContentData(this.userId).then(res => {
-      if (res.code === 0) {
-        this.userContentData = res.data
+    getUserContentData(this.userId).then(resp => {
+      if (resp.code === 0) {
+        this.userContentData = resp.data
       }
     })
   },
@@ -223,10 +223,25 @@ export default {
     }
   },
   methods: {
-    initPagination() {
-      this.pageSize = 12
-      this.currentPage = 1
-      this.totalSize = 0
+    followUser(userId) {
+      if (this.followButton.text === '关注') {
+        followUser(userId).then(resp => {
+          if (resp.code === 0) {
+            this.followButton.text = '已关注'
+            this.followButton.icon = 'el-icon-check'
+          }
+        })
+      } else {
+        unfollowUser(userId).then(resp => {
+          if (resp.code === 0) {
+            this.followButton.text = '关注'
+            this.followButton.icon = 'el-icon-plus'
+          }
+        })
+      }
+    },
+    sendMessage(userId) {
+      console.log('发送消息')
     },
     handleCurrentChange(pageNumber) {
       this.currentPage = pageNumber
@@ -251,12 +266,12 @@ export default {
       if (this.activeName === 'video') {
         this.userVideoListWrapper(this.currentPage, this.userId)
       } else if (this.activeName === 'image') {
-        getUserAlbums1(this.userId).then(res => {
-          if (res.code === 0) {
-            const resData = res.data
-            if (resData.length !== 0) {
+        getUserAlbums1(this.userId).then(resp => {
+          if (resp.code === 0) {
+            const respData = resp.data
+            if (respData.length !== 0) {
               this.showEmpty = false
-              for (const item of resData) {
+              for (const item of respData) {
                 this.dataList.push(item)
               }
             } else {
@@ -265,12 +280,12 @@ export default {
           }
         })
       } else if (this.activeName === 'audio') {
-        getUserAudios(this.userId, this.currentPage).then(res => {
-          if (res.code === 0) {
-            const resData = res.data.list
-            if (resData.length !== 0) {
+        getUserAudios(this.userId, this.currentPage).then(resp => {
+          if (resp.code === 0) {
+            const respData = resp.data.list
+            if (respData.length !== 0) {
               this.showEmpty = false
-              for (const item of resData) {
+              for (const item of respData) {
                 this.dataList.push(item)
               }
             } else {
@@ -279,12 +294,12 @@ export default {
           }
         })
       } else if (this.activeName === 'article') {
-        getArticles(this.currentPage).then(res => {
-          if (res.code === 0) {
-            const resData = res.data.list
-            if (resData.length !== 0) {
+        getUserArticles(this.userId, this.currentPage).then(resp => {
+          if (resp.code === 0) {
+            const respData = resp.data.list
+            if (respData.length !== 0) {
               this.showEmpty = false
-              for (const item of resData) {
+              for (const item of respData) {
                 this.dataList.push(item)
               }
             } else {
@@ -296,32 +311,12 @@ export default {
         this.userStatusListWrapper(this.currentPage, this.userId)
       }
     },
-    followUser(userId) {
-      if (this.followButton.text === '关注') {
-        followUser(userId).then(res => {
-          if (res.code === 0) {
-            this.followButton.text = '已关注'
-            this.followButton.icon = 'el-icon-check'
-          }
-        })
-      } else {
-        unfollowUser(userId).then(res => {
-          if (res.code === 0) {
-            this.followButton.text = '关注'
-            this.followButton.icon = 'el-icon-plus'
-          }
-        })
-      }
-    },
-    sendMessage(userId) {
-      console.log('发送消息')
-    },
     userVideoListWrapper(pageNumber, userId) {
-      userVideoCard(pageNumber, userId).then(res => {
-        if (res.code === 0) {
-          const resData = res.data
-          this.dataList = resData.list
-          this.totalSize = resData.totalSize
+      userVideoCard(pageNumber, userId).then(resp => {
+        if (resp.code === 0) {
+          const respData = resp.data
+          this.dataList = respData.list
+          this.totalSize = respData.totalSize
           if (this.dataList.length !== 0) {
             this.showEmpty = false
           } else {
@@ -331,9 +326,9 @@ export default {
       })
     },
     userStatusListWrapper(pageNumber, userId) {
-      userStatus(userId, pageNumber).then(res => {
-        if (res.code === 0) {
-          this.dataList = res.data.list
+      userStatus(userId, pageNumber).then(resp => {
+        if (resp.code === 0) {
+          this.dataList = resp.data.list
           if (this.dataList.length === 0) {
             this.showEmpty = true
           } else {