package com.tutofox.tutospring.controllers;

/.../
 
import java.util.Map;
import java.util.HashMap;
import java.util.List;  

import com.tutofox.tutospring.models.*;

@RestController
@RequestMapping("/api/employee")
public class EmployeeController {

	/.../
	  
	@GetMapping(value = "get/{id}" )
	public Map<String, Object> data(@PathVariable("id") Integer id){
		
		HashMap<String,Object> response = new HashMap<String,Object>();
		
		try {   
			
			Optional<Employee> employee = employeeRepository.findById(id);  
		 
			if (employee.isPresent()) { 
				response.put("message","Successful load");
				response.put("data",employee);
				response.put("success",true);
				return response;
			}
			else {
				response.put("message","Not found data");
				response.put("data",null);
				response.put("success",false);
				return response;
			}
			
		} catch (Exception e){ 
			response.put("message",""+e.getMessage()); 
			response.put("success",false);
			return response;
		}
	} 
			 
}

const baseUrl = "http://localhost:8080/api/employee"
import axios from "axios";
const employee = {};

employee.get = async (id) => {
  const urlGet = baseUrl+"/get/"+id
  const res = await axios.get(urlGet)
  .then(response=> {return response.data })
  .catch(error=>{ return error; })
  return res;
}

export default employee

import employeeServices from "../services/Employee"

constructor(){
    super()
    this.state = {
      id:0,
      fieldName:"",
      fieldEmail:"",
      fieldPhone:"",
      fieldAddress:""
    }
  }

  async componentDidMount()
  {
     console.log("Mounted Edit");
     const id = this.props.match.params.id;
     const res = await employeeServices.get(id)
     console.log(res);
     if (res.success) {
       console.log(res.data);
        this.setState({
          id: res.data.id,
          fieldName:res.data.name,
          fieldEmail:res.data.email,
          fieldAddress:res.data.address,
          fieldPhone:res.data.phone
        })
     }
     else {
       alert("Error ==>"+res.message)
     }
  }

render() {
    let userId = this.props.match.params.id;
    return (
      <div>
        <h4>Edit Employee {userId} </h4>
        <hr />
        <div class="row">
          <div class="col-md-6 mb-3">
            <label for="firstName">Name employee</label>
            <input type="text" class="form-control"
              value={this.state.fieldName}
              onChange={(value)=>this.setState({fieldName:value.target.value})}
            />
          </div>
        </div>

				<div class="row">
          <div class="col-md-6 mb-3">
						<label for="email">Email</label>
	          <input type="email" class="form-control" placeholder="you@example.com"
              value={this.state.fieldEmail}
              onChange={(value)=>this.setState({fieldEmail:value.target.value})}
             />
          </div>
        </div>

				<div class="row">
          <div class="col-md-6 mb-3">
						<label for="address">Address</label>
	          <input type="text" class="form-control" placeholder="1234 Main St"
              value={this.state.fieldAddress}
              onChange={(value)=>this.setState({fieldAddress:value.target.value})}
            />
          </div>
        </div>

				<div class="row">
          <div class="col-md-6 mb-3">
						<label for="address">Phone </label>
	          <input type="text" class="form-control" placeholder="123467890"
              value={this.state.fieldPhone}
              onChange={(value)=>this.setState({fieldPhone:value.target.value})}
            />
          </div>
        </div>

				<div class="row">
					<div class="col-md-6 mb-3">
		      	<button class="btn btn-primary btn-block" type="submit">Save</button>
					</div>
				</div>
      </div>
    )
  }