<template>

  <view class="head-background">
    <image mode="widthFix" :src="staticImage.bg" class="img" width="100%"/>
  </view>
  <u-navbar
      :title="title"
      :auto-back="true"
      left-icon-size="40rpx"
      :safe-area-inset-top="true"
      :placeholder="true"
      bgColor="transparent"
  ></u-navbar>
  <view class="body-background row">
    <view class="done-container row">
      <view class="image col-12 row">
        <u-image mode="aspectFill" class="img" :src="staticImage.orderDone" height="250" width="250"></u-image>
      </view>
      <view class="title col-12 row">
        <u-text text="支付成功！" color="#020B18" size="36" mode="name" lineHeight="50" align="center"></u-text>
      </view>
      <view class="button col-12 row">
        <u-button
            @click="goHome"
            type="primary"
            text="返回首页"
            shape="circle"
            :custom-style="{
              color:'#020B18',
              backgroundColor:'#FF9545',
              border:'none',
              fontSize:'36',
              fontWeight:'400',
              height:'80rpx',
              width:'360rpx'
            }"
        ></u-button>
      </view>
    </view>
  </view>
<!--  <view class="foot-button border-box">-->
<!--    <u-button-->
<!--        type="primary"-->
<!--        text="确认兑换"-->
<!--        shape="circle"-->
<!--        :custom-style="{-->
<!--              color:'#020B18',-->
<!--              backgroundColor:'#FF9545',-->
<!--              border:'none',-->
<!--              fontSize:'36',-->
<!--              fontWeight:'400',-->
<!--              height:'80rpx'-->
<!--            }"-->
<!--        @click="submit"-->
<!--    ></u-button>-->
<!--  </view>-->
</template>

<script>
import api from "@/utils/functions.js";
import {roomDetail} from "@/api/shop";
import {imghost} from "@/config/host";

export default {
  computed: {},
  components: {},
  data() {
    return {
      title: '支付成功',
      size: {
        height: 0
      },
      detail: {},
      staticImage: {
        bg: imghost + '/BG.png',
        orderDone: imghost + '/order-done.png',

      }
    }
  },
  onLoad(option) {
    // this.getDetail(option.id)
  },
  onReady() {
    let that = this;
    let height = api.wxSystemInfo().system.windowHeight
    let headerHeight = uni.$u.getPx(44) + uni.$u.sys().statusBarHeight

    let info = uni.createSelectorQuery().in(this);
    info.select('.foot-button').boundingClientRect(function (data) {

    }).exec(function (res) {
    });
    info.select('.address-height').boundingClientRect(function (data) {

    }).exec(function (res) {
      let otherHeight = 0;
      res.forEach((item, index) => {
        otherHeight += item.height;
      });
      that.size.height = height - headerHeight - otherHeight - uni.$u.getPx('72rpx');
    });
  },
  methods: {
    getDetail(id) {
      roomDetail({
        house_id: id
      }).then(res => {
        console.log(res.data)
        this.detail = res.data;
      });
    },
    goHome(){
      wx.reLaunch({
        url: '/pages/Index/index'
      });
    },
    submit() {
    },
  },
  onPageScroll(res) {

  },
  created() {

  },
  mounted() {

  },
}
</script>

<style lang="scss">
@import './components/done.scss';
</style>