Proyectos de Subversion LeadersLinked - Backend

import React, { useState } from 'react'

import axios from 'axios';

import DeleteModal from '../../company-sizes/view/DeleteModal';

import EditModal from '../../groups-types/view/EditModal';

import TableContainer from '../../company-sizes/view/TableContainer'

const SkillsView = ({ urlsVar }) => {

    const { linkTable, addUrl } = urlsVar

    const [companyData, setCompanyData] = useState({});

    const [showModal, setShowModal] = useState(false);

    const [showDeleteModal, setShowDeleteModal] = useState(false);

    const [selectItem, setSelectItem] = useState(null);

    const [actionLink, setActionLink] = useState(addUrl);

    const headers = [

        { key: "name", label: "Nombre", isSorteable: true },

        { key: "status", label: "Activo", isSorteable: false },

        { key: "actions", label: "Acciones", isSorteable: false }

    ]

    const getData = (search, start, length) => {

        axios.get(

            linkTable,

            {

                params: {

                    search: search,

                    start: start,

                    length: length

                }

            })

            .then(({ data }) => {

                if (data.success) {

                    setCompanyData(data.data)

                    return data.data

                }

            })

            .catch((err) => console.log(err))

    }

    const closeModal = () => {

        setShowModal(false)

        setSelectItem(null)

        setActionLink(addUrl)

    }

    const closeDeleteModal = () => {

        setShowDeleteModal(false)

        setActionLink(addUrl)

    }

    const editItem = (item) => {

        setSelectItem(item);

        setActionLink(item.actions.link_edit);

        setShowModal(true);

    }

    const deleteItem = (item) => {

        setActionLink(item.actions.link_delete);

        setShowDeleteModal(true);

    }

    const addItem = () => {

        setSelectItem(null);

        setActionLink(addUrl)

        setShowModal(true);

    }

    return (

        <>

            <section className="content">

                <section className="content-header">

                    <div className="container-fluid">

                        <div className="row mb-2">

                            <div className="col-sm-12">

                                <h1>Habilidades</h1>

                            </div>

                        </div>

                    </div>

                </section>

                <TableContainer

                    data={companyData}

                    getData={getData}

                    onEdit={editItem}

                    onDelete={deleteItem}

                    onAdd={addItem}

                    headers={headers}

                />

            </section>

            <EditModal

                isOpen={showModal}

                title='Habilidades'

                closeModal={closeModal}

                isEdit={actionLink !== addUrl}

                url={actionLink}

                currentItem={selectItem}

                action={getData}

            />

            <DeleteModal

                isOpen={showDeleteModal}

                closeModal={closeDeleteModal}

                url={actionLink}

                action={getData}

            />

        </>

    )

}

export default SkillsView