80 lines
1.9 KiB
Vue
80 lines
1.9 KiB
Vue
<template>
|
|
<view>
|
|
<u-popup ref="popup" :show="showPopup" :round="10" @close="closePopup" :mask-close-able="false">
|
|
<view class="cancel-reason-container">
|
|
<view class="title">选择退款原因</view>
|
|
<view class="reason-list">
|
|
<view v-for="(reason, index) in applyRefundReasons" :key="index" class="reason-item"
|
|
@click="selectReason(index)">
|
|
<view :class="['radio', selectedReason === index ? 'active' : '']"></view>
|
|
<text>{{ reason }}</text>
|
|
</view>
|
|
</view>
|
|
<button class="confirm-btn" @click="confirmRefund">确认取消</button>
|
|
</view>
|
|
</u-popup>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import { NavgateTo } from '../../../../../utils';
|
|
|
|
export default {
|
|
name: 'refundPopup',
|
|
props: {
|
|
showPopup: {
|
|
type: Boolean,
|
|
default: false
|
|
},
|
|
},
|
|
data() {
|
|
return {
|
|
applyRefundReasons: [
|
|
'不想要了，无理由退货',
|
|
'商品信息拍错',
|
|
'没用/少用优惠',
|
|
'缺货',
|
|
'其他'
|
|
],
|
|
selectedReason: 0
|
|
};
|
|
},
|
|
methods: {
|
|
closePopup() {
|
|
this.$emit('update:showPopup', false);
|
|
},
|
|
|
|
selectReason(index) {
|
|
this.selectedReason = index;
|
|
},
|
|
|
|
confirmRefund() {
|
|
const selectedText = this.applyRefundReasons[this.selectedReason];
|
|
console.log("🚀 ~ confirmRefund ~ 退款原因:", selectedText);
|
|
this.$emit('update:showPopup', false);
|
|
this.$emit('refundConfirmed', { reason: selectedText });
|
|
uni.showModal({
|
|
title: '退款申请成功',
|
|
content: '将在审核后完成退款',
|
|
showCancel: false,
|
|
success: (res) => {
|
|
if (res.confirm) {
|
|
console.log('用户点击确定');
|
|
}
|
|
}
|
|
});
|
|
}
|
|
},
|
|
watch: {
|
|
showPopup(newVal) {
|
|
if (newVal) {
|
|
this.selectedReason = 0;
|
|
}
|
|
}
|
|
}
|
|
};
|
|
</script>
|
|
|
|
<style scoped>
|
|
@import './refund.css';
|
|
</style> |