50 lines
1.4 KiB
JavaScript
50 lines
1.4 KiB
JavaScript
'use client';
|
|
|
|
import { useState } from "react";
|
|
import Detail from "./detail";
|
|
import Payment from "./payment";
|
|
|
|
function Information() {
|
|
|
|
const [isForAnother, setIsForAnother] = useState(false)
|
|
const [typePay, setTypePay] = useState('success');
|
|
const [isPay, setIsPay] = useState(true);
|
|
const [fade, setFade] = useState(false);
|
|
|
|
const fadeElement = (func) => {
|
|
setFade(true);
|
|
|
|
const timeout = setTimeout(() => {
|
|
func()
|
|
setFade(false);
|
|
}, 1000);
|
|
|
|
return () => clearTimeout(timeout);
|
|
}
|
|
|
|
return (
|
|
<div
|
|
className={`w-[59%] opacity-page p-[24px] bg-[#FFF] border border-solid border-[#EFEFEF] rounded-[8px]
|
|
`}
|
|
>
|
|
<div className={`transition-opacity !duration-300 ease-in ${fade ? '!opacity-0' : '!opacity-100'}`}>
|
|
{isPay ?
|
|
<Payment
|
|
typePay={typePay}
|
|
setIsPay={setIsPay}
|
|
setTypePay={setTypePay}
|
|
fadeElement={fadeElement}
|
|
/> :
|
|
<Detail
|
|
setIsPay={setIsPay}
|
|
fadeElement={fadeElement}
|
|
isForAnother={isForAnother}
|
|
setIsForAnother={setIsForAnother}
|
|
/>
|
|
}
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export default Information |