+
+
+ 🍎 AI食物營養分析器
+智能分析您的飲食營養
+
+
+
+
+
+
+ {tab === 'analyzer' && (
+
+
+ )}
+
+ {tab === 'profile' && (
+
+ )}
+
+ {tab === 'tracking' && (
+
+ {/* 預覽圖片優先顯示，否則顯示相機畫面 */}
+ {previewImage ? (
+ 
+ ) : (
+
+ )}
+
+
+
+
+
+
+
+
+
+
+ {loading && (
+
+
+
+ )}
+
+ {error && AI正在分析食物中...
+{error}
}
+
+ {result && (
+
+
+ )}
+
+
+ {/* 顯示重量、信心度、誤差範圍 */}
+ {result.foodName}
+ +
+
+
+ 預估重量：{result.estimatedWeight ? `${result.estimatedWeight} g` : '--'}
+ 信心度：{result.weightConfidence ? `${Math.round(result.weightConfidence*100)}%` : '--'}
+ 誤差範圍：{result.weightErrorRange ? `${result.weightErrorRange[0]} ~ ${result.weightErrorRange[1]} g` : '--'}
+ {result.referenceObject && 參考物：{result.referenceObject}
}
+ {result.note && {result.note}
}
+
+
+
+
+
+ 健康指數
+
+
+
+ {result.healthIndex||75}/100
+
+
+ 升糖指數
+
+
+
+ {result.glycemicIndex||50}/100
+ {result.description || `這是 ${result.foodName}`}
+ +
+ {(result.benefits||[`${result.foodName} 的營養價值`]).map((b,i)=>(
+ {b}
+ ))}
+
+
+
+
+
+ {profile && (
+
+
+
+ 基本營養素
+
+ {Object.entries(result.nutrition||{}).map(([k,v])=>(
+
+
+
+ ))}
+ {k}
+ {v}
+
+
+
+ 維生素
+
+ {result.vitamins && Object.entries(result.vitamins).map(([k,v])=>(
+
+
+
+ ))}
+ {k}
+ {v} mg
+
+
+ 礦物質
+
+ {result.minerals && Object.entries(result.minerals).map(([k,v])=>(
+
+
+
+ ))}
+ {k}
+ {v} mg
+
+
+ )}
+ 💡 個人化建議
+
+ 這份食物約佔您每日熱量建議的 {Math.round((result.nutrition?.calories / profile.dailyCalories) * 100)}%。
+
+
+
+ )}
+
+
+
+
+
+ 今日攝取熱量
+ {Math.round(foodDiary.reduce((t,m)=>t+(m.nutrition?.calories||0),0))} 卡
+
+
+ 蛋白質
+ {Math.round(foodDiary.reduce((t,m)=>t+(m.nutrition?.protein||0),0))} g
+
+
+ 纖維
+ {Math.round(foodDiary.reduce((t,m)=>t+(m.nutrition?.fiber||0),0))} g
+
+ {[{label:'熱量',current:foodDiary.reduce((t,m)=>t+(m.nutrition?.calories||0),0),goal:profile.dailyCalories,unit:'卡',color:'#43cea2'},
+ {label:'蛋白質',current:foodDiary.reduce((t,m)=>t+(m.nutrition?.protein||0),0),goal:profile.proteinGoal,unit:'g',color:'#185a9d'},
+ {label:'纖維',current:foodDiary.reduce((t,m)=>t+(m.nutrition?.fiber||0),0),goal:profile.fiberGoal,unit:'g',color:'#ff9a9e'}].map(({label,current,goal,unit,color})=>{
+ const percent = goal ? Math.min(100, (current/goal)*100) : 0;
+ return (
+
+
+
+
+ );
+ })}
+ {label}
+
+
+
+ {Math.round(current)} / {goal} {unit}
+
+
+
+ 今日食物記錄
+ {foodDiary.length === 0 ? (
+ 今天尚未記錄任何食物 🍽️
+ ) : (
+
+ {foodDiary.map(meal => (
+
+ )}
+
+
+ ))}
+ {meal.foodName}
+ {new Date(meal.timestamp).toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' })}
+ {Math.round(meal.nutrition?.calories||0)} 卡
+
+
+ 本週熱量趨勢
+
+
+
+