@extends('layouts/microfin_layout')
@section('title', '| Breakdown of portfolio by maturity')
@section('content')
<style type="text/css">
    .form-group, .form-control{
        font-size: 11px !important;
        color: black !important;
    }
    .form-control{
        padding: 5px !important;
    }
    #reportSubmit{
        font-size: 12px;
        margin-top: 20px;
    }

    tr.subtoalrow td {
        background-color: #c3bebe;
    }
    tr.grandtoalrow td {
        background-color: #9cb1d3;
    }
</style>

<script type="text/javascript">
    $("#loadingModal").show();
    $(document).keydown(function(e) {
        if (e.keyCode == 27) return false;
    });
</script>

<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;">Breakdown of Portfolio by Maturity</h3>
            </div>

            <div class="panel-body panelBodyView">
                {{-- {!! Form::open(array('url' => '', 'role' => 'form', 'class'=>'form-horizontal form-groups', 'id' => 'filterFormId', 'method'=>'get')) !!} --}}
                <form action="" class="form-horizontal form-groups" method="get" id="filterFormId">
                    <div class="row">
                        <div class="col-md-12">
                            <div class="col-md-1">
                                <div class="form-group">
                                    <div class="col-md-12">
                                        <label class="control-label" for="report_level"> Report Level</label>
                                    </div>
                                    <div class="col-md-12">
                                        <select class="form-control input-sm" name="filReportLevel" id="filReportLevel">
                                            @foreach ($reportLevelList as $key=>$reportLevel)
                                                <option value="{{$key}}">{{$reportLevel}}</option>
                                            @endforeach
                                        </select>
                                        {{-- {!! Form::select('filReportLevel',$reportLevelList, null ,['id'=>'filReportLevel','class'=>'form-control input-sm','autocomplete'=>'off', 'autofocus']) !!} --}}
                                    </div>
                                </div>
                            </div>

                            <div class="col-md-1" id="areaDiv" style="display: none;">
                                <div class="form-group">
                                    <div class="col-md-12">
                                        <label class="control-label" for="area">Area: </label>
                                        {{-- {!! Form::label('', 'Area:', ['class' => 'control-label pull-left']) !!} --}}
                                    </div>
                                    <div class="col-md-12">
                                        <select id="filArea" name="filArea" class="form-control input-sm">
                                            <option value="">--Select Area--</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>

                            <div class="col-md-1" id="zoneDiv" style="display: none;">
                                <div class="form-group">
                                    <div class="col-md-12">
                                        <label class="control-label" for="zone">Zone: </label>
                                        {{-- {!! Form::label('', 'Zone:', ['class' => 'control-label pull-left']) !!} --}}
                                    </div>
                                    <div class="col-md-12">
                                        <select id="filZone" name="filZone" class="form-control input-sm">
                                            <option value="">--Select Zone--</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>

                            <div class="col-md-1" id="regionDiv" style="display: none;">
                                <div class="form-group">
                                    <div class="col-md-12">
                                        <label class="control-label" for="division">Division: </label>
                                        {{-- {!! Form::label('', 'Division:', ['class' => 'control-label pull-left']) !!} --}}
                                    </div>
                                    <div class="col-md-12">
                                        <select id="filRegion" name="filRegion" class="form-control input-sm">
                                            <option value="">--Select Division--</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>

                            <div class="col-md-1" id="branchDiv">
                                <div class="form-group">
                                    <div class="col-md-12">
                                        <label class="control-label" for="branch"> Branch: </label>
                                        {{-- {!! Form::label('', 'Branch:', ['class' => 'control-label pull-left']) !!} --}}
                                    </div>
                                    <div class="col-md-12">
                                        <select class="form-control input-sm" name="filBranch" id="filBranch">
                                            @foreach ($branchList as $branchId=>$branch)
                                                <option value="{{$branchId}}">{{$branch}}</option>
                                            @endforeach
                                        </select>
                                        {{-- {!! Form::select('filBranch', [''=>'--All--']+$branchList, null ,['id'=>'filBranch','class'=>'form-control input-sm','autocomplete'=>'off']) !!} --}}
                                        {{-- <p id='filBranchE' 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('', 'Date To:', ['class' => 'control-label pull-left']) !!}
                                    </div>
                                    <div class="col-md-12">
                                        {!! Form::text('filDateTo',null,['id'=>'filDateTo','class'=>'form-control input-sm readonly', 'autocomplete'=>'off','style'=>'cursor:pointer;','required']) !!}
                                    </div>
                                </div>
                            </div>

                            <div class="col-md-1">
                                <div class="form-group">
                                    {!! Form::label('', '', ['class' => 'control-label col-md-12']) !!}
                                    <div class="col-md-12">
                                        {!! Form::submit('Show Report', ['id' => 'reportSubmit', 'class' => 'btn btn-primary btn-xs']); !!}
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </form>
                
                {{-- {!! Form::close()  !!} --}}

                <div class="row">
                    <div class="col-md-12"  id="reportingDiv">

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

<script type="text/javascript">
    $(document).ready(function() {

        $("form").submit(function( event ) {
            event.preventDefault();
            var serializeValue=$(this).serialize();
            $('#loadingModal').show();
            $("#reportingDiv").load('{{url("mfn/internationalReport/deposit/breakdownMaturity/report")}}'+'?'+serializeValue);
        });

        $('#filDateTo').datepicker({
            dateFormat: 'dd-mm-yy',
            changeYear: true,
            changeMonth: true,
            // onSelect: function(){
            //     thisDate = $("#filDateTo").datepicker('getDate');
            //     $('#filDateFrom').datepicker('option','maxDate',thisDate);
            // }
        });

        $('#filDateTo').click(function() {
            this.value = '';
        });

        $(".readonly").on('keydown paste', function(e){
            e.preventDefault();
        });
    });

</script>

<script type="text/javascript">
    $(document).ready(function() {

    $("#printIcon").click(function(event) {

        // $("#hiddenTitle").show();
        // $("#hiddenInfo").show();
        // $("#loanNSavingTable1").removeClass('table table-striped table-bordered');

        var mainContents = document.getElementById("printDiv").innerHTML;
        var headerContents = '';
        // var printContents = '<div id="order-details-wrapper">' + headerContents + mainContents +'</div>';


        /* var printStyle = '<style>#pomisOne1, #pomisOne2, pomisOne3 {float:left;height:auto;padding:0px;width:100% !important;font-size:11px;page-break-inside:auto;}  thead tr th{text-align:center;vertical-align: middle;padding:3px;font-size:11px}  tr{ page-break-inside:avoid; page-break-after:auto } table tbody tr td.amount{text-align:right !important;}</style><style media="print">@page{size: legal landscape;margin:10mm 10mm;}</style><style>@media print {.element-that-contains-table { overflow: visible !important; }}</style><style>@page:first{tr:nth-of-type(4n){page-break-after: always;}}</style>';*/

        // 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 printStyle = '{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}  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>';


        /*tr:nth-of-type(10n){page-break-after: always;}*/
        // @media print {.element-that-contains-table { overflow: visible !important; }}

        var printContents = '<div id="order-details-wrapper">' + headerContents +printStyle+ mainContents +'</div>';


        /*document.body.innerHTML = printStyle + printContents;
        window.print();*/

        var win = window.open('','printwindow');
        win.document.write(printContents);
        win.print();
        // $("#loanNSavingTable1").addClass('table table-striped table-bordered');
        win.close();
    });

    $("#loadingModal").hide();

    $("#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();

            //$("#filBranch").prop('required', false);
            $("#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();

            //$("#filBranch").prop('required', false);
            $("#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();

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


}); /* Ready*/
</script>

@endsection