tuition-获取上一个页面传来的id和微信支付

<template>
  <div>
   <form-preview header-label="缴费信息" :header-value="payMoney" :body-items="orderInfo"></form-preview>
        <div class="submitBox">
          <flexbox>
            <flexbox-item :span="2">
            </flexbox-item>
            <flexbox-item :span="8">
              <x-button type="primary"   @click.native="confirmPay">确认缴费</x-button>
            </flexbox-item>
          </flexbox>
        </div>
      <alert v-model="alertShow" :title="alertTitle" >{{alertMsg}}</alert>
  </div>
</template>

<script >
import {Flexbox,FlexboxItem,XButton,FormPreview,AlertPlugin,Alert } from vux

export default {
  name: payRecord,
  components: {
    Flexbox,FlexboxItem,XButton,FormPreview,AlertPlugin,Alert
  },
  data () {
    return {
        alertShow:false,
        alertMsg:"",
        alertTitle:"",
        money:"",
        orderId:‘‘,
      orderInfo: [{
        label: 姓名,
        value: ‘‘
      }, {
        label: 学校,
        value: ‘‘
      }, {
        label: 班级,
        value: ‘‘
      },{
        label: 联系电话,
        value: ‘‘
      }],
    }
  },
  methods:{
    confirmPay(){
        this.$vux.loading.show({
            text: 加载中
        })
        const vm=this;
        this.$http.post(/tuition/tuition-order/confirm-money,{order_id:this.orderId}).then((result) =>{
            if(result.data.status==1){
                this.$vux.loading.hide();
                var payData = result.data.data.options;
                var outTradeNo = result.data.data.outTradeNo;
                wx.ready(function () {
wx.chooseWXPay({
    timestamp: payData.timestamp, // 支付签名时间戳,注意微信jssdk中的所有使用timestamp字段均为小写。但最新版的支付后台生成签名使用的timeStamp字段名需大写其中的S字符
    nonceStr: payData.nonceStr, // 支付签名随机串,不长于 32 位
    package: payData.package, // 统一支付接口返回的prepay_id参数值,提交格式如:prepay_id=***)
    signType: payData.signType, // 签名方式,默认为‘SHA1‘,使用新版支付需传入‘MD5‘
    paySign: payData.paySign, // 支付签名
    success: function (re) {
        // 支付成功后的回调函数
        if (re.errMsg == "chooseWXPay:ok") {
            var storage = window.localStorage;
            //清场
            storage.clear();
            vm.alertTitle="支付成功";
            vm.alertMsg="支付成功";
            vm.alertShow=true;
            vm.$router.push({ path: payRecord });
        } else {
            vm.alertShow=true;
            vm.alertTitle="支付失败";
            vm.alertMsg=re.errMsg;
        }
    },
    cancel: function(re){
        vm.alertShow=true;
        vm.alertTitle="取消成功"
        vm.alertMsg="取消成功";
    }
});
                });
            }else{
                vm.alertShow=true;
                vm.alertTitle="支付失败"
                vm.alertMsg=result.data.message;
            }
        }).catch((error) => {
            this.$vux.loading.hide();
            this.$vux.toast.show({
                text: 支付失败:网络出现问题,
                type: cancel
            });
        })
    },
      wechatConfig(){
          this.$vux.loading.show({
              text: 加载中
          })
          this.$http.post(/tuition/pay-js/get-js-config).then((res) =>{
              this.$vux.loading.hide();
              wx.config(res.data);
          }).catch((error) => {
              this.$vux.loading.hide();
              this.$vux.toast.show({
                  text: 出现错误:微信配置出现问题,
                  type: cancel
              });
          })
      },
      getOrderInfo(){
          this.$vux.loading.show({
              text: 加载中
          })
          this.orderId=window.location.hash.split(?)[1];//获取上一个页面传来的orderId
          this.$http.post(/tuition/tuition-order/tuition-order-detail,{order_id:this.orderId}).then((res) =>{
              this.$vux.loading.hide();
              if(res.data.status==1){
                  var res=res.data.data;
                  this.money=res.money;
                  this.orderInfo[0].value=res.user_name;
                  this.orderInfo[1].value=res.school_name;
                  this.orderInfo[2].value=res.class_name;
                  this.orderInfo[3].value=res.phone;
              }else{
                  this.alertShow=true;
                  this.alertTitle="信息获取失败"
                  this.alertMsg=res.data.message;
              }
          }).catch((error) => {
              this.$vux.loading.hide();
              this.$vux.toast.show({
                  text: 拉取信息失败:网络出现问题,
                  type: cancel
              });
          })
      }
  },
  computed:{
      payMoney(){
          return ""+this.money
      }
  },
    created(){
      this.wechatConfig();
      this.getOrderInfo();
    }

}
</script>

<style >
.weui-form-preview__value{
    color:black;
}
</style>

 

tuition-获取上一个页面传来的id和微信支付

以上是tuition-获取上一个页面传来的id和微信支付的全部内容。
THE END
分享
二维码
< <上一篇
下一篇>>