1 托盘状态调整

zhmes-agecal-web/src/views/screen/components/TrayBinding.vue

@@ -18,8 +18,12 @@
         <!-- 添加托盘状态 -->
         <div class="tray-status">
           <div class="status-label">托盘状态：</div>
-          <el-tag :type="trayStatusTagType" size="medium">
-            {{ trayStatusText }}
+          <el-tag
+            :type="trayStatusTagType"
+            size="medium"
+            class="status-tag-bold"
+          >
+            <span class="status-text">{{ trayStatusText }}</span>
           </el-tag>
         </div>
       </div>
@@ -242,11 +246,11 @@ export default {
     // 托盘状态标签类型
     trayStatusTagType() {
       const map = {
-        '0': 'success', // 空闲 - 绿色
-        '1': 'primary', // 运行中 - 黄色
-        '2': 'danger',   // 老化完成 - 红色
-        '3': 'warning', // 标定完成
-        '4': 'info' // 标定完成
+        '0': 'info',       // 空闲 - 灰色
+        '1': 'success',    // 运行 - 绿色
+        '2': 'warning',    // 老化完成 - 橙色（较浅）
+        '3': 'danger',     // 标检完成 - 红色（更紧急）
+        '4': 'primary',    // 已绑定 - 蓝色
       };
       return map[this.trayStatus] || 'info';
     },
@@ -1130,4 +1134,28 @@ body {
   transform: translateY(-5px);
   box-shadow: 0 8px 20px rgba(157, 78, 221, 0.5);
 }
+/* 托盘状态区域 */
+.tray-status {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+}
+
+.status-label {
+  font-size: 1.1rem;
+  color: #64c8ff;
+  font-weight: bold;
+}
+
+/* 状态标签样式优化 */
+.status-tag-bold {
+  font-weight: 700 !important; /* 加粗 */
+  letter-spacing: 0.5px; /* 字间距 */
+}
+
+.status-text {
+  font-size: 14px; /* 适当调大字体 */
+  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2); /* 文字阴影增强可读性 */
+  padding: 0 2px; /* 添加内边距 */
+}
 </style>

zhmes-agecal-web/src/views/screen/components/TrayInformation.vue

@@ -174,14 +174,14 @@ export default {
       return 'clickable-row';
     },
 
-    // 状态标签类型
+// 状态标签类型
     statusTagType(status) {
       const statusMap = {
-        '0': 'success',
-        '2': 'warning',
-        '3': 'warning',
-        '1': 'primary',
-        '4': 'info',
+        '0': 'info',       // 空闲 - 灰色
+        '1': 'success',    // 运行 - 绿色
+        '2': 'warning',    // 老化完成 - 橙色（较浅）
+        '3': 'danger',     // 标检完成 - 红色（更紧急）
+        '4': 'primary',    // 已绑定 - 蓝色
       };
       return statusMap[status] || 'info';
     },