@extends('layouts.master')

@section('content')
<style>

.right-img{
    position: relative;
}
.right-img #affiliate-search{
    height: 30px;
    width: 30px;
    display: none;
    position: absolute;
    right: 10px;
    top: 32px;
}

</style>
<!-- Content Wrapper. Contains page content -->
<div class="content-wrapper">
  <!-- Content Header (Page header) -->
  <div class="content-header">
    <div class="container-fluid">
      <div class="row mb-2">
        <div class="col-sm-6">
          <h1 class="m-0 text-dark">{{ trans('breadcrumbs.Transfer Commission') }}</h1>
        </div>
        <!-- /.col -->
        <div class="col-sm-3"></div>
        <div class="col-sm-3">
          <ol class="breadcrumb float-sm-right">
            <li class="breadcrumb-item">{{ Breadcrumbs::render('Transfer Commission') }}</li>
          </ol>
        </div>
        <!-- /.col -->
      </div>
      <!-- /.row -->
    </div>
    <!-- /.container-fluid -->
  </div>
  <!-- /.content-header -->

  <section class="content">
    <div class="card" id="filterDiv">
      <div class="card-header">
        
        <div class="col-md-6 card-primary card-form-1">
          <div class="card-body">
            <div class="form-col-1 right-img">
                {{ Form::label('SELECT_AFFILIATE',  trans('affiliate.Select Affiliate'),['class' => 'required'])}}
                {{ Form::select('SELECT_AFFILIATE', $partnerName, ' ', ['class' => 'form-control select2', 'placeholder' => trans('reports.Select option'), 'id' => 'AFFILIATE_NAME', 'onchange' => 'checkUser(this.value)']) }}
                <img id="affiliate-search" src="{{ asset('img/loader-img.gif') }}">
                <span id='affiliateUser-error' class="error-help-block" ></span>
                <span id='partnerId-error' class="error-help-block" ></span>
                <span id='affiliateName'></span>
            </div>
            <div class="form-col-1">
                {{ Form::label('AMOUNT', trans('affiliate.Amount',['class' => 'required']),['class' => 'required']) }}
                {{ Form::text('AMOUNT','', ['id' => 'AMOUNT', 'class' => 'form-control number','maxlength' => 10]) }}
                <span id="amount-error" class="error-help-block"></span>
            </div>
            <br> <br>
            <div class="button_sec" id="form-buttons">
              <button class="btn btn-primary" id="transfer-form-submit">{{ trans('affiliate.Transfer') }}</button>
            </div>
            <div class="button_sec" id="form-loader" style="display:none">
              <img style="height: 65px;width: 65px;" src="{{ asset('img/lg.double-ring-spinner.gif') }}">
            </div>

          </div>
        </div>
      </div>
      <!-- /.card-body -->
    </div>

    
  </section>

</div>
@endsection
@section('javascript')
@include('datatablejs')
<script type="text/javascript">
  
  function checkUser(partnerId) {
    $('#affiliateName').html('');

    if(partnerId == ''){
      return;
    }

    var data = new FormData();
    data.append('partnerId', partnerId);
    data.append('_token', '{{ csrf_token() }}');

    $.ajax({
      type: 'POST',
      url: "{{ route('transferCommission.getAffiliateUser') }}",
      data: data,
      dataType: 'JSON',
      contentType: false,
      processData: false,
      beforeSend: function() {
        $("#affiliate-search").show();
      },
      success: function(response) {
        var data = response.msg;
        var status = response.status;
        if (status == 200) {
          $('#affiliateName').html("Affiliate Site Account: "+data.userName);
        } else {
          $("#affiliateUser-error").html(data);
        }
      },
      error: function() {
        swal("{{ trans('layout.Something went wrong') }}", {
          icon: "warning",
        });
      },
      complete: function() {
        $("#affiliate-search").hide();
      }
    });
  }

  function showErrorMessage(message){
    $('.error-help-block').html('');
    $.each(message, function(k, v) {
      $("#"+k+"-error").html(v);
    });
    return;
  }

  $(document).on('change', '.form-control', function(){
    $(this).closest('div').find('.error-help-block').html('');
  });

  $(document).on('click', '#transfer-form-submit', function(e) {
    e.preventDefault();
    partnerId = $("#AFFILIATE_NAME").val();
    amount = $("#AMOUNT").val();
    var data = new FormData();
    data.append('partnerId', partnerId);
    data.append('amount', amount);
    data.append('_token', '{{ csrf_token() }}');

    $.ajax({
      type: 'POST',
      url: "{{ route('transferCommission.transferAmount') }}",
      data: data,
      dataType: 'JSON',
      contentType: false,
      processData: false,
      beforeSend: function() {
        $("#form-buttons").hide();
        $("#form-loader").show();
      },
      success: function(response) {
        var message = response.msg;
        var status = response.status;
        if (status == 422) {
          showErrorMessage(message);
          return;
        }
        if (status == 200) {
			    $('#AFFILIATE_NAME').val(null).trigger('change');
			    $('#AMOUNT').val('');
          swal(message, {
            icon: "success",
          });
        } else {
          swal(message, {
            icon: "warning",
          });
        }
        $('.error-help-block').html('');
        
      },
      error: function() {
        swal("{{ trans('layout.Something went wrong') }}", {
          icon: "warning",
        });
      },
      complete: function() {
        $("#form-loader").hide();
        $("#form-buttons").show();
      }
    });
  });

  $(document).on('keydown', '.number', function(event){
    if (event.shiftKey == true) {
      event.preventDefault();
      return;
    }

    if ((event.keyCode >= 48 && event.keyCode <= 57) || (event.keyCode >= 96 && event.keyCode <= 105) || event.keyCode == 8 || event.keyCode == 9 || event.keyCode == 37 || event.keyCode == 39 || event.keyCode == 46 || event.keyCode == 190 || event.keyCode == 110) {
    } else {
      event.preventDefault();
      return;
    }

    if(($(this).val().length == 0) && (event.keyCode == 190 || event.keyCode == 110)){
      event.preventDefault();
      return;
    }

    if(($(this).val().indexOf('.') != -1) && (event.keyCode == 190 || event.keyCode == 110)){
      event.preventDefault();
      return;
    }
  });
</script>
@stop