EVOLUTION-NINJA
Edit File: Repayment_Pins_approve.php
<!--<?//php echo view('includes/sidebar'); ?>--> <?php echo view('includes/headerSidebar'); ?> <script type="text/javascript" src="<?php echo base_url('public/assets/js/jquery-3.6.0.min.js'); ?>"></script> <script src="https://cdn.datatables.net/1.12.1/js/jquery.dataTables.min.js"></script> <script src="<?php echo base_url('public/assets/toastr/toastr.min.js');?>"></script> <link rel="stylesheet" href="<?php echo base_url('public/assets/toastr/toastr.min.css');?>"> <link rel="stylesheet" href="https://cdn.datatables.net/1.11.5/css/jquery.dataTables.min.css"> <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"></script> <!--<script src="https://cdn.datatables.net/1.11.5/js/jquery.dataTables.min.js"></script>--> <script src="<?php echo base_url('public/datatables/js/jquery.dataTables.min.js');?>"></script> <style> /* Table container */ .dataTables_wrapper { font-family: Arial, sans-serif; font-size: 14px; margin: 20px 0; } /* Table headers */ .dataTable thead th { background-color: #1B344F; color: white; font-weight: bold; text-align: center; border: 1px solid #dddddd; } /*Table rows */ .dataTable tbody tr { background-color:lightgreen; } .dataTable tbody tr:nth-child(even) { background-color:grey; } .dataTable tbody tr:nth-child(odd) { background-color:lightgrey; } /*.dataTable tbody tr:hover {*/ /* background-color:lightblue;*/ /* cursor: pointer;*/ /*}*/ /*Table cells */ .userTable tbody td { text-align: center; padding: 10px; border: 1px solid #dddddd; } /*Table footer */ .userTable tfoot th { background-color: #f2f2f2; color: #333; text-align: center; padding: 8px; } /* Pagination controls */ .dataTables_wrapper .dataTables_paginate { margin: 10px 0; } .dataTables_wrapper .dataTables_paginate .paginate_button { padding: 6px 12px; margin-left: 2px; border: 1px solid #dddddd; background-color: #ffffff; color:#1B344F; border-radius: 4px; cursor: pointer; } .dataTables_wrapper .dataTables_paginate .paginate_button:hover { background-color:#1B344F; color: white; } /* Active pagination button */ .dataTables_wrapper .dataTables_paginate .paginate_button.current { background-color:#1B344F; color: white; border: 1px solid:#1B344F; } /* Search box */ .dataTables_wrapper .dataTables_filter input { margin-left: 8px; padding: 6px 10px; border: 1px solid #cccccc; border-radius: 4px; } /* Length dropdown */ .dataTables_wrapper .dataTables_length select { margin-left: 8px; padding: 6px 10px; border: 1px solid #cccccc; border-radius: 4px; } /* Information text */ .dataTables_wrapper .dataTables_info { margin: 10px 0; font-size: 12px; color: #555; } .approve-btn{ padding:5px; border-radius: 4px; color:white; background-color:#198754; margin-left:40px; border-color:grey; } .delete-btn{ padding:5px 10px; border-radius: 4px; color:white; background-color:maroon; margin-left:70px; border-color:grey; } /* Responsive Table */ @media screen and (max-width: 768px) { .container { padding: 10px; } #datatable { font-size: 14px; } } </style> <div id="main" class="p-4"> <section class="home-section fullpage"> <div class="home-content"> <i class='bx bx-menu'></i> <!-- <span class="text">Drop Down Sidebar</span> --> </div> <!-- heading row --> <div class="row m-0"> <div class="col-sm-12"> <h1 class="crt-pjt">Repayement Pins Approval</h1> </div> </div> <!-- Modal Structure --> <div class="container"> <table id="userTable"> <thead> <tr> <th>SL No.</th> <th>ID</th> <th>Partner Id</th> <th>Partner Name</th> <th>Request Id</th> <th>No of Requests</th> <th>Payment Status</th> <th>Status</th> <th>Requested On</th> <th style="width:250px">Actions</th> </tr> </thead> <tbody> </tbody> </table> </div> </div> </div> </section> </div> <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11.10.8/dist/sweetalert2.all.min.js"></script> <link href="https://cdn.jsdelivr.net/npm/sweetalert2@11.10.8/dist/sweetalert2.min.css" rel="stylesheet"> <script> $(document).ready(function() { var table = $('#userTable').DataTable({ "processing": false, "serverSide": true, "ajax": { "url": "<?php echo base_url('Repayment-Pending-Pins') ?>", "type": "POST", "dataSrc": function (json) { console.log(json); return json.data; } }, "columns": [ { "data": null, "render": function(data, type, row, meta) { return meta.row + 1; } }, { "data": "id",visible:false }, { "data": "promoter_id" }, { "data": "name" }, { "data": "request_id" }, { "data": "total_slots" }, { "data": "payment_status" }, { "data": "status" }, { "data": "created_at" }, { "data": "id", "render": function(data, type, row) { var deleteButton = '<button class="delete-btn" data-id="'+data+'">Delete</button>'; var approveButton = '<button class="approve-btn" data-id="'+data+'">Approve</button>'; // var pendingButton = '<button class="pending-btn" data-id="'+data+'">Pending</button>'; return '<div>' + deleteButton + approveButton + '</div>'; } } ], "rowCallback": function(row, data, index) { // Serial number $('td:eq(0)', row).html(index + 1); }, "language": { "emptyTable": "No data available" } }); }); </script> <script> $(document).ready(function() { var userId; $('#userTable').on('click', '.approve-btn', function() { userId = $(this).data('id'); $.ajax({ url: '<?php echo base_url('Repayment-approve') ?>', method: 'POST', data: { id: userId}, success: function(response) { if (response.result == 1) { // Show success alert Swal.fire({ icon: "success", title: response.message, showConfirmButton: false, timer: 2000 }); $('#approvalModal').hide(); $('#userTable').DataTable().ajax.reload(null, false); } else{ Swal.fire({ icon: "error", title: "Failed to delete user", text: response.message, showConfirmButton: false, timer: 2000 }); } } }); }); }); </script> <script> $(document).ready(function () { var userId; $('#userTable').on('click', '.delete-btn', function () { userId = $(this).data('id'); // Show confirmation dialog Swal.fire({ title: 'Are you sure?', text: "You won't be able to revert this!", icon: 'warning', showCancelButton: true, confirmButtonColor: '#3085d6', cancelButtonColor: '#d33', confirmButtonText: 'Yes, delete it!' }).then((result) => { if (result.isConfirmed) { // Perform AJAX request $.ajax({ url: '<?php echo base_url('delete-repayment-request'); ?>', method: 'POST', data: { id: userId }, dataType: 'json', success: function (response) { if (response.result == 1) { // Show success alert Swal.fire({ icon: "success", title: response.message, showConfirmButton: false, timer: 2000 }); // Reload DataTable $('#userTable').DataTable().ajax.reload(null, false); } else { // Show error alert Swal.fire({ icon: "error", title: "Failed to delete user", text: response.message, showConfirmButton: false, timer: 2000 }); } }, error: function () { // Show error alert on AJAX failure Swal.fire({ icon: "error", title: "Error", text: "An error occurred while deleting the user.", showConfirmButton: false, timer: 2000 }); } }); } }); }); }); </script> <script> let arrow = document.querySelectorAll(".arrow"); for (var i = 0; i < arrow.length; i++) { arrow[i].addEventListener("click", (e) => { let arrowParent = e.target.parentElement.parentElement; arrowParent.classList.toggle("showMenu"); }); } let sidebar = document.querySelector(".sidebar"); let sidebarBtn = document.querySelector(".bx-menu"); console.log(sidebarBtn); sidebarBtn.addEventListener("click", () => { sidebar.classList.toggle("close"); }); </script> </html>