Merge branch 'master' of http://47.92.161.104:10080/zkx/jp-housekeep-electric

App.vue

@@ -38,7 +38,19 @@
 		padding: 0 24rpx;
 		display: flex;
 		align-items: center;
-		position: relative;
+		position: fixed;
+		left: 0;
+		right: 0;
+		top: 0;
+		
+		z-index: 99999;
+		.back{
+			.img{
+				width: 48rpx;
+				height: 48rpx;
+				vertical-align: middle;
+			}
+		}
 		
 		.title{
 			color: rgb(16,16,16);
@@ -61,6 +73,8 @@
 			display: flex;
 			align-items: center;
 			margin-left: auto;
+			font-size: 32rpx;
+			color: rgba(16,16,16,1);
 			.img{
 				width: 32rpx;
 				height: 32rpx;

assets/img/riFill-alert-fill.svg

@@ -0,0 +1,6 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 32 32" width="20" height="20" style="" filter="none">
+    
+    <g>
+    <path d="M17.155 4l12.701 22c0.112 0.191 0.179 0.421 0.179 0.667 0 0.736-0.597 1.333-1.333 1.333h-25.403c-0.736-0-1.333-0.597-1.333-1.333 0-0.245 0.066-0.475 0.182-0.673l-0.003 0.006 12.701-22c0.235-0.401 0.664-0.667 1.155-0.667s0.92 0.265 1.151 0.66l0.003 0.006zM14.667 21.333v2.667h2.667v-2.667h-2.667zM14.667 12v6.667h2.667v-6.667h-2.667z" fill="rgba(126,147,176,1)"></path>
+    </g>
+  </svg>

assets/img/riFill-bar-chart-fill.svg

@@ -0,0 +1,6 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 32 32" width="14" height="14" style="" filter="none">
+    
+    <g>
+    <path d="M4 16h5.333v12h-5.333v-12zM22.667 10.667h5.333v17.333h-5.333v-17.333zM13.333 2.667h5.333v25.333h-5.333v-25.333z" fill="rgba(255,255,255,1)"></path>
+    </g>
+  </svg>

assets/img/riFill-building-fill1.svg

@@ -0,0 +1,6 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 32 32" width="20" height="20" style="" filter="none">
+    
+    <g>
+    <path d="M28 25.333h2.667v2.667h-29.333v-2.667h2.667v-20c0-0.736 0.597-1.333 1.333-1.333v0h13.333c0.736 0 1.333 0.597 1.333 1.333v0 20h2.667v-13.333h4c0.736 0 1.333 0.597 1.333 1.333v0 12zM9.333 14.667v2.667h5.333v-2.667h-5.333zM9.333 9.333v2.667h5.333v-2.667h-5.333z" fill="rgba(126,147,176,1)"></path>
+    </g>
+  </svg>

assets/img/riFill-cloud-off-fill1.svg

@@ -0,0 +1,6 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 32 32" width="20" height="20" style="" filter="none">
+    
+    <g>
+    <path d="M4.687 2.8l25.456 25.456-1.887 1.887-2.685-2.687c-0.859 0.344-1.854 0.544-2.896 0.544-0.003 0-0.006 0-0.009 0h-13.333c-0.002 0-0.003 0-0.005 0-4.418 0-8-3.582-8-8 0-3.468 2.207-6.421 5.293-7.53l0.056-0.018c-0.007-0.137-0.011-0.297-0.011-0.459 0-1.059 0.176-2.076 0.502-3.024l-0.020 0.066-4.348-4.349 1.887-1.885zM22.667 12c4.418 0.003 7.999 3.585 7.999 8.004 0 1.465-0.394 2.838-1.081 4.020l0.020-0.038-10.925-10.924c1.173-0.675 2.533-1.061 3.987-1.061zM16 2.667c4.299 0 7.92 2.906 9.005 6.861l0.015 0.066c-0.704-0.165-1.513-0.26-2.344-0.26-2.21 0-4.263 0.67-5.969 1.817l0.038-0.024-6.487-6.487c1.561-1.23 3.557-1.973 5.726-1.973 0.005 0 0.011 0 0.016 0h-0.001z" fill="rgba(22,119,255,1)"></path>
+    </g>
+  </svg>

assets/img/riFill-map-pin-fill.svg

@@ -0,0 +1,6 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 32 32" width="20" height="20" style="" filter="none">
+    
+    <g>
+    <path d="M24.485 23.152l-8.485 8.485-8.485-8.485c-2.172-2.172-3.515-5.172-3.515-8.485 0-6.627 5.373-12 12-12s12 5.373 12 12c0 3.314-1.343 6.314-3.515 8.485v0zM16 20c2.946 0 5.333-2.388 5.333-5.333s-2.388-5.333-5.333-5.333v0c-2.946 0-5.333 2.388-5.333 5.333s2.388 5.333 5.333 5.333v0zM16 17.333c-1.473 0-2.667-1.194-2.667-2.667s1.194-2.667 2.667-2.667v0c1.473 0 2.667 1.194 2.667 2.667s-1.194 2.667-2.667 2.667v0z" fill="rgba(126,147,176,1)"></path>
+    </g>
+  </svg>

assets/img/riFill-navigation-fill 1.svg

@@ -0,0 +1,6 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 32 32" width="14" height="14" style="" filter="none">
+    
+    <g>
+    <path d="M3.867 3.067l25.073 8.357c0.268 0.091 0.457 0.34 0.457 0.633 0 0.279-0.172 0.518-0.415 0.618l-0.004 0.002-11.644 4.657-5.9 11.8c-0.112 0.22-0.337 0.369-0.596 0.369-0.303 0-0.559-0.202-0.64-0.479l-0.001-0.005-7.183-25.137c-0.016-0.055-0.026-0.118-0.026-0.183 0-0.368 0.298-0.667 0.667-0.667 0.076 0 0.149 0.013 0.217 0.036l-0.005-0.001z" fill="rgba(22,119,255,1)"></path>
+    </g>
+  </svg>

assets/img/riFill-temp-cold-fill1.svg

@@ -0,0 +1,6 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 32 32" width="20" height="20" style="" filter="none">
+    
+    <g>
+    <path d="M10.667 13.673v-7.007c0-2.946 2.388-5.333 5.333-5.333s5.333 2.388 5.333 5.333v0 7.007c2.431 1.709 4 4.501 4 7.659 0 5.155-4.179 9.333-9.333 9.333s-9.333-4.179-9.333-9.333c0-3.159 1.569-5.951 3.97-7.64l0.030-0.020zM10.667 21.333c0 2.946 2.388 5.333 5.333 5.333s5.333-2.388 5.333-5.333v0h-10.667z" fill="rgba(22,119,255,1)"></path>
+    </g>
+  </svg>

assets/img/riFill-time-fill.svg

@@ -0,0 +1,6 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 32 32" width="20" height="20" style="" filter="none">
+    
+    <g>
+    <path d="M16 29.333c-7.364 0-13.333-5.969-13.333-13.333s5.969-13.333 13.333-13.333 13.333 5.969 13.333 13.333-5.969 13.333-13.333 13.333zM17.333 16v-6.667h-2.667v9.333h8v-2.667h-5.333z" fill="rgba(126,147,176,1)"></path>
+    </g>
+  </svg>

assets/img/riLine-map-pin-line 1.svg

@@ -0,0 +1,6 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 32 32" width="14" height="14" style="" filter="none">
+    
+    <g>
+    <path d="M16 27.867l6.6-6.6c1.689-1.689 2.733-4.022 2.733-6.599 0-5.155-4.179-9.333-9.333-9.333s-9.333 4.179-9.333 9.333c0 2.577 1.045 4.91 2.733 6.599l6.6 6.6zM16 31.637l-8.485-8.485c-2.172-2.172-3.515-5.172-3.515-8.485 0-6.627 5.373-12 12-12s12 5.373 12 12c0 3.314-1.343 6.314-3.515 8.485l-8.485 8.485zM16 17.333c1.473 0 2.667-1.194 2.667-2.667s-1.194-2.667-2.667-2.667v0c-1.473 0-2.667 1.194-2.667 2.667s1.194 2.667 2.667 2.667v0zM16 20c-2.946 0-5.333-2.388-5.333-5.333s2.388-5.333 5.333-5.333v0c2.946 0 5.333 2.388 5.333 5.333s-2.388 5.333-5.333 5.333v0z" fill="rgba(119,119,119,1)"></path>
+    </g>
+  </svg>

components/energyCenterTabbar.vue

@@ -35,7 +35,7 @@
 						iconPath: img3,
 						selectedIconPath: img4,
 						text: '工单',
-						pagePath2: "/pages/workorderManagement/workorderManagement",
+						pagePath2: "/pages/workOrderManagement/workOrderManagement",
 						
 					},
 					

pages.json

@@ -1,105 +1,172 @@
 {
 
 	"pages": [ //pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages
-		
-        {
-        	"path" : "pages/statistics/statistics",
-        	"style" : 
-        	{
-        		"navigationBarTitleText" : "",
-        		"enablePullDownRefresh" : false
-        	}
-        },
-        {
-        	"path" : "pages/workorderManagement/workorderManagement",
-        	"style" : 
-        	{
-        		"navigationBarTitleText" : "",
-        		"enablePullDownRefresh" : false
-        	}
-        },
-        {
-        	"path" : "pages/mine/mine",
-        	"style" : 
-        	{
-        		"navigationBarTitleText" : "",
-        		"enablePullDownRefresh" : false
-        	}
-        },
-        {
-        	"path" : "pages/abnormal/abnormalDeviceRanking",
-        	"style" : 
-        	{
-        		"navigationBarTitleText" : "",
-        		"enablePullDownRefresh" : false
-        	}
-        },
-        {
-        	"path" : "pages/abnormal/abnormalAlarmRecord",
-        	"style" : 
-        	{
-        		"navigationBarTitleText" : "",
-        		"enablePullDownRefresh" : false
-        	}
-        },
-        {
-        	"path" : "pages/abnormal/abnormalAlarmDetails",
-        	"style" : 
-        	{
-        		"navigationBarTitleText" : "",
-        		"enablePullDownRefresh" : false
-        	}
-        },
-        {
-        	"path" : "pages/equipmentDataMonitoring/dataMonitoring-list",
-        	"style" : 
-        	{
-        		"navigationBarTitleText" : "",
-        		"enablePullDownRefresh" : false
-        	}
-        },
-        {
-        	"path" : "pages/equipmentDataMonitoring/dataMonitoring-map",
-        	"style" : 
-        	{
-        		"navigationBarTitleText" : "",
-        		"enablePullDownRefresh" : false
-        	}
-        },
-        {
-        	"path" : "pages/equipmentDataMonitoring/equipmentElectricity",
-        	"style" : 
-        	{
-        		"navigationBarTitleText" : "",
-        		"enablePullDownRefresh" : false
-        	}
-        },
-        {
-        	"path" : "pages/equipmentDataMonitoring/electronicMonitoring",
-        	"style" : 
-        	{
-        		"navigationBarTitleText" : "",
-        		"enablePullDownRefresh" : false
-        	}
-        },
-        {
-        	"path" : "pages/equipmentDataMonitoring/3PhaseCurrentDetails",
-        	"style" : 
-        	{
-        		"navigationBarTitleText" : "",
-        		"enablePullDownRefresh" : false
-        	}
-        },
-        {
-        	"path" : "pages/equipmentDataMonitoring/electricityStatistics",
-        	"style" : 
-        	{
-        		"navigationBarTitleText" : "",
-        		"enablePullDownRefresh" : false
-        	}
-        },
+
+		{
+			"path": "pages/statistics/statistics",
+			"style": {
+				"navigationBarTitleText": "",
+				"enablePullDownRefresh": false
+			}
+		},
+		{
+			"path": "pages/workOrderManagement/workOrderManagement",
+			"style": {
+				"navigationBarTitleText": "",
+				"enablePullDownRefresh": false
+			}
+		},
+		{
+			"path": "pages/mine/mine",
+			"style": {
+				"navigationBarTitleText": "",
+				"enablePullDownRefresh": false
+			}
+		},
+		{
+			"path": "pages/abnormal/abnormalDeviceRanking",
+			"style": {
+				"navigationBarTitleText": "",
+				"enablePullDownRefresh": false
+			}
+		},
+		{
+			"path": "pages/abnormal/abnormalAlarmRecord",
+			"style": {
+				"navigationBarTitleText": "",
+				"enablePullDownRefresh": false
+			}
+		},
+		{
+			"path": "pages/abnormal/abnormalAlarmDetails",
+			"style": {
+				"navigationBarTitleText": "",
+				"enablePullDownRefresh": false
+			}
+		},
+		{
+			"path": "pages/equipmentDataMonitoring/dataMonitoring-list",
+			"style": {
+				"navigationBarTitleText": "",
+				"enablePullDownRefresh": false
+			}
+		},
+		{
+			"path": "pages/equipmentDataMonitoring/dataMonitoring-map",
+			"style": {
+				"navigationBarTitleText": "",
+				"enablePullDownRefresh": false
+			}
+		},
+		{
+			"path": "pages/equipmentDataMonitoring/equipmentElectricity",
+			"style": {
+				"navigationBarTitleText": "",
+				"enablePullDownRefresh": false
+			}
+		},
+		{
+			"path": "pages/equipmentDataMonitoring/electronicMonitoring",
+			"style": {
+				"navigationBarTitleText": "",
+				"enablePullDownRefresh": false
+			}
+		},
+		{
+			"path": "pages/equipmentDataMonitoring/3PhaseCurrentDetails",
+			"style": {
+				"navigationBarTitleText": "",
+				"enablePullDownRefresh": false
+			}
+		},
+		{
+			"path": "pages/equipmentDataMonitoring/electricityStatistics",
+			"style": {
+				"navigationBarTitleText": "",
+				"enablePullDownRefresh": false
+			}
+		},
+		{
+			"path": "pages/login/login",
+			"style": {
+				"navigationBarTitleText": "",
+				"enablePullDownRefresh": false
+			}
+		},
+		{
+			"path": "pages/equipmentDataMonitoring/electricityDetails",
+			"style": {
+				"navigationBarTitleText": "",
+				"enablePullDownRefresh": false
+			}
+		},
+		{
+			"path": "pages/equipmentDataMonitoring/billingRules",
+			"style": {
+				"navigationBarTitleText": "",
+				"enablePullDownRefresh": false
+			}
+		},
+		{
+			"path": "pages/mine/setting",
+			"style": {
+				"navigationBarTitleText": "",
+				"enablePullDownRefresh": false
+			}
+		},
+		{
+			"path": "pages/mine/contactService",
+			"style": {
+				"navigationBarTitleText": "",
+				"enablePullDownRefresh": false
+			}
+		},
+		{
+			"path": "pages/mine/cancelAccount",
+			"style": {
+				"navigationBarTitleText": "",
+				"enablePullDownRefresh": false
+			}
+		},
+		{
+			"path": "pages/mine/changePassword",
+			"style": {
+				"navigationBarTitleText": "",
+				"enablePullDownRefresh": false
+			}
+		},
+		{
+			"path": "pages/mine/changePhone",
+			"style": {
+				"navigationBarTitleText": "",
+				"enablePullDownRefresh": false
+			}
+		},
+		{
+			"path": "pages/mine/findBackPassword",
+			"style": {
+				"navigationBarTitleText": "",
+				"enablePullDownRefresh": false
+			}
+		},
+		{
+			"path": "pages/workOrderManagement/workOrderMap",
+			"style": {
+				"navigationBarTitleText": "",
+				"enablePullDownRefresh": false
+			}
+		},
+		{
+			"path": "pages/workOrderManagement/workOrderStatistics",
+			"style": {
+				"navigationBarTitleText": "",
+				"enablePullDownRefresh": false
+			}
+		}
+
+        ,
         {
-        	"path" : "pages/login/login",
+        	"path" : "pages/workOrderManagement/workOrderMap",
         	"style" : 
         	{
         		"navigationBarTitleText" : "",
@@ -107,7 +174,7 @@
         	}
         },
         {
-        	"path" : "pages/equipmentDataMonitoring/electricityDetails",
+        	"path" : "pages/workOrderManagement/workOrderStatistics",
         	"style" : 
         	{
         		"navigationBarTitleText" : "",
@@ -115,64 +182,20 @@
         	}
         },
         {
-        	"path" : "pages/equipmentDataMonitoring/billingRules",
+        	"path" : "pages/workOrderManagement/faultReport",
         	"style" : 
         	{
         		"navigationBarTitleText" : "",
         		"enablePullDownRefresh" : false
         	}
-        },
-		{
-			"path" : "pages/mine/setting",
-			"style" : 
-			{
-				"navigationBarTitleText" : "",
-				"enablePullDownRefresh" : false
-			}
-		},
-		{
-			"path" : "pages/mine/contactService",
-			"style" : 
-			{
-				"navigationBarTitleText" : "",
-				"enablePullDownRefresh" : false
-			}
-		},
-		{
-			"path" : "pages/mine/cancelAccount",
-			"style" : 
-			{
-				"navigationBarTitleText" : "",
-				"enablePullDownRefresh" : false
-			}
-		},
-		{
-			"path" : "pages/mine/changePassword",
-			"style" : 
-			{
-				"navigationBarTitleText" : "",
-				"enablePullDownRefresh" : false
-			}
-		},
-		{
-			"path" : "pages/mine/changePhone",
-			"style" : 
-			{
-				"navigationBarTitleText" : "",
-				"enablePullDownRefresh" : false
-			}
-		},
-		{
-			"path" : "pages/mine/findBackPassword",
-			"style" : 
-			{
-				"navigationBarTitleText" : "",
-				"enablePullDownRefresh" : false
-			}
-		}
+        }
        
     ],
 
+
+	
+
+
 	"globalStyle": {
 		"navigationStyle": "custom", // 隐藏系统导航栏
 		"navigationBarTitleText": "荆鹏电管家",

pages/equipmentDataMonitoring/dataMonitoring-list.vue

@@ -19,10 +19,10 @@
 			</view>
 		</view>
 		<view class="dropdown">
-				<u-dropdown>
+				<u-dropdown-change>
 					<u-dropdown-item v-model="value1" title="全部设备" :options="options1"></u-dropdown-item>
 					<u-dropdown-item v-model="value2" title="全部状态" :options="options2"></u-dropdown-item>
-				</u-dropdown>
+				</u-dropdown-change>
 			</view>
 			
 			<view class="main">
@@ -387,6 +387,9 @@
 </script>
 
 <style lang="scss" scoped>
+	page{
+		padding-bottom: 100rpx;
+	}
 	.back {
 		z-index: 999;
 		width: 200rpx;
@@ -406,12 +409,13 @@
 	.dropdown{
 		background-color: #fff;
 		position: sticky;
-		 top: 0;	
-		// z-index: 999;
+		top: 87rpx;	
+		z-index: 999;
 	}
 	
 	.main{
 		background-color: #fff;
+		margin-top: 80rpx;
 		.item{
 			border-bottom: 1px solid rgba(245,245,245,1);
 			padding: 32rpx 32rpx  16rpx 32rpx;

pages/equipmentDataMonitoring/dataMonitoring-map.vue

@@ -43,7 +43,7 @@
 						<image class="img1" src="@/assets/img/antFill-alert.svg" mode=""></image>
 					</view>
 					<view class="icon2-right">
-						<view class="corner2"></view>
+						
 						<view class="corner2-top">
 							荆鹏软件园01
 						</view>
@@ -51,6 +51,7 @@
 							<image class="img2" src="@/assets/img/antFill-alert(2).svg"></image>正常
 						</view>
 					</view>
+					<view class="corner2"></view>
 				</view>
 				<view class="card">
 					<view class="item">
@@ -373,7 +374,7 @@
 						color: #ffffff;
 						line-height: 36rpx;
 						padding-left: 8rpx;
-						font-size: 14px;
+						font-size: 28rpx;
 						.corner2-top{
 							font-weight: bold;
 							    white-space: nowrap;

pages/equipmentDataMonitoring/electronicMonitoring.vue

@@ -23,8 +23,8 @@
 				<view class="back">
 					<u-icon name="arrow-left" color="#fff" size="36"></u-icon>
 				</view>
-				<view class="title" @click="equipmentShow=true">
-					荆鹏软件园01<u-icon name="arrow-down" color="#fff" size="24"></u-icon>
+				<view class="title" >
+					荆鹏软件园01<u-icon name="arrow-down" color="#fff" size="24" @click="equipmentShow=true"></u-icon>
 				</view>
 				<view class="right" @click="tabsFrom.show2=true">
 					<image class="img" src="@/assets/img/riLine-calendar-todo-line 1.svg" mode=""></image>
@@ -452,7 +452,9 @@
 							type: 'shadow'
 						}
 					},
-					legend: {},
+					legend: {
+						show: false
+					},
 					grid: {
 						left: '3%',
 						right: '4%',
@@ -473,6 +475,7 @@
 						type: 'value'
 					}],
 					series: [{
+						name: '用电量',
 						type: 'bar',
 						data: [2, 8, 7, 10, 40, 48, 56, 61, 59, 36, 8, 4],
 						label: {
@@ -549,7 +552,7 @@
 	.background {
 		background-color: rgba(22, 119, 255, 1);
 		padding-bottom: 100rpx;
-
+        padding-top: 88rpx;
 
 
 		/deep/.u-border-bottom:after {

pages/statistics/statistics.vue

@@ -94,15 +94,16 @@
 						用电量 (度)
 					</view>
 					<view class="change">
-						<image class="change-img" src="@/assets/img/refresh-line.svg" mode=""></image>
+						<image class="change-img" :class="pRotation ? 'rotation-img' : ''"
+							src="@/assets/img/refresh-line.svg" mode=""></image>
 						<text>换一批</text>
 					</view>
-					<view class="check-all">
+					<view class="check-all" @click="toEquipmentElectricity">
 						查看全部<u-icon name="arrow-right" size="24" color="#838383"></u-icon>
 					</view>
 				</view>
 				<view class="electricity">
-					<view class="item" v-for="item in 3">
+					<view class="item" v-for="item in 3" @click="toElectronicMonitoring">
 						
 						<view class="equipment">
 							<view class="equipment1">
@@ -187,7 +188,8 @@
 						设备数据监测
 					</view>
 					<view class="change">
-						<image class="change-img" src="@/assets/img/refresh-line.svg" mode=""></image>
+						<image class="change-img" :class="eRotation ? 'rotation-img' : ''"
+							src="@/assets/img/refresh-line.svg" mode=""></image>
 						<text>换一批</text>
 					</view>
 					<view class="check-all">
@@ -414,6 +416,8 @@
 		},
 		data() {
 			return {
+				pRotation: false,
+				eRotation: false,
 				myPieChart: null,
 				myBarChart: null,
 				myLineChart: null,
@@ -437,6 +441,28 @@
 			this.getLineCharts();
 		},
 		methods: {
+			// 设备数据监测
+			getEquipmentDataMonitoring() {
+				this.eRotation = true;
+				this.eRotation = false;
+			},
+			// 异常告警记录
+			getAbnormalAlarmRecord() {
+				
+			},
+			// 用电量
+			getPowerConsumption() {
+				this.pRotation = true;
+				this.pRotation = false;
+			},
+			// 累计工单
+			getAccumulatedWorkOrders() {
+				
+			},
+			// 累计报警
+			getAccumulatedAlarms() {
+				
+			},
 			getLineCharts() {
 				if (!this.myLineChart) {
 					this.myLineChart = echarts.init(document.getElementById('lineEcharts'));
@@ -641,12 +667,30 @@
 				uni.navigateTo({
 					url: '/pages/workorderManagement/workorderManagement'
 				})
+			},
+			toEquipmentElectricity() {
+				uni.navigateTo({
+					url: '/pages/equipmentDataMonitoring/equipmentElectricity'
+				})
+			},
+			toElectronicMonitoring() {
+				uni.navigateTo({
+					url: '/pages/equipmentDataMonitoring/electronicMonitoring'
+				})
 			}
 		}
 	}
 </script>
 
 <style lang="scss" scoped>
+	.rotation-img {
+		animation: rotation 2s linear infinite;
+	}
+	@keyframes rotation{
+		from {transform: rotate(0deg)}
+		to {transform: rotate(360deg)}
+	}
+	
 	page {
 		padding-bottom: 200rpx;
 	}

pages/workorderManagement/workOrderMap.vue

@@ -0,0 +1,351 @@
+<template>
+	<view>
+		<u-navbar title="工单地图" title-color="#101010">
+
+		</u-navbar>
+		<view class="tabs">
+			<u-tabs :list="list" :is-scroll="false" :current="current" @change="change"></u-tabs>
+		</view>
+		<!-- 地图 -->
+		<view class="map">
+			<image class="map-img" src="@/assets/img/map.png" mode=""></image>
+			<!-- 标注1 -->
+			<view class="location1">
+				<image class="img" src="@/assets/img/riFill-cloud-off-fill1.svg" mode=""></image>
+				<view class="corner">
+
+				</view>
+			</view>
+			<!-- 标注2 -->
+			<view class="location2">
+				<view class="icon2-left">
+					<image class="img1" src="@/assets/img/riFill-temp-cold-fill1.svg" mode=""></image>
+				</view>
+				<view class="icon2-right">
+					
+					<view class="corner2-top">
+						荆鹏软件园01
+					</view>
+					<view class="corner2-bottom">
+						温度异常
+					</view>
+				</view>
+				<view class="corner2"></view>
+			</view>
+			<view class="card">
+				<view class="item">
+					<view class="title">
+						<view class="icon-box">
+							<image class="img" src="@/assets/img/riFill-temp-cold-fill1.svg" mode=""></image>
+						</view>
+						<view class="equipment">
+							<view class="name1">
+								荆鹏软件园01
+							</view>
+							<view class="name2">
+								荆鹏集团
+							</view>
+						</view>
+						<!-- 状态 -->
+						<view class="state">
+
+							<view class="icon ">
+
+							</view>
+							<view class="text">
+								温度异常
+							</view>
+
+
+						</view>
+					</view>
+					<!-- 其他信息 -->
+					<view class="else-infos">
+						<view class="infos">
+							<view class="infos-item">
+								<view class="item-icon">
+									<image class="icon-img" src="@/assets/img/riLine-map-pin-line 1.svg" mode=""></image>
+								</view>
+								<view class="item-value">
+									荆州市沙市区江津东路155号荆鹏软件园
+								</view>
+							</view>
+							<view class="infos-item">
+								<view class="item-icon">
+									<image class="icon-img" src="@/assets/img/riLine-map-pin-line 1.svg" mode=""></image>
+								</view>
+								<view class="item-value">
+									2024-02-24 12:00:00
+								</view>
+							</view>
+						</view>
+						<view class="navigation">
+							导航
+							<view class="icon">
+								<image class="navigation-img" src="@/assets/img/riFill-navigation-fill 1.svg" mode=""></image>
+							</view>
+						</view>
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				list: [{
+					name: '全部'
+				}, {
+					name: '待指派(1)'
+				}, {
+					name: '进行中(2)',
+
+				}, {
+					name: '已解决(3)',
+
+				}],
+				current: 0
+			}
+		},
+		methods: {
+			toDataMonitoringList() {
+				uni.navigateBack()
+			},
+			change(index) {
+				this.current = index;
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.tabs {
+		background-color: #fff;
+		height: 96rpx;
+		position: sticky;
+		top: 88rpx;
+		z-index: 999;
+	}
+
+	// 地图
+	.map {
+		position: relative;
+
+		.map-img {
+			width: 100%;
+			height: 100vh;
+		}
+
+		.location1 {
+			width: 36px;
+			height: 36px;
+
+			text-align: center;
+			border: 2px solid rgba(22, 119, 255, 1);
+			border-radius: 999px;
+			display: flex;
+			align-items: center;
+			justify-content: center;
+			position: absolute;
+			top: 89px;
+			left: 38px;
+
+			.img {
+				width: 40rpx;
+				height: 40rpx;
+			}
+
+			.corner {
+				width: 0;
+				height: 0;
+				position: absolute;
+				top: 34px;
+				left: 0;
+				right: 0;
+				margin: auto;
+				border-bottom: 8rpx solid transparent;
+				border-left: 8rpx solid transparent;
+				border-right: 8rpx solid transparent;
+				border-top: 12rpx solid rgba(22, 119, 255, 1);
+			}
+		}
+
+		.location2 {
+			width: 280rpx;
+			border-radius: 50px;
+			background-color: rgba(22, 119, 255, 1);
+			display: flex;
+			position: absolute;
+			top: 370rpx;
+			left: 280rpx;
+            
+			.icon2-left {
+				width: 72rpx;
+				height: 72rpx;
+				line-height: 72rpx;
+				text-align: center;
+				border: 1px solid rgba(0, 185, 98, 100);
+				border-radius: 999px;
+				background-color: #fff;
+				display: flex;
+				align-items: center;
+				justify-content: center;
+				
+               
+				.img1 {
+					width: 40rpx;
+					height: 40rpx;
+				}
+			}
+
+			.icon2-right {
+				color: #ffffff;
+				line-height: 36rpx;
+				padding-left: 8rpx;
+				font-size: 28rpx;
+                
+				.corner2-top {
+					font-weight: bold;
+				}
+
+				.corner2-bottom {
+					font-size: 24rpx;
+
+					.img2 {
+						width: 24rpx;
+						height: 24rpx;
+					}
+				}
+			}
+
+			.corner2 {
+				width: 0;
+				height: 0;
+				position: absolute;
+				top: 72rpx;
+				left: 0;
+				right: 0;
+				margin: auto;
+				border-bottom: 6px solid transparent;
+				border-left: 6px solid transparent;
+				border-right: 6px solid transparent;
+				border-top: 8px solid rgba(22, 119, 255, 1);
+
+			}
+		}
+
+		// 卡片
+		.card {
+			border-radius: 8px;
+			border: 1px solid rgba(232, 232, 232, 1);
+			box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.4);
+			background-color: rgba(255, 255, 255, 1);
+			position: fixed;
+			left: 24rpx;
+			right: 24rpx;
+			bottom: 32rpx;
+
+			.item {
+				border-bottom: 1px solid rgba(245, 245, 245, 1);
+				padding: 32rpx 16rpx 16rpx 16rpx;
+
+				.title {
+					display: flex;
+					align-items: flex-start;
+
+					.icon-box {
+						width: 72rpx;
+						height: 72rpx;
+						border-radius: 4px;
+						display: flex;
+						align-items: center;
+						justify-content: center;
+						background-color: rgba(219, 234, 255, 1);
+
+						.img {
+							width: 48rpx;
+							height: 48rpx;
+						}
+					}
+
+					.equipment {
+						margin-left: 16rpx;
+
+						.name1 {
+							color: rgba(51, 51, 51, 1);
+						}
+
+						.name2 {
+							color: rgba(119, 119, 119, 1);
+							font-size: 24rpx;
+							margin-top: 4rpx;
+						}
+					}
+
+					// 状态
+					.state {
+						display: flex;
+						align-items: center;
+						margin-left: auto;
+
+						.icon {
+							width: 8px;
+							height: 8px;
+							background-color: rgba(22, 119, 255, 1);
+							border-radius: 999px;
+						}
+
+						.text {
+							color: rgba(51, 51, 51, 1);
+							margin-left: 8rpx;
+							font-weight: bold;
+						}
+					}
+				}
+
+				// 其他信息
+				.else-infos {
+					display: flex;
+					justify-content: space-between;
+					align-items: baseline;
+					margin-top: 16rpx;
+
+					.infos {
+						color: rgba(119,119,119,1);
+						font-size: 24rpx;
+						.infos-item {
+							display: flex;
+							align-items: center;
+                            margin-bottom: 8rpx;
+							.item-icon {
+								display: flex;
+								align-items: center;
+								.icon-img {
+									width: 28rpx;
+									height: 28rpx;
+									
+								}
+							}
+						}
+					}
+					.navigation{
+						color: #333333;
+						display: flex;
+						align-items: center;
+						.navigation-img{
+							width: 28rpx;
+							height: 28rpx;
+							vertical-align: middle;
+							margin-left: 8rpx;
+							 transform: scaleX(-1);
+						}
+					}
+				}
+
+			}
+		}
+	}
+</style>

pages/workorderManagement/workOrderStatistics.vue

@@ -0,0 +1,278 @@
+<template>
+	<view>
+		<u-navbar title="工单统计"  title-color="#fff" :background="background"  back-icon-color="#ffffff" ></u-navbar>
+		
+		<view class="main">
+			<!-- 标签 -->
+			<view class="tabs">
+				<view class="tabs-item item-checked">
+					当天
+				</view>
+				<view class="tabs-item">
+					一周
+				</view>
+				<view class="tabs-item">
+					当天
+				</view>
+				<view class="tabs-item">
+					自定义
+				</view>
+			</view>
+			<!-- 数据统计 -->
+			<view class="data-statistics">
+				<view class="title">
+					数据统计
+				</view>
+				<view class="state">
+					<view class="state-item state1" >
+						<view class="state-classify">
+							待指派
+						</view>
+						<view class="state-number">
+							2
+						</view>
+					</view>
+					<view class="state-item state2" >
+						<view class="state-classify">
+							进行中
+						</view>
+						<view class="state-number">
+							3
+						</view>
+					</view>
+					<view class="state-item state3" >
+						<view class="state-classify">
+							已解决
+						</view>
+						<view class="state-number">
+							33
+						</view>
+					</view>
+					<view class="state-item state4" >
+						<view class="state-classify">
+							已关闭
+						</view>
+						<view class="state-number">
+							34
+						</view>
+					</view>
+				</view>
+			</view>
+			<!-- 工单状态 -->
+			<view class="workOrder-state">
+				<view class="title">
+					工单状态
+				</view>
+				<view class="progress">
+					<view class="progress-item">
+						<view class="circle-progress">
+							<u-circle-progress active-color="#FF7B00" width="136" :percent="12" >
+									<view class="u-progress-content">
+										
+										<text class='u-progress-info1'>12%</text>
+									</view>
+								</u-circle-progress>
+						</view>
+						<view class="state">
+							待指派
+						</view>
+					</view>
+					<view class="progress-item">
+						<view class="circle-progress">
+							<u-circle-progress active-color="#008FA9" width="136" :percent="15">
+									<view class="u-progress-content">
+										
+										<text class='u-progress-info2'>15%</text>
+									</view>
+								</u-circle-progress>
+						</view>
+						<view class="state">
+							进行中
+						</view>
+					</view>
+					<view class="progress-item">
+						<view class="circle-progress">
+							<u-circle-progress active-color="#18C272" width="136" :percent="73">
+									<view class="u-progress-content">
+										
+										<text class='u-progress-info3'>73%</text>
+									</view>
+								</u-circle-progress>
+						</view>
+						<view class="state">
+							已解决
+						</view>
+					</view>
+				</view>
+			</view>
+			
+		</view>
+		<!-- 每月工单数量 -->
+		<view class="workOrder-amount">
+			<view class="title">
+				每月工单数量
+			</view>
+			<view class="chat">
+				
+				<image class="chat-img" src="@/assets/img/AUgyKM0@1x2.png" mode=""></image>
+				
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				background:{
+					backgroundColor:'#1677FF'
+				}
+			}
+		},
+		methods: {
+			
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	page{
+		padding-bottom: 100rpx;
+	}
+	/deep/.uicon-nav-back{
+		color: #FFF !important;
+		
+	}
+	.main{
+		background: linear-gradient(180deg, rgba(22,119,255,1) 0%,rgba(22,119,255,0) 100%);
+		height: 720rpx;
+		// 标签
+		.tabs{
+			display: flex;
+			justify-content: space-between;
+			padding: 24rpx 32rpx;
+			.tabs-item{
+				width: 144rpx;
+				line-height: 56rpx;
+				text-align: center;
+				color: rgba(255,255,255,0.6);
+			}
+			.item-checked{
+				border: 1px solid rgba(255,255,255,1);
+				color: rgba(255,255,255,1);
+				border-radius: 50px;
+			}
+		}
+		// 数据统计
+		.data-statistics{
+			margin: 24rpx 32rpx;
+			border-radius: 8px;
+			background-color: rgba(255,255,255,1);
+			padding: 24rpx;
+			.title{
+				color: rgba(16,16,16,1);
+				font-size: 36rpx;
+				font-weight: bold;
+			}
+			.state{
+				display: flex;
+				justify-content: space-between;
+				margin-top: 24rpx;
+				.state-item{
+					width: 72px;
+					height: 72px;
+					border-radius: 8px;
+					color: rgba(255,255,255,1);
+					text-align: center;
+					padding: 24rpx;
+					font-weight: bold;
+					.state-classify{
+						
+						font-size: 32rpx;
+					}
+					.state-number{
+						margin-top: 8rpx;
+						font-size: 40rpx;
+					}
+				}
+				.state1{
+					background: linear-gradient(180deg, rgba(255,174,0,1) 0%,rgba(255,123,0,1) 100%);
+				}
+				.state2{
+					background: linear-gradient(178.54deg, rgba(50,204,213,1) 0%,rgba(0,143,169,1) 99.73%);
+				}
+				.state3{
+					background: linear-gradient(180deg, rgba(24,194,114,1) 0%,rgba(0,148,79,1) 100%);
+				}
+				.state4{
+					background: linear-gradient(180deg, rgba(187,187,187,1) 0%,rgba(153,153,153,1) 100%);
+				}
+			}
+		}
+	
+	  // 工单状态
+	.workOrder-state{
+		border-radius: 8px;
+		background-color: rgba(255,255,255,1);
+		margin: 24rpx 32rpx;
+		padding: 24rpx;
+		.title{
+			color: rgba(16,16,16,1);
+			font-size: 36rpx;
+			font-weight: bold;
+		}
+		.progress{
+			display: flex;
+			justify-content: space-between;
+			margin-top: 24rpx;
+			.progress-item{
+				text-align: center;
+				.state{
+					color: rgba(51,51,51,1);
+					margin-top: 16rpx;
+				}
+			}
+			.u-progress-info1{
+				color:#FF7B00;
+				
+				font-weight: bold;
+			}
+			.u-progress-info2{
+				color:#008FA9;
+				
+				font-weight: bold;
+			}
+			.u-progress-info3{
+				color:#18C272;
+				
+				font-weight: bold;
+			}
+		}
+	}
+	
+	
+	}
+	// 每月工单数量
+.workOrder-amount{
+		border-radius: 8px;
+		background-color: rgba(255,255,255,1);
+		margin: 24rpx 32rpx;
+		padding: 24rpx 0;
+		.title{
+			color: rgba(16,16,16,1);
+			font-size: 36rpx;
+			font-weight: bold;
+			padding: 0 24rpx;
+		}
+		.chat{
+			width: 100%;
+			height: 692rpx;
+			margin-top: 54rpx;
+			.chat-img{
+				width: 100%;
+				height: 100%;
+			}
+		}
+	}
+</style>

pages/workorderManagement/workorderManagement.vue

@@ -1,6 +1,251 @@
 <template>
 	<view>
-		<u-navbar title="工单管理"  title-color="#101010" ></u-navbar>
+		
+		<view class="navbar-c">
+			<view class="back" @click="toStatistics">
+				<image class="img" src="@/assets/img/riLine-road-map-line.svg" mode=""></image>
+			</view>
+			<view class="title">
+				工单管理
+			</view>
+			<view class="right" >
+				故障上报
+			</view>
+		</view>
+		
+		<!-- 搜索 -->
+		<view class="search-box">
+			<u-search placeholder="搜索" bg-color="#fff" height="80" :show-action="true"  v-model="keyword">
+				
+				
+			</u-search>
+			
+		</view>
+		<!-- 我的工单 -->
+		<view class="my-work-order">
+			<view class="title">
+				<view class="name">
+					<view class="icon">
+						<image class="img" src="@/assets/img/riFill-bar-chart-fill.svg" mode=""></image>
+					</view>
+					我的工单
+				</view>
+				<view class="more">
+					工单统计<u-icon name="arrow-right" color="#777777"></u-icon>
+				</view>
+			</view>
+			<!-- 分类 -->
+			<view class="classify">
+				<view class="item item-checked" >
+					全部18
+					<view class="checked-circle">
+						
+					</view>
+				</view>
+				<view class="item">
+					待指派 2
+				</view>
+				<view class="item">
+					进行中 3
+				</view>
+				<view class="item">
+					已解决 13
+				</view>
+			</view>
+			<!-- 工单详情 -->
+			<view class="work-order">
+				<!-- 紧急 -->
+				<view class="urgency">
+					紧急
+				</view>
+				<view class="order-item">
+					<view class="item-icon">
+						<image class="img" src="@/assets/img/riFill-building-fill1.svg" mode=""></image>
+					</view>
+					<view class="item-value value-bold">
+						荆鹏集团-荆鹏软件园01
+					</view>
+				</view>
+				<view class="order-item">
+					<view class="item-icon">
+						<image class="img" src="@/assets/img/riFill-alert-fill.svg" mode=""></image>
+					</view>
+					<view class="item-value value-bold">
+						温度过高
+					</view>
+				</view>
+				<view class="order-item">
+					<view class="item-icon">
+						<image class="img" src="@/assets/img/riFill-map-pin-fill.svg" mode=""></image>
+					</view>
+					<view class="item-value">
+						沙市区江津东路附155号
+					</view>
+				</view>
+				
+				<view class="order-item">
+					<view class="item-icon">
+						<image class="img" src="@/assets/img/riFill-time-fill.svg" mode=""></image>
+					</view>
+					<view class="item-value">
+						2024-02-04 20:00:00
+					</view>
+				</view>
+				
+				<view class="button">
+					<view class="state">
+						待指派
+					</view>
+					<view class="btn">
+						<button class="close">关闭</button>
+						<button class="reminder">催单</button>
+					</view>
+				</view>
+			</view>
+			
+			<view class="work-order">
+				
+				<view class="order-item">
+					<view class="item-icon">
+						<image class="img" src="@/assets/img/riFill-building-fill1.svg" mode=""></image>
+					</view>
+					<view class="item-value value-bold">
+						荆鹏集团-荆鹏软件园01
+					</view>
+				</view>
+				<view class="order-item">
+					<view class="item-icon">
+						<image class="img" src="@/assets/img/riFill-alert-fill.svg" mode=""></image>
+					</view>
+					<view class="item-value value-bold">
+						温度过高
+					</view>
+				</view>
+				<view class="order-item">
+					<view class="item-icon">
+						<image class="img" src="@/assets/img/riFill-map-pin-fill.svg" mode=""></image>
+					</view>
+					<view class="item-value">
+						沙市区江津东路附155号
+					</view>
+				</view>
+				
+				<view class="order-item">
+					<view class="item-icon">
+						<image class="img" src="@/assets/img/riFill-time-fill.svg" mode=""></image>
+					</view>
+					<view class="item-value">
+						2024-02-04 20:00:00
+					</view>
+				</view>
+				
+				<view class="button">
+					<view class="state state2">
+						进行中
+					</view>
+					<view class="btn">
+						
+						<button class="resolved">确认解决</button>
+					</view>
+				</view>
+			</view>
+			
+			<view class="work-order">
+				
+				<view class="order-item">
+					<view class="item-icon">
+						<image class="img" src="@/assets/img/riFill-building-fill1.svg" mode=""></image>
+					</view>
+					<view class="item-value value-bold">
+						荆鹏集团-荆鹏软件园01
+					</view>
+				</view>
+				<view class="order-item">
+					<view class="item-icon">
+						<image class="img" src="@/assets/img/riFill-alert-fill.svg" mode=""></image>
+					</view>
+					<view class="item-value value-bold">
+						温度过高
+					</view>
+				</view>
+				<view class="order-item">
+					<view class="item-icon">
+						<image class="img" src="@/assets/img/riFill-map-pin-fill.svg" mode=""></image>
+					</view>
+					<view class="item-value">
+						沙市区江津东路附155号
+					</view>
+				</view>
+				
+				<view class="order-item">
+					<view class="item-icon">
+						<image class="img" src="@/assets/img/riFill-time-fill.svg" mode=""></image>
+					</view>
+					<view class="item-value">
+						2024-02-04 20:00:00
+					</view>
+				</view>
+				
+				<view class="button">
+					<view class="state state3">
+						已解决
+					</view>
+					<view class="btn">
+						
+						<button class="view">查看详情</button>
+					</view>
+				</view>
+			</view>
+			
+			<view class="work-order">
+				
+				<view class="order-item">
+					<view class="item-icon">
+						<image class="img" src="@/assets/img/riFill-building-fill1.svg" mode=""></image>
+					</view>
+					<view class="item-value value-bold">
+						荆鹏集团-荆鹏软件园01
+					</view>
+				</view>
+				<view class="order-item">
+					<view class="item-icon">
+						<image class="img" src="@/assets/img/riFill-alert-fill.svg" mode=""></image>
+					</view>
+					<view class="item-value value-bold">
+						温度过高
+					</view>
+				</view>
+				<view class="order-item">
+					<view class="item-icon">
+						<image class="img" src="@/assets/img/riFill-map-pin-fill.svg" mode=""></image>
+					</view>
+					<view class="item-value">
+						沙市区江津东路附155号
+					</view>
+				</view>
+				
+				<view class="order-item">
+					<view class="item-icon">
+						<image class="img" src="@/assets/img/riFill-time-fill.svg" mode=""></image>
+					</view>
+					<view class="item-value">
+						2024-02-04 20:00:00
+					</view>
+				</view>
+				
+				<view class="button">
+					<view class="state state4">
+						已关闭
+					</view>
+					<view class="btn">
+						
+						<button class="view">查看详情</button>
+					</view>
+				</view>
+			</view>
+		</view>
+		
+		
 		<energyCenterTabbar :current="1"></energyCenterTabbar>
 	</view>
 </template>
@@ -23,5 +268,207 @@
 </script>
 
 <style lang="scss" scoped>
+	page{
+		padding-bottom: 100px;
+	}
+// 搜索
+.search-box{
+	padding: 16rpx 32rpx;
+	position: sticky;
+	top: 88rpx;
+	z-index: 999;
+	background-color:#F2F4F6;
+	/deep/.u-content{
+		border-radius: 8px !important;
+	};
+	/deep/.u-search{
+		position: relative
+	};
+
+	/deep/.u-action {
+		width: 96rpx;
+		line-height: 56rpx;
+		border-radius: 4px;
+		background-color: rgba(22,119,255,1);
+		color: rgba(255,255,255,1);
+		text-align: center;
+		z-index: 9999;
+		position: absolute;
+		right: 12rpx;
+	}
+}
+
+// 我的工单
+.my-work-order{
+	margin-top: 88rpx;
+	.title{
+		display: flex;
+		align-items: center;
+		justify-content: space-between;
+		padding: 16rpx 32rpx; 
+		.name{
+			display: flex;
+			align-items: center;
+			color: rgba(16,16,16,1);
+			font-size: 36rpx;
+			font-weight: bold;
+			.icon{
+				width: 36rpx;
+				height: 36rpx;
+				border-radius: 4px;
+				background-color: rgba(22,119,255,1);
+				display: flex;
+				align-items: center;
+				justify-content: center;
+				margin-right: 12rpx;
+				.img{
+					width: 28rpx;
+					height: 28rpx;
+					
+				}
+			}
+		}
+		.more{
+			color: #777777;
+			font-size: 32rpx;
+		}
+	}
+	// 分类
+	.classify{
+		display: flex;
+		align-items: center;
+		justify-content: space-between;
+		padding: 0 32rpx;
+		margin-top: 8rpx;
+		.item{
+			width: 160rpx;
+			line-height: 72rpx;
+			border-radius: 8px;
+			background-color: rgba(255,255,255,1);
+			border: 1px solid rgba(22,119,255,1);
+			text-align: center;
+			color: rgba(22,119,255,1);
+			font-weight: bold;
+			overflow: hidden;
+		}
+		.item-checked{
+			background: linear-gradient(180deg, rgba(78,141,246,1) 0%,rgba(22,119,255,1) 100%);
+			color: #fff;
+			position: relative;
+			.checked-circle{
+				width: 20rpx;
+				height: 20rpx;
+				background-color: rgba(255,150,0,1);
+				border-radius: 999px;
+				position: absolute;
+				bottom: -10rpx;
+				left: 50%;
+				transform: translateX(-50%);
+			}
+		}
+	}
+
+  // 工单详情
+  .work-order{
+	  border-radius: 8px;
+	  background-color: rgba(255,255,255,1);
+	  margin: 24rpx 32rpx;
+	  padding: 32rpx 24rpx 0;
+	  position: relative;
+	  // 紧急
+	  .urgency{
+		  width: 120rpx;
+		  line-height: 56rpx;
+		  border-radius: 0px 8px 0px 8px;
+		  color: rgba(255,255,255,1);
+		  font-size: 32rpx;
+		  text-align: center;
+		  background: linear-gradient(180deg, rgba(255,79,63,1) 0%,rgba(255,124,112,1) 100%);
+		  position: absolute;
+		  top: 0;
+		  right: 0;
+		  
+	  }
+	  .order-item{
+		  display: flex;
+		  align-items: center;
+		  margin-bottom: 16rpx;
+		  .item-icon{
+			  .img{
+				  width: 40rpx;
+				  height: 40rpx;
+				  vertical-align: middle;
+			  }
+		  }
+		  .item-value{
+			  color: rgba(51,51,51,1);
+			  font-size: 32rpx;
+			  margin-left: 16rpx;
+		  }
+		  .value-bold{
+			  font-weight: bold;
+		  }
+	  }
+  }
+  // 按钮
+  .button{
+	  margin-top: 32rpx;
+	  border-top: 1px solid rgba(232,232,232,1);
+	  padding: 20rpx 0;
+	  display: flex;
+	  justify-content: space-between;
+	  align-items: center;
+	  .state{
+		  color: rgba(255,123,0,1);
+	  }
+	  .state2{
+		  color: rgba(22,119,255,1);
+	  }
+	  .state3{
+		  color: rgba(0,185,98,1);
+	  }
+	  .state4{
+		  color: rgba(119,119,119,1);
+	  }
+	  .btn{
+		  display: flex;
+		  .close{
+			  border: 1px solid rgba(187,187,187,1);
+			  width: 144rpx;
+			  height: 64rpx;
+			  line-height: 64rpx;
+			  border-radius: 4px;
+			  background-color: rgba(255,255,255,1);
+			  color: rgba(119,119,119,1);
+			  margin-right: 24rpx;
+			  font-size: 28rpx
+		  }
+		  .reminder,.resolved{
+			  width: 144rpx;
+			  height: 64rpx;
+			  line-height: 64rpx;
+			  border-radius: 4px;
+			  color: rgba(255,255,255,1);
+			  background-color: rgba(22,119,255,1);
+			  font-size: 28rpx
+		  }
+		  .resolved{
+			  width: 176rpx;
+		  }
+		  .view{
+			  width: 176rpx;
+			  height: 64rpx;
+			  line-height: 64rpx;
+			  border-radius: 4px;
+			  background-color: rgba(255,255,255,1);
+			  color: rgba(119,119,119,1);	
+			  font-size: 28rpx;
+			  border: 1px solid rgba(187,187,187,1);
+		  }
+	  }
+  }
+
+}
+
 
 </style>

uni_modules/uview-ui/components/u-dropdown-change/u-dropdown-change.vue

@@ -0,0 +1,301 @@
+<template>
+	<view class="u-dropdown">
+		<view class="u-dropdown__menu" :style="{
+			height: $u.addUnit(height)
+		}" :class="{
+			'u-border-bottom': borderBottom
+		}">
+			<view class="u-dropdown__menu__item" v-for="(item, index) in menuList" :key="index" @tap.stop="menuClick(index)">
+				<view class="u-flex">
+					<text class="u-dropdown__menu__item__text" :style="{
+						color: item.disabled ? '#c0c4cc' : (index === current || highlightIndex == index) ? activeColor : inactiveColor,
+						fontSize: $u.addUnit(titleSize)
+					}">{{item.title}}</text>
+					<view class="u-dropdown__menu__item__arrow" :class="{
+						'u-dropdown__menu__item__arrow--rotate': index === current
+					}">
+						<u-icon :custom-style="{display: 'flex'}" :name="menuIcon" :size="$u.addUnit(menuIconSize)" :color="index === current || highlightIndex == index ? activeColor : '#c0c4cc'"></u-icon>
+					</view>
+				</view>
+			</view>
+		</view>
+		<view class="u-dropdown__content" v-show="showMask" :style="[contentStyle, {
+			transition: `opacity ${duration / 1000}s linear`,
+			top: $u.addUnit(height),
+			height: contentHeight + 'px'
+		}]"
+		 @tap="maskClick" @touchmove.stop.prevent>
+			<view @tap.stop.prevent class="u-dropdown__content__popup" :style="[popupStyle]">
+				<slot></slot>
+			</view>
+			<view class="u-dropdown__content__mask"></view>
+		</view>
+	</view>
+</template>
+
+<script>
+	/**
+	 * dropdown 下拉菜单
+	 * @description 该组件一般用于向下展开菜单，同时可切换多个选项卡的场景
+	 * @tutorial http://uviewui.com/components/dropdown.html
+	 * @property {String} active-color 标题和选项卡选中的颜色（默认#2979ff）
+	 * @property {String} inactive-color 标题和选项卡未选中的颜色（默认#606266）
+	 * @property {Boolean} close-on-click-mask 点击遮罩是否关闭菜单（默认true）
+	 * @property {Boolean} close-on-click-self 点击当前激活项标题是否关闭菜单（默认true）
+	 * @property {String | Number} duration 选项卡展开和收起的过渡时间，单位ms（默认300）
+	 * @property {String | Number} height 标题菜单的高度，单位任意（默认80）
+	 * @property {String | Number} border-radius 菜单展开内容下方的圆角值，单位任意（默认0）
+	 * @property {Boolean} border-bottom 标题菜单是否显示下边框（默认false）
+	 * @property {String | Number} title-size 标题的字体大小，单位任意，数值默认为rpx单位（默认28）
+	 * @event {Function} open 下拉菜单被打开时触发
+	 * @event {Function} close 下拉菜单被关闭时触发
+	 * @example <u-dropdown></u-dropdown>
+	 */
+	export default {
+		name: 'u-dropdown',
+		props: {
+			// 菜单标题和选项的激活态颜色
+			activeColor: {
+				type: String,
+				default: '#2979ff'
+			},
+			// 菜单标题和选项的未激活态颜色
+			inactiveColor: {
+				type: String,
+				default: '#606266'
+			},
+			// 点击遮罩是否关闭菜单
+			closeOnClickMask: {
+				type: Boolean,
+				default: true
+			},
+			// 点击当前激活项标题是否关闭菜单
+			closeOnClickSelf: {
+				type: Boolean,
+				default: true
+			},
+			// 过渡时间
+			duration: {
+				type: [Number, String],
+				default: 300
+			},
+			// 标题菜单的高度，单位任意，数值默认为rpx单位
+			height: {
+				type: [Number, String],
+				default: 80
+			},
+			// 是否显示下边框
+			borderBottom: {
+				type: Boolean,
+				default: false
+			},
+			// 标题的字体大小
+			titleSize: {
+				type: [Number, String],
+				default: 28
+			},
+			// 下拉出来的内容部分的圆角值
+			borderRadius: {
+				type: [Number, String],
+				default: 0
+			},
+			// 菜单右侧的icon图标
+			menuIcon: {
+				type: String,
+				default: 'arrow-down'
+			},
+			// 菜单右侧图标的大小
+			menuIconSize: {
+				type: [Number, String],
+				default: 26
+			}
+		},
+		data() {
+			return {
+				showDropdown: true, // 是否打开下来菜单,
+				menuList: [], // 显示的菜单
+				active: false, // 下拉菜单的状态
+				// 当前是第几个菜单处于激活状态，小程序中此处不能写成false或者""，否则后续将current赋值为0，
+				// 无能的TX没有使用===而是使用==判断，导致程序认为前后二者没有变化，从而不会触发视图更新
+				current: 99999,
+				// 外层内容的样式，初始时处于底层，且透明
+				contentStyle: {
+					zIndex: -1,
+					opacity: 0
+				},
+				// 让某个菜单保持高亮的状态
+				highlightIndex: 99999,
+				contentHeight: 0,
+				showMask: false
+			}
+		},
+		computed: {
+			// 下拉出来部分的样式
+			popupStyle() {
+				let style = {};
+				// 进行Y轴位移，展开状态时，恢复原位。收齐状态时，往上位移100%，进行隐藏
+				style.transform = `translateY(${this.active ? 0 : '-100%'})`
+				style['transition-duration'] = this.duration / 1000 + 's';
+				style.borderRadius = `0 0 ${this.$u.addUnit(this.borderRadius)} ${this.$u.addUnit(this.borderRadius)}`;
+				return style;
+			}
+		},
+		created() {
+			// 引用所有子组件(u-dropdown-item)的this，不能在data中声明变量，否则在微信小程序会造成循环引用而报错
+			this.children = [];
+		},
+		mounted() {
+			this.getContentHeight();
+		},
+		methods: {
+			init() {
+				// 当某个子组件内容变化时，触发父组件的init，父组件再让每一个子组件重新初始化一遍
+				// 以保证数据的正确性
+				this.menuList = [];
+				this.children.map(child => {
+					child.init();
+				})
+			},
+			// 点击菜单
+			menuClick(index) {
+				// 判断是否被禁用
+				if (this.menuList[index].disabled) return;
+				// 如果点击时的索引和当前激活项索引相同，意味着点击了激活项，需要收起下拉菜单
+				if (index === this.current && this.closeOnClickSelf) {
+					this.close();
+					// 等动画结束后，再移除下拉菜单中的内容，否则直接移除，也就没有下拉菜单收起的效果了
+					setTimeout(() => {
+						this.children[index].active = false;
+					}, this.duration)
+					return;
+				}
+				this.open(index);
+			},
+			// 打开下拉菜单
+			open(index) {
+				// 重置高亮索引，否则会造成多个菜单同时高亮
+				// this.highlightIndex = 9999;
+				// 展开时，设置下拉内容的样式
+				this.contentStyle = {
+					zIndex: 11,
+				}
+				this.showMask = true;
+				// 标记展开状态以及当前展开项的索引
+				this.active = true;
+				this.current = index;
+				// 历遍所有的子元素，将索引匹配的项标记为激活状态，因为子元素是通过v-if控制切换的
+				// 之所以不是因display: none，是因为nvue没有display这个属性
+				this.children.map((val, idx) => {
+					val.active = index == idx ? true : false;
+				})
+				this.$emit('open', this.current);
+			},
+			// 设置下拉菜单处于收起状态
+			close() {
+				this.$emit('close', this.current);
+				// 设置为收起状态，同时current归位，设置为空字符串
+				this.active = false;
+				this.current = 99999;
+				this.showMask = false;
+				// 下拉内容的样式进行调整，不透明度设置为0
+				this.contentStyle = {
+					zIndex: -1,
+					opacity: 0
+				}
+			},
+			// 点击遮罩
+			maskClick() {
+				// 如果不允许点击遮罩，直接返回
+				if (!this.closeOnClickMask) return;
+				this.close();
+			},
+			// 外部手动设置某个菜单高亮
+			highlight(index = undefined) {
+				this.highlightIndex = index !== undefined ? index : 99999;
+			},
+			// 获取下拉菜单内容的高度
+			getContentHeight() {
+				// 这里的原理为，因为dropdown组件是相对定位的，它的下拉出来的内容，必须给定一个高度
+				// 才能让遮罩占满菜单一下，直到屏幕底部的高度
+				// this.$u.sys()为uView封装的获取设备信息的方法
+				let windowHeight = this.$u.sys().windowHeight;
+				this.$uGetRect('.u-dropdown__menu').then(res => {
+					// 这里获取的是dropdown的尺寸，在H5上，uniapp获取尺寸是有bug的(以前提出修复过，后来又出现了此bug，目前hx2.8.11版本)
+					// H5端bug表现为元素尺寸的top值为导航栏底部到到元素的上边沿的距离，但是元素的bottom值确是导航栏顶部到元素底部的距离
+					// 二者是互相矛盾的，本质原因是H5端导航栏非原生，uni的开发者大意造成
+					// 这里取菜单栏的botton值合理的，不能用res.top，否则页面会造成滚动
+					this.contentHeight = windowHeight - res.bottom;
+				})
+			}
+		}
+	}
+</script>
+
+<style scoped lang="scss">
+	@import "../../libs/css/style.components.scss";
+
+	.u-dropdown {
+		flex: 1;
+		width: 100%;
+		position: relative;
+
+		&__menu {
+			@include vue-flex;
+			position: relative;
+			z-index: 11;
+			height: 80rpx;
+
+			&__item {
+				flex: 1;
+				@include vue-flex;
+				justify-content: center;
+				align-items: center;
+
+				&__text {
+					font-size: 28rpx;
+					color: $u-content-color;
+				}
+
+				&__arrow {
+					margin-left: 6rpx;
+					transition: transform .3s;
+					align-items: center;
+					@include vue-flex;
+
+					&--rotate {
+						transform: rotate(180deg);
+					}
+				}
+			}
+		}
+
+		&__content {
+			position: absolute;
+			z-index: 8;
+			width: 100%;
+			left: 0px;
+			bottom: 0;
+			overflow: hidden;
+			
+
+			&__mask {
+				position: absolute;
+				z-index: 9;
+				background: rgba(0, 0, 0, .3);
+				width: 100%;
+				left: 0;
+				top: 0;
+				bottom: 0;
+			}
+
+			&__popup {
+				position: relative;
+				z-index: 10;
+				transition: all 0.3s;
+				transform: translate3D(0, -100%, 0);
+				overflow: hidden;
+			}
+		}
+
+	}
+</style>