@@ -1,4 +1,3 @@ | |||
<navigator url="/pages/coupon/detail/index?couponChannelId={{data.id}}&couponId={{data.couponId}}"> | |||
<!-- 首页优惠券列表页面 --> | |||
<view class="coupons"> | |||
@@ -9,10 +8,9 @@ | |||
<view class="coupons-info-name tit">{{data.title}}</view> | |||
<view class="coupons-info-name subtitle">{{data.subTitle}}</view> | |||
<view class="coupons-info-price-p"> | |||
<text class="i">¥</text> | |||
{{data.salePriceStr}} | |||
<text>{{data.salePriceStr}}<text style="font-size:24rpx;display:inline-block;margin-right:10rpx;">元</text></text> | |||
<view class="coupons-info-manjian" style="margin-top:10rpx;" wx:if="{{data.type == 1}}"> | |||
满¥{{data.usePriceStr}}可用 | |||
满{{data.usePriceStr}}元可用 | |||
</view> | |||
<view class="coupons-info-manjian" wx:elif="{{data.type == 2||data.type == 3||data.type==4||data.type==5}}"> | |||
仅限本店使用 | |||
@@ -26,8 +24,7 @@ | |||
<i-button i-class="coupons-btn-gm" wx:if="{{data.salePriceStr!=0&&data.remainInventory!=0}}" data-date='{{data}}'>马上购</i-button> | |||
<i-button i-class="coupons-btn-gms" wx:if="{{data.remainInventory==0}}" data-date='{{data}}'>已售罄</i-button> | |||
</view> | |||
<view class="coupons-info-name sy">剩余{{data.remainInventory}}</view> | |||
<view class="coupons-info-name sy">剩余{{data.remainInventory}}</view> | |||
<view class="coupons-border"></view> | |||
</view> | |||
</navigator> |
@@ -17,6 +17,7 @@ | |||
bottom: 0; | |||
} | |||
.coupons-img { | |||
width: 180rpx; | |||
height: 180rpx; | |||
@@ -3,5 +3,7 @@ | |||
"i-tab": "../../../dist/tab/index", | |||
"i-tabs": "../../../dist/tabs/index" | |||
}, | |||
"navigationBarTitleText": "我的优惠劵" | |||
"navigationBarTitleText": "我的优惠劵", | |||
"navigationBarBackgroundColor": "#fff", | |||
"navigationBarTextStyle": "black" | |||
} |
@@ -3,7 +3,7 @@ | |||
<i-tabs class='tabs' current="{{ current_scroll }}" scroll bindchange="handleChangeScroll"> | |||
<i-tab class='i-tab' wx:for="{{tabs}}" wx:key="unique" key="{{item.key}}" title="{{item.name}}"></i-tab> | |||
</i-tabs> | |||
<view style='padding-top:90rpx;'> | |||
<view style='padding-top:120rpx;'> | |||
<view class="nocoupon" wx:if="{{list.length==0}}"> | |||
<image src="./../../../assets/img/coupon.png" mode="widthFix" /> | |||
<text class="txt001">请您敬请期待</text> | |||
@@ -14,20 +14,26 @@ | |||
</view> | |||
<view class='section' wx:for='{{list}}' wx:key='{{index}}' bindtap="gotouse" data-quancode="{{item.id}}" data-couponorderstatus="{{item.couponOrderStatus}}"> | |||
<view class='detail_msg'> | |||
<view class='logo'> | |||
<image src='{{item.coverImg}}'></image> | |||
</view> | |||
<view class='info'> | |||
<view> | |||
<text>{{item.title}}</text> | |||
<view class='mms'> | |||
<view class='detail_msg'> | |||
<view class='logo'> | |||
<image src='{{item.coverImg}}'></image> | |||
</view> | |||
<view> | |||
<text class="txt1">有效期至:</text> | |||
<text class="txt2">{{item.expiredTime}}</text> | |||
<view class='info'> | |||
<view class='title'> | |||
<text>{{item.title}}</text> | |||
</view> | |||
<view class='subtitle'> | |||
<text>{{item.subTitle}}</text> | |||
</view> | |||
<view wx:if="{{item.couponOrderStatus==0}}" class="btns">去使用</view> | |||
<view wx:elif="{{item.couponOrderStatus==1||item.couponOrderStatus==2||item.couponOrderStatus==3}}" class="btns">查看</view> | |||
</view> | |||
<view wx:if="{{item.couponOrderStatus==0}}" class="btns">立即使用</view> | |||
<view wx:elif="{{item.couponOrderStatus==1||item.couponOrderStatus==2||item.couponOrderStatus==3}}" class="btns">查看</view> | |||
</view> | |||
<image class="liness" src='./../../../assets/img/liness.png' mode="widthFix"></image> | |||
<view class='expiretime'> | |||
<text class="txt1">有效期至:</text> | |||
<text class="txt2">{{item.expiredTime}}</text> | |||
</view> | |||
</view> | |||
</view> | |||
@@ -1,6 +1,7 @@ | |||
.market { | |||
width: 100%; | |||
height: 100%; | |||
background: #f5f5f5; | |||
} | |||
.tabs { | |||
@@ -23,33 +24,58 @@ | |||
position: relative; | |||
} | |||
.detail_msg { | |||
width: 92%; | |||
height: 186rpx !important; | |||
.mms { | |||
width: 690rpx; | |||
height: 170rpx !important; | |||
background: #fff; | |||
padding: 30rpx 0 0; | |||
margin: 0 auto 30rpx; | |||
border-radius: 16rpx; | |||
border-top: 8rpx solid #02b7ff; | |||
box-shadow: 0 6px 20px 0 rgba(0, 0, 0, 0.10); | |||
} | |||
.detail_msg { | |||
display: flex; | |||
padding: 30rpx 4%; | |||
border-bottom: 1rpx solid #ededed; | |||
padding-bottom: 30rpx; | |||
} | |||
.expiretime { | |||
display: block; | |||
width: 100%; | |||
text-align: left; | |||
text-indent: 1em; | |||
height: 40rpx; | |||
line-height: 40rpx; | |||
font-size: 22rpx; | |||
color: #333; | |||
letter-spacing: 0; | |||
} | |||
.liness { | |||
display: block; | |||
width: 100%; | |||
} | |||
.logo { | |||
width: 180rpx; | |||
height: 180rpx; | |||
width: 60rpx; | |||
height: 60rpx; | |||
border: 1px solid #f8f8f8; | |||
border-radius: 15rpx; | |||
border-radius: 50rpx; | |||
display: block; | |||
margin-left: 20rpx; | |||
} | |||
.logo image { | |||
width: 180rpx; | |||
height: 180rpx; | |||
border-radius: 15rpx; | |||
width: 60rpx; | |||
height: 60rpx; | |||
border-radius: 50%; | |||
} | |||
.info view:nth-child(1) { | |||
display: flex; | |||
justify-content: space-between; | |||
padding: 0 4%; | |||
padding: 0 2%; | |||
} | |||
.info { | |||
@@ -57,16 +83,18 @@ | |||
} | |||
.info view:nth-child(1) text { | |||
font-size: 30rpx; | |||
margin-top: 10rpx; | |||
font-size: 32rpx; | |||
line-height: 32rpx; | |||
color: #333; | |||
letter-spacing: 0; | |||
} | |||
.info view:nth-child(2) { | |||
color: #ff3434; | |||
font-size: 24rpx; | |||
padding-left: 4%; | |||
margin-top: 1%; | |||
font-size: 22rpx; | |||
color: #333; | |||
letter-spacing: 0; | |||
margin-top: 6rpx; | |||
} | |||
.info view:nth-child(3) { | |||
@@ -75,26 +103,22 @@ | |||
.btns { | |||
position: absolute; | |||
right: 30rpx; | |||
bottom: 39rpx; | |||
width: 180rpx; | |||
height: 60rpx; | |||
line-height: 60rpx; | |||
right: 57rpx; | |||
top: 38rpx; | |||
width: 120rpx; | |||
height: 48rpx; | |||
line-height: 48rpx; | |||
text-align: center; | |||
background: #00c0ff; | |||
color: #fff; | |||
border-radius: 15rpx; | |||
border: 2rpx solid #02c0ff; | |||
border-radius: 60rpx; | |||
color: #02c0ff; | |||
font-size: 28rpx; | |||
} | |||
.txt1 { | |||
font-size: 22rpx; | |||
color: #999; | |||
} | |||
.txt2 { | |||
font-size: 22rpx; | |||
color: #f96563; | |||
color: #333; | |||
letter-spacing: 0; | |||
} | |||
.nocoupon image { | |||
@@ -127,7 +151,7 @@ | |||
color: #fff; | |||
font-style: 30rpx; | |||
width: 100%; | |||
border-radius:60rpx; | |||
border-radius: 60rpx; | |||
} | |||
.loading { | |||
@@ -144,9 +168,11 @@ | |||
vertical-align: middle; | |||
margin-right: 10rpx; | |||
} | |||
.active{ | |||
opacity: .6; | |||
.active { | |||
opacity: 0.6; | |||
} | |||
.nav { | |||
position: absolute; | |||
bottom: 3.3%; | |||
@@ -14,6 +14,11 @@ Page({ | |||
swiperCurrent: e.detail.current | |||
}); | |||
}, | |||
gotogame:function(){ | |||
wx.navigateTo({ | |||
url: '/pages/game/game', | |||
}) | |||
}, | |||
/** | |||
* 生命周期函数--监听页面初次渲染完成 | |||
*/ | |||
@@ -1,5 +1,10 @@ | |||
<view class="container"> | |||
<c-banner wx:key="unique" list="{{list}}" /> | |||
<c-rushToBuy /> | |||
<view class='game' bindtap="gotogame"> | |||
<image src='./../../assets/img/game.png' mode='widthFix'></image> | |||
<text>新用户专享神秘礼物</text> | |||
<text>独家福利,抢完即止</text> | |||
</view> | |||
<c-coupons id="lists" bind:myevent="onGetCode" /> | |||
</view> |
@@ -6,17 +6,58 @@ | |||
width: 100%; | |||
font-family: PingFangSC-Semibold; | |||
font-size: 30rpx; | |||
color: #ffffff; | |||
color: #fff; | |||
letter-spacing: 0.75rpx; | |||
z-index: 9; | |||
line-height: 88rpx; | |||
overflow: hidden; | |||
} | |||
page { | |||
width: 100%; | |||
height: auto; | |||
overflow-x: hidden; | |||
} | |||
.txt{ | |||
margin-left: 20rpx; | |||
.txt { | |||
margin-left: 20rpx; | |||
} | |||
.game { | |||
position: relative; | |||
width: 750rpx; | |||
height: 200rpx; | |||
z-index: 10000000; | |||
} | |||
.game text { | |||
display: block; | |||
position: relative; | |||
z-index: 100; | |||
} | |||
.game text:nth-of-type(1) { | |||
display: inline-block; | |||
padding-top: 65rpx; | |||
padding-left: 70rpx; | |||
font-size: 32rpx; | |||
color: #333; | |||
line-height: 36rpx; | |||
} | |||
.game text:nth-of-type(2) { | |||
font-size: 24rpx; | |||
color: #999; | |||
line-height: 24rpx; | |||
padding-left: 70rpx; | |||
} | |||
.game image { | |||
position: absolute; | |||
width: 100%; | |||
left: 0; | |||
right: 0; | |||
top: 0; | |||
bottom: 0; | |||
z-index: 10; | |||
} |
@@ -13,23 +13,24 @@ | |||
<text class='small'>{{item.subTitle}}</text> | |||
</view> | |||
<view class='flashSaleItemTopRBottom'> | |||
<text class='presentPrice'>¥{{item.salePriceStr}}</text> | |||
<text class='originalPrice'>¥{{item.priceStr}}</text> | |||
<text class='presentPrice'><text class='sale'>售价:</text>{{item.salePriceStr}}<text class='yuan'>元</text></text> | |||
<text class='originalPrice'>{{item.priceStr}}元</text> | |||
</view> | |||
</view> | |||
</view> | |||
<image class='lines' src='./../../assets/img/lines.png' mode='widthFix'></image> | |||
<view class='flashSaleItemBottom'> | |||
<view class='flashSaleItemBottomTop'> | |||
<text class='remainingTime'>剩余时间:</text> | |||
<text class='remainingTime'>距结束:</text> | |||
<text class='realRemainingTime'>{{item.endtime}}</text> | |||
</view> | |||
<view class='flashSaleItemBottomBottm'> | |||
<view class="view1"> | |||
<text class="remainingNumber">剩余件数:</text> | |||
<text class='realnumber'>{{item.remainInventory}}件</text> | |||
<text class="remainingNumber">剩余:</text> | |||
<text class='realnumber'>{{item.remainInventory}}张</text> | |||
</view> | |||
<view class='buy' wx:if="{{item.salePriceStr!=0}}">购买</view> | |||
<view class='buy' wx:if="{{item.salePriceStr==0}}">领取</view> | |||
<view class='buy' hover-class='active' wx:if="{{item.salePriceStr!=0}}">购买</view> | |||
<view class='buy' hover-class='active' wx:if="{{item.salePriceStr==0}}">领取</view> | |||
</view> | |||
</view> | |||
</view> | |||
@@ -1,9 +1,11 @@ | |||
.flashSale { | |||
.flashSale,page{ | |||
width: 100%; | |||
height: 100%; | |||
background: #fff; | |||
background: #f5f5f5; | |||
padding-bottom: 30rpx; | |||
} | |||
.flashSale > view:nth-of-type(1){ | |||
margin-top: 0!important; | |||
} | |||
.loading { | |||
text-align: center; | |||
height: 80rpx; | |||
@@ -11,7 +13,6 @@ | |||
font-size: 26rpx; | |||
color: #999; | |||
} | |||
.loading image { | |||
width: 40rpx; | |||
height: 40rpx; | |||
@@ -21,25 +22,28 @@ | |||
.flashSaleItemWrap { | |||
width: 100%; | |||
height: 410rpx; | |||
border-bottom: 10rpx solid #f8f8f8; | |||
margin-top: 30rpx; | |||
} | |||
.flashSaleItem { | |||
width: 90%; | |||
height: 410rpx; | |||
width: 690rpx; | |||
margin: 0 auto; | |||
display: flex; | |||
flex-direction: column; | |||
background: #fff; | |||
margin: 0 auto; | |||
border-radius: 16rpx; | |||
padding-bottom: 30rpx; | |||
} | |||
.lines { | |||
display: block; | |||
width: 100%; | |||
} | |||
.flashSaleItemTop { | |||
display: flex; | |||
padding-top: 28rpx; | |||
flex-direction: row; | |||
padding-bottom: 25rpx; | |||
border-bottom: 1rpx solid #ededed; | |||
padding: 28rpx 30rpx 10rpx; | |||
} | |||
.flashSaleItemTopL { | |||
@@ -47,15 +51,14 @@ | |||
} | |||
.food { | |||
width: 248rpx; | |||
width: 180rpx; | |||
border-radius: 10rpx; | |||
height: 184rpx; | |||
height: 180rpx; | |||
} | |||
.flashSaleItemTopR { | |||
flex: 2; | |||
flex-direction: column; | |||
margin-left: 20rpx; | |||
} | |||
.flashSaleItemTopRTop { | |||
@@ -75,7 +78,8 @@ | |||
.small { | |||
font-size: 24rpx; | |||
color: #00c0ff; | |||
color: #333; | |||
letter-spacing: 0; | |||
margin-top: 15rpx; | |||
} | |||
@@ -96,8 +100,8 @@ | |||
} | |||
.flashSaleItemBottom { | |||
margin-top: 20rpx; | |||
position: relative; | |||
padding: 0 30rpx; | |||
} | |||
.remainingTime { | |||
@@ -107,7 +111,7 @@ | |||
.realRemainingTime { | |||
margin-left: 10rpx; | |||
color: #f96563; | |||
color: #FF4949; | |||
font-size: 28rpx; | |||
} | |||
@@ -119,6 +123,7 @@ | |||
.view1 { | |||
width: 550rpx; | |||
display: block; | |||
line-height: 33rpx; | |||
} | |||
.remainingNumber { | |||
@@ -134,15 +139,33 @@ | |||
.buy { | |||
position: absolute; | |||
top: 34rpx; | |||
top: 27rpx; | |||
bottom: 0; | |||
right: 0rpx; | |||
width: 138rpx; | |||
height: 50rpx; | |||
line-height: 50rpx; | |||
right: 30rpx; | |||
width: 140rpx; | |||
height: 60rpx; | |||
line-height: 60rpx; | |||
text-align: center; | |||
background: #00c0ff; | |||
background: #ff4949; | |||
border-radius: 60rpx; | |||
color: #fff; | |||
border-radius: 10rpx; | |||
font-size: 28rpx; | |||
} | |||
.sale { | |||
font-size: 24rpx; | |||
color: #999; | |||
letter-spacing: 0; | |||
display: inline-block; | |||
margin-right: 6rpx; | |||
} | |||
.yuan { | |||
font-size: 24rpx; | |||
color: #ff4949; | |||
letter-spacing: 0; | |||
} | |||
.active { | |||
opacity: 0.6; | |||
} |
@@ -67,7 +67,7 @@ | |||
<view class="margin"></view> | |||
<!-- <button bindtap="navigateTo" class="user-out-btn">退出登陆</button> --> | |||
<view bindlongtap='showVersion' class='version'> | |||
<view wx:if="{{flag=='show'}}">版本号:1.0.1</view> | |||
<view wx:if="{{flag=='show'}}">版本号:2.0.0</view> | |||
<view wx:if="{{flag=='hidden'}}"></view> | |||
</view> | |||
</view> |