# 商品服务管理 — 前端技术方案

> **依据：** 《商品服务管理功能需求.md》v1.0.1、《商品服务管理技术方案.md》v1.0.1  
> **前端规范：** `doc/前端设计/前端设计.md`  
> **范围：** 仅 **ruoyi-ui 平台管理端** 服务目录 CRUD；商家发品勾选、C 端展示 **不在 ruoyi-ui 实现**。  
> **实现状态：** 页面与 API 封装已落地，待后端 `/agri/goodsService` 联调。

---

## 1. 技术栈与写法约定

| 项 | 说明 |
|----|------|
| 框架 | Vue 2 + Element UI |
| 请求 | `@/utils/request` |
| 参考页面 | `ruoyi-ui/src/views/agri/content/banner/index.vue` |
| 布局 | 双 `el-card` + 表格 `border` |
| 默认显示 | `"0"` / `"1"`，不用 Y/N 字典 |

---

## 2. 文件清单

| 类型 | 路径 | 说明 |
|------|------|------|
| 页面 | `ruoyi-ui/src/views/agri/goods/goodsService/index.vue` | 列表 + 添加/编辑弹窗 |
| API | `ruoyi-ui/src/api/agri/goodsService.js` | CRUD |

**组件 name：** `AgriGoodsService`

---

## 3. 菜单与路由

| 菜单名称 | 组件路径 | 路由 path（建议） | 权限标识 |
|----------|----------|-------------------|----------|
| 商品服务管理 | `agri/goods/goodsService/index` | `goodsService` | `agri:goodsService:list` |

**上级菜单：** 农资管理 → **商品管理**

| 按钮权限 | 标识 |
|----------|------|
| 添加 | `agri:goodsService:add` |
| 编辑 | `agri:goodsService:edit` |
| 删除 | `agri:goodsService:remove` |

---

## 4. 页面结构

```text
商品服务管理
├── 检索：服务名称 serviceName
├── 工具栏：添加、批量删除
├── 表格：名称、简介、图标、默认显示、操作
└── 弹窗：名称、简介、图标、默认显示、排序
```

---

## 5. 复用组件

| 组件 | 用途 |
|------|------|
| `ImageUpload` | 服务图标，limit=1，5MB |
| `ImagePreview` | 列表缩略图 |
| `Pagination` / `RightToolbar` | 分页与检索显隐 |

---

## 6. API 对接

**基路径：** `/agri/goodsService`

| 前端方法 | HTTP | 路径 |
|----------|------|------|
| `listGoodsService` | GET | `/list` |
| `getGoodsService` | GET | `/{serviceId}` |
| `addGoodsService` | POST | `/` |
| `updateGoodsService` | PUT | `/` |
| `delGoodsService` | DELETE | `/{serviceIds}` |

### 6.1 表单字段

| 字段 | 必填 | 默认 |
|------|:----:|------|
| serviceName | 是 | — |
| serviceIntro | 是 | — |
| serviceIcon | 是 | — |
| defaultShowFlag | 是 | `"1"` |
| sortNo | 是 | `0` |

---

## 7. 交互要点

| 场景 | 行为 |
|------|------|
| 删除 | 二次确认；后端有关联商品时整批失败 |
| 默认显示 | 表单提示「商家发品默认勾选」 |

---

## 8. 联调检查清单

- [ ] 名称唯一校验  
- [ ] 删除被商品引用时 msg + reasons  
- [ ] 排序升序与 serviceOptions 一致  

---

## 9. 修订记录

| 版本 | 日期 | 说明 |
|------|------|------|
| v1.0 | 2026-05 | 首版 |

---

*文档版本：v1.0 · ruoyi-ui · 关联《商品服务管理功能需求.md》v1.0.1*
