<style>
    .dataTables_filter{
        margin-top: -35px;

    }
    .buttons-csv{
        background-color: white;
        color: #002B60;
        border-color: #000;
    }
 </style>
 <!-- start page title -->
                            <div class="row">
                            <div class="col-12">
                                <div class="page-title-box page-title-box-alt">
                                    <h4 class="page-title">Users</h4>
                                    <div class="page-title-right">
                                        <ol class="breadcrumb m-0">
                                            <li class="breadcrumb-item"><a href="<?= base_url() ?>user_add">
                                            <button type="button" class="btn btn-primary waves-effect waves-light">Add</button>
                                            </a></li>
                                            <!-- <li class="breadcrumb-item"><a href="javascript: void(0);">Tables</a></li>
                                            <li class="breadcrumb-item active">Datatables</li> -->
                                        </ol>
                                    </div>
                                </div>
                            </div>
                        </div>     
                        <!-- end page title --> 




                        <div class="row">
                            <div class="col-12">
                                <div class="card">
                                    <div class="card-body">

                                        <!-- <h4 class="header-title">Buttons example</h4>
                                        <p class="text-muted font-13 mb-4">
                                           
                                        </p> -->

                                        <table id="datatable-buttons" class="table table-striped dt-responsive nowrap w-100">
                                            <thead>
                                                <tr>
                                                <th hidden>id</th>
                                                    <th>Name</th>
                                                    <th>Mobile</th>
                                                    <th>Email</th>
                                                    <th>Role</th>
                                                    <th>Status</th>
                                                    <th>Action</th>
                                                </tr>
                                            </thead>
                                        
                                        
                                            <tbody>
                                            <?php foreach ($userList as $row)
                                                { ?>
                                                <tr>
                                                <td hidden><?php echo $row['id'];?></td>
                                                        <td><?php echo $row['name'];?></td>
                                                        <td><?php echo $row['mobile'];?></td>
                                                        <td><?php echo $row['email'];?></td>
                                                        <td><?php echo $row['role'];?></td>
                                                     
                                                        <td><?php if($row['is_active'] == 1){ echo "Active"; }else{ echo "Deactive"; }?></td>
                                                        <td><a href="<?= base_url() ?>user_edit/<?php echo md5($row['id']);?>"><i class="mdi mdi-lead-pencil"  style="font-size:18px;"></i></a>
                                                        <?php if ($row['is_active'] == 1) { ?>
                                                            <a href="<?= base_url() ?>user_deactivate/<?php echo md5($row['id']);?>"><i class="mdi mdi-account-check-outline" title="Deactivate" style="font-size:18px;"></i></a>
                                                        <?php } 
                                                        else { ?>
                                                            <a href="<?= base_url() ?>user_activate/<?php echo md5($row['id']);?>"><i class="mdi mdi-account-cancel-outline" title="Activate" style="font-size:18px;"></i></a>
                                                        <?php }
                                                        ?></td>
                                                       
                                                        
                                                </tr>    
                                                <?php } ?>
                                  
                                            </tbody>
                                        </table>
                                        
                                    </div> <!-- end card body-->
                                </div> <!-- end card -->
                            </div><!-- end col-->
                        </div>
                        <!-- end row-->

<script>
    $(document).ready(function() {
      $('#datatable-buttons').DataTable({
        "order": [[0, 'desc']], // Set initial sorting to descending on the first column
        "dom": 'Bfrtip', // Show export buttons
        buttons: [
            {
                extend: 'pdfHtml5',
                title: 'Users', // Set your custom PDF title here
                text: 'PDF',
                customize: function(doc) {
                    doc.content[1].table.body.forEach(function(row) {
                    row.splice(0, 1); // Remove the first column (ID column)
                  });
                }
            },
            {
                extend: 'print',
                title: 'Users', // Set your custom print title here
                text: 'Print',
                customize: function(win) {
                    $(win.document.body).find('table').find('th:first-child, td:first-child').remove();
                }
            },
            {
                extend: 'copy',
                text: 'Copy', // Set the title for the Copy button
                titleAttr: 'Copy', // Set the tooltip for the Copy button
                exportOptions: {
                  columns: ':not(:first-child)' // Exclude the first column (ID column)
                }
            },
            {
                extend: 'csv',
                text: 'CSV', // Set the title for the CSV button
                title: 'Users', // Set your custom print title here
                exportOptions: {
                  columns: ':not(:first-child)' // Exclude the first column (ID column)
                }
            }
        ],
        "language": {
          "search": "Search: " // Customize search label
        }
      });
    });
  </script>
