wilson
/
krd-srm-vue
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

refactor(inspection): 优化验货申请PO明细编辑功能 

- 移除PO明细编辑按钮，简化UI界面
- 将未验货数量字段从waitInspectQty改为totalQty
- 添加originalEditPoDetailList和deletedPoKeys用于跟踪原始数据和删除记录
- 编辑模式默认启用，无需手动切换
- 移除取消和保存按钮逻辑，统一在保存草稿时处理
- 区分新增和修改的PO明细，按顺序执行操作
- 重构handleSaveEdit方法，支持先新增PO再修改PO最后更新基础信息
- 优化PO明细删除逻辑，记录删除的PO key用于后续处理
- 修改确认添加PO逻辑，允许重复添加并直接添加到编辑列表
master
qiankanghui 5 days ago
parent
d75a49b109
commit
0e878c2eab
1 changed files with 185 additions and 205 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 362
      src/views/modules/inspection/inspectionRequestList.vue

362
src/views/modules/inspection/inspectionRequestList.vue
View File

@ -307,10 +307,7 @@
<div class="po-section"> <div class="po-section">
<div class="section-title"> <div class="section-title">
<span>{{ isEditDialogMode ? 'PO明细' : '批量选择PO' }}</span> <span>{{ isEditDialogMode ? 'PO明细' : '批量选择PO' }}</span>
<el-button v-if="isEditDialogMode && !editPoEditMode" type="primary" style="margin-left: 10px" @click="enableEditPoEdit">编辑</el-button>
<el-button v-if="isEditDialogMode && !editPoEditMode" type="success" style="margin-left: 5px" @click="openAddPoDialog">新增</el-button>
<el-button v-if="isEditDialogMode && editPoEditMode" type="primary" style="margin-left: 10px" @click="saveEditPoChanges">保存</el-button>
<el-button v-if="isEditDialogMode && editPoEditMode" style="margin-left: 5px" @click="cancelEditPoEdit">取消</el-button>
<el-button v-if="isEditDialogMode" type="success" style="margin-left: 5px" @click="openAddPoDialog">新增</el-button>
</div> </div>
<!-- PO号筛选和排序工具栏 --> <!-- PO号筛选和排序工具栏 -->
@ -454,14 +451,13 @@
<el-table-column prop="item" label="Item" header-align="center" align="left" min-width="100" show-overflow-tooltip/> <el-table-column prop="item" label="Item" header-align="center" align="left" min-width="100" show-overflow-tooltip/>
<el-table-column prop="sku" label="SKU" header-align="center" align="left" min-width="120" show-overflow-tooltip/> <el-table-column prop="sku" label="SKU" header-align="center" align="left" min-width="120" show-overflow-tooltip/>
<el-table-column prop="partDesc" label="物料名称" header-align="center" align="left" min-width="150" show-overflow-tooltip/> <el-table-column prop="partDesc" label="物料名称" header-align="center" align="left" min-width="150" show-overflow-tooltip/>
<el-table-column prop="waitInspectQty" label="未验货数量" header-align="center" align="right" width="90"/>
<el-table-column prop="totalQty" label="未验货数量" header-align="center" align="right" width="90"/>
<el-table-column label="验货数量" header-align="center" align="center" width="150"> <el-table-column label="验货数量" header-align="center" align="center" width="150">
<template slot-scope="scope"> <template slot-scope="scope">
<el-input-number <el-input-number
v-if="editPoEditMode" v-if="editPoEditMode"
v-model="scope.row.qty" v-model="scope.row.qty"
:min="0" :min="0"
:max="scope.row.waitInspectQty || 999999"
size="mini" size="mini"
:controls="false" :controls="false"
style="width: 100%;"> style="width: 100%;">
@ -2082,6 +2078,8 @@ export default {
this.poList = [] this.poList = []
this.filteredPoList = [] this.filteredPoList = []
this.editPoDetailList = [] this.editPoDetailList = []
this.originalEditPoDetailList = [] // 保存原始PO列表，用于区分新增和修改
this.deletedPoKeys = new Set() // 记录用户手动删除的PO key
this.editPoDetailLoading = false this.editPoDetailLoading = false
this.editPoEditMode = false this.editPoEditMode = false
this.addPoDialogVisible = false this.addPoDialogVisible = false
@ -2197,6 +2195,7 @@ export default {
async openEditInspectionDialog (row) { async openEditInspectionDialog (row) {
this.resetAddForm() this.resetAddForm()
this.addDialogMode = 'edit' this.addDialogMode = 'edit'
this.editPoEditMode = true // 直接进入编辑模式
this.addDialogVisible = true this.addDialogVisible = true
this.addFormData = { this.addFormData = {
requestNo: row.requestNo || '', requestNo: row.requestNo || '',
@ -2220,7 +2219,7 @@ export default {
} }
this.editPoDetailLoading = true this.editPoDetailLoading = true
try { try {
// 首先获取验货申请明细列表
// 获取验货申请明细列表
const { data } = await getInspectionRequestDetailSubList({ const { data } = await getInspectionRequestDetailSubList({
requestNo, requestNo,
site: site || this.$store.state.user.site, site: site || this.$store.state.user.site,
@ -2230,109 +2229,30 @@ export default {
if (data && data.code === 0) { if (data && data.code === 0) {
const rawList = (data.page && data.page.list) || [] const rawList = (data.page && data.page.list) || []
const exactList = rawList.filter(item => { const exactList = rawList.filter(item => {
const itemRequestNo = item.requestNo || item.request_no || '' const itemRequestNo = item.requestNo || item.request_no || ''
return !itemRequestNo || String(itemRequestNo) === String(requestNo) return !itemRequestNo || String(itemRequestNo) === String(requestNo)
}) })
// 如果有关联的PO信息，需要调用 queryPoPage 获取 waitInspectQty
// 收集所有唯一的 PO号 + PO行号组合
const poKeys = new Set()
const poMap = new Map() // key -> originalItem
exactList.forEach(item => {
const orderRef1 = item.orderRef1 || item.order_ref1 || ''
const orderRef2 = item.orderRef2 || item.order_ref2 || ''
if (orderRef1 && orderRef2) {
const key = `${orderRef1}_${orderRef2}`
poKeys.add(key)
poMap.set(key, item)
}
})
// 如果有PO关联，则调用 queryPoPage 获取完整的 PO 数据（包含 waitInspectQty）
if (poKeys.size > 0) {
// 从第一个PO中获取供应商编码
const firstItem = exactList[0] || {}
const supplierNo = firstItem.supplierNo || firstItem.supplier_no || this.addFormData.supplierNo
if (supplierNo) {
// 调用 queryPoPage 查询该供应商的所有PO明细
const poParams = {
site: site || this.$store.state.user.site,
supplierNo: supplierNo,
page: 1,
limit: 1000
}
try {
const { data: poData } = await queryPoPage(poParams)
if (poData && poData.code === 0) {
const poList = (poData.page && poData.page.list) || []
// 构建 PO 映射表：key = orderRef1_orderRef2
const poWaitQtyMap = new Map()
poList.forEach(po => {
const orderRef1 = po.orderRef1 || po.order_ref1 || ''
const orderRef2 = po.orderRef2 || po.order_ref2 || ''
if (orderRef1 && orderRef2) {
const key = `${orderRef1}_${orderRef2}`
poWaitQtyMap.set(key, po.waitInspectQty || 0)
}
})
// 将 waitInspectQty 填充到 editPoDetailList 中
this.editPoDetailList = exactList.map(item => {
const orderRef1 = item.orderRef1 || item.order_ref1 || ''
const orderRef2 = item.orderRef2 || item.order_ref2 || ''
const key = `${orderRef1}_${orderRef2}`
const waitInspectQty = poWaitQtyMap.get(key) || 0
return {
...item,
waitInspectQty: waitInspectQty, // 添加未验货数量
crd: this.formatToDateOnly(item.crd)
}
})
} else {
// 如果 queryPoPage 失败，使用原始数据
this.editPoDetailList = exactList.map(item => ({
...item,
waitInspectQty: item.waitInspectQty || 0,
crd: this.formatToDateOnly(item.crd)
}))
}
} catch (error) {
console.error('查询PO明细失败:', error)
// 如果 queryPoPage 失败，使用原始数据
this.editPoDetailList = exactList.map(item => ({
...item,
waitInspectQty: item.waitInspectQty || 0,
crd: this.formatToDateOnly(item.crd)
}))
}
} else {
// 没有供应商编码，使用原始数据
this.editPoDetailList = exactList.map(item => ({
...item,
waitInspectQty: item.waitInspectQty || 0,
crd: this.formatToDateOnly(item.crd)
}))
}
} else {
// 没有PO关联，直接使用原始数据
// 直接使用后端返回的数据，不再调用 queryPoPage
this.editPoDetailList = exactList.map(item => ({ this.editPoDetailList = exactList.map(item => ({
...item, ...item,
waitInspectQty: item.waitInspectQty || 0,
crd: this.formatToDateOnly(item.crd)
totalQty: item.totalQty || 0, // 使用后端返回的 totalQty 作为未验货数量
crd: this.formatToDateOnly(item.crd),
qty: item.qty || 0 // 确保 qty 字段存在且为数字类型
})) }))
}
// 保存原始PO列表的副本，用于区分新增和修改
this.originalEditPoDetailList = this.editPoDetailList.map(item => ({...item}))
} else { } else {
this.editPoDetailList = [] this.editPoDetailList = []
this.originalEditPoDetailList = []
this.$message.warning(data.msg || '加载PO明细失败') this.$message.warning(data.msg || '加载PO明细失败')
} }
} catch (error) { } catch (error) {
this.editPoDetailList = [] this.editPoDetailList = []
this.originalEditPoDetailList = []
console.error('加载编辑PO明细失败：', error) console.error('加载编辑PO明细失败：', error)
this.$message.error('加载PO明细失败，请稍后重试') this.$message.error('加载PO明细失败，请稍后重试')
} finally { } finally {
@ -2340,70 +2260,11 @@ export default {
} }
}, },
// 启用编辑PO明细的编辑模式
// 启用编辑PO明细的编辑模式（已废弃，直接进入编辑模式）
enableEditPoEdit () { enableEditPoEdit () {
this.editPoEditMode = true this.editPoEditMode = true
}, },
// 取消编辑PO明细
cancelEditPoEdit () {
this.editPoEditMode = false
// 重新加载原始数据
if (this.addFormData.requestNo) {
this.loadEditPoDetailList(this.addFormData.requestNo, this.$store.state.user.site)
}
},
// 保存编辑PO明细的修改
saveEditPoChanges () {
if (!this.editPoDetailList || this.editPoDetailList.length === 0) {
this.$message.warning('没有可保存的PO明细')
return
}
// 验证数据
for (let i = 0; i < this.editPoDetailList.length; i++) {
const row = this.editPoDetailList[i]
if (!row.qty || row.qty <= 0) {
this.$message.warning(`第${i + 1}行的验货数量必须大于0`)
return
}
}
// 构建后端需要的数据格式（和新增接口的参数格式一致）
const items = this.editPoDetailList.map(row => ({
orderNo: row.poNo || row.orderNo || row.order_ref1 || row.orderRef1 || '', // PO号（优先使用真正的订单号）
orderRef1: row.orderRef1 || row.order_ref1 || '', // 参考订单号1
orderRef2: row.orderRef2 || row.order_ref2 || '', // 参考订单号2
poItemNo: row.poItemNo || row.po_item_no || row.itemNo || row.item_no || row.orderRef2 || row.order_ref2 || '', // PO行号（优先使用poItemNo）
partNo: row.partNo || '', // 产品编码
qty: row.inspectQty || row.waitInspectQty || row.qty || 0, // 此次验货数量（优先使用用户输入）
shipMethod: row.shipMethod || row.shipMothod || '', // 运输方式（用户使用弹窗中选择）
crd: row.crd || '' // CRD日期（用户使用弹窗中选择）
}))
const params = {
requestNo: this.addFormData.requestNo,
site: this.$store.state.user.site,
items: items
}
// 调用后端编辑接口
editInspectionDetails(params).then(({ data }) => {
if (data && data.code === 0) {
this.$message.success(`成功保存${items.length}条PO明细`)
this.editPoEditMode = false
// 重新加载PO明细列表
this.loadEditPoDetailList(this.addFormData.requestNo, this.$store.state.user.site)
} else {
this.$message.error(data.msg || '保存PO明细失败')
}
}).catch(error => {
console.error('保存PO明细失败:', error)
this.$message.error('保存PO明细失败: ' + (error.message || '网络错误'))
})
},
// 删除编辑PO明细中的某一行 // 删除编辑PO明细中的某一行
deleteEditPoRow (index) { deleteEditPoRow (index) {
this.$confirm('确定要删除这条PO明细吗？', '提示', { this.$confirm('确定要删除这条PO明细吗？', '提示', {
@ -2411,6 +2272,20 @@ export default {
cancelButtonText: '取消', cancelButtonText: '取消',
type: 'warning' type: 'warning'
}).then(() => { }).then(() => {
const deletedRow = this.editPoDetailList[index]
// 记录被删除的PO的key，用于保存时判断
const key = `${deletedRow.orderRef1 || ''}_${deletedRow.orderRef2 || ''}`
// 如果删除的是原有PO（在originalEditPoDetailList中存在），则记录到deletedPoKeys
const isOriginalPo = this.originalEditPoDetailList.some(item => {
const originalKey = `${item.orderRef1 || ''}_${item.orderRef2 || ''}`
return originalKey === key
})
if (isOriginalPo) {
this.deletedPoKeys.add(key)
}
this.editPoDetailList.splice(index, 1) this.editPoDetailList.splice(index, 1)
this.$message.success('删除成功') this.$message.success('删除成功')
}).catch(() => { }).catch(() => {
@ -2513,7 +2388,7 @@ export default {
this.addPoSelectedRows = rows this.addPoSelectedRows = rows
}, },
// 确认添加选中的PO
// 确认添加选中的PO（仅添加到表格，不立即保存）
confirmAddPoSelect () { confirmAddPoSelect () {
if (!this.addPoSelectedRows || this.addPoSelectedRows.length === 0) { if (!this.addPoSelectedRows || this.addPoSelectedRows.length === 0) {
this.$message.warning('请至少选择一条PO明细') this.$message.warning('请至少选择一条PO明细')
@ -2525,39 +2400,29 @@ export default {
return return
} }
// 构建后端需要的数据格式，使用用户在弹窗中编辑的数据
const items = this.addPoSelectedRows.map(row => ({
orderNo: row.poNo || row.orderNo || row.order_ref1 || row.orderRef1 || '', // PO号（优先使用真正的订单号）
orderRef1: row.orderRef1 || row.order_ref1 || '', // 参考订单号1
orderRef2: row.orderRef2 || row.order_ref2 || '', // 参考订单号2
poItemNo: row.poItemNo || row.po_item_no || row.itemNo || row.item_no || row.orderRef2 || row.order_ref2 || '', // PO行号（优先使用poItemNo）
partNo: row.partNo || '', // 产品编码
qty: row.inspectQty || row.waitInspectQty || row.qty || 0, // 此次验货数量（优先使用用户输入）
shipMethod: row.shipMethod || row.shipMothod || '', // 运输方式（用户使用弹窗中选择）
crd: row.crd || '' // CRD日期（用户使用弹窗中选择）
// 允许重复添加，直接将选中的PO明细添加到编辑列表中
const newItems = this.addPoSelectedRows.map(row => ({
...row,
orderNo: row.poNo || row.orderNo || row.order_ref1 || row.orderRef1 || '',
orderRef1: row.orderRef1 || row.order_ref1 || '',
orderRef2: row.orderRef2 || row.order_ref2 || '',
poItemNo: row.poItemNo || row.po_item_no || row.itemNo || row.item_no || row.orderRef2 || row.order_ref2 || '',
partNo: row.partNo || '',
qty: row.inspectQty || row.waitInspectQty || row.qty || 0,
shipMethod: row.shipMethod || row.shipMothod || '',
shipMothod: row.shipMethod || row.shipMothod || '', // 保持字段一致性
crd: row.crd || '',
waitInspectQty: row.waitInspectQty || 0
})) }))
const params = {
requestNo: this.addFormData.requestNo,
site: this.$store.state.user.site,
items: items
}
// 将新PO明细添加到编辑列表中
this.editPoDetailList = [...this.editPoDetailList, ...newItems]
// 调用后端接口
addInspectionDetails(params).then(({ data }) => {
if (data && data.code === 0) {
this.$message.success(`成功添加${items.length}条PO明细`)
this.$message.success(`成功添加${newItems.length}条PO明细`)
// 关闭弹窗并清空选中状态
this.addPoDialogVisible = false this.addPoDialogVisible = false
this.addPoSelectedRows = [] this.addPoSelectedRows = []
// 重新加载PO明细列表
this.loadEditPoDetailList(this.addFormData.requestNo, this.$store.state.user.site)
} else {
this.$message.error(data.msg || '添加PO明细失败')
}
}).catch(error => {
console.error('添加PO明细失败:', error)
this.$message.error('添加PO明细失败: ' + (error.message || '网络错误'))
})
}, },
// 选择供应商 // 选择供应商
@ -3524,31 +3389,146 @@ export default {
}) })
}, },
// 草稿编辑保存：仅更新基础信息中的可编辑字段 - rqrq
// 草稿编辑保存：先新增PO，再修改PO，最后更新基础信息
handleSaveEdit () { handleSaveEdit () {
this.$refs.addFormData.validate((valid) => { this.$refs.addFormData.validate((valid) => {
if (!valid) { if (!valid) {
this.$message.warning('请填写完整的表单信息') this.$message.warning('请填写完整的表单信息')
return return
} }
const submitData = {
// 区分新增和修改的PO明细
const originalPoKeys = new Set()
this.originalEditPoDetailList.forEach(item => {
const key = `${item.orderRef1 || ''}_${item.orderRef2 || ''}`
originalPoKeys.add(key)
})
const newPoItems = [] // 新增的PO明细
const modifiedPoItems = [] // 修改的PO明细
this.editPoDetailList.forEach(row => {
const key = `${row.orderRef1 || ''}_${row.orderRef2 || ''}`
// 如果这个key在被删除列表中，跳过（不新增也不修改）
if (this.deletedPoKeys.has(key)) {
return
}
const itemData = {
orderNo: row.poNo || row.orderNo || row.order_ref1 || row.orderRef1 || '',
orderRef1: row.orderRef1 || row.order_ref1 || '',
orderRef2: row.orderRef2 || row.order_ref2 || '',
poItemNo: row.poItemNo || row.po_item_no || row.itemNo || row.item_no || row.orderRef2 || row.order_ref2 || '',
partNo: row.partNo || '',
qty: row.qty || 0,
shipMethod: row.shipMethod || row.shipMothod || '',
crd: row.crd || ''
}
if (originalPoKeys.has(key)) {
// 原有PO，属于修改
modifiedPoItems.push(itemData)
} else {
// 新添加的PO
newPoItems.push(itemData)
}
})
console.log('=== 区分新增和修改 ===', {
'新增PO数量': newPoItems.length,
'修改PO数量': modifiedPoItems.length,
'新增PO': newPoItems,
'修改PO': modifiedPoItems
})
// 执行顺序：1.修改 -> 2.新增 -> 3.更新基础信息
let promiseChain = Promise.resolve()
// 1. 如果有修改的PO，先调用 editInspectionDetails
if (modifiedPoItems.length > 0) {
promiseChain = promiseChain.then(() => {
return this.editModifiedPoDetails(modifiedPoItems)
})
}
// 2. 如果有新增的PO，再调用 addInspectionDetails
if (newPoItems.length > 0) {
promiseChain = promiseChain.then(() => {
return this.addNewPoDetails(newPoItems)
})
}
// 3. 最后更新基础信息
promiseChain = promiseChain.then(() => {
const baseSubmitData = {
requestNo: this.addFormData.requestNo, requestNo: this.addFormData.requestNo,
needInspectDate: this.addFormData.needInspectDate, needInspectDate: this.addFormData.needInspectDate,
inspectAddress: this.addFormData.inspectAddressId || this.addFormData.inspectAddress, inspectAddress: this.addFormData.inspectAddressId || this.addFormData.inspectAddress,
inspectAddressId: this.addFormData.inspectAddressId || '', inspectAddressId: this.addFormData.inspectAddressId || '',
inspectContract: this.addFormData.contact inspectContract: this.addFormData.contact
} }
updateInspectionRequest(submitData).then(({ data }) => {
return updateInspectionRequest(baseSubmitData).then(({ data }) => {
if (data.code === 0) { if (data.code === 0) {
this.$message.success('修改成功') this.$message.success('修改成功')
this.handleCloseAddDialog() this.handleCloseAddDialog()
this.getMainData() this.getMainData()
} else { } else {
this.$message.error(data.msg || '修改失败')
this.$message.error(data.msg || '基础信息保存失败')
} }
})
}).catch((error) => { }).catch((error) => {
console.error('修改接口错误：', error)
this.$message.error('修改失败，请稍后重试')
console.error('保存失败:', error)
this.$message.error(error.message || '保存失败，请稍后重试')
})
})
},
// 新增PO明细
addNewPoDetails (items) {
return new Promise((resolve, reject) => {
const params = {
requestNo: this.addFormData.requestNo,
site: this.$store.state.user.site,
items: items
}
console.log('=== 调用 addInspectionDetails ===', params)
addInspectionDetails(params).then(({ data }) => {
if (data && data.code === 0) {
console.log('新增PO明细成功')
resolve()
} else {
reject(new Error(data.msg || '新增PO明细失败'))
}
}).catch(error => {
reject(error)
})
})
},
// 修改PO明细
editModifiedPoDetails (items) {
return new Promise((resolve, reject) => {
const params = {
requestNo: this.addFormData.requestNo,
site: this.$store.state.user.site,
items: items
}
console.log('=== 调用 editInspectionDetails ===', params)
editInspectionDetails(params).then(({ data }) => {
if (data && data.code === 0) {
console.log('修改PO明细成功')
resolve()
} else {
reject(new Error(data.msg || '修改PO明细失败'))
}
}).catch(error => {
reject(error)
}) })
}) })
}, },

Write Preview
Loading…
Cancel
Save