diff --git a/package-lock.json b/package-lock.json index 893dd94..438b92d 100644 --- a/package-lock.json +++ b/package-lock.json @@ -14,6 +14,8 @@ "echarts": "^5.4.2", "element-tiptap": "^1.27.1", "element-ui": "^2.15.13", + "form-data": "^4.0.0", + "fs": "^0.0.1-security", "json-server": "^0.17.3", "vue": "^2.6.14", "vue-cookie": "^1.1.4", @@ -7106,6 +7108,11 @@ "node": ">= 0.6" } }, + "node_modules/fs": { + "version": "0.0.1-security", + "resolved": "https://registry.npmmirror.com/fs/-/fs-0.0.1-security.tgz", + "integrity": "sha512-3XY9e1pP0CVEUCdj5BmfIZxRBTSDycnbqhIOGec9QYtmVH2fbLpj86CFWkrNOkt/Fvty4KZG5lTglL9j/gJ87w==" + }, "node_modules/fs-extra": { "version": "9.1.0", "resolved": "https://registry.npmmirror.com/fs-extra/-/fs-extra-9.1.0.tgz", @@ -20575,6 +20582,11 @@ "resolved": "https://registry.npmmirror.com/fresh/-/fresh-0.5.2.tgz", "integrity": "sha512-zJ2mQYM18rEFOudeV4GShTGIQ7RbzA7ozbU9I/XBpm7kqgMywgmylMwXHxZJmkVoYkna9d2pVXVXPdYTP9ej8Q==" }, + "fs": { + "version": "0.0.1-security", + "resolved": "https://registry.npmmirror.com/fs/-/fs-0.0.1-security.tgz", + "integrity": "sha512-3XY9e1pP0CVEUCdj5BmfIZxRBTSDycnbqhIOGec9QYtmVH2fbLpj86CFWkrNOkt/Fvty4KZG5lTglL9j/gJ87w==" + }, "fs-extra": { "version": "9.1.0", "resolved": "https://registry.npmmirror.com/fs-extra/-/fs-extra-9.1.0.tgz", diff --git a/package.json b/package.json index 3e12699..ed74215 100644 --- a/package.json +++ b/package.json @@ -14,6 +14,8 @@ "echarts": "^5.4.2", "element-tiptap": "^1.27.1", "element-ui": "^2.15.13", + "form-data": "^4.0.0", + "fs": "^0.0.1-security", "json-server": "^0.17.3", "vue": "^2.6.14", "vue-cookie": "^1.1.4", diff --git a/src/assets/styles/element-variables.scss b/src/assets/styles/element-variables.scss index 313fb37..b0311df 100644 --- a/src/assets/styles/element-variables.scss +++ b/src/assets/styles/element-variables.scss @@ -86,4 +86,7 @@ $--font-path: '~element-ui/lib/theme-chalk/fonts'; } .backbutton :hover{ color: #789be5!important; +} +.el-avatar{ + background-color: transparent; } \ No newline at end of file diff --git a/src/components/Home/Header.vue b/src/components/Home/Header.vue index 8e41715..29ba37f 100644 --- a/src/components/Home/Header.vue +++ b/src/components/Home/Header.vue @@ -15,7 +15,7 @@ 文 章 - 提交项目 + 提交项目 发布文章 -
+
发布文章
+ + + +
+ + 欢迎自荐/分享开源项目 + + + 通过审核的开源项目，才会在首页展示 + +
+ + + + + + + 👆 仅接受 GitHub 上的开源项目 + + + + + + + + + + + + + 描述: 请从技术栈，功能，适用场景，解决那些痛点等方面介绍项目，突出特点和闪光的亮点。 + + + + 提交 + + + + + + + +
+ + 是否要上传项目源码？ + +
+
+ + +
+ + + + +
+ + +
将文件拖到此处，或点击上传
+
只能上传jpg/png文件，且不超过500kb
+ +
+ + +
@@ -38,6 +136,20 @@ import SearchInput from "@/components/Home/SearchInput.vue"; import PublishArticle from "@/components/Paper/PublishArticle.vue"; import Vue from "vue"; +import { + Blockquote, + Bold, BulletList, + CodeBlock, CodeView, + Doc, FontSize, FontType, FormatClear, HardBreak, + Heading, History, HorizontalRule, + Iframe, + Image, Indent, Italic, LineHeight, + Link, ListItem, OrderedList, + Paragraph, Preview, Print, SelectAll, Strike, + Text, TextAlign, TextColor, TextHighlight, TodoItem, TodoList, TrailingNode, + Underline +} from "element-tiptap"; +import axios from "axios"; export default { name: "HeaderComponent", @@ -45,9 +157,115 @@ export default { data() { return { openPublishArticle:false, + openPublishProject:false, + openFileUploadDialog:false, + extensions: [ + new Link, + new Image, + new Iframe, + new CodeBlock, + new Blockquote, + new Doc(), + new Text(), + new Paragraph(), + new Heading({level: 5}), // 支持多级标题，设置为5级 + new Bold({bubble: true}), // 在气泡菜单中渲染菜单按钮 + new Underline({bubble: true, menubar: false}), // 在气泡菜单而不在菜单栏中渲染菜单按钮 + new Italic(), + new Strike(), + new ListItem(), + new BulletList(), + new OrderedList(), + new TodoItem, + new TodoList, + new TextAlign({alignments: ['left', 'center', 'right', 'justify'],}), + new Indent({ + minIndent: 0, + maxIndent: 7, + }), + new LineHeight({lineHeights: ['100%', '200%', '300%']}), + new HorizontalRule, + new HardBreak, + new TrailingNode, + new History, + new FormatClear, + new TextColor({bubble: true}), + new TextHighlight, + new Preview, + new Print, + new SelectAll, + new FontType, + new FontSize, + new CodeView, + ], + form: { + url: null, + title: null, + name: null, + tags: [], + tag: [], + fileList: [], + content: null, + }, + rules: { + url: [ + // required：规则，o：失去焦点触发 + {required: true, message: "请输入项目地址", trigger: "blur"}, + ], + title: [{required: true, message: "请输入项目标题", trigger: "blur"}], + content: [{required: true, message: "请输入项目描述", trigger: "blur"}], + tag: [{required: true, message: "请选择项目标签", trigger: "blur"}], + }, + openUploadFile:false, + avatar_url:null, } }, + mounted() { + // this.splitUrl(); + this.categoryList(); + }, methods:{ + upload(params){ + var that=this; + const formData = new FormData(); + formData.append("file", params.file); + axios({ + method: 'post', + // 请求的地址 + url: '/upload/commitProjectFile', + headers:{"Content-Type": "multipart/form-data"}, + // URL 中的查询参数 + data:formData, + params: { + projectName: this.form.name + } + }).then((res)=>{ + if(res.data.code===500){ + Vue.prototype.$notify.error({ + title: '错误', + message: res.data.msg, + offset: 50 + }); + }else{ + Vue.prototype.$notify({ + title: '成功', + message: ('i', {style: 'color: teal'}, "上传成功"), + type: 'success', + offset: 50 + }); + that.openFileUploadDialog=false; + setTimeout(()=>{ + window.location.reload(); + },500) + + } + + }) + }, + openFileUpload(){ + this.openUploadFile=false; + this.openFileUploadDialog=true; + }, openPublishDialog(){ if(this.$cookie.get('username')){ this.openPublishArticle=true; @@ -58,10 +276,128 @@ export default { offset: 50 }); } + }, + openPublishProjects(){ + if(this.$cookie.get('username')){ + this.openPublishProject=true; + }else{ + Vue.prototype.$notify.error({ + title: '错误', + message: "请先登录!", + offset: 50 + }); + } + }, + splitUrl() { + let url = this.form.url; + let parts = url.split("/"); + let projectName = parts[parts.length - 1]; + let userName = parts[parts.length - 2]; + this.form.name = userName + '/' + projectName + console.log(this.form.name); + }, + categoryList() { + var that = this; + axios({ + method: 'post', + // 请求的地址 + url: 'http://localhost:8082/helloGithub_war_exploded/retLabel', + // URL 中的查询参数 + params: {} + }).then((res) => { + that.form.tags = res.data; + }); + }, + getNameAndCheck() { + if (this.form.url === null) { + return; + } else { + this.splitUrl(); + this.isExist(); + this.getDetailByGitHub(); + } + }, + closeUploadFile(){ + this.openPublishProject=false; + this.openUploadFile=false; + }, + submitProject(){ + if (this.form.tag) { + this.form.tag = this.form.tag.join(","); + } + Object.assign({}, this.form); + var that=this; + axios({ + method: 'post', + // 请求的地址 + url: 'http://localhost:8082/helloGithub_war_exploded/commitProject', + // URL 中的查询参数 + params: { + projectIco:this.avatar_url, + projectName:this.form.name, + projectUrl:this.form.url, + projectTitle:this.form.title, + projectDescription:this.form.content, + categoryIdList:this.form.tag + } + }).then( (res)=> { + if(res.data.code===200){ + Vue.prototype.$notify({ + title: '成功', + message: ('i', {style: 'color: teal'}, res.data.msg), + type: 'success', + offset: 50 + }); + this.openPublishProject=false; + that.openUploadFile=true + }else{ + Vue.prototype.$notify.error({ + title: '错误', + message: res.data.msg, + offset: 50 + }); + } + }); + }, + isExist(){ + axios({ + method: 'post', + // 请求的地址 + url: 'http://localhost:8082/helloGithub_war_exploded/selectProjectByPname', + // URL 中的查询参数 + params: { + projectName:this.form.name, + } + }).then((res) => { + if(res.data.code===500){ + Vue.prototype.$notify.error({ + title: '错误', + message: res.data.msg, + offset: 50 + }); + }else { + return; + } + }); + }, + getDetailByGitHub(){ + var that=this; + axios({ + method: 'get', + // 请求的地址 + url: '/github/'+this.form.name, + // URL 中的查询参数 + params: { + } + }).then((res)=>{ + that.avatar_url=res.data.owner.avatar_url; + // that.saveGithubInfo(); + }); }, - } + }, + } diff --git a/src/components/Paper/PublishArticle.vue b/src/components/Paper/PublishArticle.vue index f8206c3..df10c85 100644 --- a/src/components/Paper/PublishArticle.vue +++ b/src/components/Paper/PublishArticle.vue @@ -60,6 +60,7 @@ import { } from "element-tiptap"; import axios from "axios"; import Vue from "vue"; +import FormData from "form-data" export default { name: "PublishArticle", @@ -70,28 +71,7 @@ export default { return { extensions: [ new Link, - new Image({ - uploadRequest:(file) => { - const data = new FormData(); - data.append('file', file); - axios({ - method: 'post', - headers:{ - "Access-Control-Allow-Origin": "*", - 'crossOrigin':'anonymous' - }, - // 请求的地址 - url: 'http://localhost:8082/helloGithub_war_exploded/upload', - // URL 中的查询参数 - params: { - name:file.name, - file:data - } - }).then(function (res) { - return res.data.url; - }); - } - }), + new Image({}), new Iframe, new CodeBlock, new Blockquote, @@ -155,7 +135,7 @@ export default { modalClose() { this.$emit('update:openPublishDialog', false); // 直接修改父组件的属性 }, - publishArticle(formName){ + publishArticle(formName) { // var that=this; this.$refs[formName].validate((valid) => { if (valid) { @@ -165,13 +145,13 @@ export default { url: 'http://localhost:8082/helloGithub_war_exploded/articlepublish', // URL 中的查询参数 params: { - username:this.$cookie.get('username'), - articleTitle:this.form.title, - articleIco:this.form.icon, - articleContent:this.form.content, + username: this.$cookie.get('username'), + articleTitle: this.form.title, + articleIco: this.form.icon, + articleContent: this.form.content, } - }).then( (res)=> { - if(res.data.code===200){ + }).then((res) => { + if (res.data.code === 200) { Vue.prototype.$notify({ title: '成功', message: ('i', {style: 'color: teal'}, res.data.msg), @@ -179,7 +159,7 @@ export default { offset: 50 }); window.location.reload(); - }else{ + } else { Vue.prototype.$notify.error({ title: '错误', message: res.data.msg, @@ -188,8 +168,9 @@ export default { } }); - }}); - } + } + }); + }, } } diff --git a/src/components/Project/ProjectDetail.vue b/src/components/Project/ProjectDetail.vue index a966a33..10c4531 100644 --- a/src/components/Project/ProjectDetail.vue +++ b/src/components/Project/ProjectDetail.vue @@ -14,7 +14,7 @@
- +
{{ projectName }} @@ -51,7 +51,7 @@ 源码 官方下载 - 快速下载 + 快速下载 点 赞 {{startNum}} @@ -117,7 +117,7 @@
- +
收录于: 第 {{periodicals}} 期 @@ -131,14 +131,10 @@
由 - + 分享
- - - -
@@ -152,8 +148,8 @@
- - 未登录 + + 未登录
最新
-
- {{item.username}} +
+ {{item.username}}
@@ -234,8 +230,8 @@ 最热
-
- {{item.username}} +
+ {{item.username}}
@@ -369,17 +365,19 @@ export default { license:null, name:'', default_branch:null, + avatar_url:null, }, totalStar:3.7, Content:'', imageUrl:'', + fileAddress:null, } }, mounted() { this.getProjectDetail(); this.getLastComment(); this.isStart(); - this.getUserInfo(); + // this.getUserInfo(); }, watch: { @@ -399,6 +397,15 @@ export default { } }) }, + toUserPage2(username) { + this.$router.push({ + path: '/UserInfoPage', + query: { + name: username, + refresh: true + } + }) + }, toComment(id){ document.querySelector(id).scrollIntoView(true) var auchor=this.$el.querySelector(id) @@ -422,7 +429,6 @@ 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; @@ -436,9 +442,10 @@ export default { 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.fileAddress=res.data.project.fileAddress; + // that.userUri=res.data.project.userUri; that.getDetailByGitHub(); + that.changeAvatarByLocal(); }); }, reload() { @@ -526,27 +533,25 @@ 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; - } - - - }, + // 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; @@ -704,6 +709,8 @@ export default { that.github.license=res.data.license.spdx_id; that.github.name=res.data.name; that.github.default_branch=res.data.default_branch; + that.github.avatar_url=res.data.owner.avatar_url; + that.saveGithubInfo(); }); }, @@ -723,6 +730,67 @@ export default { }); }, + saveGithubInfo(){ + axios({ + method: 'post', + // 请求的地址 + url: 'http://localhost:8082/helloGithub_war_exploded/insertGithubInfo', + // URL 中的查询参数 + params: { + projectId:this.$route.query.id, + avatar:this.github.avatar_url, + name:this.github.name, + starImgUrl:'https://starchart.cc/'+this.projectName+'.svg', + starCount:this.github.starNum, + mainLanguage:this.github.language, + isActive:this.github.allow_forking, + subscriber:this.github.subscribers_count, + issues:this.github.open_issues_count, + isOrganization:this.github.organization, + defaultBranch:this.github.default_branch, + forks:this.github.forks_count, + protocol:this.github.license, + version:'0', + } + }) + }, + + changeAvatarByLocal(){ + var that=this; + axios({ + method: 'post', + // 请求的地址 + url: '/api/retUserAv', + // URL 中的查询参数 + params:{ + username:this.username, + }, + responseType:'blob' + }).then((res)=>{ + that.imageUrl = window.URL.createObjectURL(res.data)//这里也是关键,调用window的这个方法URL方法 + }) + + }, + Download(){ + window.open('http://localhost:8082/helloGithub_war_exploded/DownLoad?id='+this.$route.query.id); + // axios({ + // method: 'post', + // // 请求的地址 + // url: '/api/DownLoad', + // // URL 中的查询参数 + // params:{ + // id:this.$route.query.id, + // }, + // responseType: 'blob' + // }).then(()=>{ + // Vue.prototype.$notify({ + // title: '提示', + // message: "请等待下载执行", + // offset: 50, + // type:"success" + // }); + // }) + } }, diff --git a/src/components/Project/ProjectPublish.vue b/src/components/Project/ProjectPublish.vue deleted file mode 100644 index d38b419..0000000 --- a/src/components/Project/ProjectPublish.vue +++ /dev/null @@ -1,15 +0,0 @@ - - - - - \ No newline at end of file diff --git a/src/components/System/AdminLogin.vue b/src/components/System/AdminLogin.vue new file mode 100644 index 0000000..f2c133f --- /dev/null +++ b/src/components/System/AdminLogin.vue @@ -0,0 +1,24 @@ + + + + + \ No newline at end of file diff --git a/src/components/User/UserComments.vue b/src/components/User/UserComments.vue index 55642d5..2b566e7 100644 --- a/src/components/User/UserComments.vue +++ b/src/components/User/UserComments.vue @@ -13,7 +13,7 @@
- {{ this.$cookie.get('username') }} + {{ this.$cookie.get('username') }}
@@ -61,7 +61,8 @@ export default { name: "UserComments", props:{ comments:Object, - index:Number + index:Number, + }, data(){ return{ diff --git a/src/components/User/UserInfo.vue b/src/components/User/UserInfo.vue index e6ed346..72a5f1f 100644 --- a/src/components/User/UserInfo.vue +++ b/src/components/User/UserInfo.vue @@ -3,7 +3,7 @@
- {{this.$cookie.get('username')}} + {{this.$cookie.get('username')}}
{{this.$cookie.get('username')}} Lv.{{userLevel}} @@ -156,6 +156,21 @@ export default { return; } }, + // changeAvatarByLocal(){ + // var that=this; + // axios({ + // method: 'post', + // // 请求的地址 + // url: '/api/retUserAv', + // // URL 中的查询参数 + // params:{ + // username:this.$cookie.get('username'), + // }, + // responseType:'blob' + // }).then((res)=>{ + // that.imageUrl = window.URL.createObjectURL(res.data)//这里也是关键,调用window的这个方法URL方法 + // }) + // }, } } diff --git a/src/components/User/UserInfoPage.vue b/src/components/User/UserInfoPage.vue index 109fc5a..38957ae 100644 --- a/src/components/User/UserInfoPage.vue +++ b/src/components/User/UserInfoPage.vue @@ -15,7 +15,7 @@
- +
@@ -104,13 +104,13 @@ append-to-body :close-on-click-modal="false" > - 选择一种方式即可！ -
- - - - 上传 -
+ + + + + + +
将文件拖到此处，或点击上传
只能上传jpg/png文件。
- - - - +
@@ -158,8 +155,8 @@ export default { like:[], article:[], openChangeAvatar:false, - AvatarUrl:'', - imageUrl:'http://localhost:8082/helloGithub_war_exploded/retUserAv', + // AvatarUrl:'', + // imageUrl:'', userLevel:null, } }, @@ -253,49 +250,49 @@ export default { } }, changeAvatar(){ - if(this.$route.query.name!==this.$cookie.get('username')){ + if(this.$route.query.name!==this.$cookie.get('username')||this.$cookie.get('username')===null){ return; }else{ this.openChangeAvatar=true; } }, - changeAvatarByUrl(){ - 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 - }); - }else{ - Vue.prototype.$notify.error({ - title: '错误', - message: "上传失败", - offset: 50 - }); - } - - }); - }else{ - Vue.prototype.$notify.error({ - title: '错误', - message: "请先填写图片链接", - offset: 50 - }); - } - - }, + // changeAvatarByUrl(){ + // 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 + // }); + // }else{ + // Vue.prototype.$notify.error({ + // title: '错误', + // message: "上传失败", + // offset: 50 + // }); + // } + // + // }); + // }else{ + // Vue.prototype.$notify.error({ + // title: '错误', + // message: "请先填写图片链接", + // offset: 50 + // }); + // } + // + // }, upload(params){ var that=this; @@ -326,24 +323,30 @@ export default { offset: 50 }); that.openChangeAvatar=false; + setTimeout(()=>{ + window.location.reload(); + },500) + } }) }, - changeAvatarByLocal(){ - var that=this; - axios({ - method: 'post', - // 请求的地址 - url: '/api/retUserAv', - // URL 中的查询参数 - responseType: 'blob', - - }).then((res)=>{ - - }) - - }, + // changeAvatarByLocal(){ + // var that=this; + // axios({ + // method: 'post', + // // 请求的地址 + // url: '/api/retUserAv', + // // URL 中的查询参数 + // params:{ + // username:this.username, + // }, + // responseType:'blob' + // }).then((res)=>{ + // that.imageUrl = window.URL.createObjectURL(res.data)//这里也是关键,调用window的这个方法URL方法 + // }) + // + // }, } diff --git a/src/router/index.js b/src/router/index.js index 7ba281d..b18b00c 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -10,6 +10,7 @@ import MonthlyByTags from "@/components/Monthly/MonthlyByTags.vue"; import UserInfoPage from "@/components/User/UserInfoPage.vue"; import ProjectDetail from "@/components/Project/ProjectDetail.vue"; import ArticleDetail from "@/components/Paper/ArticleDetail.vue"; +import adminLogin from "@/components/System/AdminLogin.vue"; const originalPush = VueRouter.prototype.push VueRouter.prototype.push = function push(location) { return originalPush.call(this, location).catch(err => err) @@ -73,11 +74,19 @@ const routes = [ component: ArticleDetail }, ] + }, + { + path: '/adminLogin', + name: 'adminLogin', + component: adminLogin } + + ] const router = new VueRouter({ + mode:'history', routes }) diff --git a/vue.config.js b/vue.config.js index e7aa9ef..be33294 100644 --- a/vue.config.js +++ b/vue.config.js @@ -56,6 +56,22 @@ module.exports = { '^/api': '' } }, + '/image': { + //后端接口的baseurl + target: 'https://tucdn.wpon.cn/api/', + //是否允许跨域 + changeOrigin: true, + // ws: true, //是否代理 websockets + // secure: true, + // 'secure': true, + headers:{ + Connection:"kepp-alive" + }, + pathRewrite: { + //这里的作用是使用去掉api + '^/image': '' + } + }, } } }