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

apis/pagejs/electricityMeter.js

@@ -0,0 +1,48 @@
+import request from '@/apis/utils/request'
+
+
+export function powerDetection(data) {
+	var url='/mobile/ElectricityMeter/powerDetection';
+	return request({
+		method: 'post',
+		data: data,
+		url: url
+	})
+}
+
+export function electricityMonthTB(data) {
+	var url='/mobile/ElectricityMeter/electricityMonthTB';
+	return request({
+		method: 'post',
+		data: data,
+		url: url
+	})
+}
+
+export function electricityMonthHB(data) {
+	var url='/mobile/ElectricityMeter/electricityMonthHB';
+	return request({
+		method: 'post',
+		data: data,
+		url: url
+	})
+}
+
+
+export function electricityHourByYear(data) {
+	var url='/mobile/ElectricityMeter/electricityHourByYear';
+	return request({
+		method: 'post',
+		data: data,
+		url: url
+	})
+}
+
+export function electricityHourByDay(data) {
+	var url='/mobile/ElectricityMeter/electricityHourByDay';
+	return request({
+		method: 'post',
+		data: data,
+		url: url
+	})
+}

pages/equipmentDataMonitoring/3PhaseCurrentDetails.vue

@@ -1,6 +1,6 @@
 <template>
 	<view>
-		<u-navbar title="三相电流监测"  title-color="#101010" >
+		<u-navbar :title="typeName+'监测'"  title-color="#101010" >
 			
 			<view class="slot" slot="right" @click="show=true">
 				<image class="img" src="@/assets/img/riLine-calendar-todo-line 2.svg" mode=""></image>
@@ -8,49 +8,83 @@
 		</u-navbar>
 		
 	
-		 <u-picker-select title="日期选择" v-model="show"mode="time" :params="params"   ></u-picker-select>
+		 <u-picker-select  :noselect="true"
+		 @confirm="selector2confirm" @reset="selector2reset"  :defaultTime="queryDate"
+		 title="日期选择" v-model="show" mode="time" :params="params"   ></u-picker-select>
 		  <view class="main">
 		  	<view class="title">
-		  		<view class="icon">
-		  			
-		  		</view>
+		  		
 				<view class="text">
-					电流监测 (A)
+					
+					<view class="icon">
+						
+					</view>
+					<span>
+						{{typeKey}}监测 <span v-if="typeN">（单位{{typeN}}）</span>
+						
+					</span>
+				
 				</view>
 		  	</view>
 			<view class="chat">
-				<image class="img" src="@/assets/img/3chat.png" mode=""></image>
+				<view id="barEcharts" style="min-height:440rpx;" >
+				
+				</view>
 			</view>
 			
 			<!-- 表格 -->
 			<view class="table">
 				
-				<u-table bg-color="#f1f2f5" border-color="#f1f2f5" color="#101010" padding="20rpx 0">
-						<u-tr>
-							<u-th></u-th>
-							<u-th>实时电流</u-th>
-							<u-th>最大电流</u-th>
-									<u-th>最小电流</u-th>
-						</u-tr>
-						<u-tr>
-							<u-td>A相</u-td>
-							<u-td>36</u-td>
-							<u-td>140 (12:00)</u-td>
-									<u-td>4 (02:00)</u-td>
-						</u-tr>
-						<u-tr>
-							<u-td>B相</u-td>
-							<u-td>24</u-td>
-							<u-td>80 (11:00)</u-td>
-									<u-td>8 (02:00)</u-td>
-						</u-tr>
-								<u-tr>
-									<u-td>C相</u-td>
-									<u-td>20</u-td>
-									<u-td>110 (13:00)</u-td>
-									<u-td>2 (02:00)</u-td>
-								</u-tr>
-					</u-table>
+				<table bg-color="#f1f2f5" border-color="#f1f2f5" color="#101010" padding="20rpx 0">
+					
+						<tr>
+							<th></th>
+							<th>实时{{typeKey}}</th>
+							<th>最大{{typeKey}}</th>
+							<th>最小{{typeKey}}</th>
+						</tr>
+						
+						<template v-if="type=='AF'">
+							<tr>
+								<td></td>
+								<td>{{currentMap.AL1}}</td>
+								<td>{{currentMap.AL2}}</td>
+								<td>{{currentMap.AL3}}</td>
+							</tr>
+						</template>
+						<template v-else >
+							<tr v-if="type=='P'">
+								<td class="tableft">总功率</td>
+								<td>{{queryDate==nowDate?currentMap.AL1:'\\'}}</td>
+								<td>{{currentMap.AL2}}</td>
+								<td>{{currentMap.AL3}}</td>
+							</tr>
+							
+							<tr>
+								<td>A相</td>
+								<td>{{queryDate==nowDate?currentMap.A1:'\\'}}</td>
+								<td>{{currentMap.A2}}</td>
+								<td>{{currentMap.A3}}</td>
+							</tr>
+							<tr>
+								<td>B相</td>
+								<td>{{queryDate==nowDate?currentMap.B1:'\\'}}</td>
+								<td>{{currentMap.B2}}</td>
+								<td>{{currentMap.B3}}</td>
+							</tr>
+							<tr>
+										<td>C相</td>
+										<td>{{queryDate==nowDate?currentMap.C1:'\\'}}</td>
+										<td>{{currentMap.C2}}</td>
+										<td>{{currentMap.C3}}</td>
+							</tr>
+						</template>
+						
+						
+					</table>
+					<view  class="text2" style="text-align: center;padding-top: 8rpx;" >
+						{{queryDate}}
+					</view>
 			</view>
 		  </view>
 		  
@@ -59,6 +93,14 @@
 </template>
 
 <script>
+	import * as API from '@/apis/pagejs/electricityMeter.js'
+	import * as echarts from 'echarts';
+	import {
+		currentTimeStamp,
+		parseUnixTime,
+		beforeTimeStamp
+	} from '@/apis/utils'
+	
 	export default {
 		data() {
 			return {
@@ -70,9 +112,281 @@
 					minute: false,
 					second: false
 				},
-				show: false
+				show: false,
+				meterNo:'',
+				type:'',
+				isLoading: true,
+				nowDate:"",
+					queryDate:"",
+				graphMap:{},
+				currentMap:{},
+				timeList:[],
+				typeName:'',
+				typeN:'',
+				typeKey:'',
+			}
+		},
+		computed:{
+			
+		},
+		onLoad(op){
+			this.meterNo=op.id
+			this.type=op.type
+			this.typeName=op.typeName
+			
+			if(this.type=='P'){
+				this.typeKey='功率'
+				this.typeN='kW'
+			}else if(this.type=='A'){
+				this.typeKey='电流'
+				this.typeN='A'
+			}else if(this.type=='V'){
+				this.typeKey='电压'
+				this.typeN='V'
+			}else if(this.type=='T'){
+				this.typeKey='温度'
+				this.typeN=''
+			}else if(this.type=='F'){
+				this.typeKey='功率因数'
+				this.typeN=''
+			}else if(this.type=='AF'){
+				this.typeKey='功率因数'
+				this.typeN=''
+			}
+			
+			
+			
+			this.nowDate=parseUnixTime(currentTimeStamp(), '{y}-{m}-{d}');
+			this.queryDate=parseUnixTime(beforeTimeStamp(0), '{y}-{m}-{d}');
+			
+			
+			this.getPowerDetection()
+		},
+		methods: {
+			selector2confirm(e){
+				this.queryDate=e.year+"-"+e.month+'-'+e.day	
+				this.getPowerDetection()
+			},
+			getPowerDetection(){
+				uni.showLoading({
+					title: "加载中",
+					mask: true,
+				})
+				
+				API.powerDetection({
+					queryDate:this.queryDate,
+					meterId:this.meterNo,
+					type:this.type
+				}).then(response => {
+						uni.hideLoading();
+							
+					this.currentMap = response.data.currentMap;
+					this.graphMap= response.data.graphMap
+					this.setMap();
+					
+				}).catch(error => {
+					uni.showToast({
+						title: error,
+						icon: "none"
+					})
+				})
+			},
+			
+			setMap(){
+				this.timeList=[]
+				for(var i in  this.graphMap){
+					var mod=this.graphMap[i];
+					var time=mod.createTime	
+					mod.createTime=time.replace("-","/").replace("-","/")
+					this.timeList.push(i)
+				}
+				// sz1=['总功率','A相功率','B相功率','C相功率'];
+							
+				// sz2=['A相电流','B相电流','C相电流'];
+				// sz3=['A相电压','B相电压','C相电压'];
+				// sz4=['A相功率因数','B相功率因数','C相功率因数'];
+				// sz5=['平均功率因数'];
+				
+				var sz1=['总功率','A相功率','B相功率','C相功率'];
+				var sz2=['A相电流','B相电流','C相电流'];
+				var sz3=['A相电压','B相电压','C相电压'];
+				var sz4=['A相功率因数','B相功率因数','C相功率因数'];
+				var sz5=['平均功率因数'];
+				var sz6=['A相温度','B相温度','C相温度'];
+				var list=[];
+				
+				if(this.type=='T'){
+					//this.typeName='功率'
+					
+					
+					this.setSz(sz6,['temperature1','temperature2','temperature3'],list,this.graphMap)
+					
+					this.echarts('barEcharts',1,sz6,list);
+					
+				}
+				
+				if(this.type=='AF'){
+					//this.typeName='功率'
+					
+					
+					this.setSz(sz5,['averPowerFactor'],list,this.graphMap)
+					
+					this.echarts('barEcharts',1,sz5,list);
+					
+				}
+				if(this.type=='F'){
+					//this.typeName='功率'
+					
+					
+					this.setSz(sz4,['af','bf','cf'],list,this.graphMap,1)
+					
+					this.echarts('barEcharts',1,sz4,list);
+					
+				}if(this.type=='P'){
+					//this.typeName='功率'
+					
+					
+					this.setSz(sz4,['totalPower','ap','bp','cp'],list,this.graphMap)
+					
+					this.echarts('barEcharts',1,sz1,list);
+					
+				}else if(this.type=='A'){
+					//this.typeName='电流'
+							this.setSz(sz2,['aa','ba','ca'],list,this.graphMap)
+					this.echarts('barEcharts',0,sz2,list);
+					
+				}else if(this.type=='V'){
+					//this.typeName='电压'
+					this.setSz(sz3,['av','bv','cv'],list,this.graphMap)
+					
+					this.echarts('barEcharts',0,sz3,list);
+					
+				}
+				
+			},
+			setSz(sz1,sz2,list,energyCenterMapObj,k){
+				
+				for(var j in sz1){
+					
+					var ap={
+						 name: sz1[j],
+						 type: 'line',
+						  symbol: 'none',
+						  //      sampling: 'lttb',
+						// stack: 'Total',
+						 data:[]
+					}
+					list.push(ap)
+					
+					
+					for(var i in energyCenterMapObj){
+						var time=this.queryDate.replace("-","/").replace("-","/")
+						
+						var obj=energyCenterMapObj[i][sz2[j]];
+					
+						var time = new Date(time+' '+i).getTime()
+							if(k){
+								ap.data.push([time,obj?(obj).toFixed(2):0]);
+							}else{
+								ap.data.push([time,parseInt(obj)]);
+							}
+						
+						
+						
+					}
+				}
+			 
+			 
+				
+			},	echarts(className,color,legenddata,seriesdata){
+				var colorName="#333"
+				// if(color=='1'){
+				// 	colorName="#ECEDF0"
+				// }else{
+				// 	colorName="#333"
+				// }
+				
+				var myChart = echarts.init(document.getElementById(className), 'light');
+				myChart.clear()
+				var option = {
+							
+							  tooltip: {
+								trigger: 'axis',
+								borderColor:"#F0F0F0",
+								borderWidth:1,
+								backgroundColor:"#ffffff",
+								textStyle:{
+									color:"#333"
+								}
+							  },
+							  legend: {
+								data: legenddata,
+								  textStyle: {
+								      color: colorName
+								    }
+							  },
+							  grid: {
+								top: 40,
+								left: 8,
+								right: 8,
+								bottom: 10,
+								containLabel: true
+							  },
+							 
+							  xAxis: {
+								
+								type: 'time',
+								splitNumber: 4,
+								boundaryGap: false,
+								
+								axisLabel:{
+									 
+								    textStyle:{
+								      color:colorName
+								    }
+								  },
+								  axisLine:{
+									  show:true,
+								      lineStyle:{
+								        color:colorName
+								      }
+								    },
+							  },
+							  yAxis: {
+								type: 'value',
+								//name: '单位('+this.typeN+')',
+								  axisLabel:{
+									
+								      textStyle:{
+								        color:colorName
+								      }
+								    },  axisLine:{
+									  show:true,
+								      lineStyle:{
+								        color:colorName
+								      }
+								    },
+							  },
+							    dataZoom: [
+							      {
+							        type: 'inside',
+							        start: 0,
+							        end: 100
+							      },
+							      {
+							        start: 0,
+							        end: 100
+							      }
+							    ],
+							  series: seriesdata
+							};
+							console.log(option);
+					myChart.setOption(option);
 			}
 		}
+		
+		
+		
 	}
 </script>
 
@@ -92,15 +406,17 @@
      .main{
 		 padding: 32rpx;
 		 .title{
-			 display: flex;
-			 align-items: center;
-			 
+			
+			
 			 .icon{
 				 width: 8rpx;
 				 height: 32rpx;
 				 background-color: rgba(22,119,255,1);
 			 }
+			
 			 .text{
+				  display: flex;
+				  align-items: center;
 				 color: rgb(16,16,16);
 				 font-size: 36rpx;
 				 margin-left: 12rpx;
@@ -122,6 +438,16 @@
 			 border-radius: 8px;
 			 
 			 z-index: 999;
+			 table{
+				 background-color:#f1f2f5 ;
+				 color: #101010;
+				 padding:20rpx 10rpx;
+				 
+				     width: 100%;
+					td{
+						text-align: right;
+					}
+			 }
 		 }
 	 }
 </style>

pages/equipmentDataMonitoring/electronicMonitoring.vue

@@ -3,7 +3,7 @@
 		<view class="background">
 			<!-- 日期选择器 -->
 			<u-picker-select title="日期选择" v-model="tabsFrom.show2" :defaultTime="tabsFrom.show2Index" :endYear="endYear"
-				mode="time" :params="params" :noselect="false" @confirm="selector2confirm" @reset="selector2reset">
+				mode="time" :params="params" :noselect="false" @confirm="selector2confirm"  @cancel="selector2cancel" @reset="selector2reset">
 			</u-picker-select>
 
 			<view class="navbar-c">
@@ -167,37 +167,37 @@
 			</view>
 			<view class="grid">
 				<u-grid :col="3" :border="false">
-					<u-grid-item  @click="gotoInfo('3PhaseCurrentDetails','A')" >
+					<u-grid-item  @click="gotoInfo('3PhaseCurrentDetails','A','三相电流')" >
 						<view class="icon icon1">
 							<image class="img" src="@/assets/img/Image@1.png" mode=""></image>
 						</view>
 						<view class="grid-text">三相电流</view>
 					</u-grid-item>
-					<u-grid-item  @click="gotoInfo('3PhaseCurrentDetails','V')" >
+					<u-grid-item  @click="gotoInfo('3PhaseCurrentDetails','V','三相电压')" >
 						<view class="icon icon2">
 							<image class="img" src="@/assets/img/Image@2.png" mode=""></image>
 						</view>
 						<view class="grid-text">三相电压</view>
 					</u-grid-item>
-					<u-grid-item   @click="gotoInfo('3PhaseCurrentDetails','T')" >
+					<u-grid-item   @click="gotoInfo('3PhaseCurrentDetails','T','三相温度')" >
 						<view class="icon icon3" >
 							<image class="img" src="@/assets/img/Image@3.png" mode=""></image>
 						</view>
 						<view class="grid-text">三相温度</view>
 					</u-grid-item>
-					<u-grid-item  @click="gotoInfo('3PhaseCurrentDetails','P')" >
+					<u-grid-item  @click="gotoInfo('3PhaseCurrentDetails','P','三相有功功率')" >
 						<view class="icon icon4">
 							<image class="img" src="@/assets/img/Image@4.png" mode=""></image>
 						</view>
 						<view class="grid-text">三相有功功率</view>
 					</u-grid-item>
-					<u-grid-item  @click="gotoInfo('3PhaseCurrentDetails','F')"  >
+					<u-grid-item  @click="gotoInfo('3PhaseCurrentDetails','F','三相功率因数')"  >
 						<view class="icon icon5"   >
 							<image class="img" src="@/assets/img/Image@5.png" mode=""></image>
 						</view>
 						<view class="grid-text">三相功率因数</view>
 					</u-grid-item>
-					<u-grid-item   @click="gotoInfo('3PhaseCurrentDetails','AF')"  >
+					<u-grid-item   @click="gotoInfo('3PhaseCurrentDetails','AF','平均功率因数')"  >
 						<view class="icon icon6" >
 							<image class="img" src="@/assets/img/Image@5.png" mode=""></image>
 						</view>
@@ -207,7 +207,7 @@
 			</view>
 		</view>
 		<!-- 数据分析 -->
-		<view class="data-analysis">
+		<view class="data-analysis" v-if="false">
 			<view class="title">
 				<view class="icon">
 
@@ -219,13 +219,13 @@
 			</view>
 			<view class="grid">
 				<u-grid :col="3" :border="false">
-					<u-grid-item  @click="gotoInfo('chartYoYMoM','YoY')" >
+					<u-grid-item  @click="gotoInfo('chartYoYMoM','YoY','同比分析')" >
 						<view class="icon icon7">
 							<image class="img" src="@/assets/img/Image@7.png" mode=""></image>
 						</view>
 						<view class="grid-text">同比分析</view>
 					</u-grid-item>
-					<u-grid-item  @click="gotoInfo('chartYoYMoM','MoM')"  >
+					<u-grid-item  @click="gotoInfo('chartYoYMoM','MoM','环比分析')"  >
 						<view class="icon icon8">
 							<image class="img" src="@/assets/img/Image@8.png" mode=""></image>
 						</view>
@@ -372,7 +372,7 @@
 		getWeek
 	} from '@/apis/utils'
 	import * as echarts from 'echarts';
-	import * as API from '@/apis/pagejs//index.js'
+	import * as API from '@/apis/pagejs/index.js'
 
 	export default {
 		data() {
@@ -484,8 +484,8 @@
 			this.getBarCharts(false);
 		},
 		methods: {
-			gotoInfo(path,type){
-							 if(!this.meterId){
+			gotoInfo(path,type,name){
+							 if(!this.FormData.meterId){
 								uni.showToast({
 									title: "未查询到电表",
 									icon: "none"
@@ -494,7 +494,7 @@
 								 return
 							 }
 							 uni.navigateTo({
-								 url:"/pages/equipmentDataMonitoring/"+path+"?id="+this.meterId+"&type="+type
+								 url:"/pages/equipmentDataMonitoring/"+path+"?id="+this.FormData.meterId+"&type="+type+"&typeName="+name
 							 })
 						
 			},
@@ -540,7 +540,7 @@
 					this.FormData.queryDate = parseUnixTime(new Date(), '{y}-{m}-{d}');
 					this.FormData2.meterId = e[2].value;
 					this.FormData2.queryDate = parseUnixTime(new Date(), '{y}-{m}-{d}');
-
+					//this.meterId =e[2].value;
 					this.FormData.type = 2;
 					this.value = '2';
 
@@ -794,6 +794,9 @@
 					this.queryDate(this.tabsFrom.show2Index, false)
 				}
 			},
+			selector2cancel(){
+				this.value=this.clickType;
+			},
 			selector2reset(e) {
 				console.log(e)
 				this.tabsFrom.show2Text = '全部时间'