<template>
  <view class="container">
    <view class="pay-box">
      <image class="pay-img" src="@/static/images/paySuccess.png"></image>
      <p class="pay-text">支付成功</p>
    </view>

    <view class="pay-btn-box">
      <button class="btn btn1" @click="handlerSkipBtn(1)">返回首页</button>
      <button class="btn btn2" @click="handlerSkipBtn(2)">查看订单</button>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {};
  },
  methods: {
    handlerSkipBtn(e) {
      switch (e) {
        case 1:
          uni.switchTab({
            url: '/pages/tabbar/home',
          });
          break;
        case 2:
          uni.switchTab({
            url: '/pages/tabbar/mine/index',
          });
          break;
      }
    },
  },
};
</script>

<style lang="scss" scoped>
.container {
  .pay-box {
    text-align: center;
    padding-top: 100rpx;
    .pay-img {
      width: 160rpx;
      height: 160rpx;
      border-radius: 50%;
    }
    .pay-text {
      font-weight: bold;
      font-size: 42rpx;
      margin-top: 60rpx;
    }
  }
  .pay-btn-box {
    display: flex;
    justify-content: space-evenly;
    margin-top: 400rpx;
    .btn {
      width: 45%;
      border-radius: 38rpx;
      font-size: 32rpx;
    }
    .btn1 {
      background-color: #7785db;
      color: #fff;
    }
    .btn2 {
      background-color: #ff6201;
      color: #fff;
    }
  }
}
</style>
