🎨 styles: page verify customer account

:%s
This commit is contained in:
lytrankieio123 2021-09-29 14:48:12 +07:00
parent 275f10c5e7
commit 660ba8d301
2 changed files with 38 additions and 7 deletions

View File

@ -12,5 +12,16 @@
.message {
margin-bottom: 1.6rem;
}
.bottom {
@apply flex justify-center items-center flex-col;
a {
margin-right: 1.6rem;
margin-bottom: 1.6rem;
width: 100%;
}
button {
@apply w-full;
}
}
}
}

View File

@ -2,15 +2,22 @@ import { useRouter } from 'next/router'
import { useEffect, useState } from 'react'
import { ButtonCommon } from 'src/components/common'
import LoadingCommon from 'src/components/common/LoadingCommon/LoadingCommon'
import { useVerifyCustomer } from 'src/components/hooks'
import { useModalCommon, useVerifyCustomer } from 'src/components/hooks'
import { ROUTE } from 'src/utils/constanst.utils'
import s from './VerifyCustomerAccount.module.scss'
import Link from 'next/link'
import { LANGUAGE } from 'src/utils/language.utils'
import ModalAuthenticate from 'src/components/common/ModalAuthenticate/ModalAuthenticate'
export default function VerifyCustomerAccount() {
const router = useRouter()
const [isVerified, setIsVerified] = useState<boolean>(false)
const { error, loading, verify } = useVerifyCustomer()
const {
visible: visibleModalAuthen,
closeModal: closeModalAuthen,
openModal: openModalAuthen,
} = useModalCommon({ initialValue: false })
useEffect(() => {
const token = router.query.token
@ -37,14 +44,27 @@ export default function VerifyCustomerAccount() {
</div>
) : (
<div className={s.result}>
<div className={s.message}>Congratulation! Verified account successfully</div>
<Link href={ROUTE.HOME}>
<a href="">
<ButtonCommon>Back to home</ButtonCommon>
</a>
</Link>
<div className={s.message}>
Congratulation! Verified account successfully
</div>
<div className={s.bottom}>
<Link href={ROUTE.HOME}>
<a href="">
<ButtonCommon type="light">Back to home</ButtonCommon>
</a>
</Link>
<ButtonCommon onClick={openModalAuthen}>
{LANGUAGE.BUTTON_LABEL.SIGNIN}
</ButtonCommon>
</div>
</div>
)}
<ModalAuthenticate
visible={visibleModalAuthen}
closeModal={closeModalAuthen}
/>
</div>
)
}