From ae88a3a46a489d3143a1a61f4745e3098686ea60 Mon Sep 17 00:00:00 2001
From: shats <admin@shts.su>
Date: Tue, 11 Nov 2025 21:08:45 +0700
Subject: [PATCH] =?UTF-8?q?feat:=20=D0=9E=D0=B1=D0=BD=D0=BE=D0=B2=D0=BB?=
 =?UTF-8?q?=D0=B5=D0=BD=D0=B8=D0=B5=20=D0=BA=D0=BE=D0=BC=D0=BF=D0=BE=D0=BD?=
 =?UTF-8?q?=D0=B5=D0=BD=D1=82=D0=B0=20AutoUrlManager=20=D1=81=20=D0=B4?=
 =?UTF-8?q?=D0=BE=D0=B1=D0=B0=D0=B2=D0=BB=D0=B5=D0=BD=D0=B8=D0=B5=D0=BC=20?=
 =?UTF-8?q?=D0=BD=D0=BE=D0=B2=D1=8B=D1=85=20=D1=84=D1=83=D0=BD=D0=BA=D1=86?=
 =?UTF-8?q?=D0=B8=D0=B9,=20=D1=82=D0=B0=D0=BA=D0=B8=D1=85=20=D0=BA=D0=B0?=
 =?UTF-8?q?=D0=BA=20=D0=B8=D0=BC=D0=BF=D0=BE=D1=80=D1=82=20URL=20=D0=B8=20?=
 =?UTF-8?q?=D0=BE=D1=87=D0=B8=D1=81=D1=82=D0=BA=D0=B0=20=D0=BF=D1=83=D1=81?=
 =?UTF-8?q?=D1=82=D1=8B=D1=85=20=D1=81=D1=82=D1=80=D0=BE=D0=BA.=20=D0=92?=
 =?UTF-8?q?=D0=BD=D0=B5=D0=B4=D1=80=D0=B5=D0=BD=D1=8B=20=D0=BD=D0=BE=D0=B2?=
 =?UTF-8?q?=D1=8B=D0=B5=20=D0=BA=D0=BE=D0=BC=D0=BF=D0=BE=D0=BD=D0=B5=D0=BD?=
 =?UTF-8?q?=D1=82=D1=8B=20=D0=B4=D0=BB=D1=8F=20=D1=83=D0=BB=D1=83=D1=87?=
 =?UTF-8?q?=D1=88=D0=B5=D0=BD=D0=B8=D1=8F=20=D0=BF=D0=BE=D0=BB=D1=8C=D0=B7?=
 =?UTF-8?q?=D0=BE=D0=B2=D0=B0=D1=82=D0=B5=D0=BB=D1=8C=D1=81=D0=BA=D0=BE?=
 =?UTF-8?q?=D0=B3=D0=BE=20=D0=B8=D0=BD=D1=82=D0=B5=D1=80=D1=84=D0=B5=D0=B9?=
 =?UTF-8?q?=D1=81=D0=B0=20=D0=B8=20=D0=B2=D0=B7=D0=B0=D0=B8=D0=BC=D0=BE?=
 =?UTF-8?q?=D0=B4=D0=B5=D0=B9=D1=81=D1=82=D0=B2=D0=B8=D1=8F,=20=D0=B0=20?=
 =?UTF-8?q?=D1=82=D0=B0=D0=BA=D0=B6=D0=B5=20=D1=83=D0=BB=D1=83=D1=87=D1=88?=
 =?UTF-8?q?=D0=B5=D0=BD=D0=B0=20=D0=B2=D0=B0=D0=BB=D0=B8=D0=B4=D0=B0=D1=86?=
 =?UTF-8?q?=D0=B8=D1=8F=20=D0=B8=20=D0=BE=D0=B1=D1=80=D0=B0=D0=B1=D0=BE?=
 =?UTF-8?q?=D1=82=D0=BA=D0=B0=20=D0=BE=D1=88=D0=B8=D0=B1=D0=BE=D0=BA.?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/src/AutoUrlManager.jsx | 238 ++++++++++++++++++--------------
 1 file changed, 134 insertions(+), 104 deletions(-)

diff --git a/frontend/src/AutoUrlManager.jsx b/frontend/src/AutoUrlManager.jsx
index 717262b..d79e437 100644
--- a/frontend/src/AutoUrlManager.jsx
+++ b/frontend/src/AutoUrlManager.jsx
@@ -13,6 +13,11 @@ import {
   IconCircleCheck,
   IconCopy
 } from '@tabler/icons-react';
+import PageHeader from './components/PageHeader.jsx';
+import PageHeaderActions from './components/PageHeaderActions.jsx';
+import TableSkeleton, { TableEmpty } from './components/TableSkeleton.jsx';
+import EmptyState from './components/EmptyState.jsx';
+import ImportModal from './components/ImportModal.jsx';
 
 function AutoUrlManager() {
   const [urls, setUrls] = useState([]);
@@ -22,6 +27,7 @@ function AutoUrlManager() {
   const [message, setMessage] = useState('');
   const [messageType, setMessageType] = useState('');
   const [touched, setTouched] = useState({});
+  const [importOpen, setImportOpen] = useState(false);
 
   useEffect(() => {
     fetchUrls();
@@ -45,6 +51,10 @@ function AutoUrlManager() {
     setUrls([...urls, { url: '', community: '' }]);
   };
 
+  const clearEmptyRows = () => {
+    setUrls(urls.filter(u => u != null && (u.url || u.community)));
+  };
+
   const removeUrl = (index) => {
     setUrls(urls.filter((_, i) => i !== index));
   };
@@ -144,24 +154,83 @@ function AutoUrlManager() {
     }
   };
 
-  if (loading) {
-    return (
-      <div className="d-flex justify-content-center align-items-center" style={{ minHeight: '200px' }}>
-        <div className="spinner-border" role="status" aria-label="Загрузка"></div>
-      </div>
-    );
-  }
-
   return (
     <div>
-      <div className="page-header d-print-none mb-4">
-        <div className="row align-items-center">
-          <div className="col">
-            <h2 className="page-title">Автоматические URL</h2>
-            <div className="page-pretitle">Управление автоматическими URL-адресами для загрузки списков IP и доменов</div>
+      <PageHeader
+        title="Автоматические URL"
+        pretitle="Управление автоматическими URL-адресами для загрузки списков IP и доменов"
+        actions={(
+          <div className="d-flex align-items-center justify-content-between">
+            <div className="btn-list">
+              <button 
+                className="btn btn-outline-primary"
+                type="button"
+                onClick={() => setImportOpen(true)}
+                disabled={saving || processing}
+                title="Импорт из текста или файла"
+              >
+                <IconUpload className="me-1" /> Импорт
+              </button>
+              <button 
+                className="btn btn-primary"
+                type="button"
+                onClick={addUrl}
+                disabled={saving || processing}
+                title="Добавить строку"
+              >
+                <IconPlus className="me-1" /> Добавить URL
+              </button>
+            </div>
+            <div className="ms-auto btn-list">
+              <button
+                className="btn btn-outline-secondary"
+                type="button"
+                onClick={clearEmptyRows}
+                disabled={saving || processing || urls.length === 0}
+                title="Удалить пустые строки"
+              >
+                Очистить пустые
+              </button>
+              <button
+                className="btn btn-outline-primary"
+                type="button"
+                onClick={saveUrls}
+                disabled={saving || processing || !hasAtLeastOneValidRow}
+                title="Сохранить список URL"
+              >
+                {saving ? (
+                  <>
+                    <span className="spinner-border spinner-border-sm me-2" role="status" />
+                    Сохранение...
+                  </>
+                ) : (
+                  <>
+                    <IconDeviceFloppy className="me-1" /> Сохранить
+                  </>
+                )}
+              </button>
+              <button
+                className="btn btn-primary"
+                type="button"
+                onClick={processUrls}
+                disabled={saving || processing || !hasAtLeastOneValidRow}
+                title="Загрузить и обработать все URL"
+              >
+                {processing ? (
+                  <>
+                    <span className="spinner-border spinner-border-sm me-2" role="status" />
+                    Обработка...
+                  </>
+                ) : (
+                  <>
+                    <IconDownload className="me-1" /> Загрузить списки
+                  </>
+                )}
+              </button>
+            </div>
           </div>
-        </div>
-      </div>
+        )}
+      />
 
       {message && (
         <div className={`alert alert-${messageType === 'error' ? 'danger' : 'success'} alert-dismissible`} role="alert">
@@ -174,53 +243,36 @@ function AutoUrlManager() {
       )}
 
       <div className="card">
-        <div className="card-header">
-          <h3 className="card-title">URL-адреса для автоматической загрузки</h3>
-          <div className="card-actions">
-            <div className="btn-list">
-              <button 
-                className="btn btn-outline-secondary btn-sm" 
-                onClick={() => {
-                  const text = window.prompt('Вставьте строки вида: URL ПРОБЕЛ COMMUNITY (по одной записи на строку)');
-                  if (!text) return;
-                  const lines = text.split(/\r?\n/).map(l => l.trim()).filter(Boolean);
-                  const parsed = lines.map(l => {
-                    const [u, c] = l.split(/\s+/);
-                    return { url: u || '', community: c || '' };
-                  });
-                  setUrls(prev => [...prev, ...parsed]);
-                }}
-                disabled={saving || processing}
-                title="Массовое добавление из буфера"
-              >
-                <IconUpload className="me-1" />
-                Импорт
-              </button>
-              <button 
-                className="btn btn-primary btn-sm" 
-                onClick={addUrl}
-                disabled={saving || processing}
-              >
-                <IconPlus className="me-1" />
-                Добавить URL
-              </button>
-            </div>
-          </div>
-        </div>
         <div className="card-body">
-          {urls.length === 0 ? (
-            <div className="text-center text-muted py-4">
-              <IconAlertCircle size={48} className="mb-3" />
-              <p>Нет добавленных URL-адресов</p>
-              <button 
-                className="btn btn-primary" 
-                onClick={addUrl}
-                disabled={saving || processing}
-              >
-                <IconPlus className="me-1" />
-                Добавить первый URL
-              </button>
-            </div>
+          {loading ? (
+            <TableSkeleton rows={6} cols={3} />
+          ) : urls.length === 0 ? (
+            <EmptyState
+              icon={IconAlertCircle}
+              title="Нет добавленных URL-адресов"
+              description="Добавьте хотя бы одну строку с корректным URL и числовым community."
+              size="default"
+              action={(
+                <button 
+                  className="btn btn-primary" 
+                  onClick={addUrl}
+                  disabled={saving || processing}
+                >
+                  <IconPlus className="me-1" />
+                  Добавить первый URL
+                </button>
+              )}
+              secondaryAction={(
+                <button 
+                  className="btn btn-outline-primary"
+                  onClick={() => setImportOpen(true)}
+                  disabled={saving || processing}
+                >
+                  <IconUpload className="me-1" />
+                  Импорт
+                </button>
+              )}
+            />
           ) : (
             <div className="table-responsive">
               <table className="table card-table table-vcenter table-nowrap mb-0">
@@ -299,49 +351,8 @@ function AutoUrlManager() {
                 <span className="badge bg-blue-lt text-blue">Всего URL-адресов: {urls.length}</span>
               )}
             </div>
-            <div>
-              <button
-                className="btn btn-outline-secondary me-2"
-                onClick={() => setUrls(urls.filter(u => u != null && (u.url || u.community)))}
-                disabled={saving || processing || urls.length === 0}
-                title="Удалить пустые строки"
-              >
-                Очистить пустые
-              </button>
-              <button
-                className="btn btn-outline-primary me-2"
-                onClick={saveUrls}
-                disabled={saving || processing || !hasAtLeastOneValidRow}
-              >
-                {saving ? (
-                  <>
-                    <span className="spinner-border spinner-border-sm me-2" role="status" />
-                    Сохранение...
-                  </>
-                ) : (
-                  <>
-                    <IconDeviceFloppy className="me-1" />
-                    Сохранить
-                  </>
-                )}
-              </button>
-              <button
-                className="btn btn-primary"
-                onClick={processUrls}
-                disabled={saving || processing || !hasAtLeastOneValidRow}
-              >
-                {processing ? (
-                  <>
-                    <span className="spinner-border spinner-border-sm me-2" role="status" />
-                    Обработка...
-                  </>
-                ) : (
-                  <>
-                    <IconDownload className="me-1" />
-                    Загрузить списки
-                  </>
-                )}
-              </button>
+            <div className="text-muted small">
+              Введите http/https URL и числовой community. Не валидные поля подсвечиваются.
             </div>
           </div>
         </div>
@@ -405,6 +416,25 @@ function AutoUrlManager() {
           </div>
         </div>
       </div>
+
+      {/* Модальное окно импорта */}
+      <ImportModal
+        show={importOpen}
+        title="Импорт URL + community"
+        description="Формат строк: URL ПРОБЕЛ COMMUNITY. Например: https://example.com/ips.txt 555"
+        sampleHeader={['url', 'community']}
+        placeholder={'https://example.com/ips.txt 555\nhttps://test.com/domains.txt 666'}
+        parseLine={(line) => {
+          const [u, c] = String(line).split(/\s+/);
+          return { url: u || '', community: c || '' };
+        }}
+        validateItem={(obj) => Boolean(obj?.url) && Boolean(obj?.community)}
+        onConfirm={(items) => {
+          setUrls(prev => [...prev, ...items]);
+          setImportOpen(false);
+        }}
+        onClose={() => setImportOpen(false)}
+      />
     </div>
   );
 }