Колесо жизни
Реализуйте сервис, с помощью которого пользователи могут рисовать и планировать свое колесо жизни.
Продумайте структуру базы данных для хранения пользователей, зон и дел. Реализуйте регистрацию и авторизацию пользователей. Настройте серверную часть для работы с API. Все операции должны выполняться через AJAX-запросы без перезагрузки страницы.
Основные возможности проекта
- Регистрация и авторизация пользователей.
- Круговая диаграмма с секторами (зонами жизни) на canvas.
- Выставление баллов от 0 до 10 для каждой зоны (AJAX).
- Редактирование баллов.
- Планировщик дел для каждой зоны (добавление, удаление, редактирование, отметка выполненными) (AJAX).
- Каждый пользователь видит только свои данные.
Регистрация и авторизация
На сайте должна быть реализована регистрация и авторизация пользователей:
- Регистрация - форма с полями: логин, email, пароль.
- Авторизация - форма с полями: логин, пароль.
- Каждый пользователь видит только свои данные.
Главная страница
На странице должны быть размещены:
- Круговая диаграмма (canvas) с секторами.
- Список зон с баллами и возможностью редактирования.
- Планировщик дел для выбранной зоны.
Колесо жизни (диаграмма)
Колесо жизни - это круговая диаграмма, разделенная на секторы (зоны жизни). Классические зоны:
- Карьера.
- Деньги.
- Здоровье.
- Друзья.
- Семья.
- Развитие.
- Отдых.
- Условия жизни.
Каждая зона отображается в виде сектора круга. Чем выше балл (от 0 до 10), тем больше радиус сектора. Сектора соединяются линией, образуя "колесо".
Управление баллами (AJAX)
Рядом с диаграммой (или под ней) отображается список всех зон с текущими баллами. Пользователь может изменять баллы:
- С помощью ползунка (слайдера) от 0 до 10.
- С помощью инпута для ввода числа.
При изменении балла данные отправляются на сервер через AJAX, и диаграмма автоматически перерисовывается.
Планировщик дел (AJAX)
Для каждой зоны должен быть планировщик дел. При клике на зону (сектор) или на ее название открывается список дел для этой зоны. Каждое дело должно содержать:
- Название дела.
- Статус (сделано или нет).
- Кнопки: редактировать, удалить, отметить сделанным.
Добавление дела (AJAX)
В планировщике должна быть форма для добавления нового дела:
- Поле для ввода текста дела (инпут).
- Кнопка "Добавить дело".
При добавлении дела данные отправляются на сервер через AJAX, и оно появляется в списке дел для данной зоны.
Взаимодействие с сервером
Все операции выполняются через AJAX-запросы:
- При загрузке страницы данные (баллы зон и списки дел) загружаются с сервера.
- При изменении баллов или добавлении/редактировании/удалении дел данные отправляются на сервер, после успешного ответа обновляется интерфейс.
Дополнительные возможности
- Изменение названий зон (кастомизация).
- Добавление новых зон.
- Удаление зон.