chore: prettify children template

This commit is contained in:
Jai Bhagat 2022-01-03 12:04:44 -05:00
parent a12e60c822
commit 0079fc3b6f
1 changed files with 56 additions and 19 deletions

View File

@ -5,7 +5,8 @@
<LinkTo
data-test-dispatch-button
@route="jobs.job.dispatch"
class="button is-primary is-compact pull-right">
class="button is-primary is-compact pull-right"
>
Dispatch Job
</LinkTo>
{{else}}
@ -14,7 +15,8 @@
class="button is-disabled is-primary is-compact pull-right tooltip multiline"
aria-label="You dont have permission to dispatch jobs"
disabled
type="button">
type="button"
>
Dispatch Job
</button>
{{/if}}
@ -25,44 +27,79 @@
<ListPagination
@source={{this.sortedChildren}}
@size={{this.pageSize}}
@page={{this.currentPage}} as |p|>
@page={{this.currentPage}} as |p|
>
<ListTable
@source={{p.list}}
@sortProperty={{this.sortProperty}}
@sortDescending={{this.sortDescending}}
@class="with-foot" as |t|>
@class="with-foot" as |t|
>
<t.head data-test-jobs-header>
<t.sort-by @prop="name">Name</t.sort-by>
<t.sort-by @prop="name">
Name
</t.sort-by>
{{#if this.system.shouldShowNamespaces}}
<t.sort-by @prop="namespace.name" data-test-jobs-namespace-header>Namespace</t.sort-by>
<t.sort-by @prop="namespace.name" data-test-jobs-namespace-header>
Namespace
</t.sort-by>
{{/if}}
<t.sort-by @prop="submitTime" data-test-jobs-submit-time-header>Submitted At</t.sort-by>
<t.sort-by @prop="status">Status</t.sort-by>
<t.sort-by @prop="type">Type</t.sort-by>
<t.sort-by @prop="priority">Priority</t.sort-by>
<th>Groups</th>
<th class="is-3">Summary</th>
<t.sort-by @prop="submitTime" data-test-jobs-submit-time-header>
Submitted At
</t.sort-by>
<t.sort-by @prop="status">
Status
</t.sort-by>
<t.sort-by @prop="type">
Type
</t.sort-by>
<t.sort-by @prop="priority">
Priority
</t.sort-by>
<th>
Groups
</th>
<th class="is-3">
Summary
</th>
</t.head>
<t.body @key="model.id" as |row|>
<JobRow data-test-job-row @job={{row.model}} @context="child" @onClick={{action this.gotoJob row.model}} />
<JobRow
data-test-job-row
@job={{row.model}}
@context="child"
@onClick={{action this.gotoJob row.model}}
/>
</t.body>
</ListTable>
<div class="table-foot">
<PageSizeSelect @onChange={{action this.resetPagination}} />
<nav class="pagination">
<div class="pagination-numbers">
{{p.startsAt}}&ndash;{{p.endsAt}} of {{this.sortedChildren.length}}
{{p.startsAt}}
{{p.endsAt}}
of
{{this.sortedChildren.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}}
<div class="empty-message">
<h3 class="empty-message-headline">No Job Launches</h3>
<p class="empty-message-body">No remaining living job launches.</p>
<h3 class="empty-message-headline">
No Job Launches
</h3>
<p class="empty-message-body">
No remaining living job launches.
</p>
</div>
{{/if}}
</div>
</div>