120 lines
4.9 KiB
Handlebars
120 lines
4.9 KiB
Handlebars
{{#global-header class="page-header"}}
|
|
{{#each breadcrumbs as |breadcrumb index|}}
|
|
<li class="{{if (eq (inc index) breadcrumbs.length) "is-active"}}">
|
|
{{#link-to
|
|
data-test-breadcrumb=breadcrumb.label
|
|
params=breadcrumb.args}}
|
|
{{breadcrumb.label}}
|
|
{{/link-to}}
|
|
</li>
|
|
{{/each}}
|
|
{{/global-header}}
|
|
{{#gutter-menu class="page-body" onNamespaceChange=(action "gotoJobs")}}
|
|
<div class="tabs is-subnav">
|
|
<ul>
|
|
<li>{{#link-to "jobs.job.task-group" model.job model activeClass="is-active"}}Overview{{/link-to}}</li>
|
|
</ul>
|
|
</div>
|
|
<section class="section">
|
|
<h1 class="title">
|
|
{{model.name}}
|
|
</h1>
|
|
|
|
<div class="boxed-section is-small">
|
|
<div class="boxed-section-body inline-definitions">
|
|
<span class="label">Task Group Details</span>
|
|
|
|
<span class="pair" data-test-task-group-tasks><span class="term"># Tasks</span> {{model.tasks.length}}</span>
|
|
<span class="pair" data-test-task-group-cpu><span class="term">Reserved CPU</span> {{model.reservedCPU}} MHz</span>
|
|
<span class="pair" data-test-task-group-mem><span class="term">Reserved Memory</span> {{model.reservedMemory}} MiB</span>
|
|
<span class="pair" data-test-task-group-disk><span class="term">Reserved Disk</span> {{model.reservedEphemeralDisk}} MiB</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="boxed-section">
|
|
<div class="boxed-section-head">
|
|
<div>Allocation Status <span class="badge is-white">{{allocations.length}}</span></div>
|
|
</div>
|
|
<div class="boxed-section-body">
|
|
{{#allocation-status-bar allocationContainer=model.summary class="split-view" as |chart|}}
|
|
<ol class="legend">
|
|
{{#each chart.data as |datum index|}}
|
|
<li class="{{datum.className}} {{if (eq datum.index chart.activeDatum.index) "is-active"}} {{if (eq datum.value 0) "is-empty"}}">
|
|
<span class="color-swatch {{if datum.className datum.className (concat "swatch-" index)}}" />
|
|
<span class="value">{{datum.value}}</span>
|
|
<span class="label">
|
|
{{datum.label}}
|
|
</span>
|
|
</li>
|
|
{{/each}}
|
|
</ol>
|
|
{{/allocation-status-bar}}
|
|
</div>
|
|
</div>
|
|
|
|
<div class="boxed-section">
|
|
<div class="boxed-section-head">
|
|
Allocations
|
|
{{search-box
|
|
searchTerm=(mut searchTerm)
|
|
placeholder="Search allocations..."
|
|
class="is-inline pull-right"
|
|
inputClass="is-compact"}}
|
|
</div>
|
|
<div class="boxed-section-body is-full-bleed">
|
|
{{#list-pagination
|
|
source=sortedAllocations
|
|
size=pageSize
|
|
page=currentPage
|
|
class="allocations" as |p|}}
|
|
{{#list-table
|
|
source=p.list
|
|
sortProperty=sortProperty
|
|
sortDescending=sortDescending
|
|
class="with-foot" as |t|}}
|
|
{{#t.head}}
|
|
{{#t.sort-by prop="shortId"}}ID{{/t.sort-by}}
|
|
{{#t.sort-by prop="modifyIndex" title="Modify Index"}}Modified{{/t.sort-by}}
|
|
{{#t.sort-by prop="name"}}Name{{/t.sort-by}}
|
|
{{#t.sort-by prop="statusIndex"}}Status{{/t.sort-by}}
|
|
{{#t.sort-by prop="jobVersion"}}Version{{/t.sort-by}}
|
|
{{#t.sort-by prop="node.shortId"}}Client{{/t.sort-by}}
|
|
<th>CPU</th>
|
|
<th>Memory</th>
|
|
{{/t.head}}
|
|
{{#t.body as |row|}}
|
|
{{allocation-row data-test-allocation allocation=row.model context="job" onClick=(action "gotoAllocation" row.model)}}
|
|
{{/t.body}}
|
|
{{/list-table}}
|
|
<div class="table-foot">
|
|
<nav class="pagination">
|
|
<div class="pagination-numbers">
|
|
{{p.startsAt}}–{{p.endsAt}} of {{sortedAllocations.length}}
|
|
</div>
|
|
{{#p.prev class="pagination-previous"}} < {{/p.prev}}
|
|
{{#p.next class="pagination-next"}} > {{/p.next}}
|
|
<ul class="pagination-list"></ul>
|
|
</nav>
|
|
</div>
|
|
{{else}}
|
|
{{#if allocations.length}}
|
|
<div class="boxed-section-body">
|
|
<div class="empty-message" data-test-empty-allocations-list>
|
|
<h3 class="empty-message-headline" data-test-empty-allocations-list-headline>No Matches</h3>
|
|
<p class="empty-message-body">No allocations match the term <strong>{{searchTerm}}</strong></p>
|
|
</div>
|
|
</div>
|
|
{{else}}
|
|
<div class="boxed-section-body">
|
|
<div class="empty-message" data-test-empty-allocations-list>
|
|
<h3 class="empty-message-headline" data-test-empty-allocations-list-headline>No Allocations</h3>
|
|
<p class="empty-message-body">No allocations have been placed.</p>
|
|
</div>
|
|
</div>
|
|
{{/if}}
|
|
{{/list-pagination}}
|
|
</div>
|
|
</div>
|
|
</section>
|
|
{{/gutter-menu}}
|