<?php include_once PUBLIC_PATH. '/files_to_include/header_content.php'; ?>
<div class="main-content-wrap sidenav-open d-flex flex-column">
            <!-- ============ Body content start ============= -->
            <div class="main-content">
                 <div class="modal fade bd-example-modal-lg" tabindex="-1" role="dialog" aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
                    <div class="modal-dialog modal-lg">
                        <div class="modal-content">
                            <div class="modal-header">
                                <h5 class="modal-title" id="exampleModalCenterTitle">CONSOMMABLE/REACTIFS</h5>
                                <button class="close" type="button" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
                            </div>
                            
                            <div class="modal-body">
                              
                                    <div class="form-group row">
                                        <label class="col-sm-3 col-form-label" for="inputLibelle">LIBELLE<i style=" color : Red;">&nbsp; *&nbsp;</i></label>
                                        <div class="col-sm-9">
                                            <input class="form-control" id="inputLibelle" name="name" type="text" placeholder="Name" required="" />
                                        </div>
                                    </div>
                                    
                                    <div class="form-group row">
                                        <label class="col-sm-3 col-form-label" for="inputDescription">DESCRIPTION</label>
                                        <div class="col-sm-9">
                                            <textarea class="form-control" id="inputDescription" name="description" type="text" placeholder="Description"></textarea>
                                        </div>
                                    </div>
                                <div class="form-group row">
                                        <label class="col-sm-3 col-form-label" for="inputLocalisation">QUANTITE MINIMUM</label>
                                        <div class="col-sm-9">
                                            <input class="form-control" id="inputQte" name="localisation" type="number" placeholder="Localisation" />
                                            <input type="hidden" id="inputParent_id" name="inputParent_id"   />
                                        </div>
                                    </div>
                                   
                                    <br/>

                            </div>
                            <div class="modal-footer">
                                <button id="close"  class="btn btn-secondary" type="button" data-dismiss="modal">Close</button>
                                <button id="save" class="btn btn-primary ml-2" type="button">Save</button>
                                 <button id="edit" class="btn btn-primary ml-2" type="button">Edit</button>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-md-11">
                       
                    </div>
                    <div class="col-md-1">
                        
                        <button id="addConsommable" class=" float i-Add " type="button" data-toggle="modal" data-target=".bd-example-modal-lg">
                             
                    <span class="ul-btn__icon"></span>
                </button>
                    </div>
                </div>
                &nbsp;
                 
                <div class="table-responsive">
                                    <table class="display table table-striped table-bordered" id="hidden_column_table" style="width:100%">
                                        <thead>
                                            <tr>
                                           <th>Id</th>
                                           <th>Libelle</th>
                                            <th>Description</th>
                                            <th>Minimun</th>
                                            <th>Actions</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                               
                                        </tbody>
                                        <tfoot>
                                             <tr>
                                          <th>Id</th>
                                           <th>Libelle</th>
                                            <th>Description</th>
                                            <th>Minimun</th>
                                            <th>Actions</th>
                                            </tr>
                                        </tfoot>
                                    </table>
                </div>
            </div><!-- Footer Start -->
            <div class="flex-grow-1"></div>
            <div class="app-footer">
                <div class="footer-bottom border-top pt-3 d-flex flex-column flex-sm-row align-items-center">
                    <span class="flex-grow-1"></span>
                    <div class="d-flex align-items-center">
                        <img class="logo" src="<?php echo $this->baseUrl('images/logo.png');?>" alt="">
                        <div>
                            <p class="m-0">&copy; 2021 ASLM</p>
                            <p class="m-0">All rights reserved</p>
                        </div>
                    </div>
                </div>
            </div>
            <!-- fotter end -->
        </div>
    </div><!-- ============ Search UI Start ============= -->
    
    <!-- ============ Search UI End ============= -->
    <script src="<?php echo $this->baseUrl('js/plugins/jquery-3.3.1.min.js');?>"></script>
     <script src="<?php echo $this->baseUrl('js/plugins/bootstrap.bundle.min.js');?>"></script>
    <script src="<?php echo $this->baseUrl('js/plugins/perfect-scrollbar.min.js');?>"></script>
    <script src="<?php echo $this->baseUrl('js/scripts/script.min.js');?>"></script>
    <script src="<?php echo $this->baseUrl('js/scripts/sidebar.large.script.min.js');?>"></script>
    <script src="<?php echo $this->baseUrl('js/plugins/datatables.min.js');?>"></script>
    <script src="<?php echo $this->baseUrl('js/plugins/loadingoverlay.min.js');?>"></script>
    <script src="<?php echo $this->baseUrl('js/plugins/sweetalert2.min.js');?>"></script>
    <script src="<?php echo $this->baseUrl('script/jquery.toast.min.js');?>"></script>
    <script type="text/javascript">
          $(document).ajaxSend(function(event, jqxhr, settings){
            $.LoadingOverlay("show");
        });
        
        $(document).ajaxComplete(function(event, jqxhr, settings){
            $.LoadingOverlay("hide");
        });
        $('#edit').hide();
        actions = JSON.parse($('#listRole').val());
        console.log(actions)
        var valeur = false;
        actionUser = actions.filter((auth) => auth.controller === 'Consommable')
        $.each( actionUser, function( key, value ) {
            if(value.action.includes("add")){
                 valeur = value.action.includes("add");
                 return valeur
            }
            
        });
        if(valeur==false){
                $('#addConsommable').remove();
         }
       
  
       
       
        
     var myTable =    $('#hidden_column_table').DataTable({
                    responsive: true,
                     "language": {
                                    "zeroRecords": " aucune donnée disponible ",
                                    "infoEmpty": "Aucune donnée disponible",
                                    "search": "recherche",
                                    "infoFiltered": ""
                                },
                    "processing" : true,
                    "serverSide" : true,
                    "iDisplayLength" :100,
                    "ajax" : {
                                         url : "<?php echo $this->url(array('controller' => 'Consommable', 'action' => 'datatable')); ?>",
                                         type : "POST"
                             },
                             columnDefs: [
        { targets: [1,2,3,4], visible: true},
        { targets: '_all', visible: false }
    ],
                    columns : [
                                                    null,
                                                    null,
                                                    null,
                                                     null,
                                                   { render : function(data, type, row, meta) {
                                                            chaine = "";
                                                           $.each( actionUser, function( key, value ) {
                                                                if(value.action.includes("edit")){
                                                                     chaine+='<a class="myedit" href="#" code="' + row[0] +'" data-toggle="modal" data-target=".bd-example-modal-lg"><i title="Edit" class="text-20 i-Pen-2"></i></a>  ';
                                                                }
                                                                
                                                             });
                                                          
                                                          
                                                            
                                                         return chaine;
                                                     }
                                                   }, 
                                                  
                                                    
                                              ],
                   
                });
       
     
    $("#save").click(function(e){
    e.preventDefault();
       //Construction de l'objet param
       var param = {libelle:$('#inputLibelle').val(),description:$('#inputDescription').val(),quantite:$('#inputQte').val()}
       
         $.ajax({
            url: "<?php echo $this->url(array('controller' => 'Consommable', 'action' => 'enregistrer')); ?>",
            dataType: "json",
            type: "POST",
            data:param,
            beforeSend: function () {
                //$("#inputParent").LoadingOverlay("show");
            },
            success: function (response) {
                 $.toast({
                                    heading: "Success",
                                    text: "Enregistrement effectue avec succes",
                                    icon: "success",
                                    hideAfter: false,
                                    stack: false,
                                    position: 'mid-center'
                                });
                if(myTable != null) myTable.destroy();
                 myTable =    $('#hidden_column_table').DataTable({
                    responsive: true,
                     "language": {
                                    "zeroRecords": " aucune donnée disponible ",
                                    "infoEmpty": "Aucune donnée disponible",
                                    "search": "recherche",
                                    "infoFiltered": ""
                                },
                    
                    "processing" : true,
                    "serverSide" : true,
                     "iDisplayLength" :100,
                    "ajax" : {
                                         url : "<?php echo $this->url(array('controller' => 'Consommable', 'action' => 'datatable')); ?>",
                                         type : "POST"
                             },
                             columnDefs: [
        { targets: [1,2,3,4], visible: true},
        { targets: '_all', visible: false }
    ],
                    columns : [
                                                    null,
                                                    null,
                                                    null,
                                                     null,
                                                   { render : function(data, type, row, meta) {
                                                            chaine = "";
                                                           $.each( actionUser, function( key, value ) {
                                                                if(value.action.includes("edit")){
                                                                     chaine+='<a class="myedit" href="#" code="' + row[0] +'" data-toggle="modal" data-target=".bd-example-modal-lg"><i title="Edit" class="text-20 i-Pen-2"></i></a>  ';
                                                                }
                                                               
                                                             });
                                                          
                                                          
                                                            
                                                         return chaine;
                                                     }
                                                   }, 
                                                  
                                                    
                                              ],
                   
                });
                      $("#close").click();
               $('#inputQte').val('');
               $('#inputDescription').val('');
               $('#inputLibelle').val('');
               $('#edit').hide()
               
            },
            complete: function () {
                
                
            },
            error: function () {

            }
        });
    });
  
   $("body").on( "click",".myedit",function(){
            var tab =[]
             $(this).closest('tr').find( "td:not(:last-child)" ).each (function() {
                   tab.push($(this).html())
                }); 
            code=$(this).attr('code')
           $('#inputLibelle').val(tab[0]);
               $('#inputDescription').val(tab[1]);
               $('#inputQte').val(tab[2]);
               $('#inputParent_id').val(code);
               $('#save').hide()
                $('#edit').show()
      })
        
    </script>
</body>

</html>