feat(badges): 添加勋章系统和展示功能

实现完整的勋章系统,包括勋章列表展示、自动弹窗展示和分享功能。

- 新增勋章列表页面,支持已获得和待解锁勋章的分类展示
- 在个人中心添加勋章预览模块,显示前3个勋章和总数统计
- 实现勋章展示弹窗,支持动画效果和玻璃态UI
- 添加勋章分享功能,可生成分享卡片
- 新增 badgesSlice 管理勋章状态,包括获取、排序和计数逻辑
- 添加勋章服务 API 封装,支持获取勋章列表和标记已展示
- 完善中英文国际化文案
This commit is contained in:
richarjiang
2025-11-14 17:17:17 +08:00
parent 8cffbb990a
commit 705d921c14
10 changed files with 1125 additions and 0 deletions

29
services/badges.ts Normal file
View File

@@ -0,0 +1,29 @@
import { api } from './api';
export type BadgeCategory = 'sleep' | 'exercise' | 'diet' | 'challenge' | 'social' | 'special';
export type BadgeRarity = 'common' | 'uncommon' | 'rare' | 'epic' | 'legendary';
export interface BadgeDto {
code: string;
name: string;
description: string;
category: BadgeCategory;
rarity?: BadgeRarity;
imageUrl: string;
icon?: string;
sortOrder?: number;
earnedAt?: string | null;
awardedAt?: string | null;
isAwarded: boolean;
isShow?: boolean;
}
export async function getAvailableBadges(): Promise<BadgeDto[]> {
return api.get<BadgeDto[]>('/api/users/badges/available');
}
export async function reportBadgeShowcaseDisplayed(badgeCode: string): Promise<boolean> {
const response = await api.post<{ success: boolean }>('/users/badges/mark-shown', { badgeCode });
return Boolean(response?.success);
}