Bläddra i källkod

added auth validation

Alex 5 år sedan
förälder
incheckning
0fd2a741e9

+ 33 - 24
package-lock.json

@@ -916,6 +916,33 @@
         }
       }
     },
+    "@material-ui/lab": {
+      "version": "3.0.0-alpha.28",
+      "resolved": "https://registry.npmjs.org/@material-ui/lab/-/lab-3.0.0-alpha.28.tgz",
+      "integrity": "sha512-uERqo8W2RhWDDaO1FMmvWS9GHBX3Sdhu1F7o+Z2M8wQ6viKcvONVlN4oC80VP6fgze8p5cnjmNhFLuCypLRHTg==",
+      "requires": {
+        "@babel/runtime": "^7.2.0",
+        "@material-ui/utils": "^3.0.0-alpha.2",
+        "classnames": "^2.2.5",
+        "keycode": "^2.1.9",
+        "prop-types": "^15.6.0"
+      },
+      "dependencies": {
+        "@babel/runtime": {
+          "version": "7.3.1",
+          "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.3.1.tgz",
+          "integrity": "sha512-7jGW8ppV0ant637pIqAcFfQDDH1orEPGJb8aXfUozuCU3QqX7rX4DA8iwrbPrR1hcH0FTTHz47yQnk+bl5xHQA==",
+          "requires": {
+            "regenerator-runtime": "^0.12.0"
+          }
+        },
+        "regenerator-runtime": {
+          "version": "0.12.1",
+          "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.12.1.tgz",
+          "integrity": "sha512-odxIc1/vDlo4iZcfXqRYFj0vpXFNoGdKMAUieAlFYO6m/nl5e9KR/beGf41z4a1FI+aQgtjhuaSlDxQ0hmkrHg=="
+        }
+      }
+    },
     "@material-ui/system": {
       "version": "3.0.0-alpha.1",
       "resolved": "https://registry.npmjs.org/@material-ui/system/-/system-3.0.0-alpha.1.tgz",
@@ -4008,13 +4035,11 @@
         "cssom": "0.3.x"
       }
     },
-
     "csstype": {
       "version": "2.6.1",
       "resolved": "https://registry.npmjs.org/csstype/-/csstype-2.6.1.tgz",
       "integrity": "sha512-wv7IRqCGsL7WGKB8gPvrl+++HlFM9kxAM6jL1EXNPNTshEJYilMkbfS2SnuHha77uosp/YVK0wAp2jmlBzn1tg=="
     },
-
     "currently-unhandled": {
       "version": "0.4.1",
       "resolved": "https://registry.npmjs.org/currently-unhandled/-/currently-unhandled-0.4.1.tgz",
@@ -6163,13 +6188,11 @@
         },
         "balanced-match": {
           "version": "1.0.0",
-          "bundled": true,
-          "optional": true
+          "bundled": true
         },
         "brace-expansion": {
           "version": "1.1.11",
           "bundled": true,
-          "optional": true,
           "requires": {
             "balanced-match": "^1.0.0",
             "concat-map": "0.0.1"
@@ -6182,18 +6205,15 @@
         },
         "code-point-at": {
           "version": "1.1.0",
-          "bundled": true,
-          "optional": true
+          "bundled": true
         },
         "concat-map": {
           "version": "0.0.1",
-          "bundled": true,
-          "optional": true
+          "bundled": true
         },
         "console-control-strings": {
           "version": "1.1.0",
-          "bundled": true,
-          "optional": true
+          "bundled": true
         },
         "core-util-is": {
           "version": "1.0.2",
@@ -6296,8 +6316,7 @@
         },
         "inherits": {
           "version": "2.0.3",
-          "bundled": true,
-          "optional": true
+          "bundled": true
         },
         "ini": {
           "version": "1.3.5",
@@ -6307,7 +6326,6 @@
         "is-fullwidth-code-point": {
           "version": "1.0.0",
           "bundled": true,
-          "optional": true,
           "requires": {
             "number-is-nan": "^1.0.0"
           }
@@ -6320,7 +6338,6 @@
         "minimatch": {
           "version": "3.0.4",
           "bundled": true,
-          "optional": true,
           "requires": {
             "brace-expansion": "^1.1.7"
           }
@@ -6332,7 +6349,6 @@
         "minipass": {
           "version": "2.2.4",
           "bundled": true,
-          "optional": true,
           "requires": {
             "safe-buffer": "^5.1.1",
             "yallist": "^3.0.0"
@@ -6421,8 +6437,7 @@
         },
         "number-is-nan": {
           "version": "1.0.1",
-          "bundled": true,
-          "optional": true
+          "bundled": true
         },
         "object-assign": {
           "version": "4.1.1",
@@ -6432,7 +6447,6 @@
         "once": {
           "version": "1.4.0",
           "bundled": true,
-          "optional": true,
           "requires": {
             "wrappy": "1"
           }
@@ -6538,7 +6552,6 @@
         "string-width": {
           "version": "1.0.2",
           "bundled": true,
-          "optional": true,
           "requires": {
             "code-point-at": "^1.0.0",
             "is-fullwidth-code-point": "^1.0.0",
@@ -7645,7 +7658,6 @@
       "resolved": "https://registry.npmjs.org/in-publish/-/in-publish-2.0.0.tgz",
       "integrity": "sha1-4g/146KvwmkDILbcVSaCqcf631E="
     },
-
     "indefinite-observable": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/indefinite-observable/-/indefinite-observable-1.0.2.tgz",
@@ -7654,7 +7666,6 @@
         "symbol-observable": "1.2.0"
       }
     },
-
     "indent-string": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/indent-string/-/indent-string-2.1.0.tgz",
@@ -16188,7 +16199,6 @@
         }
       }
     },
-
     "sass": {
       "version": "1.16.0",
       "resolved": "https://registry.npmjs.org/sass/-/sass-1.16.0.tgz",
@@ -16197,7 +16207,6 @@
         "chokidar": "^2.0.0"
       }
     },
-
     "sass-graph": {
       "version": "2.2.4",
       "resolved": "https://registry.npmjs.org/sass-graph/-/sass-graph-2.2.4.tgz",

+ 0 - 1
package.json

@@ -19,7 +19,6 @@
     "redux-form": "^8.1.0",
     "redux-thunk": "^2.3.0",
     "sass": "^1.16.0"
-
   },
   "scripts": {
     "start": "react-scripts start",

+ 0 - 12
src/common/formFunc.js

@@ -1,12 +0,0 @@
-import React from "react";
-
-export const renderField = ({input, meta: {touched, error}, label, type, placeholder }) => (
-    <div className="form__input-box">
-    {console.log(input.value)}
-        <label className="form__input-label" htmlFor="origin">
-            {label}
-            <input  className="form__input" type = {type} placeholder = {placeholder} {...input} />
-        </label>
-        {touched && error && <span>{error}</span>}
-    </div>
-);

+ 5 - 4
src/components/Auth/authorisation.js

@@ -1,7 +1,8 @@
 import React from "react";
 import { reduxForm, Field } from "redux-form";
-import  authValidate  from "../../utils/validate";
 import Authbuttons from './authButtons'
+import {authValidate} from "../../utils/authValidate";
+import {authRenderField} from "../../common/authRenderField"
 
 const Form = props => {
   const { handleSubmit, getUsersData } = props
@@ -15,7 +16,7 @@ const Form = props => {
           <div>
             <Field
               name="email"
-              component="input"
+              component={authRenderField}
               type="Емейл" 
               placeholder="email@example.com"
 
@@ -24,12 +25,12 @@ const Form = props => {
           <div>  
             <Field
               name="password"
-              component="input" 
+              component={authRenderField}
               type="password" 
               placeholder ="Пароль"  
             />
           </div>
-          <button className="auth__submit-button">Отправить</button>
+          <button className="auth__submit-button">Войти</button>
         </form>
       </div>
     );

+ 8 - 8
src/components/Auth/registration.js

@@ -1,6 +1,8 @@
 import React from 'react'
 import { Field, reduxForm } from 'redux-form'
 import Authbuttons from './authButtons'
+import {regValidate} from '../../utils/regValidate'
+import {regRenderField} from '../../common/regRenderField'
 
 
 
@@ -22,7 +24,7 @@ const RegistrForm = props => {
           <div>
             <Field
               name="login"
-              component="input"
+              component={regRenderField}
               type="text"
               placeholder="Логин"
               className="input"
@@ -32,7 +34,7 @@ const RegistrForm = props => {
           <div>
             <Field
               name="password"
-              component="input"
+              component={regRenderField}
               type="password"
               placeholder="Пароль"
               className="input"
@@ -42,7 +44,7 @@ const RegistrForm = props => {
           <div>
             <Field
               name="name"
-              component="input"
+              component={regRenderField}
               type="text"
               placeholder="Имя"
               className="input"
@@ -51,7 +53,7 @@ const RegistrForm = props => {
           <div>
             <Field
               name="phone"
-              component="input"
+              component={regRenderField}
               type="text"
               placeholder="+380XXXXXXXX"
               className="input"
@@ -60,7 +62,7 @@ const RegistrForm = props => {
           <div>
             <Field
               name="email"
-              component="input"
+              component={regRenderField}
               type="email"
               placeholder="email@example.com"
               className="input"
@@ -81,6 +83,4 @@ const RegistrForm = props => {
   )
 }
 
-export default reduxForm({
-  form: 'registrForm'
-})(RegistrForm)
+export default reduxForm({ form: 'registrForm', validate: regValidate})(RegistrForm)

+ 1 - 1
src/components/Header/Myprofile.js

@@ -7,7 +7,7 @@ class Myprofile extends Component {
 
 
         <div className="header__auth">
-            <Link to="/auth" className="link" target="_blank">
+            <Link to="/auth" className="link">
                 <div className="header__auth__container">
                     <div className="avatar">
                         <Avatar icon="user" style={{ backgroundColor: '#1890ff' }}/>

+ 1 - 5
src/style/components/auth.scss

@@ -17,17 +17,13 @@ h1 {
 }
 
 .form {
-  
   box-sizing: border-box;
   width: 260px;
   margin: 100px auto 0;
   box-shadow: 2px 2px 5px 1px rgba(0,0,0,0.2);
   padding-bottom: 40px;
   border-radius: 3px;
-  h1 {
-    box-sizing: border-box;
-    padding: 20px;
-  }
+
 }
 
 .input {

+ 0 - 15
src/utils/validate.js

@@ -1,15 +0,0 @@
-export default values => {
-    const { email, password } = values;
-    const error = {};
-
-
-    if(!email) {
-        error.email = "Required"
-    }
-
-    if(!password) {
-        error.password = "Required"
-    }
-
-    return error;
-};