Fix queue badge list (#5008)

This commit is contained in:
Robert Kaussow 2025-03-25 00:46:21 +01:00 committed by GitHub
parent ddf01c916e
commit 597ecb1a4b
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 40 additions and 34 deletions

View file

@ -1,7 +1,7 @@
<template>
<span class="inline-flex text-xs font-medium">
<span class="inline-flex items-center text-xs font-medium">
<span
class="border-wp-state-neutral-100 bg-wp-state-neutral-100 flex items-center rounded-l-full border-2 py-0.5 pr-1 pl-2 text-gray-300"
class="border-wp-state-neutral-100 bg-wp-state-neutral-100 rounded-l-full border-1 py-0.5 pr-1 pl-2 whitespace-nowrap text-gray-300"
:class="{
'rounded-r-full pr-2': value === undefined,
}"
@ -10,7 +10,7 @@
</span>
<span
v-if="value !== undefined"
class="border-wp-state-neutral-100 flex items-center rounded-r-full border-2 py-0.5 pr-2 pl-1"
class="border-wp-state-neutral-100 rounded-r-full border-1 py-0.5 pr-2 pl-1 whitespace-nowrap"
>
{{ value }}
</span>

View file

@ -30,45 +30,51 @@
<ListItem
v-for="task in tasks"
:key="task.id"
class="bg-wp-background-200! dark:bg-wp-background-100! mb-2 items-center"
class="bg-wp-background-200! dark:bg-wp-background-100! mb-2 flex-col items-center gap-4"
>
<div
class="flex items-center"
:title="
task.status === 'pending'
? $t('admin.settings.queue.task_pending')
: task.status === 'running'
? $t('admin.settings.queue.task_running')
: $t('admin.settings.queue.task_waiting_on_deps')
"
>
<Icon
:name="
<div class="flex w-full items-center justify-between border-b pb-2">
<div
class="flex items-center gap-2"
:title="
task.status === 'pending'
? 'status-pending'
? $t('admin.settings.queue.task_pending')
: task.status === 'running'
? 'status-running'
: 'status-declined'
? $t('admin.settings.queue.task_running')
: $t('admin.settings.queue.task_waiting_on_deps')
"
:class="{
'text-wp-error-100': task.status === 'waiting_on_deps',
'text-wp-state-info-100': task.status === 'running',
'text-wp-state-neutral-100': task.status === 'pending',
}"
/>
>
<Icon
:name="
task.status === 'pending'
? 'status-pending'
: task.status === 'running'
? 'status-running'
: 'status-declined'
"
:class="{
'text-wp-error-100': task.status === 'waiting_on_deps',
'text-wp-state-info-100': task.status === 'running',
'text-wp-state-neutral-100': task.status === 'pending',
}"
/>
<span>{{ task.id }}</span>
</div>
<div class="flex items-center">
<span class="ml-auto flex gap-2">
<Badge v-if="task.agent_id !== 0" :label="$t('admin.settings.queue.agent')" :value="task.agent_id" />
<Badge
v-if="task.dependencies"
:label="$t('admin.settings.queue.waiting_for')"
:value="task.dependencies.join(', ')"
/>
</span>
</div>
</div>
<span class="ml-2">{{ task.id }}</span>
<span class="ml-auto flex gap-2">
<Badge v-if="task.agent_id !== 0" :label="$t('admin.settings.queue.agent')" :value="task.agent_id" />
<div class="flex w-full flex-wrap gap-2">
<template v-for="(value, label) in task.labels">
<Badge v-if="value" :key="label" :label="label.toString()" :value="value" />
</template>
<Badge
v-if="task.dependencies"
:label="$t('admin.settings.queue.waiting_for')"
:value="task.dependencies.join(', ')"
/>
</span>
</div>
</ListItem>
</div>
</div>