@extends('layouts.backend')
@section('mainContentArea')
@include('backend.pos-window.bill-menu')
<style>
  .paymentLabel {
    display: block;
    font-weight:bold;
    font-size:12px;
  }
</style>
<div class="row">
    <div class="col-md-6 offset-md-3">
      <div class="card card-default">
        <div class="card-header"><h4>Select Customer for Exchange</h4></div>
        <div class="card-body">
          <div class="form-group">
            <label for="telephone">Enter 10 digit telephone number</label>
            <input type="number" class="form-control" id="telephoneSearch">
            <span class="text-danger">Please enter 10 digit customer telephone number and press Enter</span>
          </div>
          <div class="form-group searchResults"></div>
        </div>
      </div>
    </div>
  </div>
@endsection

@section('extraJs')
<script>
    $("#telephoneSearch").keyup(function (event){
    if(event.which == 13) {
      var tel = event.target.value;
      $.post("{{ route('get-customer') }}", {
            _token: document.tokenForm._token.value,
            telephone: tel
        }, function(result) {
            var response = jQuery.parseJSON(result);
            if(response.status == true) {
                toastr.success(response.info);
                var html = '<div class="alert alert-success">Found following matching customers!</div>';
                html+='\
                <table class="table table-striped">\
                  <thead>\
                    <tr>\
                      <th>SPS</th>\
                      <th>Name</th>\
                      <th>Email</th>\
                      <th>Telephone</th>\
                      <th>Action</th>\
                    </tr>\
                  </thead>\
                  <tbody>';
                  for(var i = 0; i < response.customers.length; i++) {
                    var c = response.customers[i];
                    html+='<tr>\
                      <td>'+(c.spsInfo == 1 ? 'Yes' : 'No')+'</td>\
                      <td>'+c.fullname+'</td>\
                      <td>'+c.email+'</td>\
                      <td>'+c.telephone+'</td>\
                      <td><a href="{{ route('exchange-form') }}?customer='+c.customer_id+'" class="btn btn-small btn-primary">Select</a></td>\
                    </tr>';
                  }
                  html+='</tbody>\
                  </table>\
                ';
                $(".searchResults").html(html);
                return false;
            } else {
                toastr.error(response.info);
                $(".searchResults").html('<div class="alert alert-danger">No matching customer found!</div>');
                return false;
            }
            return false;
        });
    }
  });
</script>
@endsection