feat: 集成 Redux 状态管理和用户目标管理功能
- 添加 Redux 状态管理,支持用户登录和个人信息的持久化 - 新增目标管理页面,允许用户设置每日卡路里和步数目标 - 更新首页,移除旧的活动展示,改为固定的热点功能卡片 - 修改布局以适应新功能的展示和交互 - 更新依赖,添加 @reduxjs/toolkit 和 react-redux 库以支持状态管理 - 新增 API 服务模块,处理与后端的交互
This commit is contained in:
@@ -2,25 +2,13 @@ import { PlanCard } from '@/components/PlanCard';
|
||||
import { SearchBox } from '@/components/SearchBox';
|
||||
import { ThemedText } from '@/components/ThemedText';
|
||||
import { ThemedView } from '@/components/ThemedView';
|
||||
import { WorkoutCard } from '@/components/WorkoutCard';
|
||||
// Removed WorkoutCard import since we no longer use the horizontal carousel
|
||||
import { getChineseGreeting } from '@/utils/date';
|
||||
import { useRouter } from 'expo-router';
|
||||
import React, { useEffect, useRef } from 'react';
|
||||
import { SafeAreaView, ScrollView, StyleSheet, View } from 'react-native';
|
||||
import { Pressable, SafeAreaView, ScrollView, StyleSheet, View } from 'react-native';
|
||||
|
||||
const workoutData = [
|
||||
{
|
||||
id: 1,
|
||||
title: 'AI体态评估',
|
||||
duration: 5,
|
||||
imageSource: 'https://plates-1251306435.cos.ap-guangzhou.myqcloud.com/images/Imagettpg.png',
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
title: '认证教练',
|
||||
imageSource: require('@/assets/images/react-logo.png'),
|
||||
}
|
||||
];
|
||||
// 移除旧的“热门活动”滑动数据,改为固定的“热点功能”卡片
|
||||
|
||||
export default function HomeScreen() {
|
||||
const router = useRouter();
|
||||
@@ -46,34 +34,33 @@ export default function HomeScreen() {
|
||||
{/* Search Box */}
|
||||
<SearchBox placeholder="搜索" />
|
||||
|
||||
{/* Popular Workouts Section */}
|
||||
{/* Hot Features Section */}
|
||||
<View style={styles.sectionContainer}>
|
||||
<ThemedText style={styles.sectionTitle}>热门活动</ThemedText>
|
||||
<ThemedText style={styles.sectionTitle}>热点功能</ThemedText>
|
||||
|
||||
<ScrollView
|
||||
horizontal
|
||||
showsHorizontalScrollIndicator={false}
|
||||
contentContainerStyle={styles.workoutScrollContainer}
|
||||
style={styles.workoutScroll}
|
||||
>
|
||||
{workoutData.map((workout) => (
|
||||
<WorkoutCard
|
||||
key={workout.id}
|
||||
title={workout.title}
|
||||
duration={workout.duration}
|
||||
imageSource={workout.imageSource}
|
||||
onPress={() => {
|
||||
if (workout.title === 'AI体态评估') {
|
||||
router.push('/ai-posture-assessment');
|
||||
} else if (workout.title === '认证教练') {
|
||||
router.push('/health-consultation' as any);
|
||||
} else {
|
||||
console.log(`Pressed ${workout.title}`);
|
||||
}
|
||||
}}
|
||||
/>
|
||||
))}
|
||||
</ScrollView>
|
||||
<View style={styles.featureGrid}>
|
||||
<Pressable
|
||||
style={[styles.featureCard, styles.featureCardPrimary]}
|
||||
onPress={() => router.push('/ai-posture-assessment')}
|
||||
>
|
||||
<ThemedText style={styles.featureTitle}>AI体态评估</ThemedText>
|
||||
<ThemedText style={styles.featureSubtitle}>3分钟获取体态报告</ThemedText>
|
||||
<View style={styles.featureCta}>
|
||||
<ThemedText style={styles.featureCtaText}>开始评估</ThemedText>
|
||||
</View>
|
||||
</Pressable>
|
||||
|
||||
<Pressable
|
||||
style={[styles.featureCard, styles.featureCardSecondary]}
|
||||
onPress={() => router.push('/health-consultation' as any)}
|
||||
>
|
||||
<ThemedText style={styles.featureTitle}>在线教练</ThemedText>
|
||||
<ThemedText style={styles.featureSubtitle}>认证教练 · 1对1即时解答</ThemedText>
|
||||
<View style={styles.featureCta}>
|
||||
<ThemedText style={styles.featureCtaText}>立即咨询</ThemedText>
|
||||
</View>
|
||||
</Pressable>
|
||||
</View>
|
||||
</View>
|
||||
|
||||
{/* Today Plan Section */}
|
||||
@@ -144,15 +131,62 @@ const styles = StyleSheet.create({
|
||||
paddingHorizontal: 24,
|
||||
marginBottom: 18,
|
||||
},
|
||||
featureGrid: {
|
||||
paddingHorizontal: 24,
|
||||
flexDirection: 'row',
|
||||
justifyContent: 'space-between',
|
||||
},
|
||||
featureCard: {
|
||||
width: '48%',
|
||||
borderRadius: 16,
|
||||
padding: 16,
|
||||
backgroundColor: '#FFFFFF',
|
||||
// iOS shadow
|
||||
shadowColor: '#000',
|
||||
shadowOpacity: 0.08,
|
||||
shadowRadius: 12,
|
||||
shadowOffset: { width: 0, height: 6 },
|
||||
// Android shadow
|
||||
elevation: 4,
|
||||
},
|
||||
featureCardPrimary: {
|
||||
backgroundColor: '#EEF2FF', // 柔和的靛蓝背景
|
||||
},
|
||||
featureCardSecondary: {
|
||||
backgroundColor: '#F0FDFA', // 柔和的青绿背景
|
||||
},
|
||||
featureIcon: {
|
||||
fontSize: 28,
|
||||
marginBottom: 8,
|
||||
},
|
||||
featureTitle: {
|
||||
fontSize: 18,
|
||||
fontWeight: '700',
|
||||
color: '#0F172A',
|
||||
marginBottom: 6,
|
||||
},
|
||||
featureSubtitle: {
|
||||
fontSize: 12,
|
||||
color: '#6B7280',
|
||||
lineHeight: 16,
|
||||
marginBottom: 12,
|
||||
},
|
||||
featureCta: {
|
||||
alignSelf: 'flex-start',
|
||||
backgroundColor: '#0F172A',
|
||||
paddingHorizontal: 10,
|
||||
paddingVertical: 6,
|
||||
borderRadius: 999,
|
||||
},
|
||||
featureCtaText: {
|
||||
color: '#FFFFFF',
|
||||
fontSize: 12,
|
||||
fontWeight: '600',
|
||||
},
|
||||
planList: {
|
||||
paddingHorizontal: 24,
|
||||
},
|
||||
workoutScroll: {
|
||||
paddingLeft: 24,
|
||||
},
|
||||
workoutScrollContainer: {
|
||||
paddingRight: 24,
|
||||
},
|
||||
// 移除旧的滑动样式
|
||||
bottomSpacing: {
|
||||
height: 120,
|
||||
},
|
||||
|
||||
Reference in New Issue
Block a user