ch4n3.yoon

[Edit] Sign In 서버 연결

......@@ -24,6 +24,16 @@ import {
InputGroup,
InputLeftElement,
InputRightElement,
Alert,
AlertIcon,
AlertTitle,
AlertDescription,
AlertDialog,
AlertDialogBody,
AlertDialogFooter,
AlertDialogHeader,
AlertDialogContent,
AlertDialogOverlay,
} from '@chakra-ui/react'
import { PhoneIcon } from '@chakra-ui/icons'
import http from '../utils/http'
......@@ -31,6 +41,10 @@ import http from '../utils/http'
const SignIn = () => {
const [username, setUsername] = useState('')
const [password, setPassword] = useState('')
const [isSuccess, setSuccess] = useState(false)
const cancelRef = React.useRef()
const onClose = () => setSuccess(false)
const handleUsernameOnChange = (event) => {
setUsername(event.target.value)
......@@ -40,6 +54,14 @@ const SignIn = () => {
setPassword(event.target.value)
}
const signIn = () => {
http.post('/login').then(response => {
const { success, code, data, message } = response.data
if (success) {
}
})
}
useEffect(() => {
}, [])
......@@ -47,7 +69,7 @@ const SignIn = () => {
return (
<Container>
<Heading>Sign-In</Heading>
<br />
<br/>
<Stack
// divider={<StackDivider borderColor="gray.200"/>}
......@@ -75,10 +97,26 @@ const SignIn = () => {
<Button
colorScheme="teal"
onClick={() => signIn()}
>
Sign In
</Button>
</Stack>
<AlertDialog
isOpen={isSuccess}
leastDestructiveRef={cancelRef}
onClose={onClose}
>
<AlertDialogOverlay>
<AlertDialogContent>
<Alert status="success">
<AlertIcon />
Successfully signed in !
</Alert>
</AlertDialogContent>
</AlertDialogOverlay>
</AlertDialog>
</Container>
)
}
......