zkx 1 year ago
parent
commit
f58f18f68d
1 changed files with 117 additions and 94 deletions
  1. 117 94
      pagesFinance/statistics/index.vue

+ 117 - 94
pagesFinance/statistics/index.vue

@@ -159,7 +159,7 @@
 		<u-picker mode="time" v-model="popupShow2" @confirm="changedate2" :default-time="queryTime2+'-01'"
 			:params="params"></u-picker>
 			
-		<u-popup v-model="popupShow3" mode="bottom" height="80%">
+		<u-popup border-radius="30" v-model="popupShow3" mode="bottom" height="80%">
 			<view class="popup-screen">
 				<view class="screen">
 					
@@ -215,10 +215,11 @@
 			</view>
 		</u-popup>
 		
-		<u-popup v-model="popupShow7" mode="bottom" height="80%">
+		<u-popup border-radius="30" v-model="popupShow7" mode="bottom" height="80%">
+			<h2 style="padding: 40rpx 40rpx 0 40rpx;">充电枪使用情况统计</h2>
 			<view class="popup-screen">
 				<view class="screen">
-					<view class="screen-item">
+					<view class="screen-item" v-if="false">
 						<view class="screen-head">显示图表类型</view>
 						<view class="screen-main">
 							
@@ -241,7 +242,7 @@
 							
 						</view>
 					</view>	
-					<view class="screen-item">
+					<view class="screen-item" v-if="false">
 						<view class="screen-head">充电桩类型<span style="color: red;">*</span><span style="color:rgb(136, 136, 136)">(可多选)</span></view>
 						<view class="screen-main">
 							
@@ -284,7 +285,12 @@
 					<view class="screen-item">
 						<view class="screen-head">站点类型<span style="color: red;">*</span></view>
 						<view class="screen-main">
-							
+							<view class="screen-entry  "
+							:class="{
+								active:selectstationNo7==''&&selectstationId7==''
+							}"
+							 @click="selectstationId7='',selectstationNo7='',selectOneTemp={name:'全部站点'}"
+							>全部</view>
 							
 							<template v-for="(item,i) in stationList" >
 								 
@@ -293,7 +299,7 @@
 									active:selectstationNo7==item.stationNo.substring(0,1)
 								}"
 								 @click="selectstationId7='',selectstationNo7=item.stationNo.substring(0,1)"
-								 v-if="getStationNo(i)"  :key="i" >
+								 v-if="getStationNo(i)&&item.stationNo.substring(0,1)!='D'&&item.stationNo.substring(0,1)!='E'"  :key="i" >
 								
 								{{item.stationNo.substring(0,1)}}类</view>
 								
@@ -324,68 +330,38 @@
 						 
 					</view>
 					
-					<view class="screen-item" style="margin-bottom: 40rpx;" >
-												<view class="screen-head">时间段查询</view>
-												<view class="screen-main">
+					<view class="screen-item" style="margin-bottom: 40rpx;   " >
+												<view class="screen-head">时间段查询<span  style="color:rgb(136, 136, 136);margin-left: 20rpx;">   (勾选启用)</span></view>
+												<view class="screen-main" style=" align-items: center;">
 													<view>
 														<checkbox-group  @change="checkboxChange1">
 															<checkbox  value="cb" :checked="sliderNumTemp1.ck" ></checkbox>{{sliderNumTemp1.ck?'开启':'关闭'}}
 														</checkbox-group>
 													</view>
 													<view style="
-					    width: 80%;margin-bottom: 8rpx;
-					">
-														<DoubleSlider
-																					ref="obc_voltage"
-																					sliderHeight="15rpx"
-																					blockSize="36rpx"
-																					:minValue="0"
-																					:maxValue="24"
-																					:step="1"
-																					
-																					:currentMinValue="sliderNumTemp1.minValue"
-																					:currentMaxValue="sliderNumTemp1.maxValue"
-																					labelColor="#B8C9C5"
-																					borderRadius="25rpx"
-																					borderColor="#00B962"
-																					borderStyle="solid"
-																					borderWidth="3rpx"
-																					blockColor="#FFFFFF"
-																					activeColor="#00B962"
-																					indicatorColor="#DBDBDB"
-																					@change="handlerDoubleSlider1"
-																			>	</DoubleSlider>
+																width: 50%;margin-bottom: 8rpx;margin-left: 20rpx;
+															">
+														<u-select v-model="sliderNum1Show"  :default-value="[sliderNumTemp1.minValue,sliderNumTemp1.maxValue-sliderNumTemp1.minValue-1] "  mode="mutil-column-auto"  @confirm="handlerDoubleSlider1" :list="sliderNumList" ></u-select>
+														<view @click="sliderNum1Show = true" style="
+															border: 1px solid;
+															padding: 5px;
+														" >{{sliderNumTemp1.minValue+'点至'+(sliderNumTemp1.minValue>sliderNumTemp1.maxValue?'次日':'')+sliderNumTemp1.maxValue+'点'}}</view>
 													</view>
 												</view>
-												<view class="screen-main">
+												<view class="screen-main" style=" align-items: center;" >
 													<view>
 														<checkbox-group  @change="checkboxChange2">
 															<checkbox  value="cb" :checked="sliderNumTemp2.ck" ></checkbox>{{sliderNumTemp2.ck?'开启':'关闭'}}
 														</checkbox-group>
 													</view>
 													<view style="
-														width: 80%;margin-bottom: 8rpx;
+														width: 50%;margin-bottom: 8rpx;margin-left: 20rpx;
 													">
-														<DoubleSlider
-																					ref="obc_voltage"
-																					sliderHeight="15rpx"
-																					blockSize="36rpx"
-																					:minValue="0"
-																					:maxValue="24"
-																					:step="1"
-																					
-																					:currentMinValue="sliderNumTemp2.minValue"
-																					:currentMaxValue="sliderNumTemp2.maxValue"
-																					labelColor="#B8C9C5"
-																					borderRadius="25rpx"
-																					borderColor="#00B962"
-																					borderStyle="solid"
-																					borderWidth="3rpx"
-																					blockColor="#FFFFFF"
-																					activeColor="#00B962"
-																					indicatorColor="#DBDBDB"
-																					@change="handlerDoubleSlider2"
-																			>	</DoubleSlider>
+														<u-select v-model="sliderNum2Show" :default-value="[sliderNumTemp2.minValue,sliderNumTemp2.maxValue-sliderNumTemp2.minValue-1] "  mode="mutil-column-auto"  @confirm="handlerDoubleSlider2" :list="sliderNumList" ></u-select>
+														<view @click="sliderNum2Show = true" style="
+															border: 1px solid;
+															padding: 5px;
+														" >{{sliderNumTemp2.minValue+'点至'+(sliderNumTemp2.minValue>sliderNumTemp2.maxValue?'次日':'')+sliderNumTemp2.maxValue+'点'}}</view>
 													</view>
 												</view>
 											</view>
@@ -805,8 +781,8 @@
 				</view>
 			</view>
 			
-			<view class="statisticsChart-head" style="margin-top: 40rpx;">
-				<h4>充电使用率统计</h4>
+			<view class="statisticsChart-head" style="margin-top: 40rpx;" v-show="info.merchantAccountName=='51充电联盟'">
+				<h4>充电枪使用情况统计</h4>
 				<!-- <view class="navbar-screen" >
 					 {{startTime}}至{{endTime}}
 				 </view> -->
@@ -816,20 +792,20 @@
 			
 			
 			</view>
-			<view @click="resetBtn7()" style="color: rgb(153, 153, 153);    margin: 40rpx;text-align: center;padding: 8px;border: 1px solid rgb(153, 153, 153);" v-if="stationId3==''">
-				默认不查询,点击筛选
+			<view  style="color: rgb(153, 153, 153);    margin: 40rpx;text-align: center;padding: 8px;" v-show="info.merchantAccountName=='51充电联盟'" v-if="!indexData6">
+				加载中,请稍后...
 			</view>
 			<view  v-else style="
-    color: #888888;
-" >
-				<view v-if="selectOne">[ {{selectShowNumType==1?'百分比':'次数'}} ] {{selectOne.name}}</view>
+				color: #888888;
+			" >
+				<view v-if="selectOne"><!-- [ {{selectShowNumType==1?'百分比':'次数'}} ] --> {{selectOne.name}}</view>
 				<view>{{startTime3}}至{{endTime3}};
 				<span v-if="sliderNum1.ck">{{sliderNum1.minValue}}点-{{sliderNum1.maxValue}}点;</span>
 				<span v-if="sliderNum2.ck">{{sliderNum2.minValue}}点-{{sliderNum2.maxValue}}点;</span>
 				</view>
 				
 			</view>
-			<view class="detailstableHead" style="
+			<view class="detailstableHead"  style="
 						padding-top: 1px;
 					">
 				<view id="pieEcharts2" style="margin-top: 40rpx">
@@ -923,7 +899,7 @@
 				changeitemBl: false,
 				myChart2: null,
 				myChart: null,
-				myChartReady: false,
+				myChartReady: true,
 				myChartTime: false,
 				subsection: [{
 						name: '金额'
@@ -987,7 +963,7 @@
 				showMonthlyCard: false,
 				flag: false,
 				//selectstationId: "",
-				selectOne:{},
+				selectOne:{name:'全部站点'},
 				selectOneTemp:{},
 				selectShowNumType:1,
 				selectShowNumTypeTemp:1,
@@ -1001,7 +977,12 @@
 				
 				sliderNumTemp1: { ck:0,minValue: 0, maxValue: 5 },
 				sliderNumTemp2: { ck:0,minValue: 0, maxValue: 5 },
+				sliderNum1Show:false,
+				sliderNum2Show:false,
+				sliderNumList:[
 				
+					
+				],
 			}
 		},
 		onShow() {
@@ -1033,6 +1014,24 @@
 				this.windowWidth = e[1].windowWidth
 				this.windowHeight = e[1].windowHeight
 			})
+			this.sliderNumList=[]
+			var sz=[]
+			for(var i =0;i<24;i++){
+				var sz2=[]
+				for(var j =i+1;j<=24;j++){
+					sz2.push({
+						value: j,
+						label: j+'点'
+					})
+				}
+				sz.push({
+					value: i,
+					label: i+'点',
+					children:sz2
+				})
+			}
+			console.log(sz)
+			this.sliderNumList=sz
 		},
 		components: {
 			Tabbar,DoubleSlider
@@ -1088,20 +1087,22 @@
 			},
 			handlerDoubleSlider1(e) {
 				console.log(e)
-				var a=e.minValue.toFixed(0)
-				var b=e.maxValue.toFixed(0)
+				// var a=e.minValue.toFixed(0)
+				// var b=e.maxValue.toFixed(0)
 				
 				
-				this.sliderNumTemp1.minValue=a
-				this.sliderNumTemp1.maxValue=b
+				this.sliderNumTemp1.minValue=e[0].value
+				this.sliderNumTemp1.maxValue=e[1].value
 			},
 			handlerDoubleSlider2(e) {
-				var a=e.minValue.toFixed(0)
-				var b=e.maxValue.toFixed(0)
+			// 	var a=e.minValue.toFixed(0)
+			// 	var b=e.maxValue.toFixed(0)
 			
 				
-				this.sliderNumTemp2.minValue=a
-				this.sliderNumTemp2.maxValue=b
+			// 	this.sliderNumTemp2.minValue=a
+			// 	this.sliderNumTemp2.maxValue=b
+				this.sliderNumTemp2.minValue=e[0].value
+				this.sliderNumTemp2.maxValue=e[1].value
 						//			console.log('e'+JSON.stringify(e))
 						//this.preference.obc_power = e;
 						//this.preference.obc_power.minValue = e.minValue;
@@ -1295,8 +1296,10 @@
 						// this.selectOne=list2[0]
 						// this.selectstationNo7=this.selectOne.stationNo.substring(0,1)
 						// this.selectstationId7=this.selectOne.id
+						if(this.info.merchantAccountName=='51充电联盟'){
+							this.getData3()
+						}
 						
-						// this.getData3()
 					}
 					
 					// this.stationList.unshift({
@@ -1481,12 +1484,14 @@
 				this.endTime3Temp = e.endDate
 				
 			},
-			getData3(bl) {
+			getData3(bl) {
+				this.indexData6=null
 				if(bl){
 					uni.showLoading({
 						title: "加载中",
 						mask: true,
-					})
+					})
+					this.myChartReady=false
 				}
 			
 				
@@ -1513,9 +1518,11 @@
 				
 				API.usageStatistics(this.form3).then((res) => {
 					this.indexData6 = res.data
-					if(bl){
+					if(bl){
+						this.myChartReady=true
 						uni.hideLoading()
-					}
+					}
+					
 					this.getPie2(this.indexData6)
 					
 			
@@ -1556,17 +1563,18 @@
 				this.sliderNumTemp1=this.sliderNum1
 				this.sliderNumTemp2=this.sliderNum2
 				this.selectShowNumTypeTemp2=this.selectShowNumType2
-				this.selectShowNumTypeTemp1=this.selectShowNumType1
+				this.selectShowNumTypeTemp1=this.selectShowNumType1
+				this.selectOneTemp=this.selectOne;
 				
 			},
 			okbtn7(){
-				if(this.selectstationId7==''){
-					uni.showToast({
-						icon:"none",
-						title:"请选择站点"
-					})
-					return
-				}
+				// if(this.selectstationId7==''){
+				// 	uni.showToast({
+				// 		icon:"none",
+				// 		title:"请选择站点"
+				// 	})
+				// 	return
+				// }
 				if(this.selectShowNumTypeTemp2==0&&this.selectShowNumTypeTemp1==0){
 					uni.showToast({
 						icon:"none",
@@ -1660,23 +1668,38 @@
 
 			},
 			getPie2(obj) {
+				
+				var data=[]
+				var data1=[]
+				var data2=[]
+				var top='6%'
+				var usageFastMap=obj.usageFastMap;
+				for(var i in usageFastMap){
+					data.push(i)
+				}
+				var height=1680;
+				
 				
 				if (!this.myChart2) {
 					this.myChart2 = echarts.init(document.getElementById('pieEcharts2'),null,{
-						width:uni.upx2px(700),height:uni.upx2px(1680)
+						width:uni.upx2px(700),height:uni.upx2px(height)
 					});
+				}else{
+					if(data.length!=24){
+						height=1680*data.length/24+200
+						console.log(data.length)
+						top='10%'
+					}
+					this.myChart2.resize({
+						height:uni.upx2px(height),width:uni.upx2px(700)
+					})
+					
 				}
 				this.myChart2.clear();
 				
-				var usageFastMap=obj.usageFastMap;
-				var usageSlowMap=obj.usageSlowMap;
-				var data=[]
-				var data1=[]
-				var data2=[]
 				
-				for(var i in usageFastMap){
-					data.push(i)
-				}
+				var usageSlowMap=obj.usageSlowMap;
+			
 				data.reverse()
 				var num1=0;
 				var num2=0;
@@ -1763,7 +1786,7 @@
 					  },
 					  legend: {},
 					 grid: {
-					 	top: '6%',
+					 	top: top,
 					 	left: '3%',
 					 	right: '8%',
 					 	bottom: '3%',