Add tooltips for creating replication rule

Signed-off-by: FangyuanCheng <fangyuanc@vmware.com>
This commit is contained in:
FangyuanCheng 2019-04-23 00:32:59 +08:00
parent 6b9584a71f
commit 1d4a7d8127
7 changed files with 78 additions and 1 deletions

View File

@ -24,10 +24,22 @@
<div class="radio-inline" [class.disabled]="policyId >= 0">
<input type="radio" id="push_base" name="replicationMode" [value]=true [disabled]="policyId >= 0" [(ngModel)]="isPushMode" (change)="modeChange()" [ngModelOptions]="{standalone: true}">
<label for="push_base">Push-based</label>
<clr-tooltip class="mode-tooltip">
<clr-icon clrTooltipTrigger shape="info-circle" size="24"></clr-icon>
<clr-tooltip-content clrPosition="top-left" clrSize="md" *clrIfOpen>
<span>{{'TOOLTIP.PUSH_BASED' | translate}}</span>
</clr-tooltip-content>
</clr-tooltip>
</div>
<div class="radio-inline" [class.disabled]="policyId >= 0">
<input type="radio" id="pull_base" name="replicationMode" [value]=false [disabled]="policyId >= 0" [(ngModel)]="isPushMode" [ngModelOptions]="{standalone: true}">
<label for="pull_base">Pull-based</label>
<clr-tooltip class="mode-tooltip">
<clr-icon clrTooltipTrigger shape="info-circle" size="24"></clr-icon>
<clr-tooltip-content clrPosition="top-left" clrSize="md" *clrIfOpen>
<span>{{'TOOLTIP.PULL_BASED' | translate}}</span>
</clr-tooltip-content>
</clr-tooltip>
</div>
</div>
<!--source registry-->
@ -63,6 +75,14 @@
<option *ngFor="let value of supportedFilters[i]?.values;" value="{{value}}">{{value}}</option>
</select>
</div>
<clr-tooltip>
<clr-icon clrTooltipTrigger shape="info-circle" size="24"></clr-icon>
<clr-tooltip-content clrPosition="top-left" clrSize="md" *clrIfOpen>
<span class="tooltip-content" *ngIf="supportedFilters[i]?.type==='name'">{{'TOOLTIP.NAME_FILTER' | translate}}</span>
<span class="tooltip-content" *ngIf="supportedFilters[i]?.type==='tag'">{{'TOOLTIP.TAG_FILTER' | translate}}</span>
<span class="tooltip-content" *ngIf="supportedFilters[i]?.type==='resource'">{{'TOOLTIP.RESOURCE_FILTER' | translate}}</span>
</clr-tooltip-content>
</clr-tooltip>
</div>
</div>
</div>
@ -88,6 +108,12 @@
<input formControlName="dest_namespace" type="text" id="dest_namespace" pattern="^[a-z0-9]+(?:[._-][a-z0-9]+)*$" class="inputWidth"
maxlength="255">
</div>
<clr-tooltip>
<clr-icon clrTooltipTrigger shape="info-circle" size="24"></clr-icon>
<clr-tooltip-content clrPosition="top-left" clrSize="md" *clrIfOpen>
<span>{{'TOOLTIP.DESTINATION_NAMESPACE' | translate}}</span>
</clr-tooltip-content>
</clr-tooltip>
</div>
</div>
@ -127,11 +153,17 @@
<label for="enablePolicy" class="clr-control-label">{{'REPLICATION.ENABLED' | translate}}</label>
</clr-checkbox-wrapper>
</div>
<div class="clr-form-control rule-width">
<div class="clr-form-control rule-width override-box">
<clr-checkbox-wrapper>
<input type="checkbox" clrCheckbox [checked]="true" id="overridePolicy" formControlName="override" class="clr-checkbox">
<label for="overridePolicy" class="clr-control-label">{{'REPLICATION.OVERRIDE' | translate}}</label>
</clr-checkbox-wrapper>
<clr-tooltip class="override-tooltip">
<clr-icon clrTooltipTrigger shape="info-circle" size="24"></clr-icon>
<clr-tooltip-content clrPosition="top-right" clrSize="md" *clrIfOpen>
<span>{{'TOOLTIP.OVERRIDE' | translate}}</span>
</clr-tooltip-content>
</clr-tooltip>
</div>
</div>
<div class="loading-center">

View File

@ -246,3 +246,13 @@ clr-modal {
padding-left:3.8rem;
}
.mode-tooltip {
margin-left: 5px;
}
.override-box {
flex-direction: row;
.override-tooltip {
margin: 3px 0 0 5px;
}
}

View File

@ -53,6 +53,13 @@
"REPLICATE_FAILURE": "Started failed"
},
"TOOLTIP": {
"NAME_FILTER": "Filter the name part of the resources. Leaving empty or '**' matches all; 'library/**' only matches the resources under 'library'. For more patterns please refer to the user guide.",
"TAG_FILTER": "Filter the tag/version part of the resources. Leaving empty or '**' matches all; '1.0*' only matches the tags that starts with '1.0'. For more patterns please refer to the user guide.",
"RESOURCE_FILTER": "Filter the type of the resources.",
"PUSH_BASED": "Push the resources from the current Harbor to the remote registry.",
"PULL_BASED": "Pull the resources from the remote registry to the current Harbor.",
"DESTINATION_NAMESPACE": "Specify the destination namespaces. The resources will be put under the same namespace with the source if it is empty.",
"OVERRIDE": "Specify whether override the resources if the same name resources found on the destination registry.",
"EMAIL": "Email should be a valid email address like name@example.com.",
"USER_NAME": "Cannot contain special characters and maximum length should be 255 characters.",
"FULL_NAME": "Maximum length should be 20 characters.",

View File

@ -53,6 +53,13 @@
"REPLICATE_FAILURE": "Started failed"
},
"TOOLTIP": {
"NAME_FILTER": "Filter the name part of the resources. Leaving empty or '**' matches all; 'library/**' only matches the resources under 'library'. For more patterns please refer to the user guide.",
"TAG_FILTER": "Filter the tag/version part of the resources. Leaving empty or '**' matches all; '1.0*' only matches the tags that starts with '1.0'. For more patterns please refer to the user guide.",
"RESOURCE_FILTER": "Filter the type of the resources.",
"PUSH_BASED": "Push the resources from the current Harbor to the remote registry.",
"PULL_BASED": "Pull the resources from the remote registry to the current Harbor.",
"DESTINATION_NAMESPACE": "Specify the destination namespaces. The resources will be put under the same namespace with the source if it is empty.",
"OVERRIDE": "Specify whether override the resources if the same name resources found on the destination registry.",
"EMAIL": "El email debe ser una dirección válida como nombre@ejemplo.com.",
"USER_NAME": "Debe tener una longitud máxima de 255 caracteres y no puede contener caracteres especiales.",
"FULL_NAME": "La longitud máxima debería ser de 20 caracteres.",

View File

@ -42,6 +42,13 @@
"NO_FILE": "No file selected"
},
"TOOLTIP": {
"NAME_FILTER": "Filter the name part of the resources. Leaving empty or '**' matches all; 'library/**' only matches the resources under 'library'. For more patterns please refer to the user guide.",
"TAG_FILTER": "Filter the tag/version part of the resources. Leaving empty or '**' matches all; '1.0*' only matches the tags that starts with '1.0'. For more patterns please refer to the user guide.",
"RESOURCE_FILTER": "Filter the type of the resources.",
"PUSH_BASED": "Push the resources from the current Harbor to the remote registry.",
"PULL_BASED": "Pull the resources from the remote registry to the current Harbor.",
"DESTINATION_NAMESPACE": "Specify the destination namespaces. The resources will be put under the same namespace with the source if it is empty.",
"OVERRIDE": "Specify whether override the resources if the same name resources found on the destination registry.",
"EMAIL": "L'email doit être une adresse email valide comme name@example.com.",
"USER_NAME": "Ne peut pas contenir de caractères spéciaux et la longueur maximale doit être de 255 caractères.",
"FULL_NAME": "La longueur maximale doit être de 20 caractères.",

View File

@ -53,6 +53,13 @@
"REPLICATE_FAILURE": "Falha ao iniciar"
},
"TOOLTIP": {
"NAME_FILTER": "Filter the name part of the resources. Leaving empty or '**' matches all; 'library/**' only matches the resources under 'library'. For more patterns please refer to the user guide.",
"TAG_FILTER": "Filter the tag/version part of the resources. Leaving empty or '**' matches all; '1.0*' only matches the tags that starts with '1.0'. For more patterns please refer to the user guide.",
"RESOURCE_FILTER": "Filter the type of the resources.",
"PUSH_BASED": "Push the resources from the current Harbor to the remote registry.",
"PULL_BASED": "Pull the resources from the remote registry to the current Harbor.",
"DESTINATION_NAMESPACE": "Specify the destination namespaces. The resources will be put under the same namespace with the source if it is empty.",
"OVERRIDE": "Specify whether override the resources if the same name resources found on the destination registry.",
"EMAIL": "Email deve ser um endereço de email válido como nome@exemplo.com.",
"USER_NAME": "Não pode conter caracteres especiais e o tamanho máximo deve ser de 255 caracteres.",
"FULL_NAME": "Tamanho máximo deve ser de 20 caracteres.",

View File

@ -53,6 +53,13 @@
"REPLICATE_FAILURE": "开始失败"
},
"TOOLTIP": {
"NAME_FILTER": "过滤资源的名字。不填或者“”匹配所有资源“library/”只匹配“library”下的资源。更多的匹配模式请参考用户手册。",
"TAG_FILTER": "过滤资源的tag/version。不填或者“”匹配所有“1.0*”只匹配以“1.0”开头的tag/version。",
"RESOURCE_FILTER": "过滤资源的类型。",
"PUSH_BASED": "把资源由当前Harbor推送到远端仓库。",
"PULL_BASED": "把资源由远端仓库拉取到当前Harbor。",
"DESTINATION_NAMESPACE": "指定目的端名称空间。如果不填,资源会被放到和源相同的名称空间下。",
"OVERRIDE": "指定如果目的端仓库中已有同名的资源是否覆盖。",
"EMAIL": "请使用正确的邮箱地址比如name@example.com。",
"USER_NAME": "不能包含特殊字符且长度不能超过255。",
"FULL_NAME": "长度不能超过20。",