<template>
  <view class="content">
    <uni-nav-bar statusBar fixed title="支付结果"></uni-nav-bar>
    <view class="flex-col group_5">
      <view class="flex-col section_3">
        <view class="flex-col items-center">
          <image src="/static/imgs/general/order-success-icon.png" class="image_7" />
        </view>
        <view class="flex-col items-center group_9">
          <text class="text_6">支付成功</text>
          <text class="text_7">付款¥ {{ price }}</text>
        </view>
        <view class="flex-col items-center text-wrapper" @click="jump"
          ><text class="text_8">查看订单</text></view
        >
        <view class="flex-col items-center group_10">
          <image
            v-show="imgUrl"
            :show-menu-by-longpress="true"
            :src="imgUrl"
            class="image_9"
            mode="widthFix"
          />
        </view>
      </view>
    </view>
  </view>
</template>

<script>
import { go2, back } from "@/utils/hook.js";
import { imgStamp } from "@/enums/index";
export default {
  data() {
    return {
      imgStamp,
      type: "success",
      imgUrl: "",
      price: 0,
    };
  },
  onLoad(options) {
    this.type = options.type;
    this.imgUrl = options.imgUrl;
    this.price = options.price;
  },
  methods: {
    go2,
    back,
    jump() {
      go2("order");
    },
  },
};
</script>

<style lang="scss" scoped>
.content {
  width: 750rpx;
}
.group_5 {
  padding: 20rpx 0 786rpx;
  flex: 1 1 auto;
  overflow-y: auto;
  .section_3 {
    margin: 0 32rpx;
    padding: 48rpx 24rpx 8rpx;
    background-color: rgb(255, 255, 255);
    border-radius: 10rpx;
    .group_9 {
      margin-top: 40rpx;
      .text_6 {
        color: rgb(51, 51, 51);
        font-size: 34rpx;
        font-family: "PingFangSC-Medium";
        font-weight: 500;
        line-height: 48rpx;
      }
      .text_7 {
        margin-top: 16rpx;
        color: rgb(85, 85, 85);
        font-size: 24rpx;
        font-family: "PingFangSC-Regular";
        line-height: 33rpx;
      }
    }
    .text-wrapper {
      margin-top: 47rpx;
      padding: 11rpx 0;
      align-self: center;
      background-color: rgb(255, 255, 255);
      border-radius: 32rpx;
      width: 196rpx;
      border: solid 1rpx rgb(151, 151, 151);
      .text_8 {
        color: rgb(85, 85, 85);
        font-size: 28rpx;
        font-family: "PingFangSC-Regular";
        line-height: 40rpx;
      }
    }
    .group_10 {
      padding: 48rpx 0;
      .image_9 {
        width: 638rpx;
      }
    }
    .image_7 {
      width: 151rpx;
      height: 86rpx;
    }
  }
}
</style>
