油站小程序
This commit is contained in:
parent
63339f8016
commit
f4e97540f3
@ -7,13 +7,12 @@
|
||||
<view class="my-icons"></view>
|
||||
</view>
|
||||
<view class="mub">
|
||||
<view class="mub-box" v-for="(item,index) in activityList" :key="index"
|
||||
@click="intoOtherPage(item.name)">
|
||||
<view class="mub-box" v-for="(item,index) in activityList" :key="index">
|
||||
|
||||
<view class="right-box">
|
||||
立即前往
|
||||
</view>
|
||||
<view class="box-img">
|
||||
<view class="box-img" @click="intoOtherPage(item.name)">
|
||||
<image src="../../static/imgs/xfyl.png" v-if="item.name == '消费有礼活动'"></image>
|
||||
<image src="../../static/imgs/zkyx.png" v-if="item.name == '折扣营销活动'"></image>
|
||||
<image src="../../static/imgs/mjyh.png" v-if="item.name == '满减营销活动'"></image>
|
||||
@ -23,7 +22,15 @@
|
||||
</view>
|
||||
<view class="box-size">
|
||||
<view class="box-s-title">{{item.name || "活动标题"}}</view>
|
||||
<view class="box-s-size">{{item.des || "内容"}}</view>
|
||||
<!-- <view class="box-s-size">{{item.des || "内容"}}</view> -->
|
||||
<view class="dis-box">
|
||||
<view class="dian"></view>
|
||||
<view class="h_size">适用用户:普通会员、银牌会员、V2</view>
|
||||
</view>
|
||||
<view class="dis-box">
|
||||
<view class="dian" style="background: #FA5E03;"></view>
|
||||
<view class="h_size">享受优惠:满送一百万 送一元</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="box-bottom">
|
||||
<view class="">活动时间</view>
|
||||
@ -170,19 +177,21 @@
|
||||
justify-content: space-between;
|
||||
border-top: 1px solid #f4f5f6;
|
||||
font-size: 14px;
|
||||
color: #666666;
|
||||
}
|
||||
|
||||
.box-s-title {
|
||||
font-size: 17px;
|
||||
font-weight: bold;
|
||||
margin: 5px auto;
|
||||
}
|
||||
|
||||
.box-s-size {
|
||||
font-size: 14px;
|
||||
color: #666666;
|
||||
color: #777777;
|
||||
box-sizing: border-box;
|
||||
padding: 5px;
|
||||
background-color: #f4f5f6;
|
||||
// padding: 5px;
|
||||
// background-color: #f4f5f6;
|
||||
border-radius: 8px;
|
||||
margin: 5px auto;
|
||||
|
||||
@ -209,4 +218,24 @@
|
||||
position: fixed;
|
||||
top: 0px;
|
||||
}
|
||||
|
||||
.dian {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
background: #2F72F7;
|
||||
border-radius: 50%;
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
.dis-box {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
}
|
||||
|
||||
.h_size {
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: #777777;
|
||||
}
|
||||
</style>
|
@ -8,8 +8,8 @@
|
||||
</view>
|
||||
<!-- 顶部区域 -->
|
||||
<view class="centen-siez">
|
||||
<u-parse :content="setting.pointsRules"></u-parse>
|
||||
|
||||
<view v-html="setting.pointsRules"></view>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
@ -60,6 +60,7 @@
|
||||
.content {
|
||||
width: 100%;
|
||||
background: #f4f5f6;
|
||||
background: #ffffff;
|
||||
}
|
||||
|
||||
|
||||
|
@ -15,8 +15,25 @@
|
||||
<image src="../../static/imgs/yqyl.png" v-if="title == '推荐有礼活动'"></image>
|
||||
</view>
|
||||
<view class="center-box">
|
||||
<view class="title-box">活动明细</view>
|
||||
<view class="g-box" v-for="(item,index) in datas" :key="index" v-if="title == '消费有礼活动'">
|
||||
<view class="title-box">活动介绍</view>
|
||||
<view class="h_size">活动介绍活动介绍活动介绍</view>
|
||||
<view class="title-box">参与油品</view>
|
||||
<view class="w_box">
|
||||
<view class="w_oil" v-for="(item,index) in 3" :key="index">#95</view>
|
||||
</view>
|
||||
<view class="h_bottom">
|
||||
<view class="dis-box">
|
||||
<view class="dian"></view>
|
||||
<view class="h_size">参与会员:普通会员、银牌会员、V2</view>
|
||||
</view>
|
||||
<view class="dis-box">
|
||||
<view class="dian" style="background: #FA5E03;"></view>
|
||||
<view class="h_size">获得折扣:赠送10积分</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- <view class="g-box" v-for="(item,index) in datas" :key="index" v-if="title == '消费有礼活动'">
|
||||
<text>{{item.activeDescribe || ""}}</text>
|
||||
</view>
|
||||
<view class="g-box" v-for="(item,index) in datas" :key="index" v-if="title == '折扣营销活动'">
|
||||
@ -34,8 +51,7 @@
|
||||
<view class="g-box" v-if="title == '推荐有礼活动'">
|
||||
<text>{{datas.recommendActiveDescribeIn || ""}}</text>
|
||||
<text>{{datas.recommendActiveDescribeOut || ""}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view> -->
|
||||
|
||||
</view>
|
||||
</view>
|
||||
@ -143,7 +159,7 @@
|
||||
|
||||
<style scoped lang="scss">
|
||||
.content {
|
||||
background: #ffffff;
|
||||
background: #f4f5f6;
|
||||
height: 100vh;
|
||||
}
|
||||
|
||||
@ -158,7 +174,7 @@
|
||||
.container {
|
||||
width: 100%;
|
||||
|
||||
background: #ffffff;
|
||||
background: #f4f5f6;
|
||||
box-sizing: border-box;
|
||||
padding-top: 88px;
|
||||
padding-bottom: 20px;
|
||||
@ -187,7 +203,7 @@
|
||||
|
||||
.center-box {
|
||||
border-radius: 8px;
|
||||
background: #f4f5f6;
|
||||
background: #ffffff;
|
||||
margin: 10px auto;
|
||||
box-sizing: border-box;
|
||||
padding: 10px;
|
||||
@ -197,6 +213,7 @@
|
||||
.title-box {
|
||||
font-size: 18px;
|
||||
font-weight: bold;
|
||||
margin: 10px auto;
|
||||
|
||||
}
|
||||
|
||||
@ -207,4 +224,52 @@
|
||||
font-size: 14px;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.w_box {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.h_size {
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: #777777;
|
||||
}
|
||||
|
||||
.w_oil {
|
||||
border-radius: 4px 4px 4px 4px;
|
||||
box-sizing: border-box;
|
||||
padding: 5px 10px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin-right: 10px;
|
||||
border: 1px solid #2F72F7;
|
||||
color: #2F72F7;
|
||||
}
|
||||
|
||||
.h_bottom {
|
||||
width: 100%;
|
||||
background: #F4F4F4;
|
||||
border-radius: 4px;
|
||||
box-sizing: border-box;
|
||||
padding: 10px 5px;
|
||||
margin: 10px auto;
|
||||
}
|
||||
|
||||
.dian {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
background: #2F72F7;
|
||||
border-radius: 50%;
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
.dis-box {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
}
|
||||
</style>
|
@ -19,33 +19,35 @@
|
||||
<view class="box-top">
|
||||
<view class="dis">
|
||||
<view class="touxiang">
|
||||
<image src="../../static/imgs/topbj.png" mode=""></image>
|
||||
<image src="../../static/imgs/bzhd.png" mode=""></image>
|
||||
</view>
|
||||
<view class="box-top-size">
|
||||
<view class="box-title">{{item.store.name}}{{item.store.description ? "("+item.store.description+")" : ""}}</view>
|
||||
<view class="box-title">
|
||||
{{item.store.name}}{{item.store.description ? "("+item.store.description+")" : ""}}
|
||||
</view>
|
||||
<view class="box-hui"> {{item.store.address}} </view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="">
|
||||
<view class="top-right-icon" v-if="index == 0">
|
||||
<u-tag text="距离最近" size="mini" type="error"
|
||||
plain plainFill></u-tag>
|
||||
<u-tag text="距离最近" size="mini" type="error" plain plainFill></u-tag>
|
||||
</view>
|
||||
<view class="box-hui" style="width: 80px;">{{(Math.ceil(item.distance)).toFixed(1)}}km
|
||||
</view>
|
||||
<view class="box-hui" style="width: 80px;">{{(Math.ceil(item.distance)).toFixed(1)}}km</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
|
||||
<scroll-view scroll-x="true" class="fa-scroll">
|
||||
<view class="scrollbox" v-for="(item1,index1) in item.store.oilList" :key="index1" @click="toRefuel(item.store)">
|
||||
<view class="scrollbox" v-for="(item1,index1) in item.store.oilList" :key="index1"
|
||||
@click="toRefuel(item.store)">
|
||||
<view style="font-size: 16px;">{{item1.oilNames}}</view>
|
||||
<view style="font-size: 18px;">¥{{item1.gbPrice}}/{{item1.unit}}</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
<view class="wrap-box">
|
||||
<u-tag v-if="item.store.welfareList!=null"
|
||||
v-for="(item1,index1) in item.store.welfareList" :key="index1"
|
||||
:text="item1" type="warning" shape="circle"></u-tag>
|
||||
<u-tag v-if="item.store.welfareList!=null" v-for="(item1,index1) in item.store.welfareList"
|
||||
:key="index1" :text="item1" type="warning" shape="circle"></u-tag>
|
||||
</view>
|
||||
<view class="box-bottom">
|
||||
<view class="box-bottom-anniu">
|
||||
@ -103,7 +105,8 @@
|
||||
queryStore(val) {
|
||||
this.list = []
|
||||
this.storeList.forEach(item => {
|
||||
if (item.store.name.includes(val.detail.value) || item.store.description.includes(val.detail.value)){
|
||||
if (item.store.name.includes(val.detail.value) || item.store.description.includes(val.detail
|
||||
.value)) {
|
||||
this.list.push(item)
|
||||
}
|
||||
})
|
||||
@ -234,7 +237,7 @@
|
||||
.touxiang {
|
||||
width: 45px;
|
||||
height: 45px;
|
||||
border-radius: 50%;
|
||||
|
||||
overflow: hidden;
|
||||
|
||||
image {
|
||||
@ -244,6 +247,7 @@
|
||||
}
|
||||
|
||||
.box-top-size {
|
||||
width: 80%;
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user