Skip to content
GitLab
Menu
Projects
Groups
Snippets
Loading...
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in / Register
Toggle navigation
Menu
Open sidebar
students
travel
Commits
81cba2c9
Commit
81cba2c9
authored
Jul 07, 2022
by
Yoon, Daeki
😅
Browse files
로딩 스피너 추가
parent
770dd0ab
Changes
3
Hide whitespace changes
Inline
Side-by-side
frontend/src/auth/signup.tsx
View file @
81cba2c9
...
...
@@ -2,6 +2,7 @@ import React, { FormEvent, useEffect, useState } from "react";
import
{
Link
,
useNavigate
}
from
"
react-router-dom
"
;
import
{
authApi
}
from
"
../apis
"
;
import
{
catchErrors
}
from
"
../helpers
"
;
import
{
SpinnerIcon
}
from
"
../icons
"
;
import
{
SignupUser
}
from
"
../types
"
;
export
default
function
Signup
()
{
...
...
@@ -24,17 +25,18 @@ export default function Signup() {
function
handleChange
(
event
:
React
.
ChangeEvent
<
HTMLInputElement
>
)
{
const
{
name
,
value
}
=
event
.
currentTarget
;
console
.
log
(
`name:
${
name
}
, value:
${
value
}
`
);
setUser
({
...
user
,
[
name
]:
value
});
}
async
function
handleSubmit
(
event
:
FormEvent
)
{
event
.
preventDefault
();
try
{
setError
(
""
);
console
.
log
(
"
checkPassword:
"
,
passwordMatch
());
console
.
log
(
"
user data
"
,
user
);
if
(
passwordMatch
())
{
const
{
password2
,
...
sUser
}
=
user
;
setLoading
(
true
);
const
res
=
await
authApi
.
signup
(
sUser
);
console
.
log
(
"
서버연결됬나요
"
,
res
);
console
.
log
(
"
회원가입
"
);
...
...
@@ -51,7 +53,8 @@ export default function Signup() {
function
passwordMatch
()
{
if
(
user
.
password
!==
user
.
password2
)
{
alert
(
"
비밀번호가 일치하지않습니다
"
);
// alert();
setError
(
"
비밀번호가 일치하지않습니다
"
);
console
.
log
(
"
password fail
"
);
return
false
;
}
else
{
...
...
@@ -98,7 +101,6 @@ export default function Signup() {
placeholder
=
"비밀번호"
type
=
"password"
name
=
"password"
// value={password}
onChange
=
{
handleChange
}
/>
...
...
@@ -110,13 +112,17 @@ export default function Signup() {
placeholder
=
"비밀번호 확인"
type
=
"password"
name
=
"password2"
// value={password}
onChange
=
{
handleChange
}
/>
<
button
disabled
=
{
disabled
}
className
=
"place-self-center py-3 border-b border-white"
>
{
error
&&
(
<
div
className
=
"text-red-500 text-sm"
>
<
p
>
{
error
}
</
p
>
</
div
>
)
}
<
button
disabled
=
{
disabled
}
className
=
"border-b border-white"
>
{
loading
&&
(
<
SpinnerIcon
className
=
"animate-spin h-5 w-5 mr-1 text-slate"
/>
)
}
회원가입
</
button
>
</
form
>
...
...
frontend/src/icons/SpinnerIcon.tsx
0 → 100644
View file @
81cba2c9
import
React
,
{
FC
,
ReactNode
}
from
"
react
"
;
export
const
SpinnerIcon
=
({
...
props
})
=>
{
return
(
// <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" {...props}>
// <path d="M222.7 32.15C227.7 49.08 218.1 66.9 201.1 71.94C121.8 95.55 64 169.1 64 255.1C64 362 149.1 447.1 256 447.1C362 447.1 448 362 448 255.1C448 169.1 390.2 95.55 310.9 71.94C293.9 66.9 284.3 49.08 289.3 32.15C294.4 15.21 312.2 5.562 329.1 10.6C434.9 42.07 512 139.1 512 255.1C512 397.4 397.4 511.1 256 511.1C114.6 511.1 0 397.4 0 255.1C0 139.1 77.15 42.07 182.9 10.6C199.8 5.562 217.6 15.21 222.7 32.15V32.15z" />
// </svg>
<
svg
xmlns
=
"http://www.w3.org/2000/svg"
fill
=
"none"
viewBox
=
"0 0 24 24"
{
...
props
}
>
<
circle
className
=
"opacity-25"
cx
=
"12"
cy
=
"12"
r
=
"10"
stroke
=
"currentColor"
strokeWidth
=
{
4
}
></
circle
>
<
path
className
=
"opacity-75"
fill
=
"currentColor"
d
=
"M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
></
path
>
</
svg
>
);
};
frontend/src/icons/index.ts
0 → 100644
View file @
81cba2c9
export
{
SpinnerIcon
}
from
"
./SpinnerIcon
"
;
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
.
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment