Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

payment success page issue fix #1206

Merged
merged 2 commits into from
Feb 29, 2024
Merged

payment success page issue fix #1206

Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
a5bb860
payment success page issue fix
PiranavanShanmugavadivelu Feb 29, 2024
75772b5
Merge branch 'main' of https://github.com/EmpowerPlastic/empowerchain…
PiranavanShanmugavadivelu Feb 29, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
124 changes: 68 additions & 56 deletions frontend/marketplace/src/pages/AuctionPaymentSuccessful.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -77,13 +77,13 @@ onMounted(async () => {
</script>

<template>
<Vue3Lottie
v-if="auctionStatus === PaymentStatus.COMPLETE"
:animation-data="FireworksAnimation"
class="absolute"
:loop="false"
/>
<div class="p-5 min-h-[50vh] font-Inter">
<h1
v-if="isCheckingStatus"
class="text-white text-title38 md:mt-10 mb-10 text-center"
>
Processing...
</h1>
<h1
v-if="auctionStatus === PaymentStatus.COMPLETE"
class="text-white text-title38 md:mt-10 mb-10 text-center"
Expand All @@ -96,59 +96,71 @@ onMounted(async () => {
>
Transaction error
</h1>
<h1 v-else class="text-white text-title38 md:mt-10 mb-10 text-center">
<h1
v-else-if="!isCheckingStatus"
class="text-white text-title38 md:mt-10 mb-10 text-center"
>
Credit Transfer Issue
</h1>

<div v-if="isCheckingStatus">
<div>
<span class="block text-center text-white mb-2"
>Checking your order status, please wait</span
>
<span class="block text-center text-white">
<span class="loading loading-spinner loading-lg"></span>
</span>
</div>
</div>
<div v-else class="flex justify-center">
<div
class="bg-white/10 rounded-lg md:rounded-sm p-4 max-w-xl text-center"
>
<span
v-if="auctionStatus === PaymentStatus.COMPLETE"
class="font-Inter text-white text-title18"
>
Your plastic credit purchase was successful and a Plastic Credit
Offset Certificate has been generated for you.
</span>
<span
v-else-if="auctionStatus === PaymentStatus.ERROR"
class="font-Inter text-white text-title18"
>
Transaction couldn't be completed. You will receive a refund shortly.
Please contact us at
<a href="mailto:[email protected]" class="underline"
>[email protected]</a
<div class="pointer-events-none">
<Vue3Lottie
v-if="auctionStatus === PaymentStatus.COMPLETE"
class="absolute top-0"
:animation-data="FireworksAnimation"
:loop="false"
/>
<div class="pointer-events-auto">
<div v-if="isCheckingStatus">
<div>
<span class="block text-center text-white mb-2"
>Checking your order status, please wait</span
>
<span class="block text-center text-white">
<span class="loading loading-spinner loading-lg"></span>
</span>
</div>
</div>
<div v-else class="flex justify-center">
<div
class="bg-white/10 rounded-lg md:rounded-sm p-4 max-w-xl text-center"
>
if you encounter any issues.
</span>
<span v-else class="font-Inter text-white text-title18">
Transaction processing takes longer than usual due to blockchain
traffic. You will receive an email shortly, confirming the status of
your transaction.
</span>
<a
v-if="auctionStatus === PaymentStatus.COMPLETE"
class="mt-5 text-white btn btn-ghost btn-block normal-case bg-greenPrimary hover:bg-greenDark text-title24 lg:text-title32 lg:btn-lg p-0 px-12 font-normal md:max-w-lg"
href="/certificate"
>See your certificates</a
>
<a
v-else
class="mt-5 text-white btn btn-ghost btn-block normal-case bg-greenPrimary hover:bg-greenDark text-title24 lg:text-title32 lg:btn-lg p-0 px-12 font-normal md:max-w-lg"
href="/"
>Go to homepage</a
>
<span
v-if="auctionStatus === PaymentStatus.COMPLETE"
class="font-Inter text-white text-title18"
>
Your plastic credit purchase was successful and a Plastic Credit
Offset Certificate has been generated for you.
</span>
<span
v-else-if="auctionStatus === PaymentStatus.ERROR"
class="font-Inter text-white text-title18"
>
Transaction couldn't be completed. You will receive a refund
shortly. Please contact us at
<a href="mailto:[email protected]" class="underline"
>[email protected]</a
>
if you encounter any issues.
</span>
<span v-else class="font-Inter text-white text-title18">
Transaction processing takes longer than usual due to blockchain
traffic. You will receive an email shortly, confirming the status
of your transaction.
</span>
<a
v-if="auctionStatus === PaymentStatus.COMPLETE"
class="mt-5 text-white btn btn-ghost btn-block normal-case bg-greenPrimary hover:bg-greenDark text-title24 lg:text-title32 lg:btn-lg p-0 px-12 font-normal md:max-w-lg"
href="/certificate"
>See your certificates</a
>
<a
v-else
class="mt-5 text-white btn btn-ghost btn-block normal-case bg-greenPrimary hover:bg-greenDark text-title24 lg:text-title32 lg:btn-lg p-0 px-12 font-normal md:max-w-lg"
href="/"
>Go to homepage</a
>
</div>
</div>
</div>
</div>
</div>
Expand Down
Loading