@extends('layouts.user_type.auth')

@section('content')


<div class="container-fluid py-4">
    <div class="row">
        <div class="col-lg-9 col-12 mx-auto">

            <div class="card card-body mt-4">
                <form role="form text-left" method="POST" action="{{route('eventos-update')}}" file="true"
                    enctype="multipart/form-data" autocomplete="off">
                    {{ csrf_field() }}
                    <h6 class="mb-0">Editar evento</h6>
                    <p class="text-sm mb-0">Editar evento</p>
                    <hr class="horizontal dark my-3">
                    <label for="projectName" class="form-label">Nombre del evento</label>
                    <input type="text" class="form-control" value="{{$evento->nombre}}" name="nombre"
                        id="nombre-evento">
                    @error('nombre')
                    <span class="text-danger">
                        {{ $message }}
                    </span><br>
                    @enderror
                    <input type="text" class="form-control" hidden value="{{$evento->id}}" name="id" id="id">

                    <label class="mt-4">Descripción del evento</label>
                    <p class="form-text text-muted text-xs ms-1">
                        Esta es la descripción del evento
                    </p>

                        <textarea class="form-control" 
                            name="descripcion" placeholder="Descripción">{{$evento->descripcion}}</textarea>
                     
                
                    @error('descripcion')
                        <span class="text-danger">
                            {{ $message }}
                        </span><br>
                        @enderror






                    <div class="row">
                        <div class="col-sm-6 mt-sm-0 mt-4">
                            <label class="mt-4">Categorias</label>
                            <select class="form-control" name="categorias" id="select-categorias">

                                @foreach($categorias as $categoria)
                                @if($categoria->id == $evento->categoria_id)
                                <option value="{{$categoria->id}}" selected>{{$categoria->nombre}}</option>
                                @else
                                <option value="{{$categoria->id}}">{{$categoria->nombre}}</option>
                                @endif
                                @endforeach
                            </select>
                            @error('categorias')
                            <span class="text-danger">
                                {{ $message }}
                            </span><br>
                            @enderror
                        </div>
                        <div class="col-sm-6 mt-sm-0 mt-4">
                            <label class="mt-4">Tipo de pagos</label>
                            <select class="form-control" name="tipo_pago" id="select-tipo-pagos">

                                @foreach($tipo_pagos as $pago)
                                @if($pago->id == $evento->tipo_pago_id)
                                <option value="{{$pago->id}}" selected>{{$pago->nombre}}</option>
                                @else
                                <option value="{{$pago->id}}">{{$pago->nombre}}</option>
                                @endif
                                @endforeach
                            </select>
                            @error('tipo_pago')
                            <span class="text-danger">
                                {{ $message }}
                            </span><br>
                            @enderror
                        </div>


                    </div>

                    <div class="row">
                        <div class="col-6">
                            <label class="form-label">Fecha de inicio</label>
                            <input class="form-control datetimepicker" type="text"
                                placeholder="Seleccione la fecha de inicio" value="{{$evento->fecha_inicio}}"
                                name="fecha_inicio" data-input>
                            @error('fecha_inicio')
                            <span class="text-danger">
                                {{ $message }}
                            </span><br>
                            @enderror
                        </div>
                        <div class="col-6">
                            <label class="form-label">Fecha fin</label>
                            <input class="form-control datetimepicker" type="text"
                                placeholder="Seleccione la fecha de finalización" value="{{$evento->fecha_fin}}"
                                name="fecha_fin" data-input>
                            @error('fecha_fin')
                            <span class="text-danger">
                                {{ $message }}
                            </span><br>
                            @enderror
                        </div>
                    </div>

                    <label for="projectName" class="form-label">Lugar evento</label>
                    <input type="text" class="form-control" name="lugar" value="{{$evento->lugar}}">
                    @error('lugar')
                    <span class="text-danger">
                        {{ $message }}
                    </span><br>
                    @enderror

                    <label for="projectName" class="form-label">Slug evento</label>
                    <input type="text" class="form-control" name="slug" value="{{$evento->slug}}">
                    @error('slug')
                    <span class="text-danger">
                        {{ $message }}
                    </span><br>
                    @enderror

                    <label for="projectName" class="form-label">Ocupación Máxima</label>

                    <input class="form-control" type="number" name="cupo_maximo" value="{{$evento->cupo_maximo}}" />
                    @error('cupo_maximo')
                    <span class="text-danger">
                        {{ $message }}
                    </span><br>
                    @enderror


                    <br>
                    <h5 class="font-weight-bolder">Redes Sociales</h5>
                    <div class="multisteps-form__content">
                        <div class="row mt-3">

                            <div class="col-12 mt-3">
                                <label>Facebook</label>
                                <input class="multisteps-form__input form-control" value="{{$evento->facebook}}"
                                    name="facebook" type="text" placeholder="https://..." />
                                @error('facebook')
                                <span class="text-danger">
                                    {{ $message }}
                                </span>
                                @enderror
                            </div>
                            <div class="col-12 mt-3">
                                <label>Instagram</label>
                                <input class="multisteps-form__input form-control" value="{{$evento->instagram}}"
                                    name="instagram" type="text" placeholder="https://..." />
                                @error('instagram')
                                <span class="text-danger">
                                    {{ $message }}
                                </span><br>
                                @enderror
                            </div>
                            <div class="col-12">
                                <label>Youtube</label>
                                <input class="multisteps-form__input form-control" value="{{$evento->youtube}}"
                                    name="youtube" type="text" placeholder="@soft" />
                                @error('youtube')
                                <span class="text-danger">
                                    {{ $message }}
                                </span><br>
                                @enderror
                            </div>
                        </div>
                    </div>

                    <br>
                    <h5 class="font-weight-bolder">Datos de contacto</h5>
                    <div class="multisteps-form__content">
                        <div class="row mt-3">
                            <div class="col-12 mt-3">
                                <label>Pagina de contacto</label>
                                <input class="multisteps-form__input form-control" value="{{$evento->contacto_pagina}}"
                                    name="contacto_pagina" type="text" placeholder="https://..." />
                                @error('contacto_pagina')
                                <span class="text-danger">
                                    {{ $message }}
                                </span><br>
                                @enderror
                            </div>

                            <div class="col-12 mt-3">
                                <label for="projectName" class="form-label">Contacto correo electronico</label>
                                <input type="email" class="form-control" name="contacto_correo"
                                    value="{{$evento->contacto_correo}}">
                                @error('contacto_correo')
                                <span class="text-danger">
                                    {{ $message }}
                                </span><br>
                                @enderror
                            </div>
                            <div class="col-12 mt-3">
                                <label for="projectName" class="form-label">Contacto telefono</label>
                                <input type="text" class="form-control" value="{{$evento->contacto_telefono}}"
                                    name="contacto_telefono">
                                @error('contacto_telefono')
                                <span class="text-danger">
                                    {{ $message }}
                                </span><br>
                                @enderror
                            </div>
                        </div>
                    </div>

                    <label class="mt-4 form-label">Portada del evento</label>
                    <p class="form-text text-muted text-xs ms-1">
                        La portada
                    </p>
                    <input name="file"  class="form-control"  value="{{$evento->file}}" type="file" />
                      



                    <div class="d-flex justify-content-end mt-4">
                        <button type="button" name="button" class="btn btn-light m-0">Cancel</button>
                        <button type="submit" name="button" class="btn bg-gradient-primary m-0 ms-2">Crear
                            Evento</button>
                    </div>

                </form>
            </div>
        </div>
    </div>

</div>
@push('dashboard')
<script src="{{asset('assets/js/plugins/choices.min.js')}}"></script>
<script src="{{asset('assets/js/plugins/quill.min.js')}}"></script>
<script src="{{asset('assets/js/plugins/flatpickr.min.js')}}"></script>
<script src="{{asset('assets/js/plugins/dropzone.min.js')}}"></script>
<script>
    if (document.getElementById('editor')) {
      var quill = new Quill('#editor', {
        theme: 'snow' // Specify theme in configuration
      });
    }



    if (document.querySelector('.datetimepicker')) {
      flatpickr('.datetimepicker', {
        allowInput: true
      }); // flatpickr
    }

    /*
    Dropzone.autoDiscover = false;
    var drop = document.getElementById('dropzone')
    var myDropzone = new Dropzone(drop, {
      url: "/file/post",
      addRemoveLinks: true,

    });
*/
    if (document.getElementById('select-categorias')) {
      var element = document.getElementById('select-categorias');
      const example = new Choices(element, {
        searchEnabled: true
      });
    };

    if (document.getElementById('select-tipo-pagos')) {
      var element = document.getElementById('select-tipo-pagos');
      const example = new Choices(element, {
        searchEnabled: true
      });
    };
</script>
<!-- Kanban scripts -->
>
<script>
    var win = navigator.platform.indexOf('Win') > -1;
    if (win && document.querySelector('#sidenav-scrollbar')) {
      var options = {
        damping: '0.5'
      }
      Scrollbar.init(document.querySelector('#sidenav-scrollbar'), options);
    }
</script>
@endpush


@endsection