<style>
  .ContractPay {
    width: 100%;
    margin: 0 auto;
    background-color: #fff;
    height: 100%;
    color: #000;
    padding: 20px;
  }

  .ContracPay_Title {
    position: relative;
    color: #111111;
    font-size: 23px;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .ContracPay_Title i {
    position: absolute;
    left: 0;
    top: 3px;
    font-size: 20px;
    color: #111111;
  }

  .Contract_TwoDiv {
    width: 100%;
    height: 28rem;
    margin-top: 50px;
    background-color: #F3F9FC;
    text-align: center;
    color: #111111;
    font-weight: 500;
  }

  .contractTotal {
    font-size: 20px;
    padding-top: 50px;
  }

  .contractMoney {
    font-size: 30px;
    font-weight: bold;
    margin-top: 10px;
  }

  .contractTwoCode {
    width: 180px;
    height: 180px;
    margin: 20px auto;
  }

  .TwoCodeRemind {
    color: #888888;
    font-size: 18px;
    margin-top: 20px;
  }

</style>
<template>
  <div class="ContractPay">
    <div class="ContracPay_Title">
      <i @click="goContractConfirm" class="iconfont icon-line-arrow-left"></i>合同签订成功
    </div>
    <div class="Contract_TwoDiv">
      <div class="contractTotal">合同总价</div>
      <div class="contractMoney">{{Money}}</div>
      <div class="contractTwoCode" id="qrcode" ref="qrcode">
      </div>
      <div class="TwoCodeRemind">长按识别上图收款码，完成支付</div>
    </div>
  </div>
</template>
<script>
  import {
    GenerateOrder
  } from '../api/sale/contract'
  import QRCode from 'qrcodejs2'

  export default {
    data() {
      return {
        msg: {
          contractId: 0
        },
        Money:0,
        dataList: {}
      };
    },
    created() {

    },
    mounted() {
      if (this.$route.query.contractId) {
        this.msg.contractId = this.$route.query.contractId;
        this.getList();
      }
      if(this.$route.query.Money){
        this.Money = this.$route.query.Money;
      }
    },
    methods: {
      //获取数据
      getList() {
        GenerateOrder(this.msg).then(res => {
          if (res.Code == 1) {
            this.dataList = res.Data;
            this.qrcode(this.dataList.code_url);
          }
        }).catch((e) => {

        })
      },

      qrcode(code_url) {
        let qrcode = new QRCode('qrcode', {
          width: 180,
          height: 180, // 高度
          text: code_url // 二维码内容
        })
      },
      //跳转至合同详情
      goContractConfirm() {
        this.$router.push({
          path: 'contractConfirm',
          query: {
            ContractId: this.msg.contractId
          }
        });
      }
    },
  };

</script>
