richard/digital-pilates
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 添加教练功能和更新用户界面

Browse Source 
- 新增教练页面，用户可以与教练进行互动和咨询
- 更新首页，切换到教练 tab 并传递名称参数
- 优化个人信息页面，添加注销帐号和退出登录功能
- 更新隐私政策和用户协议的链接，确保用户在使用前同意相关条款
- 修改今日训练页面标题为“开始训练”，提升用户体验
- 删除不再使用的进度条组件，简化代码结构
This commit is contained in:
richarjiang
2025-08-15 21:38:19 +08:00
parent 97e89b9bf0
commit 3312250f2d
13 changed files with 1385 additions and 130 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
app/(tabs)/_layout.tsx
View File

@@ -18,6 +18,7 @@ export default function TabLayout() {
screenOptions={({ route }) => {
const routeName = route.name;
const isSelected = (routeName === 'index' && pathname === '/') ||
(routeName === 'coach' && pathname === '/coach') ||
(routeName === 'explore' && pathname === '/explore') ||
pathname.includes(routeName);
@@ -39,6 +40,8 @@ export default function TabLayout() {
switch (routeName) {
case 'index':
return { icon: 'house.fill', title: '首页' } as const;
case 'coach':
return { icon: 'person.3.fill', title: '教练' } as const;
case 'explore':
return { icon: 'paperplane.fill', title: '探索' } as const;
case 'personal':
@@ -150,6 +153,34 @@ export default function TabLayout() {
},
}}
/>
<Tabs.Screen
name="coach"
options={{
title: '教练',
tabBarIcon: ({ color }) => {
const isCoachSelected = pathname === '/coach';
return (
<View style={{ flexDirection: 'row', alignItems: 'center' }}>
<IconSymbol size={22} name="person.3.fill" color={color} />
{isCoachSelected && (
<Text
numberOfLines={1}
style={{
color: color,
fontSize: 12,
fontWeight: '600',
marginLeft: 6,
textAlign: 'center',
flexShrink: 0,
}}>
教练
</Text>
)}
</View>
);
},
}}
/>
<Tabs.Screen
name="explore"
options={{

1158
app/(tabs)/coach.tsx Normal file
View File

File diff suppressed because it is too large Load Diff

36
app/(tabs)/index.tsx
View File

@@ -75,9 +75,8 @@ export default function HomeScreen() {
const snapX = distLeft <= distRight ? minX : maxX;
Animated.spring(pan, { toValue: { x: snapX, y: clampedY }, useNativeDriver: false, bounciness: 6 }).start(() => {
if (!dragState.current.moved) {
// Treat as tap
// @ts-ignore - expo-router string ok
router.push('/ai-coach-chat?name=Iris' as any);
// 切换到教练 tab，并传递name参数
router.push('/coach?name=Iris' as any);
}
});
},
@@ -91,7 +90,6 @@ export default function HomeScreen() {
title: string;
subtitle: string;
level?: '初学者' | '中级' | '高级';
progress: number;
onPress?: () => void;
}
| {
@@ -115,7 +113,6 @@ export default function HomeScreen() {
title: '今日训练',
subtitle: '完成一次普拉提训练，记录你的坚持',
level: '初学者',
progress: 0,
onPress: () => pushIfAuthedElseLogin('/workout/today'),
},
{
@@ -126,7 +123,6 @@ export default function HomeScreen() {
title: '体态评估',
subtitle: '评估你的体态，制定训练计划',
level: '初学者',
progress: 0,
onPress: () => router.push('/ai-posture-assessment'),
},
...listRecommendedArticles().map((a) => ({
@@ -194,7 +190,6 @@ export default function HomeScreen() {
image: 'https://plates-1251306435.cos.ap-guangzhou.myqcloud.com/images/imagedemo.jpeg',
title: c.title || '今日训练',
subtitle: c.subtitle || '完成一次普拉提训练，记录你的坚持',
progress: 0,
onPress: () => pushIfAuthedElseLogin('/workout/today'),
});
}
@@ -282,6 +277,22 @@ export default function HomeScreen() {
<ThemedText style={styles.sectionTitle}>热点功能</ThemedText>
<View style={styles.featureGrid}>
<Pressable
style={[styles.featureCard, styles.featureCardQuinary]}
onPress={() => pushIfAuthedElseLogin('/workout/today')}
>
<View style={styles.featureIconWrapper}>
<View style={styles.featureIconPlaceholder}>
<Image
source={require('@/assets/images/icons/iconWorkout.png')}
style={styles.featureIconImage}
/>
</View>
</View>
<ThemedText style={styles.featureTitle}>训练</ThemedText>
</Pressable>
<Pressable
style={[styles.featureCard, styles.featureCardPrimary]}
onPress={() => router.push('/ai-posture-assessment')}
@@ -292,7 +303,7 @@ export default function HomeScreen() {
style={styles.featureIconImage}
/>
</View>
<ThemedText style={styles.featureTitle}>AI体态评估</ThemedText>
<ThemedText style={styles.featureTitle}>体态</ThemedText>
</Pressable>
<Pressable
@@ -307,8 +318,11 @@ export default function HomeScreen() {
/>
</View>
</View>
<ThemedText style={styles.featureTitle}>计划管理</ThemedText>
<ThemedText style={styles.featureTitle}>计划</ThemedText>
</Pressable>
</View>
</View>
@@ -344,7 +358,6 @@ export default function HomeScreen() {
title={item.title}
subtitle={item.subtitle}
level={item.level}
progress={item.progress}
/>
);
return item.onPress ? (
@@ -490,6 +503,9 @@ const styles = StyleSheet.create({
featureCardQuaternary: {
backgroundColor: '#fa709a',
},
featureCardQuinary: {
backgroundColor: '#f59e0b',
},
featureIconWrapper: {
width: 32,
height: 32,

111
app/(tabs)/personal.tsx
View File

@@ -1,23 +1,23 @@
import { PRIVACY_POLICY_URL, USER_AGREEMENT_URL } from '@/constants/Agree';
import { Colors } from '@/constants/Colors';
import { getTabBarBottomPadding } from '@/constants/TabBar';
import { useAppDispatch, useAppSelector } from '@/hooks/redux';
import { useAuthGuard } from '@/hooks/useAuthGuard';
import { useColorScheme } from '@/hooks/useColorScheme';
import { api } from '@/services/api';
import { DEFAULT_MEMBER_NAME, fetchMyProfile, logout } from '@/store/userSlice';
import { DEFAULT_MEMBER_NAME, fetchMyProfile } from '@/store/userSlice';
import { Ionicons } from '@expo/vector-icons';
import AsyncStorage from '@react-native-async-storage/async-storage';
import { useBottomTabBarHeight } from '@react-navigation/bottom-tabs';
import { useFocusEffect } from '@react-navigation/native';
import type { Href } from 'expo-router';
import { router } from 'expo-router';
import React, { useMemo, useState } from 'react';
import { Alert, Image, SafeAreaView, ScrollView, StatusBar, StyleSheet, Switch, Text, TouchableOpacity, View } from 'react-native';
import { Alert, Image, Linking, SafeAreaView, ScrollView, StatusBar, StyleSheet, Switch, Text, TouchableOpacity, View } from 'react-native';
import { useSafeAreaInsets } from 'react-native-safe-area-context';
const DEFAULT_AVATAR_URL = 'https://plates-1251306435.cos.ap-guangzhou.myqcloud.com/images/avatar/avatarGirl01.jpeg';
export default function PersonalScreen() {
const dispatch = useAppDispatch();
const { confirmLogout, confirmDeleteAccount, isLoggedIn, pushIfAuthedElseLogin } = useAuthGuard();
const insets = useSafeAreaInsets();
const tabBarHeight = useBottomTabBarHeight();
const colorScheme = useColorScheme();
@@ -95,32 +95,7 @@ export default function PersonalScreen() {
const handleDeleteAccount = () => {
Alert.alert(
'确认注销帐号',
'此操作不可恢复，将删除您的帐号及相关数据。确定继续吗？',
[
{ text: '取消', style: 'cancel' },
{
text: '确认注销',
style: 'destructive',
onPress: async () => {
try {
await api.delete('/api/users/delete-account');
await AsyncStorage.multiRemove(['@user_personal_info']);
await dispatch(logout()).unwrap();
Alert.alert('帐号已注销', '您的帐号已成功注销');
router.replace('/auth/login');
} catch (err: any) {
const message = err?.message || '注销失败，请稍后重试';
Alert.alert('注销失败', message);
}
},
},
],
{ cancelable: true }
);
};
const UserInfoSection = () => (
<View style={[styles.userInfoCard, { backgroundColor: colorTokens.card }]}>
@@ -138,7 +113,7 @@ export default function PersonalScreen() {
</View>
{/* 编辑按钮 */}
<TouchableOpacity style={dynamicStyles.editButton} onPress={() => router.push('/profile/edit')}>
<TouchableOpacity style={dynamicStyles.editButton} onPress={() => pushIfAuthedElseLogin('/profile/edit')}>
<Text style={dynamicStyles.editButtonText}>编辑</Text>
</TouchableOpacity>
</View>
@@ -170,7 +145,8 @@ export default function PersonalScreen() {
<TouchableOpacity
key={index}
style={styles.menuItem}
onPress={item.onPress}
onPress={item.type === 'switch' ? undefined : item.onPress}
disabled={item.type === 'switch'}
>
<View style={styles.menuItemLeft}>
<View style={[
@@ -187,8 +163,14 @@ export default function PersonalScreen() {
</View>
{item.type === 'switch' ? (
<Switch
value={notificationEnabled}
onValueChange={setNotificationEnabled}
value={isLoggedIn ? notificationEnabled : false}
onValueChange={(value) => {
if (!isLoggedIn) {
pushIfAuthedElseLogin('/profile/notification-settings');
return;
}
setNotificationEnabled(value);
}}
trackColor={{ false: '#E5E5E5', true: colors.primary }}
thumbColor="#FFFFFF"
style={styles.switch}
@@ -243,12 +225,20 @@ export default function PersonalScreen() {
{
icon: 'flag-outline' as const,
title: '目标管理',
onPress: () => router.push('/profile/goals' as Href),
},
{
icon: 'stats-chart-outline' as const,
title: '训练进度',
onPress: () => pushIfAuthedElseLogin('/profile/goals'),
},
// {
// icon: 'stats-chart-outline' as const,
// title: '训练进度',
// onPress: () => {
// // 训练进度页面暂未实现，先显示提示
// if (isLoggedIn) {
// Alert.alert('提示', '训练进度功能正在开发中');
// } else {
// pushIfAuthedElseLogin('/profile/training-progress');
// }
// },
// },
],
},
{
@@ -264,42 +254,36 @@ export default function PersonalScreen() {
{
title: '其他',
items: [
{
icon: 'mail-outline' as const,
title: '联系我们',
},
{
icon: 'shield-checkmark-outline' as const,
title: '隐私政策',
onPress: () => Linking.openURL(PRIVACY_POLICY_URL),
},
{
icon: 'settings-outline' as const,
title: '设置',
icon: 'document-text-outline' as const,
title: '用户协议',
onPress: () => Linking.openURL(USER_AGREEMENT_URL),
},
],
},
{
// 只有登录用户才显示账号与安全菜单
...(isLoggedIn ? [{
title: '账号与安全',
items: [
{
icon: 'log-out-outline' as const,
title: '退出登录',
onPress: confirmLogout,
isDanger: false,
},
{
icon: 'trash-outline' as const,
title: '注销帐号',
onPress: handleDeleteAccount,
onPress: confirmDeleteAccount,
isDanger: true,
},
],
},
{
title: '开发者',
items: [
{
icon: 'refresh-outline' as const,
title: '重置引导流程',
onPress: handleResetOnboarding,
isDanger: true,
},
],
},
}] : []),
];
return (
@@ -317,12 +301,6 @@ export default function PersonalScreen() {
<MenuSection key={index} title={section.title} items={section.items} />
))}
{/* 底部浮动按钮 */}
<View style={[styles.floatingButtonContainer, { bottom: Math.max(30, tabBarHeight / 2) + (insets?.bottom ?? 0) }]}>
<TouchableOpacity style={dynamicStyles.floatingButton}>
<Ionicons name="search" size={24} color="#192126" />
</TouchableOpacity>
</View>
</ScrollView>
</SafeAreaView>
</View>
@@ -430,6 +408,7 @@ const styles = StyleSheet.create({
menuItemText: {
fontSize: 16,
flex: 1,
fontWeight: '600',
},
switch: {
transform: [{ scaleX: 0.8 }, { scaleY: 0.8 }],