LARAVEL-PHP: VISTA AUDIENCIA-DETALLE

 

VISTA

Podemos aprovechar herencia en las vistas, por ello, vamos a crear.

También podemos crear una carpeta que contiene vistas "menú" y dentro las páginas, para acceder a ellos, habría que poner "menu.pagina"

Vista Padre LAYOUT.blade.php

<!DOCTYPE html>
<head>
    <title>
        @yield('titulo')
    </title>
</head>
<body>

<ul>
  <li><a href="#home">Home</a></li>
  <li><a href="#news">News</a></li>
  <li><a href="#contact">Contact</a></li>
  <li><a href="#about">About</a></li>
</ul>

@yield('contenido')

</body>
</html>

Vista Layout Hija hija.blade.php

@extends('layout')

@section('titulo','Página Heredada')

@section('contenido')
    <h1>Página Hija</h1>
@endsection
<div class='container'>
    <h1>Editar audiencia</h1>

    <div class='row pr-0 mr-0'>
        <div class='col-md-2 mb-3'>
            <ul class='nav nav-pills flex-column' id='myTab' role='tablist'>
                <li class='nav-item'>
                    <a class='nav-link'  data-toggle='tab' href='#home1' >Integrante</a>
                </li>

                <li class='nav-item'>
                    <a class='nav-link'  data-toggle='tab' href='#video'  >Delito</a>
                </li>

                <li class='nav-item'>
                    <a class='nav-link'  data-toggle='tab' href='#home3' >Documento</a>
                </li>
            </ul>
        </div>  
        <div class='col-md-10'>
            <div class='tab-content' >
                <div class='tab-pane fade show active' id='home1' role='tabpanel'>
                     
                        <th>Victima</th>
                        <br>
                        <div class='tab-content float-right  ' >
                            <button  type="button" class="float-right btn btn-primary " data-toggle="modal" data-target="#myModal" >
                            Open modal
                            </button>
                        </div>
                        <table class="table">
                            <thead>
                            <tr>
                                <th>Firstname</th>
                                <th>Lastname</th>
                                <th>Email</th>
                            </tr>
                            </thead>
                            <tbody>
                            <tr>
                                <td>John</td>
                                <td>Doe</td>
                                <td>john@example.com</td>
                            </tbody>
                        </table>
                   
                </div>                            
   
                <div class='tab-pane fade ' id='video' role='tabpanel'>
                 
                        <th>Video</th>
                        <br>
                        <!-- Button to Open the Modal -->
                        <button type="button" class="float-right btn btn-primary " data-toggle="modal" data-target="#myModal" >
                        Open modal
                        </button>
                        <table class="table">
                            <thead>
                            <tr>
                                <th>Firstname</th>
                                <th>Lastname</th>
                                <th>Email</th>
                            </tr>
                            </thead>
                            <tbody>
                            <tr>
                                <td>John</td>
                                <td>Doe</td>
                                <td>john@example.com</td>
                            </tr>                                        
                            </tbody>
                        </table>
       
                </div>
           
                <div class='tab-pane fade' id='home3' role='tabpanel' >
                        <br>
                        <div class="panel-body">
                            33333333333333333333
                        </div>
                </div>
            </div>
        </div>
    </div>
</div>    

Comentarios

Entradas populares de este blog

Filtrando por fecha

10 videojuegos gratis para aprender JavaScript en línea

reloj obs---datetime.lua