8 changed files with 565 additions and 17 deletions
-
14src/api/automatedWarehouse/cancelWcsPallet.js
-
1src/router/index.js
-
6src/views/main.vue
-
76src/views/modules/automatedWarehouse/callOut.vue
-
468src/views/modules/automatedWarehouse/cancelWcsPallet.vue
-
3src/views/modules/automatedWarehouse/emptyPalletAssembly.vue
-
7src/views/modules/automatedWarehouse/palletChangeStation.vue
-
7src/views/modules/automatedWarehouse/palletManualMove.vue
@ -0,0 +1,14 @@ |
|||||
|
import { createAPI } from "@/utils/httpRequest.js"; |
||||
|
|
||||
|
// ========== 取消WCS组盘相关 ========== - rqrq
|
||||
|
|
||||
|
// 检查栈板WCS组盘状态 - rqrq
|
||||
|
export const checkPalletWcsStatus = data => createAPI(`/wcsIntegration/checkPalletWcsStatus`, 'post', data) |
||||
|
|
||||
|
// 取消组盘 - rqrq
|
||||
|
export const cancelWcsPallet = data => createAPI(`/wcsIntegration/cancelWcsPallet`, 'post', data) |
||||
|
|
||||
|
// 移出全部物料 - rqrq
|
||||
|
export const removeAllPalletDetails = data => createAPI(`/wcsIntegration/removeAllPalletDetails`, 'post', data) |
||||
|
|
||||
|
|
||||
@ -0,0 +1,468 @@ |
|||||
|
<template> |
||||
|
<div> |
||||
|
<div class="pda-container"> |
||||
|
<!-- 头部栏 - rqrq --> |
||||
|
<div class="header-bar"> |
||||
|
<div class="header-left" @click="handleBack"> |
||||
|
<i class="el-icon-arrow-left"></i> |
||||
|
<span>取消WCS组盘任务</span> |
||||
|
</div> |
||||
|
<div class="header-right" @click="$router.push({ path: '/' })"> |
||||
|
首页 |
||||
|
</div> |
||||
|
</div> |
||||
|
|
||||
|
<div class="table-body" style="max-height: 600px; overflow-y: auto;"> |
||||
|
<div class="main-content form-section"> |
||||
|
<!-- 栈板扫描 - rqrq --> |
||||
|
<div class="input-group"> |
||||
|
<label class="input-label">栈板编码</label> |
||||
|
<el-input |
||||
|
v-model="palletCode" |
||||
|
placeholder="请扫描栈板编码" |
||||
|
class="form-input" |
||||
|
clearable |
||||
|
@keyup.enter.native="handlePalletScan" |
||||
|
inputmode="none" |
||||
|
autocomplete="off" |
||||
|
autocorrect="off" |
||||
|
spellcheck="false" |
||||
|
ref="palletInput" |
||||
|
/> |
||||
|
</div> |
||||
|
|
||||
|
<!-- 栈板信息显示（扫描栈板后显示）- rqrq --> |
||||
|
<div v-if="palletScanned" class="pallet-info-section"> |
||||
|
|
||||
|
<div class="info-row"> |
||||
|
<label class="info-label">是否被调用:</label> |
||||
|
<span class="info-value" :style="{color: palletInfo.callingFlag === 'Y' ? '#F56C6C' : '#67C23A'}"> |
||||
|
{{ palletInfo.callingFlag === 'Y' ? '是' : '否' }} |
||||
|
</span> |
||||
|
</div> |
||||
|
|
||||
|
<!-- 是否发送组盘任务 - rqrq --> |
||||
|
<div class="info-row"> |
||||
|
<label class="info-label">是否已组盘:</label> |
||||
|
<span class="info-value" :style="{color: hasSentWcsTask ? '#F56C6C' : '#67C23A'}"> |
||||
|
{{ hasSentWcsTask ? '是' : '否' }} |
||||
|
</span> |
||||
|
</div> |
||||
|
|
||||
|
<!-- 浏览明细按钮 - rqrq --> |
||||
|
<div class="button-row"> |
||||
|
<button class="action-btn primary" @click="showDetailModal" style="width: 100%;"> |
||||
|
浏览明细 ({{ detailList.length }}条) |
||||
|
</button> |
||||
|
</div> |
||||
|
|
||||
|
<!-- 取消组盘按钮（只有发送了组盘任务才显示）- rqrq --> |
||||
|
<div v-if="showCancelButton" class="button-row"> |
||||
|
<button |
||||
|
class="action-btn primary" |
||||
|
@click="handleCancelWcsPallet" |
||||
|
:disabled="cancelLoading" |
||||
|
style="width: 100%;"> |
||||
|
{{ cancelLoading ? '取消中...' : '取消组盘' }} |
||||
|
</button> |
||||
|
</div> |
||||
|
|
||||
|
<!-- 移出全部物料按钮（只有未发送组盘任务且未被调用且有明细才显示）- rqrq --> |
||||
|
<div v-if="showRemoveAllButton" class="button-row"> |
||||
|
<button |
||||
|
class="action-btn warning" |
||||
|
@click="handleRemoveAllMaterials" |
||||
|
:disabled="removeAllLoading" |
||||
|
style="width: 100%;"> |
||||
|
{{ removeAllLoading ? '移出中...' : '移出全部物料' }} |
||||
|
</button> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
|
||||
|
<!-- 浏览明细弹窗 - rqrq --> |
||||
|
<el-dialog |
||||
|
:title="'栈板明细 (共'+detailList.length+'条)'" |
||||
|
:visible.sync="detailModalVisible" |
||||
|
width="90%" |
||||
|
:close-on-click-modal="false" |
||||
|
:show-close="false" |
||||
|
:modal="true" |
||||
|
:modal-append-to-body="true" |
||||
|
:append-to-body="true" |
||||
|
> |
||||
|
<div class="table-body" style="max-height: 400px; overflow-y: auto;"> |
||||
|
<div class="detail-table"> |
||||
|
<div class="table-header"> |
||||
|
<div class="col-position">位置</div> |
||||
|
<div class="col-layer">层数</div> |
||||
|
<div class="col-serial">标签号</div> |
||||
|
</div> |
||||
|
<div |
||||
|
v-for="(detail, index) in detailList" |
||||
|
:key="index" |
||||
|
class="table-row" |
||||
|
> |
||||
|
<div class="col-position">{{ detail.position }}</div> |
||||
|
<div class="col-layer">{{ detail.layer }}</div> |
||||
|
<div class="col-serial">{{ detail.serialNo }}</div> |
||||
|
</div> |
||||
|
<!-- 暂无数据提示 --> |
||||
|
<div v-if="detailList.length === 0" class="table-row empty-row"> |
||||
|
<div class="empty-hint">暂无栈板明细数据</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
<div slot="footer" class="dialog-footer"> |
||||
|
<button class="action-btn secondary" @click="detailModalVisible=false">关闭</button> |
||||
|
</div> |
||||
|
</el-dialog> |
||||
|
</div> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import { |
||||
|
getPalletDetails |
||||
|
} from '../../../api/automatedWarehouse/palletPacking' |
||||
|
import { |
||||
|
checkPalletWcsStatus, |
||||
|
cancelWcsPallet, |
||||
|
removeAllPalletDetails |
||||
|
} from '../../../api/automatedWarehouse/cancelWcsPallet' |
||||
|
|
||||
|
export default { |
||||
|
data() { |
||||
|
return { |
||||
|
site: localStorage.getItem('site'), |
||||
|
|
||||
|
// 栈板信息 - rqrq |
||||
|
palletCode: '', |
||||
|
palletScanned: false, |
||||
|
palletInfo: { |
||||
|
callingFlag: '', |
||||
|
canOperate: '', |
||||
|
isEmpty: '' |
||||
|
}, |
||||
|
|
||||
|
// 按钮显示控制 - rqrq |
||||
|
hasSentWcsTask: false, |
||||
|
showCancelButton: false, |
||||
|
showRemoveAllButton: false, |
||||
|
|
||||
|
// 栈板明细 - rqrq |
||||
|
detailList: [], |
||||
|
detailModalVisible: false, |
||||
|
|
||||
|
// 加载状态 - rqrq |
||||
|
cancelLoading: false, |
||||
|
removeAllLoading: false |
||||
|
}; |
||||
|
}, |
||||
|
methods: { |
||||
|
// 返回上一页 - rqrq |
||||
|
handleBack() { |
||||
|
this.$router.back(); |
||||
|
}, |
||||
|
|
||||
|
// 扫描栈板 - rqrq |
||||
|
handlePalletScan() { |
||||
|
if (!this.palletCode.trim()) { |
||||
|
this.$message.error('请输入栈板编码'); |
||||
|
return; |
||||
|
} |
||||
|
|
||||
|
checkPalletWcsStatus({ |
||||
|
site: this.site, |
||||
|
palletId: this.palletCode |
||||
|
}).then(({ data }) => { |
||||
|
if (data.code === 0) { |
||||
|
// 后端返回正确的6位栈板码，赋值给输入框 - rqrq |
||||
|
this.palletCode = data.row.palletId; |
||||
|
|
||||
|
// 保存栈板信息 - rqrq |
||||
|
this.palletInfo = data.row; |
||||
|
this.palletScanned = true; |
||||
|
|
||||
|
// 解析按钮显示逻辑 - rqrq |
||||
|
// canOperate字段存储showCancelButton（是否显示取消组盘按钮）- rqrq |
||||
|
this.showCancelButton = data.row.canOperate === 'Y'; |
||||
|
|
||||
|
// isEmpty字段存储showRemoveAllButton（是否显示移出全部物料按钮）- rqrq |
||||
|
this.showRemoveAllButton = data.row.isEmpty === 'Y'; |
||||
|
|
||||
|
// 计算hasSentWcsTask（是否发送组盘任务）用于显示 - rqrq |
||||
|
this.hasSentWcsTask = this.showCancelButton; |
||||
|
|
||||
|
// 加载栈板明细 - rqrq |
||||
|
this.loadPalletDetails(); |
||||
|
|
||||
|
} else { |
||||
|
this.$alert(data.msg || '栈板不存在', '错误', { |
||||
|
confirmButtonText: '确定', |
||||
|
callback: () => { |
||||
|
this.palletCode = ''; |
||||
|
this.$nextTick(() => { |
||||
|
if (this.$refs.palletInput) { |
||||
|
this.$refs.palletInput.focus(); |
||||
|
} |
||||
|
}); |
||||
|
} |
||||
|
}); |
||||
|
} |
||||
|
}).catch(error => { |
||||
|
console.error('查询栈板失败:', error); |
||||
|
this.$alert(error.message || '查询栈板失败', '错误', { |
||||
|
confirmButtonText: '确定', |
||||
|
callback: () => { |
||||
|
this.palletCode = ''; |
||||
|
this.$nextTick(() => { |
||||
|
if (this.$refs.palletInput) { |
||||
|
this.$refs.palletInput.focus(); |
||||
|
} |
||||
|
}); |
||||
|
} |
||||
|
}); |
||||
|
}); |
||||
|
}, |
||||
|
|
||||
|
// 加载栈板明细 - rqrq |
||||
|
loadPalletDetails() { |
||||
|
getPalletDetails({ |
||||
|
site: this.site, |
||||
|
palletId: this.palletCode, |
||||
|
position: '', |
||||
|
layer: '' |
||||
|
}).then(({ data }) => { |
||||
|
if (data.code === 0) { |
||||
|
this.detailList = data.details || []; |
||||
|
} else { |
||||
|
this.detailList = []; |
||||
|
} |
||||
|
}).catch(error => { |
||||
|
console.error('获取栈板明细失败:', error); |
||||
|
this.detailList = []; |
||||
|
}); |
||||
|
}, |
||||
|
|
||||
|
// 显示明细弹窗 - rqrq |
||||
|
showDetailModal() { |
||||
|
this.detailModalVisible = true; |
||||
|
}, |
||||
|
|
||||
|
// 取消组盘 - rqrq |
||||
|
handleCancelWcsPallet() { |
||||
|
this.$confirm('确定要取消组盘吗？取消后需要重新组盘才能推送到WCS。', '确认操作', { |
||||
|
confirmButtonText: '确定', |
||||
|
cancelButtonText: '取消', |
||||
|
type: 'warning' |
||||
|
}).then(() => { |
||||
|
this.cancelLoading = true; |
||||
|
|
||||
|
cancelWcsPallet({ |
||||
|
site: this.site, |
||||
|
palletId: this.palletCode |
||||
|
}).then(({ data }) => { |
||||
|
if (data && data.code === 0) { |
||||
|
this.$message.success('取消组盘成功'); |
||||
|
// 重新扫描刷新信息 - rqrq |
||||
|
this.handlePalletScan(); |
||||
|
} else { |
||||
|
this.$alert(data.msg || '取消组盘失败', '错误'); |
||||
|
} |
||||
|
}).catch(error => { |
||||
|
console.error('取消组盘失败:', error); |
||||
|
this.$message.error(error.message || '取消组盘失败'); |
||||
|
}).finally(() => { |
||||
|
this.cancelLoading = false; |
||||
|
}); |
||||
|
}).catch(() => { |
||||
|
// 用户取消操作 |
||||
|
}); |
||||
|
}, |
||||
|
|
||||
|
// 移出全部物料 - rqrq |
||||
|
handleRemoveAllMaterials() { |
||||
|
this.$confirm('确定要移出栈板上的全部物料吗？此操作不可恢复！', '确认操作', { |
||||
|
confirmButtonText: '确定', |
||||
|
cancelButtonText: '取消', |
||||
|
type: 'warning' |
||||
|
}).then(() => { |
||||
|
this.removeAllLoading = true; |
||||
|
|
||||
|
removeAllPalletDetails({ |
||||
|
site: this.site, |
||||
|
palletId: this.palletCode |
||||
|
}).then(({ data }) => { |
||||
|
if (data && data.code === 0) { |
||||
|
this.$message.success('移出全部物料成功'); |
||||
|
// 重新扫描刷新信息 - rqrq |
||||
|
this.handlePalletScan(); |
||||
|
} else { |
||||
|
this.$alert(data.msg || '移出全部物料失败', '错误'); |
||||
|
} |
||||
|
}).catch(error => { |
||||
|
console.error('移出全部物料失败:', error); |
||||
|
this.$message.error(error.message || '移出全部物料失败'); |
||||
|
}).finally(() => { |
||||
|
this.removeAllLoading = false; |
||||
|
}); |
||||
|
}).catch(() => { |
||||
|
// 用户取消操作 |
||||
|
}); |
||||
|
} |
||||
|
}, |
||||
|
mounted() { |
||||
|
this.$nextTick(() => { |
||||
|
if (this.$refs.palletInput) { |
||||
|
this.$refs.palletInput.focus(); |
||||
|
} |
||||
|
}); |
||||
|
} |
||||
|
}; |
||||
|
</script> |
||||
|
|
||||
|
<style scoped> |
||||
|
/* 栈板信息区域 - rqrq */ |
||||
|
.pallet-info-section { |
||||
|
margin-top: 16px; |
||||
|
padding: 12px; |
||||
|
background: #f5f7fa; |
||||
|
border-radius: 6px; |
||||
|
} |
||||
|
|
||||
|
.info-row { |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
padding: 8px 0; |
||||
|
border-bottom: 1px solid #e4e7ed; |
||||
|
} |
||||
|
|
||||
|
.info-row:last-child { |
||||
|
border-bottom: none; |
||||
|
} |
||||
|
|
||||
|
.info-label { |
||||
|
font-weight: bold; |
||||
|
color: #606266; |
||||
|
width: 140px; |
||||
|
flex-shrink: 0; |
||||
|
} |
||||
|
|
||||
|
.info-value { |
||||
|
color: #303133; |
||||
|
font-size: 14px; |
||||
|
font-weight: bold; |
||||
|
} |
||||
|
|
||||
|
.button-row { |
||||
|
margin-top: 12px; |
||||
|
} |
||||
|
|
||||
|
/* 警告按钮 - rqrq */ |
||||
|
.action-btn.warning { |
||||
|
background-color: #E6A23C; |
||||
|
color: white; |
||||
|
border: none; |
||||
|
padding: 10px 20px; |
||||
|
border-radius: 4px; |
||||
|
cursor: pointer; |
||||
|
font-size: 14px; |
||||
|
} |
||||
|
|
||||
|
.action-btn.warning:hover { |
||||
|
background-color: #d99525; |
||||
|
} |
||||
|
|
||||
|
.action-btn.warning:disabled { |
||||
|
background-color: #f5dab1; |
||||
|
cursor: not-allowed; |
||||
|
} |
||||
|
|
||||
|
/* 表格样式 - rqrq */ |
||||
|
.detail-table { |
||||
|
background: white; |
||||
|
border-radius: 6px; |
||||
|
overflow: hidden; |
||||
|
border: 1px solid #e0e0e0; |
||||
|
} |
||||
|
|
||||
|
.table-header, |
||||
|
.table-row { |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
padding: 8px; |
||||
|
border-bottom: 1px solid #e0e0e0; |
||||
|
} |
||||
|
|
||||
|
.table-header { |
||||
|
background: #f5f5f5; |
||||
|
font-weight: bold; |
||||
|
font-size: 14px; |
||||
|
} |
||||
|
|
||||
|
.table-row { |
||||
|
font-size: 13px; |
||||
|
} |
||||
|
|
||||
|
.table-row:last-child { |
||||
|
border-bottom: none; |
||||
|
} |
||||
|
|
||||
|
.col-position { |
||||
|
flex: 1; |
||||
|
text-align: center; |
||||
|
} |
||||
|
|
||||
|
.col-layer { |
||||
|
flex: 1; |
||||
|
text-align: center; |
||||
|
} |
||||
|
|
||||
|
.col-serial { |
||||
|
flex: 4; |
||||
|
text-align: center; |
||||
|
word-break: break-all; |
||||
|
} |
||||
|
|
||||
|
/* 空数据提示 - rqrq */ |
||||
|
.empty-hint { |
||||
|
text-align: center; |
||||
|
color: #999; |
||||
|
padding: 20px; |
||||
|
background: white; |
||||
|
border-radius: 6px; |
||||
|
} |
||||
|
|
||||
|
/* 空数据行样式 - rqrq */ |
||||
|
.empty-row { |
||||
|
justify-content: center; |
||||
|
align-items: center; |
||||
|
padding: 20px; |
||||
|
border-bottom: none; |
||||
|
} |
||||
|
|
||||
|
.empty-row .empty-hint { |
||||
|
text-align: center; |
||||
|
color: #999; |
||||
|
width: 100%; |
||||
|
} |
||||
|
|
||||
|
.dialog-footer { |
||||
|
display: flex; |
||||
|
gap: 8px; |
||||
|
text-align: center; |
||||
|
} |
||||
|
|
||||
|
/* 修复模态框层级问题 - rqrq */ |
||||
|
::v-deep .el-dialog__wrapper { |
||||
|
z-index: 2000 !important; |
||||
|
} |
||||
|
|
||||
|
::v-deep .el-overlay { |
||||
|
z-index: 2000 !important; |
||||
|
} |
||||
|
</style> |
||||
|
|
||||
|
|
||||
Write
Preview
Loading…
Cancel
Save
Reference in new issue