Graham McIntire
7d4f7dd7d4
- Add active_page attribute to authenticated layout - Update nav_link component to show active state with border and text styling - Update all LiveView templates to pass active_page parameter - Fix datetime truncation issues in tests and schemas for :utc_datetime fields - Fix dashboard test assertions for equipment status text
78 lines
2.8 KiB
Text
78 lines
2.8 KiB
Text
<Layouts.authenticated
|
|
flash={@flash}
|
|
current_organization={@current_organization}
|
|
active_page="equipment"
|
|
>
|
|
<.header>
|
|
{@page_title}
|
|
<:subtitle>Monitor and manage all your network equipment</:subtitle>
|
|
<:actions>
|
|
<.button navigate={~p"/orgs/#{@current_organization.slug}/equipment/new"} variant="primary">
|
|
<.icon name="hero-plus" class="h-5 w-5" /> New Equipment
|
|
</.button>
|
|
</:actions>
|
|
</.header>
|
|
|
|
<%= if @equipment == [] do %>
|
|
<div class="text-center py-16">
|
|
<.icon name="hero-server" class="mx-auto h-12 w-12 text-zinc-400 dark:text-zinc-600" />
|
|
<h3 class="mt-4 text-lg font-semibold text-zinc-900 dark:text-zinc-100">No equipment</h3>
|
|
<p class="mt-2 text-sm text-zinc-600 dark:text-zinc-400">
|
|
Get started by adding your first equipment.
|
|
</p>
|
|
<div class="mt-6">
|
|
<.button
|
|
navigate={~p"/orgs/#{@current_organization.slug}/equipment/new"}
|
|
variant="primary"
|
|
>
|
|
<.icon name="hero-plus" class="h-5 w-5" /> New Equipment
|
|
</.button>
|
|
</div>
|
|
</div>
|
|
<% else %>
|
|
<.table id="equipment" rows={@equipment}>
|
|
<:col :let={eq} label="Name">
|
|
<span class="font-medium">{eq.name}</span>
|
|
</:col>
|
|
<:col :let={eq} label="IP Address">
|
|
<span class="font-mono text-sm">{eq.ip_address}</span>
|
|
</:col>
|
|
<:col :let={eq} label="Site">
|
|
<.link
|
|
navigate={~p"/orgs/#{@current_organization.slug}/sites/#{eq.site.id}"}
|
|
class="text-blue-600 hover:text-blue-700 dark:text-blue-400 dark:hover:text-blue-300"
|
|
>
|
|
{eq.site.name}
|
|
</.link>
|
|
</:col>
|
|
<:col :let={eq} label="Status">
|
|
<span class={[
|
|
"inline-flex items-center rounded-full px-2.5 py-0.5 text-xs font-medium",
|
|
eq.status == :up && "bg-green-100 text-green-800 dark:bg-green-900 dark:text-green-200",
|
|
eq.status == :down && "bg-red-100 text-red-800 dark:bg-red-900 dark:text-red-200",
|
|
eq.status == :unknown &&
|
|
"bg-zinc-100 text-zinc-800 dark:bg-zinc-800 dark:text-zinc-200"
|
|
]}>
|
|
{eq.status |> to_string() |> String.upcase()}
|
|
</span>
|
|
</:col>
|
|
<:col :let={eq} label="Last Checked">
|
|
<span class="text-sm text-zinc-600 dark:text-zinc-400">
|
|
<%= if eq.last_checked_at do %>
|
|
{Calendar.strftime(eq.last_checked_at, "%Y-%m-%d %H:%M")}
|
|
<% else %>
|
|
Never
|
|
<% end %>
|
|
</span>
|
|
</:col>
|
|
<:action :let={eq}>
|
|
<.link
|
|
navigate={~p"/orgs/#{@current_organization.slug}/equipment/#{eq.id}"}
|
|
class="text-blue-600 hover:text-blue-700 dark:text-blue-400 dark:hover:text-blue-300"
|
|
>
|
|
View
|
|
</.link>
|
|
</:action>
|
|
</.table>
|
|
<% end %>
|
|
</Layouts.authenticated>
|