用电量明细

pages/equipmentDataMonitoring/electricityConsumptionDetail.vue

@@ -22,9 +22,14 @@
 				</view>
 			</view>
 		</view>
-		<u-select v-model="show1" mode="single-column" :list="electricMeterList"></u-select>
+		
+		<u-select title="设备选择" v-model="show1" mode="mutil-column-auto" :list="electricMeterList"
+			@confirm="electricMeterChange" cancel-text="重置" @cancel="electricMeterReset">
+		</u-select>
 
-		<u-select v-model="show2" mode="single-column" :list="monthList"></u-select>
+		<u-select v-model="show2" mode="single-column" :list="monthList" @confirm="monthChange"></u-select>
+		
+		<u-picker mode="time" :defaultTime="defaultTime" v-model="show3" :params="params" @confirm="timeChange"></u-picker>
 
 		<view class="table-box">
 			<table class="table1">
@@ -33,24 +38,31 @@
 					<td class="td2">起止码</td>
 					<td class="td3">度数</td>
 				</tr>
-				<tr v-for="(item,i) in list" :key="i">
-					<td class="td1">{{item.name}}</td>
+				<tr>
+					<td class="td1">{{kwhMap.meterName}}</td>
 					<td class="td2">
-						{{item.startStop}}
-
+						{{kwhMap.startMeter!=null ? kwhMap.startMeter : '0'}}-{{kwhMap.endMeter!=null ? kwhMap.endMeter : '0'}}
+					</td>
+					<td class="td3">{{kwhMap.kwh}}度</td>
+				</tr>
+				
+				<tr v-for="(item,i) in childMap" :key="i">
+					<td class="td1">{{item.meterName}}</td>
+					<td class="td2">
+						{{item.startMeter!=null ? item.startMeter : '0'}}-{{item.endMeter!=null ? item.endMeter : '0'}}
 					</td>
-					<td class="td3">{{item.degrees}}度</td>
+					<td class="td3">{{item.kwh}}度</td>
 				</tr>
 				<tr>
 					<td class="td1" colspan="2">二级表合计用电</td>
 
-					<td>60度</td>
+					<td>{{childKwh}}度</td>
 				</tr>
 
 				<tr style="font-weight: bold;">
 					<td class="td1" colspan="2">扣除后用电量</td>
 
-					<td>1.53度</td>
+					<td>{{subKwh}}度</td>
 				</tr>
 			</table>
 		</view>
@@ -59,56 +71,203 @@
 </template>
 
 <script>
+	import * as API_electricityMeter from '@/apis/pagejs/electricityMeter.js'
+	import * as API from '@/apis/pagejs/index.js'
+
 	export default {
 		data() {
 			return {
+				childKwh: 0,
+				childMap: {},
+				kwhMap: {},
+				subKwh: 0,
+				id: '',
+				meterName: '',
+				meterId: '',
+				type: '2',
+				queryDate: '',
 				electricMeter: '11楼公摊电表',
 				month: '上月',
 				show1: false,
 				show2: false,
 				electricMeterList: [],
-				monthList: [],
-				list: [{
-						name: '11楼公摊电表',
-						startStop: '100-161.53',
-						degrees: 61.53
-					},
-					{
-						name: '二级表a',
-						startStop: '0-10',
-						degrees: 10
-					},
-					{
-						name: '二级表b',
-						startStop: '0-10',
-						degrees: 10
-					},
-					{
-						name: '二级表c',
-						startStop: '0-10',
-						degrees: 10
-					},
-					{
-						name: '二级表d',
-						startStop: '0-10',
-						degrees: 10
-					},
-					{
-						name: '二级表e',
-						startStop: '0-10',
-						degrees: 10
-					},
-					{
-						name: '二级表f',
-						startStop: '0-10',
-						degrees: 10
-					},
-
-				],
+				monthList: [{
+					value: '1',
+					label: '本月'
+				}, {
+					value: '4',
+					label: '今日'
+				}, {
+					value: '2',
+					label: '上月'
+				}, {
+					value: '3',
+					label: '本年'
+				}, {
+					value: '0',
+					label: '合计'
+				}, {
+					value: '10',
+					label: '指定月份'
+				}],
+				show3: false, // 时间选择
+				defaultTime: '',
+				params: {
+					year: true,
+					month: true,
+					day: false,
+					hour: false,
+					minute: false,
+					second: false,
+					timestamp: false
+				},
+			}
+		},
+		onLoad(op) {
+			if(op.id) {
+				this.meterId = op.id;
+				this.electricMeter =  op.name;
+				this.id = op.id;
+				this.meterName =  op.name;
+				
+				this.getElectricityStatisticsDetails();
+				this.getCompanyInfoList();
 			}
+			
+			var date = new Date();
+			var year = date.getFullYear();
+			var month = date.getMonth()+1 >= 10 ? date.getMonth()+1 : '0'+(date.getMonth()+1);
+			this.defaultTime = year + '-' + month;
 		},
 		methods: {
-
+			timeChange(params) {
+				// console.log(params)
+				this.month = params.year + '-' + params.month;
+				this.queryDate = params.year + '-' + params.month + '-01';
+				
+				this.getElectricityStatisticsDetails();
+			},
+			electricMeterReset() {
+				this.meterId = this.id;
+				this.electricMeter =  this.meterName;
+				
+				this.getElectricityStatisticsDetails();
+			},
+			electricMeterChange(e) {
+				this.meterId = e[2].value;
+				this.electricMeter = e[2].label;
+				
+				this.getElectricityStatisticsDetails();
+			},
+			monthChange(e) {
+				this.type = e[0].value;
+				
+				if(e[0].value == '10') {
+					this.show3 = true;
+				} else {
+					this.month = e[0].label;
+					this.getElectricityStatisticsDetails();
+				}
+			},
+			getElectricityStatisticsDetails() {
+				uni.showLoading({
+					title: "加载中",
+					mask: true,
+				})
+				API_electricityMeter.electricityStatisticsDetails({
+					meterId: this.meterId,
+					type: this.type,
+					queryDate: this.queryDate,
+				}).then((res) => {
+					uni.hideLoading();
+					this.childKwh = res.data.childKwh;
+					this.childMap = res.data.childMap;
+					this.kwhMap = res.data.kwhMap;
+					this.subKwh = res.data.subKwh;
+				}).catch(error => {
+					uni.showToast({
+						title: error,
+						icon: "none"
+					})
+				})
+			},
+			getCompanyInfoList() {
+				uni.showLoading({
+					title: "加载中",
+					mask: true,
+				})
+				API.deviceCompanyList().then((response) => {
+					uni.hideLoading();
+					var list = response.data.companyInfoList;
+					this.electricMeterList = [];
+					this.electricMeterList = list.map(item => {
+						if (item.remoteReadingMeterList.length != 0 && item.remoteMonitorMeterList.length != 0) {
+							return {
+								label: item.name,
+								value: item.id,
+								children: [{
+										label: '抄表',
+										value: '1',
+										children: item.remoteReadingMeterList.map(item => {
+											return {
+												label: item.name,
+												value: item.id,
+											}
+										})
+									},
+									{
+										label: '监控表',
+										value: '1',
+										children: item.remoteMonitorMeterList.map(item => {
+											return {
+												label: item.name,
+												value: item.id,
+											}
+										})
+									}
+								]
+							}
+						} else if (item.remoteReadingMeterList.length != 0 && item.remoteMonitorMeterList.length == 0) {
+							return {
+								label: item.name,
+								value: item.id,
+								children: [{
+									label: '抄表',
+									value: '1',
+									children: item.remoteReadingMeterList.map(item => {
+										return {
+											label: item.name,
+											value: item.id,
+										}
+									})
+								}]
+							}
+						} else if (item.remoteReadingMeterList.length == 0 && item.remoteMonitorMeterList.length != 0) {
+							return {
+								label: item.name,
+								value: item.id,
+								children: [{
+									label: '监控表',
+									value: '1',
+									children: item.remoteMonitorMeterList.map(item => {
+										return {
+											label: item.name,
+											value: item.id,
+										}
+									})
+								}]
+							}
+						} else {
+			
+						}
+					})
+				}).catch(error => {
+					uni.showToast({
+						title: error,
+						icon: "none"
+					})
+				})
+			},
 		}
 	}
 </script>
@@ -169,7 +328,7 @@
 		}
 
 		.td2 {
-			width: 240rpx;
+			width: 260rpx;
 		}
 
 		.td3 {

pages/equipmentDataMonitoring/electronicMonitoring.vue

@@ -96,7 +96,9 @@
 			</view> -->
         <!-- 统计 -->
 		<view class="statistics-content">
-			<view class="statistics-item">
+			<view class="statistics-item"
+				@click="gotoUrl('/pages/equipmentDataMonitoring/electricityConsumptionDetail?id='
+				+FormData.meterId+'&name='+tabsFrom.title)">
 				<view class="item-title">
 					<image class="img" src="@/assets/img/meterStatistics@3x.png"></image>电量统计(度)
 				</view>