Hooke / mlaj

Go to a project
Toggle navigation Toggle navigation pinning
hookehuyr
ab20b8ec 1 parent cea5549b

feat(签到): 添加感恩次数统计功能 

在签到页面增加今日感恩次数和累计感恩次数的显示
修改postCountModel组件条件渲染逻辑和可选链操作
更新API文档添加感恩次数相关字段
Inline Side-by-side
Showing 3 changed files with 47 additions and 7 deletions
/*
* @Date: 2025-06-06 09:26:16
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2025-12-16 17:54:43
* @LastEditTime: 2025-12-17 09:47:48
* @FilePath: /mlaj/src/api/checkin.js
* @Description: 签到模块相关接口
*/
......@@ -38,7 +38,14 @@ export const getTaskListAPI = (params) => fn(fetch.get(Api.GET_TASK_LIST, param
* @param: i 作业ID
* @param: month 月份
* @param: subtask_id 小作业ID
* @returns data: { id 大作业id, cover 封面图, title 大作业名称, note 大作业描述, frequency 交作业的频次, cycle 交作业的周期 {0=本周期 | 30=每月 | 7=每周 | 1=每日}, attachment_type 上传附件的类型 [text=文本 image=图片 video=视频 audio=音频], begin_date 开始时间, end_date 结束时间, task_type 任务类型 [checkin=签到 | upload=上传附件 | count=计数], is_gray 作业是否应该置灰, is_finish 作业在当前周期是否已经达标, my_checkin_dates[] 我在日历中打过卡的日期, makeup_checkin_dates[] 我在日历中，可以补卡的日期, target_number 打卡的目标数量, checkin_number 已经打卡的数量, checkin_avatars 最后打卡的10个人的头像, subtask_list 小作业列表 [{id,title,cycle,frequency,attachment_type,begin_date,end_date,is_finish}] }
* @returns data: {
* id 大作业id, cover 封面图, title 大作业名称, note 大作业描述, frequency 交作业的频次, cycle 交作业的周期 {0=本周期 | 30=每月 | 7=每周 | 1=每日},
* attachment_type 上传附件的类型 [text=文本 image=图片 video=视频 audio=音频], begin_date 开始时间, end_date 结束时间,
* task_type 任务类型 [checkin=签到 | upload=上传附件 | count=计数], is_gray 作业是否应该置灰, is_finish 作业在当前周期是否已经达标,
* my_checkin_dates[] 我在日历中打过卡的日期, makeup_checkin_dates[] 我在日历中，可以补卡的日期, target_number 打卡的目标数量,
* checkin_number 已经打卡的数量, checkin_avatars 最后打卡的10个人的头像, my_today_gratitude_count 我在今天的感恩次数, my_total_gratitude_count 我累计感恩次数,
* subtask_list 小作业列表 [{id,title,cycle,frequency,attachment_type,begin_date,end_date,is_finish}] ,
* }
*/
export const getTaskDetailAPI = (params) => fn(fetch.get(Api.GET_TASK_DETAIL, params))
......
<!--
* @Date: 2025-12-11 17:26:25
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2025-12-17 09:38:07
* @LastEditTime: 2025-12-17 09:45:05
* @FilePath: /mlaj/src/components/count/postCountModel.vue
* @Description: 发布作业统计模型（包括感恩次数和感恩对象）
-->
<template>
<div v-if="postData.gratitude_count || postData.gratitude_form_list.length" class="post-count-model">
<div v-if="postData.gratitude_count" class="post-count-model">
<div class="flex justify-between items-center mb-2">
<div class="text-gray-500">感恩次数: </div>
<div class="font-bold">{{ postData.gratitude_count }} 次</div>
</div>
<div class="flex justify-between items-center">
<div class="text-gray-500">感恩对象: </div>
<div class="font-bold">{{ postData.gratitude_form_list.map(item => item.name).join('、') }}</div>
<div class="font-bold">{{ postData.gratitude_form_list?.map(item => item.name).join('、') }}</div>
</div>
</div>
</template>
......
<!--
* @Date: 2025-05-29 15:34:17
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2025-12-17 09:39:20
* @LastEditTime: 2025-12-17 10:05:41
* @FilePath: /mlaj/src/views/checkin/IndexCheckInPage.vue
* @Description: 文件描述
-->
......@@ -25,6 +25,30 @@
<!-- 可滚动的内容区域 -->
<div class="scrollable-content">
<div v-if="taskDetail.task_type === 'count'" class="text-wrapper" style="padding-bottom: 0;">
<div class="text-header">我的{{ dynamicFieldText }}</div>
<div style="margin: 0.5rem 0;">
<div class="flex items-center">
<!-- 今日次数 -->
<div class="flex-1 flex flex-col items-center border-r border-gray-100">
<div class="flex items-baseline">
<span class="text-3xl font-bold text-[#4caf50] leading-none">{{ myTodayGratitudeCount }}</span>
<span class="text-xs text-gray-400 ml-1 transform translate-y-0.5">次</span>
</div>
<div class="text-xs text-gray-500 mt-2">今日次数</div>
</div>
<!-- 累计次数 -->
<div class="flex-1 flex flex-col items-center">
<div class="flex items-baseline">
<span class="text-3xl font-bold text-[#ff9800] leading-none" style="color: #ff9800;">{{ myTotalGratitudeCount }}</span>
<span class="text-xs text-gray-400 ml-1 transform translate-y-0.5">次</span>
</div>
<div class="text-xs text-gray-500 mt-2">累计次数</div>
</div>
</div>
</div>
</div>
<div v-if="showProgress" class="text-wrapper">
<div class="text-header">目标进度</div>
<div style="background-color: #FFF; margin-top: 1rem;">
......@@ -60,7 +84,6 @@
</div>
</div>
<div class="text-wrapper">
<div class="text-header">打卡动态</div>
<van-list
......@@ -133,6 +156,9 @@ const route = useRoute()
const router = useRouter()
useTitle(route.meta.title);
// 动态字段文字
const dynamicFieldText = ref('感恩')
const myRefCalendar = ref(null);
// 窗口尺寸相关的响应式数据
......@@ -521,6 +547,11 @@ const isPatchCheckin = ref(false);
// 作品类型选项
const attachmentTypeOptions = ref([]);
// 今日计数次数
const myTodayGratitudeCount = ref(0);
// 累计计数次数
const myTotalGratitudeCount = ref(0);
const getTaskDetail = async (month) => {
const { code, data } = await getTaskDetailAPI({ i: route.query.id, month, subtask_id: selectedSubtaskId.value });
if (code) {
......@@ -536,6 +567,8 @@ const getTaskDetail = async (month) => {
// myCheckinDates.value = myCheckinDates.value.map(date => {
// return dayjs(date).date();
// })
myTodayGratitudeCount.value = data.my_today_gratitude_count;
myTotalGratitudeCount.value = data.my_total_gratitude_count;
}
}
......