Look this page >> https://drag-drop.nikitalieonov.repl.co/ <<
Макет https://www.figma.com/file/W7qIKLBDyyRd4pHqy0KCOe/test-front?node-id=3031%3A5 Общее
- Для разработки использовать vue.js
- Действия должны быть плавными.
- Только для десктопа, адаптив в рамках этой задачи - не нужен. Описание
- Нужно сделать вёрстку раздела Документы https://monosnap.com/file/OvcPxTUlCR9ODYvjgH2FCLBugo4MqY
- На первом уровне отображаются категории, которые можно свернуть и развернуть https://monosnap.com/file/Bh6XyfVF5cAetlXLqyo8nwAN68McjT На первом уровне также отображаются элементы, которые не относятся к категориям и отображаются внизу списка с категориями. https://monosnap.com/file/Othwx39qWtvauiRTlXieEeHHa19VWk
- Для каждого элемента в списке отображаются кнопки: Удалить, Редактировать, Переместить https://monosnap.com/file/fnCas4tx2zyJpHYqFYleCRoc4Fk4Qz
- В рамках задачи нужно добавить функционал "перемещения элемента в списке".
- Категории можно перемещать только между собой https://monosnap.com/file/GgbaR8Cdvx1sBvmoURzoWogMMaUoRo Таким образом, с помощью перемещения можно менять порядок
- Элементы внутри категории можно перемещать как внутри самой категории, так и между категориями и вытаскивать в список без категории https://monosnap.com/file/IRpbY9H4muOFQfc4uns56mBEVlfUAj
- Перетаскивать элементы в списке можно при клике на кнопку Переместить https://monosnap.com/file/FkDR93Ek6f3cGf0PpkRkCNAOnjGrya
- Также нужно добавить поиск по подстроке по названиям категорий и названиям элементов в категории https://monosnap.com/file/YFFyP50noSM8751qnK2a8gZNJ5H2dJ
- Поиск должен работать на ввод символов
- При вводе хотя бы одного символа показывать кнопку "Сбросить" ("крестик") https://monosnap.com/file/BRFGl4AbHLL6aGFoNCtnzYJSLaFsPu