Proyectos de Subversion LeadersLinked - Backend

Rev

Rev 11055 | Rev 11057 | Ir a la última revisión | | Comparar con el anterior | Ultima modificación | Ver Log |

Rev Autor Línea Nro. Línea
11049 stevensc 1 
import { Button, Modal } from 'react-bootstrap'
11046 stevensc 2 
import axios from 'axios'
3 
import React from 'react'
4 
import { useState } from 'react'
5 
import { useForm } from 'react-hook-form'
6 
import { useDispatch } from 'react-redux'
7 
import { addNotification } from '../../../redux/notification/notification.actions'
8 
import DescriptionInput from '../../../shared/DescriptionInput'
9 
 
10 
const AddModal = ({ closeModal, email_link, isOpen, add_link }) => {
11 
 
12 
	//Hooks
11051 stevensc 13 
	const { register, handleSubmit, watch, setError, errors, setValue, clearErrors } = useForm()
11046 stevensc 14 
	const dispatch = useDispatch()
15 
 
16 
	//States
17 
	const [isShowSecondPage, setIsShowSecondPage] = useState(false)
18 
	const [pointsOptions] = useState([
19 
		{ label: 'Evaluación', value: null },
20 
		{ label: 'Sugerir otro cargo', value: 0 },
21 
		{ label: '25%', value: 1 },
22 
		{ label: '50%', value: 2 },
23 
		{ label: '75%', value: 3 },
24 
		{ label: '100%', value: 4 }
25 
	])
26 
	const [statusOptions] = useState([
27 
		{ label: 'Estatus', value: '' },
28 
		{ label: 'Aceptado', value: 'a' },
29 
		{ label: 'Rechazado', value: 'r' }
30 
	])
31 
 
32 
	const onSubmit = (data) => {
33 
 
34 
		const submitData = new FormData()
35 
		Object.entries(data).map(([key, value]) => {
36 
			submitData.append(key, value)
37 
		})
38 
 
39 
		axios.post(add_link, submitData)
40 
			.then(({ data }) => {
41 
				if (!data.success) {
42 
					dispatch(addNotification({
11051 stevensc 43 
						style: 'danger',
11046 stevensc 44 
						msg: 'Ha ocurrido un error'
45 
					}))
46 
				}
47 
 
11051 stevensc 48 
				clearErrors()
49 
				closeModal()
11046 stevensc 50 
				dispatch(addNotification({
51 
					style: 'success',
52 
					msg: 'Usuario registrado'
53 
				}))
54 
			})
55 
	}
56 
 
57 
	const showSecondPage = () => {
58 
		if (watch('first_name') && watch('last_name') && watch('email')) {
59 
			return setIsShowSecondPage(true)
60 
		}
61 
 
62 
		setError('first_name', { message: 'Este campo es requerido' })
63 
		setError('last_name', { message: 'Este campo es requerido' })
64 
		setError('email', { message: 'Este campo es requerido' })
65 
	}
66 
 
67 
	const checkEmail = () => {
68 
		axios.get(email_link, { params: { email: watch('email') } })
69 
			.then(({ data }) => {
70 
				if (!data.success) {
71 
					dispatch(addNotification({
11051 stevensc 72 
						style: 'danger',
11046 stevensc 73 
						msg: 'Ha ocurrido un error'
74 
					}))
75 
				}
76 
 
77 
				setValue('user_id', data.data.user_id)
11051 stevensc 78 
				setValue('first_name', data.data.first_name)
79 
				setValue('last_name', data.data.last_name)
80 
				clearErrors()
11046 stevensc 81 
			})
82 
	}
83 
 
84 
	return (
11056 stevensc 85 
		<Modal size="md" onHide={closeModal} show={isOpen}>
11046 stevensc 86 
			<Modal.Header closeButton>
87 
				<Modal.Title>Nuevo candidato</Modal.Title>
88 
			</Modal.Header>
89 
			<form onSubmit={handleSubmit(onSubmit)}>
11053 stevensc 90 
				<Modal.Body>
11056 stevensc 91 
					<div className='form-group'>
92 
						<label className="form-label">Correo electrónico</label>
93 
						<input type="email" name='email' className='form-control' ref={register({ required: true })} />
94 
						{errors.email && <p>{errors.email.message}</p>}
11055 stevensc 95 
					</div>
11056 stevensc 96 
					<button
97 
						type="button"
98 
						className="btn btn-primary"
99 
						onClick={checkEmail}
100 
					>
101 
						Verificar Email
102 
					</button>
103 
					<div className='form-group'>
104 
						<label className="form-label">Nombre</label>
105 
						<input type="text" name='first_name' className='form-control' ref={register({ required: true })} />
106 
						{errors.first_name && <p>{errors.first_name.message}</p>}
11055 stevensc 107 
					</div>
11056 stevensc 108 
					<div className='form-group'>
109 
						<label className="form-label">Apellido</label>
110 
						<input type="text" name='last_name' className='form-control' ref={register({ required: true })} />
111 
						{errors.last_name && <p>{errors.last_name.message}</p>}
112 
					</div>
113 
					<div className='form-group'>
114 
						<label className="form-label">Comentario</label>
115 
						<DescriptionInput
116 
							name='comment'
117 
							setValue={setValue}
118 
						/>
119 
						{errors.comment && <p>{errors.comment.message}</p>}
120 
					</div>
121 
					<div className='form-group'>
122 
						<label className="form-label">Evaluación</label>
123 
						<select className='form-control' name='evaluation' ref={register}>
124 
							{
125 
								pointsOptions.map(({ label, value }) => {
126 
									return <option key={value} value={value}>{label}</option>
127 
								})
128 
							}
129 
						</select>
130 
					</div>
131 
					<div className='form-group'>
132 
						<label className="form-label">Resumen Curricular</label>
133 
						<input
134 
							className="form-control p-0"
135 
							type="file"
136 
							name="file"
137 
							accept='pdf/docx'
138 
							ref={register}
139 
							style={{ height: '2rem' }}
140 
						/>
141 
					</div>
142 
					<div className='form-group'>
143 
						<label className="form-label">Estatus</label>
144 
						<select className='form-control' name='evaluation' ref={register}>
145 
							{
146 
								statusOptions.map(({ label, value }) => {
147 
									return <option key={value} value={value}>{label}</option>
148 
								})
149 
							}
150 
						</select>
151 
					</div>
11053 stevensc 152 
				</Modal.Body>
153 
				<Modal.Footer>
11056 stevensc 154 
					<Button variant="danger" onClick={() => setIsShowSecondPage(false)}>
155 
						Cancelar
156 
					</Button>
157 
					<Button
158 
						variant="primary"
159 
						type='submit'
160 
					>
161 
						Enviar
162 
					</Button>
11053 stevensc 163 
				</Modal.Footer>
11046 stevensc 164 
			</form>
165 
		</Modal >
166 
	)
167 
}
168 
 
169 
export default AddModal