From 891207469b41c23d22805876a4e179d75832572f Mon Sep 17 00:00:00 2001
From: leiqunqing <zhengqifeng@hnkhzn.com>
Date: 星期四, 05 三月 2026 11:03:52 +0800
Subject: [PATCH] 完整项目更新
---
代码管理/WIDESEAWCS_Client/src/views/Home.vue | 198 +++++++++++++++++++++++++++++++++++++++++++++----
1 files changed, 180 insertions(+), 18 deletions(-)
diff --git "a/\344\273\243\347\240\201\347\256\241\347\220\206/WIDESEAWCS_Client/src/views/Home.vue" "b/\344\273\243\347\240\201\347\256\241\347\220\206/WIDESEAWCS_Client/src/views/Home.vue"
index 9a69c91..6a085b0 100644
--- "a/\344\273\243\347\240\201\347\256\241\347\220\206/WIDESEAWCS_Client/src/views/Home.vue"
+++ "b/\344\273\243\347\240\201\347\256\241\347\220\206/WIDESEAWCS_Client/src/views/Home.vue"
@@ -34,6 +34,14 @@
v-model="leftPartCodes[index]"
disabled
/>
+ <!-- 鏂板锛氫緵鏂逛唬鐮佽緭鍏ユ -->
+ <input
+ type="text"
+ class="input-box supplier-code-input"
+ v-model="leftPartSupplierCodes[index]"
+ disabled
+ placeholder="渚涙柟浠g爜"
+ />
<label class="checkbox-container">
<input
type="checkbox"
@@ -57,7 +65,14 @@
<div class="right-top">
<div class="form-row input-submit-row">
<span class="label">褰曞叆妗嗭細</span>
- <input type="text" class="input-box" v-model="rightTopInput" />
+ <!-- 鍏抽敭淇敼1锛氭坊鍔爎ef鏍囪瘑 -->
+ <input
+ ref="inputBoxRef"
+ type="text"
+ class="input-box"
+ v-model="rightTopInput"
+ @blur="handleInputBlur"
+ />
<button class="btn save-btn submit-input-btn" @click="saveData">
<i class="icon icon-submit"></i>鎻愪氦
</button>
@@ -76,6 +91,14 @@
/>
<button class="btn clear-btn" @click="clearFinishedProductCode">
<i class="icon icon-clear"></i>娓呴櫎
+ </button>
+ <!-- 鏂板锛氬垹闄ゅ綋鍓嶆墭鐩樻寜閽� -->
+ <button
+ class="btn delete-tray-btn"
+ @click="deleteCurrentTray"
+ :disabled="deleteLoading"
+ >
+ <i class="icon icon-delete"></i>鍒犻櫎褰撳墠鎵樼洏
</button>
</div>
<div
@@ -101,7 +124,7 @@
</template>
<script>
-import { ref, onMounted, onUnmounted, watch, computed } from "vue";
+import { ref, onMounted, onUnmounted, watch, computed, nextTick } from "vue";
import axios from "axios";
export default {
@@ -111,12 +134,19 @@
const finishedProductId = ref(""); // 宸︿晶鎴愬搧ID锛堟帴鍙h繑鍥烇級
const rightTopInput = ref(""); // 鍙充晶鏍稿績褰曞叆妗�
const leftPartCodes = ref(Array(10).fill("")); // 宸︿晶闆朵欢缂栧彿鏁扮粍
+ // 鏂板锛氬乏渚т緵鏂逛唬鐮佹暟缁�
+ const leftPartSupplierCodes = ref(Array(10).fill(""));
const rightPartCodes = ref(Array(10).fill("")); // 鍙充晶闆朵欢缂栧彿鏁扮粍
const leftPartChecked = ref(Array(10).fill(false)); // 宸︿晶闆朵欢鍕鹃�夌姸鎬�
const leftPartIds = ref(Array(10).fill("")); // 宸︿晶闆朵欢ID锛堟帴鍙h繑鍥烇級
const finishedProductCode = ref(""); // 鍙充晶鎴愬搧缂栧彿杈撳叆妗�
const fillIndex = ref(-1); // 褰曞叆妗嗚嚜鍔ㄥ~鍏呯储寮�
const checkLoading = ref(Array(10).fill(false)); // 闆朵欢鍕鹃�夊姞杞介攣
+ // 鏂板锛氬垹闄ゆ墭鐩樺姞杞界姸鎬�
+ const deleteLoading = ref(false);
+
+ // 鍏抽敭淇敼2锛氬畾涔夊綍鍏ユref
+ const inputBoxRef = ref(null);
// 淇″彿鐏浉鍏�
const signalStates = ref([false, false, false, false, false]);
@@ -136,6 +166,17 @@
const destroyDelayTime = 500; // 褰曞叆妗嗗~鍏呭欢杩�500ms
let autoSubmitDebounceTimer = null;
let submitLock = ref(false); // 鎻愪氦閿侊紝闃叉閲嶅鎻愪氦
+
+ // 鍏抽敭淇敼3锛氬皝瑁呰仛鐒︽柟娉�
+ const focusInputBox = () => {
+ nextTick(() => {
+ if (inputBoxRef.value) {
+ inputBoxRef.value.focus();
+ // 鍙�夛細閫変腑杈撳叆妗嗗唴瀹癸紝鏂逛究鐩存帴瑕嗙洊杈撳叆
+ // inputBoxRef.value.select();
+ }
+ });
+ };
// 璁$畻灞炴�� - 缁熻鏈夋晥鍕鹃��/濉厖鏁伴噺锛堣繃婊ょ┖鍊硷級
const checkedCount = computed(() => {
@@ -162,6 +203,8 @@
for (let i = 0; i < 10; i++) {
leftPartCodes.value[i] = data.leftPartCodes[i] || "";
leftPartIds.value[i] = data.leftPartIds?.[i] || "";
+ // 鏂板锛氳祴鍊间緵鏂逛唬鐮�
+ leftPartSupplierCodes.value[i] = data.leftPartSupplierCodes?.[i] || "";
}
}
if (Array.isArray(data.leftPartChecked) && data.leftPartChecked.length >= 10) {
@@ -172,6 +215,9 @@
}
} catch (error) {
console.error("鑾峰彇宸︿晶鍒濆鏁版嵁澶辫触锛�", error);
+ } finally {
+ // 鏁版嵁鍔犺浇瀹屾垚鍚庤仛鐒�
+ focusInputBox();
}
};
@@ -214,16 +260,19 @@
if (!finishedProductId.value) {
alert("鎴愬搧ID涓嶅瓨鍦紝鏃犳硶鏇存柊闆朵欢鎵爜鐘舵�侊紒");
leftPartChecked.value[index] = !isChecked;
+ focusInputBox(); // 鎻愮ず鍚庤仛鐒�
return;
}
if (!partId) {
alert(`闆朵欢${index + 1}鏁版嵁搴揑D涓嶅瓨鍦紝鏃犳硶鏇存柊鎵爜鐘舵�侊紒`);
leftPartChecked.value[index] = !isChecked;
+ focusInputBox(); // 鎻愮ず鍚庤仛鐒�
return;
}
if (!partCode.trim()) {
alert(`闆朵欢${index + 1}缂栧彿涓虹┖锛屾棤娉曟洿鏂版壂鐮佺姸鎬侊紒`);
leftPartChecked.value[index] = !isChecked;
+ focusInputBox(); // 鎻愮ず鍚庤仛鐒�
return;
}
@@ -254,6 +303,7 @@
checkLoading.value[index] = false;
if (checkDebounceTimer) clearTimeout(checkDebounceTimer);
checkDebounceTimer = null;
+ focusInputBox(); // 鎿嶄綔瀹屾垚鍚庤仛鐒�
}
};
@@ -271,12 +321,10 @@
fillIndex.value++;
} else {
alert("鎴愬搧缂栧彿鍜岄浂浠�1-10宸插叏閮ㄥ~鍏呭畬鎴�,鏃犳硶缁х画褰曞叆!");
- rightTopInput.value = "";
- destroyDelayTimer = null;
- return;
}
rightTopInput.value = "";
destroyDelayTimer = null;
+ focusInputBox(); // 濉厖瀹屾垚鍚庤仛鐒�
}, destroyDelayTime);
};
@@ -289,9 +337,23 @@
{ immediate: false }
);
+ // 鍏抽敭淇敼4锛氬け鍘荤劍鐐规椂閲嶆柊鑱氱劍
+ const handleInputBlur = () => {
+ // 寤惰繜涓�鐐规墽琛岋紝閬垮厤鍜屽叾浠栨搷浣滃啿绐�
+ setTimeout(() => {
+ focusInputBox();
+ }, 50);
+ };
+
// 鍙充晶杈撳叆妗嗘竻闄ゆ柟娉�
- const clearRightPart = (index) => (rightPartCodes.value[index] = "");
- const clearFinishedProductCode = () => (finishedProductCode.value = "");
+ const clearRightPart = (index) => {
+ rightPartCodes.value[index] = "";
+ focusInputBox(); // 娓呴櫎鍚庤仛鐒�
+ };
+ const clearFinishedProductCode = () => {
+ finishedProductCode.value = "";
+ focusInputBox(); // 娓呴櫎鍚庤仛鐒�
+ };
// 鏍稿績淇敼锛氭仮澶嶆垚鍝佺紪鍙峰繀濉牎楠岋紝鏈~鍐欑洿鎺ユ彁绀哄苟缁堟鎻愪氦
const saveData = async () => {
@@ -299,6 +361,7 @@
const productCode = finishedProductCode.value.trim();
if (!productCode) {
alert("璇峰厛濉啓鎴愬搧缂栧彿锛屾垚鍝佺紪鍙蜂负蹇呭~椤癸紒");
+ focusInputBox(); // 鎻愮ず鍚庤仛鐒�
return;
}
// 2. 鎻愪氦閿侊細闃叉閲嶅鐐瑰嚮
@@ -328,10 +391,14 @@
rightPartCodes.value = Array(10).fill("");
rightTopInput.value = "";
fillIndex.value = -1;
+ const msg = resData.message;
+
+ // 鏍稿績淇敼锛氫粎褰� msg 涓嶆槸 null 鏃舵墠寮瑰嚭鎻愮ず
+ if (msg !== null) {
+ alert(msg);
+ }
} else {
- // 涓氬姟閿欒锛氱洿鎺ュ睍绀哄悗绔繑鍥炵殑message锛堝鐗╂枡閿欒銆佹棤閰嶆柟锛�
- const errorMsg = resData.message || "鎻愪氦澶辫触锛屾湭鐭ヤ笟鍔¢敊璇�";
- alert(`鎻愪氦澶辫触锛�${errorMsg}`);
+ alert(`${resData.message || "鏈煡閿欒"}`);
}
} catch (error) {
// 6. 寮傚父鎹曡幏锛氬吋瀹瑰悗绔湭鎹曡幏寮傚父锛堝PLC閫氳寮傚父銆佹暟缁勮秺鐣屻��500閿欒锛�
@@ -352,6 +419,7 @@
} finally {
// 7. 閲婃斁鎻愪氦閿侊細鏃犺鎴愬姛/澶辫触閮借閲婃斁
submitLock.value = false;
+ focusInputBox(); // 鎻愪氦瀹屾垚鍚庤仛鐒�
}
};
@@ -372,6 +440,7 @@
if (!hasProductCode) {
console.log("鈿狅笍 鎴愬搧缂栧彿鏈~鍐欙紝璺宠繃鑷姩鎻愪氦");
autoSubmitDebounceTimer = null;
+ focusInputBox(); // 鏍¢獙鍚庤仛鐒�
return;
}
@@ -393,6 +462,61 @@
}, 300); // 300ms闃叉姈锛岄伩鍏嶈緭鍏ラ绻佽Е鍙�
};
+ // 鏂板锛氬垹闄ゅ綋鍓嶆墭鐩樻柟娉�
+ const deleteCurrentTray = async () => {
+ // 纭鎿嶄綔锛岄槻姝㈣鍒�
+ if (!confirm("纭瑕佸垹闄ゅ綋鍓嶆墭鐩樻暟鎹悧锛熸鎿嶄綔涓嶅彲鎭㈠锛�")) {
+ focusInputBox();
+ return;
+ }
+
+ // 璁剧疆鍔犺浇鐘舵�侊紝闃叉閲嶅鐐瑰嚮
+ deleteLoading.value = true;
+ try {
+ console.log("馃摛 璋冪敤鍒犻櫎褰撳墠鎵樼洏鎺ュ彛锛�/api/boxing/DeleteCurrentTray");
+ // 璋冪敤鍒犻櫎鎺ュ彛锛堟牴鎹疄闄呴渶姹傞�夋嫨GET/POST锛岃繖閲岄粯璁ょ敤POST锛岃嫢鍚庣鏄疓ET鍙敼涓篻et锛�
+ const response = await axios.post(
+ "/api/boxing/DeleteCurrentTray",
+ {}, // 鑻ユ棤鍙傛暟浼犵┖瀵硅薄
+ { timeout: 8000 }
+ );
+ const resData = response.data;
+ console.log("馃摜 鍒犻櫎褰撳墠鎵樼洏鎺ュ彛杩斿洖锛�", resData);
+
+ // 閫傞厤鍚庣杩斿洖鏍煎紡
+ const isSuccess = resData.status === true || resData.Status === true;
+ if (isSuccess) {
+ // 鍒犻櫎鎴愬姛鍚庢竻绌哄彸渚ц緭鍏ユ
+ finishedProductCode.value = "";
+ rightPartCodes.value = Array(10).fill("");
+ rightTopInput.value = "";
+ fillIndex.value = -1;
+ alert(resData.message || "褰撳墠鎵樼洏鍒犻櫎鎴愬姛锛�");
+ } else {
+ alert(`鍒犻櫎澶辫触锛�${resData.message || "鏈煡閿欒"}`);
+ }
+ } catch (error) {
+ // 寮傚父澶勭悊
+ let errorMsg = "鍒犻櫎鎵樼洏璇锋眰寮傚父锛�";
+ if (error.code === "ECONNABORTED") {
+ errorMsg = "鍒犻櫎璇锋眰瓒呮椂锛佽绋嶅悗閲嶈瘯";
+ } else if (error.response) {
+ errorMsg = `鏈嶅姟鍣ㄩ敊璇細${error.response.status} - ${error.response.statusText}`;
+ console.error("鉂� 鍒犻櫎鎵樼洏鏈嶅姟鍣ㄩ敊璇鎯咃細", error.response.data);
+ } else if (error.request) {
+ errorMsg = "缃戠粶寮傚父锛佹湭鏀跺埌鍚庣鍝嶅簲锛岃妫�鏌ユ帴鍙e湴鍧�鍜岀綉缁�";
+ } else {
+ errorMsg = `璇锋眰閿欒锛�${error.message}`;
+ }
+ alert(errorMsg);
+ console.error("鉂� 鍒犻櫎鎵樼洏鎺ュ彛寮傚父璇︽儏锛�", error);
+ } finally {
+ // 閲婃斁鍔犺浇鐘舵��
+ deleteLoading.value = false;
+ focusInputBox(); // 鎿嶄綔瀹屾垚鍚庤仛鐒﹀綍鍏ユ
+ }
+ };
+
// 鐩戝惉鑷姩鎻愪氦鐩稿叧鏁版嵁鍙樺寲锛岃Е鍙戞牎楠�
watch([checkedCount, filledPartCount, finishedProductCode], () => checkAutoSubmit(), {
deep: true,
@@ -403,15 +527,15 @@
const detectFillIndex = () => {
if (!finishedProductCode.value.trim()) {
fillIndex.value = -1;
- return;
- }
- for (let i = 0; i < 10; i++) {
- if (!rightPartCodes.value[i].trim()) {
- fillIndex.value = i;
- return;
+ } else {
+ for (let i = 0; i < 10; i++) {
+ if (!rightPartCodes.value[i].trim()) {
+ fillIndex.value = i;
+ return;
+ }
}
+ fillIndex.value = 10;
}
- fillIndex.value = 10;
};
// 鐩戝惉鎴愬搧/闆朵欢杈撳叆锛屾洿鏂板~鍏呯储寮�
@@ -425,6 +549,7 @@
await fetchLeftInitialData();
startPolling();
detectFillIndex();
+ focusInputBox(); // 椤甸潰鎸傝浇鍚庣珛鍗宠仛鐒�
});
// 鐢熷懡鍛ㄦ湡锛氬嵏杞芥椂娓呴櫎鎵�鏈夊畾鏃跺櫒/闃叉姈锛岄槻姝㈠唴瀛樻硠婕�
@@ -440,16 +565,22 @@
finishedProduct,
rightTopInput,
leftPartCodes,
+ // 鏂板锛氭毚闇蹭緵鏂逛唬鐮佹暟缁�
+ leftPartSupplierCodes,
rightPartCodes,
leftPartChecked,
signalStates,
signalLabels,
finishedProductCode,
checkLoading,
+ deleteLoading, // 鏆撮湶鍒犻櫎鍔犺浇鐘舵��
handlePartCheck,
saveData,
+ deleteCurrentTray, // 鏆撮湶鍒犻櫎鎵樼洏鏂规硶
clearRightPart,
clearFinishedProductCode,
+ inputBoxRef, // 鏆撮湶ref
+ handleInputBlur, // 鏆撮湶鏂规硶
};
},
};
@@ -613,6 +744,11 @@
transition: all 0.2s ease;
background-color: #ffffff;
}
+/* 鏂板锛氫緵鏂逛唬鐮佽緭鍏ユ鏍峰紡锛堝搴︾◢绐勶級 */
+.supplier-code-input {
+ flex: 0 0 150px;
+ min-width: 120px;
+}
.input-box:focus {
border-color: #3b82f6;
box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.12);
@@ -645,6 +781,10 @@
gap: 8px;
position: relative;
overflow: hidden;
+}
+/* 鏂板锛氬垹闄ゆ墭鐩樻寜閽搴﹂�傞厤 */
+.delete-tray-btn {
+ width: 140px !important;
}
.submit-input-btn {
width: 110px !important;
@@ -692,6 +832,10 @@
.icon-submit {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M2.01 21L15 13.4 23 21V5H2.01V21zM17 15l-5-5-5 5V7h10v8z'/%3E%3C/svg%3E");
}
+/* 鏂板锛氬垹闄ゅ浘鏍� */
+.icon-delete {
+ background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6v12zM19 4h-3.5l-1-1h-5l-1 1H5v2h14V4z'/%3E%3C/svg%3E");
+}
/* 鎸夐挳涓婚鏍峰紡 */
.clear-btn {
@@ -711,6 +855,16 @@
.save-btn:hover:not(:disabled) {
transform: translateY(-1px);
box-shadow: 0 4px 8px rgba(59, 130, 246, 0.15);
+}
+/* 鏂板锛氬垹闄ゆ墭鐩樻寜閽牱寮� */
+.delete-tray-btn {
+ background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);
+ color: #fff;
+ padding: 0 12px;
+}
+.delete-tray-btn:hover:not(:disabled) {
+ transform: translateY(-1px);
+ box-shadow: 0 4px 8px rgba(245, 158, 11, 0.15);
}
/* 淇″彿鐏牱寮� */
@@ -851,8 +1005,16 @@
.input-box {
width: 100%;
}
+ /* 閫傞厤绉诲姩绔緵鏂逛唬鐮佽緭鍏ユ */
+ .supplier-code-input {
+ flex: 1;
+ min-width: 100%;
+ margin-top: 6px;
+ }
+ /* 绉诲姩绔寜閽搴﹂�傞厤 */
.btn,
- .submit-input-btn {
+ .submit-input-btn,
+ .delete-tray-btn {
width: 100% !important;
margin-top: 6px;
}
--
Gitblit v1.9.3