Place details when clicking on full calendar events

1

I am making a calendar for periodic intervention events.

So far I have been able to show the details of the curatives, if it counts as a title "healing" otherwise it opens the details (general). but I have 3 different event types, so I want 3 different types of details to display.

Unfortunately, I'm just trying to open a specific one. I've already done an "else if" by repeating the curative code, but it still does not open, nor does it generate error.

Any idea how I can make it work or a better way than what I'm doing?

Agenda.php

<?php 
    include("db.connect.php"); 
    require_once("functions.inc.php");
?>
<script>
    var url = window.location.href;
    var recortar = url.indexOf("agenda=");
    var tec = url.substr(recortar + 7);
    var table = $('#example').DataTable({
        "iDisplayLength": 5,
        "bLengthChange": false,
        pagingType: "simple",
        "order": [[ 1, 'asc' ]],
    });

    $('#example tbody').on('click', 'tr', function () {
        if ($(this).hasClass('selected')) {
            $(this).removeClass('selected');
        } else {
            table.$('tr.selected').removeClass('selected');
            $(this).addClass('selected');
        }
    });

    <?php


    if(isset($_GET['agenda'])){
    $tec = selecttec($_GET['agenda']);
// curativas
    $sql = "SELECT * FROM npedido WHERE tec1= '$tec' OR tec2= '$tec' OR responsable = '$tec' ";
    $stmt2 = sqlsrv_query( $conn, $sql);
// agendamentos
    $sql_agenda = "SELECT * FROM nagenda WHERE tec1= '$tec' OR tec2= '$tec'";
    $stmt_agenda = sqlsrv_query( $conn, $sql_agenda);
// preventivas
    $sql_preventivas = "SELECT * FROM nagenda1 WHERE tec1= '$tec' OR tec2= '$tec'";
    $stmt_preventivas = sqlsrv_query( $conn, $sql_preventivas);

?>
    var name = "<?php echo utf8_encode($tec); ?>";
    table.search(name).draw();
    $("#tec_name").val(name);
    $( "#example tr").each(function() {
       if(this.id == tec){
         $(this).addClass('selected');
       }
    });
    var tec = "<?php echo $tec; ?>";
    var events = function () {
        return [

            // curativas agenda 
            <?php while($row = sqlsrv_fetch_array($stmt2, SQLSRV_FETCH_NUMERIC)) { 
                if(strlen(str_replace(' ', '', $row[7])) < 15){ $start=date('h:i Y-m-d',strtotime(str_replace("18", "2018", substr($row[7], -16, 8)))) ;}else{ $start= date('Y-m-d H:i',strtotime($row[7])) ; }  
                if(strlen(str_replace(' ', '', $row[7])) < 15){ $end = date('h:i Y-m-d',strtotime(str_replace("18", "2018", substr($row[7], -16, 8)))) ;}else{ $end = date('Y-m-d H:i ',strtotime($row[7])) ; }   
                $start = substr($start,0,10)."T". substr($start,10); 
                $start = str_replace(" ","",$start);
                $end = substr($end,0,10)."T". substr($end,10); 
                $end = str_replace(" ","",$end);
            ?> {
                id: '<?php echo $row[0] ?>',
                title: '<?php echo "Curativa - ".utf8_encode($row[8])."";  ?>',
                start: '<?php echo $start; ?>',
                end: '<?php echo $end; ?>',
                color: '#0FB1DA',
            },
            <?php }?> 
            // agendamento
            <?php while($row = sqlsrv_fetch_array($stmt_agenda, SQLSRV_FETCH_NUMERIC)) {?> 
                {
                id: '<?php echo $row[0]; ?>',                
                title: '<?php echo "Agendamento - ".utf8_encode($row[4])."";  ?>',
                start: '<?php echo $row[6]; ?>',
                end: '<?php echo $row[7]; ?>',
                color: '<?php echo $row[10];?>',
            },
            <?php }?> 

            // preventivas
            <?php while($row = sqlsrv_fetch_array($stmt_preventivas, SQLSRV_FETCH_NUMERIC)) {?> 
                {
                id: '<?php echo $row[0]; ?>',
                title: '<?php echo "teste - ".utf8_encode($row[4])."";  ?>',
                start: '<?php echo $row[6]; ?>',
                end: '<?php echo $row[7]; ?>',
                color: '#34C624',
            },
            <?php }?> 

        ];
    }
    table.search("").draw();
    <?php }else{?>
    $('#example tbody tr:eq(0)').click();
    <?php }sqlsrv_close($conn);?>
</script>

view.details.agenda.inc.php

<div id="mydiv" class="container col-md-5">
    <?php
$idpedido = $_POST['id'];
        include("db.connect.php");
        $sql = "SELECT * FROM nagenda where id='$idpedido'";
    $stmt = sqlsrv_query( $conn, $sql );
    while( $row = sqlsrv_fetch_array( $stmt, SQLSRV_FETCH_NUMERIC) ) { 
        $wo =utf8_decode($row[1]);
        $tec1 =utf8_encode($row[2]);
        $tec2 =utf8_encode($row[3]);
        $assunto =utf8_encode($row[4]);
        $descre =utf8_encode($row[5]);
        $dataini =utf8_decode($row[6]);
        $datafim =utf8_decode($row[7]);
        $repete =utf8_decode($row[8]);
        $fimrepete =utf8_decode($row[9]);
        $cor =$row[10];
}
 sqlsrv_close($conn);
 ?>
    <div class="panel-group">
        <div class="panel panel-primary">
            <div id="mydivheader" class="panel-heading">
                <div class="row">
                    <div class="col-md-12">
                        <div class="col-md-11">
                            <div class="pull-left">
                                <?php echo $_POST['title']; ?>
                            </div>
                        </div>
                        <div class="pull-right">
                            <button id="close" type="button" class="close" aria-label="Close">
                                <span aria-hidden="true">&times;</span>
                            </button>
                        </div>
                    </div>
                </div>
            </div>
            <div class="panel-body">
                <div class="col-md-12">
                    <div class="row">
                        <div class="col-md-6">
                            <div clasS="pull-left">
                                <label class="control-label mb-10" for="review">Técnico 1</label>
                            </div>

                            <input id="te" readonly name="textinput" type="text" value="<?php echo $tec1; ?> "
                                placeholder="placeholder" class="form-control input-md">

                        </div>
                        <div class="col-md-6">
                            <div clasS="pull-left">
                                <label class="control-label mb-10" for="review">Técnico 2</label>
                            </div>
                            <input id="te" readonly name="textinput" type="text" value=" <?php echo $tec2; ?>"
                                placeholder="placeholder" class="form-control input-md">
                        </div>
                    </div>
                    <hr>
                    <div class="row">
                        <div class="col-md-6">
                            <div clasS="pull-left">
                                <label class="control-label mb-10" for="review">Assunto</label>
                            </div>
                            <input readonly id="te" name="textinput" type="text" value="<?php echo $assunto;  ?> "
                                placeholder="placeholder" class="form-control input-md">
                        </div>
                        <div class="col-md-6">
                            <div clasS="pull-left">
                                <label class="control-label mb-10" for="review">WO/NF/ID Cliente</label>
                            </div>
                            <input id="te" name="textinput" type="text" value="<?php echo $wo; ?> " placeholder="placeholder"
                                readonly class="form-control input-md">
                        </div>

                    </div>
                    <hr>
                    <div class="row">
                        <div class="col-md-12">
                            <div clasS="pull-left">
                                <label class="control-label mb-10" for="review">Descrição</label>
                            </div>
                            <textarea readonly class="form-control" rows="5" name="ope_r" placeholder="add review"><?php echo $descre;?></textarea>
                        </div>
                    </div>
                    <hr>
                    <div class="row">
                        <div class="col-md-6">
                            <div clasS="pull-left">
                             <label class="control-label mb-10" for="review">Data de Notificação</label>
                            </div>
                            <input type="text" class="form-control" id="start2" value="<?php echo str_replace("T"," ",$dataini);?>" name="data" placeholder="Data de incio" readonly>
                        </div>
                        <div class="col-md-6">
                            <div clasS="pull-left">
                             <label class="control-label mb-10" for="review">Data de Notificação</label>
                            </div>
                            <input type="text" class="form-control" id="end" value="<?php echo str_replace(" T","",$datafim);?>" name="data" placeholder="Data de incio" readonly>
                        </div>
                    </div>
                    <hr>
                    <div class="row">
                        <div class="col-md-12">
                            <div clasS="pull-right">
                                <button type="button" id="addFechar" class="btn btn-primary">Fechar</button>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<script type="text/javascript">
    $('.data_formato').datetimepicker({
        format: 'yyyy-mm-dd hh:ii',
        weekStart: 1,
        todayBtn: 1,
        autoclose: 1,
        todayHighlight: 1,
        startView: 2,
        forceParse: 0,
        showMeridian: 1,
        language: "pt-BR",
        //startDate: '+0d'
    });
</script>
<script>
    //Make the DIV element draggagle:
    dragElement(document.getElementById("mydiv"));

    function dragElement(elmnt) {
        var pos1 = 0,
            pos2 = 0,
            pos3 = 0,
            pos4 = 0;
        if (document.getElementById(elmnt.id + "header")) {
            /* if present, the header is where you move the DIV from:*/
            document.getElementById(elmnt.id + "header").onmousedown = dragMouseDown;
        } else {
            /* otherwise, move the DIV from anywhere inside the DIV:*/
            elmnt.onmousedown = dragMouseDown;
        }
        function dragMouseDown(e) {
            e = e || window.event;
            e.preventDefault();
            // get the mouse cursor position at startup:
            pos3 = e.clientX;
            pos4 = e.clientY;
            document.onmouseup = closeDragElement;
            // call a function whenever the cursor moves:
            document.onmousemove = elementDrag;
        }
        function elementDrag(e) {
            e = e || window.event;
            e.preventDefault();
            // calculate the new cursor position:
            pos1 = pos3 - e.clientX;
            pos2 = pos4 - e.clientY;
            pos3 = e.clientX;
            pos4 = e.clientY;
            // set the element's new position:
            elmnt.style.top = (elmnt.offsetTop - pos2) + "px";
            elmnt.style.left = (elmnt.offsetLeft - pos1) + "px";
        }
        function closeDragElement() {
            /* stop moving when mouse button is released:*/
            document.onmouseup = null;
            document.onmousemove = null;
        }
    }
    $('#addFechar').click(function () {
        $("#mydiv").remove();
        $("#op").removeClass("overlay");
    });
    $("#close").click(function () {
        $("#mydiv").remove();
        $("#op").removeClass("overlay");
    });
</script>

calendar.js

$(function () {
  loadEvents();
  showTodaysDate();
  initializeCalendar();
  getCalendars();
  initializeRightCalendar();
  initializeLeftCalendar();
  disableEnter();
  document.getElementById("agendaName").innerHTML = document.getElementById("tec_name").value;
});
/* --------------------------initialize calendar-------------------------- */
var initializeCalendar = function () {
  $('.calendar').fullCalendar({
    locale: 'pt',
    editable: true,
    eventLimit: true, // allow "more" link when too many events
    // create events
    events: events(),
    defaultTimedEventDuration: '00:30:00',
    forceEventDuration: true,
    eventBackgroundColor: '#337ab7',
    editable: false,
    height: screen.height - 160,
    timezone: 'America/Chicago',
  });
}
/*--------------------------calendar variables--------------------------*/
var getCalendars = function () {
  $cal = $('.calendar');
  $cal1 = $('#calendar1');
  $cal2 = $('#calendar2');
}
var initializeRightCalendar = function () {
  $cal2.fullCalendar('changeView', 'listWeek');
  $cal2.fullCalendar('option', {
    header: false,
    viewRender: function (view) {
      var title = view.title;
      $("#title").html(title);
    },
    navLinks: false,
    selectable: true,
    selectHelper: true,
    dayRender: function (date, cell) {
      if (moment().diff(date, 'days') > 0) {
        cell.css("background-color", "#F5F5F5");
        $(cell).addClass('disabled');
      }
    },
    height: 'auto',
    contentHeight: 'auto',
    eventClick: function (calEvent, jsEvent, view) {
      var str = calEvent.title;
      var res = str.slice(0, 8);
      if (res == "Curativa") {
        $.ajax({
          type: "POST",
          data: {
            id: calEvent.id,
            title: calEvent.title,
            start: moment(calEvent.start).format('D-M-Y H:mm'),
            end: moment(calEvent.end).format('D-M-Y H:mm'),
          },
          url: "dist/view.details.inc.php",
          success: function (result) {
            $("#op").addClass("overlay");
            $('#teste').append(result);
            $('#teste').fadeIn(1000);
          }
        });
      } else {
        $.ajax({
          type: "POST",
          data: {
            id: calEvent.id,
            title: calEvent.title,
            start: moment(calEvent.start).format('D-M-Y H:mm'),
            end: moment(calEvent.end).format('D-M-Y H:mm'),
          },
          url: "dist/view.details.agenda.inc.php",
          success: function (result) {
            $("#op").addClass("overlay");
            $('#teste').append(result);
            $('#teste').fadeIn(1000);
          }
        });
      }
    }
  });
}
/* -------------------manage cal1 (left pane)------------------- */
var initializeLeftCalendar = function () {
  $cal1.fullCalendar('option', {
    header: false,
    viewRender: function (view) {
      var title = view.title;
      $("#title").html(title);
    },
    navLinks: false,
    selectable: true,
    selectHelper: true,
    dayRender: function (date, cell) {
      if (moment().diff(date, 'days') > 0) {
        cell.css("background-color", "#F5F5F5");
        $(cell).addClass('disabled');
      }
    },
    select: function (startDate, endDate) {
      var yesterday = new Date(new Date().setDate(new Date().getDate()-1));
      if (startDate > yesterday) {
        var tec_name = document.getElementById("tec_name").value;
        $.ajax({
          type: "POST",
          data: {
            tec: tec_name,
            start: startDate.format(),
            end: endDate.format(),
          },
          url: "dist/processo.add.event.php",
          success: function (result) {
            $("#op").addClass("overlay");
            // $("#teste").html(result);
            $('#teste').append(result);
            $('#teste').fadeIn(1000);
          }
        });
      }
    },

    eventClick: function (calEvent, jsEvent, view) {
      var str = calEvent.title;
      var res = str.slice(0, 8);
      if (res == "Curativa") {
        $.ajax({
          type: "POST",
          data: {
            id: calEvent.id,
            title: calEvent.title,
            start: moment(calEvent.start).format('D-M-Y H:mm'),
            end: moment(calEvent.end).format('D-M-Y H:mm'),
          },
          url: "dist/view.details.inc.php",
          success: function (result) {
            $("#op").addClass("overlay");
            $('#teste').append(result);
            $('#teste').fadeIn(1000);
          }
        });
      } else {
        $.ajax({
          type: "POST",
          data: {
            id: calEvent.id,
            title: calEvent.title,
            start: moment(calEvent.start).format('D-M-Y H:mm'),
            end: moment(calEvent.end).format('D-M-Y H:mm'),
          },
          url: "dist/view.details.agenda.inc.php",
          success: function (result) {
            $("#op").addClass("overlay");
            $('#teste').append(result);
            $('#teste').fadeIn(1000);
          }
        });
      }
    }
  });
}

/* -------------------moves right pane to date------------------- */
var cal2GoTo = function (date) {
  $cal2.fullCalendar('gotoDate', date);
}
var loadEvents = function () {
  $.getScript("js/events1.js", function () {});
}
var newEvent = function (start) {
  $('input#title').val("");
  $('#newEvent').modal('show');
  $('#submit').unbind();
  $('#submit').on('click', function () {
    var title = $('input#title').val();
    if (title) {
      var eventData = {
        title: title,
        start: start
      };
      $cal.fullCalendar('renderEvent', eventData, true);
      $('#newEvent').modal('hide');
    } else {
      alert("Title can't be blank. Please try again.")
    }
  });
}
var editEvent = function (calEvent) {
  $('input#editTitle').val(calEvent.title);
  $('#editEvent').modal('show');
  $('#update').unbind();
  $('#update').on('click', function () {
    var title = $('input#editTitle').val();
    $('#editEvent').modal('hide');
    var eventData;
    if (title) {
      calEvent.title = title
      $cal.fullCalendar('updateEvent', calEvent);
    } else {
      alert("Title can't be blank. Please try again.")
    }
  });
  $('#delete').on('click', function () {
    $('#delete').unbind();
    if (calEvent._id.includes("_fc")) {
      $cal1.fullCalendar('removeEvents', [getCal1Id(calEvent._id)]);
      $cal2.fullCalendar('removeEvents', [calEvent._id]);
    } else {
      $cal.fullCalendar('removeEvents', [calEvent._id]);
    }
    $('#editEvent').modal('hide');
  });
}
/* --------------------------load date in navbar-------------------------- */
var showTodaysDate = function () {
  n = new Date();
  y = n.getFullYear();
  m = n.getMonth() + 1;
  d = n.getDate();
};
var getCal1Id = function (cal2Id) {
  var num = cal2Id.replace('_fc', '') - 1;
  var id = "_fc" + num;
  return id;
}
var disableEnter = function () {
  $('body').bind("keypress", function (e) {
    if (e.keyCode == 13) {
      e.preventDefault();
      return false;
    }
  });
}
    
asked by anonymous 05.09.2018 / 18:12

0 answers