<!DOCTYPE html>
<html lang="en">
  
<head>
  <title><%= lang_data.consolidated %></title>
    <%- include('./partials/meta'); -%>
  </head>
  <body>
    <%- include('./partials/header_sidebar'); -%> 

        <div class="page-body">
          <div class="container-fluid">
            <div class="page-title">
              <div class="row">
                <div class="col-sm-6">
                  <h3><%= lang_data.consolidated %></h3>
                </div>
                <div class="col-sm-6">
                  <ol class="breadcrumb">
                    <li class="breadcrumb-item"><a href="/index"><i data-feather="home"></i></a></li>
                    <li class="breadcrumb-item"><a href="/consolidated/add_consolidated"><%= lang_data.Create_Consolidation %></a></li>
                  </ol>
                </div>
              </div>
            </div>
          </div>
          <!-- Container-fluid starts-->
          <div class="container-fluid">
            <form action="/consolidated/add_consolidated" method="post" enctype="multipart/form-data">
              <div class="row">
              
                <!-- Scroll - vertical dynamic Starts-->
                <div class="col-lg-6 col-sm-12">
                  <div class="card">
                    <div class="card-body">
                      <div class="row g-2">

                        <div class="col-6">
                          <label class="form-label"><%= lang_data.Shipping_Prefix %></label>
                          <input class="form-control" type="text" id="" value="<%= prefix_data[0].prefix %>" name="prefix" readonly>
                        </div>

                        <div class="col-6">
                          <label class="form-label"><%= lang_data.Tracking_ID %></label>
                          <input class="form-control" type="text" id="random_no" value="<%= invoice %>" name="invoice" readonly>
                        </div>

                        <div class="col-12">
                          <label class="form-label"><%= lang_data.Stamps %></label>
                          <input class="form-control" type="text" placeholder="00-00000" name="stamps">
                        </div>

                      </div>
                    </div>
                  </div>
                </div>

                <div class="col-lg-6 col-sm-12">
                  <div class="card">
                    <div class="card-body">
                      <div class="row g-2">

                        <dic class="col-12">
                          <div class="col-form-label"><%= lang_data.List_of_Agencies %></div>
                          <select class="js-example-basic-single" name="agency" required>
                            <option value selected disabled>Search Agencies</option>
                            <% agencies_list.forEach((data) => { %>
                              <option value="<%= data.id %>"> <%= data.agency_name %></option>
                            <% }) %>
                          </select>
                        </dic>

                        <dic class="col-12">
                          <div class="col-form-label"><%= lang_data.Office_of_origin %></div>
                          <select class="js-example-basic-single" name="office_of_origin" required>
                            <option value selected disabled>Search Office</option>
                            <% office_group_list.forEach((data) => { %>
                              <option value="<%= data.id %>"> <%= data.office_name %></option>
                            <% }) %>
                          </select>
                        </dic>

                      </div>
                    </div>
                  </div>
                </div>

                <div class="col-lg-6 col-sm-12">
                  <div class="card">
                    <div class="card-body">
                      <div class="d-flex justify-content-between">
                          <h4><%= lang_data.Sender_Information %></h4>
                          <% if (role_data.role == '1' || role_data.role == '3') { %>
                            <a href="/users/add_customers" class="btn btn-pill btn-primary btn-air-primary"><%= lang_data.Add_Sender %></a>
                          <% } %>
                      </div>

                      <hr>

                      <div class="row g-2">
                        <% if (role_data.role == '1' || role_data.role == '3') { %>
                          <div class="col-12">
                            <div class="col-form-label"><%= lang_data.Sender %>/<%= lang_data.Customer %></div>
                            <select class="js-example-basic-single" name="customer" id="shipment_customer" required>
                              <option value selected disabled>Search Sender / Customer</option>
                              <% customers_list.forEach((data) => { %>
                                <option value="<%= data.id %>"> <%= data.first_name %> <%= data.last_name %></option>
                              <% }) %>
                            </select>
                          </div>
                        <% } else { %>
                          <div class="col-12">
                            <div class="col-form-label"><%= lang_data.Sender %>/<%= lang_data.Customer %></div>
                            <select class="js-example-basic-single" name="customer" id="shipment_customer" required>
                              <option value selected disabled>Search Sender / Customer</option>
                              <% customers_list.forEach((data) => { %>
                                <% if (data.login_id == role_data.id) { %>
                                  <option value="<%= data.id %>"> <%= data.first_name %> <%= data.last_name %></option>
                                <% } %>
                              <% }) %>
                            </select>
                          </div>
                        <% } %>

                        <div class="col-12">
                          <div class="col-form-label"><%= lang_data.Sender %>/<%= lang_data.Customer %> <%= lang_data.Address %></div>
                          <select class="js-example-basic-single" name="customer_address" id="customer_address" required>
                            <option value selected disabled>Search Sender / Customer Address</option>
                          </select>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>

                <div class="col-lg-6 col-sm-12">
                  <div class="card">
                    <div class="card-body">
                      <div class="d-flex justify-content-between">
                          <h4><%= lang_data.Recipient_Information %></h4>
                          <a href="/users/add_client" class="btn btn-pill btn-primary btn-air-primary"><%= lang_data.Add_Recipient %></a>
                      </div>
                      <hr>
                      <div class="row g-2">

                        <div class="col-12">
                          <div class="col-form-label"><%= lang_data.Recipient %>/<%= lang_data.Client %></div>
                          <select class="js-example-basic-single" name="client" id="shipment_client">
                            <option value selected disabled>Search Recipient / Client</option>
                          </select>
                        </div>

                        <div class="col-12">
                          <div class="col-form-label"><%= lang_data.Recipient %>/<%= lang_data.Client %> <%= lang_data.Address %></div>
                          <select class="js-example-basic-single" name="client_address" id="client_address">
                            <option value selected disabled>Search Recipient / Client Address</option>
                          </select>
                        </div>

                      </div>
                    </div>
                  </div>
                </div>

                <div class="col-sm-12">
                  <div class="card">
                    <div class="card-body">
                      <h4><%= lang_data.Shipping_information %></h4>

                      <hr>
                      <div class="row">

                        <div class="col-4 mt-3">
                          <div class="col-form-label"><%= lang_data.Shipping_mode %></div>
                          <select class="js-example-basic-single" name="shipping_mode" required>
                            <option value selected disabled>Search Shipping Mode</option>
                            <% logistics_service_list.forEach((data) => { %>
                              <option value="<%= data.id %>"> <%= data.service_name %></option>
                            <% }) %>
                          </select>
                        </div>

                        <div class="col-4 mt-3">
                          <div class="col-form-label"><%= lang_data.Type_of_packaging %></div>
                          <select class="js-example-basic-single" name="packaging" required>
                            <option value selected disabled>Search packaging</option>
                            <% packaging_list.forEach((data) => { %>
                              <option value="<%= data.id %>"> <%= data.packaging_type %></option>
                            <% }) %>
                          </select>
                        </div>

                        <div class="col-4 mt-3">
                          <div class="col-form-label"><%= lang_data.Courier_company %></div>
                          <select class="js-example-basic-single" name="courier_company" required>
                            <option value selected disabled>Search company</option>
                            <% courier_companies_list.forEach((data) => { %>
                              <option value="<%= data.id %>"> <%= data.companies_name %></option>
                            <% }) %>
                          </select>
                        </div>

                        <div class="col-4 mt-3">
                          <div class="col-form-label"><%= lang_data.Service_Mode %></div>
                          <select class="js-example-basic-single" name="service_mode" required>
                            <option value selected disabled>Search Mode</option>
                            <% shipping_modes_list.forEach((data) => { %>
                              <option value="<%= data.id %>"> <%= data.shipping_modes %></option>
                            <% }) %>
                          </select>
                        </div>
                        
                        <div class="col-4 mt-3">
                          <div class="col-form-label"><%= lang_data.Payment_Type %></div>
                          <select class="js-example-basic-single" name="payment_type" required>
                            <option value selected disabled>Search Type</option>
                            <% payment_type.forEach((data) => { %>
                              <option value="<%= data.id %>"> <%= data.payment_type %></option>
                            <% }) %>
                          </select>
                        </div>

                        <div class="col-4 mt-3">
                          <div class="col-form-label"><%= lang_data.Delivery_time %></div>
                          <select class="js-example-basic-single" name="delivery_time" required>
                            <option value selected disabled>Search Delivery time</option>
                            <% shipping_times_list.forEach((data) => { %>
                              <option value="<%= data.id %>"> <%= data.shipping_times %></option>
                            <% }) %>
                          </select>
                        </div>
                            
                        <div class="col-4 mt-3">
                          <label class="form-label"><%= lang_data.Estimated_delivery_date %></label>
                          <div class="input-group left-radius"><span class="input-group-text" id="inputGroupPrepend"><i data-feather="calendar"></i></span>
                            <input class="form-control digits" id="minMaxExample" type="text" name="estimated_date" placeholder="MM/DD/YYYY" required>
                          </div>
                        </div>

                        <div class="col-4 mt-3">
                          <div class="col-form-label"><%= lang_data.Delivery_Status %></div>
                          <select class="js-example-basic-single" name="delivery_status" required>
                            <option value selected disabled>Search Delivery Status</option>
                            <% shipping_status_data.forEach((data) => { %>
                              <option value="<%= data.id %>"> <%= data.status_name %></option>
                            <% }) %>
                          </select>
                        </div>
  
                        <div class="col-4 mt-3">
                          <div class="col-form-label"><%= lang_data.Assign_Driver %> <i class="fa fa-taxi font-danger"></i></div>
                            <select class="js-example-basic-single" name="assign_driver" required>
                              <option value selected disabled>Search Assign Driver</option>
                              <% drivers_list.forEach((data) => { %>
                                <option value="<%= data.id %>"> <%= data.first_name %> <%= data.last_name %></option>
                              <% }) %>
                            </select>
                        </div>

                        <div class="col-12">
                          <label class="btn btn-square btn-info mt-4 text-nowrap" id="add_product_image" for="file-1"><%= lang_data.Upload_Image %></label>
                          <div class="form-input">                                           
                            <img id="file-preview" width="250px" height="250px" src="../images/dashboard/default/profile.png" alt="image">
                          
                            <input class="d-none" type="file" id="file-1" name="image" onchange="showPreview(event)" required>
                            <p class="font-danger" id="image_error"></p>
                          </div>
                        </div>
                        
                      </div>
                    </div>
                  </div>
                </div>

                <div class="col-sm-12">
                  <div class="card">
                    <div class="card-body">
                      <div class="d-flex justify-content-between">
                          <h4><%= lang_data.Package_Information %></h4>
                          <div>
                              <button class="btn btn-primary btn-air-primary text-nowrap" type="button" data-bs-toggle="modal" data-bs-target="#find_shipment" id="find_shipment_data"><%= lang_data.Find_Shipment %></button>
                          </div>
                      </div>

                      <div class="add_shipment_table mt-4 d-none">
                        <div class="table-responsive theme-scrollbar">
                          <table class="table" aria-label="table">
                            <thead class="table-dark">
                              <tr>
                                <th class="text-nowrap"><%= lang_data.Tracking %></th>
                                <th class="text-nowrap"><%= lang_data.Weight %></th>
                                <th class="text-nowrap"><%= lang_data.Weight_Vol %></th>
                                <th class="text-nowrap"><%= lang_data.Action %></th>
                              </tr>
                            </thead>
                            <tbody id="add_shipment_list">
                            </tbody>
                          </table>
                          <p class="table_line font-danger"></p>
                        </div>
                      </div>
                    
                      <hr>
                      
                      <div class="row" id="shipment_details">

                        <div class="col-lg-7 col-sm-12">
                          <div class="row g-3">
                            
                            <div class="col-lg-6 col-sm-12">
                              <label class="form-label"><%= lang_data.Total_Weight %></label>
                              <input class="form-control" type="number" id="total_weight" name="total_weight" value="0" readonly>
                            </div>

                            <div class="col-lg-6 col-sm-12">
                              <label class="form-label"><%= lang_data.Total_Weight_Vol %></label>
                              <input class="form-control" type="number" id="total_weight_vol" name="total_weight_vol" value="0" readonly>
                            </div>

                            <div class="col-lg-4 col-sm-12">
                                <label class="form-label"><%= lang_data.Price_kg %></label>
                                <input class="form-control consolidation_sum" type="number" id="add_price_kg" name="add_price_kg" value="<%= taxe_data.weight_val %>" min="0" required>
                            </div>
        
                            <div class="col-lg-4 col-sm-12">
                                <label class="form-label"><%= lang_data.Discount %> (%)</label>
                                <input class="form-control consolidation_sum" type="number" id="add_discount" name="add_discount" value="0" min="0" required>
                            </div>
        
                            <div class="col-lg-4 col-sm-12">
                                <label class="form-label"><%= lang_data.Value_assured %></label>
                                <input class="form-control consolidation_sum" type="number" id="add_value_assured" name="add_value_assured" value="0" min="0" required>
                            </div>
                      
                            <div class="col-lg-4 col-sm-12">
                                <label class="form-label"><%= lang_data.Shipping_Insurance %></label>
                                <input class="form-control consolidation_sum" type="number" id="add_shipping_insurance" name="add_shipping_insurance" value="<%= taxe_data.shipping_insurance %>" min="0" required>
                            </div>
        
                            <div class="col-lg-4 col-sm-12">
                                <label class="form-label"><%= lang_data.Customs_Duties %></label>
                                <input class="form-control consolidation_sum" type="number" id="add_customs_duties" name="add_customs_duties" value="<%= taxe_data.custom_duties %>" min="0" required>
                            </div> 
        
                            <div class="col-lg-4 col-sm-12">
                                <label class="form-label"><%= lang_data.Tax %> <%= taxe_data.tax_count == 1 ? "(%)" : "(Fix)" %></label>
                                <input class="form-control consolidation_sum" type="number" id="add_tax" name="add_tax" value="<%= taxe_data.tax %>" min="0" required>
  
                                <input class="form-control" type="hidden" name="tax_count" id="tax_count" value="<%= taxe_data.tax_count %>">
                            </div>
        
                            <div class="col-lg-4 col-sm-12">
                                <label class="form-label"><%= lang_data.Reissue %></label>
                                <input class="form-control consolidation_sum" type="number" id="add_reissue" value="0" min="0" required>
                            </div>
                            
        
                          </div>
                        </div>

                        <div class="col-lg-5 col-sm-12 pt-5 px-5 mt-5">
                          
                          <div class="d-flex justify-content-between mb-1">
                            <h5><%= lang_data.Subtotal %></h5>
                            <div class="input-group input-group-sm w-25"><span class="input-group-text bg-dark"><%= accessdata.data.site_currency %></span>
                              <input class="form-control form-control-sm w-25" id="subtotal" type="number" name="subtotal" value="0.00" readonly>
                            </div>
                          </div>

                          <div class="d-flex justify-content-between mb-1">
                            <h5><%= lang_data.Discount %></h5>
                            <div class="input-group input-group-sm w-25"><span class="input-group-text bg-dark"><%= accessdata.data.site_currency %></span>
                              <input class="form-control form-control-sm w-25" id="discount" type="number" name="discount" value="0.00" readonly>
                            </div>
                          </div>

                          <div class="d-flex justify-content-between mb-1">
                            <h5><%= lang_data.Shipping_Insurance %> <i class="fa fa-info-circle" data-bs-toggle="tooltip" data-bs-placement="top" title="(Value assured / 100) * Shipping Insurance"></i></h5>
                            <div class="input-group input-group-sm w-25"><span class="input-group-text bg-dark"><%= accessdata.data.site_currency %></span>
                              <input class="form-control form-control-sm w-25" id="shipping_insurance" type="number" name="shipping_insurance" value="0.00" readonly>
                            </div>
                          </div>

                          <div class="d-flex justify-content-between mb-1">
                            <h5><%= lang_data.Customs_Duties %> <i class="fa fa-info-circle" data-bs-toggle="tooltip" data-bs-placement="top" title="(Weight + Weight Vol.) * Customs Duties "></i></h5>
                            <div class="input-group input-group-sm w-25"><span class="input-group-text bg-dark"><%= accessdata.data.site_currency %></span>
                              <input class="form-control form-control-sm w-25" id="customs_duties" type="number" name="customs_duties" value="0.00" readonly>
                            </div>
                          </div>

                          <div class="d-flex justify-content-between mb-1">
                            <h5><%= lang_data.Tax %></h5>
                            <div class="input-group input-group-sm w-25"><span class="input-group-text bg-dark"><%= accessdata.data.site_currency %></span>
                              <input class="form-control form-control-sm w-25" id="tax" type="number" name="tax" value="0.00" readonly>
                            </div>
                          </div>

                          <div class="d-flex justify-content-between mb-1">
                            <h5><%= lang_data.Reissue %></h5>
                            <div class="input-group input-group-sm w-25"><span class="input-group-text bg-dark"><%= accessdata.data.site_currency %></span>
                              <input class="form-control form-control-sm w-25" id="reissue" type="number" name="reissue" value="0.00" readonly>
                            </div>
                          </div>

                          <div class="d-flex justify-content-between mt-2">
                            <h5><%= lang_data.Total %></h5>
                            <div class="input-group input-group-sm w-25"><span class="input-group-text bg-dark"><%= accessdata.data.site_currency %></span>
                              <input class="form-control" id="total" type="number" name="total" value="0.00" readonly>
                            </div>
                          </div>

                        </div>
                      </div>

                      <hr>
                      
                      <div class="col-12">
                          <div class="d-flex align-items-center justify-content-end">
                              <button class="btn btn-square btn-primary btn-air-primary" id="consolidation_submit" type="submit"><i class="fa fa-floppy-o"></i> &nbsp; <%= lang_data.Save %></button>
                          </div>
                      </div>

                    </div>
                  </div>
                </div>

                <!-- Scroll - vertical dynamic Ends-->
              </div>
            </form>
          </div>
          <!-- Container-fluid Ends-->
        </div>

        <div class="modal fade bd-example-modal-lg" id="find_shipment" role="dialog" aria-labelledby="exampleModalCenter" aria-hidden="true">
          <div class="modal-dialog modal-lg" role="document">
            <div class="modal-content">
              <div class="modal-header">
                <h5 class="modal-title"><%= lang_data.Add_New_Consolidated %></h5>
                <button class="btn-close" type="button" data-bs-dismiss="modal" aria-label="Close"></button>
              </div>
                <div class="modal-body">
                  <div class="row g-3">
                    <div class="table-responsive theme-scrollbar">
                      <table class="display" id="basic-1" aria-label="table">
                        <thead>
                          <tr>
                            <th class="text-nowrap"><%= lang_data.Tracking %></th>
                            <th class="text-nowrap"><%= lang_data.Weight %></th>
                            <th class="text-nowrap"><%= lang_data.Weight_Vol %></th>
                            <th class="text-nowrap"><%= lang_data.Status %></th>
                            <th class="text-nowrap"><%= lang_data.Total_cost %></th>
                            <th class="text-nowrap"><%= lang_data.Add %></th>
                          </tr>
                        </thead>
                        <tbody id="shipment_list">
                          <tr class="d-none">
                            <td>grsg</td>
                          </tr>
                        </tbody>
                        
                      </table>
                    </div>
                    
                    
                  </div>
                </div>
                <div class="modal-footer">
                  <button class="btn btn-secondary" type="button" data-bs-dismiss="modal"><%= lang_data.Close %></button>
                </div>
            </div>
          </div>
        </div>
        
        <%- include('./partials/footer'); -%>
        
    <%- include('./partials/script'); -%>

  </body>

</html>