actualizacion controlador, vistas. nuevo: mensajes,layouts, descargar pdf,request

app/Http/Controllers/Requests/UpdatedPersonaRequest.php

@@ -0,0 +1,45 @@
+<?php
+
+namespace App\Http\Requests;
+
+use Illuminate\Foundation\Http\FormRequest;
+
+class UpdatedPersonaRequest extends FormRequest
+{
+    /**
+     * Determine if the user is authorized to make this request.
+     */
+    public function authorize(): bool
+    {
+        return true;
+    }
+
+    /**
+     * Get the validation rules that apply to the request.
+     *
+     * @return array<string, \Illuminate\Contracts\Validation\ValidationRule|array<mixed>|string>
+     */
+    public function rules(): array
+    {
+        return [
+            'apellido' => 'required|regex:/^[a-zA-ZáéíóúñÁÉÍÓÚ]+( [a-zA-ZáéíóúñÁÉÍÓÚ]+)*$/|max:20|unique:persona,apellido,' . $this->route('persona') . ',id_persona',
+            'nombre' => 'required|regex:/^[a-zA-ZáéíóúñÁÉÍÓÚ]+( [a-zA-ZáéíóúñÁÉÍÓÚ]+)*$/|max:20|unique:persona,nombre,' . $this->route('persona') . ',id_persona',
+            'dni' => 'required'
+        ];
+    }
+
+    public function messages() {
+
+        return [
+            'apellido.required' => 'el campo apellido es requerido',
+            'apellido.regex' => 'el campo apellido solo debe contener letras',
+            'apellido.max' => 'el campo apellido debe contener un maximo de 20 caracteres',
+            'apellido.unique' => 'ya existe este apellido',
+            'nombre.required' => 'el campo nombre es requerido',
+            'nombre.regex' => 'el campo nombre solo debe contener letras',
+            'nombre.max' => 'el campo nombre debe contener un maximo de 20 caracteres',
+            'nombre.unique' => 'ya existe este nombre',
+            'dni'   => 'el campo dni es requerido'
+        ];
+    }
+}

app/Http/Controllers/personacontroller.php

@@ -5,16 +5,15 @@ namespace App\Http\Controllers;
 use Illuminate\Http\Request;
 use Illuminate\Http\RedirectResponse;
 use App\Models\Persona;
+use App\Http\Requests\UpdatedPersonaRequest;
 
 class PersonaController extends Controller
 {
-    public function index(Request $request)
-    {
-        $persona = Persona::withTrashed()->  get();
+     public function index(Request $request){
 
-        return view('personas.index',["personas"=>$persona]);
+        $persona = Persona::withTrashed()->get();
 
- // $categorias = Categorias::findOrFail(13);
+       // $categorias = Categorias::findOrFail(13);
         //$cat = Categorias::where('id_categoria', 1)->first();
         //$categorias = Categorias::where('descripcion', 'Cursos, capacitaciones y formación')->get();
         //$categorias = Categorias::where('descripcion', 'like', '%Prod%')->get();
@@ -24,6 +23,9 @@ class PersonaController extends Controller
         //$categorias = Categorias::first();
         //$categorias = Categorias::last();
         /*Categorias::count();*/
+
+
+        return view('personas.index', ["persona"=>$persona]);
     }
       public function show($id){
         $persona = Persona::findOrfail($id);
@@ -33,6 +35,7 @@ class PersonaController extends Controller
     public function destroy(Request $request, $id){
         $persona = Persona::findOrfail($id);
         $persona->delete();
+        $request->session()->flash('mensaje-success', 'La persona fue eliminada.');
         return redirect('/personas');
     }
 
@@ -43,13 +46,35 @@ class PersonaController extends Controller
 
       public function store(Request $request){
     
+    $request->validate([
+             'apellido' => 'required|regex:/^[a-zA-ZáéíóúñÁÉÍÓÚ]+( [a-zA-ZáéíóúñÁÉÍÓÚ]+)*$/|max:20|unique:persona,apellido',
+            'nombre' => 'required|regex:/^[a-zA-ZáéíóúñÁÉÍÓÚ]+( [a-zA-ZáéíóúñÁÉÍÓÚ]+)*$/|max:20|unique:persona,nombre',
+            'dni' => 'required|numeric|digits_between:7,8',
+            ],
+        [
+            'apellido.required' => 'el campo apellido es requerido',
+            'apellido.regex' => 'el campo apellido solo debe contener letras',
+            'apellido.max' => 'el campo apellido debe contener un maximo de 20 caracteres',
+            'apellido.unique' => 'ya existe este apellido',
+            'nombre.required' => 'el campo nombre es requerido',
+            'nombre.regex' => 'el campo nombre solo debe contener letras',
+            'nombre.max' => 'el campo nombre debe contener un maximo de 20 caracteres',
+            'nombre.unique' => 'ya existe este nombre',
+            'dni'   => 'el campo dni es requerido',
+            'dni'   => 'el campo dni debe contener solo numeros',
+            'dni'   => 'el campo dni debe contener un maximo de 8 caracteres',
+        ]
+        );
+
+
         $persona = new Persona();
         $persona->fill([
-            'apellido' => $request->input('apellido'),
+            'apellido'=> $request->input('apellido'),
             'nombre' => $request->input('nombre'),
             'dni' => $request->input('dni'),
             ]);
         $persona->save();
+        $request->session()->flash('mensaje-success', 'La persona fue agregada.');
         return redirect('/personas');
     }
 
@@ -62,48 +87,21 @@ class PersonaController extends Controller
     public function update(Request $request, $id){
         $persona = Persona::findOrfail($id);
         $persona->fill([
-            'apellido' => $request->input('apellido'),
+            'apellido'=> $request->input('apellido'),
             'nombre' => $request->input('nombre'),
             'dni' => $request->input('dni'),
         ]);
         $persona->update();
+         $request->session()->flash('mensaje-success', 'La persona fue modificada.');
           return redirect('/personas');
     }
 
      public function restaurar(Request $request, $id){
         $persona = Persona::withTrashed()->findOrfail($id);
         $persona->restore();
+        $request->session()->flash('mensaje-success', 'La persona fue restaurada.');
         return redirect('/personas');
     }
-/*
-
-  
- 
-    public function show($id){
-        $categorias = Categorias::findOrfail($id);
-
-        return view('categorias.show', ["cat"=>$categorias]);
-    }
-
-
-    public function edit($id){
-        $categorias = Categorias::findOrfail($id);
-        return view('categorias.edit', ["cat"=>$categorias]);
-    }
-
-
-     public function update(Request $request, $id){
-        $categorias = Categorias::findOrfail($id);
-        $categorias->fill([
-            'nombre' => $request->input('nombre'),
-            'descripcion' => $request->input('descripcion'),
-        ]);
-        $categorias->update();
-          return redirect('/categorias');
-    }
-
-
-    */
 
     
 }

resources/views/compartido/errores.blade.php

@@ -0,0 +1,9 @@
+@if ($errors->any())
+    <div class="alert alert-danger">
+        <ul>
+            @foreach ($errors->all() as $error)
+                <li>{{ $error }}</li>
+            @endforeach
+        </ul>
+    </div>
+@endif

resources/views/compartido/mensajes.blade.php

@@ -0,0 +1,3 @@
+@if (session('mensaje-success'))
+  <p class="alert alert-success">{{ session('mensaje-success') }}</p>
+@endif

resources/views/layouts/admin.blade.php

@@ -0,0 +1,103 @@
+<!doctype html>
+<html lang="es">
+<head>
+  <meta charset="utf-8">
+  <!-- viewport => hace que el sitio sea responsive en móviles -->
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <!-- Token CSRF de Laravel para proteger formularios -->
+  <meta name="csrf-token" content="{{ csrf_token() }}">
+  <!-- yield => permite que cada vista defina su título; si no lo define, se usa "MiApp" -->
+  <title>@yield('title','proyecto_taller')</title>
+
+  <!-- Bootstrap CSS v4.6.2:
+       - framework que da estilos listos para botones, formularios, grillas, etc. -->
+  <link rel="stylesheet"
+        href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/css/bootstrap.min.css">
+
+  <!-- FontAwesome:
+       - librería de íconos (ej: fa-eye, fa-pencil, fa-remove, etc.). -->
+  <link rel="stylesheet"
+        href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.0/css/all.min.css">
+<!-- DataTables:  -->
+<link rel="stylesheet" href="https://cdn.datatables.net/1.13.8/css/dataTables.bootstrap4.min.css">
+<link rel="stylesheet" href="https://cdn.datatables.net/buttons/2.4.2/css/buttons.bootstrap4.min.css">
+  <!-- @stack('styles') => permite que otras vistas agreguen CSS extra en esta sección -->
+  @stack('styles')
+</head>
+<body>
+  <!-- navbar => barra de navegación de Bootstrap -->
+  <!-- navbar-expand-lg => se expande en pantallas grandes (LG) -->
+  <!-- navbar-light => estilo de texto oscuro sobre fondo claro -->
+  <!-- bg-light => fondo gris claro -->
+ 
+<nav class="navbar navbar-expand-lg  bg-light">
+
+    <!-- Nombre de la aplicación -->
+    <a class="navbar-brand" href="{{ url('/') }}">
+        proyecto_taller
+    </a>
+
+    <!-- Menú principal -->
+    <ul class="navbar-nav">
+
+        <!-- Categorías -->
+        <li class="nav-item dropdown">
+
+            <a class="nav-link dropdown-toggle"
+               href="#"
+               data-toggle="dropdown">
+
+                PERSONAS
+            </a>
+
+            <div class="dropdown-menu">
+
+                <a class="dropdown-item"
+                   href="{{ route('personas.index') }}">
+
+                    Listado
+                </a>
+
+                <a class="dropdown-item"
+                   href="{{ route('personas.create') }}">
+
+                    Nueva Persona
+                </a>
+
+            </div>
+
+        </li>
+
+      
+    </ul>
+
+</nav>
+  <!-- container => centra el contenido y le da márgenes automáticos laterales -->
+  <!-- py-4 => padding vertical (arriba y abajo) de 1.5rem (~24px) -->
+  <div class="container py-4">
+    <!-- yield('contenido') => espacio donde cada vista Blade inyecta su propio contenido -->
+    @yield('contenido')
+  </div>
+
+  <!-- Dependencias JS -->
+  <!-- jQuery => requerido por Bootstrap 4 -->
+  <script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
+  <!-- Popper.js => requerido para tooltips, dropdowns y menús flotantes -->
+  <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js"></script>
+  <!-- Bootstrap JS => activa componentes interactivos como modales, menús, tooltips -->
+
+  <script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/js/bootstrap.min.js"></script>
+
+     <!-- DataTables -->
+<script src="https://cdn.datatables.net/1.13.8/js/jquery.dataTables.min.js"></script>
+<script src="https://cdn.datatables.net/1.13.8/js/dataTables.bootstrap4.min.js"></script>
+
+<script src="https://cdn.datatables.net/buttons/2.4.2/js/dataTables.buttons.min.js"></script>
+<script src="https://cdn.datatables.net/buttons/2.4.2/js/buttons.bootstrap4.min.js"></script>
+<script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.10.1/jszip.min.js"></script>
+<script src="https://cdn.datatables.net/buttons/2.4.2/js/buttons.html5.min.js"></script>
+
+    <!-- stack('scripts') => permite que otras vistas agreguen scripts extra -->
+  @stack('scripts')
+</body>
+</html>

resources/views/personas/edit.blade.php

@@ -1,42 +1,80 @@
-<!doctype html>
-<html lang="es">
-<head>
-  <meta charset="utf-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1">
-  <title>Editar persona</title>
-</head>
-<body>
+@extends('layouts.admin')
+@section('contenido')
 
-<h1>Editar persona</h1>
+<!-- row => fila del sistema de grillas de Bootstrap
+     justify-content-center => centra horizontalmente el contenido dentro de la fila
+     align-items-center => alinea verticalmente los elementos de la fila -->
+<div class="row justify-content-center align-items-center">
+  <!-- col-lg-11 col-md-11 col-sm-11 col-xs-11 =>
+       la columna ocupa 11/12 partes en todos los tamaños de pantalla -->
+  <div class="col-lg-11 col-md-11 col-sm-11 col-xs-11">
+    <h3>Editar Persona</h3>
+  </div>
+</div>
+<div class="row">
+  <div class="col-md-10">
 
-<form method="POST" action="{{ route('personas.update', $per->id_persona) }}">
+    <!-- Includes de Blade para mensajes de éxito y errores -->
+    @include('compartido.mensajes') 
+    @include('compartido.errores') 
+</div>
+</div>
+<br>
+
+<!-- Formulario de edición de categoría -->
+<form method="POST"
+      action="{{ route('personas.update', $per->id_persona) }}"
+      enctype="multipart/form-data">
   @csrf
-  @method('PUT')
+  @method('PUT') <!-- Indica a Laravel que el método real es PUT -->
 
-  <div>
-    <label for="apellido">Apellido *</label><br>
-    <input id="apellido" name="apellido" type="text"
-           value="{{ old('apellido', $per->apellido) }}" required>
+  <!-- row => agrupa los campos en una fila -->
+  <div class="row">
+    <!-- form-group => añade márgenes y separación entre los campos -->
+    <!-- col-md-3 => cada campo ocupa 3/12 columnas en pantallas medianas o más grandes -->
+    <div class="form-group col-md-3">
+      <!-- form-check-label => estilo Bootstrap para etiquetas de formulario -->
+      <label for="apellido" class="form-check-label">Apellido (*)</label>
+      <!-- form-control => da estilo uniforme al input -->
+      <input type="text" name="apellido" id="apellido" class="form-control"
+             value="{{ old('apellido', $per->apellido) }}" >
+    </div>
+
+    <div class="form-group col-md-3">
+      <label for="nombre" class="form-check-label">Nombre (*)</label>
+      <input type="text" name="nombre" id="nombre" class="form-control"
+             value="{{ old('nombre', $per->nombre) }}" >
+    </div>
+
+    <div class="form-group col-md-3">
+      <label for="dni" class="form-check-label">DNI (*)</label>
+      <input type="number" name="dni" id="dni" class="form-control"
+             value="{{ old('dni', $per->dni) }}" >
+    </div>
   </div>
 
-
-  <div>
-    <label for="nombre">Nombre *</label><br>
-    <input id="nombre" name="nombre" type="text"
-           value="{{ old('nombre', $per->nombre) }}" required>
-  </div>
-
-  <div style="margin-top:8px;">
-    <label for="dni">DNI</label><br>
-    <input id="dni" name="dni" type="text"
-           value="{{ old('dni', $per->dni) }}">
-  </div>
-
-  <div style="margin-top:12px;">
-    <button type="submit">Guardar</button>
-    <a href="{{ route('personas.index') }}">Volver al listado</a>
+  <!-- row justify-content-center align-items-center =>
+       fila que centra horizontal y verticalmente los botones -->
+  <div class="row justify-content-center align-items-center">
+    <div class="col-md-2">
+      <!-- btn => clase base de Bootstrap para botones
+           btn-success => verde (acción positiva)
+           btn-block => ocupa todo el ancho de la columna
+           btn-lg => tamaño grande -->
+      <button class="btn btn-success btn-block btn-lg">Guardar</button>
+    </div>
+    <div class="col-md-2">
+      <!-- btn-primary => azul (acción principal)
+           title="Salir" => tooltip al pasar el mouse -->
+      <a href="{{ route('personas.index') }}" class="btn btn-primary btn-block btn-lg" title="Salir">Salir</a>
+    </div>
   </div>
 </form>
 
-</body>
-</html>
+@endsection
+
+@push('scripts')
+<script>
+  //Aquí se pueden agregar scripts específicos de esta vista -->
+</script>
+@endpush

resources/views/personas/index.blade.php

@@ -1,51 +1,130 @@
-<!doctype html>
-<html lang="es">
-<head>
-  <title>Personas</title>
-</head>
-<body>
-<p>
-  <a href="{{ route('personas.create') }}">Nueva persona</a>
-</p>
-  <ul>
-    @foreach($personas as $per)
-      <li>
-        <strong>{{ $per->apellido }}</strong>   
-          — {{ $per->nombre }}
-          — {{ $per->dni }}
-        (ID: {{ $per->id_persona}})
-             &nbsp;|&nbsp;
-        
-           @if($per->trashed())
+@extends('layouts.admin')
+@section('contenido')
 
-           <form action="{{ route('personas.restaurar', $per->id_persona) }}"
-              method="POST" >
-          @csrf
-          @method('PUT')
-          <button onclick="return confirm('¿Restaurar esta persona?')">
-            Restaurar persona
-          </button>
-        </form>
+<!-- row => fila del sistema de grillas Bootstrap
+     justify-content-center => centra horizontalmente los contenidos
+     align-items-center => centra verticalmente 
+     no centran el texto, centran las columnas dentro de la fila
+     -->
 
-        @else
-          <a href="{{ route('personas.show', $per->id_persona) }}">Ver Más</a>
- &nbsp;|&nbsp;
-          <a href="{{ route('personas.edit', $per->id_persona) }}">Editar </a>
-        <form action="{{ route('personas.destroy', $per->id_persona) }}"
-              method="POST" >
-          @csrf
-          @method('DELETE')
-          <button onclick="return confirm('¿Eliminar esta persona?')">
-            Eliminar
-          </button>
-        </form>        
+<div class="row justify-content-center align-items-center">
+  <!-- col-12 => ocupa todo el ancho en pantallas pequeñas
+       col-md-11 => ocupa 11/12 del ancho en pantallas medianas o mayores -->
+  <div class="col-12 col-md-11">
+    <h3>Listado de Personas</h3>
+  </div>
+</div>
 
-          {{--<a href="{{ route('personas.edit', $per->id_personas) }}">Editar</a>
-         --}}
-         @endif
-      </li>
-    @endforeach
-  </ul>
+<div class="row justify-content-center align-items-center">
+  <div class="col-md-2">
+    <!-- btn => estilo de botón Bootstrap
+         btn-success => verde (acción positiva)
+         btn-block => ocupa todo el ancho de la columna
+         btn-lg => tamaño grande -->
+    <a href="{{ route('personas.create') }}" 
+       class="btn btn-success btn-block btn-lg" 
+       title="Nueva Persona">
+      Nuevo
+    </a>
+  </div>
+</div>
 
-</body>
-</html>
+<br> 
+
+<div class="row justify-content-center align-items-center">
+  <div class="col-12 col-md-11">
+
+    <!-- Includes de Blade para mensajes de éxito y errores -->
+    @include('compartido.mensajes') 
+    @include('compartido.errores') 
+
+    <!-- table-responsive => hace que la tabla sea "scrollable" en pantallas pequeñas -->
+    <div class="table-responsive">
+      
+      <!-- table => tabla con estilos básicos
+           table-striped => filas alternadas con fondo gris
+           table-bordered => agrega bordes a todas las celdas
+           table-hover => resalta la fila al pasar el mouse -->
+      <table class="table table-striped table-bordered table-hover" id="example">
+        <thead>
+          <tr>
+            <th>Id</th>
+            <th>Apellido</th>
+            <th>Nombre</th>
+            <th>DNI</th>
+            <th>Acciones</th>
+          </tr>
+        </thead>
+        <tbody>
+          @foreach($persona as $per)
+            <tr>
+              <td>{{ $per->id_persona }}</td>
+              <td>{{ $per->apellido }}</td>
+              <td>{{ $per->nombre }}</td>
+              <td>{{ $per->dni }}</td>
+              <td align="center">
+               
+             @if($per->deleted_at == null)
+              <form method="POST" action="{{ route('personas.destroy', $per->id_persona) }}" style="display:inline;">
+                  @csrf
+                  @method('DELETE')
+
+                  <!-- btn-info => azul claro (información) -->
+                  <a class="btn btn-info" 
+                     href="{{ route('personas.show', $per->id_persona) }}" 
+                     title="Ver más">
+                    <i class="fa fa-eye"></i>
+                  </a>
+
+                  <!-- btn-warning => amarillo (advertencia / editar) -->
+                  <a class="btn btn-warning" 
+                     href="{{ route('personas.edit', $per->id_persona) }}" 
+                     title="Editar">
+                    <i class="fa fa-pencil"></i>
+                  </a>
+
+                  <!-- btn-danger => rojo (acción destructiva como eliminar) -->
+                  <button class="btn btn-danger" 
+                          onclick="return confirm('¿Está seguro de eliminar?');" 
+                          title="Eliminar">
+                    <i class="fa fa-remove"></i>
+                  </button>
+                </form>
+              @else
+              <form method="POST" action="{{ route('personas.restaurar', $per->id_persona) }}" style="display:inline;">
+                  @csrf
+                  @method('PUT')
+
+                  <!-- btn-danger => rojo (acción destructiva como eliminar) -->
+                  <button class="btn btn-success" 
+                          onclick="return confirm('¿Está seguro de Restaurar a esta persona?');" 
+                          title="Restaurar">
+                    <i class="fa fa-undo"></i>
+                  </button>
+                </form>
+              
+              @endif
+              </td>
+            </tr>
+          @endforeach
+        </tbody>
+      </table>
+    </div>
+
+  </div>
+</div>
+
+@endsection
+@push('styles')
+
+@endpush
+@push('scripts')
+<script>
+  // DataTables (plugin JS para mejorar tablas: búsqueda, paginación, exportación)
+  $('#example').DataTable({
+    dom: 'Bfrtip',
+    buttons: ['excel'],
+    pageLength: 5,
+  });
+</script>
+@endpush

resources/views/personas/new.blade.php

@@ -1,37 +1,75 @@
-<!doctype html>
-<html lang="es">
-<head>
-  <meta charset="utf-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1">
-  <title>Nueva persona</title>
-</head>
-<body>
+@extends('layouts.admin')  
+@section ('contenido')
 
-<h1>Nueva persona</h1>
+<!-- row => fila del sistema de grillas de Bootstrap
+     justify-content-center => centra horizontalmente el contenido dentro de la fila
+     align-items-center => centra verticalmente los elementos dentro de la fila -->
+<div class="row justify-content-center align-items-center">
+    <!-- col-lg-11 col-md-11 col-sm-11 col-xs-11 => 
+         la columna ocupa 11/12 partes del ancho en todos los tamaños de pantalla -->
+    <div class="col-lg-11 col-md-11 col-sm-11 col-xs-11">
+        <h3>Nueva Persona</h3>
+    </div>
+</div>
+<div class="row">
+  <div class="col-md-10">
 
-<form method="POST" action="{{ route('personas.store') }}">
-  @csrf
+    <!-- Includes de Blade para mensajes de éxito y errores -->
+    @include('compartido.mensajes') 
+    @include('compartido.errores') 
+</div>
+</div>
+</br>
 
-  <div>
-    <label for="apellido">Apellido *</label><br>
-    <input id="apellido" name="apellido" type="text" value="{{ old('apellido') }}" required>
-  </div>
+<!-- Formulario para crear nueva categoría -->
+<form method="post" action="{{ route('personas.store') }}" enctype=multipart/form-data>
+    @csrf
+   
+    <!-- row => agrupa los campos en una fila -->
+    <div class="row">
+        <!-- form-group => separa cada campo del formulario con márgenes
+             col-md-3 => ocupa 3/12 columnas en pantallas medianas hacia arriba -->
+        <div class="form-group col-md-3">
+            <!-- form-check-label => clase de Bootstrap que estiliza etiquetas de formulario -->
+            <label for="apellido" class="form-check-label">Apellido (*)</label>
+            <!-- form-control => aplica estilos consistentes al input-->
+            <input type="text" name="apellido" id="apellido" value="{{old('apellido')}}" required class="form-control" >
+        </div>
 
-  <div>
-    <label for="nombre">Nombre *</label><br>
-    <input id="nombre" name="nombre" type="text" value="{{ old('nombre') }}" required>
-  </div>
+        <div class="form-group col-md-3">
+            <label for="nombre" class="form-check-label">Nombre (*)</label>
+            <input type="text" name="nombre" id="nombre" value="{{old('nombre')}}" class="form-control">
+        </div>
 
-  <div style="margin-top:8px;">
-    <label for="dni">DNI</label><br>
-    <input id="dni" name="dni" type="text" value="{{ old('dni') }}">
-  </div>
+        <div class="form-group col-md-3">
+            <label for="dni" class="form-check-label">DNI (*)</label>
+            <input type="number" name="dni" id="dni" value="{{old('dni')}}" class="form-control">
+        </div>
+    </div>
 
-  <div style="margin-top:12px;">
-    <button type="submit">Guardar</button>
-    <a href="{{ route('personas.index') }}">Volver al listado</a>
-  </div>
+
+    <!-- row justify-content-center align-items-center => 
+         crea una fila y centra horizontal y verticalmente los botones -->
+    <div class="row justify-content-center align-items-center">
+        <div class="col-md-2">
+            <!-- btn => botón base de Bootstrap
+                 btn-success => color verde
+                 btn-block => ocupa todo el ancho de la columna
+                 btn-lg => tamaño grande -->
+            <button class="btn btn-success btn-block btn-lg">Guardar</button>
+        </div>
+        <div class="col-md-2">
+            <!-- btn-primary => color azul
+                 title="Salir" => muestra tooltip al pasar el mouse -->
+            <a href="{{ route('personas.index') }}" class="btn btn-primary btn-block btn-lg" title="Salir">Salir</a>
+        </div>
+    </div>
 </form>
 
-</body>
-</html>
+@endsection
+
+@push('scripts')
+    <script>
+        //Aquí podrías agregar código JavaScript específico para esta vista
+    </script>
+@endpush

resources/views/personas/show.blade.php

@@ -1,37 +1,34 @@
-<!doctype html>
-<html lang="es">
-<head>
-  <meta charset="utf-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1">
-  <title>Ver persona</title>
-</head>
-<body>
+@extends('layouts.admin')  
+@section ('contenido')
+<div class="row justify-content-center align-items-center">
+	<div class="col-lg-11 col-md-11 col-sm-11 col-xs-11">
+		<h3>Ver Persona</h3>
+		<div class="progress" style="height: 2px;"></div>
+	</div>
+</div>
+</br>
+<div class="row">
+  <div class="form-group col-md-3">
+		<label for="apellido" class="form-check-label">Apellido (*)</label>
+		<input type="text" name="apellido" id="apellido" class="form-control"  value="{{$per->apellido}}" readonly>
+	</div>
 
-<h1>Ver persona</h1>
+	<div class="form-group col-md-3">
+		<label for="nombre" class="form-check-label">Nombre (*)</label>
+		<input type="text" name="nombre" id="nombre" class="form-control"  value="{{$per->nombre}}" readonly>
+	</div>
 
+	<div class="form-group col-md-3">
+		<label for="dni" class="form-check-label">DNI (*)</label>
+		<input type="text" name="dni" id="dni" class="form-control"  value="{{$per->dni}}" readonly>
+	</div>
+</div>
 
+<legend></legend>
+<div class="row justify-content-center align-items-center">
+	<div class="col-md-2">
+		<a href="{{ route('personas.index') }}" class="btn btn-primary btn-block btn-lg" title="Salir">Salir</a>
+	</div>
+</div>
 
-  <div>
-    <label for="apellido">Apellido *</label><br>
-    <input id="apellido" name="apellido" readonly type="text"
-           value="{{ $per->apellido }}" >
-  </div>
-
-   <div>
-    <label for="nombre">Nombre *</label><br>
-    <input id="nombre" name="nombre" readonly type="text"
-           value="{{ $per->nombre }}" >
-  </div>
-
-  <div style="margin-top:8px;">
-    <label for="dni">DNI</label><br>
-    <input id="dni" readonly name="dni" type="text"
-           value="{{ $per->dni }}">
-  </div>
-
-  <div style="margin-top:12px;">
-    <a href="{{ route('personas.index') }}">Volver al listado</a>
-  </div>
-
-</body>
-</html>
+@endsection