Ir a la última revisión | Autoría | Comparar con el anterior | Ultima modificación | Ver Log |
/* eslint-disable react/prop-types */
import React, { useState } from 'react'
import parse from 'html-react-parser'
import EditIcon from '@mui/icons-material/EditOutlined'
import DeleteIcon from '@mui/icons-material/DeleteOutline'
import { axios } from '../../../../../../utils'
import ConfirmationBox from '../../../../../../shared/confirmation-box/ConfirmationBox'
const ExperienceCard = ({ experience, months, isEdit = false, onEdit = () => { }, setExperiences = () => { } }) => {
const [isShowModal, setIsShowModal] = useState(false)
const deleteExperience = async () => {
await axios.post(experience.link_delete)
.then(({ data: response }) => {
if (response.success) return setExperiences(response.data)
});
};
return (
<div className='card__items'>
<div className="card__options-container">
<h4>{experience.title}</h4>
{isEdit &&
<div className='card__options-icons position-relative'>
<button className='button-icon' onClick={() => onEdit('Experiencia', experience.link_edit, experience.description || ' ')}>
<EditIcon />
</button>
<button className='button-icon' onClick={() => setIsShowModal(true)}>
<DeleteIcon />
</button>
<ConfirmationBox
show={isShowModal}
onClose={() => setIsShowModal(false)}
onAccept={deleteExperience}
/>
</div>
}
</div>
<p>{experience.company}</p>
<span>{`${typeof experience.industry === 'object' ? experience.industry.name : experience.industry} / ${experience.size}`}</span>
<span>
{`${months[experience.from_month - 1]} ${experience.from_year}`} -{' '}
{experience.to_year ? `${months[experience.to_month - 1]} ${experience.to_year}` : 'Actual'}
</span>
<p>{experience.formatted_adress}</p>
{experience.description && parse(experience.description)}
</div>
)
}
export default ExperienceCard