From 83161ba784c838117bbebb5d712f2e2037b269be Mon Sep 17 00:00:00 2001
From: heshaofeng <heshaofeng@hnkhzn.com>
Date: 星期三, 04 二月 2026 19:33:28 +0800
Subject: [PATCH] 优化拣选页面
---
项目代码/WIDESEA_WMSClient/src/views/outbound/outPicking.vue | 968 +++++++++++++++++++++++++++++++++++++++++++-------------
1 files changed, 738 insertions(+), 230 deletions(-)
diff --git "a/\351\241\271\347\233\256\344\273\243\347\240\201/WIDESEA_WMSClient/src/views/outbound/outPicking.vue" "b/\351\241\271\347\233\256\344\273\243\347\240\201/WIDESEA_WMSClient/src/views/outbound/outPicking.vue"
index 9a11079..fd38e9b 100644
--- "a/\351\241\271\347\233\256\344\273\243\347\240\201/WIDESEA_WMSClient/src/views/outbound/outPicking.vue"
+++ "b/\351\241\271\347\233\256\344\273\243\347\240\201/WIDESEA_WMSClient/src/views/outbound/outPicking.vue"
@@ -1,5 +1,7 @@
<template>
- <div class="picking-container">
+ <div class="picking-container" v-loading="globalLoading" element-loading-text="澶勭悊涓�..."
+ element-loading-background="rgba(255, 255, 255, 0.8)" element-loading-spinner="el-icon-loading"
+ element-loading-custom-class="custom-loading">
<!-- 椤堕儴璁㈠崟淇℃伅 -->
<el-card class="order-info-card" shadow="never">
<div class="order-header">
@@ -8,8 +10,9 @@
<span class="order-label">璁㈠崟鍙凤細</span>
<span class="order-value">{{ orderNo }}</span>
</div>
- <div class="order-status" v-if="orderInfo">
- <el-tag :type="getStatusType(orderInfo.status)" size="medium">
+ <div class="order-status">
+ <el-tag v-if="orderInfo" :type="getStatusType(orderInfo.orderStatus)" size="medium"
+ style="margin-left: 10px;">
{{ orderInfo.statusName || '杩涜涓�' }}
</el-tag>
</div>
@@ -19,9 +22,15 @@
<!-- 鎵爜鎿嶄綔鍖哄煙 -->
<el-card class="scan-section-card" shadow="never">
<div class="scan-section">
- <el-alert title="璇蜂娇鐢ㄦ壂鐮佹灙鎵弿锛屾敮鎸佸洖杞﹁嚜鍔ㄧ‘璁�" type="info" :closable="false" show-icon class="scan-alert">
+ <el-alert title="璇蜂娇鐢ㄦ壂鐮佹灙鎵弿/鎵嬪姩杈撳叆鎵樼洏鐮侊紝鍥炶溅瑙﹀彂鏌ヨ" type="info" :closable="false" show-icon class="scan-alert">
<template #default>
- <span>1. 璇峰厛鎵弿鎵樼洏鐮� 鈫� 2. 鍐嶆壂鎻忕墿鏂欐潯鐮�</span>
+ <div>
+ <div>1. 杈撳叆/鎵弿鎵樼洏鐮� 鈫� 2. 鍥炶溅瑙﹀彂绯荤粺鑾峰彇璁㈠崟鍙峰苟鍔犺浇鏁版嵁</div>
+ <div style="margin-top: 8px; font-size: 13px; color: #666;">
+ <i class="el-icon-info" style="color: #409EFF;"></i>
+ 鏀寔鎵墭鐩樼爜鏁寸鍑哄簱锛氭壂鎻忔墭鐩樼爜鍚庡彲鐩存帴杩涜鏁寸鐗╂枡鎷ｉ�夛紝鏃犻渶鍐嶆壂鎻忕墿鏂欐爣绛剧爜銆�
+ </div>
+ </div>
</template>
</el-alert>
@@ -29,8 +38,9 @@
<el-row :gutter="20">
<el-col :span="8">
<el-form-item label="鎵樼洏鐮�" prop="palletCode">
- <el-input ref="palletInput" v-model="scanForm.palletCode" placeholder="璇锋壂鎻忔墭鐩樼爜"
- size="large" clearable @keyup.enter="handlePalletScan">
+ <!-- 銆愭牳蹇冭皟鏁淬�戜粎淇濈暀鍥炶溅瑙﹀彂锛屾棤浠讳綍棰濆浜嬩欢锛屾仮澶嶅師鏈夋牱寮� -->
+ <el-input ref="palletInput" v-model="scanForm.palletCode" placeholder="璇锋壂鎻�/杈撳叆鎵樼洏鐮�" size="large"
+ clearable @keyup.enter="handlePalletScan">
<template #prefix>
<i class="el-icon-box"></i>
</template>
@@ -71,6 +81,41 @@
</el-col>
</el-row>
</el-form>
+
+ <!-- 鍒嗘嫞缁熻淇℃伅 -->
+ <div class="picking-stats" v-if="scanForm.palletCode && unpickedData.length > 0">
+ <el-divider content-position="left">
+ <span style="color: #409EFF; font-size: 14px;">
+ <i class="el-icon-data-analysis"></i> 鎵樼洏鍒嗘嫞缁熻
+ </span>
+ </el-divider>
+ <div class="stats-container">
+ <div class="stat-item">
+ <el-tag type="primary" size="medium" effect="dark">
+ <i class="el-icon-s-order"></i>
+ 鍒嗘嫞鎬绘暟锛�<b>{{ calculateTotalAssignQuantity() }}</b>
+ </el-tag>
+ </div>
+ <div class="stat-item">
+ <el-tag type="success" size="medium" effect="dark">
+ <i class="el-icon-circle-check"></i>
+ 宸插垎鎷ｏ細<b>{{ calculateTotalSortedQuantity() }}</b>
+ </el-tag>
+ </div>
+ <div class="stat-item">
+ <el-tag type="warning" size="medium" effect="dark">
+ <i class="el-icon-time"></i>
+ 鏈垎鎷ｏ細<b>{{ calculateTotalUnsortedQuantity() }}</b>
+ </el-tag>
+ </div>
+ <div class="stat-item">
+ <el-tag :type="hasWholeOut() ? 'success' : 'warning'" size="medium" effect="dark">
+ <i class="el-icon-box"></i>
+ 鏄惁鏁村嚭锛歿{ hasWholeOut() ? '鏄�' : '鍚�' }}
+ </el-tag>
+ </div>
+ </div>
+ </div>
</div>
</el-card>
@@ -111,14 +156,6 @@
</el-table-column>
<el-table-column prop="unit" label="鍗曚綅" width="60" />
<el-table-column prop="locationCode" label="搴撲綅" />
- <!-- <el-table-column label="鎿嶄綔" width="80" align="center">
- <template #default="scope">
- <el-button type="text" size="small" @click="quickPick(scope.row)"
- :disabled="!scanForm.palletCode">
- 鎷ｉ��
- </el-button>
- </template>
- </el-table-column> -->
</el-table>
<div class="table-footer">
@@ -176,13 +213,6 @@
<el-table-column prop="createDate" label="鎷ｉ�夋椂闂�" width="160" />
<el-table-column prop="originalBarcode" label="鍘熺墿鏂欑爜" width="160" />
<el-table-column prop="newBarcode" label="鏂扮墿鏂欑爜" width="160" />
- <!-- <el-table-column label="鎿嶄綔" width="80" align="center">
- <template #default="scope">
- <el-button type="text" size="small" @click="undoPick(scope.row)">
- 鎾ら攢
- </el-button>
- </template>
- </el-table-column> -->
</el-table>
<div class="table-footer">
@@ -200,6 +230,8 @@
</el-row>
</div>
+ <print-view ref="printView" @parentcall="parentcall"></print-view>
+
<!-- 纭瀵硅瘽妗� -->
<el-dialog v-model="confirmDialogVisible" title="鎿嶄綔纭" width="400px" :before-close="handleDialogClose">
<div class="confirm-content">
@@ -214,11 +246,96 @@
</span>
</template>
</el-dialog>
+
+ <!-- 鏁村嚭纭瀵硅瘽妗� -->
+ <el-dialog v-model="wholeOutDialogVisible" title="鏁村嚭鎿嶄綔纭" width="500px" :before-close="handleWholeOutDialogClose"
+ custom-class="whole-out-dialog" style="margin-right: 0px;">
+ <div class="whole-out-content" v-if="wholeOutInfo">
+ <!-- 璀﹀憡鎻愮ず -->
+ <el-alert title="璇ユ墭鐩樺寘鍚渶瑕佹暣鍑虹殑鐗╂枡" type="warning" :closable="false" show-icon class="whole-out-alert">
+ <template #default>
+ <div>鏁村嚭鎿嶄綔灏嗕竴娆℃�ф嫞閫夎鐗╂枡鐨勬墍鏈夊簱瀛橈紝璇风‘璁や俊鎭棤璇悗鎵ц</div>
+ </template>
+ </el-alert>
+
+ <!-- 鎵樼洏淇℃伅 -->
+ <div class="info-section">
+ <h4 class="section-title">
+ <i class="el-icon-box"></i>
+ 鎵樼洏淇℃伅
+ </h4>
+ <div class="info-grid">
+ <div class="info-item">
+ <label>鎵樼洏鐮侊細</label>
+ <span class="info-value">{{ wholeOutInfo.palletCode }}</span>
+ </div>
+ <div class="info-item">
+ <label>搴撲綅锛�</label>
+ <span class="info-value">{{ wholeOutInfo.locationCode || '鏈寚瀹�' }}</span>
+ </div>
+ </div>
+ </div>
+
+ <!-- 鏁村嚭鐗╂枡璇︽儏 -->
+ <div class="info-section">
+ <h4 class="section-title">
+ <i class="el-icon-s-grid"></i>
+ 鏁村嚭鐗╂枡璇︽儏
+ </h4>
+ <div class="info-grid">
+ <div class="info-item">
+ <label>鐗╂枡缂栫爜锛�</label>
+ <span class="info-value">{{ wholeOutInfo.materielCode }}</span>
+ </div>
+ <div class="info-item">
+ <label>鐗╂枡鍚嶇О锛�</label>
+ <span class="info-value">{{ wholeOutInfo.materielName }}</span>
+ </div>
+ <div class="info-item">
+ <label>鎵规鍙凤細</label>
+ <span class="info-value">{{ wholeOutInfo.batchNo }}</span>
+ </div>
+ <div class="info-item">
+ <label>鏁村嚭鏁伴噺锛�</label>
+ <span class="info-value highlight">{{ wholeOutInfo.assignQuantity }} {{ wholeOutInfo.unit }}</span>
+ </div>
+ <div class="info-item">
+ <label>褰撳墠搴撳瓨锛�</label>
+ <span class="info-value">{{ wholeOutInfo.currentStock || wholeOutInfo.originalQuantity }} {{ wholeOutInfo.unit }}</span>
+ </div>
+ </div>
+ </div>
+
+ <!-- 鎿嶄綔鎻愮ず -->
+ <div class="operation-tip">
+ <i class="el-icon-info"></i>
+ <span>纭鎵ц鏁村嚭鎿嶄綔鍚楋紵姝ゆ搷浣滃皢涓�娆℃�ф嫞閫夎鐗╂枡鐨勬墍鏈夊簱瀛樸��</span>
+ </div>
+ </div>
+ <template #footer>
+ <span class="dialog-footer">
+ <el-button @click="wholeOutDialogVisible = false" size="medium">鍙栨秷</el-button>
+ <el-button type="warning" @click="executeWholeOut" :loading="executeLoading" size="medium">
+ <i class="el-icon-check"></i>
+ 纭鏁村嚭
+ </el-button>
+ </span>
+ </template>
+ </el-dialog>
</div>
</template>
<script>
+import printView from "@/extension/outbound/extend/printView.vue"
+import { stationManager, STATION_STORAGE_KEY } from "@/../src/uitils/stationManager";
+import { ElLoading } from 'element-plus'
+
+// 瀵煎叆闊抽鏂囦欢锛堥�傞厤src/assets鐩綍锛寃ebpack鑷姩澶勭悊锛�
+const successAudioSrc = require('@/assets/audio/success.mp3');
+const errorAudioSrc = require('@/assets/audio/error.mp3');
+
export default {
+ components: { printView },
name: 'OutPicking',
data() {
return {
@@ -230,7 +347,7 @@
},
scanRules: {
palletCode: [
- { required: true, message: '璇锋壂鎻忔墭鐩樼爜', trigger: 'blur' }
+ { required: true, message: '璇锋壂鎻�/杈撳叆鎵樼洏鐮�', trigger: 'blur' }
],
materialBarcode: [
{ required: true, message: '璇锋壂鎻忕墿鏂欐潯鐮�', trigger: 'blur' }
@@ -248,7 +365,16 @@
confirmDialogVisible: false,
confirmMessage: '',
currentAction: null,
- executeLoading: false
+ executeLoading: false,
+ matMixed: true,
+ wholeOutDialogVisible: false,
+ wholeOutInfo: null,
+ globalLoading: false,
+ loadingInstance: null,
+ // 闊抽瀹炰緥锛堢紦瀛橈紝閬垮厤閲嶅鍒涘缓锛�
+ successAudio: null,
+ errorAudio: null,
+ selectedPalletCode: ''
}
},
computed: {
@@ -258,351 +384,618 @@
},
mounted() {
this.initPage()
+ // 鍒濆鍖栭煶棰戝疄渚嬶紙鎳掑姞杞斤紝浠呭垱寤轰竴娆★級
+ this.initAudioInstance()
+ },
+ beforeDestroy() {
+ // 閿�姣侀煶棰戝疄渚嬶紝閲婃斁璧勬簮
+ this.successAudio = null
+ this.errorAudio = null
+ // 銆愬凡娓呯悊銆戠Щ闄ゅ嵆鏃惰Е鍙戠浉鍏崇殑闃叉姈瀹氭椂鍣ㄦ竻闄や唬鐮�
},
methods: {
+ // 鍒濆鍖栭煶棰戝疄渚嬶紙鏍稿績锛氶�傞厤src/assets璺緞锛岀紦瀛樺疄渚嬶級
+ initAudioInstance() {
+ // 鎴愬姛闊抽瀹炰緥
+ if (!this.successAudio) {
+ this.successAudio = new Audio(successAudioSrc)
+ this.successAudio.onerror = (err) => {
+ console.error('銆愭垚鍔熼煶棰戙�戝姞杞藉け璐�', err)
+ }
+ }
+ if (!this.errorAudio) {
+ this.errorAudio = new Audio(errorAudioSrc)
+ this.errorAudio.onerror = (err) => {
+ console.error('銆愰敊璇煶棰戙�戝姞杞藉け璐�', err)
+ }
+ }
+ },
+ // 鎾斁鎴愬姛闊抽
+ playSuccessAudio() {
+ try {
+ // 閲嶇疆鎾斁杩涘害锛堥伩鍏嶉噸澶嶆挱鏀炬椂闊抽鏈粨鏉燂級
+ this.successAudio.currentTime = 0
+ // 鎾斁锛堝吋瀹规祻瑙堝櫒鑷姩鎾斁绛栫暐闄愬埗锛�
+ this.successAudio.play().catch((err) => {
+ console.warn('鎴愬姛闊抽鎾斁澶辫触锛堟祻瑙堝櫒鑷姩鎾斁绛栫暐闄愬埗锛�', err)
+ })
+ } catch (err) {
+ console.error('鎾斁鎴愬姛闊抽寮傚父', err)
+ }
+ },
+ playErrorAudio() {
+ try {
+ this.errorAudio.currentTime = 0
+ this.errorAudio.play().catch((err) => {
+ console.warn('閿欒闊抽鎾斁澶辫触锛堟祻瑙堝櫒鑷姩鎾斁绛栫暐闄愬埗锛�', err)
+ })
+ } catch (err) {
+ console.error('鎾斁閿欒闊抽寮傚父', err)
+ }
+ },
initPage() {
// 浠庤矾鐢卞弬鏁拌幏鍙栬鍗曞彿
- this.orderNo = this.$route.query.orderNo || ''
- if (!this.orderNo) {
- this.$message.error('璁㈠崟鍙蜂笉鑳戒负绌�')
- this.$router.back()
- return
+ this.orderNo = this.$route.query.orderNo || '';
+
+ // 鏀寔閫氳繃鎵樼洏鍙疯幏鍙栬鍗曞彿锛屼笉寮哄埗杩斿洖涓婁竴椤�
+ if (this.orderNo) {
+ this.loadOrderInfo();
+ } else {
+ this.$message.info('璇锋壂鎻�/杈撳叆鎵樼洏鐮佽幏鍙栧叧鑱旇鍗�');
}
+
// 鑷姩鑱氱劍鍒版墭鐩樼爜杈撳叆妗�
this.$nextTick(() => {
if (this.$refs.palletInput) {
- this.$refs.palletInput.focus()
+ this.$refs.palletInput.focus();
}
- })
+ });
},
-
- loadPalletData() {
- if (!this.scanForm.palletCode) {
- this.unpickedData = []
- return
- }
-
+ async loadOrderInfo() {
+ if (!this.orderNo) return;
+
try {
- this.loadUnpickedData();
- this.loadPickedData();
-
+ this.showFullScreenLoading();
+ const response = await this.http.get(`/api/Outbound/GetOrderInfo?orderNo=${this.orderNo}`);
+ if (response.status) {
+ this.orderInfo = response.data;
+ } else {
+ this.$message.error(response.message || '鑾峰彇璁㈠崟淇℃伅澶辫触');
+ }
} catch (error) {
- console.error('鍔犺浇鎵樼洏鏁版嵁澶辫触:', error)
- this.unpickedData = []
+ this.$message.error(`鑾峰彇璁㈠崟淇℃伅寮傚父锛�${error.message || '缃戠粶閿欒'}`);
+ console.error('銆愬姞杞借鍗曚俊鎭け璐ャ��', error);
+ } finally {
+ this.hideFullScreenLoading();
}
},
- loadUnpickedData() {
+ async loadPalletData() {
+ if (!this.scanForm.palletCode || !this.orderNo) {
+ this.unpickedData = [];
+ return;
+ }
+
try {
+ this.showFullScreenLoading();
+ await Promise.all([
+ this.loadUnpickedData(),
+ this.loadPickedData()
+ ]);
+ } catch (error) {
+ this.unpickedData = [];
+ console.error('銆愬姞杞芥墭鐩樻暟鎹け璐ャ��', error);
+ } finally {
+ this.hideFullScreenLoading();
+ }
+ },
+ // 鏍稿績閫昏緫锛氳嚜鍔ㄦ彁鍙朇K璁㈠崟鍙峰苟璧嬪�硷紝闅愯棌鎸囧畾鎻愮ず
+ loadUnpickedData() {
+ return new Promise((resolve, reject) => {
+ // 鍏堟竻绌轰箣鍓嶇殑鎻愮ず锛岄伩鍏嶉噸澶嶆彁绀�
+ this.$message.closeAll();
+
this.http.post(`/api/Outbound/QueryPickingTasks?orderNo=${this.orderNo}&palletCode=${this.scanForm.palletCode}`, {}).then(response => {
if (response.status) {
- if (response.data.length > 0) {
- this.unpickedData = response.data
- this.calculateUnpickedStats()
-
- // 鑷姩鑱氱劍鍒扮墿鏂欐潯鐮佽緭鍏ユ
+ if (response.data.outStockLockInfos && response.data.outStockLockInfos.length > 0) {
+ this.unpickedData = response.data.outStockLockInfos;
+ this.matMixed = response.data.isMatMixed;
+ this.orderOver = response.data.orderOver;
+ this.calculateUnpickedStats();
+
+ this.$nextTick(() => {
+ if (this.hasWholeOut()) {
+ this.showWholeOutConfirm();
+ }
+ });
+
this.$nextTick(() => {
if (this.$refs.materialInput) {
- this.$refs.materialInput.focus()
+ this.$refs.materialInput.focus();
}
- })
+ });
} else {
- this.$message.warning('璇ユ墭鐩樻棤鏈嫞閫変换鍔�')
- this.unpickedData = []
+ this.unpickedData = [];
+ this.calculateUnpickedStats();
+
+ this.$message.success({
+ message: `鎵樼洏銆�${this.scanForm.palletCode}銆戝凡鎷ｉ�夊畬鎴愶紝鏆傛棤鎷ｉ�夎褰昤,
+ duration: 3000,
+ showClose: true
+ });
+
+ this.$nextTick(() => {
+ if (this.$refs.palletInput) {
+ this.$refs.palletInput.focus();
+ this.$refs.palletInput.$el.querySelector('input').select();
+ }
+ // 琛ㄦ牸楂樹寒閫変腑褰撳墠鎵樼洏
+ if (this.$refs.unpickedTable) {
+ const targetRow = this.unpickedData.find(item => item.palletCode === this.scanForm.palletCode);
+ if (targetRow) this.$refs.unpickedTable.setCurrentRow(targetRow);
+ }
+ });
+
+ this.scanForm.materialBarcode = '';
+ this.$nextTick(() => {
+ if (this.$refs.palletInput) {
+ this.$refs.palletInput.focus();
+ }
+ });
}
+ resolve();
} else {
- this.$message.error(response.message || '鑾峰彇鎵樼洏鏁版嵁澶辫触')
- this.unpickedData = []
+ const errorMsg = response.message || `鑾峰彇鎵樼洏銆�${this.scanForm.palletCode}銆戞嫞閫夋暟鎹け璐;
+ const targetOrderNo = this.extractCKOrderNo(errorMsg);
+
+ if (targetOrderNo) {
+ // 鑷姩璧嬪�硷紝涓嶆樉绀洪敊璇彁绀猴紝闂幆娴佺▼
+ this.orderNo = targetOrderNo;
+ this.$forceUpdate();
+ this.loadOrderInfo().then(() => {
+ this.loadPalletData();
+ });
+ resolve("鑷姩璧嬪�兼柊璁㈠崟鍙凤紝閲嶆柊璇锋眰鏁版嵁");
+ } else {
+ this.$message.error({
+ message: errorMsg,
+ duration: 5000,
+ showClose: true
+ });
+
+ this.scanForm.palletCode = '';
+ this.$nextTick(() => {
+ if (this.$refs.palletInput) {
+ this.$refs.palletInput.focus();
+ }
+ });
+ reject(errorMsg);
+ }
+
+ this.unpickedData = [];
+ this.calculateUnpickedStats();
}
- }
- )
-
- } catch (error) {
- console.error('鍔犺浇鏈嫞閫夋暟鎹け璐�:', error)
- }
+ }).catch(error => {
+ this.unpickedData = [];
+ this.calculateUnpickedStats();
+
+ this.$message.error({
+ message: `鑾峰彇鎵樼洏銆�${this.scanForm.palletCode}銆戞嫞閫夋暟鎹紓甯革細${error.message || '缃戠粶閿欒锛岃閲嶈瘯'}`,
+ duration: 5000,
+ showClose: true
+ });
+ console.error("銆怮ueryPickingTasks 缃戠粶寮傚父銆�", error);
+ reject(error);
+ })
+ })
},
-
loadPickedData() {
- try {
+ return new Promise((resolve, reject) => {
this.http.post(`/api/Outbound/QueryPickedList?orderNo=${this.orderNo}&palletCode=${this.scanForm.palletCode}`, {}).then(response => {
if (response.status) {
if (response.data.length > 0) {
- this.pickedData = response.data
- this.calculatePickedStats()
+ this.pickedData = response.data;
+ this.calculatePickedStats();
} else {
- this.pickedData = []
+ this.pickedData = [];
}
+ resolve();
} else {
- this.$message.error(response.message || '鑾峰彇鎵樼洏鏁版嵁澶辫触')
- this.pickedData = []
+ const errorMsg = response.message || '鑾峰彇鎵樼洏宸叉嫞閫夋暟鎹け璐�';
+ const targetOrderNo = this.extractCKOrderNo(errorMsg);
+
+ if (targetOrderNo) {
+ this.orderNo = targetOrderNo;
+ this.$forceUpdate();
+ resolve("鑷姩璧嬪�兼柊璁㈠崟鍙�");
+ } else {
+ reject(errorMsg);
+ }
+ this.pickedData = [];
}
- }
- )
-
- } catch (error) {
- console.error('鍔犺浇宸叉嫞閫夋暟鎹け璐�:', error)
- }
+ }).catch(error => {
+ console.error("銆怮ueryPickedList 缃戠粶寮傚父銆�", error);
+ reject(error);
+ })
+ })
},
-
// 璁＄畻鏈嫞閫�
calculateUnpickedStats() {
- // 鏈嫞閫夋潯鐩暟閲�
- this.unpickedCount = this.unpickedData.length
-
- // 璁＄畻鏈嫞閫夌殑鎬绘暟閲忥紙鍒嗘嫞鏁伴噺 - 宸插垎鎷ｆ暟閲忥級
+ this.unpickedCount = this.unpickedData.length;
this.unpickedQuantity = this.unpickedData.reduce((sum, item) => {
- const assignQty = item.assignQuantity || 0
- const sortedQty = item.sortedQuantity || 0
- const remainingQty = Math.max(0, assignQty - sortedQty)
- return sum + remainingQty
- }, 0)
-
- // 鎬绘潯鐩暟锛堜笌鏉＄洰鏁伴噺鐩稿悓锛岃繖閲屼繚鐣欏彉閲忎竴鑷存�э級
- this.unpickedTotal = this.unpickedCount
+ const assignQty = item.assignQuantity || 0;
+ const sortedQty = item.sortedQuantity || 0;
+ const remainingQty = Math.max(0, assignQty - sortedQty);
+ return sum + remainingQty;
+ }, 0);
+ this.unpickedTotal = this.unpickedCount;
},
-
// 璁＄畻宸叉嫞閫�
calculatePickedStats() {
- // 宸叉嫞閫夋潯鐩暟閲�
- this.pickedCount = this.pickedData.length
-
- // 璁＄畻宸叉嫞閫夌殑鎬绘暟閲�
+ this.pickedCount = this.pickedData.length;
this.pickedQuantity = 0 - this.pickedData.reduce((sum, item) => {
- return (sum + item.changeQuantity)
- }, 0)
-
- // 鎬绘潯鐩暟锛堜笌鏉＄洰鏁伴噺鐩稿悓锛�
- this.pickedTotal = this.pickedCount
+ return (sum + item.changeQuantity);
+ }, 0);
+ this.pickedTotal = this.pickedCount;
},
+ // 宸ュ叿鏂规硶 - 鎻愬彇CK寮�澶磋鍗曞彿
+ extractCKOrderNo(message) {
+ if (!message) return null;
+ const ckOrderReg = /CK\d+/g;
+ const matchResult = message.match(ckOrderReg);
+ return matchResult && matchResult.length > 0 ? matchResult[0] : null;
+ },
+ // 鏍稿績锛氳皟鐢ㄨ幏鍙栬鍗曞彿鎺ュ彛锛堝畬鏁磋矾寰勶紝鍥炶溅瑙﹀彂锛�
+ async getOrderNoByPallet(palletCode) {
+ if (!palletCode) {
+ this.$message.warning('鎵樼洏鍙蜂笉鑳戒负绌�');
+ return null;
+ }
- handlePalletScan() {
- if (this.scanForm.palletCode) {
- // this.$message.success(`鎵樼洏鐮�: ${this.scanForm.palletCode}`)
- this.loadPalletData()
+ try {
+ this.showFullScreenLoading();
+ const response = await this.http.get(`/api/OutboundOrder/GetOrderNoByPalletCode?palletCode=${palletCode}`);
-
+ if (response.status && response.data) {
+ const validOrderNo = response.data;
+ this.playSuccessAudio();
+ this.$message.success(`鎴愬姛鑾峰彇璁㈠崟鍙凤細${validOrderNo}`);
+ return validOrderNo;
+ } else {
+ this.playErrorAudio();
+ const errorMsg = response.message || '璇ユ墭鐩樺彿鏈叧鑱斾换浣曡鍗�';
+ this.$message.error(errorMsg);
+ return null;
+ }
+ } catch (error) {
+ this.playErrorAudio();
+ const errorMsg = `鎺ュ彛璋冪敤寮傚父锛�${error.message || '缃戠粶閿欒/鎺ュ彛涓嶅瓨鍦�'}`;
+ this.$message.error(errorMsg);
+ console.error("銆愭帴鍙ｈ皟鐢ㄥけ璐ャ��", error);
+ return null;
+ } finally {
+ this.hideFullScreenLoading();
}
},
+ // 鍥炶溅瑙﹀彂鐨勬牳蹇冩柟娉曪紝鏃犲嵆鏃惰Е鍙戯紝閬垮厤棰戠箒璋冪敤鎺ュ彛
+ async handlePalletScan(flag = true) {
+ const palletCode = this.scanForm.palletCode.trim();
+ if (!palletCode) {
+ this.$message.warning('璇疯緭鍏ユ湁鏁堢殑鎵樼洏鍙�');
+ return;
+ }
+ // 璋冪敤璁㈠崟鍙锋帴鍙ｏ紝浠呭洖杞﹁Е鍙戜竴娆�
+ const orderNoFromApi = await this.getOrderNoByPallet(palletCode);
+
+ if (orderNoFromApi) {
+ this.orderNo = orderNoFromApi;
+ this.$forceUpdate();
+ }
+
+ if (this.orderNo) {
+ await this.loadOrderInfo();
+ this.loadPalletData(flag);
+ } else {
+ this.loadPalletData(flag);
+ }
+ },
handleMaterialScan() {
if (!this.scanForm.palletCode) {
- this.$message.warning('璇峰厛鎵弿鎵樼洏鐮�')
- this.$refs.palletInput.focus()
- return
+ this.$message.warning('璇峰厛鎵弿/杈撳叆鎵樼洏鐮�');
+ this.$refs.palletInput.focus();
+ return;
}
if (!this.scanForm.materialBarcode) {
- this.$message.warning('璇锋壂鎻忕墿鏂欐潯鐮�')
- return
+ this.$message.warning('璇锋壂鎻忕墿鏂欐潯鐮�');
+ return;
}
- // 鑷姩鎵ц纭鎷ｉ��
- this.handleConfirmPick()
+ this.handleConfirmPick();
},
-
- handleConfirmPick() {
+ async handleConfirmPick() {
if (!this.scanForm.palletCode || !this.scanForm.materialBarcode) {
- this.$message.warning('璇峰厛鎵弿鎵樼洏鐮佸拰鐗╂枡鏉＄爜')
- return
+ this.$message.warning('璇峰厛鎵弿鎵樼洏鐮佸拰鐗╂枡鏉＄爜');
+ return;
}
- this.confirmLoading = true
+ this.confirmLoading = true;
+ this.showFullScreenLoading();
try {
- this.http.post('/api/Outbound/CompleteOutboundWithBarcode', {
+ const response = await this.http.post('/api/Outbound/CompleteOutboundWithBarcode', {
orderNo: this.orderNo,
palletCode: this.scanForm.palletCode,
barcode: this.scanForm.materialBarcode,
operator: this.getUserName()
- }).then(response => {
- if (response.status) {
- this.$message.success('鎷ｉ�夌‘璁ゆ垚鍔�')
- this.resetMaterialBarcode()
- // this.loadUnpickedData()
- // this.loadPickedData()
- this.loadPalletData()
- } else {
- this.$message.error(response.message || '鎷ｉ�夌‘璁ゅけ璐�')
+ });
+ if (response.status) {
+ if (response.data.scannedDetail.isUnpacked && response.data.scannedDetail.materialCodes.length > 0) {
+ this.$refs.printView.open(response.data.scannedDetail.materialCodes);
}
- })
+ this.$message.success('鎷ｉ�夌‘璁ゆ垚鍔�');
+ this.playSuccessAudio();
+ this.resetMaterialBarcode();
+ await this.loadPalletData(false);
+ } else {
+ this.$message.error(response.message || '鎷ｉ�夌‘璁ゅけ璐�');
+ this.playErrorAudio();
+ }
} catch (error) {
- console.error('鎷ｉ�夌‘璁ゅけ璐�:', error)
- this.$message.error('鎷ｉ�夌‘璁ゅけ璐�')
+ this.$message.error('鎷ｉ�夌‘璁ゅけ璐�');
+ this.playErrorAudio();
} finally {
- this.confirmLoading = false
+ this.confirmLoading = false;
+ this.hideFullScreenLoading();
}
},
-
handleEmptyBox() {
if (!this.scanForm.palletCode) {
- this.$message.warning('璇峰厛鎵弿鎵樼洏鐮�')
- return
+ this.$message.warning('璇峰厛鎵弿/杈撳叆鎵樼洏鐮�');
+ return;
}
- this.confirmMessage = `纭畾瑕佸彇绌烘墭鐩� ${this.scanForm.palletCode} 鍚楋紵`
- this.currentAction = 'emptyBox'
- this.confirmDialogVisible = true
+ this.confirmMessage = `纭畾瑕佸彇绌烘墭鐩� ${this.scanForm.palletCode} 鍚楋紵`;
+ this.currentAction = 'emptyBox';
+ this.confirmDialogVisible = true;
},
-
handleReturnToWarehouse() {
if (!this.scanForm.palletCode) {
- this.$message.warning('璇峰厛鎵弿鎵樼洏鐮�')
- return
+ this.$message.warning('璇峰厛鎵弿/杈撳叆鎵樼洏鐮�');
+ return;
}
- this.confirmMessage = `纭畾瑕佸皢鎵樼洏 ${this.scanForm.palletCode} 鍥炲簱鍚楋紵`
- this.currentAction = 'returnToWarehouse'
- this.confirmDialogVisible = true
+ this.confirmMessage = `纭畾瑕佸皢鎵樼洏 ${this.scanForm.palletCode} 鍥炲簱鍚楋紵`;
+ this.currentAction = 'returnToWarehouse';
+ this.confirmDialogVisible = true;
},
-
- executeConfirm() {
- this.executeLoading = true
+ async executeConfirm() {
+ this.executeLoading = true;
+ this.showFullScreenLoading();
try {
- let apiUrl = ''
+ let apiUrl = '';
let params = {
orderNo: this.orderNo,
- palletCode: this.scanForm.palletCode
- }
-
+ palletCode: this.scanForm.palletCode,
+ station: stationManager.getStation()
+ };
if (this.currentAction === 'emptyBox') {
- apiUrl = '/api/Outbound/EmptyBox'
+ apiUrl = '/api/Outbound/EmptyBox';
} else if (this.currentAction === 'returnToWarehouse') {
- apiUrl = '/api/Outbound/ReturnToWarehouse'
+ apiUrl = '/api/Outbound/ReturnToWarehouse';
}
- this.http.post(apiUrl, params).then(response => {
+ const response = await this.http.post(apiUrl, params);
- if (response.status) {
- this.$message.success('鎿嶄綔鎴愬姛')
- this.confirmDialogVisible = false
- this.resetForm()
- // this.loadUnpickedData()
- // this.loadPickedData()
- } else {
- this.$message.error(response.message || '鎿嶄綔澶辫触')
- }
- })
+ if (response.status) {
+ this.$message.success('鎿嶄綔鎴愬姛');
+ this.confirmDialogVisible = false;
+ this.resetForm();
+ } else {
+ this.$message.error(response.message || '鎿嶄綔澶辫触');
+ }
} catch (error) {
- console.error('鎿嶄綔澶辫触:', error)
- this.$message.error('鎿嶄綔澶辫触')
+ this.$message.error('鎿嶄綔澶辫触');
} finally {
- this.executeLoading = false
+ this.executeLoading = false;
+ this.hideFullScreenLoading();
}
},
-
handleDialogClose() {
if (!this.executeLoading) {
- this.confirmDialogVisible = false
+ this.confirmDialogVisible = false;
}
},
-
- quickPick(row) {
- this.scanForm.materialBarcode = row.materielCode
- this.handleConfirmPick()
+ showWholeOutConfirm() {
+ const wholeOutItem = this.unpickedData.find(item => item.assignQuantity === item.originalQuantity);
+ if (wholeOutItem) {
+ this.wholeOutInfo = {
+ palletCode: this.scanForm.palletCode,
+ locationCode: wholeOutItem.locationCode,
+ materielCode: wholeOutItem.materielCode,
+ materielName: wholeOutItem.materielName,
+ batchNo: wholeOutItem.batchNo,
+ assignQuantity: wholeOutItem.assignQuantity,
+ currentStock: wholeOutItem.currentStock,
+ originalQuantity: wholeOutItem.originalQuantity,
+ unit: wholeOutItem.unit
+ };
+ this.wholeOutDialogVisible = true;
+ }
},
+ handleWholeOutDialogClose() {
+ if (!this.executeLoading) {
+ this.wholeOutDialogVisible = false;
+ this.wholeOutInfo = null;
+ }
+ },
+ async executeWholeOut() {
+ if (!this.wholeOutInfo) {
+ this.$message.error('鏁村嚭淇℃伅鏃犳晥');
+ return;
+ }
+ this.executeLoading = true;
+ this.showFullScreenLoading();
+
+ try {
+ const response = await this.http.post('/api/Outbound/CompleteOutboundWithPallet', {
+ orderNo: this.orderNo,
+ palletCode: this.scanForm.palletCode,
+ operator: this.getUserName()
+ });
+ if (response.status) {
+ this.$message.success('鏁村嚭鎿嶄綔鎴愬姛');
+ this.wholeOutDialogVisible = false;
+ this.wholeOutInfo = null;
+ await this.loadPalletData();
+ } else {
+ this.$message.error(response.message || '鏁村嚭鎿嶄綔澶辫触');
+ }
+ } catch (error) {
+ this.$message.error('鏁村嚭鎿嶄綔澶辫触');
+ } finally {
+ this.executeLoading = false;
+ this.hideFullScreenLoading();
+ }
+ },
+ quickPick(row) {
+ this.scanForm.materialBarcode = row.materielCode;
+ this.handleConfirmPick();
+ },
undoPick(row) {
try {
this.$confirm('纭畾瑕佹挙閿�杩欐潯鎷ｉ�夎褰曞悧锛�', '鎻愮ず', {
type: 'warning'
- })
-
- const response = this.http.post('/api/Outbound/UndoPicking', {
- id: row.id
- }).then(response => {
- if (response.status) {
- this.$message.success('鎾ら攢鎴愬姛')
- this.loadUnpickedData()
- this.loadPickedData()
- } else {
- this.$message.error(response.message || '鎾ら攢澶辫触')
- }
- })
+ }).then(() => {
+ this.http.post('/api/Outbound/UndoPicking', {
+ id: row.id
+ }).then(response => {
+ if (response.status) {
+ this.$message.success('鎾ら攢鎴愬姛');
+ this.loadUnpickedData();
+ this.loadPickedData();
+ } else {
+ this.$message.error(response.message || '鎾ら攢澶辫触');
+ }
+ });
+ }).catch(() => {});
} catch (error) {
if (error !== 'cancel') {
- console.error('鎾ら攢澶辫触:', error)
- this.$message.error('鎾ら攢澶辫触')
+ this.$message.error('鎾ら攢澶辫触');
}
}
},
-
- // handleUnpickedRowClick(row) {
- // // 鐐瑰嚮鏈嫞閫夎鏃惰嚜鍔ㄥ～鍏呯墿鏂欐潯鐮�
- // this.scanForm.materialBarcode = row.materielCode
- // },
-
refreshUnpickedTable() {
if (this.scanForm.palletCode) {
- this.loadPalletData()
+ this.loadPalletData();
}
},
-
refreshPickedTable() {
- this.loadPickedData()
+ this.loadPickedData().catch(error => {
+ console.error('鍒锋柊宸叉嫞閫夊垪琛ㄥけ璐�:', error);
+ });
},
-
resetMaterialBarcode() {
- this.scanForm.materialBarcode = ''
+ this.scanForm.materialBarcode = '';
this.$nextTick(() => {
if (this.$refs.materialInput) {
- this.$refs.materialInput.focus()
+ this.$refs.materialInput.focus();
}
- })
+ });
},
-
resetForm() {
- this.scanForm.palletCode = ''
- this.scanForm.materialBarcode = ''
- this.unpickedData = []
+ this.scanForm.palletCode = '';
+ this.scanForm.materialBarcode = '';
+ this.unpickedData = [];
this.$nextTick(() => {
if (this.$refs.palletInput) {
- this.$refs.palletInput.focus()
+ this.$refs.palletInput.focus();
}
- })
+ });
},
-
getUserName() {
- // 灏濊瘯浠� Vuex store 鑾峰彇鐢ㄦ埛鍚�
if (this.$store && this.$store.state && this.$store.state.userInfo) {
- return this.$store.state.userInfo.userName || this.$store.state.userInfo.username || '鏈櫥褰曠敤鎴�'
+ return this.$store.state.userInfo.userName || this.$store.state.userInfo.username || '鏈櫥褰曠敤鎴�';
}
- // 灏濊瘯浠� localStorage 鑾峰彇
try {
- const userInfo = localStorage.getItem('user')
+ const userInfo = localStorage.getItem('user');
if (userInfo) {
- const user = JSON.parse(userInfo)
- return user.userName || user.username || '鏈櫥褰曠敤鎴�'
+ const user = JSON.parse(userInfo);
+ return user.userName || user.username || '鏈櫥褰曠敤鎴�';
}
- } catch (error) {
- console.error('鑾峰彇鐢ㄦ埛淇℃伅澶辫触:', error)
- }
+ } catch (error) {}
- return '鏈櫥褰曠敤鎴�'
+ return '鏈櫥褰曠敤鎴�';
},
-
+ calculateTotalAssignQuantity() {
+ return this.unpickedData.reduce((sum, item) => {
+ return sum + (item.assignQuantity || 0);
+ }, 0);
+ },
+ calculateTotalSortedQuantity() {
+ return this.unpickedData.reduce((sum, item) => {
+ return sum + (item.sortedQuantity || 0);
+ }, 0);
+ },
+ calculateTotalUnsortedQuantity() {
+ return this.unpickedData.reduce((sum, item) => {
+ const assignQty = item.assignQuantity || 0;
+ const sortedQty = item.sortedQuantity || 0;
+ return sum + Math.max(0, assignQty - sortedQty);
+ }, 0);
+ },
+ hasWholeOut() {
+ return this.unpickedData.some(item => item.assignQuantity === item.originalQuantity) && !this.matMixed && !this.orderOver;
+ },
getStatusType(status) {
const statusMap = {
- 0: 'info', // 寰呭鐞�
- 10: 'warning', // 杩涜涓�
- 20: 'primary', // 鎷ｉ�変腑
- 30: 'success', // 宸插畬鎴�
- 40: 'danger' // 寮傚父
+ 0: 'info',
+ 1: 'warning',
+ 20: 'primary',
+ 30: 'success',
+ 40: 'danger'
+ };
+ return statusMap[status] || 'info';
+ },
+ showFullScreenLoading() {
+ if (this.loadingInstance) {
+ this.loadingInstance.close();
}
- return statusMap[status] || 'info'
+ this.loadingInstance = ElLoading.service({
+ lock: true,
+ text: '澶勭悊涓�...',
+ background: 'rgba(0, 0, 0, 0.7)',
+ customClass: 'custom-full-loading'
+ });
+ },
+ hideFullScreenLoading() {
+ if (this.loadingInstance) {
+ this.loadingInstance.close();
+ this.loadingInstance = null;
+ }
}
}
}
</script>
+
+<style>
+.el-dialog__header {
+ margin: 0;
+}
+</style>
<style scoped>
.picking-container {
padding: 20px;
background-color: #f5f5f5;
min-height: 100vh;
+ position: relative;
+ overflow: hidden;
}
-/* 璁㈠崟淇℃伅鍗＄墖 */
.order-info-card {
margin-bottom: 20px;
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
@@ -613,6 +1006,8 @@
display: flex;
justify-content: space-between;
align-items: center;
+ flex-direction: column;
+ align-items: flex-start;
}
.order-title {
@@ -638,7 +1033,6 @@
letter-spacing: 1px;
}
-/* 鎵爜鍖哄煙 */
.scan-section-card {
margin-bottom: 20px;
}
@@ -678,7 +1072,6 @@
margin: 0;
}
-/* 琛ㄦ牸鍖哄煙 */
.tables-section {
margin-top: 20px;
}
@@ -717,7 +1110,6 @@
border-top: 1px solid #ebeef5;
}
-/* 琛ㄦ牸琛屾牱寮� */
.el-table tbody tr:hover>td {
background-color: #f0f9ff !important;
}
@@ -726,7 +1118,6 @@
background-color: #e1f3ff !important;
}
-/* 瀵硅瘽妗嗘牱寮� */
.confirm-content {
padding: 20px 0;
text-align: center;
@@ -741,14 +1132,12 @@
text-align: center;
}
-/* 鍝嶅簲寮忚璁� */
@media (max-width: 1200px) {
.action-buttons .el-button {
font-size: 14px;
}
}
-/* Element UI 缁勪欢鏍峰紡瑕嗙洊 */
::v-deep .el-card__header {
padding: 18px 20px;
border-bottom: 1px solid #ebeef5;
@@ -773,7 +1162,6 @@
border: none;
}
-/* 鍥炬爣鏍峰紡 */
.el-icon-document,
.el-icon-box,
.el-icon-s-grid,
@@ -785,7 +1173,6 @@
font-size: 18px;
}
-/* 鎻忚堪鍒楄〃鏍峰紡 */
::v-deep .el-descriptions__label {
font-weight: bold;
color: #909399;
@@ -794,4 +1181,125 @@
::v-deep .el-descriptions__content {
color: #606266;
}
+
+::v-deep .el-table th {
+ background-color: #fafafa;
+ font-weight: 600;
+ color: #303133;
+}
+
+::v-deep .el-table .el-text {
+ font-weight: 500;
+}
+
+::v-deep .el-tag--small {
+ font-weight: 500;
+}
+
+.scan-alert ::v-deep .el-alert__content {
+ width: 100%;
+}
+
+.scan-alert ::v-deep .el-alert__description {
+ margin-top: 8px;
+}
+
+.picking-stats {
+ margin-top: 20px;
+ padding: 0 10px;
+}
+
+.stats-container {
+ display: flex;
+ flex-wrap: wrap;
+ gap: 12px;
+ align-items: center;
+}
+
+.stat-item {
+ display: inline-flex;
+ align-items: center;
+}
+
+.stat-item .el-tag {
+ display: flex;
+ align-items: center;
+ padding: 6px 12px;
+ font-size: 13px;
+ border-radius: 20px;
+}
+
+.stat-item .el-tag i {
+ margin-right: 6px;
+ font-size: 14px;
+}
+
+.stat-item b {
+ margin-left: 4px;
+ font-size: 14px;
+}
+
+::v-deep .el-divider__text {
+ background-color: #f5f5f5;
+ padding: 0 20px;
+}
+
+::v-deep .custom-loading {
+ background-color: rgba(0, 0, 0, 0.7) !important;
+ z-index: 9999 !important;
+}
+
+::v-deep .custom-loading .el-loading-mask {
+ background-color: rgba(0, 0, 0, 0.7) !important;
+}
+
+::v-deep .custom-loading .el-loading-spinner {
+ z-index: 10000 !important;
+}
+
+::v-deep .custom-loading .el-loading-text {
+ color: #ffffff !important;
+ font-weight: bold !important;
+ font-size: 16px !important;
+}
+
+::v-deep .el-loading-mask {
+ background-color: rgba(0, 0, 0, 0.7) !important;
+ z-index: 9999 !important;
+}
+
+::v-deep .el-loading-spinner {
+ z-index: 10000 !important;
+}
+
+::v-deep .el-loading-text {
+ color: #ffffff !important;
+ font-weight: bold !important;
+}
+
+::v-deep .custom-full-loading {
+ z-index: 999999 !important;
+}
+
+::v-deep .custom-full-loading .el-loading-mask {
+ z-index: 999999 !important;
+}
+
+::v-deep .custom-full-loading .el-loading-spinner {
+ z-index: 1000000 !important;
+}
+
+::v-deep .custom-full-loading .el-loading-text {
+ color: #ffffff !important;
+ font-weight: bold !important;
+ font-size: 18px !important;
+}
+
+::v-deep .el-dialog {
+ z-index: 2000 !important;
+}
+
+::v-deep .el-dialog__wrapper {
+ z-index: 2000 !important;
+}
</style>
\ No newline at end of file
--
Gitblit v1.9.3