@extends('layouts/microfin_layout')
@section('title', 'MIS Yearly Plan Details')
@section('content')

@include('microfin.AopBudget.misYearlyPlan.entry.style')

<style>
    .stRowStyle td { background-color: #cfe2f3 }
    .gtRowStyle td { background-color: #9fc5e8 }
</style>

@php
    $catCount = count($samityCategories);
    // $catCount = 1; // for testing only
    $catCount > 1 ? $colspan = 2 : $colspan = 1;
@endphp

<div class="row">
<div class="col-md-12">
<div class="panel panel-default" style="background-color:#708090;">
    
    <div class="panel-heading" style="padding-bottom:0px">

        <div class="panel-options">

            <a href="{{url('/misYearlyBudget/view')}}" class="btn btn-info pull-right addViewBtn" style="margin: 10px"><i class="glyphicon glyphicon-th-list viewIcon"></i>MIS Yearly Plans</a>

            <button id="printIcon" class="btn btn-info pull-right print-icon" style="">
                <i class="fa fa-print fa-lg" aria-hidden="true"> Print </i>
            </button>

        </div>

        <div>
            <h3 style="margin: .5em 10em; text-align: center; font-family: Antiqua; letter-spacing: 2px; color: white;">Plan Details</h3>
        </div>

    </div>

    <div class="panel-body panelBodyView">

        <div id="printDivUpper">
            <div class="row" style="padding-bottom: 10px; text-align: center; vertical-align: middle; color: black; font-weight: bold; margin: 0 .5em;">
                <span style="font-size:14px;">{{ $companyInfo->name }}</span>
                <br/>
                <span style="font-size:13px;">{{ $companyInfo->address }}</span>
                <br/>
                <span style="font-size:12px;">Annual Operation Plan {{ $fiscalYears[$fiscalYearId] }} ({{ ucfirst($budgetTypes[$typeId]) }}) </span>
                <br/>
                <span style="font-size:10px; float:left">Project Name : {{ $projects[$projectId] }}</span>
                <span style="font-size:10px; float:right">Branch Name : {{ $branches[$branchId] }}</span>
                <br/>
                <span style="font-size:10px; float:left">Project Type : {{ $projectTypes[$projectTypeIdFk] }}</span>
                <span style="font-size:10px; float:right">Print Date : {{ date("d-m-Y") }}</span>                                       
            </div>                          
        </div>

        <div class="table-responsive" id="printDiv1">

            {!! Form::open(array('url' => '', 'id' => 'budget-form', 'role' => 'form')) !!}
            <table id="budgetTable" class="table table-hover table-sm table-bordered" style="color:black; border-collapse: collapse; border:1px solid ash;">
                <thead>
                    <tr>
                        <th class="w240" rowspan="2" colspan="{{$colspan+1}}">Components</th>

                        <th class="w80" rowspan="2" colspan="1">{{ $prevLastFy }}</th>
                        <th class="w80" rowspan="2" colspan="1">{{ $lastFy }}</th>

                        <th rowspan="1" colspan="13">{{ $fiscalyear }}</th>                
                        <th class="w80" rowspan="2" colspan="1">{{ $fiscalyear }}</th>
                    </tr>
                    <tr>
                        <th>Jul, {{ $partOfyear[0] }}</th>
                        <th>Aug, {{ $partOfyear[0] }}</th>
                        <th>Sep, {{ $partOfyear[0] }}</th>
                        <th>Oct, {{ $partOfyear[0] }}</th>
                        <th>Nov, {{ $partOfyear[0] }}</th>
                        <th>Dec, {{ $partOfyear[0] }}</th>

                        <th>Jan, {{ $partOfyear[1] }}</th>
                        <th>Feb, {{ $partOfyear[1] }}</th>
                        <th>Mar, {{ $partOfyear[1] }}</th>
                        <th>Apr, {{ $partOfyear[1] }}</th>
                        <th>May, {{ $partOfyear[1] }}</th>
                        <th>Jun, {{ $partOfyear[1] }}</th>
                        <th>Total</th>
                    </tr>
                </thead>

                <tbody>
                    
                    @foreach($mfnSamityCategories as $samityCatId => $samityProductCategories)
                    @foreach($samityProductCategories->productCategories as $key => $item)              
                        @php $firstProductCat = key($samityProductCategories->productCategories); @endphp   
                        {{-- @php $firstProductCat = array_key_first($samityProductCategories->productCategories); @endphp    --}}
                    @foreach($particularsName as $opKey => $opName)
                        
                        <tr>     
                            @if ($catCount > 1)
                                @if($firstProductCat == $key && $opKey == 'add') <td class="w80 text-center" rowspan="{{ $samityCatWiseProductCount[$samityProductCategories->samityCategoryId] * 7 }}">{{$samityCategories[$samityProductCategories->samityCategoryId]->categoryName}}</td>    
                                @elseif($firstProductCat == $key && $opKey == 'add') <td class="w80 text-center" rowspan="{{ $samityCatWiseProductCount[$samityProductCategories->samityCategoryId] * 7 }}">{{$samityCategories[$samityProductCategories->samityCategoryId]->categoryName}}</td>
                                @endif
                            @endif
                             

                            @if($opKey == 'add') <td class="text-left" rowspan="7" id="{{ $key }}">{{ $item['category'] }}</td> @endif
                            <td class="text-left"> {{ $particularsName[$opKey] }} </td>
                            @if($opKey == 'add') <td rowspan="6"></td> @endif
                            
                            @php
                                if($opKey == 'add') { 
                                    $prevLastFyClosing = 0;
                                    $lastFyClosing = $openingData[$key]['lastFyAdd'];
                                }
                                if($opKey == 'cancellation') { 
                                    $prevLastFyClosing = 0;
                                    $lastFyClosing = $openingData[$key]['lastFyCancellation'];
                                }
                                if($opKey == 'net') { 
                                    $prevLastFyClosing = 0;
                                    $lastFyClosing = $openingData[$key]['lastFyNet'];
                                }
                                if($opKey == 'closing') { 
                                    $prevLastFyClosing = $openingData[$key]['prevLastFyClosing'];
                                    $lastFyClosing = $openingData[$key]['lastFyClosing'];
                                }
                            @endphp
                                
                            @if($opKey == 'closing')
                                <td class="{{ $textStyle }}" id="prevLastFy_{{ $opKey }}_{{ $key }}" >{{ $prevLastFyClosing }}</td>                            
                            @endif

                            @if ($opKey == 'new_recovery' || $opKey == 'old_recovery' || $opKey == 'due_recovery')
                            <td class="{{ $textStyle }}" id="lastFy_{{ $opKey }}_{{ $key }}">0</td>
                            @else
                            <td class="{{ $textStyle }}" id="lastFy_{{ $opKey }}_{{ $key }}">{{ $lastFyClosing }}</td>
                            @endif

                            @foreach($fyMonths as $i => $month) 
                                <td class="{{ $textStyle }}" id="{{ $opKey }}_{{ $key }}_{{ $i }}">{{ $item[$opKey][$month] }}</td>
                            @endforeach

                            <td class="{{ $textStyle }}" id="total_{{ $opKey }}_{{ $key }}"></td>
                            <td class="{{ $textStyle }}" id="totalFy_{{ $opKey }}_{{ $key }}"></td>
                        </tr>

                    @endforeach {{-- particularsName --}}
                    @endforeach {{-- productCategories --}}

                        {{-- SUB TOTAL --}}
                        @if ($catCount > 1)
                            @foreach($particularsName as $opKey => $opName)
                                <tr class="level-constant stRowStyle">
                                    @if($opKey == 'add') <td rowspan="7" colspan="2" >Sub Total</td> @endif
                                    <td class="text-left" > {{ $particularsName[$opKey] }} </td>
                                    @if($opKey == 'add') <td rowspan="6" ></td> @endif
                                    
                                    @php
                                        if($opKey == 'add')          $subtotalLastFy = $samityProductCategories->totalLastFyAdd;
                                        if($opKey == 'cancellation') $subtotalLastFy = $samityProductCategories->totalLastFyCancellation;
                                        if($opKey == 'net')          $subtotalLastFy = $samityProductCategories->totalLastFyNet;
                                        if($opKey == 'closing')      $subtotalLastFy = $samityProductCategories->totalLastFyClosing;
                                        $subtotalPrevLastFyClosing = $samityProductCategories->totalPrevLastFyClosing;
                                    @endphp
                                    
                                    @if($opKey == 'closing') <td id="stotalPrevLastFy_{{ $samityCatId }}_{{ $opKey }}" class="{{ $textStyle }}">{{ number_format($subtotalPrevLastFyClosing) }}</td> @endif
                                    @if ($opKey == 'new_recovery' || $opKey == 'old_recovery' || $opKey == 'due_recovery')
                                    <td id="stotalLastFy_{{ $samityCatId }}_{{ $opKey }}" class="{{ $textStyle }}">0</td>
                                    @else
                                    <td id="stotalLastFy_{{ $samityCatId }}_{{ $opKey }}" class="{{ $textStyle }}">{{ number_format($subtotalLastFy) }}</td>
                                    @endif

                                    @for ($i = 1; $i <= 12; $i++) 
                                        <td id="sTotal_{{ $samityCatId }}_{{ $opKey }}_{{ $i }}" class="{{ $textStyle }}"></td>
                                    @endfor

                                    <td id="sTotal_{{ $samityCatId }}_{{ $opKey }}" class="{{ $textStyle }}"></td>
                                    <td id="sTotalFy_{{ $samityCatId }}_{{ $opKey }}" class="{{ $textStyle }}"></td>
                                </tr>
                            @endforeach
                        @endif
                        {{-- SUB TOTAL END --}}
                    
                    @endforeach {{-- samityCategories --}}
                    
                    {{-- GRAND TOTAL --}}
                    @foreach($particularsName as $opKey => $opName)
                        <tr class="level-constant gtRowStyle">
                            @if($opKey == 'add') <td rowspan="7" colspan="{{$colspan}}">Grand Total</td> @endif
                            <td class="text-left"> {{ $particularsName[$opKey] }} </td>
                            @if($opKey == 'add') <td rowspan="6"></td> @endif                            
                            @php
                                if($opKey == 'add')           $totalLastFy = $total_lastFy_add;                        
                                if($opKey == 'cancellation')  $totalLastFy = $total_lastFy_cancellation;                        
                                if($opKey == 'net')           $totalLastFy = $total_lastFy_net;                        
                                if($opKey == 'closing')       $totalLastFy = $total_lastFy_closing;                        
                            @endphp                            
                            @if($opKey == 'closing') <td id="totalPrevLastFy_{{ $opKey }}" class="{{ $textStyle }}">{{ $total_prevLastFy_closing }}</td> @endif
                            @if ($opKey == 'new_recovery' || $opKey == 'old_recovery' || $opKey == 'due_recovery')
                                <td id="totalLastFy_{{ $opKey }}" class="{{ $textStyle }}">0</td>
                            @else
                                <td id="totalLastFy_{{ $opKey }}" class="{{ $textStyle }}">{{ $totalLastFy }}</td>
                            @endif
                            
                            @for ($i = 1; $i <= 12; $i++) 
                                <td id="gTotal_{{ $opKey }}_{{ $i }}" class="{{ $textStyle }}"></td>
                            @endfor
                            <td id="gTotal_{{ $opKey }}" class="{{ $textStyle }}"></td>
                            <td id="gTotalFy_{{ $opKey }}" class="{{ $textStyle }}"></td>
                        </tr>
                    @endforeach
                    {{-- GRAND TOTAL END --}}
                    
                </tbody>                

            </table>
            
            {!! Form::close() !!}

        </div>

    </div>

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

<script>    

    $(document).ready(function() {

        /**
         * const getNumberFromCommaSeparatedString = (str) => {
            return (str || 0 ).toString()
            // .replace(/[^0-9]/g, '')
            .replace(/[^-0-9]/g, '')
            .replace(/(\..*)\./g, '$1').toLocaleString("en-IN")            
        }
         */
        const getNumberFromCommaSeparatedString = (str) => {
            let convertNum = (str || 0 ).toString()
            // .replace(/[^0-9]/g, '')
            .replace(/[^-0-9]/g, '')
            .replace(/(\..*)\./g, '$1').toLocaleString("en-IN");
            
            if (convertNum == '-') {
                convertNum = '0';
            }      

            return convertNum;
        }

        const convertNumberToCommaSeparetedString = (number) => {
            number = ( number || 0 ).toString()
            // .replace(/[^0-9]/g, '')
            .replace(/[^-0-9]/g, '')
            .replace(/(\..*)\./g, '$1')

            if(number == 0) return '-'

            return number.replace(/\B(?=(?:(\d\d)+(\d)(?!\d))+(?!\d))/g, ',')  
        }
        
        let particularsKeys = "{{ $particularsKeys }}".split(",")
        let productCategoryKeys = "{{ $productCategoryKeys }}".split(",").map( Number )
        
        let total_add           = new Array(productCategoryKeys.length).fill(0)
        let total_cancellation  = new Array(productCategoryKeys.length).fill(0)
        let total_net           = new Array(productCategoryKeys.length).fill(0)
        let total_closing       = new Array(productCategoryKeys.length).fill(0)
        let total_oldRecoverable       = new Array(productCategoryKeys.length).fill(0)
        let total_newRecoverable       = new Array(productCategoryKeys.length).fill(0)
        let total_dueRecoverable       = new Array(productCategoryKeys.length).fill(0)
        let total_totalRecoverable       = new Array(productCategoryKeys.length).fill(0)

        particularsKeys.forEach( opKey => {
            $(`#totalPrevLastFy_${opKey}`).text( convertNumberToCommaSeparetedString( $(`#totalPrevLastFy_${opKey}`).text() ) )                
            $(`#totalLastFy_${opKey}`).text( convertNumberToCommaSeparetedString( $(`#totalLastFy_${opKey}`).text() ) )                
            $(`#gTotal_${opKey}`).text( convertNumberToCommaSeparetedString( $(`#gTotal_${opKey}`).text() ) )                
            $(`#gTotalFy_${opKey}`).text( convertNumberToCommaSeparetedString( $(`#gTotalFy_${opKey}`).text() ) )       
            
            productCategoryKeys.forEach( (catId, index) => {
                $(`#prevLastFy_${opKey}_${catId}`).text( convertNumberToCommaSeparetedString( $(`#prevLastFy_${opKey}_${catId}`).text() ) )                
                $(`#lastFy_${opKey}_${catId}`).text( convertNumberToCommaSeparetedString( $(`#lastFy_${opKey}_${catId}`).text() ) )                
            })

            for(let i = 1; i <= 12; i++) {
                $(`#gTotal_${opKey}_${i}`).text( convertNumberToCommaSeparetedString( $(`#gTotal_${opKey}_${i}`).text() ) ) 
            }            
        })

        // calculateGrandTotal()
        
        productCategoryKeys.forEach( (catId, index) => {
            
            calculateAdd(catId)
            // calculateCancellation(catId)  
            calculateOldRecoverable(catId);
            calculateDueRecoverable(catId);
            calculateNewRecoverable(catId);
            calculateTotalRecoverable(catId);
            calculateNet(catId)
            calculateClosing(catId)
            
            for(let monthNo=1; monthNo<=12; monthNo++) {

                $(`#add_${catId}_${monthNo}`).text( convertNumberToCommaSeparetedString( $(`#add_${catId}_${monthNo}`).text() ) )
                $(`#cancellation_${catId}_${monthNo}`).text( convertNumberToCommaSeparetedString( $(`#cancellation_${catId}_${monthNo}`).text() ) )
                $(`#net_${catId}_${monthNo}`).text( convertNumberToCommaSeparetedString( $(`#net_${catId}_${monthNo}`).text() ) )
                $(`#closing_${catId}_${monthNo}`).text( convertNumberToCommaSeparetedString( $(`#closing_${catId}_${monthNo}`).text() ) )                
                $(`#new_recovery_${catId}_${monthNo}`).text( convertNumberToCommaSeparetedString( $(`#new_recovery_${catId}_${monthNo}`).text() ) )
                $(`#old_recovery_${catId}_${monthNo}`).text( convertNumberToCommaSeparetedString( $(`#old_recovery_${catId}_${monthNo}`).text() ) )
                $(`#due_recovery_${catId}_${monthNo}`).text( convertNumberToCommaSeparetedString( $(`#due_recovery_${catId}_${monthNo}`).text() ) )

            } // months loop end

        }); // category loop end

        function calculateAdd(catId){
            total_add[catId] = 0
            for(let i=1; i<=12; i++) {
                let val = $(`#add_${catId}_${i}`).text()
                total_add[catId] += ~~parseInt( getNumberFromCommaSeparatedString(val) )
            }
            $(`#total_add_${catId}`).text( convertNumberToCommaSeparetedString(total_add[catId]) )
            let lastFyVal = $(`#lastFy_add_${catId}`).text()
            let totalFyVal = ~~parseInt(total_add[catId]) + ~~parseInt( getNumberFromCommaSeparatedString(lastFyVal) )
            $(`#totalFy_add_${catId}`).text( convertNumberToCommaSeparetedString(totalFyVal) )
        }

        // function calculateCancellation(catId){
        //     total_cancellation[catId] = 0
        //     for(let i=1; i<=12; i++) {
        //         let val = $(`#cancellation_${catId}_${i}`).text()
        //         total_cancellation[catId] += ~~parseInt( getNumberFromCommaSeparatedString(val) )
        //     }
        //     $(`#total_cancellation_${catId}`).text( convertNumberToCommaSeparetedString(total_cancellation[catId]) )
        //     let lastFyVal = $(`#lastFy_cancellation_${catId}`).text()
        //     let totalFyVal = ~~parseInt(total_cancellation[catId]) + ~~parseInt( getNumberFromCommaSeparatedString(lastFyVal) )
        //     $(`#totalFy_cancellation_${catId}`).text( convertNumberToCommaSeparetedString(totalFyVal) )
        // }
        
        function calculateNet(catId){
            // total_net[catId] = 0
            for(let i=1; i<=12; i++) {
                let addVal = $(`#add_${catId}_${i}`).text()
                addVal = parseInt( getNumberFromCommaSeparatedString(addVal) )
                let cancellationVal = $(`#cancellation_${catId}_${i}`).text()
                cancellationVal = parseInt( getNumberFromCommaSeparatedString(cancellationVal) )
                let netVal = addVal - cancellationVal                
                // total_net[catId] += ~~parseInt( netVal )               
                // $(`#net_${catId}_${i}`).text( convertNumberToCommaSeparetedString(netVal) )
            }
            let totalCategoryNet = $(`#net_${catId}_12`).text(); totalCategoryNet = getNumberFromCommaSeparatedString(totalCategoryNet);
            $(`#total_net_${catId}`).text( convertNumberToCommaSeparetedString(totalCategoryNet) )
            let lastFyVal = $(`#lastFy_net_${catId}`).text()
            let totalFyVal = parseInt( getNumberFromCommaSeparatedString(lastFyVal) ) + parseInt(totalCategoryNet) 
            $(`#totalFy_net_${catId}`).text( convertNumberToCommaSeparetedString(totalFyVal) )
        }
        
        function calculateClosing(catId){
            let lastFyVal = $(`#lastFy_closing_${catId}`).text()
            lastFyVal = ~~parseInt( getNumberFromCommaSeparatedString(lastFyVal) )
            total_closing[catId] = 0
            for(let i=1; i<=12; i++) {
                let netVal = $(`#net_${catId}_${i}`).text()
                netVal = ~~parseInt( getNumberFromCommaSeparatedString(netVal) )

                let closingVal = $(`#lastFy_closing_${catId}`).text()
                if(i > 1) closingVal = $(`#closing_${catId}_${i-1}`).text()
                
                closingVal = ~~parseInt( getNumberFromCommaSeparatedString(closingVal) )
                closingVal = closingVal + netVal
                total_closing[catId] = closingVal             
                $(`#closing_${catId}_${i}`).text( convertNumberToCommaSeparetedString(closingVal) )
            }            
            $(`#total_closing_${catId}`).text( convertNumberToCommaSeparetedString(total_closing[catId]) )
            $(`#totalFy_closing_${catId}`).text( convertNumberToCommaSeparetedString(total_closing[catId]) )

            calculateGrandTotal()
        }        

        // New Recoverable
        function calculateNewRecoverable(catId){
            total_newRecoverable[catId] = 0
            for(let i=1; i<=12; i++) {
                let val = $(`#new_recovery_${catId}_${i}`).text();
                total_newRecoverable[catId] += parseInt( getNumberFromCommaSeparatedString(val) ); 
            }
            $(`#total_new_recovery_${catId}`).text( convertNumberToCommaSeparetedString(total_newRecoverable[catId]) );
            // let lastFyVal = $(`#lastFy_new_recovery_${catId}`).text();
            // let totalFyVal = parseInt(total_newRecoverable[catId]) + parseInt( getNumberFromCommaSeparatedString(lastFyVal) );
            $(`#totalFy_new_recovery_${catId}`).text( convertNumberToCommaSeparetedString(total_newRecoverable[catId]) )
        }
        // Old Recoverable
        function calculateOldRecoverable(catId){
            total_oldRecoverable[catId] = 0
            for(let i=1; i<=12; i++) {
                let val = $(`#old_recovery_${catId}_${i}`).text()
                total_oldRecoverable[catId] += parseInt( getNumberFromCommaSeparatedString(val) )
            }
            $(`#total_old_recovery_${catId}`).text( convertNumberToCommaSeparetedString(total_oldRecoverable[catId]) )
            // let lastFyVal = $(`#lastFy_old_recovery_${catId}`).text()
            // let totalFyVal = parseInt(total_oldRecoverable[catId]) + parseInt( getNumberFromCommaSeparatedString(lastFyVal) )
            $(`#totalFy_old_recovery_${catId}`).text( convertNumberToCommaSeparetedString(total_oldRecoverable[catId]) )
        }
        // Due Recoverable
        function calculateDueRecoverable(catId){
            total_dueRecoverable[catId] = 0
            for(let i=1; i<=12; i++) {
                let val = $(`#due_recovery_${catId}_${i}`).text()
                total_dueRecoverable[catId] += parseInt( getNumberFromCommaSeparatedString(val) )
            }
            $(`#total_due_recovery_${catId}`).text( convertNumberToCommaSeparetedString(total_dueRecoverable[catId]) )
            // let lastFyVal = $(`#lastFy_due_recovery_${catId}`).val()
            // let totalFyVal = parseInt(total_dueRecoverable[catId]) + parseInt( getNumberFromCommaSeparatedString(lastFyVal) )
            $(`#totalFy_due_recovery_${catId}`).text( convertNumberToCommaSeparetedString(total_dueRecoverable[catId]) )
        }

        // Total Recoverable
        function calculateTotalRecoverable(catId){
            total_totalRecoverable[catId] = 0;
            for(let i=1; i<=12; i++) {
                let dueVal = parseInt( getNumberFromCommaSeparatedString($(`#due_recovery_${catId}_${i}`).text()) );
                let oldVal = parseInt( getNumberFromCommaSeparatedString($(`#old_recovery_${catId}_${i}`).text()) );
                let newVal = parseInt( getNumberFromCommaSeparatedString($(`#new_recovery_${catId}_${i}`).text()) );
                let totalRecoverable = dueVal+oldVal+newVal;
                // $(`#total_recovery_${catId}_${i}`).val(convertNumberToCommaSeparetedString(totalRecoverable));
                $(`#cancellation_${catId}_${i}`).val(convertNumberToCommaSeparetedString(totalRecoverable));
                total_totalRecoverable[catId] += totalRecoverable;
            }
            // $(`#total_total_recovery_${catId}`).val( convertNumberToCommaSeparetedString(total_totalRecoverable[catId]) );
            $(`#total_cancellation_${catId}`).text( convertNumberToCommaSeparetedString(total_totalRecoverable[catId]) );
            let lastFyVal = $(`#lastFy_cancellation_${catId}`).text(); 
            let totalFyVal = parseInt(total_totalRecoverable[catId]) + parseInt( getNumberFromCommaSeparatedString(lastFyVal) );
            $(`#totalFy_cancellation_${catId}`).text( convertNumberToCommaSeparetedString(totalFyVal) );
        }
        
        function calculateGrandTotal() {                        
            let GTotalAdd = 0 
            let GTotalCancellation = 0
            let GTotalNet = 0
            let GTotalClosing = 0
            let GTotalNew_recovery = 0;
            let GTotalOld_recovery = 0;
            let GTotalDue_recovery = 0;

            let S2TotalAdd = 0 
            let S2TotalCancellation = 0
            let S2TotalNet = 0
            let S2TotalClosing = 0
            let S2TotalNew_recovery = 0;
            let S2TotalOld_recovery = 0;
            let S2TotalDue_recovery = 0;

            for(let i=1; i<=12; i++) {

                let gTotalAdd = 0 
                let gTotalCancellation = 0
                let gTotalNet = 0
                let gTotalClosing = 0
                let gTotalNew_recovery = 0;
                let gTotalOld_recovery = 0;
                let gTotalDue_recovery = 0;

                let s2TotalAdd = 0 
                let s2TotalCancellation = 0
                let s2TotalNet = 0
                let s2TotalClosing = 0
                let s2TotalNew_recovery = 0;
                let s2TotalOld_recovery = 0;
                let s2TotalDue_recovery = 0;

                productCategoryKeys.forEach( (catId, index) => {
                    let addVal = $(`#add_${catId}_${i}`).text()
                    addVal     = ~~parseInt( getNumberFromCommaSeparatedString(addVal) )
                    gTotalAdd  += addVal
                    GTotalAdd  += addVal

                    // let cancellationVal = $(`#cancellation_${catId}_${i}`).text()
                    // cancellationVal     = ~~parseInt( getNumberFromCommaSeparatedString(cancellationVal) )
                    // gTotalCancellation  += cancellationVal
                    // GTotalCancellation  += cancellationVal
                    
                    let netVal = $(`#net_${catId}_${i}`).text()
                    netVal     = ~~parseInt( getNumberFromCommaSeparatedString(netVal) )
                    gTotalNet  += netVal
                    GTotalNet  += netVal
                    
                    let closingVal = $(`#closing_${catId}_${i}`).text()
                    closingVal     = ~~parseInt( getNumberFromCommaSeparatedString(closingVal) )
                    gTotalClosing  += closingVal
                    GTotalClosing  = gTotalClosing

                    // recovery
                    let new_recovery = $(`#new_recovery_${catId}_${i}`).text();
                    new_recovery = parseInt( getNumberFromCommaSeparatedString(new_recovery) );
                    gTotalNew_recovery +=new_recovery;
                    GTotalNew_recovery +=gTotalNew_recovery;

                    let old_recovery = $(`#old_recovery_${catId}_${i}`).text();
                    old_recovery = parseInt( getNumberFromCommaSeparatedString(old_recovery) );
                    gTotalOld_recovery +=old_recovery;
                    GTotalOld_recovery +=gTotalOld_recovery;

                    let due_recovery = $(`#due_recovery_${catId}_${i}`).text();
                    due_recovery = parseInt( getNumberFromCommaSeparatedString(due_recovery) );
                    gTotalDue_recovery +=due_recovery;
                    GTotalDue_recovery +=gTotalDue_recovery;

                    // Sub-total Calculation
                    if( catId == 2 || catId == 17 ) {
                        s2TotalAdd += addVal
                        // s2TotalCancellation += cancellationVal
                        s2TotalNet += netVal
                        s2TotalClosing += closingVal
                        s2TotalNew_recovery +=new_recovery;
                        s2TotalOld_recovery +=old_recovery;
                        s2TotalDue_recovery +=due_recovery;

                        S2TotalAdd += addVal
                        // S2TotalCancellation += cancellationVal
                        S2TotalNet += netVal
                        S2TotalClosing = closingVal
                        S2TotalNew_recovery +=new_recovery
                        S2TotalOld_recovery +=old_recovery
                        S2TotalDue_recovery +=due_recovery
                    }  
                })
                
                // Sub-total Calculation
                $(`#sTotal_1_add_${i}`).text( convertNumberToCommaSeparetedString( gTotalAdd - s2TotalAdd ) )
                // $(`#sTotal_1_cancellation_${i}`).text( convertNumberToCommaSeparetedString( gTotalCancellation - s2TotalCancellation ) )
                $(`#sTotal_1_net_${i}`).text( convertNumberToCommaSeparetedString( gTotalNet - s2TotalNet ) )
                $(`#sTotal_1_closing_${i}`).text( convertNumberToCommaSeparetedString( gTotalClosing - s2TotalClosing ) )
                $(`#sTotal_2_add_${i}`).text( convertNumberToCommaSeparetedString( s2TotalAdd ) )
                // $(`#sTotal_2_cancellation_${i}`).text( convertNumberToCommaSeparetedString( s2TotalCancellation ) )
                $(`#sTotal_2_net_${i}`).text( convertNumberToCommaSeparetedString( s2TotalNet ) )
                $(`#sTotal_2_closing_${i}`).text( convertNumberToCommaSeparetedString( s2TotalClosing ) )

                $(`#sTotal_1_new_recovery_${i}`).text( convertNumberToCommaSeparetedString( parseInt( getNumberFromCommaSeparatedString(gTotalNew_recovery)) - parseInt( getNumberFromCommaSeparatedString(s2TotalNew_recovery)) ) );
                $(`#sTotal_1_old_recovery_${i}`).text( convertNumberToCommaSeparetedString( parseInt( getNumberFromCommaSeparatedString(gTotalOld_recovery)) - parseInt( getNumberFromCommaSeparatedString(s2TotalOld_recovery)) ) );
                $(`#sTotal_1_due_recovery_${i}`).text( convertNumberToCommaSeparetedString( parseInt( getNumberFromCommaSeparatedString(gTotalDue_recovery)) - parseInt( getNumberFromCommaSeparatedString(s2TotalDue_recovery)) ) );
                $(`#sTotal_2_new_recovery_${i}`).text( convertNumberToCommaSeparetedString( parseInt( getNumberFromCommaSeparatedString(s2TotalNew_recovery)) ) );
                $(`#sTotal_2_old_recovery_${i}`).text( convertNumberToCommaSeparetedString( parseInt( getNumberFromCommaSeparatedString(s2TotalOld_recovery)) ) )
                $(`#sTotal_2_due_recovery_${i}`).text( convertNumberToCommaSeparetedString( parseInt( getNumberFromCommaSeparatedString(s2TotalDue_recovery)) ) )

                // // total recovery
                let s2TotalTotal_recovery = parseInt( getNumberFromCommaSeparatedString(s2TotalNew_recovery))+parseInt( getNumberFromCommaSeparatedString(s2TotalOld_recovery))+parseInt( getNumberFromCommaSeparatedString(s2TotalDue_recovery));
                let gTotalTotal_recovery = parseInt( getNumberFromCommaSeparatedString(gTotalNew_recovery))+parseInt( getNumberFromCommaSeparatedString(gTotalOld_recovery))+parseInt( getNumberFromCommaSeparatedString(gTotalDue_recovery)); 
                // $(`#sTotal_1_total_recovery_${i}`).text( convertNumberToCommaSeparetedString( gTotalTotal_recovery -s2TotalTotal_recovery ) );
                // $(`#sTotal_2_total_recovery_${i}`).text( convertNumberToCommaSeparetedString( s2TotalTotal_recovery ) );
                $(`#sTotal_1_cancellation_${i}`).text( convertNumberToCommaSeparetedString( gTotalTotal_recovery -s2TotalTotal_recovery ) );
                $(`#sTotal_2_cancellation_${i}`).text( convertNumberToCommaSeparetedString( s2TotalTotal_recovery ) );

                // Grand-total Calculation
                $(`#gTotal_add_${i}`).text( convertNumberToCommaSeparetedString( gTotalAdd ) )
                // $(`#gTotal_cancellation_${i}`).text( convertNumberToCommaSeparetedString( gTotalCancellation ) )
                $(`#gTotal_net_${i}`).text( convertNumberToCommaSeparetedString( gTotalNet ) )
                $(`#gTotal_closing_${i}`).text( convertNumberToCommaSeparetedString( gTotalClosing ) )
                $(`#gTotal_new_recovery_${i}`).text( convertNumberToCommaSeparetedString( gTotalNew_recovery ) );
                $(`#gTotal_old_recovery_${i}`).text( convertNumberToCommaSeparetedString( gTotalOld_recovery ) );
                $(`#gTotal_due_recovery_${i}`).text( convertNumberToCommaSeparetedString( gTotalDue_recovery ) );
                
                let gTotal_recovery = parseInt( getNumberFromCommaSeparatedString(gTotalDue_recovery))+parseInt( getNumberFromCommaSeparatedString(gTotalNew_recovery))+parseInt( getNumberFromCommaSeparatedString(gTotalOld_recovery));
                // $(`#gTotal_total_recovery_${i}`).text( convertNumberToCommaSeparetedString( gTotal_recovery ) )
                $(`#gTotal_cancellation_${i}`).text( convertNumberToCommaSeparetedString( gTotal_recovery ) )
           
            }

            // // subtotal calculation recovery
            let S1TotalNewRecovary = 0;
            let S1TotalOldRecovary = 0;
            let S1TotalDueRecovary = 0;
            let S2TotalNewRecovary = 0;
            let S2TotalOldRecovary = 0;
            let S2TotalDueRecovary = 0;
            for(let i=1; i<=12; i++) {
                S1TotalNewRecovary+= parseInt( getNumberFromCommaSeparatedString( $(`#sTotal_1_new_recovery_${i}`).text()) );
                S1TotalOldRecovary+= parseInt( getNumberFromCommaSeparatedString( $(`#sTotal_1_old_recovery_${i}`).text()) );
                S1TotalDueRecovary+= parseInt( getNumberFromCommaSeparatedString( $(`#sTotal_1_due_recovery_${i}`).text()) );
                S2TotalNewRecovary+= parseInt( getNumberFromCommaSeparatedString( $(`#sTotal_2_new_recovery_${i}`).text()) );
                S2TotalOldRecovary+= parseInt( getNumberFromCommaSeparatedString( $(`#sTotal_2_old_recovery_${i}`).text()) );
                S2TotalDueRecovary+= parseInt( getNumberFromCommaSeparatedString( $(`#sTotal_2_due_recovery_${i}`).text()) );
            }
            $(`#sTotal_1_new_recovery`).text( convertNumberToCommaSeparetedString( S1TotalNewRecovary) );
            $(`#sTotal_1_old_recovery`).text( convertNumberToCommaSeparetedString( S1TotalOldRecovary ) );
            $(`#sTotal_1_due_recovery`).text( convertNumberToCommaSeparetedString( S1TotalDueRecovary ) );
            $(`#sTotal_2_new_recovery`).text( convertNumberToCommaSeparetedString( S2TotalNewRecovary ) );
            $(`#sTotal_2_old_recovery`).text( convertNumberToCommaSeparetedString( S2TotalOldRecovary ) );
            $(`#sTotal_2_due_recovery`).text( convertNumberToCommaSeparetedString( S2TotalDueRecovary ) );
            let S1TotalRecovery =  parseInt( getNumberFromCommaSeparatedString(S1TotalNewRecovary))+ parseInt( getNumberFromCommaSeparatedString(S1TotalOldRecovary))+ parseInt( getNumberFromCommaSeparatedString(S1TotalDueRecovary));
            let S2TotalRecovery = parseInt( getNumberFromCommaSeparatedString(S2TotalNewRecovary))+parseInt( getNumberFromCommaSeparatedString(S2TotalOldRecovary))+parseInt( getNumberFromCommaSeparatedString(S2TotalDueRecovary));
            $(`#sTotal_1_cancellation`).text( convertNumberToCommaSeparetedString( S1TotalRecovery ) );
            $(`#sTotal_2_cancellation`).text( convertNumberToCommaSeparetedString( S2TotalRecovery ) );

            // Sub-total Calculation
            $(`#sTotal_1_add`).text( convertNumberToCommaSeparetedString( GTotalAdd - S2TotalAdd ) )
            // $(`#sTotal_1_cancellation`).text( convertNumberToCommaSeparetedString( GTotalCancellation - S2TotalCancellation ) )
            $(`#sTotal_1_net`).text( convertNumberToCommaSeparetedString( GTotalNet - S2TotalNet ) )
            var opening_1 = $(`#stotalLastFy_1_closing`).text(); opening_1 = ~~parseInt( getNumberFromCommaSeparatedString(opening_1));
            var add_1 = $(`#sTotal_1_add`).text(); add_1 = ~~parseInt( getNumberFromCommaSeparatedString(add_1));
            var cancellation_1 = $(`#sTotal_1_cancellation`).text(); cancellation_1 = ~~parseInt( getNumberFromCommaSeparatedString(cancellation_1));
            var closing_1 = (opening_1+add_1) - cancellation_1;
            $(`#sTotal_1_closing`).text( convertNumberToCommaSeparetedString( closing_1 ) );
            // $(`#sTotal_1_closing`).text( convertNumberToCommaSeparetedString( GTotalClosing - S2TotalClosing ) )
            
            $(`#sTotal_2_add`).text( convertNumberToCommaSeparetedString( S2TotalAdd ) )
            // $(`#sTotal_2_cancellation`).text( convertNumberToCommaSeparetedString( S2TotalCancellation ) )
            $(`#sTotal_2_net`).text( convertNumberToCommaSeparetedString( S2TotalNet ) )
            var opening_2 = $(`#stotalLastFy_2_closing`).text(); opening_2 = ~~parseInt( getNumberFromCommaSeparatedString(opening_2));
            var add_2 = $(`#sTotal_2_add`).text(); add_2 = ~~parseInt( getNumberFromCommaSeparatedString(add_2));
            var cancellation_2 = $(`#sTotal_2_cancellation`).text(); cancellation_2 = ~~parseInt( getNumberFromCommaSeparatedString(cancellation_2));
            var closing_2 = (opening_2+add_2) - cancellation_2;
            $(`#sTotal_2_closing`).text( convertNumberToCommaSeparetedString( closing_2 ) )
            // $(`#sTotal_2_closing`).text( convertNumberToCommaSeparetedString( S2TotalClosing ) )

            // Grand-total Calculation
            $(`#gTotal_add`).text( convertNumberToCommaSeparetedString( GTotalAdd ) )
            // $(`#gTotal_cancellation`).text( convertNumberToCommaSeparetedString( GTotalCancellation ) )
            let gTotalNetVal =  $('#gTotal_net_12').text(); gTotalNetVal = parseInt(getNumberFromCommaSeparatedString(gTotalNetVal));
            $(`#gTotal_net`).text( convertNumberToCommaSeparetedString( gTotalNetVal ) )
            $(`#gTotal_closing`).text( convertNumberToCommaSeparetedString( GTotalClosing ) )

            //  grand total recovery calculation 
            let GTotalNewRecovary = 0;
            let GTotalOldRecovary = 0;
            let GTotalDueRecovary = 0;
            for(let i=1; i<=12; i++) {
                GTotalNewRecovary+= parseInt( getNumberFromCommaSeparatedString( $(`#gTotal_new_recovery_${i}`).text()) );
                GTotalOldRecovary+= parseInt( getNumberFromCommaSeparatedString( $(`#gTotal_old_recovery_${i}`).text()) );
                GTotalDueRecovary+= parseInt( getNumberFromCommaSeparatedString( $(`#gTotal_due_recovery_${i}`).text()) );
            }
            $(`#gTotal_new_recovery`).text( convertNumberToCommaSeparetedString( GTotalNewRecovary ) )
            $(`#gTotal_old_recovery`).text( convertNumberToCommaSeparetedString( GTotalOldRecovary ) )
            $(`#gTotal_due_recovery`).text( convertNumberToCommaSeparetedString( GTotalDueRecovary ) )
            let GTotal_recovery = parseInt( getNumberFromCommaSeparatedString(GTotalNewRecovary))+parseInt( getNumberFromCommaSeparatedString(GTotalOldRecovary))+parseInt( getNumberFromCommaSeparatedString(GTotalDueRecovary));
            $(`#gTotal_cancellation`).text( convertNumberToCommaSeparetedString( GTotal_recovery ) )

            let totalLastFy_add = $(`#totalLastFy_add`).text()
            totalLastFy_add = ~~parseInt( getNumberFromCommaSeparatedString(totalLastFy_add) )

            let totalLastFy_cancellation = $(`#totalLastFy_cancellation`).text()
            totalLastFy_cancellation = ~~parseInt( getNumberFromCommaSeparatedString(totalLastFy_cancellation) )

            let totalLastFy_net = $(`#totalLastFy_net`).text()
            totalLastFy_net = ~~parseInt( getNumberFromCommaSeparatedString(totalLastFy_net) )

            let totalLastFy_closing = $(`#totalLastFy_closing`).text()
            totalLastFy_closing = ~~parseInt( getNumberFromCommaSeparatedString(totalLastFy_closing) )

            $(`#gTotalFy_add`).text( convertNumberToCommaSeparetedString( totalLastFy_add + GTotalAdd ) )
            // $(`#gTotalFy_cancellation`).text( convertNumberToCommaSeparetedString( totalLastFy_cancellation + GTotalCancellation ) )
            $(`#gTotalFy_net`).text( convertNumberToCommaSeparetedString( totalLastFy_net + gTotalNetVal ) )
            $(`#gTotalFy_closing`).text( convertNumberToCommaSeparetedString( GTotalClosing ) )                        
            // $(`#gTotalFy_closing`).text( convertNumberToCommaSeparetedString( totalLastFy_closing + GTotalClosing ) )    
            $(`#gTotalFy_new_recovery`).text( convertNumberToCommaSeparetedString( GTotalNewRecovary ) )  
            $(`#gTotalFy_old_recovery`).text( convertNumberToCommaSeparetedString( GTotalOldRecovary ) )  
            $(`#gTotalFy_due_recovery`).text( convertNumberToCommaSeparetedString( GTotalDueRecovary ) )  
            let GTotalFY_recovery = parseInt( getNumberFromCommaSeparatedString(GTotalNewRecovary))+parseInt( getNumberFromCommaSeparatedString(GTotalOldRecovary))+parseInt( getNumberFromCommaSeparatedString(GTotalDueRecovary));
            $(`#gTotalFy_cancellation`).text( convertNumberToCommaSeparetedString( totalLastFy_cancellation +GTotalFY_recovery ) )  
            
            // Sub-total fy Calculation
            var sTotal_1_add_total = 0;
            // var sTotal_1_cancellation_total = 0;
            var sTotal_1_net_total = 0;
            var sTotal_1_closing_total = 0;
            var sTotal_2_add_total = 0;
            // var sTotal_2_cancellation_total = 0;
            var sTotal_2_net_total = 0;
            var sTotal_2_closing_total = 0;
            let sTotal_1_new_recovery = 0;
            let sTotal_1_old_recovery = 0;
            let sTotal_1_due_recovery = 0;
            let sTotal_2_new_recovery = 0;
            let sTotal_2_old_recovery = 0;
            let sTotal_2_due_recovery = 0;
            for (let i=1; i <= 12; i++) {
                sTotal_1_add_total += parseInt($(`#sTotal_1_add_${i}`).text());
                // sTotal_1_cancellation_total += parseInt($(`#sTotal_1_cancellation_${i}`).text());
                sTotal_1_net_total += parseInt($(`#sTotal_1_net_${i}`).text());
                sTotal_1_closing_total += parseInt($(`#sTotal_1_closing_${i}`).text());
                sTotal_2_add_total += parseInt($(`#sTotal_2_add_${i}`).text());
                // sTotal_2_cancellation_total += parseInt($(`#sTotal_2_cancellation_${i}`).text());
                sTotal_2_net_total += parseInt($(`#sTotal_2_net_${i}`).text());
                sTotal_2_closing_total += parseInt($(`#sTotal_2_closing_${i}`).text());
            }

            stotalLastFy_1_add =  $(`#stotalLastFy_1_add`).text(); stotalLastFy_1_add = ~~parseInt( getNumberFromCommaSeparatedString(stotalLastFy_1_add));
            sTotal_1_add =  $(`#sTotal_1_add`).text(); sTotal_1_add = ~~parseInt( getNumberFromCommaSeparatedString(sTotal_1_add));
            // stotalLastFy_1_cancellation =  $(`#stotalLastFy_1_cancellation`).text(); stotalLastFy_1_cancellation = ~~parseInt( getNumberFromCommaSeparatedString(stotalLastFy_1_cancellation));
            // sTotal_1_cancellation =  $(`#sTotal_1_cancellation`).text(); sTotal_1_cancellation = ~~parseInt( getNumberFromCommaSeparatedString(sTotal_1_cancellation));
            stotalLastFy_1_net = $(`#stotalLastFy_1_net`).text(); stotalLastFy_1_net = ~~parseInt( getNumberFromCommaSeparatedString(stotalLastFy_1_net));
            sTotal_1_net = $(`#sTotal_1_net`).text(); sTotal_1_net = ~~parseInt( getNumberFromCommaSeparatedString(sTotal_1_net));
            stotalLastFy_1_closing = $(`#sTotal_1_closing`).text(); stotalLastFy_1_closing = ~~parseInt( getNumberFromCommaSeparatedString(stotalLastFy_1_closing));
            $(`#sTotalFy_1_add`).text(convertNumberToCommaSeparetedString( stotalLastFy_1_add + sTotal_1_add ));
            // $(`#sTotalFy_1_cancellation`).text(convertNumberToCommaSeparetedString( stotalLastFy_1_cancellation + sTotal_1_cancellation ));
            $(`#sTotalFy_1_net`).text(convertNumberToCommaSeparetedString( stotalLastFy_1_net + sTotal_1_net ));
            $(`#sTotalFy_1_closing`).text(convertNumberToCommaSeparetedString( stotalLastFy_1_closing ));
            $(`#sTotalFy_1_new_recovery`).text(convertNumberToCommaSeparetedString( $(`#sTotal_1_new_recovery`).text() ));
            $(`#sTotalFy_1_old_recovery`).text(convertNumberToCommaSeparetedString( $(`#sTotal_1_old_recovery`).text() ));
            $(`#sTotalFy_1_due_recovery`).text(convertNumberToCommaSeparetedString( $(`#sTotal_1_due_recovery`).text() ));
            let s1TotalRecovery = parseInt( getNumberFromCommaSeparatedString($(`#stotalLastFy_1_cancellation`).text())) + parseInt( getNumberFromCommaSeparatedString($(`#sTotal_1_cancellation`).text()));
            $(`#sTotalFy_1_cancellation`).text(convertNumberToCommaSeparetedString( s1TotalRecovery ));

            stotalLastFy_2_add =  $(`#stotalLastFy_2_add`).text(); stotalLastFy_2_add = ~~parseInt( getNumberFromCommaSeparatedString(stotalLastFy_2_add));
            sTotal_2_add =  $(`#sTotal_2_add`).text(); sTotal_2_add = ~~parseInt( getNumberFromCommaSeparatedString(sTotal_2_add));
            // stotalLastFy_2_cancellation =  $(`#stotalLastFy_2_cancellation`).text(); stotalLastFy_2_cancellation = ~~parseInt( getNumberFromCommaSeparatedString(stotalLastFy_2_cancellation));
            // sTotal_2_cancellation =  $(`#sTotal_2_cancellation`).text(); sTotal_2_cancellation = ~~parseInt( getNumberFromCommaSeparatedString(sTotal_2_cancellation));
            stotalLastFy_2_net = $(`#stotalLastFy_2_net`).text(); stotalLastFy_2_net = ~~parseInt( getNumberFromCommaSeparatedString(stotalLastFy_2_net));
            sTotal_2_net = $(`#sTotal_2_net`).text(); sTotal_2_net = ~~parseInt( getNumberFromCommaSeparatedString(sTotal_2_net));
            stotalLastFy_2_closing = $(`#sTotal_2_closing`).text(); stotalLastFy_2_closing = ~~parseInt( getNumberFromCommaSeparatedString(stotalLastFy_2_closing));
            $(`#sTotalFy_2_add`).text(convertNumberToCommaSeparetedString(stotalLastFy_2_add + sTotal_2_add ));
            // $(`#sTotalFy_2_cancellation`).text(convertNumberToCommaSeparetedString( stotalLastFy_2_cancellation + sTotal_2_cancellation ));
            $(`#sTotalFy_2_net`).text(convertNumberToCommaSeparetedString( stotalLastFy_2_net + sTotal_2_net ));
            $(`#sTotalFy_2_closing`).text(convertNumberToCommaSeparetedString( stotalLastFy_2_closing ));
            $(`#sTotalFy_2_new_recovery`).text(convertNumberToCommaSeparetedString( $(`#sTotal_2_new_recovery`).text() ));
            $(`#sTotalFy_2_old_recovery`).text(convertNumberToCommaSeparetedString( $(`#sTotal_2_old_recovery`).text() ));
            $(`#sTotalFy_2_due_recovery`).text(convertNumberToCommaSeparetedString( $(`#sTotal_2_due_recovery`).text() ));
            let s2TotalRecovery = parseInt( getNumberFromCommaSeparatedString($(`#stotalLastFy_2_cancellation`).text())) + parseInt( getNumberFromCommaSeparatedString($(`#sTotal_2_cancellation`).text()));
            $(`#sTotalFy_2_cancellation`).text(convertNumberToCommaSeparetedString( s2TotalRecovery ));
        
        }        
    }); // ready function end
</script>

<script>
    $("#printIcon").click(function(event) {
        var printStyle = `        
            <style type="text/css">
                #budgetTable {
                    float: left;
                    height: auto;
                    padding: 0px;
                    width: 100%;
                    font-size: 11px;
                    border: 1pt solid ash;
                    page-break-inside: auto;
                    font-family: arial !important;
                }

                table {
                    width: 100%;
                    border-collapse: collapse;
                }

                table, th, td {
                    border: 1pt solid ash;
                }

                thead tr th {
                    text-align: center;
                    vertical-align: middle;
                    padding: 3px;
                    font-size: 11px;
                }
                
                tr {
                    page-break-inside: avoid;
                    page-break-after: auto
                }               

                .text-left {
                    text-align: left !important;
                    padding-left: 5px !important;
                }
                .text-right {
                    text-align: right !important;
                    padding-right: 5px !important;
                }
                .text-center {
                    text-align: center !important;
                    padding-left: 5px !important;
                    padding-right: 5px !important;
                }
            </style>
            <style media="print">
                table {
                    width: 100%;
                    border-collapse: collapse;
                }
                table, th, td {
                    border: 1pt solid ash;
                }
                #budgetTable {
                    float: left;
                    height: auto;
                    padding: 0px;
                    width: 100%;
                    font-size: 11px;
                    border: 1pt solid ash;
                    page-break-inside: auto;
                    font-family: arial !important;
                }
                .text-left {
                    text-align: left !important;
                    padding-left: 5px !important;
                }
                .text-right {
                    text-align: right !important;
                    padding-right: 5px !important;
                }
                .text-center {
                    text-align: center !important;
                    padding-left: 5px !important;
                    padding-right: 5px !important;
                }
                @page {
                    size: landscape;
                    margin: 10mm 10mm;
                }
            </style>
            <style type="text/css">
                @media print {
                    .element-that-contains-table {
                        overflow: visible !important;
                    }
                    #budgetTable {
                        float: left;
                        height: auto;
                        padding: 0px;
                        width: 100%;
                        font-size: 11px;
                        border: 1pt solid ash;
                        page-break-inside: auto;
                        font-family: arial !important;
                    }
                    table {
                        width: 100%;
                        border-collapse: collapse;
                    }
                    table, th, td {
                        border: 1pt solid ash;
                    }
                    table {
                        border: solid #000 !important;
                        border-width: 1px 0 0 1px !important;
                    }
                    th, td {
                        border: solid #000 !important;
                        border-width: 0 1px 1px 0 !important;
                    }
                    .text-left {
                        text-align: left !important;
                        padding-left: 5px !important;
                    }
                    .text-right {
                        text-align: right !important;
                        padding-right: 5px !important;
                    }
                    .text-center {
                        text-align: center !important;
                        padding-left: 5px !important;
                        padding-right: 5px !important;
                    }
                }
            </style>
            <style>
                @page: first {
                    tr:nth-of-type(4n) {
                        page-break-after: always;
                    }
                }
            </style> 
        `

        var mainContentsUpper = document.getElementById("printDivUpper").innerHTML
        var mainContents1 = document.getElementById("printDiv1").innerHTML
        var headerContents = ''
        var footerContents = "<div class='row' style='font-size:12px; padding-left:5px; padding-top:20px;'>Prepared By <span style='display:inline-block; width: 35%; padding-top:40px;'></span> Checked By <span style='display:inline-block; width: 34%; padding-right:15px; padding-top:40px;'></span>Approved By</div>"
        var printContents = '<div id="order-details-wrapper" style="padding: 10px;">' + headerContents + mainContentsUpper+printStyle+'<div>'+mainContents1+'</div>'+footerContents

        var win = window.open('','printwindow')
        win.document.write(printContents)
        win.print()
        win.close()
    });
</script>

@endsection