feat: Восстановить классические карточки добавления новых ASN, доменов и IP-диапазонов в соответствующих менеджерах, улучшив интерфейс для ввода данных пользователем

2025-08-27 18:12:55 +07:00
parent d30a507f60
commit 46c80fdf32
3 changed files with 174 additions and 0 deletions
@@ -723,6 +723,63 @@ function IPRangesManager() {
      />
      <div className="row">
        <div className="col-lg-3">
+          {/* Classic Add New Item Card (restored) */}
+          <div className="card card-md">
+            <div className="card-header">
+              <h3 className="card-title">
+                <IconPlus className="icon me-2" />
+                Добавить новый IP-диапазон
+              </h3>
+            </div>
+            <div className="card-body">
+              <form onSubmit={(e) => { e.preventDefault(); handleAddItem(); }}>
+                <div className="mb-3">
+                  <label className="form-label">IP-диапазон</label>
+                  <input
+                    type="text"
+                    className={`form-control${newInvalid.ipRange ? ' is-invalid' : ''}`}
+                    placeholder="192.168.1.0/24"
+                    value={newItem.ipRange}
+                    onChange={(e) => setNewItem({ ...newItem, ipRange: e.target.value })}
+                  />
+                  {newInvalid.ipRange && <div className="invalid-feedback">Некорректный CIDR</div>}
+                  <div className="form-text">Формат: A.B.C.D/Маска, например 10.0.0.0/24</div>
+                </div>
+                <div className="mb-3">
+                  <label className="form-label">Community</label>
+                  <CommunityAutocompleteInput
+                    value={newItem.community}
+                    onChange={(v) => setNewItem({ ...newItem, community: v })}
+                    communities={communities}
+                    placeholder="Начните вводить номер или имя"
+                    className={`form-control${newInvalid.community ? ' is-invalid' : ''}`}
+                  />
+                  {newInvalid.community && <div className="invalid-feedback">Только цифры</div>}
+                  {(() => {
+                    const match = communities.find(c => c.value === String(newItem.community).trim());
+                    if (!match) return null;
+                    return (
+                      <div className="form-text">
+                        {match.name && (<><strong>{match.name}</strong> — </>)}
+                        {match.description || ''}
+                        {match.tags && match.tags.length > 0 && (
+                          <> (<span className="text-muted">{match.tags.join(', ')}</span>)</>
+                        )}
+                      </div>
+                    );
+                  })()}
+                </div>
+                <div className="form-footer">
+                  <button type="submit" className="btn btn-primary w-100">
+                    <IconPlus className="icon me-2" />
+                    Добавить
+                  </button>
+                </div>
+              </form>
+            </div>
+          </div>
+
+          {/* QuickAdd stays for batch input */}
          <QuickAddBar
            placeholder={'192.168.1.0/24 65000:100'}
            help={'Вставьте строки: CIDR ПРОБЕЛ COMMUNITY'}