@@ -3,32 +3,38 @@ | |||
page { | |||
background-color: #fff; | |||
} | |||
.container{ | |||
.container { | |||
padding-bottom: 60rpx; | |||
} | |||
.con text{ | |||
.con text { | |||
display: block; | |||
text-align: center; | |||
font-size: 30rpx; | |||
} | |||
.header{ | |||
.header { | |||
width: 690rpx; | |||
height: 80rpx; | |||
font-size: 32rpx; | |||
margin: 0 auto; | |||
border-radius:16rpx; | |||
border-radius: 16rpx; | |||
line-height: 80rpx; | |||
letter-spacing: 3rpx; | |||
} | |||
.header image{ | |||
.header image { | |||
width: 60rpx; | |||
vertical-align: middle; | |||
margin-top:-5rpx; | |||
margin-right:6rpx; | |||
margin-top: -5rpx; | |||
margin-right: 6rpx; | |||
} | |||
.top{ | |||
border-bottom:2rpx solid #f8f8f8; | |||
.top { | |||
border-bottom: 2rpx solid #f8f8f8; | |||
} | |||
.headBox { | |||
width: 690rpx; | |||
margin: 30rpx auto 0; | |||
@@ -74,8 +80,6 @@ page { | |||
font-size: 28rpx; | |||
} | |||
.price { | |||
width: 690rpx; | |||
font-size: 28rpx; | |||
@@ -106,14 +110,14 @@ page { | |||
.borderBox { | |||
width: 750rpx; | |||
margin-top:30rpx; | |||
margin-top: 30rpx; | |||
} | |||
.borderUp { | |||
width: 680rpx; | |||
margin: 0 auto; | |||
font-size: 36rpx; | |||
border: 2rpx dashed #FD832D; | |||
border: 2rpx dashed #fd832d; | |||
border-radius: 16rpx; | |||
padding-bottom: 40rpx; | |||
height: 202rpx; | |||
@@ -174,7 +178,8 @@ page { | |||
margin-bottom: 80rpx; | |||
border-top: 16rpx #f8f8f8 solid; | |||
} | |||
.bottonBox view:nth-of-type(1) image{ | |||
.bottonBox view:nth-of-type(1) image { | |||
height: 45rpx; | |||
} | |||
@@ -213,7 +218,7 @@ page { | |||
} | |||
.swiper-item .clearfix1 { | |||
background: linear-gradient(127deg,rgba(252,177,74,1) 0%,rgba(254,70,20,1) 100%); | |||
background: linear-gradient(127deg, rgba(252, 177, 74, 1) 0%, rgba(254, 70, 20, 1) 100%); | |||
border-radius: 12rpx; | |||
padding: 6rpx; | |||
} | |||
@@ -234,7 +239,7 @@ page { | |||
height: 180rpx; | |||
line-height: 180rpx; | |||
float: left; | |||
background: linear-gradient(127deg,rgba(252,177,74,1) 0%,rgba(254,70,20,1) 100%); | |||
background: linear-gradient(127deg, rgba(252, 177, 74, 1) 0%, rgba(254, 70, 20, 1) 100%); | |||
border-radius: 12rpx; | |||
border: 3px solid #fff; | |||
text-align: center; | |||
@@ -376,6 +381,7 @@ page { | |||
.textV3 { | |||
width: 225rpx; | |||
} | |||
.choice { | |||
width: 80rpx; | |||
height: 80rpx; | |||
@@ -402,7 +408,7 @@ page { | |||
} | |||
.buy { | |||
background: linear-gradient(127deg,rgba(252,177,74,1) 0%,rgba(254,70,20,1) 100%); | |||
background: linear-gradient(127deg, rgba(252, 177, 74, 1) 0%, rgba(254, 70, 20, 1) 100%); | |||
height: 88rpx; | |||
width: 73%; | |||
margin: 0 auto; | |||
@@ -413,6 +419,8 @@ page { | |||
position: absolute; | |||
z-index: 100; | |||
text-align: center; | |||
bottom: -570rpx; | |||
left: 100rpx; | |||
} | |||
.buyBox { | |||
@@ -605,7 +613,7 @@ button::after { | |||
.orderBox .fr { | |||
line-height: 70rpx; | |||
font-size: 28rpx; | |||
color: #FD832D; | |||
color: #fd832d; | |||
} | |||
.jians { | |||
@@ -620,7 +628,8 @@ button::after { | |||
border-radius: 6rpx; | |||
margin-right: 6rpx; | |||
} | |||
.jiant{ | |||
.jiant { | |||
display: inline-block; | |||
width: 44rpx; | |||
height: 44rpx; | |||
@@ -637,7 +646,7 @@ button::after { | |||
.txt1 { | |||
font-size: 22rpx; | |||
color: #A6A6A6; | |||
color: #a6a6a6; | |||
letter-spacing: 0; | |||
} | |||
@@ -658,8 +667,7 @@ button::after { | |||
width: 100%; | |||
height: 100%; | |||
z-index: 1000; | |||
background: rgba(0,0,0,.2); | |||
background: rgba(0, 0, 0, 0.2); | |||
} | |||
.ticket-modal { | |||
@@ -699,7 +707,7 @@ button::after { | |||
} | |||
.nocoupon button { | |||
background: linear-gradient(127deg,rgba(252,177,74,1) 0%,rgba(254,70,20,1) 100%); | |||
background: linear-gradient(127deg, rgba(252, 177, 74, 1) 0%, rgba(254, 70, 20, 1) 100%); | |||
color: #fff; | |||
font-size: 30rpx; | |||
width: 74%; | |||
@@ -736,8 +744,7 @@ button::after { | |||
background: #fff; | |||
/* padding: 30rpx 0 0; */ | |||
margin: 0 auto 40rpx; | |||
/* border-radius: 16rpx; */ | |||
/* border-top: 8rpx solid #02b7ff; */ | |||
/* border-radius: 16rpx; *//* border-top: 8rpx solid #02b7ff; */ | |||
box-shadow: 0 6px 20px 0 rgba(0, 0, 0, 0.10); | |||
} | |||
@@ -745,7 +752,7 @@ button::after { | |||
display: flex; | |||
padding-top: 16rpx; | |||
padding-bottom: 16rpx; | |||
background: linear-gradient(127deg,rgba(252,177,74,1) 0%,rgba(254,70,20,1) 100%); | |||
background: linear-gradient(127deg, rgba(252, 177, 74, 1) 0%, rgba(254, 70, 20, 1) 100%); | |||
} | |||
.logo { | |||
@@ -772,14 +779,14 @@ button::after { | |||
.info { | |||
width: 100%; | |||
border-left: 1rpx #FFF dashed; | |||
border-left: 1rpx #fff dashed; | |||
} | |||
.info view:nth-child(1) text { | |||
font-size: 32rpx; | |||
line-height: 32rpx; | |||
height: 32rpx; | |||
color: #FFFFFF; | |||
color: #fff; | |||
letter-spacing: 0; | |||
width: 400rpx; | |||
display: inline-block; | |||
@@ -791,7 +798,7 @@ button::after { | |||
.info view:nth-child(2) { | |||
padding-left: 4%; | |||
font-size: 22rpx; | |||
color: #FFFFFF; | |||
color: #fff; | |||
letter-spacing: 0; | |||
margin-top: 6rpx; | |||
display: inline-block; | |||
@@ -811,7 +818,6 @@ button::after { | |||
/* background: #02c0ff; */ | |||
} | |||
.expiretime { | |||
display: block; | |||
width: 100%; | |||
@@ -820,7 +826,7 @@ button::after { | |||
height: 50rpx; | |||
line-height: 50rpx; | |||
font-size: 22rpx; | |||
color: #A6A6A6; | |||
color: #a6a6a6; | |||
letter-spacing: 0; | |||
} | |||
@@ -847,38 +853,41 @@ button::after { | |||
height: 48rpx; | |||
line-height: 48rpx; | |||
text-align: right; | |||
color: #FFF; | |||
color: #fff; | |||
font-size: 40rpx; | |||
} | |||
.yuan { | |||
color: #FFF; | |||
color: #fff; | |||
font-size: 26rpx; | |||
} | |||
.gou { | |||
position: absolute; | |||
top:45rpx; | |||
top: 45rpx; | |||
right: 30rpx; | |||
width: 60rpx; | |||
} | |||
.swiper-box .wx-swiper-dots.wx-swiper-dots-horizontal{ | |||
margin-bottom: 2rpx; | |||
.swiper-box .wx-swiper-dots.wx-swiper-dots-horizontal { | |||
margin-bottom: 2rpx; | |||
} | |||
.swiper-box .wx-swiper-dot{ | |||
width:40rpx; | |||
display: inline-flex; | |||
height: 6rpx; | |||
margin-left: 10rpx; | |||
border-radius:6rpx; | |||
justify-content:space-between; | |||
.swiper-box .wx-swiper-dot { | |||
width: 40rpx; | |||
display: inline-flex; | |||
height: 6rpx; | |||
margin-left: 10rpx; | |||
border-radius: 6rpx; | |||
justify-content: space-between; | |||
} | |||
.swiper-box .wx-swiper-dot::before{ | |||
content: ''; | |||
flex-grow: 1; | |||
background: #ccc8c8; | |||
.swiper-box .wx-swiper-dot::before { | |||
content: ''; | |||
flex-grow: 1; | |||
background: #ccc8c8; | |||
} | |||
.swiper-box .wx-swiper-dot-active::before { | |||
background: #f6792b; | |||
} | |||
.swiper-box .wx-swiper-dot-active::before{ | |||
background:#f6792b; | |||
} |
@@ -1,76 +1,83 @@ | |||
<!-- <button class='goback' bindtap='goback'><image src='{{wmhome}}' mode="widthFix"></image></button> --> | |||
<navbar back home text="砍价详情" background="#fff"></navbar> | |||
<view class="bargainDetail" hover-class="none" hover-stop-propagation="false" wx:if="{{showPage}}" style="padding-top:{{navigationBarHeight}}"> | |||
<view class="listitem clearfix" hover-class="none" hover-stop-propagation="false"> | |||
<image class="fl" src="{{data.coverImg}}" lazy-load="true" binderror="" bindload="" mode='aspectFill'></image> | |||
<view class="fl ri" hover-class="none" hover-stop-propagation="false"> | |||
<text class="txt01">{{data.title}}</text> | |||
<text class="txt02">{{data.subTitle}}</text> | |||
<text class="txt03">{{data.price/100}}元</text> | |||
<text class="txt04">可砍至<text class="money">{{data.salePrice/100}}</text>元</text> | |||
</view> | |||
<view class="listitem clearfix" hover-class="none" hover-stop-propagation="false"> | |||
<image class="fl" src="{{data.coverImg}}" lazy-load="true" binderror="" bindload="" mode='aspectFill'></image> | |||
<view class="fl ri" hover-class="none" hover-stop-propagation="false"> | |||
<text class="txt01">{{data.title}}</text> | |||
<text class="txt02">{{data.subTitle}}</text> | |||
<text class="txt03">{{data.price/100}}元</text> | |||
<text class="txt04">可砍至<text class="money">{{data.salePrice/100}}</text>元</text> | |||
</view> | |||
<view class="progress" hover-class="none" hover-stop-propagation="false"> | |||
<view class="clearfix progesstext" wx:if="{{data.orderStatus !=8&&data.orderStatus!=1&&data.orderStatus!=9}}" hover-class="none" hover-stop-propagation="false"> | |||
<text class="fl">已砍 <text>{{already}}元</text></text> | |||
<text class="fr" wx:if="{{data.pressCurrentValue/100!=0}}">还剩 <text>{{remain}}元</text></text> | |||
</view> | |||
<progress percent="{{((data.price-data.salePrice-data.pressCurrentValue)/(data.price-data.salePrice))*100}}" wx:if="{{data.orderStatus !=8&&data.orderStatus!=1&&data.orderStatus!=9}}" color="#FD782D" class="progressbar"border-radius="10px" stroke-width="10" /> | |||
<view class="time" hover-class="none" wx:if="{{data.orderStatus !=8&&data.orderStatus!=1&&data.orderStatus!=9&&data.orderStatus != 7}}" hover-stop-propagation="false"> | |||
还剩 <text>{{day}}</text>天:<text>{{hour}}</text>:<text>{{min}}</text>:<text>{{sec}}</text> 结束 | |||
</view> | |||
<view class="fail" hover-class="none" hover-stop-propagation="false" wx:if="{{data.orderStatus==9}}"> | |||
砍价已取消 | |||
</view> | |||
<view class="fail" hover-class="none" hover-stop-propagation="false" wx:if="{{todayDate>data.pressEndDate && discountStatus !=1}}"> | |||
好友的砍价已过期 | |||
</view> | |||
<view class="fail" hover-class="none" hover-stop-propagation="false" wx:if="{{todayDate>data.pressEndDate && discountStatus ==1}}"> | |||
您的砍价已过期 | |||
</view> | |||
<view class="status" hover-class="none" hover-stop-propagation="false" wx:if="{{discountStatus==3}}"> | |||
<button bindtap="barginAgain" data-couponChannelId="{{data.couponChannelId}}" data-couponId="{{data.productId}}" data-id="{{data.id}}">发起砍价</button> | |||
<button bindtap="gotomore">更多砍价商品</button> | |||
</view> | |||
<view class='help' wx:if="{{data.orderStatus != 7&&data.orderStatus != 1&&data.orderStatus != 9}}">还需邀请<text>{{data.pressLimitNum-data.orderPressList.length}}</text>位好友,帮忙砍至底价</view> | |||
<view class="success" wx:if="{{data.orderStatus == 7||data.orderStatus == 1}}" hover-class="none" hover-stop-propagation="false"> | |||
<image src="{{chenggong}}" mode="widthFix"></image> | |||
<text class="" selectable="false" space="false" decode="false"> | |||
</view> | |||
<view class="progress" hover-class="none" hover-stop-propagation="false"> | |||
<view class="clearfix progesstext" wx:if="{{data.orderStatus !=8&&data.orderStatus!=1&&data.orderStatus!=9}}" hover-class="none" hover-stop-propagation="false"> | |||
<text class="fl">已砍 <text>{{already}}元</text></text> | |||
<text class="fr" wx:if="{{data.pressCurrentValue/100!=0}}">还剩 <text>{{remain}}元</text></text> | |||
</view> | |||
<progress percent="{{((data.price-data.salePrice-data.pressCurrentValue)/(data.price-data.salePrice))*100}}" wx:if="{{data.orderStatus !=8&&data.orderStatus!=1&&data.orderStatus!=9}}" color="#FD782D" class="progressbar" border-radius="10px" stroke-width="10" | |||
/> | |||
<view class="time" hover-class="none" wx:if="{{data.orderStatus !=8&&data.orderStatus!=1&&data.orderStatus!=9&&data.orderStatus != 7}}" hover-stop-propagation="false"> | |||
还剩 | |||
<text>{{day}}</text>天: | |||
<text>{{hour}}</text>: | |||
<text>{{min}}</text>: | |||
<text>{{sec}}</text> 结束 | |||
</view> | |||
<view class="fail" hover-class="none" hover-stop-propagation="false" wx:if="{{data.orderStatus==9}}"> | |||
砍价已取消 | |||
</view> | |||
<view class="fail" hover-class="none" hover-stop-propagation="false" wx:if="{{todayDate>data.pressEndDate && discountStatus !=1}}"> | |||
好友的砍价已过期 | |||
</view> | |||
<view class="fail" hover-class="none" hover-stop-propagation="false" wx:if="{{todayDate>data.pressEndDate && discountStatus ==1}}"> | |||
您的砍价已过期 | |||
</view> | |||
<view class="status" hover-class="none" hover-stop-propagation="false" wx:if="{{discountStatus==3}}"> | |||
<button bindtap="barginAgain" data-couponChannelId="{{data.couponChannelId}}" data-couponId="{{data.productId}}" data-id="{{data.id}}">发起砍价</button> | |||
<button bindtap="gotomore">更多砍价商品</button> | |||
</view> | |||
<view class='help' wx:if="{{data.orderStatus != 7&&data.orderStatus != 1&&data.orderStatus != 9}}">还需邀请 | |||
<text>{{data.pressLimitNum-data.orderPressList.length}}</text>位好友,帮忙砍至底价</view> | |||
<view class="success" wx:if="{{data.orderStatus == 7||data.orderStatus == 1}}" hover-class="none" hover-stop-propagation="false"> | |||
<image src="{{chenggong}}" mode="widthFix"></image> | |||
<text class="" selectable="false" space="false" decode="false"> | |||
已砍至底价 | |||
</text> | |||
</view> | |||
<view class='helpDiscount' wx:if="{{data.orderStatus == 6&&discountStatus == 2}}"> | |||
<image bindtap='helpDiscount' src='{{wmhelp}}' mode='widthFix'></image> | |||
</view> | |||
<view class='helpDiscount' wx:if="{{data.orderStatus == 6&&discountStatus == 2}}"> | |||
<image bindtap='helpDiscount' src='{{wmhelp}}' mode='widthFix'></image> | |||
</view> | |||
</view> | |||
<view class="people" hover-class="none" hover-stop-propagation="false" wx:if="{{data.orderStatus!=9}}"> | |||
<view class='title'> | |||
砍价人数{{data.orderPressList.length}}/{{data.pressLimitNum}}人 | |||
</view> | |||
<view class="clearfix person" wx:for="{{data.orderPressList}}" wx:key="index"> | |||
<view class="head fl"> | |||
<image class="headicon" src="{{item.avatarUrl}}" mode="widthFix" lazy-load="true" binderror="" bindload="" /> | |||
<text wx:if="{{item.first==1}}">发起人</text> | |||
</view> | |||
<view class="text fl clearfix"> | |||
<text class="text01 fl"><text>{{item.nickName}}</text></text> | |||
<text class="text02 fl"><text class="fl">砍掉</text><text class="fl">{{item.pressValue/100}}元</text></text> | |||
<text class="text03 fr">{{item.createDate}}前</text> | |||
</view> | |||
</view> | |||
<view class="people" hover-class="none" hover-stop-propagation="false" wx:if="{{data.orderStatus!=9}}"> | |||
<view class='title'> | |||
砍价人数{{data.orderPressList.length}}/{{data.pressLimitNum}}人 | |||
</view> | |||
<view class="clearfix person" wx:for="{{data.orderPressList}}" wx:key="index"> | |||
<view class="head fl"> | |||
<image class="headicon" src="{{item.avatarUrl}}" mode="widthFix" lazy-load="true" binderror="" bindload="" /> | |||
<text wx:if="{{item.first==1}}">发起人</text> | |||
</view> | |||
<view class="text fl clearfix"> | |||
<text class="text01 fl"><text>{{item.nickName}}</text></text> | |||
<text class="text02 fl"><text class="fl">砍掉</text> | |||
<text class="fl">{{item.pressValue/100}}元</text></text> | |||
<text class="text03 fr">{{item.createDate}}前</text> | |||
</view> | |||
</view> | |||
</view> | |||
<form bindsubmit="submit" report-submit='true' > | |||
<view class="btns clearfix" wx:if="{{data.orderStatus != 7&&discountStatus==1&&todayDate<=data.pressEndDate&&data.orderStatus!=1&&data.orderStatus != 9}}" hover-class="none" hover-stop-propagation="false"> | |||
<!-- <button class="fl" form-type="submit" bindtap='orderFunc1' data-couponChannelId="{{data.couponChannelId}}" data-price="{{data.price/100}}" data-couponId="{{data.productId}}" disabled='{{showButton}}' data-rushtobuy='rushtobuy'> | |||
<form bindsubmit="submit" report-submit='true'> | |||
<view class="btns clearfix" wx:if="{{data.orderStatus != 7&&discountStatus==1&&todayDate<=data.pressEndDate&&data.orderStatus!=1&&data.orderStatus != 9}}" hover-class="none" hover-stop-propagation="false"> | |||
<!-- <button class="fl" form-type="submit" bindtap='orderFunc1' data-couponChannelId="{{data.couponChannelId}}" data-price="{{data.price/100}}" data-couponId="{{data.productId}}" disabled='{{showButton}}' data-rushtobuy='rushtobuy'> | |||
<text>{{data.price/100}}元</text> | |||
<text>立即购买</text> | |||
</button> --> | |||
<button class='share user-motto' data-orderId='{{data.id}}' id="shareBtn" open-type="share" hover-class="other-button-hover">邀请好友砍价</button> | |||
</view> | |||
</form> | |||
<view style='display:{{display}}' wx:if="{{data.orderStatus == 7&&discountStatus == 1}}" class="btns01 clearfix" hover-class="none" hover-stop-propagation="false"> | |||
<button bindtap='orderFunc' disabled='{{showButton1}}' data-orderId="{{data.id}}" data-salePrice="{{data.salePrice/100}}" hover-class="other-button-hover">{{data.salePrice/100}}元 底价购买</button> | |||
<button class='share user-motto' data-orderId='{{data.id}}' id="shareBtn" open-type="share" hover-class="other-button-hover">邀请好友砍价</button> | |||
</view> | |||
</form> | |||
<view style='display:{{display}}' wx:if="{{data.orderStatus == 7&&discountStatus == 1}}" class="btns01 clearfix" hover-class="none" hover-stop-propagation="false"> | |||
<button bindtap='orderFunc' disabled='{{showButton1}}' data-orderId="{{data.id}}" data-salePrice="{{data.salePrice/100}}" hover-class="other-button-hover">{{data.salePrice/100}}元 底价购买</button> | |||
</view> | |||
</view> |
@@ -201,7 +201,7 @@ | |||
.nav { | |||
position: absolute; | |||
bottom: 20%; | |||
bottom: -70%; | |||
left: 0; | |||
right: 0; | |||
margin: auto; | |||