feat: 增加点赞功能

src/pages/index/index.vue

@@ -63,7 +63,10 @@
 
         <view class="flex items-center gap-5 border-t border-[#f0f0f0] px-3 py-2">
           <view class="flex items-center gap-1" @click="toggleLike(item)">
-            <wd-icon name="heart" color="#999"/>
+            <wd-icon
+                :name="item.liked ? 'heart-fill' : 'heart'"
+                :color="item.liked ? '#f87171' : '#999'"
+            />
             <text class="text-[24rpx] text-gray-400">
               {{ item.like_count }}
             </text>
@@ -154,8 +157,14 @@ function getUserInfo() {
   }
 }
 
-function toggleLike(item: IRecord) {
+async function toggleLike(item: IRecord) {
+  if (item.liked) {
+    await recordStore.deleteRecordLikeApi(item.id, userStore.currentUser.id)
+  } else {
+    await recordStore.addRecordLikeApi(item.id, userStore.currentUser.id)
+  }
 
+  paging.value.refresh()
 }
 
 function gridCols(count: number): string {
@@ -177,7 +186,7 @@ function queryList(pageNo, pageSize) {
     mask: true
   })
 
-  recordStore.getRecordListByPageApi(pageNo, pageSize).then(res => {
+  recordStore.getRecordListByPageApi(pageNo, pageSize, userStore.currentUser.id).then(res => {
     paging.value.complete(res.records);
   }).catch(res => {
     paging.value.complete(false);

src/store/record.ts

@@ -31,9 +31,6 @@ export const useRecordStore = defineStore('record', {
 
       this.isRefresh = !this.isRefresh
     },
-    async refreshRecord() {
-      this.recordList = await this.getRecordListApi()
-    },
     getEmptyForm(): IRecordForm {
       return {
         user_id: 0,
@@ -42,34 +39,14 @@ export const useRecordStore = defineStore('record', {
         video_list: []
       }
     },
-    async getRecordListApi() {
+    async getRecordListByPageApi(page: number, size: number, userId: number) {
-      return new Promise((resolve, reject) => {
-        wx.request({
-          url: `${this.baseUrl}/family-api/records`,
-          method: 'GET',
-          header: { 'Content-Type': 'application/json' },
-          data: {
-            skip: 0,
-            limit: 20
-          },
-          success: (res) => {
-            if (res.statusCode >= 200 && res.statusCode < 300) {
-              resolve(res.data)
-            } else {
-              reject({ status: res.statusCode, data: res.data })
-            }
-          },
-          fail: (err) => reject(err),
-        })
-      })
-    },
-    async getRecordListByPageApi(page: number, size: number) {
       return new Promise((resolve, reject) => {
         wx.request({
           url: `${this.baseUrl}/family-api/records/page`,
           method: 'GET',
           header: { 'Content-Type': 'application/json' },
           data: {
+            user_id: userId,
             page: page,
             size: size
           },
@@ -136,6 +113,44 @@ export const useRecordStore = defineStore('record', {
           fail: (err) => reject(err),
         })
       })
-    }
+    },
+    async addRecordLikeApi(recordId: number, userId: number) {
+      return new Promise((resolve, reject) => {
+        wx.request({
+          url: `${this.baseUrl}/family-api/likes`,
+          method: 'POST',
+          header: { 'Content-Type': 'application/json' },
+          data: {
+            record_id: recordId,
+            user_id: userId
+          },
+          success: (res) => {
+            if (res.statusCode >= 200 && res.statusCode < 300) {
+              resolve(res.data)
+            } else {
+              reject({ status: res.statusCode, data: res.data })
+            }
+          },
+          fail: (err) => reject(err),
+        })
+      })
+    },
+    async deleteRecordLikeApi(recordId: number, userId: number) {
+      return new Promise((resolve, reject) => {
+        wx.request({
+          url: `${this.baseUrl}/family-api/likes?record_id=${recordId}&user_id=${userId}`,
+          method: 'DELETE',
+          header: { 'Content-Type': 'application/json' },
+          success: (res) => {
+            if (res.statusCode >= 200 && res.statusCode < 300) {
+              resolve(res.data)
+            } else {
+              reject({ status: res.statusCode, data: res.data })
+            }
+          },
+          fail: (err) => reject(err),
+        })
+      })
+    },
   },
 })

src/types/family.ts

@@ -22,6 +22,7 @@ export interface IRecord {
     image_list: string[]
     video_list: string[]
     like_count: number
+    liked: boolean
     comment_count: number
     comments: IComment[]
     create_time: string