Files
magistr/frontend/react/shared/ui/Pagination.jsx
dipatrik10 97bf3cc50a feat: завершить миграцию фронтенда на React (этапы 1-5)
Админка, настройки, логин, кабинеты преподавателя и студента
полностью переведены на React 19 (модель strangler, docs/REACT_MIGRATION.md).

- 15 вкладок админки: lazy-загрузка, общий error boundary, сервисный слой
- Удалены legacy-views и переходный слой LegacyTabView (45 файлов)
- Сборка esbuild (frontend/scripts/build-react.mjs) с бюджетами gzip на чанки
- CSP-хэши, кэширование: chunk'и immutable, CSS/HTML no-cache (react-cache.conf)
- Фиксы: lazy-импорт именованных экспортов (краш после авторизации),
  растяжение #admin-root/#settings-root на всю ширину,
  возврат subjects/lessonTypes из справочников (краш просмотра расписаний),
  отказ от заведомо широкого поиска расписания без выбранной цели,
  центрирование карточки логина
- Тесты: 237/237 (npm run check), регрессионные на lazy-вкладки и ширину
- Документация: REACT_MIGRATION.md, REACT_MIGRATION_RESULT.md, FRONTEND.md
2026-09-28 23:15:04 +03:00

58 lines
1.9 KiB
JavaScript
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
const PAGE_SIZES = [25, 50, 100];
export function Pagination({
id,
page = 0,
size = 25,
totalItems = 0,
totalPages = 0,
label = 'записей',
onPage,
onSize
}) {
const total = Number(totalItems || 0);
const pages = Math.max(Number(totalPages || 0), total ? 1 : 0);
const current = Number(page || 0);
const pageSize = Number(size || 25);
const start = total ? current * pageSize + 1 : 0;
const end = Math.min((current + 1) * pageSize, total);
return (
<div className="pagination" id={id}>
<div className="pagination-summary" aria-live="polite">
Показано {start}–{end} из {total} {label}
</div>
<div className="pagination-actions">
<label className="pagination-size">
<span>На странице</span>
<select
value={pageSize}
onChange={event => onSize?.(Number(event.target.value))}
>
{PAGE_SIZES.map(value => (
<option key={value} value={value}>{value}</option>
))}
</select>
</label>
<button
type="button"
className="btn btn-sm btn-secondary"
disabled={current <= 0}
onClick={() => onPage?.(current - 1)}
>
Назад
</button>
<span className="pagination-page">{pages ? current + 1 : 0} / {pages}</span>
<button
type="button"
className="btn btn-sm btn-secondary"
disabled={current >= pages - 1}
onClick={() => onPage?.(current + 1)}
>
Далее
</button>
</div>
</div>
);
}