feat: 新增文章点赞功能

api/v2/all.api.js

@@ -205,12 +205,22 @@ export default {
      * 获取二维码信息
      */
     getQRCodeInfo: (key) => {
-		return HttpHandler.Get(`/apis/api.uni.uhalo.pro/v1alpha1/plugins/plugin-uni-halo/getQRCodeInfo/${key}`, null,)
+        return HttpHandler.Get(`/apis/api.uni.uhalo.pro/v1alpha1/plugins/plugin-uni-halo/getQRCodeInfo/${key}`,
+            null, {})
     },
     /**
      * 获取二维码图片
      */
     getQRCodeImg: (postId) => {
-		return HttpHandler.Get(`/apis/api.uni.uhalo.pro/v1alpha1/plugins/plugin-uni-halo/getQRCodeImg/${postId}`, null,)
+        return HttpHandler.Get(`/apis/api.uni.uhalo.pro/v1alpha1/plugins/plugin-uni-halo/getQRCodeImg/${postId}`,
+            null, {})
+    },
+    /**
+     * 点赞
+     * @param {*} data ={group, plural, name}
+     */
+    submitUpvote(data) {
+        return HttpHandler.Post(`/apis/api.halo.run/v1alpha1/trackers/upvote`, data, {})
     }
+
 }

pagesA/article-detail/article-detail.vue

@@ -131,7 +131,7 @@
             <!-- 返回顶部 -->
             <tm-flotbutton :offset="[16, 80]" icon="icon-angle-up" color="bg-gradient-light-blue-accent"
                            @click="fnToTopPage()"></tm-flotbutton>
-			<tm-flotbutton :actions="flotButtonActions" actions-pos="left" :show-text="true"
+            <tm-flotbutton :actions="flotButtonActions" :click-actions-hiden="false" actions-pos="left" :show-text="true"
                            color="bg-gradient-orange-accent" @change="fnOnFlotButtonChange"></tm-flotbutton>
         </block>
 
@@ -232,9 +232,8 @@
 
 import rCanvas from '@/components/r-canvas/r-canvas.vue';
 import barrage from '@/components/barrage/barrage.vue';
-	import {
+import {getAppConfigs} from '@/config/index.js'
-		getAppConfigs
+import {upvote} from '@/utils/upvote.js'
-	} from '@/config/index.js'
 
 export default {
     components: {
@@ -325,6 +324,9 @@
 
         calcIsShowComment() {
             return this.postDetailConfig.showComment
+        },
+        calcUpvoted() {
+            return upvote.has("post", this.result?.metadata?.name)
         }
     },
     watch: {
@@ -410,6 +412,7 @@
 
                     this.fnSetPageTitle('文章详情');
                     this.loading = 'success';
+                    this.fnHandleSetFlotButtonItems(this.haloConfigs);
                 })
                 .catch(err => {
                     console.log("错误", err)
@@ -427,9 +430,9 @@
                 use: true,
             },
                 {
-						icon: 'icon-like',
+                    icon: upvote.has("post", this.result?.metadata?.name) ? 'icon-heart-fill' : 'icon-like',
-						color: 'bg-gradient-orange-accent',
+                    color: upvote.has("post", this.result?.metadata?.name) ? 'bg-gradient-red-accent' : 'bg-gradient-orange-accent',
-						use: false,
+                    use: true,
                 },
                 {
                     icon: 'icon-commentdots-fill',
@@ -443,13 +446,13 @@
         // 浮动按钮点击
         fnOnFlotButtonChange(index) {
             switch (index) {
-					// case 0:
-					// 	this.fnDoLikes();
-					// 	break;
                 case 0:
                     this.fnShowShare();
                     break;
                 case 1:
+                    this.fnDoLikes();
+                    break;
+                case 2:
                     this.fnToComment();
                     break;
             }
@@ -483,24 +486,22 @@
             this.commentModal.title = "";
         },
         fnDoLikes() {
-				this.$httpApi
+            if (upvote.has("post", this.result?.metadata?.name)) {
-					.postLikePost(this.result.id)
+                uni.$tm.toast('已经点过赞啦!');
-					.then(res => {
+                return;
-						if (res.status == 200) {
-							this.result.likes += 1;
-							uni.$tm.toast('\(^o^)/~点赞成功!');
-						} else {
-							uni.showToast({
-								icon: 'none',
-								title: res.message
-							});
             }
+            this.$httpApi.v2.submitUpvote({
+                group: "content.halo.run",
+                plural: "posts",
+                name: this.result?.metadata?.name
+            })
+                .then(res => {
+                    uni.$tm.toast('点赞成功!');
+                    upvote.set("post", this.result?.metadata?.name)
+                    this.fnHandleSetFlotButtonItems(this.haloConfigs);
                 })
                 .catch(err => {
-						uni.showToast({
+                    uni.$tm.toast('点赞失败');
-							icon: 'none',
-							title: err.message
-						});
                 });
         },
         fnShowShare() {
@@ -1017,7 +1018,8 @@
             font-size: 24rpx;
             color: #666;
 
-				&-name {}
+            &-name {
+            }
 
             &-time {
                 margin-left: 36rpx;

utils/upvote.js

@@ -0,0 +1,19 @@
+export const upvote = {
+	get(key) {
+		const data = uni.getStorageSync(`upvote.${key}.halo.run`)
+		if (data) {
+			return JSON.parse(data)
+		} else {
+			return []
+		}
+	},
+	has(key, name) {
+		const list = this.get(key)
+		if (list.length == 0) return false;
+		return list.includes(name)
+	},
+	set(key, name) {
+		const list = this.get(key)
+		uni.setStorageSync(`upvote.${key}.halo.run`, JSON.stringify([...list, name]))
+	}
+}