
<div class="modal" id="alertModal" tabindex="-1" role="dialog" aria-labelledby="alertModal" style="z-index:1945">
  <div class="modal-dialog modal-dialog-centered modal-lg" role="document">
    <div class="modal-content" style="max-width:80%">

      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalLongTitle" data-langkey="Alert status"></h5>
        <button type="button" class="btn-close" data-dismiss="modal" aria-label="Close" onclick="$('#alertModal').modal('hide')"></button>
      </div>

      <div class="modal-body">

        <form>
        <div class="row m-0 p-0 w-100 ">
            <label class="fw-bold m-0 p-0" for="alert_alertlist" data-langkey="Alert(s) :">
            </label>
            <span class="fw-normal" id='alert_alertlist'></span>
        </div>
        <div class="row m-0 p-0 w-100 pt-2">
            <label class="fw-bold m-0 p-0" for="alert_commenttectext" >Comment fourni</label>
            <textarea class="form-control m-0 p-0 ps-2" id="alert_commenttectext" name="alert_commenttectext" rows="1" readonly></textarea>
        </div>
        <div class="row m-0 p-0 w-100 pt-2">
            <label class="fw-bold m-0 p-0" for="alert_commenttext" data-langkey="Comment :"></label>
            <textarea class="form-control m-0 p-0 ps-2" id="alert_commenttext" name="alert_commenttext" rows="5" ></textarea>
        </div>

        <div class="row m-0 p-0 w-100 pt-2 d-none" id="alert_row_userdate">
            <span class="d-inline m-0 p-0 w-auto fw-bold" data-langkey="Submitted by :"></span>
            <span class="d-inline m-0 p-0 w-auto" id="alert_usercomment"></span>
            <span class="d-inline m-0 p-0 w-auto ps-4 fw-bold" data-langkey="on :"></span>
            <span class="d-inline m-0 p-0 w-auto" id="alert_commentdate"></span>
        </div>

        </form>
      </div>
      <div class="modal-footer">
      <button type="button" class="ximeo_button ximeo_bg-dark-2" data-dismiss="modal" data-langkey="Cancel" onclick="$('#alertModal').modal('hide')"></button>
      <button type="button" class="ximeo_button" id="alert_save" data-langkey="Save"></button>
      </div>
    </div>
  </div>
</div>
<script>
  function saveAlertModal()
  {
      	var params="stuid="+alertModal.stu_id+"&comment="+encodeURIComponent(alert_commenttext.value);
  		var xhttp = new XMLHttpRequest();
  		xhttp.onreadystatechange = function() {
  		  if (this.readyState == 4 && this.status == 200) {
  			   var jsonData = JSON.parse(xhttp.responseText);
			   console.log("postMessage");
			   console.log(alertModal.stu_id);
               window.postMessage({type:'savealertmsg',payload:{stuid:alertModal.stu_id}});
               
  		  }
  		}
  		xhttp.open("GET", "<?php echo $EODACS_ROOT;?>/SubFW/database/alertutils/db_saveackalert.php?"+params, true);
  		xhttp.send();
  		$('#alertModal').modal('hide');
  }

  var alert_savebutton = document.getElementById('alert_save');

  function showAlertModal ( id )
  {
	     var alertNames="";
	     var alertCount=0;
	     var comment="";
       var teccomment="";
	     var usercomment="";
	     var commentdate="";
	     var ack_id=-1
	     var xhttp = new XMLHttpRequest();
       xhttp.onreadystatechange = function() 
       {
          if (this.readyState == 4 && this.status == 200) 
          {
              var jsonData = JSON.parse(xhttp.responseText);
              alertCount=jsonData.length;

              // Traitement des données côté JavaScript
              for (var i = 0; i < jsonData.length; i++) 
              {
                  alertNames += jsonData[i].alert_name;
				          if(jsonData[i].comment != null)
					           comment=jsonData[i].comment;
				          if(jsonData[i].ack_id > -1)
				          {
					             alertNames+="&nbsp;<span class='selected-mark'>&#10004</span>";
					             comment=jsonData[i].comment;
                       teccomment=jsonData[i].teccomment;
					             usercomment=jsonData[i].lastname+" "+jsonData[i].firstname;
					             commentdate=jsonData[i].lastmodif;
				          }
                  if (i < jsonData.length - 1) 
                  {
						          alertNames += "<br>";
                  }
              }
          }
        }
        xhttp.open("GET", "<?php echo $EODACS_ROOT;?>/SubFW/database/alertutils/db_getstudyalerts.php?stuid="+id, false);
        xhttp.send();
  	    if(alertCount>0)
        {
  		      // alert_alertlist.innerHTML='<br>'+alertNames;
            alert_alertlist.innerHTML = alertNames;
            alert_commentdate.innerHTML=commentdate;
  		      alert_usercomment.innerHTML=usercomment;
            alert_commenttectext.value=teccomment;
  		      alert_commenttext.value=comment;
  		      alertModal.stu_id=id;
  		      
            console.log ( "Show modal !!!");
            $('#alertModal').appendTo("#IdcUserContentDiv").modal('show');

            if ( usercomment != '' )
            {
              $('#alert_row_userdate').removeClass ( 'd-none' );
              $('#alert_row_userdate').addClass ( 'd-block' );
            }
            else
            {
              $('#alert_row_userdate').removeClass ( 'd-block' );
              $('#alert_row_userdate').addClass ( 'd-none' );
            }

           // switchLanguage ( eoDACS.CurrentLanguage );
  	   }
  }

  // Ajout d'un écouteur d'événements au clic sur le bouton
  alert_savebutton.addEventListener('click', function() {
      // Action à effectuer lors du clic sur le bouton
      saveAlertModal();
  });

   window.addEventListener('message',function(msg){

     if(typeof msg.data.type != undefined)
     {
       if(msg.data.type == 'showalertmsg')
       {
          console.log ( "Show alert message !!!");
         showAlertModal(msg.data.payload.id);
       }
     }
   });

</script>