Proyectos de Subversion LeadersLinked - Backend

Rev

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

Rev Autor Línea Nro. Línea
8428 stevensc 1 
import React, { useState } from 'react'
14230 stevensc 2 
import { useEffect } from 'react'
3 
import { useForm } from 'react-hook-form'
4 
import { getData } from '../../../helpers/fetchHelpers'
8428 stevensc 5 
import SubmitModal from './SubmitModal'
6 
 
7 
const SalaryModal = ({
14230 stevensc 8 
	closeModal,
9 
	dataLink
8428 stevensc 10 
}) => {
11 
 
14814 stevensc 12 
	const [currencyOptions, setCurrencyOptions] = useState([])
14230 stevensc 13 
	const [isActive, setIsActive] = useState(false)
14 
	const [currency, setCurrency] = useState(currencyOptions[0].value)
15 
	const { register, watch, setValue } = useForm()
8428 stevensc 16 
 
14230 stevensc 17 
	useEffect(() => {
18 
		getData(dataLink)
19 
			.then(({
20 
				salary_visible,
21 
				salary_currency,
22 
				salary_min,
14814 stevensc 23 
				salary_max,
24 
				currencies }) => {
14230 stevensc 25 
				setCurrency(salary_currency)
26 
				setValue('salary_min', salary_min)
27 
				setValue('salary_max', salary_max)
28 
				salary_visible === 'y' ? setIsActive(true) : setIsActive(false)
14814 stevensc 29 
				Object.entries(currencies).map(([value, key]) => setCurrencyOptions(prev => [...prev, { label: key, value: value }]))
14230 stevensc 30 
			})
31 
	}, [])
8437 stevensc 32 
 
14230 stevensc 33 
	return (
34 
		<SubmitModal
35 
			title='Salario'
36 
			closeModal={closeModal}
37 
			submitData={{
38 
				salary_visible: isActive ? 'y' : 'n',
39 
				salary_currency: currency,
40 
				salary_min: watch('salary_min'),
41 
				salary_max: watch('salary_max')
42 
			}}
43 
			postLink={dataLink}
44 
		>
45 
			<div
46 
				className={`toggle btn btn-block btn-primary ${!isActive && 'off'}`}
47 
				data-toggle="toggle"
48 
				role="button"
49 
				style={{ width: '130px' }}
50 
				onClick={() => setIsActive(!isActive)}
51 
			>
52 
				<input
53 
					type="checkbox"
54 
					checked={isActive}
55 
				/>
56 
				<div className="toggle-group">
57 
					<label htmlFor="status" className="btn btn-primary toggle-on">Mostrar</label>
58 
					<label htmlFor="status" className="btn btn-light toggle-off">No mostrar</label>
59 
					<span className="toggle-handle btn btn-light"></span>
60 
				</div>
61 
			</div>
62 
			<div className='form-group'>
63 
				<label className="form-label">Moneda</label>
64 
				<select
65 
					className='form-control'
66 
					name="employment_type"
67 
					onChange={(e) => setCurrency(e.target.value)}
68 
					value={currency}
69 
				>
70 
					{
71 
						currencyOptions.map(({ value, label }) => (
72 
							<option key={value} value={value}>{label}</option>
73 
						))
74 
					}
75 
				</select>
8449 stevensc 76 
 
14230 stevensc 77 
			</div>
78 
			<div className='form-group'>
79 
				<label className="form-label">Minimo</label>
80 
				<input
81 
					type='text'
82 
					className='form-control'
83 
					disabled={!isActive}
84 
					name='salary_min'
85 
					ref={register({
86 
						required: true,
87 
						valueAsNumber: true,
88 
						min: 1
89 
					})}
90 
				/>
91 
			</div>
92 
			<div className='form-group'>
93 
				<label className="form-label">Maximo</label>
94 
				<input
95 
					type='text'
96 
					className='form-control'
97 
					disabled={!isActive}
98 
					name='salary_max'
99 
					ref={register({
100 
						required: true,
101 
						valueAsNumber: true,
102 
						validate: value => value > watch('salary_min')
103 
					})}
104 
				/>
105 
			</div>
106 
		</SubmitModal>
107 
	)
8428 stevensc 108 
}
109 
 
110 
export default SalaryModal