Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

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

Rev 5473 Rev 5489
Línea 1... Línea 1...
1 
/* eslint-disable react/prop-types */
 1 
/* eslint-disable react/prop-types */
2 
import React, { useState } from "react";
 2 
import React, { useState, useEffect } from 'react'
3 
import AptitudesModal from "./AptitudesModal";
 3 
import { useSelector } from 'react-redux'
Línea -... Línea 4...
- 
 
 4 
 
- 
 
 5 
import IconButton from '@mui/material/IconButton'
- 
 
 6 
import EditIcon from '@mui/icons-material/Edit'
- 
 
 7 
import AptitudesModal from './AptitudesModal'
- 
 
 8 
import EmptySection from '../../../shared/empty-section/EmptySection'
4 
 
 9 
 
5 
const Aptitudes = ({ userAptitudes, aptitudesOptions, userIdEncrypted }) => {
 10 
const Aptitudes = ({ aptitudes, aptitudesOptions, userId, isEdit }) => {
6 
  const [isModalOpen, setIsModalOpen] = useState(false);
 11 
  const [isModalOpen, setIsModalOpen] = useState(false)
- 
 
 12 
  const [setttedAptitudes, setSetttedAptitudes] = useState(aptitudes)
- 
 
 13 
 
- 
 
 14 
  const labels = useSelector((state) => state.labels)
- 
 
 15 
 
- 
 
 16 
  const handleEdit = () => {
- 
 
 17 
    setIsModalOpen(true)
- 
 
 18 
  }
- 
 
 19 
 
- 
 
 20 
  useEffect(() => {
- 
 
 21 
    setSetttedAptitudes(aptitudes)
Línea 7... Línea 22...
7 
  const [userAptitudesArray, setUserAptitudesArray] = useState(userAptitudes);
 22 
  }, [aptitudes])
8 
 
 23 
 
9 
  return (
 24 
  return (
- 
 
 25 
    <>
10 
    <>
 26 
      <div className="profile-attr">
11 
      <div className="user-profile-ov">
 27 
        <div className="profile-attr-header">
12 
        <h3>
 28 
          <h3>{labels.APTITUDES}</h3>
13 
          Aptitudes
 29 
          {isEdit && (
14 
          <a href="#" title="" className="btn-aptitudes-edit" onClick={() => setIsModalOpen(true)}>
 30 
            <IconButton onClick={handleEdit}>
15 
            <i className="fa fa-pencil"></i>
 31 
              <EditIcon />
16 
          </a>
 32 
            </IconButton>
17 
        </h3>
 33 
          )}
18 
        <ul>
 34 
        </div>
19 
          {
 35 
        {setttedAptitudes.length ? (
20 
            userAptitudesArray.length
 36 
          <ul id="list-skills">
21 
              ? userAptitudesArray.map(({ name }) =>
 37 
            {setttedAptitudes.map(({ name, value }) => (
22 
                <li key={name}>
 38 
              <li key={value}>
23 
                  <a href="#" title="">
 39 
                <span>{name}</span>
24 
                    {name}
 40 
              </li>
25 
                  </a>
 41 
            ))}
26 
                </li>
 42 
          </ul>
27 
              )
 43 
        ) : (
28 
              : <li>Sin información</li>
 - 
 
29 
          }
 44 
          <EmptySection align="left" message={labels.EMPTY} />
30 
        </ul>
 45 
        )}
31 
      </div>
 46 
      </div>
32 
      <AptitudesModal
 47 
      <AptitudesModal
33 
        show={isModalOpen}
 48 
        show={isModalOpen}
34 
        aptitudesOptions={aptitudesOptions}
 49 
        aptitudesOptions={aptitudesOptions}
35 
        closeModal={() => setIsModalOpen(false)}
 50 
        closeModal={() => setIsModalOpen(false)}
36 
        setAptitudes={(newAptitudes) => setUserAptitudesArray(newAptitudes)}
 51 
        setAptitudes={(newAptitudes) => setSetttedAptitudes(newAptitudes)}
37 
        userAptitudes={userAptitudesArray}
 52 
        userAptitudes={setttedAptitudes}
38 
        userIdEncrypted={userIdEncrypted}
 53 
        userIdEncrypted={userId}
39 
      />
 54 
      />
40 
    </>
 55 
    </>
Línea 41... Línea 56...
41 
  );
 56 
  )