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

@section('header')
    Dashboard
@endsection

@section('body')
<div class="box box-default">
	<div class="box-body">
        <div class="row">
            <div class="col-xs-12">
                <label class="text-primary" style="font-size:16px; margin-top:6px">Customer Water Service Applications</label>

                <div class="pull-right box-tools">
                    <a href="{{url('csr/application/new')}}" class="btn btn-default"><i class="fa fa-fw fa-plus-circle text-success"></i>New Water Service Application</a>
                </div>

                <div class="pull-right box-tools" style="width:200px; margin-right:3px">
                    <select id="filter-by-status" class="form-control select2 select2-hidden-accessible" data-placeholder="STATUS" style="width: 100%;" aria-hidden="true">
                        <option value=""></option>
                        <option value="all">ALL</option>
                        <option value="pending">PENDING</option>
                        <option value="surveyed">SURVEYED</option>
                        <option value="for payment">FOR PAYMENT</option>
                        <option value="joborder">JOB ORDER</option>
                        <option value="connected">CONNECTED</option>
                        <option value="cancelled">CANCELLED</option>
                    </select>
                </div>
            </div>
        </div>
        <hr style="margin-top:6px; margin-bottom:8px">
  		<div class="row">
    		<div class="col-xs-12">
      			<table class="table table-hover table-condensed" id="table-applications" style="width:100%">
                    <thead class="table-header-bg">
                        <tr>
                            <th width="12%">APPL. NO.</th>
                            <th width="10%">DATE APPLIED</th>
                            <th width="6%">CLASS</th>
                            <th width="25%">CUSTOMER NAME</th>
                            <th>CONTACT PERSON</th>
                            <th>LANDLINE</th>
                            <th>MOBILE</th>
                            <th>EMAIL</th>
                            <th width="33%">ADDRESS</th>
                            <th width="6%">STATUS</th>
                            <th width="6%">PAYMENT</th>
                            <th width="2%">&nbsp;</th>
                        </tr>
                    </thead>
                </table>
    		</div>
	  	</div>
	</div>
</div>
@endsection

@section('scripts')
<script type="text/javascript">
    $(document)
    .on('ready', function() {
        $dt = $('#table-applications').DataTable({
            deferred: true,
            processing: true,
            serverSide: true,
            bSort: false,
            ajax: {
                url: $app_url + '/csr/application/dt',
                data: function(d) {
                    d.appl_status = $('#filter-by-status').val()
                }
            },
            columns: [
                { data:'application_number',    name:'ca.application_number',  orderable:false,   className:"text-uppercase" },
                { data:'created_at',            name:'ca.created_at',          orderable:false,   className:"text-uppercase" },
                { data:'acct_class',            name:'acct_class',             orderable:false,   className:"text-uppercase" },
                { data:'cust_name',             name:'cust_name',              orderable:false,   className:"text-uppercase" },
                { data:'contact_person',        name:'ca.contact_person',      orderable:false,   className:"text-uppercase" },
                { data:'landline_number',       name:'ca.landline_number',     orderable:false,   className:"text-uppercase" },
                { data:'mobile_number',         name:'ca.mobile_number',       orderable:false,   className:"text-uppercase" },
                { data:'email_address',         name:'ca.email_address',       orderable:false,   className:"text-uppercase" },
                { data:'complete_address',      name:'complete_address',       orderable:false,   className:"text-uppercase" },
                { data:'application_status',    name:'ca.application_status',  orderable:false,   className:"text-uppercase" },
                { data:'payment_status',        name:'ca.payment_status',      orderable:false,   className:"text-uppercase" },
                { data:'action',                name:'action',                 orderable:false,   className:"text-right",         searchable:false }
            ],
            columnDefs: [{
                targets: 8,
                render: function(data, type, row) {
                    if(data.length > 55) {
                        return data.substr(0,55) + '...';
                    } else {
                        return data;
                    }
                }
            }],
            createdRow: function(row, data, dataIndex) {
                $(row).attr('data-appl-id', data.appl_id);
            }
        });

        $dt.column(4).visible(false); // CONTACT PERSON COLUMN
        $dt.column(5).visible(false); // LANDLINE NUMBER COLUMN
        $dt.column(6).visible(false); // MOBILE NUMBER COLUMN
        $dt.column(7).visible(false); // EMAIL ADDRESS COLUMN

        $('#table-applications_filter input').unbind();
        $('#table-applications_filter input').bind('keyup', function(e) {
            if(e.keyCode == 13) {
                $dt.search($(this).val()).draw();
            }
        });

        $('#filter-by-status').change(function() {
            $dt.search($('#table-applications_filter input').val()).draw();
        });

        $('input[type="search"]').focus();
    })
    .on('click', '.edit-application', function() {
        $appl_id = $(this).data('appl-id');

        $jc = $.confirm({
            title: false,
            draggable: true,
            columnClass: 'small',
            content: function() {
                var self = this;

                return $.ajax({
                    url: $app_url + '/csr/application/edit',
                    data: { 'appl_id':$appl_id },
                    method: 'get',
                    success: function(res) {
                        self.setContent('<p class="text-center"><i class="fa fa-share-alt text-bold text-primary" style="font-size:54px"></i></p>' +
                                    '<p class="text-center">Redirecting you to edit application page. Please wait...</p>');

                        window.location.href = $app_url + "/csr/application/edit?appl_id=" + $appl_id;
                    },
                    error: function(data) {
                        self.setContent('<p class="text-center"><i class="fa fa-gg text-bold text-danger" style="font-size:54px"></i></p>' +
                                    '<p class="text-center">'+ data.responseJSON.msg +'</p>');
                    }
                });
            },
            buttons: {
                CANCEL: {
                    btnClass:'btn btn-danger',
                    text: '<small>[ENTER]</small> GOT IT!',
                    keys: ['enter']
                }
            }
        });
    })
    .on('click', '.view-survey-result', function() {
        var $appl_id = $(this).data('appl-id');

        $.confirm({
            title: '',
            draggable: true,
            columnClass: 'x-large',
            type: 'blue',
            content: function() {
                var self = this;

                return $.ajax({
                    url: $app_url + '/csr/application/view-survey',
                    data: { 'appl_id' : $appl_id },
                    dataType: 'html',
                    method: 'get'
                }).done(function(res) {
                    self.setContent(res);
                }).fail(function() {
                    self.setContent('Something went wrong. Please try again or refresh the page.');
                });
            },
        });
    })
    .on('click', '.print-assessment', function() {
        $app_no = $(this).data('ano');

        window.open($app_url + '/csr/application/assessment-print?app_no=' + $app_no, '_blank');
    })
    .on('click', '.additional-materials', function() {
        var $trow = $(this).closest('tr');
        
        $jc = $.confirm({
            title: false,
            draggable: true,
            columnClass: 'x-large',
            type: 'blue',
            content: function() {
                var self = this;

                return $.ajax({
                    url: $app_url + '/csr/application/additional-materials',
                    data: { 'appl_id' : $trow.data('appl-id') },
                    // dataType: 'html',
                    method: 'get'
                }).done(function(res) {
                    self.setContent(res);
                }).fail(function(data) {
                    $jc.setColumnClass('medium');
                    $jc.setType('red');
                    $jc.buttons.DONE.disable(true);
                    self.setContent('<p class="text-center"><i class="fa fa-gg text-bold text-danger" style="font-size:54px"></i></p>' +
                                    '<p class="text-center">'+ data.responseJSON.msg +'</p>');
                });
            },
            onContentReady: function() {
                $('#material_id')
                .select2({
                    allowClear: true,
                    dropdownParent: $('.jconfirm-scrollpane')
                })
                .on('select2:select', function() {
                    var id     = $('#material_id option:selected').data('id');
                    var uom    = $('#material_id option:selected').data('uom');
                    var price  = $('#material_id option:selected').data('price');
                    var desc   = $('#material_id option:selected').text();
                    var qty    = "<input type='text' value='1' class='mats-qty text-right form-control input-sm num wnum-only pnum-only' style='width: 100%;''>";
                    var uprice = "<input type='text' value='"+numeral(price).format('0,0.00')+"' class='mats-uprice text-right form-control input-sm curr' data-num-min='1' data-num-max='999999' style='width: 100%;''>";
                    var tbody  = $('#table-materials > tbody');

                    var dupe   = 0;
                    var items  = $('#table-materials > tbody > tr');

                    items.each(function() {
                        if($(this).data('item-id') == id) { dupe++; }
                    });

                    if (price <= 0) {
                        $.confirm({
                            draggable: true,
                            title: false,
                            type: 'red',
                            content:'<p class="text-center"><i class="fa fa-fw fa-exclamation-circle text-bold text-danger" style="font-size:54px"></i></p>' +
                                    '<h4 class="text-center text-bold text-danger">SOMETHING WENT WRONG</h4>' +
                                    '<hr style="margin-bottom:8px">' +
                                    '<p class="text-center">Material <strong>'+desc.toUpperCase()+'</strong> price is set to <strong>ZERO</strong>. Please contact Central Billing and IT for assistance.</p>',
                            buttons: {
                                yes: {
                                    text: '<small>[ENTER]</small> got it!',
                                    btnClass: 'btn-danger',
                                    keys: ['enter']
                                }       
                            }
                        });
                        return false;
                    }

                    if(id == null) {
                        $.alert({
                            icon: 'fa fa-exclamation-circle',
                            title: 'Alert!',
                            content: 'Please select an item first.',
                            draggable: true,
                            type: 'orange'
                        });
                    } else {
                        if(dupe > 0) {
                            $.confirm({
                                draggable: true,
                                title: false,
                                type: 'orange',
                                content:'<p class="text-center"><i class="fa fa-fw fa-exclamation-circle text-bold text-warning" style="font-size:54px"></i></p>' +
                                        '<h4 class="text-center text-bold text-warning">SOMETHING WENT WRONG</h4>' +
                                        '<hr style="margin-bottom:8px">' +
                                        '<p class="text-center">The material you selected already exist!</p>',
                                buttons: {
                                    yes: {
                                        text: '<small>[ENTER]</small> got it!',
                                        btnClass: 'btn-warning',
                                        keys: ['enter']
                                    }       
                                }
                            });
                        } else {
                            tbody.prepend("<tr class='mc-mats' data-item-id="+id+">"
                                +"<td>"+ desc.toUpperCase() +"</td>"
                                +"<td>"+ uom.toUpperCase() +"</td>"
                                +"<td class='cellpad-top'>"+ uprice +"</td>"
                                +"<td class='cellpad-top'>"+ qty +"</td>"
                                +"<td class='text-right '>"+ numeral(price).format('0,0.00') +"</td>"
                                +"<td class='text-center'><a href='#' class='text-danger remove-mat'><i class='fa fa-trash' style='margin-top:3px'></i></a></td>"
                                +"</tr>");

                            if ($company == 3 || $branch == 80 || ($mats_update != '' && $mats_update >= $date)) {  
                                $('.mats-uprice').prop('disabled', false).select();
                            }
                            else {
                                $('.mats-uprice').prop('disabled', true);
                            }

                            $('#amt-discount').val('0.00');
                            $('#amt-interest').val('0.00');
                            $('#is_atb').attr('disabled', false);

                            var $table  = $('#table-materials > tbody > tr');
                            var $amount = 0;
                            var $total  = 0;

                            $table.each(function(){
                                $amount = $(this).find('td:eq(4)').text().replace(',','');
                                $total  = Number($total) + Number($amount);
                            });

                            if($total > 0) {
                                $('#materials-summary').css('display', 'block');
                                $('#amt-total').data('amt', $total)
                                               .val(numeral($total).format('0,0.00'))
                                               .trigger('change');

                                $('#amt-discount').data('num-max', $total);
                                $('#amt-interest').data('num-max', $total);
                            } else {
                                $('#materials-summary').css('display', 'none');
                                $('#amt-total').data('amt', 0)
                                               .val('0.00')
                                               .trigger('change');
                                
                                $('#amt-discount').data('num-max', 0);
                                $('#amt-interest').data('num-max', 0);
                            }

                            $('#material_id').val('').trigger('change');
                        } 
                    }
                });

                $(document)
                .on('keyup change', '.mats-qty, .mats-uprice', function() {
                    var $row    = $(this).closest('tr');
                    var $qty    = Number($row.find('.mats-qty').val());
                    // var $uprice = Number($row.find('.mats-uprice').text().replace(',', ''))
                    var $uprice = Number($row.find('.mats-uprice').val().replace(',', ''));

                    $qty    = $qty ? $qty : 0;
                    $uprice = Number($uprice) ? $uprice : 1.00;

                    var $amount = $qty * $uprice;
                    $row.find('td:eq(4)').text(numeral($amount).format('0,0.00'));

                    var $table  = $('#table-materials > tbody > tr');
                    var $amount = 0;
                    var $total  = 0;

                    $table.each(function(){
                        $amount = $(this).find('td:eq(4)').text().replace(',','');
                        $total  = Number($total) + Number($amount);
                    });

                    if($total > 0) {
                        $('#materials-summary').css('display', 'block');
                        $('#amt-total').data('amt', $total)
                                       .val(numeral($total).format('0,0.00'))
                                       .trigger('change');

                        $('#amt-discount').data('num-max', $total);
                        $('#amt-interest').data('num-max', $total);
                    } else {
                        $('#materials-summary').css('display', 'none');
                        $('#amt-total').data('amt', 0)
                                       .val('0.00')
                                       .trigger('change');
                        
                        $('#amt-discount').data('num-max', 0);
                        $('#amt-interest').data('num-max', 0);
                    }

                    $('#material_id').val('').trigger('change');
                })
                .on('keyup change', '#amt-discount', function() {
                    var amt_total = Number($('#amt-total').val().replace(',', ''));
                    var amt_discount = Number($('#amt-discount').val().replace(',', ''));

                    if (amt_total <= amt_discount) {
                        $('#amt-discount').val('0.00');
                    }
                    
                    if (amt_discount > 0) {
                        $('#amt-interest').val('0.00');
                    }
                })
                .on('keyup change', '#amt-interest', function() {
                    var amt_total = Number($('#amt-total').val().replace(',', ''));
                    var amt_interest = Number($('#amt-interest').val().replace(',', ''));

                    if (amt_total <= amt_interest) {
                        $('#amt-interest').val('0.00');
                    }

                    if (amt_interest > 0) {
                        $('#amt-discount').val('0.00');
                    }
                })
                .on('click', '.remove-mat', function() {
                    $(this).closest('tr').remove();

                    var $table  = $('#table-materials > tbody > tr');
                    var $amount = 0;
                    var $total  = 0;

                    $table.each(function(){
                        $amount = $(this).find('td:eq(4)').text().replace(',','');
                        $total  = Number($total) + Number($amount);
                    });

                    if($total > 0) {
                        $('#materials-summary').css('display', 'block');
                        $('#amt-total').data('amt', $total)
                                       .val(numeral($total).format('0,0.00'))
                                       .trigger('change');

                        $('#amt-discount').data('num-max', $total);
                        $('#amt-interest').data('num-max', $total);
                    } else {
                        $('#materials-summary').css('display', 'none');
                        $('#amt-total').data('amt', 0)
                                       .val('0.00')
                                       .trigger('change');

                        $('#amt-discount').data('num-max', 0);
                        $('#amt-interest').data('num-max', 0);
                    }

                    $('#material_id').val('').trigger('change');
                })
                .on('change', '#is_atb', function() {
                    $checked = $(this).is(':checked');

                    if($checked == true) {
                        $('#atb_terms').attr('disabled', false).val(1);
                    } else {
                        $('#atb_terms').attr('disabled', true).val(null);
                    }
                })
                .on('change', '#payment_method', function() {
                    if($(this).val() == 'atb') {
                        $('#atb-terms')
                            .val('1')
                            .prop('disabled', false)
                            .trigger('change');
                    } else {
                        $('#atb-terms')
                            .val(null)
                            .prop('disabled', true);
                    }
                })
                .on('keyup change', '.mats-assessment-control', function() {
                    $ab = Number($('#amt-total').data('amt'));
                    // $pm = $('#payment_method option:selected').val();
                    $pm = $('#is_atb').is(':checked');
                    $da = $('#amt-discount').val() ? Number($('#amt-discount').val().replace(',', '')) : 0;
                    $in = $('#amt-interest').val() ? Number($('#amt-interest').val().replace(',', '')) : 0;

                    compute($ab, $pm, $da, $in);
                });

                var compute = function($amt_basic, $payment_method, $amt_discount, $amt_interest) {
                    $amt_balance = $amt_basic - $amt_discount + $amt_interest;
                    // $amt_interest = $interest > 0 ? Number($amt_balance * $interest / 100) : 0;
                    // $amt_net = $amt_balance + $amt_interest;

                    $('#amt-net').val(numeral($amt_balance).format('0,0.00'));
                    // $('#payment_method').select2({
                    //     allowClear: true,
                    //     dropdownParent: $('.jconfirm-scrollpane')
                    // });
                    
                    // if($payment_method == 'atb') {
                    if($payment_method) {
                        $terms = Number($('#atb_terms').val());
                        $amortization = $amt_balance / $terms;

                        $('#atb-amortization').val(numeral($amortization).format('0,0.00'))
                                              .data('amt', $amortization);
                    } else {
                        $('#atb-amortization').val(null)
                                              .data('amt', null);
                    }
                }
            },
            buttons: {
                CANCEL: {
                    text: 'CANCEL',
                    keys: ['esc']
                },
                DONE: {
                    btnClass: 'btn btn-primary',
                    text: 'POST ADDITIONAL MATERIAL(S)',
                    keys: ['enter'],
                    action: function() {
                        if ($('#amt-net').val().replace(',', '') > 0) {
                            $.confirm({
                                title: '',
                                draggable: true,
                                content: '<p class="text-center"><i class="fa fa-question-circle text-bold text-success" style="font-size:54px"></i></p>' +
                                        '<h4 class="text-center text-bold text-success">Additional Application Material</h4>' +
                                        '<hr style="margin-bottom:8px">' + 
                                        '<p class="text-center">Post additional materials to this service application?</p>',
                                type: 'green',
                                buttons: {
                                    CANCEL: {
                                        btnClass: 'btn btn-default'
                                    },
                                    CONFIRM: {
                                        btnClass: 'btn btn-success',
                                        keys: ['enter'],
                                        action: function() {
                                            mats = [];

                                            $.each($('#table-materials .mc-mats'), function() {
                                                var row = $(this).closest('tr');

                                                var qty = Number($(this).find('.mats-qty').val().replace(',', ''));
                                                var upr = Number($(this).find('.mats-uprice').val().replace(',', ''));

                                                if (upr <= 0) {
                                                    $.confirm({
                                                        draggable: true,
                                                        title: false,
                                                        type: 'red',
                                                        content:'<p class="text-center"><i class="fa fa-fw fa-exclamation-circle text-bold text-danger" style="font-size:54px"></i></p>' +
                                                                '<h4 class="text-center text-bold text-danger">SOMETHING WENT WRONG</h4>' +
                                                                '<hr style="margin-bottom:8px">' +
                                                                '<p class="text-center">Material <strong>'+row.find('td:eq(0)').text().toUpperCase()+'</strong> price is set to <strong>ZERO</strong>. Please contact Central Billing and IT for assistance.</p>',
                                                        buttons: {
                                                            yes: {
                                                                text: '<small>[ENTER]</small> got it!',
                                                                btnClass: 'btn-danger',
                                                                keys: ['enter']
                                                            }       
                                                        }
                                                    });
                                                    return false;
                                                }

                                                mats.push({
                                                    "material_id"   : $(this).data('item-id'),
                                                    "material_desc" : row.find('td:eq(0)').text(),
                                                    "material_uom"  : row.find('td:eq(1)').text(),
                                                    "unit_price"    : upr.toFixed(2),
                                                    "quantity"      : qty,
                                                    "total_price"   : Number(upr * qty).toFixed(2)
                                                });
                                            });

                                            // var $amt_basic = Number($('#amt-total').data('amt'));
                                            var $amt_basic = Number($('#amt-total').val().replace(',', ''));
                                            var $amt_discount = $('#amt-discount').val() ? Number($('#amt-discount').val().replace(',', '')) : 0;
                                            var $amt_interest = $('#amt-interest').val() ? Number($('#amt-interest').val().replace(',', '')) : 0;
                                            var $amt_balance = $amt_basic - $amt_discount;
                                            // var $interest = $('#interest').val() ? Number($('#interest').val()) : 0;
                                            // var $amt_interest = $amt_balance * $interest / 100; 
                                            var $amt_net = $amt_balance + $amt_interest;
                                            // var $payment_method = $('#payment_method option:selected').val();
                                            var $is_atb = $('#is_atb').is(':checked');
                                            var $terms = $('#atb_terms').val() ? Number($('#atb_terms').val()) : null;
                                            var $amortization = $('#atb_terms').val() ? Number($('#atb-amortization').data('amt')) : null;

                                            $.ajax({
                                                url: $app_url + '/csr/application/additional-materials',
                                                data: { 
                                                    'appl_id': $('#appl_id').data('id'),
                                                    'amt_basic': $amt_basic,
                                                    'amt_discount': $amt_discount,
                                                    'amt_interest': $amt_interest,
                                                    'amt_balance': $amt_balance,
                                                    // 'interest': $interest,
                                                    // 'amt_interest': $amt_interest,
                                                    'amt_net': $amt_net,
                                                    'is_atb' : $is_atb,
                                                    'terms' : $terms,
                                                    'amortization' : $amortization,
                                                    'details' : mats
                                                },
                                                method: 'post',
                                                beforeSend: function() {
                                                    $('.form-group').removeClass('has-error').prop('title', '');
                                                }
                                            }).done(function(res) {
                                                $jc.close();
                                                $dt.draw();
                                            }).fail(function(res) {
                                                if(res.status == 422) {
                                                    $.each(res.responseJSON, function(field, message) {
                                                        $('#'+field).closest('.form-group').addClass('has-error').prop('title', message);
                                                    });
                                                } else {
                                                    alert('Unknown error occured. Please try again.');
                                                }
                                            }); 
                                        }
                                    }
                                }
                            });
                        }
                        return false;
                    }
                }
            }
        });
    })
    .on('click', '.remove-materials', function() {
        var id = $(this).data('id');
        var appl_id = $(this).data('apid');
    
        if (id && appl_id) {
            $c = $.confirm({
                draggable: true,
                type: 'red',
                title: '',
                content: '<p class="text-center"><i class="fa fa-question-circle text-bold text-danger" style="font-size:54px"></i></p>' +
                         '<h4 class="text-center text-bold text-danger">Remove Additional Material</h4>' +
                         '<hr style="margin-bottom:8px">' + 
                         '<p class="text-center">Are you sure you want to remove the additional material/s on this service application?</p>',
                buttons: {
                    CANCEL: {
                        text: 'CANCEL',
                        keys: ['esc']
                    },
                    YES: {
                        text: 'CONFIRM',
                        btnClass: 'btn-danger',
                        action: function() {
                            $.ajax({
                                url: $app_url + '/csr/application/additional-materials-cancel',
                                type: 'post',
                                data: {
                                    'id' : id,
                                    'appl_id' : appl_id
                                },
                                success: function(data) {
                                    $jc.close();
                                    $dt.draw();
                                },
                                error: function(result) {
                                    $c.close();
                                }
                            });
                        }
                    }
                }
            });
        }
    })
    .on('click', '.additional-services', function() {
        var $trow = $(this).closest('tr');
        
        $jc = $.confirm({
            title: false,
            draggable: true,
            columnClass: 'x-large',
            type: 'blue',
            content: function() {
                var self = this;

                return $.ajax({
                    url: $app_url + '/csr/application/additional-services',
                    data: { 'appl_id' : $trow.data('appl-id') },
                    // dataType: 'html',
                    method: 'get'
                }).done(function(res) {
                    self.setContent(res);
                }).fail(function(data) {
                    $jc.setColumnClass('medium');
                    $jc.setType('red');
                    $jc.buttons.DONE.disable(true);
                    self.setContent('<p class="text-center"><i class="fa fa-gg text-bold text-danger" style="font-size:54px"></i></p>' +
                                    '<p class="text-center">'+ data.responseJSON.msg +'</p>');
                });
            },
            onContentReady: function() {
                $('#services')
                .select2({
                    allowClear: true,
                    dropdownParent: $('.jconfirm-scrollpane')
                })
                .on('select2:select', function() {
                    $service = $('#services option:selected').val();
                    $amount = $('#services option:selected').data('amount');

                    if($service) {
                        $('#amt_basic').val(numeral($amount).format('0,0.00'));
                        $('#amt_discount').attr('disabled', false).val('0.00').select();
                        $('#amt_interest').attr('disabled', false).val('0.00');
                        $('#amt_balance').val(numeral($amount).format('0,0.00'));
                        $('#is_atb').attr('disabled', false);

                        if ($company == 3 || $branch == 80 || ($mats_update != '' && $mats_update >= $date)) {  
                            $('#amt_basic').attr('disabled', false).select();
                        }
                        else {
                            if ($amount <= 0) {
                                $('#amt_basic').val('').attr('disabled', true);
                                $('#amt_discount').val('').attr('disabled', true);
                                $('#amt_interest').val('').attr('disabled', true);
                                $('#amt_balance').val('').attr('disabled', true);
                                $('#is_atb').prop('checked', false).attr('disabled', true);
                                $('#atb_terms').val('').attr('disabled', true);
                                $('#atb_amortization').val('').attr('disabled', true);

                                $.confirm({
                                    draggable: true,
                                    title: false,
                                    type: 'red',
                                    content:'<p class="text-center"><i class="fa fa-fw fa-exclamation-circle text-bold text-danger" style="font-size:54px"></i></p>' +
                                            '<h4 class="text-center text-bold text-danger">SOMETHING WENT WRONG</h4>' +
                                            '<hr style="margin-bottom:8px">' +
                                            '<p class="text-center">Service <strong>'+$service.toUpperCase()+'</strong> price is set to <strong>ZERO</strong>. Please contact Central Billing and IT for assistance.</p>',
                                    buttons: {
                                        yes: {
                                            text: '<small>[ENTER]</small> got it!',
                                            btnClass: 'btn-danger',
                                            keys: ['enter']
                                        }       
                                    }
                                });
                                return false;
                            }
                            $('#amt_basic').attr('disabled', true);
                        }
                    }
                    
                    if ($('#is_atb').is(':checked')) {
                        $('#atb_terms').trigger('change');
                    }
                });
                

                $('#amt_basic')
                .on('change keyup', function() {
                    $amt_basic    = Number($('#amt_basic').val().replace(',', ''));
                    $amt_discount = Number($('#amt_discount').val().replace(',', ''));

                    if($amt_basic <= $amt_discount) {
                        $('#amt_discount').val('0.00');
                    }

                    compute_balance();
                });

                $('#amt_discount')
                .on('change keyup', function() {
                    $amt_basic    = Number($('#amt_basic').val().replace(',', ''));
                    $amt_discount = Number($('#amt_discount').val().replace(',', ''));

                    if($amt_basic <= $amt_discount) {
                        $('#amt_discount').val('0.00');
                    }

                    if ($amt_discount > 0) {
                        $('#amt_interest').val('0.00');
                    }
                    
                    compute_balance();
                    if ($('#is_atb').is(':checked')) {
                        $('#atb_terms').trigger('change');
                    }
                });

                $('#amt_interest')
                .on('change keyup', function() {
                    $amt_basic    = Number($('#amt_basic').val().replace(',', ''));
                    $amt_interest = Number($('#amt_interest').val().replace(',', ''));

                    if($amt_basic <= $amt_interest) {
                        $('#amt_interest').val('0.00');
                    }

                    if ($amt_interest > 0) {
                        $('#amt_discount').val('0.00');
                    }

                    compute_balance();
                    if ($('#is_atb').is(':checked')) {
                        $('#atb_terms').trigger('change');
                    }
                });

                $('#is_atb')
                .on('change', function() {
                    $checked = $(this).is(':checked');

                    if($checked == true) {
                        $('#atb_terms').attr('disabled', false).val(1);
                    } else {
                        $('#atb_terms').attr('disabled', true).val(null);
                    }

                    compute_amortization();
                });

                $('#atb_terms')
                .on('change keyup', function() {
                    console.log($('#is_atb').is(':checked'));
                    compute_amortization();
                });

                function compute_balance() {
                    $amt_basic    = Number($('#amt_basic').val().replace(',', ''));
                    $amt_discount = Number($('#amt_discount').val().replace(',', ''));
                    $amt_interest = Number($('#amt_interest').val().replace(',', ''));
                    
                    $amt_balance  = $amt_basic - $amt_discount + $amt_interest;

                    $('#amt_balance').val(numeral($amt_balance).format('0,0.00'));
                }

                function compute_amortization() {
                    $amt_balance = $('#amt_balance').val().replace(',','');
                    $atb_terms   = Number($('#atb_terms').val());

                    if($atb_terms) {
                        $amortization = $amt_balance / $atb_terms;
                        $('#atb_amortization').val(numeral($amortization).format('0,0.00'));
                    } else {
                        $('#atb_amortization').val(null);
                    }
                }
            },
            buttons: {
                CANCEL: {
                    text: 'CANCEL',
                    keys: ['esc']
                },
                DONE: {
                    btnClass: 'btn btn-primary',
                    text: 'POST ADDITIONAL SERVICE',
                    keys: ['enter'],
                    action: function() {
                        if ($('#amt_balance').val().replace(',', '') > 0) {
                            $.confirm({
                                title: '',
                                draggable: true,
                                content: '<p class="text-center"><i class="fa fa-question-circle text-bold text-success" style="font-size:54px"></i></p>' +
                                        '<h4 class="text-center text-bold text-success">Additional Application Service Fee</h4>' +
                                        '<hr style="margin-bottom:8px">' + 
                                        '<p class="text-center">Post additional service fee to this service application?</p>',
                                type: 'green',
                                buttons: {
                                    CANCEL: {
                                        btnClass: 'btn btn-default'
                                    },
                                    CONFIRM: {
                                        btnClass: 'btn btn-success',
                                        keys: ['enter'],
                                        action: function() {
                                            $service_desc = $('#services option:selected').val();
                                            $amount = Number($('#amt_basic').val().replace(',',''));
                                            
                                            if ($amount <= 0) {
                                                $.confirm({
                                                    draggable: true,
                                                    title: false,
                                                    type: 'red',
                                                    content:'<p class="text-center"><i class="fa fa-fw fa-exclamation-circle text-bold text-danger" style="font-size:54px"></i></p>' +
                                                            '<h4 class="text-center text-bold text-danger">SOMETHING WENT WRONG</h4>' +
                                                            '<hr style="margin-bottom:8px">' +
                                                            '<p class="text-center">Service <strong>'+$service_desc.toUpperCase()+'</strong> price is set to <strong>ZERO</strong>. Please contact Central Billing and IT for assistance.</p>',
                                                    buttons: {
                                                        yes: {
                                                            text: '<small>[ENTER]</small> got it!',
                                                            btnClass: 'btn-danger',
                                                            keys: ['enter']
                                                        }       
                                                    }
                                                });
                                                return false;
                                            }
                                            
                                            $services = [];
                                            $services.push({
                                                "appl_id"      : $('#appl_id').data('id'),
                                                "service_desc" : $service_desc,
                                                "amount"       : $amount
                                            });

                                            $amt_basic      = Number($('#amt_basic').val().replace(',',''));
                                            $discount_amt   = Number($('#amt_discount').val().replace(',',''));
                                            $discount_rate  = Number(($discount_amt / $amt_basic) * 100);
                                            $interest_amt   = Number($('#amt_interest').val().replace(',',''));
                                            $interest_rate  = Number(($interest_amt / $amt_basic) * 100);

                                            console.log(Number($amt_basic));
                                            $.ajax({
                                                url: $app_url + '/csr/application/additional-services',
                                                data: { 
                                                    'appl_id'          : $('#appl_id').data('id'),
                                                    'services'         : $('#services option:selected').val(),
                                                    'details'          : $services,
                                                    'amt_basic'        : Number($amt_basic),
                                                    'discount_rate'    : $discount_rate.toFixed(2),
                                                    'discount_amt'     : $discount_amt,
                                                    'interest_rate'    : $interest_rate.toFixed(2),
                                                    'interest_amt'     : $interest_amt,
                                                    'amt_balance'      : Number($('#amt_balance').val().replace(',','')),
                                                    'amt_net'          : Number($('#amt_balance').val().replace(',','')),
                                                    'amt_remaining'    : Number($('#amt_balance').val().replace(',','')),
                                                    'is_atb'           : $('#is_atb').is(':checked'),
                                                    'atb_terms'        : Number($('#atb_terms').val()),
                                                    'atb_amortization' : Number($('#atb_amortization').val().replace(',',''))
                                                },
                                                method: 'post',
                                                beforeSend: function() {
                                                    $('.form-group').removeClass('has-error').prop('title', '');
                                                }
                                            }).done(function(res) {
                                                $jc.close();
                                                $dt.draw();
                                            }).fail(function(res) {
                                                if(res.status == 422) {
                                                    $.each(res.responseJSON, function(field, message) {
                                                        $('#'+field).closest('.form-group').addClass('has-error').prop('title', message);
                                                    });
                                                } else {
                                                    alert('Unknown error occured. Please try again.');
                                                }
                                            }); 
                                        }
                                    }
                                }
                            });
                        }
                        return false;
                    }
                }
            }
        });
    })
    .on('click', '.remove-services', function() {
        var id = $(this).data('id');
        var appl_id = $(this).data('apid');
    
        if (id && appl_id) {
            $c = $.confirm({
                draggable: true,
                type: 'red',
                title: '',
                content: '<p class="text-center"><i class="fa fa-question-circle text-bold text-danger" style="font-size:54px"></i></p>' +
                         '<h4 class="text-center text-bold text-danger">Remove Additional Service Fee</h4>' +
                         '<hr style="margin-bottom:8px">' + 
                         '<p class="text-center">Are you sure you want to remove the additional service fee on this service application?</p>',
                buttons: {
                    CANCEL: {
                        text: 'CANCEL',
                        keys: ['esc']
                    },
                    YES: {
                        text: 'CONFIRM',
                        btnClass: 'btn-danger',
                        action: function() {
                            $.ajax({
                                url: $app_url + '/csr/application/additional-services-cancel',
                                type: 'post',
                                data: {
                                    'id' : id,
                                    'appl_id' : appl_id
                                },
                                success: function(data) {
                                    $jc.close();
                                    $dt.draw();
                                },
                                error: function(result) {
                                    console.log(result);
                                    $c.close();
                                }
                            });
                        }
                    }
                }
            });
        }
    })
    .on('click', '.cancel-application', function() {
        var $trow = $(this).closest('tr');

        $jc = $.confirm({
            title: false,
            columnClass: 'medium',
            draggable: true,
            type: 'red',
            content: function() {
                var self = this;

                return $.ajax({
                    url: $app_url + '/csr/application/cancel',
                    data: { 'appl_id' : $trow.data('appl-id') },
                    dataType: 'html',
                    method: 'get'
                }).done(function(res) {
                    self.setContent(res);
                }).fail(function() {
                    self.setContent('Something went wrong. Please try again or refresh the page.');
                });
            },
            onContentReady: function() {
                $('#approved_by').select2({
                    allowClear: true,
                    dropdownParent: $('.jconfirm-scrollpane')
                });

                $('#processing_fee').on('keyup change', function() {
                    $amt_paid = numeral($('#appl-details').data('amt-paid'));
                    $processing_fee = numeral($(this).val().replace(',', ''));
                    $amt_refund = $amt_paid.subtract($processing_fee.value());

                    $('#amt_refund').val($amt_refund.format('0,0.00'));
                });

                $('#cancel_reason').focus();
            },
            buttons: {
                CANCEL: {
                    text: '<small>[esc]</small> CANCEL',
                    keys: ['esc']
                },
                CONFIRM: {
                    text: 'CONFIRM',
                    btnClass: 'btn-danger',
                    action: function() {
                        $.ajax({
                            url: $app_url + '/csr/application/cancel',
                            type: 'post',
                            data: {
                                'appl_number'    : $('#appl-details').data('appl-number'),
                                'amt_paid'       : $('#appl-details').data('amt-paid'),
                                'processing_fee' : $('#processing_fee').val() ? Number($('#processing_fee').val().replace(',', '')) : null,
                                'voucher_number' : $('#voucher_number').val() ? $('#voucher_number').val() : null,
                                'amt_refund'     : $('#amt_refund').val() ? Number($('#amt_refund').val().replace(',', '')) : null,
                                'cancel_reason'  : $('#cancel_reason').val()
                            },
                            beforeSend: function() {
                                $jc.showLoading(true);
                            },
                            success: function(res) {
                                $.confirm({
                                    draggable: true,
                                    title: false,
                                    type: 'blue',
                                    content: '<p class="text-center"><i class="fa fa-fw fa-check text-bold text-primary" style="font-size:54px"></i></p>' +
                                            "<p class='text-center'>Customer's service application was successfully cancelled.</p>",
                                    buttons: {
                                        yes: {
                                            text: '<small>[ENTER]</small> got it!',
                                            btnClass: 'btn-primary',
                                            keys: ['enter']
                                        }
                                    }
                                });

                                $dt.draw();
                                $jc.close();
                            },
                            error: function(err) {
                                $jc.hideLoading(true);
                                console.log(err);
                            }
                        });
                        
                        return false;
                    }
                }
            }
        });
    })
    .on('click', '.fees-assessment', function() {
        $appl_id = $(this).data('appl-id');

        $jc = $.confirm({
            title: false,
            draggable: true,
            columnClass: 'small',
            content: function() {
                var self = this;

                return $.ajax({
                    url: $app_url + '/csr/application/assessment',
                    data: { 'appl_id':$appl_id },
                    method: 'get',
                    success: function(res) {
                        self.setContent('<p class="text-center"><i class="fa fa-share-alt text-bold text-primary" style="font-size:54px"></i></p>' +
                                    '<p class="text-center">Redirecting you to assessment of fees. Please wait...</p>');

                        window.location.href = $app_url + "/csr/application/assessment?appl_id=" + $appl_id;
                    },
                    error: function(data) {
                        self.setContent('<p class="text-center"><i class="fa fa-gg text-bold text-danger" style="font-size:54px"></i></p>' +
                                    '<p class="text-center">'+ data.responseJSON.msg +'</p>');
                    }
                });
            },
            buttons: {
                CANCEL: {
                    btnClass:'btn btn-danger',
                    text: '<small>[ENTER]</small> GOT IT!',
                    keys: ['enter']
                }
            }
        });
    })
    .on('click', '.update-contract-no', function() {
        $content = null;
        $appl_id = $(this).data('appl-id');

        $jc = $.confirm({
            title: false,
            draggable: true,
            columnClass: 'small',
            content: function() {
                $content = this;

                return $.ajax({
                    url: $app_url + '/csr/application/details',
                    data: { 'appl_id':$appl_id },
                    method: 'get',
                    success: function(res) {
                        if(res.payment_status == 'up') {
                            $content.setContent('<p class="text-center"><i class="fa fa-gg text-bold text-danger" style="font-size:54px"></i></p>' +
                                    '<p class="text-center">Updating the <b>Contract Number</b> is not allowed unless the customer service application is paid/settled.</p>');

                            $jc.buttons.UPDATE.disable(true);
                        } else {
                            $contract_no = res.contract_no ? res.contract_no : "";

                            $content.setContent('<p class="text-center"><i class="fa fa-briefcase text-bold text-primary" style="font-size:54px"></i></p>' +
                                    '<div class="form-group">' +
                                        '<label>Customer Service Application Contract Number</label>' + 
                                        '<input type="text" class="form-control" id="contract-no" value="'+ $contract_no +'" placeholder="CONTRACT NUMBER">' +
                                    '</div>');

                            $jc.buttons.UPDATE.enable(true);
                        }
                    },
                    error: function(res) {
                        $content.setContent(res);   
                    }
                });
            },
            buttons: {
                CANCEL: {
                    btnClass:'btn btn-default',
                    text: '<small>[ESC]</small> CLOSE',
                    keys: ['esc']
                },
                UPDATE: {
                    btnClass:'btn btn-primary',
                    text: 'UPDATE CONTRACT NO.',
                    keys: ['enter'],
                    action: function() {
                        $.ajax({
                            url: $app_url + '/csr/application/update-contract-number',
                            method: 'post',
                            data: {
                                'appl_id'     : $appl_id,
                                'contract_no' : $('#contract-no').val()
                            },
                            beforeSend: function() {
                                $jc.showLoading(true);
                            },
                            success: function(res) {
                                $jc.close();
                                $dt.draw();
                            },
                            error: function(res) {
                                // code here
                            },
                            complete: function() {
                                $jc.hideLoading(true);
                            }
                        });

                        return false;
                    }
                }
            }
        });
    })
    .on('click', '.create-ncjo', function() {
        $appl_id = $(this).data('appl-id');

        $jc = $.confirm({
            title: false,
            draggable: true,
            columnClass: 'small',
            content: function() {
                var self = this;

                return $.ajax({
                    url: $app_url + '/csr/application/details',
                    data: { 'appl_id':$appl_id },
                    method: 'get',
                    success: function(res) {
                        if(res.payment_status == 'up') {
                            self.setContent('<p class="text-center"><i class="fa fa-gg text-bold text-danger" style="font-size:54px"></i></p>' +
                                    '<p class="text-center">Creating <b>New Connection - Job Order</b> is not allowed unless the customer service application is paid/settled.</p>');

                            $jc.buttons.CREATE.disable(true);
                        }

                        else if(res.contract_no == null || res.contract_no == "") {
                            self.setContent('<p class="text-center"><i class="fa fa-gg text-bold text-danger" style="font-size:54px"></i></p>' +
                                    '<p class="text-center">Please update first the <b>Contract Number</b> of this service application before creating <b>New Connection -Job Order.</b></p>');

                            $jc.buttons.CREATE.disable(true);
                        }

                        else if(res.is_athena == 1 && (res.athena == "" || res.athena == null)) {
                            self.setContent('<p class="text-center"><i class="fa fa-gg text-bold text-danger" style="font-size:54px"></i></p>' +
                                    '<p class="text-center">Please proceed to <b>Athena > Athena Loans</b> and create the customers <b>Athena Loan Amortization</b> first  before creating <b>New Connection - Job Order.</b></p>');

                            $jc.buttons.CREATE.disable(true);
                        }

                        else {
                            self.setContent('<p class="text-center"><i class="fa fa-file-text-o text-bold text-primary" style="font-size:54px"></i></p>' +
                                    '<p class="text-center">Continue creating <b>New Connection - Job Order</b> for this service application?</p>');

                            $jc.buttons.CREATE.enable(true);
                        }
                    },
                    error: function(res) {
                        self.setContent(res);   
                    }
                });
            },
            buttons: {
                CANCEL: {
                    btnClass:'btn btn-default',
                    text: '<small>[Esc]</small> CLOSE',
                    keys: ['esc']
                },
                CREATE: {
                    btnClass:'btn btn-primary',
                    text: '<small>[Enter]</small> CREATE NC-JO',
                    keys: ['enter'],
                    action: function() {
                        $.ajax({
                            url: $app_url + '/csr/application/create-ncjo',
                            method: 'post',
                            data: {
                                'appl_id'      : $appl_id,
                                'date_created' : $('#date_created').val()
                            },
                            beforeSend: function() {
                                $jc.showLoading(true);
                            },
                            success: function(res) {
                                $jc.close();
                                $dt.draw();
                            },
                            error: function(result) {
                                // code here.
                            },
                            complete: function() {
                                $jc.hideLoading(true);
                            }
                        });

                        return false;
                    }
                }
            }
        });
    })
    .on('click', '.change-conntype', function() {
        $appl_id = $(this).data('appl-id');

        window.location.href = $app_url + "/csr/application/change-connection-type?appl-id=" + $appl_id;
    })
    .on('click', '.view-assessment', function() {
        var $trow = $(this).closest('tr');
        
        $jc = $.confirm({
            title: false,
            draggable: true,
            columnClass: 'x-large',
            type: 'blue',
            content: function() {
                var self = this;

                return $.ajax({
                    url: $app_url + '/csr/application/assessment-view',
                    data: { 'appl_id' : $trow.data('appl-id') },
                    method: 'get'
                }).done(function(res) {
                    self.setContent(res);
                }).fail(function(data) {
                    
                });
            },
            buttons: {
                CLOSE: {
                    btnClass: 'btn btn-default',
                    text: '<small>[ESC]</small> CLOSE',
                    keys: ['esc']
                }
            }
        });
    })
    .on('click', '.view-cancel-details', function() {
        $appl_id = $(this).data('appl-id')

        if ($appl_id != "") {
            $jc = $.confirm({
                title: false,
                draggable: true,
                columnClass: 'medium',
                type: 'red',
                content: function() {
                    var self = this;

                    return $.ajax({
                        url: $app_url + '/csr/application/view-cancel-details',
                        data: { 'id' : $appl_id },
                        dataType: 'html',
                        method: 'get'
                    }).done(function(res) {
                        self.setContent(res);
                    }).fail(function() {
                        self.setContent('Something went wrong. Please try again or refresh the page.');
                    });
                },
                buttons: {
                    CLOSE: {
                        btnClass:'btn btn-default',
                        text: '<small>[ESC]</small> CLOSE',
                        keys: ['esc']
                    }
                }
            });
        }
    });
</script>
@endsection