reset update

src/api/index.js

@@ -63,6 +63,7 @@ const create = (baseURL = 'https://trftia.eksad.com/tia-reporting-dev/public/')
 
   //Auth
   const login = (body) => api.post('auth/login', body)
+  const resetPassword = (body) => api.post('auth/reset_password', body)
   const verification = (body) => api.post('email/reset_password', body)
   
   //Role
@@ -91,6 +92,7 @@ const create = (baseURL = 'https://trftia.eksad.com/tia-reporting-dev/public/')
     getRoot,
     login,
     verification,
+    resetPassword,
     getRole,
     getDetailRole,
     addRole,

src/container/ForgotPassword.js

@@ -26,7 +26,7 @@ class ForgotPassword extends Component {
     validateEmail() {
       if (this.state.email.trim() == "") {
           this.setState({ errorEmail: true, msgEmail: 'Email harus diisi!' })
-      }  else {
+      } else {
           this.verification()
       }
   }
@@ -56,7 +56,7 @@ class ForgotPassword extends Component {
                 <TextField
                     label={<Typography style={{fontSize: 12, fontFamily: 'Nunito Sans, sans-serif'}}>Email *</Typography>}
                     id="email"
-                    type={"text"}
+                    type={"email"}
                     name={"email"}
                     value={this.state.email}
                     onChange={(email) => {

src/container/ResetPassword.js

@@ -3,6 +3,7 @@ import Images from '../assets/Images';
 import { TextField, InputAdornment, Button, Typography, IconButton } from '@material-ui/core';
 import Visibility from '@material-ui/icons/Visibility';
 import VisibilityOff from '@material-ui/icons/VisibilityOff';
+import api from '../api';
 
 
 class ResetPassword extends Component {
@@ -13,6 +14,10 @@ class ResetPassword extends Component {
             confirmPassword: '',
             showPass: false,
             showPass2: false,
+            errorPassword: false,
+            errorConfirmPassword: false,
+            msgPassword: '',
+            msgConfirmPassword: '',
             userId: 0
         }
     }
@@ -21,6 +26,7 @@ class ResetPassword extends Component {
       console.log(this.props.match.params.id)
       let userId = this.props.match.params.id
       this.setState({userId})
+      // console.log(this.props)
     }
 
     confirmPassword() {
@@ -29,13 +35,26 @@ class ResetPassword extends Component {
         "confirmPassword": this.state.confirmPassword,
         "userId": this.state.userId  
       }
-      
+      api.create().confirmPassword(payload).then((response) => {
+        if(response.data.status === 'success') {
+          alert('success')
+          this.props.history.push('/login')
+        } else {
+          alert(response.data.message)
+        }
+      })
     }
 
     handleChange(e) {
       let data = this.state
       this.setState({...data, [e.target.name] : e.target.value})
+      if (e.target.name == "password") {
+        this.setState({ errorPassword: false, msgPassword: '' })
+      } else if (e.target.name) {
+          this.setState({ errorConfirmPassword: false, msgConfirmPassword: '' })
+      }
     }
+
     render() {
         return (
           <div style={{ flex: 1, display: 'flex', backgroundColor: '#51c6ea', height: '100vh', justifyContent: 'center', alignItems: 'center' }}>
@@ -48,9 +67,11 @@ class ResetPassword extends Component {
                   type={this.state.showPass ? 'text' : 'password'}
                   name={"password"}
                   value={this.state.password}
-                  onChange={(password) => this.handleChange(password) }
+                  onChange={(password) => {
+                    this.handleChange(password)
+                  }}
                   variant="outlined"
-                  error={false}
+                  error={this.state.errorPassword}
                   style={{ width: 250, height: 51, marginTop: 32 }}
                   helperText={<Typography style={{fontSize: 9, marginTop: 4, fontFamily: 'Nunito Sans, sans-serif'}}>Terdiri 8 karakter dengan kombinasi angka.</Typography>}
                   InputProps={{
@@ -73,10 +94,12 @@ class ResetPassword extends Component {
                   type={this.state.showPass2 ? 'text' : 'password'}
                   name={"confirmPassword"}
                   value={this.state.confirmPassword}
-                  onChange={(confirmPassword) => this.handleChange(confirmPassword) }
+                  onChange={(confirmPassword) => {
+                    this.handleChange(confirmPassword)
+                  }}
                   variant="outlined"
-                  error={false}
-                  style={{ width: 250, height: 51, marginTop: 38 }}
+                  error={this.state.errorConfirmPassword}
+                  style={{ width: 250, height: 51, marginTop: 30 }}
                   helperText={<Typography style={{fontSize: 9, marginTop: 4, fontFamily: 'Nunito Sans, sans-serif'}}>Terdiri 8 karakter dengan kombinasi angka.</Typography>}
                   InputProps={{
                     endAdornment: <InputAdornment position="end">
@@ -92,7 +115,7 @@ class ResetPassword extends Component {
                   }}
                 />
 
-                <Button variant="contained" style={{ marginTop: 50,  width: 250, height: 30, borderRadius: 4, backgroundColor: '#51c6ea' }}>
+                <Button name="submit" variant="contained" disabled={this.state.password.trim() == '' && this.state.confirmPassword.trim() == '' ? true : false} onClick={() => this.confirmPassword()} style={{ marginTop: 30,  width: '100%', height: 35, borderRadius: 4, color: this.state.password.trim() == '' && this.state.confirmPassword.trim() == '' ? '#4b4b4b' : '#fff', backgroundColor: this.state.password.trim() == '' && this.state.confirmPassword.trim() == '' ? '#d8d8d8' : '#51c6ea' }}>
                   <Typography style={{fontSize: 12, fontFamily: 'Nunito Sans, sans-serif'}}>Lanjut</Typography>
                 </Button>
               </div>