Есть готовая доска задач kanban. Исправить работу localStorage (LS), т.к. все работает с ошибками.
Текст для ознакомления, исправить работу LS.

[b]ПРОБЛЕМА[/b]
[list=1][*]Задание. Результат манипуляций не сохраняется в LS[*]Задание. Не сохраняется список задач в LS[*]Задание. Не сохраняется результат после удаления в LS[/list]-----------------------------------------------------------

[b]Задание 1[/b]
Добавление новой задачи в список

Исходная Канбан доска должна иметь 4 блока задач:
[list][*]Backlog(задачи, которые требуют уточнения, перед тем, как их брать в работу),[*]Ready(задачи, которые могут быть взяты в работу),[*]In progress (задачи, которые уже в работе)[*]Finished (законченные задачи)[/list]
***Перед началом работы создана заглушку - объект с необходимыми данными, вида
[code]const dataMock = [
   {
        title: 'backlog',
        issues: [
            {
                id: 'task1'
                name: 'Sprint bugfix'
            }
        ],
   },
   // code
][/code]

Первоначально задача размещается в 'backlog' - для анализа. При клике на "+ Add card" появляется новое поле в конце списка с возможностью ввода и сохранением в LS

[b]Алгоритм:[/b]
Нажали кнопку - появилось поле для редактирования - ввели название - ушли с поля (расфокусировались, кликнули и тд) - название сохранилось - задача появилась в 'backlog'.

Задачи для списка Ready берутся из Backlog. При клике на "+ Add card" в этом списке, должна быть предоставлена возможность выбора задач из Backlog из дропдауна. При клике на кнопку в конце списка, между последней задачей и кнопкой появляется дропдаун с возможными вариантами
После клика на задачу из дропдауна, она должна появиться в списке последней

Задачи для списка In progress берутся из Ready. Реализация п.2
Задачи для списка Finished берутся из In progress. Реализация п.2

Когда задача попадает в следующий список, из текущего ее нужно удалить.
Например, когда в список Ready попадает задача из Backlog, из Backlog она должна быть удалена. По аналогии должно быть реализовано и для других списков.
-----------------------------------------------------------

[b]Задание 2[/b]
Создание нового списка задач.

При клике на "Create new list" срабатывает функция, добавляющая в начало массива списков новый элемент

Инициализация нового списка:
появляется новый пустой список c инпутом для определения заголовка и кнопку "..." справа. Фокус должен находиться в инпуте. После ввода и расфокусировки блок принимает привычное значение - заголовок, кнопки "..." и "Add card".
После создания нового списка должна измениться логика добавления задач в список, который стал вторым - вместо инпута должен быть дропдаун. У списка, который теперь является первым, соответственно, должен быть инпут.

Списков может быть неограниченное количество.
-----------------------------------------------------------

[b]Задание 3[/b]
Удаление списка задач.

Справа на списке задач есть кнопка "..." и контекстное меню, которое возникает при клике на нее с кнопкой удаления.

При нажатии на пункт меню "Удалить", список задач должен быть удален из DOM, оставшиеся списки должны сдвинуться соответственно вправо или влево, чтобы занять пустое пространство в блоке. То есть, после удаления не должно быть дырки на месте удаленного списка.

Предусмотреть правильную работу кнопки "Add card" в случаях удаления первого списка или другого - логика будет отличаться.

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

ПРОБЛЕМА
<ul><li>Задание. Результат манипуляций не сохраняется в LS</li><li>Задание. Не сохраняется список задач в LS</li><li>Задание. Не сохраняется результат после удаления в LS</li></ul>-----------------------------------------------------------

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

Исходная Канбан доска должна иметь 4 блока задач:
<ul><li>Backlog(задачи, которые требуют уточнения, перед тем, как их брать в работу),</li><li>Ready(задачи, которые могут быть взяты в работу),</li><li>In progress (задачи, которые уже в работе)</li><li>Finished (законченные задачи)</li></ul>***Перед началом работы создана заглушку - объект с необходимыми данными, вида
<code>const dataMock = [
</code> {
   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" в случаях удаления первого списка или другого - логика будет отличаться.

Гость guest_15985637812571

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