Update README.md

README.md

@@ -2,7 +2,7 @@
 
 > **UPLOAD YOUR INGREDIENTS | SPIT OUT RECIPES!**
 
-一个基于 AI 的智能菜谱生成平台，采用现代扁平化设计风格，让不同菜系的厨艺大师为您的食材创造美味传奇。
+一个基于 AI 的智能菜谱生成平台，采用现代扁平化设计风格，让不同菜系的厨艺大师为您的食材创造美味传奇。支持营养分析、效果图生成等全方位烹饪指导。
 
 ## ✨ 功能特色
 
@@ -11,25 +11,41 @@
 -   支持任意食材组合输入
 -   最多可添加 10 种食材
 -   一键添加/删除食材标签
+-   智能食材搭配建议
 
-### 👨‍🍳 多菜系大师
+### 👨‍🍳 八大菜系大师
 
-支持 8 大传统菜系的专业厨艺大师：
+支持中华传统八大菜系的专业厨艺大师：
 
--   **苏菜** - 清淡鲜美，刀工精细
--   **鲁菜** - 咸鲜为主，火候精准
--   **川菜** - 麻辣鲜香，变化多端
--   **粤菜** - 清淡鲜美，原汁原味
--   **浙菜** - 清香淡雅，鲜嫩爽滑
--   **湘菜** - 香辣浓郁，口味厚重
--   **闽菜** - 鲜香清淡，汤鲜味美
--   **徽菜** - 重油重色，醇厚朴实
+-   **苏菜大师** - 江南水乡的精致美味，清淡鲜美，刀工精细
+-   **鲁菜大师** - 齐鲁大地的豪放风味，咸鲜为主，火候精准
+-   **川菜大师** - 巴蜀之地的麻辣传奇，麻辣鲜香，变化多端
+-   **粤菜大师** - 岭南文化的鲜美诠释，清淡鲜美，原汁原味
+-   **浙菜大师** - 江南水乡的清雅之味，清香淡雅，鲜嫩爽滑
+-   **湘菜大师** - 湖湘文化的辣味人生，香辣浓郁，口味厚重
+-   **闽菜大师** - 八闽大地的海鲜盛宴，鲜香清淡，汤鲜味美
+-   **徽菜大师** - 徽州文化的朴实醇香，重油重色，醇厚朴实
 
-### 🎨 自定义要求
+### 🎨 双模式生成
 
--   支持个性化烹饪需求
--   智能理解用户特殊要求
--   如：清淡汤品、减肥餐、儿童营养餐等
+-   **菜系模式**: 选择 1-8 个菜系，每个大师创作独特菜谱
+-   **自定义模式**: 输入个性化需求，AI 智能理解并生成
+-   **智能随机**: 不选择时自动随机选择 2 个菜系
+
+### 🥗 营养分析功能 ⭐ NEW
+
+-   **营养成分**: 详细的卡路里、蛋白质、碳水化合物等数据
+-   **健康评分**: 1-10 分的营养健康评分系统
+-   **饮食标签**: 自动识别"高蛋白"、"低脂"、"素食"等特点
+-   **营养建议**: 个性化的营养均衡建议
+-   **份量指导**: 科学的建议食用份量
+
+### 🖼️ AI 效果图生成
+
+-   一键生成精美菜品效果图
+-   基于菜谱内容智能绘制
+-   高质量视觉呈现
+-   支持图片保存和分享
 
 ### 📱 现代化界面
 
@@ -37,35 +53,53 @@
 -   扁平化设计风格，简洁直观
 -   响应式布局，完美适配各种设备
 -   分步骤引导，用户体验友好
+-   卡片式菜谱展示，信息层次清晰
 
 ## 🚀 技术栈
 
--   **前端框架**: Vue 3 + TypeScript
--   **样式框架**: Tailwind CSS
--   **构建工具**: Vite
--   **路由管理**: Vue Router
--   **HTTP 客户端**: Axios
--   **AI 服务**: 智谱 AI GLM-4-Flash
+### 前端技术
+
+-   **框架**: Vue 3.4+ (Composition API)
+-   **语言**: TypeScript 5.3+
+-   **样式**: Tailwind CSS 3.4+
+-   **构建**: Vite 5.0+
+-   **路由**: Vue Router 4.2+
+-   **工具**: @vueuse/core 10.7+
+
+### AI 服务
+
+-   **主要**: DeepSeek Chat API
+-   **备用**: 智谱 AI GLM-4-Flash
+-   **图像**: AI 图像生成服务
+-   **营养**: 智能营养分析算法
+
+### 开发工具
+
+-   **类型检查**: vue-tsc
+-   **代码质量**: ESLint + Prettier
+-   **包管理**: npm/yarn
+-   **部署**: Netlify 自动化部署
 
 ## 📦 项目结构
 
 ```
 src/
-├── components/          # 组件目录
-│   ├── RecipeCard.vue  # 菜谱卡片组件
-│   └── CookingLoader.vue # 加载动画组件
-├── config/             # 配置文件
-│   ├── cuisines.ts     # 菜系配置
-│   └── ai.ts          # AI配置
-├── services/           # 服务层
-│   └── aiService.ts    # AI接口服务
-├── types/              # 类型定义
-│   └── index.ts        # 通用类型
-├── views/              # 页面组件
-│   └── Home.vue        # 主页面
-├── App.vue             # 根组件
-├── main.ts             # 入口文件
-└── style.css           # 全局样式
+├── components/              # 组件目录
+│   ├── RecipeCard.vue      # 菜谱卡片组件
+│   ├── NutritionAnalysis.vue # 营养分析组件 ⭐ NEW
+│   └── CookingLoader.vue   # 加载动画组件
+├── config/                 # 配置文件
+│   └── cuisines.ts         # 八大菜系配置
+├── services/               # 服务层
+│   ├── aiService.ts        # AI菜谱生成服务
+│   └── imageService.ts     # AI图像生成服务
+├── types/                  # 类型定义
+│   └── index.ts           # 通用类型（含营养分析类型）
+├── views/                  # 页面组件
+│   └── Home.vue           # 主页面
+├── App.vue                # 根组件
+├── main.ts               # 入口文件
+└── style.css             # 全局样式
 ```
 
 ## 🛠️ 快速开始
@@ -74,6 +108,7 @@ src/
 
 -   Node.js 18+
 -   npm 或 yarn
+-   现代浏览器支持
 
 ### 安装依赖
 
@@ -87,6 +122,8 @@ npm install
 npm run dev
 ```
 
+访问 http://localhost:5173
+
 ### 构建生产版本
 
 ```bash
@@ -99,70 +136,107 @@ npm run build
 npm run type-check
 ```
 
+### 预览构建结果
+
+```bash
+npm run preview
+```
+
 ## 🤖 AI 配置
 
-项目已集成智谱 AI 接口，开箱即用：
+### DeepSeek API 配置
 
 ```typescript
 const AI_CONFIG = {
+    baseURL: 'https://api.deepseek.com/v1/',
+    apiKey: 'sk-your_api_key_here',
+    model: 'deepseek-chat',
+    temperature: 0.7,
+    timeout: 30000
+}
+```
+
+### 智谱 AI 备用配置
+
+```typescript
+const AI_CONFIG_BACKUP = {
     baseURL: 'https://open.bigmodel.cn/api/paas/v4/',
-    apiKey: 'your_api_key_here',
+    apiKey: 'your_zhipu_api_key',
     model: 'glm-4-flash-250414',
     temperature: 0.7,
     timeout: 30000
 }
 ```
 
-### 自定义 AI 服务
+### 环境变量配置
+
+创建 `.env` 文件：
 
-如需更换其他 AI 服务，请修改 `src/services/aiService.ts` 中的配置。
+```env
+VITE_AI_API_KEY=your_api_key_here
+VITE_AI_BASE_URL=https://api.deepseek.com/v1/
+```
 
 ## 🎯 使用指南
 
 ### 基础使用流程
 
-1. **输入食材** - 在输入框中添加您现有的食材
+1. **输入食材** - 在输入框中添加您现有的食材（最多 10 种）
 2. **选择方式** - 选择菜系大师或输入自定义要求
 3. **生成菜谱** - 点击"交给大师"或"按要求生成"
 4. **查看结果** - 浏览 AI 大师为您定制的菜谱
+5. **营养分析** - 展开查看详细营养信息和建议 ⭐ NEW
+6. **生成效果图** - 点击生成按钮获取菜品效果图
 
 ### 菜系选择模式
 
--   可选择一个或多个菜系
--   每个菜系都有独特的烹饪风格和技法
--   支持随机选择菜系
+-   可选择一个或多个菜系（最多 8 个）
+-   每个菜系都有独特的烹饪风格和专业提示词
+-   不选择时自动随机选择 2 个菜系
+-   支持菜系组合创新
 
 ### 自定义要求模式
 
--   输入具体的烹饪需求
--   如："做一道清淡的汤，适合老人食用"
--   AI 会根据要求生成个性化菜谱
+-   输入具体的烹饪需求和偏好
+-   支持复杂需求：口味、营养、人群、场合等
+-   示例："做一道清淡的汤，适合老人食用，少盐低脂"
+-   AI 智能理解并生成个性化菜谱
+
+### 营养分析功能 ⭐ NEW
+
+-   **营养成分表**: 卡路里、蛋白质、碳水、脂肪、纤维等
+-   **健康评分**: 基于营养均衡的 1-10 分评分
+-   **饮食标签**: 自动标注菜品特点（高蛋白、低脂、素食等）
+-   **营养建议**: 个性化的搭配和改进建议
+-   **份量指导**: 科学的建议食用份量
 
 ## 🎨 设计特色
 
 ### 配色方案
 
--   **主背景**: 明亮黄色 (#fbbf24)
--   **头部区域**: 粉色 (#f472b6)
+-   **主背景**: 明亮黄色 (#fbbf24) - 温暖食欲感
+-   **头部区域**: 粉色 (#f472b6) - 活力品牌色
 -   **步骤标签**: 多彩分类（粉色、绿色、蓝色、黑色）
--   **卡片区域**: 白色背景配黑色边框
+-   **卡片区域**: 白色背景配 2px 黑色边框
+-   **营养区域**: 绿色系 - 健康自然感 ⭐ NEW
 
 ### 交互设计
 
--   扁平化按钮和卡片
+-   扁平化按钮和卡片设计
 -   2px 黑色边框设计语言
 -   悬停和点击动画效果
--   清晰的视觉层次
+-   清晰的视觉层次和信息架构
+-   展开/收起式详情查看
 
-## 📱 响应式设计
+### 响应式设计
 
--   **移动端**: 单列布局，触摸友好
--   **平板端**: 双列菜谱展示
--   **桌面端**: 多列布局，充分利用屏幕空间
+-   **移动端**: 单列布局，触摸友好的按钮尺寸
+-   **平板端**: 双列菜谱展示，合理利用空间
+-   **桌面端**: 多列布局，充分利用大屏幕空间
 
-## 🔧 部署
+## 🔧 部署配置
 
-### Netlify 部署
+### Netlify 自动部署
 
 项目已配置 Netlify 自动部署：
 
@@ -173,48 +247,91 @@ const AI_CONFIG = {
 
 [build.environment]
   NODE_VERSION = "18"
+
+[[redirects]]
+  from = "/*"
+  to = "/index.html"
+  status = 200
 ```
 
 ### 手动部署
 
 ```bash
+# 构建项目
 npm run build
-# 将 dist 目录部署到您的服务器
+
+# 部署 dist 目录到您的服务器
+# 支持静态托管服务：Netlify、Vercel、GitHub Pages 等
+```
+
+### Docker 部署
+
+```dockerfile
+FROM node:18-alpine
+WORKDIR /app
+COPY package*.json ./
+RUN npm install
+COPY . .
+RUN npm run build
+EXPOSE 3000
+CMD ["npm", "run", "preview"]
 ```
 
 ## 🚧 开发计划
 
--   [ ] 添加菜谱收藏功能
--   [ ] 支持菜谱分享到社交媒体
--   [ ] 添加营养成分分析
--   [ ] 支持语音输入食材
--   [ ] 添加购物清单生成
--   [ ] 多语言支持
--   [ ] 用户账户系统
--   [ ] 菜谱评分和评论
+### 已完成 ✅
 
-## 🤝 贡献指南
+-   [x] 八大菜系 AI 大师系统
+-   [x] 智能食材输入和管理
+-   [x] 双模式菜谱生成（菜系/自定义）
+-   [x] 营养分析功能 ⭐ NEW
+-   [x] AI 效果图生成
+-   [x] 响应式现代化界面
+-   [x] 随机菜系选择优化
 
-欢迎提交 Issue 和 Pull Request 来帮助改进项目！
+### 开发中 🚧
 
-### 开发规范
+-   [ ] 菜谱收藏和历史记录
+-   [ ] 用户偏好学习系统
+-   [ ] 社交分享功能
 
--   使用 TypeScript 进行类型安全开发
--   遵循 Vue 3 Composition API 最佳实践
--   使用 Tailwind CSS 进行样式开发
--   保持代码简洁和可读性
+### 计划中 📋
+
+-   [ ] 语音输入食材
+-   [ ] 购物清单自动生成
+-   [ ] 多语言支持（英文、日文）
+-   [ ] 用户账户系统
+-   [ ] 菜谱评分和评论
+-   [ ] 食材营养数据库
+-   [ ] 个性化推荐算法
+-   [ ] 移动端 APP 版本
 
 ## 📄 许可证
 
-MIT License
+MIT License - 详见 [LICENSE](LICENSE) 文件
 
 ## 🙏 致谢
 
+### 技术支持
+
 -   [Vue.js](https://vuejs.org/) - 渐进式 JavaScript 框架
 -   [Tailwind CSS](https://tailwindcss.com/) - 实用优先的 CSS 框架
--   [智谱 AI](https://open.bigmodel.cn/) - 提供强大的 AI 能力
 -   [Vite](https://vitejs.dev/) - 下一代前端构建工具
+-   [TypeScript](https://www.typescriptlang.org/) - JavaScript 的超集
+
+### AI 服务
+
+-   [DeepSeek](https://www.deepseek.com/) - 提供强大的对话 AI 能力
+-   [智谱 AI](https://open.bigmodel.cn/) - 备用 AI 服务支持
+
+### 设计灵感
+
+-   中华传统八大菜系文化
+-   现代扁平化设计理念
+-   用户体验最佳实践
 
 ---
 
 **让 AI 厨艺大师为您的食材注入灵魂，创造属于您的美味传奇！** 🍽️✨
+
+_一饭封神 - 不只是菜谱，更是烹饪的艺术与科学_ 🎨🔬