add 用户头像上传

src/components/Home/SearchInput.vue

@@ -17,6 +17,7 @@
                     </div>
                     <div v-if="historySearch!==null" v-show="this.$cookie.get('username')!=null">
                         <el-tag
+                            v-show="historySearch.length!==0"
                             v-for="(tag,index) in historySearch"
                             :key="index"
                             size="small"
@@ -87,7 +88,7 @@ export default {
             isMouseOver: false,
             search: '',
             tipsWord: '',
-            historySearch: null,
+            historySearch: [],
             searchResults:[],
             update:true,
         }
@@ -102,6 +103,7 @@ export default {
           this.searchResults=[];
         },
         clearHistory() {
+            var that=this;
             axios({
                 method: 'post',
                 // 请求的地址
@@ -117,6 +119,9 @@ export default {
                         type: 'success',
                         offset: 50
                     });
+                    setTimeout(()=>{
+                        that.gethistorySearch();
+                    })
                 } else {
                     Vue.prototype.$notify.error({
                         title: '错误',
@@ -149,6 +154,7 @@ export default {
             });
         },
         handleClose(tag){
+            var that=this;
             axios({
                 method: 'post',
                 // 请求的地址
@@ -165,6 +171,9 @@ export default {
                         type: 'success',
                         offset: 50
                     });
+                    setTimeout(()=>{
+                        that.gethistorySearch();
+                    })
                 }else{
                     Vue.prototype.$notify.error({
                         title: '错误',

src/components/Paper/ArticleDetail.vue

@@ -3,7 +3,7 @@
         <div style="display: flex;flex-direction:column;flex-wrap: nowrap">
             <div class="PageHeader">
                 <br/>
-                <el-page-header  @back="goBack" style="margin-left: 20px">
+                <el-page-header  @back="goBack" style="margin-left: 50px;justify-content: center;">
                     <div slot="title" style="font-size:23px;font-weight: 600;"></div>
                     <div slot="content" style=";display: flex;flex-direction:row;justify-content: flex-start;font-size:23px;font-weight: 600;">
                         {{ArticleTitle}}

src/components/Project/ProjectDetail.vue

@@ -6,7 +6,7 @@
               <el-page-header  @back="goBack" style="justify-content: center;">
                   <div slot="title" style="font-size:23px;font-weight: 600;"></div>
                   <div slot="content" style="font-size:23px;font-weight: 600;">
-                      项目详情
+                     项目详情
                   </div>
               </el-page-header>
           </div>
@@ -30,7 +30,7 @@
                                 <span style="font-size: 14px;color: #6b7280;display: flex;justify-content: flex-start">
                                     HelloGitHub 评分
                                 </span>
-                                <el-rate v-model="totalStar" style="display: flex;justify-content: flex-start"  disabled show-score text-color="#ff9900"
+                                <el-rate v-model="average" style="display: flex;justify-content: flex-start"  disabled show-score text-color="#ff9900"
                                          score-template="{value}"></el-rate>
                                 <span style="font-size: 12px;color: #59A3A4;display: flex;justify-content: flex-start">
                                     {{ commentNum }} 个评分
@@ -118,14 +118,22 @@
                       <el-tabs v-model="activeName">
                           <el-tab-pane label="介绍" name="first">
                               <el-tiptap v-model="projectDescription"  :readonly="true" :showMenubar="false" :extensions="extensions" />
-                              <div style="display:flex;align-items: center;flex-direction: row;">
+                              <div style="display:flex;align-items: center;flex-direction: row;justify-content: space-between">
-                                  <span style="font-size: 14px;margin-top: 10px">收录于: </span><el-tag style="margin-left: 10px;margin-top: 10px" size="medium">第 {{periodicals}} 期</el-tag>
+                                  <div style="display: flex;flex-direction: row;flex-wrap: nowrap;align-items: center">
-                                  <div style="display: flex;flex-direction: row;margin-left: 10px;margin-top: 10px;align-items: center">
+                                      <span style="font-size: 14px;margin-top: 10px">收录于: </span><el-tag style="margin-left: 10px;margin-top: 10px" size="medium">第 {{periodicals}} 期</el-tag>
-                                      <span>标签: </span>
+                                      <div style="display: flex;flex-direction: row;margin-left: 10px;margin-top: 10px;align-items: center">
-                                      <div style="margin-left: 10px">
+                                          <span>标签: </span>
-                                          <el-tag v-for="(item,index) in CategoryName" :key="index" size="medium" style="margin-left: 10px">{{item}}</el-tag>
+                                          <div style="margin-left: 10px">
+                                              <el-tag v-for="(item,index) in CategoryName" :key="index" size="medium" style="margin-left: 10px">{{item}}</el-tag>
+                                          </div>
                                       </div>
                                   </div>
+
+                                  <div @click="toUserPage" style="cursor: pointer;display: flex;flex-direction: row;flex-wrap: nowrap;align-items: center">
+                                      <span style="font-size: 14px;margin-top: 10px">由</span>
+                                      <el-avatar class="avatar" style="margin-left: 5px;margin-right: 5px;margin-top: 10px" :src="userUri" :size="30"></el-avatar>
+                                      <span style="font-size: 14px;margin-top: 10px">分享</span>
+                                  </div>
                               </div>
 
                           </el-tab-pane>
@@ -144,7 +152,7 @@
                   <div class="text item">
                         <div style="display: flex;flex-direction: row;flex-wrap: nowrap">
                             <div style="width: 50px;height: 50px">
-                                <el-avatar v-if="this.$cookie.get('username')!=null" :size="50">{{this.$cookie.get('username')}}</el-avatar>
+                                <el-avatar v-if="this.$cookie.get('username')!=null" :src="imageUrl" :size="50"></el-avatar>
                                 <el-avatar v-if="this.$cookie.get('username')==null" :size="50">未登录</el-avatar>
                             </div>
                             <el-input
@@ -227,7 +235,7 @@
                                       <div v-for="(item,index) in commentContent" :key="index" style="display: flex;flex-direction: row;align-items: center;flex-wrap: nowrap;margin-top: 20px">
                                           <div style="display: flex;flex-direction: row">
                                               <div style="width: 50px;height: 50px;">
-                                                  <el-avatar  :size="50">{{item.username}}</el-avatar>
+                                                  <el-avatar   :size="50">{{item.username}}</el-avatar>
                                               </div>
                                               <div style="display: flex;flex-direction: column;justify-content: space-between">
                                                   <div style="display: flex;flex-direction: row;margin-left: 10px;align-items: center">
@@ -346,7 +354,9 @@ export default {
             checked:false,
             tabCheckedLast:true,
             tabCheckedHot:false,
-            averageStarNum:0,
+            username:'',
+            userUri:'',
+            average:0,
             github:{
                 starNum:null,
                 language:'',
@@ -362,12 +372,14 @@ export default {
             },
             totalStar:3.7,
             Content:'',
+            imageUrl:'',
         }
     },
     mounted() {
         this.getProjectDetail();
         this.getLastComment();
         this.isStart();
+        this.getUserInfo();
 
     },
     watch: {
@@ -378,7 +390,15 @@ export default {
         }
     },
     methods:{
-
+        toUserPage() {
+            this.$router.push({
+                path: '/UserInfoPage',
+                query: {
+                    name: this.username,
+                    refresh: true
+                }
+            })
+        },
         toComment(id){
             document.querySelector(id).scrollIntoView(true)
             var auchor=this.$el.querySelector(id)
@@ -402,6 +422,7 @@ export default {
                     id:this.$route.query.id
                 }
             }).then(function (res) {
+                // console.log(res);
                 that.CategoryName=res.data.CategoryName;
                 that.projectName=res.data.project.projectName;
                 that.projectTitle=res.data.project.projectTitle;
@@ -413,6 +434,10 @@ export default {
                 that.userId=res.data.project.userId;
                 that.projectId=res.data.project.projectId;
                 that.num=res.data.project.num;
+                that.average=res.data.project.average;
+                that.username=res.data.project.username;
+                that.userUri=res.data.project.userUri;
+
                 that.getDetailByGitHub();
             });
         },
@@ -435,7 +460,6 @@ export default {
                     trait:tab.name
                 }
             }).then(function (res) {
-                console.log(res);
                 that.commentContent=res.data;
                 that.commentNum=Object.keys(that.commentContent).length;
                 if(tab.name==='last'){
@@ -471,6 +495,7 @@ export default {
                                 offset: 50
                             });
                             that.getLastComment();
+                            that.getProjectDetail();
                             that.reload();
                         } else {
                             Vue.prototype.$notify.error({
@@ -501,6 +526,27 @@ export default {
         formatNumber(num) {
             return num >= 1e3 && num < 1e4 ? (num / 1e3).toFixed(1) + 'k' : num >= 1e4 ? (num / 1e4).toFixed(1) + 'w' : num
         },
+        getUserInfo() {
+            var that = this;
+            if(this.$cookie.get("username")!=null){
+                axios({
+                    method: 'post',
+                    // 请求的地址
+                    url: 'http://localhost:8082/helloGithub_war_exploded/retUser',
+                    // URL 中的查询参数
+                    params: {
+                        username: this.$cookie.get("username")
+                    }
+                }).then(function (res) {
+                    that.imageUrl = res.data.userAvatar;
+                    // console.log(res);
+                });
+            }else{
+                return;
+            }
+
+
+        },
 
         addLike(id){
             var that=this;
@@ -556,6 +602,7 @@ export default {
                     trait:'last'
                 }
             }).then(function (res) {
+                console.log(res);
                 that.commentContent=res.data;
                 that.commentNum=Object.keys(that.commentContent).length;
 
@@ -593,6 +640,7 @@ export default {
                         offset: 50
                     });
                 } else {
+                    this.getProjectDetail();
                     this.isStart();
                     this.$router.push({
                         path:'/ProjectDetail',
@@ -620,6 +668,7 @@ export default {
                         offset: 50
                     });
                 } else {
+                    this.getProjectDetail();
                     this.isStart();
                     // window.location.reload()
                     this.$router.push({
@@ -638,13 +687,12 @@ export default {
             axios({
                 method: 'get',
                 // 请求的地址
-                url: '/api/'+this.projectName,
+                url: '/github/'+this.projectName,
                 // URL 中的查询参数
                 params: {
 
                 }
             }).then((res)=>{
-                // console.log(res)
                 that.github.starNum=res.data.stargazers_count;
                 that.github.language=res.data.language;
                 that.github.watchers_count=res.data.watchers_count;
@@ -740,4 +788,8 @@ export default {
 ::v-deep .el-card__header{
     border-bottom: none;
 }
+
+::v-deep .avatar :hover{
+    transform: rotate(360deg);
+}
 </style>

src/components/Project/ProjectList.vue

@@ -19,7 +19,7 @@
                     <div>
                         <div class="circle" :style="{'background-color':colorlists[Math.floor(Math.random() * colorlists.length)]}" ></div>
                     </div>
-                    <el-tag size="mini" style="margin-left: 5px" v-html="projectLists.categoryName"></el-tag><span style="color: rgb(156 163 175);margin-left: 5px"> • </span>
+                    <el-tag size="mini" style="border-radius: 10px;margin-left: 5px" v-html="projectLists.categoryName"></el-tag><span style="color: rgb(156 163 175);margin-left: 5px"> • </span>
                     <div style="margin-left: 10px">
                         <span style="color: rgb(156 163 175); ">{{ formatTime }}</span>
                     </div>

src/components/User/UserArticles.vue

@@ -1,15 +1,72 @@
 <template>
-  <div style="display: flex;flex-direction: row;flex-wrap: nowrap">
+    <el-card style="border-radius: 10px;margin-top: 10px">
+        <div @click="goToArticleDetail" class="UserArticle" style="display: flex;flex-direction: row;flex-wrap: nowrap;cursor: pointer">
+            <div style="width: 60px;height: 60px;display: flex;flex-direction: row;align-content: center">
+                <el-avatar :src="article.articleico" style="display: flex;align-items: center;justify-content: center" shape="square" :size="60"></el-avatar>
+            </div>
+            <div style="margin-left: 10px;display: flex;flex-wrap: nowrap;flex-direction: column;">
+                <span style="display: flex;flex-direction: row;justify-content: flex-start;font-size: 18px;font-weight: bold;">
+                    {{article.ArticleTitle}}
+                </span>
+                <span style="font-size: 14px;color: #9ca3af;display: flex;flex-direction: row;justify-content: flex-start;flex-wrap: nowrap">
+                    {{brief}}
+                </span>
+                <div style="margin-top: 2.5px;display: flex;flex-direction: row;justify-content: space-between;align-content: center;align-items: center">
+                    <div style="display: flex;flex-direction: row;align-content: center">
+                        <span style="font-size: 13px;color: #9ca3af">
+                        作者: {{article.username}}
+                    </span>
+                     <span  style="margin-left: 10px;text-align: center;font-size: 13px;color: #9ca3af">
+                       发布于: {{article.publishtime}}
+                    </span>
+                    </div>
+                    <div style="margin-left: 5px;align-items: center;font-size: 13px;color: #9ca3af">
+                            <i class="el-icon-view"></i> <span>{{formatNumber(article.ReadCount)}}</span>
+                    </div>
+
+                </div>
+            </div>
+
+        </div>
+    </el-card>
 
-  </div>
 </template>
 
 <script>
 export default {
-    name: "UserArticles"
+    name: "UserArticles",
+    props:{
+      article:Object
+    },
+    data(){
+        return{
+        }
+    },
+    computed:{
+        brief: function() {
+            return this.article.ArticleContent.substr(0, 48) + '...';
+        },
+    },
+    methods:{
+        formatNumber(num) {
+            return num >= 1e3 && num < 1e4 ? (num / 1e3).toFixed(1) + 'k' : num >= 1e4 ? (num / 1e4).toFixed(1) + 'w' : num
+        },
+        goToArticleDetail(){
+            this.$router.push({
+                path:'/ArticleDetail',
+                query: {
+                    id: this.article.ArticleId,
+                    refresh: true
+                }})
+            // console.log(this.$route.query.id)
+        },
+    }
 }
 </script>
 
 <style scoped>
-
+.UserArticle:hover{
+    background-color: #eeeeee;
+    border-radius: 10px;
+}
 </style>

src/components/User/UserInfo.vue

@@ -2,7 +2,8 @@
     <div style="display: flex;flex-direction: column;flex-wrap: nowrap" v-show="this.$cookie.get('username')!=null">
         <div  style="display: flex;flex-direction: row;align-items: center;width: 11vw;justify-content: space-between">
             <div @click="toUserPage" style="display: flex;flex-direction: row;align-items: center">
-                <el-avatar  shape="square" style=" cursor: pointer;background-color: #59A3A4;box-shadow: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04)" size="large">{{this.$cookie.get('username')}}</el-avatar>
+<!--                <el-avatar v-if="imageUrl===''" shape="square" style=" cursor: pointer;box-shadow: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04)" size="large"></el-avatar>-->
+                <el-avatar shape="square" style=" cursor: pointer;box-shadow: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04)" :src="imageUrl" size="large">{{this.$cookie.get('username')}}</el-avatar>
                 <div style="margin-left: 5px;display: flex;flex-direction: column;justify-content: space-evenly">
                     <span style="cursor: pointer;font-weight: bold">{{this.$cookie.get('username')}}</span>
                     <span style="cursor: pointer;font-weight: 800;font-size: 13px;color: #3b82f6">Lv.1</span>
@@ -37,13 +38,15 @@ export default {
         return{
             switchValue:false,
             ContributionValue:0,
+            imageUrl:'',
         }
     },
     mounted() {
         this.getContributionValue();
+        this.getUserInfo();
     },
-    methods:{
+    methods: {
-        signOut(){
+        signOut() {
             this.$cookie.delete('username');
             // deletecookie
             axios({
@@ -51,29 +54,27 @@ export default {
                 // 请求的地址
                 url: 'http://localhost:8082/helloGithub_war_exploded/deletesession',
                 // URL 中的查询参数
-                params: {
+                params: {}
-                }
             });
-            if(this.$cookie.get('username')===null){
+            if (this.$cookie.get('username') === null) {
                 Vue.prototype.$notify({
                     title: '成功',
                     message: ('i', {style: 'color: teal'}, "退出成功！"),
                     type: 'success',
                     offset: 50
                 });
-                if(this.$route.path!=='/home'){
+                if (this.$route.path !== '/home') {
-                    setTimeout(()=>{
+                    setTimeout(() => {
                         this.$router.push({
-                            path:'/home'
+                            path: '/home'
                         })
-                    },800)
+                    }, 800)
-                }else {
+                } else {
                     window.location.reload();
                 }
 
 
-
+            } else {
-            }else{
                 Vue.prototype.$notify.error({
                     title: '错误',
                     message: ('i', {style: 'color: teal'}, "退出失败！"),
@@ -84,33 +85,53 @@ export default {
 
 
         },
-        toUserPage(){
+        toUserPage() {
             this.$router.push({
-                    path:'/UserInfoPage',
+                path: '/UserInfoPage',
-                    query: {
+                query: {
                     name: this.$cookie.get('username'),
                     refresh: true
-                }})
+                }
+            })
         },
-        getContributionValue(){
+        getContributionValue() {
-            var that=this;
+            var that = this;
             axios({
                 method: 'post',
                 // 请求的地址
                 url: 'http://localhost:8082/helloGithub_war_exploded/contributionValue',
                 // URL 中的查询参数
-                params: {
+                params: {}
-
+            }).then((res) => {
-                }
-            }).then((res)=>{
                 // console.log(res);
-                if(res.data.code===500){
+                if (res.data.code === 500) {
                     return;
-                }else{
+                } else {
-                    that.ContributionValue=res.data;
+                    that.ContributionValue = res.data;
                 }
 
             });
+        },
+        getUserInfo() {
+            var that = this;
+            if(this.$cookie.get("username")!=null){
+                axios({
+                    method: 'post',
+                    // 请求的地址
+                    url: 'http://localhost:8082/helloGithub_war_exploded/retUser',
+                    // URL 中的查询参数
+                    params: {
+                        username: this.$cookie.get("username")
+                    }
+                }).then(function (res) {
+                    that.imageUrl = res.data.userAvatar;
+                    // console.log(res);
+                });
+            }else{
+                return;
+            }
+
+
         }
     }
 }

src/components/User/UserInfoPage.vue

@@ -14,8 +14,8 @@
                 <el-card class="box-card" style="border: none;">
                     <div style="display: flex;flex-direction: row;flex-wrap: nowrap;justify-content: flex-start">
                         <div style="display: flex;flex-direction: row;justify-content: space-between">
-                            <div style="width: 100px;height: 100px;display: flex;flex-direction: row;align-items: center">
+                            <div @click="changeAvatar" style="cursor: pointer;width: 100px;height: 100px;display: flex;flex-direction: row;align-items: center">
-                                <el-avatar style="display: flex;align-items: center;justify-content: center" :size="90">{{username}}</el-avatar>
+                                <el-avatar  style="display: flex;align-items: center;justify-content: center" :src="imageUrl" :size="90"></el-avatar>
                             </div>
                             <div style="display: flex;flex-direction: column;margin-left: 15px;">
                                 <div style="display: flex;flex-direction: row;align-items: center;justify-content: flex-start;">
@@ -24,17 +24,21 @@
                                 </div>
                                 <span style="display: flex;justify-content:flex-start;margin-top: 10px;color: #6b7280;font-size: 15px">你是 HelloGitHub 社区的第<span style="font-size: 16px;color:#2b2e33;font-weight: bold "> {{userId}} </span>位用户，于 {{creatTime}} 加入。</span>
                                 <span style="display: flex;justify-content: flex-start;margin-top: 10px;color: #6b7280;font-size: 15px">
-                                    已分享
+                                    分享
                                     <span v-if="projectNum!=null" style="font-size: 16px;color:#2b2e33;font-weight: bold ">{{projectNum}}</span>
                                     <span v-if="projectNum==null" style="font-size: 16px;color:#2b2e33;font-weight: bold ">0</span>
-                                    个开源项目，
+                                    个开源项目,
                                     <span v-if="Object.keys(commentList).length!==0" style="font-size: 16px;color:#2b2e33;font-weight: bold ">{{Object.keys(commentList).length}}</span>
                                     <span v-if="Object.keys(commentList).length===0" style="font-size: 16px;color:#2b2e33;font-weight: bold ">0</span>
-                                    份项目评价，
+                                    份评价,
                                     共获得
                                     <span v-if="contributionValue!=null" style="font-size: 16px;color:#2b2e33;font-weight: bold ">{{contributionValue}}</span>
                                     <span v-if="contributionValue==null" style="font-size: 16px;color:#2b2e33;font-weight: bold ">0</span>
-                                    点贡献值。
+                                    点贡献值.
+                                    <span style="font-size: 16px;color:#2b2e33;font-weight: bold ">
+                                        {{Object.keys(article).length}}
+                                    </span>
+                                    篇文章。
                                 </span>
                             </div>
                             <el-progress type="circle" :percentage="contributionValue" :width="100"  :show-text="true"></el-progress>
@@ -82,16 +86,49 @@
                             <el-card style="border: none;display: flex;flex-direction: row;justify-content: flex-start;align-items: flex-start">
                                 <span style="font-size: 16px;font-weight: bold">总文章: {{Object.keys(article).length}} 篇</span>
                             </el-card>
-                            <el-empty v-show="like.length===0" description="暂无点赞" :image-size="115"></el-empty>
+                            <el-empty v-show="Object.keys(article).length===0" description="暂无点赞" :image-size="115"></el-empty>
-<!--                            <div v-show="like.length!==0" v-for="(item,index) in like" :key="index">-->
+                            <div v-show="Object.keys(article).length!==0" v-for="(item,index) in article" :key="index">
-<!--                                <UserProjects :project="item" :index="index"></UserProjects>-->
+                                <UserArticles :article="item"></UserArticles>
-<!--                            </div>-->
+                            </div>
+
                         </el-tab-pane>
                     </el-tabs>
                 </el-card>
             </div>
         </div>
         <RightTools></RightTools>
+        <el-dialog
+            title="修改头像"
+            :visible.sync="openChangeAvatar"
+            width="25vw"
+            append-to-body
+            :close-on-click-modal="false"
+            >
+            <div style="display: flex;flex-direction: row;align-items: center;justify-content: space-between">
+                <el-input placeholder="请输入头像链接" style="width: 17vw" v-model="AvatarUrl">
+                    <template slot="prepend">url:</template>
+                </el-input>
+                <el-button @click="changeAvatarByUrl" size="small" type="primary">上传<i class="el-icon-upload el-icon--right"></i></el-button>
+            </div>
+
+            <div style="margin-top: 10px;display: flex;flex-direction: row;align-items: center;justify-content: center">
+                <el-upload
+                    class="upload-demo"
+                    drag
+                    action=""
+                    :http-request="upload"
+                    multiple>
+                    <i class="el-icon-upload"></i>
+                    <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
+                    <div class="el-upload__tip" slot="tip">只能上传jpg/png文件。</div>
+                </el-upload>
+<!--                <form action="/upload/UploadHandle" enctype="multipart/form-data" method="post" target="_blank">-->
+<!--                    <input type="file" name="file1"><br>-->
+<!--                    <input type="submit" value="上传">-->
+<!--                </form>-->
+            </div>
+        </el-dialog>
+
     </div>
 </template>
 
@@ -100,10 +137,13 @@ import axios from "axios";
 import RightTools from "@/components/Home/RightTools.vue";
 import UserProjects from "@/components/User/UserProjects.vue";
 import UserComments from "@/components/User/UserComments.vue";
+import UserArticles from "@/components/User/UserArticles.vue";
+import Vue from "vue";
 
 export default {
+
     name: "UserInfoPage",
-    components: {UserComments, UserProjects, RightTools},
+    components: {UserArticles, UserComments, UserProjects, RightTools},
     data(){
         return{
             activeName:'first',
@@ -116,6 +156,9 @@ export default {
             commentList:[],
             like:[],
             article:[],
+            openChangeAvatar:false,
+            AvatarUrl:'',
+            imageUrl:'',
         }
     },
     mounted() {
@@ -130,7 +173,13 @@ export default {
             }
         }
     },
-
+    computed: {
+        headers() {
+            return {
+                "Content-Type": "multipart/form-data"
+            };
+        },
+    },
     methods: {
         goBack() {
             window.history.go(-1);
@@ -151,6 +200,7 @@ export default {
                 that.creatTime=res.data.creatTime;
                 that.projectNum=res.data.projectNum;
                 that.userId=res.data.userId;
+                that.imageUrl=res.data.userAvatar;
             });
         },
         getUserDetail(){
@@ -169,16 +219,125 @@ export default {
                 that.commentList=JSON.parse(res.data.comment);
                 that.like=JSON.parse(res.data.like)
                 that.article=JSON.parse(res.data.article);
-                console.log(Object.keys(that.article).length);
+                console.log(that.commentList);
             });
         },
+        changeAvatar(){
+            this.openChangeAvatar=true;
+        },
+        changeAvatarByUrl(){
+            var that=this;
+            if(this.AvatarUrl!==''){
+                axios({
+                    method: 'post',
+                    // 请求的地址
+                    url: 'http://localhost:8082/helloGithub_war_exploded/userAvatar',
+                    // URL 中的查询参数
+                    params: {
+                        url: this.AvatarUrl
+                    }
+                }).then(function (res) {
+                    if(res.data.code===200){
+                        Vue.prototype.$notify({
+                            title: '上传成功',
+                            message: ('i', {style: 'color: teal'}, res.data.msg),
+                            type: 'success',
+                            offset: 50
+                        });
+                        that.$root.URL=that.imageUrl;
+                    }else{
+                        Vue.prototype.$notify.error({
+                            title: '错误',
+                            message: "上传失败",
+                            offset: 50
+                        });
+                    }
+
+                });
+            }else{
+                Vue.prototype.$notify.error({
+                    title: '错误',
+                    message: "请先填写图片链接",
+                    offset: 50
+                });
+            }
+
+        },
+
+          upload(params){
+            const formData = new FormData();
+            formData.append("file", params.file);
+            axios({
+                method: 'post',
+                // 请求的地址
+                url: '/upload/UploadHandle',
+                headers:{"Content-Type": "multipart/form-data"},
+                // URL 中的查询参数
+                data:formData
+            }).then((res)=>{
+                console.log(res);
+                if(res.data.code===200){
+                    Vue.prototype.$notify({
+                        title: '成功',
+                        message: ('i', {style: 'color: teal'}, res.data.msg),
+                        type: 'success',
+                        offset: 50
+                    });
+                }else{
+                    Vue.prototype.$notify.error({
+                        title: '错误',
+                        message: res.data.msg,
+                        offset: 50
+                    });
+                }
+
+            })
+        },
+        changeAvatarByLocal(){
+            axios({
+                method: 'post',
+                // 请求的地址
+                url: 'http://localhost:8082/helloGithub_war_exploded/retUserAv',
+                // URL 中的查询参数
+                responseType: 'blob',
+
+            }).then((res)=>{
+                console.log(res);
+            })
+
+        },
+
+
     }
 }
 </script>
 
-<style scoped>
+<style>
-::v-deep .el-page-header__left{
+.el-page-header__left{
     position: relative;
     left:-20vw;
 }
+.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: 178px;
+    height: 178px;
+    line-height: 178px;
+    text-align: center;
+}
+.avatar {
+    width: 178px;
+    height: 178px;
+    display: block;
+}
 </style>

src/main.js

@@ -21,7 +21,6 @@ Vue.use(ElementTiptapPlugin, {
 });
 
 axios.defaults.withCredentials=true;
-
 import cookie from 'vue-cookie'
 Vue.prototype.$cookie = cookie;
 
@@ -33,5 +32,5 @@ new Vue({
     axios,
     store,
     cookie,
-    render: h => h(App)
+    render: h => h(App),
 }).$mount('#app')

vue.config.js

@@ -11,16 +11,51 @@ module.exports = {
     // host: 'localhost', // 本地域名/ip地址
     // port: '8080', // 端口号
     proxy: {
-      '/api': {
+      '/github': {
         //后端接口的baseurl
         target: 'https://api.github.com/repos',
         //是否允许跨域
         changeOrigin: true,
+        // ws: true,                       //是否代理 websockets
+        // secure: true,
+        // 'secure': true,
+        headers:{
+          Connection:"kepp-alive"
+        },
+        pathRewrite: {
+          //这里的作用是使用去掉api
+          '^/github': ''
+        }
+      },
+      '/upload': {
+        //后端接口的baseurl
+        target: 'http://localhost:8082/helloGithub_war_exploded',
+        //是否允许跨域
+        changeOrigin: true,
+        headers:{
+          Connection:"kepp-alive"
+        },
+        pathRewrite: {
+          //这里的作用是使用去掉api
+          '^/upload': ''
+        }
+      },
+      '/api': {
+        //后端接口的baseurl
+        target: 'http://localhost:8082/helloGithub_war_exploded',
+        //是否允许跨域
+        changeOrigin: true,
+        // ws: true,                       //是否代理 websockets
+        // secure: true,
+        // 'secure': true,
+        headers:{
+          Connection:"kepp-alive"
+        },
         pathRewrite: {
           //这里的作用是使用去掉api
           '^/api': ''
         }
-      }
+      },
     }
   }
 }