90 lines
2.6 KiB
Text
90 lines
2.6 KiB
Text
<Layouts.app flash={@flash} current_user={@current_user}>
|
|
<.header>
|
|
{gettext("Members")}
|
|
<:actions>
|
|
<.button variant="primary" navigate={~p"/members/new"}>
|
|
<.icon name="hero-plus" /> {gettext("New Member")}
|
|
</.button>
|
|
</:actions>
|
|
</.header>
|
|
|
|
<.live_component
|
|
module={MvWeb.Components.SearchBarComponent}
|
|
id="search-bar"
|
|
query={@query}
|
|
placeholder={gettext("Search...")}
|
|
/>
|
|
|
|
<.table
|
|
id="members"
|
|
rows={@members}
|
|
row_click={fn member -> JS.navigate(~p"/members/#{member}") end}
|
|
>
|
|
|
|
<!-- <:col :let={member} label="Id">{member.id}</:col> -->
|
|
<:col
|
|
:let={member}
|
|
label={
|
|
~H"""
|
|
<.input
|
|
type="checkbox"
|
|
name="select_all"
|
|
phx-click="select_all"
|
|
checked={Enum.sort(@selected_members) == Enum.map(@members, & &1.id) |> Enum.sort()}
|
|
aria-label={gettext("Select all members")}
|
|
role="checkbox"
|
|
/>
|
|
"""
|
|
}
|
|
>
|
|
<.input
|
|
type="checkbox"
|
|
name={member.id}
|
|
phx-click="select_member"
|
|
phx-value-id={member.id}
|
|
checked={member.id in @selected_members}
|
|
phx-capture-click
|
|
phx-stop-propagation
|
|
aria-label={gettext("Select member")}
|
|
role="checkbox"
|
|
/>
|
|
</:col>
|
|
<:col
|
|
:let={member}
|
|
label={
|
|
sort_button(%{
|
|
field: :first_name,
|
|
label: gettext("Name"),
|
|
sort_field: @sort_field,
|
|
sort_order: @sort_order
|
|
})
|
|
}
|
|
>
|
|
{member.first_name} {member.last_name}
|
|
</:col>
|
|
<:col :let={member} label={gettext("Email")}>{member.email}</:col>
|
|
<:col :let={member} label={gettext("Street")}>{member.street}</:col>
|
|
<:col :let={member} label={gettext("House Number")}>{member.house_number}</:col>
|
|
<:col :let={member} label={gettext("Postal Code")}>{member.postal_code}</:col>
|
|
<:col :let={member} label={gettext("City")}>{member.city}</:col>
|
|
<:col :let={member} label={gettext("Phone Number")}>{member.phone_number}</:col>
|
|
<:col :let={member} label={gettext("Join Date")}>{member.join_date}</:col>
|
|
|
|
<:action :let={member}>
|
|
<div class="sr-only">
|
|
<.link navigate={~p"/members/#{member}"}>{gettext("Show")}</.link>
|
|
</div>
|
|
|
|
<.link navigate={~p"/members/#{member}/edit"}>{gettext("Edit")}</.link>
|
|
</:action>
|
|
|
|
<:action :let={member}>
|
|
<.link
|
|
phx-click={JS.push("delete", value: %{id: member.id}) |> hide("#row-#{member.id}")}
|
|
data-confirm={gettext("Are you sure?")}
|
|
>
|
|
{gettext("Delete")}
|
|
</.link>
|
|
</:action>
|
|
</.table>
|
|
</Layouts.app>
|