Proyectos de Subversion LeadersLinked - Backend

Rev

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

Rev Autor Línea Nro. Línea
6266 stevensc 1 
import axios from 'axios'
15274 stevensc 2 
import React, { useEffect } from 'react'
15279 stevensc 3 
import { Modal } from 'react-bootstrap'
6266 stevensc 4 
import { useForm } from 'react-hook-form'
14843 stevensc 5 
import { useDispatch } from 'react-redux'
6 
import { addNotification } from '../../../redux/notification/notification.actions'
15274 stevensc 7 
import DropzoneComponent from '../../../shared/Dropzone/DropzoneComponent'
6266 stevensc 8 
 
6290 stevensc 9 
const FooterModal = ({ isOpen, closeModal, footerUploadUrl, action }) => {
6266 stevensc 10 
 
15274 stevensc 11 
	const { handleSubmit, register, getValues, setValue, clearErrors, errors } = useForm()
14843 stevensc 12 
	const dispatch = useDispatch()
6266 stevensc 13 
 
11152 stevensc 14 
	const onSubmit = ({ footer }) => {
15 
		const data = new FormData()
15274 stevensc 16 
		data.append('footer', footer)
6303 stevensc 17 
 
11152 stevensc 18 
		axios.post(footerUploadUrl, data)
19 
			.then(({ data }) => {
20 
				if (!data.success) {
14843 stevensc 21 
					typeof data.data === 'string'
22 
						?
23 
						dispatch(addNotification({
24 
							style: 'danger',
25 
							msg: data.data
26 
						}))
27 
						: Object.entries(data.data).map(([key, value]) =>
28 
							value.map(err =>
29 
								dispatch(addNotification({
30 
									style: 'danger',
31 
									msg: `${key}: ${err}`
32 
								}))
33 
							)
34 
						)
35 
					return
11152 stevensc 36 
				}
37 
				action(data.data)
38 
				closeModal()
39 
			})
40 
			.catch(err => console.log(err))
41 
	}
6266 stevensc 42 
 
15274 stevensc 43 
	const onUploadedHandler = (file) => {
44 
		setValue('footer', file)
45 
		clearErrors('footer')
46 
	}
47 
 
48 
	useEffect(() => {
49 
		if (getValues('footer')) setValue('footer', '')
50 
	}, [isOpen])
51 
 
52 
	useEffect(() => {
53 
		register('footer', { required: true })
54 
	}, [])
55 
 
11152 stevensc 56 
	return (
57 
		<Modal
58 
			size="md"
59 
			show={isOpen}
60 
			onHide={closeModal}
61 
			autoFocus={false}
62 
		>
63 
			<Modal.Header closeButton>
15227 stevensc 64 
				<Modal.Title>Pie de página</Modal.Title>
11152 stevensc 65 
			</Modal.Header>
66 
			<form onSubmit={handleSubmit(onSubmit)}>
67 
				<Modal.Body>
15274 stevensc 68 
					<div className="form-group">
69 
						<DropzoneComponent
70 
							modalType='IMAGE'
71 
							onUploaded={onUploadedHandler}
72 
							settedFile={getValues('footer')}
73 
							recomendationText='Imagen recomendada de (2480 x 268px)'
11152 stevensc 74 
						/>
75 
					</div>
15274 stevensc 76 
					{errors.footer && <p>Este campo es requerido</p>}
11152 stevensc 77 
				</Modal.Body>
78 
				<Modal.Footer>
15279 stevensc 79 
					<button
80 
						className="btn btn-primary"
11152 stevensc 81 
						type="submit"
82 
					>
14843 stevensc 83 
						Enviar
15279 stevensc 84 
					</button>
85 
					<button
86 
						className='btn btn-tertiary'
11152 stevensc 87 
						onClick={closeModal}
88 
					>
14843 stevensc 89 
						Cancelar
15279 stevensc 90 
					</button>
11152 stevensc 91 
				</Modal.Footer>
92 
			</form>
93 
		</Modal >
94 
	)
6266 stevensc 95 
}
96 
 
97 
export default FooterModal