llvy.ltd/casdoor
1
0
Fork 0
mirror of https://github.com/casdoor/casdoor.git synced 2025-07-15 09:13:50 +08:00
Code Issues Packages Projects Releases Wiki Activity

Add login page "signup" mode.

Browse Source
This commit is contained in:
Yang Luo
2021-06-14 22:42:58 +08:00
parent 5a852bfd1d
commit cc31c1d666
4 changed files with 108 additions and 43 deletions
Download Patch File Download Diff File Expand all files Collapse all files

84
web/src/auth/LoginPage.js
View File

@ -13,7 +13,8 @@
// limitations under the License.
import React from "react";
import {Button, Checkbox, Col, Form, Input, Row} from "antd";
import {Link} from "react-router-dom";
import {Button, Checkbox, Col, Form, Input, Result, Row} from "antd";
import {LockOutlined, UserOutlined} from "@ant-design/icons";
import * as AuthBackend from "./AuthBackend";
import * as ApplicationBackend from "../backend/ApplicationBackend";
@ -32,6 +33,7 @@ class LoginPage extends React.Component {
type: props.type,
applicationName: props.applicationName !== undefined ? props.applicationName : (props.match === undefined ? null : props.match.params.applicationName),
application: null,
mode: props.mode !== undefined ? props.mode : (props.match === undefined ? null : props.match.params.mode), // "signup" or "signin"
msg: null,
};
}
@ -139,11 +141,39 @@ class LoginPage extends React.Component {
}
}
isProviderVisible(providerItem) {
if (this.state.mode === "signup") {
return Setting.isProviderVisibleForSignUp(providerItem);
} else {
return Setting.isProviderVisibleForSignIn(providerItem);
}
}
renderForm(application) {
if (this.state.msg !== null) {
return Util.renderMessage(this.state.msg)
}
if (this.state.mode === "signup" && !application.enableSignUp) {
return (
<Result
status="error"
title="Sign Up Error"
subTitle={"The application does not allow to sign up new account"}
extra={[
<Link onClick={() => {
Setting.goToLogin(this, application);
}}>
<Button type="primary" key="signin">
Sign In
</Button>
</Link>
]}
>
</Result>
)
}
if (application.enablePassword) {
return (
<Form
@ -210,21 +240,12 @@ class LoginPage extends React.Component {
{i18next.t("login:Sign In")}
</Button>
{
!application.enableSignUp ? null : (
<div style={{float: "right"}}>
{i18next.t("login:No account yet?")}&nbsp;
<a onClick={() => {
Setting.goToSignup(this, application);
}}>
{i18next.t("login:sign up now")}
</a>
</div>
)
!application.enableSignUp ? null : this.renderFooter(application)
}
</Form.Item>
<Form.Item>
{
application.providers.filter(providerItem => Setting.isProviderVisibleForSignIn(providerItem)).map(providerItem => {
application.providers.filter(providerItem => this.isProviderVisible(providerItem)).map(providerItem => {
return this.renderProviderLogo(providerItem.provider, application, 30, 5, "small");
})
}
@ -245,7 +266,7 @@ class LoginPage extends React.Component {
</div>
<br/>
{
application.providers.filter(providerItem => Setting.isProviderVisibleForSignIn(providerItem)).map(providerItem => {
application.providers.filter(providerItem => this.isProviderVisible(providerItem)).map(providerItem => {
return this.renderProviderLogo(providerItem.provider, application, 40, 10, "big");
})
}
@ -253,14 +274,9 @@ class LoginPage extends React.Component {
!application.enableSignUp ? null : (
<div>
<br/>
<div style={{float: "right"}}>
{i18next.t("login:No account yet?")}&nbsp;
<a onClick={() => {
Setting.goToSignup(this, application);
}}>
{i18next.t("login:sign up now")}
</a>
</div>
{
this.renderFooter(application)
}
</div>
)
}
@ -269,6 +285,32 @@ class LoginPage extends React.Component {
}
}
renderFooter(application) {
if (this.state.mode === "signup") {
return (
<div style={{float: "right"}}>
{i18next.t("signup:Have account?")}&nbsp;
<Link onClick={() => {
Setting.goToLogin(this, application);
}}>
{i18next.t("signup:sign in now")}
</Link>
</div>
)
} else {
return (
<div style={{float: "right"}}>
{i18next.t("login:No account yet?")}&nbsp;
<a onClick={() => {
Setting.goToSignup(this, application);
}}>
{i18next.t("login:sign up now")}
</a>
</div>
)
}
}
render() {
const application = this.getApplicationObj();
if (application === null) {