<template>
  <div class="pay">
    <div class="img1-father">
      <img class="img1" src="@/assets/img/pay/img1.png" alt="" />
    </div>

    <!-- 支付信息 -->
    <pay-info ref="pay" />

    <!-- 内容 -->
    <div class="row-center-center">
      <div class="content-box row-center-center" style="margin-bottom: 1.4rem">
        <div class="col-start-center">
          <img class="img7" src="@/assets/img/pay/img7.png" alt="" />

          <div class="row-center-center">
            <img class="img17" src="@/assets/img/pay/img17.png" alt="" />
            <img class="img14" src="@/assets/img/pay/img14.png" alt="" />
          </div>

          <img class="img8" src="@/assets/img/pay/img8.png" alt="" />

          <div class="row-center-center">
            <img class="img17" src="@/assets/img/pay/img17.png" alt="" />
            <img class="img15" src="@/assets/img/pay/img15.png" alt="" />
          </div>

          <img class="img9" src="@/assets/img/pay/img9.png" alt="" />

          <div class="row-center-center">
            <img class="img17" src="@/assets/img/pay/img17.png" alt="" />
            <img class="img12" src="@/assets/img/pay/img12.png" alt="" />
          </div>

          <img class="img10" src="@/assets/img/pay/img10.png" alt="" />

          <div class="row-center-center">
            <img class="img17" src="@/assets/img/pay/img17.png" alt="" />
            <img class="img16" src="@/assets/img/pay/img16.png" alt="" />
          </div>

          <img class="img11" src="@/assets/img/pay/img11.png" alt="" />

          <div class="row-center-center" style="margin-bottom: 0.36rem">
            <img class="img17" src="@/assets/img/pay/img17.png" alt="" />
            <img class="img13" src="@/assets/img/pay/img13.png" alt="" />
          </div>
        </div>
      </div>
    </div>

    <!-- 支付按钮 -->
    <div
      v-show="is_show_btn"
      class="btn row-center-center fc-f ff-pp fw-5 fs-36"
      @click.once="pay"
    >
      付费查看全部解析
    </div>
  </div>
</template>

<script>
import StatusBar from "@/components/StatusBar";
import PayInfo from "./child_cpn/PayInfo";
export default {
  components: {
    StatusBar,
    PayInfo,
  },
  data() {
    return {
      is_show_btn: false,
    };
  },

  methods: {
    pay() {
      this.$refs.pay._payment();
    },
  },
};
</script>

<style scoped src='./index.css'>
</style>
