BUG-003 已按你的要求修好，修改总结如下。

## 1. Template 与数据来源（确认）

- **`.food-image` 的 `:src`**：绑定为 `getFoodImage(item)`，由该方法统一取图并处理占位。
- **`.nutrition-item` 的 v-for**：遍历 `(item.nutrition || [])`，数据在 `normalizeFoodItem` 里统一整理成 `nutrition` 数组。

## 2. 后端数据结构（api/tool.js + ToolFoodServiceImpl）

- **列表/搜索** 返回每条为：`id`, `name`, `image`, `category`, `energy`, `protein`, `potassium`, `phosphorus`, `suitabilityLevel`。  
  没有 `nutrition`/`nutrients` 数组，营养来自扁平字段。

## 3. 具体修改

**（1）图片字段与占位**

- 在 **`getFoodImage(item)`** 中：
  - 统一取 `item.imageUrl || item.image || item.img`。
  - 若为相对路径（以 `/` 开头且非 `//`），用 `HTTP_REQUEST_URL` 拼成完整 URL。
  - 无有效 URL 时返回已有的灰色 SVG 占位图（`defaultPlaceholder`）。

**（2）营养字段与列表**

- 在 **`normalizeFoodItem(item)`** 中：
  - **图片**：同样做 image/imageUrl/img 兼容和相对路径补全，并写入 `image` / `imageUrl`，保证列表项有统一图源。
  - **营养**：
    - 若有 `item.nutrition` 数组，按 `{ label, value, colorClass }` 规范化（兼容 `name`/`labelName`）。
    - 否则若有 `item.nutrients`，同样规范化后当作 `nutrition`。
    - 否则用后端扁平字段组装：能量、蛋白质、钾、磷、钠、钙（有值才加），保证列表有 `nutrition` 数组供 `.nutrition-item` 使用。

**（3）列表数据来源**

- `loadFoodList` 和搜索回调中，列表来源改为：  
  `result.data.list || (Array.isArray(result.data) ? result.data : [])`，再对每一项执行 `normalizeFoodItem`，避免因接口形态不同导致列表为空。

**（4）配置**

- 顶部增加：`import { HTTP_REQUEST_URL } from '@/config/app.js'`，用于相对路径补全。

效果上：

- `.food-image` 会正确显示后端返回的图（含相对路径补全），无图时显示灰色占位图。
- `.nutrition-item` 会正确展示营养简介（来自后端扁平字段或已有的 nutrition/nutrients 数组）。