Capítulo 25 – EmpresaAll mostrar empresas – Curso ReactJS y Laravel Directorio de Empresas

Curso ReactJS y Laravel Directorio de Empresas

Capitulo 25 ➜ EmpresaAll mostrar empresas

Componente EmpresaAll

Implementación del Componente EmpresaAll para mostrar todos los registros de la tabla empresas de la base de datos.

CRUD EmpresaAll

App.jsx

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

Config.jsx

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

pageadmin/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.getEmpresaAll()        
        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">                    
                    <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={`/admin/empresa/edit/${empresa.id}`} className='btn btn-primary'>Editar</Link>
                                                </td>
                                            </tr>
                                            
                                        )
                                    }
                                )
                            }                            
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
    </div>
  )
}

export default EmpresaAll

342 visitas

« Capítulo 24 – CategoriaDelete Borrar categoría

Capítulo 26 – EmpresaUpdate aprobar empresa »

{ Curso ReactJS y Laravel Directorio de Empresas }

Compartir link con tus amigos

Descarga el código del proyecto

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

Comprar

Indice

Puesta en escena

1 Presentación 2 Base de datos 3 Instalación de Laravel y React JS

API Rest | BackEnd

4 Modelos y relaciones 5 Rutas y Controladores 6 Roles de Usuarios admin | client 7 Registro de usuarios 8 Login de usuarios 9 Logout de usuarios 10 CRUD User 11 CRUD Categoría 12 CRUD Empresa

Autenticación en React Js

13 Rutas y Layouts 14 AuthUser - Token 15 Registro de usuarios 16 Login de usuarios 17 Logout de usuarios

Rol Admin | User

18 PanelAdmin 19 UserAll mostrar usuarios 20 UserUpdate Aprobación del usuario

Rol Admin | Categoria

21 CategoriaAll mostrar categorias 22 CategoriaStore Agregar una categoría 23 CategoriaUpdate Actualizar Categoría 24 CategoriaDelete Borrar categoría