Browse Source

[商户详情][新增][分享]

tags/江西版6.1.0
luqc 6 years ago
parent
commit
b083288fbb
8 changed files with 182 additions and 41 deletions
  1. BIN
      assets/images/picture.png
  2. BIN
      assets/images/wechat.png
  3. +37
    -2
      components/merchantcoupons/index.wxml
  4. +5
    -0
      components/merchantcoupons/index.wxss
  5. +26
    -4
      pages/index/detail/index.js
  6. +1
    -1
      pages/index/detail/index.json
  7. +50
    -32
      pages/index/detail/index.wxml
  8. +63
    -2
      pages/index/detail/index.wxss

BIN
assets/images/picture.png View File

Before After
Width: 200  |  Height: 200  |  Size: 3.3 KiB

BIN
assets/images/wechat.png View File

Before After
Width: 200  |  Height: 200  |  Size: 6.7 KiB

+ 37
- 2
components/merchantcoupons/index.wxml View File

@@ -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">
<image src="{{data.coverImg}}" mode='aspectFill' lazy-load="true"></image>
</view>


+ 5
- 0
components/merchantcoupons/index.wxss View File

@@ -257,3 +257,8 @@ navigator{
navigator:nth-of-type(2n+1){
margin-right: 10rpx;
}
/* 限时抢购样式 */
.xianshicoupons{
width: 100%;
position: relative
}

+ 26
- 4
pages/index/detail/index.js View File

@@ -10,12 +10,14 @@ Page({
data: {
teljpgUrl: imgurl.teljpg.url,
share01: imgurl.share01.url,
actUrl: imgurl.act.url,
page: 1,
imglist:null,
shopVoList:[],
couponList:[],//活动劵列表
data:{
currentTab: 0
currentTab: 0,
isshare:false
},
id:null
},
@@ -31,6 +33,9 @@ Page({
});
that.getList(options.id);
that.getCouponList(options.id);
this.setData({
currentTab: 0
})
}
},
/**
@@ -41,6 +46,22 @@ Page({
wx.makePhoneCall({
phoneNumber: e.target.dataset.merchantlinkphone
});
},
/**
* 显示分享弹框
*/
showshare:function(){
this.setData({
isshare:true,
})
},
/**
* 隐藏分享弹框
*/
hidemodal:function(){
this.setData({
isshare: false,
})
},
//滑动切换
swiperTabView: function (e) {
@@ -132,7 +153,8 @@ Page({
onHide: function () {

},
onShareAppMessage: function (options) {
onShareAppMessage: function (res) {
debugger
var that = this;
var shareObj = {
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


+ 1
- 1
pages/index/detail/index.json View File

@@ -4,6 +4,6 @@
"enablePullDownRefresh": true,
"usingComponents": {
"c-banner": "../../../components/banner/index",
"c-coupons": "../../../components/coupons/index"
"c-coupons": "../../../components/merchantcoupons/index"
}
}

+ 50
- 32
pages/index/detail/index.wxml View File

@@ -3,7 +3,7 @@
<swiper class="index-slide" autoplay="true" circular="false">
<block wx:for="{{imglist}}" wx:key="unique">
<swiper-item>
<image src="{{item}}" class="index-slide-image" mode='widthFix'/>
<image src="{{item}}" class="index-slide-image" mode='widthFix' />
</swiper-item>
</block>
</swiper>
@@ -17,10 +17,10 @@
<text>{{data.merchantName}}</text>
<text>{{data.title}}</text>
</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>
<!-- 一个商铺 -->
<!-- 多个商铺 -->
@@ -48,37 +48,55 @@
</view>
<!-- 商户简介 -->
<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>
    </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>
<!--   </swiper> -->
<view class='merchant-info'>
<view hidden='currentTabsIndex!=0'>
<text wx:if="{{data.summary}}">{{data.summary}}</text>
</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>

+ 63
- 2
pages/index/detail/index.wxss View File

@@ -164,12 +164,12 @@
flex-flow: row;
height: 88rpx;
line-height: 88rpx;
margin-left: -30rpx;
margin-bottom: 20rpx;
}
.swiper-tab-item {
color: #434343;
font-size: 30rpx;
margin-right:30rpx;
margin-right:50rpx;
}
.active-tab {
color: #1693FC;
@@ -188,6 +188,18 @@
top: 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{
width: 335rpx;
@@ -205,4 +217,53 @@
height: 60rpx;
vertical-align: middle;
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;
}

Loading…
Cancel
Save