From 0c11ecfa4847822e983c177d9a65b115d26fced7 Mon Sep 17 00:00:00 2001
From: Denozordec <shatskiy.blog@gmail.com>
Date: Wed, 20 May 2026 12:23:16 +0700
Subject: [PATCH] feat(web): enhance module management UI with new localization
 and state handling

- Added new utility functions for module state representation in Russian, improving localization.
- Introduced derived states for counting enabled and disabled modules, enhancing user insights.
- Updated module management components to display last updated timestamps and improved descriptions.
- Refactored imports to utilize core UI components for better maintainability and consistency.
---
 .../modules/ModuleAsEntriesCard.svelte        |  342 +++
 .../modules/ModuleAsEntryDialog.svelte        |  126 +
 .../modules/ModuleCdnSourceDialog.svelte      |  259 ++
 .../modules/ModuleCdnSourcesCard.svelte       |  238 ++
 .../modules/ModuleCreateDialog.svelte         |  144 ++
 .../modules/ModuleDetailHeader.svelte         |   57 +
 .../modules/ModuleDomainEntriesCard.svelte    |  303 +++
 .../modules/ModuleDomainEntryDialog.svelte    |  109 +
 .../modules/ModuleEditDialog.svelte           |  283 +++
 .../modules/ModuleIpRangeEntryDialog.svelte   |  104 +
 .../modules/ModuleIpRangesCard.svelte         |  311 +++
 .../components/modules/ModuleKpiCards.svelte  |  155 ++
 .../modules/ModuleSummaryCard.svelte          |  115 +
 .../lib/components/modules/module-helpers.ts  |   60 +
 web/src/lib/ui-labels.ts                      |   26 +
 web/src/routes/modules/+page.svelte           |  305 +--
 .../routes/modules/[moduleId]/+page.svelte    | 2103 ++---------------
 17 files changed, 2945 insertions(+), 2095 deletions(-)
 create mode 100644 web/src/lib/components/modules/ModuleAsEntriesCard.svelte
 create mode 100644 web/src/lib/components/modules/ModuleAsEntryDialog.svelte
 create mode 100644 web/src/lib/components/modules/ModuleCdnSourceDialog.svelte
 create mode 100644 web/src/lib/components/modules/ModuleCdnSourcesCard.svelte
 create mode 100644 web/src/lib/components/modules/ModuleCreateDialog.svelte
 create mode 100644 web/src/lib/components/modules/ModuleDetailHeader.svelte
 create mode 100644 web/src/lib/components/modules/ModuleDomainEntriesCard.svelte
 create mode 100644 web/src/lib/components/modules/ModuleDomainEntryDialog.svelte
 create mode 100644 web/src/lib/components/modules/ModuleEditDialog.svelte
 create mode 100644 web/src/lib/components/modules/ModuleIpRangeEntryDialog.svelte
 create mode 100644 web/src/lib/components/modules/ModuleIpRangesCard.svelte
 create mode 100644 web/src/lib/components/modules/ModuleKpiCards.svelte
 create mode 100644 web/src/lib/components/modules/ModuleSummaryCard.svelte
 create mode 100644 web/src/lib/components/modules/module-helpers.ts

diff --git a/web/src/lib/components/modules/ModuleAsEntriesCard.svelte b/web/src/lib/components/modules/ModuleAsEntriesCard.svelte
new file mode 100644
index 0000000..b47a619
--- /dev/null
+++ b/web/src/lib/components/modules/ModuleAsEntriesCard.svelte
@@ -0,0 +1,342 @@
+<script lang="ts">
+	import { apiFetch, apiMutate } from '$lib/api/client.js';
+	import type { AsEntry, BgpCommunity, ModuleRow } from '$lib/api/types.js';
+	import { formatDateTime } from '$lib/modules/display.js';
+	import {
+		communityLabel,
+		sanitizeFilenamePart,
+		supportsCsvIO
+	} from '$lib/components/modules/module-helpers.js';
+
+	import { Button } from '$lib/ui/core/button/index.js';
+	import { Checkbox } from '$lib/ui/core/checkbox/index.js';
+	import {
+		Card,
+		CardContent,
+		CardHeader,
+		CardTitle,
+		CardDescription
+	} from '$lib/ui/core/card/index.js';
+	import AppDataTable from '$lib/ui/patterns/data-table/app-data-table.svelte';
+	import { confirm } from '$lib/ui/patterns/confirm/confirm-state.svelte.js';
+	import { notify, notifyApiError } from '$lib/ui/app/toast.js';
+	import ModuleAsEntryDialog from '$lib/components/modules/ModuleAsEntryDialog.svelte';
+	import Plus from '@lucide/svelte/icons/plus';
+	import Pencil from '@lucide/svelte/icons/pencil';
+	import Trash2 from '@lucide/svelte/icons/trash-2';
+	import Upload from '@lucide/svelte/icons/upload';
+	import Download from '@lucide/svelte/icons/download';
+
+	type Props = {
+		moduleId: string;
+		mod: ModuleRow;
+		entries: AsEntry[];
+		communities: BgpCommunity[];
+		loading?: boolean;
+		onChanged: () => void | Promise<void>;
+	};
+
+	let { moduleId, mod, entries, communities, loading = false, onChanged }: Props = $props();
+
+	let dialogOpen = $state(false);
+	let editTarget = $state<AsEntry | null>(null);
+	let selectedIds = $state(new Set<string>());
+	let deletingBulk = $state(false);
+	let csvImporting = $state(false);
+	let csvExporting = $state(false);
+	let csvFileInput = $state<HTMLInputElement | null>(null);
+
+	const selectedCount = $derived(selectedIds.size);
+	const allSelected = $derived(entries.length > 0 && selectedIds.size === entries.length);
+
+	const columns = [
+		{ id: 'select', label: '', class: 'w-10' },
+		{ id: 'asn', label: 'ASN', sortable: true, sortValue: (e: AsEntry) => e.asn },
+		{
+			id: 'name',
+			label: 'Название AS',
+			sortable: true,
+			sortValue: (e: AsEntry) => e.asn_name ?? ''
+		},
+		{
+			id: 'prefixes',
+			label: 'Префиксов',
+			sortable: true,
+			sortValue: (e: AsEntry) => e.prefix_count ?? 0,
+			class: 'text-right'
+		},
+		{
+			id: 'updated',
+			label: 'Обновлено',
+			sortable: true,
+			sortValue: (e: AsEntry) => e.asn_resolved_at ?? ''
+		},
+		{ id: 'community', label: 'Community' },
+		{ id: 'actions', label: '', class: 'w-20' }
+	] as const;
+
+	$effect(() => {
+		const validIds = new Set(entries.map((e) => e.id));
+		selectedIds = new Set([...selectedIds].filter((id) => validIds.has(id)));
+	});
+
+	function toggleSelection(id: string) {
+		const next = new Set(selectedIds);
+		if (next.has(id)) next.delete(id);
+		else next.add(id);
+		selectedIds = next;
+	}
+
+	function toggleAll(checked: boolean) {
+		selectedIds = checked ? new Set(entries.map((e) => e.id)) : new Set<string>();
+	}
+
+	function openCreate() {
+		editTarget = null;
+		dialogOpen = true;
+	}
+
+	function openEdit(entry: AsEntry) {
+		editTarget = entry;
+		dialogOpen = true;
+	}
+
+	function requestDelete(entry: AsEntry) {
+		void confirm({
+			title: 'Удалить запись?',
+			description: `ASN: ${entry.asn}`,
+			confirmLabel: 'Удалить',
+			destructive: true,
+			onConfirm: async () => {
+				await apiMutate(`/v1/modules/${moduleId}/as-entries/${entry.id}`, 'DELETE', undefined, {
+					idempotent: false
+				});
+				notify.success('Удалено');
+				await onChanged();
+			}
+		});
+	}
+
+	function requestBulkDelete() {
+		if (selectedCount === 0) return;
+		void confirm({
+			title: 'Удалить выбранные AS-записи?',
+			description: `Будет удалено: ${selectedCount}`,
+			confirmLabel: 'Удалить',
+			destructive: true,
+			onConfirm: bulkDelete
+		});
+	}
+
+	async function bulkDelete() {
+		if (selectedCount === 0) return;
+		deletingBulk = true;
+		let deleted = 0;
+		try {
+			for (const id of selectedIds) {
+				try {
+					await apiMutate(`/v1/modules/${moduleId}/as-entries/${id}`, 'DELETE', undefined, {
+						idempotent: false
+					});
+					deleted += 1;
+				} catch (e) {
+					notifyApiError(e);
+				}
+			}
+			if (deleted > 0) notify.success(`Удалено AS-записей: ${deleted}`);
+			await onChanged();
+		} finally {
+			deletingBulk = false;
+		}
+	}
+
+	async function readErrorText(res: Response): Promise<string> {
+		const body = (await res.text()).trim();
+		return body || `HTTP ${res.status}`;
+	}
+
+	async function exportCsv() {
+		if (!supportsCsvIO(mod.type) || csvExporting) return;
+		csvExporting = true;
+		try {
+			const res = await apiFetch(`/v1/modules/${moduleId}/entries.csv`, {
+				method: 'GET',
+				headers: { Accept: 'text/csv' }
+			});
+			if (!res.ok) {
+				notify.error(await readErrorText(res));
+				return;
+			}
+			const blob = await res.blob();
+			const url = URL.createObjectURL(blob);
+			const a = document.createElement('a');
+			a.href = url;
+			a.download = `${sanitizeFilenamePart(mod.name)}-${mod.type.toLowerCase()}-entries.csv`;
+			document.body.appendChild(a);
+			a.click();
+			a.remove();
+			URL.revokeObjectURL(url);
+		} catch (e) {
+			notifyApiError(e);
+		} finally {
+			csvExporting = false;
+		}
+	}
+
+	function openImportPicker() {
+		if (!supportsCsvIO(mod.type) || csvImporting) return;
+		csvFileInput?.click();
+	}
+
+	async function handleImportChange(event: Event) {
+		const input = event.currentTarget as HTMLInputElement | null;
+		const file = input?.files?.[0];
+		if (!file || csvImporting) return;
+		csvImporting = true;
+		try {
+			const fileText = await file.text();
+			const res = await apiFetch(`/v1/modules/${moduleId}/entries.csv`, {
+				method: 'POST',
+				headers: { 'Content-Type': 'text/csv' },
+				body: fileText
+			});
+			if (!res.ok) {
+				notify.error(await readErrorText(res));
+				return;
+			}
+			const payload = (await res.json()) as { imported?: number };
+			notify.success(`Импортировано записей: ${payload.imported ?? 0}`);
+			await onChanged();
+		} catch (e) {
+			notifyApiError(e);
+		} finally {
+			csvImporting = false;
+			if (input) input.value = '';
+		}
+	}
+</script>
+
+<input
+	class="hidden"
+	type="file"
+	accept=".csv,text/csv"
+	bind:this={csvFileInput}
+	onchange={handleImportChange}
+/>
+
+<Card>
+	<CardHeader class="flex flex-col gap-3 pb-2 sm:flex-row sm:items-center sm:justify-between">
+		<div class="min-w-0 flex-1">
+			<CardTitle class="text-base">AS-записи</CardTitle>
+			<CardDescription>
+				Номер AS и community; имя, число префиксов и дата обновляются при успешном refresh
+				(RIPEstat).
+			</CardDescription>
+		</div>
+		<div class="flex shrink-0 flex-wrap items-center justify-end gap-2 self-start sm:self-auto">
+			<Button
+				variant="outline"
+				size="sm"
+				onclick={openImportPicker}
+				disabled={!supportsCsvIO(mod.type) || csvImporting || csvExporting}
+			>
+				<Upload />
+				{csvImporting ? 'Импорт…' : 'Импорт CSV'}
+			</Button>
+			<Button
+				variant="outline"
+				size="sm"
+				onclick={exportCsv}
+				disabled={!supportsCsvIO(mod.type) || csvExporting || csvImporting}
+			>
+				<Download />
+				{csvExporting ? 'Экспорт…' : 'Экспорт CSV'}
+			</Button>
+			<Button size="sm" onclick={openCreate}><Plus />Добавить</Button>
+			{#if selectedCount > 0}
+				<Button variant="destructive" size="sm" onclick={requestBulkDelete} disabled={deletingBulk}>
+					<Trash2 />
+					Удалить ({selectedCount})
+				</Button>
+			{/if}
+		</div>
+	</CardHeader>
+	<CardContent class="p-4 pt-0">
+		<AppDataTable
+			columns={[...columns]}
+			rows={entries}
+			rowKey={(e) => e.id}
+			{loading}
+			emptyTitle="Нет AS-записей"
+			emptyDescription="Добавьте ASN или импортируйте CSV."
+		>
+			{#snippet toolbar()}
+				{#if entries.length > 0}
+					<div class="flex items-center gap-2">
+						<Checkbox
+							checked={allSelected}
+							onCheckedChange={(v) => toggleAll(v === true)}
+							aria-label="Выбрать все AS-записи"
+						/>
+						<span class="text-sm text-muted-foreground">Выбрать все</span>
+					</div>
+				{/if}
+			{/snippet}
+			{#snippet cell({ row: entry, column })}
+				{#if column.id === 'select'}
+					<Checkbox
+						checked={selectedIds.has(entry.id)}
+						aria-label={`Выбрать AS ${entry.asn}`}
+						onCheckedChange={() => toggleSelection(entry.id)}
+					/>
+				{:else if column.id === 'asn'}
+					<span class="font-mono">{entry.asn}</span>
+				{:else if column.id === 'name'}
+					<span
+						class="max-w-[14rem] truncate text-sm text-muted-foreground"
+						title={entry.asn_name ?? ''}
+					>
+						{entry.asn_name?.trim() ? entry.asn_name : '—'}
+					</span>
+				{:else if column.id === 'prefixes'}
+					<span class="font-mono text-sm">
+						{entry.prefix_count != null ? entry.prefix_count : '—'}
+					</span>
+				{:else if column.id === 'updated'}
+					<span class="text-sm whitespace-nowrap text-muted-foreground">
+						{formatDateTime(entry.asn_resolved_at)}
+					</span>
+				{:else if column.id === 'community'}
+					<span class="text-sm text-muted-foreground">
+						{communityLabel(entry.community_id, communities)}
+					</span>
+				{:else if column.id === 'actions'}
+					<div class="flex gap-1">
+						<Button variant="ghost" size="icon-sm" onclick={() => openEdit(entry)}>
+							<Pencil class="size-3.5" />
+						</Button>
+						<Button
+							variant="ghost"
+							size="icon-sm"
+							class="text-destructive"
+							onclick={() => requestDelete(entry)}
+						>
+							<Trash2 class="size-3.5" />
+						</Button>
+					</div>
+				{/if}
+			{/snippet}
+		</AppDataTable>
+	</CardContent>
+</Card>
+
+<ModuleAsEntryDialog
+	bind:open={dialogOpen}
+	{moduleId}
+	edit={editTarget}
+	{communities}
+	onSaved={onChanged}
+	onClose={() => {
+		editTarget = null;
+	}}
+/>
diff --git a/web/src/lib/components/modules/ModuleAsEntryDialog.svelte b/web/src/lib/components/modules/ModuleAsEntryDialog.svelte
new file mode 100644
index 0000000..d8bc39b
--- /dev/null
+++ b/web/src/lib/components/modules/ModuleAsEntryDialog.svelte
@@ -0,0 +1,126 @@
+<script lang="ts">
+	import { apiMutate } from '$lib/api/client.js';
+	import type { AsEntry, AsEntryCreate, AsEntryPatch, BgpCommunity } from '$lib/api/types.js';
+	import {
+		communityLabel,
+		communityOptionLabel,
+		fromNullableSelect,
+		NONE_OPTION,
+		nullableSelectValue
+	} from '$lib/components/modules/module-helpers.js';
+	import { Button } from '$lib/ui/core/button/index.js';
+	import { Input } from '$lib/ui/core/input/index.js';
+	import { Label } from '$lib/ui/core/label/index.js';
+	import {
+		Dialog,
+		DialogContent,
+		DialogHeader,
+		DialogTitle,
+		DialogFooter,
+		DialogDescription
+	} from '$lib/ui/core/dialog/index.js';
+	import { Select, SelectContent, SelectItem, SelectTrigger } from '$lib/ui/core/select/index.js';
+	import { notify, notifyApiError } from '$lib/ui/app/toast.js';
+
+	type Props = {
+		open: boolean;
+		moduleId: string;
+		edit: AsEntry | null;
+		communities: BgpCommunity[];
+		onSaved: () => void | Promise<void>;
+		onClose: () => void;
+	};
+
+	let { open = $bindable(), moduleId, edit, communities, onSaved, onClose }: Props = $props();
+
+	let saving = $state(false);
+	let form = $state<AsEntryCreate>({ asn: 0, community_id: null });
+
+	$effect(() => {
+		if (open) {
+			form = edit
+				? { asn: edit.asn, community_id: edit.community_id }
+				: { asn: 0, community_id: null };
+		}
+	});
+
+	async function save() {
+		const asn = Number(form.asn);
+		if (!Number.isFinite(asn) || asn < 1 || asn > 4294967295) {
+			notify.error('Укажите корректный ASN (1–4294967295)');
+			return;
+		}
+		saving = true;
+		try {
+			const body: AsEntryCreate | AsEntryPatch = { asn, community_id: form.community_id };
+			if (edit) {
+				await apiMutate(`/v1/modules/${moduleId}/as-entries/${edit.id}`, 'PATCH', body);
+				notify.success('Запись обновлена');
+			} else {
+				await apiMutate(`/v1/modules/${moduleId}/as-entries`, 'POST', body as AsEntryCreate);
+				notify.success('Запись добавлена');
+			}
+			open = false;
+			await onSaved();
+		} catch (e) {
+			notifyApiError(e);
+		} finally {
+			saving = false;
+		}
+	}
+
+	function handleOpenChange(next: boolean) {
+		open = next;
+		if (!next) onClose();
+	}
+</script>
+
+<Dialog {open} onOpenChange={handleOpenChange}>
+	<DialogContent class="sm:max-w-sm">
+		<DialogHeader>
+			<DialogTitle>{edit ? 'Редактировать запись' : 'Новая AS-запись'}</DialogTitle>
+			<DialogDescription>
+				Номер автономной системы и community для политики анонса.
+			</DialogDescription>
+		</DialogHeader>
+		<div class="space-y-4 py-2">
+			<div class="space-y-1.5">
+				<Label for="as-asn">ASN</Label>
+				<Input
+					id="as-asn"
+					type="number"
+					placeholder="12345"
+					bind:value={form.asn}
+					min={1}
+					max={4294967295}
+				/>
+			</div>
+			<div class="space-y-1.5">
+				<Label for="as-comm">Community</Label>
+				<Select
+					type="single"
+					value={nullableSelectValue(form.community_id)}
+					onValueChange={(v) => {
+						form.community_id = fromNullableSelect(v);
+					}}
+				>
+					<SelectTrigger id="as-comm" class="w-full">
+						{form.community_id ? communityLabel(form.community_id, communities) : 'Не выбрано'}
+					</SelectTrigger>
+					<SelectContent>
+						<SelectItem value={NONE_OPTION}>Не выбрано</SelectItem>
+						{#each communities as c (c.id)}
+							<SelectItem value={c.id}>{communityOptionLabel(c)}</SelectItem>
+						{/each}
+					</SelectContent>
+				</Select>
+			</div>
+		</div>
+		<DialogFooter>
+			<Button variant="outline" onclick={() => handleOpenChange(false)}>Отмена</Button>
+			<Button onclick={save} disabled={saving}>
+				{saving ? 'Сохранение…' : edit ? 'Сохранить' : 'Добавить'}
+			</Button>
+		</DialogFooter>
+	</DialogContent>
+</Dialog>
diff --git a/web/src/lib/components/modules/ModuleCdnSourceDialog.svelte b/web/src/lib/components/modules/ModuleCdnSourceDialog.svelte
new file mode 100644
index 0000000..3f82d2e
--- /dev/null
+++ b/web/src/lib/components/modules/ModuleCdnSourceDialog.svelte
@@ -0,0 +1,259 @@
+<script lang="ts">
+	import { apiMutate } from '$lib/api/client.js';
+	import type {
+		BgpCommunity,
+		CdnPreviewResponse,
+		CdnSource,
+		CdnSourceCreate
+	} from '$lib/api/types.js';
+	import {
+		communityLabel,
+		communityOptionLabel,
+		fromNullableSelect,
+		normalizeCdnSourceKind,
+		NONE_OPTION,
+		nullableSelectValue
+	} from '$lib/components/modules/module-helpers.js';
+	import { Button } from '$lib/ui/core/button/index.js';
+	import { Input } from '$lib/ui/core/input/index.js';
+	import { Label } from '$lib/ui/core/label/index.js';
+	import {
+		Dialog,
+		DialogContent,
+		DialogHeader,
+		DialogTitle,
+		DialogFooter
+	} from '$lib/ui/core/dialog/index.js';
+	import { Select, SelectContent, SelectItem, SelectTrigger } from '$lib/ui/core/select/index.js';
+	import { notify, notifyApiError } from '$lib/ui/app/toast.js';
+
+	type Props = {
+		open: boolean;
+		moduleId: string;
+		edit: CdnSource | null;
+		communities: BgpCommunity[];
+		onSaved: () => void | Promise<void>;
+		onClose: () => void;
+	};
+
+	let { open = $bindable(), moduleId, edit, communities, onSaved, onClose }: Props = $props();
+
+	let saving = $state(false);
+	let previewLoading = $state(false);
+	let previewItems = $state<string[]>([]);
+	let previewTotal = $state(0);
+	let previewTruncated = $state(false);
+	let previewError = $state<string | null>(null);
+	let previewOk = $state(false);
+	let form = $state<CdnSourceCreate & { refresh_interval_sec?: number | null }>({
+		url: '',
+		source_kind: 'plaintext',
+		prefix_path: '',
+		community_id: null
+	});
+
+	function clearPreview() {
+		previewLoading = false;
+		previewItems = [];
+		previewTotal = 0;
+		previewTruncated = false;
+		previewError = null;
+		previewOk = false;
+	}
+
+	$effect(() => {
+		if (open) {
+			clearPreview();
+			form = edit
+				? {
+						url: edit.url,
+						source_kind: normalizeCdnSourceKind(edit.source_kind),
+						prefix_path: edit.prefix_path ?? '',
+						community_id: edit.community_id,
+						refresh_interval_sec: edit.refresh_interval_sec
+					}
+				: { url: '', source_kind: 'plaintext', prefix_path: '', community_id: null };
+		}
+	});
+
+	async function previewCdn() {
+		const urlTrim = form.url.trim();
+		if (!urlTrim) {
+			notify.error('Укажите URL');
+			return;
+		}
+		previewLoading = true;
+		previewError = null;
+		previewOk = false;
+		try {
+			const res = await apiMutate<CdnPreviewResponse>(
+				`/v1/modules/${moduleId}/cdn-sources/preview`,
+				'POST',
+				{
+					url: urlTrim,
+					source_kind: form.source_kind,
+					prefix_path: form.prefix_path?.trim() ?? ''
+				}
+			);
+			previewItems = res.items;
+			previewTotal = res.total;
+			previewTruncated = res.truncated;
+			previewOk = true;
+		} catch (e) {
+			previewError = e instanceof Error ? e.message : String(e);
+			previewItems = [];
+			previewTotal = 0;
+			previewTruncated = false;
+			previewOk = false;
+		} finally {
+			previewLoading = false;
+		}
+	}
+
+	async function save() {
+		const urlTrim = form.url.trim();
+		if (!urlTrim) {
+			notify.error('Укажите URL');
+			return;
+		}
+		saving = true;
+		try {
+			const body = {
+				...form,
+				url: urlTrim,
+				source_kind: form.source_kind,
+				prefix_path: form.prefix_path?.trim() ?? ''
+			};
+			if (edit) {
+				await apiMutate(`/v1/modules/${moduleId}/cdn-sources/${edit.id}`, 'PATCH', body);
+				notify.success('Источник обновлён');
+			} else {
+				await apiMutate(`/v1/modules/${moduleId}/cdn-sources`, 'POST', body);
+				notify.success('Источник добавлен');
+			}
+			clearPreview();
+			open = false;
+			await onSaved();
+		} catch (e) {
+			notifyApiError(e);
+		} finally {
+			saving = false;
+		}
+	}
+
+	function handleOpenChange(next: boolean) {
+		open = next;
+		if (!next) {
+			clearPreview();
+			onClose();
+		}
+	}
+</script>
+
+<Dialog {open} onOpenChange={handleOpenChange}>
+	<DialogContent class="sm:max-w-lg">
+		<DialogHeader>
+			<DialogTitle>{edit ? 'Редактировать источник' : 'Новый CDN-источник'}</DialogTitle>
+		</DialogHeader>
+		<div class="space-y-4 py-2">
+			<div class="space-y-1.5">
+				<Label for="cdn-url">URL</Label>
+				<Input id="cdn-url" placeholder="https://example.com/list.txt" bind:value={form.url} />
+			</div>
+			<div class="space-y-1.5">
+				<Label for="cdn-kind">Тип источника</Label>
+				<Select
+					type="single"
+					value={form.source_kind}
+					onValueChange={(v) => {
+						form.source_kind = v || 'plaintext';
+					}}
+				>
+					<SelectTrigger id="cdn-kind" class="w-full">
+						{form.source_kind === 'json' ? 'json' : 'plaintext'}
+					</SelectTrigger>
+					<SelectContent>
+						<SelectItem value="plaintext">plaintext</SelectItem>
+						<SelectItem value="json">json</SelectItem>
+					</SelectContent>
+				</Select>
+			</div>
+			<div class="space-y-1.5">
+				<Label for="cdn-prefix-path">JSON path (prefix_path)</Label>
+				<Input
+					id="cdn-prefix-path"
+					placeholder="напр. prefixes[] или data.items[].cidr"
+					bind:value={form.prefix_path}
+				/>
+				{#if form.source_kind === 'json' && !form.prefix_path?.trim()}
+					<p class="text-xs text-muted-foreground">
+						Для JSON укажите путь к полям с CIDR; пустой путь может не дать префиксов.
+					</p>
+				{/if}
+			</div>
+			<div class="space-y-1.5">
+				<Label for="cdn-comm">Community</Label>
+				<Select
+					type="single"
+					value={nullableSelectValue(form.community_id)}
+					onValueChange={(v) => {
+						form.community_id = fromNullableSelect(v);
+					}}
+				>
+					<SelectTrigger id="cdn-comm" class="w-full">
+						{form.community_id ? communityLabel(form.community_id, communities) : 'Не выбрано'}
+					</SelectTrigger>
+					<SelectContent>
+						<SelectItem value={NONE_OPTION}>Не выбрано</SelectItem>
+						{#each communities as c (c.id)}
+							<SelectItem value={c.id}>{communityOptionLabel(c)}</SelectItem>
+						{/each}
+					</SelectContent>
+				</Select>
+			</div>
+			<div class="space-y-1.5">
+				<Label for="cdn-interval">Интервал обновления (сек)</Label>
+				<Input
+					id="cdn-interval"
+					type="number"
+					placeholder="3600"
+					bind:value={form.refresh_interval_sec}
+				/>
+			</div>
+			<div class="flex flex-col gap-2 rounded-lg border border-border p-3">
+				<div class="flex flex-wrap items-center gap-2">
+					<Button
+						type="button"
+						variant="secondary"
+						size="sm"
+						onclick={previewCdn}
+						disabled={previewLoading}
+					>
+						{previewLoading ? 'Загрузка…' : 'Предпросмотр'}
+					</Button>
+					{#if previewError}
+						<span class="text-sm text-destructive">{previewError}</span>
+					{:else if previewOk}
+						<span class="text-sm text-muted-foreground">
+							Всего: {previewTotal}{#if previewTruncated}
+								<span class="text-amber-600 dark:text-amber-500"> (обрезано)</span>{/if}
+						</span>
+					{/if}
+				</div>
+				{#if previewItems.length}
+					<ul class="max-h-48 overflow-y-auto rounded-md border bg-muted/40 p-2 font-mono text-xs">
+						{#each previewItems as item, i (`${i}-${item}`)}
+							<li class="py-0.5">{item}</li>
+						{/each}
+					</ul>
+				{/if}
+			</div>
+		</div>
+		<DialogFooter>
+			<Button variant="outline" onclick={() => handleOpenChange(false)}>Отмена</Button>
+			<Button onclick={save} disabled={saving}>
+				{saving ? 'Сохранение…' : edit ? 'Сохранить' : 'Добавить'}
+			</Button>
+		</DialogFooter>
+	</DialogContent>
+</Dialog>
diff --git a/web/src/lib/components/modules/ModuleCdnSourcesCard.svelte b/web/src/lib/components/modules/ModuleCdnSourcesCard.svelte
new file mode 100644
index 0000000..0ec8e02
--- /dev/null
+++ b/web/src/lib/components/modules/ModuleCdnSourcesCard.svelte
@@ -0,0 +1,238 @@
+<script lang="ts">
+	import { apiMutate } from '$lib/api/client.js';
+	import type { BgpCommunity, CdnSource } from '$lib/api/types.js';
+	import { formatDateTime } from '$lib/modules/display.js';
+	import {
+		communityLabel,
+		normalizeCdnSourceKind
+	} from '$lib/components/modules/module-helpers.js';
+	import { Badge } from '$lib/ui/core/badge/index.js';
+	import { Button } from '$lib/ui/core/button/index.js';
+	import { Checkbox } from '$lib/ui/core/checkbox/index.js';
+	import {
+		Card,
+		CardContent,
+		CardHeader,
+		CardTitle,
+		CardDescription
+	} from '$lib/ui/core/card/index.js';
+	import AppDataTable from '$lib/ui/patterns/data-table/app-data-table.svelte';
+	import { confirm } from '$lib/ui/patterns/confirm/confirm-state.svelte.js';
+	import { notify, notifyApiError } from '$lib/ui/app/toast.js';
+	import ModuleCdnSourceDialog from '$lib/components/modules/ModuleCdnSourceDialog.svelte';
+	import Plus from '@lucide/svelte/icons/plus';
+	import Pencil from '@lucide/svelte/icons/pencil';
+	import Trash2 from '@lucide/svelte/icons/trash-2';
+
+	type Props = {
+		moduleId: string;
+		sources: CdnSource[];
+		communities: BgpCommunity[];
+		loading?: boolean;
+		onChanged: () => void | Promise<void>;
+	};
+
+	let { moduleId, sources, communities, loading = false, onChanged }: Props = $props();
+
+	let dialogOpen = $state(false);
+	let editTarget = $state<CdnSource | null>(null);
+	let selectedIds = $state(new Set<string>());
+	let deletingBulk = $state(false);
+
+	const selectedCount = $derived(selectedIds.size);
+	const allSelected = $derived(sources.length > 0 && selectedIds.size === sources.length);
+
+	const columns = [
+		{ id: 'select', label: '', class: 'w-10' },
+		{ id: 'url', label: 'URL', sortable: true, sortValue: (s: CdnSource) => s.url },
+		{ id: 'kind', label: 'Тип', sortable: true, sortValue: (s: CdnSource) => s.source_kind },
+		{ id: 'community', label: 'Community' },
+		{
+			id: 'interval',
+			label: 'Интервал',
+			sortable: true,
+			sortValue: (s: CdnSource) => s.refresh_interval_sec ?? 0
+		},
+		{
+			id: 'refreshed',
+			label: 'Последнее обновление',
+			sortable: true,
+			sortValue: (s: CdnSource) => s.last_refreshed_at ?? ''
+		},
+		{ id: 'actions', label: '', class: 'w-20' }
+	] as const;
+
+	$effect(() => {
+		const validIds = new Set(sources.map((s) => s.id));
+		selectedIds = new Set([...selectedIds].filter((id) => validIds.has(id)));
+	});
+
+	function toggleSelection(id: string) {
+		const next = new Set(selectedIds);
+		if (next.has(id)) next.delete(id);
+		else next.add(id);
+		selectedIds = next;
+	}
+
+	function toggleAll(checked: boolean) {
+		selectedIds = checked ? new Set(sources.map((s) => s.id)) : new Set<string>();
+	}
+
+	function openCreate() {
+		editTarget = null;
+		dialogOpen = true;
+	}
+
+	function openEdit(src: CdnSource) {
+		editTarget = src;
+		dialogOpen = true;
+	}
+
+	function requestDelete(src: CdnSource) {
+		void confirm({
+			title: 'Удалить CDN-источник?',
+			description: src.url,
+			confirmLabel: 'Удалить',
+			destructive: true,
+			onConfirm: async () => {
+				await apiMutate(`/v1/modules/${moduleId}/cdn-sources/${src.id}`, 'DELETE', undefined, {
+					idempotent: false
+				});
+				notify.success('Удалено');
+				await onChanged();
+			}
+		});
+	}
+
+	function requestBulkDelete() {
+		if (selectedCount === 0) return;
+		void confirm({
+			title: 'Удалить выбранные CDN-источники?',
+			description: `Будет удалено: ${selectedCount}`,
+			confirmLabel: 'Удалить',
+			destructive: true,
+			onConfirm: bulkDelete
+		});
+	}
+
+	async function bulkDelete() {
+		if (selectedCount === 0) return;
+		deletingBulk = true;
+		let deleted = 0;
+		try {
+			for (const id of selectedIds) {
+				try {
+					await apiMutate(`/v1/modules/${moduleId}/cdn-sources/${id}`, 'DELETE', undefined, {
+						idempotent: false
+					});
+					deleted += 1;
+				} catch (e) {
+					notifyApiError(e);
+				}
+			}
+			if (deleted > 0) notify.success(`Удалено CDN-источников: ${deleted}`);
+			await onChanged();
+		} finally {
+			deletingBulk = false;
+		}
+	}
+</script>
+
+<Card>
+	<CardHeader class="flex flex-col gap-3 pb-2 sm:flex-row sm:items-center sm:justify-between">
+		<div class="min-w-0 flex-1">
+			<CardTitle class="text-base">CDN-источники</CardTitle>
+			<CardDescription>URL источников для скачивания списков CIDR.</CardDescription>
+		</div>
+		<div class="flex shrink-0 flex-wrap items-center justify-end gap-2 self-start sm:self-auto">
+			<Button size="sm" onclick={openCreate}><Plus />Добавить</Button>
+			{#if selectedCount > 0}
+				<Button variant="destructive" size="sm" onclick={requestBulkDelete} disabled={deletingBulk}>
+					<Trash2 />
+					Удалить ({selectedCount})
+				</Button>
+			{/if}
+		</div>
+	</CardHeader>
+	<CardContent class="p-4 pt-0">
+		<AppDataTable
+			columns={[...columns]}
+			rows={sources}
+			rowKey={(s) => s.id}
+			{loading}
+			emptyTitle="Нет CDN-источников"
+			emptyDescription="Добавьте URL для загрузки списков CIDR."
+		>
+			{#snippet toolbar()}
+				{#if sources.length > 0}
+					<div class="flex items-center gap-2">
+						<Checkbox
+							checked={allSelected}
+							onCheckedChange={(v) => toggleAll(v === true)}
+							aria-label="Выбрать все CDN-источники"
+						/>
+						<span class="text-sm text-muted-foreground">Выбрать все</span>
+					</div>
+				{/if}
+			{/snippet}
+			{#snippet cell({ row: src, column })}
+				{#if column.id === 'select'}
+					<Checkbox
+						checked={selectedIds.has(src.id)}
+						aria-label="Выбрать CDN-источник"
+						onCheckedChange={() => toggleSelection(src.id)}
+					/>
+				{:else if column.id === 'url'}
+					<span class="max-w-xs truncate font-mono text-xs" title={src.url}>{src.url}</span>
+				{:else if column.id === 'kind'}
+					<div class="flex flex-col gap-0.5">
+						<Badge variant="outline">{normalizeCdnSourceKind(src.source_kind)}</Badge>
+						{#if src.prefix_path?.trim()}
+							<span
+								class="font-mono text-xs break-all text-muted-foreground"
+								title={src.prefix_path}>{src.prefix_path}</span
+							>
+						{/if}
+					</div>
+				{:else if column.id === 'community'}
+					<span class="text-sm text-muted-foreground">
+						{communityLabel(src.community_id, communities)}
+					</span>
+				{:else if column.id === 'interval'}
+					<span class="text-sm text-muted-foreground">
+						{src.refresh_interval_sec != null ? `${src.refresh_interval_sec}с` : '—'}
+					</span>
+				{:else if column.id === 'refreshed'}
+					<span class="text-sm whitespace-nowrap text-muted-foreground">
+						{formatDateTime(src.last_refreshed_at)}
+					</span>
+				{:else if column.id === 'actions'}
+					<div class="flex gap-1">
+						<Button variant="ghost" size="icon-sm" onclick={() => openEdit(src)}>
+							<Pencil class="size-3.5" />
+						</Button>
+						<Button
+							variant="ghost"
+							size="icon-sm"
+							class="text-destructive"
+							onclick={() => requestDelete(src)}
+						>
+							<Trash2 class="size-3.5" />
+						</Button>
+					</div>
+				{/if}
+			{/snippet}
+		</AppDataTable>
+	</CardContent>
+</Card>
+
+<ModuleCdnSourceDialog
+	bind:open={dialogOpen}
+	{moduleId}
+	edit={editTarget}
+	{communities}
+	onSaved={onChanged}
+	onClose={() => {
+		editTarget = null;
+	}}
+/>
diff --git a/web/src/lib/components/modules/ModuleCreateDialog.svelte b/web/src/lib/components/modules/ModuleCreateDialog.svelte
new file mode 100644
index 0000000..0cde457
--- /dev/null
+++ b/web/src/lib/components/modules/ModuleCreateDialog.svelte
@@ -0,0 +1,144 @@
+<script lang="ts">
+	import { apiMutate } from '$lib/api/client.js';
+	import type { ModuleCreate } from '$lib/api/types.js';
+	import { moduleTypeRu } from '$lib/ui-labels.js';
+	import { Button } from '$lib/ui/core/button/index.js';
+	import { Input } from '$lib/ui/core/input/index.js';
+	import { Label } from '$lib/ui/core/label/index.js';
+	import {
+		Dialog,
+		DialogContent,
+		DialogHeader,
+		DialogTitle,
+		DialogFooter,
+		DialogDescription
+	} from '$lib/ui/core/dialog/index.js';
+	import { Select, SelectContent, SelectItem, SelectTrigger } from '$lib/ui/core/select/index.js';
+	import { Switch } from '$lib/ui/core/switch/index.js';
+	import { notify, notifyApiError } from '$lib/ui/app/toast.js';
+
+	type Props = {
+		open: boolean;
+		onClose: () => void;
+		onCreated: () => void | Promise<void>;
+	};
+
+	let { open = $bindable(), onClose, onCreated }: Props = $props();
+
+	let saving = $state(false);
+	let form = $state<ModuleCreate>({
+		type: 'AS_PREFIXES',
+		name: '',
+		enabled: true,
+		priority: 0
+	});
+
+	const moduleTypes = [
+		{ value: 'AS_PREFIXES', label: moduleTypeRu('AS_PREFIXES') },
+		{ value: 'CDN_CIDRS', label: moduleTypeRu('CDN_CIDRS') },
+		{ value: 'DOMAINS', label: moduleTypeRu('DOMAINS') },
+		{ value: 'IP_RANGES', label: moduleTypeRu('IP_RANGES') }
+	] as const;
+
+	function resetForm() {
+		form = { type: 'AS_PREFIXES', name: '', enabled: true, priority: 0 };
+	}
+
+	async function create() {
+		if (!form.name.trim()) {
+			notify.error('Укажите название модуля');
+			return;
+		}
+		saving = true;
+		try {
+			await apiMutate('/v1/modules', 'POST', form);
+			notify.success('Модуль создан');
+			open = false;
+			resetForm();
+			await onCreated();
+		} catch (e) {
+			notifyApiError(e);
+		} finally {
+			saving = false;
+		}
+	}
+
+	function handleOpenChange(next: boolean) {
+		open = next;
+		if (!next) {
+			onClose();
+			resetForm();
+		}
+	}
+</script>
+
+<Dialog {open} onOpenChange={handleOpenChange}>
+	<DialogContent class="sm:max-w-md">
+		<DialogHeader>
+			<DialogTitle>Новый модуль</DialogTitle>
+			<DialogDescription>Создание нового модуля префиксов.</DialogDescription>
+		</DialogHeader>
+		<div class="space-y-4 py-2">
+			<div class="space-y-1.5">
+				<Label for="m-name">Название</Label>
+				<Input id="m-name" bind:value={form.name} placeholder="my-asn-module" />
+			</div>
+			<div class="space-y-1.5">
+				<Label for="m-type">Тип</Label>
+				<Select
+					type="single"
+					value={form.type}
+					onValueChange={(v) => {
+						if (v) form.type = v as typeof form.type;
+					}}
+				>
+					<SelectTrigger id="m-type" class="w-full">
+						{moduleTypes.find((t) => t.value === form.type)?.label ?? 'Выберите тип'}
+					</SelectTrigger>
+					<SelectContent>
+						{#each moduleTypes as t (t.value)}
+							<SelectItem value={t.value}>{t.label}</SelectItem>
+						{/each}
+					</SelectContent>
+				</Select>
+			</div>
+			<div class="grid grid-cols-2 gap-4">
+				<div class="space-y-1.5">
+					<Label for="m-priority">Приоритет</Label>
+					<Input id="m-priority" type="number" bind:value={form.priority} />
+				</div>
+				<div class="space-y-1.5">
+					<Label for="m-interval">Интервал (сек)</Label>
+					<Input
+						id="m-interval"
+						type="number"
+						placeholder="3600"
+						bind:value={form.refresh_interval_sec}
+					/>
+				</div>
+			</div>
+			<div
+				class="flex flex-row items-center justify-between gap-4 rounded-lg border border-border bg-muted/30 p-3"
+			>
+				<div class="grid min-w-0 flex-1 gap-1 pr-2">
+					<Label for="m-enabled" class="leading-snug text-foreground">Включён</Label>
+					<p class="text-xs leading-snug text-muted-foreground">
+						Модуль участвует в сборке ревизий, если включён.
+					</p>
+				</div>
+				<Switch
+					id="m-enabled"
+					class="shrink-0"
+					checked={form.enabled !== false}
+					onCheckedChange={(v) => {
+						form = { ...form, enabled: v };
+					}}
+				/>
+			</div>
+		</div>
+		<DialogFooter>
+			<Button variant="outline" onclick={() => handleOpenChange(false)}>Отмена</Button>
+			<Button onclick={create} disabled={saving}>{saving ? 'Создание…' : 'Создать'}</Button>
+		</DialogFooter>
+	</DialogContent>
+</Dialog>
diff --git a/web/src/lib/components/modules/ModuleDetailHeader.svelte b/web/src/lib/components/modules/ModuleDetailHeader.svelte
new file mode 100644
index 0000000..636544e
--- /dev/null
+++ b/web/src/lib/components/modules/ModuleDetailHeader.svelte
@@ -0,0 +1,57 @@
+<script lang="ts">
+	import { resolve } from '$app/paths';
+	import type { ModuleRow } from '$lib/api/types.js';
+	import { moduleEnabledRu, moduleEnabledBadgeVariant, moduleTypeRu } from '$lib/ui-labels.js';
+	import { Badge } from '$lib/ui/core/badge/index.js';
+	import { Button } from '$lib/ui/core/button/index.js';
+	import PageHeader from '$lib/ui/app/page-header/page-header.svelte';
+	import ArrowLeft from '@lucide/svelte/icons/arrow-left';
+	import Pencil from '@lucide/svelte/icons/pencil';
+	import Trash2 from '@lucide/svelte/icons/trash-2';
+	import RefreshCw from '@lucide/svelte/icons/refresh-cw';
+	import Blocks from '@lucide/svelte/icons/blocks';
+
+	type Props = {
+		mod: ModuleRow;
+		refreshing: boolean;
+		onRefresh: () => void;
+		onEdit: () => void;
+		onDelete: () => void;
+	};
+
+	let { mod, refreshing, onRefresh, onEdit, onDelete }: Props = $props();
+</script>
+
+<div class="flex min-w-0 items-start gap-2">
+	<Button variant="ghost" size="icon-sm" class="mt-1 shrink-0" href={resolve('/modules')}>
+		<ArrowLeft class="size-4" />
+	</Button>
+	<PageHeader
+		class="min-w-0 flex-1"
+		title={mod.name}
+		description={mod.id}
+		icon={Blocks}
+		iconClass="bg-chart-2/15 text-chart-2"
+	>
+		{#snippet actions()}
+			<div class="flex flex-wrap items-center gap-2">
+				<Badge variant="outline">{moduleTypeRu(mod.type)}</Badge>
+				<Badge variant={moduleEnabledBadgeVariant(!!mod.enabled)} class="text-xs">
+					{moduleEnabledRu(!!mod.enabled)}
+				</Badge>
+				<Button variant="outline" size="sm" onclick={onRefresh} disabled={refreshing}>
+					<RefreshCw class={refreshing ? 'animate-spin' : ''} />
+					Обновить
+				</Button>
+				<Button variant="outline" size="sm" onclick={onEdit}>
+					<Pencil />
+					Редактировать
+				</Button>
+				<Button variant="destructive" size="sm" onclick={onDelete}>
+					<Trash2 />
+					Удалить
+				</Button>
+			</div>
+		{/snippet}
+	</PageHeader>
+</div>
diff --git a/web/src/lib/components/modules/ModuleDomainEntriesCard.svelte b/web/src/lib/components/modules/ModuleDomainEntriesCard.svelte
new file mode 100644
index 0000000..88b8783
--- /dev/null
+++ b/web/src/lib/components/modules/ModuleDomainEntriesCard.svelte
@@ -0,0 +1,303 @@
+<script lang="ts">
+	import { apiFetch, apiMutate } from '$lib/api/client.js';
+	import type { BgpCommunity, DomainEntry, ModuleRow } from '$lib/api/types.js';
+	import {
+		communityLabel,
+		sanitizeFilenamePart,
+		supportsCsvIO
+	} from '$lib/components/modules/module-helpers.js';
+	import { Button } from '$lib/ui/core/button/index.js';
+	import { Checkbox } from '$lib/ui/core/checkbox/index.js';
+	import {
+		Card,
+		CardContent,
+		CardHeader,
+		CardTitle,
+		CardDescription
+	} from '$lib/ui/core/card/index.js';
+	import AppDataTable from '$lib/ui/patterns/data-table/app-data-table.svelte';
+	import { confirm } from '$lib/ui/patterns/confirm/confirm-state.svelte.js';
+	import { notify, notifyApiError } from '$lib/ui/app/toast.js';
+	import ModuleDomainEntryDialog from '$lib/components/modules/ModuleDomainEntryDialog.svelte';
+	import Plus from '@lucide/svelte/icons/plus';
+	import Pencil from '@lucide/svelte/icons/pencil';
+	import Trash2 from '@lucide/svelte/icons/trash-2';
+	import Upload from '@lucide/svelte/icons/upload';
+	import Download from '@lucide/svelte/icons/download';
+
+	type Props = {
+		moduleId: string;
+		mod: ModuleRow;
+		entries: DomainEntry[];
+		communities: BgpCommunity[];
+		loading?: boolean;
+		onChanged: () => void | Promise<void>;
+	};
+
+	let { moduleId, mod, entries, communities, loading = false, onChanged }: Props = $props();
+
+	let dialogOpen = $state(false);
+	let editTarget = $state<DomainEntry | null>(null);
+	let selectedIds = $state(new Set<string>());
+	let deletingBulk = $state(false);
+	let csvImporting = $state(false);
+	let csvExporting = $state(false);
+	let csvFileInput = $state<HTMLInputElement | null>(null);
+
+	const selectedCount = $derived(selectedIds.size);
+	const allSelected = $derived(entries.length > 0 && selectedIds.size === entries.length);
+
+	const columns = [
+		{ id: 'select', label: '', class: 'w-10' },
+		{ id: 'fqdn', label: 'FQDN', sortable: true, sortValue: (e: DomainEntry) => e.fqdn },
+		{ id: 'community', label: 'Community' },
+		{ id: 'actions', label: '', class: 'w-20' }
+	] as const;
+
+	$effect(() => {
+		const validIds = new Set(entries.map((e) => e.id));
+		selectedIds = new Set([...selectedIds].filter((id) => validIds.has(id)));
+	});
+
+	function toggleSelection(id: string) {
+		const next = new Set(selectedIds);
+		if (next.has(id)) next.delete(id);
+		else next.add(id);
+		selectedIds = next;
+	}
+
+	function toggleAll(checked: boolean) {
+		selectedIds = checked ? new Set(entries.map((e) => e.id)) : new Set<string>();
+	}
+
+	function openCreate() {
+		editTarget = null;
+		dialogOpen = true;
+	}
+
+	function openEdit(entry: DomainEntry) {
+		editTarget = entry;
+		dialogOpen = true;
+	}
+
+	function requestDelete(entry: DomainEntry) {
+		void confirm({
+			title: 'Удалить домен?',
+			description: entry.fqdn,
+			confirmLabel: 'Удалить',
+			destructive: true,
+			onConfirm: async () => {
+				await apiMutate(`/v1/modules/${moduleId}/domain-entries/${entry.id}`, 'DELETE', undefined, {
+					idempotent: false
+				});
+				notify.success('Удалено');
+				await onChanged();
+			}
+		});
+	}
+
+	function requestBulkDelete() {
+		if (selectedCount === 0) return;
+		void confirm({
+			title: 'Удалить выбранные домены?',
+			description: `Будет удалено: ${selectedCount}`,
+			confirmLabel: 'Удалить',
+			destructive: true,
+			onConfirm: bulkDelete
+		});
+	}
+
+	async function bulkDelete() {
+		if (selectedCount === 0) return;
+		deletingBulk = true;
+		let deleted = 0;
+		try {
+			for (const id of selectedIds) {
+				try {
+					await apiMutate(`/v1/modules/${moduleId}/domain-entries/${id}`, 'DELETE', undefined, {
+						idempotent: false
+					});
+					deleted += 1;
+				} catch (e) {
+					notifyApiError(e);
+				}
+			}
+			if (deleted > 0) notify.success(`Удалено доменов: ${deleted}`);
+			await onChanged();
+		} finally {
+			deletingBulk = false;
+		}
+	}
+
+	async function readErrorText(res: Response): Promise<string> {
+		const body = (await res.text()).trim();
+		return body || `HTTP ${res.status}`;
+	}
+
+	async function exportCsv() {
+		if (!supportsCsvIO(mod.type) || csvExporting) return;
+		csvExporting = true;
+		try {
+			const res = await apiFetch(`/v1/modules/${moduleId}/entries.csv`, {
+				method: 'GET',
+				headers: { Accept: 'text/csv' }
+			});
+			if (!res.ok) {
+				notify.error(await readErrorText(res));
+				return;
+			}
+			const blob = await res.blob();
+			const url = URL.createObjectURL(blob);
+			const a = document.createElement('a');
+			a.href = url;
+			a.download = `${sanitizeFilenamePart(mod.name)}-${mod.type.toLowerCase()}-entries.csv`;
+			document.body.appendChild(a);
+			a.click();
+			a.remove();
+			URL.revokeObjectURL(url);
+		} catch (e) {
+			notifyApiError(e);
+		} finally {
+			csvExporting = false;
+		}
+	}
+
+	function openImportPicker() {
+		if (!supportsCsvIO(mod.type) || csvImporting) return;
+		csvFileInput?.click();
+	}
+
+	async function handleImportChange(event: Event) {
+		const input = event.currentTarget as HTMLInputElement | null;
+		const file = input?.files?.[0];
+		if (!file || csvImporting) return;
+		csvImporting = true;
+		try {
+			const fileText = await file.text();
+			const res = await apiFetch(`/v1/modules/${moduleId}/entries.csv`, {
+				method: 'POST',
+				headers: { 'Content-Type': 'text/csv' },
+				body: fileText
+			});
+			if (!res.ok) {
+				notify.error(await readErrorText(res));
+				return;
+			}
+			const payload = (await res.json()) as { imported?: number };
+			notify.success(`Импортировано записей: ${payload.imported ?? 0}`);
+			await onChanged();
+		} catch (e) {
+			notifyApiError(e);
+		} finally {
+			csvImporting = false;
+			if (input) input.value = '';
+		}
+	}
+</script>
+
+<input
+	class="hidden"
+	type="file"
+	accept=".csv,text/csv"
+	bind:this={csvFileInput}
+	onchange={handleImportChange}
+/>
+
+<Card>
+	<CardHeader class="flex flex-col gap-3 pb-2 sm:flex-row sm:items-center sm:justify-between">
+		<div class="min-w-0 flex-1">
+			<CardTitle class="text-base">Домены</CardTitle>
+			<CardDescription>FQDN для резолвинга через DoH.</CardDescription>
+		</div>
+		<div class="flex shrink-0 flex-wrap items-center justify-end gap-2 self-start sm:self-auto">
+			<Button
+				variant="outline"
+				size="sm"
+				onclick={openImportPicker}
+				disabled={!supportsCsvIO(mod.type) || csvImporting || csvExporting}
+			>
+				<Upload />
+				{csvImporting ? 'Импорт…' : 'Импорт CSV'}
+			</Button>
+			<Button
+				variant="outline"
+				size="sm"
+				onclick={exportCsv}
+				disabled={!supportsCsvIO(mod.type) || csvExporting || csvImporting}
+			>
+				<Download />
+				{csvExporting ? 'Экспорт…' : 'Экспорт CSV'}
+			</Button>
+			<Button size="sm" onclick={openCreate}><Plus />Добавить</Button>
+			{#if selectedCount > 0}
+				<Button variant="destructive" size="sm" onclick={requestBulkDelete} disabled={deletingBulk}>
+					<Trash2 />
+					Удалить ({selectedCount})
+				</Button>
+			{/if}
+		</div>
+	</CardHeader>
+	<CardContent class="p-4 pt-0">
+		<AppDataTable
+			columns={[...columns]}
+			rows={entries}
+			rowKey={(e) => e.id}
+			{loading}
+			emptyTitle="Нет доменов"
+			emptyDescription="Добавьте FQDN или импортируйте CSV."
+		>
+			{#snippet toolbar()}
+				{#if entries.length > 0}
+					<div class="flex items-center gap-2">
+						<Checkbox
+							checked={allSelected}
+							onCheckedChange={(v) => toggleAll(v === true)}
+							aria-label="Выбрать все домены"
+						/>
+						<span class="text-sm text-muted-foreground">Выбрать все</span>
+					</div>
+				{/if}
+			{/snippet}
+			{#snippet cell({ row: entry, column })}
+				{#if column.id === 'select'}
+					<Checkbox
+						checked={selectedIds.has(entry.id)}
+						aria-label={`Выбрать домен ${entry.fqdn}`}
+						onCheckedChange={() => toggleSelection(entry.id)}
+					/>
+				{:else if column.id === 'fqdn'}
+					<span class="font-mono">{entry.fqdn}</span>
+				{:else if column.id === 'community'}
+					<span class="text-sm text-muted-foreground">
+						{communityLabel(entry.community_id, communities)}
+					</span>
+				{:else if column.id === 'actions'}
+					<div class="flex gap-1">
+						<Button variant="ghost" size="icon-sm" onclick={() => openEdit(entry)}>
+							<Pencil class="size-3.5" />
+						</Button>
+						<Button
+							variant="ghost"
+							size="icon-sm"
+							class="text-destructive"
+							onclick={() => requestDelete(entry)}
+						>
+							<Trash2 class="size-3.5" />
+						</Button>
+					</div>
+				{/if}
+			{/snippet}
+		</AppDataTable>
+	</CardContent>
+</Card>
+
+<ModuleDomainEntryDialog
+	bind:open={dialogOpen}
+	{moduleId}
+	edit={editTarget}
+	{communities}
+	onSaved={onChanged}
+	onClose={() => {
+		editTarget = null;
+	}}
+/>
diff --git a/web/src/lib/components/modules/ModuleDomainEntryDialog.svelte b/web/src/lib/components/modules/ModuleDomainEntryDialog.svelte
new file mode 100644
index 0000000..5aca8b3
--- /dev/null
+++ b/web/src/lib/components/modules/ModuleDomainEntryDialog.svelte
@@ -0,0 +1,109 @@
+<script lang="ts">
+	import { apiMutate } from '$lib/api/client.js';
+	import type { BgpCommunity, DomainEntry, DomainEntryCreate } from '$lib/api/types.js';
+	import {
+		communityLabel,
+		communityOptionLabel,
+		fromNullableSelect,
+		NONE_OPTION,
+		nullableSelectValue
+	} from '$lib/components/modules/module-helpers.js';
+	import { Button } from '$lib/ui/core/button/index.js';
+	import { Input } from '$lib/ui/core/input/index.js';
+	import { Label } from '$lib/ui/core/label/index.js';
+	import {
+		Dialog,
+		DialogContent,
+		DialogHeader,
+		DialogTitle,
+		DialogFooter
+	} from '$lib/ui/core/dialog/index.js';
+	import { Select, SelectContent, SelectItem, SelectTrigger } from '$lib/ui/core/select/index.js';
+	import { notify, notifyApiError } from '$lib/ui/app/toast.js';
+
+	type Props = {
+		open: boolean;
+		moduleId: string;
+		edit: DomainEntry | null;
+		communities: BgpCommunity[];
+		onSaved: () => void | Promise<void>;
+		onClose: () => void;
+	};
+
+	let { open = $bindable(), moduleId, edit, communities, onSaved, onClose }: Props = $props();
+
+	let saving = $state(false);
+	let form = $state<DomainEntryCreate>({ fqdn: '', community_id: null });
+
+	$effect(() => {
+		if (open) {
+			form = edit
+				? { fqdn: edit.fqdn, community_id: edit.community_id }
+				: { fqdn: '', community_id: null };
+		}
+	});
+
+	async function save() {
+		saving = true;
+		try {
+			if (edit) {
+				await apiMutate(`/v1/modules/${moduleId}/domain-entries/${edit.id}`, 'PATCH', form);
+				notify.success('Домен обновлён');
+			} else {
+				await apiMutate(`/v1/modules/${moduleId}/domain-entries`, 'POST', form);
+				notify.success('Домен добавлен');
+			}
+			open = false;
+			await onSaved();
+		} catch (e) {
+			notifyApiError(e);
+		} finally {
+			saving = false;
+		}
+	}
+
+	function handleOpenChange(next: boolean) {
+		open = next;
+		if (!next) onClose();
+	}
+</script>
+
+<Dialog {open} onOpenChange={handleOpenChange}>
+	<DialogContent class="sm:max-w-sm">
+		<DialogHeader>
+			<DialogTitle>{edit ? 'Редактировать домен' : 'Новый домен'}</DialogTitle>
+		</DialogHeader>
+		<div class="space-y-4 py-2">
+			<div class="space-y-1.5">
+				<Label for="dom-fqdn">FQDN</Label>
+				<Input id="dom-fqdn" placeholder="example.com" bind:value={form.fqdn} />
+			</div>
+			<div class="space-y-1.5">
+				<Label for="dom-comm">Community</Label>
+				<Select
+					type="single"
+					value={nullableSelectValue(form.community_id)}
+					onValueChange={(v) => {
+						form.community_id = fromNullableSelect(v);
+					}}
+				>
+					<SelectTrigger id="dom-comm" class="w-full">
+						{form.community_id ? communityLabel(form.community_id, communities) : 'Не выбрано'}
+					</SelectTrigger>
+					<SelectContent>
+						<SelectItem value={NONE_OPTION}>Не выбрано</SelectItem>
+						{#each communities as c (c.id)}
+							<SelectItem value={c.id}>{communityOptionLabel(c)}</SelectItem>
+						{/each}
+					</SelectContent>
+				</Select>
+			</div>
+		</div>
+		<DialogFooter>
+			<Button variant="outline" onclick={() => handleOpenChange(false)}>Отмена</Button>
+			<Button onclick={save} disabled={saving}>
+				{saving ? 'Сохранение…' : edit ? 'Сохранить' : 'Добавить'}
+			</Button>
+		</DialogFooter>
+	</DialogContent>
+</Dialog>
diff --git a/web/src/lib/components/modules/ModuleEditDialog.svelte b/web/src/lib/components/modules/ModuleEditDialog.svelte
new file mode 100644
index 0000000..9d6e75f
--- /dev/null
+++ b/web/src/lib/components/modules/ModuleEditDialog.svelte
@@ -0,0 +1,283 @@
+<script lang="ts">
+	import { apiMutate } from '$lib/api/client.js';
+	import type {
+		BgpCommunity,
+		DohProfile,
+		DohResolverPolicy,
+		ModulePatch,
+		ModuleRow
+	} from '$lib/api/types.js';
+	import { dohPolicyRu } from '$lib/ui-labels.js';
+	import {
+		communityLabel,
+		communityOptionLabel,
+		fromNullableSelect,
+		moduleDohProfileIds,
+		NONE_OPTION,
+		nullableSelectValue
+	} from '$lib/components/modules/module-helpers.js';
+	import { Button } from '$lib/ui/core/button/index.js';
+	import { Input } from '$lib/ui/core/input/index.js';
+	import { Label } from '$lib/ui/core/label/index.js';
+	import { Checkbox } from '$lib/ui/core/checkbox/index.js';
+	import {
+		Dialog,
+		DialogContent,
+		DialogHeader,
+		DialogTitle,
+		DialogFooter
+	} from '$lib/ui/core/dialog/index.js';
+	import { Select, SelectContent, SelectItem, SelectTrigger } from '$lib/ui/core/select/index.js';
+	import { Switch } from '$lib/ui/core/switch/index.js';
+	import { notify, notifyApiError } from '$lib/ui/app/toast.js';
+
+	const dohPolicyOptions: { value: DohResolverPolicy; label: string; hint: string }[] = [
+		{
+			value: 'primary_only',
+			label: 'Только первый',
+			hint: 'Используется первый выбранный DoH-профиль.'
+		},
+		{
+			value: 'failover',
+			label: 'Резервирование',
+			hint: 'Профили по порядку до первого успешного ответа.'
+		},
+		{
+			value: 'union',
+			label: 'Объединение',
+			hint: 'Все A/AAAA со всех профилей (geo-split DNS).'
+		}
+	];
+
+	type Props = {
+		open: boolean;
+		mod: ModuleRow;
+		moduleId: string;
+		communities: BgpCommunity[];
+		dohProfiles: DohProfile[];
+		onSaved: () => void | Promise<void>;
+		onClose: () => void;
+	};
+
+	let {
+		open = $bindable(),
+		mod,
+		moduleId,
+		communities,
+		dohProfiles,
+		onSaved,
+		onClose
+	}: Props = $props();
+
+	let editForm = $state<ModulePatch>({});
+	let editSaving = $state(false);
+
+	$effect(() => {
+		if (open && mod) {
+			editForm = {
+				name: mod.name,
+				enabled: mod.enabled,
+				priority: mod.priority,
+				refresh_interval_sec: mod.refresh_interval_sec,
+				cron_expr: mod.cron_expr,
+				default_community_id: mod.default_community_id,
+				doh_profile_ids: moduleDohProfileIds(mod),
+				doh_resolver_policy: mod.doh_resolver_policy ?? 'primary_only'
+			};
+		}
+	});
+
+	function toggleEditDohProfile(id: string, checked: boolean) {
+		let ids = [...(editForm.doh_profile_ids ?? [])];
+		if (checked) {
+			if (!ids.includes(id)) ids.push(id);
+		} else {
+			ids = ids.filter((x) => x !== id);
+		}
+		editForm = { ...editForm, doh_profile_ids: ids };
+	}
+
+	function isEditDohProfileSelected(id: string): boolean {
+		return (editForm.doh_profile_ids ?? []).includes(id);
+	}
+
+	async function saveMod() {
+		editSaving = true;
+		try {
+			const cron =
+				typeof editForm.cron_expr === 'string' ? editForm.cron_expr.trim() : editForm.cron_expr;
+			const intervalRaw = editForm.refresh_interval_sec;
+			const interval =
+				intervalRaw === null || intervalRaw === undefined ? null : Number(intervalRaw);
+			const payload: ModulePatch = {
+				...editForm,
+				cron_expr: cron ? cron : null,
+				refresh_interval_sec: Number.isFinite(interval) ? interval : null,
+				default_community_id: fromNullableSelect(
+					nullableSelectValue(editForm.default_community_id)
+				),
+				doh_profile_ids: editForm.doh_profile_ids ?? [],
+				doh_resolver_policy: editForm.doh_resolver_policy ?? 'primary_only'
+			};
+			await apiMutate<ModuleRow>(`/v1/modules/${moduleId}`, 'PATCH', payload);
+			notify.success('Модуль обновлён');
+			open = false;
+			await onSaved();
+		} catch (e) {
+			notifyApiError(e);
+		} finally {
+			editSaving = false;
+		}
+	}
+
+	function handleOpenChange(next: boolean) {
+		open = next;
+		if (!next) onClose();
+	}
+</script>
+
+<Dialog {open} onOpenChange={handleOpenChange}>
+	<DialogContent class="sm:max-w-md">
+		<DialogHeader>
+			<DialogTitle>Редактировать модуль</DialogTitle>
+		</DialogHeader>
+		<div class="space-y-4 py-2">
+			<div class="space-y-1.5">
+				<Label for="e-name">Название</Label>
+				<Input id="e-name" bind:value={editForm.name} />
+			</div>
+			<div class="grid grid-cols-2 gap-4">
+				<div class="space-y-1.5">
+					<Label for="e-priority">Приоритет</Label>
+					<Input id="e-priority" type="number" bind:value={editForm.priority} />
+				</div>
+				<div class="space-y-1.5">
+					<Label for="e-interval">Интервал (сек)</Label>
+					<Input id="e-interval" type="number" bind:value={editForm.refresh_interval_sec} />
+				</div>
+			</div>
+			<div class="space-y-1.5">
+				<Label for="e-cron">Cron-выражение</Label>
+				<Input id="e-cron" placeholder="0 */6 * * *" bind:value={editForm.cron_expr} />
+			</div>
+			<div class="space-y-1.5">
+				<Label for="e-comm">Community по умолчанию</Label>
+				<Select
+					type="single"
+					value={nullableSelectValue(editForm.default_community_id)}
+					onValueChange={(v) => {
+						editForm.default_community_id = fromNullableSelect(v);
+					}}
+				>
+					<SelectTrigger id="e-comm" class="w-full">
+						{editForm.default_community_id
+							? communityLabel(editForm.default_community_id, communities)
+							: 'Не выбрано'}
+					</SelectTrigger>
+					<SelectContent>
+						<SelectItem value={NONE_OPTION}>Не выбрано</SelectItem>
+						{#each communities as c (c.id)}
+							<SelectItem value={c.id}>{communityOptionLabel(c)}</SelectItem>
+						{/each}
+					</SelectContent>
+				</Select>
+				<Button
+					type="button"
+					variant="ghost"
+					size="sm"
+					class="h-7 px-2"
+					onclick={() => {
+						editForm.default_community_id = null;
+					}}
+				>
+					Сбросить
+				</Button>
+			</div>
+			{#if mod.type === 'DOMAINS'}
+				<div class="space-y-1.5">
+					<Label for="e-doh-policy">Политика DoH</Label>
+					<Select
+						type="single"
+						value={editForm.doh_resolver_policy ?? 'primary_only'}
+						onValueChange={(v) => {
+							if (v) editForm.doh_resolver_policy = v as DohResolverPolicy;
+						}}
+					>
+						<SelectTrigger id="e-doh-policy" class="w-full">
+							{dohPolicyRu(editForm.doh_resolver_policy)}
+						</SelectTrigger>
+						<SelectContent>
+							{#each dohPolicyOptions as opt (opt.value)}
+								<SelectItem value={opt.value}>{opt.label}</SelectItem>
+							{/each}
+						</SelectContent>
+					</Select>
+					<p class="text-xs text-muted-foreground">
+						{dohPolicyOptions.find(
+							(o) => o.value === (editForm.doh_resolver_policy ?? 'primary_only')
+						)?.hint}
+					</p>
+				</div>
+				<div class="space-y-2">
+					<Label>DoH-профили</Label>
+					<p class="text-xs text-muted-foreground">
+						Порядок выбора = порядок в списке (сверху вниз).
+					</p>
+					<div class="max-h-40 space-y-2 overflow-y-auto rounded-md border p-3">
+						{#each dohProfiles as d (d.id)}
+							<label class="flex items-start gap-2 text-sm">
+								<Checkbox
+									checked={isEditDohProfileSelected(d.id)}
+									onCheckedChange={(v) => toggleEditDohProfile(d.id, v === true)}
+								/>
+								<span class="min-w-0 break-all">
+									<span class="font-medium">{d.name?.trim() ? d.name : d.url}</span>
+									{#if d.name?.trim()}
+										<span class="block font-mono text-xs text-muted-foreground">{d.url}</span>
+									{/if}
+								</span>
+							</label>
+						{:else}
+							<p class="text-xs text-muted-foreground">Нет профилей — создайте в справочниках.</p>
+						{/each}
+					</div>
+					<Button
+						type="button"
+						variant="ghost"
+						size="sm"
+						class="h-7 px-2"
+						onclick={() => {
+							editForm = { ...editForm, doh_profile_ids: [] };
+						}}
+					>
+						Сбросить профили
+					</Button>
+				</div>
+			{/if}
+			<div
+				class="flex flex-row items-center justify-between gap-4 rounded-lg border border-border bg-muted/30 p-3"
+			>
+				<div class="grid min-w-0 flex-1 gap-1 pr-2">
+					<Label for="e-enabled" class="leading-snug text-foreground">Включён</Label>
+					<p class="text-xs leading-snug text-muted-foreground">
+						Отключённые модули не участвуют в обновлении конфигурации.
+					</p>
+				</div>
+				<Switch
+					id="e-enabled"
+					class="shrink-0"
+					checked={editForm.enabled !== false}
+					onCheckedChange={(v) => {
+						editForm = { ...editForm, enabled: v };
+					}}
+				/>
+			</div>
+		</div>
+		<DialogFooter>
+			<Button variant="outline" onclick={() => handleOpenChange(false)}>Отмена</Button>
+			<Button onclick={saveMod} disabled={editSaving}>
+				{editSaving ? 'Сохранение…' : 'Сохранить'}
+			</Button>
+		</DialogFooter>
+	</DialogContent>
+</Dialog>
diff --git a/web/src/lib/components/modules/ModuleIpRangeEntryDialog.svelte b/web/src/lib/components/modules/ModuleIpRangeEntryDialog.svelte
new file mode 100644
index 0000000..135f958
--- /dev/null
+++ b/web/src/lib/components/modules/ModuleIpRangeEntryDialog.svelte
@@ -0,0 +1,104 @@
+<script lang="ts">
+	import { apiMutate } from '$lib/api/client.js';
+	import type { BgpCommunity, IpRangeEntry, IpRangeEntryCreate } from '$lib/api/types.js';
+	import { communityLabel, communityOptionLabel } from '$lib/components/modules/module-helpers.js';
+	import { Button } from '$lib/ui/core/button/index.js';
+	import { Input } from '$lib/ui/core/input/index.js';
+	import { Label } from '$lib/ui/core/label/index.js';
+	import {
+		Dialog,
+		DialogContent,
+		DialogHeader,
+		DialogTitle,
+		DialogFooter
+	} from '$lib/ui/core/dialog/index.js';
+	import { Select, SelectContent, SelectItem, SelectTrigger } from '$lib/ui/core/select/index.js';
+	import { notify, notifyApiError } from '$lib/ui/app/toast.js';
+
+	type Props = {
+		open: boolean;
+		moduleId: string;
+		edit: IpRangeEntry | null;
+		communities: BgpCommunity[];
+		onSaved: () => void | Promise<void>;
+		onClose: () => void;
+	};
+
+	let { open = $bindable(), moduleId, edit, communities, onSaved, onClose }: Props = $props();
+
+	let saving = $state(false);
+	let form = $state<IpRangeEntryCreate>({ prefix: '', community_id: '' });
+
+	$effect(() => {
+		if (open) {
+			form = edit
+				? { prefix: edit.prefix, community_id: edit.community_id }
+				: { prefix: '', community_id: '' };
+		}
+	});
+
+	async function save() {
+		saving = true;
+		try {
+			if (edit) {
+				await apiMutate(`/v1/modules/${moduleId}/ip-range-entries/${edit.id}`, 'PATCH', form);
+				notify.success('Диапазон обновлён');
+			} else {
+				await apiMutate(`/v1/modules/${moduleId}/ip-range-entries`, 'POST', form);
+				notify.success('Диапазон добавлен');
+			}
+			open = false;
+			await onSaved();
+		} catch (e) {
+			notifyApiError(e);
+		} finally {
+			saving = false;
+		}
+	}
+
+	function handleOpenChange(next: boolean) {
+		open = next;
+		if (!next) onClose();
+	}
+</script>
+
+<Dialog {open} onOpenChange={handleOpenChange}>
+	<DialogContent class="sm:max-w-sm">
+		<DialogHeader>
+			<DialogTitle>{edit ? 'Редактировать диапазон' : 'Новый IP-диапазон'}</DialogTitle>
+		</DialogHeader>
+		<div class="space-y-4 py-2">
+			<div class="space-y-1.5">
+				<Label for="ip-prefix">Префикс (CIDR)</Label>
+				<Input id="ip-prefix" placeholder="203.0.113.0/24" bind:value={form.prefix} />
+			</div>
+			<div class="space-y-1.5">
+				<Label for="ip-comm">Community (обязательно)</Label>
+				<Select
+					type="single"
+					value={form.community_id}
+					onValueChange={(v) => {
+						form.community_id = v;
+					}}
+				>
+					<SelectTrigger id="ip-comm" class="w-full">
+						{form.community_id
+							? communityLabel(form.community_id, communities)
+							: 'Выберите community'}
+					</SelectTrigger>
+					<SelectContent>
+						{#each communities as c (c.id)}
+							<SelectItem value={c.id}>{communityOptionLabel(c)}</SelectItem>
+						{/each}
+					</SelectContent>
+				</Select>
+			</div>
+		</div>
+		<DialogFooter>
+			<Button variant="outline" onclick={() => handleOpenChange(false)}>Отмена</Button>
+			<Button onclick={save} disabled={saving}>
+				{saving ? 'Сохранение…' : edit ? 'Сохранить' : 'Добавить'}
+			</Button>
+		</DialogFooter>
+	</DialogContent>
+</Dialog>
diff --git a/web/src/lib/components/modules/ModuleIpRangesCard.svelte b/web/src/lib/components/modules/ModuleIpRangesCard.svelte
new file mode 100644
index 0000000..acb1b02
--- /dev/null
+++ b/web/src/lib/components/modules/ModuleIpRangesCard.svelte
@@ -0,0 +1,311 @@
+<script lang="ts">
+	import { apiFetch, apiMutate } from '$lib/api/client.js';
+	import type { BgpCommunity, IpRangeEntry, ModuleRow } from '$lib/api/types.js';
+	import {
+		communityLabel,
+		sanitizeFilenamePart,
+		supportsCsvIO
+	} from '$lib/components/modules/module-helpers.js';
+	import { Button } from '$lib/ui/core/button/index.js';
+	import { Checkbox } from '$lib/ui/core/checkbox/index.js';
+	import {
+		Card,
+		CardContent,
+		CardHeader,
+		CardTitle,
+		CardDescription
+	} from '$lib/ui/core/card/index.js';
+	import AppDataTable from '$lib/ui/patterns/data-table/app-data-table.svelte';
+	import { confirm } from '$lib/ui/patterns/confirm/confirm-state.svelte.js';
+	import { notify, notifyApiError } from '$lib/ui/app/toast.js';
+	import ModuleIpRangeEntryDialog from '$lib/components/modules/ModuleIpRangeEntryDialog.svelte';
+	import Plus from '@lucide/svelte/icons/plus';
+	import Pencil from '@lucide/svelte/icons/pencil';
+	import Trash2 from '@lucide/svelte/icons/trash-2';
+	import Upload from '@lucide/svelte/icons/upload';
+	import Download from '@lucide/svelte/icons/download';
+
+	type Props = {
+		moduleId: string;
+		mod: ModuleRow;
+		entries: IpRangeEntry[];
+		communities: BgpCommunity[];
+		loading?: boolean;
+		onChanged: () => void | Promise<void>;
+	};
+
+	let { moduleId, mod, entries, communities, loading = false, onChanged }: Props = $props();
+
+	let dialogOpen = $state(false);
+	let editTarget = $state<IpRangeEntry | null>(null);
+	let selectedIds = $state(new Set<string>());
+	let deletingBulk = $state(false);
+	let csvImporting = $state(false);
+	let csvExporting = $state(false);
+	let csvFileInput = $state<HTMLInputElement | null>(null);
+
+	const selectedCount = $derived(selectedIds.size);
+	const allSelected = $derived(entries.length > 0 && selectedIds.size === entries.length);
+
+	const columns = [
+		{ id: 'select', label: '', class: 'w-10' },
+		{
+			id: 'prefix',
+			label: 'Префикс (CIDR)',
+			sortable: true,
+			sortValue: (e: IpRangeEntry) => e.prefix
+		},
+		{ id: 'community', label: 'Community' },
+		{ id: 'actions', label: '', class: 'w-20' }
+	] as const;
+
+	$effect(() => {
+		const validIds = new Set(entries.map((e) => e.id));
+		selectedIds = new Set([...selectedIds].filter((id) => validIds.has(id)));
+	});
+
+	function toggleSelection(id: string) {
+		const next = new Set(selectedIds);
+		if (next.has(id)) next.delete(id);
+		else next.add(id);
+		selectedIds = next;
+	}
+
+	function toggleAll(checked: boolean) {
+		selectedIds = checked ? new Set(entries.map((e) => e.id)) : new Set<string>();
+	}
+
+	function openCreate() {
+		editTarget = null;
+		dialogOpen = true;
+	}
+
+	function openEdit(entry: IpRangeEntry) {
+		editTarget = entry;
+		dialogOpen = true;
+	}
+
+	function requestDelete(entry: IpRangeEntry) {
+		void confirm({
+			title: 'Удалить диапазон?',
+			description: entry.prefix,
+			confirmLabel: 'Удалить',
+			destructive: true,
+			onConfirm: async () => {
+				await apiMutate(
+					`/v1/modules/${moduleId}/ip-range-entries/${entry.id}`,
+					'DELETE',
+					undefined,
+					{ idempotent: false }
+				);
+				notify.success('Удалено');
+				await onChanged();
+			}
+		});
+	}
+
+	function requestBulkDelete() {
+		if (selectedCount === 0) return;
+		void confirm({
+			title: 'Удалить выбранные диапазоны?',
+			description: `Будет удалено: ${selectedCount}`,
+			confirmLabel: 'Удалить',
+			destructive: true,
+			onConfirm: bulkDelete
+		});
+	}
+
+	async function bulkDelete() {
+		if (selectedCount === 0) return;
+		deletingBulk = true;
+		let deleted = 0;
+		try {
+			for (const id of selectedIds) {
+				try {
+					await apiMutate(`/v1/modules/${moduleId}/ip-range-entries/${id}`, 'DELETE', undefined, {
+						idempotent: false
+					});
+					deleted += 1;
+				} catch (e) {
+					notifyApiError(e);
+				}
+			}
+			if (deleted > 0) notify.success(`Удалено диапазонов: ${deleted}`);
+			await onChanged();
+		} finally {
+			deletingBulk = false;
+		}
+	}
+
+	async function readErrorText(res: Response): Promise<string> {
+		const body = (await res.text()).trim();
+		return body || `HTTP ${res.status}`;
+	}
+
+	async function exportCsv() {
+		if (!supportsCsvIO(mod.type) || csvExporting) return;
+		csvExporting = true;
+		try {
+			const res = await apiFetch(`/v1/modules/${moduleId}/entries.csv`, {
+				method: 'GET',
+				headers: { Accept: 'text/csv' }
+			});
+			if (!res.ok) {
+				notify.error(await readErrorText(res));
+				return;
+			}
+			const blob = await res.blob();
+			const url = URL.createObjectURL(blob);
+			const a = document.createElement('a');
+			a.href = url;
+			a.download = `${sanitizeFilenamePart(mod.name)}-${mod.type.toLowerCase()}-entries.csv`;
+			document.body.appendChild(a);
+			a.click();
+			a.remove();
+			URL.revokeObjectURL(url);
+		} catch (e) {
+			notifyApiError(e);
+		} finally {
+			csvExporting = false;
+		}
+	}
+
+	function openImportPicker() {
+		if (!supportsCsvIO(mod.type) || csvImporting) return;
+		csvFileInput?.click();
+	}
+
+	async function handleImportChange(event: Event) {
+		const input = event.currentTarget as HTMLInputElement | null;
+		const file = input?.files?.[0];
+		if (!file || csvImporting) return;
+		csvImporting = true;
+		try {
+			const fileText = await file.text();
+			const res = await apiFetch(`/v1/modules/${moduleId}/entries.csv`, {
+				method: 'POST',
+				headers: { 'Content-Type': 'text/csv' },
+				body: fileText
+			});
+			if (!res.ok) {
+				notify.error(await readErrorText(res));
+				return;
+			}
+			const payload = (await res.json()) as { imported?: number };
+			notify.success(`Импортировано записей: ${payload.imported ?? 0}`);
+			await onChanged();
+		} catch (e) {
+			notifyApiError(e);
+		} finally {
+			csvImporting = false;
+			if (input) input.value = '';
+		}
+	}
+</script>
+
+<input
+	class="hidden"
+	type="file"
+	accept=".csv,text/csv"
+	bind:this={csvFileInput}
+	onchange={handleImportChange}
+/>
+
+<Card>
+	<CardHeader class="flex flex-col gap-3 pb-2 sm:flex-row sm:items-center sm:justify-between">
+		<div class="min-w-0 flex-1">
+			<CardTitle class="text-base">IP-диапазоны</CardTitle>
+			<CardDescription>Статические CIDR для анонса.</CardDescription>
+		</div>
+		<div class="flex shrink-0 flex-wrap items-center justify-end gap-2 self-start sm:self-auto">
+			<Button
+				variant="outline"
+				size="sm"
+				onclick={openImportPicker}
+				disabled={!supportsCsvIO(mod.type) || csvImporting || csvExporting}
+			>
+				<Upload />
+				{csvImporting ? 'Импорт…' : 'Импорт CSV'}
+			</Button>
+			<Button
+				variant="outline"
+				size="sm"
+				onclick={exportCsv}
+				disabled={!supportsCsvIO(mod.type) || csvExporting || csvImporting}
+			>
+				<Download />
+				{csvExporting ? 'Экспорт…' : 'Экспорт CSV'}
+			</Button>
+			<Button size="sm" onclick={openCreate}><Plus />Добавить</Button>
+			{#if selectedCount > 0}
+				<Button variant="destructive" size="sm" onclick={requestBulkDelete} disabled={deletingBulk}>
+					<Trash2 />
+					Удалить ({selectedCount})
+				</Button>
+			{/if}
+		</div>
+	</CardHeader>
+	<CardContent class="p-4 pt-0">
+		<AppDataTable
+			columns={[...columns]}
+			rows={entries}
+			rowKey={(e) => e.id}
+			{loading}
+			emptyTitle="Нет диапазонов"
+			emptyDescription="Добавьте CIDR или импортируйте CSV."
+		>
+			{#snippet toolbar()}
+				{#if entries.length > 0}
+					<div class="flex items-center gap-2">
+						<Checkbox
+							checked={allSelected}
+							onCheckedChange={(v) => toggleAll(v === true)}
+							aria-label="Выбрать все диапазоны"
+						/>
+						<span class="text-sm text-muted-foreground">Выбрать все</span>
+					</div>
+				{/if}
+			{/snippet}
+			{#snippet cell({ row: entry, column })}
+				{#if column.id === 'select'}
+					<Checkbox
+						checked={selectedIds.has(entry.id)}
+						aria-label={`Выбрать диапазон ${entry.prefix}`}
+						onCheckedChange={() => toggleSelection(entry.id)}
+					/>
+				{:else if column.id === 'prefix'}
+					<span class="font-mono">{entry.prefix}</span>
+				{:else if column.id === 'community'}
+					<span class="text-sm text-muted-foreground">
+						{communityLabel(entry.community_id, communities)}
+					</span>
+				{:else if column.id === 'actions'}
+					<div class="flex gap-1">
+						<Button variant="ghost" size="icon-sm" onclick={() => openEdit(entry)}>
+							<Pencil class="size-3.5" />
+						</Button>
+						<Button
+							variant="ghost"
+							size="icon-sm"
+							class="text-destructive"
+							onclick={() => requestDelete(entry)}
+						>
+							<Trash2 class="size-3.5" />
+						</Button>
+					</div>
+				{/if}
+			{/snippet}
+		</AppDataTable>
+	</CardContent>
+</Card>
+
+<ModuleIpRangeEntryDialog
+	bind:open={dialogOpen}
+	{moduleId}
+	edit={editTarget}
+	{communities}
+	onSaved={onChanged}
+	onClose={() => {
+		editTarget = null;
+	}}
+/>
diff --git a/web/src/lib/components/modules/ModuleKpiCards.svelte b/web/src/lib/components/modules/ModuleKpiCards.svelte
new file mode 100644
index 0000000..e3e3a66
--- /dev/null
+++ b/web/src/lib/components/modules/ModuleKpiCards.svelte
@@ -0,0 +1,155 @@
+<script lang="ts">
+	import type { AsEntry, BgpCommunity, DohProfile, ModuleRow } from '$lib/api/types.js';
+	import { formatDateTime, moduleIntervalLabel } from '$lib/modules/display.js';
+	import { dohPolicyRu } from '$lib/ui-labels.js';
+	import {
+		communityLabel,
+		dohProfileLabel,
+		moduleDohProfileIds
+	} from '$lib/components/modules/module-helpers.js';
+	import { Card, CardContent, CardHeader, CardTitle } from '$lib/ui/core/card/index.js';
+	import CardSkeleton from '$lib/ui/patterns/feedback/card-skeleton.svelte';
+	import { cn } from '$lib/utils.js';
+	import ArrowDownUp from '@lucide/svelte/icons/arrow-down-up';
+	import Timer from '@lucide/svelte/icons/timer';
+	import ShieldCheck from '@lucide/svelte/icons/shield-check';
+	import Network from '@lucide/svelte/icons/network';
+	import RefreshCw from '@lucide/svelte/icons/refresh-cw';
+
+	type Props = {
+		mod: ModuleRow | null;
+		communities: BgpCommunity[];
+		dohProfiles: DohProfile[];
+		asEntries: AsEntry[];
+		loading?: boolean;
+	};
+
+	let { mod, communities, dohProfiles, asEntries, loading = false }: Props = $props();
+
+	const asPrefixTotal = $derived(
+		asEntries.reduce((acc, entry) => acc + (entry.prefix_count ?? 0), 0)
+	);
+
+	const statAccents = [
+		{
+			border: 'border-l-chart-3',
+			bg: 'bg-chart-3/5',
+			iconBg: 'bg-chart-3/15',
+			iconText: 'text-chart-3'
+		},
+		{
+			border: 'border-l-chart-5',
+			bg: 'bg-chart-5/5',
+			iconBg: 'bg-chart-5/15',
+			iconText: 'text-chart-5'
+		},
+		{
+			border: 'border-l-chart-4',
+			bg: 'bg-chart-4/5',
+			iconBg: 'bg-chart-4/15',
+			iconText: 'text-chart-4'
+		},
+		{
+			border: 'border-l-chart-2',
+			bg: 'bg-chart-2/5',
+			iconBg: 'bg-chart-2/15',
+			iconText: 'text-chart-2'
+		},
+		{
+			border: 'border-l-muted-foreground',
+			bg: 'bg-muted/30',
+			iconBg: 'bg-muted',
+			iconText: 'text-muted-foreground'
+		}
+	] as const;
+
+	const kpiCards = $derived.by(() => {
+		if (!mod) return [];
+		const dohIds = moduleDohProfileIds(mod);
+		return [
+			{
+				id: 'priority',
+				label: 'Приоритет',
+				value: String(mod.priority ?? 0),
+				description: 'порядок в сборке ревизии',
+				icon: ArrowDownUp,
+				accent: statAccents[0]
+			},
+			{
+				id: 'interval',
+				label: 'Интервал',
+				value: moduleIntervalLabel(mod),
+				description: 'refresh_interval_sec / cron',
+				icon: Timer,
+				accent: statAccents[1],
+				mono: true
+			},
+			{
+				id: 'doh',
+				label: 'DoH',
+				value: mod.type === 'DOMAINS' ? dohPolicyRu(mod.doh_resolver_policy) : '—',
+				description:
+					mod.type === 'DOMAINS'
+						? dohIds.length
+							? dohIds.map((id) => dohProfileLabel(id, dohProfiles)).join('; ')
+							: 'Системный DNS'
+						: 'не применимо',
+				icon: Network,
+				accent: statAccents[2]
+			},
+			{
+				id: 'community',
+				label: 'Community по умолч.',
+				value: communityLabel(mod.default_community_id, communities),
+				description: 'для записей без своего community',
+				icon: ShieldCheck,
+				accent: statAccents[3]
+			},
+			{
+				id: 'refreshed',
+				label: 'Последнее обновление',
+				value: formatDateTime(mod.last_refreshed_at),
+				description:
+					mod.type === 'AS_PREFIXES'
+						? `ASN: ${asEntries.length}, префиксов: ${asPrefixTotal}`
+						: 'время последнего refresh',
+				icon: RefreshCw,
+				accent: statAccents[4]
+			}
+		];
+	});
+</script>
+
+<div class="grid grid-cols-1 gap-4 sm:grid-cols-2 xl:grid-cols-5">
+	{#if loading}
+		{#each Array(5) as _, i (i)}
+			<CardSkeleton />
+		{/each}
+	{:else}
+		{#each kpiCards as card (card.id)}
+			{@const Icon = card.icon}
+			{@const a = card.accent}
+			<Card class={cn('overflow-hidden border-l-4 shadow-sm', a.border, a.bg)}>
+				<CardHeader class="pb-2">
+					<p class="flex items-center gap-1.5 text-xs text-muted-foreground">
+						<span
+							class={cn('flex size-7 shrink-0 items-center justify-center rounded-md', a.iconBg)}
+							aria-hidden="true"
+						>
+							<Icon class={cn('size-3.5', a.iconText)} />
+						</span>
+						{card.label}
+					</p>
+					<CardTitle
+						class={cn('text-base font-semibold break-all', card.mono ? 'font-mono text-sm' : '')}
+					>
+						{card.value}
+					</CardTitle>
+				</CardHeader>
+				<CardContent>
+					<p class="line-clamp-2 text-xs text-muted-foreground">{card.description}</p>
+				</CardContent>
+			</Card>
+		{/each}
+	{/if}
+</div>
diff --git a/web/src/lib/components/modules/ModuleSummaryCard.svelte b/web/src/lib/components/modules/ModuleSummaryCard.svelte
new file mode 100644
index 0000000..a0b920e
--- /dev/null
+++ b/web/src/lib/components/modules/ModuleSummaryCard.svelte
@@ -0,0 +1,115 @@
+<script lang="ts">
+	import { resolve } from '$app/paths';
+	import type { AsEntry, CdnSource, DomainEntry, IpRangeEntry, ModuleRow } from '$lib/api/types.js';
+	import { Button } from '$lib/ui/core/button/index.js';
+	import {
+		Card,
+		CardContent,
+		CardHeader,
+		CardTitle,
+		CardDescription
+	} from '$lib/ui/core/card/index.js';
+
+	type Props = {
+		mod: ModuleRow;
+		asEntries: AsEntry[];
+		cdnSources: CdnSource[];
+		domainEntries: DomainEntry[];
+		ipEntries: IpRangeEntry[];
+	};
+
+	let { mod, asEntries, cdnSources, domainEntries, ipEntries }: Props = $props();
+
+	const asPrefixTotal = $derived(
+		asEntries.reduce((acc, entry) => acc + (entry.prefix_count ?? 0), 0)
+	);
+</script>
+
+<Card>
+	<CardHeader>
+		<CardTitle class="text-base">Операционный отчёт модуля</CardTitle>
+		<CardDescription>
+			Читаемая сводка по данным модуля: источники, объёмы и ожидаемый результат для
+			refresh/агрегации.
+		</CardDescription>
+	</CardHeader>
+	<CardContent class="grid gap-3 md:grid-cols-2">
+		{#if mod.type === 'DOMAINS'}
+			<div class="rounded-lg border p-3">
+				<p class="text-sm font-medium">Домены и ожидаемые IP</p>
+				<p class="text-xs text-muted-foreground">
+					После refresh домены резолвятся в IP и конвертируются в префиксы.
+				</p>
+				<div class="mt-2 space-y-1">
+					{#each domainEntries.slice(0, 8) as entry (entry.id)}
+						<p class="font-mono text-xs break-all">{entry.fqdn}</p>
+					{:else}
+						<p class="text-xs text-muted-foreground">Нет доменов</p>
+					{/each}
+					{#if domainEntries.length > 8}
+						<p class="text-xs text-muted-foreground">…и ещё {domainEntries.length - 8}</p>
+					{/if}
+				</div>
+			</div>
+		{:else if mod.type === 'AS_PREFIXES'}
+			<div class="rounded-lg border p-3">
+				<p class="text-sm font-medium">ASN и число полученных префиксов</p>
+				<p class="text-xs text-muted-foreground">
+					Счётчик префиксов обновляется после успешного refresh (RIPEstat).
+				</p>
+				<div class="mt-2 space-y-1">
+					<p class="text-xs">
+						Всего ASN: <span class="font-semibold">{asEntries.length}</span>
+					</p>
+					<p class="text-xs">
+						Сумма префиксов: <span class="font-semibold">{asPrefixTotal}</span>
+					</p>
+				</div>
+			</div>
+		{:else if mod.type === 'CDN_CIDRS'}
+			<div class="rounded-lg border p-3">
+				<p class="text-sm font-medium">CDN ссылки и импортируемые префиксы</p>
+				<p class="text-xs text-muted-foreground">
+					Каждый URL поставляет список CIDR для агрегации.
+				</p>
+				<div class="mt-2 space-y-1">
+					{#each cdnSources.slice(0, 6) as src (src.id)}
+						<p class="font-mono text-xs break-all">{src.url}</p>
+					{:else}
+						<p class="text-xs text-muted-foreground">Нет CDN источников</p>
+					{/each}
+					{#if cdnSources.length > 6}
+						<p class="text-xs text-muted-foreground">…и ещё {cdnSources.length - 6}</p>
+					{/if}
+				</div>
+			</div>
+		{:else if mod.type === 'IP_RANGES'}
+			<div class="rounded-lg border p-3">
+				<p class="text-sm font-medium">IP ranges для агрегации</p>
+				<p class="text-xs text-muted-foreground">
+					Статические CIDR, которые попадают в итоговую ревизию.
+				</p>
+				<div class="mt-2 space-y-1">
+					{#each ipEntries.slice(0, 8) as entry (entry.id)}
+						<p class="font-mono text-xs">{entry.prefix}</p>
+					{:else}
+						<p class="text-xs text-muted-foreground">Нет диапазонов</p>
+					{/each}
+					{#if ipEntries.length > 8}
+						<p class="text-xs text-muted-foreground">…и ещё {ipEntries.length - 8}</p>
+					{/if}
+				</div>
+			</div>
+		{/if}
+		<div class="rounded-lg border p-3">
+			<p class="text-sm font-medium">Результат операции</p>
+			<p class="text-xs text-muted-foreground">
+				Подробный результат по конкретному запуску refresh смотрите в Операции → Задачи →
+				module_refresh: там отображаются источники, количество префиксов и итог агрегации.
+			</p>
+			<Button variant="link" class="mt-2 h-auto p-0" href={resolve('/operations?tab=jobs')}>
+				Открыть задачи
+			</Button>
+		</div>
+	</CardContent>
+</Card>
diff --git a/web/src/lib/components/modules/module-helpers.ts b/web/src/lib/components/modules/module-helpers.ts
new file mode 100644
index 0000000..f8288f6
--- /dev/null
+++ b/web/src/lib/components/modules/module-helpers.ts
@@ -0,0 +1,60 @@
+import type { BgpCommunity, DohProfile, ModuleRow } from '$lib/api/types.js';
+
+export const NONE_OPTION = '__none__';
+
+export function supportsCsvIO(type: ModuleRow['type'] | null | undefined): boolean {
+	return type === 'AS_PREFIXES' || type === 'DOMAINS' || type === 'IP_RANGES';
+}
+
+export function sanitizeFilenamePart(v: string): string {
+	const cleaned = v
+		.trim()
+		.toLowerCase()
+		.replace(/[^a-z0-9._-]+/g, '-')
+		.replace(/-+/g, '-')
+		.replace(/^[-_.]+|[-_.]+$/g, '');
+	return cleaned || 'module';
+}
+
+export function communityLabel(id: string | null, communities: BgpCommunity[]): string {
+	if (!id) return '—';
+	const c = communities.find((x) => x.id === id);
+	if (!c) return id.slice(0, 8) + '…';
+	const t = c.title?.trim();
+	return t || c.community;
+}
+
+export function communityOptionLabel(c: BgpCommunity): string {
+	const t = c.title?.trim();
+	return t || c.community;
+}
+
+export function nullableSelectValue(value: string | null | undefined): string {
+	if (value === null || value === undefined || value === '') return NONE_OPTION;
+	return value;
+}
+
+export function fromNullableSelect(value: string): string | null {
+	if (value === NONE_OPTION || value === '') return null;
+	return value;
+}
+
+export function moduleDohProfileIds(modRow: ModuleRow | null): string[] {
+	if (!modRow) return [];
+	if (modRow.doh_profile_ids?.length) return modRow.doh_profile_ids;
+	return modRow.doh_profile_id ? [modRow.doh_profile_id] : [];
+}
+
+export function dohProfileLabel(id: string, dohProfiles: DohProfile[]): string {
+	const p = dohProfiles.find((d) => d.id === id);
+	return p ? (p.name?.trim() ? `${p.name} (${p.url})` : p.url) : id.slice(0, 8) + '…';
+}
+
+export function normalizeCdnSourceKind(k: string): 'plaintext' | 'json' {
+	return k.trim().toLowerCase() === 'json' ? 'json' : 'plaintext';
+}
+
+export function syncSelection(selected: Set<string>, existingIds: string[]): Set<string> {
+	const validIds = new Set(existingIds);
+	return new Set([...selected].filter((id) => validIds.has(id)));
+}
diff --git a/web/src/lib/ui-labels.ts b/web/src/lib/ui-labels.ts
index 79ca37d..3d74b04 100644
--- a/web/src/lib/ui-labels.ts
+++ b/web/src/lib/ui-labels.ts
@@ -43,6 +43,32 @@ export function jobKindFilterRu(kind: string): string {
 	}
 }
 
+/** Включён / выключен модуль (поле enabled). */
+export function moduleEnabledRu(enabled: boolean): string {
+	return enabled ? 'Вкл' : 'Выкл';
+}
+
+/** Variant Badge для enabled модуля. */
+export function moduleEnabledBadgeVariant(
+	enabled: boolean
+): 'default' | 'secondary' | 'outline' | 'destructive' {
+	return enabled ? 'default' : 'secondary';
+}
+
+/** Политика DoH-резолвера для модулей DOMAINS. */
+export function dohPolicyRu(policy: string | null | undefined): string {
+	switch (policy) {
+		case 'primary_only':
+			return 'Только первый';
+		case 'failover':
+			return 'Резервирование';
+		case 'union':
+			return 'Объединение';
+		default:
+			return 'Только первый';
+	}
+}
+
 export function moduleTypeRu(type: string): string {
 	switch (type) {
 		case 'AS_PREFIXES':
diff --git a/web/src/routes/modules/+page.svelte b/web/src/routes/modules/+page.svelte
index 20b0944..fcda6a4 100644
--- a/web/src/routes/modules/+page.svelte
+++ b/web/src/routes/modules/+page.svelte
@@ -1,70 +1,105 @@
 <script lang="ts">
 	import { onMount } from 'svelte';
-	import { apiJSON, apiMutate } from '$lib/api/client.js';
-	import type { ModuleRow, ModulesResponse, ModuleCreate } from '$lib/api/types.js';
-	import { Badge } from '$lib/components/ui/badge/index.js';
-	import { Button } from '$lib/components/ui/button/index.js';
-	import { Card, CardContent, CardHeader, CardTitle } from '$lib/components/ui/card/index.js';
-	import { Input } from '$lib/components/ui/input/index.js';
-	import { Label } from '$lib/components/ui/label/index.js';
-	import {
-		Dialog,
-		DialogContent,
-		DialogHeader,
-		DialogTitle,
-		DialogFooter,
-		DialogDescription
-	} from '$lib/components/ui/dialog/index.js';
-	import {
-		Select,
-		SelectContent,
-		SelectItem,
-		SelectTrigger
-	} from '$lib/components/ui/select/index.js';
-	import { Switch } from '$lib/components/ui/switch/index.js';
-	import { Checkbox } from '$lib/ui/core/checkbox/index.js';
-	import AppDataTable from '$lib/ui/patterns/data-table/app-data-table.svelte';
-	import PageHeader from '$lib/ui/app/page-header/page-header.svelte';
-	import { confirm } from '$lib/ui/patterns/confirm/confirm-state.svelte.js';
-	import { notify, notifyApiError } from '$lib/ui/app/toast.js';
 	import { resolve } from '$app/paths';
-	import Plus from '@lucide/svelte/icons/plus';
-	import RefreshCw from '@lucide/svelte/icons/refresh-cw';
-	import ExternalLink from '@lucide/svelte/icons/external-link';
-	import Trash2 from '@lucide/svelte/icons/trash-2';
-	import { moduleTypeRu } from '$lib/ui-labels.js';
+	import { apiJSON, apiMutate } from '$lib/api/client.js';
+	import type { ModuleRow, ModulesResponse } from '$lib/api/types.js';
 	import {
 		formatDateTime,
 		moduleIntervalLabel,
 		moduleTypeBadgeVariant
 	} from '$lib/modules/display.js';
+	import { moduleEnabledRu, moduleEnabledBadgeVariant, moduleTypeRu } from '$lib/ui-labels.js';
+	import { Badge } from '$lib/ui/core/badge/index.js';
+	import { Button } from '$lib/ui/core/button/index.js';
+	import {
+		Card,
+		CardContent,
+		CardHeader,
+		CardTitle,
+		CardDescription
+	} from '$lib/ui/core/card/index.js';
+	import { Alert, AlertDescription, AlertTitle } from '$lib/ui/core/alert/index.js';
+	import { Checkbox } from '$lib/ui/core/checkbox/index.js';
+	import AppDataTable from '$lib/ui/patterns/data-table/app-data-table.svelte';
+	import CardSkeleton from '$lib/ui/patterns/feedback/card-skeleton.svelte';
+	import PageHeader from '$lib/ui/app/page-header/page-header.svelte';
+	import { confirm } from '$lib/ui/patterns/confirm/confirm-state.svelte.js';
+	import { notify, notifyApiError } from '$lib/ui/app/toast.js';
+	import ModuleCreateDialog from '$lib/components/modules/ModuleCreateDialog.svelte';
+	import { cn } from '$lib/utils.js';
+	import Plus from '@lucide/svelte/icons/plus';
+	import RefreshCw from '@lucide/svelte/icons/refresh-cw';
+	import ExternalLink from '@lucide/svelte/icons/external-link';
+	import Trash2 from '@lucide/svelte/icons/trash-2';
 	import Boxes from '@lucide/svelte/icons/boxes';
+	import Info from '@lucide/svelte/icons/info';
+	import CheckCircle2 from '@lucide/svelte/icons/check-circle-2';
+	import CircleOff from '@lucide/svelte/icons/circle-off';
 
 	let rows = $state<ModuleRow[]>([]);
 	let loading = $state(false);
+	let initialLoading = $state(true);
 	let dialogOpen = $state(false);
-	let saving = $state(false);
-	let selectedModuleIds = $state(new Set<string>());
 	let deletingBulkModules = $state(false);
+	let selectedModuleIds = $state(new Set<string>());
+	let lastUpdated = $state<Date | null>(null);
 
 	const selectedModulesCount = $derived(selectedModuleIds.size);
 	const allModulesSelected = $derived(rows.length > 0 && selectedModuleIds.size === rows.length);
-	const someModulesSelected = $derived(selectedModuleIds.size > 0 && !allModulesSelected);
+	const enabledCount = $derived(rows.filter((m) => m.enabled).length);
+	const disabledCount = $derived(rows.filter((m) => !m.enabled).length);
 
-	let form = $state<ModuleCreate>({
-		type: 'AS_PREFIXES',
-		name: '',
-		enabled: true,
-		priority: 0
-	});
-
-	const moduleTypes = [
-		{ value: 'AS_PREFIXES', label: 'AS (номера)' },
-		{ value: 'CDN_CIDRS', label: 'CDN CIDRs' },
-		{ value: 'DOMAINS', label: 'Домены' },
-		{ value: 'IP_RANGES', label: 'IP Ranges' }
+	const statAccents = [
+		{
+			border: 'border-l-chart-1',
+			bg: 'bg-chart-1/5',
+			iconBg: 'bg-chart-1/15',
+			iconText: 'text-chart-1'
+		},
+		{
+			border: 'border-l-chart-2',
+			bg: 'bg-chart-2/5',
+			iconBg: 'bg-chart-2/15',
+			iconText: 'text-chart-2'
+		},
+		{
+			border: 'border-l-chart-4',
+			bg: 'bg-chart-4/5',
+			iconBg: 'bg-chart-4/15',
+			iconText: 'text-chart-4'
+		}
 	] as const;
 
+	const kpiCards = $derived.by(() => [
+		{
+			id: 'total',
+			label: 'Всего модулей',
+			value: initialLoading ? '—' : String(rows.length),
+			description: 'AS, CDN, домены, IP',
+			icon: Boxes,
+			accent: statAccents[0],
+			badge: 'в системе'
+		},
+		{
+			id: 'enabled',
+			label: 'Включено',
+			value: initialLoading ? '—' : String(enabledCount),
+			description: 'участвуют в ревизиях',
+			icon: CheckCircle2,
+			accent: statAccents[1],
+			badge: 'активных'
+		},
+		{
+			id: 'disabled',
+			label: 'Выключено',
+			value: initialLoading ? '—' : String(disabledCount),
+			description: disabledCount > 0 ? 'не участвуют в сборке' : 'все модули включены',
+			icon: CircleOff,
+			accent: statAccents[2],
+			badge: disabledCount > 0 ? 'отключены' : 'нет отключённых'
+		}
+	]);
+
 	const moduleColumns = [
 		{ id: 'select', label: '', class: 'w-10' },
 		{ id: 'name', label: 'Название', sortable: true, sortValue: (m: ModuleRow) => m.name },
@@ -87,40 +122,23 @@
 	] as const;
 
 	async function load() {
-		loading = true;
+		if (!initialLoading) loading = true;
 		try {
 			const m = await apiJSON<ModulesResponse>('/v1/modules?limit=200');
 			rows = m.items ?? [];
 			const validIds = new Set(rows.map((item) => item.id));
 			selectedModuleIds = new Set([...selectedModuleIds].filter((id) => validIds.has(id)));
+			lastUpdated = new Date();
 		} catch (e) {
 			notifyApiError(e);
 		} finally {
 			loading = false;
+			initialLoading = false;
 		}
 	}
 
 	onMount(load);
 
-	async function create() {
-		if (!form.name.trim()) {
-			notify.error('Укажите название модуля');
-			return;
-		}
-		saving = true;
-		try {
-			await apiMutate('/v1/modules', 'POST', form);
-			notify.success('Модуль создан');
-			dialogOpen = false;
-			form = { type: 'AS_PREFIXES', name: '', enabled: true, priority: 0 };
-			await load();
-		} catch (e) {
-			notifyApiError(e);
-		} finally {
-			saving = false;
-		}
-	}
-
 	function toggleModuleSelection(id: string) {
 		const next = new Set(selectedModuleIds);
 		if (next.has(id)) next.delete(id);
@@ -169,7 +187,9 @@
 <div class="flex flex-col gap-6">
 	<PageHeader
 		title="Модули префиксов"
-		description="Управление модулями — AS, CDN, домены, IP-диапазоны."
+		description={lastUpdated
+			? `Управление модулями — AS, CDN, домены, IP-диапазоны. Обновлено: ${lastUpdated.toLocaleTimeString('ru-RU')}`
+			: 'Управление модулями — AS, CDN, домены, IP-диапазоны.'}
 		icon={Boxes}
 		iconClass="bg-chart-1/15 text-chart-1"
 	>
@@ -185,9 +205,55 @@
 		{/snippet}
 	</PageHeader>
 
+	<Alert class="border-info/30 bg-info/5">
+		<Info class="text-info" />
+		<AlertTitle>О модулях префиксов</AlertTitle>
+		<AlertDescription>
+			Модули собирают префиксы из AS (RIPEstat), CDN URL, доменов (DoH) и статических CIDR.
+			Расписание и ручной refresh — на странице
+			<Button variant="link" class="h-auto p-0" href={resolve('/schedule')}>Расписание</Button>.
+			Результаты обновления и ревизии — в
+			<Button variant="link" class="h-auto p-0" href={resolve('/operations')}>Операциях</Button>.
+		</AlertDescription>
+	</Alert>
+
+	<div class="grid gap-4 sm:grid-cols-3">
+		{#if initialLoading}
+			{#each Array(3) as _, i (i)}
+				<CardSkeleton />
+			{/each}
+		{:else}
+			{#each kpiCards as card (card.id)}
+				{@const Icon = card.icon}
+				{@const a = card.accent}
+				<Card class={cn('overflow-hidden border-l-4 shadow-sm', a.border, a.bg)}>
+					<CardHeader class="pb-2">
+						<CardDescription class="flex min-w-0 items-center gap-2">
+							<span
+								class={cn('flex size-9 shrink-0 items-center justify-center rounded-lg', a.iconBg)}
+								aria-hidden="true"
+							>
+								<Icon class={cn('size-4', a.iconText)} />
+							</span>
+							<span class="truncate">{card.label}</span>
+						</CardDescription>
+						<CardTitle class="text-3xl font-bold tabular-nums">{card.value}</CardTitle>
+					</CardHeader>
+					<CardContent class="space-y-2">
+						<Badge variant="outline">{card.badge}</Badge>
+						<p class="text-xs text-muted-foreground">{card.description}</p>
+					</CardContent>
+				</Card>
+			{/each}
+		{/if}
+	</div>
+
 	<Card>
 		<CardHeader class="flex flex-wrap items-center justify-between gap-2 border-b py-3">
-			<CardTitle class="text-base">Список модулей</CardTitle>
+			<div>
+				<CardTitle class="text-base">Список модулей</CardTitle>
+				<CardDescription>Клик по названию открывает карточку модуля и его записи.</CardDescription>
+			</div>
 			{#if selectedModulesCount > 0}
 				<div class="flex flex-wrap items-center gap-2">
 					<span class="text-sm text-muted-foreground">Выбрано: {selectedModulesCount}</span>
@@ -208,10 +274,22 @@
 				columns={[...moduleColumns]}
 				{rows}
 				rowKey={(m) => m.id}
-				{loading}
+				loading={initialLoading || loading}
 				emptyTitle="Нет модулей"
 				emptyDescription="Создайте первый модуль."
 			>
+				{#snippet toolbar()}
+					{#if rows.length > 0}
+						<div class="flex items-center gap-2">
+							<Checkbox
+								checked={allModulesSelected}
+								onCheckedChange={(v) => toggleAllModules(v === true)}
+								aria-label="Выбрать все модули"
+							/>
+							<span class="text-sm text-muted-foreground">Выбрать все</span>
+						</div>
+					{/if}
+				{/snippet}
 				{#snippet cell({ row: m, column })}
 					{#if column.id === 'select'}
 						<Checkbox
@@ -220,7 +298,12 @@
 							onCheckedChange={() => toggleModuleSelection(m.id)}
 						/>
 					{:else if column.id === 'name'}
-						<span class="font-medium">{m.name}</span>
+						<div class="flex items-center gap-2">
+							<span class="font-medium">{m.name}</span>
+							<Button variant="ghost" size="icon-sm" href={resolve(`/modules/${m.id}`)}>
+								<ExternalLink class="size-3.5" aria-hidden="true" />
+							</Button>
+						</div>
 					{:else if column.id === 'type'}
 						<Badge variant={moduleTypeBadgeVariant(m.type)}>{moduleTypeRu(m.type)}</Badge>
 					{:else if column.id === 'priority'}
@@ -232,11 +315,9 @@
 							>{formatDateTime(m.last_refreshed_at)}</span
 						>
 					{:else if column.id === 'status'}
-						{#if m.enabled}
-							<Badge variant="default" class="text-xs">вкл</Badge>
-						{:else}
-							<Badge variant="secondary" class="text-xs">выкл</Badge>
-						{/if}
+						<Badge variant={moduleEnabledBadgeVariant(!!m.enabled)} class="text-xs">
+							{moduleEnabledRu(!!m.enabled)}
+						</Badge>
 					{:else if column.id === 'actions'}
 						<Button variant="ghost" size="icon-sm" href={resolve(`/modules/${m.id}`)}>
 							<ExternalLink class="size-3.5" />
@@ -248,74 +329,4 @@
 	</Card>
 </div>
 
-<!-- Create Dialog -->
-<Dialog bind:open={dialogOpen}>
-	<DialogContent class="sm:max-w-md">
-		<DialogHeader>
-			<DialogTitle>Новый модуль</DialogTitle>
-			<DialogDescription>Создание нового модуля префиксов.</DialogDescription>
-		</DialogHeader>
-		<div class="space-y-4 py-2">
-			<div class="space-y-1.5">
-				<Label for="m-name">Название</Label>
-				<Input id="m-name" bind:value={form.name} placeholder="my-asn-module" />
-			</div>
-			<div class="space-y-1.5">
-				<Label for="m-type">Тип</Label>
-				<Select
-					type="single"
-					value={form.type}
-					onValueChange={(v) => {
-						if (v) form.type = v as typeof form.type;
-					}}
-				>
-					<SelectTrigger id="m-type" class="w-full">
-						{moduleTypes.find((t) => t.value === form.type)?.label ?? 'Выберите тип'}
-					</SelectTrigger>
-					<SelectContent>
-						{#each moduleTypes as t (t.value)}
-							<SelectItem value={t.value}>{t.label}</SelectItem>
-						{/each}
-					</SelectContent>
-				</Select>
-			</div>
-			<div class="grid grid-cols-2 gap-4">
-				<div class="space-y-1.5">
-					<Label for="m-priority">Приоритет</Label>
-					<Input id="m-priority" type="number" bind:value={form.priority} />
-				</div>
-				<div class="space-y-1.5">
-					<Label for="m-interval">Интервал (сек)</Label>
-					<Input
-						id="m-interval"
-						type="number"
-						placeholder="3600"
-						bind:value={form.refresh_interval_sec}
-					/>
-				</div>
-			</div>
-			<div
-				class="flex flex-row items-center justify-between gap-4 rounded-lg border border-border bg-muted/30 p-3"
-			>
-				<div class="grid min-w-0 flex-1 gap-1 pr-2">
-					<Label for="m-enabled" class="leading-snug text-foreground">Включён</Label>
-					<p class="text-xs leading-snug text-muted-foreground">
-						Модуль участвует в сборке ревизий, если включён.
-					</p>
-				</div>
-				<Switch
-					id="m-enabled"
-					class="shrink-0"
-					checked={form.enabled !== false}
-					onCheckedChange={(v) => {
-						form = { ...form, enabled: v };
-					}}
-				/>
-			</div>
-		</div>
-		<DialogFooter>
-			<Button variant="outline" onclick={() => (dialogOpen = false)}>Отмена</Button>
-			<Button onclick={create} disabled={saving}>{saving ? 'Создание…' : 'Создать'}</Button>
-		</DialogFooter>
-	</DialogContent>
-</Dialog>
+<ModuleCreateDialog bind:open={dialogOpen} onClose={() => {}} onCreated={load} />
diff --git a/web/src/routes/modules/[moduleId]/+page.svelte b/web/src/routes/modules/[moduleId]/+page.svelte
index 337bd8d..6d87bec 100644
--- a/web/src/routes/modules/[moduleId]/+page.svelte
+++ b/web/src/routes/modules/[moduleId]/+page.svelte
@@ -3,270 +3,83 @@
 	import { page } from '$app/state';
 	import { goto } from '$app/navigation';
 	import { resolve } from '$app/paths';
-	import { apiFetch, apiJSON, apiMutate } from '$lib/api/client.js';
+	import { apiJSON, apiMutate } from '$lib/api/client.js';
 	import type {
 		ModuleRow,
-		ModulePatch,
-		DohResolverPolicy,
+		DohProfile,
 		AsEntry,
-		AsEntryCreate,
-		AsEntryPatch,
 		AsEntriesResponse,
 		CdnSource,
-		CdnSourceCreate,
 		CdnSourcesResponse,
-		CdnPreviewResponse,
 		DomainEntry,
-		DomainEntryCreate,
 		DomainEntriesResponse,
 		IpRangeEntry,
-		IpRangeEntryCreate,
 		IpRangeEntriesResponse,
 		BgpCommunity,
 		CommunitiesResponse,
-		DohProfile,
 		DohProfilesResponse
 	} from '$lib/api/types.js';
-	import { Badge } from '$lib/components/ui/badge/index.js';
-	import { Button } from '$lib/components/ui/button/index.js';
-	import {
-		Card,
-		CardContent,
-		CardHeader,
-		CardTitle,
-		CardDescription
-	} from '$lib/components/ui/card/index.js';
-	import { Input } from '$lib/components/ui/input/index.js';
-	import { Label } from '$lib/components/ui/label/index.js';
-	import { Tabs, TabsContent, TabsList, TabsTrigger } from '$lib/components/ui/tabs/index.js';
-	import {
-		Dialog,
-		DialogContent,
-		DialogHeader,
-		DialogTitle,
-		DialogFooter,
-		DialogDescription
-	} from '$lib/components/ui/dialog/index.js';
-	import {
-		AlertDialog,
-		AlertDialogContent,
-		AlertDialogHeader,
-		AlertDialogTitle,
-		AlertDialogDescription,
-		AlertDialogFooter,
-		AlertDialogCancel,
-		AlertDialogAction
-	} from '$lib/components/ui/alert-dialog/index.js';
-	import {
-		Select,
-		SelectContent,
-		SelectItem,
-		SelectTrigger
-	} from '$lib/components/ui/select/index.js';
-	import { Switch } from '$lib/components/ui/switch/index.js';
-	import { Checkbox } from '$lib/components/ui/checkbox/index.js';
-	import {
-		Table,
-		TableBody,
-		TableCell,
-		TableHead,
-		TableHeader,
-		TableRow
-	} from '$lib/components/ui/table/index.js';
-	import { toast } from 'svelte-sonner';
-	import ArrowLeft from '@lucide/svelte/icons/arrow-left';
-	import Plus from '@lucide/svelte/icons/plus';
-	import Pencil from '@lucide/svelte/icons/pencil';
-	import Trash2 from '@lucide/svelte/icons/trash-2';
-	import RefreshCw from '@lucide/svelte/icons/refresh-cw';
-	import Save from '@lucide/svelte/icons/save';
-	import Upload from '@lucide/svelte/icons/upload';
-	import Download from '@lucide/svelte/icons/download';
-	import Blocks from '@lucide/svelte/icons/blocks';
-	import PageHeader from '$lib/ui/app/page-header/page-header.svelte';
-	import ArrowDownUp from '@lucide/svelte/icons/arrow-down-up';
-	import Timer from '@lucide/svelte/icons/timer';
-	import ShieldCheck from '@lucide/svelte/icons/shield-check';
-	import Network from '@lucide/svelte/icons/network';
 	import { moduleTypeRu } from '$lib/ui-labels.js';
+	import { Alert, AlertDescription, AlertTitle } from '$lib/ui/core/alert/index.js';
+	import { Button } from '$lib/ui/core/button/index.js';
+	import EmptyState from '$lib/ui/patterns/empty-state/empty-state.svelte';
+	import { confirm } from '$lib/ui/patterns/confirm/confirm-state.svelte.js';
+	import { notify, notifyApiError } from '$lib/ui/app/toast.js';
+	import ModuleDetailHeader from '$lib/components/modules/ModuleDetailHeader.svelte';
+	import ModuleKpiCards from '$lib/components/modules/ModuleKpiCards.svelte';
+	import ModuleSummaryCard from '$lib/components/modules/ModuleSummaryCard.svelte';
+	import ModuleEditDialog from '$lib/components/modules/ModuleEditDialog.svelte';
+	import ModuleAsEntriesCard from '$lib/components/modules/ModuleAsEntriesCard.svelte';
+	import ModuleCdnSourcesCard from '$lib/components/modules/ModuleCdnSourcesCard.svelte';
+	import ModuleDomainEntriesCard from '$lib/components/modules/ModuleDomainEntriesCard.svelte';
+	import ModuleIpRangesCard from '$lib/components/modules/ModuleIpRangesCard.svelte';
+	import Info from '@lucide/svelte/icons/info';
 
-	const dohPolicyOptions: { value: DohResolverPolicy; label: string; hint: string }[] = [
-		{
-			value: 'primary_only',
-			label: 'Только первый',
-			hint: 'Используется первый выбранный DoH-профиль.'
-		},
-		{
-			value: 'failover',
-			label: 'Резервирование',
-			hint: 'Профили по порядку до первого успешного ответа.'
-		},
-		{
-			value: 'union',
-			label: 'Объединение',
-			hint: 'Все A/AAAA со всех профилей (geo-split DNS).'
-		}
-	];
-
-	function dohPolicyLabel(policy: DohResolverPolicy | null | undefined): string {
-		return dohPolicyOptions.find((o) => o.value === policy)?.label ?? 'Только первый';
-	}
-
-	function moduleDohProfileIds(modRow: ModuleRow | null): string[] {
-		if (!modRow) return [];
-		if (modRow.doh_profile_ids?.length) return modRow.doh_profile_ids;
-		return modRow.doh_profile_id ? [modRow.doh_profile_id] : [];
-	}
-
-	function dohProfileLabel(id: string): string {
-		const p = dohProfiles.find((d) => d.id === id);
-		return p ? (p.name?.trim() ? `${p.name} (${p.url})` : p.url) : id.slice(0, 8) + '…';
-	}
-
-	function toggleEditDohProfile(id: string, checked: boolean) {
-		let ids = [...(editForm.doh_profile_ids ?? [])];
-		if (checked) {
-			if (!ids.includes(id)) ids.push(id);
-		} else {
-			ids = ids.filter((x) => x !== id);
-		}
-		editForm = { ...editForm, doh_profile_ids: ids };
-	}
-
-	function isEditDohProfileSelected(id: string): boolean {
-		return (editForm.doh_profile_ids ?? []).includes(id);
-	}
-
-	const moduleId = $derived(page.params.moduleId);
+	const moduleId = $derived(page.params.moduleId ?? '');
 
 	let mod = $state<ModuleRow | null>(null);
 	let communities = $state<BgpCommunity[]>([]);
 	let dohProfiles = $state<DohProfile[]>([]);
-	let loadingMod = $state(true);
-
-	// AS entries
 	let asEntries = $state<AsEntry[]>([]);
-	let asDialog = $state(false);
-	let asEdit = $state<AsEntry | null>(null);
-	let asForm = $state<AsEntryCreate>({ asn: 0, community_id: null });
-	let asSaving = $state(false);
-	let asDeleteTarget = $state<AsEntry | null>(null);
-	let selectedAsIds = $state(new Set<string>());
-	let asBulkDeleteDialog = $state(false);
-	let deletingAsBulk = $state(false);
-
-	// CDN sources
 	let cdnSources = $state<CdnSource[]>([]);
-	let cdnDialog = $state(false);
-	let cdnEdit = $state<CdnSource | null>(null);
-	let cdnForm = $state<CdnSourceCreate & { refresh_interval_sec?: number | null }>({
-		url: '',
-		source_kind: 'plaintext',
-		prefix_path: '',
-		community_id: null
-	});
-	let cdnSaving = $state(false);
-	let cdnDeleteTarget = $state<CdnSource | null>(null);
-	let cdnPreviewLoading = $state(false);
-	let cdnPreviewItems = $state<string[]>([]);
-	let cdnPreviewTotal = $state(0);
-	let cdnPreviewTruncated = $state(false);
-	let cdnPreviewError = $state<string | null>(null);
-	let cdnPreviewOk = $state(false);
-	let selectedCdnIds = $state(new Set<string>());
-	let cdnBulkDeleteDialog = $state(false);
-	let deletingCdnBulk = $state(false);
-
-	// Domain entries
 	let domainEntries = $state<DomainEntry[]>([]);
-	let domainDialog = $state(false);
-	let domainEdit = $state<DomainEntry | null>(null);
-	let domainForm = $state<DomainEntryCreate>({ fqdn: '', community_id: null });
-	let domainSaving = $state(false);
-	let domainDeleteTarget = $state<DomainEntry | null>(null);
-	let selectedDomainIds = $state(new Set<string>());
-	let domainBulkDeleteDialog = $state(false);
-	let deletingDomainBulk = $state(false);
-
-	// IP Range entries
 	let ipEntries = $state<IpRangeEntry[]>([]);
-	let ipDialog = $state(false);
-	let ipEdit = $state<IpRangeEntry | null>(null);
-	let ipForm = $state<IpRangeEntryCreate>({ prefix: '', community_id: '' });
-	let ipSaving = $state(false);
-	let ipDeleteTarget = $state<IpRangeEntry | null>(null);
-	let selectedIpIds = $state(new Set<string>());
-	let ipBulkDeleteDialog = $state(false);
-	let deletingIpBulk = $state(false);
-
-	// Module edit
+	let loadingMod = $state(true);
+	let entriesLoading = $state(false);
 	let editDialog = $state(false);
-	let editForm = $state<ModulePatch>({});
-	let editSaving = $state(false);
-	let deleteModDialog = $state(false);
-	let deletingMod = $state(false);
-
-	// Refresh
 	let refreshing = $state(false);
-	let csvImporting = $state(false);
-	let csvExporting = $state(false);
-	let csvFileInput = $state<HTMLInputElement | null>(null);
-	const NONE_OPTION = '__none__';
-	const selectedAsCount = $derived(selectedAsIds.size);
-	const selectedCdnCount = $derived(selectedCdnIds.size);
-	const selectedDomainCount = $derived(selectedDomainIds.size);
-	const selectedIpCount = $derived(selectedIpIds.size);
-	const allAsSelected = $derived(asEntries.length > 0 && selectedAsIds.size === asEntries.length);
-	const allCdnSelected = $derived(
-		cdnSources.length > 0 && selectedCdnIds.size === cdnSources.length
-	);
-	const allDomainSelected = $derived(
-		domainEntries.length > 0 && selectedDomainIds.size === domainEntries.length
-	);
-	const allIpSelected = $derived(ipEntries.length > 0 && selectedIpIds.size === ipEntries.length);
-	const someAsSelected = $derived(selectedAsIds.size > 0 && !allAsSelected);
-	const someCdnSelected = $derived(selectedCdnIds.size > 0 && !allCdnSelected);
-	const someDomainSelected = $derived(selectedDomainIds.size > 0 && !allDomainSelected);
-	const someIpSelected = $derived(selectedIpIds.size > 0 && !allIpSelected);
 
-	function syncSelection(selected: Set<string>, existingIds: string[]): Set<string> {
-		const validIds = new Set(existingIds);
-		return new Set([...selected].filter((id) => validIds.has(id)));
-	}
-
-	function supportsCsvIO(type: ModuleRow['type'] | null | undefined): boolean {
-		return type === 'AS_PREFIXES' || type === 'DOMAINS' || type === 'IP_RANGES';
-	}
-
-	function sanitizeFilenamePart(v: string): string {
-		const cleaned = v
-			.trim()
-			.toLowerCase()
-			.replace(/[^a-z0-9._-]+/g, '-')
-			.replace(/-+/g, '-')
-			.replace(/^[-_.]+|[-_.]+$/g, '');
-		return cleaned || 'module';
-	}
-
-	async function readErrorText(res: Response): Promise<string> {
-		const body = (await res.text()).trim();
-		return body || `HTTP ${res.status}`;
-	}
+	const typeAlertText = $derived.by(() => {
+		if (!mod) return '';
+		switch (mod.type) {
+			case 'AS_PREFIXES':
+				return 'Модуль AS получает префиксы через RIPEstat по указанным ASN. После refresh счётчики префиксов обновляются в таблице записей.';
+			case 'CDN_CIDRS':
+				return 'Модуль CDN скачивает списки CIDR по URL (plaintext или JSON). Используйте предпросмотр при добавлении источника.';
+			case 'DOMAINS':
+				return 'Модуль доменов резолвит FQDN через DoH-профили и конвертирует IP в префиксы. Политика и профили настраиваются в редактировании модуля.';
+			case 'IP_RANGES':
+				return 'Модуль IP-диапазонов использует статические CIDR без внешнего refresh (сервер может вернуть 204). Записи участвуют в агрегации напрямую.';
+			default:
+				return '';
+		}
+	});
 
 	async function loadMod() {
+		if (!moduleId) return;
 		loadingMod = true;
 		try {
 			mod = await apiJSON<ModuleRow>(`/v1/modules/${moduleId}`);
 			await loadEntries();
 		} catch (e) {
-			toast.error(e instanceof Error ? e.message : String(e));
+			mod = null;
+			notifyApiError(e);
 		} finally {
 			loadingMod = false;
 		}
 	}
 
-	async function loadEntries() {
-		if (!mod) return;
+	async function loadCommunitiesAndDoh() {
 		try {
 			[communities, dohProfiles] = await Promise.all([
 				apiJSON<CommunitiesResponse>('/v1/communities?limit=200').then((r) => r.items),
@@ -275,1781 +88,175 @@
 		} catch {
 			/* non-critical */
 		}
+	}
 
+	async function loadEntries() {
+		if (!mod || !moduleId) return;
+		entriesLoading = true;
+		await loadCommunitiesAndDoh();
 		const type = mod.type;
 		try {
 			if (type === 'AS_PREFIXES') {
 				const r = await apiJSON<AsEntriesResponse>(`/v1/modules/${moduleId}/as-entries?limit=500`);
 				asEntries = r.items;
-				selectedAsIds = syncSelection(
-					selectedAsIds,
-					asEntries.map((entry) => entry.id)
-				);
 			} else if (type === 'CDN_CIDRS') {
 				const r = await apiJSON<CdnSourcesResponse>(
 					`/v1/modules/${moduleId}/cdn-sources?limit=200`
 				);
 				cdnSources = r.items;
-				selectedCdnIds = syncSelection(
-					selectedCdnIds,
-					cdnSources.map((entry) => entry.id)
-				);
 			} else if (type === 'DOMAINS') {
 				const r = await apiJSON<DomainEntriesResponse>(
 					`/v1/modules/${moduleId}/domain-entries?limit=500`
 				);
 				domainEntries = r.items;
-				selectedDomainIds = syncSelection(
-					selectedDomainIds,
-					domainEntries.map((entry) => entry.id)
-				);
 			} else if (type === 'IP_RANGES') {
 				const r = await apiJSON<IpRangeEntriesResponse>(
 					`/v1/modules/${moduleId}/ip-range-entries?limit=500`
 				);
 				ipEntries = r.items;
-				selectedIpIds = syncSelection(
-					selectedIpIds,
-					ipEntries.map((entry) => entry.id)
-				);
 			}
 		} catch (e) {
-			toast.error(e instanceof Error ? e.message : String(e));
+			notifyApiError(e);
+		} finally {
+			entriesLoading = false;
 		}
 	}
 
 	onMount(loadMod);
 
-	function normalizeCdnSourceKind(k: string): 'plaintext' | 'json' {
-		return k.trim().toLowerCase() === 'json' ? 'json' : 'plaintext';
-	}
-
-	function clearCdnPreview() {
-		cdnPreviewLoading = false;
-		cdnPreviewItems = [];
-		cdnPreviewTotal = 0;
-		cdnPreviewTruncated = false;
-		cdnPreviewError = null;
-		cdnPreviewOk = false;
-	}
-
-	// --- Module Actions ---
-	async function openEditMod() {
-		if (!mod) return;
-		editForm = {
-			name: mod.name,
-			enabled: mod.enabled,
-			priority: mod.priority,
-			refresh_interval_sec: mod.refresh_interval_sec,
-			cron_expr: mod.cron_expr,
-			default_community_id: mod.default_community_id,
-			doh_profile_ids: moduleDohProfileIds(mod),
-			doh_resolver_policy: mod.doh_resolver_policy ?? 'primary_only'
-		};
-		editDialog = true;
-	}
-
-	async function saveMod() {
-		editSaving = true;
-		try {
-			const cron =
-				typeof editForm.cron_expr === 'string' ? editForm.cron_expr.trim() : editForm.cron_expr;
-			const intervalRaw = editForm.refresh_interval_sec;
-			const interval =
-				intervalRaw === null || intervalRaw === undefined ? null : Number(intervalRaw);
-			const payload: ModulePatch = {
-				...editForm,
-				cron_expr: cron ? cron : null,
-				refresh_interval_sec: Number.isFinite(interval) ? interval : null,
-				default_community_id: fromNullableSelect(
-					nullableSelectValue(editForm.default_community_id)
-				),
-				doh_profile_ids: editForm.doh_profile_ids ?? [],
-				doh_resolver_policy: editForm.doh_resolver_policy ?? 'primary_only'
-			};
-			await apiMutate<ModuleRow>(`/v1/modules/${moduleId}`, 'PATCH', payload);
-			await loadMod();
-			toast.success('Модуль обновлён');
-			editDialog = false;
-		} catch (e) {
-			toast.error(e instanceof Error ? e.message : String(e));
-		} finally {
-			editSaving = false;
-		}
-	}
-
-	async function deleteMod() {
-		deletingMod = true;
-		try {
-			await apiMutate(`/v1/modules/${moduleId}`, 'DELETE', undefined, { idempotent: false });
-			toast.success('Модуль удалён');
-			goto(resolve('/modules'));
-		} catch (e) {
-			toast.error(e instanceof Error ? e.message : String(e));
-			deletingMod = false;
-		}
-	}
-
 	async function refreshMod() {
+		if (!moduleId) return;
 		refreshing = true;
 		try {
-			const res = await fetch(`/v1/modules/${moduleId}/refresh`, {
-				method: 'POST',
-				headers: { Authorization: `Bearer ${localStorage.getItem('evobgp_api_token') ?? ''}` }
-			});
-			if (res.status === 202) toast.success('Задача поставлена в очередь (render ревизии)');
-			else toast.error(`HTTP ${res.status}`);
+			const result = await apiMutate<{ job_id?: string }>(
+				`/v1/modules/${moduleId}/refresh`,
+				'POST'
+			);
+			if (result === undefined) {
+				notify.message('Обновление не требуется (тип IP_RANGES)');
+			} else {
+				notify.success('Задача поставлена в очередь');
+			}
 		} catch (e) {
-			toast.error(e instanceof Error ? e.message : String(e));
+			notifyApiError(e);
 		} finally {
 			refreshing = false;
 		}
 	}
 
-	async function exportEntriesCsv() {
-		if (!mod || !supportsCsvIO(mod.type) || csvExporting) return;
-		csvExporting = true;
+	function requestDeleteMod() {
+		if (!mod) return;
+		void confirm({
+			title: `Удалить модуль «${mod.name}»?`,
+			description: 'Это действие необратимо. Модуль и все его записи будут удалены.',
+			confirmLabel: 'Удалить',
+			destructive: true,
+			onConfirm: deleteMod
+		});
+	}
+
+	async function deleteMod() {
+		if (!moduleId) return;
 		try {
-			const res = await apiFetch(`/v1/modules/${moduleId}/entries.csv`, {
-				method: 'GET',
-				headers: { Accept: 'text/csv' }
-			});
-			if (!res.ok) {
-				toast.error(await readErrorText(res));
-				return;
-			}
-			const blob = await res.blob();
-			const url = URL.createObjectURL(blob);
-			const a = document.createElement('a');
-			const safeModuleName = sanitizeFilenamePart(mod.name);
-			a.href = url;
-			a.download = `${safeModuleName}-${mod.type.toLowerCase()}-entries.csv`;
-			document.body.appendChild(a);
-			a.click();
-			a.remove();
-			URL.revokeObjectURL(url);
+			await apiMutate(`/v1/modules/${moduleId}`, 'DELETE', undefined, { idempotent: false });
+			notify.success('Модуль удалён');
+			goto(resolve('/modules'));
 		} catch (e) {
-			toast.error(e instanceof Error ? e.message : String(e));
-		} finally {
-			csvExporting = false;
+			notifyApiError(e);
 		}
 	}
 
-	function openImportCsvPicker() {
-		if (!mod || !supportsCsvIO(mod.type) || csvImporting) return;
-		csvFileInput?.click();
+	async function handleSaved() {
+		await loadMod();
 	}
-
-	async function handleImportCsvChange(event: Event) {
-		const input = event.currentTarget as HTMLInputElement | null;
-		const file = input?.files?.[0];
-		if (!mod || !supportsCsvIO(mod.type) || !file || csvImporting) return;
-		csvImporting = true;
-		try {
-			const fileText = await file.text();
-			const res = await apiFetch(`/v1/modules/${moduleId}/entries.csv`, {
-				method: 'POST',
-				headers: { 'Content-Type': 'text/csv' },
-				body: fileText
-			});
-			if (!res.ok) {
-				toast.error(await readErrorText(res));
-				return;
-			}
-			const payload = (await res.json()) as { imported?: number };
-			toast.success(`Импортировано записей: ${payload.imported ?? 0}`);
-			await loadEntries();
-		} catch (e) {
-			toast.error(e instanceof Error ? e.message : String(e));
-		} finally {
-			csvImporting = false;
-			if (input) input.value = '';
-		}
-	}
-
-	// --- AS Entries ---
-	function openAsCreate() {
-		asEdit = null;
-		asForm = { asn: 0, community_id: null };
-		asDialog = true;
-	}
-	function openAsEdit(entry: AsEntry) {
-		asEdit = entry;
-		asForm = { asn: entry.asn, community_id: entry.community_id };
-		asDialog = true;
-	}
-	async function saveAs() {
-		const asn = Number(asForm.asn);
-		if (!Number.isFinite(asn) || asn < 1 || asn > 4294967295) {
-			toast.error('Укажите корректный ASN (1–4294967295)');
-			return;
-		}
-		asSaving = true;
-		try {
-			const body: AsEntryCreate | AsEntryPatch = { asn, community_id: asForm.community_id };
-			if (asEdit) {
-				await apiMutate(`/v1/modules/${moduleId}/as-entries/${asEdit.id}`, 'PATCH', body);
-				toast.success('Запись обновлена');
-			} else {
-				await apiMutate(`/v1/modules/${moduleId}/as-entries`, 'POST', body as AsEntryCreate);
-				toast.success('Запись добавлена');
-			}
-			asDialog = false;
-			await loadEntries();
-		} catch (e) {
-			toast.error(e instanceof Error ? e.message : String(e));
-		} finally {
-			asSaving = false;
-		}
-	}
-	async function deleteAs() {
-		if (!asDeleteTarget) return;
-		try {
-			await apiMutate(
-				`/v1/modules/${moduleId}/as-entries/${asDeleteTarget.id}`,
-				'DELETE',
-				undefined,
-				{ idempotent: false }
-			);
-			toast.success('Удалено');
-			asDeleteTarget = null;
-			await loadEntries();
-		} catch (e) {
-			toast.error(e instanceof Error ? e.message : String(e));
-		}
-	}
-	function toggleAsSelection(id: string) {
-		const next = new Set(selectedAsIds);
-		if (next.has(id)) next.delete(id);
-		else next.add(id);
-		selectedAsIds = next;
-	}
-	function toggleAllAs(checked: boolean) {
-		selectedAsIds = checked ? new Set(asEntries.map((entry) => entry.id)) : new Set<string>();
-	}
-	async function bulkDeleteAs() {
-		if (selectedAsIds.size === 0) return;
-		deletingAsBulk = true;
-		let deleted = 0;
-		try {
-			for (const id of selectedAsIds) {
-				try {
-					await apiMutate(`/v1/modules/${moduleId}/as-entries/${id}`, 'DELETE', undefined, {
-						idempotent: false
-					});
-					deleted += 1;
-				} catch (e) {
-					toast.error(e instanceof Error ? e.message : String(e));
-				}
-			}
-			toast.success(`Удалено AS-записей: ${deleted}`);
-			asBulkDeleteDialog = false;
-			await loadEntries();
-		} finally {
-			deletingAsBulk = false;
-		}
-	}
-
-	// --- CDN Sources ---
-	function openCdnCreate() {
-		cdnEdit = null;
-		clearCdnPreview();
-		cdnForm = { url: '', source_kind: 'plaintext', prefix_path: '', community_id: null };
-		cdnDialog = true;
-	}
-	function openCdnEdit(src: CdnSource) {
-		cdnEdit = src;
-		clearCdnPreview();
-		cdnForm = {
-			url: src.url,
-			source_kind: normalizeCdnSourceKind(src.source_kind),
-			prefix_path: src.prefix_path ?? '',
-			community_id: src.community_id,
-			refresh_interval_sec: src.refresh_interval_sec
-		};
-		cdnDialog = true;
-	}
-	async function previewCdn() {
-		const urlTrim = cdnForm.url.trim();
-		if (!urlTrim) {
-			toast.error('Укажите URL');
-			return;
-		}
-		cdnPreviewLoading = true;
-		cdnPreviewError = null;
-		cdnPreviewOk = false;
-		try {
-			const res = await apiMutate<CdnPreviewResponse>(
-				`/v1/modules/${moduleId}/cdn-sources/preview`,
-				'POST',
-				{
-					url: urlTrim,
-					source_kind: cdnForm.source_kind,
-					prefix_path: cdnForm.prefix_path?.trim() ?? ''
-				}
-			);
-			cdnPreviewItems = res.items;
-			cdnPreviewTotal = res.total;
-			cdnPreviewTruncated = res.truncated;
-			cdnPreviewOk = true;
-		} catch (e) {
-			cdnPreviewError = e instanceof Error ? e.message : String(e);
-			cdnPreviewItems = [];
-			cdnPreviewTotal = 0;
-			cdnPreviewTruncated = false;
-			cdnPreviewOk = false;
-		} finally {
-			cdnPreviewLoading = false;
-		}
-	}
-	async function saveCdn() {
-		const urlTrim = cdnForm.url.trim();
-		if (!urlTrim) {
-			toast.error('Укажите URL');
-			return;
-		}
-		cdnSaving = true;
-		try {
-			const body = {
-				...cdnForm,
-				url: urlTrim,
-				source_kind: cdnForm.source_kind,
-				prefix_path: cdnForm.prefix_path?.trim() ?? ''
-			};
-			if (cdnEdit) {
-				await apiMutate(`/v1/modules/${moduleId}/cdn-sources/${cdnEdit.id}`, 'PATCH', body);
-				toast.success('Источник обновлён');
-			} else {
-				await apiMutate(`/v1/modules/${moduleId}/cdn-sources`, 'POST', body);
-				toast.success('Источник добавлен');
-			}
-			clearCdnPreview();
-			cdnDialog = false;
-			await loadEntries();
-		} catch (e) {
-			toast.error(e instanceof Error ? e.message : String(e));
-		} finally {
-			cdnSaving = false;
-		}
-	}
-	async function deleteCdn() {
-		if (!cdnDeleteTarget) return;
-		try {
-			await apiMutate(
-				`/v1/modules/${moduleId}/cdn-sources/${cdnDeleteTarget.id}`,
-				'DELETE',
-				undefined,
-				{ idempotent: false }
-			);
-			toast.success('Удалено');
-			cdnDeleteTarget = null;
-			await loadEntries();
-		} catch (e) {
-			toast.error(e instanceof Error ? e.message : String(e));
-		}
-	}
-	function toggleCdnSelection(id: string) {
-		const next = new Set(selectedCdnIds);
-		if (next.has(id)) next.delete(id);
-		else next.add(id);
-		selectedCdnIds = next;
-	}
-	function toggleAllCdn(checked: boolean) {
-		selectedCdnIds = checked ? new Set(cdnSources.map((entry) => entry.id)) : new Set<string>();
-	}
-	async function bulkDeleteCdn() {
-		if (selectedCdnIds.size === 0) return;
-		deletingCdnBulk = true;
-		let deleted = 0;
-		try {
-			for (const id of selectedCdnIds) {
-				try {
-					await apiMutate(`/v1/modules/${moduleId}/cdn-sources/${id}`, 'DELETE', undefined, {
-						idempotent: false
-					});
-					deleted += 1;
-				} catch (e) {
-					toast.error(e instanceof Error ? e.message : String(e));
-				}
-			}
-			toast.success(`Удалено CDN-источников: ${deleted}`);
-			cdnBulkDeleteDialog = false;
-			await loadEntries();
-		} finally {
-			deletingCdnBulk = false;
-		}
-	}
-
-	// --- Domain Entries ---
-	function openDomainCreate() {
-		domainEdit = null;
-		domainForm = { fqdn: '', community_id: null };
-		domainDialog = true;
-	}
-	function openDomainEdit(entry: DomainEntry) {
-		domainEdit = entry;
-		domainForm = { fqdn: entry.fqdn, community_id: entry.community_id };
-		domainDialog = true;
-	}
-	async function saveDomain() {
-		domainSaving = true;
-		try {
-			if (domainEdit) {
-				await apiMutate(
-					`/v1/modules/${moduleId}/domain-entries/${domainEdit.id}`,
-					'PATCH',
-					domainForm
-				);
-				toast.success('Домен обновлён');
-			} else {
-				await apiMutate(`/v1/modules/${moduleId}/domain-entries`, 'POST', domainForm);
-				toast.success('Домен добавлен');
-			}
-			domainDialog = false;
-			await loadEntries();
-		} catch (e) {
-			toast.error(e instanceof Error ? e.message : String(e));
-		} finally {
-			domainSaving = false;
-		}
-	}
-	async function deleteDomain() {
-		if (!domainDeleteTarget) return;
-		try {
-			await apiMutate(
-				`/v1/modules/${moduleId}/domain-entries/${domainDeleteTarget.id}`,
-				'DELETE',
-				undefined,
-				{ idempotent: false }
-			);
-			toast.success('Удалено');
-			domainDeleteTarget = null;
-			await loadEntries();
-		} catch (e) {
-			toast.error(e instanceof Error ? e.message : String(e));
-		}
-	}
-	function toggleDomainSelection(id: string) {
-		const next = new Set(selectedDomainIds);
-		if (next.has(id)) next.delete(id);
-		else next.add(id);
-		selectedDomainIds = next;
-	}
-	function toggleAllDomain(checked: boolean) {
-		selectedDomainIds = checked
-			? new Set(domainEntries.map((entry) => entry.id))
-			: new Set<string>();
-	}
-	async function bulkDeleteDomain() {
-		if (selectedDomainIds.size === 0) return;
-		deletingDomainBulk = true;
-		let deleted = 0;
-		try {
-			for (const id of selectedDomainIds) {
-				try {
-					await apiMutate(`/v1/modules/${moduleId}/domain-entries/${id}`, 'DELETE', undefined, {
-						idempotent: false
-					});
-					deleted += 1;
-				} catch (e) {
-					toast.error(e instanceof Error ? e.message : String(e));
-				}
-			}
-			toast.success(`Удалено доменов: ${deleted}`);
-			domainBulkDeleteDialog = false;
-			await loadEntries();
-		} finally {
-			deletingDomainBulk = false;
-		}
-	}
-
-	// --- IP Range Entries ---
-	function openIpCreate() {
-		ipEdit = null;
-		ipForm = { prefix: '', community_id: '' };
-		ipDialog = true;
-	}
-	function openIpEdit(entry: IpRangeEntry) {
-		ipEdit = entry;
-		ipForm = { prefix: entry.prefix, community_id: entry.community_id };
-		ipDialog = true;
-	}
-	async function saveIp() {
-		ipSaving = true;
-		try {
-			if (ipEdit) {
-				await apiMutate(`/v1/modules/${moduleId}/ip-range-entries/${ipEdit.id}`, 'PATCH', ipForm);
-				toast.success('Диапазон обновлён');
-			} else {
-				await apiMutate(`/v1/modules/${moduleId}/ip-range-entries`, 'POST', ipForm);
-				toast.success('Диапазон добавлен');
-			}
-			ipDialog = false;
-			await loadEntries();
-		} catch (e) {
-			toast.error(e instanceof Error ? e.message : String(e));
-		} finally {
-			ipSaving = false;
-		}
-	}
-	async function deleteIp() {
-		if (!ipDeleteTarget) return;
-		try {
-			await apiMutate(
-				`/v1/modules/${moduleId}/ip-range-entries/${ipDeleteTarget.id}`,
-				'DELETE',
-				undefined,
-				{ idempotent: false }
-			);
-			toast.success('Удалено');
-			ipDeleteTarget = null;
-			await loadEntries();
-		} catch (e) {
-			toast.error(e instanceof Error ? e.message : String(e));
-		}
-	}
-	function toggleIpSelection(id: string) {
-		const next = new Set(selectedIpIds);
-		if (next.has(id)) next.delete(id);
-		else next.add(id);
-		selectedIpIds = next;
-	}
-	function toggleAllIp(checked: boolean) {
-		selectedIpIds = checked ? new Set(ipEntries.map((entry) => entry.id)) : new Set<string>();
-	}
-	async function bulkDeleteIp() {
-		if (selectedIpIds.size === 0) return;
-		deletingIpBulk = true;
-		let deleted = 0;
-		try {
-			for (const id of selectedIpIds) {
-				try {
-					await apiMutate(`/v1/modules/${moduleId}/ip-range-entries/${id}`, 'DELETE', undefined, {
-						idempotent: false
-					});
-					deleted += 1;
-				} catch (e) {
-					toast.error(e instanceof Error ? e.message : String(e));
-				}
-			}
-			toast.success(`Удалено диапазонов: ${deleted}`);
-			ipBulkDeleteDialog = false;
-			await loadEntries();
-		} finally {
-			deletingIpBulk = false;
-		}
-	}
-
-	function communityLabel(id: string | null) {
-		if (!id) return '—';
-		const c = communities.find((x) => x.id === id);
-		if (!c) return id.slice(0, 8) + '…';
-		const t = c.title?.trim();
-		return t || c.community;
-	}
-
-	function communityOptionLabel(c: BgpCommunity) {
-		const t = c.title?.trim();
-		return t || c.community;
-	}
-
-	function nullableSelectValue(value: string | null | undefined): string {
-		if (value === null || value === undefined || value === '') return NONE_OPTION;
-		return value;
-	}
-
-	function fromNullableSelect(value: string): string | null {
-		if (value === NONE_OPTION || value === '') return null;
-		return value;
-	}
-
-	function moduleIntervalLabel(moduleRow: ModuleRow): string {
-		const cron = typeof moduleRow.cron_expr === 'string' ? moduleRow.cron_expr.trim() : '';
-		const raw = moduleRow.refresh_interval_sec as unknown;
-		const interval =
-			typeof raw === 'number'
-				? raw
-				: typeof raw === 'string' && raw.trim().length > 0
-					? Number(raw)
-					: null;
-		const intervalLabel = interval !== null && Number.isFinite(interval) ? `${interval}с` : '';
-		if (cron && intervalLabel) return `${intervalLabel} (${cron})`;
-		if (cron) return cron;
-		if (intervalLabel) return intervalLabel;
-		return '—';
-	}
-
-	function formatDateTime(value: string | null | undefined): string {
-		if (typeof value !== 'string' || value.trim().length === 0) return '—';
-		const parsed = new Date(value);
-		if (Number.isNaN(parsed.getTime())) return '—';
-		return parsed.toLocaleString('ru-RU');
-	}
-
-	const activeTab = $derived.by(() => {
-		if (!mod) return 'entries';
-		switch (mod.type) {
-			case 'AS_PREFIXES':
-				return 'as';
-			case 'CDN_CIDRS':
-				return 'cdn';
-			case 'DOMAINS':
-				return 'domains';
-			case 'IP_RANGES':
-				return 'ip';
-			default:
-				return 'as';
-		}
-	});
-
-	const asPrefixTotal = $derived(
-		asEntries.reduce((acc, entry) => acc + (entry.prefix_count ?? 0), 0)
-	);
 </script>
 
 {#if loadingMod}
-	<div class="flex h-32 items-center justify-center text-muted-foreground">Загрузка…</div>
+	<div class="flex flex-col gap-6">
+		<ModuleKpiCards mod={null} {communities} {dohProfiles} asEntries={[]} loading={true} />
+	</div>
 {:else if mod}
-	{@const m = mod}
-	<div class="space-y-6">
-		<input
-			class="hidden"
-			type="file"
-			accept=".csv,text/csv"
-			bind:this={csvFileInput}
-			onchange={handleImportCsvChange}
+	<div class="flex flex-col gap-6">
+		<ModuleDetailHeader
+			{mod}
+			{refreshing}
+			onRefresh={refreshMod}
+			onEdit={() => (editDialog = true)}
+			onDelete={requestDeleteMod}
 		/>
-		<div class="flex min-w-0 items-start gap-2">
-			<Button variant="ghost" size="icon-sm" class="mt-1 shrink-0" href={resolve('/modules')}>
-				<ArrowLeft class="size-4" />
-			</Button>
-			<PageHeader
-				class="min-w-0 flex-1"
-				title={m.name}
-				description={m.id}
-				icon={Blocks}
-				iconClass="bg-chart-2/15 text-chart-2"
-			>
-				{#snippet actions()}
-					<div class="flex flex-wrap items-center gap-2">
-						<Badge variant="outline">{moduleTypeRu(m.type)}</Badge>
-						{#if m.enabled}
-							<Badge variant="default" class="text-xs">вкл</Badge>
-						{:else}
-							<Badge variant="secondary" class="text-xs">выкл</Badge>
-						{/if}
-						<Button variant="outline" size="sm" onclick={refreshMod} disabled={refreshing}>
-							<RefreshCw class={refreshing ? 'animate-spin' : ''} />
-							Обновить
-						</Button>
-						<Button variant="outline" size="sm" onclick={openEditMod}>
-							<Pencil />
-							Редактировать
-						</Button>
-						<Button variant="destructive" size="sm" onclick={() => (deleteModDialog = true)}>
-							<Trash2 />
-							Удалить
-						</Button>
-					</div>
-				{/snippet}
-			</PageHeader>
-		</div>
 
-		<!-- Module metadata -->
-		<div class="grid grid-cols-1 gap-3 sm:grid-cols-2 xl:grid-cols-5">
-			<Card class="bg-chart-3/10 p-3">
-				<p class="flex items-center gap-1.5 text-xs text-muted-foreground">
-					<ArrowDownUp class="size-3.5" />Приоритет
-				</p>
-				<p class="font-semibold">{mod.priority}</p>
-			</Card>
-			<Card class="bg-chart-5/10 p-3">
-				<p class="flex items-center gap-1.5 text-xs text-muted-foreground">
-					<Timer class="size-3.5" />Интервал
-				</p>
-				<p class="font-mono text-sm font-semibold">
-					{moduleIntervalLabel(mod)}
-				</p>
-			</Card>
-			<Card class="bg-chart-4/10 p-3">
-				<p class="flex items-center gap-1.5 text-xs text-muted-foreground">
-					<Network class="size-3.5" />DoH
-				</p>
-				{#if mod.type === 'DOMAINS'}
-					<p class="text-sm font-semibold">{dohPolicyLabel(mod.doh_resolver_policy)}</p>
-					<p class="text-xs break-all text-muted-foreground">
-						{#if moduleDohProfileIds(mod).length}
-							{moduleDohProfileIds(mod).map(dohProfileLabel).join('; ')}
-						{:else}
-							Системный DNS
-						{/if}
-					</p>
-				{:else}
-					<p class="text-sm font-semibold">—</p>
-				{/if}
-			</Card>
-			<Card class="bg-chart-2/10 p-3">
-				<p class="flex items-center gap-1.5 text-xs text-muted-foreground">
-					<ShieldCheck class="size-3.5" />Community по умолч.
-				</p>
-				<p class="text-sm font-semibold break-all">{communityLabel(mod.default_community_id)}</p>
-			</Card>
-			<Card class="bg-muted/60 p-3">
-				<p class="flex items-center gap-1.5 text-xs text-muted-foreground">
-					<RefreshCw class="size-3.5" />Последнее обновление
-				</p>
-				<p class="text-sm font-semibold whitespace-nowrap">
-					{formatDateTime(mod.last_refreshed_at)}
-				</p>
-			</Card>
-		</div>
+		<Alert class="border-info/30 bg-info/5">
+			<Info class="text-info" />
+			<AlertTitle>{moduleTypeRu(mod.type)}</AlertTitle>
+			<AlertDescription>
+				{typeAlertText}
+				Результат refresh — в
+				<Button variant="link" class="h-auto p-0" href={resolve('/operations?tab=jobs')}>
+					Операциях → Задачи
+				</Button>.
+			</AlertDescription>
+		</Alert>
 
-		<Card>
-			<CardHeader>
-				<CardTitle class="text-base">Операционный отчёт модуля</CardTitle>
-				<CardDescription>
-					Читаемая сводка по данным модуля: источники, объёмы и ожидаемый результат для
-					refresh/агрегации.
-				</CardDescription>
-			</CardHeader>
-			<CardContent class="grid gap-3 md:grid-cols-2">
-				{#if mod.type === 'DOMAINS'}
-					<div class="rounded-lg border p-3">
-						<p class="text-sm font-medium">Домены и ожидаемые IP</p>
-						<p class="text-xs text-muted-foreground">
-							После refresh домены резолвятся в IP и конвертируются в префиксы.
-						</p>
-						<div class="mt-2 space-y-1">
-							{#each domainEntries.slice(0, 8) as entry (entry.id)}
-								<p class="font-mono text-xs break-all">{entry.fqdn}</p>
-							{:else}
-								<p class="text-muted-foreground text-xs">Нет доменов</p>
-							{/each}
-						</div>
-					</div>
-				{:else if mod.type === 'AS_PREFIXES'}
-					<div class="rounded-lg border p-3">
-						<p class="text-sm font-medium">ASN и число полученных префиксов</p>
-						<p class="text-xs text-muted-foreground">
-							Счётчик префиксов обновляется после успешного refresh.
-						</p>
-						<div class="mt-2 space-y-1">
-							<p class="text-xs">
-								Всего ASN: <span class="font-semibold">{asEntries.length}</span>
-							</p>
-							<p class="text-xs">
-								Сумма префиксов: <span class="font-semibold">{asPrefixTotal}</span>
-							</p>
-						</div>
-					</div>
-				{:else if mod.type === 'CDN_CIDRS'}
-					<div class="rounded-lg border p-3">
-						<p class="text-sm font-medium">CDN ссылки и импортируемые префиксы</p>
-						<p class="text-xs text-muted-foreground">
-							Каждый URL поставляет список CIDR для агрегации.
-						</p>
-						<div class="mt-2 space-y-1">
-							{#each cdnSources.slice(0, 6) as src (src.id)}
-								<p class="font-mono text-xs break-all">{src.url}</p>
-							{:else}
-								<p class="text-muted-foreground text-xs">Нет CDN источников</p>
-							{/each}
-						</div>
-					</div>
-				{:else if mod.type === 'IP_RANGES'}
-					<div class="rounded-lg border p-3">
-						<p class="text-sm font-medium">IP ranges для агрегации</p>
-						<p class="text-xs text-muted-foreground">
-							Статические CIDR, которые попадают в итоговую ревизию.
-						</p>
-						<div class="mt-2 space-y-1">
-							{#each ipEntries.slice(0, 8) as entry (entry.id)}
-								<p class="font-mono text-xs">{entry.prefix}</p>
-							{:else}
-								<p class="text-muted-foreground text-xs">Нет диапазонов</p>
-							{/each}
-						</div>
-					</div>
-				{/if}
-				<div class="rounded-lg border p-3">
-					<p class="text-sm font-medium">Результат операции</p>
-					<p class="text-xs text-muted-foreground">
-						Подробный результат по конкретному запуску refresh смотрите в `Операции -> Задачи ->
-						module_refresh`: там отображаются источники, количество префиксов и итог агрегации.
-					</p>
-				</div>
-			</CardContent>
-		</Card>
+		<ModuleKpiCards {mod} {communities} {dohProfiles} {asEntries} loading={false} />
 
-		<!-- Entries by type -->
-		{#if mod.type === 'AS_PREFIXES'}
-			<Card>
-				<CardHeader class="flex flex-col gap-3 pb-2 sm:flex-row sm:items-center sm:justify-between">
-					<div class="min-w-0 flex-1">
-						<CardTitle class="text-base">AS-записи</CardTitle>
-						<CardDescription>
-							Номер AS и community; имя, число префиксов и дата обновляются при успешном обновлении
-							модуля (RIPEstat)
-						</CardDescription>
-					</div>
-					<div
-						class="flex shrink-0 flex-wrap items-center justify-end gap-2 self-start sm:self-auto"
-					>
-						<Button
-							variant="outline"
-							size="sm"
-							onclick={openImportCsvPicker}
-							disabled={!supportsCsvIO(mod.type) || csvImporting || csvExporting}
-						>
-							<Upload />
-							{csvImporting ? 'Импорт…' : 'Импорт CSV'}
-						</Button>
-						<Button
-							variant="outline"
-							size="sm"
-							onclick={exportEntriesCsv}
-							disabled={!supportsCsvIO(mod.type) || csvExporting || csvImporting}
-						>
-							<Download />
-							{csvExporting ? 'Экспорт…' : 'Экспорт CSV'}
-						</Button>
-						<Button size="sm" onclick={openAsCreate}><Plus />Добавить</Button>
-						<Button
-							variant="destructive"
-							size="sm"
-							onclick={() => (asBulkDeleteDialog = true)}
-							disabled={selectedAsCount === 0 || deletingAsBulk}
-						>
-							<Trash2 />
-							Удалить выбранные ({selectedAsCount})
-						</Button>
-					</div>
-				</CardHeader>
-				<CardContent class="p-0">
-					<Table>
-						<TableHeader>
-							<TableRow>
-								<TableHead class="w-10">
-									<input
-										type="checkbox"
-										checked={allAsSelected}
-										indeterminate={someAsSelected}
-										aria-label="Выбрать все AS-записи"
-										onchange={(event) =>
-											toggleAllAs((event.currentTarget as HTMLInputElement).checked)}
-									/>
-								</TableHead>
-								<TableHead>ASN</TableHead>
-								<TableHead>Название AS</TableHead>
-								<TableHead class="text-right">Префиксов</TableHead>
-								<TableHead>Обновлено</TableHead>
-								<TableHead>Community</TableHead>
-								<TableHead class="w-20"></TableHead>
-							</TableRow>
-						</TableHeader>
-						<TableBody>
-							{#each asEntries as entry (entry.id)}
-								<TableRow>
-									<TableCell class="w-10">
-										<input
-											type="checkbox"
-											checked={selectedAsIds.has(entry.id)}
-											aria-label={`Выбрать AS ${entry.asn}`}
-											onchange={() => toggleAsSelection(entry.id)}
-										/>
-									</TableCell>
-									<TableCell class="font-mono">{entry.asn}</TableCell>
-									<TableCell
-										class="max-w-[14rem] truncate text-sm text-muted-foreground"
-										title={entry.asn_name ?? ''}
-									>
-										{entry.asn_name?.trim() ? entry.asn_name : '—'}
-									</TableCell>
-									<TableCell class="text-right font-mono text-sm">
-										{entry.prefix_count != null && entry.prefix_count !== undefined
-											? entry.prefix_count
-											: '—'}
-									</TableCell>
-									<TableCell class="text-sm whitespace-nowrap text-muted-foreground">
-										{entry.asn_resolved_at
-											? new Date(entry.asn_resolved_at).toLocaleString('ru-RU')
-											: '—'}
-									</TableCell>
-									<TableCell class="text-sm text-muted-foreground"
-										>{communityLabel(entry.community_id)}</TableCell
-									>
-									<TableCell>
-										<div class="flex gap-1">
-											<Button variant="ghost" size="icon-sm" onclick={() => openAsEdit(entry)}
-												><Pencil class="size-3.5" /></Button
-											>
-											<Button
-												variant="ghost"
-												size="icon-sm"
-												class="text-destructive"
-												onclick={() => (asDeleteTarget = entry)}><Trash2 class="size-3.5" /></Button
-											>
-										</div>
-									</TableCell>
-								</TableRow>
-							{:else}
-								<TableRow>
-									<TableCell colspan={7} class="text-muted-foreground text-center py-6"
-										>Нет записей</TableCell
-									>
-								</TableRow>
-							{/each}
-						</TableBody>
-					</Table>
-				</CardContent>
-			</Card>
-		{:else if mod.type === 'CDN_CIDRS'}
-			<Card>
-				<CardHeader class="flex flex-col gap-3 pb-2 sm:flex-row sm:items-center sm:justify-between">
-					<div class="min-w-0 flex-1">
-						<CardTitle class="text-base">CDN-источники</CardTitle>
-						<CardDescription>URL источников для скачивания списков CIDR</CardDescription>
-					</div>
-					<div
-						class="flex shrink-0 flex-wrap items-center justify-end gap-2 self-start sm:self-auto"
-					>
-						<Button size="sm" onclick={openCdnCreate}><Plus />Добавить</Button>
-						<Button
-							variant="destructive"
-							size="sm"
-							onclick={() => (cdnBulkDeleteDialog = true)}
-							disabled={selectedCdnCount === 0 || deletingCdnBulk}
-						>
-							<Trash2 />
-							Удалить выбранные ({selectedCdnCount})
-						</Button>
-					</div>
-				</CardHeader>
-				<CardContent class="p-0">
-					<Table>
-						<TableHeader>
-							<TableRow>
-								<TableHead class="w-10">
-									<input
-										type="checkbox"
-										checked={allCdnSelected}
-										indeterminate={someCdnSelected}
-										aria-label="Выбрать все CDN-источники"
-										onchange={(event) =>
-											toggleAllCdn((event.currentTarget as HTMLInputElement).checked)}
-									/>
-								</TableHead>
-								<TableHead>URL</TableHead>
-								<TableHead>Тип</TableHead>
-								<TableHead>Community</TableHead>
-								<TableHead>Интервал</TableHead>
-								<TableHead>Последнее обновление</TableHead>
-								<TableHead class="w-20"></TableHead>
-							</TableRow>
-						</TableHeader>
-						<TableBody>
-							{#each cdnSources as src (src.id)}
-								<TableRow>
-									<TableCell class="w-10">
-										<input
-											type="checkbox"
-											checked={selectedCdnIds.has(src.id)}
-											aria-label="Выбрать CDN-источник"
-											onchange={() => toggleCdnSelection(src.id)}
-										/>
-									</TableCell>
-									<TableCell class="max-w-xs truncate font-mono text-xs">{src.url}</TableCell>
-									<TableCell>
-										<div class="flex flex-col gap-0.5">
-											<Badge variant="outline">{normalizeCdnSourceKind(src.source_kind)}</Badge>
-											{#if src.prefix_path?.trim()}
-												<span
-													class="font-mono text-xs break-all text-muted-foreground"
-													title={src.prefix_path}>{src.prefix_path}</span
-												>
-											{/if}
-										</div>
-									</TableCell>
-									<TableCell class="text-sm text-muted-foreground"
-										>{communityLabel(src.community_id)}</TableCell
-									>
-									<TableCell class="text-sm text-muted-foreground">
-										{src.refresh_interval_sec !== null && src.refresh_interval_sec !== undefined
-											? `${src.refresh_interval_sec}с`
-											: '—'}
-									</TableCell>
-									<TableCell class="text-sm whitespace-nowrap text-muted-foreground">
-										{formatDateTime(src.last_refreshed_at)}
-									</TableCell>
-									<TableCell>
-										<div class="flex gap-1">
-											<Button variant="ghost" size="icon-sm" onclick={() => openCdnEdit(src)}
-												><Pencil class="size-3.5" /></Button
-											>
-											<Button
-												variant="ghost"
-												size="icon-sm"
-												class="text-destructive"
-												onclick={() => (cdnDeleteTarget = src)}><Trash2 class="size-3.5" /></Button
-											>
-										</div>
-									</TableCell>
-								</TableRow>
-							{:else}
-								<TableRow>
-									<TableCell colspan={7} class="text-muted-foreground text-center py-6"
-										>Нет источников</TableCell
-									>
-								</TableRow>
-							{/each}
-						</TableBody>
-					</Table>
-				</CardContent>
-			</Card>
-		{:else if mod.type === 'DOMAINS'}
-			<Card>
-				<CardHeader class="flex flex-col gap-3 pb-2 sm:flex-row sm:items-center sm:justify-between">
-					<div class="min-w-0 flex-1">
-						<CardTitle class="text-base">Домены</CardTitle>
-						<CardDescription>FQDN для резолвинга через DoH</CardDescription>
-					</div>
-					<div
-						class="flex shrink-0 flex-wrap items-center justify-end gap-2 self-start sm:self-auto"
-					>
-						<Button
-							variant="outline"
-							size="sm"
-							onclick={openImportCsvPicker}
-							disabled={!supportsCsvIO(mod.type) || csvImporting || csvExporting}
-						>
-							<Upload />
-							{csvImporting ? 'Импорт…' : 'Импорт CSV'}
-						</Button>
-						<Button
-							variant="outline"
-							size="sm"
-							onclick={exportEntriesCsv}
-							disabled={!supportsCsvIO(mod.type) || csvExporting || csvImporting}
-						>
-							<Download />
-							{csvExporting ? 'Экспорт…' : 'Экспорт CSV'}
-						</Button>
-						<Button size="sm" onclick={openDomainCreate}><Plus />Добавить</Button>
-						<Button
-							variant="destructive"
-							size="sm"
-							onclick={() => (domainBulkDeleteDialog = true)}
-							disabled={selectedDomainCount === 0 || deletingDomainBulk}
-						>
-							<Trash2 />
-							Удалить выбранные ({selectedDomainCount})
-						</Button>
-					</div>
-				</CardHeader>
-				<CardContent class="p-0">
-					<Table>
-						<TableHeader>
-							<TableRow>
-								<TableHead class="w-10">
-									<input
-										type="checkbox"
-										checked={allDomainSelected}
-										indeterminate={someDomainSelected}
-										aria-label="Выбрать все домены"
-										onchange={(event) =>
-											toggleAllDomain((event.currentTarget as HTMLInputElement).checked)}
-									/>
-								</TableHead>
-								<TableHead>FQDN</TableHead>
-								<TableHead>Community</TableHead>
-								<TableHead class="w-20"></TableHead>
-							</TableRow>
-						</TableHeader>
-						<TableBody>
-							{#each domainEntries as entry (entry.id)}
-								<TableRow>
-									<TableCell class="w-10">
-										<input
-											type="checkbox"
-											checked={selectedDomainIds.has(entry.id)}
-											aria-label={`Выбрать домен ${entry.fqdn}`}
-											onchange={() => toggleDomainSelection(entry.id)}
-										/>
-									</TableCell>
-									<TableCell class="font-mono">{entry.fqdn}</TableCell>
-									<TableCell class="text-sm text-muted-foreground"
-										>{communityLabel(entry.community_id)}</TableCell
-									>
-									<TableCell>
-										<div class="flex gap-1">
-											<Button variant="ghost" size="icon-sm" onclick={() => openDomainEdit(entry)}
-												><Pencil class="size-3.5" /></Button
-											>
-											<Button
-												variant="ghost"
-												size="icon-sm"
-												class="text-destructive"
-												onclick={() => (domainDeleteTarget = entry)}
-												><Trash2 class="size-3.5" /></Button
-											>
-										</div>
-									</TableCell>
-								</TableRow>
-							{:else}
-								<TableRow>
-									<TableCell colspan={4} class="text-muted-foreground text-center py-6"
-										>Нет доменов</TableCell
-									>
-								</TableRow>
-							{/each}
-						</TableBody>
-					</Table>
-				</CardContent>
-			</Card>
-		{:else if mod.type === 'IP_RANGES'}
-			<Card>
-				<CardHeader class="flex flex-col gap-3 pb-2 sm:flex-row sm:items-center sm:justify-between">
-					<div class="min-w-0 flex-1">
-						<CardTitle class="text-base">IP-диапазоны</CardTitle>
-						<CardDescription>Статические CIDR для анонса</CardDescription>
-					</div>
-					<div
-						class="flex shrink-0 flex-wrap items-center justify-end gap-2 self-start sm:self-auto"
-					>
-						<Button
-							variant="outline"
-							size="sm"
-							onclick={openImportCsvPicker}
-							disabled={!supportsCsvIO(mod.type) || csvImporting || csvExporting}
-						>
-							<Upload />
-							{csvImporting ? 'Импорт…' : 'Импорт CSV'}
-						</Button>
-						<Button
-							variant="outline"
-							size="sm"
-							onclick={exportEntriesCsv}
-							disabled={!supportsCsvIO(mod.type) || csvExporting || csvImporting}
-						>
-							<Download />
-							{csvExporting ? 'Экспорт…' : 'Экспорт CSV'}
-						</Button>
-						<Button size="sm" onclick={openIpCreate}><Plus />Добавить</Button>
-						<Button
-							variant="destructive"
-							size="sm"
-							onclick={() => (ipBulkDeleteDialog = true)}
-							disabled={selectedIpCount === 0 || deletingIpBulk}
-						>
-							<Trash2 />
-							Удалить выбранные ({selectedIpCount})
-						</Button>
-					</div>
-				</CardHeader>
-				<CardContent class="p-0">
-					<Table>
-						<TableHeader>
-							<TableRow>
-								<TableHead class="w-10">
-									<input
-										type="checkbox"
-										checked={allIpSelected}
-										indeterminate={someIpSelected}
-										aria-label="Выбрать все диапазоны"
-										onchange={(event) =>
-											toggleAllIp((event.currentTarget as HTMLInputElement).checked)}
-									/>
-								</TableHead>
-								<TableHead>Префикс (CIDR)</TableHead>
-								<TableHead>Community</TableHead>
-								<TableHead class="w-20"></TableHead>
-							</TableRow>
-						</TableHeader>
-						<TableBody>
-							{#each ipEntries as entry (entry.id)}
-								<TableRow>
-									<TableCell class="w-10">
-										<input
-											type="checkbox"
-											checked={selectedIpIds.has(entry.id)}
-											aria-label={`Выбрать диапазон ${entry.prefix}`}
-											onchange={() => toggleIpSelection(entry.id)}
-										/>
-									</TableCell>
-									<TableCell class="font-mono">{entry.prefix}</TableCell>
-									<TableCell class="text-sm text-muted-foreground"
-										>{communityLabel(entry.community_id)}</TableCell
-									>
-									<TableCell>
-										<div class="flex gap-1">
-											<Button variant="ghost" size="icon-sm" onclick={() => openIpEdit(entry)}
-												><Pencil class="size-3.5" /></Button
-											>
-											<Button
-												variant="ghost"
-												size="icon-sm"
-												class="text-destructive"
-												onclick={() => (ipDeleteTarget = entry)}><Trash2 class="size-3.5" /></Button
-											>
-										</div>
-									</TableCell>
-								</TableRow>
-							{:else}
-								<TableRow>
-									<TableCell colspan={4} class="text-muted-foreground text-center py-6"
-										>Нет диапазонов</TableCell
-									>
-								</TableRow>
-							{/each}
-						</TableBody>
-					</Table>
-				</CardContent>
-			</Card>
+		<ModuleSummaryCard {mod} {asEntries} {cdnSources} {domainEntries} {ipEntries} />
+
+		{#if mod.type === 'AS_PREFIXES' && moduleId}
+			<ModuleAsEntriesCard
+				{moduleId}
+				{mod}
+				entries={asEntries}
+				{communities}
+				loading={entriesLoading}
+				onChanged={loadEntries}
+			/>
+		{:else if mod.type === 'CDN_CIDRS' && moduleId}
+			<ModuleCdnSourcesCard
+				{moduleId}
+				sources={cdnSources}
+				{communities}
+				loading={entriesLoading}
+				onChanged={loadEntries}
+			/>
+		{:else if mod.type === 'DOMAINS' && moduleId}
+			<ModuleDomainEntriesCard
+				{moduleId}
+				{mod}
+				entries={domainEntries}
+				{communities}
+				loading={entriesLoading}
+				onChanged={loadEntries}
+			/>
+		{:else if mod.type === 'IP_RANGES' && moduleId}
+			<ModuleIpRangesCard
+				{moduleId}
+				{mod}
+				entries={ipEntries}
+				{communities}
+				loading={entriesLoading}
+				onChanged={loadEntries}
+			/>
 		{/if}
 	</div>
+
+	{#if moduleId}
+		<ModuleEditDialog
+			bind:open={editDialog}
+			{mod}
+			{moduleId}
+			{communities}
+			{dohProfiles}
+			onSaved={handleSaved}
+			onClose={() => {}}
+		/>
+	{/if}
 {:else}
-	<p class="text-destructive">Модуль не найден</p>
+	<EmptyState
+		title="Модуль не найден"
+		description="Проверьте ссылку или вернитесь к списку модулей."
+	>
+		{#snippet action()}
+			<Button href={resolve('/modules')}>К списку модулей</Button>
+		{/snippet}
+	</EmptyState>
 {/if}
-
-<!-- ================== Module Edit Dialog ================== -->
-<Dialog bind:open={editDialog}>
-	<DialogContent class="sm:max-w-md">
-		<DialogHeader>
-			<DialogTitle>Редактировать модуль</DialogTitle>
-		</DialogHeader>
-		<div class="space-y-4 py-2">
-			<div class="space-y-1.5">
-				<Label for="e-name">Название</Label>
-				<Input id="e-name" bind:value={editForm.name} />
-			</div>
-			<div class="grid grid-cols-2 gap-4">
-				<div class="space-y-1.5">
-					<Label for="e-priority">Приоритет</Label>
-					<Input id="e-priority" type="number" bind:value={editForm.priority} />
-				</div>
-				<div class="space-y-1.5">
-					<Label for="e-interval">Интервал (сек)</Label>
-					<Input id="e-interval" type="number" bind:value={editForm.refresh_interval_sec} />
-				</div>
-			</div>
-			<div class="space-y-1.5">
-				<Label for="e-cron">Cron-выражение</Label>
-				<Input id="e-cron" placeholder="0 */6 * * *" bind:value={editForm.cron_expr} />
-			</div>
-			<div class="space-y-1.5">
-				<Label for="e-comm">Community по умолчанию</Label>
-				<Select
-					type="single"
-					value={nullableSelectValue(editForm.default_community_id)}
-					onValueChange={(v) => {
-						editForm.default_community_id = fromNullableSelect(v);
-					}}
-				>
-					<SelectTrigger id="e-comm" class="w-full">
-						{editForm.default_community_id
-							? communityLabel(editForm.default_community_id)
-							: 'Не выбрано'}
-					</SelectTrigger>
-					<SelectContent>
-						<SelectItem value={NONE_OPTION}>Не выбрано</SelectItem>
-						{#each communities as c (c.id)}
-							<SelectItem value={c.id}>{communityOptionLabel(c)}</SelectItem>
-						{/each}
-					</SelectContent>
-				</Select>
-				<Button
-					type="button"
-					variant="ghost"
-					size="sm"
-					class="h-7 px-2"
-					onclick={() => {
-						editForm.default_community_id = null;
-					}}
-				>
-					Сбросить
-				</Button>
-			</div>
-			{#if mod?.type === 'DOMAINS'}
-				<div class="space-y-1.5">
-					<Label for="e-doh-policy">Политика DoH</Label>
-					<Select
-						type="single"
-						value={editForm.doh_resolver_policy ?? 'primary_only'}
-						onValueChange={(v) => {
-							if (v) editForm.doh_resolver_policy = v as DohResolverPolicy;
-						}}
-					>
-						<SelectTrigger id="e-doh-policy" class="w-full">
-							{dohPolicyLabel(editForm.doh_resolver_policy)}
-						</SelectTrigger>
-						<SelectContent>
-							{#each dohPolicyOptions as opt (opt.value)}
-								<SelectItem value={opt.value}>{opt.label}</SelectItem>
-							{/each}
-						</SelectContent>
-					</Select>
-					<p class="text-xs text-muted-foreground">
-						{dohPolicyOptions.find(
-							(o) => o.value === (editForm.doh_resolver_policy ?? 'primary_only')
-						)?.hint}
-					</p>
-				</div>
-				<div class="space-y-2">
-					<Label>DoH-профили</Label>
-					<p class="text-xs text-muted-foreground">
-						Порядок выбора = порядок в списке (сверху вниз).
-					</p>
-					<div class="max-h-40 space-y-2 overflow-y-auto rounded-md border p-3">
-						{#each dohProfiles as d (d.id)}
-							<label class="flex items-start gap-2 text-sm">
-								<Checkbox
-									checked={isEditDohProfileSelected(d.id)}
-									onCheckedChange={(v) => toggleEditDohProfile(d.id, v === true)}
-								/>
-								<span class="min-w-0 break-all">
-									<span class="font-medium">{d.name?.trim() ? d.name : d.url}</span>
-									{#if d.name?.trim()}
-										<span class="block font-mono text-xs text-muted-foreground">{d.url}</span>
-									{/if}
-								</span>
-							</label>
-						{:else}
-							<p class="text-muted-foreground text-xs">Нет профилей — создайте в справочниках.</p>
-						{/each}
-					</div>
-					<Button
-						type="button"
-						variant="ghost"
-						size="sm"
-						class="h-7 px-2"
-						onclick={() => {
-							editForm = { ...editForm, doh_profile_ids: [] };
-						}}
-					>
-						Сбросить профили
-					</Button>
-				</div>
-			{/if}
-			<div
-				class="flex flex-row items-center justify-between gap-4 rounded-lg border border-border bg-muted/30 p-3"
-			>
-				<div class="grid min-w-0 flex-1 gap-1 pr-2">
-					<Label for="e-enabled" class="leading-snug text-foreground">Включён</Label>
-					<p class="text-xs leading-snug text-muted-foreground">
-						Отключённые модули не участвуют в обновлении конфигурации.
-					</p>
-				</div>
-				<Switch
-					id="e-enabled"
-					class="shrink-0"
-					checked={editForm.enabled !== false}
-					onCheckedChange={(v) => {
-						editForm = { ...editForm, enabled: v };
-					}}
-				/>
-			</div>
-		</div>
-		<DialogFooter>
-			<Button variant="outline" onclick={() => (editDialog = false)}>Отмена</Button>
-			<Button onclick={saveMod} disabled={editSaving}
-				>{editSaving ? 'Сохранение…' : 'Сохранить'}</Button
-			>
-		</DialogFooter>
-	</DialogContent>
-</Dialog>
-
-<!-- Delete module confirm -->
-<AlertDialog bind:open={deleteModDialog}>
-	<AlertDialogContent>
-		<AlertDialogHeader>
-			<AlertDialogTitle>Удалить модуль «{mod?.name}»?</AlertDialogTitle>
-			<AlertDialogDescription
-				>Это действие необратимо. Модуль и все его записи будут удалены.</AlertDialogDescription
-			>
-		</AlertDialogHeader>
-		<AlertDialogFooter>
-			<AlertDialogCancel>Отмена</AlertDialogCancel>
-			<AlertDialogAction onclick={deleteMod} disabled={deletingMod}>
-				{deletingMod ? 'Удаление…' : 'Удалить'}
-			</AlertDialogAction>
-		</AlertDialogFooter>
-	</AlertDialogContent>
-</AlertDialog>
-
-<!-- ================== AS Entry Dialog ================== -->
-<Dialog bind:open={asDialog}>
-	<DialogContent class="sm:max-w-sm">
-		<DialogHeader>
-			<DialogTitle>{asEdit ? 'Редактировать запись' : 'Новая AS-запись'}</DialogTitle>
-			<DialogDescription
-				>Номер автономной системы и community для политики анонса.</DialogDescription
-			>
-		</DialogHeader>
-		<div class="space-y-4 py-2">
-			<div class="space-y-1.5">
-				<Label for="as-asn">ASN</Label>
-				<Input
-					id="as-asn"
-					type="number"
-					placeholder="12345"
-					bind:value={asForm.asn}
-					min={1}
-					max={4294967295}
-				/>
-			</div>
-			<div class="space-y-1.5">
-				<Label for="as-comm">Community</Label>
-				<Select
-					type="single"
-					value={nullableSelectValue(asForm.community_id)}
-					onValueChange={(v) => {
-						asForm.community_id = fromNullableSelect(v);
-					}}
-				>
-					<SelectTrigger id="as-comm" class="w-full">
-						{asForm.community_id ? communityLabel(asForm.community_id) : 'Не выбрано'}
-					</SelectTrigger>
-					<SelectContent>
-						<SelectItem value={NONE_OPTION}>Не выбрано</SelectItem>
-						{#each communities as c (c.id)}
-							<SelectItem value={c.id}>{communityOptionLabel(c)}</SelectItem>
-						{/each}
-					</SelectContent>
-				</Select>
-			</div>
-		</div>
-		<DialogFooter>
-			<Button variant="outline" onclick={() => (asDialog = false)}>Отмена</Button>
-			<Button onclick={saveAs} disabled={asSaving}
-				>{asSaving ? 'Сохранение…' : asEdit ? 'Сохранить' : 'Добавить'}</Button
-			>
-		</DialogFooter>
-	</DialogContent>
-</Dialog>
-
-<AlertDialog
-	open={!!asDeleteTarget}
-	onOpenChange={(v) => {
-		if (!v) asDeleteTarget = null;
-	}}
->
-	<AlertDialogContent>
-		<AlertDialogHeader>
-			<AlertDialogTitle>Удалить запись?</AlertDialogTitle>
-			<AlertDialogDescription>ASN: {asDeleteTarget?.asn ?? '—'}</AlertDialogDescription>
-		</AlertDialogHeader>
-		<AlertDialogFooter>
-			<AlertDialogCancel onclick={() => (asDeleteTarget = null)}>Отмена</AlertDialogCancel>
-			<AlertDialogAction onclick={deleteAs}>Удалить</AlertDialogAction>
-		</AlertDialogFooter>
-	</AlertDialogContent>
-</AlertDialog>
-
-<AlertDialog bind:open={asBulkDeleteDialog}>
-	<AlertDialogContent>
-		<AlertDialogHeader>
-			<AlertDialogTitle>Удалить выбранные AS-записи?</AlertDialogTitle>
-			<AlertDialogDescription>Будет удалено: {selectedAsCount}</AlertDialogDescription>
-		</AlertDialogHeader>
-		<AlertDialogFooter>
-			<AlertDialogCancel>Отмена</AlertDialogCancel>
-			<AlertDialogAction onclick={bulkDeleteAs} disabled={deletingAsBulk}>
-				{deletingAsBulk ? 'Удаление…' : 'Удалить'}
-			</AlertDialogAction>
-		</AlertDialogFooter>
-	</AlertDialogContent>
-</AlertDialog>
-
-<!-- ================== CDN Source Dialog ================== -->
-<Dialog
-	bind:open={cdnDialog}
-	onOpenChange={(open) => {
-		if (!open) clearCdnPreview();
-	}}
->
-	<DialogContent class="sm:max-w-lg">
-		<DialogHeader>
-			<DialogTitle>{cdnEdit ? 'Редактировать источник' : 'Новый CDN-источник'}</DialogTitle>
-		</DialogHeader>
-		<div class="space-y-4 py-2">
-			<div class="space-y-1.5">
-				<Label for="cdn-url">URL</Label>
-				<Input id="cdn-url" placeholder="https://example.com/list.txt" bind:value={cdnForm.url} />
-			</div>
-			<div class="space-y-1.5">
-				<Label for="cdn-kind">Тип источника</Label>
-				<Select
-					type="single"
-					value={cdnForm.source_kind}
-					onValueChange={(v) => {
-						cdnForm.source_kind = v || 'plaintext';
-					}}
-				>
-					<SelectTrigger id="cdn-kind" class="w-full">
-						{cdnForm.source_kind === 'json' ? 'json' : 'plaintext'}
-					</SelectTrigger>
-					<SelectContent>
-						<SelectItem value="plaintext">plaintext</SelectItem>
-						<SelectItem value="json">json</SelectItem>
-					</SelectContent>
-				</Select>
-			</div>
-			<div class="space-y-1.5">
-				<Label for="cdn-prefix-path">JSON path (prefix_path)</Label>
-				<Input
-					id="cdn-prefix-path"
-					placeholder="напр. prefixes[] или data.items[].cidr"
-					bind:value={cdnForm.prefix_path}
-				/>
-				{#if cdnForm.source_kind === 'json' && !cdnForm.prefix_path?.trim()}
-					<p class="text-xs text-muted-foreground">
-						Для JSON укажите путь к полям с CIDR; пустой путь может не дать префиксов.
-					</p>
-				{/if}
-			</div>
-			<div class="space-y-1.5">
-				<Label for="cdn-comm">Community</Label>
-				<Select
-					type="single"
-					value={nullableSelectValue(cdnForm.community_id)}
-					onValueChange={(v) => {
-						cdnForm.community_id = fromNullableSelect(v);
-					}}
-				>
-					<SelectTrigger id="cdn-comm" class="w-full">
-						{cdnForm.community_id ? communityLabel(cdnForm.community_id) : 'Не выбрано'}
-					</SelectTrigger>
-					<SelectContent>
-						<SelectItem value={NONE_OPTION}>Не выбрано</SelectItem>
-						{#each communities as c (c.id)}
-							<SelectItem value={c.id}>{communityOptionLabel(c)}</SelectItem>
-						{/each}
-					</SelectContent>
-				</Select>
-			</div>
-			<div class="space-y-1.5">
-				<Label for="cdn-interval">Интервал обновления (сек)</Label>
-				<Input
-					id="cdn-interval"
-					type="number"
-					placeholder="3600"
-					bind:value={cdnForm.refresh_interval_sec}
-				/>
-			</div>
-			<div class="flex flex-col gap-2 rounded-lg border border-border p-3">
-				<div class="flex flex-wrap items-center gap-2">
-					<Button
-						type="button"
-						variant="secondary"
-						size="sm"
-						onclick={previewCdn}
-						disabled={cdnPreviewLoading}
-					>
-						{cdnPreviewLoading ? 'Загрузка…' : 'Предпросмотр'}
-					</Button>
-					{#if cdnPreviewError}
-						<span class="text-sm text-destructive">{cdnPreviewError}</span>
-					{:else if cdnPreviewOk}
-						<span class="text-sm text-muted-foreground">
-							Всего: {cdnPreviewTotal}{#if cdnPreviewTruncated}
-								<span class="text-amber-600 dark:text-amber-500"> (обрезано)</span>{/if}
-						</span>
-					{/if}
-				</div>
-				{#if cdnPreviewItems.length}
-					<ul class="max-h-48 overflow-y-auto rounded-md border bg-muted/40 p-2 font-mono text-xs">
-						{#each cdnPreviewItems as item, i (`${i}-${item}`)}
-							<li class="py-0.5">{item}</li>
-						{/each}
-					</ul>
-				{/if}
-			</div>
-		</div>
-		<DialogFooter>
-			<Button variant="outline" onclick={() => (cdnDialog = false)}>Отмена</Button>
-			<Button onclick={saveCdn} disabled={cdnSaving}
-				>{cdnSaving ? 'Сохранение…' : cdnEdit ? 'Сохранить' : 'Добавить'}</Button
-			>
-		</DialogFooter>
-	</DialogContent>
-</Dialog>
-
-<AlertDialog
-	open={!!cdnDeleteTarget}
-	onOpenChange={(v) => {
-		if (!v) cdnDeleteTarget = null;
-	}}
->
-	<AlertDialogContent>
-		<AlertDialogHeader>
-			<AlertDialogTitle>Удалить CDN-источник?</AlertDialogTitle>
-			<AlertDialogDescription>{cdnDeleteTarget?.url}</AlertDialogDescription>
-		</AlertDialogHeader>
-		<AlertDialogFooter>
-			<AlertDialogCancel onclick={() => (cdnDeleteTarget = null)}>Отмена</AlertDialogCancel>
-			<AlertDialogAction onclick={deleteCdn}>Удалить</AlertDialogAction>
-		</AlertDialogFooter>
-	</AlertDialogContent>
-</AlertDialog>
-
-<AlertDialog bind:open={cdnBulkDeleteDialog}>
-	<AlertDialogContent>
-		<AlertDialogHeader>
-			<AlertDialogTitle>Удалить выбранные CDN-источники?</AlertDialogTitle>
-			<AlertDialogDescription>Будет удалено: {selectedCdnCount}</AlertDialogDescription>
-		</AlertDialogHeader>
-		<AlertDialogFooter>
-			<AlertDialogCancel>Отмена</AlertDialogCancel>
-			<AlertDialogAction onclick={bulkDeleteCdn} disabled={deletingCdnBulk}>
-				{deletingCdnBulk ? 'Удаление…' : 'Удалить'}
-			</AlertDialogAction>
-		</AlertDialogFooter>
-	</AlertDialogContent>
-</AlertDialog>
-
-<!-- ================== Domain Entry Dialog ================== -->
-<Dialog bind:open={domainDialog}>
-	<DialogContent class="sm:max-w-sm">
-		<DialogHeader>
-			<DialogTitle>{domainEdit ? 'Редактировать домен' : 'Новый домен'}</DialogTitle>
-		</DialogHeader>
-		<div class="space-y-4 py-2">
-			<div class="space-y-1.5">
-				<Label for="dom-fqdn">FQDN</Label>
-				<Input id="dom-fqdn" placeholder="example.com" bind:value={domainForm.fqdn} />
-			</div>
-			<div class="space-y-1.5">
-				<Label for="dom-comm">Community</Label>
-				<Select
-					type="single"
-					value={nullableSelectValue(domainForm.community_id)}
-					onValueChange={(v) => {
-						domainForm.community_id = fromNullableSelect(v);
-					}}
-				>
-					<SelectTrigger id="dom-comm" class="w-full">
-						{domainForm.community_id ? communityLabel(domainForm.community_id) : 'Не выбрано'}
-					</SelectTrigger>
-					<SelectContent>
-						<SelectItem value={NONE_OPTION}>Не выбрано</SelectItem>
-						{#each communities as c (c.id)}
-							<SelectItem value={c.id}>{communityOptionLabel(c)}</SelectItem>
-						{/each}
-					</SelectContent>
-				</Select>
-			</div>
-		</div>
-		<DialogFooter>
-			<Button variant="outline" onclick={() => (domainDialog = false)}>Отмена</Button>
-			<Button onclick={saveDomain} disabled={domainSaving}
-				>{domainSaving ? 'Сохранение…' : domainEdit ? 'Сохранить' : 'Добавить'}</Button
-			>
-		</DialogFooter>
-	</DialogContent>
-</Dialog>
-
-<AlertDialog
-	open={!!domainDeleteTarget}
-	onOpenChange={(v) => {
-		if (!v) domainDeleteTarget = null;
-	}}
->
-	<AlertDialogContent>
-		<AlertDialogHeader>
-			<AlertDialogTitle>Удалить домен?</AlertDialogTitle>
-			<AlertDialogDescription>{domainDeleteTarget?.fqdn}</AlertDialogDescription>
-		</AlertDialogHeader>
-		<AlertDialogFooter>
-			<AlertDialogCancel onclick={() => (domainDeleteTarget = null)}>Отмена</AlertDialogCancel>
-			<AlertDialogAction onclick={deleteDomain}>Удалить</AlertDialogAction>
-		</AlertDialogFooter>
-	</AlertDialogContent>
-</AlertDialog>
-
-<AlertDialog bind:open={domainBulkDeleteDialog}>
-	<AlertDialogContent>
-		<AlertDialogHeader>
-			<AlertDialogTitle>Удалить выбранные домены?</AlertDialogTitle>
-			<AlertDialogDescription>Будет удалено: {selectedDomainCount}</AlertDialogDescription>
-		</AlertDialogHeader>
-		<AlertDialogFooter>
-			<AlertDialogCancel>Отмена</AlertDialogCancel>
-			<AlertDialogAction onclick={bulkDeleteDomain} disabled={deletingDomainBulk}>
-				{deletingDomainBulk ? 'Удаление…' : 'Удалить'}
-			</AlertDialogAction>
-		</AlertDialogFooter>
-	</AlertDialogContent>
-</AlertDialog>
-
-<!-- ================== IP Range Dialog ================== -->
-<Dialog bind:open={ipDialog}>
-	<DialogContent class="sm:max-w-sm">
-		<DialogHeader>
-			<DialogTitle>{ipEdit ? 'Редактировать диапазон' : 'Новый IP-диапазон'}</DialogTitle>
-		</DialogHeader>
-		<div class="space-y-4 py-2">
-			<div class="space-y-1.5">
-				<Label for="ip-prefix">Префикс (CIDR)</Label>
-				<Input id="ip-prefix" placeholder="203.0.113.0/24" bind:value={ipForm.prefix} />
-			</div>
-			<div class="space-y-1.5">
-				<Label for="ip-comm">Community (обязательно)</Label>
-				<Select
-					type="single"
-					value={ipForm.community_id}
-					onValueChange={(v) => {
-						ipForm.community_id = v;
-					}}
-				>
-					<SelectTrigger id="ip-comm" class="w-full">
-						{ipForm.community_id ? communityLabel(ipForm.community_id) : 'Выберите community'}
-					</SelectTrigger>
-					<SelectContent>
-						{#each communities as c (c.id)}
-							<SelectItem value={c.id}>{communityOptionLabel(c)}</SelectItem>
-						{/each}
-					</SelectContent>
-				</Select>
-			</div>
-		</div>
-		<DialogFooter>
-			<Button variant="outline" onclick={() => (ipDialog = false)}>Отмена</Button>
-			<Button onclick={saveIp} disabled={ipSaving}
-				>{ipSaving ? 'Сохранение…' : ipEdit ? 'Сохранить' : 'Добавить'}</Button
-			>
-		</DialogFooter>
-	</DialogContent>
-</Dialog>
-
-<AlertDialog
-	open={!!ipDeleteTarget}
-	onOpenChange={(v) => {
-		if (!v) ipDeleteTarget = null;
-	}}
->
-	<AlertDialogContent>
-		<AlertDialogHeader>
-			<AlertDialogTitle>Удалить диапазон?</AlertDialogTitle>
-			<AlertDialogDescription>{ipDeleteTarget?.prefix}</AlertDialogDescription>
-		</AlertDialogHeader>
-		<AlertDialogFooter>
-			<AlertDialogCancel onclick={() => (ipDeleteTarget = null)}>Отмена</AlertDialogCancel>
-			<AlertDialogAction onclick={deleteIp}>Удалить</AlertDialogAction>
-		</AlertDialogFooter>
-	</AlertDialogContent>
-</AlertDialog>
-
-<AlertDialog bind:open={ipBulkDeleteDialog}>
-	<AlertDialogContent>
-		<AlertDialogHeader>
-			<AlertDialogTitle>Удалить выбранные диапазоны?</AlertDialogTitle>
-			<AlertDialogDescription>Будет удалено: {selectedIpCount}</AlertDialogDescription>
-		</AlertDialogHeader>
-		<AlertDialogFooter>
-			<AlertDialogCancel>Отмена</AlertDialogCancel>
-			<AlertDialogAction onclick={bulkDeleteIp} disabled={deletingIpBulk}>
-				{deletingIpBulk ? 'Удаление…' : 'Удалить'}
-			</AlertDialogAction>
-		</AlertDialogFooter>
-	</AlertDialogContent>
-</AlertDialog>