modify

common/common.scss

@@ -24,6 +24,11 @@ radio,checkbox {
 	  font-family: 'FANDOLFANG-REGULAR';  /* project id 2394829 */
 	  src: url('static/font/FANDOLFANG-REGULAR.OTF');
 	}
+/* 巡检计划图表入特殊字体 */
+@font-face {
+	  font-family: 'IMPACT';  /* project id 2394829 */
+	  src: url('static/font/IMPACT.TTF');
+	}
 
 .cu-bar .search-form uni-input{
 	padding:0 30rpx
@@ -194,7 +199,7 @@ radio,checkbox {
 /* 已处理未处理列表 */
 .processList .cu-list.menu-avatar .cu-item {
 	
-	height: 178rpx;
+	height: 142rpx;
 }
 
 .pro-title {
@@ -295,7 +300,7 @@ radio,checkbox {
 		left:0;
 		bottom: 44rpx;
 		z-index: 999;
-		background-color: #ffffff;
+		// background-color: #ffffff;
 	}
 	
 	
@@ -356,6 +361,9 @@ radio,checkbox {
 		margin-top:26rpx;
 		
 	}
+	uni-textarea{
+		width:500rpx;
+	}
 	
 	select{
 		outline:none;
@@ -369,7 +377,6 @@ radio,checkbox {
 	/* // 处理内容 */
 	.cu-form-group {
 		background: #f5f5f5;
-	
 	}
 	
 	.processStatus {
@@ -454,4 +461,113 @@ radio,checkbox {
 			background:#fff
 		}
 	}
+	
+	
+	// 巡检计划
+	.plan-sec{
+		border-radius:10rpx;
+	}
+	.plan-tit{
+		font-size:34rpx
+	}
+	
+	// 巡检新增
+	.cu-form-group {
+		border-top: 0;
+		background: #fff;
+		padding:0
+	
+	}
+	input,
+	select,
+	option {
+		line-height: 70rpx;
+		padding: 0 20rpx;
+		height: 70rpx;
+		border: 1px solid #EDEDED;
+		// width:500rpx!important;
+		background-color: #fff;
+		box-sizing: border-box;
+		appearance: none;
+		-moz-appearance: none;
+		-webkit-appearance: none;
+		color: #999;
+
+	}
+	
+	select:focus,
+	select:active,
+	select:hover {
+		outline: none;
+	}
+	
+	select {
+		background: url(/static/arrow.png) no-repeat scroll 98% center;
+		background-size: 6%;
+	}
+	
+	
+	textarea{
+		border:1px solid #EDEDED;
+		padding:10px;
+		color: #999;
+	}
+	
+	.form-item label text {
+		position: relative;
+		top: 2rpx
+	}
+	
+	.form-item {
+		padding: 0 40rpx;
+		display: flex;
+		align-items: top;
+		margin-bottom: 20rpx;
+	
+	
+		.title {
+			width: 170rpx;
+			position: relative;
+	
+			.necessary {
+				color: red;
+				display: inline-block;
+				position: absolute;
+				top: -2rpx;
+				left: -20rpx;
+				font-size: 40rpx;
+	
+			}
+		}
+	
+		input,
+		select {
+			width: 500rpx;
+			font-size: 28rpx;
+		}
+	
+	
+	}
+	
+	// 巡检详情,已执行
+	.planDetailDone{
+		.form-item{
+			margin-left:24rpx;
+			padding:26rpx 10rpx;
+			border-top:1px solid #f1f1f1;
+			margin-bottom:0
+			
+		}
+	}
+	.repairSquare{
+		padding:18rpx 20rpx;
+		border-radius:10rpx;
+	}
+	.repairSquare .num,.repairSquare .title{
+		color:#fff
+	}
+	.repairSquare .num{
+		font-size:36rpx
+	}
+	
 		

data/json.js

@@ -67,30 +67,30 @@ let cuIconList = [{
 		redirectUrl: ''
 	}
 ];
-
-// 首页报警数据
-
-let staticData={
-	"msg": "\u64cd\u4f5c\u6210\u529f",
-	"flag": true,
-	"companyCode": "1,2,3,4,5,6,7,8,12,13,14,16,17,18,19,20,21,22,23,24,25,26,27,28,29,30,31,32,33,34,35,36,37,38,39",
-	"data": [{
-		"statisticalPeriod": "2021-03-16~2021-04-16",
-		"smartElectricityCount": "178",
-		"videoMonitoringCount": "12456",
-		"alarmCount": 12627,
-		"eventCount": 2,
-		"hiddenDangerCount": 4,
-		"offlineCount": 20,
-		"faultCount": 30,
-		"earlyWarningCount": 100,
-		"otherCount": 99,
-		"normalCount": 66,
-		"integratedAlarmCount": 12627,
-		"unprocessedCount": 0
-	}]
-}
-
+
+// 首页报警数据
+
+let staticData = {
+	"msg": "\u64cd\u4f5c\u6210\u529f",
+	"flag": true,
+	"companyCode": "1,2,3,4,5,6,7,8,12,13,14,16,17,18,19,20,21,22,23,24,25,26,27,28,29,30,31,32,33,34,35,36,37,38,39",
+	"data": [{
+		"statisticalPeriod": "2021-03-16~2021-04-16",
+		"smartElectricityCount": "178",
+		"videoMonitoringCount": "12456",
+		"alarmCount": 12627,
+		"eventCount": 2,
+		"hiddenDangerCount": 4,
+		"offlineCount": 20,
+		"faultCount": 30,
+		"earlyWarningCount": 100,
+		"otherCount": 99,
+		"normalCount": 66,
+		"integratedAlarmCount": 12627,
+		"unprocessedCount": 0
+	}]
+}
+
 //综合报警九宫格
 let alarmingSquareList = [{
 		imgUrl: '../../static/alarming-zj.png',
@@ -207,74 +207,74 @@ let deviceType = [{
 		"title": "水警",
 		"num": "4",
 		"imgUrl": "/static/dt-waterIcon.png"
-	},
-	{
-		"id": "3",
-		"title": "电气火灾",
-		"num": "4",
-		"imgUrl": "/static/dt-dqIcon.png"
-	},
-	{
-		"id": "4",
-		"title": "RTU",
-		"num": "4",
-		"imgUrl": "/static/dt-rtuIcon.png"
-	},
-	{
-		"id": "5",
-		"title": "烟感",
-		"num": "4",
-		"imgUrl": "/static/dt-ygIcon.png"
-	},
-	{
-		"id": "6",
-		"title": "视频",
-		"num": "4",
-		"imgUrl": "/static/dt-videoIcon.png"
-	},
-	{
-		"id": "6",
-		"title": "电梯",
-		"num": "4",
-		"imgUrl": "/static/dt-dtIcon.png"
-	},
-	{
-		"id": "7",
-		"title": "井盖",
-		"num": "4",
-		"imgUrl": "/static/dt-jgIcon.png"
-	},
-	{
-		"id": "8",
-		"title": "消防栓",
-		"num": "4",
-		"imgUrl": "/static/dt-xfsIcon.png"
+	},
+	{
+		"id": "3",
+		"title": "电气火灾",
+		"num": "4",
+		"imgUrl": "/static/dt-dqIcon.png"
+	},
+	{
+		"id": "4",
+		"title": "RTU",
+		"num": "4",
+		"imgUrl": "/static/dt-rtuIcon.png"
+	},
+	{
+		"id": "5",
+		"title": "烟感",
+		"num": "4",
+		"imgUrl": "/static/dt-ygIcon.png"
+	},
+	{
+		"id": "6",
+		"title": "视频",
+		"num": "4",
+		"imgUrl": "/static/dt-videoIcon.png"
+	},
+	{
+		"id": "6",
+		"title": "电梯",
+		"num": "4",
+		"imgUrl": "/static/dt-dtIcon.png"
+	},
+	{
+		"id": "7",
+		"title": "井盖",
+		"num": "4",
+		"imgUrl": "/static/dt-jgIcon.png"
+	},
+	{
+		"id": "8",
+		"title": "消防栓",
+		"num": "4",
+		"imgUrl": "/static/dt-xfsIcon.png"
 	},
 ];
-//设备管理
+//设备管理
 let deviceManage = [{
 		"id": "561",
 		"title": "测试用传装置",
 		"des": "三楼茶水间",
-		"time": "2021-01-20 15:23:43",
-		"status":0
+		"time": "2021-01-20 15:23:43",
+		"status": 0
 	},
 	{
 		"id": "561",
-		"title": "测试用传装置",
+		"title": "测试用传装置",
 		"des": "三楼茶水间",
-		"time": "2021-01-20 15:23:43",
-		"status":1
-	},
-	{
-		"id": "561",
-		"title": "测试用传装置",
-		"des": "三楼茶水间",
-		"time": "2021-01-20 15:23:43",
-		"status":2
+		"time": "2021-01-20 15:23:43",
+		"status": 1
+	},
+	{
+		"id": "561",
+		"title": "测试用传装置",
+		"des": "三楼茶水间",
+		"time": "2021-01-20 15:23:43",
+		"status": 2
 	}
-];
-
+];
+
 // 消防督查单
 let inspectList = [{
 		"id": "1",
@@ -287,10 +287,10 @@ let inspectList = [{
 		"title": "电子督查单",
 		"num": "4",
 		"imgUrl": "/static/dz-icon.png"
-	}
-	
+	}
+
 ];
-
+
 let inspectUnprocessList = [{
 		"id": "561",
 		"title": "[2020]HP第DZ4104号人工督查单",
@@ -298,15 +298,15 @@ let inspectUnprocessList = [{
 		"time": "2020-01-08 15:15:12"
 	},
 	{
-		"id": "561",
-		"title": "[2020]HP第DZ4104号人工督查单",
-		"des": "事件未处理测试",
+		"id": "561",
+		"title": "[2020]HP第DZ4104号人工督查单",
+		"des": "事件未处理测试",
 		"time": "2020-01-08 15:15:12"
 	},
 	{
-		"id": "561",
-		"title": "[2020]HP第DZ4104号人工督查单",
-		"des": "事件未处理测试",
+		"id": "561",
+		"title": "[2020]HP第DZ4104号人工督查单",
+		"des": "事件未处理测试",
 		"time": "2020-01-08 15:15:12"
 	}
 ];
@@ -317,21 +317,21 @@ let inspectProcessedList = [{
 		"time": "2020-01-08 15:15:12"
 	},
 	{
-		"id": "561",
-		"title": "[2020]HP第DZ4104号人工督查单",
-		"des": "事件未处理测试",
+		"id": "561",
+		"title": "[2020]HP第DZ4104号人工督查单",
+		"des": "事件未处理测试",
 		"time": "2020-01-08 15:15:12"
 	},
 	{
-		"id": "561",
-		"title": "[2020]HP第DZ4104号人工督查单",
-		"des": "事件未处理测试",
+		"id": "561",
+		"title": "[2020]HP第DZ4104号人工督查单",
+		"des": "事件未处理测试",
 		"time": "2020-01-08 15:15:12"
 	}
-];
-
-
-// 巡检
+];
+
+
+// 巡检
 let xunJianList = [{
 		"id": "1",
 		"title": "巡检计划",
@@ -343,54 +343,152 @@ let xunJianList = [{
 		"title": "巡检记录",
 		"num": "4",
 		"imgUrl": "/static/xunJian-icon2.png"
-	}
-	
-];
+	}
+
+];
 let xunJianRecord = [{
 		"id": "561",
 		"title": "计划：巡检计划1",
 		"des": "点位：巡检点位01",
-		"time": "2021-01-20 15:23:43",
-		"status":0
+		"time": "2021-01-20 15:23:43",
+		"status": 0
 	},
+	{
+		"id": "561",
+		"title": "计划：巡检计划1",
+		"des": "点位：巡检点位01",
+		"time": "2021-01-20 15:23:43",
+		"status": 0
+	},
+	{
+		"id": "561",
+		"title": "计划：巡检计划1",
+		"des": "点位：巡检点位01",
+		"time": "2021-01-20 15:23:43",
+		"status": 1
+	}
+
+];
+
+let xunJianPlan = [{
+		"id": "561",
+		"title": "虹泾总部园巡检点位1",
+		"status": 0
+	},
+	{
+		"id": "561",
+		"title": "虹泾总部园巡检点位2",
+		"status": 0
+	},
+	{
+		"id": "561",
+		"title": "虹泾总部园巡检点位3",
+		"status": 1
+	}
+
+];
+//报修
+let repair = [{
+		"id": "561",
+		"title": "dfmz巡检报修",
+		"imgUrl": "/static/repair1.png",
+		"subTitle": "类型 故障",
+		"status": 0
+	},
+	{
+		"id": "561",
+		"title": "dfmz巡检报修",
+		"imgUrl": "/static/repair2.png",
+		"subTitle": "类型 故障",
+		"status": 1
+	},
+	{
+		"id": "561",
+		"title": "dfmz巡检报修",
+		"imgUrl": "/static/repair3.png",
+		"subTitle": "类型 故障",
+		"status": 2
+	},
+	{
+		"id": "561",
+		"title": "dfmz巡检报修",
+		"imgUrl": "/static/repair4.png",
+		"subTitle": "类型 故障",
+		"status": 3
+	},
+	{
+		"id": "561",
+		"title": "dfmz巡检报修",
+		"imgUrl": "/static/repair5.png",
+		"subTitle": "类型 故障",
+		"status": 4
+	}
+
+];
+let repairSquare = [{
+		"id": "561",
+		"title": "报修总数",
+		"num": "5",
+		"color":"#7992F9"
+	},
+	{
+		"id": "561",
+		"title": "未处理",
+		"num": "1",
+		"color":"#FDCA60"
+	},
+	{
+		"id": "561",
+		"title": "未审核",
+		"num": "1",
+		"color":"#59D1EA"
+	},
+	{
+		"id": "561",
+		"title": "未通过",
+		"num": "1",
+		"color":"#F77070"
+	},
+	{
+		"id": "561",
+		"title": "已完成",
+		"num": "1",
+		"color":"#72D06A"
+	},
 	{
-			"id": "561",
-			"title": "计划：巡检计划1",
-			"des": "点位：巡检点位01",
-			"time": "2021-01-20 15:23:43",
-			"status":0
-		},
-	{
-			"id": "561",
-			"title": "计划：巡检计划1",
-			"des": "点位：巡检点位01",
-			"time": "2021-01-20 15:23:43",
-			"status":1
-		}
-	
+		"id": "561",
+		"title": "超时完成",
+		"num": "1",
+		"color":"#F7895E"
+	}
+
 ];
-
+
 
 // 定义数据出口
-module.exports = {
-	
-	staticData:staticData,
-	
+module.exports = {
+
+	staticData: staticData,
+
 	cuIconList: cuIconList,
 	unprocessList: unprocessList,
 	processedList: processedList,
 	alarmingSquareList: alarmingSquareList,
 	deviceOffLineData: deviceOffLineData,
-	deviceType: deviceType,
-	deviceManage:deviceManage,
-	inspectList:inspectList,
-	
-	inspectUnprocessList: inspectUnprocessList,
-	inspectProcessedList: inspectProcessedList,
-	
-	xunJianList:xunJianList,
-	xunJianRecord:xunJianRecord
-	
-	
-	
+	deviceType: deviceType,
+	deviceManage: deviceManage,
+	inspectList: inspectList,
+
+	inspectUnprocessList: inspectUnprocessList,
+	inspectProcessedList: inspectProcessedList,
+
+	xunJianList: xunJianList,
+	xunJianRecord: xunJianRecord,
+	xunJianPlan: xunJianPlan,
+
+	repair: repair,
+	repairSquare:repairSquare
+
+
+
 }

pages.json

@@ -167,12 +167,6 @@
 
 
 
-		{
-			"path": "pages/info/info",
-			"style": {
-				"navigationBarTitleText": "消息"
-			}
-		},
 		{
 			"path": "pages/analyse/analyse",
 			"style": {
@@ -464,6 +458,51 @@
             }
             
         }
+        ,{
+            "path" : "pages/xunJian/planDetail/planDetail",
+            "style" :                                                                                    
+            {
+                "navigationBarTitleText": "巡检上报",
+                "enablePullDownRefresh": false
+            }
+            
+        }
+        ,{
+            "path" : "pages/xunJian/planDetailDone/planDetailDone",
+            "style" :                                                                                    
+            {
+                "navigationBarTitleText": "巡检详情",
+                "enablePullDownRefresh": false
+            }
+            
+        }
+        ,{
+            "path" : "pages/repair/repair",
+            "style" :                                                                                    
+            {
+                "navigationBarTitleText": "设备报修",
+                "enablePullDownRefresh": false
+            }
+            
+        }
+        ,{
+            "path" : "pages/info/info",
+            "style" :                                                                                    
+            {
+                "navigationBarTitleText": "消息",
+                "enablePullDownRefresh": false
+            }
+            
+        }
+        ,{
+            "path" : "pages/repair/repairDetail/repairDetail",
+            "style" :                                                                                    
+            {
+                "navigationBarTitleText": "报修",
+                "enablePullDownRefresh": false
+            }
+            
+        }
     ],
 	
 	

pages/alarmingList/alarmingList.vue

@@ -1,7 +1,6 @@
 <template>
 	<view>
 		<!-- 宫格列表 -->
-		<!-- <square :cuIconList="cuIconList"></square> -->
 		<view class="section2 section  bg-white margin-top-sm margin-bottom-sm">
 			<view class="cu-list grid col-3 no-border">
 				<view class="cu-item justify-center align-center"  v-for="(item,index) in alarmingSquareList" @tap="goProcessList()"

pages/index/index.vue

@@ -143,6 +143,9 @@
 					case 3:
 						url = "/pages/xunJian/xunJian"
 						break;
+					case 4:
+						url = "/pages/repair/repair"
+						break;
 					default:
 						break;
 				}

pages/repair/repair.vue

@@ -0,0 +1,96 @@
+<template>
+	<view class="processWrapper ">
+		
+		<!-- 宫格列表 -->
+		<view class="bg-white  " >
+			<view class="cu-list grid col-3 no-border" style="padding-bottom:0">
+				<view class="cu-item justify-center align-center  "  v-for="(item,index) in repairSquare"  
+				 :key="index">
+				 <view :style="`background:${item.color}`" style="width:90%" class=" repairSquare">
+					 <view class="num">{{item.num}}</view>
+					 <text  class="title" style="color:#fff">{{item.title}}</text>
+				 </view>
+					
+				</view>
+			</view>
+		</view>
+		
+		<block>
+			<view class="processList" style="margin-top:0">
+				<view class="cu-list menu-avatar ">
+					<view class="cu-item" v-for="(item,index) in unporcessList" :key="index">
+						<view class="cu-avatar " :style="`background-image:url(${item.imgUrl})`"  style="width:82rpx;height:82rpx"></view>
+						<view class="content">
+							<view class="pro-title">
+								<view class="cut">{{item.title}}</view>
+							</view>
+							<view class="pro-des  ">
+								<view class="text-cut">
+									{{item.subTitle}}
+								</view>
+							</view>
+							<view class="pro-date ">{{item.time}}</view>
+						</view>
+						<view class="action margin-right-sm" style="text-align:right">
+							<view style="color:#FDCA60" v-if="item.status==0">未处理</view>
+							<view style="color:#59D1EA" v-if="item.status==1">未审核</view>
+							<view style="color:#F77070" v-if="item.status==2">未通过</view>
+							<view style="color:#72D06A" v-if="item.status==3">已完成</view>
+							<view style="color:#F7895E" v-if="item.status==4">超时完成</view>
+						</view>
+					</view>
+				</view>
+			</view>
+		</block>
+		
+		<view class="btn-area submitBottomBtn padding-lr-sm">
+			<button class="bg-blue round  margin-top" @tap="goRepairDetail">报 修 </button>
+		</view>
+		
+	
+	</view>
+</template>
+
+<script>
+	import json from '../../data/json.js';
+	export default {
+		data() {
+			return {
+				unporcessList:json.repair,
+				repairSquare: json.repairSquare,
+
+				
+				modalName: null,
+				listTouchStart: 0,
+				listTouchDirection: null,
+				CustomBar: this.CustomBar,
+		
+			
+			};
+		},
+		methods: {
+			
+			
+			// 页面跳转
+			goRepairDetail() {
+				uni.navigateTo({
+					url: '/pages/repair/repairDetail/repairDetail',
+					success: res => {},
+					fail: () => {},
+					complete: () => {}
+				});
+			}
+			
+				
+		
+		}
+	}
+</script>
+
+<style lang="scss">
+
+	.processList{
+		position:static;
+	}
+	
+</style>

pages/repair/repairDetail/repairDetail.vue

@@ -0,0 +1,123 @@
+<template>
+	<view>
+		
+		<form action="" >
+			
+			<view class="form-item margin-top">
+				<view class="title">
+					<text class="necessary">*</text>
+					报修地址：
+				</view>
+				<input type="text">
+			</view>
+			
+			<view class="form-item margin-top">
+				<view class="title">
+					<text class="necessary">*</text>
+					故障状态：
+				</view>
+				<view>故障</view>
+				
+			</view>
+			
+			<view class="form-item margin-top">
+				<view class="title">
+					<text class="necessary">*</text>
+					上传图片：
+				</view>
+				
+				<view style="width:500rpx">
+					<view class="cu-form-group">
+						<view class="grid col-4 grid-square flex-sub">
+							<view class="bg-img" v-for="(item,index) in imgList" :key="index" @tap="ViewImage" :data-url="imgList[index]">
+							 <image :src="imgList[index]" mode="aspectFill"></image>
+								<view class="cu-tag bg-red" @tap.stop="DelImg" :data-index="index">
+									<text class='cuIcon-close'></text>
+								</view>
+							</view>
+							<view class="solids" @tap="ChooseImage" v-if="imgList.length<4">
+								<text class='cuIcon-cameraadd'></text>
+							</view>
+						</view>
+					</view>
+				</view>
+			</view>
+			
+			<view class="form-item margin-top">
+				<view class="title">
+					<text class="necessary">*</text>
+					报修描述：
+				</view>
+				<textarea maxlength="-1"  @input="textareaAInput" placeholder="" width="250"></textarea>
+			</view>
+		
+			<view class="btn-area submitBottomBtn padding-lr-sm">
+				<button class="bg-blue round  margin-top" @click="addSubmit">提 交 </button>
+			</view>
+			
+		</form>
+
+		
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				
+				imgList: [],
+
+			}
+		},
+		methods: {
+			radioChange(e) {
+				console.log('type:' + e.detail.value);
+				this.radioOne = e.detail.value;
+			},
+			
+			ChooseImage() {
+				uni.chooseImage({
+					count: 4, //默认9
+					sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
+					sourceType: ['album'], //从相册选择
+					success: (res) => {
+						if (this.imgList.length != 0) {
+							this.imgList = this.imgList.concat(res.tempFilePaths)
+						} else {
+							this.imgList = res.tempFilePaths
+						}
+					}
+				});
+			},
+			
+			ViewImage(e) {
+				uni.previewImage({
+					urls: this.imgList,
+					current: e.currentTarget.dataset.url
+				});
+			},
+			DelImg(e) {
+				uni.showModal({
+					title: '删除',
+					content: '确定要删除此图片吗？',
+					cancelText: '取消',
+					confirmText: '确定',
+					success: res => {
+						if (res.confirm) {
+							this.imgList.splice(e.currentTarget.dataset.index, 1)
+						}
+					}
+				})
+			},
+			
+		}
+	}
+</script>
+
+<style lang="scss">
+	
+
+	
+</style>
+

pages/xunJian/plan/components/chart.vue

@@ -0,0 +1,168 @@
+<template>
+	<view class="content">
+		<view @click="echarts.onClick" :prop="option" :change:prop="echarts.updateEcharts" id="echarts" class="echarts"></view>
+
+	</view>
+</template>
+
+<script>
+	var fontColor = "#fff";
+	let noramlSize = 16;
+	var datas = {
+		value: 90,
+		company: "%",
+		ringColor: [{
+			offset: 0,
+			color: '#0BA0D7' // 0% 处的颜色
+		}, {
+			offset: 1,
+			color: '#24F0E4' // 100% 处的颜色
+		}]
+	}
+
+	export default {
+		name: 'chart',
+		props: {
+
+		},
+		data() {
+			return {
+
+				option: {
+
+					title: {
+						text: '{name|' + datas.value + datas.company + '}\n{val|任务完成率}',
+						x: 'center',
+						y: 'center',
+						textStyle: {
+							rich: {
+								name: {
+									fontSize: 32,
+									fontWeight: 'normal',
+									color: '#24F0E4',
+									fontFamily: 'IMPACT',
+
+									padding: [8, 0]
+								},
+								val: {
+									fontSize: 16,
+									color: '#333333',
+								}
+							}
+						}
+					},
+					color: ['#F4F5F7'],
+					legend: {
+						show: false,
+						data: []
+					},
+
+					series: [{
+						name: 'Line 1',
+						type: 'pie',
+						clockWise: true,
+						radius: ['64%', '80%'],
+						itemStyle: {
+							normal: {
+								label: {
+									show: false
+								},
+								labelLine: {
+									show: false
+								}
+							}
+						},
+						hoverAnimation: false,
+						data: [{
+							value: datas.value,
+							name: '',
+							itemStyle: {
+								normal: {
+									color: { // 完成的圆环的颜色
+										colorStops: datas.ringColor
+									},
+									label: {
+										show: false
+									},
+									labelLine: {
+										show: false
+									}
+								}
+							}
+						}, {
+							name: '',
+							value: 100 - datas.value
+						}]
+					}]
+				}
+			}
+		},
+		onLoad() {
+
+		},
+		methods: {
+			changeOption() {
+				const data = this.option.series[0].data
+				// 随机更新示例数据
+				data.forEach((item, index) => {
+					data.splice(index, 1, Math.random() * 40)
+				})
+			},
+			onViewClick(options) {
+				console.log(options)
+			}
+		}
+	}
+</script>
+
+<script module="echarts" lang="renderjs">
+	let myChart
+	export default {
+		mounted() {
+			if (typeof window.echarts === 'function') {
+				this.initEcharts()
+			} else {
+				// 动态引入较大类库避免影响页面展示
+				const script = document.createElement('script')
+				// view 层的页面运行在 www 根目录，其相对路径相对于 www 计算
+				script.src = '/static/echarts.min.js'
+				script.onload = this.initEcharts.bind(this)
+				document.head.appendChild(script)
+			}
+		},
+		methods: {
+			initEcharts() {
+
+
+				myChart = echarts.init(document.getElementById('echarts'))
+				// 观测更新的数据在 view 层可以直接访问到
+				myChart.setOption(this.option)
+			},
+			updateEcharts(newValue, oldValue, ownerInstance, instance) {
+				// 监听 service 层数据变更
+				myChart.setOption(newValue)
+			},
+			onClick(event, ownerInstance) {
+				// 调用 service 层的方法
+				ownerInstance.callMethod('onViewClick', {
+					test: 'test'
+				})
+			}
+		}
+	}
+</script>
+
+<style>
+	.content {
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+		justify-content: center;
+	}
+
+	.echarts {
+		width: 100%;
+		height: 400rpx;
+
+	}
+</style>

pages/xunJian/plan/plan.vue

@@ -1,22 +1,75 @@
 <template>
 	<view>
+		<view class="margin bg-white plan-sec text-center">
+			<view class="plan-tit padding-top-lg">任务名称：ui测试</view>
+			<chart></chart>
+		</view>
 		
+		<view class="margin bg-white plan-sec">
+			<view class="info-tit margin-left-xs">
+				<text class="cuIcon-titles margin-right-xs"></text>
+				巡检详情
+			</view>
+			<view class="cu-list menu-avatar">
+				<view class="cu-item deviceTypeItem" v-for="(item,index) in inspectList" :key="index" @tap="goDetailPage(item)">
+					<view class="content" style="left:0!important;width:80%">
+						<view class="title">{{item.title}}</view>
+					</view>
+					<view class="nav-right num">
+						<view class="text-grey">
+							<span class="online" v-if="item.status==0">已执行</span>
+							<span class="error" v-if="item.status==1">未执行</span>
+							<text class="icon iconfont margin-right-xs ">&#xe629;</text>
+						</view>
+					</view>
+				</view>
+			</view>
+		</view>
 	</view>
-</template>
-
+	
+	
+</template>
+
 <script>
+	import chart from './components/chart.vue';
+	import json from '../../../data/json.js';
 	export default {
-		data() {
+		components: {
+			chart
+		},
+		data() {
 			return {
-				
-			}
+			inspectList: json.xunJianPlan,
+
+			};
+		},
+		onLoad:function(option){
+
 		},
+		
 		methods: {
-			
-		}
+			goDetailPage(item){
+				if(item.status){
+					uni.navigateTo({
+						url:  "/pages/xunJian/planDetail/planDetail"
+					})
+				}else{
+					uni.navigateTo({
+						url:  "/pages/xunJian/planDetailDone/planDetailDone"
+					})
+				}
+				
+			}
+
+		}
+
+	}
+</script>
+
+<style lang="scss">
+	page{
+		background-color:#F4F5F7;
 	}
-</script>
-
-<style>
-
+	
+	
 </style>

pages/xunJian/planDetail/planDetail.vue

@@ -0,0 +1,136 @@
+<template>
+	<view>
+		
+		<form action=""  >
+			
+			<view class="form-item margin-top">
+				<view class="title">
+					<text class="necessary">*</text>
+					上报名称：
+				</view>
+				<input type="text">
+			</view>
+			
+			<view class="form-item margin-top">
+				<view class="title">
+					<text class="necessary">*</text>
+					巡检状态：
+				</view>
+				<radio-group name="gender" @change="radioChange">
+					<label class="margin-right-xs">
+						<radio value="2" checked /><text>正常</text>
+					</label>
+					<label class="margin-right-xs">
+						<radio value="3" /><text>异常</text>
+					</label>
+					<label class="margin-right-xs">
+						<radio value="2" /><text>供电</text>
+					</label>
+					<label>
+						<radio value="3" /><text>其他</text>
+					</label>
+				</radio-group>
+				
+			</view>
+			
+			<view class="form-item margin-top">
+				<view class="title">
+					<text class="necessary">*</text>
+					上传图片：
+				</view>
+				
+				<view style="width:500rpx">
+					<view class="cu-form-group">
+						<view class="grid col-4 grid-square flex-sub">
+							<view class="bg-img" v-for="(item,index) in imgList" :key="index" @tap="ViewImage" :data-url="imgList[index]">
+							 <image :src="imgList[index]" mode="aspectFill"></image>
+								<view class="cu-tag bg-red" @tap.stop="DelImg" :data-index="index">
+									<text class='cuIcon-close'></text>
+								</view>
+							</view>
+							<view class="solids" @tap="ChooseImage" v-if="imgList.length<4">
+								<text class='cuIcon-cameraadd'></text>
+							</view>
+						</view>
+					</view>
+				</view>
+			</view>
+			
+			<view class="form-item margin-top">
+				<view class="title">
+					<text class="necessary">*</text>
+					巡检描述：
+				</view>
+				<textarea maxlength="-1"  @input="textareaAInput" placeholder="" width="250"></textarea>
+			</view>
+		
+			<view class="btn-area submitBottomBtn padding-lr-sm">
+				<button class="bg-blue round  margin-top" @click="addSubmit">提 交 </button>
+			</view>
+			
+		</form>
+
+		
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				
+				imgList: [],
+
+			}
+		},
+		methods: {
+			radioChange(e) {
+				console.log('type:' + e.detail.value);
+				this.radioOne = e.detail.value;
+			},
+			
+			ChooseImage() {
+				uni.chooseImage({
+					count: 4, //默认9
+					sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
+					sourceType: ['album'], //从相册选择
+					success: (res) => {
+						if (this.imgList.length != 0) {
+							this.imgList = this.imgList.concat(res.tempFilePaths)
+						} else {
+							this.imgList = res.tempFilePaths
+						}
+					}
+				});
+			},
+			
+			ViewImage(e) {
+				uni.previewImage({
+					urls: this.imgList,
+					current: e.currentTarget.dataset.url
+				});
+			},
+			DelImg(e) {
+				uni.showModal({
+					title: '删除',
+					content: '确定要删除此图片吗？',
+					cancelText: '取消',
+					confirmText: '确定',
+					success: res => {
+						if (res.confirm) {
+							this.imgList.splice(e.currentTarget.dataset.index, 1)
+						}
+					}
+				})
+			},
+			
+		}
+	}
+</script>
+
+<style lang="scss">
+	
+
+	
+</style>
+

pages/xunJian/planDetailDone/planDetailDone.vue

@@ -0,0 +1,81 @@
+<template>
+	<view>
+
+		<form action=""  class="planDetailDone" >
+			
+			<view class="form-item">
+				<view class="title">
+					<text class="necessary">*</text>
+					上报名称：
+				</view>
+				<view>市光四村221号楼</view>
+			</view>
+			
+			<view class="form-item">
+				<view class="title">
+					<text class="necessary">*</text>
+					巡检状态：
+				</view>
+				<radio-group name="gender" @change="radioChange">
+					<label class="margin-right-xs">
+						<radio value="2" checked /><text>正常</text>
+					</label>
+					<label class="margin-right-xs">
+						<radio value="3" /><text>异常</text>
+					</label>
+					<label class="margin-right-xs">
+						<radio value="2" checked /><text>供电</text>
+					</label>
+					<label>
+						<radio value="3" /><text>其他</text>
+					</label>
+				</radio-group>
+			</view>
+			
+			<view class="form-item">
+				<view class="title">
+					<text class="necessary">*</text>
+					上传图片：
+				</view>
+				
+				<view>151198415.jpg</view>
+			</view>
+			
+			<view class="form-item">
+				<view class="title">
+					<text class="necessary">*</text>
+					巡检描述：
+				</view>
+				<view>描述信息</view>
+			</view>
+		
+		</form>
+	
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+
+			}
+		},
+		methods: {
+			radioChange(e) {
+				console.log('type:' + e.detail.value);
+				this.radioOne = e.detail.value;
+			},
+			
+		
+			
+		}
+	}
+</script>
+
+<style lang="scss">
+	
+
+	
+</style>
+

pages/xunJian/xunJian.vue

@@ -9,7 +9,6 @@
 				</view>
 				<view class="nav-right num">
 					<view>
-						
 						<text class="icon iconfont margin-right-xs margin-left-lg">&#xe629;</text>
 					</view>
 				</view>
@@ -41,10 +40,10 @@
 				let url = "";
 				switch (index) {
 					case 0:
-						url = "/pages/xunJian/record/record"
+						url = "/pages/xunJian/plan/plan"
 						break;
 					case 1:
-						url = "/pages/xunJian/plan/plan"
+						url = "/pages/xunJian/record/record"
 						break;
 					
 					
@@ -69,6 +68,8 @@
 	}
 </script>
 
-<style lang="scss">
+<style lang="scss">
+	
+	
 	
 </style>