2024-03-06 09:56:59 -05:00
|
|
|
<%# locals: (account_group:) %>
|
2024-03-19 09:10:40 -04:00
|
|
|
<% text_class = accountable_text_class(account_group.name) %>
|
2024-03-06 09:56:59 -05:00
|
|
|
<details class="open:bg-gray-25 group">
|
|
|
|
<summary class="flex p-4 items-center w-full rounded-lg font-medium hover:bg-gray-50 text-gray-500 text-sm font-medium cursor-pointer">
|
|
|
|
<%= lucide_icon("chevron-down", class: "hidden group-open:block w-5 h-5") %>
|
|
|
|
<%= lucide_icon("chevron-right", class: "group-open:hidden w-5 h-5") %>
|
2024-03-19 09:10:40 -04:00
|
|
|
<div class="ml-4 h-2.5 w-2.5 rounded-full <%= accountable_bg_class(account_group.name) %>"></div>
|
|
|
|
<p class="text-gray-900 ml-2"><%= to_accountable_title(Accountable.from_type(account_group.name)) %></p>
|
2024-03-06 09:56:59 -05:00
|
|
|
<span class="mx-1">·</span>
|
2024-03-19 09:10:40 -04:00
|
|
|
<div ><%= account_group.children.count %></div>
|
2024-03-06 09:56:59 -05:00
|
|
|
<div class="ml-auto text-right flex items-center gap-10 text-sm font-medium text-gray-900">
|
|
|
|
<div class="flex items-center justify-end gap-2 w-24">
|
2024-03-19 09:10:40 -04:00
|
|
|
<%= render partial: "shared/progress_circle", locals: { progress: account_group.percent_of_total, text_class: text_class } %>
|
|
|
|
<p><%= account_group.percent_of_total.round(1) %>%</p>
|
2024-03-06 09:56:59 -05:00
|
|
|
</div>
|
|
|
|
<div class="w-24">
|
2024-03-19 09:10:40 -04:00
|
|
|
<p><%= format_money account_group.sum %></p>
|
2024-03-06 09:56:59 -05:00
|
|
|
</div>
|
|
|
|
<div class="w-40">
|
2024-03-19 09:10:40 -04:00
|
|
|
<%= render partial: "shared/trend_change", locals: { trend: account_group.series.trend } %>
|
2024-03-06 09:56:59 -05:00
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</summary>
|
|
|
|
<div class="px-4 py-3 space-y-4">
|
2024-03-19 09:10:40 -04:00
|
|
|
<% account_group.children.map do |account| %>
|
2024-03-06 09:56:59 -05:00
|
|
|
<div class="flex items-center justify-between text-sm font-medium text-gray-900">
|
|
|
|
<div class="flex items-center gap-4">
|
2024-03-19 09:10:40 -04:00
|
|
|
<div class="flex items-center justify-center w-8 h-8 rounded-full <%= text_class %> <%= accountable_bg_transparent_class(account_group.name) %>">
|
|
|
|
<%= account.name[0].upcase %>
|
2024-03-06 09:56:59 -05:00
|
|
|
</div>
|
|
|
|
<div>
|
2024-03-19 09:10:40 -04:00
|
|
|
<p><%= account.name %></p>
|
2024-03-06 09:56:59 -05:00
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="flex gap-10 items-center text-right">
|
|
|
|
<div class="flex items-center justify-end gap-2 w-24">
|
2024-03-19 09:10:40 -04:00
|
|
|
<%= render partial: "shared/progress_circle", locals: { progress: account.percent_of_total, text_class: text_class } %>
|
|
|
|
<p><%= account.percent_of_total %>%</p>
|
2024-03-06 09:56:59 -05:00
|
|
|
</div>
|
|
|
|
<div class="w-24">
|
2024-03-19 09:10:40 -04:00
|
|
|
<p><%= format_money account.sum %></p>
|
2024-03-06 09:56:59 -05:00
|
|
|
</div>
|
|
|
|
<div class="w-40">
|
2024-03-19 09:10:40 -04:00
|
|
|
<%= render partial: "shared/trend_change", locals: { trend: account.series.trend } %>
|
2024-03-06 09:56:59 -05:00
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<% end %>
|
|
|
|
</div>
|
|
|
|
</details>
|