wip allow filtering of nodes by type, needs backend update to return node type data

This commit is contained in:
pythongosssss
2024-11-18 17:13:04 +00:00
parent 7de77c0ba9
commit a13d5a3316
3 changed files with 31 additions and 8 deletions

View File

@@ -150,14 +150,17 @@ const hideCached = computed<boolean>(
const hideCanceled = computed<boolean>(
() => settingStore.get(SETTING_FILTER)?.hideCanceled
)
const anyFilter = computed(() => hideCanceled.value || hideCached.value)
watch(hideCached, () => {
updateVisibleTasks()
})
watch(hideCanceled, () => {
updateVisibleTasks()
})
const hideNodeTypes = computed<string[]>(
() => settingStore.get(SETTING_FILTER)?.hideNodeTypes ?? []
)
const anyFilter = computed(
() => hideCanceled.value || hideCached.value || hideNodeTypes.value?.length
)
for (const setting of [hideCached, hideCanceled, hideNodeTypes]) {
watch(setting, () => {
updateVisibleTasks()
})
}
const outputFilterPopup = ref(null)

View File

@@ -8,6 +8,16 @@
{{ $t('sideToolbar.queueTab.filters.hideCanceled') }}
<ToggleSwitch v-model="hideCanceled" />
</label>
<span class="mt-2">Hide Node Types:</span>
<MultiSelect
class="w-48 min-w-48 max-w-48"
v-model="hideNodeTypes"
filter
optionLabel="display_name"
optionValue="name"
:options="outputNodes"
:maxSelectedLabels="2"
/>
</div>
</template>
@@ -15,11 +25,14 @@
import { computed } from 'vue'
import { useI18n } from 'vue-i18n'
import ToggleSwitch from 'primevue/toggleswitch'
import MultiSelect from 'primevue/multiselect'
import { useSettingStore } from '@/stores/settingStore'
import { useNodeDefStore } from '@/stores/nodeDefStore'
const SETTING_FILTER = 'Comfy.Queue.Filter'
const { t } = useI18n()
const settingStore = useSettingStore()
const nodeDefStore = useNodeDefStore()
const filter = settingStore.get(SETTING_FILTER) ?? {}
const createCompute = (k: string) =>
@@ -35,4 +48,9 @@ const createCompute = (k: string) =>
const hideCached = createCompute('hideCached')
const hideCanceled = createCompute('hideCanceled')
const hideNodeTypes = createCompute('hideNodeTypes')
const outputNodes = nodeDefStore.visibleNodeDefs.filter(
(def) => def.isOutputNode
)
</script>

View File

@@ -164,6 +164,7 @@ export class ComfyNodeDefImpl {
input: ComfyInputsSpec
output: ComfyOutputsSpec
nodeSource: NodeSource
isOutputNode: boolean
constructor(obj: ComfyNodeDef) {
this.name = obj.name
@@ -177,6 +178,7 @@ export class ComfyNodeDefImpl {
this.input = new ComfyInputsSpec(obj.input ?? {})
this.output = ComfyNodeDefImpl.transformOutputSpec(obj)
this.nodeSource = getNodeSource(obj.python_module)
this.isOutputNode = obj.output_node === true
}
private static transformOutputSpec(obj: any): ComfyOutputsSpec {