This commit is contained in:
parent
3d4020cf27
commit
2f6d5ff818
6 changed files with 162 additions and 67 deletions
|
|
@ -10,6 +10,7 @@ defmodule MvWeb.Layouts do
|
|||
use MvWeb, :html
|
||||
use Gettext, backend: MvWeb.Gettext
|
||||
import MvWeb.Layouts.Navbar
|
||||
import MvWeb.Layouts.Sidebar
|
||||
|
||||
embed_templates "layouts/*"
|
||||
|
||||
|
|
@ -39,20 +40,39 @@ defmodule MvWeb.Layouts do
|
|||
slot :inner_block, required: true
|
||||
|
||||
def app(assigns) do
|
||||
club_name = get_club_name()
|
||||
assigns = assign(assigns, :club_name, club_name)
|
||||
|
||||
~H"""
|
||||
<%= if @current_user do %>
|
||||
<.navbar current_user={@current_user} />
|
||||
<% end %>
|
||||
<main class="px-4 py-20 sm:px-6 lg:px-16">
|
||||
<div class="mx-auto max-full space-y-4">
|
||||
{render_slot(@inner_block)}
|
||||
<div class="drawer lg:drawer-open">
|
||||
<input id="main-drawer" type="checkbox" class="drawer-toggle" />
|
||||
<div class="drawer-content">
|
||||
<%= if @current_user do %>
|
||||
<.navbar current_user={@current_user} />
|
||||
<% end %>
|
||||
<main class="px-4 py-20 sm:px-6 lg:px-16">
|
||||
<div class="mx-auto space-y-4 max-full">
|
||||
{render_slot(@inner_block)}
|
||||
</div>
|
||||
</main>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
<.sidebar current_user={@current_user} club_name={@club_name} />
|
||||
</div>
|
||||
|
||||
<.flash_group flash={@flash} />
|
||||
"""
|
||||
end
|
||||
|
||||
# Helper function to get club name from settings
|
||||
# Falls back to "Mitgliederverwaltung" if settings can't be loaded
|
||||
defp get_club_name do
|
||||
case Mv.Membership.get_settings() do
|
||||
{:ok, settings} -> settings.club_name
|
||||
_ -> "Mitgliederverwaltung"
|
||||
end
|
||||
end
|
||||
|
||||
@doc """
|
||||
Shows the flash group with standard titles and content.
|
||||
|
||||
|
|
@ -65,7 +85,7 @@ defmodule MvWeb.Layouts do
|
|||
|
||||
def flash_group(assigns) do
|
||||
~H"""
|
||||
<div id={@id} aria-live="polite" class="toast toast-top toast-end z-50 flex flex-col gap-2">
|
||||
<div id={@id} aria-live="polite" class="z-50 flex flex-col gap-2 toast toast-top toast-end">
|
||||
<.flash kind={:success} flash={@flash} />
|
||||
<.flash kind={:warning} flash={@flash} />
|
||||
<.flash kind={:info} flash={@flash} />
|
||||
|
|
|
|||
|
|
@ -6,37 +6,35 @@ defmodule MvWeb.Layouts.Navbar do
|
|||
use Gettext, backend: MvWeb.Gettext
|
||||
use MvWeb, :verified_routes
|
||||
|
||||
alias Mv.Membership
|
||||
|
||||
attr :current_user, :map,
|
||||
required: true,
|
||||
doc: "The current user - navbar is only shown when user is present"
|
||||
|
||||
def navbar(assigns) do
|
||||
club_name = get_club_name()
|
||||
|
||||
assigns = assign(assigns, :club_name, club_name)
|
||||
|
||||
~H"""
|
||||
<header class="navbar bg-base-100 shadow-sm">
|
||||
<header class="shadow-sm navbar bg-base-100">
|
||||
<div class="flex-1">
|
||||
<a class="btn btn-ghost text-xl">{@club_name}</a>
|
||||
<ul class="menu menu-horizontal bg-base-200">
|
||||
<li><.link navigate="/members">{gettext("Members")}</.link></li>
|
||||
<li><.link navigate="/settings">{gettext("Settings")}</.link></li>
|
||||
<li><.link navigate="/users">{gettext("Users")}</.link></li>
|
||||
<li>
|
||||
<details>
|
||||
<summary>{gettext("Contributions")}</summary>
|
||||
<ul class="bg-base-200 rounded-t-none p-2 z-10 w-48">
|
||||
<li><.link navigate="/contribution_types">{gettext("Contribution Types")}</.link></li>
|
||||
<li>
|
||||
<.link navigate="/contribution_settings">{gettext("Contribution Settings")}</.link>
|
||||
</li>
|
||||
</ul>
|
||||
</details>
|
||||
</li>
|
||||
</ul>
|
||||
<label
|
||||
for="main-drawer"
|
||||
aria-label="open sidebar"
|
||||
class="mr-2 btn btn-square btn-ghost lg:hidden"
|
||||
>
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 24 24"
|
||||
stroke-linejoin="round"
|
||||
stroke-linecap="round"
|
||||
stroke-width="2"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
class="my-1.5 inline-block size-4"
|
||||
>
|
||||
<path d="M4 4m0 2a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2z">
|
||||
</path>
|
||||
<path d="M9 4v16"></path>
|
||||
<path d="M14 10l2 2l-2 2"></path>
|
||||
</svg>
|
||||
</label>
|
||||
</div>
|
||||
<div class="flex gap-2">
|
||||
<form method="post" action="/set_locale" class="mr-4">
|
||||
|
|
@ -54,7 +52,7 @@ defmodule MvWeb.Layouts.Navbar do
|
|||
</select>
|
||||
</form>
|
||||
<!-- Daisy UI Theme Toggle for dark and light mode-->
|
||||
<label class="flex cursor-pointer gap-2" aria-label={gettext("Toggle dark mode")}>
|
||||
<label class="flex gap-2 cursor-pointer" aria-label={gettext("Toggle dark mode")}>
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="20"
|
||||
|
|
@ -93,22 +91,19 @@ defmodule MvWeb.Layouts.Navbar do
|
|||
</label>
|
||||
<div class="dropdown dropdown-end">
|
||||
<div tabindex="0" role="button" class="btn btn-ghost btn-circle avatar avatar-placeholder">
|
||||
<div class="bg-neutral text-neutral-content w-12 rounded-full">
|
||||
<div class="w-12 rounded-full bg-neutral text-neutral-content">
|
||||
<span>AA</span>
|
||||
</div>
|
||||
</div>
|
||||
<ul
|
||||
tabindex="0"
|
||||
class="menu menu-sm dropdown-content bg-base-100 rounded-box z-1 mt-3 w-52 p-2 shadow"
|
||||
class="p-2 mt-3 shadow menu menu-sm dropdown-content bg-base-100 rounded-box z-1 w-52"
|
||||
>
|
||||
<li>
|
||||
<.link navigate={~p"/users/#{@current_user.id}"}>
|
||||
{gettext("Profil")}
|
||||
</.link>
|
||||
</li>
|
||||
<li>
|
||||
<.link navigate={~p"/settings"}>{gettext("Settings")}</.link>
|
||||
</li>
|
||||
<li>
|
||||
<.link href={~p"/sign-out"}>{gettext("Logout")}</.link>
|
||||
</li>
|
||||
|
|
@ -118,13 +113,4 @@ defmodule MvWeb.Layouts.Navbar do
|
|||
</header>
|
||||
"""
|
||||
end
|
||||
|
||||
# Helper function to get club name from settings
|
||||
# Falls back to "Mitgliederverwaltung" if settings can't be loaded
|
||||
defp get_club_name do
|
||||
case Membership.get_settings() do
|
||||
{:ok, settings} -> settings.club_name
|
||||
_ -> "Mitgliederverwaltung"
|
||||
end
|
||||
end
|
||||
end
|
||||
|
|
|
|||
80
lib/mv_web/components/layouts/sidebar.ex
Normal file
80
lib/mv_web/components/layouts/sidebar.ex
Normal file
|
|
@ -0,0 +1,80 @@
|
|||
defmodule MvWeb.Layouts.Sidebar do
|
||||
@moduledoc """
|
||||
Sidebar navigation component used in the drawer layout
|
||||
"""
|
||||
use MvWeb, :html
|
||||
|
||||
attr :current_user, :map, default: nil, doc: "The current user"
|
||||
attr :club_name, :string, required: true, doc: "The name of the club"
|
||||
|
||||
def sidebar(assigns) do
|
||||
~H"""
|
||||
<div class="drawer-side is-drawer-close:overflow-visible">
|
||||
<label for="main-drawer" aria-label="close sidebar" class="drawer-overlay"></label>
|
||||
<div class="flex flex-col items-start min-h-full bg-base-200 is-drawer-close:w-14 is-drawer-open:w-64">
|
||||
<ul class="w-64 menu">
|
||||
<li>
|
||||
<h1 class="mb-2 text-lg font-bold menu-title is-drawer-close:hidden">{@club_name}</h1>
|
||||
</li>
|
||||
<%= if @current_user do %>
|
||||
<li>
|
||||
<.link
|
||||
navigate="/members"
|
||||
class={[
|
||||
"is-drawer-close:tooltip is-drawer-close:tooltip-right"
|
||||
]}
|
||||
data-tip={gettext("Members")}
|
||||
>
|
||||
<.icon name="hero-users" class="size-5" />
|
||||
<span class="is-drawer-close:hidden">{gettext("Members")}</span>
|
||||
</.link>
|
||||
</li>
|
||||
<li>
|
||||
<.link
|
||||
navigate="/users"
|
||||
class={[
|
||||
"is-drawer-close:tooltip is-drawer-close:tooltip-right"
|
||||
]}
|
||||
data-tip={gettext("Users")}
|
||||
>
|
||||
<.icon name="hero-user-circle" class="size-5" />
|
||||
<span class="is-drawer-close:hidden">{gettext("Users")}</span>
|
||||
</.link>
|
||||
</li>
|
||||
<li class="is-drawer-close:hidden">
|
||||
<h2 class="flex items-center gap-2 menu-title">
|
||||
<.icon name="hero-currency-dollar" class="size-5" />
|
||||
{gettext("Contributions")}
|
||||
</h2>
|
||||
<ul>
|
||||
<li class="is-drawer-close:hidden">
|
||||
<.link navigate="/contribution_types">
|
||||
{gettext("Plans")}
|
||||
</.link>
|
||||
</li>
|
||||
<li class="is-drawer-close:hidden">
|
||||
<.link navigate="/contribution_settings">
|
||||
{gettext("Settings")}
|
||||
</.link>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<.link
|
||||
navigate="/settings"
|
||||
class={[
|
||||
"is-drawer-close:tooltip is-drawer-close:tooltip-right"
|
||||
]}
|
||||
data-tip={gettext("Settings")}
|
||||
>
|
||||
<.icon name="hero-cog-6-tooth" class="size-5" />
|
||||
<span class="is-drawer-close:hidden">{gettext("Settings")}</span>
|
||||
</.link>
|
||||
</li>
|
||||
<% end %>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
"""
|
||||
end
|
||||
end
|
||||
|
|
@ -292,7 +292,7 @@ msgstr "Benutzer*innen auflisten"
|
|||
msgid "Member"
|
||||
msgstr "Mitglied"
|
||||
|
||||
#: lib/mv_web/components/layouts/navbar.ex
|
||||
#: lib/mv_web/components/layouts/sidebar.ex
|
||||
#: lib/mv_web/live/contribution_type_live/index.ex
|
||||
#: lib/mv_web/live/member_live/index.ex
|
||||
#: lib/mv_web/live/member_live/index.html.heex
|
||||
|
|
@ -348,7 +348,7 @@ msgstr "Alle Mitglieder auswählen"
|
|||
msgid "Select member"
|
||||
msgstr "Mitglied auswählen"
|
||||
|
||||
#: lib/mv_web/components/layouts/navbar.ex
|
||||
#: lib/mv_web/components/layouts/sidebar.ex
|
||||
#: lib/mv_web/live/global_settings_live.ex
|
||||
#, elixir-autogen, elixir-format
|
||||
msgid "Settings"
|
||||
|
|
@ -531,7 +531,7 @@ msgstr "Dunklen Modus umschalten"
|
|||
msgid "Search..."
|
||||
msgstr "Suchen..."
|
||||
|
||||
#: lib/mv_web/components/layouts/navbar.ex
|
||||
#: lib/mv_web/components/layouts/sidebar.ex
|
||||
#, elixir-autogen, elixir-format
|
||||
msgid "Users"
|
||||
msgstr "Benutzer*innen"
|
||||
|
|
@ -943,18 +943,16 @@ msgstr ""
|
|||
msgid "Configure global settings for membership contributions."
|
||||
msgstr ""
|
||||
|
||||
#: lib/mv_web/components/layouts/navbar.ex
|
||||
#: lib/mv_web/live/contribution_settings_live.ex
|
||||
#, elixir-autogen, elixir-format, fuzzy
|
||||
msgid "Contribution Settings"
|
||||
msgstr "Beitrag"
|
||||
msgstr "Beitragseinstellungen"
|
||||
|
||||
#: lib/mv_web/live/contribution_period_live/show.ex
|
||||
#, elixir-autogen, elixir-format, fuzzy
|
||||
msgid "Contribution Start"
|
||||
msgstr "Beitrag"
|
||||
|
||||
#: lib/mv_web/components/layouts/navbar.ex
|
||||
#: lib/mv_web/live/contribution_type_live/index.ex
|
||||
#, elixir-autogen, elixir-format, fuzzy
|
||||
msgid "Contribution Types"
|
||||
|
|
@ -975,10 +973,10 @@ msgstr "Beitrag"
|
|||
msgid "Contribution types define different membership fee structures. Each type has a fixed interval (monthly, quarterly, half-yearly, yearly) that cannot be changed after creation."
|
||||
msgstr ""
|
||||
|
||||
#: lib/mv_web/components/layouts/navbar.ex
|
||||
#: lib/mv_web/components/layouts/sidebar.ex
|
||||
#, elixir-autogen, elixir-format, fuzzy
|
||||
msgid "Contributions"
|
||||
msgstr "Beitrag"
|
||||
msgstr "Beiträge"
|
||||
|
||||
#: lib/mv_web/live/contribution_period_live/show.ex
|
||||
#, elixir-autogen, elixir-format, fuzzy
|
||||
|
|
@ -1405,6 +1403,11 @@ msgstr "Diese Felder können zusätzlich zu den normalen Daten ausgefüllt werde
|
|||
msgid "Value Type"
|
||||
msgstr "Wertetyp"
|
||||
|
||||
#: lib/mv_web/components/layouts/sidebar.ex
|
||||
#, elixir-autogen, elixir-format
|
||||
msgid "Plans"
|
||||
msgstr "Beitragsklassen"
|
||||
|
||||
#~ #: lib/mv_web/live/custom_field_live/show.ex
|
||||
#~ #, elixir-autogen, elixir-format
|
||||
#~ msgid "Auto-generated identifier (immutable)"
|
||||
|
|
|
|||
|
|
@ -293,7 +293,7 @@ msgstr ""
|
|||
msgid "Member"
|
||||
msgstr ""
|
||||
|
||||
#: lib/mv_web/components/layouts/navbar.ex
|
||||
#: lib/mv_web/components/layouts/sidebar.ex
|
||||
#: lib/mv_web/live/contribution_type_live/index.ex
|
||||
#: lib/mv_web/live/member_live/index.ex
|
||||
#: lib/mv_web/live/member_live/index.html.heex
|
||||
|
|
@ -349,7 +349,7 @@ msgstr ""
|
|||
msgid "Select member"
|
||||
msgstr ""
|
||||
|
||||
#: lib/mv_web/components/layouts/navbar.ex
|
||||
#: lib/mv_web/components/layouts/sidebar.ex
|
||||
#: lib/mv_web/live/global_settings_live.ex
|
||||
#, elixir-autogen, elixir-format
|
||||
msgid "Settings"
|
||||
|
|
@ -532,7 +532,7 @@ msgstr ""
|
|||
msgid "Search..."
|
||||
msgstr ""
|
||||
|
||||
#: lib/mv_web/components/layouts/navbar.ex
|
||||
#: lib/mv_web/components/layouts/sidebar.ex
|
||||
#, elixir-autogen, elixir-format
|
||||
msgid "Users"
|
||||
msgstr ""
|
||||
|
|
@ -944,7 +944,6 @@ msgstr ""
|
|||
msgid "Configure global settings for membership contributions."
|
||||
msgstr ""
|
||||
|
||||
#: lib/mv_web/components/layouts/navbar.ex
|
||||
#: lib/mv_web/live/contribution_settings_live.ex
|
||||
#, elixir-autogen, elixir-format
|
||||
msgid "Contribution Settings"
|
||||
|
|
@ -955,7 +954,6 @@ msgstr ""
|
|||
msgid "Contribution Start"
|
||||
msgstr ""
|
||||
|
||||
#: lib/mv_web/components/layouts/navbar.ex
|
||||
#: lib/mv_web/live/contribution_type_live/index.ex
|
||||
#, elixir-autogen, elixir-format
|
||||
msgid "Contribution Types"
|
||||
|
|
@ -976,7 +974,7 @@ msgstr ""
|
|||
msgid "Contribution types define different membership fee structures. Each type has a fixed interval (monthly, quarterly, half-yearly, yearly) that cannot be changed after creation."
|
||||
msgstr ""
|
||||
|
||||
#: lib/mv_web/components/layouts/navbar.ex
|
||||
#: lib/mv_web/components/layouts/sidebar.ex
|
||||
#, elixir-autogen, elixir-format
|
||||
msgid "Contributions"
|
||||
msgstr ""
|
||||
|
|
@ -1405,3 +1403,8 @@ msgstr ""
|
|||
#, elixir-autogen, elixir-format
|
||||
msgid "Value Type"
|
||||
msgstr ""
|
||||
|
||||
#: lib/mv_web/components/layouts/sidebar.ex
|
||||
#, elixir-autogen, elixir-format
|
||||
msgid "Plans"
|
||||
msgstr ""
|
||||
|
|
|
|||
|
|
@ -293,7 +293,7 @@ msgstr ""
|
|||
msgid "Member"
|
||||
msgstr ""
|
||||
|
||||
#: lib/mv_web/components/layouts/navbar.ex
|
||||
#: lib/mv_web/components/layouts/sidebar.ex
|
||||
#: lib/mv_web/live/contribution_type_live/index.ex
|
||||
#: lib/mv_web/live/member_live/index.ex
|
||||
#: lib/mv_web/live/member_live/index.html.heex
|
||||
|
|
@ -349,7 +349,7 @@ msgstr ""
|
|||
msgid "Select member"
|
||||
msgstr ""
|
||||
|
||||
#: lib/mv_web/components/layouts/navbar.ex
|
||||
#: lib/mv_web/components/layouts/sidebar.ex
|
||||
#: lib/mv_web/live/global_settings_live.ex
|
||||
#, elixir-autogen, elixir-format
|
||||
msgid "Settings"
|
||||
|
|
@ -532,7 +532,7 @@ msgstr ""
|
|||
msgid "Search..."
|
||||
msgstr ""
|
||||
|
||||
#: lib/mv_web/components/layouts/navbar.ex
|
||||
#: lib/mv_web/components/layouts/sidebar.ex
|
||||
#, elixir-autogen, elixir-format, fuzzy
|
||||
msgid "Users"
|
||||
msgstr ""
|
||||
|
|
@ -944,7 +944,6 @@ msgstr ""
|
|||
msgid "Configure global settings for membership contributions."
|
||||
msgstr ""
|
||||
|
||||
#: lib/mv_web/components/layouts/navbar.ex
|
||||
#: lib/mv_web/live/contribution_settings_live.ex
|
||||
#, elixir-autogen, elixir-format
|
||||
msgid "Contribution Settings"
|
||||
|
|
@ -955,7 +954,6 @@ msgstr ""
|
|||
msgid "Contribution Start"
|
||||
msgstr ""
|
||||
|
||||
#: lib/mv_web/components/layouts/navbar.ex
|
||||
#: lib/mv_web/live/contribution_type_live/index.ex
|
||||
#, elixir-autogen, elixir-format
|
||||
msgid "Contribution Types"
|
||||
|
|
@ -976,7 +974,7 @@ msgstr ""
|
|||
msgid "Contribution types define different membership fee structures. Each type has a fixed interval (monthly, quarterly, half-yearly, yearly) that cannot be changed after creation."
|
||||
msgstr ""
|
||||
|
||||
#: lib/mv_web/components/layouts/navbar.ex
|
||||
#: lib/mv_web/components/layouts/sidebar.ex
|
||||
#, elixir-autogen, elixir-format
|
||||
msgid "Contributions"
|
||||
msgstr ""
|
||||
|
|
@ -1406,6 +1404,11 @@ msgstr ""
|
|||
msgid "Value Type"
|
||||
msgstr ""
|
||||
|
||||
#: lib/mv_web/components/layouts/sidebar.ex
|
||||
#, elixir-autogen, elixir-format
|
||||
msgid "Plans"
|
||||
msgstr ""
|
||||
|
||||
#~ #: lib/mv_web/live/custom_field_live/show.ex
|
||||
#~ #, elixir-autogen, elixir-format
|
||||
#~ msgid "Auto-generated identifier (immutable)"
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue