cloud-ip-validator/internal/dashboard/templates/targets.html

{{define "targets_page"}}
<!doctype html>
<html lang="ru">
<head>{{template "html_head" .}}</head>
<body>
{{template "page_header" .}}
<main class="container-fluid py-3">
<div id="error-banner">{{template "banner_inner" .Banner}}</div>
{{template "targets_content" .}}
</main>
</body>
</html>
{{end}}

{{define "targets_content"}}
<h1>Цели проверки</h1>
<p class="muted">Группа целей — именованный список URL/адресов, на который затем ссылаются типы проверок.</p>

<form class="card card-body mb-3 py-2" hx-post="/targets" hx-target="#targets-table-wrap" hx-swap="innerHTML" hx-on::after-request="this.reset()">
<div class="row g-2 align-items-end">
<div class="col-12 col-md-3">
<label class="form-label mb-1">Имя новой группы</label>
<input type="text" name="name" class="form-control form-control-sm" placeholder="web" required>
</div>
<div class="col-12 col-md-7">
<label class="form-label mb-1">Цели (по одной на строку или через запятую)</label>
<textarea name="targets" class="form-control form-control-sm" rows="2" placeholder="https://hub.docker.com&#10;https://github.com" required></textarea>
</div>
<div class="col-12 col-md-2">
<button type="submit" class="btn btn-sm btn-primary w-100">Создать</button>
</div>
</div>
</form>

<div id="targets-table-wrap">
{{template "targets_table" .}}
</div>
{{end}}

{{define "targets_table"}}
<div class="table-responsive">
<table class="table table-sm table-striped align-middle">
<thead><tr><th>Группа</th><th>Цели</th><th>Действия</th></tr></thead>
<tbody>
{{range .Items}}
<tr>
<td class="text-nowrap">{{.Name}}</td>
<td>
<form class="inline-form" hx-put="/targets/{{.Name}}" hx-target="#targets-table-wrap" hx-swap="innerHTML">
<textarea name="targets" class="form-control form-control-sm" rows="2">{{join .Targets "\n"}}</textarea>
<button type="submit" class="btn btn-sm btn-outline-secondary text-nowrap">Сохранить</button>
</form>
</td>
<td class="actions-cell">
<button class="btn btn-sm btn-outline-danger" hx-delete="/targets/{{.Name}}" hx-target="#targets-table-wrap" hx-swap="innerHTML" hx-confirm="Удалить группу {{.Name}}?">Удалить</button>
</td>
</tr>
{{end}}
</tbody>
</table>
</div>
{{if not .Items}}<p class="muted">Групп целей нет.</p>{{end}}
{{end}}