<template>
|
<GlobalWindow
|
:title="title"
|
width="600px"
|
:visible.sync="visible"
|
:confirm-working="submitting"
|
:confirm-text="'确认派单'"
|
@confirm="handleSubmit"
|
>
|
<el-form ref="refundForm" :model="refundForm" v-if="orderInfo && orderInfo.order">
|
<!-- 订单基本信息 -->
|
<el-row :gutter="20" style="margin-bottom: 20px;">
|
<el-col :span="8">
|
<el-form-item label="订单编号">
|
<span>{{ orderInfo.order.code }}</span>
|
</el-form-item>
|
</el-col>
|
<el-col :span="8">
|
<el-form-item label="订单总价">
|
<span style="color: #f56c6c;">¥{{ (orderInfo.order.totalAmount / 100).toFixed(2) }}</span>
|
</el-form-item>
|
</el-col>
|
<el-col :span="8">
|
<el-form-item label="配送方式">
|
<span>{{ orderInfo.order.type === 0 ? '就地存取' : '同城寄送' }}</span>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
|
<!-- 物品明细表格 -->
|
<el-table :data="orderInfo.detailList" stripe style="margin-bottom: 20px;">
|
<el-table-column prop="typeName" label="物品名称" min-width="150px"></el-table-column>
|
<el-table-column prop="luggageName" label="物品尺寸" min-width="120px"></el-table-column>
|
<el-table-column label="配送价（元）" min-width="120px">
|
<template slot-scope="{row}">
|
¥{{ ((row.unitPrice||0) / 100).toFixed(2) }}
|
</template>
|
</el-table-column>
|
<el-table-column prop="num" label="数量" min-width="80px"></el-table-column>
|
<el-table-column label="小计（元）" min-width="120px">
|
<template slot-scope="{row}">
|
<span class="yellowstate"> ¥{{ ((row.subtotal ||0) / 100).toFixed(2) }}</span>
|
</template>
|
</el-table-column>
|
</el-table>
|
|
<!-- 退款表单 -->
|
<el-form-item label="送达门店" prop="depositShopId" label-suffix="：*" :rules="[{ required: true, message: '请选择送达门店', trigger: 'change' }]">
|
<div style="display: flex; align-items: center;">
|
<el-select v-model="refundForm.depositShopId" placeholder="请选择送达门店" :loading="loadingShop" style="width: 200px;">
|
<el-option v-for="shop in shopList" :key="shop.id" :label="shop.name" :value="shop.id"></el-option>
|
</el-select>
|
<span style="color: red; flex-shrink: 0; margin-left: 10px;">派单前须与门店沟通确认好</span>
|
</div>
|
</el-form-item>
|
<el-form-item label="异常金额" prop="driverCompensation" label-suffix="：*" :rules="[{ required: true, message: '请输入异常金额', trigger: 'blur' }, { validator: validateAmount, trigger: 'blur' }]">
|
<el-input v-model="refundForm.driverCompensation" placeholder="请输入异常金额，用于补贴司机" suffix-icon="el-icon-yuan"></el-input>
|
</el-form-item>
|
<el-form-item label="门店保管补贴" prop="shopCompensation" label-suffix="：*" :rules="[{ required: true, message: '请输入门店保管补贴', trigger: 'blur' }, { validator: validateAmount, trigger: 'blur' }]">
|
<el-input v-model="refundForm.shopCompensation" placeholder="请输入门店保管补贴，用于补偿门店" suffix-icon="el-icon-yuan"></el-input>
|
</el-form-item>
|
<el-form-item label="备注说明" prop="textarea">
|
<el-input v-model="refundForm.remark" type="textarea" :rows="4" placeholder="请输入备注说明"></el-input>
|
</el-form-item>
|
</el-form>
|
</GlobalWindow>
|
</template>
|
|
<script>
|
import BaseOpera from '@/components/base/BaseOpera'
|
import GlobalWindow from '@/components/common/GlobalWindow'
|
import { getById } from '@/api/business/orderManagement'
|
import { handleException } from '@/api/business/orders'
|
import { fetchList } from '@/api/business/shopInfo'
|
|
export default {
|
name: 'OperaAbnormal',
|
extends: BaseOpera,
|
components: { GlobalWindow },
|
data () {
|
return {
|
title: '异常派单',
|
submitting: false,
|
orderId: null,
|
orderInfo: null,
|
shopList: [],
|
loadingShop: false,
|
refundForm: {
|
depositShopId: '',
|
driverCompensation: '',
|
shopCompensation: '',
|
remark: ''
|
}
|
}
|
},
|
methods: {
|
validateRefundAmount(rule, value, callback) {
|
let refundAmount = (((this.orderInfo.order.payAmount||0) - (this.orderInfo.order.refundAmount ||0)) / 100)
|
// 退款金额必须大于0
|
if (Number(value) <= 0) {
|
callback(new Error('退款金额必须大于0'))
|
}
|
console.log(Number(value))
|
console.log(refundAmount)
|
// 退款金额必须小于等于可退金额
|
if (Number(value) > refundAmount) {
|
callback(new Error('退款金额不能超过可退金额'))
|
}
|
|
callback()
|
},
|
validateAmount(rule, value, callback) {
|
// 金额必须大于等于0
|
if (value !== null && value !== undefined && Number(value) < 0) {
|
callback(new Error('金额必须大于等于0'))
|
}
|
callback()
|
},
|
open (title, row) {
|
this.title = title
|
this.orderId = row.id
|
this.orderInfo = null
|
this.visible = true
|
this.getOrderDetail()
|
this.fetchShopList()
|
},
|
async getOrderDetail () {
|
const response = await getById(this.orderId)
|
this.orderInfo = response
|
},
|
async fetchShopList() {
|
this.loadingShop = true
|
try {
|
const response = await fetchList({
|
capacity: 99999,
|
page: 1,
|
model: {
|
auditStatus: 3,
|
versionType: 0
|
}
|
})
|
this.shopList = response.records || []
|
} finally {
|
this.loadingShop = false
|
}
|
},
|
async handleSubmit () {
|
this.$refs.refundForm.validate(async (valid) => {
|
if (valid) {
|
this.submitting = true
|
// 拷贝一个新的对象，避免直接修改refundForm
|
const formData = { ...this.refundForm }
|
|
// 转换为接口需要的参数格式
|
const params = {
|
orderId: this.orderId,
|
depositShopId: formData.depositShopId,
|
driverCompensation: Math.round(formData.driverCompensation * 100),
|
shopCompensation: Math.round(formData.shopCompensation * 100),
|
remark: formData.remark
|
}
|
try {
|
await handleException(params)
|
this.submitting = false
|
this.visible = false
|
this.$emit('success')
|
} catch (error) {
|
console.log(error)
|
this.submitting = false
|
this.$message.error(error.message)
|
}
|
// 调用手动退款接口
|
}
|
})
|
},
|
handleClose () {
|
this.$refs.refundForm.resetFields()
|
this.refundForm = {
|
depositShopId: '',
|
driverCompensation: '',
|
shopCompensation: '',
|
remark: ''
|
}
|
}
|
}
|
}
|
</script>
|
|
<style scoped>
|
</style>
|
