Graham McIntire
9735e6e569
Add greyed out '(optional)' text to Parent Site, Location, and Description field labels for better UX. The optional indicator uses a lighter color (text-zinc-500/400) to distinguish it from the required field label.
198 lines
8.5 KiB
Text
198 lines
8.5 KiB
Text
<Layouts.authenticated
|
|
flash={@flash}
|
|
current_scope={@current_scope}
|
|
current_organization={@organization}
|
|
>
|
|
<div class="mb-4">
|
|
<.link
|
|
navigate={
|
|
if @live_action == :edit,
|
|
do: ~p"/orgs/#{@organization.slug}/sites/#{@site.id}",
|
|
else: ~p"/orgs/#{@organization.slug}/sites"
|
|
}
|
|
class="inline-flex items-center gap-1 text-sm text-zinc-600 hover:text-zinc-900 dark:text-zinc-400 dark:hover:text-zinc-100"
|
|
>
|
|
<.icon name="hero-arrow-left" class="h-4 w-4" />
|
|
{if @live_action == :edit, do: "Back to Site", else: "Back to Sites"}
|
|
</.link>
|
|
</div>
|
|
|
|
<.header>
|
|
{@page_title}
|
|
<:subtitle>
|
|
{if @live_action == :new,
|
|
do: "Add a new site to your organization",
|
|
else: "Update site details"}
|
|
</:subtitle>
|
|
</.header>
|
|
|
|
<div class="max-w-2xl">
|
|
<.form for={@form} id="site-form" phx-change="validate" phx-submit="save">
|
|
<.input field={@form[:name]} type="text" label="Site Name" required />
|
|
|
|
<div class="mb-4">
|
|
<label>
|
|
<span class="block text-sm font-medium text-zinc-900 dark:text-zinc-100 mb-2">
|
|
Parent Site
|
|
<span class="text-zinc-500 dark:text-zinc-400 font-normal">(optional)</span>
|
|
</span>
|
|
<select
|
|
id={@form[:parent_site_id].id}
|
|
name={@form[:parent_site_id].name}
|
|
class="block w-full rounded-lg border-0 py-2 px-3 text-zinc-900 shadow-sm ring-1 ring-inset ring-zinc-300 focus:ring-2 focus:ring-inset focus:ring-blue-600 sm:text-sm sm:leading-6 dark:bg-zinc-800 dark:text-zinc-100 dark:ring-zinc-700 dark:focus:ring-blue-500"
|
|
>
|
|
<option value="">No parent site</option>
|
|
{Phoenix.HTML.Form.options_for_select(
|
|
Enum.map(@available_parent_sites, &{&1.name, &1.id}),
|
|
@form[:parent_site_id].value
|
|
)}
|
|
</select>
|
|
</label>
|
|
</div>
|
|
|
|
<div class="mb-4">
|
|
<label>
|
|
<span class="block text-sm font-medium text-zinc-900 dark:text-zinc-100 mb-2">
|
|
Location <span class="text-zinc-500 dark:text-zinc-400 font-normal">(optional)</span>
|
|
</span>
|
|
<input
|
|
type="text"
|
|
id={@form[:location].id}
|
|
name={@form[:location].name}
|
|
value={@form[:location].value}
|
|
class="block w-full rounded-lg border-0 py-2 px-3 text-zinc-900 shadow-sm ring-1 ring-inset ring-zinc-300 focus:ring-2 focus:ring-inset focus:ring-blue-600 sm:text-sm sm:leading-6 dark:bg-zinc-800 dark:text-zinc-100 dark:ring-zinc-700 dark:focus:ring-blue-500"
|
|
/>
|
|
</label>
|
|
</div>
|
|
|
|
<div class="mb-4">
|
|
<label>
|
|
<span class="block text-sm font-medium text-zinc-900 dark:text-zinc-100 mb-2">
|
|
Description
|
|
<span class="text-zinc-500 dark:text-zinc-400 font-normal">(optional)</span>
|
|
</span>
|
|
<textarea
|
|
id={@form[:description].id}
|
|
name={@form[:description].name}
|
|
class="block w-full rounded-lg border-0 py-2 px-3 text-zinc-900 shadow-sm ring-1 ring-inset ring-zinc-300 focus:ring-2 focus:ring-inset focus:ring-blue-600 sm:text-sm sm:leading-6 dark:bg-zinc-800 dark:text-zinc-100 dark:ring-zinc-700 dark:focus:ring-blue-500"
|
|
>{Phoenix.HTML.Form.normalize_value("textarea", @form[:description].value)}</textarea>
|
|
</label>
|
|
</div>
|
|
|
|
<%= if @available_agents != [] do %>
|
|
<div class="mt-6 border-t pt-6">
|
|
<h3 class="text-base font-medium mb-4">Agent Configuration (Optional)</h3>
|
|
<p class="text-sm text-zinc-600 dark:text-zinc-400 mb-4">
|
|
Set a default agent for SNMP polling at this site. This will override the organization default for all equipment at this site. Leave blank to inherit from organization.
|
|
</p>
|
|
|
|
<.input
|
|
field={@form[:agent_token_id]}
|
|
type="select"
|
|
label="Default Agent for Site"
|
|
prompt="Inherit from organization"
|
|
options={Enum.map(@available_agents, &{&1.name, &1.id})}
|
|
/>
|
|
|
|
<%= if @live_action == :edit and @site.agent_token_id do %>
|
|
<p class="mt-1 text-sm text-amber-600 dark:text-amber-400 flex items-center gap-1">
|
|
<.icon name="hero-exclamation-triangle" class="h-4 w-4" />
|
|
<strong>Overriding</strong> organization default -
|
|
all equipment at this site will use this agent
|
|
</p>
|
|
|
|
<div class="mt-4 p-3 bg-amber-50 dark:bg-amber-900/20 border border-amber-200 dark:border-amber-800 rounded-lg">
|
|
<p class="text-sm font-medium text-amber-900 dark:text-amber-200 mb-2">
|
|
Force Apply to Site Equipment
|
|
</p>
|
|
<p class="text-sm text-amber-700 dark:text-amber-300 mb-3">
|
|
This will assign this agent to ALL equipment at this site.
|
|
</p>
|
|
<.button
|
|
type="button"
|
|
phx-click="apply_agent_to_all"
|
|
data-confirm="This will replace agent assignments for ALL equipment at this site. Are you sure?"
|
|
variant="danger"
|
|
>
|
|
<.icon name="hero-arrow-path" class="h-4 w-4" /> Apply Agent to All Equipment
|
|
</.button>
|
|
</div>
|
|
<% else %>
|
|
<%= if Map.get(assigns, :org_agent) do %>
|
|
<p class="mt-1 text-sm text-zinc-600 dark:text-zinc-400 flex items-center gap-1">
|
|
<.icon name="hero-building-office-2" class="h-4 w-4" />
|
|
Currently inheriting organization default: <strong>{@org_agent.name}</strong>
|
|
</p>
|
|
<% else %>
|
|
<p class="mt-1 text-sm text-zinc-600 dark:text-zinc-400">
|
|
Set a default agent for all equipment at this site. Equipment can override this setting individually.
|
|
</p>
|
|
<% end %>
|
|
<% end %>
|
|
</div>
|
|
<% end %>
|
|
|
|
<div class="mt-6 border-t pt-6">
|
|
<h3 class="text-base font-medium mb-4">SNMP Configuration (Optional)</h3>
|
|
<p class="text-sm text-zinc-600 dark:text-zinc-400 mb-4">
|
|
Override organization SNMP defaults for all equipment at this site. Leave blank to inherit from organization.
|
|
</p>
|
|
|
|
<.input
|
|
field={@form[:snmp_version]}
|
|
type="select"
|
|
label="SNMP Version"
|
|
prompt="Inherit from organization"
|
|
options={[{"SNMP v1", "1"}, {"SNMP v2c", "2c"}, {"SNMP v3", "3"}]}
|
|
/>
|
|
|
|
<.input
|
|
field={@form[:snmp_community]}
|
|
type="text"
|
|
label="SNMP Community String"
|
|
placeholder="Leave blank to inherit from organization"
|
|
/>
|
|
|
|
<%= if @live_action == :edit and @site.snmp_community do %>
|
|
<div class="mt-4 p-3 bg-amber-50 dark:bg-amber-900/20 border border-amber-200 dark:border-amber-800 rounded-lg">
|
|
<p class="text-sm font-medium text-amber-900 dark:text-amber-200 mb-2">
|
|
Force Apply to Site Equipment
|
|
</p>
|
|
<p class="text-sm text-amber-700 dark:text-amber-300 mb-3">
|
|
This will override SNMP settings for ALL equipment at this site.
|
|
</p>
|
|
<.button
|
|
type="button"
|
|
phx-click="apply_snmp_to_all"
|
|
data-confirm="This will replace SNMP settings for ALL equipment at this site. Are you sure?"
|
|
variant="danger"
|
|
>
|
|
<.icon name="hero-arrow-path" class="h-4 w-4" /> Apply SNMP Config to All Equipment
|
|
</.button>
|
|
</div>
|
|
<% end %>
|
|
</div>
|
|
|
|
<div class="flex gap-3 mt-6">
|
|
<.button phx-disable-with="Saving..." variant="primary">Save Site</.button>
|
|
<.button navigate={~p"/orgs/#{@organization.slug}/sites"}>Cancel</.button>
|
|
</div>
|
|
</.form>
|
|
|
|
<%= if @live_action == :edit do %>
|
|
<div class="mt-12 pt-8 border-t border-zinc-200 dark:border-zinc-800">
|
|
<h3 class="text-lg font-semibold text-red-600 dark:text-red-500 mb-4">Danger Zone</h3>
|
|
<p class="text-sm text-zinc-600 dark:text-zinc-400 mb-4">
|
|
Once you delete a site, there is no going back. This will also delete all equipment at this site.
|
|
</p>
|
|
<.button
|
|
phx-click="delete"
|
|
data-confirm="Are you sure you want to delete this site? This will also delete all equipment at this site."
|
|
variant="danger"
|
|
>
|
|
<.icon name="hero-trash" class="h-4 w-4" /> Delete Site
|
|
</.button>
|
|
</div>
|
|
<% end %>
|
|
</div>
|
|
</Layouts.authenticated>
|