diff --git a/src/components/articleList.vue b/src/components/articleList.vue index 998b1e1..0c7602e 100644 --- a/src/components/articleList.vue +++ b/src/components/articleList.vue @@ -187,6 +187,7 @@ overflow: hidden; border-radius: 10px; animation: hideToShow 1s ease-in-out; + background-color: #1d1f21; } .recent-post-item-image { diff --git a/src/components/blog.vue b/src/components/blog.vue index 4445f68..501b57c 100644 --- a/src/components/blog.vue +++ b/src/components/blog.vue @@ -25,15 +25,15 @@
- + + +
- +
-
+
@@ -48,7 +48,7 @@ d="M238.933333 307.2a34.133333 34.133333 0 0 0 0 68.266667h136.533334a34.133333 34.133333 0 1 0 0-68.266667H238.933333z m0 204.8a34.133333 34.133333 0 1 0 0 68.266667h409.6a34.133333 34.133333 0 1 0 0-68.266667H238.933333z m0 204.8a34.133333 34.133333 0 1 0 0 68.266667h204.8a34.133333 34.133333 0 1 0 0-68.266667H238.933333z" fill="#FFFFFF"> - 文章信息 + 文章信息 @@ -60,37 +60,37 @@ - - - {{article.commentStatus === false ? '否' : '是'}} - - - - - - - {{article.recommendStatus === false ? '否' : '是'}} - - - - - - - {{article.viewStatus === false ? '否' : '是'}} - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
@@ -128,106 +128,177 @@
- 保存 + 更新 + 保存 重置所有修改
- -
- -
- - -
- -
- -
- - - - -
拖拽 / 点击上传封面
-
- - - - - - 上传 - -
-
- - - -
- -


我的个人博客
-
-
-
-
{{ article.username }}
-
{{ article.articleTitle }}
-
-
- Cover Image -
-
- {{ article.articleContent }} -
-
-
{{ article.labelName }}
-
发布于 {{ article.createTime }}
-
-
最近更新于 {{ article.updateTime }}
-
-
- Delete Icon -
-
- Update Icon + +
+
+ + + + + + 发现 +
+
+ +
+ +
+
+
遇事不决，可问春风
+
+ +
+ +
+ +
+ + + + + + 发布于 {{ article.createTime }} +
+ + + +
{{ article.articleTitle }}
+

{{ article.articleTitle }}

+ + + +
+ + + + + {{ article.viewCount }} 热度 + + + + + + + + + + + + + {{ article.commentCount }} 条评论 + + + + + + {{ article.likeCount }} 点赞 + +
+ +
+ {{ article.articleContent }} +
+ +
+ + + + + + + + {{ article.sortName }} + + + + + + {{ article.labelName }} + + + + 编辑 + + 删除 + + +
+
+
+
@@ -249,11 +320,12 @@ export default { return { id: this.$route.query.id, article: { + userId: this.$store.state.currentUser.id, articleTitle: "", articleContent: "", - commentStatus: true, + commentStatus: false, recommendStatus: false, - viewStatus: true, + viewStatus: false, password: "", tips: "", articleCover: "", @@ -298,27 +370,27 @@ export default { recommendArticles: [], admires: [], showAdmireDialog: false, + showUpdateBtn: false, + showSaveBtn: true, articleSearch: "", - showEditor: false, + // showEditor: false, showPostEditor: false, - showUpdateBtn: false, - showPublishBtn: true, blogContent: "", blogContentTitle:"", blogLabelName: "", articles: [] , // 存储文章列表 labelTotalNum: 0, - articleUp: { - id: 1, - articleTitle: "", - articleContent: "", - userId: 1, - username: "", - sortId: 1, - labelId: 0, - labelName: "研发", - articleCover: "" - }, + // articleUp: { + // id: 1, + // articleTitle: "", + // articleContent: "", + // userId: 1, + // username: "", + // sortId: 1, + // labelId: 0, + // labelName: "研发", + // articleCover: "" + // }, file:"", blogLabels:[], selectedCategoryIndex: 0, // 默认选中第一个选项 @@ -356,6 +428,42 @@ export default { }, methods: { + handleEdit(item) { + this.showUpdateBtn = true; + this.showSaveBtn = false; + this.showPostEditor = true; + this.article = item; + }, + handleDelete(item) { + this.$confirm('确认删除？', '提示', { + confirmButtonText: '确定', + cancelButtonText: '取消', + type: 'success', + center: true + }).then(() => { + this.$http.get(this.$constant.baseURL + "/article/deleteArticle", {id: item.id}, true) + .then((res) => { + this.pagination.current = 1; + // this.getArticle(item); + this.getUserArticles() + this.$message({ + message: "删除成功！", + type: "success" + }); + }) + .catch((error) => { + this.$message({ + message: error.message, + type: "error" + }); + }); + }).catch(() => { + this.$message({ + type: 'success', + message: '已取消删除!' + }); + }); + }, imgAdd(pos, file) { let suffix = ""; if (file.name.lastIndexOf('.') !== -1) { @@ -444,8 +552,8 @@ export default { }); }); }, - getArticle() { - this.$http.get(this.$constant.baseURL + "/admin/article/getArticleById", {id: this.id}, true) + getArticle(articleItem) { + this.$http.get(this.$constant.baseURL + "/admin/article/getArticleById", {id: articleItem.id}, true) .then((res) => { if (!this.$common.isEmpty(res.data)) { this.article = res.data; @@ -468,11 +576,11 @@ export default { } this.$refs[formName].validate((valid) => { if (valid) { - if (this.$common.isEmpty(this.id)) { - this.saveArticle(this.article, "/article/saveArticle") - } else { - this.article.id = this.id; + if (this.$common.isEmpty(this.$store.state.currentUser.id)) { this.saveArticle(this.article, "/article/updateArticle") + } else { + this.article.userId = this.$store.state.currentUser.id; + this.saveArticle(this.article, "/article/saveArticle") } } else { this.$message({ @@ -482,6 +590,16 @@ export default { } }); }, + submitForm2() { + if (this.article.viewStatus === false && this.$common.isEmpty(this.article.password)) { + this.$message({ + message: "文章不可见时必须输入密码！", + type: "error" + }); + return; + } + this.saveArticle(this.article, "/article/updateArticle") + }, resetForm(formName) { this.$refs[formName].resetFields(); if (!this.$common.isEmpty(this.id)) { @@ -502,6 +620,8 @@ export default { type: "success" }); // this.$router.push({path: '/postList'}); + this.getUserArticleLabelTotalNum(); + this.getUserArticles(); this.showPostEditor = false; this.article.articleContent = ""; this.article.articleCover = ""; @@ -672,8 +792,7 @@ export default { }); }, getUserArticles() { - const id = this.$store.state.currentUser.id; - this.$http.get(`/admin/article/getArticleByUserId?id=${id}`) + this.$http.get(`/admin/article/getArticleByUserId?id=${this.$store.state.currentUser.id}`) .then(response => { if (!this.$common.isEmpty(response.data)) { this.articles = response.data; @@ -686,7 +805,7 @@ export default { this.getUserArticleLabelTotalNum(); // 发送请求获取博客封面图 - this.$http.get(`http://s6xqq8hhg.hd-bkt.clouddn.com/userAvatar/${article.articleCover}`) + this.$http.get(`${article.articleCover}`) .then(response => { console.log(response.data+"star"); // 在这里处理获取到的博客封面图 @@ -727,7 +846,10 @@ export default { // 其他博客相关数据... sortId:1, labelId:selectedIndex, - articleCover:this.articleUp.articleCover + articleCover:this.articleUp.articleCover, + viewStatus: 0, + commentStatus: 0, + recommendStatus: 0 }; console.log(this.$store.state.currentUser) console.log(this.articleUp.articleCover+"cover") @@ -773,9 +895,7 @@ export default { }, updateArticle(article) { - this.showEditor = true; - this.showUpdateBtn = true; - this.showPublishBtn = false; + this.showPostEditor = true; this.blogContentTitle = article.articleTitle; this.blogContent = article.articleContent; this.selectedCategoryIndex = article.labelId - 1; // 设置下拉框选中的索引值 @@ -792,47 +912,47 @@ export default { }, - updateBlog(){ - this.blogContentTitle = document.getElementById('areaTitle').value - this.blogContent = document.getElementById('areaContent').value - // document.getElementById('category'). - this.articleUp.articleContent = document.getElementById('areaContent').value - this.articleUp.articleTitle = document.getElementById('areaTitle').value - this.articleUp.username = this.$store.state.currentUser.username - this.articleUp.labelId = this.selectedCategoryIndex+1 - - //发送异步请求更新文章 - this.$http.post('/article/updateArticle', this.articleUp) - .then(response => { - // 请求成功处理逻辑 - console.log('博客更新成功！'); - - console.log(response) - this.getUserArticles() - this.getUserArticleLabelTotalNum() - this.$message({ - message: '更新成功', - type: 'success' - }); - this.showEditor = false; - this.showPublishBtn = true; - this.showUpdateBtn = false; - this.blogContent = ""; - this.blogContentTitle = ""; - }) - .catch(error => { - // 请求失败处理逻辑 - console.error('更新博客失败：', error); - this.$message({ - message: '更新失败', - type: 'error' - }); - this.showPublishBtn = true; - this.showUpdateBtn = false; - this.blogContent = ""; - this.blogContentTitle = ""; - }); - }, + // updateBlog(){ + // this.blogContentTitle = document.getElementById('areaTitle').value + // this.blogContent = document.getElementById('areaContent').value + // // document.getElementById('category'). + // this.articleUp.articleContent = document.getElementById('areaContent').value + // this.articleUp.articleTitle = document.getElementById('areaTitle').value + // this.articleUp.username = this.$store.state.currentUser.username + // this.articleUp.labelId = this.selectedCategoryIndex+1 + // + // //发送异步请求更新文章 + // this.$http.post('/article/updateArticle', this.articleUp) + // .then(response => { + // // 请求成功处理逻辑 + // console.log('博客更新成功！'); + // + // console.log(response) + // this.getUserArticles() + // this.getUserArticleLabelTotalNum() + // this.$message({ + // message: '更新成功', + // type: 'success' + // }); + // this.showEditor = false; + // this.showPublishBtn = true; + // this.showUpdateBtn = false; + // this.blogContent = ""; + // this.blogContentTitle = ""; + // }) + // .catch(error => { + // // 请求失败处理逻辑 + // console.error('更新博客失败：', error); + // this.$message({ + // message: '更新失败', + // type: 'error' + // }); + // this.showPublishBtn = true; + // this.showUpdateBtn = false; + // this.blogContent = ""; + // this.blogContentTitle = ""; + // }); + // }, getBlogLabels() { const url = "/webInfo/listLabel"; console.log("gettingLabels"); @@ -865,6 +985,7 @@ export default {