market-app-ui/pages/wallet/topup/topupSuccess.vue

<template>
  <view class="success-container">
    <text class="success-title">充值成功</text>
    <text class="success-amount">充值点数: {{ info.amount }}</text>
    <text class="success-message">您的服务点数已更新</text>
    <button class="return-btn" @tap="returnToHome">返回</button>
  </view>
</template>

<script>
export default {
  data() {
    return {
      info: {
		  amount:0
	  }
    }
  },
  onLoad(option) {
    // 从路由参数中获取充值金额
	this.geDetail(option.prePayId);
  },
  methods: {
	  geDetail(prePayId){
		  this.http.request({
			  url:'/level-one-server/app/TbWalletTopup/getByPrePayId',
			  data:{prePayId:prePayId},
			  success:resp=>{
				  this.info=resp.data.data;
			  }
		  })
	  },
    returnToHome() {
      // 返回到应用的首页
      uni.reLaunch({
        url: '/pages/personal/personal'
      })
    }
  }
}
</script>

<style>
@font-face {
  font-family: 'iconfont';
  src: url('data:application/x-font-woff2;charset=utf-8;base64,d09GMgABAAAAAAKcAAsAAAAABlAAAAJPAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHEIGVgCCcApsgQ0BNgIkAwgLBgAEIAWEbQc2G7oFyK4wbuGJaCVsrXwzCN5Xzef9nLtvzMwHRJIoiAlKQqKQIlGah3TvpF7pzvL/udLXgDhQy0QkqtWuZ87sJvSGnCqkQh6Q0/+cXm0CDnx+oEvNg9oATlsDjLMosgIpIG8Yu8AlPCbQaVYjcVhZ3wIlhTEvEE8MoYBSllQpDW1DvWJjEW9Aazo9Th+BN//9+JeKUkmaMvPi/nHFBco/a3+Wg/9BdAQIEEFwvY2MNSARJ5WZQ1IwLqmTn2WwBdVq8bP2/ycysFXkv7wiyGrIbmAKs+RnrRQEP2vVIPEOXTqx3wTEY7A3cDgFx0vS1d0GlBSIyG5/3Nvde7h69Xrn6Qvd9auDZyuHV3fXL1+ygbZuHT6+Vgm7eAFOx84eX3/Rde7MwZHo9trZ3UtHR3fvHt1dO9c9gu7t3e2jI+jcNbJ/dHvvLrq1tn9y7eDZ9aNn+4/uQNf2T+/t3L3qcPzm9E3H/wdxWPy0z7z9fKs5bK+8mQ+TJfCt/OnGX+Vgp+Dj/0j4N1/8Gx/yEXxrBqXzrWGAn7WfYMFEo2HLlKYGOxSC3KBTJxCtxlHSbgp9Gu3zO3XqhEqLSiVkncYwGbWGRpc1qNVpC52u2F3dZUQpRjpYMQ+h3wVJr0/I+n1hMuoTGqO+odYfJnS6j5hL7LIaZuVYDFGhGPsPnYeKJOlGzTvyNZSLOhPlC49oCnOy4Pk5Z0SKsUNu4SJcFxmGiSAXLuA8dF0Jznmm6FNRqLgxjOp4iEIhDLP/QMdDCimlNjjz/XwNygo1J1Qgki+kUjBOLEGnHycJIdXKdqhbqpZwusAwGEkgXOACctEpCeQ4Ty/RR4lCCo3JFKqOK4r1+TXSD+5AJ+NRpMhRokIdGvQcY6YZk0o6lZRTq5kRAAA=') format('woff2');
}

.success-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 50vh;
  background-color: #ffffff;
  padding: 20px;
}

.success-icon {
  font-size: 80px;
  color: #07c160;
  margin-bottom: 20px;
}

.iconfont {
  font-family: "iconfont" !important;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-success:before {
  content: "\e600";
}

.success-title {
  font-size: 24px;
  font-weight: bold;
  color: #333333;
  margin-bottom: 10px;
}

.success-amount {
  font-size: 18px;
  color: #666666;
  margin-bottom: 10px;
}

.success-message {
  font-size: 16px;
  color: #999999;
  margin-bottom: 30px;
}

.return-btn {
  width: 80%;
  height: 44px;
  line-height: 44px;
  background-color: #07c160;
  color: #ffffff;
  border-radius: 22px;
  text-align: center;
  font-size: 16px;
}
</style>