<div class="modal fade" tabindex="-1" role="dialog" id="modal_edit_bill_payment" style="width: 100%;">
	<div class="modal-dialog" role="document" style="width: 100%; height: 100% !important; margin: 0;">
		<div class="modal-content" style="width: 100%; height: 100%;">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
				<h4 class="modal-title">@lang('lang_v1.all_sales_edit')</h4>
			</div>
			<div class="modal-body">
				<div class="row">
                    <div class="col-sm-12" style="font-size: 27px;">
                        <input type="hidden" name="transaction_type" id="transaction_type">
                        <i class="fa fa-clock"></i><span id="doc_number_bill_payment"></span>
                    </div>
                    <div class="col-sm-2">
                        <div class="form-group">
                            <label for="">Vendor</label>
                            <select name="vendor_bill_payment" id="vendor_bill_payment" class="form-control select2" style="width: 100%">
                                <option value=""></option>
                            </select>
                        </div>
                    </div>                    
                    <div class="col-sm-2">
                        <div class="form-group">
                            <label for="">Bank Account</label>
                            <select name="bank_account_bill_payment" id="bank_account_bill_payment" class="form-control select2" style="width: 100%">
                                <option value=""></option>
                            </select>
                        </div>
                    </div>
                    {{-- <div class="col-sm-2">
                        <span id="balance"></span>
                    </div> --}}
                    <div class="col-sm-1 pull-right">
                        <div class="form group" style="width: 100%;">
                            <label for="" style="font-size: 16px;" class="" id="balance_status_bill_payment">Balance Due</label>
                            <br>
                            <span id="amount_bill_payment" name="amount_bill_payment" class="" style="font-size: 30px;">$274.50</span>
                            {{-- <a href="javascript:void(0)" id="subtotal_bill_payment_old" readonly>Have payment made </a>
                            <input type="hidden" id="subtotal_balance_old"> --}}
                        </div>
                    </div>
                    <div class="clearfix"></div>
                    {{-- <div class="clearfix"></div>. --}}
                    <div class="col-sm-2">
                        <div class="form-group">
                            <label for="">Mailing Address</label>
                            <textarea name="mailing_address_bill_payment" id="mailing_address_bill_payment" cols="30" rows="3" class="form-control"></textarea>   
                        </div>
                    </div>
                    {{-- <div class="col-sm-2">
                        <div class="form-group">
                            <label for="">Terms</label>
                            <select name="term_bill_payment" id="term_bill_payment" class="form-control select2" style="width: 100%">
                                <option value=""></option>
                            </select>
                        </div>
                    </div> --}}
                    <div class="col-sm-2">
                        <div class="form-group">
                            <label for="">Payment Date</label>
                            <input class="form-control dob-date-picker" readonly="" name="bill_payment_date" type="text" id="bill_payment_date" value="{{ date('m/d/Y') }}">
                        </div>
                    </div>
                    {{-- <div class="col-sm-2">
                        <div class="form-group">
                            <label for="">Due Date</label>
                            <input class="form-control dob-date-picker" readonly="" name="due_date_bill_payment" type="text" id="due_date_bill_payment">
                        </div>
                    </div> --}}
                    {{-- <div class="col-sm-2">
                        <div class="form-group">
                            <label for="">Bill no.</label>
                            <input type="text" name="bill_payment_no" id="bill_payment_no" class="form-control">
                        </div>
                    </div> --}}                                                            
                    <div class="clearfix"></div>                    
                    <div class="col-sm-12">
                        <table class="table table-striped">
                            <thead>
                                <tr>
                                    <th style="width: 2%;">#</th>
                                    <th style="width: 20%;">Description</th>                                    
                                    <th style="width: 10%;">Due Date</th>
                                    <th style="width: 10%;">Original Amount</th>
                                    <th style="width: 10%;">Open Balance</th>
                                    <th style="width: 5%;">Payment</th>
                                    <th style="width: 0%;">&nbsp;</th>
                                </tr>
                            </thead>
                            <tbody id="bill_payment_list"></tbody>
                        </table>
                        <tfoot>
                            <tr style="text-align: right;">
                                <td colspan="6">Amount to Apply</td>
                                <td id="amount_to_apply"></td>
                            </tr>
                        </tfoot>
                    </div>                                             
                    <div class="col-sm-4">
                        <div class="form-group">
                            <label for="">Memo</label> 
                            <textarea name="memo_bill_payment" id="memo_bill_payment" cols="30" rows="3" class="form-control"></textarea>   
                        </div>    
                    </div>              
                </div>
			</div>
			<div class="modal-footer" style="padding: 2rem;background: #fff;position: sticky;bottom: 0;">
				<button type="button" class="btn btn-default" data-dismiss="modal">@lang('messages.close')</button>				
				<button type="button" onclick="update_all_sales()" class="btn btn-primary">@lang('messages.save')</button>
			</div>
		</div><!-- /.modal-content -->
	</div><!-- /.modal-dialog -->
</div><!-- /.modal -->