feat: 更新统计页面，优化HRV数据展示和逻辑

- 移除模拟HRV数据，改为从健康数据中获取实际HRV值
- 新增HRV更新时间显示，提升用户信息获取体验
- 优化日期推导逻辑，确保数据加载一致性
- 更新BMI卡片和营养雷达图组件，支持紧凑模式展示
- 移除不再使用的图片资源，简化项目结构

app/(tabs)/statistics.tsx

@@ -73,8 +73,8 @@ export default function ExploreScreen() {
   // 睡眠时长（分钟）
   const [sleepDuration, setSleepDuration] = useState<number | null>(null);
   // HRV数据
-  const [hrvValue, setHrvValue] = useState<number>(69);
+  const [hrvValue, setHrvValue] = useState<number>(0);
-  const [hrvStatus, setHrvStatus] = useState<'放松' | '正常' | '紧张'>('正常');
+  const [hrvUpdateTime, setHrvUpdateTime] = useState<Date>(new Date());
 
   const [isLoading, setIsLoading] = useState(false);
   // 用于触发动画重置的 token（当日期或数据变化时更新）
@@ -103,8 +103,14 @@ export default function ExploreScreen() {
         return;
       }
 
-      // 若未显式传入日期，按当前选中索引推导日期
+      // 确定要查询的日期：优先使用传入的日期，否则使用当前选中索引对应的日期
-      const derivedDate = targetDate ?? days[selectedIndex]?.date?.toDate() ?? new Date();
+      let derivedDate: Date;
+      if (targetDate) {
+        derivedDate = targetDate;
+      } else {
+        derivedDate = days[selectedIndex]?.date?.toDate() ?? new Date();
+      }
+      
       const requestKey = getDateKey(derivedDate);
       latestRequestKeyRef.current = requestKey;
 
@@ -118,18 +124,11 @@ export default function ExploreScreen() {
         setActiveCalories(Math.round(data.activeEnergyBurned));
         setSleepDuration(data.sleepDuration);
 
-        // 模拟HRV数据（实际应用中应从HealthKit获取）
+        const hrv = data.hrv ?? 0;
-        const simulatedHrv = Math.floor(Math.random() * 80) + 30; // 30-110ms范围
+        setHrvValue(hrv);
-        setHrvValue(simulatedHrv);
 
-        // 根据HRV值判断状态
+        // 更新HRV数据时间
-        if (simulatedHrv >= 70) {
+        setHrvUpdateTime(new Date());
-          setHrvStatus('放松');
-        } else if (simulatedHrv >= 40) {
-          setHrvStatus('正常');
-        } else {
-          setHrvStatus('紧张');
-        }
 
         setAnimToken((t) => t + 1);
       } else {
@@ -149,8 +148,13 @@ export default function ExploreScreen() {
     try {
       setIsNutritionLoading(true);
 
-      // 若未显式传入日期，按当前选中索引推导日期
+      // 确定要查询的日期：优先使用传入的日期，否则使用当前选中索引对应的日期
-      const derivedDate = targetDate ?? days[selectedIndex]?.date?.toDate() ?? new Date();
+      let derivedDate: Date;
+      if (targetDate) {
+        derivedDate = targetDate;
+      } else {
+        derivedDate = days[selectedIndex]?.date?.toDate() ?? new Date();
+      }
 
       console.log('加载营养数据...', derivedDate);
       const data = await getDietRecords({
@@ -177,11 +181,14 @@ export default function ExploreScreen() {
   useFocusEffect(
     React.useCallback(() => {
       // 聚焦时按当前选中的日期加载，避免与用户手动选择的日期不一致
-      loadHealthData();
+      const currentDate = days[selectedIndex]?.date?.toDate();
-      if (isLoggedIn) {
+      if (currentDate) {
-        loadNutritionData();
+        loadHealthData(currentDate);
+        if (isLoggedIn) {
+          loadNutritionData(currentDate);
+        }
       }
-    }, [])
+    }, [selectedIndex])
   );
 
   // 日期点击时，加载对应日期数据
@@ -210,15 +217,6 @@ export default function ExploreScreen() {
           <Text style={styles.sectionTitle}>健康数据</Text>
           <WeightHistoryCard />
 
-          {/* HRV压力监测卡片 */}
-          <StressMeter value={hrvValue} status={hrvStatus} />
-
-          {/* 查看更多 */}
-          <View style={styles.viewMoreContainer}>
-            <Text style={styles.viewMoreText}>查看更多</Text>
-            <Ionicons name="chevron-forward" size={16} color="#192126" style={styles.viewMoreIcon} />
-          </View>
-
           {/* 标题与日期选择 */}
           <Text style={styles.monthTitle}>{monthTitle}</Text>
           <ScrollView
@@ -252,23 +250,17 @@ export default function ExploreScreen() {
             isLoading={isNutritionLoading}
           />
 
-          {/* 指标行：左大卡（训练时间），右两小卡（消耗卡路里、步数） */}
+          {/* 真正瀑布流布局 */}
-          <View style={styles.metricsRow}>
+          <View style={styles.masonryContainer}>
-            <View style={[styles.trainingCard, styles.metricsLeft]}>
+            {/* 左列 */}
-              <Text style={styles.cardTitleSecondary}>训练时间</Text>
+            <View style={styles.masonryColumn}>
-              <View style={styles.trainingContent}>
+              <StressMeter 
-                <CircularRing
+                value={hrvValue} 
-                  size={120}
+                updateTime={hrvUpdateTime}
-                  strokeWidth={12}
+                style={styles.masonryCard}
-                  trackColor="#E2D9FD"
+              />
-                  progressColor="#8B74F3"
+              
-                  progress={trainingProgress}
+              <View style={[styles.masonryCard, styles.caloriesCard]}>
-                  resetToken={animToken}
-                />
-              </View>
-            </View>
-            <View style={styles.metricsRight}>
-              <View style={[styles.metricsRightCard, styles.caloriesCard, { minHeight: 88 }]}>
                 <Text style={styles.cardTitleSecondary}>消耗卡路里</Text>
                 {activeCalories != null ? (
                   <AnimatedNumber
@@ -281,9 +273,12 @@ export default function ExploreScreen() {
                   <Text style={styles.caloriesValue}>——</Text>
                 )}
               </View>
-              <View style={[styles.metricsRightCard, styles.stepsCard, { minHeight: 88 }]}>
+
+              <View style={[styles.masonryCard, styles.stepsCard]}>
                 <View style={styles.cardHeaderRow}>
-                  <View style={styles.iconSquare}><Ionicons name="footsteps-outline" size={18} color="#192126" /></View>
+                  <View style={styles.iconSquare}>
+                    <Ionicons name="footsteps-outline" size={18} color="#192126" />
+                  </View>
                   <Text style={styles.cardTitle}>步数</Text>
                 </View>
                 {stepCount != null ? (
@@ -298,20 +293,56 @@ export default function ExploreScreen() {
                 )}
                 <ProgressBar
                   progress={Math.min(1, Math.max(0, (stepCount ?? 0) / stepGoal))}
-                  height={18}
+                  height={16}
                   trackColor="#FFEBCB"
                   fillColor="#FFC365"
                   showLabel={false}
                 />
               </View>
             </View>
+
+            {/* 右列 */}
+            <View style={styles.masonryColumn}>
+              <BMICard
+                weight={userProfile?.weight ? parseFloat(userProfile.weight) : undefined}
+                height={userProfile?.height ? parseFloat(userProfile.height) : undefined}
+                style={styles.masonryCardNoBg}
+                compact={true}
+              />
+
+              <View style={[styles.masonryCard, styles.trainingCard]}>
+                <Text style={styles.cardTitleSecondary}>训练时间</Text>
+                <View style={styles.trainingContent}>
+                                      <CircularRing
+                      size={120}
+                      strokeWidth={12}
+                      trackColor="#E2D9FD"
+                      progressColor="#8B74F3"
+                      progress={trainingProgress}
+                      resetToken={animToken}
+                    />
+                </View>
+              </View>
+
+              <View style={[styles.masonryCard, styles.sleepCard]}>
+                <View style={styles.cardHeaderRow}>
+                  <View style={styles.iconSquare}>
+                    <Ionicons name="moon-outline" size={18} color="#192126" />
+                  </View>
+                  <Text style={styles.cardTitle}>睡眠</Text>
+                </View>
+                {sleepDuration != null ? (
+                  <Text style={styles.sleepValue}>
+                    {Math.floor(sleepDuration / 60)}小时{Math.floor(sleepDuration % 60)}分钟
+                  </Text>
+                ) : (
+                  <Text style={styles.sleepValue}>——</Text>
+                )}
+              </View>
+            </View>
           </View>
 
-          {/* BMI 指数卡片 */}
+
-          <BMICard
-            weight={userProfile?.weight ? parseFloat(userProfile.weight) : undefined}
-            height={userProfile?.height ? parseFloat(userProfile.height) : undefined}
-          />
 
 
 
@@ -596,4 +627,77 @@ const styles = StyleSheet.create({
     color: '#192126',
     marginLeft: 4,
   },
+  stressCardRow: {
+    flexDirection: 'row',
+    justifyContent: 'flex-start',
+    marginBottom: 16,
+  },
+  healthCardsRow: {
+    flexDirection: 'row',
+    justifyContent: 'space-between',
+    marginBottom: 16,
+  },
+  compactBMICard: {
+    width: 140,
+    minHeight: 110,
+  },
+  healthMetricsContainer: {
+    marginBottom: 16,
+  },
+  masonryContainer: {
+    marginBottom: 16,
+    flexDirection: 'row',
+    justifyContent: 'space-between',
+  },
+  masonryColumn: {
+    flex: 1,
+    marginHorizontal: 3,
+  },
+  masonryCard: {
+    width: '100%',
+    backgroundColor: '#FFFFFF',
+    borderRadius: 16,
+    padding: 16,
+    shadowColor: '#000',
+    shadowOffset: {
+      width: 0,
+      height: 2,
+    },
+    shadowOpacity: 0.08,
+    shadowRadius: 8,
+    elevation: 3,
+    marginBottom: 8,
+  },
+  masonryCardNoBg: {
+    width: '100%',
+    borderRadius: 16,
+    padding: 16,
+    shadowColor: '#000',
+    shadowOffset: {
+      width: 0,
+      height: 2,
+    },
+    shadowOpacity: 0.08,
+    shadowRadius: 8,
+    elevation: 3,
+    marginBottom: 8,
+  },
+  compactStepsCard: {
+    minHeight: 100,
+  },
+  stepsContent: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    justifyContent: 'space-between',
+    marginTop: 8,
+  },
+  sleepCard: {
+    backgroundColor: '#E8F4FD',
+  },
+  sleepValue: {
+    fontSize: 16,
+    color: '#1E40AF',
+    fontWeight: '700',
+    marginTop: 8,
+  },
 });

components/BMICard.tsx

@@ -1,20 +1,20 @@
 import { useAuthGuard } from '@/hooks/useAuthGuard';
 import {
-  BMI_CATEGORIES,
+    BMI_CATEGORIES,
-  canCalculateBMI,
+    canCalculateBMI,
-  getBMIResult,
+    getBMIResult,
-  type BMIResult
+    type BMIResult
 } from '@/utils/bmi';
 import { Ionicons } from '@expo/vector-icons';
 import React, { useState } from 'react';
 import {
-  Dimensions,
+    Dimensions,
-  Modal,
+    Modal,
-  Pressable,
+    Pressable,
-  StyleSheet,
+    StyleSheet,
-  Text,
+    Text,
-  TouchableOpacity,
+    TouchableOpacity,
-  View
+    View
 } from 'react-native';
 import Toast from 'react-native-toast-message';
 
@@ -24,9 +24,10 @@ interface BMICardProps {
   weight?: number;
   height?: number;
   style?: any;
+  compact?: boolean;
 }
 
-export function BMICard({ weight, height, style }: BMICardProps) {
+export function BMICard({ weight, height, style, compact = false }: BMICardProps) {
   const { pushIfAuthedElseLogin } = useAuthGuard();
   const [showInfoModal, setShowInfoModal] = useState(false);
 
@@ -61,14 +62,75 @@ export function BMICard({ weight, height, style }: BMICardProps) {
     if (!canCalculate) {
       // 缺少数据的情况
       return (
-        <View style={styles.incompleteContent}>
+        <TouchableOpacity 
+          style={[styles.incompleteContent, compact && styles.compactIncompleteContent]}
+          onPress={handleShowInfoModal}
+          activeOpacity={0.8}
+        >
           <View style={styles.cardHeader}>
             <View style={styles.titleRow}>
               <View style={styles.iconSquare}>
-                <Ionicons name="fitness-outline" size={18} color="#192126" />
+                <Ionicons name="fitness-outline" size={16} color="#192126" />
               </View>
-              <Text style={styles.cardTitle}>BMI 指数</Text>
+              <Text style={[styles.cardTitle, compact && styles.compactTitle]}>BMI</Text>
             </View>
+            {!compact && (
+              <TouchableOpacity
+                onPress={handleShowInfoModal}
+                style={styles.infoButton}
+                hitSlop={{ top: 10, bottom: 10, left: 10, right: 10 }}
+              >
+                <Ionicons name="information-circle-outline" size={20} color="#9AA3AE" />
+              </TouchableOpacity>
+            )}
+          </View>
+
+          {compact ? (
+            <View style={styles.compactMissingData}>
+              <Text style={styles.compactMissingText}>
+                {!weight && !height ? '完善身高体重' :
+                  !weight ? '完善体重' : '完善身高'}
+              </Text>
+            </View>
+          ) : (
+            <>
+              <View style={styles.missingDataContainer}>
+                <Ionicons name="alert-circle-outline" size={24} color="#F59E0B" />
+                <Text style={styles.missingDataText}>
+                  {!weight && !height ? '请完善身高和体重信息' :
+                    !weight ? '请完善体重信息' : '请完善身高信息'}
+                </Text>
+              </View>
+
+              <TouchableOpacity
+                onPress={handleGoToProfile}
+                style={styles.completeButton}
+                activeOpacity={0.8}
+              >
+                <Text style={styles.completeButtonText}>前往完善</Text>
+                <Ionicons name="chevron-forward" size={16} color="#6B7280" />
+              </TouchableOpacity>
+            </>
+          )}
+        </TouchableOpacity>
+      );
+    }
+
+    // 有完整数据的情况
+    return (
+      <TouchableOpacity 
+        style={[styles.completeContent, { backgroundColor: bmiResult?.backgroundColor }, compact && styles.compactCompleteContent]}
+        onPress={handleShowInfoModal}
+        activeOpacity={0.8}
+      >
+        <View style={styles.cardHeader}>
+          <View style={styles.titleRow}>
+            <View style={styles.iconSquare}>
+              <Ionicons name="fitness-outline" size={16} color="#192126" />
+            </View>
+            <Text style={[styles.cardTitle, compact && styles.compactTitle]}>BMI</Text>
+          </View>
+          {!compact && (
             <TouchableOpacity
               onPress={handleShowInfoModal}
               style={styles.infoButton}
@@ -76,66 +138,41 @@ export function BMICard({ weight, height, style }: BMICardProps) {
             >
               <Ionicons name="information-circle-outline" size={20} color="#9AA3AE" />
             </TouchableOpacity>
-          </View>
+          )}
+        </View>
 
-          <View style={styles.missingDataContainer}>
+        {compact ? (
-            <Ionicons name="alert-circle-outline" size={24} color="#F59E0B" />
+          <View style={styles.compactBMIContent}>
-            <Text style={styles.missingDataText}>
+            <Text style={[styles.compactBMIValue, { color: bmiResult?.color }]}>
-              {!weight && !height ? '请完善身高和体重信息' :
+              {bmiResult?.value}
-                !weight ? '请完善体重信息' : '请完善身高信息'}
             </Text>
-          </View>
+            <Text style={[styles.compactBMICategory, { color: bmiResult?.color }]}>
-
-          <TouchableOpacity
-            onPress={handleGoToProfile}
-            style={styles.completeButton}
-            activeOpacity={0.8}
-          >
-            <Text style={styles.completeButtonText}>前往完善</Text>
-            <Ionicons name="chevron-forward" size={16} color="#6B7280" />
-          </TouchableOpacity>
-        </View>
-      );
-    }
-
-    // 有完整数据的情况
-    return (
-      <View style={[styles.completeContent, { backgroundColor: bmiResult?.backgroundColor }]}>
-        <View style={styles.cardHeader}>
-          <View style={styles.titleRow}>
-            <View style={styles.iconSquare}>
-              <Ionicons name="fitness-outline" size={18} color="#192126" />
-            </View>
-            <Text style={styles.cardTitle}>BMI 指数</Text>
-          </View>
-          <TouchableOpacity
-            onPress={handleShowInfoModal}
-            style={styles.infoButton}
-            hitSlop={{ top: 10, bottom: 10, left: 10, right: 10 }}
-          >
-            <Ionicons name="information-circle-outline" size={20} color="#9AA3AE" />
-          </TouchableOpacity>
-        </View>
-
-        <View style={styles.bmiValueContainer}>
-          <Text style={[styles.bmiValue, { color: bmiResult?.color }]}>
-            {bmiResult?.value}
-          </Text>
-          <View style={[styles.categoryBadge, { backgroundColor: bmiResult?.color + '20' }]}>
-            <Text style={[styles.categoryText, { color: bmiResult?.color }]}>
               {bmiResult?.category.name}
             </Text>
           </View>
-        </View>
+        ) : (
+          <>
+            <View style={styles.bmiValueContainer}>
+              <Text style={[styles.bmiValue, { color: bmiResult?.color }]}>
+                {bmiResult?.value}
+              </Text>
+              <View style={[styles.categoryBadge, { backgroundColor: bmiResult?.color + '20' }]}>
+                <Text style={[styles.categoryText, { color: bmiResult?.color }]}>
+                  {bmiResult?.category.name}
+                </Text>
+              </View>
+            </View>
 
-        <Text style={[styles.bmiDescription, { color: bmiResult?.color }]}>
+            <Text style={[styles.bmiDescription, { color: bmiResult?.color }]}>
-          {bmiResult?.description}
+              {bmiResult?.description}
-        </Text>
+            </Text>
 
-        <Text style={styles.encouragementText}>
+            <Text style={styles.encouragementText}>
-          {bmiResult?.category.encouragement}
+              {bmiResult?.category.encouragement}
-        </Text>
+            </Text>
-      </View>
+          </>
+        )}
+      </TouchableOpacity>
     );
   };
 
@@ -359,6 +396,46 @@ const styles = StyleSheet.create({
     fontStyle: 'italic',
   },
 
+  // 紧凑模式样式
+  compactIncompleteContent: {
+    minHeight: 110,
+    padding: 14,
+    margin: -14,
+  },
+  compactCompleteContent: {
+    minHeight: 110,
+    padding: 14,
+    margin: -14,
+  },
+  compactTitle: {
+    fontSize: 14,
+  },
+  compactMissingData: {
+    alignItems: 'center',
+    justifyContent: 'center',
+    flex: 1,
+  },
+  compactMissingText: {
+    fontSize: 12,
+    color: '#9AA3AE',
+    fontWeight: '500',
+    textAlign: 'center',
+  },
+  compactBMIContent: {
+    alignItems: 'center',
+    justifyContent: 'center',
+    flex: 1,
+  },
+  compactBMIValue: {
+    fontSize: 28,
+    fontWeight: '800',
+    marginBottom: 4,
+  },
+  compactBMICategory: {
+    fontSize: 12,
+    fontWeight: '700',
+  },
+
   // 弹窗样式
   modalBackdrop: {
     flex: 1,

components/NutritionRadarCard.tsx

@@ -9,7 +9,6 @@ import { RadarCategory, RadarChart } from './RadarChart';
 
 export type NutritionRadarCardProps = {
   nutritionSummary: NutritionSummary | null;
-  isLoading?: boolean;
 };
 
 // 营养维度定义
@@ -22,7 +21,7 @@ const NUTRITION_DIMENSIONS: RadarCategory[] = [
   { key: 'sodium', label: '钠' },
 ];
 
-export function NutritionRadarCard({ nutritionSummary, isLoading = false }: NutritionRadarCardProps) {
+export function NutritionRadarCard({ nutritionSummary }: NutritionRadarCardProps) {
   const radarValues = useMemo(() => {
     // 基于推荐日摄入量计算分数
     const recommendations = {
@@ -71,33 +70,26 @@ export function NutritionRadarCard({ nutritionSummary, isLoading = false }: Nutr
         </View>
       </View>
 
-
+      <View style={styles.contentContainer}>
-      {isLoading ? (
+        <View style={styles.radarContainer}>
-        <View style={styles.loadingContainer}>
+          <RadarChart
-          <Text style={styles.loadingText}>加载中...</Text>
+            categories={NUTRITION_DIMENSIONS}
+            values={radarValues}
+            size="small"
+            maxValue={5}
+          />
         </View>
-      ) : (
-        <View style={styles.contentContainer}>
-          <View style={styles.radarContainer}>
-            <RadarChart
-              categories={NUTRITION_DIMENSIONS}
-              values={radarValues}
-              size="small"
-              maxValue={5}
-            />
-          </View>
 
-          <View style={styles.statsContainer}>
+        <View style={styles.statsContainer}>
-            {nutritionStats.map((stat, index) => (
+          {nutritionStats.map((stat, index) => (
-              <View key={stat.label} style={styles.statItem}>
+            <View key={stat.label} style={styles.statItem}>
-                <View style={[styles.statDot, { backgroundColor: stat.color }]} />
+              <View style={[styles.statDot, { backgroundColor: stat.color }]} />
-                <Text style={styles.statLabel}>{stat.label}</Text>
+              <Text style={styles.statLabel}>{stat.label}</Text>
-                <Text style={styles.statValue}>{stat.value}</Text>
+              <Text style={styles.statValue}>{stat.value}</Text>
-              </View>
+            </View>
-            ))}
+          ))}
-          </View>
         </View>
-      )}
+      </View>
     </TouchableOpacity>
   );
 }
@@ -176,14 +168,4 @@ const styles = StyleSheet.create({
     color: '#192126',
     fontWeight: '700',
   },
-  loadingContainer: {
-    alignItems: 'center',
-    justifyContent: 'center',
-    height: 80,
-  },
-  loadingText: {
-    fontSize: 16,
-    color: '#9AA3AE',
-    fontWeight: '600',
-  },
 });

components/StressMeter.tsx

@@ -5,25 +5,35 @@ import { StyleSheet, Text, View } from 'react-native';
 
 interface StressMeterProps {
   value: number;
-  status: '放松' | '正常' | '紧张';
+  updateTime?: Date;
+  style?: any;
 }
 
-export function StressMeter({ value, status }: StressMeterProps) {
+export function StressMeter({ value, updateTime, style }: StressMeterProps) {
-  // 计算进度条位置（0-100%）
-  const progressPercentage = Math.min(100, Math.max(0, (value / 150) * 100));
   
-  // 根据状态获取颜色
+  // 计算进度条位置（0-100%）
-  const getStatusColor = () => {
+  // HRV值范围：30-110ms，对应进度条0-100%
-    switch (status) {
+  const progressPercentage = Math.min(100, Math.max(0, ((value - 30) / 80) * 100));
-      case '放松': return '#10B981';
+
-      case '正常': return '#F59E0B';
+  // 根据HRV值计算状态
-      case '紧张': return '#EF4444';
+  const getHrvStatus = () => {
-      default: return '#F59E0B';
+    if (value >= 70) {
+      return '放松';
+    } else if (value >= 50) {
+      return '正常';
+    } else {
+      return '紧张';
     }
   };
 
   // 根据状态获取表情
   const getStatusEmoji = () => {
+    // 当HRV值为0时，不展示表情
+    if (value === 0) {
+      return '';
+    }
+    
+    const status = getHrvStatus();
     switch (status) {
       case '放松': return '😌';
       case '正常': return '😊';
@@ -32,13 +42,29 @@ export function StressMeter({ value, status }: StressMeterProps) {
     }
   };
 
+  // 格式化更新时间
+  const formatUpdateTime = (date?: Date) => {
+    if (!date) return '';
+    const hours = date.getHours().toString().padStart(2, '0');
+    const minutes = date.getMinutes().toString().padStart(2, '0');
+    return `${hours}:${minutes}`;
+  };
+
   return (
-    <View style={styles.container}>
+    <View style={[styles.container, style]}>
+      {/* 渐变背景 */}
+      <LinearGradient
+        colors={['#F8F9FF', '#F0F4FF']}
+        start={{ x: 0, y: 0 }}
+        end={{ x: 1, y: 1 }}
+        style={styles.gradientBackground}
+      />
+      
       {/* 头部区域 */}
       <View style={styles.header}>
         <View style={styles.leftSection}>
           <View style={styles.iconContainer}>
-            <Ionicons name="heart" size={20} color="#3B82F6" />
+            <Ionicons name="heart" size={16} color="#3B82F6" />
           </View>
           <Text style={styles.title}>压力</Text>
         </View>
@@ -55,18 +81,21 @@ export function StressMeter({ value, status }: StressMeterProps) {
       <View style={styles.progressContainer}>
         <View style={styles.progressTrack}>
           {/* 渐变背景进度条 */}
-          <View style={[styles.progressBar, { width: `${progressPercentage}%` }]}>
+          <LinearGradient
-            <LinearGradient
+            colors={['#FFD700', '#87CEEB', '#98FB98']}
-              colors={['#F97316', '#FCD34D', '#84CC16', '#10B981']}
+            start={{ x: 0, y: 0 }}
-              start={{ x: 0, y: 0 }}
+            end={{ x: 1, y: 0 }}
-              end={{ x: 1, y: 0 }}
+            style={styles.gradientTrack}
-              style={styles.gradientBar}
+          />
-            />
-          </View>
           {/* 白色圆形指示器 */}
-          <View style={[styles.indicator, { left: `${Math.max(0, progressPercentage - 2)}%` }]} />
+          <View style={[styles.indicator, { left: `${Math.max(0, Math.min(100, progressPercentage - 2))}%` }]} />
         </View>
       </View>
+
+      {/* 更新时间 */}
+      {updateTime && (
+        <Text style={styles.updateTime}>{formatUpdateTime(updateTime)}</Text>
+      )}
     </View>
   );
 }
@@ -74,8 +103,8 @@ export function StressMeter({ value, status }: StressMeterProps) {
 const styles = StyleSheet.create({
   container: {
     backgroundColor: '#FFFFFF',
-    borderRadius: 20,
+    borderRadius: 16,
-    padding: 16,
+    padding: 14,
     marginBottom: 12,
     shadowColor: '#000',
     shadowOffset: {
@@ -83,88 +112,101 @@ const styles = StyleSheet.create({
       height: 2,
     },
     shadowOpacity: 0.08,
-    shadowRadius: 12,
+    shadowRadius: 8,
     elevation: 3,
+    position: 'relative',
+    overflow: 'hidden',
+    minHeight: 110,
+    width: 140,
+  },
+  gradientBackground: {
+    position: 'absolute',
+    top: 0,
+    left: 0,
+    right: 0,
+    bottom: 0,
+    borderRadius: 16,
   },
   header: {
     flexDirection: 'row',
     alignItems: 'center',
     justifyContent: 'space-between',
-    marginBottom: 12,
+    marginBottom: 8,
   },
   leftSection: {
     flexDirection: 'row',
     alignItems: 'center',
   },
   iconContainer: {
-    width: 28,
+    width: 24,
-    height: 28,
+    height: 24,
-    borderRadius: 8,
+    borderRadius: 6,
     backgroundColor: '#EBF4FF',
     alignItems: 'center',
     justifyContent: 'center',
-    marginRight: 8,
+    marginRight: 6,
   },
   title: {
-    fontSize: 16,
+    fontSize: 14,
     fontWeight: '700',
-    color: '#1F2937',
+    color: '#192126',
   },
   emoji: {
-    fontSize: 24,
+    fontSize: 16,
   },
   valueSection: {
     flexDirection: 'row',
     alignItems: 'baseline',
-    marginBottom: 16,
+    marginBottom: 12,
   },
   value: {
-    fontSize: 42,
+    fontSize: 28,
     fontWeight: '800',
-    color: '#1F2937',
+    color: '#192126',
-    lineHeight: 46,
+    lineHeight: 32,
   },
   unit: {
-    fontSize: 14,
+    fontSize: 12,
     fontWeight: '500',
-    color: '#6B7280',
+    color: '#9AA3AE',
     marginLeft: 4,
   },
   progressContainer: {
-    height: 20,
+    height: 16,
+    marginBottom: 4,
   },
   progressTrack: {
-    height: 12,
+    height: 8,
-    backgroundColor: '#F3F4F6',
+    borderRadius: 4,
-    borderRadius: 6,
     position: 'relative',
     overflow: 'visible',
   },
-  progressBar: {
+  gradientTrack: {
     height: '100%',
-    borderRadius: 6,
+    borderRadius: 4,
-    overflow: 'hidden',
-  },
-  gradientBar: {
-    height: '100%',
-    borderRadius: 6,
   },
   indicator: {
     position: 'absolute',
     top: -4,
-    width: 20,
+    width: 16,
-    height: 20,
+    height: 16,
-    borderRadius: 10,
+    borderRadius: 8,
     backgroundColor: '#FFFFFF',
     shadowColor: '#000',
     shadowOffset: {
       width: 0,
-      height: 2,
+      height: 1,
     },
-    shadowOpacity: 0.15,
+    shadowOpacity: 0.1,
-    shadowRadius: 4,
+    shadowRadius: 2,
-    elevation: 4,
+    elevation: 2,
-    borderWidth: 2,
+    borderWidth: 1.5,
     borderColor: '#E5E7EB',
   },
+  updateTime: {
+    fontSize: 10,
+    color: '#9AA3AE',
+    textAlign: 'right',
+    marginTop: 2,
+  },
 });

ios/digitalpilates.xcodeproj/project.pbxproj

@@ -449,7 +449,10 @@
 				LIBRARY_SEARCH_PATHS = "$(SDKROOT)/usr/lib/swift\"$(inherited)\"";
 				MTL_ENABLE_DEBUG_INFO = YES;
 				ONLY_ACTIVE_ARCH = YES;
-				OTHER_LDFLAGS = "$(inherited)  ";
+				OTHER_LDFLAGS = (
+					"$(inherited)",
+					" ",
+				);
 				REACT_NATIVE_PATH = "${PODS_ROOT}/../../node_modules/react-native";
 				SDKROOT = iphoneos;
 				SWIFT_ACTIVE_COMPILATION_CONDITIONS = "$(inherited) DEBUG";
@@ -504,7 +507,10 @@
 				);
 				LIBRARY_SEARCH_PATHS = "$(SDKROOT)/usr/lib/swift\"$(inherited)\"";
 				MTL_ENABLE_DEBUG_INFO = NO;
-				OTHER_LDFLAGS = "$(inherited)  ";
+				OTHER_LDFLAGS = (
+					"$(inherited)",
+					" ",
+				);
 				REACT_NATIVE_PATH = "${PODS_ROOT}/../../node_modules/react-native";
 				SDKROOT = iphoneos;
 				USE_HERMES = false;

ios/digitalpilates/SplashScreen.storyboard

@@ -1,14 +1,15 @@
 <?xml version="1.0" encoding="UTF-8"?>
-<document type="com.apple.InterfaceBuilder3.CocoaTouch.Storyboard.XIB" version="3.0" toolsVersion="32700.99.1234" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" launchScreen="YES" useTraitCollections="YES" useSafeAreas="YES" colorMatched="YES" initialViewController="EXPO-VIEWCONTROLLER-1">
+<document type="com.apple.InterfaceBuilder3.CocoaTouch.Storyboard.XIB" version="3.0" toolsVersion="23727" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" launchScreen="YES" useTraitCollections="YES" useSafeAreas="YES" colorMatched="YES" initialViewController="EXPO-VIEWCONTROLLER-1">
     <device id="retina6_12" orientation="portrait" appearance="light"/>
     <dependencies>
         <deployment identifier="iOS"/>
-        <plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="22685"/>
+        <plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="23721"/>
         <capability name="Named colors" minToolsVersion="9.0"/>
         <capability name="Safe area layout guides" minToolsVersion="9.0"/>
         <capability name="documents saved in the Xcode 8 format" minToolsVersion="8.0"/>
     </dependencies>
     <scenes>
+        <!--View Controller-->
         <scene sceneID="EXPO-SCENE-1">
             <objects>
                 <viewController storyboardIdentifier="SplashScreenViewController" id="EXPO-VIEWCONTROLLER-1" sceneMemberID="viewController">
@@ -16,27 +17,27 @@
                         <rect key="frame" x="0.0" y="0.0" width="393" height="852"/>
                         <autoresizingMask key="autoresizingMask" flexibleMaxX="YES" flexibleMaxY="YES"/>
                         <subviews>
-                            <imageView id="EXPO-SplashScreen" userLabel="SplashScreenLogo" image="SplashScreenLogo" contentMode="scaleAspectFit" clipsSubviews="true" userInteractionEnabled="false" translatesAutoresizingMaskIntoConstraints="false">
+                            <imageView clipsSubviews="YES" userInteractionEnabled="NO" contentMode="scaleAspectFit" misplaced="YES" image="SplashScreenLogo" translatesAutoresizingMaskIntoConstraints="NO" id="EXPO-SplashScreen" userLabel="SplashScreenLogo">
-                                <rect key="frame" x="96.5" y="326" width="200" height="200"/>
+                                <rect key="frame" x="66" y="207" width="260" height="367"/>
                             </imageView>
                         </subviews>
                         <viewLayoutGuide key="safeArea" id="Rmq-lb-GrQ"/>
-                        <constraints>
-                            <constraint firstItem="EXPO-SplashScreen" firstAttribute="centerX" secondItem="EXPO-ContainerView" secondAttribute="centerX" id="cad2ab56f97c5429bf29decf850647a4216861d4"/>
-                            <constraint firstItem="EXPO-SplashScreen" firstAttribute="centerY" secondItem="EXPO-ContainerView" secondAttribute="centerY" id="1a145271b085b6ce89b1405a310f5b1bb7656595"/>
-                        </constraints>
                         <color key="backgroundColor" name="SplashScreenBackground"/>
+                        <constraints>
+                            <constraint firstItem="EXPO-SplashScreen" firstAttribute="centerY" secondItem="EXPO-ContainerView" secondAttribute="centerY" id="1a145271b085b6ce89b1405a310f5b1bb7656595"/>
+                            <constraint firstItem="EXPO-SplashScreen" firstAttribute="centerX" secondItem="EXPO-ContainerView" secondAttribute="centerX" id="cad2ab56f97c5429bf29decf850647a4216861d4"/>
+                        </constraints>
                     </view>
                 </viewController>
                 <placeholder placeholderIdentifier="IBFirstResponder" id="EXPO-PLACEHOLDER-1" userLabel="First Responder" sceneMemberID="firstResponder"/>
             </objects>
-            <point key="canvasLocation" x="0.0" y="0.0"/>
+            <point key="canvasLocation" x="-0.76335877862595414" y="0.0"/>
         </scene>
     </scenes>
     <resources>
-        <image name="SplashScreenLogo" width="200" height="200"/>
+        <image name="SplashScreenLogo" width="682.66668701171875" height="682.66668701171875"/>
         <namedColor name="SplashScreenBackground">
-            <color alpha="1.000" blue="1.00000000000000" green="1.00000000000000" red="1.00000000000000" customColorSpace="sRGB" colorSpace="custom"/>
+            <color red="1" green="1" blue="1" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
         </namedColor>
     </resources>
 </document>

utils/health.ts

@@ -1,3 +1,4 @@
+import dayjs from 'dayjs';
 import type { HealthKitPermissions } from 'react-native-health';
 import AppleHealthKit from 'react-native-health';
 
@@ -45,10 +46,8 @@ export async function ensureHealthPermissions(): Promise<boolean> {
 export async function fetchHealthDataForDate(date: Date): Promise<TodayHealthData> {
   console.log('开始获取指定日期健康数据...', date);
 
-  const start = new Date(date);
+  const start = dayjs(date).startOf('day').toDate();
-  start.setHours(0, 0, 0, 0);
+  const end = dayjs(date).endOf('day').toDate();
-  const end = new Date(date);
-  end.setHours(23, 59, 59, 999);
 
   const options = {
     startDate: start.toISOString(),