|
|
@@ -4,8 +4,9 @@
|
|
|
<view style="display: flex;flex-direction: column; width: 100%;height: 100%;">
|
|
|
<view style="display: flex;flex-direction: row; height: 100%; align-items: center;margin-top:0rpx;padding-top: 0rpx;padding-bottom: 20rpx;">
|
|
|
<view style="margin-left:20rpx;width: 160rpx;">
|
|
|
- <uni-combox class='font2' ref="city" :border="false" v-model="area" :candidates="cities" @updateModel='updateCity' @updateSelector="updateCitySelector"></uni-combox>
|
|
|
- </view>
|
|
|
+ <uni-combox class='font2' ref="city" :border="false" v-model="area" :candidates="cities" @updateModel='updateCity' @updateSelector="updateTypeSelector(3)"></uni-combox>
|
|
|
+ </view>
|
|
|
+
|
|
|
<view style="margin-left: 20rpx;margin-right: 20rpx; flex:1" >
|
|
|
<u-search height="80" :input-style='inputStyle' placeholder="搜索站点名称" v-model="keyword" :showAction="false" @focus="navigate"></u-search></view>
|
|
|
<view style="margin-right: 20rpx;" v-show="viewMode" @click="listMode">
|
|
|
@@ -22,8 +23,8 @@
|
|
|
</view>
|
|
|
|
|
|
<view style="display: flex;flex-direction: row;width:100%; justify-content: space-between;align-items: center;">
|
|
|
- <view style="margin-left:20rpx;width: 160rpx;">
|
|
|
- <uni-combox class='font2' ref="raidus" style="width: 200rpx;" :border="false" v-model="raidus" :candidates="radiuses" @updateModel='updateRadius' @updateSelector="updateRadiusSelector"></uni-combox>
|
|
|
+ <view style="margin-left:20rpx;margin-right:10rpx;flex:1; ">
|
|
|
+ <uni-combox class='font2' ref="raidus" :border="false" v-model="raidus" :candidates="radiuses" @updateModel='updateRadius' @updateSelector="updateTypeSelector(0)"></uni-combox>
|
|
|
</view>
|
|
|
<!--
|
|
|
<view style="margin-left: 20rpx;">
|
|
|
@@ -31,10 +32,13 @@
|
|
|
<u-icon name="arrow-down-fill" size="13" color="#c0c4cc"></u-icon>
|
|
|
</view>
|
|
|
-->
|
|
|
- <view style="margin-left:20rpx;margin-right: 20rpx;flex:1">
|
|
|
- <uni-combox ref="type" class='font2' style="width: 200rpx;" :border="false" v-model="type" :candidates="types" @updateModel='updateType' @updateSelector="updateTypeSelector"></uni-combox>
|
|
|
+ <view style="flex:1; ">
|
|
|
+ <uni-combox ref="type" class='font2' :border="false" v-model="type" :candidates="types" @updateModel='updateType' @updateSelector="updateTypeSelector(1)"></uni-combox>
|
|
|
</view>
|
|
|
-
|
|
|
+
|
|
|
+ <view style="flex:1;">
|
|
|
+ <uni-combox ref="stationType" class='font2' :border="false" v-model="stationType" :candidates="stationTypes" @updateModel='updateType2' @updateSelector="updateTypeSelector(2)"></uni-combox>
|
|
|
+ </view>
|
|
|
<!-- <view style="margin-left: 20rpx;margin-right: 20rpx;flex:1">
|
|
|
<label class="arrow">{{ info.obc_type[preference.obc_type_index].text }}</label>
|
|
|
<u-icon name="arrow-down-fill" size="13" color="#c0c4cc"></u-icon>
|
|
|
@@ -78,9 +82,23 @@
|
|
|
@click="selectOBSType(index)"
|
|
|
></u-tag>
|
|
|
</view>
|
|
|
+ </view>
|
|
|
+ <view class="preference_group">
|
|
|
+ <view class="preference_group_item"><label class="preference_label">充电站所属</label></view>
|
|
|
+ <view>
|
|
|
+ <u-tag
|
|
|
+ class="preference_item_medium"
|
|
|
+ v-for="(item, index) in info.obc_stationType"
|
|
|
+ :key="index"
|
|
|
+ :style="index == preference.obc_stationType_index ? 'background-color:#00B962;color:#FFFFFF' : 'background-color:#EFF4F2;color:#926666'"
|
|
|
+ shape="circle"
|
|
|
+ :text="item.text"
|
|
|
+ @click="selectOBSType2(index)"
|
|
|
+ ></u-tag>
|
|
|
+ </view>
|
|
|
</view>
|
|
|
|
|
|
- <view class="preference_group">
|
|
|
+ <view class="preference_group" v-if="false">
|
|
|
<view class="preference_group_item"><label class="preference_label">是否对外开放</label></view>
|
|
|
<view>
|
|
|
<u-tag
|
|
|
@@ -95,7 +113,7 @@
|
|
|
</view>
|
|
|
</view>
|
|
|
|
|
|
- <view class="preference_group">
|
|
|
+ <view class="preference_group" v-if="false">
|
|
|
<view style="margin-left: 30rpx;"><u-checkbox active-color="#00b962" shape="circle" v-model="preference.save_preference" @change="radioChange">保存偏好设置</u-checkbox></view>
|
|
|
</view>
|
|
|
|
|
|
@@ -136,7 +154,7 @@
|
|
|
<view class="sign" v-if="item.stationType==50">
|
|
|
{{item.address}}
|
|
|
</view>
|
|
|
- <view class="sign">
|
|
|
+ <view class="sign" v-else>
|
|
|
<view class="sign-1" v-if="item.giveDiscount">服务费{{item.discountRatio/10}}折</view>
|
|
|
<view class="sign-2" v-if="item.tagList.length != 0" v-for="(tagName,tagIndex) in item.tagList" :key="tagIndex">{{tagName}}</view>
|
|
|
</view>
|
|
|
@@ -231,17 +249,20 @@
|
|
|
<view class="sign-2" v-if="item.tagList.length != 0" v-for="(tagName,tagIndex) in item.tagList"
|
|
|
:key="tagIndex">{{tagName}}</view>
|
|
|
</view>
|
|
|
- <view class="price-free ">
|
|
|
+ <view class="price-free price-freeOne">
|
|
|
<view class="price">
|
|
|
<view class="price-1">
|
|
|
<view class="num">
|
|
|
{{!item.giveDiscount ? (item.electricityPrice+item.servicePrice).toFixed(2)
|
|
|
- : (item.electricityPrice+item.discountServicePrice).toFixed(2)}}</view>
|
|
|
- <view class="unit oldTextjp2" oldstyle="font-size: 14px;">
|
|
|
- 元/度 起
|
|
|
- </view>
|
|
|
+ : (item.electricityPrice+item.discountServicePrice).toFixed(2)}}
|
|
|
+
|
|
|
+ <span class="unit " oldstyle="font-size: 14px;">
|
|
|
+ 元/度 起
|
|
|
+ </span>
|
|
|
+ </view>
|
|
|
+
|
|
|
</view>
|
|
|
- <view class="price-2 oldTextjp2" oldstyle="font-size: 14px;" v-if="item.giveDiscount">
|
|
|
+ <view class="price-2 " oldstyle="font-size: 14px;" v-if="item.giveDiscount">
|
|
|
<text class="num">{{(item.electricityPrice+item.servicePrice).toFixed(2)}}</text>
|
|
|
<text class="unit">元/度 起</text>
|
|
|
</view>
|
|
|
@@ -270,94 +291,7 @@
|
|
|
</swiper-item>
|
|
|
</swiper>
|
|
|
</view>
|
|
|
-<!-- 老版卡片-->
|
|
|
- <!-- <view v-if="stationsmap.length>0" class="chargerCard" >
|
|
|
- <swiper v-if="stationsmap.length>0" :current="currentIndex" @change="swiperChange" slide-change-transition-end='swiperTransitionEnd' @transition="swiperTransition" style="height: 100%;">
|
|
|
- <swiper-item v-for="(item,index) in stationsmap" :key="item.id" style="height: 100%;">
|
|
|
-
|
|
|
- <view class="swiper-item" style="height: 100%; background-color: #ffffff;" @click="stationDetail(item)">
|
|
|
-
|
|
|
- <view class="charing-slow charing-slow-2" @click="stationDetail(item)">
|
|
|
- <view class="address">
|
|
|
- <view class="name oldTextjp" oldstyle="font-size: 20px;">
|
|
|
- {{item.name}}
|
|
|
- </view>
|
|
|
- <view class="distance oldTextjp2" oldstyle="font-size: 16px;" v-if="item.distance != '99999999'">
|
|
|
- <text class="iconfont" style="color:#666666"></text>
|
|
|
- {{item.distance!=null && item.distance>0.1 ? item.distance.toFixed(1)+'公里' : '小于100米'}}
|
|
|
- </view>
|
|
|
- <view class="distance oldTextjp2" oldstyle="font-size: 16px;" v-else>
|
|
|
- <text class="iconfont" style="color:#666666"></text>
|
|
|
- 暂无定位
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="sign">
|
|
|
- <view class="sign-1" v-if="item.giveDiscount">服务费{{item.discountRatio/10}}折</view>
|
|
|
- <view class="sign-2" v-if="item.tagList.length != 0" v-for="(tagName,tagIndex) in item.tagList" :key="tagIndex">{{tagName}}</view>
|
|
|
- </view>
|
|
|
- <view class="price-free">
|
|
|
- <view class="price">
|
|
|
- <view class="price-1">
|
|
|
- <view class="num">{{!item.giveDiscount ? (item.electricityPrice+item.servicePrice).toFixed(2)
|
|
|
- : (item.electricityPrice+item.discountServicePrice).toFixed(2)}}</view>
|
|
|
- <view class="unit oldTextjp2" oldstyle="font-size: 14px;">
|
|
|
- 元/度 起
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="price-2 oldTextjp2" oldstyle="font-size: 14px;" v-if="item.giveDiscount">
|
|
|
- <text class="num">{{(item.electricityPrice+item.servicePrice).toFixed(2)}}</text>
|
|
|
- <text class="unit">元/度 起</text>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="free">
|
|
|
- <view class="fast" v-if="item.type == '快充' || item.type == '快/慢'">
|
|
|
- <view class="fast-font">
|
|
|
- 快
|
|
|
- </view>
|
|
|
- <view class="num">
|
|
|
- {{item.fastAvailableNum}}/{{item.fastNum}}
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="slow" v-if="item.type == '慢充' || item.type == '快/慢'">
|
|
|
- <view class="slow-font">
|
|
|
- 慢
|
|
|
- </view>
|
|
|
- <view class="num">
|
|
|
- {{item.slowAvailableNum}}/{{item.slowNum}}
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
-
|
|
|
- <view class="card_item" >
|
|
|
- <u-button shape='circle' style="color: #00B962;" @click="getScanCode" >
|
|
|
- <u-icon name="scan" size="26" color="#00B962" ></u-icon>
|
|
|
- <label>扫码充电</label>
|
|
|
- </u-button>
|
|
|
-
|
|
|
- <view class="round" @click.stop="navigateTo(item)" v-if="item.distance!=99999999">
|
|
|
- <text class="iconfont distance-font"></text>
|
|
|
- <view style="margin-right: 10rpx;" >
|
|
|
- {{item.distance!=null&&item.distance>0.1 ? item.distance.toFixed(1)+'公里':'小于100米'}}
|
|
|
- </view>
|
|
|
- <view style="margin-right: 10rpx;">
|
|
|
- {{item.time!=null?item.time.toFixed(0):''}}分钟
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="round" @click.stop="navigateTo(item)" v-else>
|
|
|
- <text class="iconfont distance-font"></text>
|
|
|
- <view style="margin-right: 10rpx;" >
|
|
|
- 导航
|
|
|
- </view>
|
|
|
-
|
|
|
- </view>
|
|
|
-
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </swiper-item>
|
|
|
- </swiper>
|
|
|
- </view> -->
|
|
|
+
|
|
|
|
|
|
</view>
|
|
|
</view>
|
|
|
@@ -406,10 +340,12 @@ export default {
|
|
|
showRadius:false,
|
|
|
cities: [ '荆州市'],
|
|
|
radiuses:['1公里','2公里','5公里','10公里','20公里','50公里','100公里','200公里'],
|
|
|
- types:['全部','交流快充','直流慢充'],
|
|
|
+ types:['全部','交流快充','直流慢充'],
|
|
|
+ stationTypes:['全部','公共充电桩','个人充电桩'],
|
|
|
area: '荆州市',
|
|
|
raidus:'',
|
|
|
- type:'',
|
|
|
+ type:'',
|
|
|
+ stationType:'',
|
|
|
centerImg:'@/static/img/location.png',
|
|
|
currentIndex:-1,
|
|
|
navBarHeight:88,
|
|
|
@@ -429,7 +365,8 @@ export default {
|
|
|
},
|
|
|
action: '筛选',
|
|
|
preference: {
|
|
|
- miles_index: 3,
|
|
|
+ miles_index: 3,
|
|
|
+ obc_stationType_index:0,
|
|
|
obc_type_index: 0,
|
|
|
obc_status_index: 0,
|
|
|
obc_voltage_index: 0,
|
|
|
@@ -461,7 +398,10 @@ export default {
|
|
|
obc_type: [{ value: '', text: '全部' }, { value: 0, text: '直流快充' }, { value: 1, text: '交流慢充' }],
|
|
|
obc_status: [{ value: 0, text: '对外开放' }, { value: 1, text: '不对外开放' }],
|
|
|
obc_voltage: [{ value: 0, text: '低于700V' }, { value: 1, text: '700V及以上' }],
|
|
|
- obc_power: { minValue: 0, maxValue: 1000 }
|
|
|
+ obc_power: { minValue: 0, maxValue: 1000 },
|
|
|
+ obc_stationType : [
|
|
|
+ { value: '', text: '全部' }, { value: 1, text: '公共充电桩' }, { value:50, text: '个人充电桩' }
|
|
|
+ ]
|
|
|
},
|
|
|
userId:'',
|
|
|
};
|
|
|
@@ -523,10 +463,11 @@ export default {
|
|
|
this.radiuses = [];
|
|
|
for(let i = 0;i< this.info.miles_type.length;i++){
|
|
|
this.radiuses.push(this.info.miles_type[i].text);
|
|
|
- }
|
|
|
+ }
|
|
|
+
|
|
|
this.type = this.info.obc_type[this.preference.obc_type_index].text;
|
|
|
this.raidus = this.info.miles_type[this.preference.miles_index].text;
|
|
|
-
|
|
|
+ this.stationType= this.info.obc_stationType[this.preference.obc_stationType_index].text;
|
|
|
WxJsApi.getWxConfig(['getLocation', 'addEventListener', 'scanQRCode']).then((res) => {
|
|
|
// //(res)
|
|
|
}).catch(error => {
|
|
|
@@ -565,30 +506,22 @@ export default {
|
|
|
this.end();
|
|
|
},
|
|
|
methods: {
|
|
|
- updateCitySelector(){
|
|
|
- //('updateCitySelector');
|
|
|
- this.$refs.type.closeSelector();
|
|
|
- this.$refs.raidus.closeSelector();
|
|
|
- //this.$refs.city.closeSelector();
|
|
|
- this.show = false;
|
|
|
+
|
|
|
+ updateTypeSelector(val){
|
|
|
+
|
|
|
+ var sz=["raidus","type","stationType",'city']
|
|
|
+ for(var i in sz){
|
|
|
+ if(i==val){
|
|
|
+
|
|
|
+ }else{
|
|
|
+ this.$refs[sz[i]].closeSelector();
|
|
|
+ }
|
|
|
+ }
|
|
|
|
|
|
- },
|
|
|
- updateTypeSelector(){
|
|
|
- //('updateTypeSelector');
|
|
|
- //this.$refs.type.closeSelector();
|
|
|
- this.$refs.raidus.closeSelector();
|
|
|
- this.$refs.city.closeSelector();
|
|
|
- this.show = false;
|
|
|
-
|
|
|
- },
|
|
|
- updateRadiusSelector(){
|
|
|
- //('updateRadiusSelector');
|
|
|
- this.$refs.type.closeSelector();
|
|
|
- //this.$refs.raidus.closeSelector();
|
|
|
- this.$refs.city.closeSelector();
|
|
|
this.show = false;
|
|
|
|
|
|
},
|
|
|
+
|
|
|
updateCity(e){
|
|
|
this.close();
|
|
|
},
|
|
|
@@ -596,6 +529,11 @@ export default {
|
|
|
this.preference.miles_index = e.value;
|
|
|
this.close();
|
|
|
//('updateRadius'+JSON.stringify(e))
|
|
|
+ },
|
|
|
+ updateType2(e){
|
|
|
+ this.preference.obc_stationType_index = e.value;
|
|
|
+ this.close();
|
|
|
+ //('updateType'+JSON.stringify(e))
|
|
|
},
|
|
|
updateType(e){
|
|
|
this.preference.obc_type_index = e.value;
|
|
|
@@ -896,6 +834,10 @@ export default {
|
|
|
data1.latitude = pos.latitude.toString();
|
|
|
if(this.info.miles_type[this.preference.miles_index].distance!=null)
|
|
|
data1.raidus = this.info.miles_type[this.preference.miles_index].distance.toString();
|
|
|
+
|
|
|
+ if(this.preference.obc_stationType_index!=null){
|
|
|
+ data1.stationType= this.info.obc_stationType[this.preference.obc_stationType_index].value
|
|
|
+ }
|
|
|
// data1.online = "0";//在线
|
|
|
if(pos.findType != null)
|
|
|
data1.findType = pos.findType;
|
|
|
@@ -1209,6 +1151,9 @@ export default {
|
|
|
},
|
|
|
selectOBSType(index) {
|
|
|
this.preference.obc_type_index = index;
|
|
|
+ },
|
|
|
+ selectOBSType2(index) {
|
|
|
+ this.preference.obc_stationType_index = index;
|
|
|
},
|
|
|
selectOBSStatus(index) {
|
|
|
this.preference.obc_status_index = index;
|
|
|
@@ -1221,7 +1166,9 @@ export default {
|
|
|
},
|
|
|
reset() {
|
|
|
this.preference.obc_status_index = 0;
|
|
|
- this.preference.obc_voltage_index = 0;
|
|
|
+ this.preference.obc_voltage_index = 0;
|
|
|
+ this.preference.obc_stationType_index = 0;
|
|
|
+
|
|
|
this.preference.obc_type_index = 0;
|
|
|
this.preference.miles_index = 3;
|
|
|
this.preference.save_preference = false;
|
|
|
@@ -1237,17 +1184,14 @@ export default {
|
|
|
// //('reset')
|
|
|
},
|
|
|
close_all(){
|
|
|
- this.$refs.type.closeSelector();
|
|
|
- this.$refs.raidus.closeSelector();
|
|
|
- this.$refs.city.closeSelector();
|
|
|
+
|
|
|
+ this.updateTypeSelector()
|
|
|
this.show = false;
|
|
|
},
|
|
|
open() {
|
|
|
|
|
|
- this.$refs.type.closeSelector();
|
|
|
- this.$refs.raidus.closeSelector();
|
|
|
- this.$refs.city.closeSelector();
|
|
|
- this.show = !this.show;
|
|
|
+ this.updateTypeSelector()
|
|
|
+ this.show = true;
|
|
|
//this.$refs.obc_voltage.currentMinValue = this.preference.obc_power[0];
|
|
|
//this.$refs.obc_voltage.currentMaxValue = this.preference.obc_power[1];
|
|
|
//('open');
|
|
|
@@ -1258,7 +1202,9 @@ export default {
|
|
|
// this.show = false;
|
|
|
let data = {latitude:this.latitude,longtitude:this.longitude};
|
|
|
this.type = this.info.obc_type[this.preference.obc_type_index].text;
|
|
|
- this.raidus = this.info.miles_type[this.preference.miles_index].text;
|
|
|
+ this.raidus = this.info.miles_type[this.preference.miles_index].text;
|
|
|
+ this.stationType = this.info.obc_stationType[this.preference.obc_stationType_index].text;
|
|
|
+
|
|
|
if(this.preference.save_preference)
|
|
|
this.carhelp.set('preference',this.preference)
|
|
|
|
|
|
@@ -1492,7 +1438,7 @@ export default {
|
|
|
margin-left: 20rpx;
|
|
|
text-align: center;
|
|
|
border-style: none;
|
|
|
- width: 22%;
|
|
|
+ min-width: 22%;
|
|
|
height: 56rpx;
|
|
|
@include themeify{
|
|
|
font-size: themed('font-size2');
|
|
|
@@ -1703,7 +1649,8 @@ export default {
|
|
|
.distance{
|
|
|
color: rgba(102, 102, 102, 100);
|
|
|
font-size: 12px;
|
|
|
- width:80px;
|
|
|
+
|
|
|
+ width: 90px;
|
|
|
.iconfont{
|
|
|
font-size: 12px;
|
|
|
margin-right: 2px;
|
|
|
@@ -1724,7 +1671,7 @@ font-weight: 600;
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
justify-content: space-between;
|
|
|
- margin-top: 8px;
|
|
|
+
|
|
|
}
|
|
|
.price {
|
|
|
display: flex;
|
|
|
@@ -1732,16 +1679,15 @@ font-weight: 600;
|
|
|
line-height: 40rpx;
|
|
|
|
|
|
.price-1{
|
|
|
-
|
|
|
+
|
|
|
|
|
|
.num {
|
|
|
|
|
|
color: rgba(255, 98, 0, 100);
|
|
|
|
|
|
- @include themeify{
|
|
|
- font-size: themed('font-size5');
|
|
|
- height: themed('font-size5');
|
|
|
- }
|
|
|
+
|
|
|
+ font-size: 44rpx;
|
|
|
+ height: 44rpx;
|
|
|
text-align: left;
|
|
|
font-family: Roboto-medium;
|
|
|
}
|
|
|
@@ -1750,7 +1696,8 @@ font-weight: 600;
|
|
|
color: rgba(102, 102, 102, 100);
|
|
|
@include themeify{
|
|
|
// font-size: themed('font-size2');
|
|
|
- font-size: 12px;
|
|
|
+ font-size: 24rpx;
|
|
|
+
|
|
|
height: themed('font-size2');
|
|
|
|
|
|
}
|
zkx