caoliancun
/
zhongPin
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

更新

Browse Source
pull/8/head
xiaozhiyong 2 years ago
parent 5c9a65fdcb
commit df9a5efa50
3 changed files with 147 additions and 67 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 27
      BagStation/pages/components/price-tab.vue
  2. 2
      BagStation/pages/stationDetail/stationDetail.vue
  3. 151
      components/site-item/site-item.vue

27
BagStation/pages/components/price-tab.vue
Unescape View File

@ -32,6 +32,11 @@
<view class="padding-top-sm"> <view class="padding-top-sm">
<text class="cu-tag line-yellow margin-right-xs" v-for="(itemy,index) in tagList" :key="index">{{itemy}}</text> <text class="cu-tag line-yellow margin-right-xs" v-for="(itemy,index) in tagList" :key="index">{{itemy}}</text>
</view> </view>
<view class="activity" v-if="siteInfo.activitySwitch">
<view class="content">
{{siteInfo.activityContent}}
</view>
</view>
</view> </view>
</view> </view>
</view> </view>
@ -43,6 +48,12 @@
channelList: { channelList: {
type: Array, type: Array,
default () {} default () {}
},
siteInfo:{
type: Object,
default: () => {
return {}
}
} }
}, },
data() { data() {
@ -128,7 +139,7 @@
} }
</script> </script>
<style scoped> <style scoped lang="scss">
.site-icon { .site-icon {
width: 2rem; width: 2rem;
vertical-align: middle; vertical-align: middle;
@ -137,4 +148,18 @@
.my-tag { .my-tag {
padding: 0 12rpx; padding: 0 12rpx;
} }
.activity {
margin-top: 15rpx;
display: flex;
width: 45%;
border:2rpx solid #1890FF50;
// border-radius: 10rpx;
.content {
flex: 1;
padding: 10rpx 20rpx;
line-height: 36rpx;
// min-height: 80rpx;
color: #1890FF;
}
}
</style> </style>

2
BagStation/pages/stationDetail/stationDetail.vue
Unescape View File

@ -61,7 +61,7 @@
</view> </view>
<!-- 价格 --> <!-- 价格 -->
<price-tab @onChangeChannelCode="getChannelCode" @onChangePayQr="onChangePayQr" @onChangePay="onChangePay" <price-tab @onChangeChannelCode="getChannelCode" @onChangePayQr="onChangePayQr" @onChangePay="onChangePay"
:channel-list="siteInfo.oilSiteChannelDetailsVos"></price-tab> :channel-list="siteInfo.oilSiteChannelDetailsVos" :siteInfo="siteInfo"></price-tab>
<!-- 客户评价 --> <!-- 客户评价 -->

151
components/site-item/site-item.vue
Unescape View File

@ -1,15 +1,23 @@
<template> <template>
<view class="cu-item cur padding no-mr-border site-item" :style="{height:siteItem.oilProductCodeAndPrices && siteItem.oilProductCodeAndPrices.length>3?'220rpx !important':listHeight?listHeight + 'rpx !important':''}"> <!-- :style="{height:siteItem.oilProductCodeAndPrices && siteItem.oilProductCodeAndPrices.length>3?'220rpx !important':listHeight?listHeight + 'rpx !important':''}" -->
<view class="cu-avatar radius lg " <view class="site-item">
<view class="radius"
:style="'background-image:url('+(siteItem.siteImages?siteItem.siteImages:defaultLogo)+');'"> :style="'background-image:url('+(siteItem.siteImages?siteItem.siteImages:defaultLogo)+');'">
</view> </view>
<view class="content"> <view class="content">
<view class="action">
<view class="text-grey text-sm " style="padding-top: 6rpx;">
<!-- <my-icon iconName="sy-der-icon.png" class="padding-right-xs text-sm"></my-icon> -->
{{siteItem.juli|distanceFilter}}
</view>
</view>
<view> <view>
<view class="text-cut text-black text-lg padding-right-sm ">{{siteItem.siteName}}</view> <view class="text-cut text-black text-lg padding-right-sm ">{{siteItem.siteName}}</view>
</view> </view>
<view class="listTages"> <view class="listTages">
<!-- <view v-if="siteItem.siteLevel" class=" cu-tag round bg-self--dark-yellow yu-tag text-xs">{{siteItem.siteLevel}}级</view> --> <!-- <view v-if="siteItem.siteLevel" class=" cu-tag round bg-self--dark-yellow yu-tag text-xs">{{siteItem.siteLevel}}级</view> -->
<view class="cu-tag round bg-self-yellow yu-tag text-xs" :class="siteItem.channelCode=='XOIL'?'tag-red':''">{{siteItem.listTag|channelCodeFamt}} <view class="cu-tag round bg-self-yellow yu-tag text-xs"
:class="siteItem.channelCode=='XOIL'?'tag-red':''">{{siteItem.listTag|channelCodeFamt}}
</view> </view>
<view class="cu-tag round bg-self--dark-yellow yu-tag text-xs" v-show="first">距离最近</view> <view class="cu-tag round bg-self--dark-yellow yu-tag text-xs" v-show="first">距离最近</view>
</view> </view>
@ -18,8 +26,9 @@
{{siteItem.address}} {{siteItem.address}}
</view> </view>
</view> </view>
<view class="text-gray flex" style="width: calc(100% + 30%);display: flex;flex-wrap: wrap;"> <view class="text-gray flex" style="display: flex;flex-wrap: wrap;">
<view v-if="listHeight" class="youpin" style="" v-for="(item,index) in siteItem.oilProductCodeAndPrices"> <view v-if="listHeight" class="youpin" style=""
v-for="(item,index) in siteItem.oilProductCodeAndPrices">
<view class="text-bold oil-main-color text-xl padding-right-xs"> <view class="text-bold oil-main-color text-xl padding-right-xs">
{{item.oilProductCode}} {{item.oilProductCode}}
</view> </view>
@ -41,21 +50,20 @@
<text class="text-delete color-333 text-sm padding-right-xs"> <text class="text-delete color-333 text-sm padding-right-xs">
￥{{siteItem.oilSitePrice|moneyFormat}}/L ￥{{siteItem.oilSitePrice|moneyFormat}}/L
</text> </text>
<!-- <my-icon iconName="￥.png" class="padding-right-xs icon-rectangle"></my-icon> <!-- <my-icon iconName="￥.png" class="padding-right-xs icon-rectangle"></my-icon>
<my-icon iconName="f.png" class="padding-right-xs "></my-icon> --> <my-icon iconName="f.png" class="padding-right-xs "></my-icon> -->
</view> </view>
</view> </view>
</view> <view class="activity" v-if="siteItem.activitySwitch">
<view class="title">活动</view>
<view class="action"> <view class="content">
<view class="text-grey text-sm " style="padding-top: 6rpx;"> {{siteItem.activityContent}}
<!-- <my-icon iconName="sy-der-icon.png" class="padding-right-xs text-sm"></my-icon> --> </view>
{{siteItem.juli|distanceFilter}}
</view> </view>
</view> </view>
</view> </view>
</template> </template>
@ -70,46 +78,46 @@
type: Boolean, type: Boolean,
default: false default: false
}, },
listHeight:{ listHeight: {
type:Number, type: Number,
default:0 default: 0
} }
}, },
data() { data() {
return { return {
starUrl: this.global.starUrl, starUrl: this.global.starUrl,
defaultLogo:'https://publicxingyou.oss-cn-hangzhou.aliyuncs.com/mp-oil/logo_default.png', defaultLogo: 'https://publicxingyou.oss-cn-hangzhou.aliyuncs.com/mp-oil/logo_default.png',
audioUrl:'' audioUrl: ''
} }
}, },
created() { created() {
console.log(this.siteItem,'-----------------') console.log(this.siteItem, '-----------------')
}, },
methods: { methods: {
}, },
filters: { filters: {
channelCodeFamt(value) { channelCodeFamt(value) {
console.log(value) console.log(value)
if (!value) { if (!value) {
return '未知' return '未知'
// 渠道编码 ( XOIL：星油 WJY：万金油 LV：老吕（找油网） TY：团油 YDJY：一点加油（壳牌）) // 渠道编码 ( XOIL：星油 WJY：万金油 LV：老吕（找油网） TY：团油 YDJY：一点加油（壳牌）)
// switch (value) { // switch (value) {
// case 'XOIL': // case 'XOIL':
// return '星油' // return '星油'
// case 'WJY': // case 'WJY':
// return '万金油' // return '万金油'
// case 'LV': // case 'LV':
// return '老吕（找油网）' // return '老吕（找油网）'
// case 'TY': // case 'TY':
// return '团油' // return '团油'
// case 'YDJY': // case 'YDJY':
// return '一点加油（壳牌）' // return '一点加油（壳牌）'
// } // }
} else { } else {
return value return value
} }
}, },
distanceFilter(value) { distanceFilter(value) {
if (value) { if (value) {
return value > 1000 ? ((value / 1000).toFixed(2) + 'km') : (value + 'm') return value > 1000 ? ((value / 1000).toFixed(2) + 'km') : (value + 'm')
@ -126,20 +134,42 @@
} }
</script> </script>
<style scoped> <style scoped lang="scss">
.site-item { .site-item {
margin-bottom: 1.8rem; position: relative;
display: flex;
align-items: flex-start !important; align-items: flex-start !important;
height: 150rpx!important; padding: 25rpx;
// margin-bottom: 1.8rem;
line-height:1.5rem;
.content {
flex:1;
overflow: hidden;
.action {
position: absolute;
right: 35rpx;
top: 24rpx;
}
}
>.radius {
margin-right: 30rpx;
width: 96rpx;
height: 96rpx;
font-size: 2em;
background-size: 100% 100%;
}
} }
.yellow-oil{ .yellow-oil {
color: #e8775a; color: #e8775a;
} }
.cu-avatar{
.cu-avatar {
background-color: transparent !important; background-color: transparent !important;
} }
.youpin{
.youpin {
border: 1px solid #e4e4e4; border: 1px solid #e4e4e4;
display: flex; display: flex;
border-radius: 5px; border-radius: 5px;
@ -147,7 +177,32 @@
margin-right: 5px; margin-right: 5px;
margin-bottom: 5px; margin-bottom: 5px;
} }
.text-xl{
.text-xl {
font-size: 30rpx; font-size: 30rpx;
} }
.activity {
display: flex;
width: 85%;
// padding: 10rpx 20rpx;
border:2rpx solid #1890FF ;
border-radius: 10rpx;
.title {
width: 20%;
padding: 10rpx 0;
line-height: 36rpx;
text-align: center;
color: #1890FF ;
background: #1890FF30;
}
.content {
flex: 1;
padding: 10rpx 20rpx;
line-height: 36rpx;
min-height: 80rpx;
color: #1890FF;
}
}
</style> </style>

Write Preview
Loading…
Cancel
Save