@@ -17,6 +17,13 @@ | |||||
-webkit-text-stroke-width: 0.2rpx; | -webkit-text-stroke-width: 0.2rpx; | ||||
-moz-osx-font-smoothing: grayscale; | -moz-osx-font-smoothing: grayscale; | ||||
} | } | ||||
.clearfix:after { | |||||
content: "."; | |||||
display: block; | |||||
height: 0; | |||||
clear: both; | |||||
visibility: hidden; | |||||
} | |||||
/* 定位 */ | /* 定位 */ | ||||
.icon-dingweib:before { | .icon-dingweib:before { | ||||
content: "\e652"; | content: "\e652"; | ||||
@@ -6,8 +6,7 @@ | |||||
margin:-126rpx auto 0; | margin:-126rpx auto 0; | ||||
border-radius:16rpx; | border-radius:16rpx; | ||||
z-index: 10000; | z-index: 10000; | ||||
/* box-shadow: 0px 10rpx 10rpx 0px rgba(0, 0, 0, 0.2); */ | |||||
box-shadow: 0 5px 15px 0 rgba(0,0,0,.6); | |||||
box-shadow: 0 6px 20px 0 rgba(0,0,0,0.10); | |||||
} | } | ||||
.index-slide, | .index-slide, | ||||
swiper-item | swiper-item | ||||
@@ -1,9 +1,12 @@ | |||||
view text{ | |||||
view text { | |||||
display: block; | display: block; | ||||
} | } | ||||
view text:nth-of-type(1){ | |||||
view text:nth-of-type(1) { | |||||
padding: 20rpx 30rpx; | padding: 20rpx 30rpx; | ||||
font-size: 28rpx; | |||||
line-height: 50rpx; | |||||
color: #999; | |||||
} | |||||
font-size: 26rpx; | |||||
color: #191919; | |||||
letter-spacing: 0; | |||||
text-align: justify; | |||||
line-height: 46rpx; | |||||
} |
@@ -27,7 +27,7 @@ | |||||
<button bindtap='orderFunc' class='buy'>立即购买</button> | <button bindtap='orderFunc' class='buy'>立即购买</button> | ||||
</view> --> | </view> --> | ||||
<view class='contain'> | |||||
<view class='contain clearfix'> | |||||
<!-- 优惠券 --> | <!-- 优惠券 --> | ||||
<navigator wx:for="{{data.coupons}}" wx:key="{{index}}" url="/pages/coupon/detail/index?couponChannelId={{item.id}}&couponId={{item.couponId}}"> | <navigator wx:for="{{data.coupons}}" wx:key="{{index}}" url="/pages/coupon/detail/index?couponChannelId={{item.id}}&couponId={{item.couponId}}"> | ||||
<!-- 首页优惠券列表页面 --> | <!-- 首页优惠券列表页面 --> | ||||
@@ -48,14 +48,12 @@ | |||||
</view> | </view> | ||||
</view> | </view> | ||||
</view> | </view> | ||||
<!-- <view class="coupons1-info-name subtitle sy">剩余{{item.remainInventory}}</view> --> | |||||
<view class="coupons1-btn"> | <view class="coupons1-btn"> | ||||
<!-- 优惠券价格 --> | <!-- 优惠券价格 --> | ||||
<i-button class="buy" wx:if="{{item.salePriceStr==0}}" data-date='{{data}}'>免费领</i-button> | <i-button class="buy" wx:if="{{item.salePriceStr==0}}" data-date='{{data}}'>免费领</i-button> | ||||
<i-button class="buy" wx:elif="{{item.salePriceStr!=0}}" data-date='{{data}}'>马上购</i-button> | <i-button class="buy" wx:elif="{{item.salePriceStr!=0}}" data-date='{{data}}'>马上购</i-button> | ||||
<view class="coupons1-info-price"> | |||||
<view class="coupons1-info-name subtitle sy">剩余{{item.remainInventory}}</view> | |||||
<!-- <text class="coupons-info-price-o"><text class='i'>¥</text>{{item.priceStr}}</text> --> | |||||
</view> | |||||
</view> | </view> | ||||
<!-- <view class="coupons1-border"></view> --> | <!-- <view class="coupons1-border"></view> --> | ||||
</view> | </view> | ||||
@@ -61,7 +61,7 @@ page { | |||||
.proct { | .proct { | ||||
position: relative; | position: relative; | ||||
height: 60rpx; | height: 60rpx; | ||||
margin-top:20rpx; | |||||
margin-top: 20rpx; | |||||
} | } | ||||
.proct text:nth-of-type(1) { | .proct text:nth-of-type(1) { | ||||
@@ -72,13 +72,14 @@ page { | |||||
display: inline-block; | display: inline-block; | ||||
width: 60rpx; | width: 60rpx; | ||||
height: 64rpx; | height: 64rpx; | ||||
padding-right:20rpx; | |||||
border-right: 2px solid #e5e5e5; | |||||
padding-right: 20rpx; | |||||
border-right: 2px solid #e5e5e5; | |||||
} | } | ||||
.proct text:nth-of-type(2) { | .proct text:nth-of-type(2) { | ||||
display: inline-block; | display: inline-block; | ||||
width: 498rpx; | width: 498rpx; | ||||
height: 60rpx; | |||||
height: 63rpx; | |||||
overflow: hidden; | overflow: hidden; | ||||
white-space: nowrap; | white-space: nowrap; | ||||
text-overflow: ellipsis; | text-overflow: ellipsis; | ||||
@@ -171,12 +172,20 @@ page { | |||||
navigator { | navigator { | ||||
display: block; | display: block; | ||||
padding: 0 24rpx 0; | |||||
margin-bottom: 24rpx; | margin-bottom: 24rpx; | ||||
width: 344rpx; | |||||
} | |||||
navigator:nth-of-type(2n) { | |||||
float: right; | |||||
} | |||||
navigator:nth-of-type(2n+1) { | |||||
float: left; | |||||
} | } | ||||
.contain { | .contain { | ||||
padding-top: 24rpx; | |||||
padding: 24rpx 25rpx 0; | |||||
} | } | ||||
.posi { | .posi { | ||||
@@ -298,15 +307,15 @@ navigator { | |||||
.buy { | .buy { | ||||
display: block; | display: block; | ||||
background: #00c0ff; | |||||
height: 50rpx; | |||||
width: 120rpx; | |||||
background: #ff4949; | |||||
border-radius: 30rpx; | |||||
height: 48rpx; | |||||
width: 112rpx; | |||||
margin: 0 auto; | margin: 0 auto; | ||||
color: #fff; | color: #fff; | ||||
font-size: 28rpx; | |||||
line-height: 50rpx; | |||||
font-size: 26rpx; | |||||
line-height: 48rpx; | |||||
text-align: center; | text-align: center; | ||||
border-radius: 50rpx; | |||||
} | } | ||||
.coupons1-btn-gm { | .coupons1-btn-gm { | ||||
@@ -324,14 +333,11 @@ navigator { | |||||
} | } | ||||
.coupons1 { | .coupons1 { | ||||
flex-direction: row; | |||||
display: flex; | |||||
padding: 24rpx; | |||||
position: relative; | position: relative; | ||||
height: 152rpx; | |||||
background: #fff; | background: #fff; | ||||
border-radius: 16rpx; | border-radius: 16rpx; | ||||
box-shadow: 0 5px 15px 0 rgba(0, 0, 0, 0.3); | |||||
padding-bottom: 21rpx; | |||||
overflow: hidden; | |||||
} | } | ||||
/* .coupons1-border { | /* .coupons1-border { | ||||
@@ -344,10 +350,9 @@ navigator { | |||||
} */ | } */ | ||||
.coupons1-img { | .coupons1-img { | ||||
width: 160rpx; | |||||
height: 160rpx; | |||||
width: 344rpx; | |||||
height: 258rpx; | |||||
overflow: hidden; | overflow: hidden; | ||||
border-radius: 10rpx; | |||||
} | } | ||||
.coupons1-img image { | .coupons1-img image { | ||||
@@ -364,7 +369,6 @@ navigator { | |||||
font-size: 28rpx; | font-size: 28rpx; | ||||
color: #000; | color: #000; | ||||
letter-spacing: 0; | letter-spacing: 0; | ||||
line-height: 38rpx; | |||||
} | } | ||||
.i { | .i { | ||||
@@ -377,12 +381,20 @@ navigator { | |||||
font-size: 36rpx; | font-size: 36rpx; | ||||
color: #f96563; | color: #f96563; | ||||
line-height: 50rpx; | line-height: 50rpx; | ||||
margin-top: 21rpx; | |||||
} | } | ||||
.tit { | .tit { | ||||
font-size: 28rpx; | |||||
font-size: 30rpx; | |||||
color: #000; | color: #000; | ||||
letter-spacing: 0; | letter-spacing: 0; | ||||
line-height: 42rpx; | |||||
width: 270rpx; | |||||
height: 42rpx; | |||||
overflow: hidden; | |||||
white-space: nowrap; | |||||
text-overflow: ellipsis; | |||||
padding-top: 16rpx; | |||||
} | } | ||||
.coupons1-info-price-o { | .coupons1-info-price-o { | ||||
@@ -413,8 +425,8 @@ navigator { | |||||
.coupons1-btn { | .coupons1-btn { | ||||
position: absolute; | position: absolute; | ||||
width: 120rpx; | width: 120rpx; | ||||
top: 61rpx; | |||||
right: 30rpx; | |||||
bottom: 25rpx; | |||||
right: 13rpx; | |||||
} | } | ||||
.coupons1-btn-gm { | .coupons1-btn-gm { | ||||
@@ -440,7 +452,7 @@ navigator { | |||||
text-overflow: ellipsis; | text-overflow: ellipsis; | ||||
width: 300rpx; | width: 300rpx; | ||||
height: 33rpx; | height: 33rpx; | ||||
color: #919191; | |||||
color: #999; | |||||
letter-spacing: 0; | letter-spacing: 0; | ||||
} | } | ||||
@@ -450,7 +462,8 @@ navigator { | |||||
line-height: 34rpx; | line-height: 34rpx; | ||||
display: inline-block; | display: inline-block; | ||||
} | } | ||||
.jian{ | |||||
.jian { | |||||
width: 44rpx; | width: 44rpx; | ||||
position: absolute; | position: absolute; | ||||
bottom: 1.7%; | bottom: 1.7%; | ||||
@@ -6,16 +6,35 @@ | |||||
</view> | </view> | ||||
<view class='coupons_info'> | <view class='coupons_info'> | ||||
<view> | <view> | ||||
<text>{{data.title}}<text>限购{{data.useLimitQuantity}}件</text></text> | |||||
<text wx:if="{{data.endTime!=undefined&&data.endTime>=0&&data.type!=5}}">剩余时间:<text>{{endtime}}</text></text> | |||||
<text wx:if="{{data.endTime!=undefined&&0>=data.endTime&&data.type!=5}}">剩余时间:<text>即将到期</text></text> | |||||
<text wx:if="{{data.endTime==undefined}}">自领取之日起<text>{{data.validDays}}</text>天内有效</text> | |||||
<text wx:if="{{data.type==5}}"><text>当次有效</text></text> | |||||
<text>剩余件数:<text>{{data.remainInventory}}件</text></text> | |||||
</view> | |||||
<view> | |||||
<text>¥{{data.salePriceStr}}</text> | |||||
<text>¥{{data.priceStr}}</text> | |||||
<text class='title'>{{data.title}}</text> | |||||
<text class="subTitle">{{data.subTitle}}</text> | |||||
<view class='salePriceStr clearfix'> | |||||
<view class="fl">售价: | |||||
<text class="pri01">{{data.salePriceStr}}</text> | |||||
<text class="yuan">元</text> | |||||
<text class='throgh'>{{data.priceStr}}元</text> | |||||
</view> | |||||
<text class="restNum fr">剩余<text>{{data.remainInventory}}件</text></text> | |||||
</view> | |||||
<view class='rest' wx:if="{{data.endTime!=undefined&&data.endTime>=0&&data.type!=5}}"> | |||||
<text class='txt01'>剩余时间:</text> | |||||
<text class='time'>{{endtime}}</text> | |||||
</view> | |||||
<view class="rest" wx:if="{{data.endTime!=undefined&&0>=data.endTime&&data.type!=5}}">剩余时间: | |||||
<text class='time'>即将到期</text> | |||||
</view> | |||||
<view class='rest' wx:if="{{data.endTime==undefined}}">自领取之日起 | |||||
<text class='time'>{{data.validDays}}</text>天内有效</view> | |||||
<view class='rest' wx:if="{{data.type==5}}"> | |||||
<text class='time'>当次有效</text> | |||||
</view> | |||||
<view class='rest'> | |||||
<text class='txt01'>限购条件:</text> | |||||
<text class='time'>每人{{data.useLimitQuantity}}张</text> | |||||
</view> | |||||
</view> | </view> | ||||
</view> | </view> | ||||
@@ -30,11 +49,9 @@ | |||||
</view> | </view> | ||||
<image bindtap='phone' class="tel" src="./../../../assets/img/tel.jpg" mode="widthFix" /> | <image bindtap='phone' class="tel" src="./../../../assets/img/tel.jpg" mode="widthFix" /> | ||||
</view> | </view> | ||||
<!-- <view> | |||||
<text>更多适用门店</text> | |||||
<text class='iconfont icon-right'></text> | |||||
</view> --> | |||||
</view> | </view> | ||||
<view class='notes'> | <view class='notes'> | ||||
<view> | <view> | ||||
<text>购买须知</text> | <text>购买须知</text> | ||||
@@ -45,7 +62,7 @@ | |||||
</view> | </view> | ||||
</view> | </view> | ||||
<view class="buy-view app-border-top"> | <view class="buy-view app-border-top"> | ||||
<button bindtap='orderFunc' class='buy' wx:if="{{data.salePriceStr!=0&&data.remainInventory!=0}}">立即支付</button> | |||||
<button bindtap='orderFunc' hover-class='active' class='buy' wx:if="{{data.salePriceStr!=0&&data.remainInventory!=0}}"><text class='txt'>{{data.salePriceStr}}元</text>马上购买</button> | |||||
<button bindtap='orderFunc' class='buy' wx:elif="{{data.salePriceStr==0&&data.remainInventory!=0}}">免费领取</button> | <button bindtap='orderFunc' class='buy' wx:elif="{{data.salePriceStr==0&&data.remainInventory!=0}}">免费领取</button> | ||||
<button class='buy' wx:elif="{{data.remainInventory==0}}" style="background:#999;color: #fff;">已售罄</button> | <button class='buy' wx:elif="{{data.remainInventory==0}}" style="background:#999;color: #fff;">已售罄</button> | ||||
</view> | </view> |
@@ -1,16 +1,19 @@ | |||||
@import "../../../app.wxss"; | @import "../../../app.wxss"; | ||||
page { | |||||
background: #fff; | |||||
} | |||||
.coupons { | .coupons { | ||||
width: 100%; | width: 100%; | ||||
background: #f6f6f6; | |||||
position: relative; | position: relative; | ||||
overflow: hidden; | overflow: hidden; | ||||
padding-bottom: 120rpx; | |||||
padding-bottom: 170rpx; | |||||
} | } | ||||
.banner { | .banner { | ||||
width: 100%; | |||||
height: 465rpx; | |||||
width: 750rpx; | |||||
height: 534.5rpx; | |||||
} | } | ||||
.banner image { | .banner image { | ||||
@@ -20,68 +23,120 @@ | |||||
.coupons_info { | .coupons_info { | ||||
width: 92%; | width: 92%; | ||||
height: 186rpx; | |||||
display: flex; | |||||
justify-content: space-between; | |||||
padding: 0 4%; | padding: 0 4%; | ||||
background: #fff; | background: #fff; | ||||
border-top-left-radius: 20rpx; | |||||
border-top-right-radius: 20rpx; | |||||
margin-top: -25rpx; | |||||
position: relative; | |||||
z-index: 100000000; | |||||
} | } | ||||
.coupons_info view { | |||||
display: flex; | |||||
flex-direction: column; | |||||
.title { | |||||
display: block; | |||||
font-size: 32rpx; | |||||
color: #000; | |||||
letter-spacing: 1.09rpx; | |||||
line-height: 45rpx; | |||||
width: 542rpx; | |||||
overflow: hidden; | |||||
white-space: nowrap; | |||||
text-overflow: ellipsis; | |||||
padding-top: 30rpx; | |||||
} | } | ||||
.coupons_info view:nth-child(1) text { | |||||
font-size: 30rpx; | |||||
margin-top: 6%; | |||||
.subTitle { | |||||
display: block; | |||||
width: 588rpx; | |||||
height: 37rpx; | |||||
font-size: 26rpx; | |||||
color: #999; | |||||
letter-spacing: 1.16rpx; | |||||
overflow: hidden; | |||||
white-space: nowrap; | |||||
text-overflow: ellipsis; | |||||
padding: 6rpx 0; | |||||
} | } | ||||
.coupons_info view:nth-child(1) text:nth-child(1) text { | |||||
color: #ff3434; | |||||
.rest { | |||||
font-size: 24rpx; | font-size: 24rpx; | ||||
border: 1px solid #ff3434; | |||||
border-radius: 6rpx; | |||||
margin-left: 2%; | |||||
padding: 0 5rpx; | |||||
color: #919191; | |||||
letter-spacing: 0; | |||||
height: 70rpx; | |||||
line-height: 70rpx; | |||||
/* border-bottom: 1px solid #eee; */ | |||||
border-bottom: 1px solid #f9f9f9; | |||||
} | } | ||||
.coupons_info view:nth-child(1) text:nth-child(2), | |||||
.coupons_info view:nth-child(1) text:nth-child(3) { | |||||
color: #b8b8b8; | |||||
.restNum { | |||||
font-size: 24rpx; | font-size: 24rpx; | ||||
margin-top: 4%; | |||||
color: #999; | |||||
letter-spacing: 1.16rpx; | |||||
text-align: right; | |||||
} | } | ||||
.coupons_info view:nth-child(1) text:nth-child(2) text, | |||||
.coupons_info view:nth-child(1) text:nth-child(3) text { | |||||
color: #ff3434; | |||||
.time { | |||||
font-size: 24rpx; | font-size: 24rpx; | ||||
color: #333; | |||||
letter-spacing: 0; | |||||
line-height: 33rpx; | |||||
display: inline-block; | |||||
} | } | ||||
.coupons_info view:nth-child(2) text:nth-child(1) { | |||||
font-size: 36rpx; | |||||
color: #ff3434; | |||||
margin-top: 40rpx; | |||||
font-weight: bold; | |||||
.txt01 { | |||||
font-size: 24rpx; | |||||
color: #919191; | |||||
letter-spacing: 0; | |||||
} | |||||
.price { | |||||
font-size: 24rpx; | |||||
color: #999; | |||||
letter-spacing: 0; | |||||
} | |||||
.salePriceStr { | |||||
font-size: 24rpx; | |||||
color: #999; | |||||
letter-spacing: 0; | |||||
} | |||||
.salePriceStr .pri01 { | |||||
font-size: 40rpx; | |||||
color: #ff4949; | |||||
letter-spacing: 0; | |||||
margin-left: 10rpx; | |||||
} | |||||
.salePriceStr .yuan { | |||||
font-size: 24rpx; | |||||
color: #ff4949; | |||||
letter-spacing: 0; | |||||
} | } | ||||
.coupons_info view:nth-child(2) text:nth-child(2) { | |||||
.price text { | |||||
font-size: 24rpx; | font-size: 24rpx; | ||||
color: #b4b4b4; | |||||
color: #333; | |||||
letter-spacing: 0; | |||||
} | |||||
.throgh { | |||||
text-decoration: line-through; | text-decoration: line-through; | ||||
padding-left: 10rpx; | |||||
padding-top: 4rpx; | |||||
margin-left: 10rpx; | |||||
} | } | ||||
.posi { | .posi { | ||||
position: relative; | position: relative; | ||||
width: 92%; | width: 92%; | ||||
display: flex; | |||||
flex-direction: column; | |||||
padding: 0 4%; | |||||
background: #fff; | |||||
margin-top: 2%; | |||||
margin: 0 auto; | |||||
} | |||||
.fl { | |||||
float: left; | |||||
} | |||||
.fr { | |||||
float: right; | |||||
} | } | ||||
.posi>view:nth-child(2) { | .posi>view:nth-child(2) { | ||||
@@ -105,45 +160,48 @@ | |||||
.posi_logo { | .posi_logo { | ||||
width: 100%; | width: 100%; | ||||
height: 156rpx; | |||||
display: flex; | display: flex; | ||||
margin-top: 30rpx; | |||||
padding: 20rpx 0; | |||||
background: #fff; | |||||
height: 100rpx; | |||||
border-bottom: 1px solid #f9f9f9; | |||||
} | } | ||||
.posi_logo view:nth-child(1) { | .posi_logo view:nth-child(1) { | ||||
width: 126rpx; | |||||
height: 126rpx; | |||||
border-radius: 50%; | |||||
width: 100rpx; | |||||
height: 100rpx; | |||||
border-radius: 16rpx; | |||||
overflow: hidden; | overflow: hidden; | ||||
flex: 2; | |||||
} | } | ||||
.posi_logo view:nth-child(1) image { | .posi_logo view:nth-child(1) image { | ||||
width: 100%; | |||||
height: 100%; | |||||
display: block; | |||||
width: 100rpx; | |||||
height: 100rpx; | |||||
border-radius: 16rpx; | |||||
border: 2px solid #e5e5e5; | |||||
} | } | ||||
.posi_logo view:nth-child(2) { | .posi_logo view:nth-child(2) { | ||||
display: flex; | display: flex; | ||||
flex-direction: column; | flex-direction: column; | ||||
flex: 8; | flex: 8; | ||||
padding-top: 20rpx; | |||||
padding-left: 30rpx; | padding-left: 30rpx; | ||||
} | } | ||||
.posi_logo view:nth-child(2) text:nth-child(1) { | .posi_logo view:nth-child(2) text:nth-child(1) { | ||||
font-size: 30rpx; | |||||
font-size: 32rpx; | |||||
color: #333; | |||||
letter-spacing: 0; | |||||
} | } | ||||
.posi_logo view:nth-child(2) text:nth-child(2) { | .posi_logo view:nth-child(2) text:nth-child(2) { | ||||
font-size: 24rpx; | font-size: 24rpx; | ||||
color: #b8b8b8; | color: #b8b8b8; | ||||
padding-top: 10rpx; | |||||
width:450rpx; | |||||
} | |||||
.notes { | |||||
margin-top: 2%; | |||||
padding-top: 3rpx; | |||||
width: 450rpx; | |||||
height: 36rpx; | |||||
overflow: hidden; | |||||
} | } | ||||
.notes view:nth-child(1) { | .notes view:nth-child(1) { | ||||
@@ -152,59 +210,66 @@ | |||||
padding: 0 4%; | padding: 0 4%; | ||||
line-height: 87rpx; | line-height: 87rpx; | ||||
background: #fff; | background: #fff; | ||||
border-bottom: 1rpx solid #f5f5f5; | |||||
border-top: 1rpx solid #f5f5f5; | |||||
} | |||||
.active { | |||||
opacity: 0.6; | |||||
} | } | ||||
.notes view:nth-child(1) text { | .notes view:nth-child(1) text { | ||||
font-size: 30rpx; | |||||
font-weight: bold; | |||||
font-size: 24rpx; | |||||
color: #919191; | |||||
letter-spacing: 0; | |||||
} | } | ||||
.notes view:nth-child(2) { | .notes view:nth-child(2) { | ||||
width: 92%; | width: 92%; | ||||
padding: 2% 4%; | |||||
padding: 0 4%; | |||||
background: #fff; | background: #fff; | ||||
border-bottom: 1rpx solid #f5f5f5; | |||||
display: flex; | display: flex; | ||||
flex-direction: column; | flex-direction: column; | ||||
} | } | ||||
.notes view:nth-child(2)>text { | .notes view:nth-child(2)>text { | ||||
font-size: 26rpx; | |||||
color: #a9a9a9; | |||||
line-height: 45rpx; | |||||
font-size: 24rpx; | |||||
color: #333; | |||||
letter-spacing: 0; | |||||
line-height: 42rpx; | |||||
} | } | ||||
.buy-view { | .buy-view { | ||||
background: #fff; | background: #fff; | ||||
position: fixed; | position: fixed; | ||||
padding-top: 10rpx; | |||||
height: 98rpx; | |||||
bottom: 0rpx; | |||||
height: 96rpx; | |||||
bottom: 0; | |||||
left: 0; | left: 0; | ||||
right: 0; | right: 0; | ||||
padding-bottom: 22rpx; | |||||
padding-top: 22rpx; | |||||
} | } | ||||
.buy { | .buy { | ||||
background: #00c0ff; | background: #00c0ff; | ||||
height: 88rpx; | |||||
width: 98%; | |||||
margin: 0 auto; | |||||
height: 94rpx; | |||||
width: 670rpx; | |||||
margin: 0 auto 30rpx; | |||||
color: #fff; | color: #fff; | ||||
font-size: 36rpx; | font-size: 36rpx; | ||||
line-height: 88rpx; | |||||
border-radius: 6rpx; | |||||
line-height: 94rpx; | |||||
border-radius: 61rpx; | |||||
} | } | ||||
.tel { | .tel { | ||||
position: absolute; | position: absolute; | ||||
right: 50rpx; | |||||
right: 0; | |||||
top: 0; | top: 0; | ||||
bottom: 0; | bottom: 0; | ||||
margin: auto; | margin: auto; | ||||
width: 50rpx; | width: 50rpx; | ||||
height: 50rpx; | height: 50rpx; | ||||
z-index:1000000; | |||||
z-index: 1000000; | |||||
} | |||||
.txt { | |||||
margin-right: 30rpx; | |||||
} | } |
@@ -6,7 +6,7 @@ | |||||
<view> | <view> | ||||
<view class="nocoupon" wx:if="{{list.length==0}}"> | <view class="nocoupon" wx:if="{{list.length==0}}"> | ||||
<image src="./../../../assets/img/cou.png" mode="widthFix" /> | <image src="./../../../assets/img/cou.png" mode="widthFix" /> | ||||
<text>暂无优惠券哦</text> | |||||
<text>再忙,也要记得买点什么犒赏自己~</text> | |||||
<navigator url="/pages/index/index" open-type="switchTab" hover-class="other-navigator-hover"> | <navigator url="/pages/index/index" open-type="switchTab" hover-class="other-navigator-hover"> | ||||
<button>去领券</button> | <button>去领券</button> | ||||
</navigator> | </navigator> | ||||
@@ -58,7 +58,8 @@ | |||||
</view> | </view> | ||||
<view class="dingdan" wx:if="{{list.length==0}}"> | <view class="dingdan" wx:if="{{list.length==0}}"> | ||||
<image src="../../../assets/img/dingdan.png" mode="widthFix"></image> | <image src="../../../assets/img/dingdan.png" mode="widthFix"></image> | ||||
<text>暂无订单</text> | |||||
<text>您还没有相关订单</text> | |||||
<text>再忙,也要记得买点什么犒赏自己~</text> | |||||
</view> | </view> | ||||
</view> | </view> | ||||
<view class="loading" wx:if="{{loading}}"> | <view class="loading" wx:if="{{loading}}"> | ||||
@@ -134,19 +134,27 @@ | |||||
} | } | ||||
.dingdan { | .dingdan { | ||||
margin-top: 200rpx; | |||||
margin-top: 33rpx; | |||||
} | } | ||||
.dingdan text { | |||||
.dingdan text:nth-of-type(1) { | |||||
display: block; | display: block; | ||||
font-size: 34rpx; | |||||
color: #333; | |||||
letter-spacing: 0; | |||||
text-align: center; | text-align: center; | ||||
font-size: 30rpx; | |||||
color: #00c0ff; | |||||
} | } | ||||
.dingdan text:nth-of-type(2) { | |||||
display: block; | |||||
font-size: 28rpx; | |||||
color: #999999; | |||||
letter-spacing: 0; | |||||
text-align: center; | |||||
} | |||||
.dingdan image { | .dingdan image { | ||||
display: block; | display: block; | ||||
width: 100rpx; | |||||
width: 300rpx; | |||||
height: 300rpx; | |||||
margin: 0 auto 16rpx; | margin: 0 auto 16rpx; | ||||
} | } | ||||
@@ -1,19 +1,24 @@ | |||||
<view class="user"> | <view class="user"> | ||||
<view class='bannerbg'><image src='./../../assets/img/banner.png' mode="widthFix"></image></view> | |||||
<view class="user-title"> | <view class="user-title"> | ||||
<view class="user-avatar"> | <view class="user-avatar"> | ||||
<open-data class="open" type="userAvatarUrl"></open-data> | <open-data class="open" type="userAvatarUrl"></open-data> | ||||
</view> | </view> | ||||
<view class="user-phone"> | <view class="user-phone"> | ||||
<open-data type="userNickName"></open-data> | <open-data type="userNickName"></open-data> | ||||
<view>成长值:1000</view> | |||||
<view class='chengzhang'>微信用户</view> | |||||
</view> | </view> | ||||
<view class='chengzhang1'> | |||||
<view class="view">985<image src='./../../assets/img/shang.png' mode="widthFix"></image></view> | |||||
<text>成长值</text> | |||||
</view> | |||||
</view> | </view> | ||||
<view class="margin"></view> | <view class="margin"></view> | ||||
<view class="user-btns"> | <view class="user-btns"> | ||||
<navigator url="/pages/order/index/index?id=all"> | <navigator url="/pages/order/index/index?id=all"> | ||||
<view class="user-btn app-border-bottom"> | <view class="user-btn app-border-bottom"> | ||||
<view>我的订单</view> | <view>我的订单</view> | ||||
<view>全部订单</view> | |||||
<view>查看全部<text class="iconfont icon-right"></text></view> | |||||
</view> | </view> | ||||
</navigator> | </navigator> | ||||
<navigator url="/pages/order/index/index?id=0"> | <navigator url="/pages/order/index/index?id=0"> | ||||
@@ -1,21 +1,27 @@ | |||||
.margin { | .margin { | ||||
background: #f8f8f8; | |||||
height: 20rpx; | |||||
/* background: #f8f8f8; *//* height: 20rpx; */ | |||||
} | } | ||||
.user { | .user { | ||||
background: #f8f8f8; | |||||
background: #fff; | |||||
min-height: 100vh; | min-height: 100vh; | ||||
} | } | ||||
.user-title { | .user-title { | ||||
height: 186rpx; | |||||
padding: 30rpx; | |||||
position: relative; | |||||
box-shadow: 0 6px 20px 0 rgba(0, 0, 0, 0.10); | |||||
border-radius: 8px; | |||||
height: 176rpx; | |||||
width: 698rpx; | |||||
padding: 0 30rpx; | |||||
display: flex; | display: flex; | ||||
flex-direction: row; | flex-direction: row; | ||||
box-sizing: border-box; | box-sizing: border-box; | ||||
background: #fff; | background: #fff; | ||||
margin: -116rpx auto 0; | |||||
border-bottom: 6rpx solid #02c0ff; | |||||
} | } | ||||
/* | /* | ||||
.user-avatar { | .user-avatar { | ||||
padding-right: 30rpx; | padding-right: 30rpx; | ||||
@@ -25,7 +31,8 @@ | |||||
overflow: hidden; | overflow: hidden; | ||||
border: 1px solid red; | border: 1px solid red; | ||||
} */ | } */ | ||||
.couponnum{ | |||||
.couponnum { | |||||
display: inline-block; | display: inline-block; | ||||
position: absolute; | position: absolute; | ||||
top: 20rpx; | top: 20rpx; | ||||
@@ -37,6 +44,7 @@ | |||||
background: red; | background: red; | ||||
font-size: 22rpx; | font-size: 22rpx; | ||||
} | } | ||||
.user-avatar open-data { | .user-avatar open-data { | ||||
display: block; | display: block; | ||||
width: 100%; | width: 100%; | ||||
@@ -45,20 +53,70 @@ | |||||
.user-phone { | .user-phone { | ||||
font-family: PingFangSC-Regular; | font-family: PingFangSC-Regular; | ||||
font-size: 30rpx; | |||||
height: 120rpx; | height: 120rpx; | ||||
margin-left: 20rpx; | |||||
color: #666; | |||||
margin-left: 149rpx; | |||||
letter-spacing: 0.64rpx; | letter-spacing: 0.64rpx; | ||||
line-height: 44rpx; | line-height: 44rpx; | ||||
margin-top: 16rpx; | |||||
margin-top: 43rpx; | |||||
font-size: 36rpx; | |||||
color: #000; | |||||
} | } | ||||
.user-avatar{ | |||||
display: block; | |||||
.user-avatar { | |||||
position: absolute; | |||||
left: 30rpx; | |||||
top: 0; | |||||
bottom: 0; | |||||
width: 120rpx; | width: 120rpx; | ||||
height: 120rpx; | height: 120rpx; | ||||
border-radius:16rpx; | |||||
border-radius: 50%; | |||||
overflow: hidden; | overflow: hidden; | ||||
margin: auto; | |||||
} | |||||
.chengzhang { | |||||
font-size: 28rpx; | |||||
color: #999; | |||||
line-height: 40rpx; | |||||
} | |||||
.chengzhang1 { | |||||
position: absolute; | |||||
right: 0; | |||||
bottom: 0; | |||||
top: 32rpx; | |||||
} | |||||
.chengzhang1 text { | |||||
display: block; | |||||
} | |||||
.chengzhang1 image { | |||||
width: 24rpx; | |||||
height: 24rpx; | |||||
vertical-align: top; | |||||
margin-top: 10rpx; | |||||
} | |||||
.chengzhang1 .view { | |||||
font-size: 48rpx; | |||||
color: #01bffe; | |||||
line-height: 67rpx; | |||||
} | |||||
.chengzhang1 text { | |||||
font-size: 24rpx; | |||||
color: #333; | |||||
line-height: 33rpx; | |||||
} | |||||
.bannerbg { | |||||
width: 100%; | |||||
} | |||||
.bannerbg image { | |||||
display: block; | |||||
width: 100%; | |||||
} | } | ||||
.open01 { | .open01 { | ||||
@@ -66,6 +124,7 @@ | |||||
width: 120rpx; | width: 120rpx; | ||||
height: 120rpx; | height: 120rpx; | ||||
} | } | ||||
.user-btns { | .user-btns { | ||||
background: #fff; | background: #fff; | ||||
} | } | ||||
@@ -85,9 +144,10 @@ | |||||
} | } | ||||
.user-btns .user-btn > view:last-child { | .user-btns .user-btn > view:last-child { | ||||
font-size: 28rpx; | |||||
color: #888; | |||||
letter-spacing: 1.16rpx; | |||||
text-align: right; | text-align: right; | ||||
color: #b8b8b8; | |||||
font-size: 24rpx; | |||||
} | } | ||||
.user-btns .user-btn > view:last-child .iconfont { | .user-btns .user-btn > view:last-child .iconfont { | ||||