@extends('layouts.admin')

@section('content')
<div class="formswrap">
  <section class="forms-basic consearchbasic">
    <form class="form-floating form-validate" id="applypaymentsearchform" name="applypaymentsearchform">
		{{ csrf_field() }}
		<div class="row m-b-40">
		  <div class="col-md-12">
			<div class="well white consearcheight">
				<fieldset>
					<input type="hidden" name="search" id="search" value="true">
					<div class="form-group">
						<label for="search_invoice_number" class="control-label">INVOICE #</label>
						<input type="text" class="form-control" name="search_invoice_number" id="search_invoice_number" value="@if(isset($searchData['invoice_number'])){{ $searchData['invoice_number']}}@endif">
					</div>
					<div class="form-group">
						<label for="search_from_date" class="control-label">FROM DATE</label>
						<input type="text" class="form-control datepicker" name="search_from_date" id="search_from_date" value="@if(isset($searchData['from_date'])){{ $searchData['from_date']}}@endif">
					</div>
					<div class="form-group">
						<label for="search_to_date" class="control-label">TO DATE</label>
						<input type="text" class="form-control datepicker" name="search_to_date" id="search_to_date" value="@if(isset($searchData['to_date'])){{ $searchData['to_date']}}@endif">
					</div>			
					<div class="form-group">
						<label for="search_client_name" class="control-label">CLIENT</label>
						<input type="text" class="form-control" name="search_client_name" id="search_client_name" value="@if(isset($searchData['client_name'])){{ $searchData['client_name']}}@endif">
					</div>
					<div class="form-group">
						<label for="search_reference" class="control-label">REFERENCE #</label>
						<input type="text" class="form-control" name="search_reference" id="search_reference" value="@if(isset($searchData['reference'])){{ $searchData['reference']}}@endif">
					</div>
					<div class="clearfix"></div>
					<div class="form-group ">
						<label class="control-label normal">Status</label>
						<select name="search_status" id="search_status" class="form-control" tabindex="-1" aria-hidden="true">
							<option value="">Please Select</option>
							<option value="PAID"  @if((isset($searchData['invoice_status'])) && ($searchData['invoice_status'] == 'PAID')) selected @endif >Paid</option>
							<option value="UNPAID"  @if((isset($searchData['invoice_status'])) && ($searchData['invoice_status'] == 'UNPAID')) selected @endif>Unpaid</option>
							<option value="PARTIAL"  @if((isset($searchData['invoice_status'])) && ($searchData['invoice_status'] == 'PARTIAL')) selected @endif>Partial</option>
						</select>
					</div>
					
				</fieldset>
			</div>
		  </div>
		  <div class="newcontbtn">
			<input class="btn btn-sm btn-danger contbtnnew" type="submit" name="invoice-search" id="invoice-search" value="Search">
			<input type="hidden" name="search_clear" id="search_clear" value="">
			<input class="btn btn-sm btn-danger contbtnnew" type="button" name="invoice-clear" id="invoice-clear" value="Clear">
		</div>
		</div>
	</form>
  </section>
</div>
<div class="card">
	<div class="newcontbtn">
		<select id="apply-payment-action" name="apply-payment-action" style="height: 35px;width: 149px;">
			<option value="">No Action</option>
			<option value="apply_payment">Apply Payment</option>
		</select>
		<input class="btn btn-sm btn-danger" id="apply-payment-action-submit" name="apply-payment-action-submit" value="SUBMIT" type="button">
		<div class="pull-right total-amount-box" style="display:none;padding:10px 25px;font-size:16px;color:#fff;background-color:rgb(244, 67, 54);">
			<p style="margin:0px;"><b>Total Amount:</b> <span id="total-amount"></span></p>
		</div>
	</div>
	<div class="datatables">
	  <table id="apply-payment-table" class="table table-striped table-full table-full-small" cellspacing="0" width="100%">
		<thead>
		  <tr>
			<th></th>
			<th>Invoice #</th>
			<th>Order #</th>
			<th>Client</th>
			<th>Invoice Date</th>
			<th>Original Amount</th>
			<th>Paid Amount</th>
			<th>Invoice Status</th>
		  </tr>
		</thead>
		<tbody>
		</tbody>
	  </table>
	</div>
</div>
<!-- apply payment action modal -->
<div class="modal fade" id="applyPaymentModal" role="dialog">
	<div class="modal-dialog" style="width:400px;">
	  <div class="modal-content">
		<div class="modal-header">
		  <button type="button" class="close" data-dismiss="modal">&times;</button>
		  <h4 class="modal-title firstTime" id="marktitle">Apply Payments</h4>
		</div>
		<div class="modal-body">
			<div class="col-md-12">
				<form class="form-floating" id="applypaymentform" name="applypaymentform">
					 {{ csrf_field() }}
					<fieldset>
						<div class="form-group">
							<label for="payment_date" class="control-label">Payment Date</label>
							<input type="text" class="form-control datepicker" id="payment_date" name="payment_date">
						</div>
						<div class="form-group filled">
							<label for="payment_method" class="control-label">Payment Method</label>
							<select name="payment_method" id="payment_method" class="select2 form-control deposite_width" tabindex="-1" aria-hidden="true" data-validation="required">
								<option value="">Please Select</option>
							</select>
						</div>
						<div class="form-group">
							<label for="reference_no" class="control-label">Reference #</label>
							<input type="text" class="form-control" id="reference_no" name="reference_no">
						</div>
						<div class="form-group filled">
							<label for="deposite_to" class="control-label">Deposite to</label>
							<select name="deposite_to" id="deposite_to" class="select2 form-control deposite_width" tabindex="-1" aria-hidden="true" data-validation="required" >
								<option value="">Please Select</option>
							</select>
						</div>
						<div class="form-group">
							<label for="amount_received" class="control-label">Amount Received</label>
							<input type="text" class="form-control" id="amount_received" name="amount_received">
						</div>
					</fieldset>
					<div class="clearfix"></div>
					<input class="btn btn-sm btn-danger" type="button" name="Submit" value="Submit" id="add-to-payment"></input>
				</form>
			</div>
		</div>
		<div class="modal-footer firstTime_footer">		  
		</div>
	  </div>  
	</div>
</div>
<div>
@endsection
<style type="text/css">
	.deposite_width ~ span{
	    width:100% !important;
	}
</style>
@section('scripts')
<script charset="utf-8" src="{{asset('backend/js/services/applyPayments.js?v=1.0')}}"></script>
@endsection