feat(订单模块): 优化退款申请对话框及计算逻辑
- 更新退款申请表单,修改运费退回选项的标签和逻辑 - 添加计算属性以支持退款金额和运费的动态计算 - 优化退款申请对话框的样式,提升用户体验 - 更新课程列表中的VIP配置过滤条件,支持新类型的显示
This commit is contained in:
@@ -533,11 +533,11 @@
|
|||||||
</el-dialog>
|
</el-dialog>
|
||||||
<el-dialog title="申请退款" :visible.sync="refundApplyVisible" width="480px" append-to-body
|
<el-dialog title="申请退款" :visible.sync="refundApplyVisible" width="480px" append-to-body
|
||||||
@close="refundApplyDialogClose">
|
@close="refundApplyDialogClose">
|
||||||
<el-form ref="refundApplyFormRef" :model="refundApplyForm" label-width="100px">
|
<el-form ref="refundApplyFormRef" :model="refundApplyForm" label-width="150px">
|
||||||
<el-form-item label="是否退运费">
|
<el-form-item label="是否连运费一并退回">
|
||||||
<el-radio-group v-model="refundApplyForm.refundShipping">
|
<el-radio-group v-model="refundApplyForm.refundShipping" :disabled="!refundApplyHasShipping">
|
||||||
<el-radio :label="1">是</el-radio>
|
<el-radio :label="0">是</el-radio>
|
||||||
<el-radio :label="0">否</el-radio>
|
<el-radio :label="1">否</el-radio>
|
||||||
</el-radio-group>
|
</el-radio-group>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="退款备注">
|
<el-form-item label="退款备注">
|
||||||
@@ -545,9 +545,21 @@
|
|||||||
maxlength="500" show-word-limit></el-input>
|
maxlength="500" show-word-limit></el-input>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-form>
|
</el-form>
|
||||||
<span slot="footer" class="dialog-footer">
|
<span slot="footer" class="dialog-footer refund-apply-dialog-footer">
|
||||||
<el-button @click="refundApplyVisible = false">取 消</el-button>
|
<div class="refund-apply-footer-amount">
|
||||||
<el-button type="primary" :loading="refundApplySubmitting" @click="refundApplySubmit">确 定</el-button>
|
<span class="refund-apply-footer-label">实际退款金额</span>
|
||||||
|
<span class="refund-apply-footer-value">¥{{ formatMoney(refundApplyPreviewAmount) }}</span>
|
||||||
|
<span v-if="refundApplyHasShipping" class="refund-apply-footer-breakdown">
|
||||||
|
实付金额 ¥{{ formatMoney(refundApplyPaidMoney) }}
|
||||||
|
<template v-if="refundApplyForm.refundShipping !== 0">
|
||||||
|
{{ ',扣除运费 ¥' + formatMoney(refundApplyDeductShippingFee) }}
|
||||||
|
</template>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
<div class="refund-apply-footer-actions">
|
||||||
|
<el-button @click="refundApplyVisible = false">取 消</el-button>
|
||||||
|
<el-button type="primary" :loading="refundApplySubmitting" @click="refundApplySubmit">确 定</el-button>
|
||||||
|
</div>
|
||||||
</span>
|
</span>
|
||||||
</el-dialog>
|
</el-dialog>
|
||||||
<el-dialog title="钱款去向" :visible.sync="refundDetailVisible" width="420px" append-to-body>
|
<el-dialog title="钱款去向" :visible.sync="refundDetailVisible" width="420px" append-to-body>
|
||||||
@@ -780,6 +792,40 @@
|
|||||||
this.isMultipleDisabled()
|
this.isMultipleDisabled()
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
computed: {
|
||||||
|
refundApplyHasShipping() {
|
||||||
|
const row = this.refundApplyOrder
|
||||||
|
if (!row || row.orderId == null) return false
|
||||||
|
const ship = Number(row.shippingMoney)
|
||||||
|
return !isNaN(ship) && ship > 0
|
||||||
|
},
|
||||||
|
refundApplyPaidMoney() {
|
||||||
|
const row = this.refundApplyOrder
|
||||||
|
if (!row || row.orderId == null) return 0
|
||||||
|
const n = Number(row.realMoney)
|
||||||
|
return isNaN(n) ? 0 : n
|
||||||
|
},
|
||||||
|
refundApplyDeductShippingFee() {
|
||||||
|
const row = this.refundApplyOrder
|
||||||
|
if (!row || row.orderId == null) return 0
|
||||||
|
const ship = Number(row.shippingMoney)
|
||||||
|
if (isNaN(ship) || ship <= 0) return 0
|
||||||
|
return this.refundApplyForm.refundShipping === 1 ? ship : 0
|
||||||
|
},
|
||||||
|
refundApplyPreviewAmount() {
|
||||||
|
const row = this.refundApplyOrder
|
||||||
|
if (!row || row.orderId == null) return 0
|
||||||
|
const paid = Number(row.realMoney)
|
||||||
|
const shipping = Number(row.shippingMoney)
|
||||||
|
const paidNum = isNaN(paid) ? 0 : paid
|
||||||
|
const shipNum = isNaN(shipping) ? 0 : shipping
|
||||||
|
if (this.refundApplyForm.refundShipping === 1) {
|
||||||
|
const n = paidNum - shipNum
|
||||||
|
return n > 0 ? n : 0
|
||||||
|
}
|
||||||
|
return paidNum
|
||||||
|
}
|
||||||
|
},
|
||||||
methods: {
|
methods: {
|
||||||
computedVipType(userVips) {
|
computedVipType(userVips) {
|
||||||
if (!userVips || userVips.length === 0) return '';
|
if (!userVips || userVips.length === 0) return '';
|
||||||
@@ -1928,6 +1974,44 @@
|
|||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.refund-apply-dialog-footer {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
gap: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.refund-apply-footer-amount {
|
||||||
|
flex: 1;
|
||||||
|
min-width: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.refund-apply-footer-label {
|
||||||
|
color: #606266;
|
||||||
|
font-size: 14px;
|
||||||
|
margin-right: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.refund-apply-footer-value {
|
||||||
|
color: #e6a23c;
|
||||||
|
font-size: 18px;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
|
||||||
|
.refund-apply-footer-breakdown {
|
||||||
|
display: inline-block;
|
||||||
|
margin-left: 6px;
|
||||||
|
color: #909399;
|
||||||
|
font-size: 13px;
|
||||||
|
font-weight: normal;
|
||||||
|
vertical-align: baseline;
|
||||||
|
}
|
||||||
|
|
||||||
|
.refund-apply-footer-actions {
|
||||||
|
flex-shrink: 0;
|
||||||
|
}
|
||||||
|
|
||||||
.refund-detail-dialog {
|
.refund-detail-dialog {
|
||||||
.refund-total-card {
|
.refund-total-card {
|
||||||
background: #f5f7fa;
|
background: #f5f7fa;
|
||||||
|
|||||||
@@ -858,7 +858,7 @@ export default {
|
|||||||
data: this.$http.adornData({}),
|
data: this.$http.adornData({}),
|
||||||
}).then(({ data }) => {
|
}).then(({ data }) => {
|
||||||
if (data && data.code === 0) {
|
if (data && data.code === 0) {
|
||||||
this.vipList = data.vipBuyConfigList.filter(item => item.type >= 4 && item.type <= 9);
|
this.vipList = data.vipBuyConfigList.filter(item => item.type >= 4 && item.type <= 10);
|
||||||
this.svipList = data.vipBuyConfigList.filter(item => item.type === 1 || item.type === 2);
|
this.svipList = data.vipBuyConfigList.filter(item => item.type === 1 || item.type === 2);
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|||||||
Reference in New Issue
Block a user