Убрал rollupOptions из vite.config. Убрал equipments. Скорректировал route. Декомпозировал EdgeDetailPage.

This commit is contained in:
Первов Артем
2026-06-21 03:08:35 +03:00
parent 31add10e56
commit 61ab9eb37a
17 changed files with 238 additions and 317 deletions

View File

@@ -0,0 +1,53 @@
import type { ReactNode } from 'react';
import { useState } from 'react';
import { useNavigate } from 'react-router-dom';
import { useAuth } from '../../../auth/authContext';
import { EdgeSidebar } from './EdgeSidebar';
import { EdgeTopbar } from './EdgeTopbar';
import type { DetailView } from '../types';
type EdgePageLayoutProps = {
children: ReactNode;
currentEventsConnected: boolean;
edgeId: string;
onRefresh: () => void;
view: DetailView;
};
export function EdgePageLayout({
children,
currentEventsConnected,
edgeId,
onRefresh,
view,
}: EdgePageLayoutProps) {
const navigate = useNavigate();
const auth = useAuth();
const [sidebarCollapsed, setSidebarCollapsed] = useState(false);
const edgePath = `/edges/${encodeURIComponent(edgeId)}`;
return (
<main className={`app-shell ${sidebarCollapsed ? 'app-shell--sidebar-collapsed' : ''}`}>
<EdgeSidebar
collapsed={sidebarCollapsed}
edgePath={edgePath}
view={view}
onNavigate={navigate}
onToggleCollapsed={() => setSidebarCollapsed((collapsed) => !collapsed)}
/>
<section className={`workspace workspace--${view}`}>
<EdgeTopbar
authEnabled={auth.enabled}
currentEventsConnected={currentEventsConnected}
edgeId={edgeId}
onBack={() => navigate('/edges')}
onLogout={() => void auth.logout()}
onRefresh={onRefresh}
/>
{children}
</section>
</main>
);
}

View File

@@ -1,4 +1,4 @@
import { Activity, BarChart3, Gauge, Menu, PanelLeftClose, PanelLeftOpen, Wrench } from 'lucide-react';
import { Activity, BarChart3, Gauge, Menu, PanelLeftClose, PanelLeftOpen } from 'lucide-react';
import type { DetailView } from '../types';
type EdgeSidebarProps = {
@@ -56,14 +56,6 @@ export function EdgeSidebar({ collapsed, edgePath, view, onNavigate, onToggleCol
<Activity size={18} />
<span className="nav-label">Показатели</span>
</button>
<button
className={`nav-item nav-item--button ${view === 'equipment' ? 'nav-item--active' : ''}`}
type="button"
onClick={() => onNavigate(`${edgePath}/equipment`)}
>
<Wrench size={18} />
<span className="nav-label">Оборудование</span>
</button>
</nav>
</aside>
);

View File

@@ -1,29 +0,0 @@
import { useState } from 'react';
import { ToirLightIframe } from '../../../components/ToirLightIframe';
const ACTIVE_EQUIPMENT_PATH =
'/equipment?filter=%7B%22status%22%3A%5B%22Active%22%5D%7D&displayedFilters=%7B%22status%22%3Atrue%7D';
export function EquipmentView() {
const [iframeLoaded, setIframeLoaded] = useState(false);
return (
<section className="equipment-section" aria-label="Активное оборудование">
<div className="equipment-frame-shell" aria-busy={!iframeLoaded}>
{!iframeLoaded ? (
<div className="equipment-frame-loading" role="status" aria-live="polite">
<span className="equipment-frame-loading__ring" aria-hidden />
<span>Загрузка интерфейса управления оборудованием...</span>
</div>
) : null}
<ToirLightIframe
className="equipment-frame"
path={ACTIVE_EQUIPMENT_PATH}
title="ТОиР light: управление активным оборудованием"
onLoad={() => setIframeLoaded(true)}
/>
</div>
</section>
);
}

View File

@@ -1,14 +1,12 @@
import { Activity, BarChart3, CalendarClock, Wrench } from 'lucide-react';
import { Activity, BarChart3, CalendarClock } from 'lucide-react';
import { formatDateTime } from '../../../utils/format';
type OverviewViewProps = {
edgeId: string;
latestUpdatedAt?: Date;
liveCount: number;
selectedCount: number;
totalTags: number;
onOpenArchive: () => void;
onOpenEquipment: () => void;
onOpenIndicators: () => void;
};
@@ -16,10 +14,8 @@ export function OverviewView({
edgeId,
latestUpdatedAt,
liveCount,
selectedCount,
totalTags,
onOpenArchive,
onOpenEquipment,
onOpenIndicators,
}: OverviewViewProps) {
return (
@@ -34,8 +30,8 @@ export function OverviewView({
<strong>{liveCount}</strong>
</div>
<div className="summary-card">
<span>Выбрано для графика</span>
<strong>{selectedCount}</strong>
<span>Архив</span>
<strong>1</strong>
</div>
<div className="summary-card">
<span>Последнее обновление</span>
@@ -57,10 +53,6 @@ export function OverviewView({
<BarChart3 size={18} />
Архив и график
</button>
<button type="button" onClick={onOpenEquipment}>
<Wrench size={18} />
Состояние оборудования
</button>
<button type="button">
<CalendarClock size={18} />
Техническое обслуживание