准备联调抄表记录
This commit is contained in:
@@ -1,9 +1,12 @@
|
||||
import { getReportDetail } from "../../../service/report";
|
||||
import { alertInfo, alertSuccess, getPixelRatio } from "../../../utils/index";
|
||||
import { alertInfo, alertSuccess, getPixelRatio, loadingFunc } from "../../../utils/index";
|
||||
import request from '../../../utils/request'
|
||||
import * as echarts from '../../components/echarts/echarts';
|
||||
import { getRoundNumber } from "../../../utils/index"
|
||||
const { OK } = request
|
||||
|
||||
|
||||
|
||||
// pages/billDetail/index.js
|
||||
Page({
|
||||
|
||||
@@ -15,31 +18,34 @@ Page({
|
||||
time: "",
|
||||
detail: {},
|
||||
meters: [],
|
||||
header1: [
|
||||
{ key: 'address', title: '电表地址' },
|
||||
{ title: '起码',renderBody: (item) => { return item?.startNumber } },
|
||||
{ title: '止码',renderBody: (item) => { return item?.endNumber } },
|
||||
{ title: '倍率',renderBody: (item) => { return item?.displayRatio } },
|
||||
],
|
||||
header2: [
|
||||
{ title: '用电量', renderBody: (item) => item?.overall?.amount },
|
||||
{ title: '线损电量',renderBody: (item) => item?.loss?.amount },
|
||||
{ title: '公摊电量',renderBody: (item) => item?.publicAmount },
|
||||
{ title: '合计电量',renderBody: (item) => {
|
||||
// header1: [
|
||||
// { key: 'address', title: '电表地址' },
|
||||
// { title: '起码',renderBody: (item) => { return item?.startNumber } },
|
||||
// { title: '止码',renderBody: (item) => { return item?.endNumber } },
|
||||
// { title: '倍率',renderBody: (item) => { return item?.displayRatio } },
|
||||
// ],
|
||||
// header2: [
|
||||
// { title: '用电量', renderBody: (item) => item?.overall?.amount },
|
||||
// { title: '线损电量',renderBody: (item) => item?.loss?.amount },
|
||||
// { title: '公摊电量',renderBody: (item) => item?.publicAmount },
|
||||
// { title: '合计电量',renderBody: (item) => {
|
||||
|
||||
} },
|
||||
]
|
||||
// } },
|
||||
// ]
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面加载
|
||||
*/
|
||||
onLoad(options) {
|
||||
const { id, time } = options;
|
||||
this.init(id, time);
|
||||
const { id, time, tenement } = options;
|
||||
const that = this;
|
||||
loadingFunc(async () => {
|
||||
await that.init(id, time, tenement);
|
||||
})
|
||||
},
|
||||
async init(id, time) {
|
||||
const { code, message, detail, amount } = await getReportDetail(id)
|
||||
async init(id, time, tenement) {
|
||||
const { code, message, detail, amount } = await getReportDetail(id, tenement)
|
||||
if (code !== OK) {
|
||||
alertInfo(message)
|
||||
return;
|
||||
@@ -50,45 +56,92 @@ Page({
|
||||
detail,
|
||||
amount: amount,
|
||||
meters: detail?.meters?.map(item => {
|
||||
const finalAmount = Number(item?.overall?.amount || 0) + Number(item?.loss?.amount || 0) + Number(item?.publicAmount || 0)
|
||||
item.finalAmount = Number(finalAmount).toFixed(2)
|
||||
if (item?.loss?.amount) {
|
||||
item.loss.amount = getRoundNumber(Number(item.loss.amount))
|
||||
}
|
||||
// const finalAmount = Number(item?.overall?.amount || 0) + Number(item?.loss?.amount || 0) + Number(item?.publicAmount || 0)
|
||||
item.finalAmount = getRoundNumber(Number(item.finalAmount))
|
||||
return item;
|
||||
})
|
||||
})
|
||||
const option = {
|
||||
tooltip: {
|
||||
trigger: 'item'
|
||||
},
|
||||
legend: {
|
||||
top: 10,
|
||||
left: 'center'
|
||||
},
|
||||
label: {
|
||||
alignTo: 'edge',
|
||||
formatter: '{name|{b}}\n{value|{c} }',
|
||||
minMargin: 5,
|
||||
edgeDistance: 10,
|
||||
lineHeight: 15,
|
||||
rich: {
|
||||
time: {
|
||||
fontSize: 10,
|
||||
color: '#999'
|
||||
if (detail?.park?.meter04kvType === 0) {
|
||||
const option = {
|
||||
tooltip: {
|
||||
trigger: 'item'
|
||||
},
|
||||
legend: {
|
||||
top: 10,
|
||||
left: 'center'
|
||||
},
|
||||
label: {
|
||||
alignTo: 'edge',
|
||||
formatter: '{name|{b}}\n{value|{c} }',
|
||||
minMargin: 5,
|
||||
edgeDistance: 10,
|
||||
lineHeight: 15,
|
||||
rich: {
|
||||
time: {
|
||||
fontSize: 10,
|
||||
color: '#999'
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
series: [
|
||||
{
|
||||
type: 'pie',
|
||||
radius: '50%',
|
||||
data: [
|
||||
{ value: detail.comprehensive.lossAmount, name: '本期线损电量', itemStyle: { color: 'rgb(104,187,196)' } },
|
||||
{ value: detail.comprehensive.consumption, name: '本期用电量', itemStyle: { color: 'rgb(80,135,236)' } },
|
||||
|
||||
],
|
||||
}
|
||||
]
|
||||
};
|
||||
this.init_pieCharts(option);
|
||||
},
|
||||
series: [
|
||||
{
|
||||
type: 'pie',
|
||||
radius: '50%',
|
||||
data: [
|
||||
{ value: detail.comprehensive.lossAmount, name: '线损电量', itemStyle: { color: 'rgb(104,187,196)' } },
|
||||
{ value: detail.comprehensive.consumption, name: '电度电量', itemStyle: { color: 'rgb(80,135,236)' } },
|
||||
|
||||
],
|
||||
}
|
||||
]
|
||||
};
|
||||
this.init_pieCharts(option);
|
||||
} else {
|
||||
// const option = {
|
||||
// tooltip: {
|
||||
// trigger: 'item'
|
||||
// },
|
||||
// legend: {
|
||||
// top: 10,
|
||||
// left: 'center'
|
||||
// },
|
||||
// label: {
|
||||
// alignTo: 'edge',
|
||||
// formatter: '{name|{b}}\n{value|{c} }',
|
||||
// minMargin: 5,
|
||||
// edgeDistance: 10,
|
||||
// lineHeight: 15,
|
||||
// rich: {
|
||||
// time: {
|
||||
// fontSize: 10,
|
||||
// color: '#999'
|
||||
// }
|
||||
// }
|
||||
// },
|
||||
// series: [
|
||||
// {
|
||||
// type: 'pie',
|
||||
// radius: '50%',
|
||||
// data: [
|
||||
// {
|
||||
// value: detail.comprehensive.lossAmount,
|
||||
// name: '线损电量',
|
||||
// },
|
||||
// {
|
||||
// value: detail.comprehensive.consumption,
|
||||
// name: '电度电量',
|
||||
// },
|
||||
|
||||
// ],
|
||||
// }
|
||||
// ]
|
||||
// };
|
||||
// this.init_pieCharts(option);
|
||||
}
|
||||
|
||||
const that = this;
|
||||
wx.getSystemInfo({
|
||||
success: function (res) {
|
||||
@@ -115,6 +168,12 @@ Page({
|
||||
return pieChart;
|
||||
});
|
||||
},
|
||||
jumpToDetail(e) {
|
||||
const { meter } = e.currentTarget.dataset;
|
||||
wx.navigateTo({
|
||||
url: '/pages/billMeterDetail/index?data=' + JSON.stringify(meter),
|
||||
})
|
||||
},
|
||||
download() {
|
||||
const { id: tenement } = wx.getStorageSync('tenement')
|
||||
const { id } = this.data;
|
||||
|
@@ -1,7 +1,7 @@
|
||||
<!--pages/billDetail/index.wxml-->
|
||||
<navigator title="{{ time }}电费账单" canBack="{{true}}" />
|
||||
<view class="title" style="top: {{statusBarHeight + 46}}px">
|
||||
<avatar text="{{detail.tenement.shortName}}" />
|
||||
<avatar text="{{detail.tenement.shortName}}" />
|
||||
<view class="titleContent">
|
||||
<view class="park">
|
||||
<view class="label">
|
||||
@@ -11,7 +11,7 @@
|
||||
</view>
|
||||
<view class="address">
|
||||
<view class="label">
|
||||
用电地址:
|
||||
商户地址:
|
||||
</view>
|
||||
<view class="value"> {{ detail.tenement.address }} </view>
|
||||
</view>
|
||||
@@ -19,20 +19,20 @@
|
||||
<view class="label">
|
||||
账单周期:
|
||||
</view>
|
||||
<view class="value"> {{ detail.comprehensive.startDate }} 至 {{ detail.comprehensive.endDate }} </view>
|
||||
<view class="value"> {{ detail.comprehensive.startDate }} 至 {{ detail.comprehensive.endDate }} </view>
|
||||
</view>
|
||||
</view>
|
||||
<van-button type="info" size="small" class="download" bind:click="download">下载</van-button>
|
||||
</view>
|
||||
|
||||
<view class="wrapper">
|
||||
<view class="wrapper" wx:if="{{detail.park.meter04kvType !== 1}}">
|
||||
<view class="line"></view>
|
||||
<view class="contentTitle"> 本期账单 </view>
|
||||
<van-row gutter="10">
|
||||
<van-col span="8">
|
||||
<view class="colContent">
|
||||
<view class="colContentTitle">本期用电量</view>
|
||||
<view class="colContentValue"> {{ amount }} 千瓦时 </view>
|
||||
<view class="colContentValue" wx:if="{{detail.park.meter04kvType === 0}}"> {{ amount }} 千瓦时 </view>
|
||||
</view>
|
||||
</van-col>
|
||||
<van-col span="8">
|
||||
@@ -50,17 +50,10 @@
|
||||
</van-row>
|
||||
<view class="line"></view>
|
||||
<view class="contentTitle"> 电费构成 </view>
|
||||
<echarts
|
||||
style="width:200rpx;height:180rpx;"
|
||||
id="echarts"
|
||||
class='mychart-bar'
|
||||
canvas-id="mychart-bar"
|
||||
ec="{{ ec }}"
|
||||
forceUseOldCanvas="{{false}}"
|
||||
>
|
||||
<echarts style="width:200rpx;height:180rpx;" id="echarts" class='mychart-bar' canvas-id="mychart-bar" ec="{{ ec }}" forceUseOldCanvas="{{false}}">
|
||||
</echarts>
|
||||
<view class="tooltip">
|
||||
(本月电量+本月线损电量)*电单价+摊薄公摊电费+摊薄调整电费
|
||||
(电度电量+线损电量)*电单价+摊薄公摊电费+摊薄调整电费
|
||||
</view>
|
||||
<view class="line"></view>
|
||||
<view class="contentTitle"> 电量明细 </view>
|
||||
@@ -86,7 +79,7 @@
|
||||
</van-row>
|
||||
<van-row>
|
||||
<van-col span="6">
|
||||
<view class="tableTitle"> 用电量 </view>
|
||||
<view class="tableTitle"> 电度电量 </view>
|
||||
<view class="tableContent"> {{item.overall.amount}} </view>
|
||||
|
||||
</van-col>
|
||||
@@ -106,4 +99,97 @@
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="wrapper" wx:if="{{detail.park.meter04kvType === 1}}">
|
||||
<view class="line"></view>
|
||||
<view class="contentTitle"> 本期账单 </view>
|
||||
<van-row gutter="10">
|
||||
<van-col span="12">
|
||||
<view class="colContent">
|
||||
<view class="colContentTitle">本期用电量</view>
|
||||
<view class="colContentValue"> {{ detail.comprehensive.finalAmount }} 千瓦时 </view>
|
||||
</view>
|
||||
</van-col>
|
||||
<van-col span="12">
|
||||
<view class="colContent">
|
||||
<view class="colContentTitle">本期电费</view>
|
||||
<view class="colContentValue"> {{ detail.comprehensive.total }} 元 </view>
|
||||
</view>
|
||||
</van-col>
|
||||
</van-row>
|
||||
<view class="line"></view>
|
||||
<view class="contentTitle"> 分时明细 </view>
|
||||
<van-row gutter="10">
|
||||
<van-col span="12">
|
||||
<view class="colContent">
|
||||
<view class="colContentTitle">
|
||||
分时电量
|
||||
<view> (千瓦时) </view>
|
||||
</view>
|
||||
<view class="colContentValue2">尖: {{ detail.comprehensive.sharpAmount }} </view>
|
||||
<view class="colContentValue2">峰: {{ detail.comprehensive.peakAmount }} </view>
|
||||
<view class="colContentValue2">平: {{ detail.comprehensive.flatAmount }} </view>
|
||||
<view class="colContentValue2">谷: {{ detail.comprehensive.valleyAmount }} </view>
|
||||
</view>
|
||||
</van-col>
|
||||
<van-col span="12">
|
||||
<view class="colContent">
|
||||
<view class="colContentTitle">
|
||||
分时单价
|
||||
<view> (元/千瓦时) </view>
|
||||
</view>
|
||||
<view class="colContentValue2">尖: {{ detail.comprehensive.priceSharp }} </view>
|
||||
<view class="colContentValue2">峰: {{ detail.comprehensive.pricePeak }} </view>
|
||||
<view class="colContentValue2">平: {{ detail.comprehensive.priceFlat }} </view>
|
||||
<view class="colContentValue2">谷: {{ detail.comprehensive.priceValley }} </view>
|
||||
</view>
|
||||
</van-col>
|
||||
</van-row>
|
||||
<view class="line"></view>
|
||||
<view class="tooltip">
|
||||
(电度电量+线损电量)*单价+摊薄公摊电费+摊薄调整电费
|
||||
</view>
|
||||
<view class="line"></view>
|
||||
<view class="contentTitle"> 分时电量明细 </view>
|
||||
<view class="tableWrapper">
|
||||
<view class="meterListItem" wx:for="{{meters}}" wx:key="id">
|
||||
<div class="top">
|
||||
<view class="address">{{item.address}}</view>
|
||||
<view class="detail primaryTextBtn" bind:tap="jumpToDetail" data-meter="{{item}}"> 详情 </view>
|
||||
</div>
|
||||
<view style="margin: 20rpx 0; background-color: #fff;">
|
||||
<van-row custom-style="height: 100%;display: flex;flex-direction: column;overflow: hidden;">
|
||||
<van-col span="6">
|
||||
<view class="tableTitle"> 电度电量 </view>
|
||||
</van-col>
|
||||
<van-col span="6">
|
||||
<view class="tableTitle"> 线损电量 </view>
|
||||
</van-col>
|
||||
<van-col span="6">
|
||||
<view class="tableTitle"> 合计电量 </view>
|
||||
</van-col>
|
||||
<van-col span="6">
|
||||
<view class="tableTitle"> 合计电费 </view>
|
||||
</van-col>
|
||||
</van-row>
|
||||
<van-row class="meterListItemContent">
|
||||
<van-col span="6">
|
||||
<view class="tableContent"> {{item.overall.amount}} </view>
|
||||
</van-col>
|
||||
|
||||
<van-col span="6">
|
||||
<view class="tableContent"> {{item.loss.amount}} </view>
|
||||
</van-col>
|
||||
|
||||
<van-col span="6">
|
||||
<view class="tableContent"> {{item.finalAmount}} </view>
|
||||
</van-col>
|
||||
|
||||
<van-col span="6">
|
||||
<view class="tableContent"> {{item.finalTotal}} </view>
|
||||
</van-col>
|
||||
</van-row>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view style="height: 20rpx;"></view>
|
@@ -59,12 +59,25 @@ page {
|
||||
text-align: center;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.colContentTitle2 {
|
||||
padding: 30rpx 0;
|
||||
text-align: center;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.colContentValue {
|
||||
padding-bottom: 30rpx;
|
||||
text-align: center;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.colContentValue2 {
|
||||
padding-bottom: 20rpx;
|
||||
padding-left: 40rpx;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.tooltip {
|
||||
font-size: 30rpx;
|
||||
color: rgb(136, 132, 132);
|
||||
@@ -87,10 +100,37 @@ page {
|
||||
background-color: #fff;
|
||||
box-sizing: border-box;
|
||||
flex: 1;
|
||||
word-break: break-all;
|
||||
}
|
||||
|
||||
.download {
|
||||
position: absolute;
|
||||
top: 20rpx;
|
||||
right: 20rpx;
|
||||
}
|
||||
|
||||
.meterListItem {
|
||||
font-size: 32rpx;
|
||||
}
|
||||
|
||||
.meterListItem .top {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.meterListItem .address {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
|
||||
/* .top .meterListItem:nth-child(even) .tableContent,
|
||||
.bottom .meterListItem:nth-child(even) .tableContent,
|
||||
.top .meterListItem:nth-child(even),
|
||||
.bottom .meterListItem:nth-child(even)
|
||||
{
|
||||
|
||||
} */
|
||||
|
||||
.meterListItemContent, .meterListItemContent .tableContent {
|
||||
background-color: #fff;
|
||||
}
|
Reference in New Issue
Block a user