@extends('template.layout')


@section('styles')
    <link href="{{ asset('css/icheck/skins/all.css')}}" rel="stylesheet" type="text/css"/>
    <link href="{{ asset('plugins/bootstrap-datetimepicker/css/bootstrap-datetimepicker.min.css') }}" rel="stylesheet" type="text/css"/>
@endsection

@section('content')
    <h1 class="page-title">
        Cita
    </h1>

    <div class="portlet light bordered">
        <div class="portlet-title col-12">
            <div class="caption col-md-9">
                <h1 class="caption-subject font-green sbold uppercase"> Crear cita
                </h1>
            </div>
        </div>
        <div class="portlet-body form">
            <form action="{{ route('gestion.cita.crear.post') }}" id="form" method="POST">
                <input type="hidden" name="id_alm" value="{{ $id }}"/>
                {{ csrf_field() }}
                <div class="form-body">
                    <div class="row" style="padding-bottom: 2%">
                        <div class="col-md-12">
                            <div class="form-group {{ $errors->has('titulo') ? 'has-error' : '' }}">
                                <label class="control-label col-md-3">Título</label>
                                <div class="col-md-9">
                                    <input type="text" name="titulo" class="form-control" required />
                                    @if ($errors->has('titulo'))
                                        <div class="help-block">{{ $errors->first('titulo') }}</div>
                                    @endif
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-12">
                            <div class="form-group {{ $errors->has('detalle') ? 'has-error' : '' }}">
                                <label class="control-label col-md-3">Detalle</label>
                                <div class="col-md-9">
                                    <textarea rows="4" name="detalle" class="form-control" required></textarea>
                                    @if ($errors->has('detalle'))
                                        <div class="help-block">{{ $errors->first('detalle') }}</div>
                                    @endif
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-12" style="padding-top: 2%;">
                            <div class="form-group {{ $errors->has('fecha') ? 'has-error' : '' }}">
                                <label class="control-label col-md-3" for="cita_fecha">Fecha</label>
                                <div class="col-md-9">
                                    <div class="form-group">
                                        <div class='input-group date' id="cita_fecha" >
                                            {!! Form::text('fecha', null, array('class' => 'form-control' , 'required' => 'required')) !!}
                                            <span class="input-group-addon">
                                                <span class="glyphicon glyphicon-calendar"></span>
                                            </span>
                                            @if ($errors->has('fecha'))
                                                <div class="help-block">{{ $errors->first('fecha') }}</div>
                                            @endif
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-12" style="padding-top: 2%;">
                            <div class="form-group {{ $errors->has('psicologo') ? 'has-error' : '' }}">
                                <label class="control-label col-md-3" for="psicologo">Psicólogo</label>
                                <div class="col-md-9">
                                    <div class="form-group">
                                        <div class='input-group' id="psicologo" style="width: 100%;">
                                            <select class="form-control input-md" id="lstPsicologo" name="psicologo" style="width: 100%;"></select>
                                            @if ($errors->has('psicologo'))
                                                <div class="help-block">{{ $errors->first('psicologo') }}</div>
                                            @endif
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-12" style="text-align: center; padding-top: 2%;">
                            <button id="submit" type="submit" class="btn btn-primary ladda-button" data-style="slide-down">
                                <span class="ladda-label">
                                    <i class="fa fa-save"></i>
                                <span class="hidden-xs"> Guardar </span>
                                </span>
                                <span class="ladda-spinner"></span>
                            </button>
                        </div>
                    </div>
                </div>
            </form>
        </div>

    </div>



@endsection

@section('scripts')
    <script src="{{asset('plugins/bootstrap-datetimepicker/js/bootstrap-datetimepicker.js')}}" type="text/javascript"></script>
    <script>

        $.ajaxSetup({
            headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            }
        });

        $("#form").validate({
            submitHandler: function (form) {
                var l = Ladda.create(document.querySelector('#submit'));
                l.start();
                form.submit();
            }
        });

        $('#cita_fecha').datetimepicker({
            language: 'es',
            format : 'dd/mm/yyyy hh:ii',
            autoclose: true,
            startDate: '{{ \Carbon\Carbon::now() }}'
        });

        $("#lstPsicologo").select2({
            minimumInputLength: -1,
            minimumResultsForSearch: -1,
            tags: [],
            ajax: {
                url: "{{ route('gestion.cita.psicologo.get') }}",
                dataType: 'json',
                type: "GET",
                quietMillis: 50,
                processResults: function (data) {
                    return {
                        results: $.map(data, function (item) {
                            return {
                                text: item.nombre,
                                id: item.id
                            }
                        })
                    };
                }
            }
        });

    </script>

    <!-- App scripts -->
@endsection