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

add List view for workflow tempalte (#3710)

Browse Source 
Co-authored-by: Chenlei Hu <hcl@comfy.org>
Co-authored-by: github-actions <github-actions@github.com>
This commit is contained in:
Terry Jia
2025-05-02 17:50:53 -04:00
committed by GitHub
parent 23d32282bc
commit ba3b1bae87
11 changed files with 175 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

38
src/components/templates/TemplateWorkflowsContent.vue
View File

@@ -30,36 +30,22 @@
/>
</aside>
<div
class="flex-1 overflow-auto transition-all duration-300"
class="flex-1 transition-all duration-300"
:class="{
'pl-80': isSideNavOpen || !isSmallScreen,
'pl-8': !isSideNavOpen && isSmallScreen
}"
>
<div v-if="isReady && selectedTab" class="flex flex-col px-12 pb-4">
<div class="py-3 text-left">
<h2 class="text-lg">
{{ selectedTab.title }}
</h2>
</div>
<div
class="grid grid-cols-[repeat(auto-fill,minmax(16rem,1fr))] auto-rows-fr gap-8 justify-items-center"
>
<div
v-for="template in selectedTab.templates"
:key="template.name"
class="h-full"
>
<TemplateWorkflowCard
:source-module="selectedTab.moduleName"
:template="template"
:loading="template.name === workflowLoading"
:category-title="selectedTab.title"
@load-workflow="loadWorkflow"
/>
</div>
</div>
</div>
<TemplateWorkflowView
v-if="isReady && selectedTab"
class="px-12 py-4"
:title="selectedTab.title"
:source-module="selectedTab.moduleName"
:templates="selectedTab.templates"
:loading="workflowLoading"
:category-title="selectedTab.title"
@load-workflow="loadWorkflow"
/>
</div>
</div>
</div>
@@ -73,7 +59,7 @@ import ProgressSpinner from 'primevue/progressspinner'
import { computed, ref, watch } from 'vue'
import { useI18n } from 'vue-i18n'
import TemplateWorkflowCard from '@/components/templates/TemplateWorkflowCard.vue'
import TemplateWorkflowView from '@/components/templates/TemplateWorkflowView.vue'
import TemplateWorkflowsSideNav from '@/components/templates/TemplateWorkflowsSideNav.vue'
import { useResponsiveCollapse } from '@/composables/element/useResponsiveCollapse'
import { api } from '@/scripts/api'