<template>
  <view class="paySuccess">
    <view style="background: #fff">
      <view class="img-box">
        <img src="/static/images/icon/pay-success.png" class="img" />
      </view>
      <view class="title">订单支付成功</view>
      <view class="price">实付 ￥{{ PreferPrice }}</view>
      <view class="btn-box">
        <u-button shape="circle" :custom-style="customStyle" @click="goHome"
          >返回首页</u-button
        >
        <u-button
          shape="circle"
          :custom-style="themCustomStyle"
          @click="redictToOrders"
          >查看订单</u-button
        >
      </view>
    </view>
  </view>
</template>

<script>
export default {
  components: {},
  data() {
    return {
      customStyle: {
        width: "150rpx",
        padding: "0 30rpx",
      },
      themCustomStyle: {
        width: "150rpx",
        marginLeft: "60rpx",
        padding: "0 30rpx",
      },
      mainColor: "",
      recommend: [],
      payInfo: {},
      showCoupons: false,
      couponMessage: "",
      PreferPrice: "",
      isLineOrder: 0,
    };
  },
  onLoad(option) {
    if (option.PreferPrice) {
      this.PreferPrice = option.PreferPrice;
    }
    uni.setNavigationBarTitle({
      title: "支付成功",
    });
    this.mainColor = this.$uiConfig.mainColor;
    this.themCustomStyle.color = this.mainColor;
    this.themCustomStyle.borderColor = this.mainColor;
    if (option.isFrom) {
      this.isLineOrder = option.isFrom;
    }
  },
  methods: {
    redictToOrders() {
      if (this.isLineOrder == 0) {
        uni.redirectTo({
          url: "/pages/jiuzhai/allorderList",
        });
      } else if (this.isLineOrder == 1) {
        uni.redirectTo({
          url: "/pages/jiuzhai/jz_MyOrder",
        });
      } else if (this.isLineOrder == 2) {
        //司导订单
        uni.redirectTo({
          url: "/pages/guidecar/orderList",
        });
      }
    },
    goHome() {
      uni.reLaunch({
        url: "/pages/index/index",
      });
    },
  },
};
</script>

<style>
.paySuccess {
  min-height: 100vh;
  padding-bottom: 40rpx;
  background: #f5f5f5;
}

.paySuccess .img-box {
  display: flex;
  align-items: center;
  justify-content: center;
}

.paySuccess .img-box .img {
  width: 256rpx;
  height: 256rpx;
  padding: 60rpx 0 0 0;
}

.paySuccess .title {
  padding: 40rpx 0 20rpx 0;
  font-size: 32rpx;
  color: #000;
  font-weight: 600;
  text-align: center;
}

.paySuccess .price {
  font-size: 30rpx;
  color: gray;
  padding-bottom: 60rpx;
  text-align: center;
}

.paySuccess .btn-box {
  padding-bottom: 60rpx;
  text-align: center;
  display: flex;
  justify-content: center;
}
</style>
