diff --git a/.gitignore b/.gitignore index d28836632..e2fbedde0 100644 --- a/.gitignore +++ b/.gitignore @@ -28,4 +28,10 @@ src/ui_ng/typings/ **/ssl/ **/proxy.config.json +src/ui_ng/src/**/*.js +src/ui_ng/src/**/*.js.map +src/ui_ng/src/**/*.json +src/ui_ng/aot/**/*.js +src/ui_ng/aot/**/*.js.map +src/ui_ng/aot/**/*.json diff --git a/src/ui_ng/package.json b/src/ui_ng/package.json index 0e0eacf60..b75e1a438 100644 --- a/src/ui_ng/package.json +++ b/src/ui_ng/package.json @@ -1,63 +1,62 @@ { - "name": "harbor", - "version": "0.6.0", - "description": "Harbor UI with Clarity", - "angular-cli": {}, - "scripts": { - "start": "ng serve --ssl 1 --ssl-key ssl/server.key --ssl-cert ssl/server.crt --host 0.0.0.0 --proxy-config proxy.config.json", - "lint": "tslint \"src/**/*.ts\"", - "test": "ng test --single-run", - "pree2e": "webdriver-manager update", - "e2e": "protractor" - }, - "private": true, - "dependencies": { - "@angular/common": "^2.4.1", - "@angular/compiler": "^2.4.1", - "@angular/core": "^2.4.1", - "@angular/forms": "^2.4.1", - "@angular/http": "^2.4.1", - "@angular/platform-browser": "^2.4.1", - "@angular/platform-browser-dynamic": "^2.4.1", - "@angular/router": "^3.4.1", - "@ngx-translate/core": "^6.0.0", - "@ngx-translate/http-loader": "0.0.3", - "@webcomponents/custom-elements": "1.0.0-alpha.3", - "angular2-cookie": "^1.2.6", - "clarity-angular": "0.8.7", - "clarity-icons": "0.8.7", - "clarity-ui": "0.8.7", - "core-js": "^2.4.1", - "fs": "0.0.1-security", - "jquery": "^2.2.4", - "mutationobserver-shim": "^0.3.2", - "rxjs": "^5.0.1", - "ts-helpers": "^1.1.1", - "web-animations-js": "^2.2.1", - "zone.js": "^0.7.2" - }, - "devDependencies": { - "@angular/compiler-cli": "^2.4.1", - "@angular/cli": "^1.0.0", - "@types/core-js": "^0.9.34", - "@types/jasmine": "^2.2.30", - "@types/node": "^6.0.42", - "bootstrap": "4.0.0-alpha.5", - "codelyzer": "~1.0.0-beta.3", - "enhanced-resolve": "^3.0.0", - "jasmine-core": "2.4.1", - "jasmine-spec-reporter": "2.5.0", - "karma": "1.2.0", - "karma-cli": "^1.0.1", - "karma-jasmine": "^1.0.2", - "karma-mocha-reporter": "^2.2.1", - "karma-phantomjs-launcher": "^1.0.0", - "karma-remap-istanbul": "^0.2.1", - "protractor": "4.0.9", - "ts-node": "1.2.1", - "tslint": "^4.1.1", - "typescript": "~2.2.1", - "typings": "^1.4.0", - "webdriver-manager": "10.2.5" - } -} \ No newline at end of file + "name": "harbor", + "version": "0.6.0", + "description": "Harbor UI with Clarity", + "angular-cli": {}, + "scripts": { + "start": "ng serve --ssl 1 --ssl-key ssl/server.key --ssl-cert ssl/server.crt --host 0.0.0.0 --proxy-config proxy.config.json", + "lint": "tslint \"src/**/*.ts\"", + "test": "ng test --single-run", + "pree2e": "webdriver-manager update", + "e2e": "protractor" + }, + "private": true, + "dependencies": { + "@angular/animations": "^4.0.1", + "@angular/common": "^4.0.1", + "@angular/compiler": "^4.0.1", + "@angular/core": "^4.0.1", + "@angular/forms": "^4.0.1", + "@angular/http": "^4.0.1", + "@angular/platform-browser": "^4.0.1", + "@angular/platform-browser-dynamic": "^4.0.1", + "@angular/router": "^4.0.1", + "@ngx-translate/core": "^6.0.0", + "@ngx-translate/http-loader": "0.0.3", + "@webcomponents/custom-elements": "1.0.0-alpha.3", + "angular2-cookie": "^1.2.6", + "clarity-angular": "^0.9.0", + "clarity-icons": "^0.9.0", + "clarity-ui": "^0.9.0", + "core-js": "^2.4.1", + "mutationobserver-shim": "^0.3.2", + "rxjs": "^5.0.1", + "ts-helpers": "^1.1.1", + "web-animations-js": "^2.2.1", + "zone.js": "^0.8.4" + }, + "devDependencies": { + "@angular/cli": "^1.0.0", + "@angular/compiler-cli": "^4.0.1", + "@types/core-js": "^0.9.34", + "@types/jasmine": "~2.2.30", + "@types/node": "^6.0.42", + "bootstrap": "4.0.0-alpha.5", + "codelyzer": "~2.0.0-beta.4", + "enhanced-resolve": "^3.0.0", + "jasmine-core": "2.4.1", + "jasmine-spec-reporter": "2.5.0", + "karma": "1.2.0", + "karma-cli": "^1.0.1", + "karma-jasmine": "^1.0.2", + "karma-mocha-reporter": "^2.2.1", + "karma-phantomjs-launcher": "^1.0.0", + "karma-remap-istanbul": "^0.2.1", + "protractor": "4.0.9", + "ts-node": "1.2.1", + "tslint": "^4.1.1", + "typescript": "~2.2.0", + "typings": "^1.4.0", + "webdriver-manager": "10.2.5" + } +} diff --git a/src/ui_ng/src/app/app.component.ts b/src/ui_ng/src/app/app.component.ts index b80c566d4..6f90a866a 100644 --- a/src/ui_ng/src/app/app.component.ts +++ b/src/ui_ng/src/app/app.component.ts @@ -43,8 +43,7 @@ export class AppComponent { } let selectedLang = this.isLangMatch(langSetting, supportedLangs) ? langSetting : enLang; - translate.use(selectedLang); - //this.session.switchLanguage(selectedLang).catch(error => console.error(error)); + translate.use(selectedLang); //Override page title let key: string = "APP_TITLE.HARBOR"; diff --git a/src/ui_ng/src/app/core/core.module.ts b/src/ui_ng/src/app/core/core.module.ts index aebfbe6ab..5906b4fe8 100644 --- a/src/ui_ng/src/app/core/core.module.ts +++ b/src/ui_ng/src/app/core/core.module.ts @@ -15,6 +15,7 @@ import { BrowserModule } from '@angular/platform-browser'; import { NgModule } from '@angular/core'; import { FormsModule } from '@angular/forms'; import { HttpModule } from '@angular/http'; +import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; import { ClarityModule } from 'clarity-angular'; @NgModule({ @@ -22,13 +23,15 @@ import { ClarityModule } from 'clarity-angular'; BrowserModule, FormsModule, HttpModule, - ClarityModule.forRoot() + ClarityModule.forRoot(), + BrowserAnimationsModule ], exports: [ BrowserModule, FormsModule, HttpModule, - ClarityModule + ClarityModule, + BrowserAnimationsModule ] }) export class CoreModule { diff --git a/src/ui_ng/src/app/log/audit-log.component.ts b/src/ui_ng/src/app/log/audit-log.component.ts index a82521686..7c4a24aff 100644 --- a/src/ui_ng/src/app/log/audit-log.component.ts +++ b/src/ui_ng/src/app/log/audit-log.component.ts @@ -77,7 +77,6 @@ export class AuditLogComponent implements OnInit { ngOnInit(): void { this.projectId = +this.route.snapshot.parent.params['id']; - console.log('Get projectId from route params snapshot:' + this.projectId); this.queryParam.project_id = this.projectId; this.queryParam.page_size = this.pageSize; } @@ -92,7 +91,6 @@ export class AuditLogComponent implements OnInit { response=>{ this.totalRecordCount = response.headers.get('x-total-count'); this.totalPage = Math.ceil(this.totalRecordCount / this.pageSize); - console.log('TotalRecordCount:' + this.totalRecordCount + ', totalPage:' + this.totalPage); this.auditLogs = response.json(); }, error=>{ @@ -117,7 +115,6 @@ export class AuditLogComponent implements OnInit { this.queryParam.end_timestamp = new Date(strDate).getTime() / 1000 + oneDayOffset; break; } - console.log('Search audit log filtered by time range, begin: ' + this.queryParam.begin_timestamp + ', end:' + this.queryParam.end_timestamp); this.retrieve(); } @@ -136,8 +133,7 @@ export class AuditLogComponent implements OnInit { operationFilter = []; } this.queryParam.keywords = operationFilter.join('/'); - this.retrieve(); - console.log('Search option filter:' + operationFilter.join('/')); + this.retrieve(); } toggleOptionalName(option: number): void { diff --git a/src/ui_ng/src/app/log/recent-log.component.html b/src/ui_ng/src/app/log/recent-log.component.html index 34777cfde..eed51d17f 100644 --- a/src/ui_ng/src/app/log/recent-log.component.html +++ b/src/ui_ng/src/app/log/recent-log.component.html @@ -25,7 +25,7 @@ {{'AUDIT_LOG.TAGS' | translate}} {{'AUDIT_LOG.OPERATION' | translate}} {{'AUDIT_LOG.TIMESTAMP' | translate}} - + {{l.username}} {{l.repo_name}} {{l.repo_tag}} diff --git a/src/ui_ng/src/app/project/list-project/list-project.component.html b/src/ui_ng/src/app/project/list-project/list-project.component.html index 1dd2afe12..f286a243c 100644 --- a/src/ui_ng/src/app/project/list-project/list-project.component.html +++ b/src/ui_ng/src/app/project/list-project/list-project.component.html @@ -4,7 +4,7 @@ {{'PROJECT.ROLE' | translate}} {{'PROJECT.REPO_COUNT'| translate}} {{'PROJECT.CREATION_TIME' | translate}} - + @@ -18,6 +18,6 @@ {{totalRecordCount || (projects ? projects.length : 0)}} {{'PROJECT.ITEMS' | translate}} - + \ No newline at end of file diff --git a/src/ui_ng/src/app/project/list-project/list-project.component.ts b/src/ui_ng/src/app/project/list-project/list-project.component.ts index e5b6e9180..5e4c858eb 100644 --- a/src/ui_ng/src/app/project/list-project/list-project.component.ts +++ b/src/ui_ng/src/app/project/list-project/list-project.component.ts @@ -11,7 +11,7 @@ // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. // See the License for the specific language governing permissions and // limitations under the License. -import { Component, EventEmitter, Output, Input, OnInit } from '@angular/core'; +import { Component, EventEmitter, Output, Input, ChangeDetectionStrategy, ChangeDetectorRef } from '@angular/core'; import { Router, NavigationExtras } from '@angular/router'; import { Project } from '../project'; import { ProjectService } from '../project.service'; @@ -24,17 +24,12 @@ import { State } from 'clarity-angular'; @Component({ selector: 'list-project', - templateUrl: 'list-project.component.html' + templateUrl: 'list-project.component.html', + changeDetection: ChangeDetectionStrategy.OnPush }) -export class ListProjectComponent implements OnInit { +export class ListProjectComponent { @Input() projects: Project[]; - - - @Input() totalPage: number; - @Input() totalRecordCount: number; - pageOffset: number = 1; - @Input() filteredType: string; @Output() paginate = new EventEmitter(); @@ -47,10 +42,11 @@ export class ListProjectComponent implements OnInit { constructor( private session: SessionService, private router: Router, - private searchTrigger: SearchTriggerService) { } - - ngOnInit(): void { - } + private searchTrigger: SearchTriggerService, + private ref: ChangeDetectorRef) { + let hnd = setInterval(()=>ref.markForCheck(), 100); + setTimeout(()=>clearInterval(hnd), 1000); + } get showRoleInfo(): boolean { return this.filteredType === ProjectTypes[0]; diff --git a/src/ui_ng/src/app/project/member/add-member/add-member.component.ts b/src/ui_ng/src/app/project/member/add-member/add-member.component.ts index 522460d70..96126cbe1 100644 --- a/src/ui_ng/src/app/project/member/add-member/add-member.component.ts +++ b/src/ui_ng/src/app/project/member/add-member/add-member.component.ts @@ -63,7 +63,6 @@ export class AddMemberComponent implements AfterViewChecked { .subscribe( response=>{ this.messageHandlerService.showSuccess('MEMBER.ADDED_SUCCESS'); - console.log('Added member successfully.'); this.added.emit(true); this.addMemberOpened = false; }, @@ -89,7 +88,6 @@ export class AddMemberComponent implements AfterViewChecked { .subscribe(errorMessage=>this.inlineAlert.showInlineError(errorMessage)); } } - console.log('Failed to add member of project:' + this.projectId, ' with error:' + error); } ); } diff --git a/src/ui_ng/src/app/project/member/member.component.html b/src/ui_ng/src/app/project/member/member.component.html index 19e87e1d6..78ba04ea8 100644 --- a/src/ui_ng/src/app/project/member/member.component.html +++ b/src/ui_ng/src/app/project/member/member.component.html @@ -17,7 +17,7 @@ {{'MEMBER.NAME' | translate}} {{'MEMBER.ROLE' | translate}} - + diff --git a/src/ui_ng/src/app/project/member/member.component.ts b/src/ui_ng/src/app/project/member/member.component.ts index 8f08d8879..39f36d3d8 100644 --- a/src/ui_ng/src/app/project/member/member.component.ts +++ b/src/ui_ng/src/app/project/member/member.component.ts @@ -11,7 +11,7 @@ // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. // See the License for the specific language governing permissions and // limitations under the License. -import { Component, OnInit, ViewChild, OnDestroy } from '@angular/core'; +import { Component, OnInit, ViewChild, OnDestroy, ChangeDetectionStrategy, ChangeDetectorRef } from '@angular/core'; import { ActivatedRoute, Params, Router } from '@angular/router'; import { Response } from '@angular/http'; @@ -41,7 +41,8 @@ import { Project } from '../../project/project'; @Component({ templateUrl: 'member.component.html', - styleUrls: ['./member.component.css'] + styleUrls: ['./member.component.css'], + changeDetection: ChangeDetectionStrategy.OnPush }) export class MemberComponent implements OnInit, OnDestroy { @@ -64,7 +65,8 @@ export class MemberComponent implements OnInit, OnDestroy { private memberService: MemberService, private messageHandlerService: MessageHandlerService, private deletionDialogService: ConfirmationDialogService, - private session: SessionService) { + private session: SessionService, + private ref: ChangeDetectorRef) { this.delSub = deletionDialogService.confirmationConfirm$.subscribe(message => { if (message && @@ -75,20 +77,25 @@ export class MemberComponent implements OnInit, OnDestroy { .subscribe( response => { this.messageHandlerService.showSuccess('MEMBER.DELETED_SUCCESS'); - console.log('Successful delete member: ' + message.data); this.retrieve(this.projectId, ''); }, error => this.messageHandlerService.handleError(error) ); } }); + let hnd = setInterval(()=>ref.markForCheck(), 100); + setTimeout(()=>clearInterval(hnd), 1000); } retrieve(projectId: number, username: string) { this.memberService .listMembers(projectId, username) .subscribe( - response => this.members = response, + response => { + this.members = response; + let hnd = setInterval(()=>this.ref.markForCheck(), 100); + setTimeout(()=>clearInterval(hnd), 1000); + }, error => { this.router.navigate(['/harbor', 'projects']); this.messageHandlerService.handleError(error); @@ -103,18 +110,13 @@ export class MemberComponent implements OnInit, OnDestroy { ngOnInit() { //Get projectId from route params snapshot. - this.projectId = +this.route.snapshot.parent.params['id']; - console.log('Get projectId from route params snapshot:' + this.projectId); - + this.projectId = +this.route.snapshot.parent.params['id']; this.currentUser = this.session.getCurrentUser(); //Get current user from registered resolver. let resolverData = this.route.snapshot.parent.data; if(resolverData) { this.hasProjectAdminRole = (resolverData['projectResolver']).has_project_admin_role; } - - - this.retrieve(this.projectId, ''); } @@ -134,7 +136,6 @@ export class MemberComponent implements OnInit, OnDestroy { .subscribe( response => { this.messageHandlerService.showSuccess('MEMBER.SWITCHED_SUCCESS'); - console.log('Successful change role with user ' + m.user_id + ' to roleId ' + roleId); this.retrieve(this.projectId, ''); }, error => this.messageHandlerService.handleError(error) diff --git a/src/ui_ng/src/app/project/member/member.service.ts b/src/ui_ng/src/app/project/member/member.service.ts index b050d1be5..33e7b0537 100644 --- a/src/ui_ng/src/app/project/member/member.service.ts +++ b/src/ui_ng/src/app/project/member/member.service.ts @@ -27,7 +27,6 @@ export class MemberService { constructor(private http: Http) {} listMembers(projectId: number, username: string): Observable { - console.log('Get member from project_id:' + projectId + ', username:' + username); return this.http .get(`/api/projects/${projectId}/members?username=${username}`) .map(response=>response.json() as Member[]) @@ -35,7 +34,6 @@ export class MemberService { } addMember(projectId: number, username: string, roleId: number): Observable { - console.log('Adding member with username:' + username + ', roleId:' + roleId + ' under projectId:' + projectId); return this.http .post(`/api/projects/${projectId}/members`, { username: username, roles: [ roleId ] }) .map(response=>response.status) @@ -43,7 +41,6 @@ export class MemberService { } changeMemberRole(projectId: number, userId: number, roleId: number): Observable { - console.log('Changing member role with userId:' + ' to roleId:' + roleId + ' under projectId:' + projectId); return this.http .put(`/api/projects/${projectId}/members/${userId}`, { roles: [ roleId ]}) .map(response=>response.status) @@ -51,7 +48,6 @@ export class MemberService { } deleteMember(projectId: number, userId: number): Observable { - console.log('Deleting member role with userId:' + userId + ' under projectId:' + projectId); return this.http .delete(`/api/projects/${projectId}/members/${userId}`) .map(response=>response.status) diff --git a/src/ui_ng/src/app/project/project-routing-resolver.service.ts b/src/ui_ng/src/app/project/project-routing-resolver.service.ts index 71951592e..2c9d7bf8f 100644 --- a/src/ui_ng/src/app/project/project-routing-resolver.service.ts +++ b/src/ui_ng/src/app/project/project-routing-resolver.service.ts @@ -29,7 +29,6 @@ export class ProjectRoutingResolver implements Resolve{ resolve(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Promise { let projectId = route.params['id']; - console.log('Project resolver, projectID:' + projectId); return this.projectService .getProject(projectId) .toPromise() diff --git a/src/ui_ng/src/app/project/project.component.html b/src/ui_ng/src/app/project/project.component.html index b30a6570d..e2b82e968 100644 --- a/src/ui_ng/src/app/project/project.component.html +++ b/src/ui_ng/src/app/project/project.component.html @@ -24,6 +24,6 @@ - + \ No newline at end of file diff --git a/src/ui_ng/src/app/project/project.component.ts b/src/ui_ng/src/app/project/project.component.ts index f964ba702..4c8489f41 100644 --- a/src/ui_ng/src/app/project/project.component.ts +++ b/src/ui_ng/src/app/project/project.component.ts @@ -47,7 +47,6 @@ import { StatisticHandler } from '../shared/statictics/statistic-handler.service }) export class ProjectComponent implements OnInit, OnDestroy { - selected = []; changedProjects: Project[]; projectTypes = ProjectTypes; @@ -64,12 +63,6 @@ export class ProjectComponent implements OnInit, OnDestroy { projectName: string; isPublic: number; - page: number = 1; - pageSize: number = 15; - - totalPage: number; - totalRecordCount: number; - constructor( private projectService: ProjectService, private messageHandlerService: MessageHandlerService, @@ -129,15 +122,10 @@ export class ProjectComponent implements OnInit, OnDestroy { } retrieve(state?: State): void { - if (state) { - this.page = state.page.to + 1; - } this.projectService - .listProjects(this.projectName, this.isPublic, this.page, this.pageSize) + .listProjects(this.projectName, this.isPublic) .subscribe( response => { - this.totalRecordCount = response.headers.get('x-total-count'); - this.totalPage = Math.ceil(this.totalRecordCount / this.pageSize); this.changedProjects = response.json(); }, error => this.messageHandlerService.handleError(error) diff --git a/src/ui_ng/src/app/project/project.service.ts b/src/ui_ng/src/app/project/project.service.ts index 26446f877..3d5e9a55d 100644 --- a/src/ui_ng/src/app/project/project.service.ts +++ b/src/ui_ng/src/app/project/project.service.ts @@ -42,8 +42,10 @@ export class ProjectService { listProjects(name: string, isPublic: number, page?: number, pageSize?: number): Observable{ let params = new URLSearchParams(); - params.set('page', page + ''); - params.set('page_size', pageSize + ''); + if(page && pageSize) { + params.set('page', page + ''); + params.set('page_size', pageSize + ''); + } return this.http .get(`/api/projects?project_name=${name}&is_public=${isPublic}`, {search: params}) .map(response=>response) diff --git a/src/ui_ng/src/app/replication/create-edit-destination/create-edit-destination.component.ts b/src/ui_ng/src/app/replication/create-edit-destination/create-edit-destination.component.ts index 57b94194d..d4fd50fd2 100644 --- a/src/ui_ng/src/app/replication/create-edit-destination/create-edit-destination.component.ts +++ b/src/ui_ng/src/app/replication/create-edit-destination/create-edit-destination.component.ts @@ -157,7 +157,6 @@ export class CreateEditDestinationComponent implements AfterViewChecked { .subscribe( response=>{ this.messageHandlerService.showSuccess('DESTINATION.CREATED_SUCCESS'); - console.log('Successful added target.'); this.createEditDestinationOpened = false; this.reload.emit(true); }, @@ -206,7 +205,6 @@ export class CreateEditDestinationComponent implements AfterViewChecked { .subscribe( response=>{ this.messageHandlerService.showSuccess('DESTINATION.UPDATED_SUCCESS'); - console.log('Successful updated target.'); this.createEditDestinationOpened = false; this.reload.emit(true); }, diff --git a/src/ui_ng/src/app/replication/destination/destination.component.html b/src/ui_ng/src/app/replication/destination/destination.component.html index 2115ff6c2..e8994c609 100644 --- a/src/ui_ng/src/app/replication/destination/destination.component.html +++ b/src/ui_ng/src/app/replication/destination/destination.component.html @@ -18,7 +18,7 @@ {{'DESTINATION.NAME' | translate}} {{'DESTINATION.URL' | translate}} {{'DESTINATION.CREATION_TIME' | translate}} - + diff --git a/src/ui_ng/src/app/replication/destination/destination.component.ts b/src/ui_ng/src/app/replication/destination/destination.component.ts index e5c1bb7a7..406b70d61 100644 --- a/src/ui_ng/src/app/replication/destination/destination.component.ts +++ b/src/ui_ng/src/app/replication/destination/destination.component.ts @@ -11,7 +11,7 @@ // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. // See the License for the specific language governing permissions and // limitations under the License. -import { Component, OnInit, ViewChild, OnDestroy } from '@angular/core'; +import { Component, OnInit, ViewChild, OnDestroy, ChangeDetectionStrategy, ChangeDetectorRef } from '@angular/core'; import { Target } from '../target'; import { ReplicationService } from '../replication.service'; import { MessageHandlerService } from '../../shared/message-handler/message-handler.service'; @@ -28,7 +28,8 @@ import { CreateEditDestinationComponent } from '../create-edit-destination/creat @Component({ selector: 'destination', templateUrl: 'destination.component.html', - styleUrls: ['./destination.component.css'] + styleUrls: ['./destination.component.css'], + changeDetection: ChangeDetectionStrategy.OnPush }) export class DestinationComponent implements OnInit { @@ -44,7 +45,8 @@ export class DestinationComponent implements OnInit { constructor( private replicationService: ReplicationService, private messageHandlerService: MessageHandlerService, - private deletionDialogService: ConfirmationDialogService) { + private deletionDialogService: ConfirmationDialogService, + private ref: ChangeDetectorRef) { this.subscription = this.deletionDialogService.confirmationConfirm$.subscribe(message => { if (message && message.source === ConfirmationTargets.TARGET && @@ -66,6 +68,8 @@ export class DestinationComponent implements OnInit { }); } }); + let hnd = setInterval(()=>ref.markForCheck(), 100); + setTimeout(()=>clearInterval(hnd), 1000); } ngOnInit(): void { @@ -83,7 +87,11 @@ export class DestinationComponent implements OnInit { this.replicationService .listTargets(targetName) .subscribe( - targets => this.targets = targets, + targets => { + this.targets = targets || []; + let hnd = setInterval(()=>this.ref.markForCheck(), 100); + setTimeout(()=>clearInterval(hnd), 1000); + }, error => this.messageHandlerService.handleError(error) ); } @@ -124,6 +132,8 @@ export class DestinationComponent implements OnInit { } } this.createEditDestinationComponent.openCreateEditTarget(editable, target.id); + let hnd = setInterval(()=>this.ref.markForCheck(), 100); + setTimeout(()=>clearInterval(hnd), 1000); }, error=>this.messageHandlerService.handleError(error) ); diff --git a/src/ui_ng/src/app/replication/list-job/list-job.component.ts b/src/ui_ng/src/app/replication/list-job/list-job.component.ts index 2d9a0ae11..f39dfc591 100644 --- a/src/ui_ng/src/app/replication/list-job/list-job.component.ts +++ b/src/ui_ng/src/app/replication/list-job/list-job.component.ts @@ -11,14 +11,15 @@ // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. // See the License for the specific language governing permissions and // limitations under the License. -import { Component, Input, Output, EventEmitter } from '@angular/core'; +import { Component, Input, Output, EventEmitter, ChangeDetectionStrategy, ChangeDetectorRef } from '@angular/core'; import { Job } from '../job'; import { State } from 'clarity-angular'; import { MessageHandlerService } from '../../shared/message-handler/message-handler.service'; @Component({ selector: 'list-job', - templateUrl: 'list-job.component.html' + templateUrl: 'list-job.component.html', + changeDetection: ChangeDetectionStrategy.OnPush }) export class ListJobComponent { @Input() jobs: Job[]; @@ -26,7 +27,12 @@ export class ListJobComponent { @Input() totalPage: number; @Output() paginate = new EventEmitter(); - constructor(private messageHandlerService: MessageHandlerService) {} + constructor( + private messageHandlerService: MessageHandlerService, + private ref: ChangeDetectorRef) { + let hnd = setInterval(()=>ref.markForCheck(), 100); + setTimeout(()=>clearInterval(hnd), 1000); + } pageOffset: number = 1; diff --git a/src/ui_ng/src/app/replication/replication.component.ts b/src/ui_ng/src/app/replication/replication.component.ts index f111b8aff..d35e470cc 100644 --- a/src/ui_ng/src/app/replication/replication.component.ts +++ b/src/ui_ng/src/app/replication/replication.component.ts @@ -98,7 +98,7 @@ export class ReplicationComponent implements OnInit { private messageHandlerService: MessageHandlerService, private replicationService: ReplicationService, private route: ActivatedRoute) { - this.currentUser = this.sessionService.getCurrentUser(); + this.currentUser = this.sessionService.getCurrentUser(); } ngOnInit(): void { @@ -120,7 +120,7 @@ export class ReplicationComponent implements OnInit { .listPolicies(this.search.policyName, this.projectId) .subscribe( response=>{ - this.changedPolicies = response; + this.changedPolicies = response || []; if(this.changedPolicies && this.changedPolicies.length > 0) { this.initSelectedId = this.changedPolicies[0].id; } @@ -128,8 +128,6 @@ export class ReplicationComponent implements OnInit { if(this.changedPolicies && this.changedPolicies.length > 0) { this.search.policyId = this.changedPolicies[0].id; this.fetchPolicyJobs(); - } else { - this.changedJobs = []; } }, error=>this.messageHandlerService.handleError(error) @@ -169,7 +167,7 @@ export class ReplicationComponent implements OnInit { this.messageHandlerService.showError('REPLICATION.FOUND_ERROR_IN_JOBS', ''); break; } - } + } }, error=>this.messageHandlerService.handleError(error) ); diff --git a/src/ui_ng/src/app/replication/replication.service.ts b/src/ui_ng/src/app/replication/replication.service.ts index 89a49e02e..649db5414 100644 --- a/src/ui_ng/src/app/replication/replication.service.ts +++ b/src/ui_ng/src/app/replication/replication.service.ts @@ -100,7 +100,6 @@ export class ReplicationService { } enablePolicy(policyId: number, enabled: number): Observable { - console.log('Enable or disable policy ID:' + policyId + ' with activation status:' + enabled); return this.http .put(`/api/policies/replication/${policyId}/enablement`, {enabled: enabled}) .map(response=>response.status) @@ -108,7 +107,6 @@ export class ReplicationService { } deletePolicy(policyId: number): Observable { - console.log('Delete policy ID:' + policyId); return this.http .delete(`/api/policies/replication/${policyId}`) .map(response=>response.status) diff --git a/src/ui_ng/src/app/replication/total-replication/total-replication.component.ts b/src/ui_ng/src/app/replication/total-replication/total-replication.component.ts index 15b726e66..daa18e1fd 100644 --- a/src/ui_ng/src/app/replication/total-replication/total-replication.component.ts +++ b/src/ui_ng/src/app/replication/total-replication/total-replication.component.ts @@ -11,7 +11,7 @@ // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. // See the License for the specific language governing permissions and // limitations under the License. -import { Component, OnInit, ViewChild } from '@angular/core'; +import { Component, OnInit, ViewChild, ChangeDetectionStrategy, ChangeDetectorRef } from '@angular/core'; import { ReplicationService } from '../../replication/replication.service'; import { CreateEditPolicyComponent } from '../../shared/create-edit-policy/create-edit-policy.component'; @@ -24,7 +24,8 @@ import { Policy } from '../../replication/policy'; selector: 'total-replication', templateUrl: 'total-replication.component.html', providers: [ ReplicationService ], - styleUrls: ['./total-replication.component.css'] + styleUrls: ['./total-replication.component.css'], + changeDetection: ChangeDetectionStrategy.OnPush }) export class TotalReplicationComponent implements OnInit { @@ -38,7 +39,11 @@ export class TotalReplicationComponent implements OnInit { constructor( private replicationService: ReplicationService, - private messageHandlerService: MessageHandlerService) {} + private messageHandlerService: MessageHandlerService, + private ref: ChangeDetectorRef) { + let hnd = setInterval(()=>ref.markForCheck(), 100); + setTimeout(()=>clearInterval(hnd), 1000); + } ngOnInit() { this.retrievePolicies(); diff --git a/src/ui_ng/src/app/repository/list-repository/list-repository.component.html b/src/ui_ng/src/app/repository/list-repository/list-repository.component.html index fbaa9e223..0a2187cd5 100644 --- a/src/ui_ng/src/app/repository/list-repository/list-repository.component.html +++ b/src/ui_ng/src/app/repository/list-repository/list-repository.component.html @@ -2,7 +2,7 @@ {{'REPOSITORY.NAME' | translate}} {{'REPOSITORY.TAGS_COUNT' | translate}} {{'REPOSITORY.PULL_COUNT' | translate}} - + @@ -12,6 +12,6 @@ {{totalRecordCount || (repositories ? repositories.length : 0)}} {{'REPOSITORY.ITEMS' | translate}} - + \ No newline at end of file diff --git a/src/ui_ng/src/app/repository/list-repository/list-repository.component.ts b/src/ui_ng/src/app/repository/list-repository/list-repository.component.ts index 94b673bd2..fbc44a80a 100644 --- a/src/ui_ng/src/app/repository/list-repository/list-repository.component.ts +++ b/src/ui_ng/src/app/repository/list-repository/list-repository.component.ts @@ -11,7 +11,7 @@ // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. // See the License for the specific language governing permissions and // limitations under the License. -import { Component, Input, Output, EventEmitter, OnInit } from '@angular/core'; +import { Component, Input, Output, EventEmitter, OnInit, ChangeDetectionStrategy, ChangeDetectorRef } from '@angular/core'; import { Router } from '@angular/router'; import { Repository } from '../repository'; import { State } from 'clarity-angular'; @@ -20,18 +20,15 @@ import { SearchTriggerService } from '../../base/global-search/search-trigger.se @Component({ selector: 'list-repository', - templateUrl: 'list-repository.component.html' + templateUrl: 'list-repository.component.html', + changeDetection: ChangeDetectionStrategy.OnPush }) export class ListRepositoryComponent implements OnInit { @Input() projectId: number; @Input() repositories: Repository[]; - @Output() delete = new EventEmitter(); - - @Input() totalPage: number; - @Input() totalRecordCount: number; @Output() paginate = new EventEmitter(); @Input() hasProjectAdminRole: boolean; @@ -40,7 +37,11 @@ export class ListRepositoryComponent implements OnInit { constructor( private router: Router, - private searchTrigger: SearchTriggerService) { } + private searchTrigger: SearchTriggerService, + private ref: ChangeDetectorRef) { + let hnd = setInterval(()=>ref.markForCheck(), 100); + setTimeout(()=>clearInterval(hnd), 1000); + } ngOnInit() { } diff --git a/src/ui_ng/src/app/repository/repository.component.html b/src/ui_ng/src/app/repository/repository.component.html index bafef0007..16973f08a 100644 --- a/src/ui_ng/src/app/repository/repository.component.html +++ b/src/ui_ng/src/app/repository/repository.component.html @@ -8,6 +8,6 @@
- +
\ No newline at end of file diff --git a/src/ui_ng/src/app/repository/repository.component.ts b/src/ui_ng/src/app/repository/repository.component.ts index 87bf5631e..a3f24565c 100644 --- a/src/ui_ng/src/app/repository/repository.component.ts +++ b/src/ui_ng/src/app/repository/repository.component.ts @@ -41,9 +41,6 @@ export class RepositoryComponent implements OnInit { lastFilteredRepoName: string; - page: number = 1; - pageSize: number = 15; - totalPage: number; totalRecordCount: number; @@ -71,7 +68,6 @@ export class RepositoryComponent implements OnInit { response => { this.refresh(); this.messageHandlerService.showSuccess('REPOSITORY.DELETED_REPO_SUCCESS'); - console.log('Successful deleted repo:' + repoName); }, error => this.messageHandlerService.handleError(error) ); @@ -97,16 +93,10 @@ export class RepositoryComponent implements OnInit { } retrieve(state?: State) { - if (state) { - this.page = state.page.to + 1; - } this.repositoryService - .listRepositories(this.projectId, this.lastFilteredRepoName, this.page, this.pageSize) + .listRepositories(this.projectId, this.lastFilteredRepoName) .subscribe( response => { - this.totalRecordCount = response.headers.get('x-total-count'); - this.totalPage = Math.ceil(this.totalRecordCount / this.pageSize); - console.log('TotalRecordCount:' + this.totalRecordCount + ', totalPage:' + this.totalPage); this.changedRepositories = response.json(); }, error => this.messageHandlerService.handleError(error) diff --git a/src/ui_ng/src/app/repository/repository.service.ts b/src/ui_ng/src/app/repository/repository.service.ts index 7d2de726a..642a338b8 100644 --- a/src/ui_ng/src/app/repository/repository.service.ts +++ b/src/ui_ng/src/app/repository/repository.service.ts @@ -28,10 +28,11 @@ export class RepositoryService { constructor(private http: Http){} listRepositories(projectId: number, repoName: string, page?: number, pageSize?: number): Observable { - console.log('List repositories with project ID:' + projectId); let params = new URLSearchParams(); - params.set('page', page + ''); - params.set('page_size', pageSize + ''); + if(page && pageSize) { + params.set('page', page + ''); + params.set('page_size', pageSize + ''); + } return this.http .get(`/api/repositories?project_id=${projectId}&q=${repoName}&detail=1`, {search: params}) .map(response=>response) @@ -75,7 +76,6 @@ export class RepositoryService { } deleteRepository(repoName: string): Observable { - console.log('Delete repository with repo name:' + repoName); return this.http .delete(`/api/repositories/${repoName}/tags`) .map(response=>response.status) @@ -83,7 +83,6 @@ export class RepositoryService { } deleteRepoByTag(repoName: string, tag: string): Observable { - console.log('Delete repository with repo name:' + repoName + ', tag:' + tag); return this.http .delete(`/api/repositories/${repoName}/tags/${tag}`) .map(response=>response.status) diff --git a/src/ui_ng/src/app/repository/tag-repository/tag-repository.component.html b/src/ui_ng/src/app/repository/tag-repository/tag-repository.component.html index c0e1acf8f..eb7fc8fc4 100644 --- a/src/ui_ng/src/app/repository/tag-repository/tag-repository.component.html +++ b/src/ui_ng/src/app/repository/tag-repository/tag-repository.component.html @@ -24,7 +24,7 @@ {{'REPOSITORY.DOCKER_VERSION' | translate}} {{'REPOSITORY.ARCHITECTURE' | translate}} {{'REPOSITORY.OS' | translate}} - + diff --git a/src/ui_ng/src/app/repository/tag-repository/tag-repository.component.ts b/src/ui_ng/src/app/repository/tag-repository/tag-repository.component.ts index 017d3de0f..5a9e2a3df 100644 --- a/src/ui_ng/src/app/repository/tag-repository/tag-repository.component.ts +++ b/src/ui_ng/src/app/repository/tag-repository/tag-repository.component.ts @@ -11,7 +11,7 @@ // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. // See the License for the specific language governing permissions and // limitations under the License. -import { Component, OnInit, OnDestroy } from '@angular/core'; +import { Component, OnInit, OnDestroy, ChangeDetectionStrategy, ChangeDetectorRef } from '@angular/core'; import { ActivatedRoute } from '@angular/router'; import { RepositoryService } from '../repository.service'; @@ -35,7 +35,8 @@ import { Project } from '../../project/project'; @Component({ selector: 'tag-repository', templateUrl: 'tag-repository.component.html', - styleUrls: ['./tag-repository.component.css'] + styleUrls: ['./tag-repository.component.css'], + changeDetection: ChangeDetectionStrategy.OnPush }) export class TagRepositoryComponent implements OnInit, OnDestroy { @@ -66,8 +67,9 @@ export class TagRepositoryComponent implements OnInit, OnDestroy { private deletionDialogService: ConfirmationDialogService, private repositoryService: RepositoryService, private appConfigService: AppConfigService, - private session: SessionService){ - + private session: SessionService, + private ref: ChangeDetectorRef){ + this.subscription = this.deletionDialogService.confirmationConfirm$.subscribe( message => { if (message && @@ -85,7 +87,6 @@ export class TagRepositoryComponent implements OnInit, OnDestroy { response => { this.retrieve(); this.messageHandlerService.showSuccess('REPOSITORY.DELETED_TAG_SUCCESS'); - console.log('Deleted repo:' + this.repoName + ' with tag:' + tagName); }, error => this.messageHandlerService.handleError(error) ); @@ -148,6 +149,8 @@ export class TagRepositoryComponent implements OnInit, OnDestroy { tag.parent = data['parent']; this.tags.push(tag); }); + let hnd = setInterval(()=>this.ref.markForCheck(), 100); + setTimeout(()=>clearInterval(hnd), 1000); } deleteTag(tag: TagView) { diff --git a/src/ui_ng/src/app/shared/create-edit-policy/create-edit-policy.component.ts b/src/ui_ng/src/app/shared/create-edit-policy/create-edit-policy.component.ts index e74c09e6e..7f8564715 100644 --- a/src/ui_ng/src/app/shared/create-edit-policy/create-edit-policy.component.ts +++ b/src/ui_ng/src/app/shared/create-edit-policy/create-edit-policy.component.ts @@ -157,7 +157,6 @@ export class CreateEditPolicyComponent implements OnInit, AfterViewChecked { } newDestination(checkedAddNew: boolean): void { - console.log('CheckedAddNew:' + checkedAddNew); this.isCreateDestination = checkedAddNew; if(this.isCreateDestination) { this.createEditPolicy.targetName = ''; @@ -201,13 +200,11 @@ export class CreateEditPolicyComponent implements OnInit, AfterViewChecked { } createPolicy(): void { - console.log('Create policy with existing target in component.'); this.replicationService .createPolicy(this.getPolicyByForm()) .subscribe( response=>{ this.messageHandlerService.showSuccess('REPLICATION.CREATED_SUCCESS'); - console.log('Successful created policy: ' + response); this.createEditPolicyOpened = false; this.reload.emit(true); }, @@ -220,18 +217,16 @@ export class CreateEditPolicyComponent implements OnInit, AfterViewChecked { } else { this.inlineAlert.showInlineError(error); } - console.log('Failed to create policy:' + error.status + ', error message:' + JSON.stringify(error['_body'])); + console.error('Failed to create policy:' + error.status + ', error message:' + JSON.stringify(error['_body'])); }); } createOrUpdatePolicyAndCreateTarget(): void { - console.log('Creating policy with new created target.'); this.replicationService .createOrUpdatePolicyWithNewTarget(this.getPolicyByForm(), this.getTargetByForm()) .subscribe( response=>{ this.messageHandlerService.showSuccess('REPLICATION.CREATED_SUCCESS'); - console.log('Successful created policy and target:' + response); this.createEditPolicyOpened = false; this.reload.emit(true); }, @@ -244,18 +239,16 @@ export class CreateEditPolicyComponent implements OnInit, AfterViewChecked { } else { this.inlineAlert.showInlineError(error); } - console.log('Failed to create policy and target:' + error.status + ', error message:' + JSON.stringify(error['_body'])); + console.error('Failed to create policy and target:' + error.status + ', error message:' + JSON.stringify(error['_body'])); } ); } updatePolicy(): void { - console.log('Creating policy with existing target.'); this.replicationService .updatePolicy(this.getPolicyByForm()) .subscribe( response=>{ - console.log('Successful created policy and target:' + response); this.messageHandlerService.showSuccess('REPLICATION.UPDATED_SUCCESS') this.createEditPolicyOpened = false; this.reload.emit(true); @@ -269,7 +262,7 @@ export class CreateEditPolicyComponent implements OnInit, AfterViewChecked { } else { this.inlineAlert.showInlineError(error); } - console.log('Failed to create policy and target:' + error.status + ', error message:' + JSON.stringify(error['_body'])); + console.error('Failed to create policy and target:' + error.status + ', error message:' + JSON.stringify(error['_body'])); } ); } diff --git a/src/ui_ng/src/app/shared/list-policy/list-policy.component.html b/src/ui_ng/src/app/shared/list-policy/list-policy.component.html index 0bb855249..f017f21da 100644 --- a/src/ui_ng/src/app/shared/list-policy/list-policy.component.html +++ b/src/ui_ng/src/app/shared/list-policy/list-policy.component.html @@ -5,26 +5,26 @@ {{'REPLICATION.DESTINATION_NAME' | translate}} {{'REPLICATION.LAST_START_TIME' | translate}} {{'REPLICATION.ACTIVATION' | translate}} - + - - + {{p.project_name}} {{p.description ? p.description : '-'}} {{p.target_name}} - - + - + {{p.start_time | date: 'short'}} {{ (p.enabled === 1 ? 'REPLICATION.ENABLED' : 'REPLICATION.DISABLED') | translate}} diff --git a/src/ui_ng/src/app/shared/list-policy/list-policy.component.ts b/src/ui_ng/src/app/shared/list-policy/list-policy.component.ts index eeffb464d..00d34a6fa 100644 --- a/src/ui_ng/src/app/shared/list-policy/list-policy.component.ts +++ b/src/ui_ng/src/app/shared/list-policy/list-policy.component.ts @@ -11,7 +11,7 @@ // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. // See the License for the specific language governing permissions and // limitations under the License. -import { Component, Input, Output, EventEmitter, ViewChild, OnDestroy } from '@angular/core'; +import { Component, Input, Output, EventEmitter, ViewChild, OnDestroy, ChangeDetectionStrategy, ChangeDetectorRef } from '@angular/core'; import { ReplicationService } from '../../replication/replication.service'; import { Policy } from '../../replication/policy'; @@ -28,6 +28,7 @@ import { Subscription } from 'rxjs/Subscription'; @Component({ selector: 'list-policy', templateUrl: 'list-policy.component.html', + changeDetection: ChangeDetectionStrategy.OnPush }) export class ListPolicyComponent implements OnDestroy { @@ -49,8 +50,9 @@ export class ListPolicyComponent implements OnDestroy { private replicationService: ReplicationService, private toggleConfirmDialogService: ConfirmationDialogService, private deletionDialogService: ConfirmationDialogService, - private messageHandlerService: MessageHandlerService) { - + private messageHandlerService: MessageHandlerService, + private ref: ChangeDetectorRef) { + setInterval(()=>ref.markForCheck(), 500); this.toggleSubscription = this.toggleConfirmDialogService .confirmationConfirm$ .subscribe( @@ -60,13 +62,11 @@ export class ListPolicyComponent implements OnDestroy { message.state === ConfirmationState.CONFIRMED) { let policy: Policy = message.data; policy.enabled = policy.enabled === 0 ? 1 : 0; - console.log('Enable policy ID:' + policy.id + ' with activation status ' + policy.enabled); this.replicationService .enablePolicy(policy.id, policy.enabled) .subscribe( response => { this.messageHandlerService.showSuccess('REPLICATION.TOGGLED_SUCCESS'); - console.log('Successful toggled policy status') }, error => this.messageHandlerService.handleError(error) ); @@ -85,7 +85,6 @@ export class ListPolicyComponent implements OnDestroy { .subscribe( response => { this.messageHandlerService.showSuccess('REPLICATION.DELETED_SUCCESS'); - console.log('Successful delete policy with ID:' + message.data); this.reload.emit(true); }, error => { @@ -98,8 +97,7 @@ export class ListPolicyComponent implements OnDestroy { ); } } - ); - + ); } ngOnDestroy() { @@ -113,12 +111,10 @@ export class ListPolicyComponent implements OnDestroy { selectPolicy(policy: Policy): void { this.selectedId = policy.id; - console.log('Select policy ID:' + policy.id); this.selectOne.emit(policy); } editPolicy(policy: Policy) { - console.log('Open modal to edit policy.'); this.editOne.emit(policy); } diff --git a/src/ui_ng/src/app/shared/list-project-ro/list-project-ro.component.html b/src/ui_ng/src/app/shared/list-project-ro/list-project-ro.component.html index 591e39361..f995b4b43 100644 --- a/src/ui_ng/src/app/shared/list-project-ro/list-project-ro.component.html +++ b/src/ui_ng/src/app/shared/list-project-ro/list-project-ro.component.html @@ -3,7 +3,7 @@ {{'PROJECT.PUBLIC_OR_PRIVATE' | translate}} {{'PROJECT.REPO_COUNT'| translate}} {{'PROJECT.CREATION_TIME' | translate}} - + {{p.name}} {{ (p.public === 1 ? 'PROJECT.PUBLIC' : 'PROJECT.PRIVATE') | translate}} {{p.repo_count}} @@ -11,6 +11,6 @@ {{totalRecordCount || (projects ? projects.length : 0)}} {{'PROJECT.ITEMS' | translate}} - + \ No newline at end of file diff --git a/src/ui_ng/src/app/shared/list-project-ro/list-project-ro.component.ts b/src/ui_ng/src/app/shared/list-project-ro/list-project-ro.component.ts index e0f4fac6e..a26264b7d 100644 --- a/src/ui_ng/src/app/shared/list-project-ro/list-project-ro.component.ts +++ b/src/ui_ng/src/app/shared/list-project-ro/list-project-ro.component.ts @@ -11,7 +11,7 @@ // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. // See the License for the specific language governing permissions and // limitations under the License. -import { Component, EventEmitter, Output, Input } from '@angular/core'; +import { Component, EventEmitter, Output, Input, ChangeDetectionStrategy, ChangeDetectorRef } from '@angular/core'; import { Router } from '@angular/router'; import { SearchTriggerService } from '../../base/global-search/search-trigger.service'; @@ -21,20 +21,20 @@ import { State } from 'clarity-angular'; @Component({ selector: 'list-project-ro', - templateUrl: 'list-project-ro.component.html' + templateUrl: 'list-project-ro.component.html', + changeDetection: ChangeDetectionStrategy.OnPush }) export class ListProjectROComponent { @Input() projects: Project[]; - - @Input() totalPage: number; - @Input() totalRecordCount: number; - pageOffset: number = 1; - @Output() paginate = new EventEmitter(); constructor( private searchTrigger: SearchTriggerService, - private router: Router) { } + private router: Router, + private ref: ChangeDetectorRef) { + let hnd = setInterval(()=>ref.markForCheck(), 100); + setTimeout(()=>clearInterval(hnd), 1000); + } goToLink(proId: number): void { this.searchTrigger.closeSearch(true); diff --git a/src/ui_ng/src/app/shared/list-repository-ro/list-repository-ro.component.html b/src/ui_ng/src/app/shared/list-repository-ro/list-repository-ro.component.html index b9c878983..f4b01a4de 100644 --- a/src/ui_ng/src/app/shared/list-repository-ro/list-repository-ro.component.html +++ b/src/ui_ng/src/app/shared/list-repository-ro/list-repository-ro.component.html @@ -2,13 +2,13 @@ {{'REPOSITORY.NAME' | translate}} {{'REPOSITORY.TAGS_COUNT' | translate}} {{'REPOSITORY.PULL_COUNT' | translate}} - + {{r.name || r.repository_name}} {{r.tags_count}} {{r.pull_count}} {{totalRecordCount || (repositories ? repositories.length : 0)}} {{'REPOSITORY.ITEMS' | translate}} - + \ No newline at end of file diff --git a/src/ui_ng/src/app/shared/list-repository-ro/list-repository-ro.component.ts b/src/ui_ng/src/app/shared/list-repository-ro/list-repository-ro.component.ts index 733c5242d..3caaf8772 100644 --- a/src/ui_ng/src/app/shared/list-repository-ro/list-repository-ro.component.ts +++ b/src/ui_ng/src/app/shared/list-repository-ro/list-repository-ro.component.ts @@ -11,7 +11,7 @@ // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. // See the License for the specific language governing permissions and // limitations under the License. -import { Component, Input, Output, EventEmitter } from '@angular/core'; +import { Component, Input, Output, EventEmitter, ChangeDetectionStrategy, ChangeDetectorRef } from '@angular/core'; import { Router, NavigationExtras } from '@angular/router'; import { Repository } from '../../repository/repository'; import { State } from 'clarity-angular'; @@ -20,22 +20,23 @@ import { SearchTriggerService } from '../../base/global-search/search-trigger.se @Component({ selector: 'list-repository-ro', - templateUrl: 'list-repository-ro.component.html' + templateUrl: 'list-repository-ro.component.html', + changeDetection: ChangeDetectionStrategy.OnPush }) export class ListRepositoryROComponent { @Input() projectId: number; @Input() repositories: Repository[]; - @Input() totalPage: number; - @Input() totalRecordCount: number; @Output() paginate = new EventEmitter(); - pageOffset: number = 1; - + constructor( private router: Router, - private searchTrigger: SearchTriggerService - ) { } + private searchTrigger: SearchTriggerService, + private ref: ChangeDetectorRef) { + let hnd = setInterval(()=>ref.markForCheck(), 100); + setTimeout(()=>clearInterval(hnd), 1000); + } refresh(state: State) { if (this.repositories) { diff --git a/src/ui_ng/src/app/shared/shared.utils.ts b/src/ui_ng/src/app/shared/shared.utils.ts index fa64eef16..5e4ca4ffe 100644 --- a/src/ui_ng/src/app/shared/shared.utils.ts +++ b/src/ui_ng/src/app/shared/shared.utils.ts @@ -24,7 +24,6 @@ export const errorHandler = function (error: any): string { if (!error) { return "UNKNOWN_ERROR"; } - console.log(error); if (!(error.statusCode || error.status)) { //treat as string message return '' + error; diff --git a/src/ui_ng/src/app/shared/target-exists-directive.ts b/src/ui_ng/src/app/shared/target-exists-directive.ts index 2adfb47ff..2a08f8655 100644 --- a/src/ui_ng/src/app/shared/target-exists-directive.ts +++ b/src/ui_ng/src/app/shared/target-exists-directive.ts @@ -51,7 +51,6 @@ export class TargetExistsValidatorDirective implements Validator, OnChanges { targetExistsValidator(target: string): ValidatorFn { return (control: AbstractControl): {[key: string]: any} => { - console.log('Target:' + target + ', validate value:' + control.value); switch(target) { case 'PROJECT_NAME': return new Promise(resolve=>{ diff --git a/src/ui_ng/src/app/user/user.component.html b/src/ui_ng/src/app/user/user.component.html index e8ed38f66..61ef73da9 100644 --- a/src/ui_ng/src/app/user/user.component.html +++ b/src/ui_ng/src/app/user/user.component.html @@ -17,7 +17,7 @@ {{'USER.COLUMN_ADMIN' | translate}} {{'USER.COLUMN_EMAIL' | translate}} {{'USER.COLUMN_REG_NAME' | translate}} - + diff --git a/src/ui_ng/src/app/user/user.component.ts b/src/ui_ng/src/app/user/user.component.ts index cd90df25a..7e4c0c010 100644 --- a/src/ui_ng/src/app/user/user.component.ts +++ b/src/ui_ng/src/app/user/user.component.ts @@ -11,7 +11,7 @@ // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. // See the License for the specific language governing permissions and // limitations under the License. -import { Component, OnInit, ViewChild, OnDestroy } from '@angular/core'; +import { Component, OnInit, ViewChild, OnDestroy, ChangeDetectionStrategy, ChangeDetectorRef } from '@angular/core'; import 'rxjs/add/operator/toPromise'; import { Subscription } from 'rxjs/Subscription'; @@ -31,8 +31,8 @@ import { AppConfigService } from '../app-config.service'; selector: 'harbor-user', templateUrl: 'user.component.html', styleUrls: ['user.component.css'], - - providers: [UserService] + providers: [UserService], + changeDetection: ChangeDetectionStrategy.OnPush }) export class UserComponent implements OnInit, OnDestroy { @@ -54,7 +54,8 @@ export class UserComponent implements OnInit, OnDestroy { private deletionDialogService: ConfirmationDialogService, private msgHandler: MessageHandlerService, private session: SessionService, - private appConfigService: AppConfigService) { + private appConfigService: AppConfigService, + private ref: ChangeDetectorRef) { this.deletionSubscription = deletionDialogService.confirmationConfirm$.subscribe(confirmed => { if (confirmed && confirmed.source === ConfirmationTargets.USER && @@ -62,6 +63,8 @@ export class UserComponent implements OnInit, OnDestroy { this.delUser(confirmed.data); } }); + let hnd = setInterval(()=>ref.markForCheck(), 100); + setTimeout(()=>clearInterval(hnd), 1000); } private isMySelf(uid: number): boolean { @@ -132,6 +135,8 @@ export class UserComponent implements OnInit, OnDestroy { }) } }); + let hnd = setInterval(()=>this.ref.markForCheck(), 100); + setTimeout(()=>clearInterval(hnd), 1000); } //Disable the admin role for the specified user @@ -159,6 +164,8 @@ export class UserComponent implements OnInit, OnDestroy { .then(() => { //Change view now user.has_admin_role = updatedUser.has_admin_role; + let hnd = setInterval(()=>this.ref.markForCheck(), 100); + setTimeout(()=>clearInterval(hnd), 1000); }) .catch(error => { this.msgHandler.handleError(error); @@ -195,6 +202,8 @@ export class UserComponent implements OnInit, OnDestroy { this.originalUsers.then(users => { this.users = users.filter(u => u.user_id != user.user_id); this.msgHandler.showSuccess("USER.DELETE_SUCCESS"); + let hnd = setInterval(()=>this.ref.markForCheck(), 100); + setTimeout(()=>clearInterval(hnd), 1000); }); }) .catch(error => { @@ -211,7 +220,6 @@ export class UserComponent implements OnInit, OnDestroy { this.originalUsers = this.userService.getUsers() .then(users => { this.onGoing = false; - this.users = users; return users; }) @@ -219,6 +227,8 @@ export class UserComponent implements OnInit, OnDestroy { this.onGoing = false; this.msgHandler.handleError(error); }); + let hnd = setInterval(()=>this.ref.markForCheck(), 100); + setTimeout(()=>clearInterval(hnd), 1000); } //Add new user