ClusterCockpit/cc-backend
1
0
Fork 0
mirror of https://github.com/ClusterCockpit/cc-backend synced 2025-06-08 00:23:48 +02:00
Code Issues Packages Releases Activity

fix: layout issues in jobList toolbar

Browse Source
This commit is contained in:
Christoph Kluge 2025-06-05 17:47:03 +02:00
parent 0a24ef70e0
commit 0e3603f596
4 changed files with 16 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
web/frontend/src/Jobs.root.svelte
View File

@ -113,7 +113,7 @@
</Button>
</ButtonGroup>
</Col>
<Col lg="4" class="mb-1 mb-lg-0">
<Col lg="5" class="mb-1 mb-lg-0">
<Filters
bind:this={filterComponent}
{filterPresets}
@ -142,25 +142,27 @@
/>
{/if}
</Col>
<Col lg="2" class="mb-1 mb-lg-0">
<Col lg="3" class="mb-1 mb-lg-0 d-inline-flex align-items-start justify-content-end ">
{#if !showCompare}
<Refresher onRefresh={() => {
<Refresher presetClass="w-auto" onRefresh={() => {
jobList.refreshJobs()
jobList.refreshAllMetrics()
}} />
{/if}
</Col>
<Col lg="2" class="mb-2 mb-lg-0">
<ButtonGroup class="w-100">
<Button color="primary" disabled={matchedListJobs >= 500 && !(selectedJobs.length != 0)} onclick={() => {
<div class="mx-1"></div>
<ButtonGroup class="w-50">
<Button color="primary" disabled={(matchedListJobs >= 500 && !(selectedJobs.length != 0)) || $initq.fetching} onclick={() => {
if (selectedJobs.length != 0) filterComponent.updateFilters({dbId: selectedJobs}, true)
showCompare = !showCompare
}} >
{showCompare ? 'Return to List' :
'Compare Jobs' + (selectedJobs.length != 0 ? ` (${selectedJobs.length} selected)` : matchedListJobs >= 500 ? ` (Too Many)` : ``)}
matchedListJobs >= 500 && selectedJobs.length == 0
? 'Compare Disabled'
: 'Compare' + (selectedJobs.length != 0 ? ` ${selectedJobs.length} ` : ' ') + 'Jobs'
}
</Button>
{#if !showCompare && selectedJobs.length != 0}
<Button color="warning" onclick={() => {
<Button class="w-auto" color="warning" onclick={() => {
selectedJobs = [] // Only empty array, filters handled by reactive reset
}}>
Clear

2
web/frontend/src/generic/Filters.svelte
View File

@ -344,7 +344,7 @@
{/if}
{#if matchedJobs >= -1}
<Button class="mb-1" style="margin-right: 0.5rem;" disabled outline>
<Button class="mb-1" style="margin-right: 0.25rem;" disabled outline>
{matchedJobs == -1 ? 'Loading ...' : `${matchedJobs} jobs`}
</Button>
{/if}

3
web/frontend/src/generic/helper/Refresher.svelte
View File

@ -13,6 +13,7 @@
/* Svelte 5 Props */
let {
initially = null,
presetClass = "",
onRefresh
} = $props();
@ -35,7 +36,7 @@
});
</script>
<InputGroup>
<InputGroup class={presetClass}>
<Input
type="select"
title="Periodic refresh interval"

4
web/frontend/src/generic/helper/TextFilter.svelte
View File

@ -97,7 +97,7 @@
<Input
type="select"
style="max-width: 120px;"
class="form-select"
class="form-select w-auto"
title="Search Mode"
bind:value={mode}
onchange={modeChanged}
@ -115,7 +115,7 @@
bind:value={term}
onchange={() => termChanged()}
onkeyup={(event) => termChanged(event.key == "Enter" ? 0 : throttle)}
placeholder={presetProject ? `Find ${mode} in ${scrambleNames ? scramble(presetProject) : presetProject} ...` : `Find ${mode} ...`}
placeholder={presetProject ? `Find in ${scrambleNames ? scramble(presetProject) : presetProject} ...` : `Find ${mode} ...`}
/>
{#if presetProject}
<Button title="Reset Project" onclick={() => resetProject()}