<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="content" color="#020B18" size="36" mode="name" lineHeight="50" align="center"></u-text>
      </view>
      <view class="desc col-12 row" v-if="(type === 'room')">
        <u-text :text="desc" color="#AFB5BE" size="28" mode="name" lineHeight="50" align="center"></u-text>
      </view>
      <view class="button col-12 row">

        <view class="button-group">
          <view class="button" style="margin-bottom: 20rpx;" v-if="(type === 'room')">
            <u-button
                @click="navTo('/pages/User/order')"
                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 class="button" style="margin-bottom: 20rpx;" v-else>
            <u-button
                @click="navTo('/pages/Order/info?id='+order_item_id)"
                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 class="button">
            <u-button
                @click="goHome"
                text="返回首页"
                shape="circle"
                plain
                :custom-style="{
                    backgroundColor:'transparent',
                    border:'2rpx solid #999',
                    fontSize:'36',
                    fontWeight:'400',
                    height:'80rpx',
                    width:'360rpx'
                  }"
            ></u-button>
          </view>

        </view>
      </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: '兑换成功',
      content: '',
      desc: '',
      size: {
        height: 0
      },
      detail: {},
      staticImage: {
        bg: imghost + '/BG.png',
        orderDone: imghost + '/order-done.png',

      },
      type: '',
      order_item_id: undefined,
    }
  },
  onLoad(option) {
    // this.getDetail(option.id)
    this.type = option.type ? option.type : 'item';
    if (this.type === 'item') {
      this.order_item_id = option.id;
      this.content = '兑换成功！';
    } else {
      this.content = '审核中';
      this.desc = '请前往兑换中心查看审核进度，审核通过后请每月指定时间（请留意小程序首页消息提醒）前往社区领取暖新币兑换金额。';
    }
  },
  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: {
    navTo(url) {
      uni.navigateTo({
        url: url
      })
    },
    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>