| | |
| | | <el-link |
| | | type="primary" |
| | | size="small" |
| | | style="float: right; height: 20px" |
| | | @click="lockstocks" |
| | | >锁定库存</el-link |
| | | style="float: left; height: 20px;" |
| | | @click="cancelOutFeedbackERP" |
| | | >出库明细取消推送ERP</el-link |
| | | > |
| | | <el-link |
| | | type="primary" |
| | |
| | | <el-table |
| | | ref="singleTable" |
| | | :data="tableData" |
| | | :summary-method="getSummaries" |
| | | show-summary |
| | | style="width: 100%; height: 100%" |
| | | highlight-current-row |
| | | @current-change="handleCurrentChange" |
| | |
| | | align="center" |
| | | > |
| | | <template #default="scoped"> |
| | | <!-- 图标列 --> |
| | | <div v-if="item.type == 'icon'"> |
| | | <el-tooltip |
| | | class="item" |
| | |
| | | ></el-tooltip> |
| | | </div> |
| | | |
| | | <!-- 标签列 --> |
| | | <div v-else-if="item.type == 'tag'"> |
| | | <el-tag size="small"> |
| | | {{ getDictionary(scoped.row, item) }} |
| | | </el-tag> |
| | | </div> |
| | | |
| | | <!-- 普通文本列 - 带溢出隐藏和Tooltip --> |
| | | <div v-else> |
| | | <el-tooltip |
| | | class="item" |
| | | effect="dark" |
| | | :content="formatCellContent(scoped.row[item.prop])" |
| | | placement="top" |
| | | :disabled="!shouldShowTooltip(scoped.row[item.prop], item)" |
| | | > |
| | | <span |
| | | class="ellipsis-cell" |
| | | :style="{ width: calculateCellWidth(item) }" |
| | | > |
| | | {{ formatCellContent(scoped.row[item.prop]) }} |
| | | </span> |
| | | </el-tooltip> |
| | | </div> |
| | | </template> |
| | | </el-table-column> |
| | |
| | | hidden: true, |
| | | }, |
| | | { |
| | | prop: "materielCode", |
| | | title: "物料编号", |
| | | type: "string", |
| | | width: 150, |
| | | prop: "viewDetail", |
| | | title: "出库详细", |
| | | type: "icon", |
| | | width: 90, |
| | | icon: "el-icon-s-operation", |
| | | }, |
| | | { |
| | | prop: "materielName", |
| | | title: "物料名称", |
| | | prop: "materielCode", |
| | | title: "物料编号", |
| | | type: "string", |
| | | width: 150, |
| | | }, |
| | |
| | | prop: "batchNo", |
| | | title: "批次号", |
| | | type: "string", |
| | | width: 90, |
| | | width: 180, |
| | | }, |
| | | { |
| | | prop: "supplierBatch", |
| | | title: "供应商批次号", |
| | | type: "string", |
| | | width: 180, |
| | | }, |
| | | { |
| | | prop: "orderQuantity", |
| | | title: "单据数量", |
| | | type: "string", |
| | | width: 90, |
| | | }, |
| | | { |
| | | prop: "lockQuantity", |
| | | title: "锁定数量", |
| | | type: "int", |
| | | width: 90, |
| | | }, |
| | | { |
| | |
| | | width: 90, |
| | | }, |
| | | { |
| | | prop: "remark", |
| | | title: "备注", |
| | | type: "string", |
| | | width: 180, |
| | | }, |
| | | { |
| | | prop: "orderDetailStatus", |
| | | title: "订单明细状态", |
| | | type: "tag", |
| | | width: 180, |
| | | bindKey:"orderDetailStatusEnum" |
| | | bindKey: "orderDetailStatusEnum", |
| | | }, |
| | | { |
| | | prop: "assignStock", |
| | | title: "指定库存", |
| | | type: "icon", |
| | | width: 90, |
| | | icon: "el-icon-s-grid", |
| | | prop: "materielName", |
| | | title: "物料名称", |
| | | type: "string", |
| | | width: 150, |
| | | }, |
| | | { |
| | | prop: "viewDetail", |
| | | title: "出库详细", |
| | | type: "icon", |
| | | width: 90, |
| | | icon: "el-icon-s-operation", |
| | | prop: "locationName", |
| | | title: "出库货位", |
| | | type: "string", |
| | | width: 200, |
| | | }, |
| | | { |
| | | prop: "creater", |
| | |
| | | width: 160, |
| | | }, |
| | | { |
| | | prop: "remark", |
| | | title: "备注", |
| | | type: "string", |
| | | prop: "lockQuantity", |
| | | title: "锁定数量", |
| | | type: "int", |
| | | width: 90, |
| | | }, |
| | | ], |
| | | paginations: { |
| | |
| | | order: "desc", |
| | | Foots: "", |
| | | total: 0, |
| | | // 2020.08.29增加自定义分页条大小 |
| | | sizes: [30, 60, 100, 120], |
| | | size: 30, // 默认分页大小 |
| | | sizes: [60, 100, 120], |
| | | size: 60, |
| | | Wheres: [], |
| | | page: 1, |
| | | rows: 30, |
| | | rows: 60, |
| | | }, |
| | | searchFormOptions: [ |
| | | [ |
| | |
| | | this.getDictionaryData(); |
| | | this.getData(); |
| | | }, |
| | | getSummaries(param) { |
| | | const { columns, data } = param |
| | | const sums = [] |
| | | |
| | | columns.forEach((column, index) => { |
| | | if (index === 0) { |
| | | sums[index] = '合计' |
| | | return |
| | | } |
| | | |
| | | // 仅对指定数值列求和并保留两位小数 |
| | | if (['lockQuantity', 'overOutQuantity', 'orderQuantity'].includes(column.property)) { |
| | | const values = data.map(item => Number(item[column.property])) |
| | | |
| | | if (!values.every(value => isNaN(value))) { |
| | | // 计算总和 |
| | | const total = values.reduce((prev, curr) => { |
| | | return prev + (isNaN(curr) ? 0 : curr) |
| | | }, 0) |
| | | |
| | | // 保留两位小数 |
| | | sums[index] = total.toFixed(2) |
| | | } else { |
| | | sums[index] = '-' |
| | | } |
| | | } else { |
| | | sums[index] = '' |
| | | } |
| | | }) |
| | | |
| | | return sums |
| | | }, |
| | | getData() { |
| | | var wheres = [{ name: "orderId", value: this.row.id }]; |
| | | var param = { |
| | |
| | | rows: this.paginations.rows, |
| | | sort: this.paginations.sort, |
| | | order: this.paginations.order, |
| | | wheres: JSON.stringify(wheres), // 查询条件,格式为[{ name: "字段", value: "xx" }] |
| | | wheres: JSON.stringify(wheres), |
| | | }; |
| | | this.http |
| | | .post("api/OutboundOrderDetail/GetPageData", param, "查询中") |
| | |
| | | if (this.selection.length === 0) { |
| | | return this.$message.error("请选择单据明细"); |
| | | } |
| | | var keys = this.selection.map((item) => item.id); // 获取选中行的id |
| | | var keys = this.selection.map((item) => item.id); |
| | | this.http |
| | | .post("api/OutboundOrderDetail/LockOutboundStocks", keys, "数据处理中") |
| | | .then((x) => { |
| | |
| | | if (this.selection.length === 0) { |
| | | return this.$message.error("请选择单据明细"); |
| | | } |
| | | var keys = this.selection.map((item) => item.id); // 获取选中行的id |
| | | |
| | | var keys = this.selection.map((item) => item.id); |
| | | this.http |
| | | .post("api/Task/GenerateOutboundTasks", keys, "数据处理中") |
| | | .post("api/Task/WMSGenerateOutboundTask", keys, "数据处理中") |
| | | .then((x) => { |
| | | if (!x.status) return this.$message.error(x.message); |
| | | this.$message.success("操作成功"); |
| | |
| | | }); |
| | | }); |
| | | }, |
| | | |
| | | cancelOutFeedbackERP() { |
| | | if (this.selection.length === 0) { |
| | | return this.$message.error("请选择单据明细"); |
| | | } |
| | | var keys = this.selection.map((item) => item.id); |
| | | this.$confirm("是否取消该出库单明细","单据取消警告",{ |
| | | confirmButtonText: "确定", |
| | | cancelButtonText: "取消", |
| | | type: "warning", |
| | | center: true, |
| | | }).then(() => { |
| | | this.http |
| | | .post("api/OutboundOrderDetail/CancelOutFeedbackERP", keys, "数据处理中") |
| | | .then((x) => { |
| | | if (!x.status) return this.$message.error(x.message); |
| | | this.$message.success("操作成功"); |
| | | this.showDetialBox = false; |
| | | this.$emit("parentCall", ($vue) => { |
| | | $vue.getData(); |
| | | }); |
| | | }); |
| | | }); |
| | | }, |
| | | |
| | | setCurrent(row) { |
| | | this.$refs.singleTable.setCurrentRow(row); |
| | | }, |
| | |
| | | if ( |
| | | row.orderDetailStatus !== 0 && |
| | | row.orderDetailStatus !== 60 && |
| | | row.orderDetailStatus !== 70 |
| | | row.orderDetailStatus !== 70 && |
| | | row.orderDetailStatus !== 80 |
| | | ) { |
| | | return true; |
| | | } else { |
| | |
| | | } |
| | | } |
| | | }, |
| | | // 格式化单元格内容,处理null/undefined |
| | | formatCellContent(content) { |
| | | if (content === null || content === undefined) { |
| | | return "无数据"; |
| | | } |
| | | // 对日期类型进行特殊处理(如果需要) |
| | | return content.toString(); |
| | | }, |
| | | // 计算单元格宽度,预留边距 |
| | | calculateCellWidth(column) { |
| | | // 如果列定义了宽度,减去20px作为内边距 |
| | | if (column.width) { |
| | | return `${column.width - 20}px`; |
| | | } |
| | | // 未定义宽度则使用100% |
| | | return "100%"; |
| | | }, |
| | | // 判断是否需要显示Tooltip |
| | | shouldShowTooltip(content, column) { |
| | | // 标记为不需要溢出处理的列不显示Tooltip |
| | | if (column.noEllipsis) { |
| | | return false; |
| | | } |
| | | |
| | | // 空内容不显示Tooltip |
| | | const cellContent = this.formatCellContent(content); |
| | | if (cellContent === "无数据") { |
| | | return false; |
| | | } |
| | | |
| | | // 内容较短时也不显示Tooltip(根据实际需求调整长度阈值) |
| | | return cellContent.length > 8; |
| | | } |
| | | }, |
| | | }; |
| | | </script> |
| | |
| | | .text-button { |
| | | border: 0px; |
| | | } |
| | | |
| | | /* 文本溢出隐藏样式 */ |
| | | .ellipsis-cell { |
| | | white-space: nowrap; |
| | | overflow: hidden; |
| | | text-overflow: ellipsis; |
| | | position: relative; |
| | | z-index: 1; |
| | | display: inline-block; |
| | | max-width: 100%; |
| | | } |
| | | </style> |
| | | |
| | | <style> |
| | | .text-button:hover { |
| | | background-color: #f0f9eb !important; |
| | | } |
| | | |
| | | .el-table .warning-row { |
| | | background: oldlace; |
| | | } |
| | | |
| | | .box-table .el-table tbody tr:hover > td { |
| | | background-color: #d8e0d4 !important; |
| | | /* color: #ffffff; */ |
| | | } |
| | | |
| | | .box-table .el-table tbody tr.current-row > td { |
| | | background-color: #f0f9eb !important; |
| | | /* color: #ffffff; */ |
| | | } |
| | | |
| | | .el-table .success-row { |
| | |
| | | .box-table .el-table { |
| | | border: 1px solid #ebeef5; |
| | | } |
| | | |
| | | /* 合计行文本溢出处理 */ |
| | | .el-table__footer-wrapper .el-table__cell { |
| | | white-space: nowrap; |
| | | overflow: hidden; |
| | | text-overflow: ellipsis; |
| | | position: relative; |
| | | z-index: 1; |
| | | } |
| | | </style> |