Исправить работу localStorage в списке задач kanban (JS)

Гость5 лет в сервисе
Данные заказчика будут вам доступны после подачи заявки
28.08.2020

Есть готовая доска задач kanban. Исправить работу localStorage (LS), т.к. все работает с ошибками.

Текст для ознакомления, исправить работу LS.

ПРОБЛЕМА

  • Задание. Результат манипуляций не сохраняется в LS
  • Задание. Не сохраняется список задач в LS
  • Задание. Не сохраняется результат после удаления в LS
-----------------------------------------------------------

Задание 1

Добавление новой задачи в список

Исходная Канбан доска должна иметь 4 блока задач:

  • Backlog(задачи, которые требуют уточнения, перед тем, как их брать в работу),
  • Ready(задачи, которые могут быть взяты в работу),
  • In progress (задачи, которые уже в работе)
  • Finished (законченные задачи)
***Перед началом работы создана заглушку - объект с необходимыми данными, вида

const dataMock = [

{

  title: 'backlog',

  issues: [

{

id: 'task1'

name: 'Sprint bugfix'

}

  ],

},

// code

]

Первоначально задача размещается в 'backlog' - для анализа. При клике на "+ Add card" появляется новое поле в конце списка с возможностью ввода и сохранением в LS

Алгоритм:

Нажали кнопку - появилось поле для редактирования - ввели название - ушли с поля (расфокусировались, кликнули и тд) - название сохранилось - задача появилась в 'backlog'.

Задачи для списка Ready берутся из Backlog. При клике на "+ Add card" в этом списке, должна быть предоставлена возможность выбора задач из Backlog из дропдауна. При клике на кнопку в конце списка, между последней задачей и кнопкой появляется дропдаун с возможными вариантами

После клика на задачу из дропдауна, она должна появиться в списке последней

Задачи для списка In progress берутся из Ready. Реализация п.2

Задачи для списка Finished берутся из In progress. Реализация п.2

Когда задача попадает в следующий список, из текущего ее нужно удалить.

Например, когда в список Ready попадает задача из Backlog, из Backlog она должна быть удалена. По аналогии должно быть реализовано и для других списков.

-----------------------------------------------------------

Задание 2

Создание нового списка задач.

При клике на "Create new list" срабатывает функция, добавляющая в начало массива списков новый элемент

Инициализация нового списка:

появляется новый пустой список c инпутом для определения заголовка и кнопку "..." справа. Фокус должен находиться в инпуте. После ввода и расфокусировки блок принимает привычное значение - заголовок, кнопки "..." и "Add card".

После создания нового списка должна измениться логика добавления задач в список, который стал вторым - вместо инпута должен быть дропдаун. У списка, который теперь является первым, соответственно, должен быть инпут.

Списков может быть неограниченное количество.

-----------------------------------------------------------

Задание 3

Удаление списка задач.

Справа на списке задач есть кнопка "..." и контекстное меню, которое возникает при клике на нее с кнопкой удаления.

При нажатии на пункт меню "Удалить", список задач должен быть удален из DOM, оставшиеся списки должны сдвинуться соответственно вправо или влево, чтобы занять пустое пространство в блоке. То есть, после удаления не должно быть дырки на месте удаленного списка.

Предусмотреть правильную работу кнопки "Add card" в случаях удаления первого списка или другого - логика будет отличаться.

Заявки фрилансеров