Proyectos de Subversion LeadersLinked - Backend

Rev

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

Rev 8459 Rev 11246
Línea 1... Línea 1...
1 
import React from "react";
 1 
import React from 'react'
2 
import { useState, useEffect } from "react";
 2 
import { useState, useEffect } from 'react'
3 
import { useForm } from "react-hook-form";
 3 
import { useForm } from 'react-hook-form'
4 
import TagsInput from "../../../shared/TagsInput";
 4 
import TagsInput from '../../../shared/TagsInput'
5 
import SubmitModal from "./SubmitModal";
 5 
import SubmitModal from './SubmitModal'
6 
import { getData } from "../../../helpers/fetchHelpers"
 6 
import { getData } from '../../../helpers/fetchHelpers'
Línea 7... Línea 7...
7 
 
 7 
 
8 
 
 8 
 
9 
const SkillsModal = ({
 9 
const SkillsModal = ({
10 
    closeModal,
 10 
	closeModal,
Línea 11... Línea 11...
11 
    dataLink
 11 
	dataLink
Línea 12... Línea 12...
12 
}) => {
 12 
}) => {
13 
 
 13 
 
14 
    const { register, errors } = useForm();
 14 
	const { register, errors } = useForm()
15 
 
 15 
 
16 
    const [skillsSelecteds, setSkillsSelecteds] = useState([]);
 16 
	const [skillsSelecteds, setSkillsSelecteds] = useState([])
17 
    const [userSkillsArray, setUserSkillsArray] = useState([]);
 17 
	const [userSkillsArray, setUserSkillsArray] = useState([])
18 
    const [skillsOptionsArray, setSkillsOptionsArray] = useState([]);
 18 
	const [skillsOptionsArray, setSkillsOptionsArray] = useState([])
19 
    const [data, setData] = useState({ "skills[]": "" });
 19 
	const [data, setData] = useState([{ 'skills[]': '' }])
20 
 
 20 
 
21 
    useEffect(() => {
 21 
	useEffect(() => {
22 
        register("skills", {
 22 
		register('skills', {
23 
            required: "Por favor seleccione al menos un lenguaje",
 23 
			required: 'Por favor seleccione al menos un lenguaje',
24 
        });
 24 
		})
25 
    }, []);
 25 
	}, [])
26 
 
 26 
 
27 
    const handleTagsChange = (tags) => {
 27 
	const handleTagsChange = (tags) => {
28 
        if (tags.length) {
 28 
		if (tags.length) {
29 
            let newTags = [];
 29 
			let newTags = []
30 
            tags.map((tag) => {
 30 
			tags.map((tag) => {
31 
                newTags = [...newTags, tag.value];
 31 
				newTags = [...newTags, { 'skills[]': tag.value }]
32 
            });
 32 
			})
33 
            setData({ "skills[]": newTags });
 33 
			setData({ 'skills[]': newTags })
34 
        } else {
 34 
		} else {
35 
            setData({ "skills[]": "" });
 35 
			setData({ 'skills[]': '' })
36 
        }
 36 
		}
37 
    };
 37 
	}
38 
 
 38 
 
39 
    useEffect(() => {
 39 
	useEffect(() => {
40 
        getData(dataLink)
 40 
		getData(dataLink)
41 
            .then(({ skills_available, skills_selected }) => {
 41 
			.then(({ skills_available, skills_selected }) => {
42 
 
 42 
 
43 
                Object.entries(skills_available).map(([key, value]) => {
 43 
				Object.entries(skills_available).map(([key, value]) => {
44 
                    setSkillsOptionsArray(prev => [...prev, { value: key, name: value }])
 44 
					setSkillsOptionsArray(prev => [...prev, { value: key, name: value }])
45 
                })
 45 
				})
46 
 
 46 
 
47 
                setSkillsSelecteds(skills_selected)
 47 
				setSkillsSelecteds(skills_selected)
48 
            })
 48 
			})
49 
    }, [dataLink]);
 49 
	}, [dataLink])
50 
 
 50 
 
51 
    useEffect(() => {
 51 
	useEffect(() => {
52 
        skillsSelecteds.map(skill => {
 52 
		skillsSelecteds.map(skill => {
53 
            const userSkill = skillsOptionsArray.find(el => el.value === skill)
 53 
			const userSkill = skillsOptionsArray.find(el => el.value === skill)
54
54 
 
55 
            if (userSkill) {
 55 
			if (userSkill) {
56 
                setUserSkillsArray(prev => [...prev, { value: userSkill.value, name: userSkill.name }])
 56 
				setUserSkillsArray(prev => [...prev, { value: userSkill.value, name: userSkill.name }])
57 
            }
 57 
			}
58 
        })
 58 
		})
59 
    }, [skillsSelecteds, skillsOptionsArray]);
 59 
	}, [skillsSelecteds, skillsOptionsArray])
60 
 
 60 
 
61 
    return (
 61 
	return (
62 
        <SubmitModal
 62 
		<SubmitModal
63 
            title="Habilidades"
 63 
			title="Habilidades"
64 
            submitData={data}
 64 
			submitData={data}
65 
            postLink={dataLink}
 65 
			postLink={dataLink}
66 
            closeModal={closeModal}
 66 
			closeModal={closeModal}
67 
        >
 67 
		>
68 
            <div className="form-group">
 68 
			<div className="form-group">
69 
                <TagsInput
 69 
				<TagsInput
70 
                    suggestions={skillsOptionsArray}
 70 
					suggestions={skillsOptionsArray}
71 
                    settedTags={userSkillsArray}
 71 
					settedTags={userSkillsArray}
72 
                    onChange={handleTagsChange}
 72 
					onChange={handleTagsChange}
73 
                />
 73 
				/>
74 
                {errors.skills && <p>{errors.skills}</p>}
 74 
				{errors.skills && <p>{errors.skills}</p>}
Línea 75... Línea 75...
75 
            </div>
 75 
			</div>