Capitulo 28 del Módulo 7 Rol Client | Empresa

➜ EmpresaAll mostrar empresas

Componente empresaAll | Implementación del componente EmpresaAll para mostrar todos los registros de las empresas que estén relacionadas con el usuario que tiene el rol client

CRUD empresaAll

App.jsx

<Route path='empresa' element={<EmpresaAllClient/>} /> 

Config.jsx

    getEmpresaAllClient:()=>axios.get(`${base_api_url}/client/empresa`),

pageclient/EmpresaAll.jsx

import React, { useEffect, useState } from 'react'
import Config from '../Config';
import Sidebar from './Sidebar';
import { Link } from 'react-router-dom';

const EmpresaAll = () => {
    const [empresas, setEmpresas] = useState([])
    
    useEffect(()=>{
        _getEmpresaAll();
    },[]);

    const _getEmpresaAll = async ()=>{
        const response = await Config.getEmpresaAllClient()        
        setEmpresas(response.data)
    }  

  return (
    <div className="container bg-light">
        <div className='row'>
        <Sidebar/>
        <div className="col-sm-9 mt-3 mb-3">
            <div className="card">
                <div className="card-body"> 
                <Link to={'/client/empresa/create'} className='btn btn-primary'>Agregar Empresa</Link>
                   
                    <table className='table'>
                        <thead>
                            <tr>
                            <th>ORDEN</th><th>NAME</th><th>ACCIÓN</th>
                            </tr>
                        </thead>
                        <tbody>
                            {
                                !empresas ? "...loading " : empresas.map(
                                    (empresa)=>{
                                        return(
                                            <tr key={empresa.id}>
                                                <td>{empresa.orden}</td>
                                                <td>{empresa.nombre}</td>
                                                <td>
                                                    <Link to={`/client/empresa/edit/${empresa.id}`} className='btn btn-primary'>Editar</Link>
                                                </td>
                                            </tr>
                                            
                                        )
                                    }
                                )
                            }                            
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
    </div>
  )
}

export default EmpresaAll

 


1359 visitas

Descarga el código del proyecto

Descarga el código fuente del proyecto adquiriendo el curso completo

Comprar

Codea Applications

México, Colombia, España, Venezuela, Argentina, Bolivia, Perú

Core