ubicloud/views/project/invoice.erb
Enes Cakir d722196bf2 Use the table component in the current usage view
Since it's only for current usage, we can simplify it by using the table
card component.
2025-03-11 21:56:47 +03:00

55 lines
2 KiB
Text

<% @page_title = "Current Usage Summary" %>
<%== part(
"components/page_header",
breadcrumbs: [
%w[Projects /project],
[@project_data[:name], @project_data[:path]],
["Billing", "#{@project_data[:path]}/billing"],
["Current Usage Summary", "#"]
]
) %>
<%
footer_content = [
["Subtotal", @invoice_data[:subtotal]],
(@invoice_data[:discount] != "$0.00") ? ["Discount", "-#{@invoice_data[:discount]}"] : nil,
(@invoice_data[:credit] != "$0.00") ? ["Credit", "-#{@invoice_data[:credit]}"] : nil,
(@invoice_data[:free_inference_tokens_credit] != "$0.00") ? ["Free Inference Tokens", "-#{@invoice_data[:free_inference_tokens_credit]}"] : nil,
["Total", @invoice_data[:total]]
].compact.map do |name, value|
<<~CONTENT
<dl class="grid grid-cols-3 gap-x-3 #{(name == "Total") ? "text-2xl" : nil}">
<dt class="text-right font-semibold text-gray-800 col-span-2">#{name}:</dt>
<dd class="text-gray-500" id="invoice-#{name.downcase.tr(" ", "-")}">#{value}</dd>
</dl>
CONTENT
end.join
%>
<div class="grid gap-6">
<div class="md:flex md:items-center md:justify-between text-2xl">
<div class="min-w-0 flex-1">This invoice will be finalized on the first day of next month</div>
<div class="text-right"><%= @invoice_data[:begin_time] %> to <%= @invoice_data[:end_time] %></div>
</div>
<!-- Invoice Card -->
<%== part(
"components/table_card",
headers: ["Resource", "Description", "Usage", "Amount"],
rows: @invoice_data[:items].map do |item|
[
[
item[:name],
item[:description],
[item[:usage], { extra_class: "text-right"}],
[item[:cost_humanized], { extra_class: "text-right"}],
],
{ id: "item-#{item[:name]}" }
]
end,
empty_state: "No resources",
footer: "<div class=\"px-4 py-5 sm:p-6 flex justify-end\"><div class=\"grid gap-2 text-right\">#{footer_content}</div></div>"
)
%>
</div>