市场栏位管理 — 前端技术方案
依据:市场栏位管理功能需求.md、市场栏位管理技术方案.md;布局对齐 tradeMarket/isolationPen/index.vue(双 el-card,无全局配置);字段 小驼峰。
1. 页面与路由
| 项 |
说明 |
| Vue 路径 |
ruoyi-ui/src/views/tradeMarket/marketStall/index.vue |
| 组件名 |
TradeMarketMarketStall |
| 菜单配置 |
组件路径:tradeMarket/marketStall/index(「交易市场平台」目录下,手工配置) |
| 权限前缀 |
tradeMarket:marketStall:list\|query\|add\|edit\|remove |
2. API 模块
| 项 |
说明 |
| 文件 |
ruoyi-ui/src/api/tradeMarket/marketStall.js |
| Base |
/tradeMarket/marketStall |
| 方法 |
HTTP |
URI |
listMarketStall |
GET |
/list |
getMarketStall |
GET |
/{id} |
addMarketStall |
POST |
/ |
updateMarketStall |
PUT |
/ |
delMarketStall |
DELETE |
/{ids} |
3. 页面结构
- 筛选区:栏位编号(模糊);搜索、重置、新增(无「设置隔离天数」)。
- 列表区:栏位编号、备注、操作。
- 新增/编辑弹窗:
stallCode 只读;备注 ≤50 字。
- 查看弹窗:编号、备注、审计信息。
4. 业务规则(前端)
| 规则 |
实现 |
| 栏位编号 |
新增不传;编辑/查看只读 stallCode |
| 备注 |
选填;validateRemark 最长 50;提交 trim 后空串为 null |
| 列表筛选 |
queryParams.stallCode 原样提交,后端模糊 |
| 与隔离圈位 |
字段名 stallCode / penCode 分模块;编号序列后端分表独立 |
5. 国际化
| 项 |
说明 |
| 语言包 |
tradeMarket.marketStall(lang/zh/tradeMarket.js、lang/bo/tradeMarket.js) |
| Mixin |
tradeMarketLocaleMixin,tmNs = 'marketStall' |
| 公共文案 |
tradeMarket.common.* |
6. 联调说明
- 部署
BizMarketStallController 及 biz_market_stall 表。
- 菜单
tradeMarket/marketStall/index,权限与后端一致。
- 验证:栏位 CRUD、编号模糊、与隔离圈位菜单/编号字段不混用。
7. 文件清单
| 类型 |
路径 |
| 页面 |
ruoyi-ui/src/views/tradeMarket/marketStall/index.vue |
| API |
ruoyi-ui/src/api/tradeMarket/marketStall.js |
| i18n |
ruoyi-ui/src/lang/zh/tradeMarket.js、lang/bo/tradeMarket.js(marketStall 节点) |
8. 修订记录
| 版本 |
说明 |
| 1.0 |
初版:双卡片 CRUD;对齐隔离圈位页去掉 setting;stallCode 小驼峰 |