<div class="row">
  <div class="col-lg-11 col-md-11 col-sm-11">
    <!-- Column One -->

    <!-- Nav tabs -->
    <ul class="nav nav-tabs" role="tablist">
      <li class="nav-item">
        <a class="nav-link active" data-toggle="tab" href="#customer" role="tab">Customer Details</a>
      </li>
      <li class="nav-item">
        <a class="nav-link " data-toggle="tab" href="#order" role="tab">Order Details</a>
      </li>
      <li class="nav-item">
        <a class="nav-link" data-toggle="tab" href="#sale" role="tab">Sale Details</a>
      </li>
    </ul>
    <!-- Nav tabs - End -->

    <div class="tab-content" style="min-height:670px; max-height:670px; ">

      <div class="tab-pane active" id="customer" role="tabpanel" style="min-height:670px; max-height:670px; ">
        <div class="table-responsive">
        <br><br>
          <table class="table table-striped">
            <thead>
              <tr>
                <th>Card No</th>
                <th>Name</th>
                <th>Company</th>
                <th>Contact no</th>
                <th>Email</th>
                <th>NRC/Passport No</th>
                <th>Address</th>
                <th>DOB</th>
              </tr>
            </thead>

            <tbody>
              <tr>
                <td><%= @customer.card_no rescue '-'%></td>
                <td><%= @customer.name %></td>
                <td><%= @customer.company rescue '-' %></td>
                <td><%= @customer.contact_no %></td>
                <td><%= @customer.email %></td>
                <td><%= @customer.nrc_no %></td>
                <td><%= @customer.address%></td>
                <td><%= @customer.date_of_birth %></td>
              </tr>
              <tr><th colspan="8"></th></tr>
              
            </tbody>
          </table>
        </div>

        <div class="table-responsive">
          <table class="table table-striped">
            <thead>
            <% 
             if @response["data"].present? %>
               <tr>
                <th colspan="5">Membership Transactions</th>
                <% if @response["status"] == true %>
                 <th>Current Balance : <%= @response["data"].last["balance"]%></th>
                 <% end %>
              </tr>
               <% end %>
              <tr>
                <th>Date</th>
                <th>Redeem</th>
                <th>Rebate</th>
                <th>Balance</th>
                <!-- <th>Account No</th> -->
                <th>Status</th>
                <th>Receipt No</th>
              </tr>
            </thead>
            <tbody>
              <% if @response["status"] == true %>
              <% @response["data"].each do |transaction| %>
              <tr>
                <td><%= transaction["date"]%></td>
                <td><%= transaction["redeem"]%></td>
                <td><%= transaction["rebate"] %></td>
                <td><%= transaction["balance"] %></td>
                <!-- <td><%= transaction["account_no"] %></td> -->
                <td><%= transaction["status"] %></td>
                <td><%= transaction["receipt_no"] %></td>

              </tr>
              <% end %>
              <% end %>
            </tbody>
          </table>
        </div>

      </div>

      <div class="tab-pane" id="order" role="tabpanel" style="min-height:670px; max-height:670px; ">

        <h3>Order Details</h3>
        <div class="table-responsive">
          <table class="table table-striped">           
            <thead>
              <tr>
                <th>Order ID </th>
                <th>Type</th>
                <th>Order status</th>
                <th>Order date</th>
                <th>Items Count</th>
              </tr>
            </thead>

            <tbody>
              <% @orders.each do |order| %>
              <tr>
                  <td><%= order.order_id %></td>
                  <td><%= order.order_type %></td>
                  <td><%= order.status %></td>
                  <td><%= order.date.strftime("%d-%m-%Y") %> </td>
                  <td><%= order.item_count %> </td>
              </tr>
              <% end %>
            </tbody>
          </table>
        </div>
        
      </div>

      <div class="tab-pane" id="sale" role="tabpanel" style="min-height:670px; max-height:670px; ">
          <h3>Sale Details</h3>
                <div class="table-responsive">
                  <table class="table table-striped">           
                    <thead>
                      <tr>
                        <th>Sale Id </th>
                        <th>Receipt no </th>
                        <th>Grand total</th>
                        <th>Tax amount</th>
                        <th>Cashier</th>
                        <th>Sales status</th>
                        <th>Receipt Date</th>
                      </tr>
                    </thead>

                    <tbody>
                        <% @sales.each do |sale| %>
                          <tr>
                            <td><%= sale.sale_id %></td>
                            <td><%= sale.receipt_no %></td>
                            <td><%= sale.grand_total rescue '-' %></td>
                            <td><%= sale.total_tax %></td>
                            <td><%= sale.cashier_name rescue '-' %></td>
                            <td> <%= sale.sale_status %> </td>
                            <td> <%= sale.receipt_date.strftime("%d-%m-%Y") %> </td>
                          </tr>
                        <% end %>
                    </tbody>
                  </table>
               </div>
       </div>
       

    </div>
  </div>

  <div class="col-lg-1 col-md-1 col-sm-1">
    <br><br>
        <a href="<%= crm_customers_path%>" class="btn btn-primary btn-lg">
        <i class="fa fa-arrow-left fa-lg"></i> Back
       </a>
    </div>

</div>

