<template>
    <view>
        <view class="padding-xl">
            <view class="text-center">
                <view :class="fetch.class"></view>
                <view class="margin-top text-xl">{{fetch.status_text}}</view>
            </view>
            <view class="bg-white margin-top grace-border-t grace-shadow">
                <view class="padding grace-border-b">
                    <view class="grace-space-between grace-flex-vcenter">
                        <view class="text-hui text-sm">支付金额</view>
                        <view class="text-ssblue">{{fetch.price}}</view>
                    </view>
                </view>
                <view class="padding grace-border-b">
                    <view class="grace-space-between grace-flex-vcenter">
                        <view class="text-hui text-sm">支付方式</view>
                        <view class="text-ssblue">{{fetch.pay_type.name}}</view>
                    </view>
                </view>
                <view class="padding grace-border-b">
                    <view class="grace-space-between grace-flex-vcenter">
                        <view class="text-hui text-sm">订单号码</view>
                        <view class="text-ssblue">{{fetch.order_id}}</view>
                    </view>
                </view>
                <view class="padding grace-border-b">
                    <view class="grace-space-between grace-flex-vcenter">
                        <view class="text-hui text-sm">支付时间</view>
                        <view class="text-ssblue">{{fetch.pay_at}}</view>
                    </view>
                </view>
            </view>
            <button type="primary" class="grace-button buttom-radius buttom-shadow margin-top-xxl" @click="toIndex">
                {{fetch.text}}
            </button>
            
        </view>
		<pageLoading :pageLoading="pageLoading"></pageLoading>
    </view>
</template>

<script>
    export default {
        data() {
            return {
                fetch : {
					status : 2,
					status_text : '支付中',
					pay_type : {
						name : '',
					},
					pay_at : '',
					price : '',
					order_id : '',
					text : '返回首页',
					class : 'grace-icons bg-blue icon-right text-xxxl text-bold',
				}
            }
        },
		onLoad: function(option) {
			this.code = option.code;
		},
		onShow:function(){
			this.Dever.checkLogin();
			this.getInfo();
		},
        methods: {
			getInfo: function() {
				this.Dever.get(this, 'buyMsg', {code:this.code});
			},
            toIndex : function () {
                uni.switchTab({
                    url: '/pages/index/index'
                });
            }
        }
    }
</script>

<style>
.icon-right {border-radius: 50%;width: 100rpx;height: 100rpx;line-height: 100rpx;margin: 0 auto;}
.grace-border-t{border-top:5px solid #3c64c9;}
</style>
