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.
133 lines
3.4 KiB
133 lines
3.4 KiB
<template> |
|
<view class="cu-item cur padding no-mr-border site-item"> |
|
<view class="cu-avatar radius lg " |
|
:style="'background-image:url('+(siteItem.siteImages?siteItem.siteImages:defaultLogo)+');'"> |
|
|
|
</view> |
|
<view class="content"> |
|
<view> |
|
<view class="text-cut text-black text-lg padding-right-sm siteName ">{{siteItem.siteName}}</view> |
|
</view> |
|
<view class="text-gray flex pd_sm"> |
|
<view class="oil-main-color text-xl text-bold padding-right-xs money_title" v-if='siteItem.price'> |
|
¥{{siteItem.price|moneyFormat}} /KG |
|
</view> |
|
<view class="listTages"> |
|
<view class="cu-tag round bg-self-yellow yu-tag text-xs" :class="siteItem.formats=='1'?'tag-red':''">{{siteItem.formats|channelCodeFamt}} |
|
</view> |
|
<view class="cu-tag round bg-self--dark-yellow yu-tag text-xs" v-show="first">距离最近</view> |
|
</view> |
|
<!-- <view class=""> |
|
<text class="cu-tag oil-tag radius text-xs" |
|
v-if="siteItem.oilSitePrice - siteItem.sitePrice>0">省¥{{(siteItem.oilSitePrice - siteItem.sitePrice)|moneyFormat}}</text> |
|
</view> --> |
|
<!-- <view class="text-cut padding-left-sm text-lg"> |
|
<text class="text-delete color-333 text-sm padding-right-xs"> |
|
¥{{siteItem.oilSitePrice|moneyFormat}}/L |
|
</text> --> |
|
<!-- <my-icon iconName="¥.png" class="padding-right-xs icon-rectangle"></my-icon> |
|
|
|
<my-icon iconName="f.png" class="padding-right-xs "></my-icon> --> |
|
<!-- </view> --> |
|
</view> |
|
<view class=""> |
|
<view class="text-cut color-666 text-sm "> |
|
{{siteItem.address}} |
|
</view> |
|
</view> |
|
</view> |
|
<view class="action" style="width: 88px;"> |
|
<view class="text-grey text-sm " style="padding-top: 6rpx;width: 160rpx;" > |
|
{{siteItem.juli |distanceFilter}} |
|
</view> |
|
</view> |
|
</view> |
|
</template> |
|
|
|
<script> |
|
export default { |
|
props: { |
|
siteItem: { |
|
type: Object, |
|
default () {} |
|
}, |
|
first: { |
|
type: Boolean, |
|
default: false |
|
} |
|
}, |
|
data() { |
|
return { |
|
starUrl: this.global.starUrl, |
|
defaultLogo:'https://publicxingyou.oss-cn-hangzhou.aliyuncs.com/mp-oil/logo_default.png' |
|
} |
|
}, |
|
methods: { |
|
|
|
}, |
|
filters: { |
|
channelCodeFamt(value) { |
|
if (value != null || value != '' ) { |
|
// return '未知' |
|
// 渠道编码 ( XOIL:星油 WJY:万金油 LV:老吕(找油网) TY:团油 YDJY:一点加油(壳牌)) |
|
switch (value) { |
|
case '1': |
|
return '加注机' |
|
case '2': |
|
return '桶装' |
|
} |
|
} |
|
}, |
|
distanceFilter(value) { |
|
let nb = Number(value) |
|
if (nb) { |
|
return nb > 1000?((nb / 1000).toFixed(1) + 'km') : (nb + 'm') |
|
} |
|
}, |
|
moneyFormat(value) { |
|
if (value) { |
|
let realAmount =(Math.floor(value * 100) / 100 ).toFixed(2) |
|
return realAmount |
|
} else { |
|
return '0.00' |
|
} |
|
}, |
|
} |
|
} |
|
</script> |
|
|
|
<style scoped> |
|
.pd_sm{ |
|
padding: 2% 0; |
|
} |
|
.siteName{ |
|
font-weight: 700; |
|
} |
|
.money_title{ |
|
margin-right: 4%; |
|
font-size: 38rpx; |
|
border-right: 1px solid #efefef; |
|
padding-right: 4%; |
|
} |
|
.site-item { |
|
margin-bottom: 1.8rem; |
|
align-items: flex-start !important; |
|
height: 147rpx!important; |
|
} |
|
|
|
.yellow-oil{ |
|
color: #e8775a; |
|
} |
|
.cu-avatar{ |
|
background-color: transparent !important; |
|
} |
|
.tag-red{ |
|
background-color: red; |
|
} |
|
.levelBox{ |
|
font-size: 24rpx; |
|
color: red; |
|
font-weight:bold; |
|
margin-left: 16rpx; |
|
} |
|
</style>
|
|
|