Proyectos de Subversion LeadersLinked - Backend

Rev

Rev 15516 | | Comparar con el anterior | Ultima modificación | Ver Log |

Rev Autor Línea Nro. Línea
15513 stevensc 1 
 
5453 stevensc 2 
import React, { useState } from 'react'
15513 stevensc 3 
import axios from '../../../utils/axios'
14885 stevensc 4 
import { Modal, Button } from 'react-bootstrap'
5 
import { useForm } from 'react-hook-form'
15513 stevensc 6 
import ToggleComponent from '../../../shared/ToggleComponent'
5453 stevensc 7 
 
8 
const EditModal = ({
14885 stevensc 9 
	title = '',
10 
	isOpen = false,
15513 stevensc 11 
	currentItem = null,
12 
	url ='',
13 
	onComplete = function(){},
15518 stevensc 14 
	onClose = function () {}
5453 stevensc 15 
}) => {
15513 stevensc 16 
	const [isActive, setIsActive] = useState(currentItem?.status === 'a' ? true : false)
17 
	const {register,handleSubmit,formState: { errors }} = useForm()
5453 stevensc 18 
 
15513 stevensc 19 
	const onSubmit = (data) => {
15516 stevensc 20 
		const formData = new FormData()
21 
 
22 
		Object.entries(data).forEach(([key, value]) => formData.append(key, value))
15513 stevensc 23 
		formData.append('status', isActive ? 'a' : 'i')
5453 stevensc 24 
 
14885 stevensc 25 
		axios.post(url, formData)
15513 stevensc 26 
			.then(({ data: response }) => {
27 
				if (response.success) {
28 
					onComplete()
29 
					onClose()
14885 stevensc 30 
				}
31 
			})
32 
			.catch((err) => console.log(err))
33 
	}
5453 stevensc 34 
 
14885 stevensc 35 
	return (
15513 stevensc 36 
		<Modal show={isOpen} onHide={onClose}>
14885 stevensc 37 
			<Modal.Header closeButton>
15513 stevensc 38 
				<Modal.Title>{title} - {currentItem ? 'Editar' : 'Agregar'}</Modal.Title>
14885 stevensc 39 
			</Modal.Header>
40 
			<form onSubmit={handleSubmit(onSubmit)}>
41 
				<Modal.Body>
42 
					<div className="form-group">
43 
						<label>Nombre</label>
44 
						<input
45 
							className='form-control'
46 
							name='name'
47 
							ref={register}
48 
							defaultValue={currentItem ? currentItem.name : ''}
49 
						/>
50 
						{errors.name && <p>Este campo es requerido</p>}
51 
					</div>
52 
					<div className="form-group">
53 
						<label>Mínimo</label>
54 
						<input
55 
							className="form-control"
56 
							name="minimum_no_of_employee"
57 
							ref={register}
58 
							required
59 
							defaultValue={currentItem ? currentItem.minimum_no_of_employee : ''}
60 
						/>
61 
						{errors.minimum_no_of_employee && <p>Este campo es requerido</p>}
62 
					</div>
63 
					<div className="form-group">
64 
						<label>Máximo</label>
65 
						<input
66 
							className="form-control"
67 
							name="maximum_no_of_employee"
68 
							ref={register}
69 
							defaultValue={currentItem ? currentItem.maximum_no_of_employee : ''}
70 
						/>
71 
						{errors.maximum_no_of_employee && <p>Este campo es requerido</p>}
72 
					</div>
15513 stevensc 73 
					<ToggleComponent currentValue={isActive} setValue={(value)=> setIsActive(value)} />
14885 stevensc 74 
				</Modal.Body>
75 
				<Modal.Footer>
15513 stevensc 76 
					<Button variant="primary" type="submit">
5453 stevensc 77 
                        Enviar
14885 stevensc 78 
					</Button>
15513 stevensc 79 
					<Button variant="danger" onClick={onClose}>
5453 stevensc 80 
                        Cancelar
14885 stevensc 81 
					</Button>
82 
				</Modal.Footer>
83 
			</form>
84 
		</Modal >
85 
	)
5453 stevensc 86 
}
87 
 
88 
export default EditModal