{{define "content"}}
{{with .Data}}
{{$e := .Errors}}
<form method="post" action="/dhcp">
  <input type="hidden" name="csrf" value="{{$.CSRF}}">
  <fieldset>
    <legend>Reservations</legend>
    {{if not .LANs}}<p class="field-error">No LAN serves DHCP; enable it on the Network page first.</p>{{end}}
    <input type="hidden" name="rows" value="{{len .Rows}}">
    <table>
      <tr><th>LAN</th><th>Name</th><th>MAC</th><th>Address</th><th>Remove</th></tr>
      {{range $i, $r := .Rows}}
      <tr>
        <td><select name="res.{{$i}}.lan">
          {{range $.Data.LANs}}<option value="{{.}}" {{if eq . $r.LAN}}selected{{end}}>{{.}}</option>{{end}}
        </select></td>
        <td><input name="res.{{$i}}.name" value="{{$r.Name}}" size="14" placeholder="new"></td>
        <td><input name="res.{{$i}}.mac" value="{{$r.MAC}}" size="17" spellcheck="false" placeholder="aa:bb:cc:dd:ee:ff"></td>
        <td><input name="res.{{$i}}.address" value="{{$r.Address}}" size="13"></td>
        <td>{{if $r.Name}}<input type="checkbox" name="res.{{$i}}.remove">{{end}}</td>
      </tr>
      {{range $f := list "lan" "name" "mac" "address"}}{{with index $e (printf "res[%d].%s" $i $f)}}<tr><td colspan="5" class="field-error">{{$f}}: {{.}}</td></tr>{{end}}{{end}}
      {{end}}
    </table>
    <p class="hint">Fill in the last row to add one. The name is also sent to the client and published in DNS.
       The address should be outside the pool.</p>
  </fieldset>
  <button>Save</button>
</form>

<section>
  <h2>Clients without a reservation</h2>
  {{if .Clients}}
  <div class="scroll">
  <table class="leases">
    <tr><th>Name</th><th>Address</th><th>MAC</th><th>LAN</th><th></th></tr>
    {{range .Clients}}<tr><td>{{or .Hostname "–"}}</td><td>{{.Address}}</td><td><code>{{.MAC}}</code></td><td>{{.LAN}}</td>
      <td><a href="/dhcp?lan={{.LAN | urlquery}}&amp;name={{.Hostname | urlquery}}&amp;mac={{.MAC | urlquery}}&amp;address={{.Address | urlquery}}">Reserve</a></td></tr>{{end}}
  </table>
  </div>
  {{else}}<p class="muted">No active leases.</p>{{end}}
</section>
{{end}}
{{end}}