fix(Login): Dealing with external login links not jumping properly

This commit is contained in:
haitaoo 2023-05-09 16:56:58 +08:00
parent 26ad0dd3c3
commit adc75083b2
3 changed files with 77 additions and 89 deletions

View File

@ -20,7 +20,7 @@ import {
import classnames from 'classnames';
import { floppyNavigation, userCenter } from '@/utils';
import { userCenter } from '@/utils';
import {
loggedUserInfoStore,
siteInfoStore,
@ -29,7 +29,6 @@ import {
themeSettingStore,
} from '@/stores';
import { logout, useQueryNotificationStatus } from '@/services';
import { RouteAlias } from '@/router/alias';
import NavItems from './components/NavItems';
@ -73,19 +72,6 @@ const Header: FC = () => {
clearUserStore();
window.location.replace(window.location.href);
};
const onLoginClick = (evt) => {
if (location.pathname === RouteAlias.login) {
evt.preventDefault();
window.location.reload();
return;
}
if (floppyNavigation.shouldProcessLinkClick(evt)) {
evt.preventDefault();
floppyNavigation.navigateToLogin({
handler: navigate,
});
}
};
useEffect(() => {
if (q) {
@ -155,7 +141,6 @@ const Header: FC = () => {
'link-light': navbarStyle === 'theme-colored',
'link-primary': navbarStyle !== 'theme-colored',
})}
onClick={onLoginClick}
href={userCenter.getLoginUrl()}>
{t('btns.login')}
</Button>
@ -243,7 +228,6 @@ const Header: FC = () => {
'link-light': navbarStyle === 'theme-colored',
'link-primary': navbarStyle !== 'theme-colored',
})}
onClick={onLoginClick}
href={userCenter.getLoginUrl()}>
{t('btns.login')}
</Button>

View File

@ -175,86 +175,90 @@ const Index: React.FC = () => {
return (
<Container style={{ paddingTop: '4rem', paddingBottom: '5rem' }}>
<WelcomeTitle />
{step === 1 && canOriginalLogin ? (
{step === 1 ? (
<Col className="mx-auto" md={6} lg={4} xl={3}>
{ucAgentInfo ? (
<PluginUcLogin className="mb-5" />
) : (
<PluginOauth className="mb-5" />
)}
<Form noValidate onSubmit={handleSubmit}>
<Form.Group controlId="email" className="mb-3">
<Form.Label>{t('email.label')}</Form.Label>
<Form.Control
required
tabIndex={1}
type="email"
value={formData.e_mail.value}
isInvalid={formData.e_mail.isInvalid}
onChange={(e) =>
handleChange({
e_mail: {
value: e.target.value,
isInvalid: false,
errorMsg: '',
},
})
}
/>
<Form.Control.Feedback type="invalid">
{formData.e_mail.errorMsg}
</Form.Control.Feedback>
</Form.Group>
{canOriginalLogin ? (
<>
<Form noValidate onSubmit={handleSubmit}>
<Form.Group controlId="email" className="mb-3">
<Form.Label>{t('email.label')}</Form.Label>
<Form.Control
required
tabIndex={1}
type="email"
value={formData.e_mail.value}
isInvalid={formData.e_mail.isInvalid}
onChange={(e) =>
handleChange({
e_mail: {
value: e.target.value,
isInvalid: false,
errorMsg: '',
},
})
}
/>
<Form.Control.Feedback type="invalid">
{formData.e_mail.errorMsg}
</Form.Control.Feedback>
</Form.Group>
<Form.Group controlId="password" className="mb-3">
<div className="d-flex justify-content-between">
<Form.Label>{t('password.label')}</Form.Label>
<Link to="/users/account-recovery" tabIndex={2}>
<small>{t('forgot_pass')}</small>
</Link>
</div>
<Form.Group controlId="password" className="mb-3">
<div className="d-flex justify-content-between">
<Form.Label>{t('password.label')}</Form.Label>
<Link to="/users/account-recovery" tabIndex={2}>
<small>{t('forgot_pass')}</small>
</Link>
</div>
<Form.Control
required
tabIndex={1}
type="password"
// value={formData.pass.value}
maxLength={32}
isInvalid={formData.pass.isInvalid}
onChange={(e) =>
handleChange({
pass: {
value: e.target.value,
isInvalid: false,
errorMsg: '',
},
})
}
/>
<Form.Control.Feedback type="invalid">
{formData.pass.errorMsg}
</Form.Control.Feedback>
</Form.Group>
<Form.Control
required
tabIndex={1}
type="password"
// value={formData.pass.value}
maxLength={32}
isInvalid={formData.pass.isInvalid}
onChange={(e) =>
handleChange({
pass: {
value: e.target.value,
isInvalid: false,
errorMsg: '',
},
})
}
/>
<Form.Control.Feedback type="invalid">
{formData.pass.errorMsg}
</Form.Control.Feedback>
</Form.Group>
<div className="d-grid">
<Button variant="primary" type="submit" tabIndex={1}>
{t('login', { keyPrefix: 'btns' })}
</Button>
</div>
</Form>
{loginSetting.allow_new_registrations && (
<div className="text-center mt-5">
<Trans i18nKey="login.info_sign" ns="translation">
Dont have an account?
<Link
to={userCenter.getSignUpUrl()}
tabIndex={2}
onClick={floppyNavigation.handleRouteLinkClick}>
Sign up
</Link>
</Trans>
</div>
)}
<div className="d-grid">
<Button variant="primary" type="submit" tabIndex={1}>
{t('login', { keyPrefix: 'btns' })}
</Button>
</div>
</Form>
{loginSetting.allow_new_registrations && (
<div className="text-center mt-5">
<Trans i18nKey="login.info_sign" ns="translation">
Dont have an account?
<Link
to={userCenter.getSignUpUrl()}
tabIndex={2}
onClick={floppyNavigation.handleRouteLinkClick}>
Sign up
</Link>
</Trans>
</div>
)}
</>
) : null}
</Col>
) : null}

View File

@ -62,7 +62,7 @@ const navigate = (to: string | number, config: NavigateConfig = {}) => {
* 2. Auto storage login redirect
*/
if (to === RouteAlias.login || to === getLoginUrl()) {
if (equalToCurrentHref(RouteAlias.login)) {
if (equalToCurrentHref(to)) {
return;
}
storageLoginRedirect();