第一次提交

ChargingStation/pages/periodPrice/index.vue

@@ -0,0 +1,89 @@
+<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>