You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
89 lines
2.3 KiB
89 lines
2.3 KiB
<template> |
|
<view class="periodPrice_body"> |
|
<scroll-view v-if="priceList.length>2" style="width: 100%; height: 380rpx; " scroll-x="true"> |
|
<qiunDataCharts :ontouch="true" :canvas2d='true' canvasId='canvasIdt' inScrollView="true" type="area" :opts="{ |
|
enableScroll:true, |
|
extra:{ |
|
area:{ |
|
type:'curve', |
|
addLine:true, |
|
gradient:true |
|
} |
|
}, |
|
xAxis:{ |
|
itemCount:5, |
|
scrollShow:true |
|
}, |
|
fontColor:'#000000', |
|
}" :chartData="Line" /> |
|
</scroll-view> |
|
<view style="flex: 1;overflow: hidden;"> |
|
<scroll-view style="height: 100%;" scroll-y="true" @scrolltolower='scrolltolower'> |
|
<view class="periodPrice_item" :key="index" v-for="(item,index) in priceList"> |
|
<view class="periodPrice_item_top flex"> |
|
<view class=" periodPrice_item_top_label oneflex"> |
|
{{item.startTime}}-{{item.endTime}} \n\n\n |
|
<text v-if=" `${item.startTime} - ${item.endTime}` == now ">(当前时间段)</text> |
|
</view> |
|
<view class="periodPrice_item_top_value">￥{{item.totalFee}}/度</view> |
|
</view> |
|
<view class="periodPrice_item_bottom"> |
|
<text>电费: <text class="blue">{{ tool.getnum(item.electricityFee,3)}}元/度</text> </text> |
|
<text style="margin-left: 19rpx;">服务费: <text class="blue">{{ tool.getnum(item.serviceFee,3)}}元/度</text> </text> |
|
</view> |
|
</view> |
|
</scroll-view> |
|
</view> |
|
</view> |
|
</template> |
|
|
|
<script> |
|
import qiunDataCharts from '../../components/qiun-data-charts/components/qiun-data-charts/qiun-data-charts.vue' |
|
export default { |
|
components: { |
|
qiunDataCharts |
|
}, |
|
data() { |
|
return { |
|
priceList: [], |
|
Line: null, |
|
now:'' |
|
} |
|
}, |
|
onLoad(e) { |
|
if (e.priceList) { |
|
this.priceList = JSON.parse(e.priceList).map(item=>{ |
|
item.totalFee = this.tool.getnum(item.totalFee,3) |
|
return item |
|
}); |
|
this.lineInit() |
|
} |
|
if(e.now){ |
|
this.now =e.now; |
|
} |
|
}, |
|
methods: { |
|
lineInit() { |
|
let categories = this.priceList.map(item => item.startTime); |
|
let data = this.priceList.map(item => item.totalFee) |
|
this.Line = { |
|
categories, |
|
series: [{ |
|
name: "金额", |
|
data |
|
}] |
|
} |
|
}, |
|
scrolltolower() { |
|
uni.showToast({ |
|
title: '到底了', |
|
icon: 'none' |
|
}) |
|
} |
|
}, |
|
} |
|
</script> |
|
|
|
<style lang="scss" scoped> |
|
@import 'index.scss'; |
|
</style> |