去年前年

pagesFinance/statistics/index.vue

@@ -1,5 +1,9 @@
 <template>
-	<view>
+	<view>
+		<u-select v-model="popupShow8"  
+			 @confirm="byYearConfirm" :default-value="byYearDefaultValue"
+			:list="byYear"></u-select>
+			
 		<view class="top-cover">
 			<view>
 				<view class="navbar-tit" :class="{
@@ -62,24 +66,24 @@
 					<view class="statisticsChart-head ">
 						<h4 class="h4-1"><img src="@/assets/img/riFill-numbers-fill.svg" alt="">充电统计</h4>
 
-						<view class="navbar-screen " v-if="info.accountType==1">
+						<view class="navbar-screen headbottonMain " v-if="info.accountType==1">
 							<!-- 个人 -->
-							<u-button text="月落" size="mini" class="headbotton1" style="border-radius: 10px 0 0 10px;"
+							<u-button text="月落" size="mini" class="headbotton headbotton1" style="border-radius: 10px 0 0 10px;"
 								:type="current==1?'success':'info'" @click="changesub(1)">天报</u-button>
 
-							<u-button text="月落" size="mini" class="headbotton2" style="border-radius: 0 0 0 0;"
+							<u-button text="月落" size="mini" class="headbotton headbotton2" style="border-radius: 0 0 0 0;"
 								:type="current==2?'success':'info'" @click="changesub(2)">月报</u-button>
 
-							<u-button text="月落" size="mini" class="headbotton3" style="border-radius: 0 10px 10px 0;"
+							<u-button text="月落" size="mini" class="headbotton headbotton3" style="border-radius: 0 10px 10px 0;"
 								:type="current==3?'success':'info'" @click="changesub(3)">年报</u-button>
 
 						</view>
 						<view class="navbar-screen " v-else>
 							<!-- 个人 -->
-							<u-button text="月落" size="mini" class="headbotton1" style="border-radius: 10px 0 0 10px;"
+							<u-button text="月落" size="mini" class="headbotton headbotton1" style="border-radius: 10px 0 0 10px;"
 								:type="current==1?'success':'info'" @click="changesub(1)">天报</u-button>
 
-							<u-button text="月落" size="mini" class="headbotton3" style="border-radius: 0 10px 10px 0;"
+							<u-button text="月落" size="mini" class="headbotton headbotton3" style="border-radius: 0 10px 10px 0;"
 								:type="current==2?'success':'info'" @click="changesub(2)">月报</u-button>
 
 						</view>
@@ -87,12 +91,23 @@
 				</view>
 
 				<view class="detailstableHead" style="
-							padding-top: 1px;
-						">
-					<view id="pieEcharts" style="min-height:240px;margin-top: 40rpx">
+							padding-top: 40rpx;
+						">
+					
+						<p style="text-align: center; margin-bottom: 5px;"
+						v-if="type_head==3&&indexData3" 
+						 @click="popupShow8 = true">
+							
+						
+							对比统计年份 {{byYearText}}
+							<u-icon name="arrow-down" color="#b0b8c8" size="32" v-show="!popupShow8"></u-icon>
+							<u-icon name="arrow-up" color="#b0b8c8" size="32" v-show="popupShow8"></u-icon>
+						</p>
+					<view id="pieEcharts" style="min-height:240px;">
 
 					</view>
-					<view v-if="type_head==3&&indexData3" 
+					
+					<view v-if="type_head==3&&indexData3&&byYear.length&&byYearStart==byYear[0].value+'-01-01'" 
 					style="    color: #777777; font-size: 24rpx;" >去年同期数据查询：{{indexData3?indexData3.graphMap.lastSamePeriodTime:''}}</view>
 				</view>
 				<view class="detailstableHead" v-if="indexData&&false">
@@ -869,7 +884,8 @@
 				popupShow4: false,
 				popupShow5: false,
 				popupShow6: false,
-				popupShow7: false,
+				popupShow7: false,
+				popupShow8: false,
 				nowTime: 0,
 				queryHeadTime: "",
 				selectstationId2: "",
@@ -996,7 +1012,11 @@
 				sliderNumList: [
 
 
-				],
+				],
+				byYear:[],
+				byYearText:"",
+				byYearStart:"",
+				byYearDefaultValue:[0],
 			}
 		},
 		onShow() {
@@ -1015,7 +1035,7 @@
 			})
 		},
 		onLoad() {
-
+			
 
 			this.info = this.carhelp.getPersonInfo()
 			this.info = this.carhelp.getPersonInfo()
@@ -1075,8 +1095,18 @@
 		onReady() {
 			var date = new Date();
 			this.nowTime = 7
-
-
+			this.byYear=[]
+			for(var i=(date.getFullYear());i>(date.getFullYear()-2);i--){
+				
+				this.byYear.push({
+					value:i,
+					label:(i-1)+"-"+i
+				})
+			}
+			console.log(this.byYear)
+			this.byYearText=(date.getFullYear()-1)+"-"+(date.getFullYear())
+			this.byYearStart= parseUnixTime(new Date(), '{y}-01-01')
+			
 			this.queryTime = parseUnixTime(currentTimeStamp(), '{y}-{m}');
 			this.queryTime2 = parseUnixTime(currentTimeStamp(), '{y}-{m}'),
 
@@ -1143,7 +1173,21 @@
 			this.onPageScrollMethod()
 		},
 
-		methods: {
+		methods: {
+			byYearConfirm(e){
+				
+				var value=e[0].value
+				this.byYearText=(value-1)+"-"+value
+				this.byYearStart=value+'-01-01'
+				var i= this.byYear.findIndex(item=>{
+					return item.value==(value)
+				})
+				console.log(i)
+				this.byYearDefaultValue=[i]
+				this.startDate_head =this.byYearStart 
+				this.getDataHome2(1)
+				
+			},
 			checkboxChange1(e) {
 				this.sliderNumTemp1.ck = e.detail.value.length
 			},
@@ -1443,12 +1487,16 @@
 
 				this.getData2()
 			},
-			getDataHome2() {
-
+			getDataHome2(bl) {
 
+				if(bl){
+					uni.showLoading()
+				}
 
 				var endtime = parseUnixTime(currentTimeStamp(), '{y}-{m}-{d}')
-
+				if( this.type_head==3&&this.startDate_head!=new Date().getFullYear()+"-01-01"){
+					endtime=this.byYear[1].value+"-12-31"
+				}
 				API.homeHeadChargingStatistics({
 					type: this.type_head,
 					startDate: this.startDate_head,
@@ -1616,10 +1664,10 @@
 				} else if (e == 2) {
 					this.startDate_head = parseUnixTime(beforeTimeStamp(365), '{y}-{m}-01')
 				} else if (e == 3) {
-					this.startDate_head = parseUnixTime(new Date(), '{y}-01-01')
+					this.startDate_head =this.byYearStart 
 				}
 				//	this.getPie()
-				this.getDataHome2()
+				this.getDataHome2(1)
 			},
 			changedate4(e) {
 				this.startTime = e.startDate
@@ -1941,9 +1989,15 @@
 				var keyStr = ['收入\n(含卡)', '利润\n(含卡)', '充电量', '6折卡', '月卡']
 				var keyStrN = ['收入（含卡）', '利润（含卡）', '充电量', '6折卡', '月卡']
 				var keyStrT = ['收入', '利润', '充电量', '6折卡', '月卡']
-				
+				var key1=new Date().getFullYear()+"-01-01"==this.byYearStart?"今年":"去年"
+				var key2=new Date().getFullYear()+"-01-01"==this.byYearStart?"去年":"前年"
+				var key3=['去年同期数据','今年同期完成比']
+				if(new Date().getFullYear()+"-01-01"!=this.byYearStart){
+					key3=['前年数据','去年数据']
+				}
 				var sz1 = []
-				var sz2 = []
+				var sz2 = []
+				
 				key.forEach(item => {
 					var i1 = getData['nowYear' + item]
 					var i2 = getData['lastSamePeriod' + item]
@@ -1953,16 +2007,22 @@
 					}else if (i1 &&i2 == 0) {
 						sz1.push(100)
 						sz2.push(0)
-					}  else {
-						sz1.push((i1 / (i2) * 100.00).toFixed(2))
-						if (i1 < i2) {
-							sz2.push(((i2 - i1) / (i2) * 100.00).toFixed(2))
-						} else {
-							sz2.push(0)
+					}  else {
+						if(new Date().getFullYear()+"-01-01"==this.byYearStart){
+							//完成情况
+							sz1.push((i1 / (i2) * 100.00).toFixed(2))
+							if (i1 < i2) {
+								sz2.push(((i2 - i1) / (i2) * 100.00).toFixed(2))
+							} else {
+								sz2.push(0)
+							}
+							
+						}else{
+							sz1.push((i1 / (i1+i2) * 100.00).toFixed(2))
+							sz2.push((i2 / (i1+i2) * 100.00).toFixed(2))
 						}
-
+						
 					}
-
 				})
 				var option = {
 
@@ -1991,16 +2051,23 @@
 							//console.log(value)
 							var dataIndex = value[0].dataIndex;
 							var name =keyStrN[dataIndex];
-							var style = "float: right;margin-left: 20px;"
+							var style = "float: right;margin-left: 20px;"
+							
 							var prefix = ["lastYear", "lastSamePeriod", "nowYear"]
-							var prefixStr = ["去年全年", "去年同期", "今年同期"]
+							var prefixStr = [key2+"全年", key2+"同期", key1+"同期"]
+							
+							if(new Date().getFullYear()+"-01-01"!=this.byYearStart){
+								 prefix = ["lastYear",  "nowYear"]
+								 prefixStr = [key2+"全年", key1+"全年"]
+							}
 							var u = ['元', '元', '度', '张', '张']
 							var keytool = ["AmountCard", "ProfitCard", "EQAmount", "DiscountCardBuyNum",
 								"MonthCardBuyNum"
 							]
 							var text1 = ""
 							//去年全年数据、去年同期数据、今年当前数据和同期完成比。
-							var k = null;
+							var k = null;
+							var sz=[];
 							for (var j in prefix) {
 								var pre = prefix[j]
 
@@ -2017,16 +2084,25 @@
 								} else if (j == 2) {
 									uu = k
 								}
+								sz.push(num)
 								var showNum=(num / uu.num).toFixed(uu.num>100?2:0)
 								
 								text1 += "<p>" + prefixStr[j] +keyStrT[dataIndex]+
 									'<span style="' + style +
 									'">' + (u[dataIndex]=='张'?num:showNum) + uu.u + u[dataIndex] + '</span></p>';
 
+							}
+							if(new Date().getFullYear()+"-01-01"==this.byYearStart){
+								text1 += "<p>"+key1+"同期完成比" +
+									'<span style="' + style +
+									'">' + value[0].data + '%</span></p>';
+							}else{
+								var zzl=((sz[1]-sz[0])/sz[0]*100).toFixed(2)
+								text1 += "<p>"+key1+"增长率" +
+									'<span style="' + style +
+									'">' + zzl + '%</span></p>';
 							}
-							text1 += "<p>今年同期完成比" +
-								'<span style="' + style +
-								'">' + value[0].data + '%</span></p>';
+							
 
 
 							return `<p>` + value[0].marker + `${name}</p>` + text1
@@ -2034,7 +2110,7 @@
 						}
 					},
 					legend: {
-						data: ['去年同期数据', '今年同期完成比']
+						data: key3
 					},
 					grid: {
 						top: 30,
@@ -2051,7 +2127,7 @@
 						type: 'value'
 					},
 					series: [{
-							name: '今年同期完成比',
+							name: key3[1],
 							type: 'bar',
 							stack: '总量', // 指定堆叠的组名
 							label: {
@@ -2067,7 +2143,7 @@
 							data: sz1
 						},
 						{
-							name: '去年同期数据',
+							name: key3[0],
 							type: 'bar',
 							label: {
 								show: true,
@@ -2937,8 +3013,17 @@
 			margin-left: 16rpx;
 			display: inline;
 		}
+	}
+	.headbottonMain{
+		/deep/.u-btn--info{
+			color:#19be6b;
+		}
 	}
-
+	.headbotton{
+		border: 1px solid #19be6b;
+		
+	}
+	
 	.headbotton1:after {
 		border-radius: 15px 0 0 15px;
 	}