当前位置:   article > 正文

微信小程序优惠券的购买和核销的操作流程设计_java 微信小程序对接核销美团券

java 微信小程序对接核销美团券

商家优惠券、套餐券的购买和核销的操作流程设计

一 . 用户端操作流程

在这里插入图片描述

二 . 商家端操作流程

在这里插入图片描述

做了个演示小程序, 请扫码查看, 问题交流微信:hype522147

在这里插入图片描述

首页前端代码和效果, 需要代码的联系我就行
<view style="margin:23.4rpx 23.4rpx 0 23.4rpx;">
    <view style="margin-bottom: 23.4rpx; color: #4b4a49;">
    <block wx:for="{{navlist}}">
      <view  class="nav" bindtap="setcid" data-id="{{item.id}}">
      <image src="{{item.url}}" style="width: 60%;"  mode="widthFix"></image>
      <view>{{item.title}}</view>
      </view>
    </block>
      <view style="clear:both"></view>
    </view>

      <swiper indicator-dots="{{indicatorDots}}"
        autoplay="{{autoplay}}" interval="{{interval}}" duration="{{duration}}">
        <block wx:for="{{background}}" wx:key="*this">
          <swiper-item>
            <view class="swiper-item">
            <image bindtap="openbanner" data-url="{{item.link}}" src="{{item.url}}" style="width: 100%;"  mode="widthFix"></image>
            </view>
          </swiper-item>
        </block>
      </swiper>
    </view>


<view style="padding:18.72rpx; background-color: #f4f4f4;">
<block wx:for="{{list}}" wx:key="list">
  <view bindtap="openinfo" data-id="{{item.id}}"  style="border-radius: 10px; box-shadow: 2.34rpx 2.34rpx 4.68rpx #f1f1f1; background-color: #ffffff; padding: 18.72rpx; margin-bottom: 18.72rpx; position: relative">
    <view style="width: 163.8rpx;position: absolute;top:18.72rpx;left:18.72rpx;">
      <image src="{{item.store_icon}}" mode="widthFix" style="width: 163.8rpx;" data-id="{{item.id}}"></image>
    </view>
    <view style="padding-left: 198.9rpx;">
      <view>
        <view style="font-weight: 400;">{{item.store_name}}</view>
      </view>

      <view style="clear:both;  padding-top: 15rpx;">
        <view style="float:left; color:#666; font-size: 26rpx;">{{item.address}}</view>
        <view style="float:right;  color: #666; font-size: 26rpx; text-align: right;">
          已售 {{item.sells}}
        </view>
        <view style="clear:both"></view>
      </view>
      <view style="clear:both;  padding-top: 10rpx; ">
        <view style="float:left; color:#666; font-size: 20rpx; background-color: #f5f5f5; padding:4.68rpx 11.7rpx; border-radius: 10rpx;"> {{item.ad}} </view>
        <view style="float:right;  color: #666; font-size: 26rpx; text-align: right;">
          <image src="/img/local2.png" mode="widthFix" style="width: 22rpx;vertical-align: initial; margin-right: 5rpx;"></image>{{item.distrance}}km
        </view>
        <view style="clear:both"></view>
      </view>

      <view style="font-size:28.08rpx; clear:both; margin-top: 18rpx;padding-top: 12rpx; border-top:1px solid #f5f5f5;">
        
        <block wx:for="{{item.clist}}" wx:for-item="cell">
        <view style=" color:rgb(61, 61, 61); margin-bottom: 11.7rpx;">
          <image src="/img/icon_{{cell.lx < 1 ? 'quan':'hui'}}.png" mode="widthFix" style="width: 36rpx;vertical-align: top; margin-right: 8rpx;"></image>
          <block wx:if="{{cell.price > 0}}">
          <text style="color: #d96f38;">¥{{cell.price}}</text>
          <text style="color: #b9b9b9; text-decoration: line-through;margin-left: 11.7rpx;">¥{{cell.price_market}}</text>
          </block>
          <block wx:else>
            <text style="color: #d96f38;">免费</text>
          </block>
          {{cell.title}}
        </view>
      </block>
        
        <view style="clear:both"></view>
      </view>
    </view>
    <view style="clear:both"></view>
  </view>
</block>

</view>
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28
  • 29
  • 30
  • 31
  • 32
  • 33
  • 34
  • 35
  • 36
  • 37
  • 38
  • 39
  • 40
  • 41
  • 42
  • 43
  • 44
  • 45
  • 46
  • 47
  • 48
  • 49
  • 50
  • 51
  • 52
  • 53
  • 54
  • 55
  • 56
  • 57
  • 58
  • 59
  • 60
  • 61
  • 62
  • 63
  • 64
  • 65
  • 66
  • 67
  • 68
  • 69
  • 70
  • 71
  • 72
  • 73
  • 74
小程序首页图

在这里插入图片描述

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/Li_阴宅/article/detail/950815
推荐阅读
相关标签