<template>
  <div class="home">
    <van-button 
        class="wxlogin"
        round
        block
        type="info"
        @click="WeixinJs"
        color="#46C3B0"
        icon="wxicon"
        >支付</van-button
      >
  </div>
</template>

<script>
import { weixinPrePay} from "@/request/api.js";
import {
  apiUserCardList,
  apiopLMQuery,
  apiopLDQuery,
  apiopPacscx,
  apiopLiscx
} from "@/request/api.js";

export default {
  data() {
    return {

    };
  },
  mounted() {
  },
  methods: {
    // let param = {
    //     openid: sessionStorage.getItem("openid"),  // 当前用户微信的openid
    //     price: that.ruleForm.price  // 应付金额
    //   };
    //test

    getList(){
      let that = this;
      let formData1 = {
        //QueryCode: that.card.cardNo,
        QueryCode:"0001359819",
        StartTime: that.startdate+" 00:00:00",
        EndTime: that.enddate+" 23:59:59"
      };
      
      apiopLiscx(formData1).then(res => {
        console.log(res)
        this.loading=false;
        if(res.code=="0000"&&res.message!=0){
            for(var i=0;i<res.message.length;i++){
                that.list.push(res.message[i]);
             }
        }else{
          Toast("暂无检验报告");
        }
      });      
    },

    // 微信支付
    onPay() {
      let that = this;
      let formData = {
        openid: "ofGHyt4kL4f59D5bfowI_kI4fmo4",  // 当前用户微信的openid
        price: "0.01"  // 应付金额
      };
      alert("send weixinPrePay1");
      alert(formData);
      // 后台支付签名接口
      weixinPrePay(formData).then(ref => {
        alert(ref.code);
        if (ref.data.status == 200) {  
          this.WeixinJs();
        } else {
          that.$message.error(ref.data.msg);
        }
      });
    },
    // 微信支付
onBridgeReady() {
      let that = this;
      let param = {
        openid: 'ofGHyt4kL4f59D5bfowI_kI4fmo4',  // 当前用户微信的openid
        price: '0.01'  // 应付金额
      };
      alert("send weixinPrePay")
      // 后台支付签名接口
      weixinPrePay(param).then(ref => {
        alert(ref.code);
        alert(ref.data.package);

        if (ref.code == 200) {  
          WeixinJSBridge.invoke(
            "getBrandWCPayRequest",
            {
              appId: ref.data.appId, // 微信的appid
              timeStamp: ref.data.timeStamp, //时间戳
              nonceStr: ref.data.nonceStr, //随机串
              package: ref.data.package,  // 订单号
              signType: "MD5", //微信签名方式：
              paySign: ref.data.paySign //微信签名
            },
            function(res) {
              if (res.err_msg == "get_brand_wcpay_request:ok") {
                // 使用以上方式判断前端返回,微信团队郑重提示：
                //res.err_msg将在用户支付成功后返回ok，但并不保证它绝对可靠。

                alert("支付成功");
              } else {
                alert("支付失败");
                that.$message.error("支付失败，请重新支付");
              }
            }
          );
        } else {
          that.$message.error(ref.data.msg);
        }
      });
    },
    // 微信支付
    WeixinJs() {
      alert("call WeixinJs");
      if (typeof WeixinJSBridge == "undefined") {
        alert("attachEvent onBridgeReady");
        if (document.addEventListener) {
          document.addEventListener(
            "WeixinJSBridgeReady",
            onBridgeReady,
            false
          );
        } else if (document.attachEvent) {
          document.attachEvent("WeixinJSBridgeReady", onBridgeReady);
          document.attachEvent("onWeixinJSBridgeReady", onBridgeReady);
        }
      } else {
        alert("this.onBridgeReady()");
        this.onBridgeReady();
      }
    }
  }
};
</script>


<style scoped lang="scss">
.zhichi {
  text-align: center;
  padding-bottom:1rem;
  color: #999;
}
.index_bj {
  width: 100%;
  height: 5rem;
  background: url(../assets/in_bgbj.png) no-repeat;
  background-size: cover;
  position: absolute;
  top: 0rem;
  left: 0rem;
  z-index: -1;
}

.in_search a {
  background: rgba(255, 255, 255, 0.4);
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 1rem;
  border-radius: 1rem;
  font-size: 0.475rem;
  color: #fff;
  margin: 1.25rem 0 0.75rem 0;

}

.in_search a img {
  width: 0.5rem;
  height: 0.5rem;
  margin-right: 0.25rem;
}
.in_banner {
  width: 100%;
  border-radius: 0.25rem;
  img {
    width: 100%;
    height: auto;
    border-radius: 0.25rem;
  }
}

.in_box {
  padding: 0.5rem 0;
  ul {
    padding: 0.2rem 0;
    display: flex;
    justify-content: space-between;
    p {
      font-size: 0.25rem;
    }
    h2 {
      padding-bottom: 0.2rem;
      font-size: 0.45rem;
    }
    li a {
      display: block;
      color: #fff;
    }
  }

  .ul1 {
    li {
      width: 48%;
      box-sizing: border-box;
      padding: 6.5% 4%;
      background: url(../assets/in_box.png) no-repeat;
      background-size: 100% 100%;
      border-radius: 0.25rem;
    }
    li:nth-child(2) {
      background: url(../assets/in_box2.png) no-repeat;
      background-size: 100% 100%;
    }
  }

  .ul2 {
    li {
      width: 48%;
      box-sizing: border-box;
      padding: 6.5% 4%;
      background: url(../assets/in_box1.png) no-repeat;
      background-size: 100% 100%;
      border-radius: 0.25rem;
    }
    li:nth-child(2) {
      background: url(../assets/in_box3.png) no-repeat;
      background-size: 100% 100%;
    }
  }
}

.in_box1 {
  .nr {
    padding: 0.375rem;
    background: #ffffff;
    border-radius: 0.25rem;
    box-shadow: 0 0 0.125rem #ddd;
    margin-top: 0.25rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    a {
      text-align: center;
      color: #000;
      img {
        width: 1.25rem;
        height: 1.25rem;
      }
    }
    p {
      font-size: 0.275rem;
    }
  }
}

.in_box1 ,.in_box2 {
  .bt {
    font-size: 0.375rem;
    color: #000;
  }
  .img {
    height: 0.3rem;
    padding: 0 0.1rem;
  }
}

.in_box2 {
  padding: 0.25rem 0;

  ul {
    margin-top: 0.25rem;
    li {
      margin-bottom: 0.25rem;
      a {
        justify-content: space-between;
        img {
          width: 2rem;
          // height: 150px;
          float: left;
          margin-right: 0.5rem;
        }
        h2 {
          font-size: 0.375rem;
          color: #000;
          line-height: 0.75rem;
          margin-bottom: 0.5rem;
          overflow: hidden;
          text-overflow: ellipsis;
          display: -webkit-box;
          -webkit-line-clamp: 2;
          -webkit-box-orient: vertical;
        }
        span {
          font-size: 0.25rem;
          color: #999;
        }
      }
    }
  }
}

.hsjc {
  color: #286ba5;
}
.guahao {
  color: #aa4131;
}

h2.hsjc,
h2.guahao,
h2.zhuyuan,
h2.menzhenzf {
  font-weight: 800;
}

.zhuyuan {
  color: #31aaa8;
}
.menzhenzf {
  color: #9e7837;
}

.wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 80%;
  width: 80%;
  border-radius: 0.25rem;
}

.block {
  width: 90%;
  height: 80%;
  border-radius: 0.25rem;
  margin: 0.25rem;
}

.di_nav {
  border-radius: 0 0 0.25rem 0.25rem;
  position: absolute;
  box-sizing: border-box;
  padding: 0 0.25rem;
  width: 90%;
  height: 2rem;
  background: #fff;
  display: none;
  justify-content: space-between;
  align-items: center;
  ::v-deep .van-checkbox__label {
    font-size: 0.375rem;
  }
  ::v-deep .van-checkbox__icon {
    width: 0.5rem;
  }

}
.btn {
  position: flex;
  justify-content: space-between;
  align-items: center;
  a {
    width: 2.5rem;
    height: 1rem;
    line-height: 1rem;
    display: block;
    border-radius: 0.25rem;
    background: #129bff;
    color: #fff;
    font-size: 0.5rem;
    text-align: center;
  }
}

.ghbt {
  font-size: 0.5rem;
  font-family: PingFang SC;
  font-weight: 600;
  color: #333333;
  text-align: center;
}
.nr {
  font-size: 0.375rem;
  color: #333333;
  line-height: 0.6rem;
  padding-left: 1rem;
}
.ghxzbody {
  padding: 0.1rem;
  font-size: 0.5rem;
}

</style>