 <?php include_once PUBLIC_PATH. '/files_to_include/header_content.php'; ?>
<!-- =============================================== -->

  <!-- Left side column. contains the sidebar -->
  <aside class="main-sidebar" id="aside_menu" >
      <section class="sidebar">
          <ul class="sidebar-menu">
            <?php include_once PUBLIC_PATH. '/files_to_include/menu.php'; ?>
          </ul>
      </section>
  </aside>
   <!-- Content Wrapper. Contains page content -->
    
   <div class="content-wrapper " style=" td{border: solid  2px #000; }">
   

    <!-- Main content -->
    <section class="content">
          
           <div class="row">
          
           <div class="col-md-offset-1 col-md-9">
                <div  class="sidebar-form">
        <div class="input-group" >
            <input type="text" id="client" name="q" class="form-control" placeholder="Search..." style="background-color: white;">
            <input id="client_id" type="hidden">
          <span class="input-group-btn">
              <button type="button" name="search" id="search-btn" class="btn btn-microsoft"><i class="fa fa-search"></i>
                </button>
              </span>
        </div>
      </div>
          <!-- The time line -->
          <ul class="timeline" id="partieResultat">
           
          </ul>
          <div id="blockpagination"></div>
        </div>
                   
                
            </div>
     

    </section>
    <!-- /.content -->
  </div>
   <div class="modal fade" id="modal-default">
          <div class="modal-dialog modal-lg">
            <div class="modal-content">
              <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                  <span aria-hidden="true">&times;</span></button>
              </div>
                 <div id="client"></div>
              <div class="modal-body">
                 
                  <div id="html"></div>
              </div>
              <div class="modal-footer">
                <button type="button" class="btn btn-default pull-right" data-dismiss="modal">Close</button>
              </div>
            </div>
            <!-- /.modal-content -->
          </div>
          <!-- /.modal-dialog -->
        </div>
  <!-- /.content-wrapper -->
 <?php include_once PUBLIC_PATH. '/files_to_include/footer_content.php'; ?>
  
   	 <script src="<?php echo $this->baseUrl('script/jquery.min.js');?>"></script>
    <script src="<?php echo $this->baseUrl('script/bootstrap.min.js');?>"></script>
    <script src="<?php echo $this->baseUrl('script/app.min.js');?>"></script>
    <script src="<?php echo $this->baseUrl('script/i18next-1.7.1.min.js');?>"></script>
    <script src="<?php echo $this->baseUrl('script/metisMenu.min.js');?>"></script>
    <script src="<?php echo $this->baseUrl('script/sb-admin-2.js');?>"></script>
    <script src="<?php echo $this->baseUrl("script/pdfmake.min.js");?>"></script>
    <script src="<?php echo $this->baseUrl("script/vfs_fonts.js");?>"></script>
    <script src="<?php echo $this->baseUrl("script/jquery.toast.min.js");?>"></script>
    <script src="<?php echo $this->baseUrl('script/loadingoverlay.min.js');?>"></script>
    <script src="<?php echo $this->baseUrl("script/jquery.datetimepicker.full.js");?>"></script>
    <script src="<?php echo $this->baseUrl("script/bootstrap.select.min.js");?>"></script>
    <script src="<?php echo $this->baseUrl("script/moment.js");?>"></script>
    <!-- FastClick -->
<script src="<?php echo $this->baseUrl('script/fastclick.js');?>"></script>
<script src="<?php echo $this->baseUrl('script/jquery.inputmask.js');?>"></script>
<script type="text/javascript" src="<?php echo $this->baseUrl('script/jquery.autocomplete.js'); ?>"></script>
<!-- AdminLTE App -->
<script src="<?php echo $this->baseUrl('script/adminlte.min.js');?>"></script>
<script src="<?php echo $this->baseUrl('script/demo.js');?>"></script>
   <script type="text/javascript">
        
        $(document).ajaxSend(function(event, jqxhr, settings){
            $.LoadingOverlay("show");
        });
        
        $(document).ajaxComplete(function(event, jqxhr, settings){
            $.LoadingOverlay("hide");
        });
      $('#client').keyup(function () {
        var params = {nom: $('#client').val()};
        $.ajax({
            url: "<?php echo $this->url(array('controller' => 'Accueil', 'action' => 'find')); ?>",
            dataType: "json",
            type: "POST",
            data: params,
            beforeSend: function () {
                $("#client").LoadingOverlay("show");
            },
            success: function (response) {

                $('#client').autocomplete({
                    selectFirst: true,
                    autoFocus: true,
                    lookup: response.data,
                    onSearchComplete: function (suggestions) {
                        console.log(suggestions);
                    },
                    onSelect: function (suggestion) {
                       
                        var info = {id: suggestion.id, type: suggestion.type};
                        $('#client_id').val(JSON.stringify(info));

                    },
                    showNoSuggestionNotice: true,
                    noSuggestionNotice: 'Aucun résultat trouvé'
                });
            },
            complete: function () {
                $("#client").LoadingOverlay("hide");
                $('#client').focus();
            },
            error: function () {

            }
        });

    })
       $('[data-mask]').inputmask();
    

      
     
      
    $("body").on("click",".paginate_button",function(e){
     e.preventDefault();
     //Recuperation du code du boutton activer
   var codePrec =  $(".paginate_button.active").children().attr("data-dt-idx");
   $(".data-"+codePrec).addClass("hidden");
     //Affichage des elements du numero cliquer
      var codePage=$(this).children().attr("data-dt-idx");
      $(".data-"+codePage).removeClass("hidden");
      //Activation du boutton cliquer
     $(".paginate_button.active").removeClass("active");
     $(this).addClass("active");
     });
      
      $("#search-btn").on("click",function(e){
         e.preventDefault();
        var param = {param:JSON.parse($("#client_id").val()),nbpage:10};
         $.ajax({
             url : "<?php echo $this->url(array('controller' => 'Accueil', 'action' => 'historique')); ?>",
             data : param , 
             type:"post",
             dataType : "json",
             error : function(){
                $.toast({
                     heading : "serveur inactif",
                     text : "MVOLYEMANAGER n'arrive pas à accéder au serveur , si cela persiste veuilez contacter le groupe MELLCO",
                     icon : "error",
                     hideAfter : false,
                     stack : false,
                     position : 'mid-center'
                });
             },
             success : function(data){
                 
                 if ( data.type === "success"){
                    $("#partieResultat").html(data.data);
                    $("#blockpagination").html(data.pagination);
                 }else{
                     $.toast({
                         heading : "erreur",
                         text : data.message,
                         icon : "error",
                         hideAfter : false,
                         stack : false,
                         position : 'mid-center'
                     });
                 }
             }
         });
         
      });
       $("body").on("click",".consulter",function(e){
           e.preventDefault();
           var id = parseInt($(this).attr("id"));
           //var parent = $(this).parent().parent();
           var params = {id: id};
                    $.ajax({
                        url: "<?php echo $this->url(array('controller' => 'Facture', 'action' => 'consulterfacture')); ?>",
                        type: "POST",
                        dataType: "json",
                        data: params,
                        success: function(data) {
                           if ( data.type === "success"){
                    $("#client").html(data.client);
                     $("#html").html(data.html);
                 }else{
                     $.toast({
                         heading : "erreur",
                         text : data.message,
                         icon : "error",
                         hideAfter : false,
                         stack : false,
                         position : 'mid-center'
                     });
                 }
                        },
                        error: function() {
                            $.toast({
                                    heading: "serveut inactif",
                                    text: "MVOLYEMANAGER n'arrive pas à accéder au serveur , si cela persiste veuillez contacter MELLCO ",
                                    icon: "error",
                                    hideAfter: false,
                                    stack: false,
                                    position: 'mid-center'
                            });
                        }
                    });
        });
      
    </script>

</body>

</html>