diff options
author | crupest <crupest@outlook.com> | 2020-09-01 02:32:06 +0800 |
---|---|---|
committer | crupest <crupest@outlook.com> | 2020-09-01 02:32:06 +0800 |
commit | a314b5350e269676e8c39eda4cc7842751b1a7fc (patch) | |
tree | ab3e8c96f18c8e9f6e8c613ace0e04329614304c /Timeline/ClientApp/src/app/user/Login.tsx | |
parent | 02a9bf9ecfe1659b3481a5386e7a06ee2f0e5fc5 (diff) | |
download | timeline-a314b5350e269676e8c39eda4cc7842751b1a7fc.tar.gz timeline-a314b5350e269676e8c39eda4cc7842751b1a7fc.tar.bz2 timeline-a314b5350e269676e8c39eda4cc7842751b1a7fc.zip |
...
Diffstat (limited to 'Timeline/ClientApp/src/app/user/Login.tsx')
-rw-r--r-- | Timeline/ClientApp/src/app/user/Login.tsx | 147 |
1 files changed, 0 insertions, 147 deletions
diff --git a/Timeline/ClientApp/src/app/user/Login.tsx b/Timeline/ClientApp/src/app/user/Login.tsx deleted file mode 100644 index db6c43c4..00000000 --- a/Timeline/ClientApp/src/app/user/Login.tsx +++ /dev/null @@ -1,147 +0,0 @@ -import React, { Fragment, useState, useEffect } from "react"; -import { useHistory } from "react-router"; -import { useTranslation } from "react-i18next"; -import { - Label, - FormGroup, - Input, - Form, - FormFeedback, - Spinner, - Button, -} from "reactstrap"; - -import AppBar from "../common/AppBar"; -import { useUser, userService } from "../data/user"; - -const Login: React.FC = (_) => { - const { t } = useTranslation(); - const history = useHistory(); - const [username, setUsername] = useState<string>(""); - const [usernameDirty, setUsernameDirty] = useState<boolean>(false); - const [password, setPassword] = useState<string>(""); - const [passwordDirty, setPasswordDirty] = useState<boolean>(false); - const [rememberMe, setRememberMe] = useState<boolean>(true); - const [process, setProcess] = useState<boolean>(false); - const [error, setError] = useState<string | null>(null); - - const user = useUser(); - - useEffect(() => { - if (user != null) { - const id = setTimeout(() => history.push("/"), 3000); - return () => { - clearTimeout(id); - }; - } - }, [history, user]); - - if (user != null) { - return ( - <> - <AppBar /> - <p className="mt-appbar">{t("login.alreadyLogin")}</p> - </> - ); - } - - function onSubmit(event: React.SyntheticEvent): void { - if (username === "" || password === "") { - setUsernameDirty(true); - setPasswordDirty(true); - return; - } - - setProcess(true); - userService - .login( - { - username: username, - password: password, - }, - rememberMe - ) - .then( - () => { - if (history.length === 0) { - history.push("/"); - } else { - history.goBack(); - } - }, - (e: Error) => { - setProcess(false); - setError(e.message); - } - ); - event.preventDefault(); - } - - return ( - <Fragment> - <AppBar /> - <div className="container login-container mt-appbar"> - <h1>{t("welcome")}</h1> - <Form> - <FormGroup> - <Label for="username">{t("user.username")}</Label> - <Input - id="username" - disabled={process} - onChange={(e) => { - setUsername(e.target.value); - setUsernameDirty(true); - }} - value={username} - invalid={usernameDirty && username === ""} - /> - {usernameDirty && username === "" && ( - <FormFeedback>{t("login.emptyUsername")}</FormFeedback> - )} - </FormGroup> - <FormGroup> - <Label for="password">{t("user.password")}</Label> - <Input - id="password" - type="password" - disabled={process} - onChange={(e) => { - setPassword(e.target.value); - setPasswordDirty(true); - }} - value={password} - invalid={passwordDirty && password === ""} - /> - {passwordDirty && password === "" && ( - <FormFeedback>{t("login.emptyPassword")}</FormFeedback> - )} - </FormGroup> - <FormGroup check> - <Input - id="remember-me" - type="checkbox" - checked={rememberMe} - onChange={(e) => { - const v = (e.target as HTMLInputElement).checked; - setRememberMe(v); - }} - /> - <Label for="remember-me">{t("user.rememberMe")}</Label> - </FormGroup> - {error ? <p className="text-error">{t(error)}</p> : null} - <div> - {process ? ( - <Spinner /> - ) : ( - <Button color="primary" onClick={onSubmit}> - {t("user.login")} - </Button> - )} - </div> - </Form> - </div> - </Fragment> - ); -}; - -export default Login; |