Files
jjx-web-sign-only/pages/order/components/makePay.vue
T
2026-10-08 18:20:51 +08:00

191 lines
7.3 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">
<vk-data-upload v-model="payInfo.photos"></vk-data-upload>
</el-form-item>
<el-form-item label="凭证" v-else required>
<vk-data-upload v-model="payInfo.expressPhoto"></vk-data-upload>
</el-form-item>
</template>
<el-form-item label="附件">
<vk-data-upload v-model="payInfo.ext"></vk-data-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>
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.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.isExpress) {
this.$confirm('发货状态一旦确定无法修改,请谨慎操作', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(async () => {
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)
console.log(this.payInfo.isExpress, this.payInfo.type)
}
},
mounted() {
this.getOrderInfo()
}
}
</script>