Цели

Реализуйте сайт, в котором пользователь может составлять список своих целей и путей их достижения.

Основные возможности проекта

Главная страница

На странице должны быть размещены:

Таблица целей

Каждая цель в таблице должна содержать:

При отметке цели выполненной она меняет стиль (зачеркивается или становится серой). При этом все шаги также автоматически отмечаются сделанными.

Добавление цели

При нажатии на кнопку "Добавить цель" открывается форма с полями:

Редактирование цели

При нажатии на кнопку "Редактировать" открывается форма с текущими данными цели. После редактирования и нажатия на кнопку "Сохранить" запись обновляется.

Удаление цели

При нажатии на кнопку "Удалить" появляется подтверждение (confirm), после чего цель и все её шаги удаляются из таблицы.

Отметка цели выполненной

При нажатии на кнопку "Выполнена" цель помечается как выполненная. Все шаги этой цели также автоматически отмечаются сделанными. Повторное нажатие возвращает цель в активное состояние.

Управление шагами

Под каждой целью должен быть список шагов. Каждый шаг должен содержать:

Добавление шага

Под списком шагов должна быть форма для добавления нового шага:

Редактирование шага

При нажатии на кнопку "Редактировать" текст шага становится редактируемым (заменяется на инпут с текущим текстом). После нажатия Enter или потери фокуса текст обновляется.

Удаление шага

При нажатии на кнопку "Удалить" появляется подтверждение (confirm), после чего шаг удаляется из списка.

Отметка шага сделанным

При нажатии на чекбокс или кнопку "Сделано" шаг помечается как сделанный. Визуально шаг меняет стиль (перечеркивание). Если все шаги цели отмечены, цель автоматически помечается как выполненная.

Хранение данных

Все цели и шаги должны храниться в локальном хранилище браузера (localStorage). При загрузке страницы данные загружаются из хранилища, при изменении - сохраняются обратно.

Дополнительные возможности