mirror of
https://github.com/ClusterCockpit/cc-backend
synced 2025-05-14 05:01:41 +02:00
add manual job selection for comparison in jobs view
This commit is contained in:
Christoph Kluge
parent
4419df8d1b
commit
69286881e4
@ -300,8 +300,8 @@ type TimeRangeOutput { range: String, from: Time!, to: Time! }
|
||||
|
||||
input JobFilter {
|
||||
tags: [ID!]
|
||||
dbId: [ID!]
|
||||
jobId: StringInput
|
||||
jobIds: [ID!]
|
||||
arrayJobId: Int
|
||||
user: StringInput
|
||||
project: StringInput
|
||||
|
||||
@ -2465,8 +2465,8 @@ type TimeRangeOutput { range: String, from: Time!, to: Time! }
|
||||
|
||||
input JobFilter {
|
||||
tags: [ID!]
|
||||
dbId: [ID!]
|
||||
jobId: StringInput
|
||||
jobIds: [ID!]
|
||||
arrayJobId: Int
|
||||
user: StringInput
|
||||
project: StringInput
|
||||
@ -16447,7 +16447,7 @@ func (ec *executionContext) unmarshalInputJobFilter(ctx context.Context, obj any
|
||||
asMap[k] = v
|
||||
}
|
||||
|
||||
fieldsInOrder := [...]string{"tags", "jobId", "jobIds", "arrayJobId", "user", "project", "jobName", "cluster", "partition", "duration", "energy", "minRunningFor", "numNodes", "numAccelerators", "numHWThreads", "startTime", "state", "metricStats", "exclusive", "node"}
|
||||
fieldsInOrder := [...]string{"tags", "dbId", "jobId", "arrayJobId", "user", "project", "jobName", "cluster", "partition", "duration", "energy", "minRunningFor", "numNodes", "numAccelerators", "numHWThreads", "startTime", "state", "metricStats", "exclusive", "node"}
|
||||
for _, k := range fieldsInOrder {
|
||||
v, ok := asMap[k]
|
||||
if !ok {
|
||||
@ -16461,6 +16461,13 @@ func (ec *executionContext) unmarshalInputJobFilter(ctx context.Context, obj any
|
||||
return it, err
|
||||
}
|
||||
it.Tags = data
|
||||
case "dbId":
|
||||
ctx := graphql.WithPathContext(ctx, graphql.NewPathWithField("dbId"))
|
||||
data, err := ec.unmarshalOID2ᚕstringᚄ(ctx, v)
|
||||
if err != nil {
|
||||
return it, err
|
||||
}
|
||||
it.DbID = data
|
||||
case "jobId":
|
||||
ctx := graphql.WithPathContext(ctx, graphql.NewPathWithField("jobId"))
|
||||
data, err := ec.unmarshalOStringInput2ᚖgithubᚗcomᚋClusterCockpitᚋccᚑbackendᚋinternalᚋgraphᚋmodelᚐStringInput(ctx, v)
|
||||
@ -16468,13 +16475,6 @@ func (ec *executionContext) unmarshalInputJobFilter(ctx context.Context, obj any
|
||||
return it, err
|
||||
}
|
||||
it.JobID = data
|
||||
case "jobIds":
|
||||
ctx := graphql.WithPathContext(ctx, graphql.NewPathWithField("jobIds"))
|
||||
data, err := ec.unmarshalOID2ᚕstringᚄ(ctx, v)
|
||||
if err != nil {
|
||||
return it, err
|
||||
}
|
||||
it.JobIds = data
|
||||
case "arrayJobId":
|
||||
ctx := graphql.WithPathContext(ctx, graphql.NewPathWithField("arrayJobId"))
|
||||
data, err := ec.unmarshalOInt2ᚖint(ctx, v)
|
||||
|
||||
@ -50,8 +50,8 @@ type IntRangeOutput struct {
|
||||
|
||||
type JobFilter struct {
|
||||
Tags []string `json:"tags,omitempty"`
|
||||
DbID []string `json:"dbId,omitempty"`
|
||||
JobID *StringInput `json:"jobId,omitempty"`
|
||||
JobIds []string `json:"jobIds,omitempty"`
|
||||
ArrayJobID *int `json:"arrayJobId,omitempty"`
|
||||
User *StringInput `json:"user,omitempty"`
|
||||
Project *StringInput `json:"project,omitempty"`
|
||||
|
||||
@ -146,17 +146,16 @@ func BuildWhereClause(filter *model.JobFilter, query sq.SelectBuilder) sq.Select
|
||||
// This is an OR-Logic query: Returns all distinct jobs with at least one of the requested tags; TODO: AND-Logic query?
|
||||
query = query.Join("jobtag ON jobtag.job_id = job.id").Where(sq.Eq{"jobtag.tag_id": filter.Tags}).Distinct()
|
||||
}
|
||||
if filter.DbID != nil {
|
||||
dbIDs := make([]string, len(filter.DbID))
|
||||
for i, val := range filter.DbID {
|
||||
dbIDs[i] = val
|
||||
}
|
||||
query = query.Where(sq.Eq{"job.id": dbIDs})
|
||||
}
|
||||
if filter.JobID != nil {
|
||||
query = buildStringCondition("job.job_id", filter.JobID, query)
|
||||
}
|
||||
if filter.JobIds != nil {
|
||||
jobIds := make([]string, len(filter.JobIds))
|
||||
for i, val := range filter.JobIds {
|
||||
jobIds[i] = string(val)
|
||||
}
|
||||
|
||||
query = query.Where(sq.Eq{"job.job_id": jobIds})
|
||||
}
|
||||
if filter.ArrayJobID != nil {
|
||||
query = query.Where("job.array_job_id = ?", *filter.ArrayJobID)
|
||||
}
|
||||
|
||||
@ -297,6 +297,9 @@ func buildFilterPresets(query url.Values) map[string]interface{} {
|
||||
}
|
||||
}
|
||||
}
|
||||
if len(query["dbId"]) != 0 {
|
||||
filterPresets["dbId"] = query["dbId"]
|
||||
}
|
||||
if query.Get("jobId") != "" {
|
||||
if len(query["jobId"]) == 1 {
|
||||
filterPresets["jobId"] = query.Get("jobId")
|
||||
|
||||
@ -37,6 +37,7 @@
|
||||
|
||||
let filterComponent; // see why here: https://stackoverflow.com/questions/58287729/how-can-i-export-a-function-from-a-svelte-component-that-changes-a-value-in-the
|
||||
let filterBuffer = [];
|
||||
let selectedJobs = [];
|
||||
let jobList,
|
||||
jobCompare,
|
||||
matchedListJobs,
|
||||
@ -59,6 +60,10 @@
|
||||
// so we need to wait for it to be ready before we can start a query.
|
||||
// This is also why JobList component starts out with a paused query.
|
||||
onMount(() => filterComponent.updateFilters());
|
||||
|
||||
$: if (filterComponent && selectedJobs.length == 0) {
|
||||
filterComponent.updateFilters({dbId: []})
|
||||
}
|
||||
</script>
|
||||
|
||||
<!-- ROW1: Status-->
|
||||
@ -80,7 +85,7 @@
|
||||
<Row cols={{ xs: 1, md: 2, lg: 5}} class="mb-3">
|
||||
<Col lg="2" class="mb-2 mb-lg-0">
|
||||
<ButtonGroup class="w-100">
|
||||
<Button outline color="primary" on:click={() => (isSortingOpen = true)}>
|
||||
<Button outline color="primary" on:click={() => (isSortingOpen = true)} disabled={showCompare}>
|
||||
<Icon name="sort-up" /> Sorting
|
||||
</Button>
|
||||
<Button
|
||||
@ -130,11 +135,20 @@
|
||||
}} />
|
||||
</Col>
|
||||
<Col lg="2" class="mb-2 mb-lg-0">
|
||||
<Button color="primary" on:click={() => {
|
||||
showCompare = !showCompare
|
||||
}} >
|
||||
{showCompare ? 'List' : 'Compare'} Jobs
|
||||
</Button>
|
||||
<ButtonGroup class="w-100">
|
||||
<Button color="primary" on:click={() => {
|
||||
if (selectedJobs.length != 0) filterComponent.updateFilters({dbId: selectedJobs})
|
||||
else if (selectedJobs.length == 0) filterComponent.updateFilters({dbId: []})
|
||||
showCompare = !showCompare
|
||||
}} >
|
||||
{showCompare ? 'List' : 'Compare'} Jobs {selectedJobs.length != 0 ? `(${selectedJobs.length} selected)` : `(Use Filter)`}
|
||||
</Button>
|
||||
<Button color="danger" disabled={selectedJobs.length == 0} on:click={() => {
|
||||
selectedJobs = [] // Only empty array, filters handled by reactive reset
|
||||
}}>
|
||||
Reset
|
||||
</Button>
|
||||
</ButtonGroup>
|
||||
</Col>
|
||||
</Row>
|
||||
|
||||
@ -148,6 +162,7 @@
|
||||
bind:sorting
|
||||
bind:matchedListJobs
|
||||
bind:showFootprint
|
||||
bind:selectedJobs
|
||||
{filterBuffer}
|
||||
/>
|
||||
{:else}
|
||||
@ -161,7 +176,7 @@
|
||||
</Col>
|
||||
</Row>
|
||||
|
||||
<Sorting bind:sorting bind:isOpen={isSortingOpen} />
|
||||
<Sorting bind:sorting bind:isOpen={isSortingOpen}/>
|
||||
|
||||
<MetricSelection
|
||||
bind:cluster={selectedCluster}
|
||||
|
||||
@ -78,6 +78,7 @@
|
||||
from: null,
|
||||
to: null,
|
||||
},
|
||||
dbId: filterPresets.dbId || [],
|
||||
jobId: filterPresets.jobId || "",
|
||||
arrayJobId: filterPresets.arrayJobId || null,
|
||||
user: filterPresets.user || "",
|
||||
@ -137,6 +138,8 @@
|
||||
items.push({
|
||||
energy: { from: filters.energy.from, to: filters.energy.to },
|
||||
});
|
||||
if (filters.dbId.length != 0)
|
||||
items.push({ dbId: filters.dbId });
|
||||
if (filters.jobId)
|
||||
items.push({ jobId: { [filters.jobIdMatch]: filters.jobId } });
|
||||
if (filters.arrayJobId != null)
|
||||
@ -180,7 +183,6 @@
|
||||
|
||||
function changeURL() {
|
||||
const dateToUnixEpoch = (rfc3339) => Math.floor(Date.parse(rfc3339) / 1000);
|
||||
|
||||
let opts = [];
|
||||
if (filters.cluster) opts.push(`cluster=${filters.cluster}`);
|
||||
if (filters.node) opts.push(`node=${filters.node}`);
|
||||
@ -196,6 +198,11 @@
|
||||
if (filters.startTime.range) {
|
||||
opts.push(`startTime=${filters.startTime.range}`)
|
||||
}
|
||||
if (filters.dbId.length != 0) {
|
||||
for (let dbi of filters.dbId) {
|
||||
opts.push(`dbId=${dbi}`);
|
||||
}
|
||||
}
|
||||
if (filters.jobId.length != 0)
|
||||
if (filters.jobIdMatch != "in") {
|
||||
opts.push(`jobId=${filters.jobId}`);
|
||||
|
||||
@ -39,6 +39,7 @@
|
||||
export let metrics = ccconfig.plot_list_selectedMetrics;
|
||||
export let showFootprint;
|
||||
export let filterBuffer = [];
|
||||
export let selectedJobs = [];
|
||||
|
||||
let usePaging = ccconfig.job_list_usePaging
|
||||
let itemsPerPage = usePaging ? ccconfig.plot_list_jobsPerPage : 10;
|
||||
@ -285,7 +286,10 @@
|
||||
</tr>
|
||||
{:else}
|
||||
{#each jobs as job (job)}
|
||||
<JobListRow bind:triggerMetricRefresh {job} {metrics} {plotWidth} {showFootprint} />
|
||||
<JobListRow bind:triggerMetricRefresh {job} {metrics} {plotWidth} {showFootprint} previousSelect={selectedJobs.includes(job.id)}
|
||||
on:select-job={({detail}) => selectedJobs = [...selectedJobs, detail]}
|
||||
on:unselect-job={({detail}) => selectedJobs = selectedJobs.filter(item => item !== detail)}
|
||||
/>
|
||||
{:else}
|
||||
<tr>
|
||||
<td colspan={metrics.length + 1}> No jobs found </td>
|
||||
|
||||
@ -18,6 +18,8 @@
|
||||
export let username = null;
|
||||
export let authlevel= null;
|
||||
export let roles = null;
|
||||
export let isSelected = null;
|
||||
export let showSelect = false;
|
||||
|
||||
function formatDuration(duration) {
|
||||
const hours = Math.floor(duration / 3600);
|
||||
@ -76,18 +78,39 @@
|
||||
<a href="/monitoring/job/{job.id}" target="_blank">{job.jobId}</a>
|
||||
({job.cluster})
|
||||
</span>
|
||||
<Button id={`${job.cluster}-${job.jobId}-clipboard`} outline color="secondary" size="sm" on:click={clipJobId(job.jobId)} >
|
||||
{#if displayCheck}
|
||||
<Icon name="clipboard2-check-fill"/>
|
||||
{:else}
|
||||
<Icon name="clipboard2"/>
|
||||
<span>
|
||||
{#if showSelect}
|
||||
<Button id={`${job.cluster}-${job.jobId}-select`} outline={!isSelected} color={isSelected? `success`: `secondary`} size="sm" class="mr-2"
|
||||
on:click={() => {
|
||||
isSelected = !isSelected
|
||||
}}>
|
||||
{#if isSelected}
|
||||
<Icon name="check-square"/>
|
||||
{:else if isSelected == false}
|
||||
<Icon name="square"/>
|
||||
{:else}
|
||||
<Icon name="plus-square-dotted" />
|
||||
{/if}
|
||||
</Button>
|
||||
<Tooltip
|
||||
target={`${job.cluster}-${job.jobId}-select`}
|
||||
placement="left">
|
||||
{ 'Add or Remove Job to/from Comparison Selection' }
|
||||
</Tooltip>
|
||||
{/if}
|
||||
</Button>
|
||||
<Tooltip
|
||||
target={`${job.cluster}-${job.jobId}-clipboard`}
|
||||
placement="right">
|
||||
{ displayCheck ? 'Copied!' : 'Copy Job ID to Clipboard' }
|
||||
</Tooltip>
|
||||
<Button id={`${job.cluster}-${job.jobId}-clipboard`} outline color="secondary" size="sm" on:click={clipJobId(job.jobId)} >
|
||||
{#if displayCheck}
|
||||
<Icon name="clipboard2-check-fill"/>
|
||||
{:else}
|
||||
<Icon name="clipboard2"/>
|
||||
{/if}
|
||||
</Button>
|
||||
<Tooltip
|
||||
target={`${job.cluster}-${job.jobId}-clipboard`}
|
||||
placement="right">
|
||||
{ displayCheck ? 'Copied!' : 'Copy Job ID to Clipboard' }
|
||||
</Tooltip>
|
||||
</span>
|
||||
</span>
|
||||
{#if job.metaData?.jobName}
|
||||
{#if job.metaData?.jobName.length <= 25}
|
||||
|
||||
@ -12,7 +12,7 @@
|
||||
|
||||
<script>
|
||||
import { queryStore, gql, getContextClient } from "@urql/svelte";
|
||||
import { getContext } from "svelte";
|
||||
import { getContext, createEventDispatcher } from "svelte";
|
||||
import { Card, Spinner } from "@sveltestrap/sveltestrap";
|
||||
import { maxScope, checkMetricDisabled } from "../utils.js";
|
||||
import JobInfo from "./JobInfo.svelte";
|
||||
@ -25,7 +25,9 @@
|
||||
export let plotHeight = 275;
|
||||
export let showFootprint;
|
||||
export let triggerMetricRefresh = false;
|
||||
export let previousSelect = false;
|
||||
|
||||
const dispatch = createEventDispatcher();
|
||||
const resampleConfig = getContext("resampling") || null;
|
||||
const resampleDefault = resampleConfig ? Math.max(...resampleConfig.resolutions) : 0;
|
||||
|
||||
@ -38,6 +40,8 @@
|
||||
let selectedResolution = resampleDefault;
|
||||
let zoomStates = {};
|
||||
let thresholdStates = {};
|
||||
|
||||
$: isSelected = previousSelect || null;
|
||||
|
||||
const cluster = getContext("clusters").find((c) => c.name == job.cluster);
|
||||
const client = getContextClient();
|
||||
@ -112,6 +116,12 @@
|
||||
refreshMetrics();
|
||||
}
|
||||
|
||||
$: if (isSelected == true && previousSelect == false) {
|
||||
dispatch("select-job", job.id)
|
||||
} else if (isSelected == false && previousSelect == true) {
|
||||
dispatch("unselect-job", job.id)
|
||||
}
|
||||
|
||||
// Helper
|
||||
const selectScope = (jobMetrics) =>
|
||||
jobMetrics.reduce(
|
||||
@ -152,7 +162,7 @@
|
||||
|
||||
<tr>
|
||||
<td>
|
||||
<JobInfo {job} />
|
||||
<JobInfo {job} bind:isSelected showSelect/>
|
||||
</td>
|
||||
{#if job.monitoringStatus == 0 || job.monitoringStatus == 2}
|
||||
<td colspan={metrics.length}>
|
||||
|
||||
@ -308,7 +308,7 @@
|
||||
style="background-color: rgba(255, 255, 255, 1.0);" class="rounded"
|
||||
/>
|
||||
{:else}
|
||||
<Card body color="warning" class="mx-4"
|
||||
>Cannot render plot: No series data returned for <code>{metric}</code></Card
|
||||
<Card body color="warning" class="mx-4 my-2"
|
||||
>Cannot render plot: No series data returned for <code>{metric?metric:'job resources'}</code></Card
|
||||
>
|
||||
{/if}
|
||||
|
||||
@ -461,11 +461,11 @@ export function convert2uplot(canvasData, secondsToMinutes = false, secondsToHou
|
||||
} else { // Default -> Fill Histodata with zero values on unused value placing -> maybe allows zoom trigger as known
|
||||
if (secondsToHours) {
|
||||
let hours = cd.value / 3600
|
||||
console.log("x seconds to y hours", cd.value, hours)
|
||||
// console.log("x seconds to y hours", cd.value, hours)
|
||||
uplotData[0].push(hours)
|
||||
} else if (secondsToMinutes) {
|
||||
let minutes = cd.value / 60
|
||||
console.log("x seconds to y minutes", cd.value, minutes)
|
||||
// console.log("x seconds to y minutes", cd.value, minutes)
|
||||
uplotData[0].push(minutes)
|
||||
} else {
|
||||
uplotData[0].push(cd.value)
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user