mirror of
https://github.com/Comfy-Org/ComfyUI_frontend.git
synced 2026-04-21 14:59:39 +00:00
feat: Add dropdown list for additional tabs (#5046)
* feat: Add dropdown list for additional tabs * fix: workflow menu and tabs styles
This commit is contained in:
47
src/components/topbar/WorkflowOverflowMenu.vue
Normal file
47
src/components/topbar/WorkflowOverflowMenu.vue
Normal file
@@ -0,0 +1,47 @@
|
||||
<template>
|
||||
<div>
|
||||
<Button
|
||||
v-tooltip="{ value: $t('g.moreWorkflows'), showDelay: 300 }"
|
||||
class="rounded-none"
|
||||
icon="pi pi-ellipsis-h"
|
||||
text
|
||||
severity="secondary"
|
||||
:aria-label="$t('g.moreWorkflows')"
|
||||
@click="menu?.toggle($event)"
|
||||
/>
|
||||
<Menu
|
||||
ref="menu"
|
||||
:model="menuItems"
|
||||
:popup="true"
|
||||
class="max-h-[40vh] overflow-auto"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import Button from 'primevue/button'
|
||||
import Menu from 'primevue/menu'
|
||||
import { computed, ref } from 'vue'
|
||||
|
||||
import { useWorkflowService } from '@/services/workflowService'
|
||||
import type { ComfyWorkflow } from '@/stores/workflowStore'
|
||||
|
||||
const props = defineProps<{
|
||||
workflows: ComfyWorkflow[]
|
||||
activeWorkflow: ComfyWorkflow | null
|
||||
}>()
|
||||
|
||||
const menu = ref<InstanceType<typeof Menu> | null>(null)
|
||||
const workflowService = useWorkflowService()
|
||||
|
||||
const menuItems = computed(() =>
|
||||
props.workflows.map((workflow: ComfyWorkflow) => ({
|
||||
label: workflow.filename,
|
||||
icon:
|
||||
props.activeWorkflow?.key === workflow.key ? 'pi pi-check' : undefined,
|
||||
command: () => {
|
||||
void workflowService.openWorkflow(workflow)
|
||||
}
|
||||
}))
|
||||
)
|
||||
</script>
|
||||
Reference in New Issue
Block a user