<div class="row">
  <div class="col-lg-12">
    <ol class="breadcrumb">
       <li><a href="<%= crm_root_path %>">Home</a></li>
    </ol>
  </div>
</div>


<div class="row">
  <div class="col-lg-7 col-md-7 col-sm-7">

      <div class="main-box-body clearfix">
        <div class="table-responsive">
          <table class="table table-striped">

            <thead>

              <tr>
                 <td colspan="6">
                 <% path ="/origami/#{@sale_id}/customers" %>
                    <%= form_tag path, :method => :get do %>
                      <div class="input-append col-md-12 form-group pull-left">
                        <input type="text" name="filter" style="margin-right:10px" placeholder="Search" class="form-control input-sm col-md-4">
                        <button type="submit" class="btn btn-primary btn-sm">Search</button>
                      </div>
                    <% end %>
                 </td>
              </tr>
              <tr>
                <th>Select</th>
                <th>Sr.no</th>
                <th>Name</th>
                <th>Company</th>
                <th>Contact no</th>
                <th>Email</th>
              </tr>
            </thead>

            <tbody>
              <% if @crm_customers.count > 0  %> 
              <% @i = 0 %>
                 <% @crm_customers.each do |crm_customer| %>
                
                     <tr class="customer_tr" data-ref="<%= crm_customer.customer_id %>">
                     <td>
                     <input type="radio" style="width:20px;" name="checkbox" class="checkbox_check" ></td>
                      <td>
                      <% if crm_customer.customer_id != "CUS-000000000001" && crm_customer.customer_id != "CUS-000000000002" %> 
                      <%= @i += 1 %>
                      <% end %>
                      </td>
                      <td><%= crm_customer.name %></td>
                      <td><%= crm_customer.company rescue '-' %></td>
                      <td><%= crm_customer.contact_no %></td>
                      <td><%= crm_customer.email %></td>


                    </tr>
                  <% end %>
              <%else%>
                 <tr><td colspan="5"><p style="text-align:center"><strong>There are no record for your search</strong></p></td></tr>
              <% end %>
            </tbody>
          </table>
          <br>

          <%= paginate @crm_customers %>
        </div>
      </div>

  </div>

  <div class="col-lg-4 col-md-4 col-sm-4">
    <%= simple_form_for @crm_customer,:url => crm_customers_path, :method => :post do |f| %>

    <span class="patch_method"></span>
    <input type="hidden" id="sale_id" name="sale_id" value="<%= @sale_id %>" />
    <input type="hidden" id="table_id" name="table_id" value="<%= @dining_facility.id %>" />
    <input type="hidden" id="type" name="type" value="<%= @dining_facility.type %>" />
    <%= f.error_notification %>
    <%= f.hidden_field :id, :class => "form-control col-md-6 " %>
    <div class="form-group <%= (flash["errors"]) ? "has-error" : "" %>">
      <%= f.input :card_no, :class => "form-control col-md-6 card_no"%>
      <% flash.each do |name, msg| %>
         <% str="[\"#{msg['name']}\"]"
         str.gsub!('["', '')
         str.gsub!('"]', '') %>
         <span class="help-block" style="margin-top:-10px"><%= str %></span>
      <% end -%>
    </div>
    <div class="form-group">
      <label>Salutation :</label><br>
       <label>Mr</label>
        <%= f.radio_button :salutation,"Mr", :class => "salutation mr", :value=>"Mr", :style=>"width: 30px"%>
        <label>Miss</label>
        <%= f.radio_button :salutation,"Mrs", :class => "salutation mrs", :value=>"Mrs", :style=>"width: 30px"%>
        <label>Mrs</label>
        <%= f.radio_button :salutation,"Miss", :class => "salutation miss", :value=>"Miss", :style=>"width: 30px"%>
        <label>Mdm</label>
        <%= f.radio_button :salutation,"Mdm", :class => "salutation mdm", :value=>"Mdm", :style=>"width: 30px"%>    
   </div>
    
    <div class="form-group <%= (flash["errors"]) ? "has-error" : "" %>">
      <%= f.input :name, :class => "form-control col-md-6 name", :required => true %>
      
      <% flash.each do |name, msg| %>
         <% str="[\"#{msg['name']}\"]"
         str.gsub!('["', '')
         str.gsub!('"]', '') %>
         <span class="help-block"><%= str %></span>
      <% end -%>
    </div>

     <div class="form-group">
      <label>Gender :</label><br>
      <label>Male</label>
      <%= f.radio_button :gender,"Male", :class => "gender male", :value=>"Male", :style=>"width: 30px"%>
        <label>Female</label>
        <%= f.radio_button :gender,"Female", :class => "gender female", :value=>"Female", :style=>"width: 30px"%>
   </div>
    
    <div class="form-group">
      <%= f.input :nrc_no, :class => "form-control nrc_no" %>
    </div>
    <div class="form-group">
      <%= f.input :company, :class => "form-control col-md-6 company",:required => true%>
      
      <%  flash.each do |name, msg| %>
        <% str="[\"#{msg['company']}\"]"
         str.gsub!('["', '')
         str.gsub!('"]', '') %>
        <span class="help-block"><%= str %></span>
      <% end -%>
    </div>
    <div class="form-group <%= (flash["errors"]) ? "has-error" : "" %>">
      <%= f.input :contact_no, :class => "form-control col-md-6 contact_no" ,:required => true%>
      
      <%  flash.each do |name, msg| %>
        <% str="[\"#{msg['contact_no']}\"]"
         str.gsub!('["', '')
         str.gsub!('"]', '') %>
        <span class="help-block"><%= str %></span>
      <% end -%>
    </div>

    <div class="form-group <%= (flash["errors"]) ? "has-error" : "" %>">
      <%= f.input :email, :class => "form-control col-md-6 email" ,:required => true%>
      <% flash.each do |name, msg| %>
         <% str="[\"#{msg['contact_no']}\"]"
            str.gsub!('["', '')
            str.gsub!('"]', '') %>
         <span class="help-block"><%= str %></span>
      <% end -%>
    </div>

    <div class="form-group">
      <%= f.input :address, :class => "form-control col-md-6 address" %>
    </div>

    <div class="form-group">
    <label>Sr.No</label>
     <input type="text" name="" value="<%=@count_customer%>" class="form-control" readonly="true">
   </div>
    <div class="form-group">
      <label>Date Of Birth</label>
      <%= f.text_field :date_of_birth,:value=>"01-01-1990",:class=>"form-control datepicker"%>
    </div>

    <div class="form-group">
     <label>Select Member Group</label>
     <select class="selectpicker form-control col-md-12" name="member_group_id">
        <option value="">Select Membership Group</option>
      <%  Lookup.where("lookup_type = ?", "member_group_type" ).each do |member| %>
      <option value="<%= member.value %>">
        <%= member.name %></option>
        <%end %>
      </select>
    </div>

    <div class="form-group">
      <%= f.button :submit, "Submit",:class => 'btn btn-primary ', :id => 'submit_customer' %>
      <!--  <%= f.button :submit, "Update",:class => 'btn btn-primary ', :disabled =>'', :id => 'update_customer' %> -->
    </div>
    <%end%>
  </div>
   <div class="col-lg-1 col-md-1 col-sm-1">
        <br>
       <button id="back" class="btn btn-primary">
        <i class="fa fa-arrow-left fa-lg"></i> Back
       </button>
   </div>
</div>

<script type="text/javascript">
  $(function() {
    $('.datepicker').datepicker({
       setDate: '12-12-1999',
       format : 'dd-mm-yyyy',
       autoclose: true
    });
    $('.datepicker').attr('ReadOnly','true');
    $('.datepicker').css('cursor','pointer');
  });

  $(document).on('click',".customer_tr",function(){
     // if(this.checked){
            $(this).closest('tr').find('.checkbox_check').prop( "checked", true );
            var sale_id     = $("#sale_id").val() || 0;
            var customer_id = $(this).attr('data-ref');

            if(sale_id != 0){
              // var url = "/"+customer_id;
              update_sale(customer_id,sale_id);
            }else{

              var url = "customers/"+customer_id;
            }

              $.ajax({
                type: "GET",
                url: url,
                data: {},
                dataType: "json",
                success: function(data) {
                   $('#customer_id').val(data.id);
                    $('#customer_name').val(data.name);
                    $('#customer_company').val(data.company);
                    $('#customer_contact_no').val(data.contact_no);
                    $('#customer_email').val(data.email);
                    $('#customer_date_of_birth').val(data.date_of_birth);
                    $('#customer_membership_type').val(data.membership_type);
                    $('.select > option[value="'+data.membership_id+'"]').attr('selected','selected');
                    $('.membership_authentication_code').val(data.membership_authentication_code);

                    $('#customer_salutation').val(data.salutation);
                    $('#customer_nrc_no').val(data.nrc_no);

                    if (data.gender == 'Male') {
                      $('.male').prop( "checked", true )
                    }else{
                      $('.female').prop( "checked", true )
                    }

                    if (data.salutation == 'Mr') {
                      $('.mr').prop( "checked", true )
                    } else if(data.salutation == 'Miss') {
                      $('.miss').prop( "checked", true )
                    }else if(data.salutation == 'Mrs'){
                      $('.mrs').prop( "checked", true )
                    }else{
                      $('.mdm').prop( "checked", true )
                    }

                    $('#update_customer').removeAttr('disabled').val('');
                    $('#update_customer').attr('value', 'Update');
                    // $('#submit_customer').attr('disabled','disabled');

                    $("#new_customer").attr('class', 'simple_form edit_customer');
                    var id = "edit_customer_"+$('#customer_id').val();
                    $("#new_customer").attr('id', id);
                    $(".edit_customer").attr('action', '/crm/customers/' + $('#customer_id').val());
                    $(".edit_customer").attr('action', '/crm/customers/' + $('#customer_id').val());
                    $(".patch_method").append('<input type="hidden" name="_method" value="patch">');
                    //$(".edit_customer").attr('method', 'PATCH');
                }
             });
          // }else{

          // }
  })

  function update_sale(customer_id,sale_id) {
      $.confirm({
        title: 'Confirm!',
        content: 'Are You Sure to assign this customer!',
        buttons: {

              cancel: function () {

              },
              confirm: {
              text: 'Confirm',
              btnClass: 'btn-green',
              keys: ['enter', 'shift'],
              action: function(){
                  $.ajax({
                        type: "POST",
                        url: "update_sale" ,
                        data: {customer_id:customer_id,sale_id:sale_id},
                        dataType: "json",
                        success: function(data) {
                          if(data.status == true)
                          {
                            var id       = $("#table_id").val()
                            var type     = $("#type").val()
                            if (type=="Table") {
                              window.location.href = '/origami/table/'+id
                            }else{
                              window.location.href = '/origami/room/'+id
                            }
                            
                          }else{
                            alert('Record not found!');
                            location.reload();
                          }

                        }
                });
               }
              }
         }
      });
  }

  $('#back').on('click',function(){
    var id       = $("#table_id").val()
    var type     = $("#type").val()
      if (type=="Table") {
        window.location.href = '/origami/table/'+id
     }else{
       window.location.href = '/origami/room/'+id
      }
  })

</script>

