@extends('administrativo.index')
@section('titulo', 'Lista de Habitaciones')

@section('cuerpo')

@section('botones')
    <a class="btn btn-outline-dark" data-toggle="modal" data-target="#crear"><b>+ Crear Habitacion</b></a>
@endsection

@section('portada', 'Habitaciones')
{{-- ------------------------------------------------------------------------------------ --}}

<div class="row">


    <div class="col-sm-12">

        <div class="card border-secondary">

            <div class="card-body">

                <table class="datatable table table-hover">

                    <thead class="bg-dark text-white">
                        <tr>
                            <th>Nombre</th>
                            <th>Tarifa</th>
                            <th style="width: 20px;">Editar</th>
                            <th style="width: 20px;">Eliminar</th>
                        </tr>
                    </thead>

                    <tbody>

                        @foreach ($habitaciones as $item)
                            <tr>

                                <td>{{ $item->nombre }}</td>
                                <td>{{ $item->tarifa }}</td>

                                <td>
                                    <a class="btn btn-sm btn-warning" onclick="editarHabitaciones(@json($item->id_habitacion))">Editar</a>
                                </td>
                                <td>
                                    <form action="{{route('Habitaciones.destroy', $item)}}" method="POST">

                                        @csrf
                                        @method('delete')

                                        <button class="btn btn-sm btn-danger">Eliminar</button>
                                    </form>
                                </td>
                            </tr>
                        @endforeach

                    </tbody>

                </table>

            </div>

        </div>

    </div>

</div>

{{-- -----------------------------------------------------------MODALLL CREAR---------------------------------- --}}

<div class="modal fade" id="crear" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel"
    aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="exampleModalLabel">Nueva Habitacion</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <form action="{{ route('Habitaciones.store') }}" method="POST">

                    @csrf



                    {{-- Datos de Habitacion --}}


                    <div class="mb-3">

                        <label>Nombre</label>
                        <input type="text" class="form-control" name="nombre">

                        <label>Tarifa</label>
                        <input type="number" class="form-control" name="tarifa">
                    </div>
            </div>
            <div class="modal-footer">
                <button type="submit" class="btn btn-primary">Registrar</button>
            </div>
            </form>
        </div>
    </div>
</div>

{{-- -----------------------------------------------------------MODALLL Editar---------------------------------- --}}
<div class="modal fade" id="editar" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel"
    aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="exampleModalLabel">Nueva Habitacion</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <form action="{{ route('Habitaciones.update',0) }}" method="POST">

                    @csrf
                    @method('PUT')


                    {{-- Datos de Habitacion --}}


                    <div class="mb-3">

                        <label>Nombre</label>
                        <input type="text" class="form-control" name="nombreE">

                        <label>Tarifa</label>
                        <input type="number" class="form-control" name="tarifaE">
                        <input type="hidden" class="form-control" name="id_habitacion">
                    </div>
            </div>
            <div class="modal-footer">
                <button type="submit" class="btn btn-primary">Guardar</button>
            </div>
            </form>
        </div>
    </div>
</div>




<script>
    function editarHabitaciones(Habitaciones) {


        console.log('entre');
        id = Habitaciones;
        route = "{{ route('Habitaciones.show', '#') }}";
        route = route.replace("#", id);

        // parent = $(this).parent();
        $.ajax({
            url: route,
            type: 'GET',
            headers: {
                'X-CSRF-Token': $('meta[name="csrf-token"]').attr('content')
            },
            success: function(result) {

                console.log(result);
                $('#editar').modal('show');

                document.querySelector('input[name="nombreE"]').value = result.nombre;
                document.querySelector('input[name="tarifaE"]').value = result.tarifa;
                document.querySelector('input[name="id_habitacion"]').value = result.id_habitacion;

            }
        });

    }
</script>
@endsection