diff --git a/src/pages/signup-page/SignupPage.tsx b/src/pages/signup-page/SignupPage.tsx index 1e994cf90888641aade7cdda881ebf2998703a10..e2c6cb5593d48f45344002b9ebd3f56b6457bb57 100644 --- a/src/pages/signup-page/SignupPage.tsx +++ b/src/pages/signup-page/SignupPage.tsx @@ -21,7 +21,7 @@ interface Props { const SignupPage: React.FC<Props> = ({ connector }) => { const navigate = useNavigate(); - const [acountData, setAcountData] = useState({ + const [accountData, setAccountData] = useState({ loginId: '', name: '', password: '', @@ -30,8 +30,8 @@ const SignupPage: React.FC<Props> = ({ connector }) => { }); const [passwordAgain, setPasswordAgain] = useState<string>(''); const Correct = () => { - const empty = acountData.password === ''; - const same = acountData.password === passwordAgain; + const empty = accountData.password === ''; + const same = accountData.password === passwordAgain; if (empty) { return null; } @@ -43,32 +43,34 @@ const SignupPage: React.FC<Props> = ({ connector }) => { </div> ); }; + + const handleNameChange = (event: React.ChangeEvent<HTMLInputElement>) => { - setAcountData((prev) => ({ + setAccountData((prev) => ({ ...prev, name : event.target.value })); }; const handleIdChange = (event: React.ChangeEvent<HTMLInputElement>) => { - setAcountData((prev) => ({ + setAccountData((prev) => ({ ...prev, loginId : event.target.value })); }; const handleEmailChange = (event: React.ChangeEvent<HTMLInputElement>) => { - setAcountData((prev) => ({ + setAccountData((prev) => ({ ...prev, email : event.target.value })); }; const handlePhoneChange = (event: React.ChangeEvent<HTMLInputElement>) => { - setAcountData((prev) => ({ + setAccountData((prev) => ({ ...prev, phone : event.target.value })); }; const handlePasswordChange = (event: React.ChangeEvent<HTMLInputElement>) => { - setAcountData((prev) => ({ + setAccountData((prev) => ({ ...prev, password : event.target.value })); @@ -78,24 +80,27 @@ const SignupPage: React.FC<Props> = ({ connector }) => { }; const handleSignup = () => { - void (async () => { - await connector.post('/user/register', { - loginId: 'asdf', - name: 'asdf', - password: 'asdf', - email: 'asdf@asdf.com', - phone: '010-1234-1234' - }); - navigate(APP_ROUTE.LOGIN); - })(); - // fetchData('/user/register', FETCH_METHOD.POST, setIsLogin, { - // loginId: 'asdf', - // name: 'ms', - // password: 'asdf', - // email: 'asdf@asdf.com', - // phone: '010-1234-1234' - // }); - // navigate(APP_ROUTE.LOGIN); + if( + accountData.loginId !== '' && + accountData.name !== '' && + accountData.email !== '' && + accountData.phone !== '' && + accountData.password !== '' && + passwordAgain !== '' + ){ + try { + void(async () => { + await fetchData('/user/register', FETCH_METHOD.POST, accountData); + navigate(APP_ROUTE.LOGIN); + })(); + } catch (e) { + console.error(e); + } + } + else { + alert('모든 정보를 입력해주세요'); + } + }; return ( @@ -106,7 +111,7 @@ const SignupPage: React.FC<Props> = ({ connector }) => { <input placeholder={'전화번호'} onChange={handlePhoneChange}/> <input placeholder={'비밀번호를 입력해주세요.'} - value={acountData.password} + value={accountData.password} onChange={handlePasswordChange} type={'password'} />