uniapp WeChat アプレット支払いクーポンまたはマーチャント クーポン プラグイン

ミニ番組クーポン発行プラグインAPI

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

注: マーチャントは、ミニ プログラム シナリオで、指定されたバッチの支払いバウチャーまたはマーチャント バウチャーを指定されたユーザーに発行することがサポートされています。

ネイティブ WeChat アプレットの参照リンクで提供されるチュートリアル

uniapp WeChat アプレット支払いクーポンまたはマーチャント クーポン プラグイン 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 パラメータは WeChat ドキュメントを参照できます

上記の 3 つは必須パラメーターであり、バックエンド インターフェイスによって返されるパラメーターを介して割り当てる必要があります。

コードの一部

インターフェイスを呼び出してボリューム構成を取得します. 主なことは、バックエンドがそれを間違えないようにすることです. 基本的に, クーポン発行業者番号とクーポンのバッチ番号を渡すことで構成を取得できます. 具体的な分析は、バックエンドはWeChatのAPI、フロントエンドはOK

 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"
        })
      })
    },
インターフェイスによって返されるクーポンの詳細データ

2 つのコールバック関数 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",
        });
       
    },

注: We have to click the send-coupon component to have the WeChat pop-up box. このポップアップ ボックスはコンポーネントに付属しているため、スタイルを記述する必要はありません。エミュレーターを使用してデバッグするのではなく、携帯電話を使用してデバッグすることをお勧めします。

ポップアップ ボックスが表示されたら、WeChat --> マイ --> カード パッケージ --> クーポンとギフト カードに移動できます。

おすすめ

転載: blog.csdn.net/qq_35946021/article/details/128812176