EVOLUTION-NINJA
Edit File: farmer_report.php
<?php echo view('includes/sidebar'); ?> <!-- JQUERY --> <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> <!-- DATATABLE --> <link rel="stylesheet" href="https://cdn.datatables.net/1.13.4/css/jquery.dataTables.min.css"> <script src="https://cdn.datatables.net/1.13.4/js/jquery.dataTables.min.js"></script> <!-- TOASTR --> <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');?>"> <section class="home-section" style="padding:15px"> <div class="home-content"></div> <!-- TITLE --> <div class="row m-0"> <div class="col-sm-12"> <h1 class="crt-pjt"> Farmer Payment Report </h1> </div> </div> <!-- FILTER FORM --> <form id="farmerFilter"> <div class="row m-0"> <div class="constuency_page"> <div class="constuencydetails"> <div class="constuencydetail row"> <!-- FARMER --> <div class="col-sm-4"> <label class="inpfieldname"> Farmer Name </label> <select name="farmer_name" id="farmer_name" class="form-control fieldsbox"> <option value=""> All Farmers </option> </select> </div> <!-- FROM DATE --> <div class="col-sm-4"> <label class="inpfieldname"> From Date </label> <input type="date" name="from_date" id="from_date" class="form-control fieldsbox"> </div> <!-- TO DATE --> <div class="col-sm-4"> <label class="inpfieldname"> To Date </label> <input type="date" name="to_date" id="to_date" class="form-control fieldsbox"> </div> </div> <!-- BUTTON --> <div class="row mt-4"> <div class="col-sm-12"> <button type="submit" class="submit" style="width:200px"> Get Report </button> </div> </div> </div> </div> </div> </form> <br><br> <!-- TABLE --> <div class="container-fluid table-responsive"> <table id="farmerTable" class="display nowrap" style="width:100%"> <thead> <tr> <th>S N</th> <th>FARMER ID</th> <th>FARMER NAME</th> <th>DEALER</th> <th>TOTAL PRICE</th> <th>PAID AMOUNT</th> <th>BALANCE AMOUNT</th> <th>PAYMENT DATE</th> </tr> </thead> <tfoot> <tr> <th colspan="4" style="text-align:right"> TOTAL : </th> <th id="totalPrice">0</th> <th id="totalPaid">0</th> <th id="totalBalance">0</th> <th></th> </tr> </tfoot> </table> </div> </section> <style> .dataTables_wrapper{ width:100%; overflow-x:auto; } table.dataTable{ width:100% !important; } </style> <script> let table; let dealer_name = ''; // ===================================== // DOCUMENT READY // ===================================== $(document).ready(function () { // GET DEALER FROM URL const params = new URLSearchParams(window.location.search); dealer_name = params.get('dealer_name'); loadFilters(); loadTable({ dealer_name: dealer_name }); }); // ===================================== // LOAD FILTERS // ===================================== function loadFilters() { $.ajax({ url: "<?= base_url('AEReportController/getFarmerReport') ?>", type: "POST", dataType: "json", success: function(data) { let farmers = []; data.forEach(function(row){ if( row.farmer_name && !farmers.includes(row.farmer_name) ) { farmers.push(row.farmer_name); $('#farmer_name').append( `<option value="${row.farmer_name}"> ${row.farmer_name} </option>` ); } }); } }); } // ===================================== // LOAD TABLE // ===================================== function loadTable(filters = {}) { if ($.fn.DataTable.isDataTable('#farmerTable')) { $('#farmerTable').DataTable().destroy(); } table = $('#farmerTable').DataTable({ processing: true, destroy: true, scrollX: true, responsive: false, autoWidth: false, pageLength: 10, ajax: { url: "<?= base_url('AEReportController/getFarmerReport') ?>", type: "POST", data: filters, dataSrc: "", error: function (xhr) { console.log(xhr.responseText); alert("Check console for errors."); } }, columns: [ { data: null, render: function(data, type, row, meta) { return meta.row + 1; } }, { data: "farmer_id" }, { data: "farmer_name" }, { data: "dealer_name" }, { data: "total_price" }, { data: "paid_amount" }, { data: "balance_amount" }, { data: "payment_date", render: function(data) { if( !data || data === '0000-00-00' ) { return ` <span style=" color:red; font-weight:bold; "> Yet To Pay </span> `; } let d = new Date(data); return d.toLocaleDateString('en-GB'); } } ], footerCallback: function(row, data) { let api = this.api(); let totalPrice = api .column(4, { page: 'current' }) .data() .reduce(function(a, b){ return parseFloat(a || 0) + parseFloat(b || 0); }, 0); let totalPaid = api .column(5, { page: 'current' }) .data() .reduce(function(a, b){ return parseFloat(a || 0) + parseFloat(b || 0); }, 0); let totalBalance = api .column(6, { page: 'current' }) .data() .reduce(function(a, b){ return parseFloat(a || 0) + parseFloat(b || 0); }, 0); $('#totalPrice').html( totalPrice.toLocaleString('en-IN') ); $('#totalPaid').html( totalPaid.toLocaleString('en-IN') ); $('#totalBalance').html( totalBalance.toLocaleString('en-IN') ); } }); } // ===================================== // FILTER SUBMIT // ===================================== $('#farmerFilter').submit(function(e){ e.preventDefault(); let filters = { farmer_name: $('#farmer_name').val(), dealer_name: dealer_name, from_date: $('#from_date').val(), to_date: $('#to_date').val() }; loadTable(filters); }); </script> <?php echo view('includes/footer'); ?>