2025-05-15 10:19:56 -04:00
|
|
|
<%# locals: (account:, tooltip: nil, chart_view: nil, **args) %>
|
2024-11-04 20:27:31 -05:00
|
|
|
|
2025-03-07 17:35:55 -05:00
|
|
|
<% period = @period || Period.last_30_days %>
|
2024-11-04 20:27:31 -05:00
|
|
|
<% default_value_title = account.asset? ? t(".balance") : t(".owed") %>
|
|
|
|
|
2025-05-15 10:19:56 -04:00
|
|
|
<div id="<%= dom_id(account, :chart) %>" class="bg-container shadow-border-xs rounded-xl space-y-2">
|
2025-05-02 08:20:31 -04:00
|
|
|
<div class="flex justify-between flex-col-reverse lg:flex-row gap-2 px-4 pt-4 mb-2">
|
|
|
|
<div class="space-y-2 w-full">
|
2024-11-04 20:27:31 -05:00
|
|
|
<div class="flex items-center gap-1">
|
2025-05-15 10:19:56 -04:00
|
|
|
<%= tag.p account.investment? ? "Total value" : default_value_title, class: "text-sm font-medium text-secondary" %>
|
|
|
|
|
|
|
|
<% if !account.syncing? && account.investment? %>
|
|
|
|
<%= render "investments/value_tooltip", balance: account.balance_money, holdings: account.balance_money - account.cash_balance_money, cash: account.cash_balance_money %>
|
|
|
|
<% end %>
|
2024-11-04 20:27:31 -05:00
|
|
|
</div>
|
|
|
|
|
2025-05-15 10:19:56 -04:00
|
|
|
<% if account.syncing? %>
|
|
|
|
<div class="bg-loader rounded-md h-7 w-20"></div>
|
|
|
|
<% else %>
|
|
|
|
<%= tag.p format_money(account.balance_money), class: "text-primary text-3xl font-medium truncate" %>
|
|
|
|
<% end %>
|
2024-11-04 20:27:31 -05:00
|
|
|
</div>
|
|
|
|
|
|
|
|
<%= form_with url: request.path, method: :get, data: { controller: "auto-submit-form" } do |form| %>
|
2025-03-07 17:35:55 -05:00
|
|
|
<div class="flex items-center gap-2">
|
|
|
|
<% if chart_view.present? %>
|
|
|
|
<%= form.select :chart_view,
|
|
|
|
[["Total value", "balance"], ["Holdings", "holdings_balance"], ["Cash", "cash_balance"]],
|
|
|
|
{ selected: chart_view },
|
2025-05-25 22:53:14 +07:00
|
|
|
class: "bg-container border border-secondary rounded-lg text-sm pr-7 cursor-pointer text-primary focus:outline-hidden focus:ring-0",
|
2025-03-07 19:09:54 -05:00
|
|
|
data: { "auto-submit-form-target": "auto" } %>
|
2025-03-07 17:35:55 -05:00
|
|
|
<% end %>
|
|
|
|
|
2025-04-30 18:14:22 -04:00
|
|
|
<%= form.select :period,
|
|
|
|
Period.as_options,
|
|
|
|
{ selected: period.key },
|
|
|
|
data: { "auto-submit-form-target": "auto" },
|
2025-05-08 12:25:53 -04:00
|
|
|
class: "bg-container border border-secondary rounded-lg px-3 py-2 text-sm pr-7 cursor-pointer text-primary focus:outline-hidden focus:ring-0" %>
|
2025-03-07 17:35:55 -05:00
|
|
|
</div>
|
2024-11-04 20:27:31 -05:00
|
|
|
<% end %>
|
|
|
|
</div>
|
|
|
|
|
2025-03-07 17:35:55 -05:00
|
|
|
<%= turbo_frame_tag dom_id(account, :chart_details), src: chart_account_path(account, period: period.key, chart_view: chart_view) do %>
|
2024-11-27 16:01:50 -05:00
|
|
|
<%= render "accounts/chart_loader" %>
|
|
|
|
<% end %>
|
2024-11-04 20:27:31 -05:00
|
|
|
</div>
|