@extends('hr_main')
@section('title', '| '. $data['pageTitle'] )
@section('content')

<div class="row add-data-form">
    <div class="col-md-12">
        <div class="col-md-1"></div>
        <div class="col-md-10 fullbody">
            <div class="viewTitle" style="border-bottom: 1px solid white;">
                <a href="{!! $data['listUrl'] !!}" class="btn btn-info pull-right addViewBtn"><i class="glyphicon glyphicon-th-list viewIcon">
                    </i>{!! $data['listLabel'] !!}</a>
            </div>
            <div class="panel panel-default panel-border">
                <div class="panel-body">
                    <div class="row">
                        <div class="col-md-12">

                            <div class="panel-heading">
                                <div class="panel-title">{!! $data['pageTitle'] !!}</div>
                            </div>

                            <div class="panel-body">
                                
                                {!! Form::open(array('role' => 'form', 'files' => 'false', 'id' => 'formId', 'class' => 'form-horizontal form-groups')) !!}

                                    <div class="form-group">
                                        <label class='col-sm-2 control-label'>Branch<span style='color: red'>*</span></label>
                                        <div class="col-sm-4">
                                            {!! Form::select('branch_id', $data['branches'], null, ['class' => 'select2 form-control', 'id' => 'branch_id']) !!}
                                        </div>
                                    </div>

                                    <div class="form-group">
                                        <label class='col-sm-2 control-label'>Employee<span style='color: red'>*</span></label>
                                        <div class="col-sm-4">
                                            {!! Form::select('employee_id', ['' => 'Select Employee'], null, ['class' => 'select2 form-control', 'id' => 'employee_id']) !!}
                                        </div>
                                    </div>

                                    <div class="form-group">
                                        <label class='col-sm-2 control-label'>Transaction Date<span style='color: red'>*</span></label>
                                        <div class="col-sm-4">
                                            {!! Form::text('transaction_date', '', ['class' => 'datepicker form-control', 'id' => 'transaction_date']) !!}
                                        </div>
                                    </div>

                                    <div class="form-group">
                                        <label class='col-sm-2 control-label'>Withdraw Amount</label>
                                        <div class="col-sm-4">
                                            {!! Form::text('withdraw_amount', '', ['class' => 'form-control', 'id' => 'withdraw_amount', 'readonly' => true]) !!}
                                        </div>
                                    </div>

                                    <div class="row" style="margin-top: 10px;">
                                        <div class="form-group col-md-12 text-center">
                                            <div class="col-sm-12">
                                                <a href="javascript:;" class='btn btn-success' id='submit' onclick="submitForm()">Submit</a>
                                                <a href="{!! $data['listUrl'] !!}" class="btn btn-danger closeBtn">Close</a>
                                            </div>
                                        </div>
                                    </div>
                                    
                                {!! Form::close() !!}                                

                            </div>

                        </div>
                    </div>
                </div>
            </div>
            <div class="footerTitle" style="border-top:1px solid white"></div>
        </div>
        <div class="col-md-1"></div>
    </div>
</div>
@endsection


@section('footerAssets')

<script type="text/javascript">

    function submitForm() {
      $("#submit").prop('disabled', true);

      $.ajax({
          type: 'post',
          url: "{{ route('wf-withdraw-store') }}",
          data: $('#formId').serialize(),
          dataType: 'json',
          success: function(__response) {
            if(__response.status == true) {
                toastr.success(__response.message);
                setTimeout(function() {  window.location = __response.url; }, 500);
            }

            if(__response.status == false) {
                toastr.error(__response.message);
            }

            $("#submit").prop('disabled', false);

          },
          error: function(error) {
              toastr.error('Something went wrong!');
              $("#submit").prop('disabled', false);
          }
      });
    }

    $('#branch_id').change(function() {
        var branch_id = $(this).val();
        
        $("#employee_id").select2("val", "");
        $("#employee_id option").remove();
        $('#withdraw_amount').val('');

        if(branch_id) {   
            $.ajax({
                url: '../wf-withdraw/getEmployees',
                type: 'POST',
                dataType: 'json',
                data: {
                    "branch_id": branch_id,
                    "_token": $('meta[name="_token"]').attr('content')
                },
                success: function(__response) {
                    $("#employee_id").select2("val", "");
                    $("#employee_id option").remove();

                    if(__response) {
                        $("#employee_id").append("<option value=''>Select Employee</option>");
                        $("#employee_id").select2("val", "");

                        $.each(__response, function(id, name) {
                            $("#employee_id").append("<option value='" + id + "'>" + name + "</option>");
                        });
                    }
                    else {
                        alert("something went wrong");
                    }
                },
                error: function(jqXhr, textStatus, errorThrown) {
                    alert('Something went wrong');
                }
            });
        }
    });

    $('#employee_id').change(function() {
        var employee_id = $(this).val();
        var transaction_date = $('#transaction_date').val();
        $('#withdraw_amount').val('');

        if(employee_id && transaction_date) {
            getWithdrawAmount(employee_id, transaction_date);
        }
    });

    $("#transaction_date").keypress(function (evt) {
        return false;
    });

    $('#transaction_date').on("changeDate", function() {
        var transaction_date = $(this).val();
        var employee_id = $('#employee_id').val();
        $('#withdraw_amount').val('');

        if(employee_id && transaction_date) {
            getWithdrawAmount(employee_id, transaction_date);
        }
    });

    function getWithdrawAmount(employee_id, transaction_date) {
        $.ajax({
            url: '../wf-withdraw/getEmployeeWfWithdrawAmount',
            type: 'POST',
            dataType: 'json',
            data: {
                "employee_id": employee_id,
                "transaction_date": transaction_date,
                "_token": $('meta[name="_token"]').attr('content')
            },
            success: function(__response) {
                if(__response.status) {
                    $('#withdraw_amount').val(__response.withdrawAmount);
                }
                else {
                    alert(__response.message);
                }
            },
            error: function(jqXhr, textStatus, errorThrown) {
                alert('Something went wrong');
            }
        });
    }

</script>

@endsection