Comfy-Org/ComfyUI_frontend
1
0
Fork 0
mirror of https://github.com/Comfy-Org/ComfyUI_frontend.git synced 2026-05-01 03:31:58 +00:00
Code Issues Packages Projects Releases Wiki Activity

Add node drag preview for bookmarked nodes (#2438)

Browse Source
This commit is contained in:
Chenlei Hu
2025-02-05 16:25:56 -05:00
committed by GitHub
parent 6525ae7cf4
commit 5a7465a907
1 changed files with 9 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
src/components/sidebar/tabs/nodeLibrary/NodeBookmarkTreeExplorer.vue
View File

@@ -23,11 +23,12 @@
<script setup lang="ts"> <script setup lang="ts">
import type { TreeNode } from 'primevue/treenode' import type { TreeNode } from 'primevue/treenode'
import { computed, nextTick, ref, watch } from 'vue' import { computed, h, nextTick, ref, render, watch } from 'vue'
import { useI18n } from 'vue-i18n' import { useI18n } from 'vue-i18n'
import FolderCustomizationDialog from '@/components/common/CustomizationDialog.vue' import FolderCustomizationDialog from '@/components/common/CustomizationDialog.vue'
import TreeExplorer from '@/components/common/TreeExplorer.vue' import TreeExplorer from '@/components/common/TreeExplorer.vue'
import NodePreview from '@/components/node/NodePreview.vue'
import NodeTreeFolder from '@/components/sidebar/tabs/nodeLibrary/NodeTreeFolder.vue' import NodeTreeFolder from '@/components/sidebar/tabs/nodeLibrary/NodeTreeFolder.vue'
import NodeTreeLeaf from '@/components/sidebar/tabs/nodeLibrary/NodeTreeLeaf.vue' import NodeTreeLeaf from '@/components/sidebar/tabs/nodeLibrary/NodeTreeLeaf.vue'
import { useTreeExpansion } from '@/composables/useTreeExpansion' import { useTreeExpansion } from '@/composables/useTreeExpansion'
@@ -151,6 +152,13 @@ const renderedBookmarkedRoot = computed<TreeExplorerNode<ComfyNodeDefImpl>>(
}, },
children: sortedChildren, children: sortedChildren,
draggable: node.leaf, draggable: node.leaf,
renderDragPreview(container) {
const vnode = h(NodePreview, { nodeDef: node.data })
render(vnode, container)
return () => {
render(null, container)
}
},
droppable: !node.leaf, droppable: !node.leaf,
handleDrop(data: TreeExplorerDragAndDropData<ComfyNodeDefImpl>) { handleDrop(data: TreeExplorerDragAndDropData<ComfyNodeDefImpl>) {
const nodeDefToAdd = data.data.data const nodeDefToAdd = data.data.data