102 lines
2.9 KiB
Vue
102 lines
2.9 KiB
Vue
<script setup>
|
|
import { liveStore } from "~/stores/live/index.js";
|
|
import { createBuyOrder } from "~/api/goods/index.js";
|
|
import { goodStore } from "~/stores/goods/index.js";
|
|
import { showLoadingToast, closeToast } from "vant";
|
|
import { authStore } from "~/stores/auth/index.js";
|
|
import { message } from "~/components/x-message/useMessage.js";
|
|
import { createOrder, offlineQrcode } from "~/api-collect-code/goods/index.js";
|
|
import { codeAuthStore } from "~/stores-collect-code/auth/index.js";
|
|
import { useI18n } from "vue-i18n";
|
|
|
|
const amount = ref("");
|
|
const router = useRouter();
|
|
const route = useRoute();
|
|
const { t } = useI18n();
|
|
const { checkoutSessionUrl, qrUid, qrData, codePKey, codePayUid } =
|
|
codeAuthStore();
|
|
const payStatus = ref(0);
|
|
const state = reactive({
|
|
pageRequest: false,
|
|
});
|
|
definePageMeta({
|
|
i18n: "payment.title",
|
|
});
|
|
const getData = async () => {
|
|
state.pageRequest = true;
|
|
const res = await offlineQrcode({
|
|
qrUid: route.query.qrUid,
|
|
});
|
|
if (res.status === 0) {
|
|
qrData.value = res.data;
|
|
payStatus.value = res.data.payStatus;
|
|
if (qrData.value.payStatus === 2) {
|
|
state.pageRequest = false;
|
|
} else {
|
|
confirmPay();
|
|
}
|
|
}
|
|
};
|
|
// 获取二维码价格
|
|
getData();
|
|
const confirmPay = async () => {
|
|
const res = await createOrder({
|
|
price: qrData.value.price,
|
|
currency: qrData.value.currency,
|
|
qrUid: route.query.qrUid,
|
|
testReturnHost: window.location.origin,
|
|
testReturnEndPoint: "/collectCode/payment/result",
|
|
});
|
|
if (res.status === 0) {
|
|
codePKey.value = res.data.checkoutSessionUrl;
|
|
codePayUid.value = res.data.payUid;
|
|
router.push({
|
|
path: "/checkoutPage",
|
|
query: {
|
|
payUid: res.data.payUid,
|
|
returnUrl: "/collectCode/payment/result",
|
|
stripeKey: res.data.checkoutSessionUrl,
|
|
},
|
|
});
|
|
}
|
|
};
|
|
</script>
|
|
|
|
<template>
|
|
<div
|
|
class="w-[100vw] h-screen-nav bg-[url('@/static/images/3532@2x.png')] bg-cover flex-grow-1 flex flex-col items-center pt-183px px-30px"
|
|
>
|
|
<div
|
|
v-if="state.pageRequest"
|
|
class="fixed left-0 top-0 w-full h-full bg-white/50 flex items-center justify-center z-50"
|
|
>
|
|
<van-loading color="#1989fa" size="36px" vertical
|
|
>跳转支付处理中...</van-loading
|
|
>
|
|
</div>
|
|
<div v-if="!state.pageRequest" class="mb-30px">
|
|
<img class="w-126px h-126px" src="@/static/images/dddf34@2x.png" alt="" />
|
|
</div>
|
|
<div
|
|
v-if="!state.pageRequest"
|
|
class="text-#999999 text-16px mb-24px font-bold"
|
|
>
|
|
{{ qrData.price + " " + qrData.currency }}
|
|
</div>
|
|
<div
|
|
v-if="!state.pageRequest"
|
|
class="text-#1A1A1A text-16px mb-25px font-bold"
|
|
>
|
|
你已完成全部支付！
|
|
</div>
|
|
|
|
<!-- <div class="w-full mt-auto mb-40px">
|
|
<van-button type="primary" block @click="confirmPay">
|
|
{{ $t("collectCode.payment.confirmPayment") }}
|
|
</van-button>
|
|
</div> -->
|
|
</div>
|
|
</template>
|
|
|
|
<style scoped></style>
|