@extends('masushuaia.plantilla')
@section('titulo', $titulo)

@section('scripts')
    <script>
        @if (isset($banner->idBanner) && $banner->idBanner > 0)
            var globalId = {{ $banner->idBanner }};
        @else
            var globalId = 0;
        @endif
        @php
        $globalId = isset($banner->idBanner) && $banner->idBanner > 0 ? $banner->idBanner : 0;
        @endphp
    </script>
@endsection

@section('breadcrumb1')
    <a title="Salir" href="#" class="btn-blue py-1 px-2 mr-2" aria-hidden="true"
        onclick="javascript: $('#modalSalir').modal('toggle');"><span><i class="fas fa-arrow-left"></i></span></a>
@endsection

@section('breadcrumb')
    @if ($globalId > 0)
        <div id="btnEliminar" class="d-inline-block">
            <a title="Eliminar" href="#" class="btn-blue py-1 px-4 mr-2" aria-hidden="true"
                onclick="javascript: $('#mdlEliminar').modal('toggle');"><span>Eliminar</span></a>
        </div>
    @endif

    <div id="btnGuardar" class="d-inline-block">
        <a title="Guardar" href="#" class="btn-blue py-1 px-4" aria-hidden="true"
            onclick="javascript: $('#modalGuardar').modal('toggle');"><span>Guardar</span></a>
    </div>

    <script>
        function fsalir() {
            location.href = "/banner";
        }
    </script>
@endsection

@section('breadcrumb-list')
    <ol class="breadcrumb">
        <li class="breadcrumb-item"><a href="/">Inicio</a></li><span class="px-2">/</span>
        <li class="breadcrumb-item"><a href="/banner">Banners</a></li>
        <li class="breadcrumb-item active">Nuevo</li>
    </ol>
@endsection

@section('contenido')
    <div class="row">
        <div class="col-12">
            <div id="msg"></div>
            @if (isset($msg))
                <script>
                    msgShow("{{ $msg['MSG'] }}", "{{ $msg['ESTADO'] }}");
                </script>
            @endif
        </div>
    </div>

    <form id="form1" method="POST" enctype="multipart/form-data">
        <div class="row">
            <input type="hidden" name="_token" value="{{ csrf_token() }}"></input>
            <input type="hidden" id="id" name="id" class="form-control" value="{{ $globalId }}" required>
            <div class="form-group col-sm-6">
                <label for="txtNombre">Nombre</label>
                <input type="text" class="form-control" id="txtNombre" name="txtNombre" value="">
            </div>
            @if (isset($aTipos))
                <div class="form-group col-sm-6">
                    <label>Tipo de banner</label>
                    <select class="form-control" name="lstTipoBanner" id="lstTipoBanner"
                        onchange="setCampos($('#lstTipoBanner option:selected').val());" required>
                        @if ($globalId > 0)
                            <option disabled value="">Seleccionar</option>
                            @foreach ($aTipos as $item)
                                @if ($item->idtipobanner == $banner->fkIdTipoBanner)
                                    <option selected value="{{ $item->idtipobanner }}">{{ $item->nombre }}</option>
                                @else
                                    <option value="{{ $item->idtipobanner }}">{{ $item->nombre }}</option>
                                @endif
                            @endforeach
                        @else
                            <option selected disabled value="">Seleccionar</option>
                            @foreach ($aTipos as $item)
                                <option value="{{ $item->idtipobanner }}">{{ $item->nombre }}</option>
                            @endforeach
                        @endif
                    </select>
                </div>
            @endif
            @if (isset($aDescuento))
                <div class="form-group col-sm-6" id="col-descuentos">
                    <label>Descuento que aplica</label>
                    <select class="form-control" name="lstDescuentos" id="lstDescuentos">
                        @if ($globalId > 0)
                            <option disabled value="">Seleccionar</option>
                            @foreach ($aDescuento as $item)
                                @if ($item->idcupon == $banner->fkIdCupon)
                                    <option selected value="{{ $item->idcupon }}">
                                        {{ substr($item->nombre, 0, 25) . '... [' . $item->comercio . ' - ' . $item->domicilio . ']' }}
                                    </option>
                                @else
                                    <option value="{{ $item->idcupon }}">
                                        {{ substr($item->nombre, 0, 25) . '... [' . $item->comercio . ' - ' . $item->domicilio . ']' }}
                                    </option>
                                @endif
                            @endforeach
                        @else
                            <option selected disabled value="">Seleccionar</option>
                            @foreach ($aDescuento as $item)
                                <option value="{{ $item->idcupon }}">
                                    {{ substr($item->nombre, 0, 35) . '... [' . $item->comercio . ' - ' . $item->domicilio . ']' }}
                                </option>
                            @endforeach
                        @endif
                    </select>
                </div>
            @endif
            <div class="form-group col-sm-6" id="col-url">
                <label for="txtUrl">Url</label>
                <input type="url" name="txtUrl" id="txtUrl" class="form-control" value="">
            </div>
            <div class="form-group col-sm-6">
                <label for="txtImagen">Imagen</label>
                <input type="file" name="txtImagen" class="form-control" accept="image/*">
            </div>
        </div>
        @if (isset($banner->imagen) && $banner->imagen != 'no-image.png')
            <div class="row">
                <div class="col-3">
                    <img src="{{ env('APP_URL') . '/storage/files/imagenes_banner/' . $banner->imagen }}" alt="..."
                        class="img-thumbnail">
                </div>
            </div>
        @endif
    </form>

    <div class="modal fade" id="mdlEliminar" 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">¿Eliminar registro?</h5>
                    <button class="close" type="button" data-dismiss="modal" aria-label="Close">
                        <i class="fa fa-times" aria-hidden="true"></i>
                    </button>
                </div>
                <div class="modal-body">
                    <h2>Confirmación</h2>
                    <p>Esta acción eliminará todos los datos asociados al banner.</p>
                    <p class="font-weight-bold">Esta acción no se puede deshacer, ¿desea continuar?</p>
                </div>
                <div class="modal-footer">
                    <button class="btn btn-secondary" type="button" data-dismiss="modal">No</button>
                    <button type="button" class="btn btn-primary" onclick="eliminar();">Sí</button>
                </div>
            </div>
        </div>
    </div>

    <script>
        window.onload = function() {
            $("#form1").validate();
            @if ($globalId > 0)
                setCampos('{{ $banner->fkIdTipoBanner }}');
            @else
                setCampos('');
            @endif
        }

        function setCampos(id) {
            switch (id) {
                case '1':
                    $('#col-descuentos').show();
                    $('#col-url').hide();
                    break;
                case '2':
                    $('#col-descuentos').hide();
                    $('#col-url').show();
                    break;
                case '3':
                    $('#col-descuentos').hide();
                    $('#col-url').hide();
                    break;
                default:
                    $('#col-descuentos').hide();
                    $('#col-url').hide();
                    break;
            }
        }

        function guardar() {
            if ($("#form1").valid()) {
                modificado = false;
                form1.submit();
            } else {
                $("#modalGuardar").modal('toggle');
                msgShow("Corrija los errores e intente nuevamente.", "danger");
                return false;
            }
        }

        function eliminar() {
            $.ajax({
                type: "GET",
                url: "{{ asset('/banner/eliminar') }}",
                data: {
                    id: globalId
                },
                async: true,
                dataType: "json",
                success: function(data) {
                    if (data.err == "0") {
                        msgShow("Registro eliminado exitosamente.", "success");
                        $("#btnGuardar").removeClass('d-inline-block');
                        $("#btnEliminar").removeClass('d-inline-block');
                        $("#btnGuardar").hide();
                        $("#btnEliminar").hide();
                        $('#form1').hide();
                        $('#mdlEliminar').modal('toggle');
                    } else {
                        msgShow(data.MSG, data.ESTADO);
                        $('#mdlEliminar').modal('toggle');
                    }
                }
            });
        }
    </script>
@endsection