75 lines
7.7 KiB
Markdown
75 lines
7.7 KiB
Markdown
## 📱 Техническое задание
|
||
Требуется разработать нативное мобильное приложение, которое будет содержать следующие экраны.
|
||
|
||
### 1. Экран авторизации
|
||
|
||
> Данный экран должен быть показан при первом входе в приложение, а также в ситуациях, когда пользователь не зарегистрировался в приложении.
|
||
|
||
#### Элементы, которые должны присутствовать на экране:
|
||
- Поле ввода (`id/username`), в котором пользователю необходимо ввести свой логин.
|
||
- Кнопка входа (`id/login`), по нажатию на которую пользователь авторизуется в системе.
|
||
- По умолчанию скрытое текстовое поле с ошибкой (`id/error`).
|
||
|
||
#### Требования к компонентам:
|
||
1. В пустом поле ввода должна отображаться подсказка, что требуется ввести пользователю.
|
||
2. Если хотя бы одно из условий ниже соблюдено - кнопка должна быть неактивной:
|
||
- Поле ввода пустое.
|
||
- Количество символов менее 3х.
|
||
- Логин начинается с цифры.
|
||
- Логин содержит символы, отличные от латинского алфавита и цифр.
|
||
3. Поле ввода и кнопку должно быть видно при раскрытии клавиатуры.
|
||
4. - При нажатии на кнопку входа необходимо проверить, что данный пользователь существует с помощью запроса `api/<LOGIN>/auth` (подробное описание представлено в техническом задании серверной части).
|
||
5. В случае отсутствия логина или любой другой неполадки - необходимо вывести ошибку, пока пользователь не изменит текстовое поле или повторно не нажмёт на кнопку.
|
||
6. После нажатия на кнопку - логин должен быть сохранён и при следующем открытии приложения экран авторизации не должен быть показан.
|
||
7. После нажатия на кнопку - при нажатии стрелки назад - экран авторизации не должен быть показан повторно.
|
||
8. Экран авторизации показывается только в случае, если пользователь неавторизован.
|
||
|
||
### 2. Главный экран
|
||
|
||
> Данный экран содержит общую информацию о пользователе:
|
||
>- ФИО
|
||
>- Фото
|
||
>- Должность
|
||
>- Время последнего входа
|
||
|
||
#### Элементы, которые должны присутствовать на экране:
|
||
- Текстовое поле (`id/fullname`), в котором написано имя пользователя.
|
||
- Изображение (`id/photo`), на котором отображено фото пользователя.
|
||
- Текстовое поле (`id/position`), в котором написана должность пользователя.
|
||
- Текстовое поле (`id/lastEntry`), в котором написана дата и время последнего входа пользователя.
|
||
- Кнопка (`id/logout`) для выхода пользователя из аккаунта.
|
||
- Кнопка (`id/refresh`) для обновления данных.
|
||
- Кнопка (`id/scan`) для сканирования QR кода.
|
||
- По умолчанию скрытое текстовое поле с ошибкой (`id/error`).
|
||
|
||
#### Требования к компонентам:
|
||
- В случае любой ошибки необходимо скрыть все элементы, кроме текстового поля с ошибкой и кнопки обновления данных.
|
||
- Для получения данных необходимо использовать сетевой запрос `/api/<LOGIN>/info`.
|
||
- Формат даты и времени последнего входа пользователя: `yyyy-MM-dd HH:mm` (например: 2024-02-31 08:31). Время необходимо отображать с сервера, без поправок на часовой пояс или локальное смещение.
|
||
- При нажатии на кнопку выход все данные (если есть) пользователя должны быть очищены, а приложение должно открыть экран авторизации.
|
||
- При нажатии кнопки сканирования необходимо открыть экран сканирования QR кода.
|
||
- При нажатии на кнопку обновления данных - необходимо повторно вызывать сетевой запрос для получения актуальных данных.
|
||
|
||
### 3. Экран сканирования QR-кода
|
||
|
||
> Данный экран позволяет отсканировать код на турникете и войти с помощью смартфона. В данном случае данный экран будет уже написан и представлен dам в готовом виде в заготовке. Вам необходимо только подписаться на его результат с помощью **Result API** и обработать считанные данные из QR кода. **Данный экран нельзя модифицировать. Он поставляется как есть.**
|
||
|
||
### 4. Экран с результатом сканирования QR кода
|
||
|
||
> На данном экране необходимо вывести успешность или неуспешность входа с помощью метода QR кода.
|
||
|
||
#### Элементы, которые должны присутствовать на экране:
|
||
- Текстовое поле (`id/result`), где содержится текст об успешности или неуспешности входа.
|
||
- Кнопка (`id/close`) для закрытия данного экрана.
|
||
|
||
#### Требования к компонентам:
|
||
- В случае, если результат пришёл пустым или со статусом “Отмена” - необходимо вывести пользователю текст:
|
||
*"Вход был отменён/Operation was cancelled"*
|
||
- В случае, если данные пришли, то необходимо их отправить на сервер с запросом `api/<LOGIN>/open`, добавив данные из результата и получить ответ.
|
||
- Если сервер ответил успешно - то отображаем текст:
|
||
*"Успешно/Success"*
|
||
- Если сервер ответил любой ошибкой - то отображаем текст:
|
||
*"Что-то пошло не так/Something wrong"*
|
||
- Кнопка закрытия всегда открывает главный экран.
|
||
|
||
### Ссылка на макеты в фигме: https://www.figma.com/design/MoPjxN7VnWnor3Mq0CNB8s/%D0%9D%D0%A2%D0%9E?node-id=49-193&t=FTPnWNwArVdAGM33-1 |