feat:

components/NutritionRadarCard.tsx

@@ -4,9 +4,10 @@ import { NutritionSummary } from '@/services/dietRecords';
 import { Ionicons } from '@expo/vector-icons';
 import dayjs from 'dayjs';
 import { router } from 'expo-router';
-import React, { useMemo } from 'react';
+import React, { useMemo, useState } from 'react';
 import { StyleSheet, Text, TouchableOpacity, View } from 'react-native';
 import { RadarCategory, RadarChart } from './RadarChart';
+import { FoodItem, FoodLibraryModal } from './model/food/FoodLibraryModal';
 
 export type NutritionRadarCardProps = {
   nutritionSummary: NutritionSummary | null;
@@ -37,6 +38,8 @@ export function NutritionRadarCard({
   resetToken,
   onMealPress
 }: NutritionRadarCardProps) {
+  const [showFoodLibrary, setShowFoodLibrary] = useState(false);
+  const [currentMealType, setCurrentMealType] = useState<'breakfast' | 'lunch' | 'dinner' | 'snack'>('breakfast');
   const radarValues = useMemo(() => {
     // 基于推荐日摄入量计算分数
     const recommendations = {
@@ -111,15 +114,24 @@ export function NutritionRadarCard({
     router.push(ROUTES.NUTRITION_RECORDS);
   };
 
+  const handleAddFood = () => {
+    setShowFoodLibrary(true);
+  };
+
+  const handleSelectFood = (food: FoodItem) => {
+    console.log('选择了食物:', food);
+    // 这里可以添加将食物添加到营养记录的逻辑
+  };
+
   return (
     <TouchableOpacity style={styles.card} onPress={handleNavigateToRecords} activeOpacity={0.8}>
       <View style={styles.cardHeader}>
         <Text style={styles.cardTitle}>营养摄入分析</Text>
         <View style={styles.cardRightContainer}>
           <Text style={styles.cardSubtitle}>更新: {dayjs(nutritionSummary?.updatedAt).format('MM-DD HH:mm')}</Text>
-          <View style={styles.addButton}>
+          <TouchableOpacity style={styles.addButton} onPress={handleAddFood}>
             <Ionicons name="add" size={12} color="#FFFFFF" />
-          </View>
+          </TouchableOpacity>
         </View>
       </View>
 
@@ -180,6 +192,14 @@ export function NutritionRadarCard({
           </View>
         </View>
       </View>
+
+      {/* 食物库弹窗 */}
+      <FoodLibraryModal
+        visible={showFoodLibrary}
+        onClose={() => setShowFoodLibrary(false)}
+        onSelectFood={handleSelectFood}
+        mealType={currentMealType}
+      />
     </TouchableOpacity>
   );
 }