refactor(FilterManager): simplify layout by removing unnecessary elements and enhancing button handling for server actions
Publish Fast Tabler Docker image / build-and-push-fast (push) Failing after 55s
Publish Fast Tabler Docker image / build-and-push-fast (push) Failing after 55s
This commit is contained in:
+11
-119
@@ -1755,130 +1755,13 @@ function FilterManager() {
|
|||||||
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="page-wrapper">
|
<div>
|
||||||
<PageHeader
|
<PageHeader
|
||||||
title="Управление фильтрами frouting"
|
title="Управление фильтрами frouting"
|
||||||
icon={<IconFilter size={24} />}
|
icon={<IconFilter size={24} />}
|
||||||
actions={
|
|
||||||
<div className="btn-list">
|
|
||||||
<div className="dropdown">
|
|
||||||
<button
|
|
||||||
className="btn btn-primary dropdown-toggle"
|
|
||||||
type="button"
|
|
||||||
data-bs-toggle="dropdown"
|
|
||||||
aria-expanded="false"
|
|
||||||
>
|
|
||||||
<IconServer className="icon" />
|
|
||||||
{selectedServer ? selectedServer.name : 'Выбрать сервер'}
|
|
||||||
</button>
|
|
||||||
<div className="dropdown-menu dropdown-menu-end" style={{ minWidth: '300px' }}>
|
|
||||||
<div className="px-3 py-2">
|
|
||||||
<input
|
|
||||||
type="text"
|
|
||||||
className="form-control form-control-sm"
|
|
||||||
placeholder="Поиск серверов..."
|
|
||||||
value={serverSearch}
|
|
||||||
onChange={(e) => setServerSearch(e.target.value)}
|
|
||||||
onClick={(e) => e.stopPropagation()}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div className="dropdown-divider"></div>
|
|
||||||
{activeServers.length > 0 && (
|
|
||||||
<>
|
|
||||||
<h6 className="dropdown-header">Активные серверы</h6>
|
|
||||||
{activeServers.map(server => (
|
|
||||||
<a
|
|
||||||
key={server.id}
|
|
||||||
className={`dropdown-item ${selectedServer?.id === server.id ? 'active' : ''}`}
|
|
||||||
href="#"
|
|
||||||
onClick={(e) => {
|
|
||||||
e.preventDefault();
|
|
||||||
setSelectedServer(server);
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
<div className="d-flex align-items-center">
|
|
||||||
<IconServer size={16} className="me-2" />
|
|
||||||
<span className="flex-grow-1">{server.name}</span>
|
|
||||||
</div>
|
|
||||||
</a>
|
|
||||||
))}
|
|
||||||
</>
|
|
||||||
)}
|
|
||||||
{inactiveServers.length > 0 && (
|
|
||||||
<>
|
|
||||||
<div className="dropdown-divider"></div>
|
|
||||||
<h6 className="dropdown-header">Неактивные серверы</h6>
|
|
||||||
{inactiveServers.map(server => (
|
|
||||||
<a
|
|
||||||
key={server.id}
|
|
||||||
className={`dropdown-item ${selectedServer?.id === server.id ? 'active' : ''}`}
|
|
||||||
href="#"
|
|
||||||
onClick={(e) => {
|
|
||||||
e.preventDefault();
|
|
||||||
setSelectedServer(server);
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
<div className="d-flex align-items-center text-muted">
|
|
||||||
<IconServer size={16} className="me-2" />
|
|
||||||
<span className="flex-grow-1">{server.name}</span>
|
|
||||||
</div>
|
|
||||||
</a>
|
|
||||||
))}
|
|
||||||
</>
|
|
||||||
)}
|
|
||||||
<div className="dropdown-divider"></div>
|
|
||||||
<button
|
|
||||||
className="dropdown-item"
|
|
||||||
onClick={() => setServerListModalOpen(true)}
|
|
||||||
>
|
|
||||||
<IconSettings size={16} className="me-2" />
|
|
||||||
Управление серверами
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
{selectedServer && (
|
|
||||||
<>
|
|
||||||
<button
|
|
||||||
className="btn btn-outline-primary"
|
|
||||||
onClick={handlePreviewConfig}
|
|
||||||
disabled={serverFilters.length === 0}
|
|
||||||
>
|
|
||||||
<IconEye className="icon" />
|
|
||||||
Просмотр
|
|
||||||
</button>
|
|
||||||
<button
|
|
||||||
className="btn btn-outline-primary"
|
|
||||||
onClick={copyConfigToClipboard}
|
|
||||||
disabled={serverFilters.length === 0}
|
|
||||||
>
|
|
||||||
<IconCopy className="icon" />
|
|
||||||
Копировать
|
|
||||||
</button>
|
|
||||||
<button
|
|
||||||
className="btn btn-success"
|
|
||||||
onClick={() => handleSaveServerConfig(selectedServer.id)}
|
|
||||||
disabled={loading || serverFilters.length === 0}
|
|
||||||
>
|
|
||||||
<IconDeviceFloppy className="icon" />
|
|
||||||
Сохранить
|
|
||||||
</button>
|
|
||||||
<button
|
|
||||||
className="btn btn-outline-primary"
|
|
||||||
onClick={handleBgpUpdate}
|
|
||||||
disabled={bgpUpdateLoading}
|
|
||||||
title="Запустить /system script run update_bgp_filter на выбранном MikroTik"
|
|
||||||
>
|
|
||||||
<IconRefresh className={`icon ${bgpUpdateLoading ? 'spin' : ''}`} />
|
|
||||||
{bgpUpdateLoading ? 'Запуск...' : 'Обновить BGP фильтры'}
|
|
||||||
</button>
|
|
||||||
</>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
}
|
|
||||||
/>
|
/>
|
||||||
|
|
||||||
<div className="page-body">
|
<div>
|
||||||
<div className="container-xl">
|
|
||||||
{/* Уведомления */}
|
{/* Уведомления */}
|
||||||
{error && (
|
{error && (
|
||||||
<div className="alert alert-danger alert-dismissible" role="alert">
|
<div className="alert alert-danger alert-dismissible" role="alert">
|
||||||
@@ -1977,6 +1860,15 @@ function FilterManager() {
|
|||||||
<IconDeviceFloppy className="icon" />
|
<IconDeviceFloppy className="icon" />
|
||||||
Сохранить
|
Сохранить
|
||||||
</button>
|
</button>
|
||||||
|
<button
|
||||||
|
className="btn btn-outline-primary"
|
||||||
|
onClick={handleBgpUpdate}
|
||||||
|
disabled={!selectedServer || bgpUpdateLoading}
|
||||||
|
title="Запустить /system script run update_bgp_filter на выбранном MikroTik"
|
||||||
|
>
|
||||||
|
<IconRefresh className={`icon ${bgpUpdateLoading ? 'spin' : ''}`} />
|
||||||
|
{bgpUpdateLoading ? 'Запуск...' : 'Обновить BGP фильтры'}
|
||||||
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user