ubicloud/views/components/table_card.erb
2025-01-10 23:14:32 +03:00

81 lines
3.2 KiB
Text

<%# locals: (title: nil, headers: [], rows: [], empty_state: nil) %>
<div>
<% if title %>
<div class="md:flex md:items-center md:justify-between pb-2 lg:pb-4">
<div class="min-w-0 flex-1">
<h3 class="text-2xl font-bold leading-7 text-gray-900 sm:truncate sm:text-2xl sm:tracking-tight">
<%= title %>
</h3>
</div>
</div>
<% end %>
<div class="overflow-hidden rounded-lg shadow ring-1 ring-black ring-opacity-5 bg-white divide-y divide-gray-200">
<table class="min-w-full divide-y divide-gray-300">
<% unless headers.empty? %>
<thead class="bg-gray-50">
<tr>
<% headers.each_with_index do |name, i| %>
<th
scope="col"
<% if i == 0 %>
class="pl-4 pr-3 sm:pl-6 py-3.5 text-left text-sm font-semibold text-gray-900"
<% elsif i + 1 == headers.length %>
class="pl-3 pr-4 sm:pr-6 py-3.5 text-left text-sm font-semibold text-gray-900"
<% else %>
class="px-3 py-3.5 text-left text-sm font-semibold text-gray-900"
<% end %>
>
<%= name %>
</th>
<% end %>
</tr>
</thead>
<% end %>
<tbody class="divide-y divide-gray-200 bg-white">
<% if rows.empty? %>
<tr>
<td colspan="<%= headers.length %>" class="text-center py-4 px-8 lg:px-32">
<%== empty_state %>
</td>
</tr>
<% else %>
<% rows.each do |columns, row_opts| %>
<% row_opts ||= {} %>
<tr <% if row_opts[:id] %> id="<%= row_opts[:id] %>" <% end %>>
<% columns.each_with_index do |(value, col_opts), i| %>
<% col_opts ||= {} %>
<td
<% if i == 0 %>
class="pl-4 pr-3 sm:pl-6 py-4 text-gray-900 font-medium whitespace-nowrap text-sm"
<% elsif i + 1 == columns.length %>
class="pl-3 pr-4 sm:pr-6 py-4 text-gray-500 whitespace-nowrap text-sm"
<% else %>
class="px-3 py-4 text-gray-500 whitespace-nowrap text-sm"
<% end %>
>
<% if col_opts[:copyable] && value %>
<%== render("components/copyable_content", locals: { content: value, message: "Copied", revealable: col_opts[:revealable] }) %>
<% elsif col_opts[:revealable] && value %>
<%== render("components/revealable_content", locals: { content: value }) %>
<% elsif col_opts[:link] %>
<a href="<%= col_opts[:link] %>" class="font-medium text-orange-600 hover:text-orange-700">
<%= value %>
</a>
<% elsif col_opts[:component] %>
<%== render("components/#{value}", locals: col_opts[:component]) %>
<% elsif col_opts[:escape] == false %>
<%== value %>
<% else %>
<%= value || "-" %>
<% end %>
</td>
<% end %>
</tr>
<% end %>
<% end %>
</tbody>
</table>
</div>
</div>