@extends('layouts.masterHome2')

@section('content')
 
<br/>
<div class="row">
<div class="col-md-2"></div>
  <div class="col-md-8">

      <div class="card card-info">
          <div class="card-header">
            <h3 class="card-title"> حركة الخزنة </h3>
          </div>
          <!-- /.card-header -->
          <!-- form start -->
          <form   role="form" method="POST" action="{{ url('/safehistory/create') }}">
                        {{ csrf_field() }}
          <div class="box-body">
                
            <div class="card-body">
                   
            
                  <div class="col-md-12" style="display: flex;flex-flow: row;justify-content: space-around;" >

                    <div class="form-group col-md-6">
                      <label for="exampleInputPassword1">Date from  </label>
                      <input type="date" id="from" name="from" class="form-control"  placeholder="Date from " required>
                    </div>
                    <div class="form-grou col-md-6">
                      <label for="exampleInputPassword1">Date to</label>
                      <input type="date" id="to"   name="to" onchange="getSafeAccounts()" class="form-control"  placeholder="Date to " required>
                    </div>
                  </div>
  
                
                <div class="form-group">
                  <label>  أختر حساب الخزنة  </label>
                  <select class="form-control select2 select2-hidden-accessible"   style="width: 100%;" name="safe_account_id" id="safe_account_id" required>
                    @foreach( $safe_accounts as $account ) 
                    <option value="{{ $account->id }}"  >{{$account->payment_method->name}} -- {{$account->branch->name}} </option>
                    @endforeach
                  </select>
                  </div>
  
                   
  
   
  
  
                </div>
                <!-- /.box-body -->
  

                 


                <div class="card-footer">
                  <button type="submit" class="btn btn-info">Create</button>
                </div>  

              </div>
          </form>
      </div>


  </div>
        <!-- /.row -->
</div>
<br/><br/><br/>

 
 <script>


function getSafeAccounts() {

	
  const formData = {
            from: $('#from').val(),
            to: $('#to').val(),
        };

       
	$.ajax({
            url: 'getSafeAccounts',
            type: 'POST',
            data: formData,
            headers: {
                'X-CSRF-TOKEN': "{{ csrf_token() }}"
            },
            success: function(response) {
                if (response.success) {
                 
                  
                  var sel = $('#safe_account_id').empty();
                  var safe_accounts = response.safe_accounts ;
                  sel.append('<option> Choose Items</option>');
                  for (var i = 0; i < safe_accounts.length; ++i) {
                    sel.append('<option value="' + safe_accounts[i].safe_account.id + '">' + safe_accounts[i].payment_method_name + '</option>');			
                  } 
                    
                } else {
                    alert('حدث خطأ أثناء الحفظ: ' + response.message);
                }
            },
            error: function(xhr) {
                alert('حدث خطأ في الاتصال بالخادم');
                console.error(xhr.responseText);
            }
        });
	}

    </script>


@endsection