portainer/app/kubernetes/views/volumes/edit/volume.html

190 lines
9.2 KiB
HTML

<page-header
ng-if="ctrl.state.viewReady"
title="'Volume details'"
breadcrumbs="[
{ label:'Namespaces', link:'kubernetes.resourcePools' },
{
label:ctrl.volume.ResourcePool.Namespace.Name,
link: 'kubernetes.resourcePools.resourcePool',
linkParams:{ id: ctrl.volume.ResourcePool.Namespace.Name }
},
{ label:'Volumes', link:'kubernetes.volumes' },
ctrl.volume.PersistentVolumeClaim.Name,
]"
reload="true"
>
</page-header>
<kubernetes-view-loading view-ready="ctrl.state.viewReady"></kubernetes-view-loading>
<div ng-if="ctrl.state.viewReady">
<div class="row">
<div class="col-sm-12">
<rd-widget>
<rd-widget-body classes="no-padding">
<uib-tabset active="ctrl.state.activeTab" justified="true" type="pills">
<uib-tab index="0" classes="btn-sm" select="ctrl.selectTab(0)">
<uib-tab-heading class="vertical-center" data-cy="k8sVolDetail-volTab">
<pr-icon icon="'database'" feather="true"></pr-icon>
Volume
</uib-tab-heading>
<div style="padding: 20px">
<table class="table">
<tbody>
<tr>
<td>Name</td>
<td data-cy="k8sVolDetail-volName">
{{ ctrl.volume.PersistentVolumeClaim.Name }}
<span class="label label-primary image-tag label-margins" ng-if="!ctrl.isSystemNamespace() && ctrl.isExternalVolume()">external</span>
<span class="label label-warning image-tag label-margins" ng-if="!ctrl.isSystemNamespace() && !ctrl.isUsed()">unused</span>
</td>
</tr>
<tr>
<td>Namespace</td>
<td>
<a ui-sref="kubernetes.resourcePools.resourcePool({ id: ctrl.volume.ResourcePool.Namespace.Name })" data-cy="k8sVolDetail-volNamespace">{{
ctrl.volume.ResourcePool.Namespace.Name
}}</a>
<span style="margin-left: 5px" class="label label-info image-tag" ng-if="ctrl.isSystemNamespace()">system</span>
</td>
</tr>
<tr>
<td>Storage</td>
<td data-cy="k8sVolDetail-volStorageClassname">{{ ctrl.volume.PersistentVolumeClaim.StorageClass.Name }}</td>
</tr>
<tr>
<td>Shared Access Policy</td>
<td data-cy="k8sVolDetail-volAccessPolicy"
>{{ ctrl.state.volumeSharedAccessPolicy }}
<portainer-tooltip ng-if="ctrl.state.volumeSharedAccessPolicyTooltip" message="ctrl.state.volumeSharedAccessPolicyTooltip"></portainer-tooltip
></td>
</tr>
<tr>
<td>Provisioner</td>
<td data-cy="k8sVolDetail-volProvisioner">{{
ctrl.volume.PersistentVolumeClaim.StorageClass.Provisioner ? ctrl.volume.PersistentVolumeClaim.StorageClass.Provisioner : '-'
}}</td>
</tr>
<tr>
<td>Creation date</td>
<td data-cy="k8sVolDetail-volCreatedAt">{{ ctrl.volume.PersistentVolumeClaim.CreationDate | getisodate }}</td>
</tr>
<tr>
<td>Size</td>
<td ng-if="!ctrl.state.increaseSize">
{{ ctrl.volume.PersistentVolumeClaim.Storage }}
<button
type="button"
class="btn btn-sm btn-primary"
ng-click="ctrl.state.increaseSize = true"
ng-if="ctrl.volume.PersistentVolumeClaim.StorageClass.AllowVolumeExpansion"
data-cy="k8sVolDetail-increaseSizeButton"
>Increase size</button
>
</td>
<td ng-if="ctrl.state.increaseSize">
<form name="kubernetesVolumeUpdateForm">
<div class="form-inline">
<div class="input-group input-group-sm">
<input
type="number"
class="form-control"
name="size"
ng-model="ctrl.state.volumeSize"
placeholder="20"
ng-min="0"
min="0"
ng-change="ctrl.onChangeSize()"
required
data-cy="k8sVolDetail-increaseSizeInput"
/>
<span class="input-group-addon" style="padding: 0">
<select
ng-model="ctrl.state.volumeSizeUnit"
ng-change="ctrl.onChangeSize()"
ng-options="unit for unit in ctrl.state.availableSizeUnits"
style="width: 100%; height: 100%"
data-cy="k8sVolDetail-increaseSizeUnits"
></select>
</span>
</div>
<button
type="button"
class="btn btn-sm btn-primary"
ng-disabled="!ctrl.sizeIsValid()"
ng-click="ctrl.updateVolume()"
data-cy="k8sVolDetail-updateSizeConfirm"
>
Update size
</button>
<button type="button" class="btn btn-sm btn-default" ng-click="ctrl.state.increaseSize = false" data-cy="k8sVolDetail-cancelUpdateSize">
Cancel
</button>
</div>
<div class="form-inline">
<div class="small text-warning" style="margin-top: 5px" ng-show="ctrl.state.errors.volumeSize || kubernetesVolumeUpdateForm.size.$invalid">
<div class="vertical-center" ng-messages="kubernetesVolumeUpdateForm.size.$error">
<p ng-message="required"><pr-icon icon="'alert-triangle'" feather="true" mode="'warning'"></pr-icon> This field is required.</p>
</div>
<p class="vertical-center" ng-show="ctrl.state.errors.volumeSize"
><pr-icon icon="'alert-triangle'" feather="true" mode="'warning'"></pr-icon> The new size must be greater than the actual size.</p
>
</div>
</div>
</form>
</td>
</tr>
</tbody>
</table>
</div>
</uib-tab>
<uib-tab index="1" classes="btn-sm" select="ctrl.selectTab(1)">
<uib-tab-heading class="vertical-center" data-cy="k8sVolDetail-volEventsTab">
<pr-icon icon="'file-text'" feather="true"></pr-icon> Events
<div ng-if="ctrl.hasEventWarnings()">
<pr-icon icon="'alert-triangle'" feather="true" mode="'warning'"></pr-icon>
{{ ctrl.state.eventWarningCount }} warning(s)
</div>
</uib-tab-heading>
<kubernetes-events-datatable
title-text="Events"
title-icon="file-text"
dataset="ctrl.events"
table-key="kubernetes.volume.events"
order-by="Date"
reverse-order="true"
loading="ctrl.state.eventsLoading"
refresh-callback="ctrl.getEvents"
>
</kubernetes-events-datatable>
</uib-tab>
<uib-tab index="2" ng-if="ctrl.volume.PersistentVolumeClaim.Yaml" select="ctrl.showEditor()" classes="btn-sm">
<uib-tab-heading class="vertical-center" data-cy="k8sVolDetail-volYamlTab"> <pr-icon icon="'code'" feather="true"></pr-icon> YAML </uib-tab-heading>
<div class="px-5" ng-if="ctrl.state.showEditorTab">
<kubernetes-yaml-inspector key="volume-yaml" data="ctrl.volume.PersistentVolumeClaim.Yaml"></kubernetes-yaml-inspector>
</div>
</uib-tab>
</uib-tabset>
</rd-widget-body>
</rd-widget>
</div>
</div>
<div class="row" ng-if="ctrl.isUsed(item)">
<div class="col-sm-12">
<kubernetes-integrated-applications-datatable
dataset="ctrl.volume.Applications"
table-key="kubernetes.volume.applications"
order-by="Name"
refresh-callback="ctrl.getVolume"
title-text="Applications using this volume"
title-icon="svg-laptopcode"
>
</kubernetes-integrated-applications-datatable>
</div>
</div>
</div>