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.
81 lines
2.4 KiB
81 lines
2.4 KiB
1 year ago
|
<template>
|
||
|
|
<view v-if="data" @click="goDetails" class="stationItem">
|
||
|
|
<!-- 上半部分 -->
|
||
|
|
<view class="stationItem_top">
|
||
|
|
<view class="stationItem_top_title">{{data.name}}</view>
|
||
|
|
<view class="flex ac">
|
||
|
|
<view class=" stationItem_top_label_container oneflex flex">
|
||
|
|
<view v-for="(item,index) in data.tags" :key="index" :style="{background:item.color}"
|
||
|
|
class="stationItem_top_label"> {{item.label}}</view>
|
||
|
|
</view>
|
||
|
|
<view class="stationItem_distance flex">
|
||
|
|
<uni-icons style="margin-right: 10rpx;" type="paperplane-filled" color="#121836"
|
||
|
|
size="15"></uni-icons>
|
||
|
|
{{data.distance}}KM
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<!-- 下半部分 -->
|
||
|
|
<view class="stationItem_bottom">
|
||
|
|
<view class="is_stop_row flex ac">
|
||
|
|
<image style="width: 35rpx;height:40rpx;" src="../../static/stop.png"></image>
|
||
|
|
{{data.parkFee}}
|
||
|
|
</view>
|
||
|
|
<view class=" flex ">
|
||
|
|
<view class="stationItem_bottom_label_container oneflex flex">
|
||
|
|
<view class="stationItem_bottom_label flex ac">
|
||
|
|
<view class="stationItem_bottom_label_logo flex ac jc">快</view>
|
||
|
|
<text>{{data.fastChargingIdleRatio}}</text>
|
||
|
|
</view>
|
||
|
|
<view class="stationItem_bottom_label flex ac">
|
||
|
|
<view style="border: 2rpx solid #36658DFF;color: #36658DFF;" class="stationItem_bottom_label_logo flex ac jc">慢</view>
|
||
|
|
<text>{{data.slowChargingIdleRatio}}</text>
|
||
|
|
</view>
|
||
|
|
<view class="stationItem_bottom_label flex ac">
|
||
|
|
<view style="border: 2rpx solid #F67A22FF;color: #F67A22FF;" class="stationItem_bottom_label_logo flex ac jc">其他</view>
|
||
|
|
<text class="flex">{{data.otherIdleRatio}} </text>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="stationItem_bottom_price">￥{{ tool.getnum(data.unitPrice,3) }}/度</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
export default {
|
||
|
|
name: "stationItem",
|
||
|
|
props: {
|
||
|
|
data: {
|
||
|
|
type: Object,
|
||
|
|
default: () => {}
|
||
|
|
}
|
||
|
|
},
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
|
||
|
|
};
|
||
|
|
},
|
||
|
|
created() {
|
||
|
|
console.log(this.data.tags, 'data.tags')
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
goDetails() {
|
||
|
|
let {stationLng,stationLat,id,tags} = this.data;
|
||
|
|
let location = uni.getStorageSync('location') || {
|
||
|
|
longitude: 116.38,
|
||
|
|
latitude: 39.90,
|
||
|
|
} ;
|
||
|
|
uni.navigateTo({
|
||
|
|
url: `/ChargingStation/pages/index/index?data=${JSON.stringify({
|
||
|
|
stationLng:location.longitude ,
|
||
|
|
stationLat:location.latitude,id,tags})}`
|
||
|
|
});
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style scoped>
|
||
|
|
@import 'index.css';
|
||
|
|
</style>
|