mirror of
https://github.com/kemko/nomad.git
synced 2026-01-08 19:35:41 +03:00
ui: fix CI (#11785)
This commit is contained in:
Luiz Aoqui
@@ -14,10 +14,10 @@ import classic from 'ember-classic-decorator';
|
||||
|
||||
@classic
|
||||
export default class TaskGroupController extends Controller.extend(
|
||||
Sortable,
|
||||
Searchable,
|
||||
WithNamespaceResetting
|
||||
) {
|
||||
Sortable,
|
||||
Searchable,
|
||||
WithNamespaceResetting
|
||||
) {
|
||||
@service userSettings;
|
||||
@service can;
|
||||
|
||||
|
||||
@@ -3,158 +3,108 @@
|
||||
{{/each}}
|
||||
{{page-title "CSI Volume " this.model.name}}
|
||||
<section class="section with-headspace">
|
||||
<h1 class="title" data-test-title>
|
||||
{{this.model.name}}
|
||||
</h1>
|
||||
<h1 class="title" data-test-title>{{this.model.name}}</h1>
|
||||
|
||||
<div class="boxed-section is-small">
|
||||
<div class="boxed-section-body inline-definitions">
|
||||
<span class="label">
|
||||
Volume Details
|
||||
</span>
|
||||
<span class="label">Volume Details</span>
|
||||
<span class="pair" data-test-volume-health>
|
||||
<span class="term">
|
||||
Health
|
||||
</span>
|
||||
<span class="term">Health</span>
|
||||
{{if this.model.schedulable "Schedulable" "Unschedulable"}}
|
||||
</span>
|
||||
<span class="pair" data-test-volume-provider>
|
||||
<span class="term">
|
||||
Provider
|
||||
</span>
|
||||
<span class="term">Provider</span>
|
||||
{{this.model.provider}}
|
||||
</span>
|
||||
<span class="pair" data-test-volume-external-id>
|
||||
<span class="term">
|
||||
External ID
|
||||
</span>
|
||||
<span class="term">External ID</span>
|
||||
{{this.model.externalId}}
|
||||
</span>
|
||||
{{#if this.system.shouldShowNamespaces}}
|
||||
<span class="pair" data-test-volume-namespace>
|
||||
<span class="term">
|
||||
Namespace
|
||||
</span>
|
||||
<span class="term">Namespace</span>
|
||||
{{this.model.namespace.name}}
|
||||
</span>
|
||||
{{/if}}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="boxed-section">
|
||||
<div class="boxed-section-head">
|
||||
Write Allocations
|
||||
</div>
|
||||
<div class="boxed-section-body {{if this.model.writeAllocations.length "is-full-bleed"}}">
|
||||
{{#if this.model.writeAllocations.length}}
|
||||
<ListTable @source={{this.sortedWriteAllocations}} @class="with-foot" as |t|>
|
||||
<ListTable
|
||||
@source={{this.sortedWriteAllocations}}
|
||||
@class="with-foot" as |t|>
|
||||
<t.head>
|
||||
<th class="is-narrow"></th>
|
||||
<th>
|
||||
ID
|
||||
</th>
|
||||
<th>
|
||||
Created
|
||||
</th>
|
||||
<th>
|
||||
Modified
|
||||
</th>
|
||||
<th>
|
||||
Status
|
||||
</th>
|
||||
<th>
|
||||
Client
|
||||
</th>
|
||||
<th>
|
||||
Job
|
||||
</th>
|
||||
<th>
|
||||
Version
|
||||
</th>
|
||||
<th>
|
||||
CPU
|
||||
</th>
|
||||
<th>
|
||||
Memory
|
||||
</th>
|
||||
<th>ID</th>
|
||||
<th>Created</th>
|
||||
<th>Modified</th>
|
||||
<th>Status</th>
|
||||
<th>Client</th>
|
||||
<th>Job</th>
|
||||
<th>Version</th>
|
||||
<th>CPU</th>
|
||||
<th>Memory</th>
|
||||
</t.head>
|
||||
<t.body as |row|>
|
||||
<AllocationRow
|
||||
@data-test-write-allocation={{row.model.id}}
|
||||
@allocation={{row.model}}
|
||||
@context="volume"
|
||||
@onClick={{action "gotoAllocation" row.model}}
|
||||
/>
|
||||
@onClick={{action "gotoAllocation" row.model}} />
|
||||
</t.body>
|
||||
</ListTable>
|
||||
{{else}}
|
||||
<div class="empty-message" data-test-empty-write-allocations>
|
||||
<h3 class="empty-message-headline" data-test-empty-write-allocations-headline>
|
||||
No Write Allocations
|
||||
</h3>
|
||||
<p class="empty-message-body" data-test-empty-write-allocations-message>
|
||||
No allocations are depending on this volume for read/write access.
|
||||
</p>
|
||||
<h3 class="empty-message-headline" data-test-empty-write-allocations-headline>No Write Allocations</h3>
|
||||
<p class="empty-message-body" data-test-empty-write-allocations-message>No allocations are depending on this volume for read/write access.</p>
|
||||
</div>
|
||||
{{/if}}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="boxed-section">
|
||||
<div class="boxed-section-head">
|
||||
Read Allocations
|
||||
</div>
|
||||
<div class="boxed-section-body {{if this.model.readAllocations.length "is-full-bleed"}}">
|
||||
{{#if this.model.readAllocations.length}}
|
||||
<ListTable @source={{this.sortedReadAllocations}} @class="with-foot" as |t|>
|
||||
<ListTable
|
||||
@source={{this.sortedReadAllocations}}
|
||||
@class="with-foot" as |t|>
|
||||
<t.head>
|
||||
<th class="is-narrow"></th>
|
||||
<th>
|
||||
ID
|
||||
</th>
|
||||
<th>
|
||||
Modified
|
||||
</th>
|
||||
<th>
|
||||
Created
|
||||
</th>
|
||||
<th>
|
||||
Status
|
||||
</th>
|
||||
<th>
|
||||
Client
|
||||
</th>
|
||||
<th>
|
||||
Job
|
||||
</th>
|
||||
<th>
|
||||
Version
|
||||
</th>
|
||||
<th>
|
||||
CPU
|
||||
</th>
|
||||
<th>
|
||||
Memory
|
||||
</th>
|
||||
<th>ID</th>
|
||||
<th>Modified</th>
|
||||
<th>Created</th>
|
||||
<th>Status</th>
|
||||
<th>Client</th>
|
||||
<th>Job</th>
|
||||
<th>Version</th>
|
||||
<th>CPU</th>
|
||||
<th>Memory</th>
|
||||
</t.head>
|
||||
<t.body as |row|>
|
||||
<AllocationRow
|
||||
@data-test-read-allocation={{row.model.id}}
|
||||
@allocation={{row.model}}
|
||||
@context="volume"
|
||||
@onClick={{action "gotoAllocation" row.model}}
|
||||
/>
|
||||
@onClick={{action "gotoAllocation" row.model}} />
|
||||
</t.body>
|
||||
</ListTable>
|
||||
{{else}}
|
||||
<div class="empty-message" data-test-empty-read-allocations>
|
||||
<h3 class="empty-message-headline" data-test-empty-read-allocations-headline>
|
||||
No Read Allocations
|
||||
</h3>
|
||||
<p class="empty-message-body" data-test-empty-read-allocations-message>
|
||||
No allocations are depending on this volume for read-only access.
|
||||
</p>
|
||||
<h3 class="empty-message-headline" data-test-empty-read-allocations-headline>No Read Allocations</h3>
|
||||
<p class="empty-message-body" data-test-empty-read-allocations-message>No allocations are depending on this volume for read-only access.</p>
|
||||
</div>
|
||||
{{/if}}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="boxed-section">
|
||||
<div class="boxed-section-head">
|
||||
Constraints
|
||||
@@ -162,32 +112,20 @@
|
||||
<div class="boxed-section-body is-full-bleed">
|
||||
<table class="table">
|
||||
<thead>
|
||||
<th>
|
||||
Setting
|
||||
</th>
|
||||
<th>
|
||||
Value
|
||||
</th>
|
||||
<th>Setting</th>
|
||||
<th>Value</th>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>
|
||||
Access Mode
|
||||
</td>
|
||||
<td data-test-access-mode>
|
||||
{{this.model.accessMode}}
|
||||
</td>
|
||||
<td>Access Mode</td>
|
||||
<td data-test-access-mode>{{this.model.accessMode}}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
Attachment Mode
|
||||
</td>
|
||||
<td data-test-attachment-mode>
|
||||
{{this.model.attachmentMode}}
|
||||
</td>
|
||||
<td>Attachment Mode</td>
|
||||
<td data-test-attachment-mode>{{this.model.attachmentMode}}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</section>
|
||||
|
||||
@@ -2,116 +2,64 @@
|
||||
{{page-title "Task group " this.model.name " - Job " this.model.job.name}}
|
||||
<div class="tabs is-subnav">
|
||||
<ul>
|
||||
<li>
|
||||
<LinkTo
|
||||
@route="jobs.job.task-group"
|
||||
@models={{array this.model.job this.model}}
|
||||
@activeClass="is-active"
|
||||
>
|
||||
Overview
|
||||
</LinkTo>
|
||||
</li>
|
||||
<li><LinkTo @route="jobs.job.task-group" @models={{array this.model.job this.model}} @activeClass="is-active">Overview</LinkTo></li>
|
||||
</ul>
|
||||
</div>
|
||||
<section class="section">
|
||||
<h1 class="title with-flex">
|
||||
<span>
|
||||
{{this.model.name}}
|
||||
</span>
|
||||
<span>{{this.model.name}}</span>
|
||||
<div>
|
||||
<Exec::OpenButton @job={{this.model.job}} @taskGroup={{this.model}} />
|
||||
{{#if this.model.scaling}}
|
||||
<StepperInput
|
||||
data-test-task-group-count-stepper
|
||||
aria-label={{this.tooltipText}}
|
||||
@min={{this.model.scaling.min}}
|
||||
@max={{this.model.scaling.max}}
|
||||
@value={{this.model.count}}
|
||||
@class="is-primary is-small"
|
||||
@disabled={{or
|
||||
this.model.job.runningDeployment
|
||||
(cannot "scale job" namespace=this.model.job.namespace.name)
|
||||
}}
|
||||
@onChange={{action "scaleTaskGroup"}}
|
||||
>
|
||||
Count
|
||||
</StepperInput>
|
||||
<StepperInput
|
||||
data-test-task-group-count-stepper
|
||||
aria-label={{this.tooltipText}}
|
||||
@min={{this.model.scaling.min}}
|
||||
@max={{this.model.scaling.max}}
|
||||
@value={{this.model.count}}
|
||||
@class="is-primary is-small"
|
||||
@disabled={{or this.model.job.runningDeployment (cannot "scale job" namespace=this.model.job.namespace.name)}}
|
||||
@onChange={{action "scaleTaskGroup"}}>
|
||||
Count
|
||||
</StepperInput>
|
||||
{{/if}}
|
||||
</div>
|
||||
</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>
|
||||
{{this.model.tasks.length}}
|
||||
</span>
|
||||
<span class="pair" data-test-task-group-cpu>
|
||||
<span class="term">
|
||||
Reserved CPU
|
||||
</span>
|
||||
{{format-scheduled-hertz this.model.reservedCPU}}
|
||||
</span>
|
||||
<span class="label">Task Group Details</span>
|
||||
|
||||
<span class="pair" data-test-task-group-tasks><span class="term"># Tasks</span> {{this.model.tasks.length}}</span>
|
||||
<span class="pair" data-test-task-group-cpu><span class="term">Reserved CPU</span> {{format-scheduled-hertz this.model.reservedCPU}}</span>
|
||||
<span class="pair" data-test-task-group-mem>
|
||||
<span class="term">
|
||||
Reserved Memory
|
||||
</span>
|
||||
<span class="term">Reserved Memory</span>
|
||||
{{format-scheduled-bytes this.model.reservedMemory start="MiB"}}
|
||||
{{#if (gt this.model.reservedMemoryMax this.model.reservedMemory)}}
|
||||
({{format-scheduled-bytes this.model.reservedMemoryMax start="MiB"}}Max)
|
||||
({{format-scheduled-bytes this.model.reservedMemoryMax start="MiB"}} Max)
|
||||
{{/if}}
|
||||
</span>
|
||||
<span class="pair" data-test-task-group-disk>
|
||||
<span class="term">
|
||||
Reserved Disk
|
||||
</span>
|
||||
{{format-scheduled-bytes this.model.reservedEphemeralDisk start="MiB"}}
|
||||
</span>
|
||||
<span class="pair" data-test-task-group-disk><span class="term">Reserved Disk</span> {{format-scheduled-bytes this.model.reservedEphemeralDisk start="MiB"}}</span>
|
||||
{{#if this.model.scaling}}
|
||||
<span class="pair" data-test-task-group-min>
|
||||
<span class="term">
|
||||
Count Range
|
||||
</span>
|
||||
{{this.model.scaling.min}}
|
||||
to
|
||||
{{this.model.scaling.max}}
|
||||
<span class="pair" data-test-task-group-min><span class="term">Count Range</span>
|
||||
{{this.model.scaling.min}} to {{this.model.scaling.max}}
|
||||
</span>
|
||||
<span class="pair" data-test-task-group-max>
|
||||
<span class="term">
|
||||
Scaling Policy?
|
||||
</span>
|
||||
<span class="pair" data-test-task-group-max><span class="term">Scaling Policy?</span>
|
||||
{{if this.model.scaling.policy "Yes" "No"}}
|
||||
</span>
|
||||
{{/if}}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="boxed-section">
|
||||
<div class="boxed-section-head">
|
||||
<div>
|
||||
Allocation Status
|
||||
<span class="badge is-white">
|
||||
{{this.allocations.length}}
|
||||
</span>
|
||||
</div>
|
||||
<div>Allocation Status <span class="badge is-white">{{this.allocations.length}}</span></div>
|
||||
</div>
|
||||
<div class="boxed-section-body">
|
||||
<AllocationStatusBar
|
||||
@allocationContainer={{this.model.summary}}
|
||||
@class="split-view" as |chart|
|
||||
>
|
||||
<AllocationStatusBar @allocationContainer={{this.model.summary}} @class="split-view" as |chart|>
|
||||
<ol class="legend">
|
||||
{{#each chart.data as |datum index|}}
|
||||
<li
|
||||
class="{{datum.className}}
|
||||
|
||||
{{if (eq datum.label chart.activeDatum.label) "is-active"}}
|
||||
|
||||
{{if (eq datum.value 0) "is-empty"}}"
|
||||
>
|
||||
<li class="{{datum.className}} {{if (eq datum.label chart.activeDatum.label) "is-active"}} {{if (eq datum.value 0) "is-empty"}}">
|
||||
<JobPage::Parts::SummaryLegendItem @datum={{datum}} @index={{index}} />
|
||||
</li>
|
||||
{{/each}}
|
||||
@@ -152,102 +100,62 @@
|
||||
@source={{this.sortedAllocations}}
|
||||
@size={{this.pageSize}}
|
||||
@page={{this.currentPage}}
|
||||
@class="allocations" as |p|
|
||||
>
|
||||
@class="allocations" as |p|>
|
||||
<ListTable
|
||||
@source={{p.list}}
|
||||
@sortProperty={{this.sortProperty}}
|
||||
@sortDescending={{this.sortDescending}}
|
||||
@class="with-foot" as |t|
|
||||
>
|
||||
@class="with-foot" as |t|>
|
||||
<t.head>
|
||||
<th class="is-narrow"></th>
|
||||
<t.sort-by @prop="shortId">
|
||||
ID
|
||||
</t.sort-by>
|
||||
<t.sort-by @prop="createIndex" @title="Create Index">
|
||||
Created
|
||||
</t.sort-by>
|
||||
<t.sort-by @prop="modifyIndex" @title="Modify Index">
|
||||
Modified
|
||||
</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>
|
||||
Volume
|
||||
</th>
|
||||
<th>
|
||||
CPU
|
||||
</th>
|
||||
<th>
|
||||
Memory
|
||||
</th>
|
||||
<t.sort-by @prop="shortId">ID</t.sort-by>
|
||||
<t.sort-by @prop="createIndex" @title="Create Index">Created</t.sort-by>
|
||||
<t.sort-by @prop="modifyIndex" @title="Modify Index">Modified</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>Volume</th>
|
||||
<th>CPU</th>
|
||||
<th>Memory</th>
|
||||
</t.head>
|
||||
<t.body @key="model.id" as |row|>
|
||||
<AllocationRow
|
||||
@data-test-allocation={{row.model.id}}
|
||||
@allocation={{row.model}}
|
||||
@context="taskGroup"
|
||||
@onClick={{action "gotoAllocation" row.model}}
|
||||
/>
|
||||
<AllocationRow @data-test-allocation={{row.model.id}} @allocation={{row.model}} @context="taskGroup" @onClick={{action "gotoAllocation" row.model}} />
|
||||
</t.body>
|
||||
</ListTable>
|
||||
<div class="table-foot">
|
||||
<PageSizeSelect @onChange={{action this.resetPagination}} />
|
||||
<nav class="pagination">
|
||||
<div class="pagination-numbers">
|
||||
{{p.startsAt}}
|
||||
–
|
||||
{{p.endsAt}}
|
||||
of
|
||||
{{this.sortedAllocations.length}}
|
||||
{{p.startsAt}}–{{p.endsAt}} of {{this.sortedAllocations.length}}
|
||||
</div>
|
||||
<p.prev @class="pagination-previous">
|
||||
{{x-icon "chevron-left"}}
|
||||
</p.prev>
|
||||
<p.next @class="pagination-next">
|
||||
{{x-icon "chevron-right"}}
|
||||
</p.next>
|
||||
<p.prev @class="pagination-previous">{{x-icon "chevron-left"}}</p.prev>
|
||||
<p.next @class="pagination-next">{{x-icon "chevron-right"}}</p.next>
|
||||
<ul class="pagination-list"></ul>
|
||||
</nav>
|
||||
</div>
|
||||
</ListPagination>
|
||||
{{else if this.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>
|
||||
{{this.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>
|
||||
{{#if this.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>{{this.searchTerm}}</strong></p>
|
||||
</div>
|
||||
</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}}
|
||||
{{/if}}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<LifecycleChart @tasks={{this.model.tasks}} />
|
||||
|
||||
{{#if this.model.scaleState.isVisible}}
|
||||
{{#if this.shouldShowScaleEventTimeline}}
|
||||
<div data-test-scaling-timeline class="boxed-section">
|
||||
@@ -259,6 +167,7 @@
|
||||
</div>
|
||||
</div>
|
||||
{{/if}}
|
||||
|
||||
<div data-test-scaling-events class="boxed-section">
|
||||
<div class="boxed-section-head">
|
||||
Recent Scaling Events
|
||||
@@ -268,6 +177,7 @@
|
||||
</div>
|
||||
</div>
|
||||
{{/if}}
|
||||
|
||||
{{#if this.model.volumes.length}}
|
||||
<div data-test-volumes class="boxed-section">
|
||||
<div class="boxed-section-head">
|
||||
@@ -276,47 +186,29 @@
|
||||
<div class="boxed-section-body is-full-bleed">
|
||||
<ListTable @source={{this.model.volumes}} as |t|>
|
||||
<t.head>
|
||||
<th>
|
||||
Name
|
||||
</th>
|
||||
<th>
|
||||
Type
|
||||
</th>
|
||||
<th>
|
||||
Source
|
||||
</th>
|
||||
<th>
|
||||
Permissions
|
||||
</th>
|
||||
<th>Name</th>
|
||||
<th>Type</th>
|
||||
<th>Source</th>
|
||||
<th>Permissions</th>
|
||||
</t.head>
|
||||
<t.body as |row|>
|
||||
<tr data-test-volume>
|
||||
<td data-test-volume-name>
|
||||
{{#if row.model.isCSI}}
|
||||
<LinkTo
|
||||
@route="csi.volumes.volume"
|
||||
@model={{row.model.source}}
|
||||
@query={{hash volumeNamespace=row.model.namespace.id}}
|
||||
>
|
||||
<LinkTo @route="csi.volumes.volume" @model={{row.model.source}} @query={{hash volumeNamespace=row.model.namespace.id}}>
|
||||
{{row.model.name}}
|
||||
</LinkTo>
|
||||
{{else}}
|
||||
{{row.model.name}}
|
||||
{{/if}}
|
||||
</td>
|
||||
<td data-test-volume-type>
|
||||
{{row.model.type}}
|
||||
</td>
|
||||
<td data-test-volume-source>
|
||||
{{row.model.source}}
|
||||
</td>
|
||||
<td data-test-volume-permissions>
|
||||
{{if row.model.readOnly "Read" "Read/Write"}}
|
||||
</td>
|
||||
<td data-test-volume-type>{{row.model.type}}</td>
|
||||
<td data-test-volume-source>{{row.model.source}}</td>
|
||||
<td data-test-volume-permissions>{{if row.model.readOnly "Read" "Read/Write"}}</td>
|
||||
</tr>
|
||||
</t.body>
|
||||
</ListTable>
|
||||
</div>
|
||||
</div>
|
||||
{{/if}}
|
||||
</section>
|
||||
</section>
|
||||
|
||||
@@ -9,12 +9,7 @@
|
||||
data-test-recommendation-summaries-search
|
||||
@onChange={{this.syncActiveSummary}}
|
||||
@searchTerm={{mut this.searchTerm}}
|
||||
@placeholder="Search
|
||||
{{this.summaries.length}}
|
||||
|
||||
{{pluralize "recommendation" this.summaries.length}}
|
||||
..."
|
||||
/>
|
||||
@placeholder="Search {{this.summaries.length}} {{pluralize "recommendation" this.summaries.length}}..." />
|
||||
{{/if}}
|
||||
</div>
|
||||
<div class="toolbar-item is-right-aligned is-mobile-full-width">
|
||||
@@ -25,88 +20,72 @@
|
||||
@label="Namespace"
|
||||
@options={{this.optionsNamespaces}}
|
||||
@selection={{this.qpNamespace}}
|
||||
@onSelect={{action
|
||||
(queue
|
||||
(action this.cacheNamespace) (action this.setFacetQueryParam "qpNamespace")
|
||||
)
|
||||
}}
|
||||
/>
|
||||
@onSelect={{action (queue
|
||||
(action this.cacheNamespace)
|
||||
(action this.setFacetQueryParam "qpNamespace")
|
||||
)}} />
|
||||
{{/if}}
|
||||
<MultiSelectDropdown
|
||||
data-test-type-facet
|
||||
@label="Type"
|
||||
@options={{this.optionsType}}
|
||||
@selection={{this.selectionType}}
|
||||
@onSelect={{action this.setFacetQueryParam "qpType"}}
|
||||
/>
|
||||
@onSelect={{action this.setFacetQueryParam "qpType"}} />
|
||||
<MultiSelectDropdown
|
||||
data-test-status-facet
|
||||
@label="Status"
|
||||
@options={{this.optionsStatus}}
|
||||
@selection={{this.selectionStatus}}
|
||||
@onSelect={{action this.setFacetQueryParam "qpStatus"}}
|
||||
/>
|
||||
@onSelect={{action this.setFacetQueryParam "qpStatus"}} />
|
||||
<MultiSelectDropdown
|
||||
data-test-datacenter-facet
|
||||
@label="Datacenter"
|
||||
@options={{this.optionsDatacenter}}
|
||||
@selection={{this.selectionDatacenter}}
|
||||
@onSelect={{action this.setFacetQueryParam "qpDatacenter"}}
|
||||
/>
|
||||
@onSelect={{action this.setFacetQueryParam "qpDatacenter"}} />
|
||||
<MultiSelectDropdown
|
||||
data-test-prefix-facet
|
||||
@label="Prefix"
|
||||
@options={{this.optionsPrefix}}
|
||||
@selection={{this.selectionPrefix}}
|
||||
@onSelect={{action this.setFacetQueryParam "qpPrefix"}}
|
||||
/>
|
||||
@onSelect={{action this.setFacetQueryParam "qpPrefix"}} />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{#if this.filteredSummaries}}
|
||||
{{outlet}}
|
||||
<ListTable @source={{this.filteredSummaries}} as |t|>
|
||||
|
||||
<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>
|
||||
<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}} />
|
||||
<Das::RecommendationRow
|
||||
class="is-disabled"
|
||||
@summary={{row.model}}
|
||||
/>
|
||||
{{else}}
|
||||
<Das::RecommendationRow
|
||||
class="is-interactive
|
||||
{{if (eq row.model this.activeRecommendationSummary) "is-active"}}"
|
||||
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>
|
||||
<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>
|
||||
@@ -114,13 +93,11 @@
|
||||
{{/if}}
|
||||
{{else}}
|
||||
<div class="empty-message" data-test-empty-recommendations>
|
||||
<h3 class="empty-message-headline" data-test-empty-recommendations-headline>
|
||||
No Recommendations
|
||||
</h3>
|
||||
<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>
|
||||
</PageLayout>
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
/* eslint-disable ember-a11y-testing/a11y-audit-called */
|
||||
import { module, test } from 'qunit';
|
||||
import { setupRenderingTest } from 'ember-qunit';
|
||||
import { render, click, waitFor } from '@ember/test-helpers';
|
||||
|
||||
Reference in New Issue
Block a user