@extends('Admin/layout')
@section('title','Commission Calculation')
@section('content')
@if(has_permission('Report','Brokerage Calculation'))
<div class="container-fluid">
    <div class="row">
        <div class="col-lg-12">
            <div class="card">
                <div class="card-header">
                <h4 class="card-title mb-0 flex-grow-1">Commission Calculation </h4>
          
                <form action="{{route('visitportal.CommissionCalculationNew')}}" class="g-3" method="post" >
                        {{csrf_field()}}
                        <div class="row" >
                            <div class="col-md-2" >
                                <label for="validationDefault01" class="form-label">Month Name</label>
                                <select class="single-select form-control" id="monthname" name="monthname">
                                        <option value="" >Select Month Name</option>
                                        @if(!empty($month_names))
                                            @foreach($month_names as $key => $value)
                                                <option value="{{$value}}" {{$monthname == $value ? 'selected' : ''}} >{{$value}}</option>
                                            @endforeach
                                        @endif
                                        
                                </select>
                            </div>
                            <div class="col-md-2" >
                                <label for="validationDefault01" class="form-label">Year</label>
                                <select class="single-select form-control" id="year" name="year">
                                        <option value="" >Select Year</option>
                                        @if($start_year != "")
                                            @for($i = date("Y"); $i >= $start_year ; $i--)
                                                <option value="{{$i}}" {{$year == $i ? 'selected' : ''}}  >{{$i}}</option>
                                            @endfor
                                        @endif
                                        
                                </select>
                            </div>


                            <div class="col-md-1">
                                <div class="form-group" style="margin-top: 6px;">
                                    <input id="btnsearch" type="submit" name="submitbtn" class="form-control btn btn-primary"  style="margin-top: 20px;width:100%" value="View">
                                </div>
                            </div>
                            <div class="col-md-1">
                                <div class="form-group" style="margin-top: 6px;">
                                    <input id="btnsearch" type="submit" name="submitbtn" class="form-control  btn btn-success"  style="margin-top: 20px;width:100%" value="Export">
                                </div>
                            </div>
                            <div class="col-md-4"></div>
                            <div class="col-md-2" style="    text-align: right;">
                                <div class="form-group" style="margin-top: 6px;">
                                    <button id="btnsearch" type="button" name="submitbtn1" class="form-control  btn btn-danger"  data-bs-toggle="modal" data-bs-target=".bs-example-modal-center" style="margin-top: 20px;">Calculate</button>
                                     <input id="btnsearchcalculate" style="display:none;" type="submit" name="submitbtn" class="form-control btn btn-primary"  style="margin-top: 20px;width:100%" value="Calculate">
                                </div>
                            </div>
                        </div>
                        </form>
                </div>
            </div>
        </div>
        <div class="col-xl-12">
            <div class="card">
              

                <div class="card-body">
                    <div class="live-preview">
                        <div class="table-responsive table-card mb-1 p-3" style="width:100%;">
                            <table class="table table-md table-striped align-middle table-nowrap mb-0" id="yourDataTableId" style="width:100%;">
                                <thead class="table-dark">
                                    <tr>
                                        <th scope="col">S.No</th>
                                        <th scope="col">Associate Name</th>
                                        <th scope="col">Gk code</th>
                                        <th scope="col">Rera no</th>
                                        <th scope="col">Level</th>
                                        <th scope="col">Team Name</th>
                                        <th scope="col">Slab</th>
                                        <th scope="col">Extra Slab</th>
                                        <th scope="col">Dr Comm</th>
                                        <th scope="col">Dr Oth Comm</th>
                                        <th scope="col">Dr Ex Comm</th>
                                        <th scope="col">Totat Dr Comm</th>
                                        <th scope="col">InDr Comm</th>
                                        <th scope="col">InDr Oth Comm</th>
                                        <th scope="col">InDr Ex Comm</th>
                                        <th scope="col">Total InDr Comm</th>
                                        <th scope="col">Total OverAll Comm</th>
                                        <th scope="col">Month PersonalSale</th>
                                        <th scope="col">Month TeamSale</th>
                                        <th scope="col">Month Total Sale</th>
                                        <th scope="col">Total Personal Sale</th>
                                        <th scope="col">Total TeamSale</th>
                                        <th scope="col">OverAll TotalSale</th>
                                        
                                        
                                    </tr>
                                </thead>
                              
                                <tbody>
                                    @if($GetAdminCommissionSummaryReport)
                                        @foreach($GetAdminCommissionSummaryReport as $key => $value)
                                            <tr onclick="getSummaryDetails('{{$value->AssociateId}}','Both','{{$endDate}}')"  data-bs-toggle="modal" data-bs-target=".bs-example-modal-xl">
                                                <td>{{$key + 1}}</td>
                                                <td>{{$value->AssociateName}}</td>
                                                <td>{{$value->gk_code}}</td>
                                                <td>{{$value->rera_no}}</td>
                                                <td>{{$value->Level}}</td>
                                                <td>{{$value->TeamName}}</td>
                                                <td>{{$value->Slab}}</td>
                                                <td>{{$value->ExtraSlab}}</td>
                                                <td>{{$value->Dr_Comm}}</td>
                                                <td>{{$value->Dr_Oth_Comm}}</td>
                                                <td>{{$value->Dr_Ex_Comm}}</td>
                                                <td>{{$value->Total_Dr_Comm}}</td>
                                                <td>{{$value->InDr_Comm}}</td>
                                                <td>{{$value->InDr_Oth_Comm}}</td>
                                                <td>{{$value->InDr_Ex_Comm}}</td>
                                                <td>{{$value->Total_InDr_Comm}}</td>
                                                <td>{{$value->Total_OverAll_Comm}}</td>
                                                <td>{{$value->m_PersonalSale}}</td>
                                                <td>{{$value->m_TeamSale}}</td>
                                                <td>{{$value->m_TotalSale}}</td>
                                                <td>{{$value->TotalPersonalSale}}</td>
                                                <td>{{$value->TotalTeamSale}}</td>
                                                <td>{{$value->OverAll_TotalSale}}</td>
                                            </tr>
                                        @endforeach
                                    @endif
                            
                                    
                                </tbody>
                                <tfoot>
                               
                                <tr>
                                    <th style="text-align:right">Total:</th>
                                   
                                    <th></th> 
                                    <th></th> 
                                    <th></th> 
                                    <th></th> 
                                    <th></th> 
                                    <th></th> 
                                    <th></th> 
                                    <th></th> 
                                    <th></th> 
                                    <th></th> 
                                    <th></th> 
                                    <th></th> 
                                    <th></th> 
                                    <th></th> 
                                    <th></th> 
                                    <th></th> 
                                    <th></th> 
                                    <th></th> 
                                    <th></th> 
                                    <th></th> 
                                    <th></th> 
                                    <th></th> 
                                </tr>
                            </tfoot>

                                
                            </table>
                            <!-- end table -->
                        </div>
                        <!-- end table responsive -->
                    </div>
                    
                </div><!-- end card-body -->
            </div><!-- end card -->
        </div><!-- end col -->
    </div>
</div>
<div class="modal fade bs-example-modal-center" tabindex="-1" aria-labelledby="mySmallModalLabel" aria-hidden="true" style="display: none;">
    <div class="modal-dialog modal-dialog-centered">
        <div class="modal-content">
            <div class="modal-body text-center p-5">
                
                <div class="mt-4">
                    <h4 class="mb-3">Are you sure want to calculate commission ?</h4>
                    <p class="text-muted mb-4"> If You calculate previous month commission. then calculate all monthc commssion again till current month. </p>
                    <div class="hstack gap-2 justify-content-center">
                        <button type="button" class="btn btn-light" data-bs-dismiss="modal">Close</button>
                        <a id="yescalculate" onclick="yescalculate()" class="btn btn-danger">Calculate</a>
                    </div>
                </div>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div>
<div class="modal fade bs-example-modal-xl" tabindex="-1" aria-labelledby="myExtraLargeModalLabel" aria-hidden="true" >
    <div class="modal-dialog modal-xl modal-dialog-scrollable">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="myExtraLargeModalLabel">Summary Details</h5>
                <input id="btnsearchbutton" type="button" name="submitbtnbutton" onclick="exportchilddata()" class="form-control  btn btn-success"  style="margin-top: 20px;width:100px" value="Export">
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">
                 <div id="summarydetails">
                       <div class="row">
                        <div class="col-lg-4">
                            <div class="mt-4 mt-lg-0">
                                <div class="form-check form-check-inline">
                                    <input class="form-check-input" type="radio" name="saletype" id="inlineRadio1" value="Direct">
                                    <label class="form-check-label" for="inlineRadio1">Direct</label>
                                </div>
                                <div class="form-check form-check-inline">
                                    <input class="form-check-input" type="radio" name="saletype" id="inlineRadio2" value="InDirect">
                                    <label class="form-check-label" for="inlineRadio2">InDirect</label>
                                </div>
                                <div class="form-check form-check-inline">
                                    <input class="form-check-input" type="radio" name="saletype" id="inlineRadio3" value="Both" checked>
                                    <label class="form-check-label" for="inlineRadio3">Both</label>
                                </div>
                            </div>
                        </div>
                       </div>
                       <input type="hidden" id="child_associate_id"/>
                        <input type="hidden" id="child_sale_type"/>
                         <input type="hidden" id="child_date"/>
                        <div class="live-preview">
                                        <div class="table-responsive">
                                            <table class="table align-middle table-nowrap mb-0" id="yourDataTableIdsummary" style="width:100%;">
                                                <thead >
                                                   <tr>
                                                    <th>FromAssociateName</th>
                                                    <th>gk_code</th>
                                                    <th>rera_no</th>
                                                     <th>SchemeName</th>
                                                    <th>plot_name</th>
                                                    <th>brokergeable_size</th>
                                                    <th>BookingDate</th>
                                                    <th>AllotmentDate</th>
                                                    <th>dayDiff</th>
                                                    <th>Commi_Slab</th>
                                                    <th>ExCommi_Slab</th>
                                                    <th>SlabDiff</th>
                                                    <th>ExtraSlabDiff</th>

                                                    <th>Commission</th>
                                                    <th>ExComm</th>
                                                    <th>OthComm</th>
                                                    <th>TotalComm</th>
                                                    <th>QtyGiven</th>
                                                    <th>SaleType</th>
                                                    <th>CompanyName</th>
                                                   
                                                    <th>GiveExtraCommission</th>
                                                    <th>EligibleForComission</th>
                                                    <th>allowDayDiffCommission</th>
                                                    
                                                   </tr>
                                                </thead>
                                                <tbody class="summarydetailsbody">
                                                    
                                                </tbody>
                                                   <tfoot>
                                                    <tr>
                                                        <th style="text-align:right">Total:</th>
                                                    
                                                        <th></th> 
                                                        <th></th> 
                                                        <th></th> 
                                                        <th></th> 
                                                        <th></th> 
                                                        <th></th> 
                                                        <th></th> 
                                                        <th></th> 
                                                        <th></th> 
                                                        <th></th> 
                                                        <th></th> 
                                                        <th></th> 
                                                        <th></th> 
                                                        <th></th> 
                                                        <th></th> 
                                                        <th></th> 
                                                        <th></th> 
                                                        <th></th> 
                                                        <th></th> 
                                                        <th></th> 
                                                        <th></th> 
                                                        <th></th> 
                                                        <th></th> 
                                                    </tr>
                                                </tfoot>
                                            </table>
                                        </div>
                                    </div>
                                    <input type="hidden" id="associate_id" />
                                     <input type="hidden" id="enddate" />
                 </div>
             
            </div>
            <div class="modal-footer">
                <a href="javascript:void(0);" class="btn btn-link link-success shadow-none fw-medium" data-bs-dismiss="modal"><i class="ri-close-line me-1 align-middle"></i> Close</a>
                <!-- <button type="button" class="btn btn-primary ">Save changes</button> -->
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div>
<style>
    .table-striped>tbody>tr:nth-of-type(odd)>* {
    --vz-table-color-type: #212529;
    --vz-table-bg-type: #bbd5eeff;
    }


</style>

<link href="https://cdn.datatables.net/2.0.8/css/dataTables.dataTables.css" rel="stylesheet" type="text/css" />
<script src="{{ URL::asset('assets/js/jquery.min.js') }}"></script>
<script src="https://cdn.datatables.net/2.0.8/js/dataTables.js"></script>



<script>
function yescalculate(){
    $(".bs-example-modal-center").modal('hide');
    $("#btnsearchcalculate").click();
}
$(document).ready(function() {
    $('#yourDataTableIdsummary1').DataTable({
        // scrollX: true,
        // paging: true,
        // order: [],
        // footerCallback: function (row, data, start, end, display) {
        //     var api = this.api();
            
        //     var intVal = function (i) {
        //         return typeof i === 'string' ?
        //             i.replace(/[\$,]/g, '')*1 :
        //             typeof i === 'number' ? i : 0;
        //     };

        //     var colsToSum = [6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22];

        //     colsToSum.forEach(function(colIdx) {
        //         var total = api.column(colIdx, {page:'current'}).data()
        //             .reduce(function(a,b){ return intVal(a)+intVal(b); },0);
        //         $(api.column(colIdx).footer()).html(total.toFixed(2));
        //     });
        // }
    });
});

$(document).ready(function() {
    $('#yourDataTableId').DataTable({
        scrollX: true,
        paging: true,
        order: [],
        footerCallback: function (row, data, start, end, display) {
            var api = this.api();

            var intVal = function (i) {
                return typeof i === 'string' ?
                    i.replace(/[\$,]/g, '').replace(/,/g,'')*1 :
                    typeof i === 'number' ? i : 0;
            };

            var formatNumber = function(num) {
                return num.toLocaleString('en-IN', {minimumFractionDigits: 2, maximumFractionDigits: 2});
            };

            var colsToSum = [8,9,10,11,12,13,14,15,16,17,20];


            colsToSum.forEach(function(colIdx) {
                var pageTotal = api.column(colIdx, { page: 'current' }).data()
                    .reduce(function(a,b){ return intVal(a) + intVal(b); },0);

                var overallTotal = api.column(colIdx).data()
                    .reduce(function(a,b){ return intVal(a) + intVal(b); },0);

                $(api.column(colIdx).footer()).html(
                    formatNumber(pageTotal) + ' (' + formatNumber(overallTotal) + ')'
                );
            });
        }
    });
});
 $("input[name=saletype][value='Both']").prop("checked", true);
function getSummaryDetails(associate_id,sale_type,enddate){

    $("#child_associate_id").val(associate_id);
    $("#child_sale_type").val(sale_type);
    $("#child_date").val(enddate);

    //$('#yourDataTableIdsummary').DataTable().columns.adjust();
    $(".summarydetailsbody").html("");
    $(".summarydetailshead").html("");
    $("#associate_id").val(associate_id);
    $("#enddate").val(enddate);
    var thead = '';
    var bodydatahtml = '';
    var datastring = {
    "_token": "{{ csrf_token() }}",
        associate_id : associate_id,
        sale_type : sale_type,
        enddate : enddate
    };
    $.ajax({
        type:'POST',
        cache: false,
        url:"{{route('visitportal.CommissionCalculationDetails')}}",
        dataType: "json",
        data:datastring,
        success:function(data) {
         
        if(data.data.length > 0){
         
                    for (let index = 0; index < data.data.length; index++) {
                        // if(index == 0){
                        //      var columkeys = Object.keys(data.data[index]);
                        //     if(columkeys.length > 0){
                        //         thead += '<tr>';
                        //         var theadth = '';
                        //         for (let index1 = 0; index1 < columkeys.length; index1++) {
                        //             theadth += '<th>'+(columkeys[index1])+'</th>';
                        //         }
                        //         thead += theadth+'</tr>';
                        //     }
                        //     $(".summarydetailshead").append(thead);
                        // }
                         
                         bodydatahtml += '<tr>';
                        var bodydata = data.data[index];
                         
                         bodydatahtml += '<td>'+bodydata.FromAssociateName+'</td><td>'+bodydata.gk_code+'</td><td>'+bodydata.rera_no+'</td><td>'+bodydata.SchemeName+'</td><td>'+bodydata.plot_name+'</td><td>'+bodydata.brokergeable_size+'</td><td>'+bodydata.BookingDate+'</td><td>'+bodydata.AllotmentDate+'</td><td>'+bodydata.dayDiff+'</td><td>'+bodydata.Commi_Slab+'</td><td>'+bodydata.ExCommi_Slab+'</td><td>'+bodydata.SlabDiff+'</td><td>'+bodydata.ExtraSlabDiff+'</td><td>'+bodydata.Commission+'</td><td>'+bodydata.ExComm+'</td><td>'+bodydata.OthComm+'</td><td>'+bodydata.TotalComm+'</td><td>'+bodydata.QtyGiven+'</td><td>'+bodydata.SaleType+'</td><td>'+bodydata.CompanyName+'</td><td>'+bodydata.GiveExtraCommission+'</td><td>'+bodydata.EligibleForComission+'</td><td>'+bodydata.allowDayDiffCommission+'</td>';
                                
                         bodydatahtml += '</tr>';
                       
                        
                    }
                   
                    $(".summarydetailsbody").append(bodydatahtml);
                    $('.bs-example-modal-xl').modal('show');
                }
        }
    });
    
}

$(document).ready(function() {
    // Select all radio buttons within the form and bind the 'change' event
    $("input[name='saletype']").on("change", function() {
        // 'this' refers to the specific radio button that was just checked
        var selectedValue = $(this).val();
        var associate_id =  $("#associate_id").val();
        var enddate = $("#enddate").val();
        getSummaryDetails(associate_id,selectedValue,enddate);
        
       
    });
});

function exportchilddata(){
    var associate_id = $("#child_associate_id").val();
    var sale_type = $("#child_sale_type").val();
    var enddate = $("#child_date").val();
     var datastring = {
        "_token": "{{ csrf_token() }}",
            associate_id : associate_id,
            sale_type : sale_type,
            enddate : enddate,
            type: 'Export'
        };
    $.ajax({
       url:"{{route('visitportal.CommissionCalculationDetails')}}",
        type: 'POST',
        xhrFields: {
            responseType: 'blob' // Required to handle binary data
        },
        success: function (response, status, xhr) {
            // Create a URL for the blob data
            var blob = new Blob([response], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' });
            var downloadUrl = URL.createObjectURL(blob);
            
            // Create a temporary anchor element to trigger the download
            var a = document.createElement("a");
            a.href = downloadUrl;
            a.download = "users.xlsx"; // Desired file name
            document.body.appendChild(a);
            a.click();
            
            // Clean up
            URL.revokeObjectURL(downloadUrl);
            $(a).remove();
        },
        error: function () {
            alert('Download failed. Please try again.');
        }
    });
}

</script>


@endif

@endsection