open-nomad/ui/app/templates/jobs/job/index.hbs
2017-11-29 20:12:12 -08:00

199 lines
8.1 KiB
Handlebars

{{#global-header class="page-header"}}
{{#each breadcrumbs as |breadcrumb|}}
{{#link-to params=breadcrumb.args class="breadcrumb"}}{{breadcrumb.label}}{{/link-to}}
{{/each}}
{{/global-header}}
{{#gutter-menu class="page-body" onNamespaceChange=(action "gotoJobs")}}
{{partial "jobs/job/subnav"}}
<section class="section">
<h1 class="title">
{{model.name}}
<span class="bumper-left tag {{model.statusClass}}">{{model.status}}</span>
{{#if model.periodic}}
<span class="tag is-hollow">periodic</span>
{{else if model.parameterized}}
<span class="tag is-hollow">parameterized</span>
{{/if}}
</h1>
<div class="boxed-section job-stats">
<div class="boxed-section-body">
<span><strong>Type:</strong> {{model.type}} | </span>
<span><strong>Priority:</strong> {{model.priority}} </span>
{{#if (and model.namespace system.shouldShowNamespaces)}}
<span> | <strong>Namespace:</strong> {{model.namespace.name}}</span>
{{/if}}
</div>
</div>
<div class="boxed-section">
<div class="boxed-section-head">
<div>Allocation Status <span class="badge is-white">{{taskGroups.length}}</span></div>
</div>
<div class="boxed-section-body">
{{#allocation-status-bar allocationContainer=model 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>
{{#if model.hasPlacementFailures}}
<div class="boxed-section is-danger active-deployment">
<div class="boxed-section-head">
Placement Failures
</div>
<div class="boxed-section-body">
{{#each model.taskGroups as |taskGroup|}}
{{#if taskGroup.placementFailures}}
{{#with taskGroup.placementFailures as |failures|}}
<h3 class="title is-5">
{{taskGroup.name}}
<span class="badge is-light">{{inc failures.coalescedFailures}}</span>
</h3>
<ul class="simple-list">
{{#if (eq failures.nodesEvaluated 0)}}
<li>No nodes were eligible for evaluation</li>
{{/if}}
{{#each-in failures.nodesAvailable as |datacenter available|}}
{{#if (eq available 0)}}
<li>No nodes are available in datacenter {{datacenter}}</li>
{{/if}}
{{/each-in}}
{{#each-in failures.classFiltered as |class count|}}
<li>Class {{class}} filtered {{count}} {{pluralize "node" count}}</li>
{{/each-in}}
{{#each-in failures.constraintFiltered as |constraint count|}}
<li>Constraint <code>{{constraint}}</code> filtered {{count}} {{pluralize "node" count}}</li>
{{/each-in}}
{{#if failures.nodesExhausted}}
<li>Resources exhausted on {{failures.nodesExhausted}} {{pluralize "node" failures.nodesExhausted}}</li>
{{/if}}
{{#each-in failures.classExhausted as |class count|}}
<li>Class {{class}} exhausted on {{count}} {{pluralize "node" count}}</li>
{{/each-in}}
{{#each-in failures.dimensionExhausted as |dimension count|}}
<li>Dimension {{dimension}} exhausted on {{count}} {{pluralize "node" count}}</li>
{{/each-in}}
{{#each-in failures.quotaExhausted as |quota dimension|}}
<li>Quota limit hit {{dimension}}</li>
{{/each-in}}
{{#each-in failures.scores as |name score|}}
<li>Score {{name}} = {{score}}</li>
{{/each-in}}
</ul>
{{/with}}
{{/if}}
{{/each}}
</div>
</div>
{{/if}}
{{#if model.runningDeployment}}
<div class="boxed-section is-info active-deployment">
<div class="boxed-section-head">
<div class="boxed-section-row">
Active Deployment
<span class="badge is-white is-subtle bumper-left">{{model.runningDeployment.shortId}}</span>
{{#if model.runningDeployment.version.submitTime}}
<span class="pull-right submit-time">{{moment-from-now model.runningDeployment.version.submitTime}}</span>
{{/if}}
</div>
<div class="boxed-section-row">
<span class="tag is-info is-outlined">Running</span>
{{#if model.runningDeployment.requiresPromotion}}
<span class="tag bumper-left is-warning no-text-transform">Deployment is running but requires promotion</span>
{{/if}}
</div>
</div>
<div class="boxed-section-body with-foot">
{{#job-deployment-details deployment=model.runningDeployment as |d|}}
{{d.metrics}}
{{#if isShowingDeploymentDetails}}
{{d.taskGroups}}
{{d.allocations}}
{{/if}}
{{/job-deployment-details}}
</div>
<div class="boxed-section-foot">
<a class="pull-right active-deployment-details-toggle" {{action (toggle "isShowingDeploymentDetails" this)}}>
{{if isShowingDeploymentDetails "Hide" "Show"}} deployment task groups and allocations
</a>
</div>
</div>
{{/if}}
<div class="boxed-section">
<div class="boxed-section-head">
Task Groups
</div>
<div class="boxed-section-body is-full-bleed">
{{#list-pagination
source=sortedTaskGroups
sortProperty=sortProperty
sortDescending=sortDescending as |p|}}
{{#list-table
source=p.list
sortProperty=sortProperty
sortDescending=sortDescending as |t|}}
{{#t.head}}
{{#t.sort-by prop="name"}}Name{{/t.sort-by}}
{{#t.sort-by prop="count"}}Count{{/t.sort-by}}
{{#t.sort-by prop="queuedOrStartingAllocs" class="is-3"}}Allocation Status{{/t.sort-by}}
{{#t.sort-by prop="reservedCPU"}}Reserved CPU{{/t.sort-by}}
{{#t.sort-by prop="reservedMemory"}}Reserved Memory{{/t.sort-by}}
{{#t.sort-by prop="reservedEphemeralDisk"}}Reserved Disk{{/t.sort-by}}
{{/t.head}}
{{#t.body as |row|}}
{{task-group-row taskGroup=row.model onClick=(action "gotoTaskGroup" row.model)}}
{{/t.body}}
{{/list-table}}
{{/list-pagination}}
</div>
</div>
<div class="boxed-section">
<div class="boxed-section-head">
Evaluations
</div>
<div class="boxed-section-body is-full-bleed">
{{#list-table source=sortedEvaluations as |t|}}
{{#t.head}}
<th>ID</th>
<th>Priority</th>
<th>Triggered By</th>
<th>Status</th>
<th>Placement Failures</th>
{{/t.head}}
{{#t.body as |row|}}
<tr>
<td>{{row.model.shortId}}</td>
<td>{{row.model.priority}}</td>
<td>{{row.model.triggeredBy}}</td>
<td>{{row.model.status}}</td>
<td>
{{#if (eq row.model.status "blocked")}}
N/A - In Progress
{{else if row.model.hasPlacementFailures}}
True
{{else}}
False
{{/if}}
</td>
</tr>
{{/t.body}}
{{/list-table}}
</div>
</div>
</section>
{{/gutter-menu}}