@extends('adminlte::page')

@section('title', 'Listado de platos - Insertbog')

@section('content_header')

<div class="row">
    <div class="col-md-6">
        <h1>Listado de Platos</h1>
    </div>
    <div class="col-md-6 d-grid gap-2 d-md-flex justify-content-md-end">
        <a href="menus/create" class="btn btn-success ">Nuevo Plato</a>
    </div>
</div>
@stop

@section('content')
@foreach ($menus as $menu)
<div class="row">
    <div class="col-md-12">
        <div class="card">
            <div class="row">
                <div class="col-md-4">
                    <img src="" class="card-img-top" alt="">
                </div>
                <div class="col-md-8">
                    <div class="card-body">
                        <div class="row">
                            <div class="col-md-4">
                                <h5 class="card-title"><b>{{ $menu->nombre }}</b></h5>
                            </div>
                            <div class="col-md-4">
                                <p class="card-text"> {{$menu->estado}}</p>
                            </div>
                            <div class="col-md-4 fs-3 d-grid gap-2 d-md-flex justify-content-md-end">
                                <b>
                                    <p class="card-text">$ {{$menu->precio}}</p>
                                </b>
                            </div>
                        </div>
                        <p class="card-text">{{$menu->descripcion}}</p>
                        <div class="row">
                            <div class="col-md-4">
                                <p class="card-text">{{$menu->categoria}}</p>
                            </div>
                            <div class="col-md-4"></div>
                            <div class="col-md-4 d-grid gap-2 d-md-flex justify-content-md-end">
                                <form action="{{route ('menus.destroy', $menu->id)}}" class="delete-alert" method="POST">
                                    <a href="{{ route('menus.show', $menu->id ) }}" class="btn btn-primary">Ver</a>
                                    <a href="{{ route('menus.edit', $menu->id ) }}" class="btn btn-success"><i class="far fa-edit"></i></a>
                                    @csrf
                                    @method('DELETE')
                                    <button type="submit" class="btn btn-danger"><i class="far fa-trash-alt"></i></button>
                                </form>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
@endforeach
@stop

@section('css')
<link rel="stylesheet" href="/css/admin_custom.css">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-rbsA2VBKQhggwzxH7pPCaAqO46MgnOM80zW1RWuH61DGLwZJEdK2Kadq2F9CUG65" crossorigin="anonymous">
@stop

@section('js')
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-kenU1KFdBIe4zVF0s0G1M5b4hcpxyD9F7jL+jjXkk+Q2h455rYXK/7HAuoJl+0I4" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.6/dist/umd/popper.min.js" integrity="sha384-oBqDVmMz9ATKxIep9tiCxS/Z9fNfEXiDAYTujMAeBAsjFuCZSmKbSSUnQlmh/jp3" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/js/bootstrap.min.js" integrity="sha384-cuYeSxntonz0PPNlHhBs68uyIAVpIIOZZ5JqeqvYYIcEL727kskC66kF92t6Xl2V" crossorigin="anonymous"></script>
<script src="//cdn.jsdelivr.net/npm/sweetalert2@11"></script>
@if(session('delete') == 'ok')
<script>
    Swal.fire(
        '¡Eliminado!',
        'El registro se elimino con éxito.',
        'success'
    )
</script>
@endif
<script>
    $('.delete-alert').submit(function(e) {
        e.preventDefault();
        Swal.fire({
            title: '¿Estas seguro/a?',
            text: "Este registro se eliminara definitivamente!",
            icon: 'warning',
            showCancelButton: true,
            confirmButtonColor: '#3085d6',
            cancelButtonColor: '#d33',
            confirmButtonText: '¡Si, liminar!',
            cancelButtonText: 'Cancelar',
        }).then((result) => {
            if (result.isConfirmed) {

                this.submit();
            }
        })
    });
</script>

@stop