🌐 https://teplokotov.github.io/eureca-test-app/
Одностраничное веб-приложение состоит из 4 компонентов таблицы:
В таблице хранится информация о выбранных квартирах в двух столбцах:
- Номер подъезда
- Список номеров квартир, выбранных в подъезде.
Логика работы с данными:
- Данные из таблице можно очистить нажатием кнопки с иконкой корзины.
- Данные в таблицу можно добавить с помощью кнопки с иконкой плюса. При нажатии на неё открывается первое окно со списком подъездов, при выборе подъезда открывается второе окно со списком квартир, при нажатии на квартиру происходит её выбор.
- Выбор квартир множественный, можно выбрать как несколько квартир в одном подъезде, так и в разных подъездах.
- При нажатии на кнопку “Добавить” происходит добавление квартир в таблицу а окна выбора закрываются.
Весь функционал также доступен с клавиатуры:
- Навигация по кнопкам таблиц работает через
Tab. - В окнах выбора подъезда/квартиры навигация осуществляется с помощью стрелок (вправо-влево переключение между окнами выбора, вверх-вниз переключения между выбираемыми компонентами).
- Выбор квартиры происходит через
Enter. - Сохранение выбранных квартир в таблицу происходит через
ctrl+Enter.
- Клонируйте проект
git clone https://github.com/teplokotov/eureca-test-app.git- Перейдите в директорию проекта
cd eureca-test-app- Установите модули
npm install- Запустите проект
npm run dev- Откройте страницу
http://localhost:5173- VS Code
- Git Bash
- Vite
- React 18.2
- SCSS modules
- TypeScript
- Филипп Добриков
- philipp.dobrikov@yandex.ru
- https://t.me/hello_philipp