feat(MikrotikTools): add traceroute and ping mode selection with reset and run buttons for enhanced user interaction
Publish Fast Tabler Docker image / build-and-push-fast (push) Failing after 3m53s
Publish Fast Tabler Docker image / build-and-push-fast (push) Failing after 3m53s
This commit is contained in:
@@ -395,6 +395,41 @@ function MikrotikTools() {
|
|||||||
);
|
);
|
||||||
})}
|
})}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
{/* Режим и действия — под выбором цели, стандартный размер Tabler */}
|
||||||
|
<div className="d-flex flex-wrap align-items-center gap-2 mt-3 pt-2 border-top">
|
||||||
|
<ul className="nav nav-pills mb-0" role="tablist">
|
||||||
|
<li className="nav-item">
|
||||||
|
<button
|
||||||
|
type="button"
|
||||||
|
className={`nav-link ${mode === 'traceroute' ? 'active' : ''}`}
|
||||||
|
onClick={() => { setMode('traceroute'); setHops([]); setAnalysis([]); setPingResult(null); }}
|
||||||
|
role="tab"
|
||||||
|
>
|
||||||
|
Traceroute
|
||||||
|
</button>
|
||||||
|
</li>
|
||||||
|
<li className="nav-item">
|
||||||
|
<button
|
||||||
|
type="button"
|
||||||
|
className={`nav-link ${mode === 'ping' ? 'active' : ''}`}
|
||||||
|
onClick={() => { setMode('ping'); setHops([]); setAnalysis([]); setPingResult(null); }}
|
||||||
|
role="tab"
|
||||||
|
>
|
||||||
|
Ping
|
||||||
|
</button>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
<div className="btn-list">
|
||||||
|
<button type="button" className="btn btn-outline-secondary" onClick={handleReset} disabled={running}>
|
||||||
|
<IconRefresh size={16} className="me-1" />
|
||||||
|
Сбросить
|
||||||
|
</button>
|
||||||
|
<button type="button" className="btn btn-primary" onClick={handleRunCheck} disabled={running || loading}>
|
||||||
|
{running ? 'Выполнение…' : (mode === 'traceroute' ? 'Запустить трассировку' : 'Запустить ping')}
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</>
|
</>
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
@@ -404,43 +439,8 @@ function MikrotikTools() {
|
|||||||
<div className="row g-2">
|
<div className="row g-2">
|
||||||
<div className="col-md-4">
|
<div className="col-md-4">
|
||||||
<div className="card mb-2">
|
<div className="card mb-2">
|
||||||
<div className="card-header py-2 d-flex flex-wrap align-items-center gap-2">
|
<div className="card-header py-2">
|
||||||
<h3 className="card-title mb-0">Параметры</h3>
|
<h3 className="card-title mb-0">Параметры</h3>
|
||||||
{serverId && (
|
|
||||||
<>
|
|
||||||
<ul className="nav nav-pills nav-pills-sm mb-0" role="tablist">
|
|
||||||
<li className="nav-item">
|
|
||||||
<button
|
|
||||||
type="button"
|
|
||||||
className={`nav-link ${mode === 'traceroute' ? 'active' : ''}`}
|
|
||||||
onClick={() => { setMode('traceroute'); setHops([]); setAnalysis([]); setPingResult(null); }}
|
|
||||||
role="tab"
|
|
||||||
>
|
|
||||||
Traceroute
|
|
||||||
</button>
|
|
||||||
</li>
|
|
||||||
<li className="nav-item">
|
|
||||||
<button
|
|
||||||
type="button"
|
|
||||||
className={`nav-link ${mode === 'ping' ? 'active' : ''}`}
|
|
||||||
onClick={() => { setMode('ping'); setHops([]); setAnalysis([]); setPingResult(null); }}
|
|
||||||
role="tab"
|
|
||||||
>
|
|
||||||
Ping
|
|
||||||
</button>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
<div className="btn-list ms-auto">
|
|
||||||
<button type="button" className="btn btn-sm btn-outline-secondary" onClick={handleReset} disabled={running}>
|
|
||||||
<IconRefresh size={14} className="me-1" />
|
|
||||||
Сбросить
|
|
||||||
</button>
|
|
||||||
<button type="button" className="btn btn-sm btn-primary" onClick={handleRunCheck} disabled={running || loading}>
|
|
||||||
{running ? '…' : (mode === 'traceroute' ? 'Трассировка' : 'Ping')}
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</>
|
|
||||||
)}
|
|
||||||
</div>
|
</div>
|
||||||
<div className="card-body py-2">
|
<div className="card-body py-2">
|
||||||
{loading && !networkConfig ? (
|
{loading && !networkConfig ? (
|
||||||
|
|||||||
Reference in New Issue
Block a user