bots-frontend/pages/[qrCode]/order/index.js
2022-11-14 11:09:29 +07:00

66 lines
2.7 KiB
JavaScript

import React, {useEffect} from 'react';
import DefaultLayout from "../../../components/Layout/DefaultLayout";
import { useRouter } from 'next/router';
import { Image } from 'antd';
import { botsRepository } from '../../../repository/bots';
import {useStore} from "../../../components/StoreProvider";
import { observer } from 'mobx-react-lite';
const FlashScreen = observer(() => {
const router = useRouter();
const store = useStore()
const { qrCode } = router.query;
const { data: listLockeys } = botsRepository.hooks.useGetAllLockey(qrCode);
useEffect(() => {
if (router.isReady && listLockeys?.data?.length > 0) {
const isAvailable = listLockeys?.data?.find(lockey => lockey.lockey_status?.description.toLowerCase() === "tersedia");
const isNotAvailable = listLockeys?.data?.find(lockey => lockey?.lockey_status?.description?.toLowerCase() === "LOCKEY Mati");
if (isAvailable) {
localStorage.setItem("lockey_id", isAvailable?.id)
localStorage.setItem("location_name", isAvailable?.location_name);
store.lockey.createOrder({
lockeyId: isAvailable.id
})
.then(res => {
router.push(`/${qrCode}/payment-order/`)
})
} else if (isNotAvailable) {
localStorage.setItem("lockey_id", isNotAvailable?.id)
localStorage.setItem("location_name", isNotAvailable?.location_name);
router.push('/not-available');
}
console.log(isAvailable, "jj")
}
}, [router.isReady, listLockeys])
return (
<>
<div className='relative flex flex-col justify-center items-center pt-[172px] lg:pt-20'>
<Image src='/assets/images/cariparkir3.svg' preview={false} alt={'logo cariparkir'} />
<div className='flex items-center gap-6 mt-6'>
<span>Only pay with</span>
<Image src='/assets/images/gopay.svg' preview={false} alt={'gopay'} />
</div>
</div>
<div className={'hidden md:flex justify-center items-center absolute bottom-0 w-full'}>
<Image src='/assets/images/flash-screen2.png' preview={false} alt={'bg flash screen'} />
</div>
<div className={'flex justify-center items-center absolute bottom-0 w-full md:hidden'}>
<Image src='/assets/images/flash-screen.svg' preview={false} alt={'bg flash screen'} />
</div>
</>
)
})
FlashScreen.getLayout = function Layout(page) {
return <DefaultLayout isGradient={false}>
{page}
</DefaultLayout>;
};
export default FlashScreen;