@extends('layouts.app')
@section('title', session('company_code') . ' Elite System')

<style type="text/css">
    div.box-header.with-border h3.box-title{
        padding-left  : 5px;
        padding-right : 5px;
    }

    div.box-body{
        padding-bottom: 0 !important;
    }

    span.select2-selection__clear{
        display : none !important;
    }

    input[type=number]::-webkit-inner-spin-button, 
    input[type=number]::-webkit-outer-spin-button { 
      -webkit-appearance: none; 
    }    

    .select2-container--default .select2-selection--multiple .select2-selection__rendered {
        padding: 0.5px 5px !important;
    }    

    .select2-container--default .select2-selection--multiple .select2-selection__choice {
        background-color: #212121 !important;
    }    
</style>

@section('body')


<div class="row">
    <div class="col-xs-12">
        <div class="box box-default"> 
            <div class="box-body">
                @include('administrator.branch-settings._settings')
            </div>
        </div>
    </div>
</div>

<div class="row">
    <div class="col-xs-6">
        <div class="box box-default"> 
            <div class="box-body">
                @include('administrator.branch-settings._penalty-sc')
            </div>
        </div>
    </div>
    <div class="col-xs-3">
        <div class="box box-default"> 
            <div class="box-body">
                @include('administrator.branch-settings._other-settings')
            </div>
        </div>
    </div>    
    <div class="col-xs-3">
        <div class="box box-default"> 
            <div class="box-body">
                @include('administrator.branch-settings._pca')
            </div>
        </div>
    </div>   
</div>

@endsection

@section('scripts')   
<script type="text/javascript">    
$(document).ready(function(){
    var id       = {{session('branch_id') }};
    var sys_mode = "{{ session('system_mode') }}";
    var septage  = "{{ session('septage_fee') }}";
    var sf_print = "{{ session('sf_printing') }}";
    var athena   = "{{ session('athena_loan') }}";
    var new_or   = "{{ session('new_or') }}";
    var or_type  = "{{ session('or_type')}}";
    var mc       = "{{ session('meter_charges') }}";
    var mc_amt   = "{{ session('mc_amount') }}";
    var ft       = "{{ session('franchise_tax') }}";
    var ft_amt   = "{{ session('ft_amount') }}";

    $('#system-mode').val(sys_mode).trigger('change');
    $('#septage').val(septage).trigger('change');
    $('#sf-printing').val(sf_print).trigger('change');
    $('#service-invoice').val(new_or).trigger('change');
    $('#or-type').val(or_type).trigger('change');
    $('#athena-loan').val(athena).trigger('change');
    $('#meter-charges').val(mc).trigger('change');
    $('#meter-charges-input').val(mc_amt)
    $('#franchise-tax').val(ft).trigger('change');
    $('#franchise-tax-input').val(ft_amt)

    settings(id);
    contact_settings(id);
    books(id);
    load_other_settings(id);

    $('#select-company').select2({
        allowClear: true,
        ajax: {
            url: $app_url + '/companies',
            delay: 200,
            data: function (params) {
                return query = {
                    search: params.term
                }
            },
            processResults: function (data) {
                return {
                    results: $.map(data, function (item) {
                        return {
                            text: item.description,
                            id: item.id
                        }
                    })
                };
            }
        }
    });
    $('#select-book').select2({
        "language": {
            "noResults": function(){
                return "Please select branch.";
            }
        }                
    }).on('change', function(){
        var table = $('#t-pca > tbody');
        table.empty();      

        id = $(this).val();

        $.ajax({
            url  : $app_url + '/administrator/branch-settings/pca',
            type : 'get',
            data : {
                'book_id' : id
            },
            success : function(response){

                $.each(response, function(index){
                    var r = response[index];
                    table.append("<tr>"
                                    +"<td class='text-center'>"
                                        +r.cutoff
                                    +"</td>"
                                    +"<td class='text-right'>"
                                        +number_format(r.amount)
                                    +"</td>"                   
                                    +"<td class='table-header-bg'>&nbsp;</td>"
                                +"</tr>");
                });

                var cutoff  = "<input type='text' class='form-control date-masked text-center'>";
                var pca     = "<input type='number' class='form-control text-right inputs' style='width:100%; font-size:16px;'>"
                var save    = "<button class='btn btn-success btn-flat add-pca' title='Add PCA'><i class='fa fa-plus'></i>&nbsp;</button>";

                table.append("<tr>"
                                +"<td class='cellpad-top col-cutoff'>"
                                    +cutoff
                                +"</td>"
                                +"<td class='cellpad-top col-pca'>"
                                    +pca
                                +"</td>"  
                                +"<td class='cellpad-top'>"+ save +"</td>"                                                                              
                            +"</tr>");

                $(".date-masked").inputmask("date", {
                    mask: "y-1-1", 
                    placeholder: "yyyy-mm-dd", 
                    leapday: "-02-29", 
                    separator: "-", 
                    alias: "yyyy/mm/dd",
                    onincomplete: function() {
                        $(this).val(null);
                    }
                });                          
            },
            error   : function(){},
            beforeSend : function(){
                showBoxLoadingState();
            },
            complete : function(){
                removeBoxLoadingState();
            }                  
        });                
    });

    $('#select-province').select2({
        allowClear: true,
        ajax: {
            url: $app_url + '/provinces',
            delay: 200,
            data: function (params) {
                return query = {
                    search: params.term,
                }
            },
            processResults: function (data) {
                return {
                    results: $.map(data, function (item) {
                        return {
                            text: item.name,
                            id: item.id
                        }   
                    })
                };
            }
        }
    }).on('change', function() {
        $('#select-cities').val('').trigger('change');
    }).on('select2:select', function(e) {
        $('#select-cities').select2('open');
    });

    $('#select-cities').select2({
        allowClear: true,
        ajax: {
            url: $app_url + '/cities',
            delay: 200,
            data: function (params) {
                return query = {
                    search: params.term,
                    pid: $('#select-province option:selected').val()
                }
            },
            processResults: function (data) {
                return {
                    results: $.map(data, function (item) {
                        return {
                            text: item.name,
                            id: item.id
                        }
                    })
                };
            }
        }
    });

    function books(id){
        $.ajax({
            url  : $app_url + '/administrator/branch-settings/loadbooks',
            type : 'get',
            data : {
                'branch_id' : id
            },
            success : function(response){
                var select = $('#select-book');

                select.find('option').not(':eq(0)').remove();
                $.each(response, function(index){
                    var r = response[index];
                    select.append("<option value='"+r.id+"'>"+r.code+" - "+r.description+"</option>");
                });
            },
            error   : function(){},
            beforeSend : function(){
                showBoxLoadingState();
            },
            complete : function(){
                removeBoxLoadingState();
            }                  
        });
    }

    function settings(id){
        $.ajax({
            url  : $app_url + '/administrator/branch-settings/settings',
            type : 'get',
            data : {
                'branch_id' : id
            },
            success : function(response){
                load_settings(response);

            },
            error   : function(){},
            beforeSend : function(){
                showBoxLoadingState();
            },
            complete : function(){
                removeBoxLoadingState();
            }                  
        });
    }

    function contact_settings(id){
        $.ajax({
            url  : $app_url + '/administrator/branch-settings/contact-settings',
            type : 'get',
            data : {
                'branch_id' : id
            },
            success : function(response){
                load_contacts(response);

            },
            error   : function(){},
            beforeSend : function(){
                showBoxLoadingState();
            },
            complete : function(){
                removeBoxLoadingState();
            }                  
        });
    }

    function load_other_settings(branch_id){
        $.ajax({
            url  : $app_url + '/administrator/branch-settings/load-others',
            type : 'get',
            data : {
                'branch_id' : branch_id
            },
            success : function(res){
                $("#meter-charges").val(res.meter_charges).trigger("change");
                $("#franchise-tax").val(res.franchise_tax).trigger("change");
                $("#meter-charges-input").val(res.amt_meter_charges);
                $("#franchise-tax-input").val(res.pct_franchise_tax);
            },
            error   : function(){},              
        });
    }

    function load_settings(response){
        var table = $('#t-settings > tbody');
        table.empty();

        $.each(response, function(index){
            var r = response[index];

            var cutoff      = r.cutoff;
            var penalty     = cast(r.penalty);
            var senior      = r.senior;
            var sp_discount = r.special_discount;

            var s_before  = senior ? senior.before  : 0;
            var s_after   = senior ? senior.after   : 0;
            var s_max_cum = senior ? senior.max_cum : 0;

            var sp_before  = sp_discount ? sp_discount.before  : 0;
            var sp_after   = sp_discount ? sp_discount.after   : 0;
            var sp_max_cum = sp_discount ? sp_discount.max_cum : 0;

            table.append("<tr>"
                            +"<td class='text-center'>"+cutoff+"</td>"
                            +"<td class='text-right'>"+penalty+"</td>"
                            +"<td class='text-right'>"+s_before+"</td>"
                            +"<td class='text-right'>"+s_after+"</td>"
                            +"<td class='text-right'>"+s_max_cum+"</td>"
                            +"<td class='text-right'>"+sp_before+"</td>"
                            +"<td class='text-right'>"+sp_after+"</td>"
                            +"<td class='text-right'>"+sp_max_cum+"</td>"
                            +"<td class='text-right table-header-bg'>&nbsp;</td>"
                        +"</tr>");                    
        });       
        add_row();        
        
        
    }

    function load_contacts(res){
        var table = $('#table-bs-contact > tbody');
        $('#bs-branch-name').val(res.description);
        $('#bs-address').val(res.address);
        $('#bs-contact').val(res.contact_no);
        $('#bs-email').val(res.email);
        $('#bs-tin').val(res.tin);
    }

    function number_format(number){
        return numeral(number.toString().replace(/,/g, '')).format('0,0.00');
    }

    function cast(number){
        if(number == null){
            number = 0;
        }
        return Number(number.toString().replace(/,/g, ''));
    }                      

    function add_row(){
        var cutoff  = "<input type='text' class='form-control date-masked text-center'>";
        var penalty = "<input type='text' class='form-control text-right inputs' style='width:100%; font-size:16px;'>";
        var s_before  = "<input type='number' class='form-control text-right inputs' style='width:100%; font-size:16px;'>";
        var s_after   = "<input type='number' class='form-control text-right inputs' style='width:100%; font-size:16px;'>";
        var s_maxcum  = "<input type='number' class='form-control text-right inputs' style='width:100%; font-size:16px;'>";
        var sp_before  = "<input type='number' class='form-control text-right inputs' style='width:100%; font-size:16px;'>";
        var sp_after   = "<input type='number' class='form-control text-right inputs' style='width:100%; font-size:16px;'>";
        var sp_maxcum  = "<input type='number' class='form-control text-right inputs' style='width:100%; font-size:16px;'>";
        var save    = "<button class='btn btn-success btn-flat add-penalty-sc' title='Add Settings'><i class='fa fa-plus'></i>&nbsp;</button>";

        $('#t-settings > tbody').append("<tr>"                            
                        +"<td class='cellpad-top col-cutoff'>"+ cutoff +"</td>"
                        +"<td class='cellpad-top col-penalty'>"+ penalty +"</td>"
                        +"<td class='cellpad-top col-s_before'>"+ s_before +"</td>"
                        +"<td class='cellpad-top col-s_after'>"+ s_after +"</td>"
                        +"<td class='cellpad-top col-s_maxcum'>"+ s_maxcum +"</td>"
                        +"<td class='cellpad-top col-sp_before'>"+ sp_before +"</td>"
                        +"<td class='cellpad-top col-sp_after'>"+ sp_after +"</td>"
                        +"<td class='cellpad-top col-sp_maxcum'>"+ sp_maxcum +"</td>"
                        +"<td class='cellpad-top'>"+ save +"</td>"
                    +"</tr>");

        $(".date-masked").inputmask("date", {
            mask: "y-1-1", 
            placeholder: "yyyy-mm-dd", 
            leapday: "-02-29", 
            separator: "-", 
            alias: "yyyy/mm/dd",
            onincomplete: function() {
                $(this).val(null);
            }
        });                   
    }

    $("#chkbx-meter-charges").change(function(){
        if($("#chkbx-meter-charges").is(":checked")) {
            $("#input-meter-charges").removeAttr("disabled");
        } else {
            $("#input-meter-charges").attr("disabled", true);
            $("#input-meter-charges").val("");
        }
    });

    $("#chkbx-franchise-tax").change(function(){
        if($("#chkbx-franchise-tax").is(":checked")) {
            $("#input-franchise-tax").removeAttr("disabled");
        } else {
            $("#input-franchise-tax").attr("disabled", true);
            $("#input-franchise-tax").val("");
        }
    });

    $(document).on('click', '#btn-settings-save', function() {
        var company     = $('#select-company option:selected').val();
        var name        = $('#bs-branch-name').val();
        var address     = $('#bs-address').val();
        var province    = $('#select-province option:selected').val();
        var city        = $('#select-cities option:selected').val();
        var contact_no  = $('#bs-contact').val();
        var email       = $('#bs-email').val();
        var tin         = $('#bs-tin').val();
        var septage     = $('#septage option:selected').val();
        var sf_printing = $('#sf-printing option:selected').val();
        var athena      = $('#athena-loan option:selected').val();
        var new_or      = $('#service-invoice option:selected').val();
        var or_type     = $('#or-type option:selected').val();
        var sys_mode    = $('#system-mode option:selected').val();

        $.ajax({
            url  : $app_url + '/administrator/branch-settings/update-settings',
            type : 'POST',
            data : { 
                'company'     : company,
                'name'        : name,
                'address'     : address,
                'province'    : province, 
                'city'        : city,
                'contact_no'  : contact_no,
                'email'       : email,
                'tin'         : tin,
                'septage'     : septage,
                'sf_printing' : sf_printing,
                'athena'      : athena,
                'new_or'      : new_or,
                'or_type'     : or_type,
                'sys_mode'    : sys_mode
            },
            success : function(response){
                $.confirm({
                    title: 'Settings Updated!',
                    content: 'You have successfully updated branch settings.',
                    type: 'green',
                    icon: 'fa fa-check-circle',
                    draggable: true,
                    typeAnimated: true,
                    buttons: {
                        Okay: {
                            text: 'Okay',
                            btnClass: 'btn-success',
                            action: function(){
                                location.reload();
                            }
                        },
                    }
                });
            },
            error : function(){

            },
            beforeSend : function(){
                showBoxLoadingState();
            },
            complete : function(){
                removeBoxLoadingState();
            }
        });
    })
    .on('click', '#btn-others-save', function() {
        var meter_charges = $('#meter-charges option:selected').val();
        var mc_type       = $('#meter-charges-type option:selected').val();
        var mc_input      = $('#meter-charges-input').val();
        var franchise_tax = $('#franchise-tax option:selected').val();
        var ft_type       = $('#franchise-tax-type option:selected').val();
        var ft_input      = $('#franchise-tax-input').val();

        $.ajax({
            url  : $app_url + '/administrator/branch-settings/others',
            type : 'post',
            data : {
                'meter_charges' : meter_charges,
                'mc_type'       : mc_type,
                'mc_input'      : mc_input,
                'franchise_tax' : franchise_tax,
                'ft_type'       : ft_type,
                'ft_input'      : ft_input
            },
            success : function(response){        
                $.confirm({
                    title: 'Settings Updated!',
                    content: 'You have successfully updated meter charges and franchise tax.',
                    type: 'green',
                    icon: 'fa fa-check-circle',
                    draggable: true,
                    typeAnimated: true,
                    buttons: {
                        Okay: {
                            text: 'Okay',
                            btnClass: 'btn-success',
                            action: function(){
                                location.reload();
                            }
                        },
                    }
                });
            },
            error : function(){

            },
            beforeSend : function(){
                showBoxLoadingState();
            },
            complete : function(){
                removeBoxLoadingState();
            }
        });

        // e.preventDefault();
    })
    .on('click', '.add-pca', function(){
        var row     = $(this).closest('tr');
        var cutoff  = row.find('td.col-cutoff').find('input').val();
        var pca     = row.find('td.col-pca').find('input').val();
        var branch  = $('#select-branch').val();
        var book    = $('#select-book').val();

        if(!cutoff){
            $.alert({
                title   : 'Cut-Off cannot be blank!',
                content : 'Please enter cutoff.',
                type    : 'orange'
            });
            return false;                
        }                  

        if(!pca){
            $.alert({
                title   : 'PCA cannot be blank!',
                content : 'Please enter pca.',
                type    : 'orange'
            });
            return false;                
        }          

        var settings = {
            'branch_id' : branch,
            'book_id'   : book,
            'cutoff'    : cutoff,
            'pca'       : cast(pca)
        };

        $.ajax({
            url  : $app_url + '/administrator/branch-settings/add-pca',
            type : 'POST',
            data : {
                '_token'   : $('[name=_token]').val(),
                'settings' : settings              
            },
            success : function(response){
                $.alert({
                    title: 'Settings Updated!',
                    content: 'You have successfully added pca.',
                    type: 'green',
                    icon: 'fa fa-check-circle',
                    draggable: true,
                    typeAnimated: true,
                    buttons: {
                        Okay: {
                            text: 'Okay',
                            btnClass: 'btn-success',
                            action: function(){
                                $('#select-book').val(book).trigger('change');
                            }
                        },
                    }
                });
            },
            error : function(){

            },
            beforeSend : function(){
                showBoxLoadingState();
            },
            complete : function(){
                removeBoxLoadingState();
            }
        });                         
    })
    .on('click', '.add-penalty-sc', function(){
        var row       = $(this).closest('tr');
        var branch    = {{session('branch_id') }};
        var cutoff    = row.find('td.col-cutoff').find('input').val();
        var penalty   = row.find('td.col-penalty').find('input').val();
        var s_before  = row.find('td.col-s_before').find('input').val();
        var s_after   = row.find('td.col-s_after').find('input').val();
        var s_maxcum  = row.find('td.col-s_maxcum').find('input').val();
        var sp_before = row.find('td.col-sp_before').find('input').val();
        var sp_after  = row.find('td.col-sp_after').find('input').val();
        var sp_maxcum = row.find('td.col-sp_maxcum').find('input').val();

        if(!cutoff){
            $.alert({
                title   : 'Cut-Off cannot be blank!',
                content : 'Please enter cutoff.',
                type    : 'orange'
            });
            return false;                
        }                  

        if(!penalty){
            $.alert({
                title   : 'Penalty cannot be blank!',
                content : 'Please enter penalty.',
                type    : 'orange'
            });
            return false;                
        } 

        if(!s_before){
            $.alert({
                title   : 'Senior Discount cannot be blank!',
                content : 'Please enter senior discount on or before due date.',
                type    : 'orange'
            });
            return false;                
        }     

        if(!s_after){
            $.alert({
                title   : 'Senior Discount cannot be blank!',
                content : 'Please enter senior discount after due date.',
                type    : 'orange'
            });
            return false;                
        }    

        if(!s_maxcum){
            $.alert({
                title   : 'Senior Discount cannot be blank!',
                content : 'Please enter max cum.',
                type    : 'orange'
            });
            return false;                
        }                                             

        var senior = {
            'before'  : cast(s_before),
            'after'   : cast(s_after),
            'max_cum' : cast(s_maxcum)
        };

        var special_discount = {
            'before'  : cast(sp_before),
            'after'   : cast(sp_after),
            'max_cum' : cast(sp_maxcum)
        }

        var settings = {
            'branch'   : branch,
            'cutoff'   : cutoff,
            'penalty'  : cast(penalty),
            'senior'   : senior,
            'special_discount' : special_discount
        };       

        $.ajax({
            url  : $app_url + '/administrator/branch-settings/update',
            type : 'POST',
            data : {
                '_token'   : $('[name=_token]').val(),
                'settings' : settings              
            },
            success : function(response){
                $.confirm({
                    title: 'Settings Updated!',
                    content: 'You have successfully added branch penalty and senior discount.',
                    type: 'green',
                    icon: 'fa fa-check-circle',
                    draggable: true,
                    typeAnimated: true,
                    buttons: {
                        Okay: {
                            text: 'Okay',
                            btnClass: 'btn-success',
                            action: function(){
                                location.reload();
                            }
                        },
                    }
                });
            },
            error : function(){

            },
            beforeSend : function(){
                showBoxLoadingState();
            },
            complete : function(){
                removeBoxLoadingState();
            }
        });                   

    })
    .on('change', '#meter-charges', function() {
        if ($('#meter-charges').val() == "1") {
            $('#meter-charges-input').prop('disabled', false);
        }
        else {
            $('#mc-input').val(0);
            $('#meter-charges-input').prop('disabled', true);
        }
    })
    .on('change', '#franchise-tax', function() {
        if ($('#franchise-tax').val() == "1") {
            $('#franchise-tax-input').prop('disabled', false);
        }
        else {
            $('#franchise-tax-input').prop('disabled', true);
        }
    });
});
</script>
@endsection