Proyectos de Subversion LeadersLinked - Backend

Rev

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

Rev Autor Línea Nro. Línea
10447 stevensc 1 
/* eslint-disable no-mixed-spaces-and-tabs */
10436 stevensc 2 
import React, { useState, useEffect } from 'react'
3 
import axios from 'axios'
4 
import { Card } from 'react-bootstrap'
5 
import { LengthFilter, SearchInput, Table, TablePagination } from '../../components/TableComponents'
10860 stevensc 6 
import { useHistory, useRouteMatch } from 'react-router-dom'
10436 stevensc 7 
import { addNotification } from '../../../redux/notification/notification.actions'
8 
import { useDispatch } from 'react-redux'
9 
import DeleteModal from '../../../shared/DeleteModal'
10 
 
11 
const headers = [
10447 stevensc 12 
	{ key: 'name', label: 'Nombre', isSorteable: true },
13 
	{ key: 'email', label: 'Correo electrónico', isSorteable: true },
14 
	{ key: 'type', label: 'Entrevistado por', isSorteable: true },
15 
	{ key: 'vacancy', label: 'Vacantes', isSorteable: true },
16 
	{ key: 'points', label: 'Evaluación', isSorteable: true },
17 
	{ key: 'actions', label: 'Acciones', isSorteable: false }
10436 stevensc 18 
]
19 
 
10840 stevensc 20 
const TableView = ({ table_link, permisions, vacancies, setActionLink, add_link }) => {
10436 stevensc 21 
 
10447 stevensc 22 
	const history = useHistory()
10462 stevensc 23 
	const { url } = useRouteMatch()
10447 stevensc 24 
	const dispatch = useDispatch()
25 
	const [showDeleteModal, setShowDeleteModal] = useState(false)
26 
	const [currentVacancy, setCurrentVacancy] = useState(vacancies[0].uuid || '')
27 
	const [deleteLink, setDeleteLink] = useState('')
28 
	const [data, setData] = useState({})
29 
	const [search, setSearch] = useState('')
30 
	const [dataLength, setDataLength] = useState(10)
31 
	const points = {
32 
		0: '0%',
33 
		1: '25%',
34 
		2: '50%',
35 
		3: '75%',
36 
		4: '100%'
37 
	}
38 
	const [pages, setPages] = useState({
39 
		current: 1,
40 
		last: 1
41 
	})
10436 stevensc 42 
 
10447 stevensc 43 
	const getData = ({ url = '', params = {} }) => {
10436 stevensc 44 
 
10447 stevensc 45 
		axios.get(url, { params: { ...params } })
46 
			.then(({ data }) => {
47 
				if (!data.success) {
11071 stevensc 48 
					return dispatch(addNotification({
11051 stevensc 49 
						style: 'danger',
10447 stevensc 50 
						msg: 'Ha ocurrido un error'
51 
					}))
52 
				}
10436 stevensc 53 
 
10447 stevensc 54 
				setData(data.data)
55 
				setPages({ ...pages, last: Math.ceil(data.data.total / dataLength) })
56 
			})
57 
			.catch(() => dispatch(addNotification({
11051 stevensc 58 
				style: 'danger',
10447 stevensc 59 
				msg: 'Ha ocurrido un error'
60 
			})))
61 
	}
10436 stevensc 62 
 
10447 stevensc 63 
	useEffect(() => {
64 
		getData({
65 
			url: `${table_link}/${currentVacancy}`,
66 
			params: {
67 
				search: search,
68 
				length: dataLength,
69 
				page: pages.current
70 
			}
71 
		})
72 
	}, [search, dataLength, pages.current, currentVacancy])
10436 stevensc 73 
 
10836 stevensc 74 
	useEffect(() => {
10840 stevensc 75 
		setActionLink(add_link.replace('UUID_PLACEHOLDER', currentVacancy))
10836 stevensc 76 
	}, [currentVacancy])
77 
 
10447 stevensc 78 
	return (
79 
		<>
80 
			<section className="content">
81 
				<div className="container-fluid">
82 
					<div className="row">
83 
						<div className="col-12">
84 
							<Card>
85 
								<Card.Header>
86 
									<div className="row" style={{ gap: '10px' }}>
87 
										<div className="form-group">
88 
											<label>Vacantes</label>
89 
											<select
90 
												className="form-control"
91 
												value={currentVacancy}
92 
												onChange={(e) => setCurrentVacancy(e.target.value)}
93 
												defaultValue={vacancies[0].uuid}
94 
											>
95 
												{
96 
													vacancies.map((vacancy) => (
97 
														<option key={vacancy.uuid} value={vacancy.uuid}>{vacancy.name}</option>
98 
													))
99 
												}
100 
											</select>
101 
										</div>
102 
									</div>
103 
									<div className="row justify-content-end" style={{ gap: '10px' }}>
104 
										{
105 
											permisions.allowAdd
106 
											&&
107 
											<label
108 
												className='d-flex align-items-center'
10462 stevensc 109 
												onClick={() => history.push(`${url}/add`)}
10447 stevensc 110 
												style={{ cursor: 'pointer' }}
111 
											>
112 
												<i className="fa fa-plus mr-2" />
113 
												Agregar
114 
											</label>
115 
										}
116 
										<label
117 
											className='d-flex align-items-center'
118 
											onClick={() => getData({
119 
												url: table_link,
120 
												params: {
121 
													search: search,
122 
													length: dataLength,
123 
													page: pages.current
124 
												}
125 
											})}
126 
											style={{ cursor: 'pointer' }}
127 
										>
128 
											<i className='fa fa-refresh mr-2' />
129 
											Actualizar
130 
										</label>
131 
									</div>
132 
									<div className="row justify-content-between align-items-center">
133 
										<LengthFilter onChange={(e) => setDataLength(e.target.value)} />
134 
										<SearchInput onChange={(e) => setSearch(e.target.value)} />
135 
									</div>
136 
								</Card.Header>
137 
								<Card.Body>
138 
									<Table data={data.items} headers={headers} setData={setData}>
139 
										{
140 
											data.items?.map((item) => (
141 
												<tr key={item.uuid}>
142 
													<td>{`${item.first_name} ${item.last_name}`}</td>
143 
													<td>{item.email}</td>
144 
													<td>
145 
														{
146 
															item.type === 'r'
147 
																? 'Recursos Humanos'
148 
																: 'Potencial superior'
149 
														}
150 
													</td>
151 
													<td>{item.vacancy}</td>
152 
													<td>
153 
														{
154 
															points[item.points]
155 
														}
156 
													</td>
157 
													<td className='d-inline-flex align-items-center' style={{ gap: '10px' }}>
158 
														{
159 
															permisions.allowEdit
160 
															&&
161 
															<i
162 
																className='fa fa-pencil'
163 
																style={{ cursor: 'pointer' }}
164 
																onClick={() => {
165 
																	setActionLink(item.actions.link_edit)
10462 stevensc 166 
																	history.push(`${url}/edit`)
10447 stevensc 167 
																}}
168 
															/>
169 
														}
170 
														{
171 
															permisions.allowDelete
172 
															&&
173 
															<i
174 
																className='fa fa-trash'
175 
																onClick={() => {
176 
																	setShowDeleteModal(true)
177 
																	setDeleteLink(item.actions.link_delete)
178 
																}}
179 
																style={{ cursor: 'pointer' }}
180 
															/>
181 
														}
182 
														{
183 
															item.type === 'r'
184 
															&&
11078 stevensc 185 
															<a href={`/recruitment-and-selection/interview/${item.uuid}/file`} className='btn p-0'>
10447 stevensc 186 
																<i className='fa fa-external-link' style={{ cursor: 'pointer' }} />
10860 stevensc 187 
															</a>
10447 stevensc 188 
														}
189 
														{
190 
															permisions.allowFile
191 
															&&
192 
															<a href={item.actions.link_report} target='_blank' className='btn p-0' rel="noreferrer">
193 
																<i className='fa fa-file-o' style={{ cursor: 'pointer' }} />
194 
															</a>
195 
														}
196 
													</td>
197 
												</tr>
198 
											))
199 
										}
200 
									</Table>
201 
									<div className='row justify-content-between align-items-center'>
202 
										<p className='mb-0'>
203 
											{`Mostrando registros del ${(dataLength * pages.current) - (dataLength - 1) || 0} al ${(dataLength * pages.current) - (dataLength - data.total) || 0} de un total de ${data.total || 0} registros`}
204 
										</p>
205 
										<TablePagination
206 
											onDecrement={() => setPages(prev => prev.current -= 1)}
207 
											onIncrement={() => setPages(prev => prev.current += 1)}
208 
											totalPages={pages.last}
209 
											currentPage={pages.current}
210 
										/>
211 
									</div>
212 
								</Card.Body>
213 
							</Card>
214 
						</div>
215 
					</div >
216 
				</div >
217 
			</section >
218 
			<DeleteModal
219 
				url={deleteLink}
220 
				isOpen={showDeleteModal}
221 
				closeModal={() => setShowDeleteModal(false)}
222 
				title="Esta seguro de borrar esta entrevista?"
223 
				onComplete={() => setData({ ...data, items: data.items.filter((item) => item.actions.link_delete !== deleteLink) })}
224 
				message="Entrevista eliminada"
225 
			/>
226 
		</>
227 
	)
10436 stevensc 228 
}
229 
export default TableView