Parcourir la source

增加静态农技设备页面

jiuling il y a 10 mois
Parent
commit
a5559521eb
3 fichiers modifiés avec 1542 ajouts et 319 suppressions
  1. 323 315
      pages.json
  2. 1163 0
      pages/device/device-list/detail-machine.vue
  3. 56 4
      pages/device/device-list/index.vue

+ 323 - 315
pages.json

@@ -1,319 +1,327 @@
 {
 
-  "pages": [
-   
-    {
-      "path": "pages/dashboard/index",
-      "style": {
-        "navigationBarTitleText": "农小禹 - 首页"
-      }
-    },
-	{
-	  "path": "pages/login/index",
-	  "style": {
-	    "navigationBarTitleText": "登录",
-	    "navigationStyle": "custom"
-	  }
-	},
-  {
-	  "path": "pages/login/register",
-	  "style": {
-	    "navigationBarTitleText": "注册",
-	    "navigationStyle": "custom"
-	  }
-	},
-	{
-		  "path": "pages/login/forget-password",
-		  "style": {
-		    "navigationBarTitleText": "忘记密码",
-		    "navigationStyle": "custom"
-		  }
-		},
-	{
-	  "path": "pages/userInfo/index",
-	  "style": {
-	    "navigationBarTitleText": "用户信息"
-	  }
-	},
-     {
-      "path": "pages/activity/index",
-      "style": {
-        "navigationBarTitleText": "农事活动"
-      }
-    },
-    {
-      "path": "pages/activity/activity-detail",
-      "style": {
-        "navigationBarTitleText": "农事任务详情",
-        "navigationBarBackgroundColor": "#ffffff",
-        "navigationBarTextStyle": "black",
-        "enablePullDownRefresh": true
-      }
-    },
-	    {
-	      "path": "pages/device/index",
-	      "style": {
-	        "navigationBarTitleText": "设备监测"
-	      }
-	    },
-    {
-          "path": "pages/device/device-list/detail-camera",
-          "style": {
-            "navigationBarTitleText": "监控设备详情",
-            "navigationBarBackgroundColor": "#ffffff",
-            "navigationBarTextStyle": "black",
-            "enablePullDownRefresh": false
-          }
-        },
-        {
-          "path": "pages/device/device-list/detail-collector",
-          "style": {
-            "navigationBarTitleText": "采集设备详情",
-            "navigationBarBackgroundColor": "#ffffff",
-            "navigationBarTextStyle": "black",
-            "enablePullDownRefresh": false
-          }
-        },
-		{
-		      "path": "pages/device/device-list/index",
-		      "style": {
-		        "navigationBarTitleText": "设备列表",
-		        "navigationBarBackgroundColor": "#ffffff",
-		        "navigationBarTextStyle": "black",
-		        "enablePullDownRefresh": false
-		      }
-		    },
-    {
-      "path": "pages/knowledge/index",
-      "style": {
-        "navigationBarTitleText": "农业知识"
-      }
-    },
-	{
-	  "path": "pages/knowledge/detail",
-	  "style": {
-	    "navigationBarTitleText": "农业知识",
-	    "h5": {
-	      "navigationStyle": "custom"
-	    },
-	    "app-plus": {
-	      "titleNView": {
-	        "buttons": [{
-	          "type": "back",
-	          "background": "transparent"
-	        }]
-	      }
-	    },
-	    "mp-weixin": {
-	      "navigationBarBackgroundColor": "#ffffff",
-	      "navigationBarTextStyle": "black"
-	    }
-	  }
-	},
-	{
-	  "path": "pages/knowledge/ai-chat/index",
-	  "style": {
-	    "navigationBarTitleText": "问农小禹"
-	  }
+	"pages": [
+
+		{
+			"path": "pages/dashboard/index",
+			"style": {
+				"navigationBarTitleText": "农小禹 - 首页"
+			}
+		},
+		{
+			"path": "pages/login/index",
+			"style": {
+				"navigationBarTitleText": "登录",
+				"navigationStyle": "custom"
+			}
+		},
+		{
+			"path": "pages/login/register",
+			"style": {
+				"navigationBarTitleText": "注册",
+				"navigationStyle": "custom"
+			}
+		},
+		{
+			"path": "pages/login/forget-password",
+			"style": {
+				"navigationBarTitleText": "忘记密码",
+				"navigationStyle": "custom"
+			}
+		},
+		{
+			"path": "pages/userInfo/index",
+			"style": {
+				"navigationBarTitleText": "用户信息"
+			}
+		},
+		{
+			"path": "pages/activity/index",
+			"style": {
+				"navigationBarTitleText": "农事活动"
+			}
+		},
+		{
+			"path": "pages/activity/activity-detail",
+			"style": {
+				"navigationBarTitleText": "农事任务详情",
+				"navigationBarBackgroundColor": "#ffffff",
+				"navigationBarTextStyle": "black",
+				"enablePullDownRefresh": true
+			}
+		},
+		{
+			"path": "pages/device/index",
+			"style": {
+				"navigationBarTitleText": "设备监测"
+			}
+		},
+		{
+			"path": "pages/device/device-list/detail-camera",
+			"style": {
+				"navigationBarTitleText": "监控设备详情",
+				"navigationBarBackgroundColor": "#ffffff",
+				"navigationBarTextStyle": "black",
+				"enablePullDownRefresh": false
+			}
+		},
+		{
+			"path": "pages/device/device-list/detail-collector",
+			"style": {
+				"navigationBarTitleText": "采集设备详情",
+				"navigationBarBackgroundColor": "#ffffff",
+				"navigationBarTextStyle": "black",
+				"enablePullDownRefresh": false
+			}
+		},
+		{
+			"path": "pages/device/device-list/index",
+			"style": {
+				"navigationBarTitleText": "设备列表",
+				"navigationBarBackgroundColor": "#ffffff",
+				"navigationBarTextStyle": "black",
+				"enablePullDownRefresh": false
+			}
+		},
+		{
+			"path": "pages/device/device-list/detail-machine",
+			"style": {
+				"navigationBarTitleText": "农机设备详情",
+				"navigationBarBackgroundColor": "#ffffff",
+				"navigationBarTextStyle": "black",
+				"enablePullDownRefresh": false
+			}
+		},
+		{
+			"path": "pages/knowledge/index",
+			"style": {
+				"navigationBarTitleText": "农业知识"
+			}
+		},
+		{
+			"path": "pages/knowledge/detail",
+			"style": {
+				"navigationBarTitleText": "农业知识",
+				"h5": {
+					"navigationStyle": "custom"
+				},
+				"app-plus": {
+					"titleNView": {
+						"buttons": [{
+							"type": "back",
+							"background": "transparent"
+						}]
+					}
+				},
+				"mp-weixin": {
+					"navigationBarBackgroundColor": "#ffffff",
+					"navigationBarTextStyle": "black"
+				}
+			}
+		},
+		{
+			"path": "pages/knowledge/ai-chat/index",
+			"style": {
+				"navigationBarTitleText": "问农小禹"
+			}
+		},
+		{
+			"path": "pages/user/index",
+			"style": {
+				"navigationBarTitleText": "我的"
+			}
+		},
+		{
+			"path": "pages/machine/index",
+			"style": {
+				"navigationBarTitleText": "农机管理"
+			}
+		},
+		{
+			"path": "pages/ai-chat/index",
+			"style": {
+				"navigationBarTitleText": "AI问答"
+			}
+		},
+		{
+			"path": "pages/field/index",
+			"style": {
+				"navigationBarTitleText": "地块管理"
+			}
+		},
+		{
+			"path": "pages/more/index",
+			"style": {
+				"navigationBarTitleText": "更多服务"
+			}
+		},
+		{
+			"path": "pages/settings/index",
+			"style": {
+				"navigationBarTitleText": "系统设置"
+			}
+		},
+		{
+			"path": "pages/about/index",
+			"style": {
+				"navigationBarTitleText": "关于我们"
+			}
+		},
+		{
+			"path": "pages/privacy/index",
+			"style": {
+				"navigationBarTitleText": "隐私政策"
+			}
+		},
+		{
+			"path": "pages/plots/list",
+			"style": {
+				"navigationBarTitleText": "选择地块"
+			}
+		},
+		{
+			"path": "pages/service/mall",
+			"style": {
+				"navigationBarTitleText": "农资商城",
+				"navigationBarBackgroundColor": "#ffffff",
+				"navigationBarTextStyle": "black",
+				"enablePullDownRefresh": true
+			}
+		},
+		{
+			"path": "pages/service/mall-detail",
+			"style": {
+				"navigationBarTitleText": "商品详情",
+				"navigationBarBackgroundColor": "#ffffff",
+				"navigationBarTextStyle": "black",
+				"enablePullDownRefresh": false
+			}
+		},
+		{
+			"path": "pages/service/sales",
+			"style": {
+				"navigationBarTitleText": "农品交易",
+				"navigationBarBackgroundColor": "#ffffff",
+				"navigationBarTextStyle": "black"
+			}
+		},
+		{
+			"path": "pages/service/expert",
+			"style": {
+				"navigationBarTitleText": "专家咨询",
+				"navigationBarBackgroundColor": "#ffffff",
+				"navigationBarTextStyle": "black"
+			}
+		},
+		{
+			"path": "pages/service/expert-detail",
+			"style": {
+				"navigationBarTitleText": "专家详情",
+				"navigationBarBackgroundColor": "#ffffff",
+				"navigationBarTextStyle": "black",
+				"enablePullDownRefresh": false
+			}
+		},
+		{
+			"path": "pages/service/expert-chat",
+			"style": {
+				"navigationBarTitleText": "专家咨询",
+				"navigationBarBackgroundColor": "#ffffff",
+				"navigationBarTextStyle": "black",
+				"enablePullDownRefresh": false
+			}
+		},
+		{
+			"path": "pages/service/certification",
+			"style": {
+				"navigationBarTitleText": "绿色认证申请",
+				"navigationBarBackgroundColor": "#ffffff",
+				"navigationBarTextStyle": "black"
+			}
+		},
+		{
+			"path": "pages/service/insurance",
+			"style": {
+				"navigationBarTitleText": "保险接入",
+				"navigationBarBackgroundColor": "#ffffff",
+				"navigationBarTextStyle": "black"
+			}
+		},
+		{
+			"path": "pages/service/sales-publish",
+			"style": {
+				"navigationBarTitleText": "发布农产品",
+				"navigationBarBackgroundColor": "#ffffff",
+				"navigationBarTextStyle": "black",
+				"enablePullDownRefresh": false
+			}
+		},
+		{
+			"path": "pages/service/my-publish",
+			"style": {
+				"navigationBarTitleText": "我的发布",
+				"navigationBarBackgroundColor": "#ffffff",
+				"navigationBarTextStyle": "black",
+				"enablePullDownRefresh": false
+			}
+		},
+		{
+			"path": "pages/service/purchase-publish",
+			"style": {
+				"navigationBarTitleText": "发布收购信息",
+				"navigationBarBackgroundColor": "#ffffff",
+				"navigationBarTextStyle": "black",
+				"enablePullDownRefresh": false
+			}
+		},
+		{
+			"path": "pages/service/sales-detail",
+			"style": {
+				"navigationBarTitleText": "产品详情",
+				"navigationBarBackgroundColor": "#ffffff",
+				"navigationBarTextStyle": "black",
+				"enablePullDownRefresh": false
+			}
+		}
+	],
+	"tabBar": {
+		"color": "#666666",
+		"selectedColor": "#4CAF50",
+		"backgroundColor": "#ffffff",
+		"borderStyle": "black",
+		"list": [{
+				"pagePath": "pages/dashboard/index",
+				"iconPath": "static/icons/home.png",
+				"selectedIconPath": "static/icons/home-active.png",
+				"text": "首页"
+			},
+			{
+				"pagePath": "pages/activity/index",
+				"iconPath": "static/icons/activity.png",
+				"selectedIconPath": "static/icons/activity-active.png",
+				"text": "农事"
+			},
+			{
+				"pagePath": "pages/device/index",
+				"iconPath": "static/icons/device.png",
+				"selectedIconPath": "static/icons/device-active.png",
+				"text": "设备"
+			},
+			{
+				"pagePath": "pages/knowledge/index",
+				"iconPath": "static/icons/knowledge.png",
+				"selectedIconPath": "static/icons/knowledge-active.png",
+				"text": "农技"
+			},
+			{
+				"pagePath": "pages/user/index",
+				"iconPath": "static/icons/user.png",
+				"selectedIconPath": "static/icons/user-active.png",
+				"text": "我的"
+			}
+		]
 	},
-    {
-      "path": "pages/user/index",
-      "style": {
-        "navigationBarTitleText": "我的"
-      }
-    },
-    {
-      "path": "pages/machine/index",
-      "style": {
-        "navigationBarTitleText": "农机管理"
-      }
-    },
-    {
-      "path": "pages/ai-chat/index",
-      "style": {
-        "navigationBarTitleText": "AI问答"
-      }
-    },
-    {
-      "path": "pages/field/index",
-      "style": {
-        "navigationBarTitleText": "地块管理"
-      }
-    },
-    {
-      "path": "pages/more/index",
-      "style": {
-        "navigationBarTitleText": "更多服务"
-      }
-    },
-    {
-      "path": "pages/settings/index",
-      "style": {
-        "navigationBarTitleText": "系统设置"
-      }
-    },
-    {
-      "path": "pages/about/index",
-      "style": {
-        "navigationBarTitleText": "关于我们"
-      }
-    },
-    {
-      "path": "pages/privacy/index",
-      "style": {
-        "navigationBarTitleText": "隐私政策"
-      }
-    },
-    {
-      "path": "pages/plots/list",
-      "style": {
-        "navigationBarTitleText": "选择地块"
-      }
-    },
-        {
-      "path": "pages/service/mall",
-      "style": {
-        "navigationBarTitleText": "农资商城",
-        "navigationBarBackgroundColor": "#ffffff",
-        "navigationBarTextStyle": "black",
-        "enablePullDownRefresh": true
-      }
-    },
-    {
-      "path": "pages/service/mall-detail",
-      "style": {
-        "navigationBarTitleText": "商品详情",
-        "navigationBarBackgroundColor": "#ffffff",
-        "navigationBarTextStyle": "black",
-        "enablePullDownRefresh": false
-      }
-    },
-    {
-      "path": "pages/service/sales",
-      "style": {
-        "navigationBarTitleText": "农品交易",
-        "navigationBarBackgroundColor": "#ffffff",
-        "navigationBarTextStyle": "black"
-      }
-    },
-    {
-      "path": "pages/service/expert",
-      "style": {
-        "navigationBarTitleText": "专家咨询",
-        "navigationBarBackgroundColor": "#ffffff",
-        "navigationBarTextStyle": "black"
-      }
-    },
-    {
-      "path": "pages/service/expert-detail",
-      "style": {
-        "navigationBarTitleText": "专家详情",
-        "navigationBarBackgroundColor": "#ffffff",
-        "navigationBarTextStyle": "black",
-        "enablePullDownRefresh": false
-      }
-    },
-    {
-      "path": "pages/service/expert-chat",
-      "style": {
-        "navigationBarTitleText": "专家咨询",
-        "navigationBarBackgroundColor": "#ffffff",
-        "navigationBarTextStyle": "black",
-        "enablePullDownRefresh": false
-      }
-    },
-    {
-      "path": "pages/service/certification",
-      "style": {
-        "navigationBarTitleText": "绿色认证申请",
-        "navigationBarBackgroundColor": "#ffffff",
-        "navigationBarTextStyle": "black"
-      }
-    },
-    {
-      "path": "pages/service/insurance",
-      "style": {
-        "navigationBarTitleText": "保险接入",
-        "navigationBarBackgroundColor": "#ffffff",
-        "navigationBarTextStyle": "black"
-      }
-    },
-    {
-      "path": "pages/service/sales-publish",
-      "style": {
-        "navigationBarTitleText": "发布农产品",
-        "navigationBarBackgroundColor": "#ffffff",
-        "navigationBarTextStyle": "black",
-        "enablePullDownRefresh": false
-      }
-    },
-    {
-      "path": "pages/service/my-publish",
-      "style": {
-        "navigationBarTitleText": "我的发布",
-        "navigationBarBackgroundColor": "#ffffff",
-        "navigationBarTextStyle": "black",
-        "enablePullDownRefresh": false
-      }
-    },
-    {
-      "path": "pages/service/purchase-publish",
-      "style": {
-        "navigationBarTitleText": "发布收购信息",
-        "navigationBarBackgroundColor": "#ffffff",
-        "navigationBarTextStyle": "black",
-        "enablePullDownRefresh": false
-      }
-    },
-    {
-      "path": "pages/service/sales-detail",
-      "style": {
-        "navigationBarTitleText": "产品详情",
-        "navigationBarBackgroundColor": "#ffffff",
-        "navigationBarTextStyle": "black",
-        "enablePullDownRefresh": false
-      }
-    }
-  ],
-  "tabBar": {
-    "color": "#666666",
-    "selectedColor": "#4CAF50",
-    "backgroundColor": "#ffffff",
-    "borderStyle": "black",
-    "list": [
-      {
-        "pagePath": "pages/dashboard/index",
-        "iconPath": "static/icons/home.png",
-        "selectedIconPath": "static/icons/home-active.png",
-        "text": "首页"
-      },
-      {
-        "pagePath": "pages/activity/index",
-        "iconPath": "static/icons/activity.png",
-        "selectedIconPath": "static/icons/activity-active.png",
-        "text": "农事"
-      },
-      {
-        "pagePath": "pages/device/index",
-        "iconPath": "static/icons/device.png",
-        "selectedIconPath": "static/icons/device-active.png",
-        "text": "设备"
-      },
-      {
-        "pagePath": "pages/knowledge/index",
-        "iconPath": "static/icons/knowledge.png",
-        "selectedIconPath": "static/icons/knowledge-active.png",
-        "text": "农技"
-      },
-      {
-        "pagePath": "pages/user/index",
-        "iconPath": "static/icons/user.png",
-        "selectedIconPath": "static/icons/user-active.png",
-        "text": "我的"
-      }
-    ]
-  },
-  "easycom": {
-  		"^u-(.*)": "uview-ui/components/u-$1/u-$1.vue"
-  	}
+	"easycom": {
+		"^u-(.*)": "uview-ui/components/u-$1/u-$1.vue"
+	}
 }

+ 1163 - 0
pages/device/device-list/detail-machine.vue

@@ -0,0 +1,1163 @@
+<template>
+  <view class="container">
+    <!-- 设备头部信息区域 -->
+    <view class="device-header">
+      <view class="device-info-row">
+        <view class="device-name-container">
+          <text class="device-name">{{ deviceInfo.name }}</text>
+          <view 
+            class="status-tag" 
+            :class="deviceInfo.status === 'online' ? 'status-online' : 'status-offline'"
+          >
+            <view class="status-dot" :class="{'offline-dot': deviceInfo.status === 'offline'}"></view>
+            {{ deviceInfo.status === 'online' ? '在线' : '离线' }}
+          </view>
+        </view>
+        
+        <view class="refresh-btn" :class="{'refreshing': isRefreshing}" @tap="refreshData">
+          <image src="/static/icons/refresh_icon.png" mode="aspectFit" style="width: 22px; height: 22px;"></image>
+        </view>
+      </view>
+      
+      <view class="device-meta-row">
+        <view class="device-meta-item">
+          <view class="meta-icon">
+            <image src="/static/icons/device_icon.png" mode="aspectFit" style="width: 36rpx; height: 36rpx;"></image>
+          </view>
+          <text class="meta-label">设备编号:</text>
+          <text class="meta-value">{{ deviceInfo.deviceId }}</text>
+        </view>
+        
+        <view class="device-meta-item">
+          <view class="meta-icon">
+            <image src="/static/icons/location_icon.png" mode="aspectFit" style="width: 36rpx; height: 36rpx;"></image>
+          </view>
+          <text class="meta-label">工作区域:</text>
+          <text class="meta-value">{{ deviceInfo.location }}</text>
+        </view>
+        
+        <view class="device-meta-item">
+          <view class="meta-icon">
+            <image src="/static/icons/clock_icon.png" mode="aspectFit" style="width: 36rpx; height: 36rpx;"></image>
+          </view>
+          <text class="meta-label">最近更新:</text>
+          <text class="meta-value">{{ deviceInfo.lastUpdate }}</text>
+        </view>
+      </view>
+    </view>
+
+    <!-- 设备状态信息区域 -->
+    <view class="status-section">
+      <view class="section-title">
+        <text>设备状态</text>
+      </view>
+      
+      <view class="status-grid">
+        <!-- 作业状态 -->
+        <view class="status-item" hover-class="status-item-hover">
+          <text class="status-label">作业状态</text>
+          <view class="status-value-container">
+            <text class="status-value" :class="{
+              'status-working': deviceInfo.workStatus === 'working',
+              'status-idle': deviceInfo.workStatus === 'idle',
+              'status-error': deviceInfo.workStatus === 'error'
+            }">{{ getWorkStatusText(deviceInfo.workStatus) }}</text>
+          </view>
+          <text class="status-time">{{ deviceInfo.statusUpdateTime || '1分钟前' }}</text>
+        </view>
+        
+        <!-- 电量状态 -->
+        <view class="status-item" hover-class="status-item-hover">
+          <text class="status-label">电量</text>
+          <view class="status-value-container">
+            <text class="status-value" :class="{
+              'value-warning': deviceInfo.battery < 30,
+              'value-alert': deviceInfo.battery < 15
+            }">{{ deviceInfo.battery || 85 }}</text>
+            <text class="status-unit">%</text>
+          </view>
+          <text class="status-time">{{ deviceInfo.batteryUpdateTime || '30秒前' }}</text>
+        </view>
+        
+        <!-- GPS信号 -->
+        <view class="status-item" hover-class="status-item-hover">
+          <text class="status-label">GPS信号</text>
+          <view class="status-value-container">
+            <text class="status-value" :class="{
+              'status-good': deviceInfo.gpsSignal >= 80,
+              'status-normal': deviceInfo.gpsSignal >= 60 && deviceInfo.gpsSignal < 80,
+              'status-weak': deviceInfo.gpsSignal < 60
+            }">{{ getGpsSignalText(deviceInfo.gpsSignal) }}</text>
+          </view>
+          <text class="status-time">{{ deviceInfo.gpsUpdateTime || '15秒前' }}</text>
+        </view>
+        
+        <!-- 工作时长 -->
+        <view class="status-item" hover-class="status-item-hover">
+          <text class="status-label">今日工作</text>
+          <view class="status-value-container">
+            <text class="status-value">{{ deviceInfo.workDuration || '2.5' }}</text>
+            <text class="status-unit">小时</text>
+          </view>
+          <text class="status-time">累计时长</text>
+        </view>
+        
+        <!-- 作业面积 -->
+        <view class="status-item" hover-class="status-item-hover">
+          <text class="status-label">今日面积</text>
+          <view class="status-value-container">
+            <text class="status-value">{{ deviceInfo.workArea || '15.6' }}</text>
+            <text class="status-unit">亩</text>
+          </view>
+          <text class="status-time">已完成</text>
+        </view>
+        
+        <!-- 当前速度 -->
+        <view class="status-item" hover-class="status-item-hover">
+          <text class="status-label">当前速度</text>
+          <view class="status-value-container">
+            <text class="status-value">{{ deviceInfo.currentSpeed || '0' }}</text>
+            <text class="status-unit">km/h</text>
+          </view>
+          <text class="status-time">{{ deviceInfo.speedUpdateTime || '实时' }}</text>
+        </view>
+      </view>
+    </view>
+
+    <!-- 设备控制区域 -->
+    <view class="control-section">
+      <view class="section-title">
+        <text>设备控制</text>
+        <view class="engine-status" :class="{'engine-on': isEngineOn}">
+          <text>{{ isEngineOn ? '引擎开启' : '引擎关闭' }}</text>
+        </view>
+      </view>
+      
+      <view class="control-container">
+        <!-- 启动/停止按钮 -->
+        <view class="engine-control">
+          <view 
+            class="engine-button" 
+            :class="{'engine-on': isEngineOn, 'disabled': deviceInfo.status === 'offline'}"
+            @click="toggleEngine"
+          >
+            <view class="engine-icon">
+              <image 
+                :src="isEngineOn ? '/static/icons/engine_stop.svg' : '/static/icons/engine_start.svg'" 
+                mode="aspectFit" 
+                style="width: 28px; height: 28px;"
+              ></image>
+            </view>
+            <text class="engine-text">{{ isEngineOn ? '停止' : '启动' }}</text>
+          </view>
+        </view>
+        
+        <!-- 方向控制 -->
+        <view class="direction-control">
+          <!-- 前进按钮 -->
+          <view class="control-btn control-forward" 
+                :class="{'disabled': !isEngineOn || deviceInfo.status === 'offline', 'active': activeControl === 'forward'}"
+                @touchstart="startControl('forward')" 
+                @touchend="stopControl">
+            <image src="/static/icons/arrow_up.svg" mode="aspectFit" style="width: 24px; height: 24px;"></image>
+            <text>前进</text>
+          </view>
+          
+          <!-- 左右控制行 -->
+          <view class="control-row">
+            <!-- 左转按钮 -->
+            <view class="control-btn control-left" 
+                  :class="{'disabled': !isEngineOn || deviceInfo.status === 'offline', 'active': activeControl === 'left'}"
+                  @touchstart="startControl('left')" 
+                  @touchend="stopControl">
+              <image src="/static/icons/arrow_left.svg" mode="aspectFit" style="width: 24px; height: 24px;"></image>
+              <text>左转</text>
+            </view>
+            
+            <!-- 中心状态显示 -->
+            <view class="control-center">
+              <view class="speed-display">
+                <text class="speed-value">{{ currentSpeed }}</text>
+                <text class="speed-unit">km/h</text>
+              </view>
+            </view>
+            
+            <!-- 右转按钮 -->
+            <view class="control-btn control-right" 
+                  :class="{'disabled': !isEngineOn || deviceInfo.status === 'offline', 'active': activeControl === 'right'}"
+                  @touchstart="startControl('right')" 
+                  @touchend="stopControl">
+              <image src="/static/icons/arrow_right.svg" mode="aspectFit" style="width: 24px; height: 24px;"></image>
+              <text>右转</text>
+            </view>
+          </view>
+          
+          <!-- 后退按钮 -->
+          <view class="control-btn control-backward" 
+                :class="{'disabled': !isEngineOn || deviceInfo.status === 'offline', 'active': activeControl === 'backward'}"
+                @touchstart="startControl('backward')" 
+                @touchend="stopControl">
+            <image src="/static/icons/arrow_down.svg" mode="aspectFit" style="width: 24px; height: 24px;"></image>
+            <text>后退</text>
+          </view>
+        </view>
+        
+        <!-- 快捷操作按钮 -->
+        <view class="quick-controls">
+          <view class="quick-control-btn" 
+                :class="{'disabled': deviceInfo.status === 'offline'}"
+                @click="emergencyStop">
+            <view class="quick-icon emergency">
+              <image src="/static/icons/emergency_stop.svg" mode="aspectFit" style="width: 24px; height: 24px;"></image>
+            </view>
+            <text>紧急停止</text>
+          </view>
+          
+          <view class="quick-control-btn" 
+                :class="{'disabled': deviceInfo.status === 'offline'}"
+                @click="returnHome">
+            <view class="quick-icon">
+              <image src="/static/icons/home.svg" mode="aspectFit" style="width: 24px; height: 24px;"></image>
+            </view>
+            <text>返回充电</text>
+          </view>
+          
+          <view class="quick-control-btn" 
+                :class="{'disabled': deviceInfo.status === 'offline'}"
+                @click="autoMode">
+            <view class="quick-icon">
+              <image src="/static/icons/auto_mode.svg" mode="aspectFit" style="width: 24px; height: 24px;"></image>
+            </view>
+            <text>自动模式</text>
+          </view>
+        </view>
+      </view>
+    </view>
+
+    <!-- 告警信息列表 -->
+    <view class="alerts-section">
+      <view class="section-title">
+        <text>告警信息</text>
+        <view class="alert-badge" v-if="getUnhandledAlerts.length > 0">{{ getUnhandledAlerts.length }}</view>
+      </view>
+      
+      <view class="alerts-list" v-if="getUnhandledAlerts.length > 0">
+        <view 
+          v-for="(item, index) in getUnhandledAlerts" 
+          :key="index"
+          class="alert-item"
+          :class="{
+            'alert-urgent': item.level === 'high', 
+            'alert-warning': item.level === 'medium', 
+            'alert-info': item.level === 'low'
+          }"
+          @click="handleAlert(item)"
+        >
+          <view class="alert-item-icon">
+            <image v-if="item.level === 'high'" src="/static/icons/warning_icon.png" mode="aspectFit" style="width: 24px; height: 24px;"></image>
+            <image v-else-if="item.level === 'medium'" src="/static/icons/info_icon.png" mode="aspectFit" style="width: 24px; height: 24px;"></image>
+            <image v-else src="/static/icons/success_icon.png" mode="aspectFit" style="width: 24px; height: 24px;"></image>
+          </view>
+          
+          <view class="alert-item-info">
+            <text class="alert-item-type">{{ item.title }}</text>
+            <text class="alert-item-level">
+              {{ item.level === 'high' ? '紧急' : item.level === 'medium' ? '警告' : '提示' }}
+            </text>
+          </view>
+          
+          <view class="alert-item-time">{{ item.time }}</view>
+        </view>
+      </view>
+      
+      <view v-else class="empty-alert">
+        <text class="empty-text">暂无告警信息</text>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      // 设备信息
+      deviceInfo: {
+        id: '',
+        name: '智能播种机-001',
+        deviceId: 'AGM-001-2024',
+        location: '东区水稻田A块',
+        status: 'online', // online, offline
+        workStatus: 'idle', // working, idle, error
+        battery: 85,
+        gpsSignal: 92,
+        workDuration: '2.5',
+        workArea: '15.6',
+        currentSpeed: '0',
+        lastUpdate: '1分钟前',
+        statusUpdateTime: '1分钟前',
+        batteryUpdateTime: '30秒前',
+        gpsUpdateTime: '15秒前',
+        speedUpdateTime: '实时'
+      },
+      
+      // 控制状态
+      isEngineOn: false,
+      activeControl: '', // forward, backward, left, right
+      currentSpeed: 0,
+      
+      // 页面状态
+      isRefreshing: false,
+      
+      // 告警数据
+      alerts: [
+        {
+          id: 1,
+          title: '电量不足警告',
+          description: '设备电量低于30%,建议及时充电',
+          level: 'medium',
+          time: '5分钟前',
+          handled: false
+        },
+        {
+          id: 2,
+          title: 'GPS信号弱',
+          description: '当前GPS信号较弱,可能影响导航精度',
+          level: 'low',
+          time: '10分钟前',
+          handled: false
+        },
+        {
+          id: 3,
+          title: '作业异常',
+          description: '检测到播种深度异常,请检查设备状态',
+          level: 'high',
+          time: '15分钟前',
+          handled: false
+        }
+      ]
+    }
+  },
+  
+  computed: {
+    // 未处理的告警
+    getUnhandledAlerts() {
+      return this.alerts.filter(alert => !alert.handled);
+    }
+  },
+  
+  onLoad(options) {
+    // 获取设备ID参数
+    if (options.deviceId) {
+      this.deviceInfo.deviceId = options.deviceId;
+    }
+    
+    // 获取设备ID参数(兼容不同参数名)
+    if (options.id) {
+      this.deviceInfo.id = options.id;
+    }
+    
+    // 设置导航栏标题
+    uni.setNavigationBarTitle({
+      title: '农机设备详情'
+    });
+    
+    // 加载设备数据
+    this.loadDeviceData();
+  },
+  
+  onShow() {
+    // 页面显示时刷新数据
+    this.refreshData();
+  },
+  
+  onHide() {
+    // 页面隐藏时停止所有控制操作
+    this.stopAllControls();
+  },
+  
+  methods: {
+    // 加载设备数据
+    loadDeviceData() {
+      // 这里可以调用API获取设备详细信息
+      console.log('加载设备数据:', this.deviceInfo.deviceId);
+    },
+    
+    // 刷新数据
+    refreshData() {
+      this.isRefreshing = true;
+      
+      // 模拟刷新延迟
+      setTimeout(() => {
+        this.isRefreshing = false;
+        // 更新最近更新时间
+        this.deviceInfo.lastUpdate = '刚刚';
+        
+        uni.showToast({
+          title: '刷新成功',
+          icon: 'success',
+          duration: 1500
+        });
+      }, 1000);
+    },
+    
+    // 获取工作状态文本
+    getWorkStatusText(status) {
+      const statusMap = {
+        working: '工作中',
+        idle: '空闲',
+        error: '故障'
+      };
+      return statusMap[status] || '未知';
+    },
+    
+    // 获取GPS信号文本
+    getGpsSignalText(signal) {
+      if (signal >= 80) return '强';
+      if (signal >= 60) return '中等';
+      if (signal >= 40) return '弱';
+      return '无信号';
+    },
+    
+    // 切换引擎状态
+    toggleEngine() {
+      if (this.deviceInfo.status === 'offline') {
+        uni.showToast({
+          title: '设备离线,无法操作',
+          icon: 'none'
+        });
+        return;
+      }
+      
+      this.isEngineOn = !this.isEngineOn;
+      
+      if (this.isEngineOn) {
+        this.deviceInfo.workStatus = 'idle';
+        uni.showToast({
+          title: '引擎已启动',
+          icon: 'success'
+        });
+      } else {
+        this.deviceInfo.workStatus = 'idle';
+        this.currentSpeed = 0;
+        this.stopAllControls();
+        uni.showToast({
+          title: '引擎已关闭',
+          icon: 'success'
+        });
+      }
+    },
+    
+    // 开始控制
+    startControl(direction) {
+      if (!this.isEngineOn || this.deviceInfo.status === 'offline') {
+        return;
+      }
+      
+      this.activeControl = direction;
+      this.deviceInfo.workStatus = 'working';
+      
+      // 模拟速度变化
+      switch (direction) {
+        case 'forward':
+          this.currentSpeed = 5;
+          break;
+        case 'backward':
+          this.currentSpeed = 2;
+          break;
+        case 'left':
+        case 'right':
+          this.currentSpeed = 3;
+          break;
+      }
+      
+      // 发送控制指令
+      this.sendControlCommand(direction, true);
+    },
+    
+    // 停止控制
+    stopControl() {
+      if (this.activeControl) {
+        this.sendControlCommand(this.activeControl, false);
+      }
+      
+      this.activeControl = '';
+      this.currentSpeed = 0;
+      this.deviceInfo.workStatus = 'idle';
+    },
+    
+    // 停止所有控制
+    stopAllControls() {
+      this.activeControl = '';
+      this.currentSpeed = 0;
+      if (this.isEngineOn) {
+        this.deviceInfo.workStatus = 'idle';
+      }
+    },
+    
+    // 发送控制指令
+    sendControlCommand(direction, isStart) {
+      console.log(`发送控制指令: ${direction}, 开始: ${isStart}`);
+      // 这里可以调用API发送实际的控制指令
+    },
+    
+    // 紧急停止
+    emergencyStop() {
+      if (this.deviceInfo.status === 'offline') {
+        uni.showToast({
+          title: '设备离线,无法操作',
+          icon: 'none'
+        });
+        return;
+      }
+      
+      uni.showModal({
+        title: '紧急停止',
+        content: '确定要执行紧急停止吗?设备将立即停止所有操作。',
+        success: (res) => {
+          if (res.confirm) {
+            this.isEngineOn = false;
+            this.stopAllControls();
+            
+            uni.showToast({
+              title: '紧急停止已执行',
+              icon: 'success'
+            });
+          }
+        }
+      });
+    },
+    
+    // 返回充电
+    returnHome() {
+      if (this.deviceInfo.status === 'offline') {
+        uni.showToast({
+          title: '设备离线,无法操作',
+          icon: 'none'
+        });
+        return;
+      }
+      
+      uni.showToast({
+        title: '设备正在返回充电站',
+        icon: 'success'
+      });
+    },
+    
+    // 自动模式
+    autoMode() {
+      if (this.deviceInfo.status === 'offline') {
+        uni.showToast({
+          title: '设备离线,无法操作',
+          icon: 'none'
+        });
+        return;
+      }
+      
+      uni.showToast({
+        title: '已切换到自动模式',
+        icon: 'success'
+      });
+    },
+    
+    // 处理告警
+    handleAlert(alert) {
+      uni.showModal({
+        title: alert.title,
+        content: alert.description + '\n\n是否标记为已处理?',
+        success: (res) => {
+          if (res.confirm) {
+            const index = this.alerts.findIndex(item => item.id === alert.id);
+            if (index !== -1) {
+              this.alerts[index].handled = true;
+            }
+            
+            uni.showToast({
+              title: '已标记为处理',
+              icon: 'success'
+            });
+          }
+        }
+      });
+    }
+  }
+}
+</script>
+
+<style scoped>
+.container {
+  display: flex;
+  flex-direction: column;
+  min-height: 100vh;
+  background-color: #F8FCF9;
+  padding-bottom: 30rpx;
+}
+
+/* 设备头部信息 */
+.device-header {
+  background-color: #FFFFFF;
+  border-radius: 20rpx;
+  padding: 30rpx;
+  margin: 30rpx 30rpx 30rpx;
+  box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.06);
+  border: 1rpx solid rgba(210, 237, 217, 0.5);
+}
+
+.device-info-row {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-bottom: 28rpx;
+}
+
+.device-name-container {
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+}
+
+.device-name {
+  font-size: 36rpx;
+  color: #333333;
+  font-weight: 600;
+  margin-bottom: 12rpx;
+}
+
+.status-tag {
+  padding: 6rpx 16rpx 6rpx 28rpx;
+  border-radius: 30rpx;
+  font-size: 24rpx;
+  font-weight: 500;
+  flex-shrink: 0;
+  position: relative;
+  overflow: hidden;
+}
+
+.status-online {
+  background-color: rgba(76, 175, 80, 0.1);
+  color: #3BB44A;
+}
+
+.status-offline {
+  background-color: rgba(245, 108, 108, 0.1);
+  color: #F56C6C;
+  padding-left: 28rpx;
+}
+
+.status-dot {
+  position: absolute;
+  width: 6rpx;
+  height: 6rpx;
+  background-color: #3BB44A;
+  border-radius: 50%;
+  top: 50%;
+  left: 12rpx;
+  transform: translateY(-50%);
+  box-shadow: 0 0 4rpx rgba(76, 175, 80, 0.8);
+  animation: blink 1.5s infinite;
+  display: inline-block;
+}
+
+.status-dot.offline-dot {
+  background-color: #F56C6C;
+  box-shadow: 0 0 4rpx rgba(245, 108, 108, 0.8);
+}
+
+.refresh-btn {
+  width: 48rpx;
+  height: 48rpx;
+  background-color: rgba(76, 175, 80, 0.1);
+  border-radius: 50%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 12rpx;
+  transition: transform 0.3s ease;
+}
+
+.refresh-btn:active {
+  transform: rotate(180deg);
+}
+
+.refresh-btn.refreshing {
+  animation: spin 1.2s linear infinite;
+}
+
+@keyframes spin {
+  0% {
+    transform: rotate(0deg);
+  }
+  100% {
+    transform: rotate(360deg);
+  }
+}
+
+@keyframes blink {
+  0% {
+    opacity: 0.4;
+  }
+  50% {
+    opacity: 1;
+  }
+  100% {
+    opacity: 0.4;
+  }
+}
+
+.device-meta-row {
+  display: flex;
+  flex-direction: column;
+  background-color: #F9FCFA;
+  padding: 20rpx 24rpx;
+  border-radius: 16rpx;
+  border: 1rpx solid rgba(210, 237, 217, 0.8);
+}
+
+.device-meta-item {
+  display: flex;
+  align-items: center;
+  font-size: 28rpx;
+  margin-top: 18rpx;
+}
+
+.device-meta-item:first-child {
+  margin-top: 0;
+}
+
+.meta-icon {
+  width: 36rpx;
+  height: 36rpx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin-right: 12rpx;
+}
+
+.meta-label {
+  color: #777777;
+  min-width: 140rpx;
+  font-size: 28rpx;
+}
+
+.meta-value {
+  color: #333333;
+  flex: 1;
+  font-size: 28rpx;
+  font-weight: 500;
+}
+
+/* 设备状态区域 */
+.status-section {
+  background: #ffffff;
+  margin: 0 24rpx 20rpx;
+  padding: 32rpx 24rpx;
+  border-radius: 20rpx;
+  box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.06);
+}
+
+.section-title {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  font-size: 32rpx;
+  font-weight: 600;
+  color: #333333;
+  margin-bottom: 24rpx;
+  padding-bottom: 16rpx;
+  border-bottom: 2rpx solid #f0f0f0;
+}
+
+.status-grid {
+  display: grid;
+  grid-template-columns: repeat(2, 1fr);
+  gap: 20rpx;
+}
+
+.status-item {
+  background: #f8f9fa;
+  padding: 24rpx;
+  border-radius: 16rpx;
+  border: 2rpx solid transparent;
+  transition: all 0.3s ease;
+}
+
+.status-item-hover {
+  border-color: #40a9ff;
+  box-shadow: 0 4rpx 12rpx rgba(64, 169, 255, 0.15);
+}
+
+.status-label {
+  font-size: 24rpx;
+  color: #999999;
+  margin-bottom: 8rpx;
+  display: block;
+}
+
+.status-value-container {
+  display: flex;
+  align-items: baseline;
+  margin-bottom: 8rpx;
+}
+
+.status-value {
+  font-size: 36rpx;
+  font-weight: 600;
+  color: #333333;
+}
+
+.status-unit {
+  font-size: 24rpx;
+  color: #666666;
+  margin-left: 4rpx;
+}
+
+.status-time {
+  font-size: 20rpx;
+  color: #cccccc;
+}
+
+/* 状态颜色 */
+.status-working {
+  color: #52c41a;
+}
+
+.status-idle {
+  color: #1890ff;
+}
+
+.status-error {
+  color: #ff4d4f;
+}
+
+.status-good {
+  color: #52c41a;
+}
+
+.status-normal {
+  color: #faad14;
+}
+
+.status-weak {
+  color: #ff4d4f;
+}
+
+.value-warning {
+  color: #faad14;
+}
+
+.value-alert {
+  color: #ff4d4f;
+}
+
+/* 控制区域 */
+.control-section {
+  background: #ffffff;
+  margin: 0 24rpx 20rpx;
+  padding: 32rpx 24rpx;
+  border-radius: 20rpx;
+  box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.06);
+}
+
+.engine-status {
+  padding: 8rpx 16rpx;
+  border-radius: 20rpx;
+  font-size: 24rpx;
+  background-color: #fff1f0;
+  color: #ff4d4f;
+}
+
+.engine-status.engine-on {
+  background-color: #e8f5e8;
+  color: #52c41a;
+}
+
+.control-container {
+  display: flex;
+  flex-direction: column;
+  gap: 32rpx;
+}
+
+/* 引擎控制 */
+.engine-control {
+  display: flex;
+  justify-content: center;
+}
+
+.engine-button {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  padding: 24rpx;
+  background: #ffffff;
+  border-radius: 20rpx;
+  border: 3rpx solid #4CAF50;
+  transition: all 0.3s ease;
+  width: 160rpx;
+  box-shadow: 0 4rpx 12rpx rgba(76, 175, 80, 0.2);
+}
+
+.engine-button.engine-on {
+  background: #F44336;
+  border-color: #F44336;
+  color: white;
+  box-shadow: 0 4rpx 12rpx rgba(244, 67, 54, 0.3);
+}
+
+.engine-button:not(.engine-on) {
+  background: #4CAF50;
+  border-color: #4CAF50;
+  color: white;
+}
+
+.engine-button.disabled {
+  opacity: 0.3;
+  pointer-events: none;
+  background: #DDDDDD;
+  border-color: #DDDDDD;
+}
+
+.engine-button:active {
+  transform: scale(0.95);
+}
+
+.engine-icon {
+  margin-bottom: 12rpx;
+}
+
+.engine-text {
+  font-size: 28rpx;
+  font-weight: 600;
+}
+
+/* 方向控制 */
+.direction-control {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 20rpx;
+}
+
+.control-row {
+  display: flex;
+  align-items: center;
+  gap: 20rpx;
+}
+
+.control-btn {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  width: 120rpx;
+  height: 120rpx;
+  background: #f8f9fa;
+  border-radius: 12rpx;
+  border: 2rpx solid #e0e0e0;
+  transition: all 0.3s ease;
+  font-size: 24rpx;
+  color: #999999;
+  gap: 8rpx;
+}
+
+.control-btn.active {
+  background: rgba(76, 175, 80, 0.1);
+  border-color: #4CAF50;
+  color: #4CAF50;
+  transform: scale(0.9);
+  box-shadow: 0 2rpx 8rpx rgba(76, 175, 80, 0.3);
+}
+
+.control-btn.disabled {
+  opacity: 0.3;
+  pointer-events: none;
+  background: #DDDDDD;
+  border-color: #DDDDDD;
+}
+
+.control-center {
+  width: 120rpx;
+  height: 120rpx;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  background: #f0f0f0;
+  border-radius: 20rpx;
+  border: 2rpx solid #d0d0d0;
+}
+
+.speed-display {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+}
+
+.speed-value {
+  font-size: 32rpx;
+  font-weight: 600;
+  color: #333333;
+}
+
+.speed-unit {
+  font-size: 20rpx;
+  color: #999999;
+}
+
+/* 快捷控制 */
+.quick-controls {
+  display: flex;
+  justify-content: space-around;
+  padding-top: 20rpx;
+  border-top: 2rpx solid #f0f0f0;
+}
+
+.quick-control-btn {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 8rpx;
+  padding: 16rpx;
+  border-radius: 16rpx;
+  transition: all 0.3s ease;
+}
+
+.quick-control-btn.disabled {
+  opacity: 0.5;
+  pointer-events: none;
+}
+
+.quick-control-btn:active {
+  background: #f0f0f0;
+}
+
+.quick-icon {
+  width: 48rpx;
+  height: 48rpx;
+  background: #f8f9fa;
+  border-radius: 12rpx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  border: 2rpx solid #e0e0e0;
+}
+
+.quick-icon.emergency {
+  background: rgba(245, 108, 108, 0.1);
+  border-color: #F56C6C;
+}
+
+.quick-control-btn text {
+  font-size: 24rpx;
+  color: #666666;
+}
+
+/* 告警信息 */
+.alerts-section {
+  margin: 0 30rpx 30rpx;
+  background-color: #FFFFFF;
+  border-radius: 20rpx;
+  padding: 30rpx 24rpx;
+  box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.04);
+  border: 1rpx solid rgba(210, 237, 217, 0.5);
+}
+
+.alert-badge {
+  background-color: #F56C6C;
+  color: #FFFFFF;
+  font-size: 22rpx;
+  border-radius: 30rpx;
+  padding: 2rpx 12rpx;
+  margin-left: 12rpx;
+  font-weight: normal;
+  min-width: 32rpx;
+  text-align: center;
+}
+
+.alerts-list {
+  display: flex;
+  flex-direction: column;
+  gap: 16rpx;
+}
+
+.alert-item {
+  display: flex;
+  align-items: center;
+  padding: 24rpx 20rpx;
+  border-radius: 12rpx;
+  margin-bottom: 16rpx;
+  box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
+  position: relative;
+  border: 1rpx solid transparent;
+  transition: transform 0.2s ease;
+}
+
+.alert-item:active {
+  transform: scale(0.98);
+}
+
+.alert-urgent {
+  background-color: #FEF3F3;
+  border-left: 4rpx solid #F56C6C;
+  border-color: rgba(245, 108, 108, 0.2);
+}
+
+.alert-warning {
+  background-color: #FFF8E6;
+  border-left: 4rpx solid #E6A23C;
+  border-color: rgba(230, 162, 60, 0.2);
+}
+
+.alert-info {
+  background-color: #F2FAF5;
+  border-left: 4rpx solid #67C23A;
+  border-color: rgba(103, 194, 58, 0.2);
+}
+
+.alert-item-icon {
+  width: 50rpx;
+  height: 50rpx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin-right: 16rpx;
+}
+
+.alert-item-info {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  gap: 8rpx;
+}
+
+.alert-item-type {
+  font-size: 28rpx;
+  color: #333333;
+  font-weight: 500;
+  margin-bottom: 8rpx;
+}
+
+.alert-item-level {
+  font-size: 24rpx;
+  color: #999999;
+}
+
+.alert-item-time {
+  font-size: 24rpx;
+  color: #999999;
+  margin-left: 16rpx;
+  min-width: 100rpx;
+  text-align: right;
+}
+
+.empty-alert {
+  padding: 60rpx 0;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+
+.empty-text {
+  font-size: 28rpx;
+  color: #999999;
+}
+</style> 

+ 56 - 4
pages/device/device-list/index.vue

@@ -284,7 +284,14 @@ export default {
             }
             
             this.total = total;
-            
+			// 为农技增加模拟数据 后续可删除
+            if(total === 0){
+            	const newDevices = this.generateMockDevices();
+				console.log("newDevices",newDevices);
+            	this.deviceList = [...this.deviceList, ...newDevices];
+				this.total = this.deviceList.length
+            }
+			
             // 标记有告警的设备
             this.deviceList.forEach(device => {
               // 这里可以根据实际情况设置hasAlert属性
@@ -366,8 +373,11 @@ export default {
         // 采集设备跳转到采集设备详情页,同时传递设备编码,便于判断设备子类型
         // url = `/pages/device/device-list/detail-collector?id=${device.deviceId}&deviceTypeId=${device.deviceTypeId}&fieldName=${device.fieldName}&deviceName=${device.deviceName}`;
 		url = `/pages/device/device-list/detail-collector`;
-     
-	  } else {
+      
+      } else if (device.type === 'tractor') {
+        // 农机设备跳转到农机设备详情页
+        url = `/pages/device/device-list/detail-machine?id=${device.id}&deviceId=${device.code}`;
+      } else {
         // 其他类型设备暂时使用通用详情页
         url = `/pages/device/device-detail/index?id=${device.id}&type=${device.type}`;
       }
@@ -386,7 +396,10 @@ export default {
 				status:device.status
               });
             }, 100); // 100ms 通常足够,必要时可加到 200
-          }
+          },
+		  fail: (e)=>{
+			  console.log(e);
+		  }
         });
     },
     
@@ -455,6 +468,45 @@ export default {
 	  
 	  return parsedStr.split('T')[0] + ' 更新';
 	},
+	// 生成模拟设备数据
+	generateMockDevices() {
+	  const devices = [];
+	  const locations = ['东区A1地块', '西区B2地块', '南区C3地块', '北区D4地块'];
+	  const updateTimes = ['刚刚更新', '1分钟前更新', '5分钟前更新', '10分钟前更新', '1小时前更新'];
+	  
+	  // 根据当前页码和限制数量生成对应数量的模拟数据
+	  const startIndex = (this.pageNum - 1) * this.pageSize;
+	  for (let i = 0; i < this.pageSize; i++) {
+	    const index = startIndex + i;
+	    
+	    // 如果已经生成了30条数据,则停止
+	    if (index >= 30) break;
+	    
+	    // 对于采集设备类型,生成随机的气象或土壤设备
+	    let deviceType = this.deviceType;
+	    let deviceCode = `DEV${String(index + 1001).padStart(4, '0')}`;
+	    
+	    // 如果是采集设备,随机生成气象站或土壤墒情设备
+	    if (this.deviceType === 'sensor') {
+	      // 随机分配采集设备子类型:气象站或土壤墒情
+	      const sensorSubType = Math.random() > 0.5 ? 'weather' : 'soil';
+	      deviceCode = sensorSubType === 'weather' ? `W${deviceCode}` : `S${deviceCode}`;
+	    }
+	    
+	    devices.push({
+	      id: `device-${index + 1}`,
+	      deviceName: `${this.getDeviceTypeName(this.deviceType)}-${index + 1}`,
+	      deviceId: deviceCode,
+	      type: deviceType,
+	      status: Math.random() > 0.3 ? 'online' : 'offline', // 70% 概率在线
+	      fieldName: locations[Math.floor(Math.random() * locations.length)],
+	      updateTime: updateTimes[Math.floor(Math.random() * updateTimes.length)],
+	      alarmCount: Math.random() > 0.7 ? Math.floor(Math.random() * 3) + 1 : 0 // 30% 概率有告警
+	    });
+	  }
+	  
+	  return devices;
+	},
 /*    formatDate(dateStr) {
       if (!dateStr) return '未知';