From 6fe14b125ef2e81bd9ffc89b258abdc8f90b3d26 Mon Sep 17 00:00:00 2001
From: rohan-equinix <rmandhare@equinix.com>
Date: Mon, 18 Sep 2023 20:13:32 +0530
Subject: [PATCH] implemented invoice search box in latest invoice section.

---
 app/assets/stylesheets/kaui/invoice.scss | 15 ++++++++++++
 app/views/kaui/invoices/index.html.erb   | 30 +++++++++++++++++++++---
 2 files changed, 42 insertions(+), 3 deletions(-)

diff --git a/app/assets/stylesheets/kaui/invoice.scss b/app/assets/stylesheets/kaui/invoice.scss
index eb3b0ffa..fd7bcb0a 100644
--- a/app/assets/stylesheets/kaui/invoice.scss
+++ b/app/assets/stylesheets/kaui/invoice.scss
@@ -56,3 +56,18 @@ table.invoice-totals {
     font-size: 12px;
     padding: 5px 30px;
 }
+
+.invoice-bar{
+    display: flex;
+    justify-content: space-between;
+    margin-bottom: 10px;
+}
+
+.search-icon{
+    margin-left: -25px;
+    opacity: 0.5;
+}
+
+#search-invoice-btn{
+    margin-left: 10px;
+}
\ No newline at end of file
diff --git a/app/views/kaui/invoices/index.html.erb b/app/views/kaui/invoices/index.html.erb
index 7958ef6c..24f27f45 100644
--- a/app/views/kaui/invoices/index.html.erb
+++ b/app/views/kaui/invoices/index.html.erb
@@ -1,9 +1,15 @@
 <div class="search">
 
   <div class="column-block">
-
     <h1>Invoices</h1>
-
+    <div class="invoice-bar">
+      <div>
+        <input type="text" id="invoice-search" placeholder="Search Invoice" />
+        <span class="search-icon"><i class="fa fa-search" aria-hidden="true"></i></span>
+        <button id="search-invoice-btn">Search</button>
+      </div>
+      <%= link_to 'Latest invoices', kaui_engine.invoices_path %>
+    </div>
     <table id="invoices-table" class="table table-condensed mobile-data">
       <thead>
       <tr>
@@ -32,7 +38,8 @@ $(document).ready(function() {
         "pagingType": <% if @max_nb_records.nil? -%>"simple"<% else -%>"full_numbers"<% end -%>,
         "language": {
           <!-- See DefaultPaginationSqlDaoHelper.java -->
-          "info": <% if @max_nb_records.nil? -%>"Showing _START_ to _END_ of <%= number_with_delimiter(Kaui::EngineControllerUtil::SIMPLE_PAGINATION_THRESHOLD) -%>+ entries"<% else -%>"Showing _START_ to _END_ of _TOTAL_ entries"<% end -%>
+          "info": <% if @max_nb_records.nil? -%>"Showing _START_ to _END_ of <%= number_with_delimiter(Kaui::EngineControllerUtil::SIMPLE_PAGINATION_THRESHOLD) -%>+ entries"<% else -%>"Showing _START_ to _END_ of _TOTAL_ entries"<% end -%>,
+          "zeroRecords": "No matching records found, please click on Latest Invoices"
         },
         "pageLength": <%= @limit %>,
         "displayStart": <%= @offset %>,
@@ -63,5 +70,22 @@ $(document).ready(function() {
       $(".dataTables_info").toggle(!noMoreData);
     });
   <% end %>
+
+  function searchInvoices () {
+    var invoiceSearch = document.getElementById('invoice-search').value;
+    table.search( invoiceSearch ).draw();
+  }
+
+  var searchInput = document.getElementById('invoice-search');
+
+  searchInput.addEventListener("keypress", function(event) {
+    if (event.keyCode == 13) {
+      searchInvoices();
+    }
+  });
+
+  $('#search-invoice-btn').on("click", function(event) {
+    searchInvoices();
+  });
 });
 <% end %>