dingdong-master/pages/order-manage/modal/agree-after-sale-goods.vue

240 lines
7.3 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<view class="cu-modal" :class="show?'show':''">
<view class="cu-dialog bg-white">
<view class="cu-bar">
<view class="content">同意售后</view>
<view class="action" data-modal="agreeAfterSale" @click="hideModal">
<text class="cuIcon-close text-red"></text>
</view>
</view>
<view class="padding text-left">
<view class="text-lg">
<text>退款金额</text>
<text class="text-price text-red">{{data.afterServiceRecordList[0].refund ? data.afterServiceRecordList[0].refund : data.payMoney}}</text>
</view>
<view v-if="!data.isOnlyServ && data.afterServiceRecordList[0].refund && data.payMoney < data.afterServiceRecordList[0].refund" class="padding-top text-red">
警报:该单关联其它订单,客户申请的退款金额有效,有疑问可先沟通派单公司(详情处电话),如确认同意,最大退款额以本单接单额原路退回,其余需退的或你仍有收益则由派单公司处理,如更改退单额,需先协商一致,余额部分完单后计入你账户。
</view>
<view class="flex justify-start align-center margin-top-sm">
<view class="title">收货状态:</view>
<my-uni-combox class="form-val-area inline-input" :candidates="workerReceiveStatusArr" placeholder="请选择" :showField="'name'"
v-model="workerReceiveStatus">
</my-uni-combox>
</view>
<view class="flex justify-start align-center margin-top-sm">
<view class="title">同意选项:</view>
<my-uni-combox class="form-val-area inline-input" :candidates="workerAgreeTypeArr" placeholder="请选择" :showField="'name'"
v-model="workerAgreeType">
</my-uni-combox>
</view>
<view class="text-lg padding-top flex justify-start align-center">
<text>更改退款金额:</text>
<input type="digit" class="radius-input inline-input" style="flex-basis:25%" v-model="agreedRefund"></input>
<text class="margin-left-xs">元</text>
</view>
<view class="padding-top">
<view class="flex justify-start">
<view>原因选择:</view>
<radio-group @change="changeReasonRadio">
<label class="radio margin-right-sm">
<radio style="transform:scale(0.7)" class="main-color" :value="1" :checked="data.reasonType === 1"/>
<text>客户原因</text>
</label>
<label class="radio">
<radio style="transform:scale(0.7)" class="main-color" :value="2" :checked="data.reasonType === 2"/>
<text>师傅原因</text>
</label>
<label class="radio">
<radio style="transform:scale(0.7)" class="main-color" :value="3" :checked="data.reasonType === 3"/>
<text>其他</text>
</label>
</radio-group>
</view>
<view class="margin-top">
<textarea style="width: 100%; height: 200rpx;" fixed="true" class="solid radius text-left padding-sm"
v-model="remark" maxlength="-1"
placeholder="请输入同意原因或更改金额原因(更改退单金额需与客户协商一致,或请订单详情处“派单公司”介入,否则可能被拒绝或引起客诉升级)"></textarea>
</view>
</view>
</view>
<view class="cu-bar solid-top">
<view class="action margin-0 flex-sub text-black" data-modal="agreeAfterSale" @click="hideModal">取消</view>
<view class="action margin-0 flex-sub text-main-color solid-left" data-modal="agreeAfterSale"
@click="showNotice">确认</view>
</view>
</view>
<confirm-modal ref="notice" :content="'本单款项银联确认已发起支付,款项已到达或即将到达您所绑定帐户,需退款的同意后您线下与客户操作退款,系统无法提供原路返回退款!'" :confirmMsg="'同意'" @confirm="noticeConfirm" @cancel="noticeCancel"></confirm-modal>
</view>
</template>
<script>
import myUniCombox from '@/components/uni-combox/my-uni-combox.vue';
export default {
name: 'agreeAfterSale',
components: {
myUniCombox
},
props: {
show: {
type: Boolean,
default: false
},
data: {
type: Object,
default: () => {}
}
},
data() {
return {
agreedRefund: null,
reasonType: null,
remark: null,
workerReceiveStatus: null,
workerAgreeType: null,
workerReceiveStatusArr: [
{
code: 1,
name: '未发货'
},
{
code: 2,
name: '已发货在途'
},
{
code: 3,
name: '已收货'
},
{
code: 4,
name: '售后保障期'
},
],
workerAgreeTypeArr: [
{
code: 1,
name: '同意即时退单退款'
},
{
code: 2,
name: '同意货物拦截后退单退款'
},
{
code: 3,
name: '同意快递返回货物后退单退款'
},
{
code: 4,
name: '同意您退回货物后退单退款'
}
]
}
},
methods: {
hideModal(e) {
this.resetData();
this.$emit('close', e);
},
resetData() {
// this.data = null;
this.agreedRefund = null;
this.reasonType = null;
this.remark = null;
this.workerReceiveStatus = null;
this.workerAgreeType = null;
},
changeReasonRadio(e) {
this.reasonType = e.detail.value;
},
showNotice(e) {
if (this.data.drawCashStatus != null && this.data.drawCashStatus >= 1) {
this.$refs.notice.showModal();
} else {
this.submit(e);
}
},
noticeConfirm() {
this.submit({
currentTarget: {
dataset: {
modal: 'agreeAfterSale'
}
}
});
},
noticeCancel() {
this.hideModal({
currentTarget: {
dataset: {
modal: 'agreeAfterSale'
}
}
});
},
async submit(e) {
if(!this.workerReceiveStatus) {
uni.showToast({
title: '请选择收货状态',
icon: 'none',
duration: 1500
})
return
}
if(!this.workerAgreeType) {
uni.showToast({
title: '请选择同意选项',
icon: 'none',
duration: 1500
})
return
}
let agreedRefund = this.agreedRefund;
if (!agreedRefund && this.data.afterServiceRecordList[0].refund != null) {
agreedRefund = this.data.afterServiceRecordList[0].refund;
} else if (!agreedRefund) {
agreedRefund = this.data.payMoney;
}
console.log({
id: this.data.afterServiceRecordList[0].id,
workerFeedbackReasonType: this.reasonType,
agreedRefund: agreedRefund,
workerFeedbackReason: this.remark,
workerFeedbackResult: 1,
updateBy: 2,
workerReceiveStatus: this.workerReceiveStatus.code,
workerAgreeType: this.workerAgreeType.code
});
let res = await this.$request.editAfterServiceGoodsRecord({
id: this.data.afterServiceRecordList[0].id,
workerFeedbackReasonType: this.reasonType,
agreedRefund: agreedRefund,
workerFeedbackReason: this.remark,
workerFeedbackResult: 1,
updateBy: 2,
workerReceiveStatus: this.workerReceiveStatus.code,
workerAgreeType: this.workerAgreeType.code
});
if (res && res.code === 0) {
uni.showToast({
icon: 'success',
title: '提交成功',
duration: 1000
})
this.hideModal(e);
this.$emit('confirmFeedback');
return;
}
uni.showToast({
icon: 'error',
duration: 1000,
title: '提交失败',
})
}
},
}
</script>
<style scoped>
.inline-input {
flex-basis: 74%;
}
</style>