<template>

  <div id="app">

    <h3 @click="pay(ids[0])"></h3>

  </div>

</template>

<script>

    export default {

      data() {

        return {

           iap: {},

           ids: ["donation6","donation"],//应用内购项目，需要申请

        }

      },

     created() {

         document.addEventListener("plusready", function() {

            //console.log("所有plus api都应该在此事件发生后调用，否则会出现plus is undefined。"

         });

         document.addEventListener("plusready",this.plusReady(),false);

     },

     methods: {

      plusReady() {

      let _this = this;

      // 获取支付通道

      plus.payment.getChannels(

        function(channels) {

          for (var i in channels) {

            var channel = channels[i];

            // 用于标识支付通道： "alipay" - 表示支付宝； "wxpay" - 表示微信支付； "appleiap" - 表示苹果应用内支付； "qhpay" - 表示360聚合支付（仅360手助流应用环境下支持）。

            if (channel.id === "appleiap") {

              _this.iap = channel;

              _this.requestOrder();

            }

          }

        },

        function(e) {

          console.log("获取支付通道失败：" + e.message);

        }

      );

    },

    requestOrder() {

      let _this = this;

      plus.nativeUI.showWaiting("检测支付环境...");

      _this.iap.requestOrder(_this.ids,function(e) {

          plus.nativeUI.closeWaiting();

          console.log("requestOrder success: " + JSON.stringify(e));

        },function(e) {

          console.log("requestOrder failed: " + JSON.stringify(e));

          plus.nativeUI.closeWaiting();

          plus.nativeUI.confirm("错误信息：" + JSON.stringify(e),

            function(e) {

              if (e.index == 0) {

                _this.requestOrder();

              } else {

                // back();

              }

            },

            "重新请求支付",["确定", "取消"]

          );

        }

      );

    },

    // 支付

    pay(id) {

      let _this = this;

      plus.nativeUI.showWaiting("", {style: "black",background: "rgba(0,0,0,0)"});

      plus.payment.request(_this.iap,{ productid: id },function(result) {

        plus.nativeUI.closeWaiting();

          _this.fetchPayStatus(result);

        },

        function(e) {

          console.log("错误信息",e)

          plus.nativeUI.closeWaiting();

          plus.nativeUI.alert(

            "错误信息：" + e.message,

            null,

            "支付失败：" + e.code

          );

        }

      );

    },

    fetchPayStatus(result) {

      // let ordercode = window.location.href.split("ordercode=")[1]; //收集支付需要专递的参数

      // console.log("ordercode", ordercode);

      axios({

        method: "post",

        url: "https://pay.52xxxxxdd.cn/PaiyxApxxxxxple/appxxxxxxcion",//换成自己请求支付的接口

        headers: {

          "Content-Type": "application/x-www-form-urlencoded",

          Accept: "application/json, text/plain, */*"

        },

        data: `transactionId=${result.transactionIdentifier}&receipt=${result.transactionReceipt}`,//传递的参数

      })

      // .then(res => {

      //   if(res.data.code === 1){

      //     window.location.href = `${window.location.origin}/bzjp/detail.html?ordercode=${ordercode}`;

      //   }

      // });

    },

  }
}

</script>