修改前端页面

kongdeqiang

2023-09-15 0891b02adb0ae89391c6fff8f4e8937bdd750c16

 src/components/page/IndexTest.vue

@@ -34,7 +34,7 @@
                            <!--<el-input v-model="statisticData.code" readonly></el-input>-->
                        </el-form-item>
                        <el-form-item class="weizhang-footer-box" style="display: flex;justify-content: center;margin-top: 4.498vh" label-width="0" v-show="showFlag">
                            <el-button class="jiaofei-btn" type="primary" @click="getCode()" :loading="payFlag">去缴费</el-button>
                            <el-button class="jiaofei-btn" type="primary" @click="pay()" :loading="payFlag">去缴费</el-button>
                        </el-form-item>
                    </el-form>
<!--                    <el-form label-width="100px" label-position="left">-->
@@ -55,12 +55,14 @@
</template>

<script>
    export default {
import wx from 'weixin-js-sdk'
export default {
        name: 'dashboard',
        data() {
            return {
                payFlag:false,
                outParkId:"",
                type:null,
                statisticData:{

                },
@@ -68,11 +70,35 @@
                showFlag2:true,
                status3:0,
                carNo:"",
                code2:""
                code2:"",
                code:""
            }
        },
        created(){
          let ua = window.navigator.userAgent.toLowerCase();
          //判断是不是微信
          if (ua.match(/MicroMessenger/i) == "micromessenger") {
            // 微信
            this.type = 0
          }
          //判断是不是支付宝
          if (ua.match(/AlipayClient/i) == "alipayclient") {
            //支付宝
            this.type = 1
          }
          if(this.type == null){
            this.$message.error("请用微信或支付宝扫描二维码")
            return;
          }


            var url = window.location.href;
            var count = url.split('?').length-1;
            if(count >1){
              this.code = this.getCodeFromUrl(url)
              this.code2 = this.getCode2FromUrl(url)
              window.location.href = "http://hesuancj.cn/#/indexTest?code="+this.code+"&state=STATE&code2="+this.code2
            }
            var cs = url.split('?')[1];
            var cs_arr = cs.split('&');
            var cs={};
@@ -80,20 +106,22 @@
                cs[cs_arr[i].split('=')[0]] = cs_arr[i].split('=')[1]
            }
            //this.outParkId = cs.code;
            this.code2 = cs.code;
            this.$byutil.postData(this, this.$systemconfig.basePath + '/outPark/findByBarrierCode', {code:cs.code}, res => {
                this.statisticData = res.data;
                this.outParkId = this.statisticData.id;
                this.status3 = this.statisticData.status3;
                this.payFlag = false
                if(this.status3==1){
                    this.$message({
                        message: '您有违章未处理，请先处理或联系停车场管理人员',
                        type: 'error',
                        duration:5000,
                    });
                }
            })
          this.code2 = cs.code2;
          this.code = cs.code;
          this.$byutil.postData(this, this.$systemconfig.basePath + '/ffzf/outpark/findByBarrierCode', {code2:cs.code2}, res => {
            this.statisticData = res.data;
            this.outParkId = this.statisticData.id;
            this.status3 = this.statisticData.status3;
            this.oldCarNo = this.statisticData.carNo;
            this.payFlag = false
            if(this.status3==1){
              this.$message({
                message: '您有违章未处理，请先处理或联系停车场管理人员',
                type: 'error',
                duration:5000,
              });
            }
          })
        },
        methods: {
            pay(){
@@ -106,9 +134,9 @@
                    });
                    return;
                }
                this.$byutil.postData(this, this.$systemconfig.basePath + '/ffzf/api/park', {id:this.outParkId}, res => {
                this.$byutil.postData(this, this.$systemconfig.basePath + '/ffzf/api/parkXT', {id:this.outParkId}, res => {
                  if(res.code === 0){
                    window.location.href = res.msg
                    this.getCode()
                    this.showFlag = false
                  }
                })
@@ -141,31 +169,112 @@
              var r = window.location.search.substr(1).match(reg);
              if (r != null) return unescape(r[2]); return null;
            },
            /**
             * 解析微信redirect_uri地址中的code
             */
            getCodeFromUrl (cur_url) {
              let index = cur_url.split('?')[1]
              let paramStr =index.split('&')[0];
              let code =paramStr.split('=')[1];
              return code
            },
            /**
             * 解析微信redirect_uri地址中的code2
             */
            getCode2FromUrl (cur_url) {
              let index = cur_url.split('?')[2]
              let code2 =index.split('=')[1];
              return code2
            },

            getCode(){
              var code = this.GetQueryString('code');
              var code2 = this.GetQueryString('code2');
              alert(code,'code=====')
              if(code==null||code==""){
                var url = encodeURIComponent("hesuancj.cn");
                window.location.href ="https://open.weixin.qq.com/connect/oauth2/authorize?" +
                    "appid=wxcb0e4256748b327c&redirect_uri="+url+"&response_type=code" +
                   // "&scope=snsapi_userinfo&state=STATE#wechat_redirect";
                    "&scope=SCOPE&state=STATE#wechat_redirect";
              }else{
                $.ajax({
                  type : "POST", //提交方式
                  url : this.$systemconfig.basePath + '/ffzf/test/getCode',//路径
                  data : {
                    "code" : code
                  },
                  success : function(result) {//返回数据根据结果进行相应的处理
              if(this.type == 0 ){
                //微信，获取code
                if(this.code==null||this.code==""){
                  var url = encodeURIComponent("http://hesuancj.cn/#/indexTest?code2="+this.code2);
                  window.location.href ="https://open.weixin.qq.com/connect/oauth2/authorize?" +
                      "appid=wx46e756aed958f895&redirect_uri="+url+"&response_type=code" +
                       "&scope=snsapi_userinfo&state=STATE#wechat_redirect";
                      //"&scope=SCOPE&state=STATE#wechat_redirect";
                }else{
                  this.$byutil.postData(this, this.$systemconfig.basePath + '/ffzf/api/getOpenId', {id:this.outParkId,code:this.code}, res => {
                    if(res.code === 0){
                      var param = res.data;
                      alert(param)
                      // 点击支付时候调用
                      if (typeof WeixinJSBridge === 'undefined') {
                        if (document.addEventListener) {
                          document.addEventListener('WeixinJSBridgeReady', this.onBridgeReady(param), false)
                        } else if (document.attachEvent) {
                          document.attachEvent('WeixinJSBridgeReady', this.onBridgeReady(param))
                          document.attachEvent('onWeixinJSBridgeReady', this.onBridgeReady(param))
                        }
                      } else {
                        this.onBridgeReady(param)
                      }

                      this.showFlag = false
                    }else {
                      alert('微信支付调起失败！')
                    }
                  })
                }
              }else if(this.type == 1){
                //支付宝，不获取code
                this.$byutil.postData(this, this.$systemconfig.basePath + '/ffzf/api/payByAli', {id:this.outParkId}, res => {
                  if(res.code != 0){
                    alert(res.data)
                    this.showFlag = false
                  }else {
                    this.$message({
                      message: '2秒后自动跳转到支付页面，防止内外网数据同步延迟，请稍等',
                      type: 'success',
                      duration:2000,
                    });
                    setTimeout(function(){window.location.href = res.msg;},2000);
                    this.showFlag = false;
                  }
                });
             }
            }
                })

              }
            },
          onBridgeReady (params) {
            const that = this
            WeixinJSBridge.invoke(
                'getBrandWCPayRequest',
                {
                  appId: params.appId, // 公众号名称，由商户传入
                  timeStamp: params.timeStamp, // 支付签名时间戳，注意微信jssdk中的所有使用timestamp字段均为小写。但最新版的支付后台生成签名使用的timeStamp字段名需大写其中的S字符
                  nonceStr: params.nonceStr, // 支付签名随机串，不长于 32 位
                  package: params.prepay_id, // 统一支付接口返回的prepay_id参数值，提交格式如：prepay_id=\*\*\*）
                  signType: params.signType, // 签名方式，默认为'SHA1'，使用新版支付需传入'MD5'
                  paySign: params.paySign // 支付签名
                },
                (res) => {
                  if (res.err_msg === 'get_brand_wcpay_request:ok') {
                    that.queryOrder() // 这里是查询订单是否支付完成，然后执行成功和失败的业务逻辑
                  } else if (res.err_msg === 'get_brand_wcpay_request:fail') {
                    alert('支付失败！')
                  } else if (res.err_msg === 'get_brand_wcpay_request:cancel') {
                    alert('支付取消！')
                  }
                }
            )
          },
          queryOrder() {
            this.$byutil.postData(this, this.$systemconfig.basePath + '/ffzf/outpark/getById', {id: this.outParkId}, res => {
              if (res.code == 0) {
                let outpark = res.data
                if(outPark.status == 1){
                  window.location.href = "http://hesuancj.cn/#/indexOk?code2="+this.code2
                }else {
                  window.location.href = "http://hesuancj.cn/#/indexFail?code2="+this.code2
                }
              }
            })
          }
      }

    }

</script>