<style> table.dataTable tfoot th { font-weight: 600 !important; } </style> <div class="wraper responsive-width"> <main class="long-tbl-main" id="main"> <!-- admin template section --> <div class="admin_tempblock"> <div class="admin_tempsec"> <div class="admin_sec"> <div class="subsec_sec" style="display:block"> <div class="subject_lsec dashboard_graph report_sec_graph"> <div class="report_sec_cover"> <div class="report_sec_left"> <?php $currency_symbol = $school_info['currency_symbol']; ?> </div> <div class="subject_lhead">Recent Transactions</div> <?php $search_course_id = (isset($search_course_id) && $search_course_id != 0) ? $search_course_id : ''; $search_feetype = (isset($search_feetype) && !empty($search_feetype)) ? $search_feetype : ''; $search_start_paid_date = (isset($search_start_paid_date) && !empty($search_start_paid_date)) ? date('Y-m-d', strtotime($search_start_paid_date)) : ''; $search_end_paid_date = (isset($search_end_paid_date) && !empty($search_end_paid_date)) ? date('Y-m-d', strtotime($search_end_paid_date)) : ''; ?> <form action="<?= base_url(); ?>admin/report-recent-transactions" method="POST"> <div class="top-filter report_filter"> <div class="filter_lbl"> <i class="fas fa-filter"></i> Filter </div> <div class="subject-filter"> <label>Select Fees Type</label> <select id="fees_type" name="by_feetype" class=" form-control"> <option value="">Select Fees Type</option> <?php $feetype_list = (isset($feetype_list) && !empty($feetype_list)) ? $feetype_list : 0; if ($feetype_list != 0) { foreach ($feetype_list as $f_value) { $f_selected = ($f_value['feetype_name'] == $search_feetype) ? 'selected' : ''; ?> <option value="<?php echo $f_value['feetype_name'] ?>" <?= $f_selected ?>><?php echo $f_value['feetype_name'] ?> </option> <?php } } ?> </select> </div> <div class="subject-filter"> <label>Select Course</label> <select class="form-control" name="by_course_id" id="course"> <option value=''>Select Course </option> <?php $course_list = (isset($course_list) && !empty($course_list)) ? $course_list : 0; if ($course_list != 0) { foreach ($course_list as $c_value) { $c_selected = ($c_value['id'] == $search_course_id) ? 'selected' : ''; ?> <option value="<?php echo $c_value['id'] ?>" <?= $c_selected ?>><?php echo $c_value['course_name'] ?> </option> <?php } } ?> </select> </div> <div class="date-filter"> <div class="date-fil-row"> <label>Select Start Date</label> <input type="text" name="by_start_paid_date" class="form-control nepal-date" value="<?php echo $search_start_paid_date; ?>" placeholder='dd-mm-yyyy'> </div> </div> <div class="date-filter"> <div class="date-fil-row"> <label>Select End Date</label> <input type="text" name="by_end_paid_date" class="form-control nepal-date" value="<?php echo $search_end_paid_date; ?>" placeholder='dd-mm-yyyy'> </div> </div> <div class="filter-reset"> <input type="submit" name="filtersubmit" id="filter_reset1" class="btn btn-success" value="filter"> <a href="<?php echo base_url() ?>admin/report-recent-transactions"> <button type="button" name="reset_filter" id="reset_filter" value="reset_filter" class="subject_addbtn subject_addbtn_nobg"><i class="fas fa-redo"></i>Reset</button></a> </div> </div> </form> <!-- tab added --> <!-- new divs added --> <div class="tab-content"> <!-- new divs added --> <div class="applicnts-list-wrap "> <div class=" "> <!-- changed ID --> <table id="tbl1" class="display table-responsive"> <thead> <tr> <th>S.No</th> <th>StudentID</th> <th>Student Name</th> <th>Course</th> <th>Inovice No.</th> <th>Payment Type</th> <!-- <th>Scholarship / Discount</th> <th>Fine</th> --> <th>Amount</th> <th>Paid Date</th> <th>Status</th> <th>Action</th> </tr> </thead> <tbody> <?php $rowscount = (isset($student_fees) && !empty($student_fees)) ? count($student_fees) : 0; if ($rowscount > 0) { $sno = 1; foreach ($student_fees as $ft_value) { // echo '<pre>'; // print_r($ft_value); ?> <tr> <td><?= $sno; ?></td> <td><?= $ft_value['studentId']; ?></td> <td><?= $ft_value['name']; ?></td> <td><?php $course_id = $ft_value['course']; echo $courseName = $this->db->get_where('course', array('id' => $course_id))->row()->course_name; ?></td> <td> <div class="applicn-date"> <?php if ($school_info['invoice_prefix_status'] == 1 && !empty($ft_value['invoice_no'])) echo $school_info['invoice_prefix'] . $ft_value['invoice_no']; else echo $ft_value['invoice_no']; // $ft_value['txn_id']; ?> </div> </td> <td> <?php if ($ft_value['course_fee_id'] != 0) $feeTypeName = $this->db->get_where('course_fees', array('id' => $ft_value['course_fee_id']))->row()->fee_values; else $feeTypeName = "-"; ?> <div class="applicant_nme"><?= $feeTypeName . '<br>(' . $ft_value['payment_for'] . ')'; ?></div> </td> <!-- <td><?= $ft_value['deduction_amount']; ?></td> <td><?= $ft_value['fine_amount']; ?></td> --> <td><?= $ft_value['payment_amt'] - $ft_value['deduction_amount'] + $ft_value['fine_amount']; ?></td> <td> <div class="date_width" title="<?= $ft_value['payment_date']; ?>"><?= $ft_value['payment_date']; ?> </td> <td><label><?= $ft_value['status']; ?></label></td> <td> <div class="sub_tabbtnsec"> <div class="sub_viewbtn" title="View"><a href="<?= base_url(); ?>admin/invoice/<?= urlsafe_b64encode($ft_value['studentId']) ?>/<?= urlsafe_b64encode($ft_value['txn_id']) ?>/<?= urlsafe_b64encode(0) ?> "><i class="fa fa-eye" aria-hidden="true"></i></a></div> </div> </td> </tr> <?php $sno++; } } ?> <tfoot> <tr> <th colspan="6" style="text-align:right">Total Fees:</th> <th colspan="4"></th> </tr> </tfoot> </tbody> </table> </div> </div> </div> </div> </div> </div> </div> </div> <!-- admin template section end --> </main> <!--End right-top side--> </div> <script> $(document).ready(function() { $('.user-drpdown').click(function() { $('.drpdown-items').toggle(); }); var currency_symbol = "<?php echo $currency_symbol; ?>"; //table js $('#tbl1').DataTable({ "lengthMenu": [ [100, -1], [100, "All"] ], "dom": 'lBfrtip', "buttons": [{ extend: 'pdfHtml5', // orientation: 'landscape', exportOptions: { columns: [0, 1, 2, 3, 4, 5, 6, 7, 8], }, orientation: 'landscape', pageSize: 'A4' }, { extend: 'csvHtml5', exportOptions: { columns: [0, 1, 2, 3, 4, 5, 6, 7, 8] } }, ], "footerCallback": function(row, data, start, end, display) { var api = this.api(), data; // Remove the formatting to get integer data for summation var intVal = function(i) { return typeof i === 'string' ? i.replace(/[\$,]/g, '') * 1 : typeof i === 'number' ? i : 0; }; // Total over all pages total = api .column(6) .data() .reduce(function(a, b) { return intVal(a) + intVal(b); }, 0); // Total over this page pageTotal = api .column(6, { page: 'current' }) .data() .reduce(function(a, b) { return intVal(a) + intVal(b); }, 0); // Update footer $(api.column(6).footer()).html( currency_symbol + ' ' + pageTotal + ' ( ' + currency_symbol + ' ' + total + ' total )' ); } }); $('#tbl2').DataTable({ "lengthMenu": [ [5, 10, 25, 50, -1], [5, 10, 25, 50, "All"] ] }); $('#tbl3').DataTable({ "lengthMenu": [ [5, 10, 25, 50, -1], [5, 10, 25, 50, "All"] ] }); //table js end //multiple select js start $('select').selectpicker(); //multiple select js end }); </script> <script> var graph_data = <?= json_encode($graph_data); ?>; console.log(graph_data); Highcharts.setOptions({ lang: { drillUpText: '<< Back' } }); Highcharts.chart('recoveryGraf', { chart: { type: 'pie' }, title: { text: '' }, plotOptions: { series: { dataLabels: { enabled: true, format: '{point.name}: {point.y:.1f}' } } }, tooltip: { headerFormat: '<span style="font-size:11px">{series.name}</span><br>', pointFormat: '<span style="color:{point.color}">{point.name}</span>: <b>{point.y:.2f}</b> of total<br/>' }, series: [{ name: 'Fee Report', colorByPoint: true, colors: ['#032da1', '#133ba7', '#2449ad', '#3557b3', '#4665ba', '#5773c0', '#6781c6', '#788fcd', '#899dd3'], data: [ <?php foreach ($graph_data as $v) { echo "['" . $v['typename'] . "'," . $v['total'] . "],\n"; } ?> ] }], drilldown: { series: [{ name: 'Recycleds', id: 'Recycleds', colors: ['#032da1', '#133ba7', '#2449ad', '#3557b3', '#4665ba', '#5773c0', '#6781c6', '#788fcd', '#899dd3'], data: [ <?php foreach ($graph_data as $v) { echo "['" . $v['typename'] . "'," . $v['total'] . "],\n"; } ?> ] }] } }); </script> </body> </html>