worstka

shop/src/App.css

@@ -233,6 +233,7 @@ content {
   background-color: rgb(58, 58, 65);
   width: 80%;
   display: flex;
+  padding: 15px;
   flex-direction: column;
   align-items: center;
   border: 2px solid;
@@ -240,6 +241,7 @@ content {
   border-radius: 5%;
 }
 
+
 .loginForm {
   display: flex;
   justify-content: center;
@@ -306,6 +308,14 @@ button {
 .basketButoons {
   display: flex;
 }
+.total {
+  display: flex;
+  justify-content: center;
+  background-color: rgb(58, 58, 65);
+  border-radius: 10%;
+  padding: 10px;
+  align-items: center;
+}
 .basketBottom {
   display: flex;
   justify-content: center;
@@ -314,6 +324,14 @@ button {
   width: 40px;
 }
 
+
+.bottom {
+  background-image: url(./images/bottom.jpg);
+  background-position: center;
+  height: 550px;
+
+}
+
 .footer {
   position: fixed;
   width: 100%;
@@ -349,6 +367,7 @@ button {
     display: inline-block;
   }
   .rightSide {
+    padding-right: 10px;
     font-size: 10px;
     /* width: 70%; */
     align-items: center;
@@ -360,6 +379,9 @@ button {
   .rightSide div {
     margin: 0px 2px;
   }
+  .loginWrapper {
+    width: 100%;
+  }
 
   .loginForm {
     flex-direction: column;

shop/src/components/Main.js

@@ -50,6 +50,9 @@ const Main = ({className = "MainImg" }) => {
                     </Switch>
                 </content>
             </div>
+        </div>
+        <div className = "bottom">
+
         </div>
         </>
     )
@@ -60,7 +63,9 @@ const LoginError = () => {
     return(
         <>
         <div className = "loginWrapper">
-            <h3>Упс, щось пішло не так. Можливо це ім'я вже зайнято. Спробуйте ще.</h3>
+            <h4>Упс, щось пішло не так. 
+                Можливо це ім'я вже зайнято, або ви ввели невірні дані.
+                 Спробуйте ще.</h4>
             <button onClick = {() => history.push("/login")}>Перейти на сторінку регістрації</button>
         </div>
         </>

shop/src/components/basket.js

@@ -63,7 +63,7 @@ const mapStateToProps = state => ({
 const BasketPage = ({state, orderDeal, orderDone, basket, GoodsArr, onAdd, onDel, onClear, onOrder, order}) => {
     const history = useHistory();
     console.log(state)
-    console.log(orderDone)
+    console.log(order)
 
     if(!basket.price && !orderDone){
         return(
@@ -89,7 +89,9 @@ const BasketPage = ({state, orderDeal, orderDone, basket, GoodsArr, onAdd, onDel
                     </div>
                     )}
                 </div>
+                <h2 className = "total">{basket.price}грн</h2>
                 <div className = "basketBottom">
+
                     <button onClick = {() => { 
                                             if(localStorage.authToken) {
                                                 onOrder(order);

shop/src/components/loginOnPage.js

@@ -26,7 +26,7 @@ const ButtonLogout = ({onLogout, isLoggedIn}) =>
 
 
 
-const PasswordConfirm = ({state, login, isLoggedIn, onLogin = null }) => {
+const PasswordConfirm = ({state, login, isLoggedIn, onLogin = null, }) => {
     const [pass1, setPass1] = useState("");
     const [pass2, setPass2] = useState("");
     const history = useHistory();
@@ -42,7 +42,14 @@ const PasswordConfirm = ({state, login, isLoggedIn, onLogin = null }) => {
                     onChange={(e) => {
                         setPass1(e.target.value);
                     }}
-                    onKeyDown = {(e) => e.keyCode == 13 && onLogin(pass1, pass2)}
+                    onKeyDown = {(e) =>  {
+                        if (e.keyCode == 13) {
+                            onLogin(pass1, pass2)
+                            if(!login){
+                                history.push("/loginError")
+                            }
+                        } 
+                    }}
                 />
                 <input
                     type="password"
@@ -50,11 +57,24 @@ const PasswordConfirm = ({state, login, isLoggedIn, onLogin = null }) => {
                     onChange={(e) => {
                         setPass2(e.target.value);
                     }}
-                    onKeyDown = {(e) => e.keyCode == 13 && onLogin(pass1, pass2)}
+                    onKeyDown = {(e) =>  {
+                        if (e.keyCode == 13) {
+                            onLogin(pass1, pass2)
+                            if(!login){
+                                history.push("/loginError")
+                            }
+                        } 
+                    }}
                 />
             </div>
             <div>
-                <button disabled = {isLoggedIn} onClick={() => onLogin(pass1, pass2)}>Login</button>
+                <button disabled = {isLoggedIn} onClick={() => {
+                    onLogin(pass1, pass2)
+                    if(!login){
+                        history.push("/loginError")
+                    }
+                }
+                }>Login</button>
                 <CButtonLogout />
             </div>
 
@@ -145,21 +165,13 @@ const CFormReg = connect((state) => ({
 const CFormLogin = connect((s) => ({state: s, isLoggedIn: s.auth.payload, login: s.auth.payload && s.auth.payload.sub.login}), {
     onLogin:actionLogin})(PasswordConfirm);
 
-//  const LoginError = () => { 
-//     const history = useHistory();
-//     return(
-//         <>
-//         <div>Упс, щось пішло не так. Можливо це ім'я вже зайнято. Спробуйте ще.</div>
-//         <button onClick = {() => history.push("/login")}>Перейти на сторінку регістрації</button>
-//         </>
-//     )}
 
 const LoginForm = ({}) => {
 
     return(
     <>  
         <div className = "loginWrapper">
-            <h2>Будь ласка, увійдіть в свій аккаунд</h2>
+            <h2>Будь ласка, увійдіть в свій аккаунт</h2>
             <div className = "loginForm">
                 
                 {/* <CDashboardLink/> */}