open-nomad/ui/app/templates/optimize.hbs

92 lines
3.4 KiB
Handlebars

<PageLayout>
<section class="section">
{{#if @model}}
<div class="toolbar">
<div class="toolbar-item">
{{#if @model}}
<SearchBox
data-test-recommendation-summaries-search
@onChange={{this.ensureActiveSummaryIsNotExcluded}}
@searchTerm={{mut this.searchTerm}}
@placeholder="Search {{this.model.length}} {{pluralize "recommendation" this.model.length}}..." />
{{/if}}
</div>
<div class="toolbar-item is-right-aligned is-mobile-full-width">
<div class="button-bar">
<MultiSelectDropdown
data-test-type-facet
@label="Type"
@options={{this.optionsType}}
@selection={{this.selectionType}}
@onSelect={{action this.setFacetQueryParam "qpType"}} />
<MultiSelectDropdown
data-test-status-facet
@label="Status"
@options={{this.optionsStatus}}
@selection={{this.selectionStatus}}
@onSelect={{action this.setFacetQueryParam "qpStatus"}} />
<MultiSelectDropdown
data-test-datacenter-facet
@label="Datacenter"
@options={{this.optionsDatacenter}}
@selection={{this.selectionDatacenter}}
@onSelect={{action this.setFacetQueryParam "qpDatacenter"}} />
<MultiSelectDropdown
data-test-prefix-facet
@label="Prefix"
@options={{this.optionsPrefix}}
@selection={{this.selectionPrefix}}
@onSelect={{action this.setFacetQueryParam "qpPrefix"}} />
</div>
</div>
</div>
{{#if this.filteredSummaries}}
{{outlet}}
<ListTable
@source={{this.filteredSummaries}} as |t|>
<t.head>
<th>Job</th>
<th>Recommended At</th>
<th># Allocs</th>
<th>CPU</th>
<th>Mem</th>
<th>Agg. CPU</th>
<th>Agg. Mem</th>
</t.head>
<t.body as |row|>
{{#if row.model.isProcessed}}
<Das::RecommendationRow
class="is-disabled"
@summary={{row.model}}
/>
{{else}}
<Das::RecommendationRow
class="is-interactive {{if (eq row.model this.activeRecommendationSummary) 'is-active'}}"
@summary={{row.model}}
{{on "click" (fn this.transitionToSummary row.model)}}
/>
{{/if}}
</t.body>
</ListTable>
{{else}}
<div class="empty-message" data-test-empty-recommendations>
<h3 class="empty-message-headline" data-test-empty-recommendations-headline>No Matches</h3>
<p class="empty-message-body">
No recommendations match your current filter selection.
</p>
</div>
{{/if}}
{{else}}
<div class="empty-message" data-test-empty-recommendations>
<h3 class="empty-message-headline" data-test-empty-recommendations-headline>No Recommendations</h3>
<p class="empty-message-body">
All recommendations have been accepted or dismissed. Nomad will continuously monitor applications so expect more recommendations in the future.
</p>
</div>
{{/if}}
</section>
</PageLayout>