<div class="modal fade" id="financePaymentsForm" tabindex="-1" role="dialog" aria-labelledby="paymentModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <!-- <h4 class="modal-title">Default Modal</h4> -->
        <h5 class="modal-title text-center" id="paymentModalLabelHeading">Payment Details</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        <div class="hidden" id="financeNotifyArea"></div>
        <form class="form-vertical" method="POST" id="financeForm" action="{{ url('clients/finance_store') }}">
            {{ csrf_field() }}
            <input type="hidden" name="client_id" id="clientID" value="{{ $showclient->id }}">
              <div class="row">
                <div class="form-group">
                  <div class="col-md-12">
                    <label for="financeServicesStore">Services *</label>
                    {!! Form::select('services[]', $service_type_names , old('services'), ['class' => 'form-control' , 'id' => 'financeServicesStore', 'required' => 'required', 'multiple'=> 'true', 'style' => 'width: 100%']) !!}
                  </div>
                </div>
                <div class="form-group" id="ShortCodeFormGrp" >
                  <div class="col-md-12" style="padding-bottom: 5px;">
                    <label for="shortCode">Short Code</label>
                    <input type="text" class="form-control" name="short_code" id="shortCode" >
                    <p class="text-warning">Enter Short related to the selected service</p>
                  </div>
                </div>
                <div class="form-group" >
                  <div class="col-md-12" style="padding-bottom: 5px;">
                    <label for="invoiceNumber">Invoice Number *</label>
                    <input type="text" class="form-control" name="invoice_number" id="invoiceNumber" required >
                  </div>
                </div>
                <div class="form-group" >
                  <div class="col-md-12" style="padding-bottom: 5px;">
                    <label for="invoiceAmount">Invoice Amount</label>
                    <input type="text" class="form-control" name="invoice_amount" id="invoiceAmount" required >
                    <div class="help-block text-warning">Enter Amount without commas</div>
                  </div>
                </div>
                <div class="form-group">
                  <div class="col-md-12">
                    <div class='input-group date' id='myDatepicker2' style="padding-bottom: 5px;">
                        <label for="invoiceDate">Invoice Date *</label>
                        <!-- <input type='text' class="form-control" /> -->
                        <input type="text" class="form-control" name="invoice_date"  id="invoiceDate" required >
                        <div class="input-group-addon">
                          <span class="fa fa-calendar"></span>
                        </div>
                    </div>
                  </div>
                </div>
                <div class="form-group">
                  <div class="col-md-12" style="padding-bottom: 5px">
                    <label for="invoiceStatus">Status *</label>
                    {!! Form::select('invoice_status', [ 'PAID' => 'PAID', 'UNPAID' => 'UNPAID'] , old('services'), ['class' => 'form-control' , 'id' => 'invoiceStatus', 'required' => 'required', 'placeholder' => '', 'style' => 'width: 100%']) !!}
                  </div>
                </div>
                <div class="form-group" >
                  <div class="col-md-12" style="padding-bottom: 5px;">
                    <label for="remarks">Remarks</label>
                    <input type="text" class="form-control" name="remarks"  id="remarks"></textarea>
                  </div>
                </div>


                <div class="form-group" style="margin-bottom: 0.2rem; padding-bottom: 5px; padding-top: 5px;">
                    <div class="col-md-12" style="padding-bottom: 10px;">
                        <button type="submit" class="btn btn-success btn-block updateBtn"> <i class="fa fa-send"></i> Submit</button>
                    </div>
                </div>
                <div class="form-group" style="margin-bottom: 0.5rem; padding-bottom: 5px; padding-top: 5px;">
                  <div class="col-md-12">
                    <button type="button" class="btn btn-dark btn-block" data-dismiss="modal"><i class="fa fa-close"></i> Close</button>
                  </div>
                </div>

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

    </div>
    <!-- /.modal-content -->
  </div>
  <!-- /.modal-dialog -->
</div>
<!-- /.modal -->
