<template> <view class=""> <u-navbar title="退款/售后" :placeholder="true" :autoBack="true" :safeAreaInsetTop="true" > </u-navbar> <view class="page-wrap"> <view class="status">{{pageData.status|filterRefundState}}</view> <view class="box"> <view class="order-product page-wrap"> <view class="product u-flex" v-for="(item,index) in pageData.goodsList" :key="item.id"> <u--image :showLoading="true" :src="item.mainImg" width="180rpx" height="180rpx"></u--image> <view class="text"> <view class="up"> <view class="name ellipsis-2">{{item.goodsName}}</view> <view class="info"> {{item.specification}} {{item.unit}} </view> </view> <view class="down u-flex u-row-between"> <view class="left"> <text class="price">¥ <text class="price-num">{{item.price}}</text></text> </view> <u-number-box v-model="item.quantity" :disabled="true" @change="changeQuantity(index, $event)" integer></u-number-box> </view> </view> </view> </view> </view> <view class="box order-info page-wrap"> <view class="order-info-item" v-for="(item,index) in orderInfo" :key="index"> <text class="til">{{item.til}}</text> <text class="con"> <text v-if="item.isMoney">¥</text> {{pageData[item.con]}} </text> </view> </view> </view> </view> </template> <script> export default { data() { return { orderId:'', pageData:{}, orderInfo:[ {til:'订单编号',con:'orderNum'}, {til:'申请金额',con:'orderAmount',isMoney:true}, // {til:'申请件数',con:'quantity'}, {til:'申请原因',con:'refundReason'}, {til:'问题描述',con:'remark'}, ] } }, onShow() { this.getData() }, onLoad(page) { this.orderId =page.orderId }, methods: { getData(){ this.$u.api.refundInfo({orderId:this.orderId}).then(res=>{ this.pageData = res.data console.log('res',res.data); }).catch(err=>{ console.log('refundInfo',err); }) } } } </script> <style> page{ background-color: #F5F5F5; } </style> <style lang="scss" scoped> .status{ text-align: center; font-size: 32rpx; font-weight: 600; color: #FFB100; line-height: 45rpx; margin-bottom: 20rpx; } .box{ background-color: #fff; border-radius: 8rpx; margin-bottom: 20rpx; } .order-info{ .order-info-item{ font-size: 30rpx; font-weight: 400; color: #333333; line-height: 42rpx; padding: 30rpx 20rpx; &:not(:last-child){ border-bottom: 0.5px solid #eee; } .til{ font-size: 24rpx; font-weight: 400; color: #999999; margin-right: 90rpx; } } } </style>