@extends('layouts.microfin_layout')
@section('title', '| Achievement Report')
@section('content')
@include('successMsg')

<style>
    .ui-datepicker-calendar {
        display: none;
    }
</style>


<div class="row">
    <div class="col-md-12">
        <div class="" style="">
            <div class="">
                <div class="panel panel-default" style="background-color:#708090;">
                    <div class="panel-heading" style="padding-bottom:0px">
                        <div class="panel-options">
                            <button id="printIcon" class="btn btn-info pull-left print-icon" target="_blank" style="">
                                <i class="fa fa-print fa-lg" aria-hidden="true"> Print</i>
                            </button>
                            <button id="btnExportExcel" class="btn btn-info pull-center print-icon"  target="_blank" style="">
                                <i class="fa-file-excel-o fa-lg" aria-hidden="true"> Excel</i>
                            </button>
                            <button id="btnExportPdf" class="btn btn-info pull-right print-icon" target="_blank"style="">
                                <i class="fa-file-excel-o fa-lg" aria-hidden="true"> Pdf</i>
                            </button>
                        </div>
                        <h3 style=" text-align: center; font-family: Antiqua; letter-spacing: 2px; color: white;">Achievement Report (Branch Wise)</h3>
                    </div>
                    <div class="panel-body panelBodyView">
                        <!-- Filtering Start-->
                        {!! Form::open(array('url' => 'AchievementReportView/', 'role' => 'form', 'class'=>'form-horizontal form-groups', 'id' => 'filterFormId', 'method'=>'get')) !!}

                        <div class="row">
                            <div class="col-md-12">
                                {{-- Start of report level --}}
                                <div class="col-md-2">
                                    <div class="form-group">
                                        <div class="col-md-12">
                                            {!! Form::label('', 'Report Level:', ['class' => 'control-label pull-left',
                                            'style' => 'color:black']) !!}
                                        </div>
                                        <div class="col-md-12">
                                            {!! Form::select('filReportLevel',$reportLevelList, null
                                            ,['id'=>'filReportLevel','class'=>'form-control
                                            input-sm','autocomplete'=>'off', 'autofocus']) !!}
                                        </div>
                                    </div>
                                </div>
                                {{-- end of report level --}}

                                {{-- Start of report level --}}
                                <div class="col-md-2" id="areaDiv" style="display: none;">
                                    <div class="form-group">
                                        <div class="col-md-12">
                                            {!! Form::label('', 'Area:', ['class' => 'control-label pull-left', 'style'
                                            => 'color:black']) !!}
                                        </div>
                                        <div class="col-md-12">
                                            <select id="filArea" name="filArea" class="form-control input-sm"
                                                style="color: black">
                                                <option value="">--All--</option>
                                                @foreach ($areaList as $area)
                                                <option value="{{$area->id}}">{{$area->name}}</option>
                                                @php
                                                $barnchIds = str_replace(['"','[',']'], '', $area->branchId);
                                                $barnchIds = explode(',', $barnchIds);
                                                $branches = DB::table('gnr_branch')
                                                ->whereIn('id',$barnchIds)
                                                ->select(DB::raw("CONCAT ( LPAD(branchCode,3,0) ,' - ', name ) AS
                                                name"))
                                                ->get();
                                                @endphp
                                                @foreach ($branches as $branch)
                                                <option value="" disabled="disabled">&nbsp {{$branch->name}}</option>
                                                @endforeach
                                                @endforeach
                                            </select>
                                        </div>
                                    </div>
                                </div>
                                {{-- end of report level --}}

                                {{-- start of zone level --}}
                                <div class="col-md-2" id="zoneDiv" style="display: none;">
                                    <div class="form-group">
                                        <div class="col-md-12">
                                            {!! Form::label('', 'Zone:', ['class' => 'control-label pull-left', 'style'
                                            => 'color:black']) !!}
                                        </div>
                                        <div class="col-md-12">
                                            <select id="filZone" name="filZone" class="form-control input-sm"
                                                style="color: black">
                                                <option value="">--All--</option>
                                                @foreach ($zoneList as $zone)
                                                <option value="{{$zone->id}}">{{$zone->name}}</option>
                                                @php
                                                $areaIds = str_replace(['"','[',']'], '', $zone->areaId);
                                                $areaIds = explode(',', $areaIds);
                                                $areas = DB::table('gnr_area')
                                                ->whereIn('id',$areaIds)
                                                ->select(DB::raw("CONCAT ( LPAD(code,3,0) ,' - ', name ) AS name"))
                                                ->get();
                                                @endphp
                                                @foreach ($areas as $area)
                                                <option value="" disabled="disabled">&nbsp {{$area->name}}</option>
                                                @endforeach
                                                @endforeach
                                            </select>

                                        </div>
                                    </div>
                                </div>
                                {{-- End of zone level --}}

                                {{-- Start of region level --}}
                                <div class="col-md-2" id="regionDiv" style="display: none;">
                                    <div class="form-group">
                                        <div class="col-md-12">
                                            {!! Form::label('', 'Division:', ['class' => 'control-label pull-left',
                                            'style' => 'color:black']) !!}
                                        </div>
                                        <div class="col-md-12">
                                            <select id="filRegion" name="filRegion" class="form-control input-sm"
                                                style="color: black">
                                                <option value="">--All--</option>
                                                @foreach ($regionList as $region)
                                                <option value="{{$region->id}}">{{$region->name}}</option>
                                                @php
                                                $zoneIds = str_replace(['"','[',']'], '', $region->zoneId);
                                                $zoneIds = explode(',', $zoneIds);
                                                $zones = DB::table('gnr_zone')
                                                ->whereIn('id',$zoneIds)
                                                ->select(DB::raw("CONCAT ( LPAD(code,3,0) ,' - ', name ) AS name"))
                                                ->get();
                                                @endphp
                                                @foreach ($zones as $zone)
                                                <option value="" disabled="disabled">&nbsp {{$zone->name}}</option>
                                                @endforeach
                                                @endforeach
                                            </select>
                                        </div>
                                    </div>
                                </div>
                                {{-- End of region level --}}

                                {{-- Start of branch level --}}
                                <div class="col-md-2" id="branchDiv">
                                    <div class="form-group">
                                        <div class="col-md-12">
                                            {!! Form::label('', 'Branch:', ['class' => 'control-label pull-left',
                                            'style' => 'color:black']) !!}
                                        </div>
                                        <div class="col-md-12">
                                            {!! Form::select('filBranch', [''=>'--All--']+$branchList, null
                                            ,['id'=>'filBranch','class'=>'form-control input-sm','autocomplete'=>'off',
                                            'style' => 'color:black']) !!}
                                            <p id='filBranchE' style="max-height:3px; color:red;"></p>
                                        </div>
                                    </div>
                                </div>
                                {{-- end of branch level --}}
                                
                                
                                <div class="col-md-2">
                                    <div class="form-group">
                                        <div class="col-md-12">
                                            {!! Form::label('monthFrom', 'Month From:*', ['class' => 'control-label pull-left','style' => 'color:black']) !!}
                                        </div>
                                        <div class="col-md-12">
                                            {!! Form::text('monthFrom', $monthFrom,['id'=>'monthFrom','class'=>'form-control input-sm','autocomplete'=>'off','style'=>'cursor:pointer']) !!}
                                        </div>
                                    </div>
                                </div>

                                <div class="col-md-2">
                                    <div class="form-group">
                                        <div class="col-md-12">
                                            {!! Form::label('monthTo', 'Month To:*', ['class' => 'control-label pull-left','style' => 'color:black']) !!}
                                        </div>
                                        <div class="col-md-12">
                                            {!! Form::text('monthTo',  $monthTo,['id'=>'monthTo','class'=>'form-control input-sm', 'autocomplete'=>'off','style'=>'cursor:pointer']) !!}
                                        </div>
                                    </div>
                                </div>

                                <div class="col-md-2">
                                    <div class="form-group">
                                        <div class="col-md-12">
                                            {!! Form::label('', 'Achievement Type:', ['class' => 'control-label pull-left','style' => 'color:black']) !!}
                                        </div>
                                        <div class="col-md-12">
                                            {!! Form::select('achievementType', $achievementReportParameter, null, ['id'=>'achievementType','class'=>'form-control input-sm', 'autocomplete'=>'off']) !!}
                                            <p id='achievementType' style="max-height:3px; color:red;"></p>
                                        </div>
                                    </div>
                                </div>

                                {{-- Start of saving products level --}}
                                <div class="col-md-2" id="savingProducts">
                                    <div class="form-group">
                                        <div class="col-md-12">
                                            {!! Form::label('', 'Saving Product:', ['class' => 'control-label pull-left',
                                            'style' => 'color:black']) !!}
                                        </div>
                                        <div class="col-md-12 ">
                                            <select name="savingProducts[]" multiple id="savingProducts" class="form-control" >
                                                @foreach ($savingProducts as $savingProduct)
                                                    <option class="savingProductOpt" style="color: black" value="{{$savingProduct->id}}">
                                                        {{$savingProduct->name}}</option>   
                                                @endforeach
                                            </select>                                            
                                        </div>
                                    </div>
                                </div>
                                {{-- end of saving products level --}}                               

                                <div class="col-md-2">
                                    <div class="form-group">
                                        <div class="col-md-12">
                                            {!! Form::label('', 'Funding Org.:', ['class' => 'control-label pull-left','style' => 'color:black']) !!}
                                        </div>
                                        <div class="col-md-12">
                                            {!! Form::select('filFundingOrg',[''=>'--All--','-1'=>'PKSF & Others']+$fundingOrgList, -1,['id'=>'filFundingOrg','class'=>'form-control input-sm', 'autocomplete'=>'off']) !!}
                                            <p id='filMonthE' style="max-height:3px; color:red;"></p>
                                        </div>
                                    </div>
                                </div>
                                
                                <div class="col-md-2">
                                    <div class="form-group">
                                        <div class="col-md-12">
                                            {!! Form::label('', 'Sort By.:', ['class' => 'control-label pull-left','style' => 'color:black']) !!}
                                        </div>
                                        <div class="col-md-12">
                                            {!! Form::select('sortBy',$sortBy, null,['id'=>'sortBy','class'=>'form-control input-sm', 'autocomplete'=>'off']) !!}
                                            <p id='filMonthE' style="max-height:3px; color:red;"></p>
                                        </div>
                                    </div>
                                </div>
                                
                                <div class="col-md-2">
                                    <div class="form-group">
                                        <div class="col-md-12">
                                            {!! Form::label('', 'With Zero:', ['class' => 'control-label pull-left','style' => 'color:black']) !!}
                                        </div>
                                        <div class="col-md-12">
                                        <select name="withZero" class="form-control">
                                            <option style="color: black" value="0">With Zero</option>
                                            <option style="color: black" value="1" selected>Without Zero</option>
                                        </select>
                                        </div>
                                    </div>
                                </div>
                                
                                <div class="col-md-2">
                                    <div class="form-group">
                                        <div class="col-md-12">
                                            {!! Form::label('', 'With Manager:', ['class' => 'control-label pull-left','style' => 'color:black']) !!}
                                        </div>
                                        <div class="col-md-12">
                                        <select name="withManager" class="form-control">
                                            <option style="color: black" value="1">With Manager</option>
                                            <option style="color: black" value="0" selected>Without Manager</option>
                                        </select>
                                        </div>
                                    </div>
                                </div>

                                <div class="col-md-2">
                                    <div class="form-group">
                                        <div class="col-md-12">
                                            {!! Form::label('', 'Show Achievement:', ['class' => 'control-label pull-left','style' => 'color:black']) !!}
                                        </div>
                                        <div class="col-md-12">
                                        <select name="showAchievement" class="form-control">
                                            <option style="color: black" value="0" selected>No</option>
                                            <option style="color: black" value="1">Yes</option>
                                        </select>
                                        </div>
                                    </div>
                                </div>
                                
                                <div class="col-md-2">
                                    <div class="form-group">
                                        <div class="col-md-12">
                                            {!! Form::label('', 'With Digital:', ['class' => 'control-label pull-left','style' => 'color:black']) !!}
                                        </div>
                                        <div class="col-md-12">
                                        <select name="withDigital" class="form-control">
                                            <option style="color: black" value="no" selected>No</option>
                                            <option style="color: black" value="yes">Yes</option>
                                        </select>
                                        </div>
                                    </div>
                                </div>

                                {{-- Start of the Submit Button --}}
                                <div class="col-md-2">
                                    <div class="form-group">
                                        {!! Form::label('', '.', ['class' => 'control-label col-md-12', 'style' => 'color:#708090'])
                                        !!}
                                        <div class="col-md-12">
                                            {!! Form::submit('Show Report', ['id' => 'reportSubmit', 'class' => 'btn btn-primary']);
                                            !!}

                                        </div>
                                    </div>
                                </div>
                                {{-- End of the Submit button --}}
                            </div>

                            {!! Form::close() !!}
                            <!-- filtering end-->
                        </div>
                    </div>
                    <div class="row" id="reportingDiv">

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


{{-- script for submit form --}}
<script type="text/javascript">
    $(document).ready(function () {
        
        $("form").submit(function (event) {
            event.preventDefault()
            var serializeValue = $(this).serialize()

            let monthFrom = new Date ( '01-' + $("#monthFrom").val() )
            let monthTo = new Date( '01-' + $("#monthTo").val() )
            
            if( monthFrom > monthTo ) {
                toastr.error('!! Invalid Month Range !!', 'Warning!')
                return
            }
            
            $('#loadingModal').show();
            $("#reportingDiv").load('{{ URL::to("AchievementReportView/") }}' + '?' + serializeValue);
        });

        // $("#printIcon").click(function (event) {
        //     var mainContents = document.getElementById("printView").innerHTML;
        //     var win = window.open('', 'printwindow');
        //     win.document.write(mainContents);
        //     win.print();
        //     win.close();
        // });

    });
</script>

{{-- script for date --}}
<script type="text/javascript">
    var maxFromDate = minToDate = maxDate = new Date(  "{{$maxMonthEndDate}}" )        
    // month from
    $("#monthFrom").prop('required',true)
    $('#monthFrom').click(function(event) { this.value = '' })
    $("#monthFrom").datepicker({
        maxDate: maxDate,
        dateFormat: 'mm-yy',
        changeMonth: true,
        changeYear: true,
        showButtonPanel: true,        
        // onSelect: function(dateText, inst){
        //     minToDate = $("#monthFrom").datepicker('getDate')            
        //     $('#monthTo').datepicker('option','minDate',minToDate)
        // },
        onClose: function(dateText, inst) {
            let month = $("#ui-datepicker-div .ui-datepicker-month :selected").val()
            let year = $("#ui-datepicker-div .ui-datepicker-year :selected").val()
            $(this).val($.datepicker.formatDate('mm-yy', new Date(year, month, 1)))
        }
    })  

    // month to
    $("#monthTo").prop('required',true)
    $('#monthTo').click(function(event) { this.value = '' })
    $("#monthTo").datepicker({
        maxDate: maxDate,
        dateFormat: 'mm-yy',
        changeMonth: true,
        changeYear: true,
        showButtonPanel: true,        
        // onSelect: function(dateText, inst){
        //     maxFromDate = $("#monthTo").datepicker('getDate')
        //     $('#monthFrom').datepicker('option','maxDate',maxFromDate)
        // },
        onClose: function(dateText, inst) {
            let month = $("#ui-datepicker-div .ui-datepicker-month :selected").val()
            let year = $("#ui-datepicker-div .ui-datepicker-year :selected").val()
            $(this).val($.datepicker.formatDate('mm-yy', new Date(year, month, 1)))
        }
    });

    

</script>

{{-- script for show/hide level --}}
<script text="text/javascript">
    $(document).ready(function () {
        /*on change filReportLevel hide/show contents*/
        $("#filReportLevel").change(function (event) {
            if ($(this).val() == "Branch") {
                $("#branchDiv").show();
                $("#areaDiv").hide();
                $("#zoneDiv").hide();
                $("#regionDiv").hide();

                // $("#filArea").prop('required', false);
                // $("#filZone").prop('required', false);
                // $("#filRegion").prop('required', false);
            } else if ($(this).val() == "Area") {
                $("#branchDiv").hide();
                $("#areaDiv").show();
                $("#zoneDiv").hide();
                $("#regionDiv").hide();
                
                // $("#filArea").prop('required', true);
                // $("#filZone").prop('required', false);
                // $("#filRegion").prop('required', false);
            } else if ($(this).val() == "Zone") {
                $("#branchDiv").hide();
                $("#areaDiv").hide();
                $("#zoneDiv").show();
                $("#regionDiv").hide();

                // $("#filArea").prop('required', false);
                // $("#filZone").prop('required', true);
                // $("#filRegion").prop('required', false);
            } else if ($(this).val() == "Region") {
                $("#branchDiv").hide();
                $("#areaDiv").hide();
                $("#zoneDiv").hide();
                $("#regionDiv").show();

                // $("#filArea").prop('required', false);
                // $("#filZone").prop('required', false);
                // $("#filRegion").prop('required', true);
            }
        });

        /*end on change filReportLevel hide/show contents*/
        $("#filReportLevel").trigger('change');
    });

    // for savings product start
    $(document).ready(function () {
        /*on change filachievementTypeE hide/show contents*/
        $("#achievementType").change(function (event) {
            $("#savingProducts").hide();
            if ($(this).val() == "savingsClosingBalance") {
                $("#savingProducts").show();
            } 
        });

        /*end on change filReportLevel hide/show contents*/
        $("#achievementType").trigger('change');
    });
    
    // start multi select
    $('.savingProductOpt').mousedown(function(e) {
        e.preventDefault();
        var originalScrollTop = $(this).parent().scrollTop();

        $(this).prop('selected', $(this).prop('selected') ? false : true);
        var self = this;
        $(this).parent().focus();
        setTimeout(function() {
            $(self).parent().scrollTop(originalScrollTop);
        }, 0);
        console.log(this);
        return false;
    });
    // end multi select
</script>


<script type="text/javascript">
    $(document).ready(function() {   
        $("#loadingModal").hide();
    }); /* Ready*/
</script>

<script type="text/javascript">
    $("#printIcon").click(function(event) {
        var mainContents = document.getElementById("printDiv").innerHTML;
        var headerContents = '';
        var printStyle = '<style>#dueRegister1, #dueRegister2,{float:left;height:auto;padding:0px;width:100% !important;font-size:11px;border:1pt ash;page-break-inside:auto;font-family:Arial;}  thead tr th{text-align:center;vertical-align: top;padding:3px;font-size:11px} #pomisOne1 thead tr th:nth-child(1){ width: 50px;} thead tr th:nth-child(10){ width: 40px;} tbody tr td:nth-child(10){ width: 40px;} tbody tr td.amount {border: 1px solid ash;text-align:right;vertical-align: middle;padding:3px;font-size:11px} tbody tr td {border: 1px solid ash;text-align:center;vertical-align: middle;padding:3px;font-size:11px} td:nth-child(1){text-align:left;} tr{ page-break-inside:avoid; page-break-after:auto } tr:last-child { font-weight: bold;} .name{text-align:left;vertical-align:left;}</style><style media="print">@page{margin:10mm 10mm;}</style><style>@media print {.element-that-contains-table { overflow: visible !important; }}</style><style>@page:first{#pomisOne1 tr:nth-of-type(10n){page-break-after: always;}}</style>';
        var printContents = '<div id="order-details-wrapper">' + headerContents +printStyle+ mainContents +'</div>';
        var win = window.open('','printwindow');
        win.document.write(printContents);
        win.print();
        win.close();
    });
</script>

<script type="text/javascript">
    $("#btnExportExcel").click(function(e) {
        var today = new Date();
        var dd = today.getDate();
        if(dd<10) dd='0'+dd;
        var mm = today.getMonth()+1; 
        if(mm<10)mm='0'+mm;
        var yyyy = today.getFullYear();
        today = dd+'-'+mm+'-'+yyyy;
        let file = new Blob([$('#printDiv').html()], {type:"application/vnd.ms-excel"});
        let url = URL.createObjectURL(file);
        let a = $("<a />", {
          href: url,
          download: "Achievement_Report_"+ today + ".xls"}).appendTo("body").get(0).click();
        e.preventDefault();
    });

    $("#btnExportPdf").click(function(event) {
        event.preventDefault();

        let serializeValue = $("#filterFormId").serialize();
        let url = "{{ route('achievementReport.pdf') }}?" + serializeValue;
        window.open(url, '_blank');
    });
</script>

@endsection