arm-core/web/src/layouts/ConsolidationsList.tsx

import { message } from 'antd';
import { useEffect, useState } from 'react';
import { useParams, useSearchParams } from 'react-router-dom';
import { ApiError } from '../api/client';
import PageTitle from '../components/PageTitle';
import { fetchOneCompanyGroup } from '../services/api/directories/company_groups';
import { setSelectedLegalEntity, setSelectedVersion } from '../store/slices/consolidations/consolidationsSlice';
import { useAppDispatch, useAppSelector } from '../store/store';
import { panelEntity, withPanelEntity } from '../utils/consolidations';
import { ConsoleLegalEntitiesTable } from '../widgets/ConsoleLegalEntities/ConsoleLegalEntities';
import { ConsoleTableWidget } from '../widgets/ConsoleTable/ConsoleTable';
import { DocumentsDrawer } from '../widgets/FilesDrawer/FilesDrawer';

// список консолидаций грузит ConsoleTableWidget (с фильтром «Только в работе»), здесь — только группа
function errorText(e: unknown): string {
	if (e instanceof ApiError) return e.message;
	return 'Не удалось загрузить группу компаний';
}

export function ConsolidationPage() {
	const [reloadKey, setReloadKey] = useState(0);
	const { group_id } = useParams();
	const [searchParams, setSearchParams] = useSearchParams();
	const versionParam = searchParams.get('version');
	// открытая панель «Первичные документы» — в адресе (?entity=): «Назад» из документа возвращает с той же панелью
	const entityParam = panelEntity(searchParams);
	// панель открывается, когда ЮЛ из адреса уже в сторе: иначе на первом рендере она показала бы прежнее ЮЛ
	const panelOpen = useAppSelector((s) => entityParam !== null && s.consolidations.current_legal_entity_id === entityParam);
	const dispatch = useAppDispatch();
	const setPanelEntity = (entityId: string | null) => setSearchParams((params) => withPanelEntity(params, entityId), { replace: true });

	const [comGroupName, setComGroupName] = useState('');
	const [locationPath, setLocationPath] = useState('Отчётность>');
	const [desc, setDesc] = useState('');

	useEffect(() => {
		if (!group_id) return;
		async function getAllInfo(id: string) {
			try {
				const data = await fetchOneCompanyGroup(id);
				setComGroupName(data.name);
				setLocationPath(`Отчётность>${data.name}>Консолидации`);
				setDesc(`${data.legal_entities_count} организаций`);
			} catch (e: unknown) {
				message.error(errorText(e));
			}
		}
		getAllInfo(group_id);
	}, [group_id]);

	// выбор версии следует за ?version= и не перезагружает список
	useEffect(() => {
		dispatch(setSelectedVersion(versionParam));
	}, [dispatch, versionParam]);

	// ЮЛ панели следует за ?entity=; закрытие панели выбор не сбрасывает (панель скрыта, ЮЛ без запроса не перечитывается)
	useEffect(() => {
		if (entityParam) dispatch(setSelectedLegalEntity(entityParam));
	}, [dispatch, entityParam]);

	// уход со страницы сбрасывает выбор (при смене группы ?version= пропадает из URL — выбор сбросит эффект выше)
	useEffect(() => {
		return () => {
			dispatch(setSelectedVersion(null));
		};
	}, [dispatch]);
	return (
		<div
			style={{
				padding: 12,
				display: 'flex',
				flexDirection: 'column',
				height: '100vh',
			}}>
			<PageTitle backable location={locationPath} header={comGroupName} description={desc} />
			<main
				style={{
					flex: '1 1 auto',
					minHeight: 0,
					overflow: 'auto',
					display: 'flex',
					flexDirection: 'column',
					gap: 10,
				}}>
				<div
					style={{
						flex: '2 1 0',
						backgroundColor: 'white',
						borderTopLeftRadius: 12,
						borderTopRightRadius: 12,
						overflowY: 'hidden',
						display: 'flex',
						flexDirection: 'column',
						minHeight: 0,
						borderRadius: 12,
						border: '1px solid #e4e7ec',
					}}>
					{/* после «Взять в работу» перечитываем и панель «Организации»: в ней «Ответственный» */}
					<ConsoleTableWidget onVersionLocked={() => setReloadKey((k) => k + 1)} />
				</div>
				<div
					style={{
						flex: '3 1 0',
						backgroundColor: 'white',
						borderTopLeftRadius: 12,
						borderTopRightRadius: 12,
						overflowY: 'hidden',
						display: 'flex',
						flexDirection: 'column',
						minHeight: 0,
						borderRadius: 12,
						border: '1px solid #e4e7ec',
					}}>
					<ConsoleLegalEntitiesTable reloadKey={reloadKey} onDrawerOpen={setPanelEntity} />
				</div>
			</main>
			<DocumentsDrawer
				open={panelOpen}
				onClose={() => {
					setPanelEntity(null);
					setReloadKey((k) => k + 1);
				}}
			/>
		</div>
	);
}