<!--
 * @Author: euzhi
 * @Description: 申请退款
-->
<template>
<view class="appCotent">
<div class="pull">
    <div class="view__content">
        <div class="view__item" v-for="(vo,inx) in items" :key="inx">
            <div class="view__title">
                {{vo.title}}
            </div>
            <div class="view__value">
                {{vo.value}}
            </div>
        </div>
       <div class="why">
            <u--textarea v-model="value1" placeholder="地址输入错误，需重新拍下。地址输入错误，需重新拍下。地址输入错误，需重新拍下。" ></u--textarea>
       </div>
           <div class="view__btn view__no__bind" @click="orderRefund">
        提交申请
    </div>
    </div>

</div>
</view>
</template>

<script>
export default {
    data() {
        return {
            value1:'',
            items: [{
                    title: "退款金额:",
                    value: "￥0.00"
                },
                {
                    title: "退款原因:",
                    value: ""
                },
            ],
			//订单id
			orderId: '',
			//订单详情
			orderInfo: {},
        };
    },
    methods: {
		getOrderInfo(){
			let opts = { url: '/app/user/order/info/' + this.orderId, method: 'get' };
			this.http.httpTokenRequest(opts, {}).then(res => {
				if (res.data.code == 200) {
					this.orderInfo = res.data.data
					this.items[0].value = "￥" + (res.data.data.amount/100)
				}
			})
		},
		orderRefund(){
			let opts = { url: '/app/user/order/refund', method: 'post' };
			let orderRefund = {
				orderId: this.orderInfo.id,
				reason: this.items[1].value
			}
			this.http.httpTokenRequest(opts, orderRefund).then(res => {
				if (res.data.code == 200) {
					
				}
			})
		}
    },
	onLoad(e) {
		this.orderId = e.orderId
	},
	onShow() {
		this.getOrderInfo()
	}
}
</script>

<style lang="scss" scoped>
.pull {
    padding: 40rpx 0rpx;
    .why{
        padding: 5rpx 40rpx;
        .u-textarea{
            background: #f6f6f6;
            border:none;
        }
    }
    .view__content {
        background: #FFFFFF;
        box-shadow: 0rpx 0rpx 28rpx 1rpx rgba(232, 232, 232, 0.2);
        border-radius: 20rpx;
        padding-bottom: 60rpx;
        .view__item {
            padding: 34rpx 0rpx;
            margin: 0 40rpx;
            display: flex;
            align-items: center;
            justify-content: space-between;
            border-bottom: 1rpx solid rgba(0, 0, 0, .1);

            .view__title {
                font-size: 32rpx;
                font-family: PingFang SC;
                font-weight: 500;
                color: #333333;
            }

            .view__value {
                font-size: 24rpx;
                font-family: PingFang SC;
                font-weight: 500;
                color: #F1251B;
            }
        }

        .view__item:nth-of-type(2) {
            border-bottom: none !important;
        }
    }

    .view__btn {
        width: 670rpx;
        height: 76rpx;
        text-align: center;
        line-height: 76rpx;
        margin: 0 auto;
        font-size: 32rpx;
    }

    .view__no__bind {
        background: url('@/static/move-car/move-car-view2.png') no-repeat;
        margin-bottom: 30rpx;
        background-size: contain;
        color: rgba(255, 255, 255, 1);
        margin-top: 60rpx;
    }

    .view__back {
        background: url('@/static/move-car/move-car-view1.png') no-repeat;
        background-size: contain;
        color: rgba(153, 153, 153, 1);
    }
}
</style>
