syt
1 year ago
parent
d93c0ae2bc
commit
0ac6795c35
@ -1,418 +0,0 @@ |
|||||||
<template> |
|
||||||
<view class="intimate"> |
|
||||||
<view class="intimate-navbar"> |
|
||||||
<u-navbar title="贴心服务" :border-bottom="false" :background="background"></u-navbar> |
|
||||||
</view> |
|
||||||
<view class="intimate-hd"> |
|
||||||
<image src="@/static/home/phone.jpg"></image> |
|
||||||
<view class="a">大白兔维修<u-icon style="margin-left: 10rpx;" name="arrow-right"></u-icon></view> |
|
||||||
<view class="b">上门服务 细心周到</view> |
|
||||||
</view> |
|
||||||
<scroll-view scroll-x class="intimate-menu"> |
|
||||||
<view class="item" @click="tabItem1(i)" v-for="i in 10" :key="i" :class="tabIndex1==i?'item-on':''"> |
|
||||||
<image src="@/static/home/phone.jpg"></image> |
|
||||||
<view class="p">手机</view> |
|
||||||
</view> |
|
||||||
</scroll-view> |
|
||||||
<view class="intimate-bd"> |
|
||||||
<scroll-view scroll-y class="a"> |
|
||||||
<view class="item" @click="tabItem(0)" :class="tabIndex==0?'item-on':''">全部商品</view> |
|
||||||
<view class="item" @click="tabItem(1)" :class="tabIndex==1?'item-on':''">TCL</view> |
|
||||||
<view class="item" @click="tabItem(2)" :class="tabIndex==2?'item-on':''">创维</view> |
|
||||||
<view class="item" @click="tabItem(3)" :class="tabIndex==3?'item-on':''">海尔</view> |
|
||||||
<view class="item" @click="tabItem(4)" :class="tabIndex==4?'item-on':''">长虹</view> |
|
||||||
<view class="item" @click="tabItem(5)" :class="tabIndex==5?'item-on':''">小米</view> |
|
||||||
<view class="item" @click="tabItem(6)" :class="tabIndex==6?'item-on':''">东芝</view> |
|
||||||
<view class="item" @click="tabItem(7)" :class="tabIndex==7?'item-on':''">华为</view> |
|
||||||
<view class="item" @click="tabItem(8)" :class="tabIndex==8?'item-on':''">雷鸟</view> |
|
||||||
</scroll-view> |
|
||||||
<view class="b"> |
|
||||||
<view class="t"> |
|
||||||
<view class="item" @click="tabFilter(0)" :class="filterIndex==0?'item-on':''">价格</view> |
|
||||||
<view class="item" @click="tabFilter(1)" :class="filterIndex==1?'item-on':''">折扣</view> |
|
||||||
<view class="item" @click="tabFilter(2)" :class="filterIndex==2?'item-on':''">销量</view> |
|
||||||
<view class="item" @click="tabFilter(3)" :class="filterIndex==3?'item-on':''">综合</view> |
|
||||||
</view> |
|
||||||
<scroll-view scroll-y class="l"> |
|
||||||
<view class="item" v-for="i in 10" :key="i" @click="tabFilter(0)"> |
|
||||||
<image src="@/static/home/phone.jpg"></image> |
|
||||||
<view class="title"> |
|
||||||
<text>自营</text>iphone13 绿色 128GB |
|
||||||
</view> |
|
||||||
<view class="price"> |
|
||||||
<view class="n">￥<text>7595</text>到手价</view> |
|
||||||
<view class="o">￥7595</view> |
|
||||||
</view> |
|
||||||
<view class="desc"> |
|
||||||
200+条评论 99%好评率 |
|
||||||
</view> |
|
||||||
</view> |
|
||||||
</scroll-view> |
|
||||||
</view> |
|
||||||
</view> |
|
||||||
</view> |
|
||||||
</template> |
|
||||||
|
|
||||||
<script> |
|
||||||
import img from "@/static/news/refund-bg1.png" |
|
||||||
export default { |
|
||||||
data() { |
|
||||||
return { |
|
||||||
background: { |
|
||||||
background: 'transparent', |
|
||||||
backgroundSize: '100%', |
|
||||||
}, |
|
||||||
isShow: true, |
|
||||||
tabIndex1: 1, |
|
||||||
tabIndex: 0, |
|
||||||
filterIndex: 0, |
|
||||||
keyword: "", |
|
||||||
list: [{ |
|
||||||
image: 'https://cdn.uviewui.com/uview/swiper/1.jpg', |
|
||||||
title: '昨夜星辰昨夜风，画楼西畔桂堂东' |
|
||||||
}, |
|
||||||
{ |
|
||||||
image: 'https://cdn.uviewui.com/uview/swiper/2.jpg', |
|
||||||
title: '身无彩凤双飞翼，心有灵犀一点通' |
|
||||||
}, |
|
||||||
{ |
|
||||||
image: 'https://cdn.uviewui.com/uview/swiper/3.jpg', |
|
||||||
title: '谁念西风独自凉，萧萧黄叶闭疏窗，沉思往事立残阳' |
|
||||||
} |
|
||||||
], |
|
||||||
} |
|
||||||
}, |
|
||||||
methods: { |
|
||||||
tabItem(index){ |
|
||||||
this.tabIndex = index; |
|
||||||
}, |
|
||||||
tabItem1(index){ |
|
||||||
this.tabIndex1 = index; |
|
||||||
}, |
|
||||||
tabFilter(index){ |
|
||||||
this.filterIndex = index; |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
</script> |
|
||||||
|
|
||||||
<style lang="scss" scoped> |
|
||||||
.intimate{ |
|
||||||
background: url(@/static/news/refund-bg1.png) center top no-repeat; |
|
||||||
background-size: 100% auto; |
|
||||||
&-hd{ |
|
||||||
width: 686rpx; |
|
||||||
height: 170rpx; |
|
||||||
background: rgba(255,255,255,0.86); |
|
||||||
border-radius: 12rpx; |
|
||||||
margin: 0 auto; |
|
||||||
padding-top: 40rpx; |
|
||||||
box-sizing: border-box; |
|
||||||
margin-top: 30rpx; |
|
||||||
position: relative; |
|
||||||
image{ |
|
||||||
position: absolute; |
|
||||||
width: 162rpx; |
|
||||||
height: 162rpx; |
|
||||||
border-radius: 162rpx; |
|
||||||
left: 18rpx; |
|
||||||
top: -20rpx; |
|
||||||
} |
|
||||||
.a{ |
|
||||||
font-size: 32rpx; |
|
||||||
color: #212121; |
|
||||||
margin-left: 220rpx; |
|
||||||
} |
|
||||||
.b{ |
|
||||||
margin-left: 220rpx; |
|
||||||
font-size: 28rpx; |
|
||||||
color: #646464; |
|
||||||
margin-top: 10rpx; |
|
||||||
} |
|
||||||
} |
|
||||||
&-menu{ |
|
||||||
height: 180rpx; |
|
||||||
white-space: nowrap; |
|
||||||
margin-top: 30rpx; |
|
||||||
padding: 0 20rpx; |
|
||||||
.item{ |
|
||||||
width: 150rpx; |
|
||||||
height: 180rpx; |
|
||||||
background: #FFFFFF; |
|
||||||
display: inline-block; |
|
||||||
padding: 16rpx; |
|
||||||
box-sizing: border-box; |
|
||||||
border: 1px solid #FFFFFF; |
|
||||||
text-align: center; |
|
||||||
margin-left: 12rpx; |
|
||||||
border-radius: 8rpx; |
|
||||||
image{ |
|
||||||
width: 112rpx; |
|
||||||
height: 112rpx; |
|
||||||
} |
|
||||||
.p{ |
|
||||||
white-space: nowrap; |
|
||||||
overflow: hidden; |
|
||||||
font-size: 28rpx; |
|
||||||
font-weight: 400; |
|
||||||
color: #3F3F3F; |
|
||||||
} |
|
||||||
&-on{ |
|
||||||
border: 1px solid #F21A1C; |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
&-bd{ |
|
||||||
padding: 30rpx 0 0; |
|
||||||
display: flex; |
|
||||||
height: calc(100vh - 700rpx); |
|
||||||
box-sizing: border-box; |
|
||||||
overflow: hidden; |
|
||||||
.a{ |
|
||||||
width: 150rpx; |
|
||||||
height: 100%; |
|
||||||
.item{ |
|
||||||
padding: 20rpx 35rpx; |
|
||||||
border-left: 3px solid #FFFFFF; |
|
||||||
line-height: 50rpx; |
|
||||||
text-align: center; |
|
||||||
font-size: 28rpx; |
|
||||||
font-weight: 400; |
|
||||||
color: #3F3F3F; |
|
||||||
box-sizing: border-box; |
|
||||||
&-on{ |
|
||||||
background-color: #FFFFFF; |
|
||||||
border-left-color: #F34A40; |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
.b{ |
|
||||||
width: 600rpx; |
|
||||||
height: 100%; |
|
||||||
background-color: #FFFFFF; |
|
||||||
.t{ |
|
||||||
display: flex; |
|
||||||
align-items: center; |
|
||||||
font-size: 28rpx; |
|
||||||
font-weight: 400; |
|
||||||
color: #3F3F3F; |
|
||||||
line-height: 100rpx; |
|
||||||
.item{ |
|
||||||
flex: 1; |
|
||||||
text-align: center; |
|
||||||
&-on{ |
|
||||||
color: #F34A40; |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
.l{ |
|
||||||
height: calc(100% - 120rpx); |
|
||||||
box-sizing: border-box; |
|
||||||
overflow: hidden; |
|
||||||
.item{ |
|
||||||
width: 270rpx; |
|
||||||
height: 389rpx; |
|
||||||
background: #FFFFFF; |
|
||||||
border-radius: 7rpx; |
|
||||||
opacity: 1; |
|
||||||
border: 1px solid #ECECEC; |
|
||||||
padding: 10rpx 15rpx; |
|
||||||
box-sizing: border-box; |
|
||||||
float: left; |
|
||||||
margin-left: 20rpx; |
|
||||||
margin-bottom: 20rpx; |
|
||||||
image{ |
|
||||||
width: 230rpx; |
|
||||||
height: 230rpx; |
|
||||||
display: block; |
|
||||||
margin: 0 auto; |
|
||||||
} |
|
||||||
.title{ |
|
||||||
padding: 10rpx 0; |
|
||||||
line-height: 40rpx; |
|
||||||
font-size: 20rpx; |
|
||||||
font-family: PingFang SC, PingFang SC; |
|
||||||
font-weight: 400; |
|
||||||
color: #1E1E1E; |
|
||||||
text-overflow: ellipsis; |
|
||||||
white-space: nowrap; |
|
||||||
overflow: hidden; |
|
||||||
text{ |
|
||||||
background-color: #F34A40; |
|
||||||
font-size: 20rpx; |
|
||||||
padding: 0 10rpx; |
|
||||||
height: 40rpx; |
|
||||||
line-height: 40rpx; |
|
||||||
text-align: center; |
|
||||||
border-radius: 4rpx; |
|
||||||
font-weight: 400; |
|
||||||
color: #FFFFFF; |
|
||||||
margin-right: 5rpx; |
|
||||||
display: inline-block; |
|
||||||
} |
|
||||||
} |
|
||||||
.price{ |
|
||||||
display: flex; |
|
||||||
align-items: center; |
|
||||||
white-space: nowrap; |
|
||||||
.n{ |
|
||||||
display: flex; |
|
||||||
align-items: baseline; |
|
||||||
font-size: 11px; |
|
||||||
font-weight: 500; |
|
||||||
color: #F21A1C; |
|
||||||
text{ |
|
||||||
font-size: 29rpx; |
|
||||||
} |
|
||||||
} |
|
||||||
.o{ |
|
||||||
font-size: 12px; |
|
||||||
color: #949494; |
|
||||||
text-decoration: line-through; |
|
||||||
} |
|
||||||
} |
|
||||||
.desc{ |
|
||||||
font-size: 10px; |
|
||||||
font-weight: 400; |
|
||||||
color: #949494; |
|
||||||
white-space: nowrap; |
|
||||||
margin-top: 10rpx; |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
&-share{ |
|
||||||
width: 548rpx; |
|
||||||
height: 810rpx; |
|
||||||
overflow: hidden; |
|
||||||
.l{ |
|
||||||
width: 548rpx; |
|
||||||
background: #FFFFFF; |
|
||||||
margin: 0 auto; |
|
||||||
overflow: hidden; |
|
||||||
position: relative; |
|
||||||
.a{ |
|
||||||
width: 490rpx; |
|
||||||
height: 243rpx; |
|
||||||
margin: 0 auto; |
|
||||||
padding-top: 24rpx; |
|
||||||
image{ |
|
||||||
width: 100%; |
|
||||||
height: 100%; |
|
||||||
} |
|
||||||
} |
|
||||||
.b{ |
|
||||||
padding: 20rpx 20rpx; |
|
||||||
overflow: hidden; |
|
||||||
.item{ |
|
||||||
width: 220rpx; |
|
||||||
height: 369rpx; |
|
||||||
background: #FFFFFF; |
|
||||||
border-radius: 7rpx; |
|
||||||
opacity: 1; |
|
||||||
border: 1px solid #ECECEC; |
|
||||||
padding: 10rpx 0; |
|
||||||
box-sizing: border-box; |
|
||||||
float: left; |
|
||||||
margin-left: 20rpx; |
|
||||||
margin-bottom: 10rpx; |
|
||||||
image{ |
|
||||||
width: 180rpx; |
|
||||||
height: 180rpx; |
|
||||||
display: block; |
|
||||||
margin: 0 auto; |
|
||||||
} |
|
||||||
.title{ |
|
||||||
padding: 10rpx 0; |
|
||||||
line-height: 40rpx; |
|
||||||
font-size: 20rpx; |
|
||||||
font-family: PingFang SC, PingFang SC; |
|
||||||
font-weight: 400; |
|
||||||
color: #1E1E1E; |
|
||||||
text-overflow: ellipsis; |
|
||||||
white-space: nowrap; |
|
||||||
overflow: hidden; |
|
||||||
text{ |
|
||||||
background-color: #F34A40; |
|
||||||
font-size: 20rpx; |
|
||||||
padding: 0 10rpx; |
|
||||||
height: 40rpx; |
|
||||||
line-height: 40rpx; |
|
||||||
text-align: center; |
|
||||||
border-radius: 4rpx; |
|
||||||
font-weight: 400; |
|
||||||
color: #FFFFFF; |
|
||||||
margin-right: 5rpx; |
|
||||||
display: inline-block; |
|
||||||
} |
|
||||||
} |
|
||||||
.price{ |
|
||||||
display: flex; |
|
||||||
align-items: center; |
|
||||||
white-space: nowrap; |
|
||||||
padding: 0 5rpx; |
|
||||||
.n{ |
|
||||||
display: flex; |
|
||||||
align-items: baseline; |
|
||||||
font-size: 11px; |
|
||||||
font-weight: 500; |
|
||||||
color: #F21A1C; |
|
||||||
text{ |
|
||||||
font-size: 29rpx; |
|
||||||
} |
|
||||||
} |
|
||||||
.o{ |
|
||||||
font-size: 12px; |
|
||||||
color: #949494; |
|
||||||
text-decoration: line-through; |
|
||||||
} |
|
||||||
} |
|
||||||
.desc{ |
|
||||||
padding: 0 5rpx; |
|
||||||
font-size: 10px; |
|
||||||
font-weight: 400; |
|
||||||
color: #949494; |
|
||||||
white-space: nowrap; |
|
||||||
margin-top: 10rpx;overflow: hidden; |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
} |
|
||||||
.c{ |
|
||||||
background-color: #F1F1F1; |
|
||||||
height: 150rpx; |
|
||||||
display: flex; |
|
||||||
justify-content: flex-end; |
|
||||||
align-items: center; |
|
||||||
image{ |
|
||||||
width: 140rpx; |
|
||||||
height: 122rpx; |
|
||||||
margin-right: 30rpx; |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
.btn{ |
|
||||||
width: 640rpx; |
|
||||||
line-height: 80rpx; |
|
||||||
text-align: center; |
|
||||||
background: #F34A40; |
|
||||||
position: fixed; |
|
||||||
left: 50%; |
|
||||||
margin-left: -320rpx; |
|
||||||
top: 50%; |
|
||||||
z-index: 2; |
|
||||||
border-radius: 8rpx; |
|
||||||
font-size: 28rpx; |
|
||||||
font-weight: 600; |
|
||||||
color: #FFFFFF; |
|
||||||
margin-top: 450rpx; |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
</style> |
|
||||||
<style> |
|
||||||
.goods .uni-scroll-view .uni-scroll-view{ |
|
||||||
overflow: auto!important; |
|
||||||
} |
|
||||||
</style> |
|
||||||
@ -0,0 +1,190 @@ |
|||||||
|
<template> |
||||||
|
<view class="presale"> |
||||||
|
<view class="presale-hd"> |
||||||
|
<view class="rule" @click="openPage()"></view> |
||||||
|
</view> |
||||||
|
<view class="presale-bd"> |
||||||
|
<view class="tab"> |
||||||
|
<u-tabs :list="list" :is-scroll="true" :show-bar="false" active-color="#FFFFFF" bg-color="rgba(255,255,255,0)" inactive-color="rgba(255,255,255,0.62)" v-model="current"></u-tabs> |
||||||
|
</view> |
||||||
|
<view class="title"> |
||||||
|
<image src="@/static/news/newPresale-1.png"></image> |
||||||
|
正在进行中 |
||||||
|
<image src="@/static/news/newPresale-1.png"></image> |
||||||
|
</view> |
||||||
|
<view class="list"> |
||||||
|
<view class="item" v-for="i in 10" :key="i"> |
||||||
|
<image class="pic" src="@/static/home/phone.jpg"></image> |
||||||
|
<view class="info"> |
||||||
|
<view class="t">一加Ace 2pro超值砍价手机全网通双卡双待</view> |
||||||
|
<view class="d"><u-count-down :timestamp="timestamp" format="HH:mm:ss"></u-count-down><text>后失效</text></view> |
||||||
|
<view class="p"> |
||||||
|
<image src="@/static/news/newPresale-2.png"></image> |
||||||
|
<view class="s">预约价¥4189</view> |
||||||
|
<view class="n">去预约</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
import img from "@/static/news/newPeople-bg.png" |
||||||
|
export default { |
||||||
|
data() { |
||||||
|
return { |
||||||
|
timestamp: 24*3600*1000, |
||||||
|
current: 0, |
||||||
|
list: [{ |
||||||
|
name: '精选好物' |
||||||
|
}, { |
||||||
|
name: '吹风机' |
||||||
|
}, { |
||||||
|
name: '空调' |
||||||
|
}, { |
||||||
|
name: '手机' |
||||||
|
}, { |
||||||
|
name: '洗衣机' |
||||||
|
}, { |
||||||
|
name: '冰箱' |
||||||
|
}, { |
||||||
|
name: '彩电' |
||||||
|
}], |
||||||
|
} |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
openPage() { |
||||||
|
uni.navigateTo({ |
||||||
|
url: "/pages/activity/presaleRule" |
||||||
|
}) |
||||||
|
}, |
||||||
|
} |
||||||
|
} |
||||||
|
</script> |
||||||
|
|
||||||
|
<style lang="scss" scoped> |
||||||
|
.presale{ |
||||||
|
background: #ff7b79 url(@/static/news/newPresale-bg.jpg) center top no-repeat; |
||||||
|
background-size: 100% auto; |
||||||
|
overflow: hidden; |
||||||
|
min-height: 100vh; |
||||||
|
&-hd{ |
||||||
|
position: relative; |
||||||
|
height: 380rpx; |
||||||
|
.rule{ |
||||||
|
width: 100rpx; |
||||||
|
height: 60rpx; |
||||||
|
position: absolute; |
||||||
|
right: 0; |
||||||
|
top: 74rpx; |
||||||
|
z-index: 2; |
||||||
|
} |
||||||
|
} |
||||||
|
&-bd{ |
||||||
|
width: 678rpx; |
||||||
|
margin: 0 auto; |
||||||
|
padding-bottom: 30rpx; |
||||||
|
margin-top: 20rpx; |
||||||
|
.title{ |
||||||
|
width: 100%; |
||||||
|
border-radius: 12rpx 12rpx 0 0; |
||||||
|
height: 78rpx; |
||||||
|
font-size: 28rpx; |
||||||
|
font-weight: 500; |
||||||
|
color: #FFFFFF; |
||||||
|
border: 2px solid #fff; |
||||||
|
display: flex; |
||||||
|
align-items: center; |
||||||
|
justify-content: center; |
||||||
|
image{ |
||||||
|
width: 32rpx; |
||||||
|
height: 13rpx; |
||||||
|
margin: 0 20rpx; |
||||||
|
} |
||||||
|
} |
||||||
|
.list{ |
||||||
|
background-color: #fff; |
||||||
|
border-radius: 0 0 12rpx 12rpx; |
||||||
|
overflow: hidden; |
||||||
|
.item{ |
||||||
|
padding: 45rpx 45rpx; |
||||||
|
overflow: hidden; |
||||||
|
border-top: 1px solid #F1F1F1; |
||||||
|
&:first-child{ |
||||||
|
border-top-color: #fff; |
||||||
|
} |
||||||
|
display: flex; |
||||||
|
image{ |
||||||
|
width: 220rpx; |
||||||
|
height: 220rpx; |
||||||
|
margin-right: 10rpx; |
||||||
|
} |
||||||
|
.info{ |
||||||
|
flex: 1; |
||||||
|
max-width: 400rpx; |
||||||
|
.t{ |
||||||
|
height: 80rpx; |
||||||
|
line-height: 40rpx; |
||||||
|
font-size: 32rpx; |
||||||
|
font-weight: 500; |
||||||
|
color: #626262; |
||||||
|
word-break: break-all; |
||||||
|
text-overflow: ellipsis; |
||||||
|
overflow: hidden; |
||||||
|
display: -webkit-box; |
||||||
|
-webkit-box-orient: vertical; |
||||||
|
-webkit-line-clamp: 2; |
||||||
|
} |
||||||
|
.d{ |
||||||
|
display: flex; |
||||||
|
align-items: center; |
||||||
|
height: 60rpx; |
||||||
|
font-size: 32rpx; |
||||||
|
font-weight: 500; |
||||||
|
color: #F94021; |
||||||
|
text{ |
||||||
|
color: #9E9E9E; |
||||||
|
margin-left: 10rpx; |
||||||
|
} |
||||||
|
} |
||||||
|
.p{ |
||||||
|
width: 396rpx; |
||||||
|
height: 88rpx; |
||||||
|
position: relative; |
||||||
|
image{ |
||||||
|
width: 396rpx; |
||||||
|
height: 88rpx; |
||||||
|
} |
||||||
|
.s{ |
||||||
|
width: 240rpx; |
||||||
|
line-height: 88rpx; |
||||||
|
position: absolute; |
||||||
|
text-align: center; |
||||||
|
left: 0; |
||||||
|
top: 0; |
||||||
|
z-index: 2; |
||||||
|
font-size: 32rpx; |
||||||
|
font-weight: 500; |
||||||
|
color: #FF584D; |
||||||
|
} |
||||||
|
.n{ |
||||||
|
width: 150rpx; |
||||||
|
line-height: 88rpx; |
||||||
|
text-align: center; |
||||||
|
position: absolute; |
||||||
|
right: 0; |
||||||
|
top: 0; |
||||||
|
z-index: 2; |
||||||
|
font-size: 32rpx; |
||||||
|
font-weight: 500; |
||||||
|
color: #FFFFFF; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
</style> |
||||||
@ -0,0 +1,36 @@ |
|||||||
|
<template> |
||||||
|
<view class="presale"> |
||||||
|
<view class="title">预售规则：</view> |
||||||
|
<view class="p">1、选择心仪的商品，邀请好友一起砍价，每次砍价金额以页面显示为准，参与好友越多商品到手价越低。</view> |
||||||
|
<view class="p">2、砍价商品会设置可砍金额，在规定时间内砍到可砍金额后即可按对应金额优惠下单。选择下单购买后该笔砍价订单不再支持继续砍价。</view> |
||||||
|
<view class="p">3、发起砍价后，需要在指定时间内完成砍价 (以页面显示为准)，未完成最终砍价可按已砍金额进行下单购买，砍价进行中也可按已砍金额进行下单购买</view> |
||||||
|
<view class="p">4、砍价结束后，需要在指定时间内完成下单 (以页面显示为准)，未在指定时间内完成下单所造成的砍价优惠无法使用，平台不再额外补发。</view> |
||||||
|
<view class="p">5、每个新用户 (注册24小时内的用户) 可帮好友完成一次砍价，如出现用户ID不同，但存在下列情形的: 包括但不限于微信账户、收货人姓名、详细地址、联系方式、支付信息、IP地址、设备号等信息的任意一项或数项相同或重叠的，均将被认定为同一用户。 同一设备仅支持一个账号登录进行该活动。</view> |
||||||
|
<view class="p"> |
||||||
|
6、如小当严选发现用户存在弄虚作假、作弊、套现、洗钱、赌博等违规行为 (包括并不仅限于恶意刷单、非正常手段砍成，使用非法工具分享、下载、安装、注册、登录多个账号及其他不正当手段) 侵害小当严选利益的，小当严选有权对用户进行异常标记，小当严选将取消用户的活动资格并有权不发放奖励、撤销剩余奖励、收回用户可领取的奖励，追讨已发放的奖励，并保留追究该用户责任的权利。 |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
</script> |
||||||
|
|
||||||
|
<style lang="scss" scoped> |
||||||
|
.presale{ |
||||||
|
height: 100vh; |
||||||
|
background-color: #fff; |
||||||
|
padding: 0 40rpx; |
||||||
|
overflow-y: auto; |
||||||
|
.title{ |
||||||
|
padding: 40rpx 0; |
||||||
|
font-size: 32rpx; |
||||||
|
font-weight: 500; |
||||||
|
color: #000000; |
||||||
|
} |
||||||
|
.p{ |
||||||
|
font-size: 26rpx; |
||||||
|
line-height: 46rpx; |
||||||
|
color: #212121; |
||||||
|
} |
||||||
|
} |
||||||
|
</style> |
||||||
@ -0,0 +1,194 @@ |
|||||||
|
<template> |
||||||
|
<view class="recycling"> |
||||||
|
<view class="recycling-navbar"> |
||||||
|
<u-navbar title="上门回收" :border-bottom="false" :background="isScroll?background:background1"></u-navbar> |
||||||
|
</view> |
||||||
|
<view class="recycling-hd"></view> |
||||||
|
<view class="recycling-notice"> |
||||||
|
<image src="@/static/news/icon-volume.png"></image> |
||||||
|
<view class="notice"> |
||||||
|
<u-notice-bar mode="horizontal" :volume-icon="false" bg-color="#fff" color="#212121" :list="list"></u-notice-bar> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
<view class="recycling-bd"> |
||||||
|
<view class="tab"> |
||||||
|
<view class="item" :class="tabIndex==0?'item-on':''" @click="tabItem(0)"> |
||||||
|
<image v-if="tabIndex==0" src="@/static/news/icon-recycling-01-on.png"></image> |
||||||
|
<image v-else src="@/static/news/icon-recycling-01.png"></image> |
||||||
|
家电回收 |
||||||
|
</view> |
||||||
|
<view class="item" :class="tabIndex==1?'item-on':''" @click="tabItem(1)"> |
||||||
|
<image v-if="tabIndex==1" src="@/static/news/icon-recycling-02-on.png"></image> |
||||||
|
<image v-else src="@/static/news/icon-recycling-02.png"></image> |
||||||
|
手机回收 |
||||||
|
</view> |
||||||
|
<view class="item" :class="tabIndex==2?'item-on':''" @click="tabItem(2)"> |
||||||
|
<image v-if="tabIndex==2" src="@/static/news/icon-recycling-03-on.png"></image> |
||||||
|
<image v-else src="@/static/news/icon-recycling-03.png"></image> |
||||||
|
电脑回收 |
||||||
|
</view> |
||||||
|
<view class="item" :class="tabIndex==3?'item-on':''" @click="tabItem(3)"> |
||||||
|
<image v-if="tabIndex==3" src="@/static/news/icon-recycling-04-on.png"></image> |
||||||
|
<image v-else src="@/static/news/icon-recycling-04.png"></image> |
||||||
|
平板回收 |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
<view class="list"> |
||||||
|
<view class="item" v-for="i in 10" :key="i"> |
||||||
|
<image src="@/static/home/phone.jpg"></image> |
||||||
|
<view class="info"> |
||||||
|
<view class="title">苹果手机上门回收</view> |
||||||
|
<view class="desc">专业上门回收</view> |
||||||
|
<view class="price"> |
||||||
|
<view class="btn"></view> |
||||||
|
<view class="num">已售400+ 好评87%</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
|
||||||
|
import img from "@/static/news/recycling-bg.png" |
||||||
|
export default { |
||||||
|
data() { |
||||||
|
return { |
||||||
|
isScroll: true, |
||||||
|
tabIndex: 0, |
||||||
|
background: { |
||||||
|
background: 'transparent', |
||||||
|
}, |
||||||
|
background1: { |
||||||
|
background: '#fff', |
||||||
|
}, |
||||||
|
list: ['寒雨连江夜入吴', |
||||||
|
'平明送客楚山孤', |
||||||
|
'洛阳亲友如相问', |
||||||
|
'一片冰心在玉壶'], |
||||||
|
} |
||||||
|
}, |
||||||
|
onPageScroll(e){ |
||||||
|
if(e.scrollTop <= 44){ |
||||||
|
this.isScroll = true; |
||||||
|
}else{ |
||||||
|
this.isScroll = false; |
||||||
|
} |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
tabItem(index){ |
||||||
|
this.tabIndex = index; |
||||||
|
}, |
||||||
|
tabItem1(index){ |
||||||
|
this.tabIndex1 = index; |
||||||
|
}, |
||||||
|
tabFilter(index){ |
||||||
|
this.filterIndex = index; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
</script> |
||||||
|
|
||||||
|
<style lang="scss" scoped> |
||||||
|
.recycling{ |
||||||
|
background: url(@/static/news/recycling-bg.png) center top no-repeat; |
||||||
|
background-size: 100% auto; |
||||||
|
&-hd{ |
||||||
|
height: 340rpx; |
||||||
|
} |
||||||
|
&-notice{ |
||||||
|
background-color: #fff; |
||||||
|
display: flex; |
||||||
|
align-items: center; |
||||||
|
padding: 0 30rpx; |
||||||
|
image{ |
||||||
|
width: 50rpx; |
||||||
|
height: 50rpx; |
||||||
|
display: block; |
||||||
|
} |
||||||
|
.notice{ |
||||||
|
width: 500rpx; |
||||||
|
flex: 1; |
||||||
|
} |
||||||
|
} |
||||||
|
&-bd{ |
||||||
|
padding: 30rpx 0 30rpx 36rpx; |
||||||
|
overflow: hidden; |
||||||
|
background-color: #fff; |
||||||
|
.tab{ |
||||||
|
width: 100%; |
||||||
|
.item{ |
||||||
|
width: 25%; |
||||||
|
float: left; |
||||||
|
text-align: center; |
||||||
|
font-size: 24rpx; |
||||||
|
font-weight: 500; |
||||||
|
color: #4F4F4F; |
||||||
|
position: relative; |
||||||
|
padding-bottom: 30rpx; |
||||||
|
image{ |
||||||
|
width: 60rpx; |
||||||
|
height: 60rpx; |
||||||
|
display: block; |
||||||
|
margin: 0 auto; |
||||||
|
margin-bottom: 12rpx; |
||||||
|
} |
||||||
|
&-on{ |
||||||
|
color: #FF4949; |
||||||
|
&::after{ |
||||||
|
content: ""; |
||||||
|
width: 50rpx; |
||||||
|
height: 6rpx; |
||||||
|
background: #FF4949; |
||||||
|
border-radius: 6rpx; |
||||||
|
position: absolute; |
||||||
|
left: 50%; |
||||||
|
bottom: 10rpx; |
||||||
|
z-index: 1; |
||||||
|
margin-left: -25rpx; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
.list{ |
||||||
|
width: 100%; |
||||||
|
overflow: hidden; |
||||||
|
.item{ |
||||||
|
padding: 28rpx 0; |
||||||
|
overflow: hidden; |
||||||
|
display: flex; |
||||||
|
border-top: 1px solid #F2F2F2; |
||||||
|
&:first-child{ |
||||||
|
border-top-color: #fff; |
||||||
|
} |
||||||
|
image{ |
||||||
|
width: 234rpx; |
||||||
|
height: 222rpx; |
||||||
|
border-radius: 12rpx; |
||||||
|
margin-right: 20rpx; |
||||||
|
} |
||||||
|
.info{ |
||||||
|
max-width: 500rpx; |
||||||
|
white-space: nowrap; |
||||||
|
.title{ |
||||||
|
overflow: hidden; |
||||||
|
font-size: 28rpx; |
||||||
|
text-overflow: ellipsis; |
||||||
|
font-weight: 600; |
||||||
|
color: #2C2C2C; |
||||||
|
} |
||||||
|
.desc{ |
||||||
|
overflow: hidden; |
||||||
|
font-size: 28rpx; |
||||||
|
text-overflow: ellipsis; |
||||||
|
margin-top: 10rpx; |
||||||
|
color: #888888; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
</style> |
||||||
|
After Width: | Height: | Size: 1.7 KiB |
|
After Width: | Height: | Size: 2.1 KiB |
|
After Width: | Height: | Size: 1.9 KiB |
|
After Width: | Height: | Size: 1.6 KiB |
|
After Width: | Height: | Size: 1.7 KiB |
|
After Width: | Height: | Size: 2.3 KiB |
|
After Width: | Height: | Size: 1.4 KiB |
|
After Width: | Height: | Size: 1.6 KiB |
|
After Width: | Height: | Size: 1.7 KiB |
|
After Width: | Height: | Size: 281 B |
|
After Width: | Height: | Size: 1.6 KiB |
|
After Width: | Height: | Size: 50 KiB |
|
After Width: | Height: | Size: 86 KiB |
Loading…
Reference in new issue