ソースを参照

feat(app/circle): 新增圈子点赞功能及评论组件调整

EvilDragon 6 ヶ月 前
コミット
80ad78356c

+ 27 - 0
packages/app/src/core/libs/actions.ts

@@ -0,0 +1,27 @@
+import { title } from 'radash'
+import { cancelCircleReviewUpvote, cancelCircleUpvote, createCircleUpvote } from './requests'
+
+const toast = (title: string) => uni.showToast({ title, icon: 'none' })
+export const handleUpvoteClick = async (
+  {
+    upvote,
+    circleId,
+    userId,
+    userName,
+  }: {
+    upvote: boolean
+    circleId: number
+    userId: number
+    userName: string
+  },
+  callback?: () => void,
+) => {
+  if (!upvote) {
+    const { code, msg } = await createCircleUpvote({ circleId, userId, userName })
+    code === 0 && toast('点赞成功')
+  } else {
+    const { code } = await cancelCircleUpvote({ id: circleId.toString() })
+    code === 0 && toast('取消点赞成功')
+  }
+  callback && callback()
+}

+ 4 - 0
packages/app/src/core/libs/requests.ts

@@ -204,6 +204,10 @@ export const createCircle = (data: Partial<Circle>) =>
   httpPost<any>('/app-api/member/circle/create', data)
 export const getCircle = (id: string) =>
   httpGet<Partial<CircleRes>>('/app-api/member/circle/get', { id })
+export const createCircleUpvote = (data: { circleId: number; userId: number; userName: string }) =>
+  httpPost('/app-api/member/circle-upvote/create', data)
+export const cancelCircleUpvote = (query: { id: string }) =>
+  httpGet('/app-apimember/circle-upvote/delete', query)
 export const createCircleReview = (
   data: Partial<{
     circleId: string

+ 12 - 2
packages/app/src/pages/home/moment/index.vue

@@ -4,7 +4,6 @@ style:
   navigationBarBackgroundColor: '#fff'
 </route>
 <script setup lang="ts">
-import SectionHeading from '@/components/section-heading.vue'
 import Tag from '@/components/tag.vue'
 import {
   createCircleReview,
@@ -12,8 +11,8 @@ import {
   getCircleReviews,
   getMoment,
 } from '../../../core/libs/requests'
+import { handleUpvoteClick } from '../../../core/libs/actions'
 import { thumbsUp } from '../../../core/libs/svgs'
-import dayjs from 'dayjs'
 import CommentItem from '../components/comment-item.vue'
 import AvatarGroupCasual from '@/components/avatar-group-casual/avatar-group-casual.vue'
 import { useUserStore } from '../../../store'
@@ -200,6 +199,17 @@ onLoad(async (query: { id: string }) => {
         </view>
         <view
           class="flex flex-col items-center text-[rgba(0,0,0,0.85)] text-3.5 font-400 line-height-5.5"
+          @click="
+            handleUpvoteClick(
+              {
+                upvote: data.ownUpvote,
+                circleId: data.id,
+                userId: userInfo.userId,
+                userName: userInfo.nickname,
+              },
+              () => run(),
+            )
+          "
         >
           <wd-img width="15" height="15" :src="thumbsUp"></wd-img>
           <view>{{ data.upvoteCount }}</view>