deming/pageE/order/RefundOrder.vue

142 lines
3.0 KiB
Vue
Raw Normal View History

2020-08-04 19:08:04 +08:00
<template>
<view class="refund">
<view class="radios-container">
<u-radio-group v-model="value" @change="radioChange">
<label class="radio-view" v-for="(item, index) in goodsList" :key="index">
<view class="radio">
<u-radio color="#F0AD4E" :name="item.goods_id" active-color="#FF780F" icon-size="34" shape="circle"></u-radio>
</view>
<view class="store_info">
<view class="info_img">
<image :src="item.goods_image" mode="">
</view>
<view class="info_txt">
<view class="content u-line-2">
{{ item.goods_name }}
</view>
<view class="much">
<text>{{ item.goods_pay_price }}</text>
<text>x{{ item.goods_num }}</text>
</view>
</view>
</view>
</label>
</u-radio-group>
</view>
<view class="refund-details">
<view class="goods-number">
<view>选择数量</view>
<view></view>
</view>
<view class="refund-price">
<view>
<view>退款金额</view>
<view>99.00</view>
</view>
<view>若退款成功将退还给您99.00</view>
</view>
<view class="refund-text">
<view>申请说明</view>
<u-input v-model="refundText" type="textarea" />
</view>
</view>
<view class="submit-btn">提交申请</view>
</view>
</template>
<script>
export default {
data() {
return {
goodsList: [],
value: '',
}
},
onLoad(option) {
this.getOrderInfo(option.oid);
},
methods: {
radioChange(e){
console.log(e)
},
getOrderInfo(id) {
this.$u.api.getOrderInfo({
order_id: id,
}).then(res => {
if(res.errCode == 0) {
// this.orderInfo = res.data;
this.goodsList = res.data.extend_order_goods;
console.log(this.goodsList);
}
// uni.stopPullDownRefresh(); // 结束刷新
})
},
applyRefund() {
let params = {
order_id: this.order.order_id,
// goods_id: goods_id,
// refund_amount: refund_amount,
}
this.$u.api.refundOrder(params).then(res => {
this.$u.toast(res.message);
if(res.errCode == 0) {
}
})
},
}
};
</script>
<style lang="scss" scoped>
.refund {
min-height: calc(100vh - var(--window-top));
background-color: #EDEDED;
.radios-container {
margin-bottom: 20rpx;
.radio-view {
background-color: #FFFFFF;
padding: 26rpx;
display: flex;
align-items: center;
margin-bottom: 1rpx;
.radio {
margin-right: 20rpx;
}
.store_info {
display: flex;
flex-wrap: nowrap;
width: 100%;
.info_img{
>image{
width: 180rpx;
height: 160rpx;
background-color: aqua;
border-radius: 10rpx;
}
}
.info_txt{
padding-left: 30rpx;
padding-right: 30rpx;
display: flex;
flex-wrap: wrap;
width: 100%;
.content{
height: 74rpx;
line-height: 37rpx;
font-size: 30rpx;
color:rgba(51,51,51,1);
}
.much{
display: flex;
justify-content: space-between;
width: 100%;
}
}
}
}
}
.refund-details {
background-color: #FFFFFF;
.goods-number {}
}
}
</style>