116 lines
3.4 KiB
Vue
116 lines
3.4 KiB
Vue
<template>
|
||
<u-popup
|
||
v-model="showPopup"
|
||
mode="bottom"
|
||
:customStyle="{
|
||
'background': `none`
|
||
}"
|
||
:closeable="true"
|
||
:mask-close-able="false"
|
||
@close="showPopup = false"
|
||
>
|
||
<view
|
||
style="border-radius: 20rpx 20rpx 0 0;"
|
||
class="append-popup bg-white p-[30rpx] text-center"
|
||
>
|
||
<view class="py-2 font-medium text-2xl text-black">
|
||
{{ title }}
|
||
</view>
|
||
|
||
<view class="mt-3">
|
||
|
||
<view
|
||
class="flex text-base bg-[#f6f7f8]"
|
||
style="border-radius: 20rpx; padding: 20rpx 24rpx;"
|
||
>
|
||
<view class="flex-none text-base font-medium">
|
||
补差价金额
|
||
</view>
|
||
<view class="ml-2 flex-1 text-right">
|
||
<input type="number" v-model="orderAmount" placeholder="¥ 0.00">
|
||
</view>
|
||
</view>
|
||
|
||
<view
|
||
class="flex text-base bg-[#f6f7f8] mt-3"
|
||
style="border-radius: 20rpx; padding: 20rpx 24rpx;"
|
||
>
|
||
<view class="flex-none text-base font-medium">
|
||
备注
|
||
</view>
|
||
<view class="ml-2 flex-1 text-right">
|
||
<input type="text" v-model="orderDesc" placeholder="请输入补差价原因">
|
||
</view>
|
||
</view>
|
||
|
||
<view class="mt-4 text-left">
|
||
<view class="text-xs font-medium text-muted">
|
||
*支付前需与服务人员协商一致，如有异议，请联系平台客服。
|
||
</view>
|
||
<view class="mt-1 text-xs font-medium text-muted">
|
||
系统只保障在线支付的项目，切勿线下支付。
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<view style="margin-top: 90rpx" class="footer flex-1 safe-area-inset-bottom">
|
||
<u-button
|
||
type="primary"
|
||
@click="confirm"
|
||
>
|
||
立即支付
|
||
</u-button>
|
||
</view>
|
||
</view>
|
||
</u-popup>
|
||
</template>
|
||
|
||
<script lang="ts" setup>
|
||
import {computed, ref} from 'vue'
|
||
import {apiOrderGap} from "@/api/order";
|
||
import {useRouter} from "uniapp-router-next";
|
||
|
||
const props = defineProps<{
|
||
show: boolean
|
||
title: string
|
||
order_id: number
|
||
}>()
|
||
|
||
const emits = defineEmits<{
|
||
(event: 'update:show', show: boolean): void
|
||
}>()
|
||
|
||
const showPopup = computed({
|
||
get() {
|
||
return props.show
|
||
},
|
||
set(val) {
|
||
if (!val) {
|
||
orderAmount.value = null
|
||
orderDesc.value = ''
|
||
}
|
||
emits('update:show', val)
|
||
}
|
||
})
|
||
|
||
const router = useRouter()
|
||
const orderAmount = ref<number | null>(null)
|
||
const orderDesc = ref<string>('')
|
||
|
||
const confirm = async () => {
|
||
const { id , type } = await apiOrderGap({
|
||
order_id: props.order_id,
|
||
order_amount: orderAmount.value,
|
||
remark: orderDesc.value
|
||
})
|
||
router.navigateTo({
|
||
url: '/bundle/pages/order_pay/order_pay',
|
||
query: {
|
||
order_id: id,
|
||
from: type,
|
||
order_amount: orderAmount.value
|
||
}
|
||
})
|
||
showPopup.value = false
|
||
}
|
||
</script> |