feat(ui): renovate the edge jobs create page EE-3530 (#7188)
matias-portainer
GitHub
parent
bff9bb7800
commit
0580d3833a
|
|
@ -1,9 +1,9 @@
|
|||
<form class="form-horizontal" name="edgeJobForm">
|
||||
<form class="form-horizontal -mt-4" name="edgeJobForm">
|
||||
<div class="col-sm-12 form-section-title"> Edge job configuration </div>
|
||||
<!-- name-input -->
|
||||
<div class="form-group">
|
||||
<label for="edgejob_name" class="col-sm-1 control-label text-left">Name</label>
|
||||
<div class="col-sm-11">
|
||||
<div class="form-group mt-4">
|
||||
<label for="edgejob_name" class="col-sm-2 control-label text-left required">Name </label>
|
||||
<div class="col-sm-10">
|
||||
<input
|
||||
type="text"
|
||||
class="form-control"
|
||||
|
|
@ -11,7 +11,7 @@
|
|||
ng-pattern="/^[a-zA-Z0-9][a-zA-Z0-9_.-]+$/"
|
||||
id="edgejob_name"
|
||||
name="edgejob_name"
|
||||
placeholder="backup-app-prod"
|
||||
placeholder="e.g. backup-app-prod"
|
||||
required
|
||||
auto-focus
|
||||
/>
|
||||
|
|
@ -20,8 +20,12 @@
|
|||
<div class="form-group" ng-show="edgeJobForm.edgejob_name.$invalid">
|
||||
<div class="col-sm-12 small text-warning">
|
||||
<div ng-messages="edgeJobForm.edgejob_name.$error">
|
||||
<p ng-message="required"><i class="fa fa-exclamation-triangle" aria-hidden="true"></i> This field is required.</p>
|
||||
<p ng-message="pattern"><i class="fa fa-exclamation-triangle" aria-hidden="true"></i> Allowed characters are: [a-zA-Z0-9_.-]</p>
|
||||
<p ng-message="required" class="vertical-center">
|
||||
<span><pr-icon icon="'alert-triangle'" class-name="'icon-sm icon-warning'" feather="true"></pr-icon></span> This field is required.
|
||||
</p>
|
||||
<p ng-message="pattern" class="vertical-center">
|
||||
<span><pr-icon icon="'alert-triangle'" class-name="'icon-sm icon-warning'" feather="true"></pr-icon></span> Allowed characters are: [a-zA-Z0-9_.-]
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -30,12 +34,12 @@
|
|||
<!-- edge-job-method-select -->
|
||||
<div class="col-sm-12 form-section-title"> Edge job configuration </div>
|
||||
<div class="form-group"></div>
|
||||
<div class="form-group" style="margin-bottom: 0">
|
||||
<div class="boxselector_wrapper">
|
||||
<div class="form-group px-4">
|
||||
<div class="boxselector_wrapper !mt-0">
|
||||
<div>
|
||||
<input type="radio" id="config_basic" ng-model="$ctrl.formValues.cronMethod" value="basic" />
|
||||
<label for="config_basic">
|
||||
<div class="boxselector_header">
|
||||
<div class="boxselector_header vertical-center">
|
||||
<pr-icon icon="'calendar'" feather="true"></pr-icon>
|
||||
Basic configuration
|
||||
</div>
|
||||
|
|
@ -45,7 +49,7 @@
|
|||
<div>
|
||||
<input type="radio" id="config_advanced" ng-model="$ctrl.formValues.cronMethod" value="advanced" />
|
||||
<label for="config_advanced">
|
||||
<div class="boxselector_header">
|
||||
<div class="boxselector_header vertical-center">
|
||||
<pr-icon icon="'edit'" feather="true"></pr-icon>
|
||||
Advanced configuration
|
||||
</div>
|
||||
|
|
@ -60,7 +64,7 @@
|
|||
<div class="form-group">
|
||||
<label for="recurring" class="col-sm-2 control-label text-left">Recurring Edge job</label>
|
||||
<div class="col-sm-10">
|
||||
<label class="switch" style="margin-left: 20px"> <input type="checkbox" name="recurring" ng-model="$ctrl.model.Recurring" /><i></i> </label>
|
||||
<label class="switch"><input type="checkbox" name="recurring" ng-model="$ctrl.model.Recurring" /><span class="slider round"></span></label>
|
||||
</div>
|
||||
</div>
|
||||
<!-- not-recurring -->
|
||||
|
|
@ -70,11 +74,13 @@
|
|||
<div class="col-sm-10">
|
||||
<input class="form-control" moment-picker ng-model="$ctrl.formValues.datetime" format="YYYY-MM-DD HH:mm" />
|
||||
</div>
|
||||
<div class="col-sm-12 small text-muted" style="margin-top: 10px"> Time should be set according to the chosen environments' timezone. </div>
|
||||
<div class="col-sm-12 small text-muted mt-2.5"> Time should be set according to the chosen environments' timezone. </div>
|
||||
<div ng-show="edgeJobForm.datepicker.$invalid">
|
||||
<div class="col-sm-12 small text-warning">
|
||||
<div ng-messages="edgeJobForm.datepicker.$error">
|
||||
<p ng-message="required"><i class="fa fa-exclamation-triangle" aria-hidden="true"></i> This field is required.</p>
|
||||
<p ng-message="required" class="vertical-center">
|
||||
<span><pr-icon icon="'alert-triangle'" class-name="'icon-sm icon-warning'" feather="true"></pr-icon></span> This field is required.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -98,7 +104,9 @@
|
|||
<div ng-show="edgeJobForm.edgejob_value.$invalid">
|
||||
<div class="col-sm-12 small text-warning">
|
||||
<div ng-messages="edgeJobForm.edgejob_value.$error">
|
||||
<p ng-message="required"><i class="fa fa-exclamation-triangle" aria-hidden="true"></i> This field is required.</p>
|
||||
<p ng-message="required" class="vertical-center">
|
||||
<span><pr-icon icon="'alert-triangle'" class-name="'icon-sm icon-warning'" feather="true"></pr-icon></span> This field is required.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -118,18 +126,22 @@
|
|||
ng-model="$ctrl.model.CronExpression"
|
||||
id="edgejob_cron"
|
||||
name="edgejob_cron"
|
||||
placeholder="0 2 * * *"
|
||||
placeholder="e.g. 0 2 * * *"
|
||||
required
|
||||
ng-pattern="$ctrl.cronRegex"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-sm-12 small text-muted" style="margin-top: 10px"> Time should be set according to the chosen environments' timezone. </div>
|
||||
<div class="col-sm-12 small text-muted mt-2.5"> Time should be set according to the chosen environments' timezone. </div>
|
||||
</div>
|
||||
<div class="form-group" ng-show="edgeJobForm.edgejob_cron.$invalid && edgeJobForm.edgejob_cron.$dirty">
|
||||
<div class="col-sm-12 small text-warning">
|
||||
<div ng-messages="edgeJobForm.edgejob_cron.$error">
|
||||
<p ng-message="required"><i class="fa fa-exclamation-triangle" aria-hidden="true"></i> This field is required.</p>
|
||||
<p ng-message="pattern"><i class="fa fa-exclamation-triangle" aria-hidden="true"></i> This field format is invalid.</p>
|
||||
<p ng-message="required" class="vertical-center">
|
||||
<span><pr-icon icon="'alert-triangle'" class-name="'icon-sm icon-warning'" feather="true"></pr-icon></span> This field is required.
|
||||
</p>
|
||||
<p ng-message="pattern" class="vertical-center">
|
||||
<span><pr-icon icon="'alert-triangle'" class-name="'icon-sm icon-warning'" feather="true"></pr-icon></span> This field format is invalid.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -140,12 +152,12 @@
|
|||
<div ng-if="!$ctrl.model.Id">
|
||||
<div class="col-sm-12 form-section-title"> Job content </div>
|
||||
<div class="form-group"></div>
|
||||
<div class="form-group" style="margin-bottom: 0">
|
||||
<div class="boxselector_wrapper">
|
||||
<div class="form-group px-4">
|
||||
<div class="boxselector_wrapper !mt-0">
|
||||
<div>
|
||||
<input type="radio" id="method_editor" ng-model="$ctrl.formValues.method" value="editor" />
|
||||
<label for="method_editor">
|
||||
<div class="boxselector_header">
|
||||
<div class="boxselector_header vertical-center">
|
||||
<pr-icon icon="'edit'" feather="true"></pr-icon>
|
||||
Web editor
|
||||
</div>
|
||||
|
|
@ -155,8 +167,8 @@
|
|||
<div>
|
||||
<input type="radio" id="method_upload" ng-model="$ctrl.formValues.method" value="upload" />
|
||||
<label for="method_upload">
|
||||
<div class="boxselector_header">
|
||||
<i class="fa fa-upload" aria-hidden="true" style="margin-right: 2px"></i>
|
||||
<div class="boxselector_header vertical-center">
|
||||
<pr-icon icon="'upload'" feather="true"></pr-icon>
|
||||
Upload
|
||||
</div>
|
||||
<p>Upload from your computer</p>
|
||||
|
|
@ -190,9 +202,9 @@
|
|||
<div class="form-group">
|
||||
<div class="col-sm-12">
|
||||
<button type="button" class="btn btn-sm btn-primary" ngf-select ng-model="$ctrl.model.File">Select file</button>
|
||||
<span style="margin-left: 5px">
|
||||
<span class="space-left">
|
||||
{{ $ctrl.model.File.name }}
|
||||
<i class="fa fa-times red-icon" ng-if="!$ctrl.model.File" aria-hidden="true"></i>
|
||||
<span ng-if="!$ctrl.model.File"><pr-icon icon="'x'" class-name="'icon icon-danger'" feather="true"></pr-icon></span>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -227,7 +239,7 @@
|
|||
<span ng-hide="$ctrl.actionInProgress">{{ $ctrl.formActionLabel }}</span>
|
||||
<span ng-show="$ctrl.actionInProgress">In progress...</span>
|
||||
</button>
|
||||
<span class="text-danger" ng-if="$ctrl.state.formValidationError" style="margin-left: 5px">
|
||||
<span class="text-danger space-left" ng-if="$ctrl.state.formValidationError">
|
||||
{{ $ctrl.state.formValidationError }}
|
||||
</span>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<div class="datatable">
|
||||
<table class="table table-hover" data-cy="{{ $ctrl.cyValue }}">
|
||||
<div class="col-sm-12">
|
||||
<span><pr-icon icon="'search'" feather="true" class-name="'searchIcon'"></pr-icon></span>
|
||||
<div class="col-sm-12 vertical-center">
|
||||
<pr-icon icon="'search'" feather="true" class-name="'searchIcon'"></pr-icon>
|
||||
<input
|
||||
type="text"
|
||||
class="searchInput"
|
||||
|
|
@ -67,7 +67,7 @@
|
|||
<div class="paginationControls">
|
||||
<form class="form-inline">
|
||||
<span class="limitSelector">
|
||||
<span style="margin-right: 5px"> Items per page </span>
|
||||
<span class="mr-1"> Items per page </span>
|
||||
<select ng-model="$ctrl.paginationState.limit" ng-change="$ctrl.onPaginationLimitChanged()">
|
||||
<option value="10">10</option>
|
||||
<option value="25">25</option>
|
||||
|
|
|
|||
Loading…
Reference in New Issue