<!--<link rel="stylesheet" href="--><?php //echo base_url(); ?><!--assets/sistema/css/calendario/ekattor.css"/>-->
<!--<script src="--><?php //echo base_url();?><!--assets/sistema/js/calendario/ekattor.js" type="text/javascript"></script>-->
<!--<script src="--><?php //echo base_url();?><!--assets/sistema/js/calendario/pt-br.js" type="text/javascript"></script>-->
<style type="text/css">
    .compromisso {
        display: inline-block;
        width: 10px;
        height: 10px;
        border-radius: 8px;
        margin-right: 5px;
    }

</style>

<?php
$compromissos = $this->data['compromissos'];
?>
<div class="col-lg-12 hidden-sm-down">
    <div class="portlet ui-sortable">
        <div class="portlet-heading bg-info">
            <h3 class="portlet-title">
                <span class="icon"><i class="fa fa-signal"></i></span> Planejamento
            </h3>
            <div class="portlet-widgets">
                <a href="javascript:;" data-toggle="reload"><i class="fa fa-refresh"></i></a>
                <a
                        data-toggle="collapse"
                        data-parent="#accordion"
                        href="#bg-primary"
                        aria-expanded="true"
                        aria-controls="bg-primary"
                        class="">
                    <i class="fa fa-minus"></i>
                </a>
                <a href="#" data-toggle="remove"><i class="fa fa-close"></i></a>
            </div>
            <div class="clearfix"></div>
        </div>
        <div id="bg-primary" class="panel-collapse collapse">

            <div class="widget-content">
                <div class="row">
                    <div class="col-md-12">
                        <div class="row-fluid">
                            <div class="box">
                                <div class="box-header" style="padding-bottom: 3%; backgroun-color: #fff;">

                                    <div>
                                        Planejamento das Manutenções
                                        <span id="infoAgendaTooltip" class="fa fa-question-circle" title=""
                                              style="margin-left: 10px;"></span>
                                        <div class="pull-right">
                                            <span class="compromisso event-success"></span> Preventiva
                                            <span class="compromisso event-info" style="margin-left: 20px;"></span> Corretiva
                                            <span class="compromisso event-warning" style="margin-left: 20px;"></span> Outros
                                        </div>
                                    </div>

                                </div>



                            </div>

                        </div>
                    </div>

                </div>
            </div>

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

<style>


</style>




<?php $this->load->view("sistema/modais/agenda/adicionarAgendaModal"); ?>


<!-- Modal Editar Compromisso -->
<div class="modal fade" id="modalEditarCompromisso">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title">Editar Compromisso</h4>
            </div>
            <div class="panel-body">
                <form id="formCompromisso" name="formCompromisso" class="form-horizontal"
                      action="<?php echo base_url(); ?>agenda/editarAgenda" method="POST">
                    <input type="hidden" id="idEditar" name="idEditar">
                    <div class="row">
                        <div class="col-sm-2 control-label">Tipo</div>
                        <div class="col-sm-10">
                            <div class="radio-inline col-sm-4">
                                <label>
                                    <input id="tpAgenda" type="radio" name="tpAgenda" value="Consulta" checked="">
                                    <span class="compromisso event-success"></span>Consulta
                                </label>
                            </div>
                            <div class="radio-inline col-sm-4" style="margin: 0;">
                                <label>
                                    <input id="tpAgenda" type="radio" name="tpAgenda" value="Retorno">
                                    <span class="compromisso event-info"></span>Retorno
                                </label>
                            </div>
                            <div class="radio-inline col-sm-4" style="margin: 0;">
                                <label>
                                    <input id="tpAgenda" type="radio" name="tpAgenda" value="Outros">
                                    <span class="compromisso event-warning"></span>Outros
                                </label>
                            </div>
                        </div>
                    </div>
                    <div id="tipoConsultaRetorno" class="row margn-t-lg">
                        <div class="col-sm-2 control-label">Paciente *</div>

                        <div class="col-sm-5">
                            <input name="nomePaciente" id="nomePacienteEditar" class="form-control" type="text"
                                   placeholder="Digite o nome do paciente" maxlength="20" required/>
                        </div>
                        <div class="col-sm-2 control-label padd-t-only-xs">Fone</div>
                        <div class="col-sm-3">
                            <input type="text" class="form-control inputmask fone" name="fonePaciente"
                                   id="fonePacienteEditar"
                                   data-inputmask="'mask': '(99) 9999[9]-9999'" data-inputmask-greedy="false" value=""
                                   maxlength="20">
                        </div>
                    </div>

                    <div class="row margn-t-lg">
                        <div class="col-sm-2 control-label" style="margin-top: 15px;">Início *</div>
                        <div class="col-sm-4">

                            <div class="input-group date" id="date-anamnese">

                                <input type="date" class="form-control" data-date-format="DD/MM/YYYY"
                                       name="dtAgenda" id="dtAgendaEditar" placeholder="Data" maxlength="10">
                                <span class="input-group-addon">
                                    <span class="glyphicon-calendar glyphicon"></span>
                                </span>


                            </div>


                        </div>


                        <div class="col-sm-2 control-label" style="margin-top: 15px;">Horário*</div>
                        <div class="col-sm-4">



                            <div class="input-group date" id="horaFim">
                                <input id="hsInicioAgendaEditar" name="hsInicioAgenda" type="time" class="form-control"
                                       placeholder="hh:mm [Início]" required>
                                <span class="input-group-addon">
                                            <span class="glyphicon-time glyphicon"></span>
                                        </span>
                            </div>


                            <div class="input-group date" id="horaFim">
                                <input id="hsFimAgendaEditar" name="hsFimAgenda" type="time" class="form-control"
                                       placeholder="hh:mm [Fim]" required>
                                <span class="input-group-addon">
                                            <span class="glyphicon-time glyphicon"></span>
                                        </span>
                            </div>


                        </div>

                    </div>


                    <div class="row margn-t-lg">

                        <div class="col-sm-2 control-label padd-t-only-xs">Descrição</div>
                        <div class="col-sm-10">
                            <input type="text" id="dsAgendaEditar" name="dsAgenda" class="form-control">
                        </div>
                    </div>

            </div>
            <div class="modal-body">
            </div>
            <div class="modal-footer">
                <button id="btnSalvarCompromisso" type="submit" class="btn btn-success"><span class="fa fa-save"></span>
                    Editar
                </button>
                <button id="btnExcluirCompromisso" type="button" class="btn btn-danger hidden">Excluir</button>
                <button type="button" class="btn btn-default" data-dismiss="modal">Fechar</button>
            </div>
            </form>
        </div>
    </div>
</div>

<div id="dialog" class="panel panel-default" title="Informações" style="display:none">
    <form>
        <fieldset>

            <label for="Id">Compromisso</label>
            <textarea cols=40 rows=3 name="title" id="title" class="text ui-widget-content ui-corner-all"></textarea>
        </fieldset>
    </form>
</div>

<div class="modal fade" id="modalConfirmarExclusao">
    <div class="modal-dialog">
        <div class="modal-content">
            <form action="" name="excluirItens" method="post">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                    <h5 id="myModalLabel">Excluir Item</h5>
                </div>
                <div class="modal-body">
                    <input type="hidden" id="itemAExcluir" name="id" value=""/>

                    <h5 style="text-align: center">Deseja realmente excluir este Item?</h5>
                </div>
                <div class="modal-footer">
                    <button class="btn" data-dismiss="modal" aria-hidden="true">Cancelar</button>
                    <button class="btn btn-danger">Excluir</button>
                </div>
            </form>
        </div>
    </div>
</div>

<script>
    // Setup FullCalendar
    (function () {
        var date = new Date();
        var d = date.getDate();
        var m = date.getMonth();
        var y = date.getFullYear();


        $('#fullcalendar').fullCalendar({
            editable: false,
            defaultEventMinutes: '30',
            scrollTime: '08:00:00',
            weekends: true,
            defaultView: 'month',
            minTime:'08:00:00',
            maxTime:'20:00:00',
            draggable: true,
            header: {
                left: "prev,next",
                center: "title",
                left: "month,agendaWeek,agendaDay"
            },


            eventClick: function (calEvent, jsEvent, view) {

                $("#dialog").dialog({
                        autoOpen: false,
                    }
                );

                $("#name").val(calEvent.id);

                $("#title").val(calEvent.description);

                $('#dialog').dialog('open');

            },
            events: [
                <?php
                foreach($fcompromissos as $row):

                $color = '';
                $textColor = '';

                if ($row->TP_AGENDA == "preventiva") {
                    $color = "#70ba63";
                    $textColor = "text-success";
                }

                if ($row->TP_AGENDA == "corretiva") {
                    $color = "#01a0e6";
                    $textColor = "text-success";
                }

                if ($row->TP_AGENDA == "outros") {
                    $color = "#f2b635";
                    $textColor = "text-success";
                }

                ?>
                {
                    title: "<?php echo $row->PREFIXO.' | '.$row->PLACA.' | Técnico: '.$row->nome.' | Garagem: '.$row->GARAGEM ?>",
                    start: '<?php echo $row->DT_AGENDA . ' ' . $row->hsInicioAgenda?>',
                    end: '<?php echo $row->DT_AGENDA . ' ' . $row->hsFimAgenda?>',
                    description: '<?php echo $row->nome?>',
                    color: '<?php echo $color ?>'

                },

                <?php
                endforeach
                ?>

            ]
        });
    }());


</script>

<script>
    $("#nomePaciente").autocomplete({
        source: "<?php echo base_url(); ?>agenda/autoCompletePaciente",
        minLength: 1,

        select: function (event, ui) {
            alert('ok');
            $("#morador_id").val(ui.item.id);
            console.log(event);
        }
    });
</script>


<script>
    $(document).on('click', '#lnkAgendaExcluir', function (event) {
        $('#itemAExcluir').val($(this).attr('agendaExcluir'));
        document.excluirItens.action = "<?php echo base_url() ?>//agenda/excluir"
    });

    $(document).on('click', '#lnkEditarCompromisso', function (event) {
        $("#idEditar").val($(this).attr('idPaciente'));
        $("#nomePacienteEditar").val($(this).attr('nomePaciente'));
        $("#fonePacienteEditar").val($(this).attr('fonePaciente'));
        $("#dtAgendaEditar").val($(this).attr('dtAgenda'));
        $("#hsInicioAgendaEditar").val($(this).attr('hsInicioAgenda'));
        $("#hsFimAgendaEditar").val($(this).attr('hsFimAgenda'));
        $("#dsAgendaEditar").val($(this).attr('dsAgenda'));
    });

    $(function () {
        $("#input-busca-agenda").keyup(function () {
            var texto = $(this).val();
            $("#eventList li").css("display", "block");
            $("#eventList li").each(function () {
                if ($(this).text().toUpperCase().indexOf(texto.toUpperCase()) < 0)
                    $(this).css("display", "none");
            });
        });
    });

</script>







