From 291067c13bfe8fb9c876e3764a828dc3ddd22f99 Mon Sep 17 00:00:00 2001
From: helongyang <647556386@qq.com>
Date: 星期一, 17 十一月 2025 16:50:12 +0800
Subject: [PATCH] 监控优化,代码功能优化
---
代码管理/WCS/WIDESEAWCS_Client/src/views/deviceMonitoring/InkWarehouse.vue | 135 +++++++++++++++++++++++++++++++++++++++-----
1 files changed, 119 insertions(+), 16 deletions(-)
diff --git "a/\344\273\243\347\240\201\347\256\241\347\220\206/WCS/WIDESEAWCS_Client/src/views/deviceMonitoring/InkWarehouse.vue" "b/\344\273\243\347\240\201\347\256\241\347\220\206/WCS/WIDESEAWCS_Client/src/views/deviceMonitoring/InkWarehouse.vue"
index 23ed561..e0072ba 100644
--- "a/\344\273\243\347\240\201\347\256\241\347\220\206/WCS/WIDESEAWCS_Client/src/views/deviceMonitoring/InkWarehouse.vue"
+++ "b/\344\273\243\347\240\201\347\256\241\347\220\206/WCS/WIDESEAWCS_Client/src/views/deviceMonitoring/InkWarehouse.vue"
@@ -28,6 +28,11 @@
<div class="xname">鎵樼洏绫诲瀷:</div>
<div class="xzhi" :title="ymData.R_YM_TrayType">{{ ymData.R_YM_TrayType || '-' }}</div>
</div>
+ <!-- 鏂板锛氬綋鍓嶆墍鍦ㄥ垪鏄剧ず -->
+ <div class="zhankuang">
+ <div class="xname">褰撳墠鎵�鍦ㄥ垪:</div>
+ <div class="xzhi" :title="ymData.R_YM_Column">{{ ymData.R_YM_Column || '鏈煡' }}</div>
+ </div>
</div>
<!-- YM鍏宠仈绔欏彴锛堝嚭鍏ュ簱9001锛� -->
@@ -88,6 +93,30 @@
</div>
</div>
</div>
+
+ <!-- 鏂板锛氬爢鍨涙満褰撳墠鍒楁枃瀛楁樉绀� -->
+ <div id="ym-nowcolumn" :class="{ 'abnormal-column': ymData.R_YM_Status !== '姝e父' }">
+ <div>娌瑰ⅷ鍫嗗灈鏈哄綋鍓嶆墍鍦ㄥ垪:
+ <span :title="ymData.R_YM_Column">{{ ymData.R_YM_Column || '鏈煡' }}</span>
+ </div>
+ </div>
+
+ <!-- 鏂板锛氬垪鏂规牸灞曠ず鍖哄煙 -->
+ <div class="ym-column-container" :class="{ 'pp-status-abnormal': ymData.R_YM_Status !== '姝e父' }">
+ <!-- 涓婃柟1-24鍒� -->
+ <div class="column-grid-container">
+ <div
+ v-for="num in 32"
+ :key="num"
+ class="column-grid-item"
+ :class="{ 'active': num == ymData.R_YM_Column }"
+ :title="`鍒楀彿: ${num}`"
+ >
+ {{ num }}
+ </div>
+ </div>
+
+ </div>
</div>
</template>
@@ -104,19 +133,18 @@
},
setup() {
const store = useStore();
- // 浠呭瓨鍌╕M鏁版嵁锛屼笌鍏朵粬鏁版嵁闅旂
const ymData = ref({});
- // 寤惰繜鏇存柊閰嶇疆锛岃В鍐抽棯鐑侀棶棰�
- const UPDATE_DELAY = 300; // 寤惰繜300ms鏇存柊UI
- let updateTimer = null; // 瀹氭椂鍣ㄥ疄渚�
+ const UPDATE_DELAY = 300;
+ let updateTimer = null;
- // YM鏁版嵁鏄犲皠瑙勫垯
+ // YM鏁版嵁鏄犲皠瑙勫垯锛堟柊澧炲垪鍙峰鐞嗭級
const ymStatusMap = {
R_YM_Status: {
- 1: "姝e父",
- 2: "鏁呴殰",
- 3: "鎬ュ仠",
+ 0: "姝e父",
+ 1: "鏁呴殰",
+ 2: "鎬ュ仠",
+ 3: "鏈煡"
},
R_YM_AutoStatus: {
0: "缁翠慨",
@@ -145,7 +173,9 @@
2: "涓墭鐩�(2)",
3: "澶ф墭鐩�(3)",
4: "鐗瑰ぇ鎵樼洏(4)",
- }
+ },
+ // 鏂板锛氬垪鍙锋槧灏勫鐞�
+ R_YM_Column: (val) => val !== undefined ? val : "鏈煡"
};
// YM瀛楁鍒嗙粍
@@ -166,7 +196,7 @@
}
};
- // 澶勭悊YM鍘熷鏁版嵁
+ // 澶勭悊YM鍘熷鏁版嵁锛堝寘鍚垪鍙峰鐞嗭級
const processYMData = (rawData) => {
if (!rawData) return {};
const processedData = { ...rawData };
@@ -174,7 +204,10 @@
// 澶勭悊鏍稿績鐘舵�佸瓧娈�
Object.keys(ymStatusMap).forEach(key => {
if (processedData.hasOwnProperty(key)) {
- processedData[key] = ymStatusMap[key][processedData[key]] || processedData[key];
+ const mapper = ymStatusMap[key];
+ processedData[key] = typeof mapper === 'function'
+ ? mapper(processedData[key])
+ : (mapper[processedData[key]] || processedData[key]);
}
});
@@ -190,14 +223,13 @@
return processedData;
};
- // 寤惰繜鏇存柊YM鏁版嵁锛岄伩鍏嶉珮棰戝埛鏂�
+ // 寤惰繜鏇存柊YM鏁版嵁
const delayedUpdateYMData = (newRawData) => {
if (updateTimer) {
clearTimeout(updateTimer);
}
updateTimer = setTimeout(() => {
- // 鍙鐞嗗寘鍚玒M鐗瑰緛瀛楁鐨勬暟鎹�
if (newRawData && newRawData.R_YM_Status !== undefined) {
ymData.value = processYMData(newRawData);
@@ -217,13 +249,11 @@
};
onMounted(() => {
- // 鍒濆鍔犺浇鏁版嵁
const initialData = store.state.homedata;
if (initialData && initialData.R_YM_Status !== undefined) {
ymData.value = processYMData(initialData);
}
- // 鐩戝惉鏁版嵁鍙樺寲锛屽彧澶勭悊YM鏁版嵁
const unwatch = watch(
() => store.state.homedata,
(newData) => {
@@ -251,6 +281,7 @@
</script>
<style scoped>
+/* 鍘熸湁鏍峰紡淇濇寔涓嶅彉 */
.ding {
float: left;
width: 20px;
@@ -387,4 +418,76 @@
margin-left: 1.7%;
border-radius: 10px;
}
-</style>
+
+/* 鏂板锛歒M鍫嗗灈鏈哄綋鍓嶅垪鏍峰紡 */
+#ym-nowcolumn {
+ width: 100%;
+ height: 70px;
+ float: left;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ font-size: 1.5cqw;
+ font-weight: bold;
+ color: #00ff4c;
+}
+
+/* 寮傚父鐘舵�佹枃瀛楀彉鑹� */
+#ym-nowcolumn.abnormal-column {
+ color: red !important;
+}
+#ym-nowcolumn.abnormal-column span {
+ color: red !important;
+}
+
+/* 鍒楀鍣ㄦ牱寮� */
+.ym-column-container {
+ width: 95%;
+ margin: 0 auto;
+ position: relative;
+ clear: both;
+ padding-top: 15px;
+}
+
+/* 鏂规牸瀹瑰櫒鏍峰紡 */
+.column-grid-container {
+ width: 100%;
+ display: flex;
+ flex-wrap: nowrap;
+ justify-content: space-between;
+ align-items: center;
+ gap: 2px;
+ position: relative;
+ z-index: 2;
+ margin-bottom: 10px;
+ padding: 0 2px;
+}
+
+/* 鏂规牸鏍峰紡 */
+.column-grid-item {
+ flex: 1;
+ min-width: 24px;
+ max-width: 60px;
+ height: 30px;
+ border: 1px solid #fff;
+ border-radius: 8px 8px 0 0;
+ color: white;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ font-size: clamp(8px, 1vw, 14px);
+ box-sizing: border-box;
+ transition: background-color 0.3s ease;
+}
+
+/* 褰撳墠鍒楅珮浜� */
+.column-grid-item.active {
+ background-color: green;
+ font-weight: bold;
+}
+
+/* 寮傚父鐘舵�佷笅褰撳墠鍒楃孩鑹查珮浜� */
+.pp-status-abnormal .column-grid-item.active {
+ background-color: red !important;
+}
+</style>
\ No newline at end of file
--
Gitblit v1.9.3