diff --git a/pairent_frontend_react/src/components/UI/FloatingBox/index.jsx b/pairent_frontend_react/src/components/UI/FloatingBox/index.jsx new file mode 100644 index 0000000..c70df60 --- /dev/null +++ b/pairent_frontend_react/src/components/UI/FloatingBox/index.jsx @@ -0,0 +1,27 @@ +import React from "react"; +import { styled } from "styled-components"; + +const FloatingBox = styled.div` + position: fixed; + top: 45%; + left: 50%; + transform: translate(-50%, -50%); + border: 1px solid #c2c4c2; + border-radius: 12px; + padding: 24px 36px; + background: white; + box-shadow: 0 2px 1px #00000010; + + text-align: center; + + & hr { + margin-bottom: 24px; + height: 0px; + border: 0; + border-bottom: 1px solid #c2c4c2; + box-shadow: 0 2px 1px #c2c4c280; + } + +`; + +export default FloatingBox; \ No newline at end of file diff --git a/pairent_frontend_react/src/pages/LoggedIn/index.jsx b/pairent_frontend_react/src/pages/LoggedIn/index.jsx index 39780b8..ceffe06 100644 --- a/pairent_frontend_react/src/pages/LoggedIn/index.jsx +++ b/pairent_frontend_react/src/pages/LoggedIn/index.jsx @@ -2,6 +2,7 @@ import React from "react"; import { styled } from "styled-components"; import { HashLoader } from "react-spinners"; import { SigninResponse, SigninState } from 'oidc-client-ts'; +import FloatingBox from "../../components/UI/FloatingBox"; const CenterContainer = styled.div` position: relative; @@ -18,27 +19,49 @@ const CenterContainer = styled.div` } `; +const ErrorText = styled.p` + font-family: monospace; + margin: 10px 0; + width: 780px; +`; + export default class LoggedIn extends React.Component { constructor(props) { super(props); this.response = new SigninResponse(new URL(window.location.href).searchParams); this.signin_state = SigninState.fromStorageString(window.localStorage.getItem('oidc_signin_state')); + } async componentDidMount() { console.log(this.response) + console.log(this.signin_state); } render() { return ( -
- -

Подождите пожалуйста

-
- + <> +
+ +

Подождите пожалуйста

+
+ +
+
+
+ + { + this.response.error ? +
+ +

Ошибка авторизации

+

{this.response.error}

+ {this.response.error_description} +
- -
+ : null + } + ) } } \ No newline at end of file diff --git a/pairent_frontend_react/src/pages/LoginPage/index.jsx b/pairent_frontend_react/src/pages/LoginPage/index.jsx index 09f6ce7..bc89e0e 100644 --- a/pairent_frontend_react/src/pages/LoginPage/index.jsx +++ b/pairent_frontend_react/src/pages/LoginPage/index.jsx @@ -1,45 +1,15 @@ import React from 'react'; import { styled } from 'styled-components'; -import BlueButton from '../../components/UI/BlueButton'; import { HashLoader } from 'react-spinners'; +import BlueButton from '../../components/UI/BlueButton'; +import FloatingBox from '../../components/UI/FloatingBox'; import * as OpenID from 'oidc-client-ts'; import constants from '../../constants'; const { OIDCConfig } = constants; -const LoginBox = styled.div` - position: fixed; - top: 45%; - left: 50%; - transform: translate(-50%, -50%); - border: 1px solid #c2c4c2; - border-radius: 12px; - padding: 24px 36px; - background: white; - box-shadow: 0 2px 1px #00000010; - - text-align: center; - - & h2 { - margin: 0px 0; - } - & hr { - margin: 16px 0; - margin-bottom: 24px; - height: 0px; - border: 0; - border-bottom: 1px solid #c2c4c2; - box-shadow: 0 2px 1px #c2c4c280; - } - & p { - font-size: 8pt; - color: gray; - margin-top: 16px; - } -`; - const LoginButton = styled(BlueButton)` font-size: 11pt; width: 250px; @@ -60,6 +30,12 @@ const LoginButton = styled(BlueButton)` } `; +const SmallText = styled.p` + font-size: 8pt; + color: gray; + margin-top: 16px; +`; + const VVSULogoSVG = () => { return ; } @@ -92,7 +68,7 @@ export default class LoginPage extends React.Component { render() { return (
- +

Вход


@@ -105,11 +81,11 @@ export default class LoginPage extends React.Component { } -

+ Вход осуществляется только через
Систему Единого Входа ВВГУ -

-
+ +
); }