Files
vibedns/web/templates/pages/network_form.html
T
2026-08-16 21:18:45 -05:00

120 lines
5.3 KiB
HTML

{{define "content"}}
{{$n := .Data.Network}}{{$new := .Data.IsNew}}{{$sel := .Data.Selected}}
<nav aria-label="breadcrumb">
<ol class="breadcrumb small">
<li class="breadcrumb-item"><a href="/policies/networks">Client Networks</a></li>
<li class="breadcrumb-item active" aria-current="page">
{{if $new}}New network{{else}}{{$n.Name}}{{end}}
</li>
</ol>
</nav>
<h1 class="page-title mb-1">{{if $new}}Add a client network{{else}}{{$n.Name}}{{end}}</h1>
{{if not $new}}<p class="text-body-secondary mono mb-4">{{$n.CIDR}}</p>{{else}}<div class="mb-4"></div>{{end}}
<form method="post" action="{{.Data.FormAction}}">
<input type="hidden" name="_csrf" value="{{.CSRF}}">
<div class="row g-3">
<div class="col-12 col-lg-5">
<div class="card mb-3">
<div class="card-header">Network</div>
<div class="card-body">
<div class="mb-3">
<label class="form-label" for="netName">Name</label>
<input type="text" class="form-control" id="netName" name="name" value="{{$n.Name}}"
placeholder="Guest Wi-Fi" required>
</div>
<div class="mb-3">
<label class="form-label" for="netCIDR">Subnet</label>
<input type="text" class="form-control mono" id="netCIDR" name="cidr" value="{{$n.CIDR}}"
placeholder="100.64.30.0/24" required autocomplete="off">
<div class="form-text">
IPv4 or IPv6 in CIDR notation. A bare address is treated as a single host.
</div>
</div>
<div class="mb-3">
<label class="form-label" for="netDescription">Description</label>
<textarea class="form-control" id="netDescription" name="description" rows="2"
placeholder="What this network is for">{{$n.Description}}</textarea>
</div>
<div class="form-check form-switch">
<input type="hidden" name="enabled" value="false">
<input class="form-check-input" type="checkbox" role="switch" id="netEnabled"
name="enabled" value="true" {{if or $new $n.Enabled}}checked{{end}}>
<label class="form-check-label" for="netEnabled">Enabled</label>
</div>
</div>
</div>
<div class="card">
<div class="card-body d-grid gap-2">
<button type="submit" class="btn btn-primary">
<i class="bi bi-check-lg me-1"></i>{{if $new}}Create network{{else}}Save changes{{end}}
</button>
<a href="/policies/networks" class="btn btn-outline-secondary">Cancel</a>
</div>
</div>
</div>
<div class="col-12 col-lg-7">
<div class="card h-100">
<div class="card-header">DNS Policies</div>
<div class="card-body">
<p class="text-body-secondary small">
Tick every policy that should apply to clients in this subnet. Policies are
evaluated together: an allowlist in any of them overrides a blacklist match in
any other.
</p>
{{if .Data.Policies}}
<div class="list-group">
{{range .Data.Policies}}
<label class="list-group-item d-flex gap-3 align-items-start">
<input class="form-check-input flex-shrink-0 mt-1" type="checkbox"
name="policy_id" value="{{.ID}}" {{if index $sel .ID}}checked{{end}}>
<span class="flex-grow-1">
<span class="d-flex justify-content-between align-items-start gap-2">
<span class="fw-semibold">{{.Name}}</span>
<span>
<span class="badge text-bg-light text-dark">{{.BlockAction.Label}}</span>
{{if not .Enabled}}<span class="badge text-bg-secondary">disabled</span>{{end}}
</span>
</span>
{{if .Description}}
<span class="d-block small text-body-secondary">{{.Description}}</span>
{{end}}
<span class="d-block small mt-1">
{{if .BlacklistName}}
<span class="text-body-secondary">Blocks:</span>
{{range $i, $b := .BlacklistName}}{{if $i}}, {{end}}{{$b}}{{end}}
{{end}}
{{if .AllowlistName}}
<span class="text-body-secondary ms-2">Allows:</span>
{{range $i, $a := .AllowlistName}}{{if $i}}, {{end}}{{$a}}{{end}}
{{end}}
{{if and (not .BlacklistName) (not .AllowlistName)}}
<span class="text-body-secondary fst-italic">No lists attached to this policy yet.</span>
{{end}}
</span>
</span>
</label>
{{end}}
</div>
{{else}}
{{template "empty" dict "Icon" "bi-sliders" "Title" "No policies exist yet"
"Message" "A policy pairs a set of blacklists and allowlists with a block action. Create one, then come back and assign it here."}}
<div class="text-center">
<a href="/policies/rules/new" class="btn btn-outline-primary btn-sm">
<i class="bi bi-plus-lg me-1"></i>Create a policy
</a>
</div>
{{end}}
</div>
</div>
</div>
</div>
</form>
{{end}}