DailyNormaModal (Тарас) #22
Description
DailyNormaModal:
✔ Заголовок - містить текст "My daily norma"
✔ Опис формули - показує формулу для обчислення норми води в залежності від статі.
✔ Форма - отримує дані, обчислює їх та відправляє норму обрану користувачем на бекенд для збереження. Якщо денна норма вже була розрахована, слід відмальовувати попередньо зазначені параметри для розрахункуФорма внесення значень для разрахунку:
✦ Заголовок відображає текст "Calculate your rate".
Форма містить в собі наступні поля:
✦ Вибір гендеру:
Для цього компонента потрібно використати радіо-кнопки, які дозволяють обрати один варіант.
Передбачені два варіанти: "For girl" і "For man".
✦ Введення ваги:
Цей компонент має бути текстовим полем, де користувач може ввести свою вагу у кілограмах.
✦ Введення часу активних занять або фізичної активності:
Цей компонент також повинен бути текстовим полем, де користувач може ввести кількість часу, проведеного на активних заняттях або фізичній активності. Якщо користувач не займається активними заняттями, він може встановити значення 0.
✦ Поле для виводу розрахункової кількості води.
Як тільки користувач заповнив всі поля, буде проведений динамічний розрахунок денної норми споживання води згідно вибраного гендеру, введеної ваги та часу активності. На основі введених даних результат розрахунку (обсяг необхідної кількості води в літрах на день) буде відображений на екрані, в полі, біля напису "The required amount of water in liters per day:"
✦ Поле для запису кількості випитої води:
Це текстове поле, де користувач може записати кількість води в літрах, яку він планує випивати на протязі дня.
✦ Кнопка Save - при натисканні на цю кнопку дані повинні бути відправлені на бекенд.
Якщо збереження даних на сервері відбулась успішно - модально вікно має закритись, якщо з ПОМИЛКОЮ - модалка залишається відкритою і виводиться повідомлення у вигляді нотіфікації.
Також модалка повинна закриватись по:
-кліку на кнопку для закриття або бекдроп
-натисканню на клавішу Esc