@extends('layouts.portal.app')
	@section('content')
		<script type="text/javascript" src="{{ url('custom/js/jquery-3.3.1.js') }}"></script>
		<link rel="stylesheet" type="text/css" href="{{ url('custom/smart-search/jquery-ui.min.css') }}">

		<div class="content-wrapper">
			<div class="container-xxl flex-grow-1 container-p-y">
				<div class="card">
					<h4 class="breadcrumb ml-3"> <span class="text-muted fw-light breadcrumb-link"> Home /</span> {{ $directorShare->names }}'s Transactions - {{ number_format($transactions->total()) }} records fetched </h4>

					@if(Session::has('errorResponse')) 
						<h6 class="row"> 
							<div class="col-md-12 temporary-alert">
								<div class="alert alert-danger alert-dismissible" role="alert"> <i class="fa fa-info-circle"></i> {!! Session::has('errorResponse') ? Session::get("errorResponse") : '' !!} <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"> </button> </div>
							</div>
						</h6>
					@endif
					
					<div class="card-header d-flex border-top rounded-0 flex-wrap py-2">
						<label> 
							<input type="text" class="keyword form-control" placeholder="Search Customer"> 
							<input type="hidden" name="director_share_id" class="director-share-id">
						</label>
					</div>

					<div class="card-datatable table-responsive text-nowrap">
						<table class="table">
							<thead class="border-top">
								<tr>
									<th> # </th>
									<th> User </th>
									<th> Recipient </th>
									<th> Amount </th>
									<th> Transaction Code </th>
									<th> Date Sent </th>
								</tr>
							</thead>

							<tbody>
								@foreach($transactions as $transaction)
									<tr>
										<td> <a href="javascript:;" class="text-success"> #{{ $transaction->ref_no }} </a> </td>

										<td> {{ $transaction->user? $transaction->user->username.' - '.$transaction->user->ref_no: '' }} </td>

										<td> {{ $transaction->recipient }} </td>

										<td> {{ number_format($transaction->amount, 2) }} </td>

										<td> {{ $transaction->transaction_code }} </td>

										<td> {{ \Carbon\Carbon::parse($transaction->created_at)->format('d M Y') }} at {{ \Carbon\Carbon::parse($transaction->created_at)->format('h:i A') }} </td>
									</tr>
								@endforeach
							</tbody>
						</table>

						{{ $transactions->render() }}
					</div>
				</div>
			</div>
		</div>

		<script type="text/javascript">
			(function($) 
		    {
		        var CSRF_TOKEN = $('meta[name="csrf-token"]').attr('content');
		        
		        $( ".keyword" ).autocomplete({
		            source: function(request, response) 
		            {
		                $.ajax({
		                    url:"{{ url('smartly-search-directors') }}",
		                    type: 'post',
		                    dataType: "json",
		                    data: {
		                       _token: CSRF_TOKEN,
		                       keyword: request.term
		                    },

		                    success: function(data) 
		                    {
		                        response(data);
		                    }
		                });
		            },

		            select: function (event, ui) 
		            {
		                var app_url = $('#app_url').val();

		                window.location.href = ""+app_url+"found-directors/"+ui.item.director-share_id+"";
		            }
		        });
		    })(jQuery);
		</script>
	@endsection