@extends('layout.app')
@section('title')
    Banks
@endsection
@section('pagetitle')
Banks
@endsection
@section('content')
  <div class="container">
    <div class="row" id="advanced-input">
              <div class="col-md-12">
                <div class="panel widget">
                    <div class="panel-heading">
                        <div style="text-align: end">
                           <a href="#" onclick="addBank('Add Bank')" class="btn btn-default"><span class="menu-icon"> <i class="fa fa-plus"></i> </span> Add Bank</a>
                        </div>
                      </div>
                  <div class="panel-body">

                    <div class="row">
                    <div class="col-md-12 col-lg-12 col-sm-12">
                  @include('includes.success')
                    </div>
                    </div>
                    <div class="table-responsive">
                        <table class="table table-striped table-bordered table-condensed table-hover" id="acoff">
                            <thead>
                                <tr>
                                    <th>Sn</th>
                                    <th>Bank Name</th>
                                    <th>Code</th>
                                    <th>Logo</th>
                                    <th></th>
                                </tr>
                            </thead>    
                            <tbody>
                                                                @foreach ($banks as $item)
                                <tr id="d{{$item->id}}">
                                    <td>{{$i+1}}</td>
                                    <td>{{ucwords($item->bank_name)}}</td>
                                    <td>{{ucwords($item->bank_code)}}</td>
                                    <td><img src="{{asset($item->bank_logo)}}" width="30" height="30" alt=""></td>
                                    <td>
                                        @can('manage users')
                                        <a href="#" class="btn menu-icon vd_bd-blue vd_blue btn-sm" onclick="editbank('{{$item->id}}','{{$item->bank_name}}','{{$item->bank_code}}','edit')"><i class="fa fa-pencil"></i> </a>
                                       @endcan
                                       @if (Auth::user()->roles()->first()->name == "super admin" || Auth::user()->roles()->first()->name == "managing director")
                                        <a href="javascript:void(0)" class="btn menu-icon vd_bd-red vd_red btn-sm"onclick="deleterecord('{{route('bank.delete',['id' => $item->id])}}','{{$item->id}}')"><i class="fa fa-times"></i> </a>
                                          @endif
                                    </td>
                                </tr>
                                                                @endforeach
                            </tbody>
                        </table>
                    </div>
                  </div>
                </div>
                <!-- Panel Widget --> 
              </div>
              <!-- col-md-12 --> 
            </div>
            <!-- row -->
  </div>

  <!-- Modal -->
 <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
      <div class="modal-content">
        <div class="modal-header vd_bg-blue vd_white">
          <button type="button" class="close" data-dismiss="modal" aria-hidden="true"><i class="fa fa-times"></i></button>
          <h4 class="modal-title" id="myModalLabel"></h4>
        </div>
        <div class="modal-body"> 
          <form class="form-horizontal" action="{{route('bank.edit.create')}}" method="post" id="bankd" enctype="multipart/form-data">
            @csrf
            <div class="form-group" style="margin:0 5px">
              <label>Bank Name</label>
                <input type="text" name="bank_name" id="bn" value="{{old('bank_name')}}">
             
              </div>
            <div class="form-group" style="margin:0 5px">
              <label>Bank Code</label>
                <input type="number" pattern="0-9" name="bank_code" id="bncd" value="{{old('bank_code')}}">
              
              </div>
            <div class="form-group" style="margin:0 5px">
              <label>Bank Logo</label>
                <input type="file" name="bank_logo" accept=".jpg,.jpeg,.png">
              
              </div>
            <input type="hidden" name="id" id="bnkid" value="">
            <input type="hidden" name="type" id="typ" value="">
          
        
        </div>
        <div class="modal-footer background-login">
          <button type="button" class="btn vd_btn vd_bg-grey" data-dismiss="modal">Close</button>
          <button type="submit" class="btn vd_btn vd_bg-green" id="btnssubmit">Save</button>
        </div>
      </form>
      </div>
      <!-- /.modal-content --> 
    </div>
    <!-- /.modal-dialog --> 
  </div>
  <!-- /.modal --> 
@endsection
@section('scripts')

<script>
    function addBank(ad){
        $("#myModal").modal('show');
        $("#myModalLabel").text('Add Bank');
        $("#bn").val("");
      $("#bncd").val("");
      $("#bnkid").val("");
        $("#typ").val('create');
    }
</script>
<script>
    function editbank(id,bnm,bcd,ed){
        $("#myModal").modal('show');
        $("#myModalLabel").text('Edit Bank');
      $("#bn").val(bnm);
      $("#bncd").val(bcd);
      $("#bnkid").val(id);
      $("#typ").val('update');
    }
</script>
    <script type="text/javascript">
  $(document).ready(function(){
     let aud = $("#acoff").dataTable({
      'pageLength':25,
      'dom': 'Bfrtip',
      buttons: [ 'copy', 'csv', 'print','pdf']
    });

    $("#bankd").submit(function(e){
      e.preventDefault();
      $.ajax({
        url: $("#bankd").attr('action'),
        method: 'post',
        contentType : false,
        processData : false,
        data: new FormData(document.getElementById('bankd')),
        beforeSend:function(){
          $("#btnssubmit").text('Please wait...');
          $("#btnssubmit").attr('disabled',true);
        },
        success:function(data){
          if(data.status == 'success'){
            $("#btnssubmit").text('Save');
          $("#btnssubmit").attr('disabled',false);
          toastr.success(data.msg);
            window.location.reload();
          }else{
            toastr.error(data.msg);
             $("#btnssubmit").text('Save');
           $("#btnssubmit").attr('disabled',false);
             return false;
           }
        },
        error:function(xhr,status,errorThrown){
          let err = '';
          $.each(xhr.responseJSON.errors, function (key, value) {
                err += value;
            });
            toastr.error(err);
          $("#btnssubmit").text('Save');
          $("#btnssubmit").attr('disabled',false);
          return false;
        }
      });
    });
  });
</script>


<script type="text/javascript">

  function deleterecord(url,ids){
    if(confirm('Are you sure you want to delete these record')){
        $.ajax({
        url: url,
        method: 'get',
        beforeSend:function(){
          $(".loader").css('visibility','visible');
          $(".loadingtext").text('Deleting...');
        },
        success:function(data){
          if(data.status == 'success'){
            $(".loader").css('visibility','hidden');
          toastr.success(data.msg);
          $("#d"+ids).remove();
          }else{
            toastr.error(data.msg);
            $(".loader").css('visibility','hidden');
             return false;
           }
        },
        error:function(xhr,status,errorThrown){
             $(".loader").css('visibility','hidden');
            toastr.error('Error '+errorThrown);
          return false;
        }
      });
      }  
  }
</script>
@endsection