227 lines
8.9 KiB
Vue
227 lines
8.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>
|
|
<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>
|
|
<template v-if="[0, 1].includes(orderInfo.orderStatus)">
|
|
<el-row :gutter="10">
|
|
<el-col :span="6">
|
|
<el-form-item label="是否发货">
|
|
<el-radio-group v-model="payInfo.isExpress"
|
|
:disabled="['货到付款', '全款'].includes(payInfo.type)">
|
|
<el-radio :label="true">是</el-radio>
|
|
<el-radio :label="false">否</el-radio>
|
|
</el-radio-group>
|
|
</el-form-item>
|
|
</el-col>
|
|
<!-- <el-col :span="12">-->
|
|
<!-- <el-form-item label="物流公司" required>-->
|
|
<!-- <el-input v-model="payInfo.expressName" placeholder="请输入物流公司"/>-->
|
|
<!-- </el-form-item>-->
|
|
<!-- <el-form-item label="物流单号" required>-->
|
|
<!-- <el-input v-model="payInfo.expressNo" placeholder="请输入物流单号"/>-->
|
|
<!-- </el-form-item>-->
|
|
<!-- </el-col>-->
|
|
</el-row>
|
|
<el-form-item label="凭证" v-if="!payInfo.isExpress">
|
|
<u-upload
|
|
multiple
|
|
:fileList="payInfo.photos"
|
|
@afterRead="afterRead($event, 'photos')"
|
|
@delete="deletePic($event, 'photos')"
|
|
width="120rpx"
|
|
height="120rpx"
|
|
></u-upload>
|
|
<!-- <vk-data-upload v-model="payInfo.photos"></vk-data-upload>-->
|
|
</el-form-item>
|
|
<el-form-item label="凭证" v-else required>
|
|
<u-upload
|
|
multiple
|
|
:fileList="payInfo.expressPhoto"
|
|
@afterRead="afterRead($event, 'expressPhoto')"
|
|
@delete="deletePic($event, 'expressPhoto')"
|
|
height="120rpx"
|
|
></u-upload>
|
|
<!-- <vk-data-upload v-model="payInfo.expressPhoto"></vk-data-upload>-->
|
|
</el-form-item>
|
|
</template>
|
|
</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,
|
|
},
|
|
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.isExpress && this.payInfo.expressPhoto.length === 0) return this.$message({
|
|
type: 'error',
|
|
message: '请上传凭证'
|
|
})
|
|
// if (this.payInfo.isExpress && !this.payInfo.expressName) return this.$message({
|
|
// type: 'error',
|
|
// message: '请输入物流公司'
|
|
// })
|
|
// if (this.payInfo.isExpress && !this.payInfo.expressNo) 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.expressPhoto && this.payInfo.expressPhoto.length > 0) this.payInfo.expressPhoto = this.payInfo.expressPhoto.map(i => i.url)
|
|
if (this.payInfo.isExpress) {
|
|
uni.showModal({
|
|
title: '提示',
|
|
content: '发货状态一旦确定无法修改，请谨慎操作',
|
|
success: async res => {
|
|
if (res.confirm) {
|
|
await vk.callFunction({
|
|
url: 'client/order/kh/makePay',
|
|
title: '请求中...',
|
|
data: {payInfo: this.payInfo}
|
|
})
|
|
this.$message({
|
|
type: 'success',
|
|
message: '支付单创建成功'
|
|
})
|
|
this.close()
|
|
}
|
|
}
|
|
})
|
|
} else {
|
|
await vk.callFunction({
|
|
url: 'client/order/kh/makePay',
|
|
title: '请求中...',
|
|
data: {payInfo: this.payInfo}
|
|
})
|
|
this.$message({
|
|
type: 'success',
|
|
message: '支付单创建成功'
|
|
})
|
|
this.close()
|
|
}
|
|
},
|
|
changeType() {
|
|
this.payInfo.isExpress = ['货到付款', '全款'].includes(this.payInfo.type)
|
|
},
|
|
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> |