191 lines
6.9 KiB
Vue
191 lines
6.9 KiB
Vue
<template>
|
||
<view>
|
||
<div class="font-bold">
|
||
<span>订单编号: {{ orderInfo.orderNo }}</span>
|
||
<span class="ml-20 text-main" v-if="orderInfo.orderStatus > 1">(已发货)</span>
|
||
</div>
|
||
<div class="font-bold my-25">订单总额: {{ orderInfo.amount }}元</div>
|
||
<div class="text-main text-25 my-25" style="line-height: 1.9;">
|
||
<p>情况1、如遇有大额多车次，多批次交易，应涉及进度款，如100万合同，前期到两车，可以申请进度款；</p>
|
||
<p>情况2、如果单次可一次性送达则实行全款。</p>
|
||
<p>情况3、如为定制产品，双方协商可给协商比例的进度款。</p>
|
||
<p>情况4、有可能有剩余款项，交易完成可申请平台退款。</p>
|
||
<p>情况5、有可能实际发货量大于订货量，货款不足。</p>
|
||
</div>
|
||
<el-form ref="form" label-width="80px">
|
||
<el-form-item label="支付类型" required>
|
||
<el-select v-model="payInfo.type" @change="changeType">
|
||
<el-option
|
||
v-for="item in payTypeList"
|
||
:key="item"
|
||
:label="item"
|
||
:value="item"
|
||
:disabled="(!['预付款', '全款'].includes(item) && orderInfo.payStatus === 0)
|
||
|| (['预付款', '全款'].includes(item) && orderInfo.payStatus > 0)"
|
||
>
|
||
</el-option>
|
||
</el-select>
|
||
</el-form-item>
|
||
<el-form-item :label="payInfo.type" required>
|
||
<el-input v-model="payInfo.amount" placeholder="请输入金额"/>
|
||
</el-form-item>
|
||
<el-form-item label="备注">
|
||
<el-input v-model="payInfo.remark"/>
|
||
</el-form-item>
|
||
<el-form-item label="凭证">
|
||
<u-upload
|
||
multiple
|
||
:fileList="payInfo.photos"
|
||
@afterRead="afterRead($event, 'photos')"
|
||
@delete="deletePic($event, 'photos')"
|
||
width="120rpx"
|
||
height="120rpx"
|
||
></u-upload>
|
||
</el-form-item>
|
||
<el-form-item label="附件">
|
||
<u-upload
|
||
multiple
|
||
:fileList="payInfo.ext"
|
||
@afterRead="afterRead($event, 'ext')"
|
||
@delete="deletePic($event, 'ext')"
|
||
width="120rpx"
|
||
height="120rpx"
|
||
></u-upload>
|
||
</el-form-item>
|
||
</el-form>
|
||
<el-row>
|
||
<el-col :span="24" class="text-center">
|
||
<el-button type="primary" size="mini" @click="setPayList">提交</el-button>
|
||
<el-button type="warning" size="mini" @click="close">取消
|
||
</el-button>
|
||
</el-col>
|
||
</el-row>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import dayjs from "dayjs";
|
||
|
||
export default {
|
||
name: "makePay",
|
||
props: {
|
||
info: {
|
||
type: Object,
|
||
default: () => {
|
||
return {}
|
||
}
|
||
},
|
||
payTypeList: {
|
||
type: Array,
|
||
default: () => {
|
||
return []
|
||
}
|
||
},
|
||
|
||
},
|
||
data() {
|
||
return {
|
||
payInfo: {
|
||
orderId: this.info._id,
|
||
amount: null,
|
||
type: null,
|
||
remark: '',
|
||
buyerRemark: '',
|
||
photos: [],
|
||
payerUid: null,
|
||
hasPaid: false,
|
||
paidVoucher: '',
|
||
paidAt: '',
|
||
sellerConfirm: false,
|
||
confirmAt: '',
|
||
buyerUid: this.info.uid,
|
||
sellerUid: this.info.sellerUid,
|
||
status: 0,
|
||
buyerRefuse: false,
|
||
refuseReason: null,
|
||
buyerPhotos: [],
|
||
expressPhoto: [],
|
||
isExpress: false,
|
||
expressName: null,
|
||
expressNo: null,
|
||
ext: [],
|
||
},
|
||
orderInfo: {
|
||
payStatus: 0
|
||
}
|
||
}
|
||
},
|
||
methods: {
|
||
close() {
|
||
this.$emit("close")
|
||
},
|
||
async getOrderInfo() {
|
||
this.orderInfo = await vk.callFunction({
|
||
url: 'client/order/kh/getInfo',
|
||
data: {
|
||
id: this.info._id
|
||
}
|
||
})
|
||
},
|
||
async setPayList() {
|
||
if (!this.payInfo.type) return this.$message({
|
||
type: 'error',
|
||
message: '请选择支付类型'
|
||
})
|
||
if (!this.payInfo.amount) return this.$message({
|
||
type: 'error',
|
||
message: '请输入支付金额'
|
||
})
|
||
if (this.payInfo.photos && this.payInfo.photos.length > 0) this.payInfo.photos = this.payInfo.photos.map(i => i.url)
|
||
if (this.payInfo.ext && this.payInfo.ext.length > 0) this.payInfo.ext = this.payInfo.ext.map(i => i.url)
|
||
await vk.callFunction({
|
||
url: 'client/order/kh/makePay',
|
||
title: '请求中...',
|
||
data: {payInfo: this.payInfo}
|
||
})
|
||
this.$message({
|
||
type: 'success',
|
||
message: '支付单创建成功'
|
||
})
|
||
this.close()
|
||
},
|
||
changeType() {
|
||
if (['尾款', '全款'].includes(this.payInfo.type)) {
|
||
this.$confirm(
|
||
'选择尾款或全款支付申请，均代表本次交易已完结，对应本次交易最终货款的结算完成。提交申请后，系统无法再次发起付款申请；若发生误申请情形，仅可通过交易双方协商线下渠道协商办理支付，请您谨慎选择。',
|
||
'重要提示',
|
||
{
|
||
confirmButtonText: '确认为最终结算',
|
||
showCancelButton: false,
|
||
type: 'warning'
|
||
}
|
||
)
|
||
}
|
||
},
|
||
afterRead({file}, field) {
|
||
file.forEach(item => {
|
||
console.log(item)
|
||
uniCloud.uploadFile({
|
||
filePath: item.url,
|
||
cloudPath: dayjs().format('YYYY/MM/DD') + '/' + item.name,
|
||
success: ({fileID}) => {
|
||
uniCloud.getTempFileURL({
|
||
fileList: [fileID]
|
||
}).then(res => {
|
||
this.payInfo[field].push({url: res.fileList[0].tempFileURL})
|
||
console.log(this.payInfo[field])
|
||
})
|
||
}
|
||
})
|
||
})
|
||
},
|
||
deletePic({index}, field) {
|
||
this.payInfo[field].splice(index, 1)
|
||
},
|
||
},
|
||
mounted() {
|
||
this.getOrderInfo()
|
||
}
|
||
}
|
||
</script>
|