huimv-baqing/doc/交易市场平台/供应商管理/供应商管理前端技术方案.md

供应商管理 — 前端技术方案

依据：供应商管理功能需求.md、供应商管理技术方案.md（后端 v1.3）；布局对齐 tradeMarket/distributor/index.vue（双 el-card）；字段 小驼峰。

---

1. 页面与路由

项	说明
Vue 路径	ruoyi-ui/src/views/tradeMarket/supplier/index.vue
组件名	TradeMarketSupplier
菜单配置	组件路径：tradeMarket/supplier/index（「交易市场平台」目录下，手工配置）
权限前缀	tradeMarket:supplier:list\|query\|add\|edit\|remove\|assignAccount

---

2. API 模块

项	说明
文件	ruoyi-ui/src/api/tradeMarket/supplier.js
Base	/tradeMarket/supplier

方法	HTTP	说明
listSupplier	GET	/list，Query：pageNum、pageSize、supplierCode、supplierName
getSupplier	GET	/{id}
addSupplier	POST	/，Body 不含 supplierCode
updateSupplier	PUT	/，Body 含 id，不含 supplierCode
delSupplier	DELETE	/{ids}，单条传一个 id
assignAccountSupplier	POST	/assignAccount/{id}，无 Body

---

3. 页面结构

1. 筛选区：供应商编号、供应商名称（均精确匹配）；搜索、重置、新增。
   
2. 列表区：编号、名称、类型、身份识别号、联系方式、经营地点、车辆号码、收费方式、账号分配、操作（查看 / 编辑 / 分配账号 / 删除）。
   
3. 新增/编辑弹窗（550px）：编号只读（新增占位「保存后自动生成」）；类型切换身份字段；收费方式联动收费标准或两档费率；车辆号牌动态行（最多 10 条）；备注 ≤500 字。
   
4. 查看弹窗（720px）：只读全字段；按收费方式展示费率/标准；账号分配状态、已分配登录名、审计信息；底部：分配账号（未分配时）、编辑、删除、关闭。

---

4. 业务规则（前端）

规则	实现
供应商编号	新增 buildPayload 不传 supplierCode；编辑弹窗只读展示
供应商类型	1 个体户 → 身份证、ID_CARD_REG；2 企业 → USCC、USCC_REG
收费联动	feeMethod=1 隐藏费率；=2 显示 feeStandard；=3 显示两费率 0～100%
提交清洗	buildPayload 按收费方式置不适用字段为 null
车辆号牌	vehiclePlateList 编辑；提交为 vehiclePlates 数组；PLATE_REG；最多 10 条
名称/手机	名称 trim 1～20 字；PHONE_REG；身份号 trim().toUpperCase()
列表筛选	supplierCode、supplierName 精确（与承销商模糊不同）
列表展示	优先 supplierTypeName/feeMethodName；车牌 、 拼接
删除	确认框展示编号、名称；后端存在未结算结算单时 msg「存在未结算的结算单，无法删除」，由 request 拦截器 toast
分配账号	canAssignAccount(row)：Number(row.accountAssigned) === 0 且有 assignAccount 权限；确认 confirmAssign；调 assignAccountSupplier；成功 toast msgAssignOk 并刷新列表；详情弹窗打开时重新 getSupplier
账号列	accountAssigned === 1 显示「是」+ assignedLoginName；否则「否」
后端角色	分配账号绑定角色 103（承销商为 104）

枚举常量（页面内）

常量	值
个体户	supplierType = 1
企业	supplierType = 2
按户计费	feeMethod = 1
按头计费	feeMethod = 2
按额计费	feeMethod = 3

正则（页面内）

名称	用途
ID_CARD_REG	18 位居民身份证
USCC_REG	18 位统一社会信用代码
PHONE_REG	大陆手机号
PLATE_REG	车牌号

提交字段（buildPayload）

字段	新增	修改	说明
supplierName	Y	Y	trim
supplierType	Y	Y
identityNo	Y	Y	大写
contactPhone	Y	Y
businessLocation	N	N
vehiclePlates	N	N	字符串数组，≤10
feeMethod	Y	Y
feeStandard	条件	条件	feeMethod=2
transactionFeeRate	条件	条件	feeMethod=3
managementFeeRate	条件	条件	feeMethod=3
remark	N	N
id	—	Y
supplierCode	禁止	禁止

---

5. 国际化

项	说明
语言包	tradeMarket.supplier（lang/zh/tradeMarket.js、lang/bo/tradeMarket.js）
Mixin	tradeMarketLocaleMixin，tmNs = 'supplier'，方法 tmT / tmCommon
公共文案	tradeMarket.common.*（含 assignAccount、msgAssignOk）
状态文案	tradeMarket.status.yes / no / dash

supplier 节点扩展键（v1.3）

键	用途
colAccount	账号分配列
viewAssignedLogin	详情已分配登录名
confirmAssign	分配账号确认

---

6. 联调说明

1. 部署 BizSupplierController 及 biz_supplier 表；已分配账号字段见 alter_biz_supplier_distributor_assign_account.sql。
   
2. 菜单组件 tradeMarket/supplier/index，权限与后端 §4 一致（含 assignAccount）。
   
3. 验证项：
   
   • 编号/名称精确筛选
     
   • 三种收费方式新增/修改与字段联动
     
   • 个体户/企业证件切换
     
   • 车辆多条与车牌校验
     
   • 修改时编号不可变
     
   • 分配账号仅一次；列表与详情展示登录名
     
   • 存在未结算结算单时删除失败提示
     
   • 逻辑删除后列表不可见
     
   • 汉藏双语切换

---

7. 文件清单

类型	路径
页面	ruoyi-ui/src/views/tradeMarket/supplier/index.vue
API	ruoyi-ui/src/api/tradeMarket/supplier.js
Mixin	ruoyi-ui/src/mixins/tradeMarketLocaleMixin.js
i18n	ruoyi-ui/src/lang/zh/tradeMarket.js、lang/bo/tradeMarket.js（supplier 节点及 common/status）

---

8. 与承销商前端对照

项	供应商	承销商
页面	tradeMarket/supplier/index.vue	tradeMarket/distributor/index.vue
筛选	编号/名称精确	模糊
特色字段	车辆号牌、收费方式/费率	销售去向
分配账号 API	assignAccountSupplier	assignAccountDistributor
后端角色	103	104
编辑弹窗宽度	550px	720px

---

9. 修订记录

版本	说明
1.0	初版：双卡片 CRUD；收费三档联动；车辆动态行；汉藏 i18n
1.1	分配账号 API/列表列/操作按钮；权限 assignAccount（方案稿）
1.3	与实现对齐：落地 assignAccountSupplier、账号列/详情/列表操作、canAssignAccount/handleAssignAccount；删除未结算结算单联调说明；buildPayload 字段表；i18n 扩展键；与承销商对照表；同步后端 v1.3