| | |
| | | .confirm-dialog .el-message-box__status { |
| | | font-size: 24px !important; |
| | | } |
| | | /* 数量输入框样式 */ |
| | | .quantity-input { |
| | | width: 100px; |
| | | } |
| | | /* 删除按钮样式 */ |
| | | .delete-btn { |
| | | color: #F56C6C; |
| | | border-color: #F56C6C; |
| | | } |
| | | .delete-btn:hover { |
| | | background-color: #F56C6C; |
| | | color: white; |
| | | } |
| | | </style> |
| | | </head> |
| | | <body> |
| | |
| | | <div class="search-container" style="width: 100%;"> |
| | | <el-form :inline="true" class="search-form"> |
| | | <div class="search-item"> |
| | | <span class="search-label">组货单号:</span> |
| | | <span class="search-label">订单号:</span> |
| | | <el-input |
| | | v-model="searchForm.orderNo" |
| | | placeholder="请输入组货单号" |
| | | placeholder="请输入订单号" |
| | | clearable |
| | | style="width: 150px;" |
| | | @keyup.enter.native="handleSearch" |
| | |
| | | style="width: 100%" |
| | | v-loading="loading" |
| | | @sort-change="handleSortChange"> |
| | | <el-table-column prop="orderNo" label="订单号" width="240" align="center" sortable="custom"></el-table-column> |
| | | <el-table-column prop="orderNo" label="订单号" width="120" align="center" sortable="custom"></el-table-column> |
| | | <!-- <el-table-column prop="itemName" label="组货单号" width="120" align="center" sortable="custom"></el-table-column>--> |
| | | <el-table-column prop="cstmrName" label="货主" min-width="120" align="center"></el-table-column> |
| | | <!-- <el-table-column prop="orderCount" label="组货单数" width="80" align="center"></el-table-column>--> |
| | | <el-table-column prop="settle$" label="状态" min-width="100" align="center" :formatter="formatStatus"></el-table-column> |
| | | <el-table-column prop="createTime" label="日期" min-width="100" align="center" :formatter="formatDateColumn"></el-table-column> |
| | | <el-table-column prop="createTime" label="创建时间" min-width="100" align="center" :formatter="formatDateColumn"></el-table-column> |
| | | <el-table-column prop="updateTime" label="更新日期" min-width="100" align="center" :formatter="formatDateColumn"></el-table-column> |
| | | <el-table-column label="操作" width="150" align="center" fixed="right"> |
| | | <template slot-scope="scope"> |
| | |
| | | class="detail-dialog" |
| | | @close="closeDetailDialog"> |
| | | <div v-if="currentRow"> |
| | | <h3>组货单主表 (组货单号: {{ currentRow.itemName }})</h3> |
| | | <h3>组货单主表 (订单号: {{ currentRow.orderNo }})</h3> |
| | | <el-descriptions :column="2" border> |
| | | <el-descriptions-item label="客户名称">{{ currentRow.cstmrName }}</el-descriptions-item> |
| | | <el-descriptions-item label="状态">{{ formatStatus(currentRow)}}</el-descriptions-item> |
| | |
| | | :data="tableDataB" |
| | | style="width: 100%" |
| | | v-loading="detailLoading"> |
| | | <el-table-column prop="id" label="id" min-width="50" align="center"></el-table-column> |
| | | <el-table-column prop="matnr" label="商品编号" min-width="80" align="center"></el-table-column> |
| | | <el-table-column prop="maktx" label="名称" min-width="80" align="center"></el-table-column> |
| | | <el-table-column prop="standby1" label="客户PO" min-width="80" align="center" ></el-table-column> |
| | | <el-table-column prop="standby2" label="UPC" min-width="80" align="center" ></el-table-column> |
| | | <el-table-column prop="standby3" label="客户SKU" min-width="80" align="center" ></el-table-column> |
| | | <!-- <el-table-column prop="boxType1" label="货主" min-width="80" align="center" ></el-table-column>--> |
| | | <!-- <el-table-column prop="boxType2" label="货主" min-width="80" align="center" ></el-table-column>--> |
| | | <el-table-column prop="boxType3" label="采购单号" min-width="80" align="center" ></el-table-column> |
| | | <el-table-column prop="anfme" label="数量" min-width="80" align="center"></el-table-column> |
| | | <el-table-column prop="standby1" label="客户PO" min-width="80" align="center"></el-table-column> |
| | | <el-table-column prop="standby2" label="UPC" min-width="80" align="center"></el-table-column> |
| | | <el-table-column prop="standby3" label="客户SKU" min-width="80" align="center"></el-table-column> |
| | | <el-table-column prop="boxType3" label="采购单号" min-width="80" align="center"></el-table-column> |
| | | <el-table-column prop="anfme" label="数量" min-width="80" align="center"> |
| | | <template slot-scope="scope"> |
| | | <el-input-number |
| | | v-model="scope.row.anfme" |
| | | :min="0" |
| | | :precision="0" |
| | | controls-position="right" |
| | | size="small" |
| | | class="quantity-input" |
| | | @change="handleQuantityChange(scope.row, $event)" |
| | | ></el-input-number> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="erpAnfme" label="erp下发数量" min-width="80" align="center"></el-table-column> |
| | | <el-table-column prop="status" label="状态" min-width="80" align="center" :formatter="formatStatusB"></el-table-column> |
| | | <!-- 新增操作列,根据status值控制显示 --> |
| | | <el-table-column prop="sortingAnfme" label="待下发数量" min-width="80" align="center"></el-table-column> |
| | | <!-- <el-table-column prop="status" label="状态" min-width="100" align="center" :formatter="formatStatusB"></el-table-column>--> |
| | | <el-table-column prop="inspect" label="状态" min-width="100" align="center" :formatter="formatStatusC"></el-table-column> |
| | | <!-- 修改为删除列 --> |
| | | <el-table-column label="是否上报" width="120" align="center" fixed="right"> |
| | | <template slot-scope="scope"> |
| | | <div class="operation-cell"> |
| | | <el-button v-if="scope.row.status === 2" |
| | | <el-button v-if="scope.row.inspect === 1" |
| | | type="primary" |
| | | size="mini" |
| | | @click="handleModifyN(scope.row)"> |
| | | 否 |
| | | 取消下发项 |
| | | </el-button> |
| | | <el-button v-if="scope.row.status === 1" |
| | | <el-button v-if="scope.row.inspect === 0" |
| | | type="primary" |
| | | size="mini" |
| | | @click="handleModifyY(scope.row)"> |
| | | 是 |
| | | 加入下发项 |
| | | </el-button> |
| | | </div> |
| | | </template> |
| | | </el-table-column> |
| | | <!-- <el-table-column label="操作" width="100" align="center" fixed="right">--> |
| | | <!-- <template slot-scope="scope">--> |
| | | <!-- <div class="operation-cell">--> |
| | | <!-- <el-button--> |
| | | <!-- class="delete-btn"--> |
| | | <!-- type="danger"--> |
| | | <!-- size="mini"--> |
| | | <!-- icon="el-icon-delete"--> |
| | | <!-- @click="handleDelete(scope.row)"--> |
| | | <!-- ></el-button>--> |
| | | <!-- </div>--> |
| | | <!-- </template>--> |
| | | <!-- </el-table-column>--> |
| | | </el-table> |
| | | |
| | | <!-- 子表分页 --> |
| | |
| | | class="confirm-report-btn" |
| | | @click="showConfirmDialog" |
| | | :loading="reportLoading"> |
| | | <!-- 直接在模板中判断 --> |
| | | {{ settleA === 17 ? '再次上报' : '确认上报' }} |
| | | {{ settleA === 17 ? '再次下发' : '确认下发' }} |
| | | </el-button> |
| | | <el-button @click="closeDetailDialog">关闭</el-button> |
| | | </div> |
| | |
| | | data: { |
| | | // 搜索表单 |
| | | searchForm: { |
| | | item_name: '', |
| | | cstmr_name: '', |
| | | settle: '', |
| | | order_no: '' |
| | | orderNo: '', |
| | | cstmrName: '', |
| | | settle: '' |
| | | }, |
| | | // 排序相关 |
| | | orderByField: '', |
| | |
| | | // 加载状态 |
| | | loading: false, |
| | | detailLoading: false, |
| | | reportLoading: false |
| | | reportLoading: false, |
| | | // 存储修改后的数量 |
| | | modifiedQuantities: {}, |
| | | // 存储删除的记录 |
| | | deletedRecords: [] |
| | | }, |
| | | created() { |
| | | this.init(); |
| | |
| | | }, 10000); |
| | | }, |
| | | |
| | | // 获取主表A数据 - 使用新的API |
| | | // 获取主表A数据 |
| | | getTableDataA() { |
| | | let that = this; |
| | | that.loading = true; |
| | | |
| | | // 构建请求参数 |
| | | let params = { |
| | | curr: that.currentPage, |
| | | limit: that.pageSize |
| | | }; |
| | | |
| | | // 添加排序参数 |
| | | if (that.orderByField) { |
| | | params.orderByField = that.orderByField; |
| | | params.orderByType = that.orderByType; |
| | | } |
| | | |
| | | // 添加搜索参数 |
| | | Object.keys(that.searchForm).forEach(key => { |
| | | if (that.searchForm[key] !== '') { |
| | | if (key === 'orderNo'){ |
| | | params['order_no'] = that.searchForm[key]; |
| | | } else if (key === 'itemName'){ |
| | | params['item_name'] = that.searchForm[key]; |
| | | } else if (key === 'cstmrName'){ |
| | | params['cstmr_name'] = that.searchForm[key]; |
| | | } else { |
| | |
| | | that.tableDataA = res.data.records || []; |
| | | that.total = res.data.total || 0; |
| | | } else { |
| | | that.$message.error(res.message || '获取数据失败'); |
| | | that.$message.error(res.msg || '获取数据失败'); |
| | | that.tableDataA = []; |
| | | that.total = 0; |
| | | } |
| | |
| | | that.loading = false; |
| | | that.$message.error('网络请求失败'); |
| | | console.error('API调用失败:', error); |
| | | // 模拟数据(实际项目中应删除) |
| | | // 模拟数据 |
| | | that.mockTableAData(); |
| | | } |
| | | }); |
| | | }, |
| | | |
| | | // 获取子表B数据(根据实际业务调整) |
| | | // 获取子表B数据 |
| | | getTableDataB(orderNo) { |
| | | let that = this; |
| | | that.detailLoading = true; |
| | | |
| | | // 构建请求参数 |
| | | let params = { |
| | | order_no: orderNo, |
| | | curr: that.detailCurrentPage, |
| | | limit: that.detailPageSize |
| | | }; |
| | | |
| | | // 模拟API调用 - 根据实际业务调整API地址 |
| | | $.ajax({ |
| | | url: baseUrl + "/order/pakin/orderDetl/list/auth", |
| | | headers: { |
| | |
| | | if (res.code === 200 || res.success) { |
| | | that.tableDataB = res.data.records || []; |
| | | that.detailTotal = res.data.total || 0; |
| | | |
| | | // 初始化数量缓存 |
| | | that.modifiedQuantities = {}; |
| | | that.tableDataB.forEach(item => { |
| | | const itemKey = that.getItemKey(item); |
| | | that.$set(that.modifiedQuantities, itemKey, item.anfme); |
| | | }); |
| | | } else { |
| | | that.$message.error(res.message || '获取数据失败'); |
| | | that.$message.error(res.msg || '获取数据失败'); |
| | | that.tableDataB = []; |
| | | that.detailTotal = 0; |
| | | } |
| | |
| | | }, |
| | | error: function() { |
| | | that.detailLoading = false; |
| | | // 实际项目中应使用真实API,这里使用模拟数据 |
| | | that.mockTableBData(itemName); |
| | | // 模拟数据 |
| | | that.mockTableBData(); |
| | | } |
| | | }); |
| | | }, |
| | | |
| | | // 获取商品唯一标识 |
| | | getItemKey(item) { |
| | | return item.matnr + '_' + (item.batch || '') + '_' + (item.standby1 || ''); |
| | | }, |
| | | |
| | | // 处理删除按钮点击事件 |
| | | handleDelete(row) { |
| | | if (!this.currentRow) { |
| | | this.$message.error('没有选择主表数据'); |
| | | return; |
| | | } |
| | | |
| | | const groupOrderNo = this.currentRow.itemName; |
| | | const matnr = row.matnr; |
| | | const maktx = row.maktx; |
| | | const itemKey = this.getItemKey(row); |
| | | |
| | | this.$confirm( |
| | | `确定要删除组货单 <strong style="color: #409EFF;">${groupOrderNo}</strong> 中的商品 <strong style="color: #409EFF;">${matnr} - ${maktx}</strong> 吗?`, |
| | | '确认删除', |
| | | { |
| | | confirmButtonText: '确认删除', |
| | | cancelButtonText: '取消', |
| | | type: 'warning', |
| | | dangerouslyUseHTMLString: true |
| | | } |
| | | ).then(() => { |
| | | // 从表格中移除该行 |
| | | const index = this.tableDataB.findIndex(item => |
| | | this.getItemKey(item) === itemKey |
| | | ); |
| | | if (index !== -1) { |
| | | // 保存删除记录 |
| | | this.deletedRecords.push({ |
| | | ...this.tableDataB[index], |
| | | deleteTime: new Date().toISOString() |
| | | }); |
| | | |
| | | // 从表格中删除 |
| | | this.tableDataB.splice(index, 1); |
| | | this.detailTotal -= 1; |
| | | |
| | | // 从修改缓存中删除 |
| | | if (this.modifiedQuantities[itemKey]) { |
| | | delete this.modifiedQuantities[itemKey]; |
| | | } |
| | | |
| | | this.$message({ |
| | | message: '删除成功', |
| | | type: 'success', |
| | | duration: 2000 |
| | | }); |
| | | } |
| | | }).catch(() => { |
| | | this.$message({ |
| | | type: 'info', |
| | | message: '已取消删除' |
| | | }); |
| | | }); |
| | | }, |
| | | |
| | | // 处理数量修改 |
| | | handleQuantityChange(row, newValue) { |
| | | if (!row || !row.matnr) return; |
| | | |
| | | const itemKey = this.getItemKey(row); |
| | | const oldValue = row.anfme; |
| | | |
| | | // 验证新值 |
| | | if (isNaN(newValue) || newValue < 0) { |
| | | this.$message.warning('请输入有效的数量'); |
| | | this.$set(row, 'anfme', oldValue); |
| | | this.modifiedQuantities[itemKey] = oldValue; |
| | | return; |
| | | } |
| | | |
| | | // 验证ERP下发数量 |
| | | if (row.erpAnfme && newValue > parseInt(row.erpAnfme)) { |
| | | this.$message.warning('修改数量不能大于ERP下架数量'); |
| | | this.$set(row, 'anfme', oldValue); |
| | | this.modifiedQuantities[itemKey] = oldValue; |
| | | return; |
| | | } |
| | | |
| | | // 更新缓存 |
| | | this.modifiedQuantities[itemKey] = parseInt(newValue); |
| | | this.$set(row, 'anfme', parseInt(newValue)); |
| | | |
| | | this.$message.success('数量已修改'); |
| | | }, |
| | | |
| | | // 处理修改按钮点击事件 |
| | |
| | | return; |
| | | } |
| | | |
| | | const groupOrderNo = this.currentRow.itemName; // 组货单号 |
| | | const batch = row.batch; // 箱号 |
| | | const status = 2; // 箱号 |
| | | const orderNo = this.currentRow.orderNo; // 订单号 |
| | | const anfme = row.anfme; // 数量 |
| | | const id = row.id; // 箱号 |
| | | |
| | | this.$confirm( |
| | | `确定将组货单号: <strong style="color: #409EFF;">${groupOrderNo}</strong> 中的箱号: <strong style="color: #409EFF;">${batch}</strong> 添加到上报列吗?`, |
| | | `确定将订单号: <strong style="color: #409EFF;">${orderNo}</strong> 中的id: <strong style="color: #409EFF;">${id}</strong> 添加到下发列吗?`, |
| | | '确认修改', |
| | | { |
| | | confirmButtonText: '确认修改', |
| | |
| | | dangerouslyUseHTMLString: true |
| | | } |
| | | ).then(() => { |
| | | this.submitModify(groupOrderNo, batch, status); |
| | | this.submitModify(orderNo, id, anfme,1); |
| | | }).catch(() => { |
| | | this.$message({ |
| | | type: 'info', |
| | |
| | | }); |
| | | }, |
| | | |
| | | |
| | | // 处理修改按钮点击事件 |
| | | handleModifyN(row) { |
| | | if (!this.currentRow) { |
| | |
| | | return; |
| | | } |
| | | |
| | | const groupOrderNo = this.currentRow.itemName; // 组货单号 |
| | | const batch = row.batch; // 箱号 |
| | | const status = 1; // 箱号 |
| | | const orderNo = this.currentRow.orderNo; // 订单号 |
| | | const anfme = 0.0; // 数量 |
| | | const id = row.id; // 箱号 |
| | | |
| | | this.$confirm( |
| | | `确定将组货单号: <strong style="color: #409EFF;">${groupOrderNo}</strong> 、箱号: <strong style="color: #409EFF;">${batch}</strong> 添加到上报列吗?`, |
| | | `确定将订单号: <strong style="color: #409EFF;">${orderNo}</strong> 中的id: <strong style="color: #409EFF;">${id}</strong> 取消下发列吗?`, |
| | | '确认修改', |
| | | { |
| | | confirmButtonText: '确认修改', |
| | |
| | | dangerouslyUseHTMLString: true |
| | | } |
| | | ).then(() => { |
| | | this.submitModify(groupOrderNo, batch, status); |
| | | this.submitModify(orderNo, id, anfme,0); |
| | | }).catch(() => { |
| | | this.$message({ |
| | | type: 'info', |
| | |
| | | }, |
| | | |
| | | // 提交修改到后台 |
| | | submitModify(groupOrderNo, batch, status) { |
| | | submitModify(orderNo, id, anfme,inspect) { |
| | | // 显示加载状态 |
| | | const loadingInstance = this.$loading({ |
| | | lock: true, |
| | |
| | | }); |
| | | |
| | | $.ajax({ |
| | | url: baseUrl + "/order/pakout/orderDetl/batch/report/auth", |
| | | url: baseUrl + "/order/pakin/orderDetl/batch/report/auth", |
| | | headers: {'token': localStorage.getItem('token')}, |
| | | data: top.reObject({ |
| | | item_name: groupOrderNo, // 组货单号 |
| | | batch: batch, // 箱号 |
| | | status: status // 箱号 |
| | | orderNo: orderNo, // 组货单号 |
| | | id: id, // 箱号 |
| | | anfme: anfme, // 箱号 |
| | | inspect: inspect // 箱号 |
| | | }), |
| | | method: 'POST', |
| | | success: (res) => { |
| | |
| | | |
| | | this.getTableDataB(groupOrderNo); |
| | | } else { |
| | | this.$message.error(res.message || '修改失败'); |
| | | this.$message.error(res.msg || '修改失败'); |
| | | } |
| | | }, |
| | | error: (error) => { |
| | | loadingInstance.close(); |
| | | console.error('修改失败:', error); |
| | | this.$message.error('修改失败,请检查网络连接'); |
| | | } |
| | | }); |
| | | }, |
| | | |
| | | // 显示确认对话框 |
| | | showConfirmDialog() { |
| | | if (!this.currentRow) { |
| | | this.$message.error('没有选择要上报的数据'); |
| | | return; |
| | | } |
| | | |
| | | const orderNo = this.currentRow.orderNo; |
| | | const remainingCount = this.tableDataB.length; |
| | | const modifiedCount = Object.keys(this.modifiedQuantities).filter(key => { |
| | | const item = this.tableDataB.find(item => this.getItemKey(item) === key); |
| | | return item && item.anfme !== this.modifiedQuantities[key]; |
| | | }).length; |
| | | |
| | | let message = `是否确认下发订单号 <strong style="color: #F56C6C; font-size: 16px;">${orderNo}</strong>?<br/><br/>`; |
| | | // message += `将提交以下数据:<br/>`; |
| | | // message += `- 剩余商品数量: ${remainingCount} 个<br/>`; |
| | | // message += `- 修改数量: ${modifiedCount} 个<br/>`; |
| | | // message += `- 删除商品: ${this.deletedRecords.length} 个<br/><br/>`; |
| | | message += `此操作不可逆,确认继续吗?`; |
| | | |
| | | this.$confirm( |
| | | message, |
| | | '确认下发', |
| | | { |
| | | confirmButtonText: '确认下发', |
| | | cancelButtonText: '取消', |
| | | type: 'warning', |
| | | dangerouslyUseHTMLString: true, |
| | | customClass: 'confirm-dialog', |
| | | confirmButtonClass: 'confirm-report-btn', |
| | | beforeClose: (action, instance, done) => { |
| | | if (action === 'confirm') { |
| | | instance.confirmButtonLoading = true; |
| | | this.confirmReport(orderNo, done); |
| | | } else { |
| | | done(); |
| | | } |
| | | } |
| | | } |
| | | ).then(() => { |
| | | // 确认上报后的处理在beforeClose中完成 |
| | | }).catch(() => { |
| | | this.$message({ |
| | | type: 'info', |
| | | message: '已取消操作' |
| | | }); |
| | | }); |
| | | }, |
| | | |
| | | // 确认上报 |
| | | confirmReport(orderNo, done) { |
| | | this.reportLoading = true; |
| | | |
| | | // // 收集要上报的数据 |
| | | // const reportData = this.tableDataB.map(item => { |
| | | // const itemKey = this.getItemKey(item); |
| | | // return { |
| | | // orderNo: groupOrderNo, // 组货单号 |
| | | // matnr: item.matnr, // 商品编号 |
| | | // maktx: item.maktx, // 商品名称 |
| | | // standby1: item.standby1, // 客户PO |
| | | // standby2: item.standby2, // UPC |
| | | // standby3: item.standby3, // 客户SKU |
| | | // boxType3: item.boxType3, // 采购单号 |
| | | // anfme: this.modifiedQuantities[itemKey] || item.anfme, // 数量(使用修改后的数量) |
| | | // erpAnfme: item.erpAnfme, // ERP下架数量 |
| | | // status: item.status, // 状态 |
| | | // batch: item.batch, // 箱号 |
| | | // // 其他必要参数 |
| | | // modified: this.modifiedQuantities[itemKey] !== undefined // 标记是否修改 |
| | | // }; |
| | | // }); |
| | | // |
| | | // // 收集删除记录 |
| | | // const deleteData = this.deletedRecords.map(record => ({ |
| | | // orderNo: groupOrderNo, |
| | | // matnr: record.matnr, |
| | | // maktx: record.maktx, |
| | | // standby1: record.standby1, |
| | | // standby2: record.standby2, |
| | | // standby3: record.standby3, |
| | | // boxType3: record.boxType3, |
| | | // anfme: record.anfme, |
| | | // erpAnfme: record.erpAnfme, |
| | | // status: record.status, |
| | | // batch: record.batch, |
| | | // deleteTime: record.deleteTime |
| | | // })); |
| | | // |
| | | // // 构建提交数据 |
| | | // const submitData = { |
| | | // orderNo: groupOrderNo, |
| | | // details: reportData, |
| | | // deletedDetails: deleteData, |
| | | // totalCount: reportData.length, |
| | | // modifiedCount: Object.keys(this.modifiedQuantities).length, |
| | | // deletedCount: deleteData.length |
| | | // }; |
| | | |
| | | // 调用后台API上报数据 |
| | | $.ajax({ |
| | | url: baseUrl + "/order/pakin/actual/shipment/order/report/auth", |
| | | headers: {'token': localStorage.getItem('token')}, |
| | | data: { |
| | | orderNo: orderNo // 传递订单号 |
| | | }, |
| | | method: 'POST', |
| | | success: (res) => { |
| | | this.reportLoading = false; |
| | | if (typeof done === 'function') { |
| | | done(); |
| | | } |
| | | if (res.code === 200 || res.success) { |
| | | this.$message({ |
| | | message: `订单号 ${orderNo} 下发成功`, |
| | | type: 'success', |
| | | duration: 5000, |
| | | dangerouslyUseHTMLString: true |
| | | }); |
| | | // 下发成功后关闭弹窗并刷新数据 |
| | | setTimeout(() => { |
| | | this.closeDetailDialog(); |
| | | this.getTableDataA(); // 刷新主表数据 |
| | | }, 1500); |
| | | } else { |
| | | this.$message.error(res.msg || '下发失败'); |
| | | } |
| | | }, |
| | | error: (error) => { |
| | | this.reportLoading = false; |
| | | if (typeof done === 'function') { |
| | | done(); |
| | | } |
| | | console.error('下发失败:', error); |
| | | this.$message.error('下发失败,请检查网络连接'); |
| | | } |
| | | }); |
| | | }, |
| | |
| | | this.getTableDataA(); |
| | | }, |
| | | |
| | | showConfirmDialog() { |
| | | if (!this.currentRow) { |
| | | this.$message.error('没有选择要上报的数据'); |
| | | return; |
| | | } |
| | | |
| | | const groupOrderNo = this.currentRow.itemName; |
| | | |
| | | this.$confirm( |
| | | `是否确认开始上报组货单号 <strong style="color: #F56C6C; font-size: 16px;">${groupOrderNo}</strong>?<br/><br/>将生成实际组货单,单一组货单号只能操作一次!!!`, |
| | | '确认上报', |
| | | { |
| | | confirmButtonText: '确认上报', |
| | | cancelButtonText: '取消', |
| | | type: 'warning', |
| | | dangerouslyUseHTMLString: true, |
| | | customClass: 'confirm-dialog', |
| | | confirmButtonClass: 'confirm-report-btn', |
| | | beforeClose: (action, instance, done) => { |
| | | if (action === 'confirm') { |
| | | instance.confirmButtonLoading = true; |
| | | this.confirmReport(groupOrderNo, done); |
| | | } else { |
| | | done(); |
| | | } |
| | | } |
| | | } |
| | | ).then(() => { |
| | | // 确认上报后的处理在beforeClose中完成 |
| | | }).catch(() => { |
| | | this.$message({ |
| | | type: 'info', |
| | | message: '已取消操作' |
| | | }); |
| | | }); |
| | | }, |
| | | |
| | | // 确认上报 |
| | | confirmReport(groupOrderNo, done) { |
| | | this.reportLoading = true; |
| | | |
| | | // 调用后台API上报数据 |
| | | $.ajax({ |
| | | url: baseUrl + "/order/pakout/actual/shipment/order/report/auth", |
| | | headers: {'token': localStorage.getItem('token')}, |
| | | data: { |
| | | itemName: groupOrderNo // 传递组货单号 |
| | | }, |
| | | method: 'POST', |
| | | success: (res) => { |
| | | this.reportLoading = false; |
| | | if (typeof done === 'function') { |
| | | done(); |
| | | } |
| | | if (res.code === 200 || res.success) { |
| | | this.$message({ |
| | | message: `组货单号 ${groupOrderNo} 上报成功`, |
| | | type: 'success', |
| | | duration: 3000 |
| | | }); |
| | | // 上报成功后关闭弹窗并刷新数据 |
| | | setTimeout(() => { |
| | | this.closeDetailDialog(); |
| | | this.getTableDataA(); // 刷新主表数据 |
| | | }, 1500); |
| | | } else { |
| | | this.$message.error(res.message || '上报失败'); |
| | | } |
| | | }, |
| | | error: (error) => { |
| | | this.reportLoading = false; |
| | | if (typeof done === 'function') { |
| | | done(); |
| | | } |
| | | console.error('上报失败:', error); |
| | | this.$message.error('上报失败,请检查网络连接'); |
| | | } |
| | | }); |
| | | }, |
| | | |
| | | // 搜索处理 |
| | | handleSearch() { |
| | | this.currentPage = 1; |
| | |
| | | // 重置搜索条件 |
| | | handleReset() { |
| | | this.searchForm = { |
| | | item_name: '', |
| | | cstmr_name: '', |
| | | settle: '', |
| | | order_no: '' |
| | | orderNo: '', |
| | | cstmrName: '', |
| | | settle: '' |
| | | }; |
| | | this.orderByField = ''; |
| | | this.orderByType = 'asc'; |
| | |
| | | this.detailDialogVisible = true; |
| | | this.detailCurrentPage = 1; |
| | | this.settleA = row.settle; |
| | | // 清空缓存 |
| | | this.modifiedQuantities = {}; |
| | | this.deletedRecords = []; |
| | | this.getTableDataB(row.orderNo); |
| | | }, |
| | | |
| | |
| | | this.currentRow = null; |
| | | this.tableDataB = []; |
| | | this.reportLoading = false; |
| | | this.modifiedQuantities = {}; |
| | | this.deletedRecords = []; |
| | | }, |
| | | |
| | | // 主表分页大小改变 |
| | |
| | | this.detailPageSize = val; |
| | | this.detailCurrentPage = 1; |
| | | if (this.currentRow) { |
| | | this.getTableDataB(this.currentRow.itemName); |
| | | this.getTableDataB(this.currentRow.orderNo); |
| | | } |
| | | }, |
| | | |
| | |
| | | handleDetailCurrentChange(val) { |
| | | this.detailCurrentPage = val; |
| | | if (this.currentRow) { |
| | | this.getTableDataB(this.currentRow.itemName); |
| | | this.getTableDataB(this.currentRow.orderNo); |
| | | } |
| | | }, |
| | | |
| | | // 格式化状态显示 |
| | | formatStatus(row) { |
| | | if (row.settle === 10) { |
| | | return '待处理'; |
| | | } else if (row.settle === 11) { |
| | | return '检验中'; |
| | | } else if (row.settle === 12) { |
| | | return '出库中'; |
| | | } else if (row.settle === 13) { |
| | | return '存在不合格'; |
| | | } else if (row.settle === 15) { |
| | | return '待上报'; |
| | | } else if (row.settle === 16) { |
| | | return '上报完成'; |
| | | } else if (row.settle === 17) { |
| | | return '上报失败'; |
| | | } else if (row.settle === 98) { |
| | | return '异常'; |
| | | } else if (row.settle === 99) { |
| | | return '废弃'; |
| | | } else { |
| | | return row.settle || '未知'; |
| | | } |
| | | const statusMap = { |
| | | 0: '初始化', |
| | | 1: '待处理', |
| | | 2: '作业中', |
| | | 3: '已取消', |
| | | 4: '已完成', |
| | | 5: '准备取消', |
| | | 6: '上报完成', |
| | | 7: '数据异常', |
| | | 8: '审核完成', |
| | | 9: '提交完成', |
| | | 10: '保存完成', |
| | | 98: '异常', |
| | | 99: '废弃' |
| | | }; |
| | | return statusMap[row.settle] || row.settle || '未知'; |
| | | }, |
| | | |
| | | // 格式化状态显示 |
| | | formatStatusB(row) { |
| | | if (row.status === 0) { |
| | | return '初始化'; |
| | | } else if (row.status === 1) { |
| | | return '待处理'; |
| | | } else if (row.status === 2) { |
| | | return '作业中'; |
| | | } else if (row.status === 3) { |
| | | return '已取消'; |
| | | } else if (row.status === 4) { |
| | | return '已完成'; |
| | | } else if (row.status === 5) { |
| | | return '准备取消'; |
| | | } else if (row.status === 6) { |
| | | return '上报完成'; |
| | | } else if (row.status === 7) { |
| | | return '数据异常'; |
| | | } else if (row.status === 8) { |
| | | return '审核完成'; |
| | | } else if (row.status === 9) { |
| | | return '提交完成'; |
| | | } else if (row.status === 10) { |
| | | return '保存完成'; |
| | | } else if (row.status === 98) { |
| | | return '上报完成未完结'; |
| | | } else if (row.status === 99) { |
| | | return '重新下发'; |
| | | } else { |
| | | return row.status || '未知'; |
| | | } |
| | | const statusMap = { |
| | | 0: '初始化', |
| | | 1: '待处理', |
| | | 2: '作业中', |
| | | 3: '已取消', |
| | | 4: '已完成', |
| | | 5: '准备取消', |
| | | 6: '上报完成', |
| | | 7: '数据异常', |
| | | 8: '审核完成', |
| | | 9: '提交完成', |
| | | 10: '保存完成', |
| | | 98: '上报完成未完结', |
| | | 99: '重新下发' |
| | | }; |
| | | return statusMap[row.status] || row.status || '未知'; |
| | | }, |
| | | |
| | | // 格式化金额显示 |
| | | formatCurrency(row) { |
| | | if (row.totalFee) { |
| | | return '¥' + parseFloat(row.totalFee).toFixed(2); |
| | | } |
| | | return '¥0.00'; |
| | | // 格式化状态显示 |
| | | formatStatusC(row) { |
| | | const statusMap = { |
| | | 0: '不下发', |
| | | 1: '待下发' |
| | | }; |
| | | return statusMap[row.inspect] || row.inspect || '未知'; |
| | | }, |
| | | |
| | | // 模拟主表数据 - 实际项目中应删除 |
| | | // 模拟主表数据 |
| | | mockTableAData() { |
| | | this.tableDataA = [ |
| | | { |
| | | itemName: 'zh20251110', |
| | | orderNo: 'ORDER2024001', |
| | | cstmrName: 'zh20251110', |
| | | settle: 10, |
| | | totalFee: 1500.00, |
| | | createTime: '2025-11-10T09:50:16.343+0000', |
| | | itemName: '890506', |
| | | orderNo: '111804', |
| | | cstmrName: '测试', |
| | | settle: 2, |
| | | createTime: '2025-11-18T16:01:11.000+0000', |
| | | updateTime: '2025-11-18T16:01:11.000+0000', |
| | | memo: '测试数据' |
| | | } |
| | | ]; |
| | |
| | | this.loading = false; |
| | | }, |
| | | |
| | | // 模拟子表数据 - 实际项目中应删除 |
| | | mockTableBData(itemName) { |
| | | // 模拟子表数据 |
| | | mockTableBData() { |
| | | this.tableDataB = [ |
| | | { |
| | | matnr: '6μm×436mm', |
| | | batch: 'L241034114', |
| | | model: '24092501D01A6', |
| | | origin: '1', |
| | | danger: '1', |
| | | memo: '', |
| | | status: 1 // 状态为1,会显示修改按钮 |
| | | matnr: '测试', |
| | | maktx: '12inRealisticPlus', |
| | | standby1: 'hDogToy', |
| | | standby2: 'boarL', |
| | | standby3: '890506', |
| | | boxType3: '1', |
| | | anfme: 1, |
| | | erpAnfme: 1, |
| | | status: 2, |
| | | batch: 'L241034114' |
| | | } |
| | | ]; |
| | | this.detailTotal = 1; |
| | | this.detailLoading = false; |
| | | |
| | | // 初始化数量缓存 |
| | | this.modifiedQuantities = {}; |
| | | this.tableDataB.forEach(item => { |
| | | const itemKey = this.getItemKey(item); |
| | | this.$set(this.modifiedQuantities, itemKey, item.anfme); |
| | | }); |
| | | }, |
| | | |
| | | // 为表格列添加格式化方法 |
| | |
| | | return this.formatDate(cellValue); |
| | | }, |
| | | |
| | | |
| | | |
| | | // // 格式化日期显示 |
| | | // formatDate(dateStr) { |
| | | // if (!dateStr) return ''; |
| | | // // 简单的日期格式化,可以根据实际格式调整 |
| | | // return dateStr; |
| | | // }, |
| | | |
| | | // 在Vue实例的methods中添加或修改formatDate方法 |
| | | // 格式化日期显示 |
| | | formatDate(dateStr) { |
| | | if (!dateStr) return ''; |
| | | |
| | | try { |
| | | // 创建Date对象 |
| | | const date = new Date(dateStr); |
| | | |
| | | // 检查日期是否有效 |
| | | if (isNaN(date.getTime())) { |
| | | return dateStr; // 如果解析失败,返回原字符串 |
| | | } |
| | | |
| | | // 获取各个时间组件 |
| | | const year = date.getFullYear(); |
| | | const month = String(date.getMonth() + 1).padStart(2, '0'); |
| | | const day = String(date.getDate()).padStart(2, '0'); |
| | | const hours = String(date.getHours()).padStart(2, '0'); |
| | | const minutes = String(date.getMinutes()).padStart(2, '0'); |
| | | const seconds = String(date.getSeconds()).padStart(2, '0'); |
| | | |
| | | // 返回格式化后的字符串:YYYY-MM-DD HH:mm:ss |
| | | return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`; |
| | | } catch (error) { |
| | | console.error('日期格式化错误:', error); |
| | | return dateStr; // 如果出错,返回原字符串 |
| | | } |
| | | }, |
| | | |
| | | //本地时区的时间 |
| | | formatDate2(dateStr) { |
| | | if (!dateStr) return ''; |
| | | |
| | | try { |
| | | const date = new Date(dateStr); |
| | | |
| | | if (isNaN(date.getTime())) { |
| | | return dateStr; |
| | | } |
| | | |
| | | // 使用本地时区 |
| | | const year = date.getFullYear(); |
| | | const month = String(date.getMonth() + 1).padStart(2, '0'); |
| | | const day = String(date.getDate()).padStart(2, '0'); |
| | | const hours = String(date.getHours()).padStart(2, '0'); |
| | | const minutes = String(date.getMinutes()).padStart(2, '0'); |
| | | const seconds = String(date.getSeconds()).padStart(2, '0'); |
| | | |
| | | return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`; |
| | | } catch (error) { |
| | | console.error('日期格式化错误:', error); |
| | | return dateStr; |
| | | } |
| | | }, |
| | | //保持UTC时间但转换为更易读的格式 |
| | | formatDate3(dateStr) { |
| | | if (!dateStr) return ''; |
| | | |
| | | try { |
| | | // 直接解析字符串,不转换时区 |
| | | const date = new Date(dateStr); |
| | | |
| | | if (isNaN(date.getTime())) { |
| | | return dateStr; |
| | | } |
| | | |
| | | // 使用UTC时间组件 |
| | | const year = date.getUTCFullYear(); |
| | | const month = String(date.getUTCMonth() + 1).padStart(2, '0'); |
| | | const day = String(date.getUTCDate()).padStart(2, '0'); |
| | | const hours = String(date.getUTCHours()).padStart(2, '0'); |
| | | const minutes = String(date.getUTCMinutes()).padStart(2, '0'); |
| | | const seconds = String(date.getUTCSeconds()).padStart(2, '0'); |
| | | |
| | | return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`; |
| | | } catch (error) { |