Proyectos de Subversion LeadersLinked - Backend

Rev

Rev 8522 | Rev 14524 | Ir a la última revisión | Mostrar el archivo completo | | | Autoría | Ultima modificación | Ver Log |

Rev 8522 Rev 11152
Línea 3... Línea 3...
3 
import { Modal, Button } from 'react-bootstrap'
 3 
import { Modal, Button } from 'react-bootstrap'
4 
import { useForm } from 'react-hook-form'
 4 
import { useForm } from 'react-hook-form'
5 
import { getData } from '../../../helpers/fetchHelpers'
 5 
import { getData } from '../../../helpers/fetchHelpers'
Línea 6... Línea 6...
6 
 
 6 
 
7 
const CompanySizeModal = ({
 7 
const CompanySizeModal = ({
8 
    isOpen,
 8 
	isOpen,
9 
    closeModal,
 9 
	closeModal,
10 
    companySizeUrl,
 10 
	companySizeUrl,
11 
    action
 11 
	action
Línea 12... Línea 12...
12 
}) => {
 12 
}) => {
13 
 
 13 
 
14 
    const { handleSubmit, register } = useForm()
 14 
	const { handleSubmit, register, watch, setValue } = useForm()
15 
    const [error, setError] = useState(null);
 - 
 
16 
    const [companySizes, setCompanySizes] = useState([]);
 15 
	const [error, setError] = useState(null)
17 
    const [currentCompanySizeId, setCurrentCompanySizeId] = useState("");
 16 
	const [companySizes, setCompanySizes] = useState([])
18 
 
 17 
 
19 
    const onSubmit = ({ company_size }) => {
 18 
	const onSubmit = ({ company_size }) => {
20 
 
 19 
 
21 
        const data = new FormData()
 20 
		const data = new FormData()
22 
        data.append("company_size_id", company_size)
 21 
		data.append('company_size_id', company_size)
23 
 
 22 
 
24 
        axios.post(companySizeUrl, data)
 23 
		axios.post(companySizeUrl, data)
25 
            .then(({ data }) => {
 24 
			.then(({ data }) => {
26 
                if (!data.success) {
 25 
				if (!data.success) {
27 
                    return setError("Error en la respuesta")
 26 
					return setError('Error en la respuesta')
28 
                }
 27 
				}
29 
                action(data.data)
 28 
				action(data.data)
30 
            })
 29 
			})
31 
            .then(() => {
 30 
			.then(() => {
32 
                setError(null)
 31 
				setError(null)
33 
                closeModal()
 32 
				closeModal()
34 
            })
 33 
			})
35 
            .catch((err) => console.log(err))
 34 
			.catch((err) => console.log(err))
36 
    }
 35 
	}
37 
 
 36 
 
38 
    useEffect(() => {
 37 
	useEffect(() => {
39 
        getData(companySizeUrl)
 38 
		getData(companySizeUrl)
40 
            .then(({ company_sizes, company_size_id }) => {
 39 
			.then(({ company_sizes, company_size_id }) => {
41 
                Object.entries(company_sizes).map(([key, value]) => {
 40 
				Object.entries(company_sizes).map(([key, value]) => {
42 
                    setCompanySizes(prev => [...prev, { value: key, name: value }])
 41 
					setCompanySizes(prev => [...prev, { value: key, name: value }])
43 
                })
 42 
				})
44 
 
 43 
 
45 
                setCurrentCompanySizeId(company_size_id)
 44 
				setValue('company_size', company_size_id)
46 
            })
 45 
			})
47 
    }, [isOpen]);
 46 
	}, [isOpen])
48 
 
 47 
 
49 
    return (
 48 
	return (
50 
        <Modal
 49 
		<Modal
51 
            size="md"
 50 
			size="md"
52 
            show={isOpen}
 51 
			show={isOpen}
53 
            onHide={closeModal}
 52 
			onHide={closeModal}
54 
            autoFocus={false}
 53 
			autoFocus={false}
55 
        >
 54 
		>
56 
            <Modal.Header closeButton>
 55 
			<Modal.Header closeButton>
57 
                <Modal.Title>Cambiar</Modal.Title>
 56 
				<Modal.Title>Cambiar</Modal.Title>
58 
            </Modal.Header>
 57 
			</Modal.Header>
59 
            <form onSubmit={handleSubmit(onSubmit)}>
 58 
			<form onSubmit={handleSubmit(onSubmit)}>
60 
                <Modal.Body>
 59 
				<Modal.Body>
61 
                    <div className="mb-3">
 60 
					<div className="mb-3">
62 
                        <label className="form-label">Tamaño de la empresa</label>
 61 
						<label className="form-label">Tamaño de la empresa</label>
63 
                        <select
 62 
						<select
64 
                            className='form-control'
 63 
							className='form-control'
65 
                            name="company_size"
 64 
							name="company_size"
66 
                            ref={register}
 65 
							ref={register}
67 
                        >
 66 
						>
68 
                            {
 67 
							{
69 
                                companySizes.map(({ value, name }) => (
 68 
								companySizes.map(({ value, name }) => (
70 
                                    <option key={value} value={value}>{name}</option>
 69 
									<option selected={watch('company_size')} key={value} value={value}>{name}</option>
71 
                                ))
 70 
								))
72 
                            }
 71 
							}
73 
                        </select>
 72 
						</select>
74 
                    </div>
 73 
					</div>
75 
                    {error && <p>{error}</p>}
 74 
					{error && <p>{error}</p>}
76 
                </Modal.Body>
 75 
				</Modal.Body>
77 
                <Modal.Footer>
 76 
				<Modal.Footer>
78 
                    <Button
 77 
					<Button
79 
                        variant="primary"
 78 
						variant="primary"
80 
                        type="submit"
 79 
						type="submit"
81 
                    >
 80 
					>
82 
                        Enviar
 81 
                        Enviar
83 
                    </Button>
 82 
					</Button>
84 
                    <Button
 83 
					<Button
85 
                        variant="default"
 84 
						className='btn-tertiary'
86 
                        onClick={closeModal}
 85 
						onClick={closeModal}
87 
                    >
 86 
					>
88 
                        Cancelar
 87 
                        Cancelar
89 
                    </Button>
 88 
					</Button>
90 
                </Modal.Footer>
 89 
				</Modal.Footer>
91 
            </form>
 90 
			</form>
92 
        </Modal >
 91 
		</Modal >
Línea 93... Línea 92...
93 
    )
 92 
	)
94 
}
 93 
}