<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <title>Clínica | L8 </title>
  <!-- Tell the browser to be responsive to screen width -->
  <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
  <!-- Bootstrap 3.3.7 -->
  <link rel="stylesheet" href="http://localhost/Clinica-L8/public/bower_components/bootstrap/dist/css/bootstrap.min.css">
  <!-- Font Awesome -->
  <link rel="stylesheet" href="http://localhost/Clinica-L8/public/bower_components/font-awesome/css/font-awesome.min.css">
  <!-- Ionicons -->
  <link rel="stylesheet" href="http://localhost/Clinica-L8/public/bower_components/Ionicons/css/ionicons.min.css">
  <!-- Theme style -->
  <link rel="stylesheet" href="http://localhost/Clinica-L8/public/dist/css/AdminLTE.min.css">
  <!-- AdminLTE Skins. Choose a skin from the css/skins
       folder instead of downloading all of them to reduce the load. -->
  <link rel="stylesheet" href="http://localhost/Clinica-L8/public/dist/css/skins/_all-skins.min.css">
  <!-- Morris chart -->
  <link rel="stylesheet" href="http://localhost/Clinica-L8/public/bower_components/morris.js/morris.css">
  <!-- jvectormap -->
  <link rel="stylesheet" href="http://localhost/Clinica-L8/public/bower_components/jvectormap/jquery-jvectormap.css">
  <!-- Date Picker -->
  <link rel="stylesheet" href="http://localhost/Clinica-L8/public/bower_components/bootstrap-datepicker/dist/css/bootstrap-datepicker.min.css">
  <!-- Daterange picker -->
  <link rel="stylesheet" href="http://localhost/Clinica-L8/public/bower_components/bootstrap-daterangepicker/daterangepicker.css">
 
  <!-- Data tables -->
  <link rel="stylesheet" href="http://localhost/Clinica-L8/public/bower_components/datatables.net-bs/css/dataTables.bootstrap.min.css">
  <link rel="stylesheet" href="http://localhost/Clinica-L8/public/bower_components/datatables.net-bs/css/responsive.bootstrap.min.css">

  <!-- Full calendar -->
  <link rel="stylesheet" href="http://localhost/Clinica-L8/public/bower_components/fullcalendar/dist/fullcalendar.min.css">
  <link rel="stylesheet" href="http://localhost/Clinica-L8/public/bower_components/fullcalendar/dist/fullcalendar.print.min.css" media="print">

  <!-- Select 2 -->
  <link rel="stylesheet" href="http://localhost/Clinica-L8/public/bower_components/select2/dist/css/select2.min.css">


  <!-- Google Font -->
  <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic">
</head>
<body class="hold-transition skin-blue sidebar-mini login-page">
    

  @if (Auth::user())
   
  <div class="wrapper">
  @include('modulos.cabecera')

    @if (auth()->user()->rol == 'Secretaria')

       @include('modulos.menuSecretaria')

    @elseif(auth()->user()->rol == 'Doctor')

       @include('modulos.menuDoctor')

    @elseif(auth()->user()->rol == 'Paciente')

       @include('modulos.menuPaciente')   

    @else
     
      @include('modulos.menuAdministrador')   

    @endif

  @yield('content')   

  </div>
  <!-- ./wrapper -->
  
@else
  @yield('contenido')    
@endif



<!-- jQuery 3 -->
<script src="http://localhost/Clinica-L8/public/bower_components/jquery/dist/jquery.min.js"></script>
<!-- jQuery UI 1.11.4 -->
<script src="http://localhost/Clinica-L8/public/bower_components/jquery-ui/jquery-ui.min.js"></script>
<!-- Resolve conflict in jQuery UI tooltip with Bootstrap tooltip -->
<script>
  $.widget.bridge('uibutton', $.ui.button);
</script>
<!-- Bootstrap 3.3.7 -->
<script src="http://localhost/Clinica-L8/public/bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
<!-- Morris.js charts -->
<script src="http://localhost/Clinica-L8/public/bower_components/raphael/raphael.min.js"></script>
<script src="http://localhost/Clinica-L8/public/bower_components/morris.js/morris.min.js"></script>
<!-- Sparkline -->
<script src="http://localhost/Clinica-L8/public/bower_components/jquery-sparkline/dist/jquery.sparkline.min.js"></script>
<!-- jQuery Knob Chart -->
<script src="http://localhost/Clinica-L8/public/bower_components/jquery-knob/dist/jquery.knob.min.js"></script>
<!-- daterangepicker -->
<script src="http://localhost/Clinica-L8/public/bower_components/moment/min/moment.min.js"></script>
<script src="http://localhost/Clinica-L8/public/bower_components/bootstrap-daterangepicker/daterangepicker.js"></script>
<!-- datepicker -->
<script src="http://localhost/Clinica-L8/public/bower_components/bootstrap-datepicker/dist/js/bootstrap-datepicker.min.js"></script>
<!-- Slimscroll -->
<script src="http://localhost/Clinica-L8/public/bower_components/jquery-slimscroll/jquery.slimscroll.min.js"></script>
<!-- FastClick -->
<script src="http://localhost/Clinica-L8/public/bower_components/fastclick/lib/fastclick.js"></script>
<!-- AdminLTE App -->
<script src="http://localhost/Clinica-L8/public/dist/js/adminlte.min.js"></script>
<!-- AdminLTE dashboard demo (This is only for demo purposes) -->
<script src="http://localhost/Clinica-L8/public/dist/js/pages/dashboard.js"></script>
<!-- AdminLTE for demo purposes -->
<script src="http://localhost/Clinica-L8/public/dist/js/demo.js"></script>


<!-- DataTables -->
<script src="http://localhost/Clinica-L8/public/bower_components/datatables.net/js/jquery.dataTables.min.js"></script>
<script src="http://localhost/Clinica-L8/public/bower_components/datatables.net-bs/js/dataTables.responsive.min.js"></script>
<script src="http://localhost/Clinica-L8/public/bower_components/datatables.net-bs/js/dataTables.bootstrap.min.js"></script>

<!-- Full calendar -->
<script src="http://localhost/Clinica-L8/public/bower_components/fullcalendar/dist/fullcalendar.min.js"></script>
<script src="http://localhost/Clinica-L8/public/bower_components/fullcalendar/dist/locale/es.js"></script>
<script src="http://localhost/Clinica-L8/public/bower_components/moment/moment.js"></script>

<!-- Selec 2 -->
<script src="http://localhost/Clinica-L8/public/bower_components/select2/dist/js/select2.js"></script>


<script type="text/javascript" >

  $(".table").DataTable({

    "language": {

            "sSearch": "Buscar:",
            "decimal": "",
            "sEmptyTable": "No hay información",
            "sInfo": "Mostrando _START_ a _END_ de _TOTAL_ Entradas",
            "sInfoEmpty": "Mostrando 0 to 0 of 0 Entradas",
            "sInfoFiltered": "(Filtrado de _MAX_ total entradas)",
            "sInfoPostFix": "",
            "sThousands": ",",
            "sLengthMenu": "Mostrar _MENU_ Entradas",
            "sLoadingRecords": "Cargando...",
            "sProcessing": "Procesando...",
            "sZeroRecords": "Sin resultados encontrados",
            "oPaginate": {
                "sFirst": "Primero",
                "sLast": "Ultimo",
                "sNext": "Siguiente",
                "sPrevious": "Anterior"
            },

	    "sLoadingRecords": "Cargando ...",
	    "sLengthMenu": "Mostrar _MENU_ registros"

        }

  });

  $('#select2').select2();

</script>


<!--  Scrip de los mensajes de alerta -->
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>

@if(session('registrado')== 'Si')
    
  <script> 

    Swal.fire(

      'El Doctor ha sido Registrado',
      '',
      'success'

    )

  </script>

@elseif(session('Agregado')== 'Si')  

  <script> 

    Swal.fire(

      'El Paciente ha sido Agregado',
      '',
      'success'

    )

  </script>

@elseif(session('Actualizado')== 'Si')  

  <script> 

    Swal.fire(

      'El Paciente ha sido Actualizado',
      '',
      'success'

    )

  </script>

@elseif(session('SecretariaCreada')== 'Si')  

  <script> 

    Swal.fire(

      'La Secretaria se ha Registrado',
      '',
      'success'

    )

  </script>  

@endif  

<!-- mensaje de eliminar -->
<script type="text/javascript"> 

    $('.table').on('click' , '.EliminarDoctor' ,function(){

      var Did = $(this).attr('Did');

      Swal.fire({

        title: 'Seguro que deseas Eliminar el Doctor ?',
        icon:  'warning',
        showCancelButton: true,
        cancelButtonText: 'Cancelar',
        cancelButtonColor: '#d33',
        confirmButtonText: 'Eliminar',
        confirmButtonColor: '#3085d6'

      }).then ((result) => {

        if(result.isConfirmed){

          window.location = "Eliminar-Doctor/" + Did;
          // window.location = "Inicio";

        }

      })

    })

    $('.table').on('click' , '.EliminarPaciente' ,function(){

      var Pid = $(this).attr('Pid');
      var Paciente = $(this).attr('Paciente');

      Swal.fire({

        title: 'Seguro que deseas Eliminar el Paciente: '+ Paciente +' ?',
        icon:  'warning',
        showCancelButton: true,
        cancelButtonText: 'Cancelar',
        cancelButtonColor: '#d33',
        confirmButtonText: 'Eliminar',
        confirmButtonColor: '#3085d6'

      }).then ((result) => {

        if(result.isConfirmed){

          window.location = "Eliminar-Paciente/" + Pid;
          // window.location = "Inicio";

        }

      })

    })

    $('.table').on('click' , '.EliminarSecretaria' ,function(){

      var Sid = $(this).attr('Sid');
      var Secretaria = $(this).attr('Secretaria');

      Swal.fire({

        title: 'Seguro que deseas Eliminar la Secreataria: '+ Secretaria +'?',
        icon:  'warning',
        showCancelButton: true,
        cancelButtonText: 'Cancelar',
        cancelButtonColor: '#d33',
        confirmButtonText: 'Eliminar',
        confirmButtonColor: '#3085d6'

      }).then ((result) => {

        if(result.isConfirmed){

          window.location = "Eliminar-Secretaria/" + Sid;
          // window.location = "Inicio";

        }

      })

    })

</script>   

<!-- es para que solo entre  cuando es el modulo calendario 
va a dividir la ruta y filtrar solo ese modulo-->
<?php
  
  $exp = explode("/", $_SERVER["REQUEST_URI"]);

?>

<!-- llama al modal de secretarias -->
@if($exp[3] == "Editar-Secretaria")

  <script type="text/javascript">
  
    $(document).ready(function(){

      $('#EditarSecretaria').modal('toggle');

    })

  </script>

@endif


<!-- citas del calendario -->
@if($exp[3] == "Citas")

<script type="text/javascript"> 

  var date = new Date();
  var d = date.getDay(),
      m = date.getMonth(),
      a = date.getFullYear()

    $('#calendario').fullCalendar({

      defaultView: 'agendaWeek',
      hiddenDays: [0,6],

      events:[

          @foreach($citas as $cita)

              @if(auth()->user()->rol == "Doctor")

                {

                  id: '{{ $cita -> id }}',
                  title: "(" + '{{ $cita -> id_paciente }}' + ") " + '{{ $cita -> PAC -> name }}',
                  start: '{{ $cita -> FyHinicio }}',
                  end: '{{ $cita -> FyHfinal }}'

                },

              @elseif(auth()->user()->rol == "Paciente")

                @if ($cita -> id_paciente == auth()->user()->id )

                    {

                      id: '{{ $cita -> id }}',
                      title: "(" + '{{ $cita -> id_paciente }}' + ") " + '{{ $cita -> PAC -> name }}',
                      start: '{{ $cita -> FyHinicio }}',
                      end: '{{ $cita -> FyHfinal }}'

                    },
                  
                @else

                    {

                      id: '{{ $cita -> id }}',
                      title: "No Disponible" ,
                      start: '{{ $cita -> FyHinicio }}',
                      end: '{{ $cita -> FyHfinal }}'

                    },

                @endif

              @endif

          @endforeach

      ],


    @if($horarios != null) 

        scrollTime: "{{ $hora->horaInicio }}",
        minTime: "{{ $hora->horaInicio }}",
        maxTime: "{{ $hora->horaFin }}", 

     @else

        scrollTime: null,
        minTime: null,
        maxTime: null, 

     @endif 
      
      dayClick:function(date,jsEvent,view){

        var fecha = date.format();
        var hora = ("01:00:00").split(":");

        fecha = fecha.split("T");

        var hora1 = (fecha[1]).split(":");

        HI = parseFloat(hora1[0]);
        HA = parseFloat(hora[0]);

        var horafinal = HI + HA;

        if(horafinal < 10 && horafinal > 0){

          var HF = "0" + horafinal + ":00:00";

        }else{

          var HF = horafinal + ":00:00";

        }

        var n = new Date();
        d2 = n.getDate();
        m2 = n.getMonth() + 1;
        y2 = n.getFullYear();
        
        if (m2 < 10) {

          M = "0" + m2;

          if (d2 < 10) {
           
            D = "0" + d2;
            diaActual = y2 + "-" + M + "-" + D;
            
          } else {

            diaActual = y2 + "-" + M + "-" + d2;
            
          }
          
        } else {

           diaActual = y2 + "-" + m2 + "-" + d2;
          
        }

        if (diaActual <= fecha[0] ) {

          if("{{ auth()->user()->rol }}" == 'Doctor'){
            
            $('#CitaModal').modal();

          }else if("{{ auth()->user()->rol }}" == 'Paciente'){
            
            $('#Cita').modal();

          }
          
        }

       $('#Fecha').val(fecha[0]);
       $('#Hora').val(hora1[0]+ ":00:00");
       $('#FyHinicio').val(fecha[0] + " " + hora1[0] + ":00:00");
       $('#FyHfinal').val(fecha[0]+ " " + HF);
        
       // datos para el modal de pacientes
       $('#FechaP').val(fecha[0]);
       $('#HoraP').val(hora1[0]+ ":00:00");
       $('#FyHinicioP').val(fecha[0] + " " + hora1[0] + ":00:00");
       $('#FyHfinalP').val(fecha[0]+ " " + HF);

      },

      eventClick:function(calEvent,jsEvent,view){

        if("{{ auth()->user()->rol }}" == 'Doctor'){

          $('#EventoModal').modal();

        }

        $('#paciente').html(calEvent.title);
        $('#idCita').val(calEvent.id);

      }



    });

</script>

@endif <!-- fin de citas -->

</body>
</html>
