Statistics: member stats independent of fee type
This commit is contained in:
parent
98af2b77ee
commit
490dced8c8
3 changed files with 272 additions and 147 deletions
|
|
@ -8,23 +8,49 @@ defmodule MvWeb.StatisticsLive do
|
|||
|
||||
import MvWeb.LiveHelpers, only: [current_actor: 1]
|
||||
alias Mv.Statistics
|
||||
alias Mv.MembershipFees.MembershipFeeType
|
||||
alias MvWeb.Helpers.MembershipFeeHelpers
|
||||
|
||||
@impl true
|
||||
def mount(_params, _session, socket) do
|
||||
socket =
|
||||
socket
|
||||
|> load_statistics()
|
||||
|> assign(:page_title, gettext("Statistics"))
|
||||
|> assign(:selected_fee_type_id, nil)
|
||||
|> load_fee_types()
|
||||
|> load_statistics()
|
||||
|
||||
{:ok, socket}
|
||||
end
|
||||
|
||||
@impl true
|
||||
def handle_params(_params, _uri, socket) do
|
||||
{:noreply, load_statistics(socket)}
|
||||
def handle_params(params, uri, socket) do
|
||||
# Query params: after push_patch, params may not include query string in some cases;
|
||||
# always derive from URI as well so fee_type_id is reliable.
|
||||
uri_query = if uri, do: URI.decode_query(URI.parse(uri).query || ""), else: %{}
|
||||
fee_type_id = params["fee_type_id"] || uri_query["fee_type_id"]
|
||||
fee_type_id = normalize_fee_type_id(fee_type_id)
|
||||
|
||||
socket =
|
||||
socket
|
||||
|> assign(:selected_fee_type_id, fee_type_id)
|
||||
|> load_statistics()
|
||||
|
||||
{:noreply, socket}
|
||||
end
|
||||
|
||||
defp normalize_fee_type_id(nil), do: nil
|
||||
defp normalize_fee_type_id(""), do: nil
|
||||
|
||||
defp normalize_fee_type_id(id) when is_binary(id) do
|
||||
case String.trim(id) do
|
||||
"" -> nil
|
||||
trimmed -> trimmed
|
||||
end
|
||||
end
|
||||
|
||||
defp normalize_fee_type_id(_), do: nil
|
||||
|
||||
@impl true
|
||||
def render(assigns) do
|
||||
~H"""
|
||||
|
|
@ -34,94 +60,104 @@ defmodule MvWeb.StatisticsLive do
|
|||
<:subtitle>{gettext("Overview from first membership to today")}</:subtitle>
|
||||
</.header>
|
||||
|
||||
<div class="grid grid-cols-1 sm:grid-cols-3 gap-4 mb-8">
|
||||
<div class="card bg-base-200 shadow-md border border-base-300">
|
||||
<div class="card-body p-5">
|
||||
<h2 class="card-title text-sm font-medium text-base-content/80">
|
||||
{gettext("Active members")}
|
||||
</h2>
|
||||
<p
|
||||
class="text-3xl font-bold tabular-nums"
|
||||
aria-label={gettext("Active members") <> ": " <> to_string(@active_count)}
|
||||
>
|
||||
{@active_count}
|
||||
</p>
|
||||
<section class="mb-8" aria-labelledby="members-heading">
|
||||
<h2 id="members-heading" class="text-xl font-semibold mb-4">{gettext("Members")}</h2>
|
||||
<div class="grid grid-cols-1 sm:grid-cols-2 gap-4 mb-6">
|
||||
<div class="card bg-base-200 shadow-md border border-base-300">
|
||||
<div class="card-body p-5">
|
||||
<h3 class="card-title text-sm font-medium text-base-content/80">
|
||||
{gettext("Active members")}
|
||||
</h3>
|
||||
<p
|
||||
class="text-3xl font-bold tabular-nums"
|
||||
aria-label={gettext("Active members") <> ": " <> to_string(@active_count)}
|
||||
>
|
||||
{@active_count}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card bg-base-200 shadow-md border border-base-300">
|
||||
<div class="card-body p-5">
|
||||
<h3 class="card-title text-sm font-medium text-base-content/80">
|
||||
{gettext("Inactive members")}
|
||||
</h3>
|
||||
<p
|
||||
class="text-3xl font-bold tabular-nums"
|
||||
aria-label={gettext("Inactive members") <> ": " <> to_string(@inactive_count)}
|
||||
>
|
||||
{@inactive_count}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card bg-base-200 shadow-md border border-base-300">
|
||||
<div class="card-body p-5">
|
||||
<h2 class="card-title text-sm font-medium text-base-content/80">
|
||||
{gettext("Inactive members")}
|
||||
</h2>
|
||||
<p
|
||||
class="text-3xl font-bold tabular-nums"
|
||||
aria-label={gettext("Inactive members") <> ": " <> to_string(@inactive_count)}
|
||||
>
|
||||
{@inactive_count}
|
||||
<div class="card-body">
|
||||
<h3 class="card-title text-lg mb-4">{gettext("Member numbers by year")}</h3>
|
||||
<p class="text-sm text-base-content/70 mb-4">
|
||||
{gettext("From %{first} to %{last} (relevant years with membership data)",
|
||||
first: @years |> List.last() |> to_string(),
|
||||
last: @years |> List.first() |> to_string()
|
||||
)}
|
||||
</p>
|
||||
<.member_numbers_table joins_exits_by_year={@joins_exits_by_year} />
|
||||
</div>
|
||||
</div>
|
||||
<div class="card bg-base-200 shadow-md border border-base-300">
|
||||
<div class="card-body p-5">
|
||||
<h2 class="card-title text-sm font-medium text-base-content/80">
|
||||
{gettext("Open amount")}
|
||||
</h2>
|
||||
<p
|
||||
class="text-3xl font-bold tabular-nums"
|
||||
aria-label={gettext("Open amount") <> ": " <> MembershipFeeHelpers.format_currency(@open_amount_total)}
|
||||
>
|
||||
{MembershipFeeHelpers.format_currency(@open_amount_total)}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<section
|
||||
class="card bg-base-200 shadow-md border border-base-300 mb-8"
|
||||
aria-labelledby="joins-exits-heading"
|
||||
>
|
||||
<div class="card-body">
|
||||
<h2 id="joins-exits-heading" class="card-title text-lg mb-4">
|
||||
{gettext("Joins and exits by year")}
|
||||
</h2>
|
||||
<p class="text-sm text-base-content/70 mb-4">
|
||||
{gettext("From %{first} to %{last} (relevant years with membership data)",
|
||||
first: @years |> List.last() |> to_string(),
|
||||
last: @years |> List.first() |> to_string()
|
||||
)}
|
||||
</p>
|
||||
<.joins_exits_bars joins_exits_by_year={@joins_exits_by_year} />
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section
|
||||
class="card bg-base-200 shadow-md border border-base-300 mb-8"
|
||||
aria-labelledby="contributions-heading"
|
||||
>
|
||||
<div class="card-body">
|
||||
<h2 id="contributions-heading" class="card-title text-lg mb-4">
|
||||
{gettext("Contributions by year")}
|
||||
</h2>
|
||||
<div class="flex flex-col gap-8 items-start">
|
||||
<div class="w-full">
|
||||
<.contributions_bars_by_year
|
||||
contributions_by_year={@contributions_by_year}
|
||||
totals_over_all_years={@totals_over_all_years}
|
||||
/>
|
||||
</div>
|
||||
<div class="w-full flex flex-col items-center pt-6 mt-2 border-t border-base-300">
|
||||
<h3 class="text-sm font-semibold mb-3">{gettext("All years combined (pie)")}</h3>
|
||||
<.contributions_pie cycle_totals={@totals_over_all_years} />
|
||||
<p class="text-xs text-base-content/70 mt-2">
|
||||
<span class="inline-block w-2 h-2 rounded-full bg-success align-middle mr-1"></span>
|
||||
{gettext("Paid")}
|
||||
<span class="inline-block w-2 h-2 rounded-full bg-warning align-middle mx-2 mr-1">
|
||||
</span>
|
||||
{gettext("Unpaid")}
|
||||
<span class="inline-block w-2 h-2 rounded-full bg-base-content/20 align-middle mx-2 mr-1">
|
||||
</span>
|
||||
{gettext("Suspended")}
|
||||
</p>
|
||||
<section class="mb-8" aria-labelledby="contributions-heading">
|
||||
<h2 id="contributions-heading" class="text-xl font-semibold mb-4">
|
||||
{gettext("Contributions")}
|
||||
</h2>
|
||||
<div class="flex flex-wrap items-end gap-4 mb-6">
|
||||
<div class="flex items-center gap-2">
|
||||
<form id="fee-type-form" phx-change="change_fee_type" class="flex items-center gap-2">
|
||||
<label for="fee-type-filter" class="text-sm font-medium text-base-content/80">
|
||||
{gettext("Fee type")}:
|
||||
</label>
|
||||
<select
|
||||
id="fee-type-filter"
|
||||
name="fee_type_id"
|
||||
class="select select-bordered select-sm min-w-[10rem]"
|
||||
>
|
||||
<option value="" selected={@selected_fee_type_id in [nil, ""]}>
|
||||
{gettext("All")}
|
||||
</option>
|
||||
<%= for ft <- @membership_fee_types do %>
|
||||
<option
|
||||
value={ft.id}
|
||||
selected={to_string(@selected_fee_type_id) == to_string(ft.id)}
|
||||
>
|
||||
{ft.name}
|
||||
</option>
|
||||
<% end %>
|
||||
</select>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card bg-base-200 shadow-md border border-base-300">
|
||||
<div class="card-body">
|
||||
<h3 class="card-title text-lg mb-4">{gettext("Contributions by year")}</h3>
|
||||
<div class="flex flex-col gap-8 items-start">
|
||||
<div class="w-full">
|
||||
<.contributions_bars_by_year
|
||||
contributions_by_year={@contributions_by_year}
|
||||
totals_over_all_years={@totals_over_all_years}
|
||||
/>
|
||||
</div>
|
||||
<div class="w-full flex flex-col items-center pt-6 mt-2 border-t border-base-300">
|
||||
<h4 class="text-sm font-semibold mb-3">{gettext("All years combined (pie)")}</h4>
|
||||
<.contributions_pie cycle_totals={@totals_over_all_years} />
|
||||
<p class="text-xs text-base-content/70 mt-2">
|
||||
<span class="inline-block w-2 h-2 rounded-full bg-success align-middle mr-1"></span>
|
||||
{gettext("Paid")}
|
||||
<span class="inline-block w-2 h-2 rounded-full bg-warning align-middle mx-2 mr-1">
|
||||
</span>
|
||||
{gettext("Unpaid")}
|
||||
<span class="inline-block w-2 h-2 rounded-full bg-base-content/20 align-middle mx-2 mr-1">
|
||||
</span>
|
||||
{gettext("Suspended")}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -130,70 +166,117 @@ defmodule MvWeb.StatisticsLive do
|
|||
"""
|
||||
end
|
||||
|
||||
@impl true
|
||||
def handle_event("change_fee_type", %{"fee_type_id" => ""}, socket) do
|
||||
{:noreply, push_patch(socket, to: ~p"/statistics")}
|
||||
end
|
||||
|
||||
def handle_event("change_fee_type", %{"fee_type_id" => id}, socket) do
|
||||
{:noreply, push_patch(socket, to: ~p"/statistics?fee_type_id=#{id}")}
|
||||
end
|
||||
|
||||
attr :joins_exits_by_year, :list, required: true
|
||||
|
||||
defp joins_exits_bars(assigns) do
|
||||
join_values = Enum.map(assigns.joins_exits_by_year, & &1.joins)
|
||||
exit_values = Enum.map(assigns.joins_exits_by_year, & &1.exits)
|
||||
max_joins = max((join_values != [] && Enum.max(join_values)) || 0, 1)
|
||||
max_exits = max((exit_values != [] && Enum.max(exit_values)) || 0, 1)
|
||||
defp member_numbers_table(assigns) do
|
||||
rows = assigns.joins_exits_by_year
|
||||
total_activity = Enum.map(rows, fn r -> r.joins + r.exits end)
|
||||
max_total = (total_activity != [] && Enum.max(total_activity)) || 1
|
||||
|
||||
assigns = assign(assigns, :max_joins, max_joins)
|
||||
assigns = assign(assigns, :max_exits, max_exits)
|
||||
rows_with_pct =
|
||||
Enum.map(rows, fn row ->
|
||||
sum = row.joins + row.exits
|
||||
|
||||
bar_pct =
|
||||
if max_total > 0 and sum > 0, do: Float.round(sum / max_total * 100, 1), else: 0
|
||||
|
||||
seg_scale = max(sum, 1)
|
||||
joins_pct = row.joins / seg_scale * 100
|
||||
exits_pct = row.exits / seg_scale * 100
|
||||
|
||||
%{
|
||||
year: row.year,
|
||||
joins: row.joins,
|
||||
exits: row.exits,
|
||||
bar_pct: bar_pct,
|
||||
joins_pct: Float.round(joins_pct, 1),
|
||||
exits_pct: Float.round(exits_pct, 1)
|
||||
}
|
||||
end)
|
||||
|
||||
assigns = assign(assigns, :rows, rows_with_pct)
|
||||
|
||||
~H"""
|
||||
<div
|
||||
class="space-y-4"
|
||||
class="overflow-x-auto"
|
||||
role="img"
|
||||
aria-label={gettext("Joins and exits by year as horizontal bar chart")}
|
||||
aria-label={gettext("Member numbers by year as table with bars")}
|
||||
>
|
||||
<div class="flex gap-4 text-sm mb-2">
|
||||
<span class="flex items-center gap-2">
|
||||
<span class="inline-block w-4 h-3 rounded bg-success" aria-hidden="true"></span>
|
||||
{gettext("Joins")}
|
||||
</span>
|
||||
<span class="flex items-center gap-2">
|
||||
<span class="inline-block w-4 h-3 rounded bg-error" aria-hidden="true"></span>
|
||||
{gettext("Exits")}
|
||||
</span>
|
||||
</div>
|
||||
<div class="space-y-3">
|
||||
<%= for item <- @joins_exits_by_year do %>
|
||||
<div class="flex flex-col sm:flex-row sm:items-center gap-2">
|
||||
<span class="w-12 font-mono text-sm shrink-0" id={"year-#{item.year}"}>{item.year}</span>
|
||||
<div class="flex-1 min-w-0 space-y-1">
|
||||
<div class="flex items-center gap-2">
|
||||
<span class="text-xs w-8 shrink-0">{item.joins}</span>
|
||||
<div
|
||||
class="h-6 bg-base-300 rounded overflow-hidden flex min-w-[4rem]"
|
||||
role="presentation"
|
||||
>
|
||||
<table class="table table-sm w-full">
|
||||
<thead class="bg-base-300">
|
||||
<tr>
|
||||
<th scope="col" class="text-base-content font-semibold w-20">{gettext("Year")}</th>
|
||||
<th scope="col" class="text-base-content font-semibold">{gettext("Joins")}</th>
|
||||
<th scope="col" class="text-base-content font-semibold">{gettext("Exits")}</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<%= for row <- @rows do %>
|
||||
<tr>
|
||||
<td
|
||||
rowspan="2"
|
||||
class="font-mono align-middle border-b-0"
|
||||
>
|
||||
{row.year}
|
||||
</td>
|
||||
<td colspan="2" class="align-top p-1 pb-0 border-b-0">
|
||||
<div class="h-6 rounded overflow-hidden bg-base-300 relative min-w-[4rem]">
|
||||
<div
|
||||
class="h-full bg-success transition-all min-w-[2px]"
|
||||
style={"width: #{max(0, min(100, Float.round(item.joins / @max_joins * 100, 1)))}%"}
|
||||
aria-hidden="true"
|
||||
class="flex h-full absolute left-0 top-0 bottom-0 min-w-0 rounded"
|
||||
style={"width: #{max(0, row.bar_pct)}%"}
|
||||
>
|
||||
<div
|
||||
class="h-full bg-success min-w-0 rounded-l"
|
||||
style={"width: #{row.joins_pct}%"}
|
||||
title={gettext("Joins")}
|
||||
>
|
||||
</div>
|
||||
<div
|
||||
class="h-full bg-error min-w-0 rounded-r"
|
||||
style={"width: #{row.exits_pct}%"}
|
||||
title={gettext("Exits")}
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex items-center gap-2">
|
||||
<span class="text-xs w-8 shrink-0">{item.exits}</span>
|
||||
<div
|
||||
class="h-6 bg-base-300 rounded overflow-hidden flex min-w-[4rem]"
|
||||
role="presentation"
|
||||
>
|
||||
<div
|
||||
class="h-full bg-error transition-all min-w-[2px]"
|
||||
style={"width: #{max(0, min(100, Float.round(item.exits / @max_exits * 100, 1)))}%"}
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="align-middle text-xs font-mono text-base-content whitespace-nowrap pt-0">
|
||||
<span class="inline-flex items-center gap-1.5">
|
||||
{row.joins}
|
||||
<span
|
||||
class="inline-block w-2 h-2 rounded-full bg-success shrink-0"
|
||||
aria-hidden="true"
|
||||
title={gettext("Joins")}
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<% end %>
|
||||
</div>
|
||||
</span>
|
||||
</span>
|
||||
</td>
|
||||
<td class="align-middle text-xs font-mono text-base-content whitespace-nowrap pt-0">
|
||||
<span class="inline-flex items-center gap-1.5">
|
||||
{row.exits}
|
||||
<span
|
||||
class="inline-block w-2 h-2 rounded-full bg-error shrink-0"
|
||||
aria-hidden="true"
|
||||
title={gettext("Exits")}
|
||||
>
|
||||
</span>
|
||||
</span>
|
||||
</td>
|
||||
</tr>
|
||||
<% end %>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
"""
|
||||
end
|
||||
|
|
@ -426,26 +509,40 @@ defmodule MvWeb.StatisticsLive do
|
|||
"""
|
||||
end
|
||||
|
||||
defp load_fee_types(socket) do
|
||||
actor = current_actor(socket)
|
||||
|
||||
fee_types =
|
||||
MembershipFeeType
|
||||
|> Ash.Query.sort(name: :asc)
|
||||
|> Ash.read!(domain: Mv.MembershipFees, actor: actor)
|
||||
|
||||
assign(socket, :membership_fee_types, fee_types)
|
||||
end
|
||||
|
||||
defp load_statistics(socket) do
|
||||
actor = current_actor(socket)
|
||||
opts = [actor: actor]
|
||||
fee_type_id = socket.assigns[:selected_fee_type_id]
|
||||
# Member stats must never depend on fee type (only contributions do)
|
||||
opts_member = [actor: actor]
|
||||
|
||||
opts_contributions =
|
||||
[actor: actor] ++ if fee_type_id, do: [fee_type_id: fee_type_id], else: []
|
||||
|
||||
current_year = Date.utc_today().year
|
||||
first_year = Statistics.first_join_year(opts) || current_year
|
||||
first_year = Statistics.first_join_year(opts_member) || current_year
|
||||
years = first_year..current_year |> Enum.to_list() |> Enum.reverse()
|
||||
|
||||
active_count = Statistics.active_member_count(opts)
|
||||
inactive_count = Statistics.inactive_member_count(opts)
|
||||
open_amount_total = Statistics.open_amount_total(opts)
|
||||
joins_exits_by_year = build_joins_exits_by_year(years, opts)
|
||||
contributions_by_year = build_contributions_by_year(years, opts)
|
||||
active_count = Statistics.active_member_count(opts_member)
|
||||
inactive_count = Statistics.inactive_member_count(opts_member)
|
||||
joins_exits_by_year = build_joins_exits_by_year(years, opts_member)
|
||||
contributions_by_year = build_contributions_by_year(years, opts_contributions)
|
||||
totals_over_all_years = sum_cycle_totals(contributions_by_year)
|
||||
|
||||
assign(socket,
|
||||
years: years,
|
||||
active_count: active_count,
|
||||
inactive_count: inactive_count,
|
||||
open_amount_total: open_amount_total,
|
||||
joins_exits_by_year: joins_exits_by_year,
|
||||
contributions_by_year: contributions_by_year,
|
||||
totals_over_all_years: totals_over_all_years
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue