feat(ui): renovate the edge jobs list page EE-3532 (#7187)

pull/7333/head
matias-portainer 2022-07-25 13:28:58 -03:00 committed by GitHub
parent 7b774c702d
commit f8b4663e0a
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 34 additions and 32 deletions

View File

@ -2,46 +2,48 @@
<rd-widget> <rd-widget>
<rd-widget-body classes="no-padding"> <rd-widget-body classes="no-padding">
<div class="toolBar"> <div class="toolBar">
<div class="toolBarTitle"> <i class="fa" ng-class="$ctrl.titleIcon" aria-hidden="true" style="margin-right: 2px"></i> {{ $ctrl.titleText }} </div> <div class="toolBarTitle vertical-center"> <pr-icon icon="$ctrl.titleIcon" feather="true"></pr-icon> {{ $ctrl.titleText }} </div>
</div> <div class="searchBar vertical-center">
<div class="actionBar"> <pr-icon icon="'search'" feather="true" class-name="'icon'"></pr-icon>
<button type="button" class="btn btn-sm btn-danger" ng-disabled="$ctrl.state.selectedItemCount === 0" ng-click="$ctrl.removeAction($ctrl.state.selectedItems)"> <input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" placeholder="Search..." auto-focus ng-model-options="{ debounce: 300 }" />
<i class="fa fa-trash-alt space-right" aria-hidden="true"></i>Remove </div>
</button> <div class="actionBar">
<button type="button" class="btn btn-sm btn-primary" ui-sref="edge.jobs.new"> <i class="fa fa-plus space-right" aria-hidden="true"></i>Add Edge job </button> <button type="button" class="btn btn-sm btn-danger" ng-disabled="$ctrl.state.selectedItemCount === 0" ng-click="$ctrl.removeAction($ctrl.state.selectedItems)">
</div> <pr-icon icon="'trash-2'" feather="true"></pr-icon>Remove
<div class="searchBar"> </button>
<i class="fa fa-search searchIcon" aria-hidden="true"></i> <button type="button" class="btn btn-sm btn-primary" ui-sref="edge.jobs.new"> <pr-icon icon="'plus'" feather="true"></pr-icon>Add Edge job </button>
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" placeholder="Search..." auto-focus ng-model-options="{ debounce: 300 }" /> </div>
</div> </div>
<div class="table-responsive"> <div class="table-responsive">
<table class="table table-hover nowrap-cells"> <table class="table table-hover nowrap-cells">
<thead> <thead>
<tr> <tr>
<th> <th>
<span class="md-checkbox"> <table-column-header
<input id="select_all" type="checkbox" ng-model="$ctrl.state.selectAll" ng-change="$ctrl.selectAll()" /> col-title="'Name'"
<label for="select_all"></label> can-sort="true"
</span> is-sorted="$ctrl.state.orderBy === 'Name'"
<a ng-click="$ctrl.changeOrderBy('Name')"> is-sorted-desc="$ctrl.state.orderBy === 'Name' && $ctrl.state.reverseOrder"
Name ng-click="$ctrl.changeOrderBy('Name')"
<i class="fa fa-sort-alpha-down" aria-hidden="true" ng-if="$ctrl.state.orderBy === 'Name' && !$ctrl.state.reverseOrder"></i> ></table-column-header>
<i class="fa fa-sort-alpha-up" aria-hidden="true" ng-if="$ctrl.state.orderBy === 'Name' && $ctrl.state.reverseOrder"></i>
</a>
</th> </th>
<th> <th>
<a ng-click="$ctrl.changeOrderBy('CronExpression')"> <table-column-header
Cron expression col-title="'CronExpression'"
<i class="fa fa-sort-alpha-down" aria-hidden="true" ng-if="$ctrl.state.orderBy === 'CronExpression' && !$ctrl.state.reverseOrder"></i> can-sort="true"
<i class="fa fa-sort-alpha-up" aria-hidden="true" ng-if="$ctrl.state.orderBy === 'CronExpression' && $ctrl.state.reverseOrder"></i> is-sorted="$ctrl.state.orderBy === 'CronExpression'"
</a> is-sorted-desc="$ctrl.state.orderBy === 'CronExpression' && $ctrl.state.reverseOrder"
ng-click="$ctrl.changeOrderBy('CronExpression')"
></table-column-header>
</th> </th>
<th> <th>
<a ng-click="$ctrl.changeOrderBy('Created')"> <table-column-header
Created col-title="'Created'"
<i class="fa fa-sort-alpha-down" aria-hidden="true" ng-if="$ctrl.state.orderBy === 'Created' && !$ctrl.state.reverseOrder"></i> can-sort="true"
<i class="fa fa-sort-alpha-up" aria-hidden="true" ng-if="$ctrl.state.orderBy === 'Created' && $ctrl.state.reverseOrder"></i> is-sorted="$ctrl.state.orderBy === 'Created'"
</a> is-sorted-desc="$ctrl.state.orderBy === 'Created' && $ctrl.state.reverseOrder"
ng-click="$ctrl.changeOrderBy('Created')"
></table-column-header>
</th> </th>
</tr> </tr>
</thead> </thead>
@ -76,7 +78,7 @@
<div class="paginationControls"> <div class="paginationControls">
<form class="form-inline"> <form class="form-inline">
<span class="limitSelector"> <span class="limitSelector">
<span style="margin-right: 5px"> Items per page </span> <span class="mr-1"> Items per page </span>
<select class="form-control" ng-model="$ctrl.state.paginatedItemLimit" ng-change="$ctrl.changePaginationLimit()" data-cy="component-paginationSelect"> <select class="form-control" ng-model="$ctrl.state.paginatedItemLimit" ng-change="$ctrl.changePaginationLimit()" data-cy="component-paginationSelect">
<option value="0">All</option> <option value="0">All</option>
<option value="10">10</option> <option value="10">10</option>

View File

@ -10,7 +10,7 @@
<div class="col-sm-12"> <div class="col-sm-12">
<edge-jobs-datatable <edge-jobs-datatable
title-text="Edge jobs" title-text="Edge jobs"
title-icon="fa-clock" title-icon="clock"
dataset="$ctrl.edgeJobs" dataset="$ctrl.edgeJobs"
table-key="edgeJobs" table-key="edgeJobs"
order-by="Name" order-by="Name"