feat: 新增步数详情页面，支持日期选择和步数统计展示

feat: 更新StepsCard组件，支持点击事件回调
feat: 在WaterIntakeCard中添加震动反馈功能
fix: 在用户重建时保存authToken

components/StepsCard.tsx

@@ -3,6 +3,7 @@ import {
   Animated,
   StyleSheet,
   Text,
+  TouchableOpacity,
   View,
   ViewStyle
 } from 'react-native';
@@ -17,13 +18,15 @@ interface StepsCardProps {
   stepGoal: number;
   hourlySteps: HourlyStepData[];
   style?: ViewStyle;
+  onPress?: () => void; // 新增点击事件回调
 }
 
 const StepsCard: React.FC<StepsCardProps> = ({
   stepCount,
   stepGoal,
   hourlySteps,
-  style
+  style,
+  onPress
 }) => {
   // 为每个柱体创建独立的动画值
   const animatedValues = useRef(
@@ -69,8 +72,8 @@ const StepsCard: React.FC<StepsCardProps> = ({
     }
   }, [chartData, animatedValues]);
 
-  return (
-    <View style={[styles.container, style]}>
+  const CardContent = () => (
+    <>
       {/* 标题和步数显示 */}
       <View style={styles.header}>
         <Text style={styles.title}>步数</Text>
@@ -140,6 +143,26 @@ const StepsCard: React.FC<StepsCardProps> = ({
           resetToken={stepCount}
         />
       </View>
+    </>
+  );
+
+  // 如果有点击事件，包装在TouchableOpacity中
+  if (onPress) {
+    return (
+      <TouchableOpacity
+        style={[styles.container, style]}
+        onPress={onPress}
+        activeOpacity={0.8}
+      >
+        <CardContent />
+      </TouchableOpacity>
+    );
+  }
+
+  // 否则使用普通View
+  return (
+    <View style={[styles.container, style]}>
+      <CardContent />
     </View>
   );
 };