kaui 3.0.9 → 4.0.0

data/app/views/kaui/admin_tenants/new_plan_currency.html.erb

@@ -1,34 +1,48 @@
-<div id="catalog_simple">
-
-  <div>
-    <h1>Catalog (Add Plan Currency)
-    </h1>
-  </div>
-  <%= form_for @simple_plan, :url => {:action => :create_simple_plan}, :html => {:class => 'form-horizontal'} do |f| %>
-
-      <%= hidden_field_tag(:id, @tenant.id) %>
-      <div class="form-group">
-        <%= f.label :plan_id, 'Plan ID', :class => 'col-sm-3 control-label' %>
-        <div class="col-sm-4">
-          <%= f.text_field :plan_id, :class => 'form-control' %>
-        </div>
-      </div>
-      <div class="form-group">
-        <%= f.label :amount, 'Amount', :class => 'col-sm-3 control-label' %>
-        <div class="col-sm-4">
-          <%= f.text_field :amount, :class => 'form-control' %>
+<div class="catalog-simple-new-plan-currency">
+  <div class="">
+    <div class="mx-auto" style="max-width: 37.5rem;">
+      <h5 class="add-account-title pb-3 mb-3 border-bottom">
+        <span class="icon-container">
+          <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+            <path d="M12.9166 10.0007C12.9166 11.6115 11.6108 12.9173 9.99998 12.9173C8.38915 12.9173 7.08331 11.6115 7.08331 10.0007C7.08331 8.38982 8.38915 7.08398 9.99998 7.08398C11.6108 7.08398 12.9166 8.38982 12.9166 10.0007Z" stroke="#414651" stroke-width="1.5"/>
+            <path d="M8.14341 2.23582L7.50001 4.16602L6.20014 4.98815L4.07331 4.4619C3.71675 4.37368 3.34448 4.52931 3.15681 4.84505L2.01998 6.75762C1.81512 7.10229 1.88473 7.54398 2.18568 7.80891L3.67746 9.12218V10.8765L2.18615 12.1898C1.88527 12.4547 1.81569 12.8963 2.02053 13.2409L3.15741 15.1536C3.34508 15.4694 3.71736 15.625 4.07391 15.5368L6.20075 15.0105L7.43216 15.7011L8.01996 17.7311C8.12313 18.0874 8.44943 18.3327 8.82043 18.3327H11.1803C11.5512 18.3327 11.8775 18.0874 11.9807 17.7311L12.5685 15.7011L13.7993 15.0105L15.9261 15.5368C16.2827 15.625 16.6549 15.4694 16.8426 15.1536L18.0009 13.2048C18.196 12.8767 18.1431 12.4578 17.8726 12.1885L16.3674 10.6899L16.368 9.30877L17.8732 7.81017C18.1438 7.5408 18.1967 7.12202 18.0016 6.79384L16.8432 4.84505C16.6555 4.52931 16.2833 4.37368 15.9267 4.4619L13.7998 4.98815L12.5 4.16602L11.8566 2.23582C11.7432 1.89554 11.4248 1.66602 11.066 1.66602H8.93401C8.57526 1.66602 8.25683 1.89554 8.14341 2.23582Z" stroke="#414651" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+          </svg>
+        </span>
+        Catalog (Add Plan Currency)
+      </h5>
+      <%= form_for @simple_plan, :url => {:action => :create_simple_plan}, :html => {:class => 'form-horizontal'} do |f| %>
+        <%= hidden_field_tag(:id, @tenant.id) %>
+        <div class="form-group d-flex pb-3">
+          <%= f.label :plan_id, 'Plan ID', :class => 'col-sm-3 control-label' %>
+          <div class="col-sm-9">
+            <%= f.text_field :plan_id, :class => 'form-control' %>
+          </div>
         </div>
-      </div>
-      <div class="form-group">
-        <%= f.label :currency, 'Currency', :class => 'col-sm-3 control-label' %>
-        <div class="col-sm-4">
-          <%= f.select :currency, currencies, {:selected => 'USD'}, :class => 'form-control' %>
+        <div class="form-group d-flex pb-3">
+          <%= f.label :amount, 'Amount', :class => 'col-sm-3 control-label' %>
+          <div class="col-sm-9 d-flex currency-select">
+            <%= f.text_field :amount, :class => 'form-control w-100 amount-input' %>
+            <%= f.select :currency, currencies, {:selected => 'USD'}, :class => 'form-control' %>
+          </div>
         </div>
-      </div>
-      <div class="form-group">
-        <div class="col-sm-offset-3 col-sm-9">
-          <%= submit_tag 'Save', :class => 'btn btn-default' %>
+        <div class="form-group d-flex justify-content-end pt-3 border-top">
+          <%= render "kaui/components/button/button", {
+            label: 'Close',
+            variant: "outline-secondary d-inline-flex align-items-center gap-1",
+            type: "button",
+            html_class: "kaui-button custom-hover mx-2",
+            html_options: {
+              onclick: "window.history.back();"
+            }
+          } %>
+          <%= render "kaui/components/button/button", {
+            label: 'Save',
+            variant: "outline-secondary d-inline-flex align-items-center gap-1",
+            type: "submit",
+            html_class: "kaui-dropdown custom-hover"
+          } %>
         </div>
-      </div>
-  <% end %>
+      <% end %>
+    </div>
+  </div>
 </div>

data/app/views/kaui/admin_tenants/show.html.erb

@@ -1,87 +1,162 @@
-<%= render :partial => 'tenant_details' %>
-
-<%= render :partial => 'useful_links' %>
-
-<% unless @allowed_users.empty? %>
-  <div class="col-md-12">
-
-    <div class="search">
-
-      <div class="column-block">
-
-        <h1>Allowed Users
-        <%= link_to '<i class="fa fa-plus-square"></i>'.html_safe,
-                                          '#addAllowedUserModal',
-                                          :class => 'btn btn-xs', data: {toggle: 'modal'} %></h1>
-        <table id="allowed-users-for-tenant-table" class="table table-condensed">
-          <thead>
-          <tr>
-            <th>Name</th>
-            <th>Description</th>
-            <th></th>
-          </tr>
-          </thead>
-          <tbody>
-          <% @allowed_users.each do |u| %>
-              <tr>
-                <td><%= link_to u.kb_username, admin_allowed_user_path(u.id) %></td>
-                <td><%= u.description %></td>
-                <td>
-                  <% if current_user.root? %>
-                      <button type="button" class="btn btn-default btn-sm" id="<%= "allowed-user-remove-#{u.id}" %>">
-                        <span class="fa fa-times"></span>
-                      </button>
-                  <% end %>
-                </td>
-              </tr>
-          <% end %>
-          </tbody>
-        </table>
+<div class="kaui-container admin-tenant-show">
+  <%= render partial: 'kaui/components/breadcrumb/breadcrumb', locals: {
+    breadcrumbs: [
+      { label: 'Settings', href: '/' },
+      { label: @tenant.name, href: '#' }
+    ]
+  } %>
 
+  <div class="d-flex" style="gap: 4rem;">
+    <%= render :template => 'kaui/layouts/kaui_setting_sidebar' %>
+
+    <div class="w-100">
+      <div class="row gap-4 m-0 gap-container pb-2">
+        <%
+=begin%>
+ <div class="p-4 card w-100 col">
+          <%= render :partial => 'clock' %>      
+        </div> 
+<%
+=end%>
+
+        <div class="p-4 card w-100 col">
+          <%= render :partial => 'useful_links' %>
+        </div>
       </div>
 
-    </div>
+      <%= render :partial => 'tenant_details' %>
 
-  </div>
+      <%= render :partial => 'add_allowed_user_modal' %>
 
-    <%= javascript_tag do %>
-      $(document).ready(function() {
-        $('#allowed-users-for-tenant-table').dataTable({
-          "dom": "t",
-          "paging": false,
-          "order": [[ 0, "asc" ]],
-          "columns": [
-            null,
-            null,
-            { "orderable": false }
-          ]
-        });
-      });
-    <% end %>
-<% end %>
-
-<div class="container">
-  <ul class="nav nav-tabs" id="tenant_tabs" active_tab="<%= @active_tab %>">
-    <li class="nav active"><a href="#CatalogShow" data-toggle="tab">Catalog Show</a></li>
-    <li class="nav"><a href="#OverdueShow" data-toggle="tab">Overdue Show</a></li>
-    <li class="nav"><a href="#InvoiceTemplate" data-toggle="tab">Invoice Template</a></li>
-    <li class="nav"><a href="#InvoiceTranslation" data-toggle="tab">Invoice Translation</a></li>
-    <li class="nav"><a href="#CatalogTranslation" data-toggle="tab">Catalog Translation</a></li>
-    <li class="nav"><a href="#PluginConfig" data-toggle="tab">Plugin Config</a></li>
-  </ul>
-
-  <!-- Tab panes -->
-  <div class="tab-content">
-    <%= render :partial => 'show_catalog' %>
-    <%= render :partial => 'show_overdue' %>
-    <%= render :partial => 'form_invoice_template' %>
-    <%= render :partial => 'form_invoice_translation' %>
-    <%= render :partial => 'form_catalog_translation' %>
-    <%= render :partial => 'form_plugin_config' %>
+      <% unless @allowed_users.empty? %>
+        <div class="kaui-container gap-container">
+          <div class="allowed-users-container">
+            <div class="d-flex flex-column">
+              <div class="allowed-users-header mb-3">
+                <div class="d-flex align-items-start flex-column">
+                  <h2>Allowed Users</h2>
+                </div>
+                <span>
+                  <%= render "kaui/components/button/button", {
+                    label: "Create User",
+                    icon: "kaui/plus.svg",
+                    variant: "outline-secondary d-inline-flex align-items-center gap-1",
+                    type: "button",
+                    html_class: "kaui-dropdown custom-hover",
+                    html_options: {
+                      id: "addAllowedUserModal",
+                      data: { 
+                        bs_toggle: "modal",
+                        bs_target: "#addAllowedUserModal"
+                      }
+                    }
+                  } %>
+                </span>
+              </div>
+              <div class="">
+                <table id="allowed-users-for-tenant-table" class="table table-condensed">
+                  <thead>
+                  <tr>
+                    <th class="sortable-header" data-column="0">
+                      <div class="header-content">
+                        <span class="header-text">Name</span>
+                        <div class="sort-icons">
+                          <%= image_tag "kaui/sort-up.svg", class: "sort-icon sort-asc" %>
+                          <%= image_tag "kaui/sort-down.svg", class: "sort-icon sort-desc" %>
+                        </div>
+                      </div>
+                    </th>
+                    <th class="sortable-header" data-column="1">
+                      <div class="header-content">
+                        <span class="header-text">Description</span>
+                        <div class="sort-icons">
+                          <%= image_tag "kaui/sort-up.svg", class: "sort-icon sort-asc" %>
+                          <%= image_tag "kaui/sort-down.svg", class: "sort-icon sort-desc" %>
+                        </div>
+                      </div>
+                    </th>
+                    <th></th>
+                  </tr>
+                  </thead>
+                  <tbody>
+                    <% @allowed_users.each do |u| %>
+                      <tr>
+                        <td><%= link_to u.kb_username, admin_allowed_user_path(u.id) %></td>
+                        <td><%= u.description %></td>
+                        <td class="text-end">
+                          <% if current_user.root? %>
+                            <%= render "kaui/components/button/button", {
+                              label: "Remove",
+                              variant: "outline-secondary d-inline-flex align-items-center gap-1",
+                              type: "button",
+                              html_class: "kaui-button dots-menu custom-hover",
+                              html_options: {
+                                id: "allowed-user-remove-#{u.id}"
+                              }
+                            } %>
+                          <% end %>
+
+                        </td>
+                      </tr>
+                    <% end %>
+                  </tbody>
+                </table>
+              </div>
+            </div>
+          </div>
+        </div>
+        <%= javascript_tag do %>
+          $(document).ready(function() {
+            $('#allowed-users-for-tenant-table').dataTable({
+              "dom": "t",
+              "paging": false,
+              "order": [[ 0, "asc" ]],
+              "columns": [
+                null,
+                null,
+                { "orderable": false }
+              ]
+            });
+          });
+        <% end %>
+      <% end %>
+
+
+      <div class="kaui-container nav-tabs-details">
+        <ul class="nav nav-tabs" id="tenant_tabs" active_tab="<%= @active_tab %>">
+          <li class="nav-item">
+            <a class="nav-link" href="#CatalogShow" data-bs-toggle="tab">Catalog Show</a>
+          </li>
+          <li class="nav-item">
+            <a class="nav-link" href="#OverdueShow" data-bs-toggle="tab">Overdue Show</a>
+          </li>
+          <li class="nav-item">
+            <a class="nav-link" href="#InvoiceTemplate" data-bs-toggle="tab">Invoice Template</a>
+          </li>
+          <li class="nav-item">
+            <a class="nav-link" href="#InvoiceTranslation" data-bs-toggle="tab">Invoice Translation</a>
+          </li>
+          <li class="nav-item">
+            <a class="nav-link" href="#CatalogTranslation" data-bs-toggle="tab">Catalog Translation</a>
+          </li>
+          <li class="nav-item">
+            <a class="nav-link" href="#PluginConfig" data-bs-toggle="tab">Plugin Config</a>
+          </li>
+        </ul>
+
+        <div class="tab-content">
+          <%= render :partial => 'show_catalog' %>
+          <%= render :partial => 'show_overdue' %>
+          <%= render :partial => 'form_invoice_template' %>
+          <%= render :partial => 'form_invoice_translation' %>
+          <%= render :partial => 'form_catalog_translation' %>
+          <%= render :partial => 'form_plugin_config' %>
+        </div>
+      </div>
+    </div>
   </div>
 </div>
 
-<%= render :partial => 'add_allowed_user_modal' %>
 
 <%= javascript_tag do %>
 
@@ -109,13 +184,71 @@
 
 
   $(document).ready(function() {
+    // Initialize DataTable for allowed users table
+    var allowedUsersTable;
+    
+    // Wait for the table to be available
+    setTimeout(function() {
+      try {
+        // Check if table is already initialized as DataTable
+        if ($.fn.DataTable.isDataTable('#allowed-users-for-tenant-table')) {
+          allowedUsersTable = $('#allowed-users-for-tenant-table').DataTable();
+        } else {
+          allowedUsersTable = $('#allowed-users-for-tenant-table').DataTable({
+            "dom": "t",
+            "paging": false,
+            "ordering": true
+          });
+        }
+        
+        // Custom sorting functionality for allowed users table
+        var currentSortColumn = -1;
+        var currentSortDirection = 'asc';
+
+        // Handle custom header clicks
+        $('.sortable-header').on('click', function() {
+          var columnIndex = parseInt($(this).data('column'));
+          var newDirection = 'asc';
+          
+          // If clicking the same column, toggle direction
+          if (currentSortColumn === columnIndex) {
+            newDirection = currentSortDirection === 'asc' ? 'desc' : 'asc';
+          }
+          
+          currentSortColumn = columnIndex;
+          currentSortDirection = newDirection;
+          
+          // Update visual indicators
+          updateSortIndicators(columnIndex, newDirection);
+          
+          // Apply DataTable sorting
+          if (allowedUsersTable && allowedUsersTable.order) {
+            allowedUsersTable.order([columnIndex, newDirection]).draw();
+          }
+        });
+
+        // Function to update sort indicators
+        function updateSortIndicators(columnIndex, direction) {
+          // Reset all headers
+          $('.sortable-header').removeClass('sort-asc-active sort-desc-active');
+          $('.sort-icon').removeClass('active');
+          
+          // Set active state for current column
+          var $header = $('.sortable-header[data-column="' + columnIndex + '"]');
+          $header.addClass(direction + '-active');
+          $header.find('.sort-' + direction).addClass('active');
+        }
+        
+      }
+    }, 100);
+
     $('[id^=allowed-user-remove-]').click(function() {
       var allowedUser = $(this);
       $.ajax({ type: "DELETE",
         url: "<%= remove_allowed_user_path :format => :json %>",
         data: { allowed_user: { id: this['id'].split('-')[3] }, id: <%= @tenant.id %>},
         success: function(data) {  allowedUser.parent().parent().hide(); return false; },
-        error: function(request, textStatus, errorThrown) { console.log("AJAX FAILED!!!! request.status " + request.status + ", textStatus = " + textStatus); return false; }
+        error: function(request, textStatus, errorThrown) { return false; }
       });
     });
 
@@ -129,4 +262,4 @@
       $('#tenant_tabs a[href="#' + $('#tenant_tabs').attr('active_tab') + '"]').tab('show');
     }
   });
-<% end %>
+<% end %> 

data/app/views/kaui/admin_tenants/show.js.erb

@@ -0,0 +1,3 @@
+$('#kb_clock').html("<%= @clock&.[]('currentUtcTime') || 'N/A' %>");
+
+scheduleRefresh();