From f868b0f60fc9daf7233a9e5b90541fb4bb4eb662 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E7=8E=8B=E5=B2=9A=E9=A6=A8?= <13450313+xiaolanxiner@user.noreply.giitee.com> Date: Sat, 6 Jan 2024 15:57:13 +0800 Subject: [PATCH] =?UTF-8?q?=E5=8D=9A=E5=AE=A2=E5=8A=9F=E8=83=BD=E7=82=B9?= =?UTF-8?q?=EF=BC=9A=E5=8F=91=E5=B8=83=E5=92=8C=E6=98=BE=E7=A4=BA=E6=95=B0?= =?UTF-8?q?=E9=87=8F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/blog.vue | 101 ++++++++++++++++++++++++++++++++-------- 1 file changed, 82 insertions(+), 19 deletions(-) diff --git a/src/components/blog.vue b/src/components/blog.vue index 0cb48a0..2c5e923 100644 --- a/src/components/blog.vue +++ b/src/components/blog.vue @@ -8,11 +8,11 @@
博客 - {{ $store.getters.articleTotal }} +
分类 - {{ sortInfo.length }} +
访问量 @@ -31,7 +31,9 @@
- + + +
@@ -56,7 +58,10 @@ export default { showAdmireDialog: false, articleSearch: "", showEditor: false, - blogContent: "" + blogContent: "", + blogContentTitle:"", + articles: [] , // 存储文章列表 + labelTotalNum: 0 } }, computed: { @@ -70,6 +75,9 @@ export default { created() { this.getRecommendArticles(); this.getAdmire(); + this.getUserArticles(); // 调用获取用户文章列表的方法 + this.getUserArticleLabelTotalNum();// 调用获取用户文章的标签种类数的方法 + console.log('getUserArticleLabelTotalNum is called'); }, methods: { selectSort(sort) { @@ -117,6 +125,38 @@ export default { }); }); }, + getUserArticleLabelTotalNum() { + const id = this.$store.state.currentUser.id; // 获取当前用户的ID + this.$http.get(`/admin/article/getUserArticleLabelTotalNum?id=${id}`) // 发送GET请求,指定获取用户文章标签数量的接口地址,并传递当前用户的ID作为参数 + .then(response => { + const labelNum = response; // 获取标签数量 + document.getElementById("labelTotalNum").innerText = labelNum; + this.labelTotalNum = labelNum; + console.log(labelNum); // 在控制台打印标签数量 + console.log("label日志!!"); + }) + .catch(error => { + console.error('请求错误:', error); + }); + }, + getUserArticles() { + const id = this.$store.state.currentUser.id; // 获取当前用户的ID + this.$http.get(`/admin/article/getArticleByUserId?id=${id}`) // 发送GET请求,指定获取用户文章列表的接口地址,并传递当前用户的ID作为参数 + .then(response => { + if (!this.$common.isEmpty(response.data)) { + this.articles = response.data; // 将返回的文章列表赋值给articles数组 + document.getElementById("totalBlogNum").innerText = this.articles.length + console.log(response.data) + this.getUserArticleLabelTotalNum() + } + }) + .catch(error => { + this.$message({ + message: error.message, + type: "error" + }); + }); + }, showTip() { this.$router.push({path: '/weiYan'}); }, @@ -132,16 +172,21 @@ export default { // this.blogContent = ""; // let blog = {content:this.blogContent}; const articleVO = { - user_id:"sara", - article_content: this.blogContent ,// 获取博客内容 + userId:this.$store.state.currentUser.id, + articleContent: this.blogContent ,// 获取博客内容 + articleTitle:this.blogContentTitle, // 其他博客相关数据... - // sort_id:1, + sortId:1, }; + console.log(this.$store.state.currentUser) console.log(articleVO) this.$http.post('/article/saveArticle', articleVO) // 发送POST请求,指定保存博客的接口地址 .then(response => { // 请求成功处理逻辑 console.log('博客保存成功!'); + this.getUserArticles() + this.showEditor = false; + this.blogContent = ""; }) .catch(error => { // 请求失败处理逻辑 @@ -269,42 +314,60 @@ export default { margin: 0 auto; align-self: center; width: 80%; - height: 300px; - background-color: #ba94dc; + height: 400px; + background-color: #e7deef; border-radius: 20px; margin-top: 20px; padding: 10px; + border: #5a0bb9 1px solid; + box-sizing: border-box; +} +.blog-editor-title { + display: block; + margin: 0 auto; + width: 40%; + height: 60px; + background-color: #ffffff; + border-radius: 20px; + padding: 10px; box-sizing: border-box; + font-weight: bolder; + font-size: 23px; + text-align: center; /* 将文本居中对齐 */ } -.blog-editor textarea { +.blog-editor-content { + display: block; margin: 0 auto; width: 100%; - height: 100%; - resize: none; - border: none; - outline: none; + height: 300px; + //resize: none; + //border: none; + //outline: none; border-radius: 20px; - font-size: 16px; - font-family: "Microsoft YaHei"; + font-size: 30px; + font-weight: bold; + margin-top: 10px; + //font-family: "Microsoft YaHei"; } .editor-btns { display: flex; justify-content: flex-end; - margin-top: 10px; + margin-top: 16px; } .cancel-btn, .publish-btn { width: 100px; - height: 30px; + height: 35px; color: #fff; - border-radius: 3px; + border-radius: 10px; cursor: pointer; transition: all .2s linear; font-size: 19px; font-weight: bold; + margin-top: 8px; } .cancel-btn {