Proyectos de Subversion LeadersLinked - Backend

Rev

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

Rev 15230 Rev 15274
Línea 1... Línea 1...
1 
import axios from 'axios'
 1 
import axios from 'axios'
2 
import React, { useState } from 'react'
 2 
import React, { useEffect } from 'react'
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 { useDispatch } from 'react-redux'
 5 
import { useDispatch } from 'react-redux'
6 
import { addNotification } from '../../../redux/notification/notification.actions'
 6 
import { addNotification } from '../../../redux/notification/notification.actions'
- 
 
 7 
import DropzoneComponent from '../../../shared/Dropzone/DropzoneComponent'
Línea 7... Línea 8...
7 
 
 8 
 
8 
const CompanyImgModal = ({
 9 
const CompanyImgModal = ({
9 
	isOpen,
 10 
	isOpen,
10 
	closeModal,
 11 
	closeModal,
11 
	imageUploadUrl,
 12 
	imageUploadUrl,
12 
	action
 13 
	action
Línea 13... Línea 14...
13 
}) => {
 14 
}) => {
14 
 
 - 
 
15 
	const { handleSubmit, register } = useForm()
 15 
 
Línea 16... Línea 16...
16 
	const [error, setError] = useState(null)
 16 
	const { handleSubmit, register, getValues, setValue, clearErrors, errors } = useForm()
17 
	const dispatch = useDispatch()
 17 
	const dispatch = useDispatch()
18 
 
 18 
 
19 
	const onSubmit = ({ image }) => {
 19 
	const onSubmit = ({ image }) => {
20 
		const data = new FormData()
 20 
		const data = new FormData()
21 
		data.append('image', image[0])
 21 
		data.append('image', image)
22 
		axios.post(imageUploadUrl, data)
 22 
		axios.post(imageUploadUrl, data)
23 
			.then(({ data }) => {
 23 
			.then(({ data }) => {
Línea 37... Línea 37...
37 
							)
 37 
							)
38 
						)
 38 
						)
39 
					return
 39 
					return
40 
				}
 40 
				}
41 
				action(data.data)
 41 
				action(data.data)
42 
				setError(null)
 - 
 
43 
				closeModal()
 42 
				closeModal()
44 
			})
 43 
			})
45 
			.catch((err) => console.log(err))
 44 
			.catch((err) => console.log(err))
46 
	}
 45 
	}
Línea -... Línea 46...
- 
 
 46 
 
- 
 
 47 
	const onUploadedHandler = (file) => {
- 
 
 48 
		setValue('image', file)
- 
 
 49 
		clearErrors('image')
- 
 
 50 
	}
- 
 
 51 
 
- 
 
 52 
	useEffect(() => {
- 
 
 53 
		if (getValues('image')) setValue('image', '')
- 
 
 54 
	}, [isOpen])
- 
 
 55 
 
- 
 
 56 
	useEffect(() => {
- 
 
 57 
		register('image', { required: true })
- 
 
 58 
	}, [])
47 
 
 59 
 
48 
	return (
 60 
	return (
49 
		<Modal
 61 
		<Modal
50 
			size="md"
 62 
			size="md"
51 
			show={isOpen}
 63 
			show={isOpen}
Línea 55... Línea 67...
55 
			<Modal.Header closeButton>
 67 
			<Modal.Header closeButton>
56 
				<Modal.Title>Foto de perfil</Modal.Title>
 68 
				<Modal.Title>Foto de perfil</Modal.Title>
57 
			</Modal.Header>
 69 
			</Modal.Header>
58 
			<form onSubmit={handleSubmit(onSubmit)}>
 70 
			<form onSubmit={handleSubmit(onSubmit)}>
59 
				<Modal.Body>
 71 
				<Modal.Body>
60 
					<div className="mb-3">
 72 
					<div className="form-group">
61 
						<label className="form-label">Imagen recomendada de (180 x 180px)</label>
 - 
 
62 
						<input
 - 
 
63 
							className="form-control form-control-sm"
 - 
 
64 
							id="formFileSm"
 73 
						<DropzoneComponent
65 
							type="file"
 74 
							modalType='IMAGE'
66 
							name="image"
 - 
 
67 
							accept='.jpg, .jpeg, .png, .gif'
 75 
							onUploaded={onUploadedHandler}
68 
							ref={register}
 76 
							settedFile={getValues('image')}
69 
							style={{ padding: '1px' }}
 77 
							recomendationText='Imagen recomendada de (180 x 180px)'
70 
						/>
 78 
						/>
71 
					</div>
 79 
					</div>
72 
					{error && <p>{error}</p>}
 80 
					{errors.image && <p>Este campo es requerido</p>}
73 
				</Modal.Body>
 81 
				</Modal.Body>
74 
				<Modal.Footer>
 82 
				<Modal.Footer>
75 
					<Button
 83 
					<Button
76 
						variant="primary"
 84 
						variant="primary"
77 
						type="submit"
 85 
						type="submit"