From 5270308151082506e0e6df2c72d278d2976ec860 Mon Sep 17 00:00:00 2001
From: liulijun <liulijun@hnkhzn.com>
Date: 星期三, 29 四月 2026 10:28:58 +0800
Subject: [PATCH] WCS设备监控
---
项目代码/WCS/WCSClient/src/views/LineComponent.vue | 701 ++++++++++++++++++++++++++++++++++++---------------------
1 files changed, 442 insertions(+), 259 deletions(-)
diff --git "a/\351\241\271\347\233\256\344\273\243\347\240\201/WCS/WCSClient/src/views/LineComponent.vue" "b/\351\241\271\347\233\256\344\273\243\347\240\201/WCS/WCSClient/src/views/LineComponent.vue"
index 3faff30..b6a3e7c 100644
--- "a/\351\241\271\347\233\256\344\273\243\347\240\201/WCS/WCSClient/src/views/LineComponent.vue"
+++ "b/\351\241\271\347\233\256\344\273\243\347\240\201/WCS/WCSClient/src/views/LineComponent.vue"
@@ -1,17 +1,9 @@
<template>
<div>
- <el-row>
- <template v-for="item in 32" :key="item">
- <el-col :span="0.9">
- <span class="image-text"></span>
- <img src="../../public/璐ф灦.jpeg" />
- </el-col>
- </template>
- </el-row>
<el-row style="padding-bottom: 5px;">
- <template v-for="item in 32" :key="item">
- <el-col :span="0.9">
- <span class="image-text"></span>
+ <template v-for="item in columnCount" :key="item">
+ <el-col :span="columnWidth">
+ <span class="image-text">{{ 91-item }}</span>
<img src="../../public/璐ф灦.jpeg" />
</el-col>
</template>
@@ -19,146 +11,57 @@
</div>
<div class="line-container">
<div class="line"></div>
- <!-- <div class="dot" :style="{ right: dotPosition + 'px' }" ref="childDot" @click="mouseClick"></div> -->
- <div :class="update()"
- :style="{ transform: `translateX(${StackerCrane.CurrentColumn < 33 ? StackerCrane.CurrentColumn * 30 - 59 : 0}px)` }"
+ <div :class="update()" :style="{ transform: `translateX(${calculateDotPosition()}px)` }"
ref="childDot" @click="mouseClick"></div>
</div>
<div>
<el-row style="padding-top: 5px;">
- <template v-for="item in 32" :key="item">
- <el-col :span="0.9">
- <span class="image-text"></span>
+ <template v-for="item in columnCount" :key="item">
+ <el-col :span="columnWidth">
+ <span class="image-text">{{ 91-item }}</span>
<img src="../../public/璐ф灦.jpeg" />
</el-col>
</template>
- </el-row>
- <el-row style="padding-bottom: 5px;">
- <template v-for="item in 32" :key="item">
- <el-col :span="0.9">
- <span class="image-text"></span>
- <img src="../../public/璐ф灦.jpeg" />
- </el-col>
- </template>
+ <div style="margin-top: 60px;"></div>
</el-row>
</div>
- <el-dialog v-model="dialogVisible" title="鍫嗗灈鏈轰俊鎭煡鐪�" :before-close="handleClose">
- <el-form ref="$form" :model="StackerCrane" label-position="left" label-width="120px" size="medium">
- <el-row :gutter="20" type="flex" justify="start" align="top" tag="div">
- <el-col :span="12" :offset="0" :push="0" :pull="0" tag="div">
- <el-form-item label="璁惧缂栧彿锛�">
- <j-el-description :value="StackerCrane.DeviceName" type="primary" ellipsis></j-el-description>
- </el-form-item>
- </el-col>
- <el-col :span="12" :offset="0" :push="0" :pull="0" tag="div">
- <el-form-item label="璁惧鐘舵��:">
- <j-el-description :value="StackerCrane.Fault" type="primary" ellipsis></j-el-description>
- </el-form-item>
- </el-col>
- </el-row>
- <el-row :gutter="20" type="flex" justify="start" align="top" tag="div">
- <el-col :span="12" :offset="0" :push="0" :pull="0" tag="div">
- <el-form-item label="宸ヤ綔妯″紡:">
- <j-el-description :value="StackerCrane.Automatic" type="primary" ellipsis></j-el-description>
- </el-form-item>
- </el-col>
- <el-col :span="12" :offset="0" :push="0" :pull="0" tag="div">
- <el-form-item label="浠诲姟鍙凤細">
- <j-el-description :value="StackerCrane.CurrentTaskNum" type="primary" ellipsis></j-el-description>
- </el-form-item>
- </el-col>
- </el-row>
- <el-row :gutter="20" type="flex" justify="start" align="top" tag="div" style="margin-bottom: 10px;">
- <el-col :span="12" :offset="0" :push="0" :pull="0" tag="div">
- <el-form-item label="浣滀笟鐘舵��:">
- <j-el-description :value="StackerCrane.Running" type="primary" ellipsis></j-el-description>
- </el-form-item>
- </el-col>
- <el-col :span="12" :offset="0" :push="0" :pull="0" tag="div">
- <el-form-item label="褰撳墠琛屽垪灞傦細">
- <j-el-description
- :value="StackerCrane.CurrentRow + '-' + StackerCrane.CurrentLayer + '-' + StackerCrane.CurrentColumn "
- type="primary" ellipsis></j-el-description>
- </el-form-item>
- </el-col>
- </el-row>
- <el-row :gutter="20" type="flex" justify="start" align="top" tag="div" style="margin-bottom: 10px;">
- <el-col :span="24" :offset="0" :push="0" :pull="0" tag="div">
- <el-form-item label="鎶ヨ淇℃伅:">
- <j-el-description :value="StackerCrane.StackerAlarm" type="primary" ellipsis></j-el-description>
- </el-form-item>
- </el-col>
- </el-row>
- <el-divider />
- <h4 style="margin-bottom: 20px;">鎵嬪姩鎿嶄綔</h4>
- <el-form ref="form" :model="form" label-width="90px">
- <el-row :gutter="20" type="flex" justify="start" align="top" tag="div">
- <el-col :span="16" :offset="0" :push="0" :pull="0" tag="div">
- <el-form-item label="浠诲姟鍛戒护" prop="TargetAddress">
- <el-select size="large" v-model="form.TaskType" placeholder="璇烽�夋嫨浠诲姟鍛戒护">
- <el-option label="鍏ュ簱" value="17" />
- <el-option label="鍑哄簱" value="18" />
- <el-option label="绉诲簱" value="20" />
- <el-option label="鍙栬揣" value="24" />
- <el-option label="鏀捐揣" value="48" />
- </el-select>
- </el-form-item>
- </el-col>
- </el-row>
- <el-row :gutter="20" type="flex" justify="start" align="top" tag="div">
- <el-col :span="16" :offset="0" :push="0" :pull="0" tag="div">
- <el-form-item label="璧风偣琛屽垪灞�:">
- <el-input size="large" v-model="form.SourceAddress" style="width: 800px" placeholder="璇疯緭鍏ヨ捣鐐硅鍒楀眰" />
- </el-form-item>
- </el-col>
- </el-row>
- <el-row :gutter="20" type="flex" justify="start" align="top" tag="div">
- <el-col :span="16" :offset="0" :push="0" :pull="0" tag="div">
- <el-form-item label="缁堢偣琛屽垪灞�:">
- <el-input size="large" v-model="form.TargetAddress" style="width: 800px" placeholder="璇疯緭鍏ョ粓鐐硅鍒楀眰" />
- </el-form-item>
- </el-col>
- </el-row>
- </el-form>
- <el-divider />
- <el-row :gutter="20" type="flex" justify="start" align="top" tag="div">
- <el-col :span="5" :offset="0" :push="0" :pull="0" tag="div">
- <el-button type="primary" size="small" plain @click="start">
- <i class="el-icon-check">鍚姩</i>
- </el-button>
-
- </el-col>
- <el-col :span="5" :offset="0" :push="0" :pull="0" tag="div">
- <el-button type="warning" size="small" plain @click="reset">
- <i class="el-icon-check">澶嶄綅</i>
- </el-button>
- </el-col>
- <el-col :span="5" :offset="0" :push="0" :pull="0" tag="div">
- <el-button type="danger" size="small" plain @click="disconnected">
- <i class="el-icon-check">涓柇</i>
- </el-button>
- </el-col>
- <el-col :span="5" :offset="0" :push="0" :pull="0" tag="div">
- <el-button type="danger" size="small" plain @click="emergencyStop">
- <i class="el-icon-check">鎬ュ仠</i>
- </el-button>
- </el-col>
- <el-col :span="4" :offset="0" :push="0" :pull="0" tag="div">
- <el-button type="danger" size="small" plain @click="StackerRecall">
- <i class="el-icon-check">鍙洖</i>
- </el-button>
- </el-col>
- </el-row>
- </el-form>
- <template #footer>
- <div class="dialog-footer">
- <el-button @click="dialogVisible = false">鍙栨秷</el-button>
- <el-button type="primary" @click="dialogVisible = false">
- 纭
- </el-button>
+ <el-dialog v-model="dialogVisible" :before-close="handleClose" width="520px" class="modern-dialog">
+ <div class="dialog-header">
+ <h3 class="dialog-title">鍫嗗灈鏈轰俊鎭�</h3>
+ </div>
+ <div class="dialog-content">
+ <div class="info-list">
+ <div class="info-item">
+ <span class="item-label">璁惧缂栧彿</span>
+ <span class="item-value">{{ yL_DB.R_PP_Status || '鏃�' }}</span>
+ </div>
+ <div class="info-item">
+ <span class="item-label">璁惧鐘舵��</span>
+ <span :class="['item-value', statusClass]">{{ yL_DB.YL_Status || '鏃�' }}</span>
+ </div>
+ <div class="info-item">
+ <span class="item-label">宸ヤ綔妯″紡</span>
+ <span :class="['item-value', autoStatusClass]">{{ yL_DB.YL_AutoStatus || '鏃�' }}</span>
+ </div>
+ <div class="info-item">
+ <span class="item-label">浠诲姟鍙�</span>
+ <span class="item-value">{{ yL_DB.YL_TaskNum || '鏃�' }}</span>
+ </div>
+ <div class="info-item">
+ <span class="item-label">浣滀笟鐘舵��</span>
+ <span class="item-value">{{ yL_DB.YL_WorkStatus || '鏃�' }}</span>
+ </div>
+ <div class="info-item">
+ <span class="item-label">褰撳墠琛屽垪灞�</span>
+ <span class="item-value">{{ yL_DB.YL_Row + '-' + yL_DB.YL_Column + '-' + yL_DB.YL_Layer || '鏃�' }}</span>
+ </div>
+ <div class="info-item">
+ <span class="item-label">鎶ヨ淇℃伅</span>
+ <span class="item-value">{{ yL_DB.StackerAlarm || '鏃�' }}</span>
+ </div>
</div>
- </template>
+ </div>
</el-dialog>
</template>
@@ -171,20 +74,45 @@
},
data() {
return {
+ YLDBMap: {
+ YL_Status: {
+ 0: "涓嶅湪绾�",
+ 1: "鍦ㄧ嚎",
+ 2: "鎬ュ仠",
+ 3: "鏈煡",
+ },
+ YL_AutoStatus: {
+ 1: "鍗婅嚜鍔�",
+ 2: "鍗曟",
+ 3: "鑷姩",
+ 4: "鎵嬪姩",
+ 5: "鑴辨満",
+ },
+ YL_WorkStatus: {
+ 1: "寰呭懡",
+ 2: "鍙栬揣瀹屾垚",
+ 3: "鍙栬揣涓�",
+ 5: "鏀捐揣涓�",
+ 6: "浠诲姟鎵ц閿欒",
+ 7: "鏈煡",
+ 9: "浠诲姟瀹屾垚",
+ },
+ },
x: 0, // 鍒濆x鍊�
- url: "api/Equipment/GetStackerInfoByNo",
dialogVisible: false,
- StackerCrane: {
- Automatic: "",
- Fault: "",
- CurrentLayer: "1",
- CurrentRow: "1",
- CurrentColumn: "1",
- CurrentTaskNum: "",
- Running: "",
- DeviceName: "",
- DeviceCode: "",
- StackerAlarm:"",
+ timer1: null,
+ yL_DB: {
+ R_PP_Status: "",
+ YL_Status: "",
+ YL_AutoStatus: "",
+ YL_TaskNum: "",
+ YL_WorkStatus: "",
+ YL_WorkType: "",
+ YL_Row: "",
+ YL_Column: "",
+ YL_Layer: "",
+ StackerAlarm: "",
+ CurrentColumn: "1"
},
form: {
TaskType: "",
@@ -194,6 +122,7 @@
},
};
},
+
props: {
equipNo: {
type: String,
@@ -204,33 +133,194 @@
dotPosition() {
return this.x;
},
+ // 鍒楁暟锛氬師鏂欏簱90鍒�
+ columnCount() {
+ return 90;
+ },
+ // 鍒楀锛氭牴鎹�90鍒楄绠�
+ columnWidth() {
+ return 24 / 90;
+ },
+ // 姣忓垪鐨勫疄闄呭搴︼紙鍍忕礌锛�
+ pixelPerColumn() {
+ return 30;
+ },
+ // 浠撳簱鏈�澶у垪鏁�
+ maxColumn() {
+ return 90;
+ },
+ // 璁惧鐘舵�佹枃瀛楅鑹�
+ statusClass() {
+ const status = this.yL_DB.YL_Status;
+ if (status === '涓嶅湪绾�') {
+ return 'status-red';
+ } else if (status === '鍦ㄧ嚎') {
+ return 'status-green';
+ }
+ return '';
+ },
+ // 宸ヤ綔妯″紡鏂囧瓧棰滆壊
+ autoStatusClass() {
+ const status = this.yL_DB.YL_AutoStatus;
+ if (status === '鑷姩' || status === '鍗婅嚜鍔�') {
+ return 'status-green';
+ } else if (status === '鎵嬪姩') {
+ return 'status-blue';
+ } else if (status === '鑴辨満') {
+ return 'status-red';
+ }
+ return '';
+ }
},
mounted() {
- this.moveDot(this.x);
+ // 鍒濆鍖栨椂浼犻�掔┖瀵硅薄锛岄伩鍏嶇被鍨嬩笉鍖归厤閿欒
+ this.moveDot({});
+ // 鍚姩瀹氭椂鍣紝姣忕鏇存柊涓�娆℃暟鎹�
+ this.timer1 = setInterval(() => {
+ this.updateData();
+ }, 1000);
+ },
+ beforeUnmount() {
+ // 娓呴櫎瀹氭椂鍣�
+ if (this.timer1) {
+ clearInterval(this.timer1);
+ this.timer1 = null;
+ }
+ },
+ watch: {
+ '$root.stackerData': {
+ handler() {
+ this.updateData();
+ },
+ deep: true
+ }
},
methods: {
+ updateData() {
+ const equipNoStr = String(this.equipNo);
+ if (this.$root.stackerData && this.$root.stackerData[equipNoStr]) {
+ const stackerData = this.$root.stackerData[equipNoStr];
+ this.moveDot(stackerData);
+ }
+ },
+ // 璁$畻鎸囩ず鍣ㄤ綅缃�
+ calculateDotPosition() {
+ // 鏈敹鍒颁俊鎭垨CurrentColumn涓�0锛屾寚绀哄櫒鍦ㄥ闈�
+ if (!this.yL_DB.CurrentColumn || this.yL_DB.CurrentColumn == "0") {
+ return -30; // 鏄剧ず鍦ㄨ揣浣嶅尯鍩熷乏渚у闈�
+ }
+
+ // 璁$畻鎸囩ず鍣ㄤ綅缃紝纭繚涓庡搴斿垪瀵归綈
+ const currentColumn = parseInt(this.yL_DB.CurrentColumn);
+
+ // 瀹為檯璐т綅瀹藉害锛堝浘鐗囧搴︼級
+ const columnWidth = 30; // 璐т綅鍥剧墖瀹藉害涓�30px
+ const dotWidth = 25; // 鎸囩ず鍣ㄥ搴︿负25px
+
+ // 鐢变簬鍒楀彿鏄粠鍙冲埌宸﹂�掑噺鏄剧ず鐨勶紝闇�瑕佽绠楀疄闄呯储寮�
+ // 渚嬪锛氱90鍒楀湪鏈�宸﹁竟锛岀1鍒楀湪鏈�鍙宠竟
+ // 妯℃澘涓樉绀虹殑鍒楀彿鏄� 91-item锛屾墍浠ョ1涓猠l-col鏄剧ず90锛岀90涓猠l-col鏄剧ず1
+ // 褰撳墠鍒楀彿涓篶urrentColumn锛屽搴旂殑绱㈠紩涓� maxColumn - currentColumn
+ const actualIndex = this.maxColumn - currentColumn;
+
+ // 璁$畻浣嶇疆锛�
+ // (瀹為檯绱㈠紩 * 璐т綅瀹藉害) = 璇ュ垪鐨勮捣濮嬩綅缃�
+ // + (璐т綅瀹藉害 / 2) = 璇ュ垪鐨勪腑蹇冧綅缃�
+ // - (鎸囩ず鍣ㄥ搴� / 2) = 灏嗘寚绀哄櫒涓績涓庡垪涓績瀵归綈
+ const position = actualIndex * columnWidth + (columnWidth / 2) - (dotWidth / 2);
+
+ // 璋冭瘯淇℃伅
+ console.log('褰撳墠鍒�:', currentColumn, '瀹為檯绱㈠紩:', actualIndex);
+ console.log('璐т綅瀹藉害:', columnWidth, '鎸囩ず鍣ㄥ搴�:', dotWidth);
+ console.log('璁$畻浣嶇疆:', position);
+
+ return position;
+ },
+
moveDot(x) {
- this.StackerCrane.Automatic = x.Automatic == null ? "鏁呴殰" : x.Automatic;
- this.StackerCrane.Fault = x.Fault == null ? "鏁呴殰" : x.Fault;
- this.StackerCrane.Running = x.Running == null ? "鏁呴殰" : x.Running;
- this.StackerCrane.CurrentColumn = x.CurrentColumn == undefined ? 1 : x.CurrentColumn;
- this.StackerCrane.CurrentLayer = x.CurrentLayer == undefined ? 1 : x.CurrentLayer;
- this.StackerCrane.LevelPoint = x.LevelPoint;
- this.StackerCrane.DeviceName = x.DeviceName;
- this.StackerCrane.CurrentTaskNum = x.CurrentTaskNum;
- this.StackerCrane.StackerAlarm = x.StackerAlarm;
- this.form.DeviceCode = x.DeviceCode;
+ // 鏄犲皠宸ヤ綔妯″紡
+ const autoStatusCode = x.YL_AutoStatus;
+ if (autoStatusCode !== undefined) {
+ this.yL_DB.YL_AutoStatus = this.YLDBMap.YL_AutoStatus[autoStatusCode] || autoStatusCode;
+ } else {
+ this.yL_DB.YL_AutoStatus = "鏃�";
+ }
+
+ // 鏄犲皠璁惧鐘舵��
+ const statusCode = parseInt(x.YL_Status);
+ if (!isNaN(statusCode)) {
+ this.yL_DB.YL_Status = this.YLDBMap.YL_Status[statusCode] || statusCode.toString();
+ } else {
+ this.yL_DB.YL_Status = "鏃�";
+ }
+
+ // 鏄犲皠宸ヤ綔鐘舵��
+ const workStatusCode = x.YL_WorkStatus;
+ if (workStatusCode !== undefined) {
+ this.yL_DB.YL_WorkStatus = this.YLDBMap.YL_WorkStatus[workStatusCode] || workStatusCode;
+ } else {
+ this.yL_DB.YL_WorkStatus = "鏃�";
+ }
+
+ // 鍏朵粬鏁版嵁璧嬪��
+ this.yL_DB.R_PP_Status = x.DeviceCode || "鏃�";
+ this.yL_DB.YL_WorkType = x.YL_WorkType || "鏃�";
+ this.yL_DB.YL_TaskNum = x.YL_TaskNum || "鏃�";
+
+ // 澶勭悊琛屽彿
+ const rowValue = parseInt(x.YL_Row);
+ this.yL_DB.YL_Row = (!isNaN(rowValue) && rowValue > 0) ? rowValue.toString() : "0";
+
+ // 鏍规嵁灏忚揣浣嶅彿璁$畻鍒楀彿
+ // 鐩存帴浣跨敤鍘熷灏忚揣浣嶅彿
+ const smallColumn = parseInt(x.YL_Column);
+ let displayColumn;
+ if (!isNaN(smallColumn) && smallColumn > 0) {
+ // 鐩存帴浣跨敤灏忚揣浣嶅彿锛屼笉杩涜杞崲
+ displayColumn = smallColumn;
+ } else {
+ // 娌℃湁鏀跺埌淇℃伅锛屾寚绀哄櫒鍦ㄥ闈�
+ displayColumn = 0;
+ }
+
+ // 澶勭悊鍒楀彿
+ this.yL_DB.YL_Column = (!isNaN(smallColumn) && smallColumn > 0) ? smallColumn.toString() : "0";
+
+ // 澶勭悊灞傚彿
+ const layerValue = parseInt(x.YL_Layer);
+ this.yL_DB.YL_Layer = (!isNaN(layerValue) && layerValue > 0) ? layerValue.toString() : "0";
+ // 澶勭悊鍚庣鏂板弬鏁帮紝鏄剧ず鍒版姤璀︿俊鎭腑
+ this.yL_DB.StackerAlarm = x.StackerAlarm || "鏃�";
+ this.yL_DB.CurrentColumn = displayColumn.toString();
+
+ this.form.DeviceCode = x.DeviceCode || "";
},
update() {
- if (this.StackerCrane.Automatic == "鑱旀満妯″紡" && this.StackerCrane.Fault != "鏁呴殰" && this.StackerCrane.Running == "寰呮満") {
+ // 鑾峰彇StackerAlarm鐨勫�硷紝杞崲涓哄瓧绗︿覆杩涜姣旇緝
+ const alarmValue = String(this.yL_DB.StackerAlarm).trim();
+ // 褰揝tackerAlarm瀛楁鐨勫�间笉涓�0鎴栫┖鏃讹紝灏辨晠闅滄姤璀︼紙鏄剧ず绾㈣壊锛�
+ if (alarmValue !== '' && alarmValue !== '0' && alarmValue !== '鏃�') {
+ return 'dot-Fault ';
+ }
+ if (this.yL_DB.YL_Status == "鍦ㄧ嚎" && (this.yL_DB.YL_AutoStatus == "鑷姩" || this.yL_DB.YL_AutoStatus == "鍗婅嚜鍔�")) {
return 'dot-Automatic ';
}
- else if (this.StackerCrane.Automatic == "鑱旀満妯″紡" && this.StackerCrane.Fault != "鏁呴殰" && this.StackerCrane.Running == "杩愯涓�") {
+ else if (this.yL_DB.YL_Status == "鍦ㄧ嚎" && this.yL_DB.YL_AutoStatus == "鎵嬪姩") {
return 'dot-Running ';
- } else if (this.StackerCrane.Fault == "鏁呴殰") {
- return 'dot-Fault ';
} else {
return 'dot-Fault ';
+ }
+ },
+ status() {
+ const statusText = this.ConveyorLineInfo.YL_Status;
+ if (statusText === '鎵嬪姩') {
+ return 'custom-img-blue';
+ } else if (statusText === '鑷姩') {
+ return 'custom-img-green';
+ } else if (statusText === '鑴辨満') {
+ return 'custom-img-red';
+ } else {
+ return '';
}
},
mouseClick() {
@@ -238,85 +328,85 @@
this.dialogVisible = true;
this.fullscreenLoading = false;
},
- start() {
- this.fullscreenLoading = true;
- this.http.post("api/DeviceInfo/StackerHandTask", this.form)
- .then((x) => {
- if (!x.status) {
- this.$message.error(x.message);
- } else {
- this.$Message.success("鍫嗗灈鏈哄懡浠ゅ凡涓嬪彂");
- // $vue.success("鎴愬姛.");
- this.show = false;
- $vue.refresh();
- }
- })
- .finally(() => {
- this.fullscreenLoading = false;
- });
- }, reset() {
- this.fullscreenLoading = true;
- this.http.post("api/DeviceInfo/StackerReset?DeviceCode=" + this.form.DeviceCode)
- .then((x) => {
- if (!x.status) {
- this.$message.error(x.message);
- } else {
- this.$Message.success("澶嶄綅鎴愬姛");
- // $vue.success("鎴愬姛.");
- this.show = false;
- $vue.refresh();
- }
- })
- .finally(() => {
- this.fullscreenLoading = false;
- });
- },
-
- emergencyStop() {
- this.fullscreenLoading = true;
- this.http.post("api/DeviceInfo/StackerEmergencyStop?DeviceCode=" + this.form.DeviceCode)
- .then((x) => {
- if (!x.status) {
- this.$message.error(x.message);
- } else {
- this.$Message.success("鎬ュ仠宸叉寜涓�");
- // $vue.success("鎴愬姛.");
- // this.show = false;
- // $vue.refresh();
- }
- })
- .finally(() => {
- this.fullscreenLoading = false;
- });
- },
- disconnected() {
- this.fullscreenLoading = true;
- this.http.post("api/DeviceInfo/StackerDisconnected?DeviceCode=" + this.form.DeviceCode)
- .then((x) => {
- if (!x.status) {
- this.$message.error(x.message);
- } else {
- this.$Message.success("涓柇鍫嗗灈鏈轰换鍔�");
- }
- })
- .finally(() => {
- this.fullscreenLoading = false;
- });
- },
- StackerRecall() {
- this.fullscreenLoading = true;
- this.http.post("api/DeviceInfo/StackerRecall?DeviceCode=" + this.form.DeviceCode)
- .then((x) => {
- if (!x.status) {
- this.$message.error(x.message);
- } else {
- this.$Message.success("鍙洖鍫嗗灈鏈�");
- }
- })
- .finally(() => {
- this.fullscreenLoading = false;
- });
- }
+ // start() {
+ // this.fullscreenLoading = true;
+ // this.http.post("api/DeviceInfo/StackerHandTask", this.form)
+ // .then((x) => {
+ // if (!x.status) {
+ // this.$message.error(x.message);
+ // } else {
+ // this.$Message.success("鍫嗗灈鏈哄懡浠ゅ凡涓嬪彂");
+ // // $vue.success("鎴愬姛.");
+ // this.show = false;
+ // $vue.refresh();
+ // }
+ // })
+ // .finally(() => {
+ // this.fullscreenLoading = false;
+ // });
+ // }, reset() {
+ // this.fullscreenLoading = true;
+ // this.http.post("api/DeviceInfo/StackerReset?DeviceCode=" + this.form.DeviceCode)
+ // .then((x) => {
+ // if (!x.status) {
+ // this.$message.error(x.message);
+ // } else {
+ // this.$Message.success("澶嶄綅鎴愬姛");
+ // // $vue.success("鎴愬姛.");
+ // this.show = false;
+ // $vue.refresh();
+ // }
+ // })
+ // .finally(() => {
+ // this.fullscreenLoading = false;
+ // });
+ // },
+
+ // emergencyStop() {
+ // this.fullscreenLoading = true;
+ // this.http.post("api/DeviceInfo/StackerEmergencyStop?DeviceCode=" + this.form.DeviceCode)
+ // .then((x) => {
+ // if (!x.status) {
+ // this.$message.error(x.message);
+ // } else {
+ // this.$Message.success("鎬ュ仠宸叉寜涓�");
+ // // $vue.success("鎴愬姛.");
+ // // this.show = false;
+ // // $vue.refresh();
+ // }
+ // })
+ // .finally(() => {
+ // this.fullscreenLoading = false;
+ // });
+ // },
+ // disconnected() {
+ // this.fullscreenLoading = true;
+ // this.http.post("api/DeviceInfo/StackerDisconnected?DeviceCode=" + this.form.DeviceCode)
+ // .then((x) => {
+ // if (!x.status) {
+ // this.$message.error(x.message);
+ // } else {
+ // this.$Message.success("涓柇鍫嗗灈鏈轰换鍔�");
+ // }
+ // })
+ // .finally(() => {
+ // this.fullscreenLoading = false;
+ // });
+ // },
+ // StackerRecall() {
+ // this.fullscreenLoading = true;
+ // this.http.post("api/DeviceInfo/StackerRecall?DeviceCode=" + this.form.DeviceCode)
+ // .then((x) => {
+ // if (!x.status) {
+ // this.$message.error(x.message);
+ // } else {
+ // this.$Message.success("鍙洖鍫嗗灈鏈�");
+ // }
+ // })
+ // .finally(() => {
+ // this.fullscreenLoading = false;
+ // });
+ // }
},
};
</script>
@@ -324,9 +414,10 @@
<style scoped>
.line-container {
position: relative;
- height: 20px;
+ height: 25px;
background-color: #ecf5ff;
- width: 960px;
+ width: 2720px;
+ /* 90鍒� * 30px姣忓垪 */
}
.line {
@@ -334,13 +425,13 @@
top: 0;
left: 0;
right: 0;
- height: 1px;
+ height: 0px;
background-color: #a0cfff;
}
.dot-Running {
position: absolute;
- top: -5px;
+ top: 0px;
width: 25px;
height: 25px;
border-radius: 50%;
@@ -356,7 +447,7 @@
.dot-Automatic {
position: absolute;
- top: -5px;
+ top: 0px;
width: 25px;
height: 25px;
border-radius: 50%;
@@ -372,7 +463,7 @@
.dot-Fault {
position: absolute;
- top: -5px;
+ top: 0px;
width: 25px;
height: 25px;
border-radius: 50%;
@@ -388,19 +479,111 @@
img {
width: 30px;
- height: 25px;
+ height: 30px;
}
.image-text {
position: absolute;
top: 5px;
- /* left: 10px; */
- color: white;
- /* 鏂囧瓧棰滆壊 */
+ color: #000000;
font-size: 12px;
- /* 瀛楀彿澶у皬 */
font-weight: bold;
- /* 瀛椾綋绮楃粏 */
+ font-family: 'Microsoft YaHei', Arial, sans-serif;
margin-left: 5px;
}
-</style>
+
+.modern-dialog {
+ border-radius: 16px !important;
+ overflow: hidden;
+ box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
+}
+
+.modern-dialog .el-dialog__header {
+ display: none;
+}
+
+.modern-dialog .el-dialog__body {
+ padding: 0;
+ margin: 0;
+}
+
+.dialog-header {
+ background: linear-gradient(135deg, #409eff 0%, #67c23a 100%);
+ padding: 20px 24px;
+ text-align: center;
+}
+
+.dialog-title {
+ color: #fff;
+ font-size: 18px;
+ font-weight: 600;
+ margin: 0;
+ letter-spacing: 2px;
+}
+
+.dialog-content {
+ padding: 28px;
+ background: #f8fafc;
+ display: flex;
+ justify-content: center;
+}
+
+.info-list {
+ width: 100%;
+ max-width: 420px;
+ display: flex;
+ flex-direction: column;
+ gap: 12px;
+}
+
+.info-item {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ padding: 16px 20px;
+ background: #fff;
+ border-radius: 12px;
+ box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
+ transition: all 0.3s ease;
+}
+
+.info-item:hover {
+ transform: translateX(4px);
+ box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
+}
+
+.item-label {
+ font-size: 14px;
+ color: #6b7280;
+ font-weight: 500;
+ min-width: 80px;
+ text-align: left;
+}
+
+.item-value {
+ font-size: 15px;
+ color: #1f2937;
+ font-weight: 500;
+ text-align: right;
+ flex: 1;
+ margin-left: 20px;
+ word-break: break-all;
+ padding-left: 20px;
+ border-left: 1px solid #e5e7eb;
+}
+
+.status-blue {
+ color: #409eff !important;
+ font-weight: 600;
+}
+
+.status-green {
+ color: #67c23a !important;
+ font-weight: 600;
+}
+
+.status-red {
+ color: #f56c6c !important;
+ font-weight: 600;
+}
+</style>
\ No newline at end of file
--
Gitblit v1.9.3