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