Add code sign in UI.

This commit is contained in:
Gucheng Wang
2021-11-28 21:10:21 +08:00
parent d224e728a3
commit d6c9ee508c
11 changed files with 138 additions and 51 deletions

View File

@ -31,6 +31,7 @@ type Application struct {
Organization string `xorm:"varchar(100)" json:"organization"`
EnablePassword bool `json:"enablePassword"`
EnableSignUp bool `json:"enableSignUp"`
EnableCodeSignin bool `json:"enableCodeSignin"`
Providers []*ProviderItem `xorm:"varchar(10000)" json:"providers"`
SignupItems []*SignupItem `xorm:"varchar(1000)" json:"signupItems"`
OrganizationObj *Organization `xorm:"-" json:"organizationObj"`

View File

@ -267,6 +267,16 @@ class ApplicationEditPage extends React.Component {
}} />
</Col>
</Row>
<Row style={{marginTop: '20px'}} >
<Col style={{marginTop: '5px'}} span={(Setting.isMobile()) ? 19 : 2}>
{Setting.getLabel(i18next.t("application:Enable Code Signin"), i18next.t("application:Enable Code Signin - Tooltip"))} :
</Col>
<Col span={1} >
<Switch checked={this.state.application.enableCodeSignin} onChange={checked => {
this.updateApplicationField('enableCodeSignin', checked);
}} />
</Col>
</Row>
<Row style={{marginTop: '20px'}} >
<Col style={{marginTop: '5px'}} span={(Setting.isMobile()) ? 22 : 2}>
{Setting.getLabel(i18next.t("general:Signup URL"), i18next.t("general:Signup URL - Tooltip"))} :

View File

@ -57,6 +57,7 @@ class ApplicationListPage extends React.Component {
logo: "https://cdn.casbin.com/logo/logo_1024x256.png",
enablePassword: true,
enableSignUp: true,
EnableCodeSignin: false,
providers: [],
signupItems: [
{name: "ID", visible: false, required: true, rule: "Random"},

View File

@ -35,6 +35,7 @@ import WeComLoginButton from "./WeComLoginButton";
import LarkLoginButton from "./LarkLoginButton";
import GitLabLoginButton from "./GitLabLoginButton";
import CustomGithubCorner from "../CustomGithubCorner";
import {CountDownInput} from "../component/CountDownInput";
class LoginPage extends React.Component {
constructor(props) {
@ -45,7 +46,9 @@ class LoginPage extends React.Component {
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"
isCodeSignin: false,
msg: null,
username: null,
};
}
@ -243,7 +246,7 @@ class LoginPage extends React.Component {
autoSignin: true,
}}
onFinish={(values) => {this.onFinish(values)}}
style={{width: "250px"}}
style={{width: "300px"}}
size="large"
>
<Form.Item
@ -276,8 +279,25 @@ class LoginPage extends React.Component {
prefix={<UserOutlined className="site-form-item-icon" />}
placeholder={i18next.t("login:username, Email or phone")}
disabled={!application.enablePassword}
onChange={e => {
this.setState({
username: e.target.value,
});
}}
/>
</Form.Item>
{
this.state.isCodeSignin ? (
<Form.Item
name="code"
rules={[{ required: true, message: i18next.t("login:Please input your code!") }]}
>
<CountDownInput
disabled={this.state.username?.length === 0}
onButtonClickArgs={[this.state.email, "email", Setting.getApplicationOrgName(application)]}
/>
</Form.Item>
) : (
<Form.Item
name="password"
rules={[{ required: true, message: i18next.t("login:Please input your password!") }]}
@ -289,6 +309,8 @@ class LoginPage extends React.Component {
disabled={!application.enablePassword}
/>
</Form.Item>
)
}
<Form.Item>
<Form.Item name="autoSignin" valuePropName="checked" noStyle>
<Checkbox style={{float: "left"}} disabled={!application.enablePassword}>
@ -370,14 +392,25 @@ class LoginPage extends React.Component {
)
} else {
return (
<div style={{float: "right"}}>
{i18next.t("login:No account yet?")}&nbsp;
<React.Fragment>
<span style={{float: "left"}}>
<a onClick={() => {
this.setState({
isCodeSignin: !this.state.isCodeSignin,
});
}}>
{this.state.isCodeSignin ? i18next.t("login:Sign in with password") : i18next.t("login:Sign in with code")}
</a>
</span>
<span style={{float: "right"}}>
{i18next.t("login:No account?")}&nbsp;
<a onClick={() => {
Setting.goToSignup(this, application);
}}>
{i18next.t("login:sign up now")}
</a>
</div>
</span>
</React.Fragment>
)
}
}

View File

@ -8,6 +8,8 @@
},
"application": {
"Edit Application": "Edit Application",
"Enable Code Signin": "Enable Code Signin",
"Enable Code Signin - Tooltip": "Enable Code Signin - Tooltip",
"Enable signup": "Enable signup",
"Enable signup - Tooltip": "Whether to allow users to sign up",
"File uploaded successfully": "File uploaded successfully",
@ -32,8 +34,7 @@
"Please input your phone verification code!": "Please input your phone verification code!",
"Please input your verification code!": "Please input your verification code!",
"Send Code": "Send Code",
"Submit and complete": "Submit and complete",
"Verify code": "Verify code"
"Submit and complete": "Submit and complete"
},
"forget": {
"Account": "Account",
@ -169,13 +170,16 @@
"Auto sign in": "Auto sign in",
"Continue with": "Continue with",
"Forgot password?": "Forgot password?",
"No account yet?": "No account yet?",
"No account?": "No account?",
"Or sign in with another account": "Or sign in with another account",
"Password": "Password",
"Password - Tooltip": "Password - Tooltip",
"Please input your code!": "Please input your code!",
"Please input your password!": "Please input your password!",
"Please input your username, Email or phone!": "Please input your username, Email or phone!",
"Sign In": "Sign In",
"Sign in with code": "Sign in with code",
"Sign in with password": "Sign in with password",
"Sign in with {type}": "Sign in with {type}",
"Signing in...": "Signing in...",
"To access": "To access",
@ -324,7 +328,9 @@
"Location": "Location",
"Location - Tooltip": "Location - Tooltip",
"Modify password...": "Modify password...",
"New Email": "New Email",
"New Password": "New Password",
"New phone": "New phone",
"OK": "OK",
"Old Password": "Old Password",
"Password": "Password",

View File

@ -8,6 +8,8 @@
},
"application": {
"Edit Application": "Edit Application",
"Enable Code Signin": "Enable Code Signin",
"Enable Code Signin - Tooltip": "Enable Code Signin - Tooltip",
"Enable signup": "Enable signup",
"Enable signup - Tooltip": "Enable signup - Tooltip",
"File uploaded successfully": "File uploaded successfully",
@ -32,8 +34,7 @@
"Please input your phone verification code!": "Please input your phone verification code!",
"Please input your verification code!": "Please input your verification code!",
"Send Code": "Send Code",
"Submit and complete": "Submit and complete",
"Verify code": "Verify code"
"Submit and complete": "Submit and complete"
},
"forget": {
"Account": "Account",
@ -169,13 +170,16 @@
"Auto sign in": "Auto sign in",
"Continue with": "Continue with",
"Forgot password?": "Forgot password?",
"No account yet?": "No account yet?",
"No account?": "No account?",
"Or sign in with another account": "Or sign in with another account",
"Password": "Password",
"Password - Tooltip": "Password - Tooltip",
"Please input your code!": "Please input your code!",
"Please input your password!": "Please input your password!",
"Please input your username, Email or phone!": "Please input your username, Email or phone!",
"Sign In": "Sign In",
"Sign in with code": "Sign in with code",
"Sign in with password": "Sign in with password",
"Sign in with {type}": "Sign in with {type}",
"Signing in...": "Signing in...",
"To access": "To access",
@ -324,7 +328,9 @@
"Location": "Location",
"Location - Tooltip": "Location - Tooltip",
"Modify password...": "Modify password...",
"New Email": "New Email",
"New Password": "New Password",
"New phone": "New phone",
"OK": "OK",
"Old Password": "Old Password",
"Password": "Password",

View File

@ -8,6 +8,8 @@
},
"application": {
"Edit Application": "Edit Application",
"Enable Code Signin": "Enable Code Signin",
"Enable Code Signin - Tooltip": "Enable Code Signin - Tooltip",
"Enable signup": "Enable signup",
"Enable signup - Tooltip": "Whether to allow users to sign up",
"File uploaded successfully": "File uploaded successfully",
@ -32,8 +34,7 @@
"Please input your phone verification code!": "Please input your phone verification code!",
"Please input your verification code!": "Please input your verification code!",
"Send Code": "Send Code",
"Submit and complete": "Submit and complete",
"Verify code": "Verify code"
"Submit and complete": "Submit and complete"
},
"forget": {
"Account": "Account",
@ -169,13 +170,16 @@
"Auto sign in": "Auto sign in",
"Continue with": "Continue with",
"Forgot password?": "Forgot password?",
"No account yet?": "No account yet?",
"No account?": "No account?",
"Or sign in with another account": "Or sign in with another account",
"Password": "Password",
"Password - Tooltip": "Password - Tooltip",
"Please input your code!": "Please input your code!",
"Please input your password!": "Please input your password!",
"Please input your username, Email or phone!": "Please input your username, Email or phone!",
"Sign In": "Sign In",
"Sign in with code": "Sign in with code",
"Sign in with password": "Sign in with password",
"Sign in with {type}": "Sign in with {type}",
"Signing in...": "Signing in...",
"To access": "To access",
@ -324,7 +328,9 @@
"Location": "Location",
"Location - Tooltip": "Location - Tooltip",
"Modify password...": "Modify password...",
"New Email": "New Email",
"New Password": "New Password",
"New phone": "New phone",
"OK": "OK",
"Old Password": "Old Password",
"Password": "Password",

View File

@ -8,6 +8,8 @@
},
"application": {
"Edit Application": "Edit Application",
"Enable Code Signin": "Enable Code Signin",
"Enable Code Signin - Tooltip": "Enable Code Signin - Tooltip",
"Enable signup": "Enable signup",
"Enable signup - Tooltip": "Whether to allow users to sign up",
"File uploaded successfully": "File uploaded successfully",
@ -32,8 +34,7 @@
"Please input your phone verification code!": "Please input your phone verification code!",
"Please input your verification code!": "Please input your verification code!",
"Send Code": "Send Code",
"Submit and complete": "Submit and complete",
"Verify code": "Verify code"
"Submit and complete": "Submit and complete"
},
"forget": {
"Account": "Account",
@ -169,13 +170,16 @@
"Auto sign in": "Auto sign in",
"Continue with": "Continue with",
"Forgot password?": "Forgot password?",
"No account yet?": "No account yet?",
"No account?": "No account?",
"Or sign in with another account": "Or sign in with another account",
"Password": "Password",
"Password - Tooltip": "Password - Tooltip",
"Please input your code!": "Please input your code!",
"Please input your password!": "Please input your password!",
"Please input your username, Email or phone!": "Please input your username, Email or phone!",
"Sign In": "Sign In",
"Sign in with code": "Sign in with code",
"Sign in with password": "Sign in with password",
"Sign in with {type}": "Sign in with {type}",
"Signing in...": "Signing in...",
"To access": "To access",
@ -324,7 +328,9 @@
"Location": "Location",
"Location - Tooltip": "Location - Tooltip",
"Modify password...": "Modify password...",
"New Email": "New Email",
"New Password": "New Password",
"New phone": "New phone",
"OK": "OK",
"Old Password": "Old Password",
"Password": "Password",

View File

@ -8,6 +8,8 @@
},
"application": {
"Edit Application": "Edit Application",
"Enable Code Signin": "Enable Code Signin",
"Enable Code Signin - Tooltip": "Enable Code Signin - Tooltip",
"Enable signup": "Enable signup",
"Enable signup - Tooltip": "Whether to allow users to sign up",
"File uploaded successfully": "File uploaded successfully",
@ -32,8 +34,7 @@
"Please input your phone verification code!": "Please input your phone verification code!",
"Please input your verification code!": "Please input your verification code!",
"Send Code": "Send Code",
"Submit and complete": "Submit and complete",
"Verify code": "Verify code"
"Submit and complete": "Submit and complete"
},
"forget": {
"Account": "Account",
@ -169,13 +170,16 @@
"Auto sign in": "Auto sign in",
"Continue with": "Continue with",
"Forgot password?": "Forgot password?",
"No account yet?": "No account yet?",
"No account?": "No account?",
"Or sign in with another account": "Or sign in with another account",
"Password": "Password",
"Password - Tooltip": "Password - Tooltip",
"Please input your code!": "Please input your code!",
"Please input your password!": "Please input your password!",
"Please input your username, Email or phone!": "Please input your username, Email or phone!",
"Sign In": "Sign In",
"Sign in with code": "Sign in with code",
"Sign in with password": "Sign in with password",
"Sign in with {type}": "Sign in with {type}",
"Signing in...": "Signing in...",
"To access": "To access",
@ -324,7 +328,9 @@
"Location": "Location",
"Location - Tooltip": "Location - Tooltip",
"Modify password...": "Modify password...",
"New Email": "New Email",
"New Password": "New Password",
"New phone": "New phone",
"OK": "OK",
"Old Password": "Old Password",
"Password": "Password",

View File

@ -8,6 +8,8 @@
},
"application": {
"Edit Application": "Edit Application",
"Enable Code Signin": "Enable Code Signin",
"Enable Code Signin - Tooltip": "Enable Code Signin - Tooltip",
"Enable signup": "Enable signup",
"Enable signup - Tooltip": "Whether to allow users to sign up",
"File uploaded successfully": "File uploaded successfully",
@ -32,8 +34,7 @@
"Please input your phone verification code!": "Please input your phone verification code!",
"Please input your verification code!": "Please input your verification code!",
"Send Code": "Send Code",
"Submit and complete": "Submit and complete",
"Verify code": "Verify code"
"Submit and complete": "Submit and complete"
},
"forget": {
"Account": "Account",
@ -169,13 +170,16 @@
"Auto sign in": "Auto sign in",
"Continue with": "Continue with",
"Forgot password?": "Forgot password?",
"No account yet?": "No account yet?",
"No account?": "No account?",
"Or sign in with another account": "Or sign in with another account",
"Password": "Password",
"Password - Tooltip": "Password - Tooltip",
"Please input your code!": "Please input your code!",
"Please input your password!": "Please input your password!",
"Please input your username, Email or phone!": "Please input your username, Email or phone!",
"Sign In": "Sign In",
"Sign in with code": "Sign in with code",
"Sign in with password": "Sign in with password",
"Sign in with {type}": "Sign in with {type}",
"Signing in...": "Signing in...",
"To access": "To access",
@ -324,7 +328,9 @@
"Location": "Location",
"Location - Tooltip": "Location - Tooltip",
"Modify password...": "Modify password...",
"New Email": "New Email",
"New Password": "New Password",
"New phone": "New phone",
"OK": "OK",
"Old Password": "Old Password",
"Password": "Password",

View File

@ -8,6 +8,8 @@
},
"application": {
"Edit Application": "修改应用",
"Enable Code Signin": "启用验证码登录",
"Enable Code Signin - Tooltip": "是否允许用手机或邮箱验证码登录",
"Enable signup": "启用注册",
"Enable signup - Tooltip": "是否允许用户注册",
"File uploaded successfully": "文件上传成功",
@ -32,8 +34,7 @@
"Please input your phone verification code!": "请输入您的手机验证码!",
"Please input your verification code!": "请输入您的验证码!",
"Send Code": "发送验证码",
"Submit and complete": "完成提交",
"Verify code": "验证码"
"Submit and complete": "完成提交"
},
"forget": {
"Account": "账号",
@ -169,13 +170,16 @@
"Auto sign in": "下次自动登录",
"Continue with": "使用以下账号继续",
"Forgot password?": "忘记密码?",
"No account yet?": "没有账号?",
"No account?": "没有账号?",
"Or sign in with another account": "或者,登录其他账号",
"Password": "密码",
"Password - Tooltip": "密码",
"Please input your code!": "请输入您的验证码!",
"Please input your password!": "请输入您的密码!",
"Please input your username, Email or phone!": "请输入您的用户名、Email或手机号",
"Sign In": "登录",
"Sign in with code": "验证码登录",
"Sign in with password": "密码登录",
"Sign in with {type}": "{type}登录",
"Signing in...": "正在登录...",
"To access": "访问",
@ -324,7 +328,9 @@
"Location": "城市",
"Location - Tooltip": "居住地址所在的城市",
"Modify password...": "修改密码...",
"New Email": "新邮箱",
"New Password": "新密码",
"New phone": "新手机号",
"OK": "确定",
"Old Password": "旧密码",
"Password": "密码",