@extends('academia.layouts.dashboard')

@section('content')


<div class="container-fluid principal">
    <div class="row">
        <div class="col-12">
            <div class="card">
                <div class="card-body">
                    
                    <form method="post" action="{{route('academia-banner-save')}}"
                    enctype="multipart/form-data" class="dropzone" id="dropzone">
                        {{ csrf_field() }}
                        
                        <div class="dz-message" data-dz-message>
                            <img src="{{asset('fondo/upload.jpg')}}" class="img-fluid" alt="subir archivo" style="width: 150px; height: 130px;">
                            <h5>Arrastre o Pulse aqui las imagenes</h5>
                            <h6>Dimension de 1080 x 400 pixeles, formato PNG,JPG,JPEG.</h6>
                        </div>
                        
                    </form>
                    
                </div>
            </div>
        </div>
    </div>
</div> 


<div class="container-fluid principal">
    <div class="row">
        <div class="col-12">
            <div class="card">
                <div class="card-body">
                    
                    <h3 class="text-black text-center">Banner</h3>
                    
                    @if($banner->count() > 0)
                    
                        <div class="row">
                          @foreach($banner as $baner)
                          <div class="col-md-3">
                             <div class="card">
                                 
                                <img class="img-fluid" src="{{ asset('anuncios/banner/'.$baner->imagen) }}">
                                
                                    <div class="card-body text-center">
                                        
                                        <a class="btn btn-danger text-white" href="{{route('academia-banner-eliminar', $baner->id)}}">
                                            <i class="fa fa-trash"></i>
                                        </a>
                                            
                                    </div>
                             </div>
                          </div>     
                          @endforeach
                        </div>
                        
                    @endif
                    
                </div>
            </div>
        </div>
    </div>
</div> 


@endsection

@push('script')
<script type="text/javascript">
    
    Dropzone.options.dropzone = {
       
        //dictDefaultMessage: 'Arrastre o Pulse aqui las imagenes',
        dictFallbackMessage: 'Lo sentimos su navegador no es compatible',
        dictCancelUploadConfirmation: 'Esta seguro que desea cancelar la subida del archivo ?',
        dictCancelUpload: 'Cancelar',
        dictRemoveFile: 'Eliminar',
        paramName: 'archivo',
        
        addRemoveLinks: true,
        acceptedFiles: ".jpeg,.jpg,.png",
        timeout: 5000,
        
        
        error: function(file, response){
            return false;
        }
            
    }

</script>
@endpush