 @extends('adminlte::page') @section('content')
 <?php Fun::lang() ?>
 <div class="title-page">
     <div class="page-bar">
         <ul class="page-breadcrumb">
             <li><a href="#"><i class="fa fa-dashboard"></i> Dashboard</a></li>
             <li><a href="#">Report Project Owner</a></li>
             <li><a href="#">Report Commission</a></li>
         </ul>
     </div>
 </div>
 <div class="page">

     <div class="top-content">
         <div class="row">
             <div class="col-sm-12 col-xs-12">
                 <div class="title-add">
                     <div class="pull-left">
                         <h3>Report Commission</h3>
                     </div>
                 </div>

             </div>
         </div>
     </div>

     <form action="{{url('realty/reports-commission-report-print')}}" method="POST">
         @csrf
         <div class="form-search">
             <div class="row">
                 <div class="col-xs-12 col-sm-3 col-md-3">
                     <div class="form-group">
                         <strong>Item Code</strong>
                         {!! Form::select('item_name', $items, null, ['class' => 'form-control select2 form-control item_name']) !!}
                     </div>
                 </div>
                 <div class="col-xs-12 col-sm-3 col-md-3">
                     <div class="form-group">
                         <strong>Project Name</strong>
                         {!! Form::select('project_name', $projects, null, ['class' => 'form-control select2 form-control project_name']) !!}
                     </div>
                 </div>
                 <div class="col-xs-12 col-sm-3 col-md-3">
                     <div class="form-group">
                         <strong>Category Name</strong>
                         {!! Form::select('category_name', $category, null, ['class' => 'form-control select2 form-control category_name']) !!}
                     </div>
                 </div>
                 <div class="col-xs-12 col-sm-4 col-md-4">
                     <div class="form-group">
                     </div>
                 </div>
                 <div class="col-xs-12 col-sm-12 col-md-12 text-right">
                     <button type="button" class="button_primary btn-sm search" onclick="searching()">
                         <span class="fa fa-search"> Search</span></button>&nbsp
                     @can('Commission-Agency-Report-Print')
                     <button type="submit" class="button_primary btn-sm search"><span class="fa fa-print"> Print</span></button>
                     @endcan
                 </div>
             </div>
         </div>
         {!! Form::close() !!}
         <div class="box-body table-responsive">
             <table id="datatable_report_commision" class="table table-striped table-bordered table-hover nowrap">
                 <thead>
                     <tr>
                         <th>No</th>
                         <th>Agency</th>
                         <th>Project</th>
                         <th>Category</th>
                         <th>Item Code</th>
                         <th>Commission</th>
                         <th>Amount</th>
                         <th>Receive</th>
                         <th>Balance</th>
                         <th>Balance(%)</th>
                     </tr>
                 </thead>
                 <tbody class="tbody">

                 </tbody>
                 <tfoot class="tfoot">
                     <tr>
                         <td colspan="6" class="text-right">Total :</td>
                         <td></td>
                         <td></td>
                         <td></td>
                         <td></td>
                     </tr>
                 </tfoot>
             </table>
         </div>
 </div>

 @endsection @section('js')

 <script type="text/javascript" src="{{asset('assets/controller/report-commission-administrator.js')}}"></script>

 <script type="text/javascript">
     function searching() {

         var item_name = $('.item_name').val();
         var project_name = $('.project_name').val();
         var category_name = $('.category_name').val();
         var table = '';
         var i = 0;
         var total_sale_amount = 0;
         var total_sale_receive = 0;
         var total_sale_balance = 0;
         $('.tbody').empty();
         $('.tfoot').empty();
         $.ajax({
             method: 'POST',
             dataType: 'json',
             url: '/realty/datatable_get_reports_commission',
             async: false,
             data: {

                 _token: '{{ csrf_token() }}',
                 item_name: item_name,
                 project_name: project_name,
                 category_name: category_name,
             },
             success: function(response) {
                 $.each(response, function(index, val) {
                     var agency = val.full_name + " (" + val.user_code + ")";
                     var balances = 0;
                     var balance = val.amount - val.receive;
                     if (balance <= 0) {
                         balances = 0;
                     } else {
                         balances = balance;
                     }
                     var balances_per = 0;
                     var balance = val.amount - val.receive;
                     var ba_per = balance * 100 / val.amount;
                     if (balance <= 0) {
                         balances_per = 0;
                     } else {
                         balances_per = ba_per;
                     }
                     i++;
                     table += "<tr class='remove'>" +
                         "<td style='text-align: center;'>" + i + "</td>" +
                         "<td>" + agency + "</td>" +
                         "<td>" + val.project_name + "</td>" +
                         "<td>" + val.category_name + "</td>" +
                         "<td>" + val.item_name + "</td>" +
                         "<td>" + val.commission + " %</td>" +
                         "<td style='text-align: right;'>$ " + parseFloat(val.amount).toFixed(2).replace(/\d(?=(\d{3})+\.)/g, '$&,') + "</td>" +
                         "<td style='text-align: right;'>$ " + parseFloat(val.receive).toFixed(2).replace(/\d(?=(\d{3})+\.)/g, '$&,') + "</td>" +
                         "<td style='text-align: right;'>$ " + parseFloat(balances).toFixed(2).replace(/\d(?=(\d{3})+\.)/g, '$&,') + "</td>" +
                         "<td style='text-align: right;'>" + parseFloat(balances_per).toFixed(2).replace(/\d(?=(\d{3})+\.)/g, '$&,') + " %</td>" +
                         "</tr>";

                     total_sale_amount += parseFloat(val.amount);
                     total_sale_receive += parseFloat(val.receive);
                     total_sale_balance += parseFloat(balances);
                 });

                 $('.dataTables_filter').hide();
                 $('.dataTables_info').hide();
                 $('.pagination').hide();
                 $('.dataTables_length').hide();
                 var tfoot = `<tr>
                            <td colspan="6" class="text-right">Total : </td>
                            <td style='text-align: right;'>$${parseFloat(total_sale_amount).toFixed(2).replace(/\d(?=(\d{3})+\.)/g, '$&,')}</td>
                            <td style='text-align: right;'>$${parseFloat(total_sale_receive).toFixed(2).replace(/\d(?=(\d{3})+\.)/g, '$&,')}</td>
                            <td style='text-align: right;'>$${parseFloat(total_sale_balance).toFixed(2).replace(/\d(?=(\d{3})+\.)/g, '$&,')}</td>
                            <td style='text-align: right;'></td>
                          </tr>`;

                 $('.tbody').append(table);
                 $('.tfoot').append(tfoot);

             },

         });
     }
 </script>
 @endsection