mirror of
https://github.com/ClusterCockpit/cc-backend
synced 2024-11-10 08:57:25 +01:00
Reformat
This commit is contained in:
parent
a0b8f36dbb
commit
1da0e3a747
@ -1,30 +1,67 @@
|
|||||||
<script>
|
<script>
|
||||||
import { getContext } from 'svelte'
|
import { getContext } from "svelte";
|
||||||
import Refresher from './joblist/Refresher.svelte'
|
import Refresher from "./joblist/Refresher.svelte";
|
||||||
import Roofline, { transformPerNodeData } from './plots/Roofline.svelte'
|
import Roofline, { transformPerNodeData } from "./plots/Roofline.svelte";
|
||||||
import Pie, { colors } from './plots/Pie.svelte'
|
import Pie, { colors } from "./plots/Pie.svelte";
|
||||||
import Histogram from './plots/Histogram.svelte'
|
import Histogram from "./plots/Histogram.svelte";
|
||||||
import { Row, Col, Spinner, Card, CardHeader, CardTitle, CardBody, Table, Progress, Icon } from 'sveltestrap'
|
import {
|
||||||
import { init, convert2uplot } from './utils.js'
|
Row,
|
||||||
import { scaleNumbers } from './units.js'
|
Col,
|
||||||
import { queryStore, gql, getContextClient, mutationStore } from '@urql/svelte'
|
Spinner,
|
||||||
|
Card,
|
||||||
|
CardHeader,
|
||||||
|
CardTitle,
|
||||||
|
CardBody,
|
||||||
|
Table,
|
||||||
|
Progress,
|
||||||
|
Icon,
|
||||||
|
} from "sveltestrap";
|
||||||
|
import { init, convert2uplot } from "./utils.js";
|
||||||
|
import { scaleNumbers } from "./units.js";
|
||||||
|
import {
|
||||||
|
queryStore,
|
||||||
|
gql,
|
||||||
|
getContextClient,
|
||||||
|
mutationStore,
|
||||||
|
} from "@urql/svelte";
|
||||||
|
|
||||||
const { query: initq } = init()
|
const { query: initq } = init();
|
||||||
const ccconfig = getContext("cc-config")
|
const ccconfig = getContext("cc-config");
|
||||||
|
|
||||||
export let cluster;
|
export let cluster;
|
||||||
|
|
||||||
let plotWidths = [], colWidth1 = 0, colWidth2
|
let plotWidths = [],
|
||||||
let from = new Date(Date.now() - 5 * 60 * 1000), to = new Date(Date.now())
|
colWidth1 = 0,
|
||||||
|
colWidth2;
|
||||||
|
let from = new Date(Date.now() - 5 * 60 * 1000),
|
||||||
|
to = new Date(Date.now());
|
||||||
const topOptions = [
|
const topOptions = [
|
||||||
{key: 'totalJobs', label: 'Jobs'},
|
{ key: "totalJobs", label: "Jobs" },
|
||||||
{key: 'totalNodes', label: 'Nodes'},
|
{ key: "totalNodes", label: "Nodes" },
|
||||||
{key: 'totalCores', label: 'Cores'},
|
{ key: "totalCores", label: "Cores" },
|
||||||
{key: 'totalAccs', label: 'Accelerators'},
|
{ key: "totalAccs", label: "Accelerators" },
|
||||||
]
|
];
|
||||||
|
|
||||||
let topProjectSelection = topOptions.find((option) => option.key == ccconfig[`status_view_selectedTopProjectCategory:${cluster}`]) || topOptions.find((option) => option.key == ccconfig.status_view_selectedTopProjectCategory)
|
let topProjectSelection =
|
||||||
let topUserSelection = topOptions.find((option) => option.key == ccconfig[`status_view_selectedTopUserCategory:${cluster}`]) || topOptions.find((option) => option.key == ccconfig.status_view_selectedTopUserCategory)
|
topOptions.find(
|
||||||
|
(option) =>
|
||||||
|
option.key ==
|
||||||
|
ccconfig[`status_view_selectedTopProjectCategory:${cluster}`]
|
||||||
|
) ||
|
||||||
|
topOptions.find(
|
||||||
|
(option) =>
|
||||||
|
option.key == ccconfig.status_view_selectedTopProjectCategory
|
||||||
|
);
|
||||||
|
let topUserSelection =
|
||||||
|
topOptions.find(
|
||||||
|
(option) =>
|
||||||
|
option.key ==
|
||||||
|
ccconfig[`status_view_selectedTopUserCategory:${cluster}`]
|
||||||
|
) ||
|
||||||
|
topOptions.find(
|
||||||
|
(option) =>
|
||||||
|
option.key == ccconfig.status_view_selectedTopUserCategory
|
||||||
|
);
|
||||||
|
|
||||||
const client = getContextClient();
|
const client = getContextClient();
|
||||||
$: mainQuery = queryStore({
|
$: mainQuery = queryStore({
|
||||||
@ -62,26 +99,54 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
stats: jobsStatistics(filter: $filter) {
|
stats: jobsStatistics(filter: $filter) {
|
||||||
histDuration { count, value }
|
histDuration {
|
||||||
histNumNodes { count, value }
|
count
|
||||||
histNumCores { count, value }
|
value
|
||||||
histNumAccs { count, value }
|
}
|
||||||
|
histNumNodes {
|
||||||
|
count
|
||||||
|
value
|
||||||
|
}
|
||||||
|
histNumCores {
|
||||||
|
count
|
||||||
|
value
|
||||||
|
}
|
||||||
|
histNumAccs {
|
||||||
|
count
|
||||||
|
value
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
allocatedNodes(cluster: $cluster) { name, count }
|
allocatedNodes(cluster: $cluster) {
|
||||||
}`,
|
name
|
||||||
variables: {
|
count
|
||||||
cluster: cluster, metrics: ['flops_any', 'mem_bw'], from: from.toISOString(), to: to.toISOString(),
|
|
||||||
filter: [{ state: ['running'] }, { cluster: { eq: cluster } }]
|
|
||||||
}
|
}
|
||||||
})
|
}
|
||||||
|
`,
|
||||||
|
variables: {
|
||||||
|
cluster: cluster,
|
||||||
|
metrics: ["flops_any", "mem_bw"],
|
||||||
|
from: from.toISOString(),
|
||||||
|
to: to.toISOString(),
|
||||||
|
filter: [{ state: ["running"] }, { cluster: { eq: cluster } }],
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
const paging = { itemsPerPage: 10, page: 1 }; // Top 10
|
const paging = { itemsPerPage: 10, page: 1 }; // Top 10
|
||||||
$: topUserQuery = queryStore({
|
$: topUserQuery = queryStore({
|
||||||
client: client,
|
client: client,
|
||||||
query: gql`
|
query: gql`
|
||||||
query($filter: [JobFilter!]!, $paging: PageRequest!, $sortBy: SortByAggregate!) {
|
query (
|
||||||
topUser: jobsStatistics(filter: $filter, page: $paging, sortBy: $sortBy, groupBy: USER) {
|
$filter: [JobFilter!]!
|
||||||
|
$paging: PageRequest!
|
||||||
|
$sortBy: SortByAggregate!
|
||||||
|
) {
|
||||||
|
topUser: jobsStatistics(
|
||||||
|
filter: $filter
|
||||||
|
page: $paging
|
||||||
|
sortBy: $sortBy
|
||||||
|
groupBy: USER
|
||||||
|
) {
|
||||||
id
|
id
|
||||||
totalJobs
|
totalJobs
|
||||||
totalNodes
|
totalNodes
|
||||||
@ -90,14 +155,27 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
`,
|
`,
|
||||||
variables: { filter: [{ state: ['running'] }, { cluster: { eq: cluster } }], paging, sortBy: topUserSelection.key.toUpperCase() }
|
variables: {
|
||||||
})
|
filter: [{ state: ["running"] }, { cluster: { eq: cluster } }],
|
||||||
|
paging,
|
||||||
|
sortBy: topUserSelection.key.toUpperCase(),
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
$: topProjectQuery = queryStore({
|
$: topProjectQuery = queryStore({
|
||||||
client: client,
|
client: client,
|
||||||
query: gql`
|
query: gql`
|
||||||
query($filter: [JobFilter!]!, $paging: PageRequest!, $sortBy: SortByAggregate!) {
|
query (
|
||||||
topProjects: jobsStatistics(filter: $filter, page: $paging, sortBy: $sortBy, groupBy: PROJECT) {
|
$filter: [JobFilter!]!
|
||||||
|
$paging: PageRequest!
|
||||||
|
$sortBy: SortByAggregate!
|
||||||
|
) {
|
||||||
|
topProjects: jobsStatistics(
|
||||||
|
filter: $filter
|
||||||
|
page: $paging
|
||||||
|
sortBy: $sortBy
|
||||||
|
groupBy: PROJECT
|
||||||
|
) {
|
||||||
id
|
id
|
||||||
totalJobs
|
totalJobs
|
||||||
totalNodes
|
totalNodes
|
||||||
@ -106,12 +184,28 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
`,
|
`,
|
||||||
variables: { filter: [{ state: ['running'] }, { cluster: { eq: cluster } }], paging, sortBy: topProjectSelection.key.toUpperCase() }
|
variables: {
|
||||||
})
|
filter: [{ state: ["running"] }, { cluster: { eq: cluster } }],
|
||||||
|
paging,
|
||||||
|
sortBy: topProjectSelection.key.toUpperCase(),
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
const sumUp = (data, subcluster, metric) => data.reduce((sum, node) => node.subCluster == subcluster
|
const sumUp = (data, subcluster, metric) =>
|
||||||
? sum + (node.metrics.find(m => m.name == metric)?.metric.series.reduce((sum, series) => sum + series.data[series.data.length - 1], 0) || 0)
|
data.reduce(
|
||||||
: sum, 0)
|
(sum, node) =>
|
||||||
|
node.subCluster == subcluster
|
||||||
|
? sum +
|
||||||
|
(node.metrics
|
||||||
|
.find((m) => m.name == metric)
|
||||||
|
?.metric.series.reduce(
|
||||||
|
(sum, series) =>
|
||||||
|
sum + series.data[series.data.length - 1],
|
||||||
|
0
|
||||||
|
) || 0)
|
||||||
|
: sum,
|
||||||
|
0
|
||||||
|
);
|
||||||
|
|
||||||
let allocatedNodes = {},
|
let allocatedNodes = {},
|
||||||
flopRate = {},
|
flopRate = {},
|
||||||
@ -164,43 +258,51 @@
|
|||||||
updateConfiguration(name: $name, value: $value)
|
updateConfiguration(name: $name, value: $value)
|
||||||
}
|
}
|
||||||
`,
|
`,
|
||||||
variables: { name, value }
|
variables: { name, value },
|
||||||
});
|
});
|
||||||
}
|
};
|
||||||
|
|
||||||
function updateTopUserConfiguration(select) {
|
function updateTopUserConfiguration(select) {
|
||||||
if (ccconfig[`status_view_selectedTopUserCategory:${cluster}`] != select) {
|
if (
|
||||||
updateConfigurationMutation({ name: `status_view_selectedTopUserCategory:${cluster}`, value: JSON.stringify(select) })
|
ccconfig[`status_view_selectedTopUserCategory:${cluster}`] != select
|
||||||
.subscribe(res => {
|
) {
|
||||||
|
updateConfigurationMutation({
|
||||||
|
name: `status_view_selectedTopUserCategory:${cluster}`,
|
||||||
|
value: JSON.stringify(select),
|
||||||
|
}).subscribe((res) => {
|
||||||
if (res.fetching === false && !res.error) {
|
if (res.fetching === false && !res.error) {
|
||||||
// console.log(`status_view_selectedTopUserCategory:${cluster}` + ' -> Updated!')
|
// console.log(`status_view_selectedTopUserCategory:${cluster}` + ' -> Updated!')
|
||||||
} else if (res.fetching === false && res.error) {
|
} else if (res.fetching === false && res.error) {
|
||||||
throw res.error
|
throw res.error;
|
||||||
}
|
}
|
||||||
})
|
});
|
||||||
} else {
|
} else {
|
||||||
// console.log('No Mutation Required: Top User')
|
// console.log('No Mutation Required: Top User')
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function updateTopProjectConfiguration(select) {
|
function updateTopProjectConfiguration(select) {
|
||||||
if (ccconfig[`status_view_selectedTopProjectCategory:${cluster}`] != select) {
|
if (
|
||||||
updateConfigurationMutation({ name: `status_view_selectedTopProjectCategory:${cluster}`, value: JSON.stringify(select) })
|
ccconfig[`status_view_selectedTopProjectCategory:${cluster}`] !=
|
||||||
.subscribe(res => {
|
select
|
||||||
|
) {
|
||||||
|
updateConfigurationMutation({
|
||||||
|
name: `status_view_selectedTopProjectCategory:${cluster}`,
|
||||||
|
value: JSON.stringify(select),
|
||||||
|
}).subscribe((res) => {
|
||||||
if (res.fetching === false && !res.error) {
|
if (res.fetching === false && !res.error) {
|
||||||
// console.log(`status_view_selectedTopProjectCategory:${cluster}` + ' -> Updated!')
|
// console.log(`status_view_selectedTopProjectCategory:${cluster}` + ' -> Updated!')
|
||||||
} else if (res.fetching === false && res.error) {
|
} else if (res.fetching === false && res.error) {
|
||||||
throw res.error
|
throw res.error;
|
||||||
}
|
}
|
||||||
})
|
});
|
||||||
} else {
|
} else {
|
||||||
// console.log('No Mutation Required: Top Project')
|
// console.log('No Mutation Required: Top Project')
|
||||||
}
|
}
|
||||||
};
|
}
|
||||||
|
|
||||||
$: updateTopUserConfiguration(topUserSelection.key)
|
|
||||||
$: updateTopProjectConfiguration(topProjectSelection.key)
|
|
||||||
|
|
||||||
|
$: updateTopUserConfiguration(topUserSelection.key);
|
||||||
|
$: updateTopProjectConfiguration(topProjectSelection.key);
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<!-- Loading indicator & Refresh -->
|
<!-- Loading indicator & Refresh -->
|
||||||
@ -349,18 +451,27 @@
|
|||||||
<Row>
|
<Row>
|
||||||
<Col class="p-2">
|
<Col class="p-2">
|
||||||
<div bind:clientWidth={colWidth1}>
|
<div bind:clientWidth={colWidth1}>
|
||||||
<h4 class="text-center">Top Users on {cluster.charAt(0).toUpperCase() + cluster.slice(1)}</h4>
|
<h4 class="text-center">
|
||||||
|
Top Users on {cluster.charAt(0).toUpperCase() +
|
||||||
|
cluster.slice(1)}
|
||||||
|
</h4>
|
||||||
{#key $topUserQuery.data}
|
{#key $topUserQuery.data}
|
||||||
{#if $topUserQuery.fetching}
|
{#if $topUserQuery.fetching}
|
||||||
<Spinner />
|
<Spinner />
|
||||||
{:else if $topUserQuery.error}
|
{:else if $topUserQuery.error}
|
||||||
<Card body color="danger">{$topUserQuery.error.message}</Card>
|
<Card body color="danger"
|
||||||
|
>{$topUserQuery.error.message}</Card
|
||||||
|
>
|
||||||
{:else}
|
{:else}
|
||||||
<Pie
|
<Pie
|
||||||
size={colWidth1}
|
size={colWidth1}
|
||||||
sliceLabel={topUserSelection.label}
|
sliceLabel={topUserSelection.label}
|
||||||
quantities={$topUserQuery.data.topUser.map((tu) => tu[topUserSelection.key])}
|
quantities={$topUserQuery.data.topUser.map(
|
||||||
entities={$topUserQuery.data.topUser.map((tu) => tu.id)}
|
(tu) => tu[topUserSelection.key]
|
||||||
|
)}
|
||||||
|
entities={$topUserQuery.data.topUser.map(
|
||||||
|
(tu) => tu.id
|
||||||
|
)}
|
||||||
/>
|
/>
|
||||||
{/if}
|
{/if}
|
||||||
{/key}
|
{/key}
|
||||||
@ -371,14 +482,20 @@
|
|||||||
{#if $topUserQuery.fetching}
|
{#if $topUserQuery.fetching}
|
||||||
<Spinner />
|
<Spinner />
|
||||||
{:else if $topUserQuery.error}
|
{:else if $topUserQuery.error}
|
||||||
<Card body color="danger">{$topUserQuery.error.message}</Card>
|
<Card body color="danger"
|
||||||
|
>{$topUserQuery.error.message}</Card
|
||||||
|
>
|
||||||
{:else}
|
{:else}
|
||||||
<Table>
|
<Table>
|
||||||
<tr class="mb-2">
|
<tr class="mb-2">
|
||||||
<th>Legend</th>
|
<th>Legend</th>
|
||||||
<th>User Name</th>
|
<th>User Name</th>
|
||||||
<th>Number of
|
<th
|
||||||
<select class="p-0" bind:value={topUserSelection}>
|
>Number of
|
||||||
|
<select
|
||||||
|
class="p-0"
|
||||||
|
bind:value={topUserSelection}
|
||||||
|
>
|
||||||
{#each topOptions as option}
|
{#each topOptions as option}
|
||||||
<option value={option}>
|
<option value={option}>
|
||||||
{option.label}
|
{option.label}
|
||||||
@ -389,8 +506,18 @@
|
|||||||
</tr>
|
</tr>
|
||||||
{#each $topUserQuery.data.topUser as tu, i}
|
{#each $topUserQuery.data.topUser as tu, i}
|
||||||
<tr>
|
<tr>
|
||||||
<td><Icon name="circle-fill" style="color: {colors[i]};"/></td>
|
<td
|
||||||
<th scope="col"><a href="/monitoring/user/{tu.id}?cluster={cluster}&state=running">{tu.id}</a></th>
|
><Icon
|
||||||
|
name="circle-fill"
|
||||||
|
style="color: {colors[i]};"
|
||||||
|
/></td
|
||||||
|
>
|
||||||
|
<th scope="col"
|
||||||
|
><a
|
||||||
|
href="/monitoring/user/{tu.id}?cluster={cluster}&state=running"
|
||||||
|
>{tu.id}</a
|
||||||
|
></th
|
||||||
|
>
|
||||||
<td>{tu[topUserSelection.key]}</td>
|
<td>{tu[topUserSelection.key]}</td>
|
||||||
</tr>
|
</tr>
|
||||||
{/each}
|
{/each}
|
||||||
@ -399,18 +526,27 @@
|
|||||||
{/key}
|
{/key}
|
||||||
</Col>
|
</Col>
|
||||||
<Col class="p-2">
|
<Col class="p-2">
|
||||||
<h4 class="text-center">Top Projects on {cluster.charAt(0).toUpperCase() + cluster.slice(1)}</h4>
|
<h4 class="text-center">
|
||||||
|
Top Projects on {cluster.charAt(0).toUpperCase() +
|
||||||
|
cluster.slice(1)}
|
||||||
|
</h4>
|
||||||
{#key $topProjectQuery.data}
|
{#key $topProjectQuery.data}
|
||||||
{#if $topProjectQuery.fetching}
|
{#if $topProjectQuery.fetching}
|
||||||
<Spinner />
|
<Spinner />
|
||||||
{:else if $topProjectQuery.error}
|
{:else if $topProjectQuery.error}
|
||||||
<Card body color="danger">{$topProjectQuery.error.message}</Card>
|
<Card body color="danger"
|
||||||
|
>{$topProjectQuery.error.message}</Card
|
||||||
|
>
|
||||||
{:else}
|
{:else}
|
||||||
<Pie
|
<Pie
|
||||||
size={colWidth1}
|
size={colWidth1}
|
||||||
sliceLabel={topProjectSelection.label}
|
sliceLabel={topProjectSelection.label}
|
||||||
quantities={$topProjectQuery.data.topProjects.map((tp) => tp[topProjectSelection.key])}
|
quantities={$topProjectQuery.data.topProjects.map(
|
||||||
entities={$topProjectQuery.data.topProjects.map((tp) => tp.id)}
|
(tp) => tp[topProjectSelection.key]
|
||||||
|
)}
|
||||||
|
entities={$topProjectQuery.data.topProjects.map(
|
||||||
|
(tp) => tp.id
|
||||||
|
)}
|
||||||
/>
|
/>
|
||||||
{/if}
|
{/if}
|
||||||
{/key}
|
{/key}
|
||||||
@ -420,14 +556,20 @@
|
|||||||
{#if $topProjectQuery.fetching}
|
{#if $topProjectQuery.fetching}
|
||||||
<Spinner />
|
<Spinner />
|
||||||
{:else if $topProjectQuery.error}
|
{:else if $topProjectQuery.error}
|
||||||
<Card body color="danger">{$topProjectQuery.error.message}</Card>
|
<Card body color="danger"
|
||||||
|
>{$topProjectQuery.error.message}</Card
|
||||||
|
>
|
||||||
{:else}
|
{:else}
|
||||||
<Table>
|
<Table>
|
||||||
<tr class="mb-2">
|
<tr class="mb-2">
|
||||||
<th>Legend</th>
|
<th>Legend</th>
|
||||||
<th>Project Code</th>
|
<th>Project Code</th>
|
||||||
<th>Number of
|
<th
|
||||||
<select class="p-0" bind:value={topProjectSelection}>
|
>Number of
|
||||||
|
<select
|
||||||
|
class="p-0"
|
||||||
|
bind:value={topProjectSelection}
|
||||||
|
>
|
||||||
{#each topOptions as option}
|
{#each topOptions as option}
|
||||||
<option value={option}>
|
<option value={option}>
|
||||||
{option.label}
|
{option.label}
|
||||||
@ -438,8 +580,18 @@
|
|||||||
</tr>
|
</tr>
|
||||||
{#each $topProjectQuery.data.topProjects as tp, i}
|
{#each $topProjectQuery.data.topProjects as tp, i}
|
||||||
<tr>
|
<tr>
|
||||||
<td><Icon name="circle-fill" style="color: {colors[i]};"/></td>
|
<td
|
||||||
<th scope="col"><a href="/monitoring/jobs/?cluster={cluster}&state=running&project={tp.id}&projectMatch=eq">{tp.id}</a></th>
|
><Icon
|
||||||
|
name="circle-fill"
|
||||||
|
style="color: {colors[i]};"
|
||||||
|
/></td
|
||||||
|
>
|
||||||
|
<th scope="col"
|
||||||
|
><a
|
||||||
|
href="/monitoring/jobs/?cluster={cluster}&state=running&project={tp.id}&projectMatch=eq"
|
||||||
|
>{tp.id}</a
|
||||||
|
></th
|
||||||
|
>
|
||||||
<td>{tp[topProjectSelection.key]}</td>
|
<td>{tp[topProjectSelection.key]}</td>
|
||||||
</tr>
|
</tr>
|
||||||
{/each}
|
{/each}
|
||||||
@ -486,13 +638,16 @@
|
|||||||
<div bind:clientWidth={colWidth2}>
|
<div bind:clientWidth={colWidth2}>
|
||||||
{#key $mainQuery.data.stats}
|
{#key $mainQuery.data.stats}
|
||||||
<Histogram
|
<Histogram
|
||||||
data={convert2uplot($mainQuery.data.stats[0].histNumCores)}
|
data={convert2uplot(
|
||||||
|
$mainQuery.data.stats[0].histNumCores
|
||||||
|
)}
|
||||||
width={colWidth2 - 25}
|
width={colWidth2 - 25}
|
||||||
title="Number of Cores Distribution"
|
title="Number of Cores Distribution"
|
||||||
xlabel="Allocated Cores"
|
xlabel="Allocated Cores"
|
||||||
xunit="Cores"
|
xunit="Cores"
|
||||||
ylabel="Number of Jobs"
|
ylabel="Number of Jobs"
|
||||||
yunit="Jobs"/>
|
yunit="Jobs"
|
||||||
|
/>
|
||||||
{/key}
|
{/key}
|
||||||
</div>
|
</div>
|
||||||
</Col>
|
</Col>
|
||||||
@ -505,7 +660,8 @@
|
|||||||
xlabel="Allocated Accs"
|
xlabel="Allocated Accs"
|
||||||
xunit="Accs"
|
xunit="Accs"
|
||||||
ylabel="Number of Jobs"
|
ylabel="Number of Jobs"
|
||||||
yunit="Jobs"/>
|
yunit="Jobs"
|
||||||
|
/>
|
||||||
{/key}
|
{/key}
|
||||||
</Col>
|
</Col>
|
||||||
</Row>
|
</Row>
|
||||||
|
Loading…
Reference in New Issue
Block a user