|
|
@@ -76,7 +76,7 @@
|
|
|
<view class="detailstableHead" style="
|
|
|
padding-top: 1px;
|
|
|
">
|
|
|
- <view id="pieEcharts" style="min-height:240px;margin-top: 20px">
|
|
|
+ <view id="pieEcharts" style="min-height:240px;margin-top: 40rpx">
|
|
|
|
|
|
</view>
|
|
|
</view>
|
|
|
@@ -282,7 +282,7 @@
|
|
|
|
|
|
|
|
|
<view class="screen-item">
|
|
|
- <view class="screen-head">站点</view>
|
|
|
+ <view class="screen-head">站点类型<span style="color: red;">*</span></view>
|
|
|
<view class="screen-main">
|
|
|
|
|
|
|
|
|
@@ -318,8 +318,77 @@
|
|
|
</template>
|
|
|
|
|
|
|
|
|
- </view>
|
|
|
- </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="screen-item" style="margin-bottom: 40rpx;" >
|
|
|
+ <view class="screen-head">时间段查询</view>
|
|
|
+ <view class="screen-main">
|
|
|
+ <view>
|
|
|
+ <checkbox-group @change="checkboxChange1">
|
|
|
+ <checkbox value="cb" :checked="sliderNumTemp1.ck" ></checkbox>{{sliderNumTemp1.ck?'开启':'关闭'}}
|
|
|
+ </checkbox-group>
|
|
|
+ </view>
|
|
|
+ <view style="
|
|
|
+ width: 80%;margin-bottom: 8rpx;
|
|
|
+ ">
|
|
|
+ <DoubleSlider
|
|
|
+ ref="obc_voltage"
|
|
|
+ sliderHeight="15rpx"
|
|
|
+ blockSize="36rpx"
|
|
|
+ :minValue="0"
|
|
|
+ :maxValue="24"
|
|
|
+ :step="1"
|
|
|
+
|
|
|
+ :currentMinValue="sliderNumTemp1.minValue"
|
|
|
+ :currentMaxValue="sliderNumTemp1.maxValue"
|
|
|
+ labelColor="#B8C9C5"
|
|
|
+ borderRadius="25rpx"
|
|
|
+ borderColor="#00B962"
|
|
|
+ borderStyle="solid"
|
|
|
+ borderWidth="3rpx"
|
|
|
+ blockColor="#FFFFFF"
|
|
|
+ activeColor="#00B962"
|
|
|
+ indicatorColor="#DBDBDB"
|
|
|
+ @change="handlerDoubleSlider1"
|
|
|
+ > </DoubleSlider>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="screen-main">
|
|
|
+ <view>
|
|
|
+ <checkbox-group @change="checkboxChange2">
|
|
|
+ <checkbox value="cb" :checked="sliderNumTemp2.ck" ></checkbox>{{sliderNumTemp2.ck?'开启':'关闭'}}
|
|
|
+ </checkbox-group>
|
|
|
+ </view>
|
|
|
+ <view style="
|
|
|
+ width: 80%;margin-bottom: 8rpx;
|
|
|
+ ">
|
|
|
+ <DoubleSlider
|
|
|
+ ref="obc_voltage"
|
|
|
+ sliderHeight="15rpx"
|
|
|
+ blockSize="36rpx"
|
|
|
+ :minValue="0"
|
|
|
+ :maxValue="24"
|
|
|
+ :step="1"
|
|
|
+
|
|
|
+ :currentMinValue="sliderNumTemp2.minValue"
|
|
|
+ :currentMaxValue="sliderNumTemp2.maxValue"
|
|
|
+ labelColor="#B8C9C5"
|
|
|
+ borderRadius="25rpx"
|
|
|
+ borderColor="#00B962"
|
|
|
+ borderStyle="solid"
|
|
|
+ borderWidth="3rpx"
|
|
|
+ blockColor="#FFFFFF"
|
|
|
+ activeColor="#00B962"
|
|
|
+ indicatorColor="#DBDBDB"
|
|
|
+ @change="handlerDoubleSlider2"
|
|
|
+ > </DoubleSlider>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
|
|
|
</view>
|
|
|
<view class="screen-foot">
|
|
|
@@ -747,20 +816,23 @@
|
|
|
|
|
|
|
|
|
</view>
|
|
|
- <view @click="resetBtn7()" style="color: rgb(153, 153, 153);text-align: center;padding: 8px;border: 1px solid rgb(153, 153, 153);" v-if="stationId3==''">
|
|
|
+ <view @click="resetBtn7()" style="color: rgb(153, 153, 153); margin: 40rpx;text-align: center;padding: 8px;border: 1px solid rgb(153, 153, 153);" v-if="stationId3==''">
|
|
|
默认不查询,点击筛选
|
|
|
</view>
|
|
|
<view v-else style="
|
|
|
color: #888888;
|
|
|
" >
|
|
|
- <view v-if="selectOne">{{selectOne.name}}</view>
|
|
|
- <view>{{startTime3}}至{{endTime3}}</view>
|
|
|
+ <view v-if="selectOne">[ {{selectShowNumType==1?'百分比':'次数'}} ] {{selectOne.name}}</view>
|
|
|
+ <view>{{startTime3}}至{{endTime3}};
|
|
|
+ <span v-if="sliderNum1.ck">{{sliderNum1.minValue}}点-{{sliderNum1.maxValue}}点;</span>
|
|
|
+ <span v-if="sliderNum2.ck">{{sliderNum2.minValue}}点-{{sliderNum2.maxValue}}点;</span>
|
|
|
+ </view>
|
|
|
|
|
|
</view>
|
|
|
<view class="detailstableHead" style="
|
|
|
padding-top: 1px;
|
|
|
">
|
|
|
- <view id="pieEcharts2" style="margin-top: 20px">
|
|
|
+ <view id="pieEcharts2" style="margin-top: 40rpx">
|
|
|
|
|
|
</view>
|
|
|
</view>
|
|
|
@@ -779,6 +851,7 @@
|
|
|
import Tabbar from '@/components/TabbarFinance.vue'
|
|
|
import * as API from '@/apis/finance.js'
|
|
|
import * as echarts from "echarts";
|
|
|
+ import DoubleSlider from '@/components/double-slider/DoubleSlider.vue';
|
|
|
//require("@/apis/echarts-5-3.min.js")
|
|
|
//import * as echarts from "@/apis/echarts-5-3.min.js";
|
|
|
import {
|
|
|
@@ -789,6 +862,7 @@
|
|
|
newDate
|
|
|
} from '@/utils'
|
|
|
export default {
|
|
|
+
|
|
|
data() {
|
|
|
return {
|
|
|
popupShow3: false,
|
|
|
@@ -922,6 +996,12 @@
|
|
|
selectShowNumTypeTemp1:1,
|
|
|
selectShowNumType2:1,
|
|
|
selectShowNumTypeTemp2:1,
|
|
|
+ sliderNum1: { ck:0,minValue: 0, maxValue: 8 },
|
|
|
+ sliderNum2: { ck:0,minValue: 18, maxValue: 24 },
|
|
|
+
|
|
|
+ sliderNumTemp1: { ck:0,minValue: 0, maxValue: 5 },
|
|
|
+ sliderNumTemp2: { ck:0,minValue: 0, maxValue: 5 },
|
|
|
+
|
|
|
}
|
|
|
},
|
|
|
onShow() {
|
|
|
@@ -955,7 +1035,7 @@
|
|
|
})
|
|
|
},
|
|
|
components: {
|
|
|
- Tabbar
|
|
|
+ Tabbar,DoubleSlider
|
|
|
|
|
|
},
|
|
|
onReady() {
|
|
|
@@ -999,7 +1079,34 @@
|
|
|
this.onPageScrollMethod()
|
|
|
},
|
|
|
|
|
|
- methods: {
|
|
|
+ methods: {
|
|
|
+ checkboxChange1(e){
|
|
|
+ this.sliderNumTemp1.ck=e.detail.value.length
|
|
|
+ },
|
|
|
+ checkboxChange2(e){
|
|
|
+ this.sliderNumTemp2.ck=e.detail.value.length
|
|
|
+ },
|
|
|
+ handlerDoubleSlider1(e) {
|
|
|
+ console.log(e)
|
|
|
+ var a=e.minValue.toFixed(0)
|
|
|
+ var b=e.maxValue.toFixed(0)
|
|
|
+
|
|
|
+
|
|
|
+ this.sliderNumTemp1.minValue=a
|
|
|
+ this.sliderNumTemp1.maxValue=b
|
|
|
+ },
|
|
|
+ handlerDoubleSlider2(e) {
|
|
|
+ var a=e.minValue.toFixed(0)
|
|
|
+ var b=e.maxValue.toFixed(0)
|
|
|
+
|
|
|
+
|
|
|
+ this.sliderNumTemp2.minValue=a
|
|
|
+ this.sliderNumTemp2.maxValue=b
|
|
|
+ // console.log('e'+JSON.stringify(e))
|
|
|
+ //this.preference.obc_power = e;
|
|
|
+ //this.preference.obc_power.minValue = e.minValue;
|
|
|
+ //this.preference.obc_power.maxValue = e.maxValue;
|
|
|
+ },
|
|
|
selectShowNumTypeTemp1Btn(){
|
|
|
if(this.selectShowNumTypeTemp1==1){
|
|
|
this.selectShowNumTypeTemp1=0
|
|
|
@@ -1385,11 +1492,25 @@
|
|
|
|
|
|
this.form3.startDate = this.startTime3
|
|
|
this.form3.endDate = this.endTime3
|
|
|
- if(this.stationId3==""){
|
|
|
- this.form3.stationId=this.selectOne.id
|
|
|
- }else{
|
|
|
- this.form3.stationId=this.stationId3;
|
|
|
- }
|
|
|
+ this.form3.stationId=this.stationId3;
|
|
|
+
|
|
|
+ if(this.sliderNum1.ck==1||this.sliderNum2.ck==1){
|
|
|
+ var str="";
|
|
|
+ if(this.sliderNum1.ck==1){
|
|
|
+ str+=this.sliderNum1.minValue+"-"+this.sliderNum1.maxValue
|
|
|
+ if(this.sliderNum2.ck==1){
|
|
|
+ str+=","
|
|
|
+ }
|
|
|
+ }
|
|
|
+ if(this.sliderNum2.ck==1){
|
|
|
+ str+=this.sliderNum2.minValue+"-"+this.sliderNum2.maxValue
|
|
|
+
|
|
|
+ }
|
|
|
+ this.form3.timeArray=str
|
|
|
+ }else{
|
|
|
+ delete this.form3.timeArray
|
|
|
+ }
|
|
|
+
|
|
|
API.usageStatistics(this.form3).then((res) => {
|
|
|
this.indexData6 = res.data
|
|
|
if(bl){
|
|
|
@@ -1432,7 +1553,8 @@
|
|
|
this.startTime3Temp=this.startTime3;
|
|
|
this.endTime3Temp=this.endTime3;
|
|
|
this.selectShowNumTypeTemp=this.selectShowNumType;
|
|
|
-
|
|
|
+ this.sliderNumTemp1=this.sliderNum1
|
|
|
+ this.sliderNumTemp2=this.sliderNum2
|
|
|
this.selectShowNumTypeTemp2=this.selectShowNumType2
|
|
|
this.selectShowNumTypeTemp1=this.selectShowNumType1
|
|
|
|
|
|
@@ -1454,6 +1576,10 @@
|
|
|
}
|
|
|
this.selectShowNumType2=this.selectShowNumTypeTemp2
|
|
|
this.selectShowNumType1=this.selectShowNumTypeTemp1
|
|
|
+
|
|
|
+
|
|
|
+ this.sliderNum1=this.sliderNumTemp1
|
|
|
+ this.sliderNum2=this.sliderNumTemp2
|
|
|
|
|
|
this.selectShowNumType=this.selectShowNumTypeTemp
|
|
|
this.selectOne=this.selectOneTemp;
|
|
|
@@ -2649,7 +2775,7 @@
|
|
|
}
|
|
|
|
|
|
.popup-screen {
|
|
|
- padding: 20px;
|
|
|
+ padding: 40rpx;
|
|
|
position: relative;
|
|
|
|
|
|
.screen {
|
|
|
@@ -2657,7 +2783,7 @@
|
|
|
}
|
|
|
|
|
|
.screen-item {
|
|
|
- margin-bottom: 20px;
|
|
|
+ margin-bottom: 40rpx;
|
|
|
|
|
|
.screen-head {
|
|
|
margin-bottom: 8px;
|
zkx