@extends('layouts/microfin_layout')
@section('title', '| OTS Interest Generate')
@section('content')
<style type="text/css">
    .form-group, .form-control{
        font-size: 11px !important;
        color: black !important;
    }
    .form-control{
        padding: 5px !important;
    }
    #searchButton{
        font-size: 12px;
        margin-top: 20px;
    }
</style>
<script type="text/javascript">
    $("#loadingModal").show();
    $(document).keydown(function(e) {
        if (e.keyCode == 27) return false;
    });
</script>

<div class="row add-data-form">
    <div class="col-md-12">
        <div class="col-md-8 col-md-offset-2 fullbody">
            <div class="viewTitle" style="border-bottom:1px solid white;">
                <a href="{{ url('otsInterestGenerate') }}" class="btn btn-info pull-right addViewBtn">
                    <i class="glyphicon glyphicon-th-list viewIcon"></i>
                    OTS Interest Generate List
                </a>
            </div>
            <div class="panel panel-default panel-border">
                <div class="panel-heading">
                    <div class="panel-title">Add OTS Interest</div>
                </div>
                <div class="panel-body">
                    <div class="row">
                        <div class="col-md-8 col-md-offset-2">
                            {!! Form::open(array('url' => '', 'role' => 'form', 'class' => 'form-horizontal form-groups')) !!}

                            {!! Form::hidden('deposit_type_id',5,['id'=>'deposit_type_id','class'=>'form-control',  'required' => 'required', 'readonly']) !!}
                                
                                <div class="form-group">
                                    <label for="generateFor" class="col-md-3 control-label required">Generate For:</label>
                                    <div class="col-sm-9">
                                        <input name="generateFor" type="radio" value="1" id="branch">
                                        <label for="branch" class="control-label">Branch</label>  &nbsp; &nbsp;
                                        <input name="generateFor" type="radio" value="2" id="particular_account">
                                        <label for="particular_account" class="control-label">Particular Account</label>
                                    </div>
                                </div>

                                <div class="form-group branchDiv">
                                    {!! Form::label('branch_id', 'Branch:', ['class' => 'col-md-3 control-label required']) !!}
                                    <div class="col-sm-9">
                                       <select id="branch_id" name="branch_id" class="form-control">
                                           @foreach($branchList as $b)
                                                <option value='{{$b->id}}'>{{str_pad($b->branchCode,3,'0',STR_PAD_LEFT) .'-'.$b->name}}</option>
                                           @endforeach
                                       </select>
                                    </div>
                                </div>

                                <div class="form-group">
                                    {!! Form::label('accIdFk', 'Account:', ['class' => 'col-md-3 control-label required']) !!}
                                    <div class="col-sm-9">
                                       <select id="accIdFk" name="accIdFk" class="form-control">
                                           <option value="0">Select</option>
                                       </select>
                                    </div>
                                </div>

                                <div class="form-group">
                                    {!! Form::label('generate_date', 'Generate Date:', ['class' => 'col-md-3 control-label required']) !!}
                                    <div class="col-sm-9">
                                        {!! Form::text('generate_date',null,['id'=>'generate_date','class'=>'form-control','style'=>'cursor:pointer;','readonly', 'placeholder' => 'Select Date', 'required' => 'required']) !!}
                                    </div>
                                </div>

                                <div class="form-group">
                                    {!! Form::label('generate_code', 'Generate ID:', ['class' => 'col-md-3 control-label required']) !!}
                                    <div class="col-sm-9">
                                        {!! Form::text('generate_code',null,['id'=>'generate_code','class'=>'form-control',  'required' => 'required', 'readonly']) !!}
                                    </div>
                                </div>


                                
                                <ul class="pager wizard pull-right">                                        
                                    {!! Form::button('Preview', ['id' => 'preview', 'class' => 'btn btn-info']) !!}
                                    <a href="{{ url('otsInterestGenerate') }}" class="btn btn-danger closeBtn">Close</a>
                                </ul>                                    
                                
                            {!! Form::close() !!}
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>


<script type="text/javascript">

$(document).ready(function() {
   /*  $('#loadingModal').show();
    $("#reportingDiv").load('{{URL::to("./loadMfnEligibleOtsList")}}');

    $("#filterFormId").submit(function( event ) {
        event.preventDefault();
        $("#loadingModal").show();
        $("#reportingDiv").load('{{URL::to("./loadMfnSamityList")}}'+'?'+$("#filterFormId").serialize());
        $("#loadingModal").hide();
    }); */

    // alert('hello');
    $("input[name=generateFor][value=" + 1 + "]").prop('checked', true);
    $("#loadingModal").hide();
    // $("#generate_date").datepicker({
    //     changeMonth: true,
    //     changeYear: true,
    //     showButtonPanel: true,

    //     onClose: function(dateText, inst) {
    //         var month = $("#ui-datepicker-div .ui-datepicker-month :selected").val();
    //         var year = $("#ui-datepicker-div .ui-datepicker-year :selected").val();
    //         $(this).val($.datepicker.formatDate('dd-MM-yy', new Date(year, month, 1)));
    //         $("#datee").hide();
    //     }
    // });

    // $("#generate_date").focus(function () {
    //     $(".ui-datepicker-calendar").hide();
    //     $("#ui-datepicker-div").position({
    //         my: "center top",
    //         at: "center bottom",
    //         of: $(this)
    //     });
    // });

    $("#generate_date").datepicker({
        changeMonth: true,
        changeYear: true,
        dateFormat: 'dd-mm-yy',
      });


    $("[name=generateFor]").change(function(event) {
        var generateFor = $('input[name=generateFor]:checked').val();
        $('#accIdFk').parents('.form-group').hide('slow');
        if(generateFor == '2'){
            $('#accIdFk').parents('.form-group').show('slow');
        }
    });

    $('#branch_id').on('change', function() {
        var branch_id = $('#branch_id').val();
        $("#accIdFk option:gt(0)").remove();
        var deposit_type_id = 5;
        $.ajax({
            url: '{{ url('otsInterestGenerate/otsGenerateData') }}',
            type: 'POST',
            data: {branch_id: branch_id, deposit_type_id:deposit_type_id},
            dataType: 'json',
        })
        .done(function(data) {
            $('#generate_code').val(data.generate_code);
            $.each(data.account, function (index, v) {
                $("#accIdFk").append("<option value='" + v.id + "'>" + v.savingsCode + "</option>");
            });  
        })
        .fail(function() {
            alert("error");
        });
	});


    $('#preview').on('click', function() {
        var generateFor = $('input[name=generateFor]:checked').val();
        var branch_id   = $('#branch_id').val();
        var accIdFk         = $('#accIdFk').val();
        var generate_date   = $('#generate_date').val();
        var deposit_type_id = 5;
        if(branch_id == '' || generate_date == '' || generateFor == null || (generateFor == '2' && accIdFk == '0')){
            toastr.warning('Please Fill Up All Field', 'Message!', opts);
            return false;
        }
        var csrf = "{{csrf_token()}}";

        $.ajax({
            url: '{{ url('otsInterestGenerate/preview') }}',
            type: 'POST',
            data: { _token: csrf, generateFor:generateFor, branch_id: branch_id , accIdFk:accIdFk, generate_date:generate_date, deposit_type_id:deposit_type_id},
            dataType: 'html',
        })
        .done(function(data) {
            $('#preview-modal').modal('show', {backdrop: 'static'});
			$('#previewForm').html(data);
        })
        .fail(function() {
            alert("error");
        });
	});

    $('form').submit(function(event){
        event.preventDefault();
        $(".error").remove();
        $("button").prop('disabled', true);
        $('#loadingModal').show();
        $.ajax({
            type: 'post',
            url: '{{ url('otsInterestGenerate/store') }}',
            dataType: 'json',
            data: $('form').serialize(),
            success: function(data) {
                // Print Error
                if(data.errors) {
                    $("button").prop('disabled', false);
                    $.each(data.errors, function(name, error) {
                            $("#"+name).after("<p class='error' style='color:red;'>* "+data.errors[name]+"</p>");
                    });
                    $('#loadingModal').hide();
                } else {
                    if(data.responseTitle == "Success!"){
                        $('#loadingModal').hide();
                        toastr.success(data.responseText, data.responseTitle, opts);
                        setTimeout(function(){
                            window.location.href = '{{ url('otsInterestGenerate') }}';
                        }, 2000);
                    }else{
                        toastr.warning(data.responseText, data.responseTitle, opts);
                        $('#loadingModal').hide();
                        $("button").prop('disabled', false);
                    }
                }
            },
            error: function(_response) {
                alert(_response.errors);
                $('#loadingModal').hide();
                $("button").prop('disabled', false);
            }
        });
        });

    $('#branch_id').trigger('change');
    $('[name=generateFor]:checked').trigger('change');


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

@endsection
<div class="modal fade" id="preview-modal">
	<div class="modal-dialog modal-lg">
		{!! Form::open(array('url' => '', 'role' => 'form', 'class' => 'form-horizontal form-groups','id'=>'previewForm')) !!}
		
		{!! Form::close() !!}
	</div>
</div>