61 lines
3.6 KiB
Markdown
61 lines
3.6 KiB
Markdown
## 目标
|
||
- 在 `InStockIn` 页面满足 5 项需求：
|
||
1. 点击“单据新增”时，打开弹框隐藏“打印入库条码”按钮
|
||
2. 弹框内新增“选择物料”按钮，打开第二个弹框显示物料列表，选择后将物料加入子单明细
|
||
3. 子单明细中的“计划数量”和“入库数量”可编辑
|
||
4. 新增时自动生成 `stockinId`：`RK` + 当前毫秒时间戳
|
||
5. 提交时 `orderSrc` 默认赋值为“自建单”
|
||
|
||
## 技术实现
|
||
- 页面文件：`ruoyi-ui/src/views/system/inStockIn/index.vue`
|
||
- 参考实现：`ruoyi-ui/src/views/in/stockIn/add/index_new.vue` 的“添加物料”与“选择物料”弹框逻辑
|
||
|
||
## 详细改动
|
||
### 新增状态标识
|
||
- 在 `data()` 中新增：`isAddMode: false`
|
||
- 用于区分“新增”与“编辑/查看”，控制按钮显示与表格可编辑
|
||
|
||
### 隐藏打印按钮
|
||
- 对话框底部的打印按钮（`printDetailQRCodes`）改为：`v-if="!isAddMode"`
|
||
- 点击“单据新增”时将 `isAddMode = true`，从而隐藏打印按钮
|
||
|
||
### 选择物料入口
|
||
- 在“子单信息”卡片标题区域新增一个按钮：`选择物料`
|
||
- 按钮事件 `openProductSelector()` 打开二级弹框
|
||
|
||
### 物料选择弹框
|
||
- 复用 `index_new.vue` 的模式：
|
||
- 引入 API：`import { listBasProduct } from "@/api/bas/BasProduct"`
|
||
- 在 `data()` 中新增：`productSelectVisible, productOptions, selectedProducts, productTotal, queryProductParams, productLoading`
|
||
- 弹框内容包含搜索表单、物料表格（带选择）、分页与“确定/取消”
|
||
- 事件：`getProductList()、resetProductQuery()、handleProductSelectionChange()、confirmSelectProduct()`
|
||
|
||
### 子单明细数据与可编辑列
|
||
- 子单明细列表数据源仍使用 `inStockinDetailNList`
|
||
- 在“新增”模式下，`confirmSelectProduct()` 将选中的物料映射并 `push` 到 `inStockinDetailNList`：
|
||
- 字段映射示例：`productName、productModel(来自 productId 或 spec)、unit、quantity(默认 1)、inQuantity(默认 0)`
|
||
- 在子单表格中为 `quantity` 与 `inQuantity` 列增加模板：`<el-input-number v-model="scope.row.quantity" ...>` 与 `<el-input-number v-model="scope.row.inQuantity" ...>`，并用 `v-if="isAddMode"` 控制仅在新增时可编辑
|
||
|
||
### 自动生成主单号
|
||
- 在 `handleAdd()`：
|
||
- `this.reset()` 后设置：`this.form.stockinId = 'RK' + Date.now()`
|
||
- `this.isAddMode = true; this.open = true; this.isView = false; this.title = '添加入库单据管理'`
|
||
- 由于 `watch('form.stockinId')` 会尝试拉取子单，新增生成的主单号在后端不存在，列表将为空，此时通过物料选择填充本地子单明细
|
||
|
||
### 提交默认来源
|
||
- 在 `submitForm()` 里，在发起 `addInStockIn(this.form)` 前设置：`this.form.orderSrc = '自建单'`
|
||
- 编辑场景保持原逻辑不变；新增成功后 `isAddMode` 复位为 `false`
|
||
|
||
## 校验与兼容
|
||
- 行内“修改/删除”按钮逻辑保持现有条件控制；新增模式下仅本地操作子单明细
|
||
- 不影响历史单据查询与打印
|
||
- 若后端需要接收子单明细，一并在后续迭代中按后端接口扩展（当前仅前端本地编辑）
|
||
|
||
## 代码触点
|
||
- 模板：对话框底部按钮处、子单卡片标题区新增按钮、子单表格新增可编辑列
|
||
- 脚本：新增 `isAddMode` 标识、导入 `listBasProduct`、新增弹框及方法、在 `handleAdd()` 和 `submitForm()` 中按要求赋值
|
||
|
||
## 期望交互
|
||
- 点击“新增”→ 弹框打开且不显示打印按钮；自动生成主单号
|
||
- 点“选择物料”→ 打开物料选择弹框，勾选并确定→ 子单明细填充，可编辑数量
|
||
- 点“确定”提交→ 主单 `orderSrc` 自动为“自建单” |