From eaffa1ace3cd98b946b536f3bbe139fb8a85925b Mon Sep 17 00:00:00 2001 From: Qing Date: Fri, 7 Jul 2023 21:39:51 +0800 Subject: [PATCH] =?UTF-8?q?add=20=E7=94=A8=E6=88=B7=E5=A4=B4=E5=83=8F?= =?UTF-8?q?=E4=B8=8A=E4=BC=A0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/Home/SearchInput.vue | 11 +- src/components/Paper/ArticleDetail.vue | 2 +- src/components/Project/ProjectDetail.vue | 82 ++++++++-- src/components/Project/ProjectList.vue | 2 +- src/components/User/UserArticles.vue | 65 +++++++- src/components/User/UserInfo.vue | 73 +++++---- src/components/User/UserInfoPage.vue | 189 +++++++++++++++++++++-- src/main.js | 3 +- vue.config.js | 39 ++++- 9 files changed, 399 insertions(+), 67 deletions(-) diff --git a/src/components/Home/SearchInput.vue b/src/components/Home/SearchInput.vue index a601ed5..4fc1ae4 100644 --- a/src/components/Home/SearchInput.vue +++ b/src/components/Home/SearchInput.vue @@ -17,6 +17,7 @@
{ + 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: '错误', diff --git a/src/components/Paper/ArticleDetail.vue b/src/components/Paper/ArticleDetail.vue index c7e410a..e5b061a 100644 --- a/src/components/Paper/ArticleDetail.vue +++ b/src/components/Paper/ArticleDetail.vue @@ -3,7 +3,7 @@

- +
{{ArticleTitle}} diff --git a/src/components/Project/ProjectDetail.vue b/src/components/Project/ProjectDetail.vue index 1719ff4..8382d64 100644 --- a/src/components/Project/ProjectDetail.vue +++ b/src/components/Project/ProjectDetail.vue @@ -6,7 +6,7 @@
- 项目详情 + 项目详情
@@ -30,7 +30,7 @@ HelloGitHub 评分 - {{ commentNum }} 个评分 @@ -118,14 +118,22 @@ -
- 收录于: 第 {{periodicals}} 期 -
- 标签: -
- {{item}} +
+
+ 收录于: 第 {{periodicals}} 期 +
+ 标签: +
+ {{item}} +
+ +
+ 由 + + 分享 +
@@ -144,7 +152,7 @@
- {{this.$cookie.get('username')}} + 未登录
- {{item.username}} + {{item.username}}
@@ -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); +} \ No newline at end of file diff --git a/src/components/Project/ProjectList.vue b/src/components/Project/ProjectList.vue index 71468c6..3005539 100644 --- a/src/components/Project/ProjectList.vue +++ b/src/components/Project/ProjectList.vue @@ -19,7 +19,7 @@
- • + •
{{ formatTime }}
diff --git a/src/components/User/UserArticles.vue b/src/components/User/UserArticles.vue index 43eddbf..6fe7445 100644 --- a/src/components/User/UserArticles.vue +++ b/src/components/User/UserArticles.vue @@ -1,15 +1,72 @@ \ No newline at end of file diff --git a/src/components/User/UserInfo.vue b/src/components/User/UserInfo.vue index 858b1a0..a164ab3 100644 --- a/src/components/User/UserInfo.vue +++ b/src/components/User/UserInfo.vue @@ -2,7 +2,8 @@
- {{this.$cookie.get('username')}} + + {{this.$cookie.get('username')}}
{{this.$cookie.get('username')}} Lv.1 @@ -37,13 +38,15 @@ export default { return{ switchValue:false, ContributionValue:0, + imageUrl:'', } }, mounted() { this.getContributionValue(); + this.getUserInfo(); }, - methods:{ - signOut(){ + methods: { + 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'){ - setTimeout(()=>{ + if (this.$route.path !== '/home') { + setTimeout(() => { this.$router.push({ - path:'/home' + path: '/home' }) - },800) - }else { + }, 800) + } 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', - query: { + path: '/UserInfoPage', + query: { name: this.$cookie.get('username'), refresh: true - }}) + } + }) }, - getContributionValue(){ - var that=this; + getContributionValue() { + var that = this; axios({ method: 'post', // 请求的地址 url: 'http://localhost:8082/helloGithub_war_exploded/contributionValue', // URL 中的查询参数 - params: { - - } - }).then((res)=>{ + params: {} + }).then((res) => { // console.log(res); - if(res.data.code===500){ + if (res.data.code === 500) { return; - }else{ - that.ContributionValue=res.data; + } else { + 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; + } + + } } } diff --git a/src/components/User/UserInfoPage.vue b/src/components/User/UserInfoPage.vue index 249f18a..23463fe 100644 --- a/src/components/User/UserInfoPage.vue +++ b/src/components/User/UserInfoPage.vue @@ -14,8 +14,8 @@
-
- {{username}} +
+
@@ -24,17 +24,21 @@
你是 HelloGitHub 社区的第 {{userId}} 位用户，于 {{creatTime}} 加入。 - 已分享 + 分享 {{projectNum}} 0 - 个开源项目， + 个开源项目, {{Object.keys(commentList).length}} 0 - 份项目评价， + 份评价, 共获得 {{contributionValue}} 0 - 点贡献值。 + 点贡献值. + + {{Object.keys(article).length}} + + 篇文章。
@@ -82,16 +86,49 @@ 总文章: {{Object.keys(article).length}} 篇 - - - - + +
+ +
+
+ +
+ + + + 上传 +
+ +
+ + +
将文件拖到此处，或点击上传
+
只能上传jpg/png文件。
+ + + + + +
+ +
@@ -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); + }) + + }, + + } } - \ No newline at end of file diff --git a/src/main.js b/src/main.js index cbb9326..9085b18 100644 --- a/src/main.js +++ b/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') diff --git a/vue.config.js b/vue.config.js index f3e93bd..e7aa9ef 100644 --- a/vue.config.js +++ b/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': '' } - } + }, } } }