Docker/Maybe
Docker/Maybe
1
0
Fork 0
mirror of https://github.com/maybe-finance/maybe.git synced 2025-08-02 20:15:22 +02:00
Code Issues Releases Activity Actions

Add pie chart for asset/debt allocation in dashboard view (#666)

Browse source 
* Add pie chart for asset/debt allocation in dashboard view

* Fix lint issue

* Fix z-index issue with tooltip under pie chart

* Fix spacing of dashboard charts
This commit is contained in:
Josh Brown 2024-04-23 17:05:18 +01:00 • committed by GitHub
parent 8a29725562
commit 1f6e83ee91
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
7 changed files with 225 additions and 16 deletions
Download patch file Download diff file Expand all files Collapse all files

4
app/views/pages/dashboard.html.erb
View file

@ -11,7 +11,7 @@
<% end %>
</header>
<section class="flex gap-4">
<div class="bg-white border border-alpha-black-25 shadow-xs rounded-xl w-3/4 min-h-48">
<div class="bg-white border border-alpha-black-25 shadow-xs rounded-xl w-3/4 min-h-48 flex flex-col">
<div class="flex justify-between p-4">
<div>
<%= render partial: "shared/value_heading", locals: {
@ -28,7 +28,7 @@
<%= render partial: "pages/dashboard/net_worth_chart", locals: { series: @net_worth_series } %>
</div>
<div class="bg-white p-4 border border-alpha-black-25 shadow-xs rounded-xl w-1/4">
<%= render partial: "pages/dashboard/allocation_chart" %>
<%= render partial: "pages/dashboard/allocation_chart", locals: { account_groups: @account_groups } %>
</div>
</section>
<section class="grid grid-cols-2 gap-4">

19
app/views/pages/dashboard/_allocation_chart.html.erb
View file

@ -1,3 +1,4 @@
<%# locals: (account_groups:) -%>
<div data-controller="tabs" data-tabs-active-class="bg-white border-alpha-black-25 shadow-xs text-gray-900" data-tabs-default-tab-value="asset-tab">
<div class="bg-gray-25 rounded-lg p-1 flex gap-1 text-sm text-gray-500 font-medium">
<button data-id="asset-tab" class="w-1/2 px-2 py-1 rounded-md border border-transparent" data-tabs-target="btn" data-action="tabs#select"><%= t(".assets") %></button>
@ -5,13 +6,23 @@
</div>
<div>
<div data-tabs-target="tab" id="asset-tab" class="space-y-6">
<div class="text-gray-500 flex items-center justify-center py-12">
<p>Coming soon...</p>
<div class="text-gray-500 flex items-center justify-center py-6">
<div
data-controller="pie-chart"
class="w-full aspect-1"
data-pie-chart-label-value="Total Assets"
data-pie-chart-data-value="<%= value_group_pie_data(account_groups[:assets]) %>">
</div>
</div>
</div>
<div data-tabs-target="tab" id="liability-tab" class="space-y-6 hidden">
<div class="text-gray-500 flex items-center justify-center py-12">
<p>Coming soon...</p>
<div class="text-gray-500 flex items-center justify-center py-6">
<div
data-controller="pie-chart"
class="w-full aspect-1"
data-pie-chart-label-value="Total Debts"
data-pie-chart-data-value="<%= value_group_pie_data(account_groups[:liabilities]) %>">
</div>
</div>
</div>
</div>

2
app/views/pages/dashboard/_net_worth_chart.html.erb
View file

@ -2,7 +2,7 @@
<% if series %>
<div
id="netWorthChart"
class="w-full h-full"
class="w-full flex-1 min-h-52"
data-controller="time-series-chart"
data-time-series-chart-data-value="<%= series.to_json %>"></div>
<% else %>