@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 Accounting</a></li>
            <li><a href="#">Report Receivable Note</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 Receivable Note</h3>
                    </div>
                </div>

            </div>
        </div>
    </div>
    <form action="{{url('realty/report-note-receivable-print')}}" method="POST">
        @csrf
        <div class="form-search">
            <div class="col-xs-12 col-sm-3 col-md-3">
                <div class="form-group">
                    <strong>Project Name</strong>
                    {!! Form::select('project_name', $project, null, ['class' => 'form-control select2 form-control project_name']) !!}
                </div>
            </div>
            <div class="row">
                <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('Accounting-Report-Receivable-Print')
                    <button type="submit" class="button_primary btn-sm search"><span class="fa fa-print"> Print</span></button>
                    @endcan
                </div>
            </div>
        </div>
    </form>
    <div class="box-body table-responsive">
        <table id="note-receivable-accounting" class="table table-striped table-bordered table-hover nowrap">
            <thead>
                <tr>
                    <th>No</th>
                    <th>Project Code</th>
                    <th>Project Name</th>
                    <th>Commission Amount</th>
                    <th>Commission Available</th>
                    <th>Commission Received</th>
                    <th>Commission Owe</th>
                </tr>
            </thead>
            <tbody class="tbody">

            </tbody>
            <tfoot class="tfoot">
                <tr>
                    <td colspan="3" style="text-align:right;">Total :</td>
                    <td></td>
                    <td></td>
                    <td></td>
                    <td></td>
                </tr>
            </tfoot>
        </table>
    </div>
</div>
<script type="text/javascript">
    function searching() {

        var project_name = $('.project_name').val();
        var table = '';
        var i = 0;
        var commission_amount = 0;
        var commission_available = 0;
        var commission_received = 0;
        var commission_owe = 0;
        $('.tbody').empty();
        $('.tfoot').empty();
        $.ajax({
            method: 'POST',
            dataType: 'json',
            url: '/realty/report-note-receivable-accounting',
            async: false,
            data: {

                _token: '{{ csrf_token() }}',
                project_name: project_name,
            },
            success: function(response) {
                $.each(response, function(index, val) {
                    var total_owe = val.commission_available - val.commission_received;
                    i++;
                    table += "<tr class='remove'>" +
                        "<td style='text-align: center;'>" + i + "</td>" +
                        "<td>" + val.project_code + "</td>" +
                        "<td>" + val.project_name + "</td>" +
                        "<td style='text-align: right;'>$" + parseFloat(val.commission_amount).toFixed(2).replace(/\d(?=(\d{3})+\.)/g, '$&,') + "</td>" +
                        "<td style='text-align: right;'>$" + parseFloat(val.commission_available).toFixed(2).replace(/\d(?=(\d{3})+\.)/g, '$&,') + "</td>" +
                        "<td style='text-align: right;'>$" + parseFloat(val.commission_received).toFixed(2).replace(/\d(?=(\d{3})+\.)/g, '$&,') + "</td>" +
                        "<td style='text-align: right;'>$" + parseFloat(total_owe).toFixed(2).replace(/\d(?=(\d{3})+\.)/g, '$&,') + "</td>" +
                        "</tr>";

                    commission_amount += parseFloat(val.commission_amount);
                    commission_available += parseFloat(val.commission_available);
                    commission_received += parseFloat(val.commission_received);
                    commission_owe += parseFloat(total_owe);
                });

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

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

            },

        });
    }
</script>
@endsection
@section('js')
<script type="text/javascript" src="{{ asset('assets/controller/report-receivable-note-administrator.js') }}"></script>
@endsection