xt / xcx-book · Commits

Go to a project

Commit 971a4c2c8117e950dfec3bb9647ab1d5cd357830

Authored by vking
2 parents 0e474f01 606445f5
build: skipped

Merge remote-tracking branch 'remotes/origin/master-taocan-share' into master-taocan

Inline Side-by-side
Showing 13 changed files with 584 additions and 139 deletions
  1 +// components/reserve/share/share.js
  2 +import util from '../../../utils/util';
  3 +Component({
  4 + /**
  5 + * 组件的属性列表
  6 + */
  7 + properties: {
  8 + pack:Object,
  9 + },
  10 +
  11 + /**
  12 + * 组件的初始数据
  13 + */
  14 + data: {
  15 + hasShow:false,
  16 + product:null,
  17 + },
  18 + attached: function () {
  19 +
  20 + },
  21 + /**
  22 + * 组件的方法列表
  23 + */
  24 + methods: {
  25 + show(){
  26 + this.setData({
  27 + hasShow:true,
  28 + })
  29 + },
  30 + hide(){
  31 + this.setData({
  32 + hasShow:false,
  33 + })
  34 + },
  35 + shareDo(e){
  36 + this.hide()
  37 + let act=util.attr(e,'act');
  38 + if(!act) return;
  39 + console.log('shareDo.'+act,e);
  40 + wx.navigateTo({
  41 + url:util.http_build_query({
  42 + sid:this.data.pack.sid,
  43 + pid:this.data.pack.id,
  44 + },'/pages/taocan/share')
  45 + })
  46 + },
  47 + }
  48 +})
  1 +{
  2 + "component": true,
  3 + "usingComponents": {
  4 + "share-button": "plugin://haowu/share-button"
  5 + }
  6 +}
  1 +<!--components/reserve/share/share.wxml-->
  2 +<view class="share mask" catchtap="hide" wx:if="{{hasShow}}">
  3 + <view class="share-body" catchtap="catchtap">
  4 + <view class="share-view flex-lr">
  5 + <button class="button-none share-item flex-vc" open-type="share" catchtap="shareDo">
  6 + <image class="share-img wechat"></image>
  7 + <view class="share-name">微信</view>
  8 + </button>
  9 + <view class="share-item flex-vc" catchtap="shareDo" data-act="qrcode">
  10 + <image class="share-img qrcode"></image>
  11 + <view class="share-name">二维码</view>
  12 + </view>
  13 + </view>
  14 + <view class="clean" bindtap="hide">取消</view>
  15 + </view>
  16 +
  17 +</view>
  1 +/* components/reserve/share/share.wxss */
  2 +@import "../../../app.wxss";
  3 +.share-body{
  4 + height: 260rpx;
  5 + width: calc(100% - 100rpx);
  6 + padding: 0 50rpx;
  7 + position: fixed;
  8 + bottom: 0;
  9 +
  10 + height: 390rpx;
  11 + background: #FFFFFF;
  12 + border-radius: 40rpx 40rpx 0px 0px;
  13 +}
  14 +.share-view{
  15 + margin-top: 60rpx;
  16 + margin-bottom: 60rpx;
  17 +}
  18 +.share-img{
  19 + width: 100rpx;
  20 + height: 100rpx;
  21 + background-size: 100% 100%;
  22 +}
  23 +.share-img.wechat{
  24 + background-image: url("http://nosqn.colorcun.com/reserve/share/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_201906251004331.png");
  25 +}
  26 +.share-img.quanzi{
  27 + background-image: url("http://nosqn.colorcun.com/reserve/share/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_20190625100433.png");
  28 +}
  29 +.share-img.qrcode{
  30 + background-image: url("http://nosqn.colorcun.com/reserve/share/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_201906251004332.png");
  31 +}
  32 +.share-img.hwq{
  33 + background-image: url("http://nosqn.colorcun.com/reserve/images/hwq.png");
  34 +}
  35 +.share-name{
  36 + margin-top: 20rpx;
  37 + height: 40rpx;
  38 + font-size: 28rpx;
  39 + font-family: PingFangSC-Regular, PingFang SC;
  40 + font-weight: 400;
  41 + color: #353535;
  42 + line-height: 40rpx;
  43 +}
  44 +.share-item{
  45 + min-width: 50%;
  46 + width: 50%;
  47 +}
  48 +.clean{
  49 + width: 100%;
  50 + height: 80rpx;
  51 + background: #F5F5F5;
  52 + border-radius: 40rpx;
  53 +
  54 + font-size: 34rpx;
  55 + font-family: PingFangSC-Regular, PingFang SC;
  56 + font-weight: 400;
  57 + color: #666666;
  58 + line-height: 80rpx;
  59 +
  60 + text-align: center;
  61 +
  62 +}
@@ -11,6 +11,7 @@ Page({ @@ -11,6 +11,7 @@ Page({
11 activityId:'', 11 activityId:'',
12 packs:{}, 12 packs:{},
13 hasNoSets:false,//没有任何套餐 13 hasNoSets:false,//没有任何套餐
  14 + hasLoading:true,
14 }, 15 },
15 activityId:'', 16 activityId:'',
16 /** 17 /**
@@ -19,44 +20,23 @@ Page({ @@ -19,44 +20,23 @@ Page({
19 * pid 套餐id 20 * pid 套餐id
20 */ 21 */
21 onLoad: function (options) { 22 onLoad: function (options) {
22 - this.activityId=options.pid  
23 - App.Foodset.GetFoodsetList({sid:options.sid}).then(res=>{  
24 - let packs={}  
25 - res.data.some(r=>{  
26 - r.nameSub=r.name.length>6?(r.name.substr(0,6)+'…'):r.name;  
27 - r['包间可用']=r.service.indexOf('包间可用')>-1;  
28 - r['免预约']=r.service.indexOf('免预约')>-1;  
29 - r['随时退']=r.service.indexOf('随时退')>-1;  
30 - r.sid=this.data.sid  
31 - packs[r.id]=r  
32 - })  
33 - while(Object.keys(packs).length<3){  
34 - packs[Math.random()]={}  
35 - }  
36 - try{  
37 - if(!packs[this.activityId]){  
38 - util.toast('套餐已下架','none')  
39 - this.activityId=res.data[0].id  
40 - }  
41 - this.setData({  
42 - packs:packs,  
43 - activityId:this.activityId,  
44 - current:this.getCurrent(this.activityId,packs)  
45 - })  
46 - this.getActivityDetail()  
47 - }catch (e){  
48 - this.setData({  
49 - hasNoSets:true,//没有任何套餐  
50 - });  
51 - }  
52 - }) 23 + this.options=options
  24 + this.taocanInit()
53 }, 25 },
54 26
55 /** 27 /**
56 * 生命周期函数--监听页面初次渲染完成 28 * 生命周期函数--监听页面初次渲染完成
57 */ 29 */
58 onReady: function () { 30 onReady: function () {
59 - 31 + if(wx.getMenuButtonBoundingClientRect){
  32 + let rect=wx.getMenuButtonBoundingClientRect()
  33 + console.log('rect',rect);
  34 + this.setData({
  35 + shareTop:rect.top,
  36 + shareHeight:rect.height,
  37 + shareLeft:rect.left-68,
  38 + })
  39 + }
60 }, 40 },
61 41
62 /** 42 /**
@@ -98,7 +78,81 @@ Page({ @@ -98,7 +78,81 @@ Page({
98 * 用户点击右上角分享 78 * 用户点击右上角分享
99 */ 79 */
100 onShareAppMessage: function () { 80 onShareAppMessage: function () {
  81 + let pack=this.data.packs[this.activityId]
  82 + let path=util.http_build_query({sid:pack.sid,pid:this.activityId,fromid:getApp().openid},'/pages/taocan/index')
  83 + let shareParams={
  84 + title:pack.name||'请客订包间，就上周到安排',
  85 + path:path,
  86 + }
  87 + if(pack.main_url){
  88 + shareParams.imageUrl=pack.main_url+'?imageView2/2/w/450'
  89 + }
  90 + console.log('shareParams==>',shareParams)
  91 + return shareParams
  92 + },
101 93
  94 + async taocanInitScene(){
  95 + if(this.options.scene){
  96 + //解析scene追加到options
  97 + let res=await App.Customer.GetWxLiteCodeInfo({str_code:this.options.scene})
  98 + let scene=JSON.parse(res.data.scene)
  99 + this.options={...this.options,...scene}
  100 + console.log('this.options',this.options)
  101 + }
  102 + //fromid存在则设置推荐关系
  103 + if(this.options.fromid) {
  104 + App.Customer.SetShareRel({
  105 + sid:this.options.sid,
  106 + fid:this.options.pid,
  107 + openid_main:this.options.fromid,
  108 + openid_cover:await getApp().getOpenid(),
  109 + })
  110 + }
  111 + },
  112 + async taocanInit(){
  113 + this.setData({
  114 + hasLoading:true,
  115 + hasLoadTimeout:false,
  116 + })
  117 + await this.taocanInitScene();
  118 + let options=this.options
  119 + this.activityId=options.pid
  120 + App.Foodset.GetFoodsetList({sid:options.sid}).then(res=>{
  121 + let packs={}
  122 + res.data.some(r=>{
  123 + r.nameSub=r.name.length>6?(r.name.substr(0,6)+'…'):r.name;
  124 + r['包间可用']=r.service.indexOf('包间可用')>-1;
  125 + r['免预约']=r.service.indexOf('免预约')>-1;
  126 + r['随时退']=r.service.indexOf('随时退')>-1;
  127 + r.sid=this.data.sid
  128 + packs[r.id]=r
  129 + })
  130 + while(Object.keys(packs).length<3){
  131 + packs[Math.random()]={}
  132 + }
  133 + try{
  134 + if(!packs[this.activityId]){
  135 + util.toast('套餐已下架','none')
  136 + this.activityId=res.data[0].id
  137 + }
  138 + this.setData({
  139 + packs:packs,
  140 + activityId:this.activityId,
  141 + current:this.getCurrent(this.activityId,packs),
  142 + hasLoading:false,
  143 + })
  144 + this.getActivityDetail()
  145 + }catch (e){
  146 + this.setData({
  147 + hasNoSets:true,//没有任何套餐
  148 + hasLoading:false,
  149 + });
  150 + }
  151 + }).catch(()=>{
  152 + this.setData({
  153 + hasLoadTimeout:true,//网络异常
  154 + });
  155 + })
102 }, 156 },
103 getCurrent(id,packs){ 157 getCurrent(id,packs){
104 let ps=Object.keys(packs) 158 let ps=Object.keys(packs)
@@ -178,4 +232,7 @@ Page({ @@ -178,4 +232,7 @@ Page({
178 this.createSaleIng=false 232 this.createSaleIng=false
179 }) 233 })
180 }, 234 },
  235 + share(){
  236 + this.selectComponent('#share').show()
  237 + },
181 }) 238 })
@@ -2,6 +2,7 @@ @@ -2,6 +2,7 @@
2 "navigationBarBackgroundColor": "#ffffff", 2 "navigationBarBackgroundColor": "#ffffff",
3 "navigationBarTextStyle": "black", 3 "navigationBarTextStyle": "black",
4 "usingComponents": { 4 "usingComponents": {
5 - "nav":"/components/nav/nav" 5 + "nav":"/components/nav/nav",
  6 + "share":"/components/2.0/taocan/share"
6 } 7 }
7 } 8 }
1 <!--pages/taocan/index.wxml--> 1 <!--pages/taocan/index.wxml-->
2 <wxs src="../../utils/util.wxs" module="util" /> 2 <wxs src="../../utils/util.wxs" module="util" />
3 -<nav hasHome>套餐详情</nav>  
4 -<!--  
5 -<swiper  
6 - display-multiple-items="3"  
7 - class="view margin-left-lg header text-black"  
8 - bindchange="swiperChange"  
9 - current="{{current}}"  
10 - style="height: 80rpx;">  
11 - <block wx:for="{{packs}}" wx:key="*this">  
12 - <swiper-item  
13 - bindtap="touchTab" data-id="{{item.id}}" data-index="{{index}}"  
14 - class="swiper-item {{activityId==item.id?'active':''}} flex align-center">  
15 - <view class="txt-32-h text-cut" style="width: 220rpx;height: 56rpx;">  
16 - <text class="swiper-item-txt">{{item.name}}</text>  
17 - </view>  
18 - </swiper-item>  
19 - </block>  
20 -</swiper>  
21 --->  
22 -<block wx:if="{{!hasNoSets}}">  
23 - <scroll-view class="view margin-left-lg header text-black"  
24 - scroll-x="true" bindscroll="scroll" scroll-into-view="PID{{activityId}}"  
25 - style="width: 100%;white-space: nowrap;height:80rpx;padding-top: 16rpx;"> 3 +<view class="view flex flex-direction justify-center align-center" style="width: 100vw;height: 100vh;" wx:if="{{hasLoading}}">
  4 + <view class="flex flex-direction justify-center align-center" wx:if="{{hasLoadTimeout}}">
  5 + <image src="http://nosqn.colorcun.com/timeout.png" style="width: 520rpx;height: 348rpx;"></image>
  6 + <view class="margin-tb-lg txt-28-h">请求超时啦～重试一下看看</view>
  7 + <view class="reflush flex justify-center align-center" bindtap="taocanInit">点击重试</view>
  8 + </view>
  9 + <view wx:else="" class="flex flex-direction justify-center align-center">
  10 + <image src="http://nosqn.colorcun.com/loading.gif" style="width: 40rpx;height: 40rpx;"></image>
  11 + <view class="margin-top bg-white txt-24-h">加载中，请稍后…</view>
  12 + </view>
  13 +</view>
  14 +<block wx:else="">
  15 + <nav hasHome>
  16 + <view style="top:{{shareTop}}px;height:{{shareHeight}}px;left:{{shareLeft}}px;"
  17 + catchtap="share"
  18 + class="share view flex align-center justify-center bg-white round">
  19 + <view class="icon view"></view>
  20 + <view class="text margin-left-xs">分享</view>
  21 + </view>
  22 + </nav>
  23 + <!--
  24 + <swiper
  25 + display-multiple-items="3"
  26 + class="view margin-left-lg header text-black"
  27 + bindchange="swiperChange"
  28 + current="{{current}}"
  29 + style="height: 80rpx;">
26 <block wx:for="{{packs}}" wx:key="*this"> 30 <block wx:for="{{packs}}" wx:key="*this">
27 - <view id="PID{{item.id}}"  
28 - bindtap="touchTab" data-id="{{item.id}}" data-index="{{index}}"  
29 - class="view swiper-item {{activityId==item.id?'active':''}} flex align-center">  
30 - <view class="txt-32-h swiper-item-txt">  
31 - {{item.nameSub}} 31 + <swiper-item
  32 + bindtap="touchTab" data-id="{{item.id}}" data-index="{{index}}"
  33 + class="swiper-item {{activityId==item.id?'active':''}} flex align-center">
  34 + <view class="txt-32-h text-cut" style="width: 220rpx;height: 56rpx;">
  35 + <text class="swiper-item-txt">{{item.name}}</text>
32 </view> 36 </view>
33 - </view> 37 + </swiper-item>
34 </block> 38 </block>
35 - </scroll-view>  
36 - <view class="view" style="padding-bottom: 150rpx;padding-top: 80rpx;">  
37 - <view class="view box margin-lr margin-top-lg margin-bottom-sm padding">  
38 - <view class="view txt-40-h text-bold">{{packs[activityId].name}}</view>  
39 - <view class="view flex align-end">  
40 - <view class="text-orange txt-28-h" style="margin-bottom: 4rpx;">¥</view>  
41 - <view class="text-orange txt-44-h margin-right-sm text-bold">{{packs[activityId].sale_price}}</view>  
42 - <view class="huaxian flex align-end">  
43 - <view class="txt-20-h" style="margin-bottom: 8rpx;">¥</view>  
44 - <view class="txt-28-h" style="margin-bottom: 4rpx;">{{packs[activityId].market_price}}</view>  
45 - </view>  
46 - <view class="view flex text-orange align-end margin-left-sm" wx:if="{{packs[activityId].discount>0}}" >  
47 - <view class="view tag" style="margin-bottom: 16rpx;"></view>  
48 - <view class="view margin-left-xs txt-24-h" style="margin-bottom: 10rpx;">{{packs[activityId].discount*10}}折</view>  
49 - </view>  
50 - </view>  
51 - <view class="view flex align-center txt-28-h margin-bottom labels" style="margin-top: 10rpx;">  
52 - <view class="view margin-right flex align-center" wx:if="{{packs[activityId]['包间可用']}}">  
53 - <view class="view icon icon1"></view>  
54 - <view class="view txt-28-h bg-white">包间可用</view>  
55 - </view>  
56 - <view class="view margin-right flex align-center" wx:if="{{packs[activityId]['免预约']}}">  
57 - <view class="view icon icon2"></view>  
58 - <view class="view txt-28-h bg-white">免预约</view> 39 + </swiper>
  40 + -->
  41 + <block wx:if="{{!hasNoSets}}">
  42 + <scroll-view class="view margin-left-lg header text-black"
  43 + scroll-x="true" bindscroll="scroll" scroll-into-view="PID{{activityId}}"
  44 + style="width: 100%;white-space: nowrap;height:80rpx;">
  45 + <block wx:for="{{packs}}" wx:key="*this">
  46 + <view id="PID{{item.id}}"
  47 + bindtap="touchTab" data-id="{{item.id}}" data-index="{{index}}"
  48 + class="view swiper-item {{activityId==item.id?'active':''}} flex align-center">
  49 + <view class="txt-32-h swiper-item-txt">
  50 + {{item.nameSub}}
  51 + </view>
59 </view> 52 </view>
60 - <view class="view margin-right flex align-center" wx:if="{{packs[activityId]['随时退']}}">  
61 - <view class="view icon icon3"></view>  
62 - <view class="view txt-28-h bg-white">随时退</view> 53 + </block>
  54 + </scroll-view>
  55 + <view class="view" style="padding-bottom: 150rpx;padding-top: 80rpx;">
  56 + <view class="view box margin-lr margin-top-lg margin-bottom-sm padding">
  57 + <view class="view text-xxl text-bold">{{packs[activityId].name}}</view>
  58 + <view class="view flex align-end">
  59 + <view class="text-orange txt-28-h" style="margin-bottom: 4rpx;">¥</view>
  60 + <view class="text-orange txt-44-h margin-right-sm text-bold">{{packs[activityId].sale_price}}</view>
  61 + <view class="huaxian flex align-end">
  62 + <view class="txt-20-h" style="margin-bottom: 8rpx;">¥</view>
  63 + <view class="txt-28-h" style="margin-bottom: 4rpx;">{{packs[activityId].market_price}}</view>
  64 + </view>
  65 + <view class="view flex text-orange align-end margin-left-sm" wx:if="{{packs[activityId].discount>0}}" >
  66 + <view class="view tag" style="margin-bottom: 16rpx;"></view>
  67 + <view class="view margin-left-xs txt-24-h" style="margin-bottom: 10rpx;">{{packs[activityId].discount*10}}折</view>
  68 + </view>
63 </view> 69 </view>
64 - </view>  
65 - <image src="{{packs[activityId].detail_url}}" style="width:100%;border-radius: 10rpx;" mode="widthFix"></image>  
66 - </view>  
67 - <view class="view box margin-lr margin-top-sm margin-bottom-sm">  
68 - <view class="txt-30-h padding solid-bottom text-bold">购买须知</view>  
69 - <view class="view padding block">  
70 - <view class="flex align-center margin-bottom-sm">  
71 - <view class="dot"></view>  
72 - <view class="txt-30-h text-bold">有效期</view>  
73 - </view>  
74 - <view class="text-df">{{util.unixtoTime(packs[activityId].eff_time_start,'YYYY.MM.DD')}}-{{util.unixtoTime(packs[activityId].eff_time_end,'YYYY.MM.DD HH:II')}}</view>  
75 - </view>  
76 - <view class="view padding block">  
77 - <view class="flex align-center margin-bottom-sm">  
78 - <view class="dot"></view>  
79 - <view class="txt-30-h text-bold">使用时间</view> 70 + <view class="view flex align-center txt-28-h margin-bottom labels" style="margin-top: 10rpx;">
  71 + <view class="view margin-right flex align-center" wx:if="{{packs[activityId]['包间可用']}}">
  72 + <view class="view icon icon1"></view>
  73 + <view class="view txt-28-h bg-white">包间可用</view>
  74 + </view>
  75 + <view class="view margin-right flex align-center" wx:if="{{packs[activityId]['免预约']}}">
  76 + <view class="view icon icon2"></view>
  77 + <view class="view txt-28-h bg-white">免预约</view>
  78 + </view>
  79 + <view class="view margin-right flex align-center" wx:if="{{packs[activityId]['随时退']}}">
  80 + <view class="view icon icon3"></view>
  81 + <view class="view txt-28-h bg-white">随时退</view>
  82 + </view>
80 </view> 83 </view>
81 - <view class="text-df">{{packs[activityId].use_time}}</view> 84 + <image src="{{packs[activityId].detail_url}}" style="width:100%;border-radius: 10rpx;" mode="widthFix"></image>
82 </view> 85 </view>
83 - <view class="view padding block padding-bottom-sm">  
84 - <view class="flex align-center margin-bottom-sm">  
85 - <view class="dot"></view>  
86 - <view class="txt-30-h text-bold">使用规则</view> 86 + <view class="view box margin-lr margin-top-sm margin-bottom-sm">
  87 + <view class="txt-30-h padding solid-bottom text-bold">购买须知</view>
  88 + <view class="view padding block">
  89 + <view class="flex align-center margin-bottom-sm">
  90 + <view class="dot"></view>
  91 + <view class="txt-30-h text-bold">有效期</view>
  92 + </view>
  93 + <view class="text-df">{{util.unixtoTime(packs[activityId].eff_time_start,'YYYY.MM.DD')}}-{{util.unixtoTime(packs[activityId].eff_time_end,'YYYY.MM.DD HH:II')}}</view>
87 </view> 94 </view>
88 - <view class="text-df" wx:if="{{hasShowRule}}">  
89 - <text style="line-height: 40rpx;">{{packs[activityId].use_notice}}</text> 95 + <view class="view padding block">
  96 + <view class="flex align-center margin-bottom-sm">
  97 + <view class="dot"></view>
  98 + <view class="txt-30-h text-bold">使用时间</view>
  99 + </view>
  100 + <view class="text-df">{{packs[activityId].use_time}}</view>
90 </view> 101 </view>
91 - <view class="flex justify-center align-center rule margin-top-sm margin-bottom-sm" bindtap="toggleRule">  
92 - <view class="txt-28-h">{{hasShowRule?'收起':'展开更多'}}</view>  
93 - <view class="view icon {{hasShowRule?'show':''}}"></view> 102 + <view class="view padding block padding-bottom-sm">
  103 + <view class="flex align-center margin-bottom-sm">
  104 + <view class="dot"></view>
  105 + <view class="txt-30-h text-bold">使用规则</view>
  106 + </view>
  107 + <view class="text-df" wx:if="{{hasShowRule}}">
  108 + <text style="line-height: 40rpx;">{{packs[activityId].use_notice}}</text>
  109 + </view>
  110 + <view class="flex justify-center align-center rule margin-top-sm margin-bottom-sm" bindtap="toggleRule">
  111 + <view class="txt-28-h">{{hasShowRule?'收起':'展开更多'}}</view>
  112 + <view class="view icon {{hasShowRule?'show':''}}"></view>
  113 + </view>
94 </view> 114 </view>
95 </view> 115 </view>
96 </view> 116 </view>
97 - </view>  
98 - <view class="view bottom flex align-center justify-between padding-right">  
99 - <view class="view flex justify-center align-center flex-treble ">  
100 - <view class="view flex align-end">  
101 - <view class="text-orange txt-40-h" style="margin-bottom: 4rpx;">¥</view>  
102 - <view class="text-orange txt-52-h margin-right-sm text-bold">{{packs[activityId].sale_price}}</view>  
103 - </view>  
104 - <view class="view flex flex-direction justify-center align-start">  
105 - <view class="view flex text-orange align-center" wx:if="{{packs[activityId].discount>0}}">  
106 - <view class="view tag"></view>  
107 - <view class="view margin-left-xs txt-24-h">{{packs[activityId].discount*10}}折</view> 117 + <view class="view bottom flex align-center justify-between padding-right">
  118 + <view class="view flex justify-center align-center flex-treble ">
  119 + <view class="view flex align-end">
  120 + <view class="text-orange txt-40-h" style="margin-bottom: 4rpx;">¥</view>
  121 + <view class="text-orange txt-52-h margin-right-sm text-bold">{{packs[activityId].sale_price}}</view>
108 </view> 122 </view>
109 - <view class="huaxian flex align-end">  
110 - <view class="txt-24-h" style="margin-bottom: 2rpx;">¥</view>  
111 - <view class="txt-32-h">{{packs[activityId].market_price}}</view> 123 + <view class="view flex flex-direction justify-center align-start">
  124 + <view class="view flex text-orange align-center" wx:if="{{packs[activityId].discount>0}}">
  125 + <view class="view tag"></view>
  126 + <view class="view margin-left-xs txt-24-h">{{packs[activityId].discount*10}}折</view>
  127 + </view>
  128 + <view class="huaxian flex align-end">
  129 + <view class="txt-24-h" style="margin-bottom: 2rpx;">¥</view>
  130 + <view class="txt-32-h">{{packs[activityId].market_price}}</view>
  131 + </view>
112 </view> 132 </view>
113 </view> 133 </view>
  134 + <view class="flex justify-end" bindtap="createSale">
  135 + <view class="buyButton txt-36-h text-bold flex align-center justify-center bg-blue-blue">立即抢购</view>
  136 + </view>
114 </view> 137 </view>
115 - <view class="flex justify-end" bindtap="createSale">  
116 - <view class="buyButton txt-36-h text-bold flex align-center justify-center bg-blue-blue">立即抢购</view>  
117 - </view> 138 + </block>
  139 + <view wx:else=""
  140 + style="padding-top: 172rpx;"
  141 + class="flex flex-direction justify-start align-center">
  142 + <image src="http://nosqn.colorcun.com/taocan/1%20%2827%29.png"
  143 + style="width: 520rpx;height: 348rpx;"></image>
  144 + <view class="txt-28-h margin-top-lg">该套餐过期啦</view>
118 </view> 145 </view>
  146 + <share id="share" pack="{{packs[activityId]}}" wx:if="{{packs[activityId].id}}"></share>
119 </block> 147 </block>
120 -<view wx:else=""  
121 - style="padding-top: 172rpx;"  
122 - class="flex flex-direction justify-start align-center">  
123 - <image src="http://nosqn.colorcun.com/taocan/1%20%2827%29.png"  
124 - style="width: 520rpx;height: 348rpx;"></image>  
125 - <view class="txt-28-h margin-top-lg">该套餐过期啦</view>  
126 -</view> 148 +
127 149
@@ -99,4 +99,37 @@ @@ -99,4 +99,37 @@
99 background: linear-gradient(90deg, #3BBFF5 0%, #57A0FF 100%); 99 background: linear-gradient(90deg, #3BBFF5 0%, #57A0FF 100%);
100 border-radius: 42rpx; 100 border-radius: 42rpx;
101 101
  102 +}
  103 +.share{
  104 + position: fixed;
  105 + width: 63px;
  106 + height: 64rpx;
  107 + background: rgba(255, 255, 255, 0.6);
  108 + border-radius: 32rpx;
  109 + border: 1rpx solid rgba(151, 151, 151, 0.2);
  110 +}
  111 +.share .icon{
  112 + background-image: url("http://nosqn.colorcun.com/taocan/1%20%2828%29.png");
  113 + width: 24rpx;
  114 + height: 24rpx;
  115 +}
  116 +.share .text{
  117 + height: 36rpx;
  118 + font-size: 26rpx;
  119 + font-family: PingFangSC-Regular, PingFang SC;
  120 + font-weight: 400;
  121 + color: #333333;
  122 + line-height: 36rpx;
  123 +}
  124 +.reflush{
  125 + width: 152rpx;
  126 + height: 56rpx;
  127 + background: #42A5FF;
  128 + border-radius: 28rpx;
  129 +
  130 + font-size: 28rpx;
  131 + font-family: PingFangSC-Regular, PingFang SC;
  132 + font-weight: 400;
  133 + color: #FFFFFF;
  134 + line-height: 40rpx;
102 } 135 }
  1 +// pages/reserve/share.js
  2 +import util from '../../utils/util';
  3 +import App from '../../utils/api';
  4 +const {regeneratorRuntime} = global
  5 +Page({
  6 +
  7 + /**
  8 + * 页面的初始数据
  9 + */
  10 + data: {
  11 + paletteImageSrc:'',
  12 + palette:null,
  13 + hasLoadData:true,
  14 + },
  15 + /**
  16 + * 生命周期函数--监听页面加载
  17 + */
  18 + onLoad: function (options) {
  19 + this.options=options;
  20 + this.setQrcode();
  21 + },
  22 +
  23 + /**
  24 + * 生命周期函数--监听页面初次渲染完成
  25 + */
  26 + onReady: function () {
  27 +
  28 + },
  29 +
  30 + /**
  31 + * 生命周期函数--监听页面显示
  32 + */
  33 + onShow: function () {
  34 +
  35 + },
  36 +
  37 + /**
  38 + * 生命周期函数--监听页面隐藏
  39 + */
  40 + onHide: function () {
  41 +
  42 + },
  43 +
  44 + /**
  45 + * 生命周期函数--监听页面卸载
  46 + */
  47 + onUnload: function () {
  48 +
  49 + },
  50 +
  51 + /**
  52 + * 页面相关事件处理函数--监听用户下拉动作
  53 + */
  54 + onPullDownRefresh: function () {
  55 +
  56 + },
  57 +
  58 + /**
  59 + * 页面上拉触底事件的处理函数
  60 + */
  61 + onReachBottom: function () {
  62 +
  63 + },
  64 + async setQrcode(){
  65 + let options=this.options
  66 + let openid=await getApp().getOpenid()
  67 + this.qrcode=await util.http_build_query({
  68 + page:'pages/taocan/index',
  69 + path:'pages/taocan/index',
  70 + scene:JSON.stringify({
  71 + sid:options.sid,
  72 + pid:options.pid,
  73 + fromid:openid,
  74 + })
  75 + },util.cgi('App.Customer.GetWxLiteCodeByShare'))
  76 + this.initImage()
  77 + },
  78 + initImage(){
  79 + let palette={
  80 + background: '#fff',
  81 + width: '400rpx',
  82 + height: '400rpx',
  83 + views: [
  84 + {
  85 + type: 'image',
  86 + url: this.qrcode,
  87 + css: {
  88 + mode:'scaleToFill',
  89 + width: '400rpx',
  90 + height: '400rpx',
  91 + },
  92 + }
  93 + ],
  94 + }
  95 + this.setData({
  96 + palette:palette
  97 + })
  98 + },
  99 + onImgOK(e){
  100 + console.log('onImgOK',e.detail.path)
  101 + wx.getImageInfo({
  102 + src:e.detail.path,
  103 + success:res=>{
  104 + let w=getApp().system.windowWidth
  105 + console.log('getImageInfo',res)
  106 + this.setData({
  107 + paletteImageWidth:w,
  108 + paletteImageHeight:w/res.width*res.height,
  109 + paletteImageSrc:e.detail.path,
  110 + })
  111 + }
  112 + })
  113 + },
  114 + reviewImage(){
  115 + wx.previewImage({
  116 + urls:[this.data.paletteImageSrc],
  117 + })
  118 + },
  119 +})
  1 +{
  2 + "navigationBarBackgroundColor": "#ffffff",
  3 + "navigationBarTextStyle": "black",
  4 + "navigationBarTitleText":"周到安排",
  5 + "usingComponents": {
  6 + "nav":"/components/nav/nav",
  7 + "painter":"/components/painter/painter",
  8 + "savefile":"/components/userinfo/savefile"
  9 + }
  10 +}
  1 +<!--pages/reserve/share.wxml-->
  2 +<nav>{{actType=='quanzi'?'分享图':'二维码下载'}}</nav>
  3 +<loading wx:if="{{!hasLoadData || !paletteImageSrc}}">图片生成中</loading>
  4 +<view wx:if="{{hasLoadData}}" style="position: fixed;top:-9999rpx;">
  5 + <painter palette="{{palette}}" bind:imgOK="onImgOK" bind:imgErr="onImgOK"/>
  6 +</view>
  7 +<view wx:if="{{paletteImageSrc}}" class="pages">
  8 + <view class="pages-view flex-vc" wx:if="{{actType=='quanzi'}}">
  9 + <image src="{{paletteImageSrc}}"
  10 + bindtap="reviewImage"
  11 + style="width:{{paletteImageWidth}}px;height:{{paletteImageHeight}}px;"></image>
  12 + </view>
  13 + <view class="pages-view flex-vc" wx:else="">
  14 + <image src="{{paletteImageSrc}}"
  15 + bindtap="reviewImage"
  16 + style="width:400rpx;height:400rpx; margin-top: 90rpx;"></image>
  17 + <view class="qrcode-text">{{seller.sellername}}</view>
  18 + </view>
  19 + <view class="save flex-vc">
  20 + <savefile filePath="{{paletteImageSrc}}" style="width: 100%">
  21 + <view class="save-but flex-cc">
  22 + 保存到相册
  23 + </view>
  24 + </savefile>
  25 + </view>
  26 +</view>
  27 +
  1 +/* pages/reserve/share.wxss */
  2 +page{
  3 + background-color: #fefefe;
  4 +}
  5 +.pages{
  6 + padding-bottom: 100rpx;
  7 + width: 100%;
  8 + padding-top: 0rpx;
  9 + background-size: 100% 100%;
  10 +}
  11 +.pages-view{
  12 + width: 100%;
  13 + margin: 0 auto;
  14 +}
  15 +.save{
  16 + position: fixed;
  17 + bottom: 40rpx;
  18 + width: calc(100% - 80rpx);
  19 + left:40rpx;
  20 +}
  21 +.save-but{
  22 + width: 100%;
  23 + height: 84rpx;
  24 + background: linear-gradient(90deg, #3BBFF5 0%, #57A0FF 100%);
  25 + border-radius: 42rpx;
  26 +
  27 + font-size: 36rpx;
  28 + font-family: PingFangSC-Semibold, PingFang SC;
  29 + font-weight: 600;
  30 + color: #FFFFFF;
  31 + line-height: 84rpx;
  32 +}
  33 +.qrcode-text{
  34 + font-size: 34rpx;
  35 + margin-top: 40rpx;
  36 + margin-bottom: 90rpx;
  37 +}
@@ -520,6 +520,12 @@ export default { @@ -520,6 +520,12 @@ export default {
520 //根据账单ID获取账单详情 520 //根据账单ID获取账单详情
521 'App.Foodset.GetFoodOrdersDetail':null, 521 'App.Foodset.GetFoodOrdersDetail':null,
522 522
  523 + //根据唯一code获取相关参数
  524 + 'App.Customer.GetWxLiteCodeInfo':null,
  525 +
  526 + //分享关系记录
  527 + 'App.Customer.SetShareRel':null,
  528 +
523 //获取商家优惠对接人信息 529 //获取商家优惠对接人信息
524 'App.Customer.GetSellerPreferentialDocking':null, 530 'App.Customer.GetSellerPreferentialDocking':null,
525 //接单人，获得商家设置的接单人列表 531 //接单人，获得商家设置的接单人列表