Files

97 lines
5.3 KiB
HTML

{{ define "content" }}
<div class="max-w-7xl">
<div class="flex justify-between items-center mb-6">
<h1 class="text-3xl font-bold">Filters</h1>
<button onclick="showNewFilterForm()" class="bg-green-600 hover:bg-green-700 text-white font-bold px-6 py-2 rounded transition">+ New Filter</button>
</div>
<!-- New Filter Form (Hidden by default) -->
<div id="newFilterForm" class="hidden bg-gray-800 p-6 rounded border border-gray-700 mb-6">
<h2 class="text-2xl font-bold mb-4">Create New Filter</h2>
<form method="POST" action="/filters/create" class="space-y-4">
<input type="hidden" name="csrf_token" value="{{ .CSRFToken }}">
<div>
<label class="block text-white font-semibold mb-2">Filter Name</label>
<input type="text" name="name" placeholder="e.g., Ads Blocklist" class="w-full p-3 bg-gray-700 rounded text-white placeholder-gray-400 border border-gray-600" required>
</div>
<div>
<label class="block text-white font-semibold mb-2">Description</label>
<input type="text" name="description" placeholder="e.g., Blocks advertising domains" class="w-full p-3 bg-gray-700 rounded text-white placeholder-gray-400 border border-gray-600">
</div>
<div class="grid grid-cols-2 gap-4">
<div>
<label class="block text-white font-semibold mb-2">Blocklist Filename</label>
<input type="text" name="blocklist_file" placeholder="e.g., domainlist_<X>.list" class="w-full p-3 bg-gray-700 rounded text-white placeholder-gray-400 border border-gray-600" required>
</div>
<div>
<label class="block text-white font-semibold mb-2">Whitelist Filename</label>
<input type="text" name="whitelist_file" placeholder="e.g., domainlist_<X+1>.list" class="w-full p-3 bg-gray-700 rounded text-white placeholder-gray-400 border border-gray-600" required>
</div>
</div>
<div class="flex gap-2">
<button type="submit" class="bg-green-600 hover:bg-green-700 text-white font-bold px-6 py-3 rounded transition">Create Filter</button>
<button type="button" onclick="hideNewFilterForm()" class="bg-gray-700 hover:bg-gray-600 text-white font-bold px-6 py-3 rounded transition">Cancel</button>
</div>
</form>
</div>
<!-- Filters Table -->
{{ if .PageData }}
{{ $filters := index .PageData "Filters" }}
{{ if $filters }}
<div class="overflow-x-auto">
<table class="w-full bg-gray-800 rounded border border-gray-700">
<thead class="bg-gray-900">
<tr>
<th class="px-6 py-3 text-left font-semibold text-white">Name</th>
<th class="px-6 py-3 text-left font-semibold text-white">Description</th>
<th class="px-6 py-3 text-center font-semibold text-white">Blocklist File</th>
<th class="px-6 py-3 text-center font-semibold text-white">Whitelist File</th>
<th class="px-6 py-3 text-center font-semibold text-white">Actions</th>
</tr>
</thead>
<tbody>
{{ range $filters }}
<tr class="border-t border-gray-700 hover:bg-gray-750 transition">
<td class="px-6 py-4 text-white font-semibold">{{ .Name }}</td>
<td class="px-6 py-4 text-gray-300">{{ .Description }}</td>
<td class="px-6 py-4 text-gray-400 text-sm text-center">{{ .BlocklistFile }}</td>
<td class="px-6 py-4 text-gray-400 text-sm text-center">{{ .WhitelistFile }}</td>
<td class="px-6 py-4 text-center">
<div class="flex gap-2 justify-center">
<a href="/filter?filter={{ .Name }}" class="bg-blue-600 hover:bg-blue-700 text-white font-bold px-3 py-1 rounded text-sm transition" title="View/Search">View</a>
<a href="/filters/edit?filter={{ .Name }}" class="bg-yellow-600 hover:bg-yellow-700 text-white font-bold px-3 py-1 rounded text-sm transition" title="Edit filter">Edit</a>
<a href="/filter/whitelist/urls?filter={{ .Name }}" class="bg-purple-600 hover:bg-purple-700 text-white font-bold px-3 py-1 rounded text-sm transition" title="Edit whitelist">Whitelist</a>
<a href="/filter/blocklist/urls?filter={{ .Name }}" class="bg-red-600 hover:bg-red-700 text-white font-bold px-3 py-1 rounded text-sm transition" title="Edit blocklist">Blacklist</a>
</div>
</td>
</tr>
{{ end }}
</tbody>
</table>
</div>
{{ else }}
<p class="text-gray-300">No filters configured.</p>
{{ end }}
{{ else }}
<p class="text-gray-300">No filters configured.</p>
{{ end }}
</div>
<script>
function showNewFilterForm() {
document.getElementById('newFilterForm').classList.remove('hidden');
}
function hideNewFilterForm() {
document.getElementById('newFilterForm').classList.add('hidden');
// Reset form
document.querySelector('#newFilterForm form').reset();
}
</script>
{{ end }}