denozord/router-lists-ui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor(EasySwitchManager): simplify gateway information display by consolidating layout and enhancing clarity of comments
Publish Fast Tabler Docker image / build-and-push-fast (push) Failing after 3m33s
Details

Browse Source
This commit is contained in:
denozord
2026-02-11 01:03:14 +07:00
parent 583f9b255e
commit f6d32b3efa
1 changed files with 26 additions and 72 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/EasySwitchManager.jsx
+8 -54
View File
@@ -915,8 +915,8 @@ function EasySwitchManager() {
)} )}
</div> </div>
{/* Информация о шлюзе в стиле фильтров: флаг, имя, IP */} {/* Флаг и название шлюза */}
<div className="d-flex align-items-start gap-2 mb-1"> <div className="d-flex align-items-center gap-2 mb-1">
<span <span
className={`avatar avatar-sm ${ className={`avatar avatar-sm ${
isActive ? 'bg-white text-primary' : 'bg-primary-lt' isActive ? 'bg-white text-primary' : 'bg-primary-lt'
@@ -925,7 +925,6 @@ function EasySwitchManager() {
{countryToFlag(gw.country || country || '')} {countryToFlag(gw.country || country || '')}
</span> </span>
<div className="flex-grow-1 min-w-0"> <div className="flex-grow-1 min-w-0">
{/* Основное название — имя gateway */}
<div <div
className={`fw-bold text-truncate ${ className={`fw-bold text-truncate ${
isActive ? 'text-white' : '' isActive ? 'text-white' : ''
@@ -934,6 +933,8 @@ function EasySwitchManager() {
> >
{gw.name} {gw.name}
</div> </div>
</div>
</div>
{/* IP шлюза под названием */} {/* IP шлюза под названием */}
{gw.ip && ( {gw.ip && (
<div <div
@@ -945,27 +946,6 @@ function EasySwitchManager() {
{gw.ip} {gw.ip}
</div> </div>
)} )}
{/* Описание / провайдер */}
<div
className={`small text-truncate ${
isActive ? 'text-white-75' : 'text-muted'
}`}
style={{ fontSize: '0.7rem' }}
>
{gw.comment && <span className="me-1">{gw.comment}</span>}
{(gw.country || serverMeta?.country || serverMeta?.provider) && (
<>
{gw.country || serverMeta?.country ? (
<span className="me-1">
{countryToFlag(gw.country || serverMeta?.country)}
</span>
) : null}
<span>{gw.provider || serverMeta?.provider || ''}</span>
</>
)}
</div>
</div>
</div>
{/* Метрика (пинг) */} {/* Метрика (пинг) */}
<div className={`fw-bold mt-1 ${isActive ? 'text-white' : 'text-success'}`} style={{ fontSize: '1.1rem' }}> <div className={`fw-bold mt-1 ${isActive ? 'text-white' : 'text-success'}`} style={{ fontSize: '1.1rem' }}>
@@ -1090,8 +1070,8 @@ function EasySwitchManager() {
)} )}
</div> </div>
{/* Информация о шлюзе в стиле фильтров: флаг, имя, IP */} {/* Флаг и название шлюза */}
<div className="d-flex align-items-start gap-2 mb-1"> <div className="d-flex align-items-center gap-2 mb-1">
<span <span
className={`avatar avatar-sm ${ className={`avatar avatar-sm ${
isActive ? 'bg-white text-primary' : 'bg-primary-lt' isActive ? 'bg-white text-primary' : 'bg-primary-lt'
@@ -1100,7 +1080,6 @@ function EasySwitchManager() {
{countryToFlag(gw.country || country || '')} {countryToFlag(gw.country || country || '')}
</span> </span>
<div className="flex-grow-1 min-w-0"> <div className="flex-grow-1 min-w-0">
{/* Основное название — имя gateway */}
<div <div
className={`fw-bold text-truncate ${ className={`fw-bold text-truncate ${
isActive ? 'text-white' : '' isActive ? 'text-white' : ''
@@ -1109,6 +1088,8 @@ function EasySwitchManager() {
> >
{gw.name} {gw.name}
</div> </div>
</div>
</div>
{/* IP шлюза под названием */} {/* IP шлюза под названием */}
{gw.ip && ( {gw.ip && (
<div <div
@@ -1120,33 +1101,6 @@ function EasySwitchManager() {
{gw.ip} {gw.ip}
</div> </div>
)} )}
{/* Описание / провайдер */}
<div
className={`small text-truncate ${
isActive ? 'text-white-75' : 'text-muted'
}`}
style={{ fontSize: '0.7rem' }}
>
{gw.comment && (
<span className="me-1">{gw.comment}</span>
)}
{(gw.country ||
serverMeta?.country ||
serverMeta?.provider) && (
<>
{gw.country || serverMeta?.country ? (
<span className="me-1">
{countryToFlag(
gw.country || serverMeta?.country
)}
</span>
) : null}
<span>{gw.provider || serverMeta?.provider || ''}</span>
</>
)}
</div>
</div>
</div>
{/* Метрика (пинг) */} {/* Метрика (пинг) */}
<div className={`fw-bold mt-1 ${isActive ? 'text-white' : 'text-success'}`} style={{ fontSize: '1.1rem' }}> <div className={`fw-bold mt-1 ${isActive ? 'text-white' : 'text-success'}`} style={{ fontSize: '1.1rem' }}>