| 12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849 |
- div(
- class="category-node"
- :class="{ 'category-node--expanded': isExpanded, 'category-node--dragging': isDragging,'category-node--drag-over': isDragOver}"
- :style="{ paddingLeft: (level * 20) + 'px' }"
- draggable="true"
- @dragstart="onDragStart"
- @dragend="onDragEnd"
- @dragover="onDragOver"
- @dragenter="onDragEnter"
- @dragleave="onDragLeave"
- @drop="onDrop"
- )
- div(class="category-node__header")
- button(
- v-if="hasChildren"
- @click="toggleExpanded"
- class="category-node__toggle"
- :title="isExpanded ? 'Свернуть' : 'Развернуть'"
- ) {{ isExpanded ? '−' : '+' }}
- span(v-else class="category-node__spacer") •
-
- span(class="category-node__name") {{ category.name }}
-
- span(class="category-node__badge") {{ category.children ? category.children.length : 0 }}
-
- div(class="category-node__actions")
- ui-button(
- @click="$emit('edit', category)"
- size="small"
- type="outline"
- ) ✏️
- ui-button(
- @click="$emit('delete', category)"
- size="small"
- type="danger"
- ) 🗑️
-
- div(v-if="isExpanded && hasChildren" class="category-node__children")
- category-node(
- v-for="child in category.children"
- :key="child._id"
- :category="child"
- :level="level + 1"
- @edit="$emit('edit', $event)"
- @delete="$emit('delete', $event)"
- @move="$emit('move', $event)"
- )
-
- div(v-if="isDragOver" class="category-node__drop-indicator")
|
