Upstream/harbor
1
0
Fork 0
mirror of https://github.com/goharbor/harbor.git synced 2024-06-27 07:15:03 +02:00
Code Issues Projects Releases Wiki Activity

Improve copy-artifact component (#16628)

Browse Source 
Signed-off-by: AllForNothing <sshijun@vmware.com>
This commit is contained in:
Shijun Sun 2022-04-06 10:51:06 +08:00 committed by GitHub
parent 37132786cf
commit df54e1e13c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 31 additions and 37 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/portal/src/app/base/project/repository/artifact/artifact-list-page/artifact-list/artifact-list-tab/artifact-list-tab.component.ts
View File

@ -716,7 +716,7 @@ export class ArtifactListTabComponent implements OnInit, OnDestroy {
retag() {
if (this.selectedRow && this.selectedRow.length && !this.depth) {
this.retagDialogOpened = true;
this.imageNameInput.imageNameForm.reset();
this.imageNameInput.imageNameForm.reset({repoName: this.repoName});
this.retagSrcImage = this.repoName + ":" + this.selectedRow[0].digest;
}
}

2
src/portal/src/app/shared/components/image-name-input/image-name-input.component.html
View File

@ -10,7 +10,7 @@
(keyup)='validateProjectName()'
formControlName="projectName" autocomplete="off" />
<clr-icon class="clr-validate-icon" shape="exclamation-circle"></clr-icon>
<div class="select-box" [style.display]="selectedProjectList.length ? 'block' : 'none'">
<div class="selectBox" [style.display]="selectedProjectList.length ? 'block' : 'none'">
<ul>
<li *ngFor="let project of selectedProjectList"
(click)="selectedProjectName(project?.name)">{{project?.name}}</li>

38
src/portal/src/app/shared/components/image-name-input/image-name-input.component.scss
View File

@ -1,34 +1,28 @@
.select-box {
.selectBox{
position: absolute;
width: 278px;
height: auto;
background-color: white;
border: 1px solid rgba(0, 0, 0, .15);
border: 1px solid rgba(0,0,0,.15);
border-right-width: 2px;
border-bottom-width: 2px;
border-radius: 6px;
box-shadow: 0 5px 10px rgba(0, 0, 0, .2);
z-index:1;
width:100%;
ul {
li {
list-style: none;
padding: 3px 20px;
cursor: pointer;
&:hover {
color: #262626;
background-image: linear-gradient(180deg, #f5f5f5 0, #e8e8e8);
background-repeat: repeat-x;
}
}
}
box-shadow: 0 5px 10px rgba(0,0,0,.2);
z-index: 100;
}
.selectBox ul li{
list-style: none;
padding: 3px 20px;
cursor: pointer;
}
.selectBox ul li:hover{
color: #262626;
background-image: linear-gradient(180deg,#f5f5f5 0,#e8e8e8);
background-repeat: repeat-x;
}
.clr-input-wrapper {
width: 100%;
position: relative;
}
.wrap-label {
@ -42,5 +36,5 @@
width: 60%;
}
.w-90 {
width: 90%;
width: 278px;
}

10
src/portal/src/app/shared/components/image-name-input/image-name-input.component.spec.ts
View File

@ -1,10 +1,9 @@
import { ComponentFixture, TestBed } from "@angular/core/testing";
import { ImageNameInputComponent } from "./image-name-input.component";
import { ProjectDefaultService, ProjectService } from "../../services";
import { Project } from "../../../base/project/project-config/project-policy-config/project";
import { of } from "rxjs";
import { HttpResponse } from "@angular/common/http";
import { SharedTestingModule } from "../../shared.module";
import { ProjectService } from "ng-swagger-gen/services/project.service";
import { Project } from "ng-swagger-gen/models/project";
describe("ImageNameInputComponent (inline template)", () => {
let comp: ImageNameInputComponent;
@ -31,9 +30,6 @@ describe("ImageNameInputComponent (inline template)", () => {
declarations: [
ImageNameInputComponent
],
providers: [
{ provide: ProjectService, useClass: ProjectDefaultService }
]
}).compileComponents();
});
@ -43,7 +39,7 @@ describe("ImageNameInputComponent (inline template)", () => {
let projectService: ProjectService;
projectService = fixture.debugElement.injector.get(ProjectService);
spy = spyOn(projectService, "listProjects").and.returnValues(of(new HttpResponse({ body: mockProjects })));
spy = spyOn(projectService, "listProjects").and.returnValues(of(mockProjects));
});
it("should load data", () => {

16
src/portal/src/app/shared/components/image-name-input/image-name-input.component.ts
View File

@ -1,10 +1,10 @@
import { Component, OnDestroy, OnInit } from "@angular/core";
import { Project } from "../../../base/project/project-config/project-policy-config/project";
import { Subject } from "rxjs";
import { debounceTime, switchMap } from "rxjs/operators";
import { ProjectService } from "../../services";
import { AbstractControl, FormBuilder, FormGroup, Validators } from "@angular/forms";
import { ErrorHandler } from "../../units/error-handler";
import { ProjectService } from "ng-swagger-gen/services/project.service";
import { Project } from "ng-swagger-gen/models/project";
@Component({
selector: "hbr-image-name-input",
@ -46,13 +46,17 @@ export class ImageNameInputComponent implements OnInit, OnDestroy {
switchMap(name => {
this.noProjectInfo = "";
this.selectedProjectList = [];
return this.proService.listProjects(name, undefined);
return this.proService.listProjects({
name: name,
page: 1,
pageSize: 10
});
})
).subscribe(response => {
if (response.body) {
this.selectedProjectList = response.body.slice(0, 10);
if (response) {
this.selectedProjectList = response;
// if input project name exist in the project list
let exist = response.body.find((data: any) => data.name === this.imageNameForm.controls["projectName"].value);
let exist = response.find((data: Project) => data.name === this.imageNameForm.controls["projectName"].value);
if (!exist) {
this.noProjectInfo = "REPLICATION.NO_PROJECT_INFO";
} else {