uniapp微信小程序支付券或商家券插件

小程序发券插件API

https://pay.weixin.qq.com/wiki/doc/apiv3/apis/chapter9_3_1.shtml

注意：支持商户在小程序场景内，向指定用户发放指定批次的支付券或商家券

原生微信小程序参考链接给的教程

uniapp微信小程序支付券或商家券插件API

可以参考下面流程，基本大同小异

1.manifest.json 添加插件配置（引入插件包）

2.在小程序页面中引入发券插件（哪个页面要用插件就引用一下）

3.使用组件

<view class="hb" >
                  <send-coupon 
                  @sendcoupon="getcoupon"
                  @userconfirm="redirectuser"           
                  :send_coupon_params="couponInfo.send_coupon_params"
                  :sign="couponInfo.sign"
                  :send_coupon_merchant="couponInfo.send_coupon_merchant">  
                  <image src="https://ss2.meipian.me/users/49976449/478178f0-7835-11ec-844a-9bcd45718885.png" 
                  mode="widthFix" ></image>
              </send-coupon>
</view>

组件的send_coupon_params参数可以参考微信文档

上面三个是必填的参数，要通过后端接口返回的参数去赋值

部分代码

调用接口获取卷配置，主要不要让后端弄错了，基本传个发券商户号、消费券批次号就可以获得到配置，具体的解析是后端使用微信的api自己去弄的，和前端没关系

 getcouponinfo(){
      
      var data={
          mchid:this.mchid,//发券商户号
          stockList:stockList//消费券批次号
      }
      getCouponParamsAPI(data).then(res=>{
        if (res.code==0) {
          this.couponInfo=res.data
          console.log("send_coupon_params",this.couponInfo)
           
        }
      }).catch(e=>{
        uni.showToast({
          title:res.msg,
          icon:"none"
        })
      })
    },

接口返回的劵详情数据

两个回调函数getcoupon、redirectuser

// 领券回调函数
     getcoupon(res){
       var _this=this
     
      if (res.detail.errcode=="OK") {
       
        if (res.detail.send_coupon_result[0].code=="SUCCESS") {
          var couponList=[]
          for (const i in res.detail.send_coupon_result) {
            couponList.push({
              stockId:res.detail.send_coupon_result[i].stock_id,
              couponId:res.detail.send_coupon_result[i].coupon_code
            })
          }         
            var data={
                "couponList": couponList,
                "createTime":formatDate((new Date())), 
              }
               console.log(11,res.detail)
            setCouponLogAPI(data).then(res=>{
              uni.showToast({
                title: "领取成功",
                icon: "none",
              });
             
            })
        }else{
         uni.showModal({
              title: '领取失败',
              content: res.detail.send_coupon_result[0].message,
              showCancel:false,
              success: function (res) {
                 
              }
          });
        }
      } else {
         uni.showToast({
            title: "领取失败",
            icon: "none",
          });
      }
    
    },
    redirectuser(res){
       console.log(22,res)
        this.getTeamsList()
        uni.showToast({
          title: "领取成功，请查看微信卡包",
          icon: "none",
        });
       
    },

注意：我们要点击那个 send-coupon组件才会有这个微信弹出框出来，这个弹出框是组件自带的，不用去写样式。最好不要用模拟器去调试，用手机调试。

这个弹出框出来，就可以到微信-->我的-->卡包-->券和礼品卡 去看了