@extends('layouts.app')

@push('css')
<link href="{{ asset('js/select2/select2.min.css') }}" rel="stylesheet" />
<style>
    .input-material{
        width: 0.1px;
        height: 0.1px;
        opacity: 0;
        overflow: hidden;
        position: absolute;
        z-index: -1;
    }
</style>
@endpush

@section('content')
    <div class="container ml-0 mr-0 pl-0 pr-0 row">
        <div class="animate__animated animate__fadeInUp container tarjetas tarjeta-gris p-3 p-sm-2 p-md-3 p-lg-5 p-xl-5 col-12">
            <div class="row row-bottom">
               <div class="col-12 col-sm-12 col-md-6 col-lg-6 col-xl-6">
                   <h3 class="texto-obscuro">Edición de fechas de cursos</h3>
                   <nav class="breadcrumb"><a class="breadcrumb-item" href="{{ url('fechaCursos') }}">Fechas de cursos</a><span class="breadcrumb-item active">Edición de fecha de cursos</span></nav>
               </div>
           </div>
           <div class="row">
                {!! Form::model($fechaCurso, ['route' => ['fechaCursos.update', $fechaCurso->id], 'method' => 'patch','class' => 'formulario-principal col-12','files' => true]) !!}
                    <div class="empty-space-30"></div>
                    @include('fecha_cursos.fields_edit')
                    <div class="empty-space-30"></div>
                {!! Form::close() !!}
           </div>
           <div class="empty-space-50"></div>
           <div class="row botonera-inferior">
                <div class="col-12 p-0 m-0 text-right botonera-formulario">
                    <a href="{{ url('fechaCursos') }}" class="btn btn-secundario text-white width-250">Cancelar <span><-</span></a>
                    <button type="button" id="guardar-cambios" class="btn btn-principal width-250">Guardar cambios <span>-></span></button>
                </div>
            </div>
           <div class="empty-space-50"></div>
       </div>
    </div>
@endsection

@push('scripts')
    <script src="{{ asset('js/select2/select2.min.js') }}"></script>
    <script src="{{ asset('js/validaciones/validaciones.js') }}"></script>
    <script>
        $('#hora_inicio').datetimepicker({
            format: 'HH:mm a',
            useCurrent: true,
            icons: {
                up: "icon-arrow-up-circle icons font-2xl",
                down: "icon-arrow-down-circle icons font-2xl"
            },
            sideBySide: true,
            // defaultDate: '09:00',
            format: 'LT',
        })
        $('#hora_fin').datetimepicker({
            format: 'HH:mm a',
            useCurrent: true,
            icons: {
                up: "icon-arrow-up-circle icons font-2xl",
                down: "icon-arrow-down-circle icons font-2xl"
            },
            sideBySide: true,
            format: 'LT',
        })
        $('#fecha_inicio').datetimepicker({
            format: 'DD-MM-YYYY',
            useCurrent: true,
            icons: {
                up: "icon-arrow-up-circle icons font-2xl",
                down: "icon-arrow-down-circle icons font-2xl"
            },
            sideBySide: true
        })
        $('#fecha_fin').datetimepicker({
            format: 'DD-MM-YYYY',
            useCurrent: true,
            icons: {
                up: "icon-arrow-up-circle icons font-2xl",
                down: "icon-arrow-down-circle icons font-2xl"
            },
            sideBySide: true
        })
        $('.js-example-basic-single').select2({});

        $("#guardar-cambios").click(function(){
            aplicar_validaciones();
        });

        
        $("#hora_inicio").focusout(function(){
            if (validar_texto('#hora_inicio', '#hora_inicio_mensaje',3,50)) {
                $(this).removeClass('is-invalid');
            }else{
                $(this).addClass('is-invalid');
            }
        });

        $("#hora_fin").focusout(function(){
            if (validar_texto('#hora_fin', '#hora_fin_mensaje',3,50)) {
                $(this).removeClass('is-invalid');
            }else{
                $(this).addClass('is-invalid');
            }
        });

        $("#fecha_inicio").focusout(function(){
            if (validar_texto('#fecha_inicio', '#fecha_inicio_mensaje',3,50)) {
                $(this).removeClass('is-invalid');
            }else{
                $(this).addClass('is-invalid');
            }
        });

        $("#fecha_fin").focusout(function(){
            if (validar_texto('#fecha_fin', '#fecha_fin_mensaje',3,50)) {
                $(this).removeClass('is-invalid');
            }else{
                $(this).addClass('is-invalid');
            }
        });

        $("#direccion").focusout(function(){
            if (validar_texto('#direccion', '#direccion_mensaje',3,250)) {
                $(this).removeClass('is-invalid');
            }else{
                $(this).addClass('is-invalid');
            }
        });

        $('#curso').on('select2:select', function (e) {
            var data = e.params.data;
            if(data.id != 0)
            {
                $("#curso_mensaje").slideUp();
                $("#curso_mensaje").text('');
                $("#curso").removeClass('is-invalid');
            }
        });

        $('#docente_id').on('select2:select', function (e) {
            var data = e.params.data;
            if(data.id != 0)
            {
                $("#docente_id_mensaje").slideUp();
                $("#docente_id_mensaje").text('');
                $("#docente_id").removeClass('is-invalid');
            }
        });

        $('#lugar').on('select2:select', function (e) {
            var data = e.params.data;
            if(data.id != 0)
            {
                $("#lugar_mensaje").slideUp();
                $("#lugar_mensaje").text('');
                $("#lugar").removeClass('is-invalid');
            }
        });

        function aplicar_validaciones()
        {
            var validacion = true;

            if($('#curso').select2('data')[0].id == 0)
            {
                $("#curso_mensaje").text('Debes de seleccionar una opción valida.');
                $("#curso_mensaje").slideDown();
                validacion = false;
                $("#curso").addClass('is-invalid');
            }else{
                $("#curso_mensaje").slideUp();
                $("#curso_mensaje").text('');
                $("#curso").removeClass('is-invalid');
            }

            if (validar_texto('#hora_inicio', '#hora_inicio_mensaje',3,50)) {
                $("#hora_inicio").removeClass('is-invalid');
            }else{
                $("#hora_inicio").addClass('is-invalid');
                validacion = false;
            }

            if (validar_texto('#hora_fin', '#hora_fin_mensaje',3,50)) {
                $("#hora_fin").removeClass('is-invalid');
            }else{
                $("#hora_fin").addClass('is-invalid');
                validacion = false;
            }

            if (validar_texto('#fecha_inicio', '#fecha_inicio_mensaje',3,50)) {
                $("#fecha_inicio").removeClass('is-invalid');
            }else{
                $("#fecha_inicio").addClass('is-invalid');
                validacion = false;
            }

            if (validar_texto('#fecha_fin', '#fecha_fin_mensaje',3,50)) {
                $("#fecha_fin").removeClass('is-invalid');
            }else{
                $("#fecha_fin").addClass('is-invalid');
                validacion = false;
            }

            if($('#docente_id').select2('data')[0].id == 0)
            {
                $("#docente_id_mensaje").text('Debes de seleccionar una opción valida.');
                $("#docente_id_mensaje").slideDown();
                validacion = false;
                $("#docente_id").addClass('is-invalid');
            }else{
                $("#docente_id_mensaje").slideUp();
                $("#docente_id_mensaje").text('');
                $("#docente_id").removeClass('is-invalid');
            }

            if($('#lugar').select2('data')[0].id == 0)
            {
                $("#lugar_mensaje").text('Debes de seleccionar una opción valida.');
                $("#lugar_mensaje").slideDown();
                validacion = false;
                $("#lugar").addClass('is-invalid');
            }else{
                $("#lugar_mensaje").slideUp();
                $("#lugar_mensaje").text('');
                $("#lugar").removeClass('is-invalid');
            }

            if (validar_texto('#direccion', '#direccion_mensaje',3,250)) {
                $("#direccion").removeClass('is-invalid');
            }else{
                $("#direccion").addClass('is-invalid');
                validacion = false;
            }

            if (validacion) {
                $(".formulario-principal").submit();
            }
        }
    </script>
@endpush
{{-- @extends('layouts.app')

@section('content')
    <ol class="breadcrumb">
          <li class="breadcrumb-item">
             <a href="{!! route('fechaCursos.index') !!}">Fecha Curso</a>
          </li>
          <li class="breadcrumb-item active">Edit</li>
        </ol>
    <div class="container-fluid">
         <div class="animated fadeIn">
             @include('coreui-templates::common.errors')
             <div class="row">
                 <div class="col-lg-12">
                      <div class="card">
                          <div class="card-header">
                              <i class="fa fa-edit fa-lg"></i>
                              <strong>Edit Fecha Curso</strong>
                          </div>
                          <div class="card-body">
                              {!! Form::model($fechaCurso, ['route' => ['fechaCursos.update', $fechaCurso->id], 'method' => 'patch']) !!}

                              @include('fecha_cursos.fields')

                              {!! Form::close() !!}
                            </div>
                        </div>
                    </div>
                </div>
         </div>
    </div>
@endsection --}}