mirror of
https://github.com/goharbor/harbor.git
synced 2024-10-04 16:27:34 +02:00
ui change:gcr/ecr driver for replication
Change-Id: I52aa3a35da898d2501b09ff90b5a65169a6d54ed Signed-off-by: Ziming Zhang <zziming@vmware.com>
This commit is contained in:
parent
f1becf8100
commit
b9dbe429be
@ -44,11 +44,15 @@
|
|||||||
<div class="form-group">
|
<div class="form-group">
|
||||||
<label for="destination_url" class="col-md-4 form-group-label-override required">{{ 'DESTINATION.URL' |
|
<label for="destination_url" class="col-md-4 form-group-label-override required">{{ 'DESTINATION.URL' |
|
||||||
translate }}</label>
|
translate }}</label>
|
||||||
<label class="col-md-8" for="destination_url" aria-haspopup="true" role="tooltip" [class.invalid]="targetEndpoint.errors && (targetEndpoint.dirty || targetEndpoint.touched)"
|
<label class="col-md-8" for="destination_url" aria-haspopup="true" role="tooltip" [class.invalid]="targetEndpoint?.errors && (targetEndpoint?.dirty || targetEndpoint?.touched)"
|
||||||
[class.valid]="targetEndpoint.valid" class="tooltip tooltip-validation tooltip-sm tooltip-bottom-left">
|
[class.valid]="targetEndpoint?.valid" class="tooltip tooltip-validation tooltip-sm tooltip-bottom-left">
|
||||||
<input type="text" id="destination_url" [disabled]="testOngoing || urlDisabled" [readonly]="!editable" [(ngModel)]="target.url"
|
<input *ngIf="!endpointList.length" type="text" id="destination_url" [disabled]="testOngoing || urlDisabled" [readonly]="!editable" [(ngModel)]="target.url"
|
||||||
size="25" name="endpointUrl" #targetEndpoint="ngModel" required placeholder="http(s)://192.168.1.1">
|
size="25" name="endpointUrl" #targetEndpoint="ngModel" required placeholder="http(s)://192.168.1.1">
|
||||||
<span class="tooltip-content" *ngIf="targetEndpoint.errors && targetEndpoint.errors.required && (targetEndpoint.dirty || targetEndpoint.touched)">
|
<select *ngIf="endpointList.length" [(ngModel)]="target.url" name="endpointUrl" #targetEndpoint="ngModel">
|
||||||
|
<option class="display-none" value=""></option>
|
||||||
|
<option *ngFor="let endpoint of endpointList" value="{{endpoint.value}}">{{endpoint.key}}</option>
|
||||||
|
</select>
|
||||||
|
<span class="tooltip-content" *ngIf="targetEndpoint?.errors && targetEndpoint.errors.required && (targetEndpoint.dirty || targetEndpoint.touched)">
|
||||||
{{ 'DESTINATION.URL_IS_REQUIRED' | translate }}
|
{{ 'DESTINATION.URL_IS_REQUIRED' | translate }}
|
||||||
</span>
|
</span>
|
||||||
</label>
|
</label>
|
||||||
@ -57,15 +61,19 @@
|
|||||||
<div class="form-group">
|
<div class="form-group">
|
||||||
<label for="destination_access_key" class="col-md-4 form-group-label-override">{{ 'DESTINATION.ACCESS_ID' |
|
<label for="destination_access_key" class="col-md-4 form-group-label-override">{{ 'DESTINATION.ACCESS_ID' |
|
||||||
translate }}</label>
|
translate }}</label>
|
||||||
<input type="text" placeholder="Access ID" class="col-md-8" id="destination_access_key" [disabled]="testOngoing" [readonly]="!editable"
|
<input type="text" placeholder="Access ID" class="col-md-8" id="destination_access_key" [disabled]="testOngoing" [readonly]="target.type ==='google-gcr' || !editable"
|
||||||
[(ngModel)]="target.credential.access_key" size="28" name="access_key" #access_key="ngModel">
|
[(ngModel)]="target.credential.access_key" size="28" name="access_key" #access_key="ngModel">
|
||||||
</div>
|
</div>
|
||||||
<!-- access_secret -->
|
<!-- access_secret -->
|
||||||
<div class="form-group">
|
<div class="form-group">
|
||||||
<label for="destination_password" class="col-md-4 form-group-label-override">{{ 'DESTINATION.ACCESS_SECRET' |
|
<label for="destination_password" class="col-md-4 form-group-label-override">{{ 'DESTINATION.ACCESS_SECRET' |
|
||||||
translate }}</label>
|
translate }}</label>
|
||||||
<input type="password" placeholder="Access Secret" class="col-md-8" id="destination_password" [disabled]="testOngoing" [readonly]="!editable"
|
<input *ngIf="target.type !=='google-gcr';else gcr_secret" type="password" placeholder="Access Secret" class="col-md-8" id="destination_password" [disabled]="testOngoing" [readonly]="!editable"
|
||||||
[(ngModel)]="target.credential.access_secret" size="28" name="access_secret" #access_secret="ngModel">
|
[(ngModel)]="target.credential.access_secret" size="28" name="access_secret" #access_secret="ngModel">
|
||||||
|
<ng-template #gcr_secret>
|
||||||
|
<textarea type="text" row="3" placeholder="Json Secret" class="inputWidth" id="destination_password" [disabled]="testOngoing" [readonly]="!editable"
|
||||||
|
[(ngModel)]="target.credential.access_secret" name="access_secret" #access_secret="ngModel"></textarea>
|
||||||
|
</ng-template>
|
||||||
</div>
|
</div>
|
||||||
<!-- Verify Remote Cert -->
|
<!-- Verify Remote Cert -->
|
||||||
<div class="form-group">
|
<div class="form-group">
|
||||||
@ -88,7 +96,7 @@
|
|||||||
</form>
|
</form>
|
||||||
</div>
|
</div>
|
||||||
<div class="modal-footer">
|
<div class="modal-footer">
|
||||||
<button type="button" class="btn btn-outline" (click)="testConnection()" [disabled]="inProgress || targetEndpoint.errors">{{
|
<button type="button" class="btn btn-outline" (click)="testConnection()" [disabled]="inProgress || (targetEndpoint?.errors)">{{
|
||||||
'DESTINATION.TEST_CONNECTION' | translate }}</button>
|
'DESTINATION.TEST_CONNECTION' | translate }}</button>
|
||||||
<button type="button" class="btn btn-outline" (click)="onCancel()" [disabled]="inProgress">{{ 'BUTTON.CANCEL' |
|
<button type="button" class="btn btn-outline" (click)="onCancel()" [disabled]="inProgress">{{ 'BUTTON.CANCEL' |
|
||||||
translate }}</button>
|
translate }}</button>
|
||||||
|
@ -15,3 +15,6 @@
|
|||||||
.inputWidth {
|
.inputWidth {
|
||||||
width: 216px;
|
width: 216px;
|
||||||
}
|
}
|
||||||
|
.display-none {
|
||||||
|
display: none
|
||||||
|
}
|
||||||
|
@ -32,6 +32,7 @@ import { Endpoint, PingEndpoint } from "../service/interface";
|
|||||||
import { clone, compareValue, isEmptyObject } from "../utils";
|
import { clone, compareValue, isEmptyObject } from "../utils";
|
||||||
|
|
||||||
const FAKE_PASSWORD = "rjGcfuRu";
|
const FAKE_PASSWORD = "rjGcfuRu";
|
||||||
|
const FAKE_JSON_KEY = "No Change";
|
||||||
const DOCKERHUB_URL = "https://hub.docker.com";
|
const DOCKERHUB_URL = "https://hub.docker.com";
|
||||||
@Component({
|
@Component({
|
||||||
selector: "hbr-create-edit-endpoint",
|
selector: "hbr-create-edit-endpoint",
|
||||||
@ -49,12 +50,13 @@ export class CreateEditEndpointComponent
|
|||||||
closable: boolean = false;
|
closable: boolean = false;
|
||||||
editable: boolean;
|
editable: boolean;
|
||||||
adapterList: string[];
|
adapterList: string[];
|
||||||
|
endpointList: object[] = [];
|
||||||
target: Endpoint = this.initEndpoint();
|
target: Endpoint = this.initEndpoint();
|
||||||
selectedType: string;
|
selectedType: string;
|
||||||
initVal: Endpoint;
|
initVal: Endpoint;
|
||||||
targetForm: NgForm;
|
targetForm: NgForm;
|
||||||
@ViewChild("targetForm") currentForm: NgForm;
|
@ViewChild("targetForm") currentForm: NgForm;
|
||||||
|
targetEndpoint;
|
||||||
testOngoing: boolean;
|
testOngoing: boolean;
|
||||||
onGoing: boolean;
|
onGoing: boolean;
|
||||||
endpointId: number | string;
|
endpointId: number | string;
|
||||||
@ -188,8 +190,8 @@ export class CreateEditEndpointComponent
|
|||||||
this.urlDisabled = this.target.type === 'docker-hub' ? true : false;
|
this.urlDisabled = this.target.type === 'docker-hub' ? true : false;
|
||||||
// Keep data cache
|
// Keep data cache
|
||||||
this.initVal = clone(target);
|
this.initVal = clone(target);
|
||||||
this.initVal.credential.access_secret = FAKE_PASSWORD;
|
this.initVal.credential.access_secret = this.target.type === 'google-gcr' ? FAKE_JSON_KEY : FAKE_PASSWORD;
|
||||||
this.target.credential.access_secret = FAKE_PASSWORD;
|
this.target.credential.access_secret = this.target.type === 'google-gcr' ? FAKE_JSON_KEY : FAKE_PASSWORD;
|
||||||
|
|
||||||
// Open the modal now
|
// Open the modal now
|
||||||
this.open();
|
this.open();
|
||||||
@ -219,6 +221,104 @@ export class CreateEditEndpointComponent
|
|||||||
this.urlDisabled = false;
|
this.urlDisabled = false;
|
||||||
this.targetForm.controls.endpointUrl.setValue("");
|
this.targetForm.controls.endpointUrl.setValue("");
|
||||||
}
|
}
|
||||||
|
if (selectValue === 'google-gcr') {
|
||||||
|
this.targetForm.controls.access_key.setValue("_json_key");
|
||||||
|
} else {
|
||||||
|
this.targetForm.controls.access_key.setValue("");
|
||||||
|
}
|
||||||
|
if (selectValue === 'google-gcr') {
|
||||||
|
this.endpointList = [
|
||||||
|
{
|
||||||
|
key: "gcr.io",
|
||||||
|
value: "https://gcr.io"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: "us.gcr.io",
|
||||||
|
value: "https://us.gcr.io"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: "eu.gcr.io",
|
||||||
|
value: "https://eu.gcr.io"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: "asia.gcr.io",
|
||||||
|
value: "https://asia.gcr.io"
|
||||||
|
}
|
||||||
|
];
|
||||||
|
} else if (selectValue === 'aws-ecr') {
|
||||||
|
this.endpointList = [
|
||||||
|
{
|
||||||
|
key: "ap-northeast-1",
|
||||||
|
value: "https://api.ecr.ap-northeast-1.amazonaws.com"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: "us-east-1",
|
||||||
|
value: "https://api.ecr.us-east-1.amazonaws.com"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: "us-east-2",
|
||||||
|
value: "https://api.ecr.us-east-2.amazonaws.com"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: "us-west-1",
|
||||||
|
value: "https://api.ecr.us-west-1.amazonaws.com"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: "us-west-2",
|
||||||
|
value: "https://api.ecr.us-west-2.amazonaws.com"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: "ap-east-1",
|
||||||
|
value: "https://api.ecr.ap-east-1.amazonaws.com"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: "ap-south-1",
|
||||||
|
value: "https://api.ecr.ap-south-1.amazonaws.com"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: "ap-northeast-2",
|
||||||
|
value: "https://api.ecr.ap-northeast-2.amazonaws.com"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: "ap-southeast-1",
|
||||||
|
value: "https://api.ecr.ap-southeast-1.amazonaws.com"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: "ap-southeast-2",
|
||||||
|
value: "https://api.ecr.ap-southeast-2.amazonaws.com"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: "ca-central-1",
|
||||||
|
value: "https://api.ecr.ca-central-1.amazonaws.com"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: "eu-central-1",
|
||||||
|
value: "https://api.ecr.eu-central-1.amazonaws.com"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: "eu-west-1",
|
||||||
|
value: "https://api.ecr.eu-west-1.amazonaws.com"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: "eu-west-2",
|
||||||
|
value: "https://api.ecr.eu-west-2.amazonaws.com"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: "eu-west-3",
|
||||||
|
value: "https://api.ecr.eu-west-3.amazonaws.com"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: "eu-north-1",
|
||||||
|
value: "https://api.ecr.eu-north-1.amazonaws.com"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: "sa-east-1",
|
||||||
|
value: "https://api.ecr.sa-east-1.amazonaws.com"
|
||||||
|
}
|
||||||
|
];
|
||||||
|
} else {
|
||||||
|
this.endpointList = [];
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
testConnection() {
|
testConnection() {
|
||||||
|
Loading…
Reference in New Issue
Block a user