|
@@ -1,1108 +0,0 @@
|
|
-<template>
|
|
|
|
- <view>
|
|
|
|
-
|
|
|
|
- <view class="navbar-tit">{{title}}</view>
|
|
|
|
-
|
|
|
|
- <view class="statisticsData">
|
|
|
|
- <!-- <view class="statisticsData-item">
|
|
|
|
- <h3 style="font-size: 20px;">{{info.merchantAccountName}}</h3>
|
|
|
|
- </view> -->
|
|
|
|
- <view class="detailstableHead" v-if="indexData">
|
|
|
|
- <view class="detailsline" >
|
|
|
|
- <view class="details-row ">
|
|
|
|
-
|
|
|
|
- <view class="span1">今日充电流水</view>
|
|
|
|
- <view class="span2">{{indexData.todayAmount?indexData.todayAmount.toFixed(2):0}}<span >元</span></view>
|
|
|
|
- </view>
|
|
|
|
- <view class="details-row">
|
|
|
|
- <view class="span1">今日充电笔数</view>
|
|
|
|
- <view class="span2">{{indexData.todayEQNum?indexData.todayEQNum:0}}<span >笔</span></view>
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
- <view class="detailsline" >
|
|
|
|
- <view class="details-row ">
|
|
|
|
-
|
|
|
|
- <view class="span1">昨日充电流水</view>
|
|
|
|
- <view class="span2">{{indexData.yesterdayAmount?indexData.yesterdayAmount.toFixed(2):0}}<span>元</span></view>
|
|
|
|
- </view>
|
|
|
|
- <view class="details-row">
|
|
|
|
- <view class="span1">昨日充电笔数</view>
|
|
|
|
- <view class="span2">{{indexData.yesterdayEQNum?indexData.yesterdayEQNum:0}}<span >笔</span></view>
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
- <view class="detailsline—bottom" >
|
|
|
|
- <view class="details-row ">
|
|
|
|
-
|
|
|
|
- <view class="span1">本月充电流水</view>
|
|
|
|
- <view class="span2">{{indexData.thisMonthAmount?indexData.thisMonthAmount.toFixed(2):0}}<span >元</span></view>
|
|
|
|
- </view>
|
|
|
|
- <view class="details-row">
|
|
|
|
- <view class="span1">本月充电笔数</view>
|
|
|
|
- <view class="span2">{{indexData.thisMonthEQNum?indexData.thisMonthEQNum:0}}<span >笔</span></view>
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
-
|
|
|
|
- </view>
|
|
|
|
-
|
|
|
|
-
|
|
|
|
- </view>
|
|
|
|
-
|
|
|
|
- <u-picker mode="time" v-model="popupShow" @confirm="changedate" :default-time="queryTime" :params="params"></u-picker>
|
|
|
|
- <u-picker mode="time" v-model="popupShow2" @confirm="changedate2" :default-time="queryTime2+'-1'" :params="params"></u-picker>
|
|
|
|
- <u-picker mode="selector" v-model="popupShow3" @confirm="changedate3" :range="stationList" range-key="name" :default-selector="[selectstationIndex]"></u-picker>
|
|
|
|
-
|
|
|
|
-
|
|
|
|
- <view class="statisticsChart">
|
|
|
|
-
|
|
|
|
-
|
|
|
|
- <view class="statisticsChart-head" style="margin-top: 20px;">
|
|
|
|
- <h4>流水统计</h4>
|
|
|
|
- <!-- <view class="navbar-screen" >
|
|
|
|
- {{startTime}}至{{endTime}}
|
|
|
|
- </view> -->
|
|
|
|
- <view class="navbar-screen" @click="popupShow = true" v-if="false">
|
|
|
|
- <span>{{showTime(queryTime)}}</span>
|
|
|
|
- <u-icon name="arrow-down" color="#b0b8c8" size="32" v-show="!popupShow"></u-icon>
|
|
|
|
- <u-icon name="arrow-up" color="#b0b8c8" size="32" v-show="popupShow"></u-icon>
|
|
|
|
-
|
|
|
|
- </view>
|
|
|
|
-
|
|
|
|
-
|
|
|
|
- </view>
|
|
|
|
- <u-calendar v-model="popupShow4" mode="range" @change="changedate4"></u-calendar>
|
|
|
|
- <view class="details detailstable">
|
|
|
|
- <p style="text-align: center; margin-bottom: 5px;" @click="popupShow4 = true">
|
|
|
|
- <img src="@/assets/img/riLine-calendar-todo-line.svg" align="absmiddle" style="height:40rpx;width: 40rpx ;" >
|
|
|
|
-
|
|
|
|
- {{startTime}}至{{endTime}}
|
|
|
|
- <u-icon name="arrow-down" color="#b0b8c8" size="32" v-show="!popupShow4"></u-icon>
|
|
|
|
- <u-icon name="arrow-up" color="#b0b8c8" size="32" v-show="popupShow4"></u-icon>
|
|
|
|
- </p>
|
|
|
|
-
|
|
|
|
-
|
|
|
|
- <u-collapse :style="changeitemBl?' border-Bottom: 1px solid #000205':''"
|
|
|
|
-
|
|
|
|
- :headStyle="{
|
|
|
|
- color:'#101010',
|
|
|
|
- fontWeight: 'bold',
|
|
|
|
- padding:'24rpx 0',
|
|
|
|
- borderBottom: '1px solid #ededed'
|
|
|
|
-
|
|
|
|
- }"
|
|
|
|
- v-if="stationFlowList.length">
|
|
|
|
- <u-collapse-item @change="changeitem"
|
|
|
|
- v-for="(item, index) in stationFlowList" :index="index" :open="index==0" :key="index">
|
|
|
|
- <view slot="title" class="u-collapse-title u-line-1" style="width: 100%;">
|
|
|
|
- {{item.stationName}} <span style="float:right;"><span style="font-size: 24rpx;margin-right: 8rpx;font-weight: normal;">总收入</span>{{item.actualMoney.toFixed(2)}}元</span>
|
|
|
|
- </view>
|
|
|
|
-
|
|
|
|
- <!-- -->
|
|
|
|
- <view class="detailsline">
|
|
|
|
-
|
|
|
|
-
|
|
|
|
- <view class="details-row details-row-1">
|
|
|
|
-
|
|
|
|
- <view class="span1">电费</view>
|
|
|
|
- <view class="span2">{{item.elecMoney.toFixed(2)}}<span>元</span></view>
|
|
|
|
- </view>
|
|
|
|
- <view class="details-row">
|
|
|
|
- <view class="span1">服务费</view>
|
|
|
|
- <view class="span2">{{item.serviceMoney.toFixed(2)}}<span>元</span></view>
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
-
|
|
|
|
- <view class="detailsline">
|
|
|
|
- <view class="details-row details-row-1">
|
|
|
|
-
|
|
|
|
- <view class="span1">总用电量</view>
|
|
|
|
- <view class="span2">{{(item.eq/10000).toFixed(1)}}<span>度</span></view>
|
|
|
|
- </view>
|
|
|
|
- <view class="details-row">
|
|
|
|
-
|
|
|
|
-
|
|
|
|
- <view class="span1">充电枪数量</view>
|
|
|
|
- <view class="span2">快充{{item.fastNum}}/慢充{{item.slowNum}}</view>
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
-
|
|
|
|
- <view class="detailsline" v-if="item.fastNum&&item.slowNum">
|
|
|
|
- <view class="details-row details-row-1">
|
|
|
|
-
|
|
|
|
-
|
|
|
|
- <view class="span1">快充枪平均充电量</view>
|
|
|
|
- <view class="span2" v-if="item.fastNum">{{(item.averageFast/10000).toFixed(1)}}<span>度/枪/天</span></view>
|
|
|
|
- <view class="span2" v-else>0<span>度/枪/天</span></view>
|
|
|
|
- </view>
|
|
|
|
- <view class="details-row">
|
|
|
|
-
|
|
|
|
- <view class="span1">慢充枪平均充电量</view>
|
|
|
|
- <view class="span2" v-if="item.slowNum" >{{(item.averageSlow/10000).toFixed(1)}}<span>度/枪/天</span></view>
|
|
|
|
- <view class="span2" v-else>0<span>度/枪/天</span></view>
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
-
|
|
|
|
- <view class="detailsline" v-if="item.fastNum&&item.slowNum" >
|
|
|
|
- <view class="details-row details-row-1">
|
|
|
|
-
|
|
|
|
-
|
|
|
|
- <view class="span1">月卡收益</view>
|
|
|
|
- <view class="span2" >{{(item.cardMoney).toFixed(2)}}<span>元</span></view>
|
|
|
|
-
|
|
|
|
- </view>
|
|
|
|
- <view class="details-row">
|
|
|
|
-
|
|
|
|
-
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
-
|
|
|
|
-
|
|
|
|
- <view v-if="item.fastNum&&item.slowNum" :style="item.slowDayNum==nowTime?'color: #ffffff;':'border-bottom: 1px solid #ededed;'"
|
|
|
|
- >查询范围内实际订单天数{{item.slowDayNum}}</view>
|
|
|
|
-
|
|
|
|
- </u-collapse-item>
|
|
|
|
- </u-collapse>
|
|
|
|
-
|
|
|
|
- <view class="detailsline" v-if="stationFlowList.length>1" >
|
|
|
|
-
|
|
|
|
-
|
|
|
|
- <view class="details-row details-row-1">
|
|
|
|
-
|
|
|
|
- <view class="span1">合计总收入</view>
|
|
|
|
- <view class="span2">{{(allMoneySum).toFixed(2)}}<span>元</span></view>
|
|
|
|
- </view>
|
|
|
|
- <view class="details-row">
|
|
|
|
- <view class="span1">合计总利润</view>
|
|
|
|
- <view class="span2">{{(serviceMoneySum).toFixed(2)}}<span>元</span></view>
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
- <view
|
|
|
|
- >合计总利润=服务费收益+月卡收益</view>
|
|
|
|
-
|
|
|
|
- </view>
|
|
|
|
-
|
|
|
|
- <view class="statisticsChart-head" style="margin-top: 20px;">
|
|
|
|
- <h4>收益统计</h4>
|
|
|
|
- <!-- <view class="navbar-screen" >
|
|
|
|
- {{startTime}}至{{endTime}}
|
|
|
|
- </view> -->
|
|
|
|
- <!-- <view class="navbar-screen" @click="popupShow2 = true"><span>筛选</span>
|
|
|
|
- <u-icon name="filter-2-fill" custom-prefix="custom-icon" color="#b0b8c8" size="32"></u-icon>
|
|
|
|
- </view> -->
|
|
|
|
-
|
|
|
|
-
|
|
|
|
- </view>
|
|
|
|
-
|
|
|
|
- <view class="details" v-if="indexData2&&indexData2.incomeMap">
|
|
|
|
-
|
|
|
|
- <view class="details-row2">
|
|
|
|
- <p @click="popupShow3 = true">{{selectstationName}}
|
|
|
|
- <u-icon name="arrow-down" color="#b0b8c8" size="32" v-show="!popupShow3"></u-icon>
|
|
|
|
- <u-icon name="arrow-up" color="#b0b8c8" size="32" v-show="popupShow3"></u-icon>
|
|
|
|
- </p>
|
|
|
|
- <p @click="popupShow2 = true">
|
|
|
|
- {{showTime(queryTime2)}}
|
|
|
|
- <u-icon name="arrow-down" color="#b0b8c8" size="32" v-show="!popupShow2"></u-icon>
|
|
|
|
- <u-icon name="arrow-up" color="#b0b8c8" size="32" v-show="popupShow2"></u-icon>
|
|
|
|
- </p>
|
|
|
|
- </view>
|
|
|
|
-
|
|
|
|
- <view class="details-row">
|
|
|
|
- <p>投资人收入</p>
|
|
|
|
- <span>{{indexData2.incomeMap.incomeAmount.toFixed(2)}}元</span>
|
|
|
|
- </view>
|
|
|
|
- <view class="details-row" >
|
|
|
|
- <p>预估用电度数</p>
|
|
|
|
- <span>{{(indexData2.incomeMap.electricQuantity/10000).toFixed(1)}}度</span>
|
|
|
|
- </view>
|
|
|
|
- <view class="details-row">
|
|
|
|
- <p>预估电费</p>
|
|
|
|
- <span>{{indexData2.incomeMap.costAmount.toFixed(2)}}元</span>
|
|
|
|
- </view>
|
|
|
|
- <view class="details-row">
|
|
|
|
- <p>服务费预估收益</p>
|
|
|
|
- <span><b>{{indexData2.incomeMap.serviceAmount.toFixed(2)}}元</b></span>
|
|
|
|
- </view>
|
|
|
|
- <view class="details-row">
|
|
|
|
- <p>月卡收益</p>
|
|
|
|
- <span>{{indexData2.incomeMap.cardIncomeAmount.toFixed(2)}}元</span>
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
-
|
|
|
|
- </view>
|
|
|
|
- <Tabbar :current="0" ref="tabbarMain"></Tabbar>
|
|
|
|
- <!-- <u-tabbar v-model="current" :list="tabbarList" active-color="#185ac6"></u-tabbar>
|
|
|
|
- -->
|
|
|
|
- </view>
|
|
|
|
-</template>
|
|
|
|
-
|
|
|
|
-<script>
|
|
|
|
- import Tabbar from '@/components/TabbarFinance.vue'
|
|
|
|
- import * as API from '@/apis/finance.js'
|
|
|
|
- import * as echarts from "echarts";
|
|
|
|
- //require("@/apis/echarts-5-3.min.js")
|
|
|
|
- //import * as echarts from "@/apis/echarts-5-3.min.js";
|
|
|
|
- import {
|
|
|
|
- daysDistance,
|
|
|
|
- beforeTimeStamp,
|
|
|
|
- currentTimeStamp,
|
|
|
|
- parseUnixTime
|
|
|
|
- } from '@/utils'
|
|
|
|
- export default {
|
|
|
|
- data() {
|
|
|
|
- return {
|
|
|
|
- popupShow3:false,
|
|
|
|
- params: {
|
|
|
|
- year: true,
|
|
|
|
- month: true,
|
|
|
|
- day: false,
|
|
|
|
- hour: false,
|
|
|
|
- minute: false,
|
|
|
|
- second: false
|
|
|
|
- },
|
|
|
|
- isinit: true,
|
|
|
|
- form: {},
|
|
|
|
- form2: {},
|
|
|
|
- selecttype: "",
|
|
|
|
- selectstationId: "",
|
|
|
|
- selectdeviceNo: "",
|
|
|
|
- popupShow2: false,
|
|
|
|
- popupShow: false,
|
|
|
|
- popupShow4:false,
|
|
|
|
- nowTime:0,
|
|
|
|
- selectstationId2: "",
|
|
|
|
- selectstationIndex:0,
|
|
|
|
- selectstationName: "",
|
|
|
|
- info: {},
|
|
|
|
- title: "",
|
|
|
|
- showdate: false,
|
|
|
|
- showdate2: false,
|
|
|
|
-
|
|
|
|
- queryTime:"",
|
|
|
|
- queryTime2:"",
|
|
|
|
-
|
|
|
|
- indexData: {},
|
|
|
|
-
|
|
|
|
- indexData2: null,
|
|
|
|
- changeitemBl:false,
|
|
|
|
-
|
|
|
|
- myChart: null,
|
|
|
|
- myChartReady: false,
|
|
|
|
- myChartTime: false,
|
|
|
|
- subsection: [{
|
|
|
|
- name: '金额'
|
|
|
|
- },
|
|
|
|
- {
|
|
|
|
- name: '笔数'
|
|
|
|
- }
|
|
|
|
- ],
|
|
|
|
- stationFlowList: [],
|
|
|
|
- serviceMoneySum:0,
|
|
|
|
- allMoneySum:0,
|
|
|
|
- stationList: [],
|
|
|
|
- stationListSon: [],
|
|
|
|
- tabbarList: [{
|
|
|
|
- iconPath: "bar-chart-box-fill",
|
|
|
|
- selectedIconPath: "bar-chart-box-fill",
|
|
|
|
- text: '统计',
|
|
|
|
- count: 0,
|
|
|
|
- isDot: true,
|
|
|
|
- customIcon: true,
|
|
|
|
- },
|
|
|
|
- {
|
|
|
|
- iconPath: "article-fill",
|
|
|
|
- selectedIconPath: "article-fill",
|
|
|
|
- text: '明细',
|
|
|
|
- midButton: true,
|
|
|
|
- customIcon: true,
|
|
|
|
- },
|
|
|
|
-
|
|
|
|
- {
|
|
|
|
- iconPath: "account-pin-box-fill",
|
|
|
|
- selectedIconPath: "account-pin-box-fill",
|
|
|
|
- text: '我的',
|
|
|
|
- count: 0,
|
|
|
|
- isDot: false,
|
|
|
|
- customIcon: true,
|
|
|
|
- },
|
|
|
|
- ],
|
|
|
|
- endTime:'',
|
|
|
|
- endTime2:'',
|
|
|
|
-
|
|
|
|
- current: 0,
|
|
|
|
- background: {
|
|
|
|
- background: 'none'
|
|
|
|
- },
|
|
|
|
- value: '',
|
|
|
|
- type: 'select',
|
|
|
|
- show: false,
|
|
|
|
- border: true,
|
|
|
|
- step: 0,
|
|
|
|
- stepname: '',
|
|
|
|
- startTime:'',
|
|
|
|
- stepid: 0,
|
|
|
|
-
|
|
|
|
- }
|
|
|
|
- },
|
|
|
|
- onShow() {
|
|
|
|
- if (this.$refs.tabbarMain) {
|
|
|
|
- this.$refs.tabbarMain.setcount(0);
|
|
|
|
- }
|
|
|
|
- },
|
|
|
|
- onLoad() {
|
|
|
|
-
|
|
|
|
-
|
|
|
|
- this.info = this.carhelp.getPersonInfo("merchantUser")
|
|
|
|
- this.title = this.info.merchantAccountName
|
|
|
|
- },
|
|
|
|
- components: {
|
|
|
|
- Tabbar
|
|
|
|
-
|
|
|
|
- },
|
|
|
|
- onReady() {
|
|
|
|
- var date=new Date();
|
|
|
|
- this.nowTime=7
|
|
|
|
-
|
|
|
|
-
|
|
|
|
- this.queryTime=parseUnixTime(currentTimeStamp(), '{y}-{m}');
|
|
|
|
- this.queryTime2=parseUnixTime(currentTimeStamp(), '{y}-{m}'),
|
|
|
|
-
|
|
|
|
- console.log(this.queryTime);
|
|
|
|
-
|
|
|
|
- this.startTime = parseUnixTime(beforeTimeStamp(7), '{y}-{m}-{d}')
|
|
|
|
- this.endTime = parseUnixTime(beforeTimeStamp(1), '{y}-{m}-{d}')
|
|
|
|
- //this.startTime2 = parseUnixTime(beforeTimeStamp(6), '{y}-{m}-{d}')
|
|
|
|
- this.endTime2 = parseUnixTime(currentTimeStamp(), '{y}-{m}-{d}')
|
|
|
|
-
|
|
|
|
- this.getStation()
|
|
|
|
- },computed:{
|
|
|
|
-
|
|
|
|
- // startTime(){
|
|
|
|
- // return this.queryTime+'-1'
|
|
|
|
- // },
|
|
|
|
- startTime2(){
|
|
|
|
- return this.queryTime2+'-1'
|
|
|
|
- },
|
|
|
|
-
|
|
|
|
- },
|
|
|
|
- methods: {
|
|
|
|
- changeitem(e){
|
|
|
|
- if(this.stationFlowList.length>1&&e.index==this.stationFlowList.length-1&&e.show){
|
|
|
|
- this.changeitemBl=true;
|
|
|
|
- }else{
|
|
|
|
- this.changeitemBl=false;
|
|
|
|
- }
|
|
|
|
- },
|
|
|
|
- showTime(name){
|
|
|
|
- if(!name){
|
|
|
|
- return ''
|
|
|
|
- }
|
|
|
|
- return name.replace('-','年')+'月';
|
|
|
|
- },
|
|
|
|
- getStation(bl) {
|
|
|
|
-
|
|
|
|
- API.stationList().then((res) => {
|
|
|
|
-
|
|
|
|
- this.stationList = res.data.stationList
|
|
|
|
- this.stationList.unshift({
|
|
|
|
- id:'',name:"全部站点"
|
|
|
|
- })
|
|
|
|
- this.selectstationName="全部站点"
|
|
|
|
-
|
|
|
|
- this.stationListSon = res.data.deviceList
|
|
|
|
- this.getDataHome()
|
|
|
|
- this.getData()
|
|
|
|
- this.getData2()
|
|
|
|
- }).catch(error => {
|
|
|
|
- uni.showToast({
|
|
|
|
-
|
|
|
|
- title: error
|
|
|
|
- })
|
|
|
|
- })
|
|
|
|
- },
|
|
|
|
- resetBtn() {
|
|
|
|
- this.nowTime=7
|
|
|
|
- this.startTime = parseUnixTime(beforeTimeStamp(6), '{y}-{m}-{d}')
|
|
|
|
- this.endTime = parseUnixTime(currentTimeStamp(), '{y}-{m}-{d}')
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|
|
- this.selecttype = ""
|
|
|
|
- this.selectstationId = ""
|
|
|
|
- this.selectdeviceNo = ""
|
|
|
|
-
|
|
|
|
- this.form = {
|
|
|
|
-
|
|
|
|
- type: this.selecttype,
|
|
|
|
- stationId: this.selectstationId,
|
|
|
|
- deviceNo: this.selectdeviceNo,
|
|
|
|
- };
|
|
|
|
- this.popupShow = false;
|
|
|
|
- this.list = [];
|
|
|
|
- this.getData()
|
|
|
|
-
|
|
|
|
- },
|
|
|
|
- okbtn() {
|
|
|
|
- this.popupShow = false;
|
|
|
|
-
|
|
|
|
- this.form = {
|
|
|
|
-
|
|
|
|
- type: this.selecttype,
|
|
|
|
- stationId: this.selectstationId,
|
|
|
|
- deviceNo: this.selectdeviceNo,
|
|
|
|
- };
|
|
|
|
- this.list = [];
|
|
|
|
- this.getData()
|
|
|
|
- },
|
|
|
|
- resetBtn2() {
|
|
|
|
- this.startTime2 = parseUnixTime(beforeTimeStamp(6), '{y}-{m}-{d}')
|
|
|
|
- this.endTime2 = parseUnixTime(currentTimeStamp(), '{y}-{m}-{d}')
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|
|
- this.selectstationId2 = ""
|
|
|
|
-
|
|
|
|
- this.form2 = {
|
|
|
|
-
|
|
|
|
- stationId: this.selectstationId2,
|
|
|
|
-
|
|
|
|
- };
|
|
|
|
- this.popupShow2 = false;
|
|
|
|
-
|
|
|
|
- this.getData2()
|
|
|
|
-
|
|
|
|
- },
|
|
|
|
- okbtn2() {
|
|
|
|
- this.popupShow2 = false;
|
|
|
|
-
|
|
|
|
- this.form2 = {
|
|
|
|
-
|
|
|
|
- stationId: this.selectstationId2,
|
|
|
|
-
|
|
|
|
- };
|
|
|
|
-
|
|
|
|
- this.getData2()
|
|
|
|
- },
|
|
|
|
- getDataHome() {
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|
|
- API.homeHeadStatistics().then((res) => {
|
|
|
|
- this.indexData = res.data;
|
|
|
|
-
|
|
|
|
- }).catch(error => {
|
|
|
|
- uni.showToast({
|
|
|
|
-
|
|
|
|
- title: error
|
|
|
|
- })
|
|
|
|
- })
|
|
|
|
- },
|
|
|
|
- getData() {
|
|
|
|
-
|
|
|
|
- this.form.startDate = this.startTime,
|
|
|
|
- this.form.endDate = this.endTime
|
|
|
|
-
|
|
|
|
- API.homeFlowStatistics(this.form).then((res) => {
|
|
|
|
- this.stationFlowList = res.data.stationFlowList;
|
|
|
|
- this.nowTime=daysDistance(this.startTime, this.endTime)+1;
|
|
|
|
- this.serviceMoneySum=0;
|
|
|
|
- this.allMoneySum=0;
|
|
|
|
- for(var i in this.stationFlowList ){
|
|
|
|
- var item=this.stationFlowList[i];
|
|
|
|
-
|
|
|
|
- this.allMoneySum+=item.actualMoney
|
|
|
|
- this.serviceMoneySum+=item.serviceMoney
|
|
|
|
- this.serviceMoneySum+=item.cardMoney
|
|
|
|
- }
|
|
|
|
- console.log(this.nowTime)
|
|
|
|
-
|
|
|
|
- }).catch(error => {
|
|
|
|
- uni.showToast({
|
|
|
|
-
|
|
|
|
- title: error
|
|
|
|
- })
|
|
|
|
- })
|
|
|
|
- },
|
|
|
|
- getData2() {
|
|
|
|
- uni.showLoading({
|
|
|
|
- title: "加载中",
|
|
|
|
- mask: true,
|
|
|
|
- })
|
|
|
|
-
|
|
|
|
- this.form2.startDate = this.startTime2,
|
|
|
|
- this.form2.endDate = this.endTime2
|
|
|
|
-
|
|
|
|
- API.homeIncomeStatistics(this.form2).then((res) => {
|
|
|
|
- this.indexData2 = res.data
|
|
|
|
-
|
|
|
|
- uni.hideLoading()
|
|
|
|
-
|
|
|
|
- }).catch(error => {
|
|
|
|
- uni.showToast({
|
|
|
|
-
|
|
|
|
- title: error
|
|
|
|
- })
|
|
|
|
- })
|
|
|
|
- },
|
|
|
|
- changesub(e) {
|
|
|
|
-
|
|
|
|
- this.current = e
|
|
|
|
- this.getPie()
|
|
|
|
- },
|
|
|
|
- changedate4(e) {
|
|
|
|
- this.startTime = e.startDate
|
|
|
|
- this.endTime = e.endDate
|
|
|
|
- this.okbtn()
|
|
|
|
-
|
|
|
|
- },
|
|
|
|
- changedate3(e) {
|
|
|
|
- console.log(e)
|
|
|
|
- var index=e[0];
|
|
|
|
- var obj=this.stationList[index];
|
|
|
|
- this.selectstationId2=obj.id;
|
|
|
|
- this.selectstationIndex=index;
|
|
|
|
- this.selectstationName=obj.name;
|
|
|
|
- this.okbtn2()
|
|
|
|
- },
|
|
|
|
- changedate(e) {
|
|
|
|
- console.log(e)
|
|
|
|
-
|
|
|
|
- this.queryTime=e.year+'-'+e.month;
|
|
|
|
- this.startTime=e.year+'-'+e.month+'-1';
|
|
|
|
- if(e.month=='12'){
|
|
|
|
- this.endTime=(e.year)+"/12/31"
|
|
|
|
- }else{
|
|
|
|
- var b=e.year+'/'+(parseInt(e.month)+1)+'/1';
|
|
|
|
- var a=beforeTimeStamp(1,b);
|
|
|
|
- this.endTime= parseUnixTime(a, '{y}-{m}-{d}')
|
|
|
|
-
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- this.okbtn()
|
|
|
|
- },
|
|
|
|
- changedate2(e) {
|
|
|
|
- console.log(e)
|
|
|
|
- this.queryTime2=e.year+'-'+e.month;
|
|
|
|
-
|
|
|
|
- if(e.month=='12'){
|
|
|
|
- this.endTime2=(e.year)+"/12/31"
|
|
|
|
- }else{
|
|
|
|
- var b=e.year+'/'+(parseInt(e.month)+1)+'/1';
|
|
|
|
- var a=beforeTimeStamp(1,b);
|
|
|
|
- this.endTime2= parseUnixTime(a, '{y}-{m}-{d}')
|
|
|
|
-
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- this.okbtn2()
|
|
|
|
-
|
|
|
|
- },
|
|
|
|
- getPie1(list) {
|
|
|
|
- var getData = [];
|
|
|
|
-
|
|
|
|
- var map = new Map()
|
|
|
|
- var stationNum = 0;
|
|
|
|
- list.forEach(item => {
|
|
|
|
-
|
|
|
|
- var value = this.current ? item.eqNum : item.amount
|
|
|
|
- if (value) {
|
|
|
|
-
|
|
|
|
- var stationName = ""
|
|
|
|
- var obj = this.stationListSon.find(item2 => {
|
|
|
|
- return item2.deviceNo == item.deviceNo
|
|
|
|
- })
|
|
|
|
- if (obj && obj.stationId) {
|
|
|
|
- var obj2 = this.stationList.find(item3 => {
|
|
|
|
- return item3.id == obj.stationId
|
|
|
|
- })
|
|
|
|
- if (obj2 && obj2.name) {
|
|
|
|
- stationName = obj2.name;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- if (!map.has(obj.stationId)) {
|
|
|
|
-
|
|
|
|
- map.set(obj.stationId, {
|
|
|
|
- id: obj.stationId,
|
|
|
|
- value: value,
|
|
|
|
- name: stationName,
|
|
|
|
- })
|
|
|
|
- this.stepid = obj.stationId;
|
|
|
|
- stationNum++;
|
|
|
|
- } else {
|
|
|
|
- var omap = map.get(obj.stationId)
|
|
|
|
- var addvalue = (omap.value * 100 + value * 100) / 100
|
|
|
|
- map.set(obj.stationId, {
|
|
|
|
- id: obj.stationId,
|
|
|
|
- value: addvalue,
|
|
|
|
- name: stationName,
|
|
|
|
- })
|
|
|
|
-
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- })
|
|
|
|
- map.forEach((item, i) => {
|
|
|
|
- getData.push(item)
|
|
|
|
- })
|
|
|
|
-
|
|
|
|
- if (stationNum == 1) {
|
|
|
|
- this.step = 2; //只有一个站, 就不拆分了
|
|
|
|
-
|
|
|
|
- } else {
|
|
|
|
- this.stepid = 0;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- return getData;
|
|
|
|
- },
|
|
|
|
- getPie2(list) {
|
|
|
|
- var getData = [];
|
|
|
|
- var sz = ['自行车充电桩', '直流汽车充电桩', '交流汽车充电桩']
|
|
|
|
-
|
|
|
|
- list.forEach(item => {
|
|
|
|
-
|
|
|
|
- var value = this.current ? item.eqNum : item.amount
|
|
|
|
- if (value) {
|
|
|
|
- var typeName = "";
|
|
|
|
- var stationName = ""
|
|
|
|
- var obj = this.stationListSon.find(item2 => {
|
|
|
|
- return item2.deviceNo == item.deviceNo
|
|
|
|
- })
|
|
|
|
-
|
|
|
|
-
|
|
|
|
- if (this.stepid != obj.stationId) {
|
|
|
|
- return
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- if (obj && obj.stationId) {
|
|
|
|
- var obj2 = this.stationList.find(item3 => {
|
|
|
|
- return item3.id == obj.stationId
|
|
|
|
- })
|
|
|
|
- if (obj2 && obj2.name) {
|
|
|
|
- stationName = obj2.name;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- if (obj && obj.type) {
|
|
|
|
- typeName = sz[obj.type]
|
|
|
|
- }
|
|
|
|
- getData.push({
|
|
|
|
- id: item.id,
|
|
|
|
- value: value,
|
|
|
|
- name: item.deviceName,
|
|
|
|
- typeName: typeName,
|
|
|
|
- stationName: stationName
|
|
|
|
- })
|
|
|
|
-
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- })
|
|
|
|
- return getData;
|
|
|
|
- },
|
|
|
|
- getPie() {
|
|
|
|
-
|
|
|
|
- var list = this.indexData.pieChart;
|
|
|
|
-
|
|
|
|
- var unit = this.current ? '笔' : '元'
|
|
|
|
-
|
|
|
|
- var getData = [];
|
|
|
|
- if (this.step == 0) {
|
|
|
|
- getData = this.getPie1(list)
|
|
|
|
- }
|
|
|
|
- if (this.step == 1 || this.step == 2) {
|
|
|
|
- getData = this.getPie2(list)
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
-
|
|
|
|
- if (!this.myChart) {
|
|
|
|
- this.myChart = echarts.init(document.getElementById('pieEcharts'));
|
|
|
|
-
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- // 指定图表的配置项和数据
|
|
|
|
- var option = {
|
|
|
|
- tooltip: {
|
|
|
|
- trigger: 'item',
|
|
|
|
- formatter: (value) => {
|
|
|
|
- var info = value.data;
|
|
|
|
- var showvalue = info.value;
|
|
|
|
- if (!this.current) {
|
|
|
|
- showvalue = info.value.toFixed(2)
|
|
|
|
- }
|
|
|
|
- if (this.step == 0) {
|
|
|
|
- if (!info) {
|
|
|
|
- return ""
|
|
|
|
- }
|
|
|
|
- return info.name + ' <br/> ' + showvalue + unit
|
|
|
|
- }
|
|
|
|
- if (this.step == 1 || this.step == 2) {
|
|
|
|
- return info.stationName + ' <br/> ' + info.name + ' <br/> ' + showvalue + unit +
|
|
|
|
- ' <br/> ' + info.typeName
|
|
|
|
-
|
|
|
|
- }
|
|
|
|
- },
|
|
|
|
- position: function(point, params, dom, rect, size) {
|
|
|
|
-
|
|
|
|
- return ['10%', '0%']
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- },
|
|
|
|
-
|
|
|
|
- series: [{
|
|
|
|
- //name: 'Access From',
|
|
|
|
- type: 'pie',
|
|
|
|
- radius: '40%',
|
|
|
|
- data: getData,
|
|
|
|
- emphasis: {
|
|
|
|
- itemStyle: {
|
|
|
|
- shadowBlur: 10,
|
|
|
|
- shadowOffsetX: 0,
|
|
|
|
- shadowColor: 'rgba(0, 0, 0, 0.5)'
|
|
|
|
- }
|
|
|
|
- },
|
|
|
|
-
|
|
|
|
- label: {
|
|
|
|
-
|
|
|
|
- fontWeight: "bold",
|
|
|
|
- fontSize: 14,
|
|
|
|
- }
|
|
|
|
- }]
|
|
|
|
- };
|
|
|
|
-
|
|
|
|
- // 使用刚指定的配置项和数据显示图表。
|
|
|
|
- this.myChart.setOption(option);
|
|
|
|
-
|
|
|
|
- var _this = this;
|
|
|
|
- if (!this.myChartReady) {
|
|
|
|
- this.myChartReady = true;
|
|
|
|
- //双击事件不能生效 , 改为多次点击
|
|
|
|
- this.myChart.on('click', function(params) {
|
|
|
|
- var tid = _this.stepid; //上一次
|
|
|
|
-
|
|
|
|
- _this.stepid = params.data.id
|
|
|
|
-
|
|
|
|
-
|
|
|
|
- if (!_this.myChartTime || tid != _this.stepid) {
|
|
|
|
- _this.stepid = params.data.id
|
|
|
|
- _this.myChartTime = true;
|
|
|
|
- setTimeout(function() {
|
|
|
|
- console.log("setTimeout")
|
|
|
|
-
|
|
|
|
- _this.myChartTime = false;
|
|
|
|
- }, 500)
|
|
|
|
- return
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- if (_this.step == 0) {
|
|
|
|
- _this.step = 1
|
|
|
|
- _this.stepname = params.data.name
|
|
|
|
- _this.myChart.clear()
|
|
|
|
- _this.getPie()
|
|
|
|
- } else if (_this.step == 1) {
|
|
|
|
- //_this.step=0
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
-
|
|
|
|
- // window.open('https://www.baidu.com/s?wd=' + encodeURIComponent(params.name));
|
|
|
|
- });
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
-</script>
|
|
|
|
-<style>
|
|
|
|
- page {
|
|
|
|
- background: url(../../assets/img/index_header_bg.png) no-repeat top center #f7f7f7;
|
|
|
|
- background-size: 100%;
|
|
|
|
- }
|
|
|
|
-</style>
|
|
|
|
-
|
|
|
|
-<style lang="scss" scoped>
|
|
|
|
- .detailstable{
|
|
|
|
- padding: 20px 15px !important;
|
|
|
|
- }
|
|
|
|
- .detailstableHead{
|
|
|
|
- .span2{
|
|
|
|
- font-size: 44rpx !important;
|
|
|
|
- font-weight: bold;
|
|
|
|
- width: 100%;
|
|
|
|
- color: #101010;
|
|
|
|
- span{
|
|
|
|
- font-size: 24rpx !important;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
- .detailstable,.detailstableHead {
|
|
|
|
- font-size: 16px;
|
|
|
|
-
|
|
|
|
- p{
|
|
|
|
- font-size: 14px;
|
|
|
|
- }
|
|
|
|
- .details-row-main{
|
|
|
|
- border-bottom: 1px solid #ededed;
|
|
|
|
- padding: 10px 0;
|
|
|
|
-
|
|
|
|
- }
|
|
|
|
- .detailsline{
|
|
|
|
- border-bottom: 1px solid #ededed;
|
|
|
|
- }
|
|
|
|
- .detailsline,.detailsline—bottom {
|
|
|
|
-
|
|
|
|
- display: flex;
|
|
|
|
-
|
|
|
|
- .details-row {
|
|
|
|
- width: 48%;
|
|
|
|
- display: flex;
|
|
|
|
- justify-content: space-between;
|
|
|
|
- flex-direction: column;
|
|
|
|
- padding-left: 10px;
|
|
|
|
- margin-bottom: 10px;
|
|
|
|
- .span1 {
|
|
|
|
- color: rgba(136, 136, 136, 100);
|
|
|
|
- font-size: 14px;
|
|
|
|
- width: 100%;
|
|
|
|
- }
|
|
|
|
- .span2{
|
|
|
|
- font-size: 18px;
|
|
|
|
- width: 100%;
|
|
|
|
- color: #101010;
|
|
|
|
- span{
|
|
|
|
- font-size: 12px;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .details-row-1 {
|
|
|
|
- padding-left: 0px !important;
|
|
|
|
- border-right: 1px solid #ededed;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
-
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .details {
|
|
|
|
- margin-top: 16px;
|
|
|
|
- padding: 20px;
|
|
|
|
- background-color: #fff;
|
|
|
|
- border-radius: 8px;
|
|
|
|
-
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .details-title {
|
|
|
|
- margin-bottom: 16px;
|
|
|
|
-
|
|
|
|
- h4 {
|
|
|
|
- font-weight: normal;
|
|
|
|
- font-size: 16px;
|
|
|
|
- position: relative;
|
|
|
|
- padding-left: 10px;
|
|
|
|
-
|
|
|
|
- &::after {
|
|
|
|
- content: '';
|
|
|
|
- position: absolute;
|
|
|
|
- height: 12px;
|
|
|
|
- width: 4px;
|
|
|
|
- background-color: #27B148;
|
|
|
|
- left: 0;
|
|
|
|
- top: 5px;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .details-row {
|
|
|
|
- display: flex;
|
|
|
|
- justify-content: space-between;
|
|
|
|
- align-items: center;
|
|
|
|
- margin-top: 15px;
|
|
|
|
-
|
|
|
|
- p {
|
|
|
|
- color: #37393c;
|
|
|
|
- font-weight: bold;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
- .details-row2 {
|
|
|
|
- display: flex;
|
|
|
|
- justify-content: space-between;
|
|
|
|
- align-items: center;
|
|
|
|
- margin-top: 15px;
|
|
|
|
-
|
|
|
|
- p {
|
|
|
|
- // color: #37393c;
|
|
|
|
- // font-weight: bold;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .popup-screen {
|
|
|
|
- padding: 20px;
|
|
|
|
- position: relative;
|
|
|
|
-
|
|
|
|
- .screen {
|
|
|
|
- padding-bottom: 30px;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .screen-item {
|
|
|
|
- margin-bottom: 20px;
|
|
|
|
-
|
|
|
|
- .screen-head {
|
|
|
|
- margin-bottom: 8px;
|
|
|
|
- font-size: 16px;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .screen-main {
|
|
|
|
- display: flex;
|
|
|
|
- // display: -webkit-box;
|
|
|
|
- flex-wrap: wrap;
|
|
|
|
-
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .screen-entry {
|
|
|
|
- width: 29%;
|
|
|
|
- padding: 6px 0;
|
|
|
|
- display: flex;
|
|
|
|
- align-items: center;
|
|
|
|
- justify-content: center;
|
|
|
|
-
|
|
|
|
-
|
|
|
|
- background-color: #F2F5FA;
|
|
|
|
- text-align: center;
|
|
|
|
- margin-bottom: 10px;
|
|
|
|
- border-radius: 3px;
|
|
|
|
-
|
|
|
|
- margin-right: 6px;
|
|
|
|
-
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .screen-entry.active {
|
|
|
|
- background-color: #185AC6;
|
|
|
|
- color: #fff;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .screen-foot {
|
|
|
|
- position: fixed;
|
|
|
|
- left: 0;
|
|
|
|
- right: 0;
|
|
|
|
- bottom: 0;
|
|
|
|
- display: flex;
|
|
|
|
- height: 50px;
|
|
|
|
- border-top: 1px solid #ededed;
|
|
|
|
-
|
|
|
|
- .screen-btn-l {
|
|
|
|
- background-color: #fff;
|
|
|
|
- flex: 0.2;
|
|
|
|
- text-align: center;
|
|
|
|
- line-height: 50px;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .screen-btn-r {
|
|
|
|
- flex: 0.8;
|
|
|
|
- text-align: center;
|
|
|
|
- line-height: 50px;
|
|
|
|
- background-color: #185AC6;
|
|
|
|
- color: #fff;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .navbar-tit {
|
|
|
|
- color: #fff;
|
|
|
|
- font-size: 24px;
|
|
|
|
- padding-left: 15px;
|
|
|
|
- padding-top: 10px;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .statisticsData {
|
|
|
|
- background-color: #fff;
|
|
|
|
- margin: 12px 12px;
|
|
|
|
-
|
|
|
|
- padding: 12px 16px;
|
|
|
|
- border-radius: 8px;
|
|
|
|
-
|
|
|
|
- margin-top: 60px;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .statisticsDataMain {
|
|
|
|
- flex-wrap: wrap;
|
|
|
|
- display: flex;
|
|
|
|
-
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .statisticsData-item {
|
|
|
|
- flex: 1;
|
|
|
|
- width: 40%;
|
|
|
|
- .statisticsData-head {
|
|
|
|
- display: flex;
|
|
|
|
- align-items: center;
|
|
|
|
-
|
|
|
|
- p {
|
|
|
|
- color: #637AA2;
|
|
|
|
- font-size: 12px;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .statisticsData-main {
|
|
|
|
- margin-top: 4px;
|
|
|
|
- font-size: 18px;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .statisticsData-foot {
|
|
|
|
- display: flex;
|
|
|
|
- align-items: center;
|
|
|
|
- margin-top: 16px;
|
|
|
|
-
|
|
|
|
- p {
|
|
|
|
- color: #637AA2;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- h4 {
|
|
|
|
- margin-left: 8px;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .statisticsChart {
|
|
|
|
- margin: 16px;
|
|
|
|
-
|
|
|
|
- .statisticsChart-head {
|
|
|
|
- margin-bottom: 5px;
|
|
|
|
- display: flex;
|
|
|
|
- justify-content: space-between;
|
|
|
|
- align-items: center;
|
|
|
|
-
|
|
|
|
- h4 {
|
|
|
|
- font-weight: normal;
|
|
|
|
- font-size: 16px;
|
|
|
|
- position: relative;
|
|
|
|
- padding-left: 10px;
|
|
|
|
-
|
|
|
|
- &::after {
|
|
|
|
- content: '';
|
|
|
|
- position: absolute;
|
|
|
|
- height: 12px;
|
|
|
|
- width: 4px;
|
|
|
|
- background-color: #4E8DF6;
|
|
|
|
- left: 0;
|
|
|
|
- top: 5px;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .statisticsChart-time {
|
|
|
|
- display: flex;
|
|
|
|
- align-items: center;
|
|
|
|
-
|
|
|
|
- p {
|
|
|
|
- color: #666;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .statisticsChart-main {
|
|
|
|
- background-color: #fff;
|
|
|
|
- padding: 10px 16px 16px 16px;
|
|
|
|
- border-radius: 8px;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
-</style>
|
|
|