feat(MikrotikTools): add toggle for DNS/IP display in traceroute results for enhanced user control

frontend/src/MikrotikTools.jsx

@@ -30,6 +30,7 @@ function MikrotikTools() {
   const [running, setRunning] = useState(false);
   const [hops, setHops] = useState([]);
   const [analysis, setAnalysis] = useState([]);
+  const [useDns, setUseDns] = useState(true);
 
   // Загрузка серверов и сетевого конфига
   useEffect(() => {
@@ -249,7 +250,24 @@ function MikrotikTools() {
         <div className="col-md-8">
           <div className="card mb-3">
             <div className="card-header">
-              <h3 className="card-title">Результаты трассировки</h3>
+              <div className="d-flex align-items-center justify-content-between">
+                <h3 className="card-title mb-0">Результаты трассировки</h3>
+                <div className="d-flex align-items-center">
+                  <span className="me-2 text-muted small">Отображать</span>
+                  <div className="form-check form-switch mb-0">
+                    <input
+                      className="form-check-input"
+                      type="checkbox"
+                      id="useDnsToggle"
+                      checked={useDns}
+                      onChange={(e) => setUseDns(e.target.checked)}
+                    />
+                    <label className="form-check-label small" htmlFor="useDnsToggle">
+                      {useDns ? 'DNS + IP' : 'только IP'}
+                    </label>
+                  </div>
+                </div>
+              </div>
             </div>
             <div className="card-body p-0">
               {hops.length === 0 ? (
@@ -273,9 +291,14 @@ function MikrotikTools() {
                       {hops.map((h) => {
                         const ip = h.ip || '';
                         const dns = h.dns || '';
-                        const mainLabel = dns
-                          ? `${dns}${ip ? ` (${ip})` : ''}`
-                          : (ip || h.host || '—');
+
+                        let mainLabel;
+                        if (useDns) {
+                          if (dns && ip) mainLabel = `${dns} (${ip})`;
+                          else mainLabel = dns || ip || h.host || '—';
+                        } else {
+                          mainLabel = ip || dns || h.host || '—';
+                        }
 
                         return (
                         <tr key={h.hop || `${ip || h.host}-${Math.random()}`}>