mirror of https://github.com/portainer/portainer
feat(ui): renovate the docker images edit page EE-3505 (#7375)
andres-portainer
GitHub
parent
d28030abea
commit
441e265c32
|
|
@ -9,18 +9,26 @@
|
|||
<div class="form-group">
|
||||
<div class="row">
|
||||
<div class="pull-left" ng-repeat="tag in image.RepoTags" style="display: table">
|
||||
<div class="input-group col-md-1" style="padding: 0 15px">
|
||||
<span class="input-group-addon">{{ tag }}</span>
|
||||
<span class="input-group-btn" authorization="DockerImagePush, DockerImageCreate, DockerImageDelete">
|
||||
<a data-toggle="tooltip" class="btn btn-primary interactive" title="Push to registry" ng-click="pushTag(tag)" authorization="DockerImagePush">
|
||||
<span class="fa fa-upload white-icon" aria-hidden="true"></span>
|
||||
</a>
|
||||
<a data-toggle="tooltip" class="btn btn-primary interactive" title="Pull from registry" ng-click="pullTag(tag)" authorization="DockerImageCreate">
|
||||
<span class="fa fa-download white-icon" aria-hidden="true"></span>
|
||||
</a>
|
||||
<a data-toggle="tooltip" class="btn btn-primary interactive" title="Remove tag" ng-click="removeTag(tag)" authorization="DockerImageDelete">
|
||||
<span class="fa fa-trash-alt white-icon" aria-hidden="true"></span>
|
||||
</a>
|
||||
<div class="input-group col-md-1 !pr-3.5 !pl-3.5">
|
||||
<span class="input-group-addon" style="border-right: 1px solid var(--border-input-group-addon-color); border-radius: 4px">{{ tag }}</span>
|
||||
<span class="input-group-btn" style="padding: 0px 5px">
|
||||
<span style="margin: 0px 5px" authorization="DockerImagePush">
|
||||
<a data-toggle="tooltip" class="btn btn-primary interactive" title="Push to registry" ng-click="pushTag(tag)">
|
||||
<pr-icon icon="'upload'" feather="true" class="text-white"></pr-icon>
|
||||
</a>
|
||||
</span>
|
||||
|
||||
<span class="my-0 mx-1" authorization="DockerImageCreate">
|
||||
<a data-toggle="tooltip" class="btn btn-primary interactive" title="Pull from registry" ng-click="pullTag(tag)">
|
||||
<pr-icon icon="'download'" feather="true" class="text-white"></pr-icon>
|
||||
</a>
|
||||
</span>
|
||||
|
||||
<span class="my-0 mx-1" authorization="DockerImageDelete">
|
||||
<a data-toggle="tooltip" class="btn btn-primary interactive" title="Remove tag" ng-click="removeTag(tag)">
|
||||
<pr-icon icon="'trash-2'" feather="true" class="text-white"></pr-icon>
|
||||
</a>
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -28,20 +36,19 @@
|
|||
</div>
|
||||
<div class="form-group">
|
||||
<div class="col-sm-12">
|
||||
<span class="small text-muted">
|
||||
Note: you can click on the upload icon <span class="fa fa-upload" aria-hidden="true"></span> to push an image or on the download icon
|
||||
<span class="fa fa-download" aria-hidden="true"></span> to pull an image or on the trash icon <span class="fa fa-trash-alt" aria-hidden="true"></span> to delete a
|
||||
tag.
|
||||
<span class="small text-muted" authorization="DockerImageDelete">
|
||||
Note: you can click on the upload icon <pr-icon icon="'upload'" feather="true"></pr-icon> to push an image or on the download icon
|
||||
<pr-icon icon="'download'" feather="true"></pr-icon> to pull an image or on the trash icon <pr-icon icon="'trash-2'" feather="true"></pr-icon> to delete a tag.
|
||||
</span>
|
||||
</div>
|
||||
<div class="col-sm-12">
|
||||
<span id="downloadResourceHint" class="createResource" style="display: none; margin-left: 0">
|
||||
<span id="downloadResourceHint" class="createResource ml-0" style="display: none">
|
||||
Download in progress...
|
||||
<i class="fa fa-circle-notch fa-spin" aria-hidden="true" style="margin-left: 2px"></i>
|
||||
<i class="fa fa-circle-notch fa-spin ml-0.5" aria-hidden="true"></i>
|
||||
</span>
|
||||
<span id="uploadResourceHint" class="createResource" style="display: none; margin-left: 0">
|
||||
<span id="uploadResourceHint" class="createResource ml-0.5" style="display: none">
|
||||
Upload in progress...
|
||||
<i class="fa fa-circle-notch fa-spin" aria-hidden="true" style="margin-left: 2px"></i>
|
||||
<i class="fa fa-circle-notch fa-spin ml-0.5" aria-hidden="true"></i>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -97,9 +104,9 @@
|
|||
<td>ID</td>
|
||||
<td>
|
||||
{{ image.Id }}
|
||||
<button authorization="DockerImageDelete" class="btn btn-xs btn-danger" ng-click="removeImage(image.Id)"
|
||||
><i class="fa fa-trash-alt space-right" aria-hidden="true"></i>Delete this image</button
|
||||
>
|
||||
<button authorization="DockerImageDelete" class="btn btn-xs btn-danger" ng-click="removeImage(image.Id)">
|
||||
<pr-icon icon="'trash-2'" feather="true"></pr-icon> Delete this image
|
||||
</button>
|
||||
<button
|
||||
authorization="DockerImageGet"
|
||||
class="btn btn-xs btn-primary"
|
||||
|
|
@ -107,7 +114,7 @@
|
|||
button-spinner="$ctrl.exportInProgress"
|
||||
ng-disabled="state.exportInProgress"
|
||||
>
|
||||
<i class="fa fa-download space-right" aria-hidden="true"></i>
|
||||
<pr-icon icon="'download'" feather="true"></pr-icon>
|
||||
<span ng-hide="state.exportInProgress">Export this image</span>
|
||||
<span ng-show="state.exportInProgress">Export in progress...</span>
|
||||
</button>
|
||||
|
|
@ -212,34 +219,40 @@
|
|||
<rd-widget-body classes="no-padding">
|
||||
<table id="image-layers" class="table">
|
||||
<thead>
|
||||
<th style="white-space: nowrap">
|
||||
<a ng-click="order('Order')">
|
||||
Order
|
||||
<span ng-show="sortType == 'Order' && !sortReverse" class="glyphicon glyphicon-chevron-down"></span>
|
||||
<span ng-show="sortType == 'Order' && sortReverse" class="glyphicon glyphicon-chevron-up"></span>
|
||||
</a>
|
||||
<th class="whitespace-nowrap">
|
||||
<table-column-header
|
||||
col-title="'Order'"
|
||||
can-sort="true"
|
||||
is-sorted="$ctrl.state.orderBy === 'Order'"
|
||||
is-sorted-desc="$ctrl.state.orderBy === 'Order' && $ctrl.state.reverseOrder"
|
||||
ng-click="$ctrl.changeOrderBy('Order')"
|
||||
></table-column-header>
|
||||
</th>
|
||||
<th>
|
||||
<a ng-click="order('Size')">
|
||||
Size
|
||||
<span ng-show="sortType == 'Size' && !sortReverse" class="glyphicon glyphicon-chevron-down"></span>
|
||||
<span ng-show="sortType == 'Size' && sortReverse" class="glyphicon glyphicon-chevron-up"></span>
|
||||
</a>
|
||||
<table-column-header
|
||||
col-title="'Size'"
|
||||
can-sort="true"
|
||||
is-sorted="$ctrl.state.orderBy === 'Size'"
|
||||
is-sorted-desc="$ctrl.state.orderBy === 'Size' && $ctrl.state.reverseOrder"
|
||||
ng-click="$ctrl.changeOrderBy('Size')"
|
||||
></table-column-header>
|
||||
</th>
|
||||
<th>
|
||||
<a ng-click="order('CreatedBy')">
|
||||
Layer
|
||||
<span ng-show="sortType == 'CreatedBy' && !sortReverse" class="glyphicon glyphicon-chevron-down"></span>
|
||||
<span ng-show="sortType == 'CreatedBy' && sortReverse" class="glyphicon glyphicon-chevron-up"></span>
|
||||
</a>
|
||||
<table-column-header
|
||||
col-title="'Layer'"
|
||||
can-sort="true"
|
||||
is-sorted="$ctrl.state.orderBy === 'Layer'"
|
||||
is-sorted-desc="$ctrl.state.orderBy === 'Layer' && $ctrl.state.reverseOrder"
|
||||
ng-click="$ctrl.changeOrderBy('Layer')"
|
||||
></table-column-header>
|
||||
</th>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr ng-repeat="layer in history | orderBy:sortType:sortReverse">
|
||||
<td style="white-space: nowrap">
|
||||
<td class="whitespace-nowrap">
|
||||
{{ layer.Order }}
|
||||
</td>
|
||||
<td style="white-space: nowrap">
|
||||
<td class="whitespace-nowrap">
|
||||
{{ layer.Size | humansize }}
|
||||
</td>
|
||||
<td class="expand">
|
||||
|
|
@ -249,7 +262,7 @@
|
|||
</span>
|
||||
<span id="layer-command-{{ $index }}-short">
|
||||
{{ layer.CreatedBy | imagelayercommand | truncate: 130 }}
|
||||
<span ng-if="layer.CreatedBy.length > 130" style="margin-left: 5px">
|
||||
<span ng-if="layer.CreatedBy.length > 130" class="ml-1">
|
||||
<a id="layer-command-expander{{ $index }}" class="btn" ng-click="toggleLayerCommand($index)">
|
||||
<pr-icon icon="'plus'" mode="'alt'" feather="true"></pr-icon>
|
||||
</a>
|
||||
|
|
|
|||
Loading…
Reference in New Issue