@@ -1,6 +1,41 @@ | |||||
<navigator url="/pages/coupon/detail/index?couponChannelId={{data.id}}&couponId={{data.couponId}}&title={{data.title}}"> | |||||
<navigator url="/pages/coupon/detail/index?couponChannelId={{data.couponChannelId}}&couponId={{data.couponId}}&title={{data.title}}"> | |||||
<!-- 首页优惠券列表页面 --> | <!-- 首页优惠券列表页面 --> | ||||
<view class="coupons"> | |||||
<view class="coupons" wx:if="{{data.targetAd!=2}}"> | |||||
<view class="coupons-img"> | |||||
<image src="{{data.coverImg}}" mode='aspectFill' lazy-load="true"></image> | |||||
</view> | |||||
<view class="coupons-info"> | |||||
<view class="coupons-info-name tit">{{data.title}}</view> | |||||
<view class="coupons-info-name subtitle">{{data.subTitle}}</view> | |||||
<view class="coupons-info-price-p"> | |||||
<view class='price'> | |||||
<text>{{data.salePriceStr}}<text style="font-size:24rpx;display:inline-block;margin-right:10rpx;font-weight:400;">元</text></text> | |||||
<view class="coupons-info-manjian" style="margin-top:10rpx;" wx:if="{{data.type == 1}}"> | |||||
<view class='view01' wx:if="{{data.unit==0}}">{{data.priceStr}}元</view> | |||||
<view wx:if="{{data.unit==1}}">{{data.priceStr}}小时</view> | |||||
<!-- <text class='txt2'>满{{data.usePriceStr}}元可用</text> --> | |||||
</view> | |||||
<view class="coupons-info-manjian" wx:elif="{{data.type == 2||data.type == 3||data.type==4||data.type==5}}"> | |||||
<text class='view01' wx:if="{{data.unit==0}}">{{data.priceStr}}元</text> | |||||
<text wx:if="{{data.unit==1}}">{{data.priceStr}}小时</text> | |||||
<!-- <text class='txt2'>仅限本店使用</text> --> | |||||
</view> | |||||
</view> | |||||
<!-- <view class="coupons-info-manjian1" wx:if="{{data.merchantVoList.length==1}}">{{data.merchantVoList[0].merchantName}}</view> | |||||
<view class="coupons-info-manjian1" wx:if="{{data.merchantVoList.length>1}}">多商户通用</view> --> | |||||
</view> | |||||
</view> | |||||
<view class="coupons-btn"> | |||||
<!-- 优惠券价格 --> | |||||
<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-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> | |||||
<i-button i-class="coupons-btn-gms" wx:if="{{data.status==1}}" data-date='{{data}}'>已下架</i-button> | |||||
</view> | |||||
<!-- <view class="coupons-info-name sy">剩余{{data.remainInventory}}</view> --> | |||||
</view> | |||||
<!-- 限时抢购 --> | |||||
<view class="xianshicoupons" wx:else> | |||||
<view class="coupons-img"> | <view class="coupons-img"> | ||||
<image src="{{data.coverImg}}" mode='aspectFill' lazy-load="true"></image> | <image src="{{data.coverImg}}" mode='aspectFill' lazy-load="true"></image> | ||||
</view> | </view> | ||||
@@ -257,3 +257,8 @@ navigator{ | |||||
navigator:nth-of-type(2n+1){ | navigator:nth-of-type(2n+1){ | ||||
margin-right: 10rpx; | margin-right: 10rpx; | ||||
} | } | ||||
/* 限时抢购样式 */ | |||||
.xianshicoupons{ | |||||
width: 100%; | |||||
position: relative | |||||
} |
@@ -10,12 +10,14 @@ Page({ | |||||
data: { | data: { | ||||
teljpgUrl: imgurl.teljpg.url, | teljpgUrl: imgurl.teljpg.url, | ||||
share01: imgurl.share01.url, | share01: imgurl.share01.url, | ||||
actUrl: imgurl.act.url, | |||||
page: 1, | page: 1, | ||||
imglist:null, | imglist:null, | ||||
shopVoList:[], | shopVoList:[], | ||||
couponList:[],//活动劵列表 | couponList:[],//活动劵列表 | ||||
data:{ | data:{ | ||||
currentTab: 0 | |||||
currentTab: 0, | |||||
isshare:false | |||||
}, | }, | ||||
id:null | id:null | ||||
}, | }, | ||||
@@ -31,6 +33,9 @@ Page({ | |||||
}); | }); | ||||
that.getList(options.id); | that.getList(options.id); | ||||
that.getCouponList(options.id); | that.getCouponList(options.id); | ||||
this.setData({ | |||||
currentTab: 0 | |||||
}) | |||||
} | } | ||||
}, | }, | ||||
/** | /** | ||||
@@ -41,6 +46,22 @@ Page({ | |||||
wx.makePhoneCall({ | wx.makePhoneCall({ | ||||
phoneNumber: e.target.dataset.merchantlinkphone | phoneNumber: e.target.dataset.merchantlinkphone | ||||
}); | }); | ||||
}, | |||||
/** | |||||
* 显示分享弹框 | |||||
*/ | |||||
showshare:function(){ | |||||
this.setData({ | |||||
isshare:true, | |||||
}) | |||||
}, | |||||
/** | |||||
* 隐藏分享弹框 | |||||
*/ | |||||
hidemodal:function(){ | |||||
this.setData({ | |||||
isshare: false, | |||||
}) | |||||
}, | }, | ||||
//滑动切换 | //滑动切换 | ||||
swiperTabView: function (e) { | swiperTabView: function (e) { | ||||
@@ -132,7 +153,8 @@ Page({ | |||||
onHide: function () { | onHide: function () { | ||||
}, | }, | ||||
onShareAppMessage: function (options) { | |||||
onShareAppMessage: function (res) { | |||||
debugger | |||||
var that = this; | var that = this; | ||||
var shareObj = { | var shareObj = { | ||||
title: that.data.data.title, | title: that.data.data.title, | ||||
@@ -145,8 +167,8 @@ Page({ | |||||
} | } | ||||
}; | }; | ||||
// 来自页面内的按钮的转发 | // 来自页面内的按钮的转发 | ||||
if (options.from == 'button') { | |||||
var eData = options.target.dataset.id; | |||||
if (res.from === 'button') { | |||||
var eData = res.target.dataset.id; | |||||
shareObj.path = `/pages/index/index?couponChannelId=${eData}`; | shareObj.path = `/pages/index/index?couponChannelId=${eData}`; | ||||
} | } | ||||
// 返回shareObj | // 返回shareObj | ||||
@@ -4,6 +4,6 @@ | |||||
"enablePullDownRefresh": true, | "enablePullDownRefresh": true, | ||||
"usingComponents": { | "usingComponents": { | ||||
"c-banner": "../../../components/banner/index", | "c-banner": "../../../components/banner/index", | ||||
"c-coupons": "../../../components/coupons/index" | |||||
"c-coupons": "../../../components/merchantcoupons/index" | |||||
} | } | ||||
} | } |
@@ -3,7 +3,7 @@ | |||||
<swiper class="index-slide" autoplay="true" circular="false"> | <swiper class="index-slide" autoplay="true" circular="false"> | ||||
<block wx:for="{{imglist}}" wx:key="unique"> | <block wx:for="{{imglist}}" wx:key="unique"> | ||||
<swiper-item> | <swiper-item> | ||||
<image src="{{item}}" class="index-slide-image" mode='widthFix'/> | |||||
<image src="{{item}}" class="index-slide-image" mode='widthFix' /> | |||||
</swiper-item> | </swiper-item> | ||||
</block> | </block> | ||||
</swiper> | </swiper> | ||||
@@ -17,10 +17,10 @@ | |||||
<text>{{data.merchantName}}</text> | <text>{{data.merchantName}}</text> | ||||
<text>{{data.title}}</text> | <text>{{data.title}}</text> | ||||
</view> | </view> | ||||
<view class='fenxiang' wx:if="{{data.type!=50&&data.type!=51}}"> | |||||
<image class="fenxiang" src='{{share01}}' mode="widthFix"></image> | |||||
<button class='share user-motto' data-id='{{data.id}}' data-couponId='{{data.couponId}}' data-title='{{data.title}}' id="shareBtn" open-type="share" hover-class="other-button-hover"></button> | |||||
</view> | |||||
<view class='fenxiang' wx:if="{{data.type!=50&&data.type!=51}}" bindtap='showshare'> | |||||
<image class="fenxiang" src='{{share01}}' mode="widthFix"></image> | |||||
</view> | |||||
</view> | </view> | ||||
<!-- 一个商铺 --> | <!-- 一个商铺 --> | ||||
<!-- 多个商铺 --> | <!-- 多个商铺 --> | ||||
@@ -48,37 +48,55 @@ | |||||
</view> | </view> | ||||
<!-- 商户简介 --> | <!-- 商户简介 --> | ||||
<view class='merchant-phones'> | <view class='merchant-phones'> | ||||
<view class="swiper-tab"> | |||||
<view class="swiper-tab-item {{currentTab==0?'active-tab':''}}" data-current="0" bindtap="clickTab">优惠信息</view> | |||||
<view class="swiper-tab-item {{currentTab==1?'active-tab':''}}" data-current="1" bindtap="clickTab">商家简介</view> | |||||
</view> | |||||
<swiper current="{{currentTab}}" duration="300" bindchange="swiperTabView"> | |||||
<!-- 商户对应的活动 --> | |||||
<swiper-item> | |||||
<view class='coupons clearfix'> | |||||
<c-coupons wx:if="{{couponList.length!=0}}" wx:for="{{couponList}}" paramAtoB="{{loading}}" wx:key="unique" data="{{item}}" list="{{couponList}}" /> | |||||
</view> | |||||
<view class='dingdan' wx:if="{{list.length==0}}"> | |||||
<image src="{{actUrl}}" mode="widthFix"></image> | |||||
<text>请您敬请期待</text> | |||||
<text>我们正在筹备一大波优惠活动</text> | |||||
</view> | |||||
<view class="loading" wx:if="{{loading}}"><image src="{{loadingUrl}}" mode="widthFix"></image>{{content}}</view> | |||||
<view class='loadingtext' wx:if="{{loadingtext}}">{{loadingtext}}</view> | |||||
</swiper-item> | |||||
<swiper-item> | |||||
<view> | |||||
<text wx:if="{{data.summary}}">{{data.summary}}</text> | |||||
<text wx:else>{{"信息完善中,敬请期待。"}}</text> | |||||
<view class="swiper-tab"> | |||||
<view class="swiper-tab-item {{currentTab==0?'active-tab':''}}" data-current="0" bindtap="clickTab">优惠信息</view> | |||||
<view class="swiper-tab-item {{currentTab==1?'active-tab':''}}" data-current="1" bindtap="clickTab">商家简介</view> | |||||
</view> | </view> | ||||
</swiper-item> | |||||
</swiper> | |||||
<view class='merchant-info'> | |||||
<view hidden='currentTabsIndex!=0'> | |||||
<text wx:if="{{data.summary}}">{{data.summary}}</text> | |||||
<!-- <swiper current="{{currentTab}}" duration="300" bindchange="swiperTabView"> --> | |||||
<view class='swiperactive'> | |||||
<!-- 商户对应的活动 --> | |||||
<view wx:if="{{currentTab==0}}"> | |||||
<view class='coupons clearfix'> | |||||
<c-coupons wx:if="{{couponList.length!=0}}" wx:for="{{couponList}}" paramAtoB="{{loading}}" wx:key="unique" data="{{item}}" list="{{couponList}}" /> | |||||
</view> | |||||
<view class='dingdan' wx:if="{{couponList.length==0}}"> | |||||
<image src="{{actUrl}}" mode="widthFix"></image> | |||||
<text>请您敬请期待</text> | |||||
<text>我们正在筹备一大波优惠活动</text> | |||||
</view> | |||||
<view class="loading" wx:if="{{loading}}"> | |||||
<image src="{{loadingUrl}}" mode="widthFix"></image>{{content}}</view> | |||||
<view class='loadingtext' wx:if="{{loadingtext}}">{{loadingtext}}</view> | |||||
</view> | |||||
<!-- 商户简介 --> | |||||
<view wx:elif="{{currentTab==1}}"> | |||||
<text wx:if="{{data.summary}}">{{data.summary}}</text> | |||||
<text wx:else>{{"信息完善中,敬请期待。"}}</text> </view> | |||||
</view> | </view> | ||||
<!-- </swiper> --> | |||||
<view class='merchant-info'> | |||||
<view hidden='currentTabsIndex!=0'> | |||||
<text wx:if="{{data.summary}}">{{data.summary}}</text> | |||||
</view> | |||||
</view> | </view> | ||||
</view> | </view> | ||||
<!-- 分享弹框 --> | |||||
<view class='modal' wx:if="{{isshare}}" bindtap='hidemodal'> | |||||
<view class='modal-content'> | |||||
<view> | |||||
<button class='share user-motto' data-id='{{data.id}}' data-couponId='{{data.couponId}}' data-title='{{data.title}}' id="shareBtn" open-type="share" hover-class="other-button-hover"></button> | |||||
<image src='./../../../assets/images/wechat.png' mode='aspectFit'></image> | |||||
<text>微信好友</text> | |||||
</view> | |||||
<view> | |||||
<image src='./../../../assets/images/picture.png' mode='aspectFit'></image> | |||||
<text>生成海报</text> | |||||
</view> | |||||
</view> | |||||
</view> | |||||
</view> | </view> | ||||
</view> | </view> |
@@ -164,12 +164,12 @@ | |||||
flex-flow: row; | flex-flow: row; | ||||
height: 88rpx; | height: 88rpx; | ||||
line-height: 88rpx; | line-height: 88rpx; | ||||
margin-left: -30rpx; | |||||
margin-bottom: 20rpx; | |||||
} | } | ||||
.swiper-tab-item { | .swiper-tab-item { | ||||
color: #434343; | color: #434343; | ||||
font-size: 30rpx; | font-size: 30rpx; | ||||
margin-right:30rpx; | |||||
margin-right:50rpx; | |||||
} | } | ||||
.active-tab { | .active-tab { | ||||
color: #1693FC; | color: #1693FC; | ||||
@@ -188,6 +188,18 @@ | |||||
top: 0; | top: 0; | ||||
right: 0; | right: 0; | ||||
} | } | ||||
.user-motto { | |||||
width:270rpx; | |||||
border:0; | |||||
background:none; | |||||
height:260rpx; | |||||
color:#fff; | |||||
position:fixed; | |||||
} | |||||
.user-motto::after { | |||||
border: none; | |||||
} | |||||
/* 商户活动列表 */ | /* 商户活动列表 */ | ||||
.coupons c-coupons{ | .coupons c-coupons{ | ||||
width: 335rpx; | width: 335rpx; | ||||
@@ -205,4 +217,53 @@ | |||||
height: 60rpx; | height: 60rpx; | ||||
vertical-align: middle; | vertical-align: middle; | ||||
margin-right: 10rpx; | margin-right: 10rpx; | ||||
} | |||||
.dingdan text{ | |||||
display: block; | |||||
text-align: center; | |||||
} | |||||
.swiperactive{ | |||||
min-height: 300rpx; | |||||
} | |||||
/* modal */ | |||||
.modal{ | |||||
width: 100%; | |||||
height: 100%; | |||||
position: fixed; | |||||
top: 0; | |||||
left: 0; | |||||
background: rgba(0,0,0,0.5); | |||||
overflow: hidden; | |||||
z-index: 10; | |||||
color: #fff; | |||||
} | |||||
.modal-content{ | |||||
width: 540rpx; | |||||
height: 260rpx; | |||||
line-height: 60rpx; | |||||
overflow: hidden; | |||||
position: fixed; | |||||
top: 50%; | |||||
left: 0; | |||||
z-index: 11; | |||||
background: #f9f9f9; | |||||
margin: -130rpx 105rpx; | |||||
border-radius: 36rpx; | |||||
display: flex; | |||||
} | |||||
.modal-content view{ | |||||
display: inline-block; | |||||
flex: 1; | |||||
text-align: center; | |||||
} | |||||
.modal-content view>text{ | |||||
color: #000; | |||||
display: block; | |||||
height: 80rpx; | |||||
line-height: 80rpx; | |||||
} | |||||
.modal-content view>image{ | |||||
margin-top: 30rpx; | |||||
width: 100rpx; | |||||
height: 100rpx; | |||||
} | } |