diff --git a/.gitignore b/.gitignore index 298e62bb8..c664afff9 100644 --- a/.gitignore +++ b/.gitignore @@ -29,6 +29,16 @@ src/ui_ng/typings/ **/node_modules **/ssl/ **/proxy.config.json + +src/ui_ng/src/**/*.js +src/ui_ng/src/**/*.js.map +src/ui_ng/src/**/*.json + **/npm*.log + +src/ui_ng/aot/**/*.js +src/ui_ng/aot/**/*.js.map +src/ui_ng/aot/**/*.json + **/*ngsummary.json **/*ngfactory.ts diff --git a/src/ui_ng/package.json b/src/ui_ng/package.json index 0e0eacf60..e13a0c132 100644 --- a/src/ui_ng/package.json +++ b/src/ui_ng/package.json @@ -1,63 +1,70 @@ { - "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/compiler-cli": "^4.0.2", + "@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/platform-server": "^4.0.2", + "@angular/router": "^4.0.1", + "@ngx-translate/core": "^6.0.0", + "@ngx-translate/http-loader": "0.0.3", + "@types/jquery": "^2.0.41", + "@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", + "ngx-cookie": "^1.0.0", + "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", + "rollup": "^0.41.6", + "rollup-plugin-commonjs": "^8.0.2", + "rollup-plugin-node-resolve": "^3.0.0", + "rollup-plugin-uglify": "^1.0.1", + "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/rollup-config.js b/src/ui_ng/rollup-config.js new file mode 100644 index 000000000..11f270504 --- /dev/null +++ b/src/ui_ng/rollup-config.js @@ -0,0 +1,28 @@ +import nodeResolve from 'rollup-plugin-node-resolve'; +import commonjs from 'rollup-plugin-commonjs'; +import uglify from 'rollup-plugin-uglify'; + +export default { + entry: 'src/main-aot.js', + dest: 'src/build.js', // output a single application bundle + sourceMap: false, + format: 'iife', + onwarn: function(warning) { + // Skip certain warnings + + // should intercept ... but doesn't in some rollup versions + if ( warning.code === 'THIS_IS_UNDEFINED' ) { return; } + // intercepts in some rollup versions + if ( typeof warning === 'string' && warning.indexOf("The 'this' keyword is equivalent to 'undefined'") > -1 ) { return; } + + // console.warn everything else + console.warn( warning.message ); + }, + plugins: [ + nodeResolve({jsnext: true, module: true, browser: true}), + commonjs({ + include: ['node_modules/**'] + }), + uglify() + ] +} diff --git a/src/ui_ng/src/app/account/account-settings/account-settings-modal.component.ts b/src/ui_ng/src/app/account/account-settings/account-settings-modal.component.ts index 4ad0d15d6..83d8ed672 100644 --- a/src/ui_ng/src/app/account/account-settings/account-settings-modal.component.ts +++ b/src/ui_ng/src/app/account/account-settings/account-settings-modal.component.ts @@ -31,21 +31,21 @@ export class AccountSettingsModalComponent implements OnInit, AfterViewChecked { account: SessionUser; error: any = null; originalStaticData: SessionUser; - private emailTooltip: string = 'TOOLTIP.EMAIL'; + emailTooltip: string = 'TOOLTIP.EMAIL'; private validationStateMap: any = { "account_settings_email": true, "account_settings_full_name": true }; - private mailAlreadyChecked = {}; + mailAlreadyChecked = {}; - private isOnCalling: boolean = false; - private formValueChanged: boolean = false; - private checkOnGoing: boolean = false; + isOnCalling: boolean = false; + formValueChanged: boolean = false; + checkOnGoing: boolean = false; accountFormRef: NgForm; @ViewChild("accountSettingsFrom") accountForm: NgForm; @ViewChild(InlineAlertComponent) - private inlineAlert: InlineAlertComponent; + inlineAlert: InlineAlertComponent; constructor( private session: SessionService, @@ -56,11 +56,11 @@ export class AccountSettingsModalComponent implements OnInit, AfterViewChecked { this.account = Object.assign({}, this.session.getCurrentUser()); } - private getValidationState(key: string): boolean { + getValidationState(key: string): boolean { return this.validationStateMap[key]; } - private handleValidation(key: string, flag: boolean): void { + handleValidation(key: string, flag: boolean): void { if (flag) { //Checking let cont = this.accountForm.controls[key]; @@ -104,7 +104,7 @@ export class AccountSettingsModalComponent implements OnInit, AfterViewChecked { } } - private isUserDataChange(): boolean { + isUserDataChange(): boolean { if (!this.originalStaticData || !this.account) { return false; } @@ -215,7 +215,7 @@ export class AccountSettingsModalComponent implements OnInit, AfterViewChecked { }); } - confirmCancel(): void { + confirmCancel($event: any): void { this.inlineAlert.close(); this.opened = false; } diff --git a/src/ui_ng/src/app/account/password/forgot-password.component.ts b/src/ui_ng/src/app/account/password/forgot-password.component.ts index 103d81647..0b0c408ab 100644 --- a/src/ui_ng/src/app/account/password/forgot-password.component.ts +++ b/src/ui_ng/src/app/account/password/forgot-password.component.ts @@ -25,14 +25,14 @@ import { InlineAlertComponent } from '../../shared/inline-alert/inline-alert.com }) export class ForgotPasswordComponent { opened: boolean = false; - private onGoing: boolean = false; - private email: string = ""; - private validationState: boolean = true; - private isSuccess: boolean = false; + onGoing: boolean = false; + email: string = ""; + validationState: boolean = true; + isSuccess: boolean = false; @ViewChild("forgotPasswordFrom") forgotPwdForm: NgForm; @ViewChild(InlineAlertComponent) - private inlineAlert: InlineAlertComponent; + inlineAlert: InlineAlertComponent; constructor(private pwdService: PasswordSettingService) { } diff --git a/src/ui_ng/src/app/account/password/password-setting.component.ts b/src/ui_ng/src/app/account/password/password-setting.component.ts index 8ce325afc..846de87fa 100644 --- a/src/ui_ng/src/app/account/password/password-setting.component.ts +++ b/src/ui_ng/src/app/account/password/password-setting.component.ts @@ -33,8 +33,8 @@ export class PasswordSettingComponent implements AfterViewChecked { reNewPwd: string = ""; error: any = null; - private formValueChanged: boolean = false; - private onCalling: boolean = false; + formValueChanged: boolean = false; + onCalling: boolean = false; private validationStateMap: any = { "newPassword": true, "reNewPassword": true @@ -43,7 +43,7 @@ export class PasswordSettingComponent implements AfterViewChecked { pwdFormRef: NgForm; @ViewChild("changepwdForm") pwdForm: NgForm; @ViewChild(InlineAlertComponent) - private inlineAlert: InlineAlertComponent; + inlineAlert: InlineAlertComponent; constructor( private passwordService: PasswordSettingService, @@ -68,11 +68,11 @@ export class PasswordSettingComponent implements AfterViewChecked { return this.onCalling; } - private getValidationState(key: string): boolean { + getValidationState(key: string): boolean { return this.validationStateMap[key]; } - private handleValidation(key: string, flag: boolean): void { + handleValidation(key: string, flag: boolean): void { if (flag) { //Checking let cont = this.pwdForm.controls[key]; @@ -139,7 +139,7 @@ export class PasswordSettingComponent implements AfterViewChecked { } } - confirmCancel(): void { + confirmCancel($event: any): void { this.opened = false; } diff --git a/src/ui_ng/src/app/account/password/password-setting.service.ts b/src/ui_ng/src/app/account/password/password-setting.service.ts index 36be3dde0..5247109b5 100644 --- a/src/ui_ng/src/app/account/password/password-setting.service.ts +++ b/src/ui_ng/src/app/account/password/password-setting.service.ts @@ -23,11 +23,11 @@ const resetPasswordEndpoint = "/reset"; @Injectable() export class PasswordSettingService { - private headers: Headers = new Headers({ + headers: Headers = new Headers({ "Accept": 'application/json', "Content-Type": 'application/json' }); - private options: RequestOptions = new RequestOptions({ + options: RequestOptions = new RequestOptions({ 'headers': this.headers }); diff --git a/src/ui_ng/src/app/account/password/reset-password.component.ts b/src/ui_ng/src/app/account/password/reset-password.component.ts index 48bc17878..079050a82 100644 --- a/src/ui_ng/src/app/account/password/reset-password.component.ts +++ b/src/ui_ng/src/app/account/password/reset-password.component.ts @@ -27,19 +27,19 @@ import { CommonRoutes } from '../../shared/shared.const'; }) export class ResetPasswordComponent implements OnInit { opened: boolean = true; - private onGoing: boolean = false; - private password: string = ""; + onGoing: boolean = false; + password: string = ""; private validationState: any = { "newPassword": true, "reNewPassword": true }; - private resetUuid: string = ""; - private resetOk: boolean = false; + resetUuid: string = ""; + resetOk: boolean = false; confirmPwd: string = ""; @ViewChild("resetPwdForm") resetPwdForm: NgForm; @ViewChild(InlineAlertComponent) - private inlineAlert: InlineAlertComponent; + inlineAlert: InlineAlertComponent; constructor( private pwdService: PasswordSettingService, @@ -131,7 +131,7 @@ export class ResetPasswordComponent implements OnInit { } } - private getControlValidationState(key: string): boolean { + getControlValidationState(key: string): boolean { if (this.resetPwdForm) { let control = this.resetPwdForm.controls[key]; if (control) { @@ -142,7 +142,7 @@ export class ResetPasswordComponent implements OnInit { return false; } - private samePassword(): boolean { + samePassword(): boolean { if (this.resetPwdForm) { let control1 = this.resetPwdForm.controls["newPassword"]; let control2 = this.resetPwdForm.controls["reNewPassword"]; diff --git a/src/ui_ng/src/app/account/sign-in/sign-in.component.ts b/src/ui_ng/src/app/account/sign-in/sign-in.component.ts index 18712016b..8ffc68695 100644 --- a/src/ui_ng/src/app/account/sign-in/sign-in.component.ts +++ b/src/ui_ng/src/app/account/sign-in/sign-in.component.ts @@ -27,7 +27,7 @@ import { AppConfigService } from '../../app-config.service'; import { AppConfig } from '../../app-config'; import { User } from '../../user/user'; -import { CookieService, CookieOptions } from 'angular2-cookie/core'; +import { CookieService, CookieOptions } from 'ngx-cookie'; //Define status flags for signing in states export const signInStatusNormal = 0; @@ -43,11 +43,11 @@ const expireDays = 10; }) export class SignInComponent implements AfterViewChecked, OnInit { - private redirectUrl: string = ""; - private appConfig: AppConfig = new AppConfig(); + redirectUrl: string = ""; + appConfig: AppConfig = new AppConfig(); //Remeber me indicator - private rememberMe: boolean = false; - private rememberedName: string = ""; + rememberMe: boolean = false; + rememberedName: string = ""; //Form reference signInForm: NgForm; @ViewChild('signInForm') currentForm: NgForm; @@ -126,7 +126,7 @@ export class SignInComponent implements AfterViewChecked, OnInit { return this.appConfig.auth_mode != 'ldap_auth'; } - private clickRememberMe($event): void { + clickRememberMe($event: any): void { if ($event && $event.target) { this.rememberMe = $event.target.checked; if (!this.rememberMe) { @@ -137,23 +137,23 @@ export class SignInComponent implements AfterViewChecked, OnInit { } } - private remeberMe(): void { + remeberMe(): void { if (this.rememberMe) { if (this.rememberedName != this.signInCredential.principal) { //Set expire time let expires: number = expireDays * 3600 * 24 * 1000; let date = new Date(Date.now() + expires); - let cookieptions = new CookieOptions({ + let cookieptions: CookieOptions = { path: "/", expires: date - }); + }; this.cookie.put(remCookieKey, this.signInCredential.principal, cookieptions); } } } //General error handler - private handleError(error) { + handleError(error: any) { //Set error status this.signInStatus = signInStatusError; @@ -162,7 +162,7 @@ export class SignInComponent implements AfterViewChecked, OnInit { } //Hande form values changes - private formChanged() { + formChanged() { if (this.currentForm === this.signInForm) { return; } @@ -177,7 +177,7 @@ export class SignInComponent implements AfterViewChecked, OnInit { } //Fill the new user info into the sign in form - private handleUserCreation(user: User): void { + handleUserCreation(user: User): void { if (user) { this.currentForm.setValue({ "login_username": user.username, diff --git a/src/ui_ng/src/app/account/sign-in/sign-in.service.ts b/src/ui_ng/src/app/account/sign-in/sign-in.service.ts index 672b864a0..b99dee504 100644 --- a/src/ui_ng/src/app/account/sign-in/sign-in.service.ts +++ b/src/ui_ng/src/app/account/sign-in/sign-in.service.ts @@ -27,14 +27,14 @@ const signInUrl = '/login'; */ @Injectable() export class SignInService { - private headers = new Headers({ + headers = new Headers({ "Content-Type": 'application/x-www-form-urlencoded' }); constructor(private http: Http) {} //Handle the related exceptions - private handleError(error: any): Promise{ + handleError(error: any): Promise{ return Promise.reject(error.message || error); } diff --git a/src/ui_ng/src/app/account/sign-up/sign-up-page.component.ts b/src/ui_ng/src/app/account/sign-up/sign-up-page.component.ts index 53c9b28da..fd05edb70 100644 --- a/src/ui_ng/src/app/account/sign-up/sign-up-page.component.ts +++ b/src/ui_ng/src/app/account/sign-up/sign-up-page.component.ts @@ -29,9 +29,9 @@ import { MessageService } from '../../global-message/message.service'; templateUrl: "sign-up-page.component.html" }) export class SignUpPageComponent implements OnInit { - private error: any; - private onGoing: boolean = false; - private formValueChanged: boolean = false; + error: any; + onGoing: boolean = false; + formValueChanged: boolean = false; constructor( private userService: UserService, @@ -39,9 +39,9 @@ export class SignUpPageComponent implements OnInit { private router: Router) { } @ViewChild(NewUserFormComponent) - private newUserForm: NewUserFormComponent; + newUserForm: NewUserFormComponent; - private getNewUser(): User { + getNewUser(): User { return this.newUserForm.getData(); } diff --git a/src/ui_ng/src/app/account/sign-up/sign-up.component.ts b/src/ui_ng/src/app/account/sign-up/sign-up.component.ts index f29900d3e..c2eae33a5 100644 --- a/src/ui_ng/src/app/account/sign-up/sign-up.component.ts +++ b/src/ui_ng/src/app/account/sign-up/sign-up.component.ts @@ -30,9 +30,9 @@ import { Modal } from 'clarity-angular'; export class SignUpComponent { opened: boolean = false; staticBackdrop: boolean = true; - private error: any; - private onGoing: boolean = false; - private formValueChanged: boolean = false; + error: any; + onGoing: boolean = false; + formValueChanged: boolean = false; @Output() userCreation = new EventEmitter(); @@ -41,15 +41,15 @@ export class SignUpComponent { private userService: UserService) { } @ViewChild(NewUserFormComponent) - private newUserForm: NewUserFormComponent; + newUserForm: NewUserFormComponent; @ViewChild(InlineAlertComponent) - private inlienAlert: InlineAlertComponent; + inlienAlert: InlineAlertComponent; @ViewChild(Modal) - private modal: Modal; + modal: Modal; - private getNewUser(): User { + getNewUser(): User { return this.newUserForm.getData(); } @@ -97,7 +97,7 @@ export class SignUpComponent { } } - confirmCancel(): void { + confirmCancel($event: any): void { this.opened = false; this.modal.close(); } diff --git a/src/ui_ng/src/app/app-config.service.ts b/src/ui_ng/src/app/app-config.service.ts index fce8998e3..0d73856b0 100644 --- a/src/ui_ng/src/app/app-config.service.ts +++ b/src/ui_ng/src/app/app-config.service.ts @@ -16,7 +16,7 @@ import { Headers, Http, RequestOptions } from '@angular/http'; import 'rxjs/add/operator/toPromise'; import { AppConfig } from './app-config'; -import { CookieService } from 'angular2-cookie/core'; +import { CookieService } from 'ngx-cookie'; import { CookieKeyOfAdmiral, HarborQueryParamKey } from './shared/shared.const'; import { maintainUrlQueryParmas } from './shared/shared.utils'; @@ -30,15 +30,15 @@ export const systemInfoEndpoint = "/api/systeminfo"; */ @Injectable() export class AppConfigService { - private headers = new Headers({ + headers = new Headers({ "Content-Type": 'application/json' }); - private options = new RequestOptions({ + options = new RequestOptions({ headers: this.headers }); //Store the application configuration - private configurations: AppConfig = new AppConfig(); + configurations: AppConfig = new AppConfig(); constructor( private http: Http, diff --git a/src/ui_ng/src/app/app.component.ts b/src/ui_ng/src/app/app.component.ts index b80c566d4..966e97db4 100644 --- a/src/ui_ng/src/app/app.component.ts +++ b/src/ui_ng/src/app/app.component.ts @@ -13,7 +13,7 @@ // limitations under the License. import { Component, ReflectiveInjector, LOCALE_ID } from '@angular/core'; import { TranslateService } from '@ngx-translate/core'; -import { CookieService } from 'angular2-cookie/core'; +import { CookieService } from 'ngx-cookie'; import { supportedLangs, enLang } from './shared/shared.const'; import { SessionService } from './shared/session.service'; @@ -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"; @@ -57,7 +56,7 @@ export class AppComponent { }); } - private isLangMatch(browserLang: string, supportedLangs: string[]) { + isLangMatch(browserLang: string, supportedLangs: string[]) { if (supportedLangs && supportedLangs.length > 0) { return supportedLangs.find(lang => lang === browserLang); } diff --git a/src/ui_ng/src/app/base/global-search/global-search.component.ts b/src/ui_ng/src/app/base/global-search/global-search.component.ts index 6e68f025a..942ca9b85 100644 --- a/src/ui_ng/src/app/base/global-search/global-search.component.ts +++ b/src/ui_ng/src/app/base/global-search/global-search.component.ts @@ -32,15 +32,15 @@ const deBounceTime = 500; //ms }) export class GlobalSearchComponent implements OnInit, OnDestroy { //Keep search term as Subject - private searchTerms = new Subject(); + searchTerms = new Subject(); //Keep subscription for future use - private searchSub: Subscription; - private closeSub: Subscription; + searchSub: Subscription; + closeSub: Subscription; //To indicate if the result panel is opened - private isResPanelOpened: boolean = false; - private searchTerm: string = ""; + isResPanelOpened: boolean = false; + searchTerm: string = ""; //Placeholder text placeholderText: string = "GLOBAL_SEARCH.PLACEHOLDER"; diff --git a/src/ui_ng/src/app/base/global-search/global-search.service.ts b/src/ui_ng/src/app/base/global-search/global-search.service.ts index 1ef70b3fc..e3a81b284 100644 --- a/src/ui_ng/src/app/base/global-search/global-search.service.ts +++ b/src/ui_ng/src/app/base/global-search/global-search.service.ts @@ -27,10 +27,10 @@ const searchEndpoint = "/api/search"; */ @Injectable() export class GlobalSearchService { - private headers = new Headers({ + headers = new Headers({ "Content-Type": 'application/json' }); - private options = new RequestOptions({ + options = new RequestOptions({ headers: this.headers }); diff --git a/src/ui_ng/src/app/base/global-search/search-result.component.ts b/src/ui_ng/src/app/base/global-search/search-result.component.ts index 2bf2d5fe2..2dc80c4c4 100644 --- a/src/ui_ng/src/app/base/global-search/search-result.component.ts +++ b/src/ui_ng/src/app/base/global-search/search-result.component.ts @@ -30,22 +30,22 @@ import { MessageHandlerService } from '../../shared/message-handler/message-hand }) export class SearchResultComponent implements OnInit, OnDestroy { - private searchResults: SearchResults = new SearchResults(); - private originalCopy: SearchResults; + searchResults: SearchResults = new SearchResults(); + originalCopy: SearchResults; - private currentTerm: string = ""; + currentTerm: string = ""; //Open or close - private stateIndicator: boolean = false; + stateIndicator: boolean = false; //Search in progress - private onGoing: boolean = false; + onGoing: boolean = false; //Whether or not mouse point is onto the close indicator - private mouseOn: boolean = false; + mouseOn: boolean = false; //Watch message channel - private searchSub: Subscription; - private closeSearchSub: Subscription; + searchSub: Subscription; + closeSearchSub: Subscription; constructor( private search: GlobalSearchService, @@ -71,7 +71,7 @@ export class SearchResultComponent implements OnInit, OnDestroy { } } - private clone(src: SearchResults): SearchResults { + clone(src: SearchResults): SearchResults { let res: SearchResults = new SearchResults(); if (src) { diff --git a/src/ui_ng/src/app/base/global-search/search-trigger.service.ts b/src/ui_ng/src/app/base/global-search/search-trigger.service.ts index eb41747ea..573fc8bcc 100644 --- a/src/ui_ng/src/app/base/global-search/search-trigger.service.ts +++ b/src/ui_ng/src/app/base/global-search/search-trigger.service.ts @@ -18,9 +18,9 @@ import { AlertType } from '../../shared/shared.const'; @Injectable() export class SearchTriggerService { - private searchTriggerSource = new Subject(); - private searchCloseSource = new Subject(); - private searchClearSource = new Subject(); + searchTriggerSource = new Subject(); + searchCloseSource = new Subject(); + searchClearSource = new Subject(); searchTriggerChan$ = this.searchTriggerSource.asObservable(); searchCloseChan$ = this.searchCloseSource.asObservable(); @@ -37,7 +37,7 @@ export class SearchTriggerService { } //Clear search term - clear(event): void { + clear(event: any): void { this.searchClearSource.next(event); } diff --git a/src/ui_ng/src/app/base/harbor-shell/harbor-shell.component.ts b/src/ui_ng/src/app/base/harbor-shell/harbor-shell.component.ts index f4d05d7bb..55f89969b 100644 --- a/src/ui_ng/src/app/base/harbor-shell/harbor-shell.component.ts +++ b/src/ui_ng/src/app/base/harbor-shell/harbor-shell.component.ts @@ -39,23 +39,23 @@ import { CommonRoutes } from '../../shared/shared.const'; export class HarborShellComponent implements OnInit, OnDestroy { @ViewChild(AccountSettingsModalComponent) - private accountSettingsModal: AccountSettingsModalComponent; + accountSettingsModal: AccountSettingsModalComponent; @ViewChild(PasswordSettingComponent) - private pwdSetting: PasswordSettingComponent; + pwdSetting: PasswordSettingComponent; @ViewChild(NavigatorComponent) - private navigator: NavigatorComponent; + navigator: NavigatorComponent; @ViewChild(AboutDialogComponent) - private aboutDialog: AboutDialogComponent; + aboutDialog: AboutDialogComponent; //To indicator whwther or not the search results page is displayed //We need to use this property to do some overriding work - private isSearchResultsOpened: boolean = false; + isSearchResultsOpened: boolean = false; - private searchSub: Subscription; - private searchCloseSub: Subscription; + searchSub: Subscription; + searchCloseSub: Subscription; constructor( private route: ActivatedRoute, diff --git a/src/ui_ng/src/app/base/navigator/navigator.component.ts b/src/ui_ng/src/app/base/navigator/navigator.component.ts index 0800638e5..c041b834f 100644 --- a/src/ui_ng/src/app/base/navigator/navigator.component.ts +++ b/src/ui_ng/src/app/base/navigator/navigator.component.ts @@ -20,7 +20,7 @@ import { modalEvents } from '../modal-events.const'; import { SessionUser } from '../../shared/session-user'; import { SessionService } from '../../shared/session.service'; -import { CookieService, CookieOptions } from 'angular2-cookie/core'; +import { CookieService, CookieOptions } from 'ngx-cookie'; import { supportedLangs, enLang, languageNames, CommonRoutes } from '../../shared/shared.const'; import { AppConfigService } from '../../app-config.service'; @@ -38,8 +38,8 @@ export class NavigatorComponent implements OnInit { @Output() showAccountSettingsModal = new EventEmitter(); @Output() showPwdChangeModal = new EventEmitter(); - private selectedLang: string = enLang; - private appTitle: string = 'APP_TITLE.HARBOR'; + selectedLang: string = enLang; + appTitle: string = 'APP_TITLE.HARBOR'; constructor( private session: SessionService, @@ -54,10 +54,10 @@ export class NavigatorComponent implements OnInit { ngOnInit(): void { this.selectedLang = this.translate.currentLang; - this.translate.onLangChange.subscribe(langChange => { + this.translate.onLangChange.subscribe((langChange: {lang: string}) => { this.selectedLang = langChange.lang; //Keep in cookie for next use - let opt = new CookieOptions({path: '/', expires: new Date(Date.now() + 3600*1000*24*31)}); + let opt:CookieOptions = {path: '/', expires: new Date(Date.now() + 3600*1000*24*31)}; this.cookie.put("harbor-lang", langChange.lang, opt); }); if (this.appConfigService.isIntegrationMode()) { diff --git a/src/ui_ng/src/app/base/start-page/start.component.ts b/src/ui_ng/src/app/base/start-page/start.component.ts index b6a2eb7e8..083dff8fc 100644 --- a/src/ui_ng/src/app/base/start-page/start.component.ts +++ b/src/ui_ng/src/app/base/start-page/start.component.ts @@ -22,7 +22,7 @@ import { SessionUser } from '../../shared/session-user'; styleUrls: ['start.component.css'] }) export class StartPageComponent implements OnInit{ - private isSessionValid: boolean = false; + isSessionValid: boolean = false; constructor( private session: SessionService diff --git a/src/ui_ng/src/app/config/auth/config-auth.component.ts b/src/ui_ng/src/app/config/auth/config-auth.component.ts index ff5397995..376e0f1e0 100644 --- a/src/ui_ng/src/app/config/auth/config-auth.component.ts +++ b/src/ui_ng/src/app/config/auth/config-auth.component.ts @@ -23,7 +23,7 @@ import { Configuration } from '../config'; styleUrls: ['../config.component.css'] }) export class ConfigurationAuthComponent { - private changeSub: Subscription; + changeSub: Subscription; @Input("ldapConfig") currentConfig: Configuration = new Configuration(); @ViewChild("authConfigFrom") authForm: NgForm; @@ -44,7 +44,7 @@ export class ConfigurationAuthComponent { } } - private disabled(prop: any): boolean { + disabled(prop: any): boolean { return !(prop && prop.editable); } @@ -52,7 +52,7 @@ export class ConfigurationAuthComponent { return this.authForm && this.authForm.valid; } - private handleOnChange($event): void { + handleOnChange($event: any): void { if ($event && $event.target && $event.target["value"]) { let authMode = $event.target["value"]; if (authMode === 'ldap_auth') { diff --git a/src/ui_ng/src/app/config/config.component.ts b/src/ui_ng/src/app/config/config.component.ts index 091adfa30..b84e170d6 100644 --- a/src/ui_ng/src/app/config/config.component.ts +++ b/src/ui_ng/src/app/config/config.component.ts @@ -44,13 +44,13 @@ const TabLinkContentMap = { styleUrls: ['config.component.css'] }) export class ConfigurationComponent implements OnInit, OnDestroy { - private onGoing: boolean = false; + onGoing: boolean = false; allConfig: Configuration = new Configuration(); - private currentTabId: string = "config-auth";//default tab - private originalCopy: Configuration; - private confirmSub: Subscription; - private testingMailOnGoing: boolean = false; - private testingLDAPOnGoing: boolean = false; + currentTabId: string = "config-auth";//default tab + originalCopy: Configuration; + confirmSub: Subscription; + testingMailOnGoing: boolean = false; + testingLDAPOnGoing: boolean = false; @ViewChild("repoConfigFrom") repoConfigForm: NgForm; @ViewChild("systemConfigFrom") systemConfigForm: NgForm; @@ -64,15 +64,15 @@ export class ConfigurationComponent implements OnInit, OnDestroy { private appConfigService: AppConfigService, private session: SessionService) { } - private isCurrentTabLink(tabId: string): boolean { + isCurrentTabLink(tabId: string): boolean { return this.currentTabId === tabId; } - private isCurrentTabContent(contentId: string): boolean { + isCurrentTabContent(contentId: string): boolean { return TabLinkContentMap[this.currentTabId] === contentId; } - private hasUnsavedChangesOfCurrentTab(): any { + hasUnsavedChangesOfCurrentTab(): any { let allChanges = this.getChanges(); if (this.isEmpty(allChanges)) { return null; @@ -331,7 +331,7 @@ export class ConfigurationComponent implements OnInit, OnDestroy { }); } - private confirmUnsavedChanges(changes: any) { + confirmUnsavedChanges(changes: any) { let msg = new ConfirmationMessage( "CONFIG.CONFIRM_TITLE", "CONFIG.CONFIRM_SUMMARY", @@ -343,7 +343,7 @@ export class ConfigurationComponent implements OnInit, OnDestroy { this.confirmService.openComfirmDialog(msg); } - private confirmUnsavedTabChanges(changes: any, tabId: string) { + confirmUnsavedTabChanges(changes: any, tabId: string) { let msg = new ConfirmationMessage( "CONFIG.CONFIRM_TITLE", "CONFIG.CONFIRM_SUMMARY", @@ -358,7 +358,7 @@ export class ConfigurationComponent implements OnInit, OnDestroy { this.confirmService.openComfirmDialog(msg); } - private retrieveConfig(): void { + retrieveConfig(): void { this.onGoing = true; this.configService.getConfiguration() .then(configurations => { @@ -387,7 +387,7 @@ export class ConfigurationComponent implements OnInit, OnDestroy { * * @memberOf ConfigurationComponent */ - private getChanges(): any { + getChanges(): any { let changes = {}; if (!this.allConfig || !this.originalCopy) { return changes; @@ -419,7 +419,7 @@ export class ConfigurationComponent implements OnInit, OnDestroy { * * @memberOf ConfigurationComponent */ - private clone(src: Configuration): Configuration { + clone(src: Configuration): Configuration { let dest = new Configuration(); if (!src) { return dest;//Empty @@ -443,7 +443,7 @@ export class ConfigurationComponent implements OnInit, OnDestroy { * * @memberOf ConfigurationComponent */ - private reset(changes: any): void { + reset(changes: any): void { if (!this.isEmpty(changes)) { for (let prop in changes) { if (this.originalCopy[prop]) { @@ -456,7 +456,7 @@ export class ConfigurationComponent implements OnInit, OnDestroy { } } - private isEmpty(obj) { + isEmpty(obj: any) { for (let key in obj) { if (obj.hasOwnProperty(key)) return false; @@ -464,7 +464,7 @@ export class ConfigurationComponent implements OnInit, OnDestroy { return true; } - private disabled(prop: any): boolean { + disabled(prop: any): boolean { return !(prop && prop.editable); } } \ No newline at end of file diff --git a/src/ui_ng/src/app/config/config.service.ts b/src/ui_ng/src/app/config/config.service.ts index 2c1761d64..34d41d0c1 100644 --- a/src/ui_ng/src/app/config/config.service.ts +++ b/src/ui_ng/src/app/config/config.service.ts @@ -23,11 +23,11 @@ const ldapEndpoint = "/api/ldap/ping"; @Injectable() export class ConfigurationService { - private headers: Headers = new Headers({ + headers: Headers = new Headers({ "Accept": 'application/json', "Content-Type": 'application/json' }); - private options: RequestOptions = new RequestOptions({ + options: RequestOptions = new RequestOptions({ 'headers': this.headers }); diff --git a/src/ui_ng/src/app/config/email/config-email.component.ts b/src/ui_ng/src/app/config/email/config-email.component.ts index 329790b9c..683573448 100644 --- a/src/ui_ng/src/app/config/email/config-email.component.ts +++ b/src/ui_ng/src/app/config/email/config-email.component.ts @@ -28,7 +28,7 @@ export class ConfigurationEmailComponent { constructor() { } - private disabled(prop: any): boolean { + disabled(prop: any): boolean { return !(prop && prop.editable); } diff --git a/src/ui_ng/src/app/core/core.module.ts b/src/ui_ng/src/app/core/core.module.ts index aebfbe6ab..04794a393 100644 --- a/src/ui_ng/src/app/core/core.module.ts +++ b/src/ui_ng/src/app/core/core.module.ts @@ -15,20 +15,25 @@ 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'; +import { CookieModule } from 'ngx-cookie'; @NgModule({ imports: [ BrowserModule, FormsModule, HttpModule, - ClarityModule.forRoot() + ClarityModule.forRoot(), + CookieModule.forRoot(), + BrowserAnimationsModule ], exports: [ BrowserModule, FormsModule, HttpModule, - ClarityModule + ClarityModule, + BrowserAnimationsModule ] }) export class CoreModule { diff --git a/src/ui_ng/src/app/global-message/message.component.ts b/src/ui_ng/src/app/global-message/message.component.ts index ddfa61bf3..d551e35bb 100644 --- a/src/ui_ng/src/app/global-message/message.component.ts +++ b/src/ui_ng/src/app/global-message/message.component.ts @@ -31,11 +31,11 @@ export class MessageComponent implements OnInit, OnDestroy { globalMessage: Message = new Message(); globalMessageOpened: boolean; messageText: string = ""; - private timer: any = null; + timer: any = null; - private appLevelMsgSub: Subscription; - private msgSub: Subscription; - private clearSub: Subscription; + appLevelMsgSub: Subscription; + msgSub: Subscription; + clearSub: Subscription; constructor( private messageService: MessageService, diff --git a/src/ui_ng/src/app/global-message/message.service.ts b/src/ui_ng/src/app/global-message/message.service.ts index d9a292787..153371218 100644 --- a/src/ui_ng/src/app/global-message/message.service.ts +++ b/src/ui_ng/src/app/global-message/message.service.ts @@ -19,9 +19,9 @@ import { AlertType } from '../shared/shared.const'; @Injectable() export class MessageService { - private messageAnnouncedSource = new Subject(); - private appLevelAnnouncedSource = new Subject(); - private clearSource = new Subject(); + messageAnnouncedSource = new Subject(); + appLevelAnnouncedSource = new Subject(); + clearSource = new Subject(); messageAnnounced$ = this.messageAnnouncedSource.asObservable(); appLevelAnnounced$ = this.appLevelAnnouncedSource.asObservable(); 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/audit-log.service.ts b/src/ui_ng/src/app/log/audit-log.service.ts index c5c90182e..b88a8017b 100644 --- a/src/ui_ng/src/app/log/audit-log.service.ts +++ b/src/ui_ng/src/app/log/audit-log.service.ts @@ -25,7 +25,7 @@ export const logEndpoint = "/api/logs"; @Injectable() export class AuditLogService { - private httpOptions = new RequestOptions({ + httpOptions = new RequestOptions({ headers: new Headers({ "Content-Type": 'application/json', "Accept": 'application/json' 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/log/recent-log.component.ts b/src/ui_ng/src/app/log/recent-log.component.ts index bf618e494..f902c19a1 100644 --- a/src/ui_ng/src/app/log/recent-log.component.ts +++ b/src/ui_ng/src/app/log/recent-log.component.ts @@ -30,11 +30,11 @@ import { errorHandler, accessErrorHandler } from '../shared/shared.utils'; }) export class RecentLogComponent implements OnInit { - private sessionUser: SessionUser = null; - private recentLogs: AuditLog[]; - private logsCache: AuditLog[]; - private onGoing: boolean = false; - private lines: number = 10; //Support 10, 25 and 50 + sessionUser: SessionUser = null; + recentLogs: AuditLog[]; + logsCache: AuditLog[]; + onGoing: boolean = false; + lines: number = 10; //Support 10, 25 and 50 currentTerm: string; constructor( @@ -48,7 +48,7 @@ export class RecentLogComponent implements OnInit { this.retrieveLogs(); } - private handleOnchange($event: any) { + handleOnchange($event: any) { this.currentTerm = ''; if ($event && $event.target && $event.target["value"]) { this.lines = $event.target["value"]; @@ -80,7 +80,7 @@ export class RecentLogComponent implements OnInit { this.retrieveLogs(); } - private retrieveLogs(): void { + retrieveLogs(): void { if (this.lines < 10) { this.lines = 10; } @@ -102,7 +102,7 @@ export class RecentLogComponent implements OnInit { ); } - private isMatched(terms: string, log: AuditLog): boolean { + isMatched(terms: string, log: AuditLog): boolean { let reg = new RegExp('.*' + terms + '.*', 'i'); return reg.test(log.username) || reg.test(log.repo_name) || diff --git a/src/ui_ng/src/app/project/create-project/create-project.component.ts b/src/ui_ng/src/app/project/create-project/create-project.component.ts index 4174157c3..1643e83d4 100644 --- a/src/ui_ng/src/app/project/create-project/create-project.component.ts +++ b/src/ui_ng/src/app/project/create-project/create-project.component.ts @@ -47,7 +47,7 @@ export class CreateProjectComponent implements AfterViewChecked { @Output() create = new EventEmitter(); @ViewChild(InlineAlertComponent) - private inlineAlert: InlineAlertComponent; + inlineAlert: InlineAlertComponent; constructor(private projectService: ProjectService, private translateService: TranslateService, 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..da18a7f7d 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}} - + @@ -17,7 +17,7 @@ {{p.creation_time | date: 'short'}} - {{totalRecordCount || (projects ? projects.length : 0)}} {{'PROJECT.ITEMS' | translate}} - + {{(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..a69ac692c 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,14 +41,15 @@ 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 { members: Member[]; projectId: number; roleInfo = RoleInfo; - private delSub: Subscription; + delSub: Subscription; @ViewChild(AddMemberComponent) addMemberComponent: AddMemberComponent; @@ -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, ''); } @@ -122,7 +124,7 @@ export class MemberComponent implements OnInit, OnDestroy { this.addMemberComponent.openAddMemberModal(); } - addedMember() { + addedMember($event: any) { this.searchMember = ''; 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) @@ -153,7 +154,7 @@ export class MemberComponent implements OnInit, OnDestroy { this.deletionDialogService.openComfirmDialog(deletionMessage); } - doSearch(searchMember) { + doSearch(searchMember: string) { this.searchMember = searchMember; this.retrieve(this.projectId, this.searchMember); } 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..2b9c075b0 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 && @@ -55,7 +57,7 @@ export class DestinationComponent implements OnInit { .subscribe( response => { this.messageHandlerService.showSuccess('DESTINATION.DELETED_SUCCESS'); - this.reload(); + this.reload(''); }, error => { if(error && error.status === 412) { @@ -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) ); } @@ -97,7 +105,7 @@ export class DestinationComponent implements OnInit { this.retrieve(''); } - reload() { + reload($event: any) { this.targetName = ''; this.retrieve(''); } @@ -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..a438028d2 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}} - + @@ -11,7 +11,7 @@ {{r.pull_count}} - {{totalRecordCount || (repositories ? repositories.length : 0)}} {{'REPOSITORY.ITEMS' | translate}} - + {{(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..37f32ea5a 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 { @@ -58,7 +59,7 @@ export class TagRepositoryComponent implements OnInit, OnDestroy { selectAll: boolean = false; - private subscription: Subscription; + subscription: Subscription; constructor( private route: ActivatedRoute, @@ -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) ); @@ -132,7 +133,7 @@ export class TagRepositoryComponent implements OnInit, OnDestroy { } } - private listTags(tags: Tag[]): void { + listTags(tags: Tag[]): void { tags.forEach(t => { let tag = new TagView(); tag.tag = t.tag; @@ -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) { @@ -187,7 +190,7 @@ export class TagRepositoryComponent implements OnInit, OnDestroy { this.showTagManifestOpened = true; } } - selectAndCopy($event) { + selectAndCopy($event: any) { $event.target.select(); } } \ No newline at end of file diff --git a/src/ui_ng/src/app/repository/top-repo/top-repo.component.ts b/src/ui_ng/src/app/repository/top-repo/top-repo.component.ts index f53d3a98b..021b19a32 100644 --- a/src/ui_ng/src/app/repository/top-repo/top-repo.component.ts +++ b/src/ui_ng/src/app/repository/top-repo/top-repo.component.ts @@ -27,7 +27,7 @@ import { Repository } from '../repository'; providers: [TopRepoService] }) export class TopRepoComponent implements OnInit{ - private topRepos: Repository[] = []; + topRepos: Repository[] = []; constructor( private topRepoService: TopRepoService, diff --git a/src/ui_ng/src/app/repository/top-repo/top-repository.service.ts b/src/ui_ng/src/app/repository/top-repo/top-repository.service.ts index da445bcbb..0d68cdd25 100644 --- a/src/ui_ng/src/app/repository/top-repo/top-repository.service.ts +++ b/src/ui_ng/src/app/repository/top-repo/top-repository.service.ts @@ -27,10 +27,10 @@ export const topRepoEndpoint = "/api/repositories/top?detail=1"; */ @Injectable() export class TopRepoService { - private headers = new Headers({ + headers = new Headers({ "Content-Type": 'application/json' }); - private options = new RequestOptions({ + options = new RequestOptions({ headers: this.headers }); diff --git a/src/ui_ng/src/app/shared/about-dialog/about-dialog.component.ts b/src/ui_ng/src/app/shared/about-dialog/about-dialog.component.ts index bef9474ee..8317d717a 100644 --- a/src/ui_ng/src/app/shared/about-dialog/about-dialog.component.ts +++ b/src/ui_ng/src/app/shared/about-dialog/about-dialog.component.ts @@ -21,8 +21,8 @@ import { AppConfigService } from '../../app-config.service'; styleUrls: ["about-dialog.component.css"] }) export class AboutDialogComponent { - private opened: boolean = false; - private build: string = "4276418"; + opened: boolean = false; + build: string = "4276418"; constructor(private appConfigService: AppConfigService) { } diff --git a/src/ui_ng/src/app/shared/confirmation-dialog/confirmation-dialog.component.ts b/src/ui_ng/src/app/shared/confirmation-dialog/confirmation-dialog.component.ts index a057122db..15bfd363a 100644 --- a/src/ui_ng/src/app/shared/confirmation-dialog/confirmation-dialog.component.ts +++ b/src/ui_ng/src/app/shared/confirmation-dialog/confirmation-dialog.component.ts @@ -33,7 +33,7 @@ export class ConfirmationDialogComponent implements OnDestroy { buttonKey: string = 'BUTTON.OK'; confirmOnly: boolean = false; message: ConfirmationMessage; - private annouceSubscription: Subscription; + annouceSubscription: Subscription; constructor( private confirmationService: ConfirmationDialogService, diff --git a/src/ui_ng/src/app/shared/confirmation-dialog/confirmation-dialog.service.ts b/src/ui_ng/src/app/shared/confirmation-dialog/confirmation-dialog.service.ts index f8c232add..3522d48ec 100644 --- a/src/ui_ng/src/app/shared/confirmation-dialog/confirmation-dialog.service.ts +++ b/src/ui_ng/src/app/shared/confirmation-dialog/confirmation-dialog.service.ts @@ -20,8 +20,8 @@ import { ConfirmationAcknowledgement } from './confirmation-state-message'; @Injectable() export class ConfirmationDialogService { - private confirmationAnnoucedSource = new Subject(); - private confirmationConfirmSource = new Subject(); + confirmationAnnoucedSource = new Subject(); + confirmationConfirmSource = new Subject(); confirmationAnnouced$ = this.confirmationAnnoucedSource.asObservable(); confirmationConfirm$ = this.confirmationConfirmSource.asObservable(); 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/filter/filter.component.ts b/src/ui_ng/src/app/shared/filter/filter.component.ts index 7a31d6bf0..17c76f41a 100644 --- a/src/ui_ng/src/app/shared/filter/filter.component.ts +++ b/src/ui_ng/src/app/shared/filter/filter.component.ts @@ -27,12 +27,12 @@ import 'rxjs/add/operator/distinctUntilChanged'; export class FilterComponent implements OnInit { - private placeHolder: string = ""; - private filterTerms = new Subject(); + placeHolder: string = ""; + filterTerms = new Subject(); @Output("filter") private filterEvt = new EventEmitter(); - @Input() currentValue; + @Input() currentValue: string; @Input("filterPlaceholder") public set flPlaceholder(placeHolder: string) { this.placeHolder = placeHolder; diff --git a/src/ui_ng/src/app/shared/gauge/gauge.component.ts b/src/ui_ng/src/app/shared/gauge/gauge.component.ts index 126538051..b2b9b4845 100644 --- a/src/ui_ng/src/app/shared/gauge/gauge.component.ts +++ b/src/ui_ng/src/app/shared/gauge/gauge.component.ts @@ -37,13 +37,13 @@ const RESOURCE_COLOR_GREY600: string = '#C7D1D6'; }) export class GaugeComponent implements AfterViewInit { - private _backgroundColor: string; - private _colorOne: string; - private _colorTwo: string; - private _size: string = "small"; //Support small, medium, large - private _title: string = "UNKNOWN"; //Lang key - private _free: number = 0; - private _threasHold: number = 0; + _backgroundColor: string; + _colorOne: string; + _colorTwo: string; + _size: string = "small"; //Support small, medium, large + _title: string = "UNKNOWN"; //Lang key + _free: number = 0; + _threasHold: number = 0; /** * Background color of the component. Default is white. @@ -60,7 +60,7 @@ export class GaugeComponent implements AfterViewInit { this._backgroundColor = value; } - private _positionOne: number; + _positionOne: number; /** * Keep these two properties * Percentage of the total width for the first portion of the bar. @@ -77,7 +77,7 @@ export class GaugeComponent implements AfterViewInit { this.setBars(); } - private _positionTwo: number; + _positionTwo: number; /** * Percentage of the total width for the second portion of the bar */ @@ -91,7 +91,7 @@ export class GaugeComponent implements AfterViewInit { this.setBars(); } - private _animate: boolean; + _animate: boolean; /** * Whether to animate transitions in the bars */ @@ -170,7 +170,7 @@ export class GaugeComponent implements AfterViewInit { @ViewChild('barOne') private barOne: ElementRef; @ViewChild('barTwo') private barTwo: ElementRef; - private determineColors() { + determineColors() { let percent: number = 0; if (this._threasHold !== 0) { let used: number = this._threasHold - this._free; @@ -200,7 +200,7 @@ export class GaugeComponent implements AfterViewInit { this.setAnimate(); } - private setBars() { + setBars() { if (!this.barOne || !this.barTwo) { return; } @@ -238,7 +238,7 @@ export class GaugeComponent implements AfterViewInit { }); } - private setColors() { + setColors() { if (!this.barOne || !this.barTwo) { return; } @@ -259,7 +259,7 @@ export class GaugeComponent implements AfterViewInit { }); } - private setAnimate() { + setAnimate() { if (!this.barOne || !this.barTwo) { return; } diff --git a/src/ui_ng/src/app/shared/inline-alert/inline-alert.component.ts b/src/ui_ng/src/app/shared/inline-alert/inline-alert.component.ts index 1dd2b8402..ee2b595a1 100644 --- a/src/ui_ng/src/app/shared/inline-alert/inline-alert.component.ts +++ b/src/ui_ng/src/app/shared/inline-alert/inline-alert.component.ts @@ -24,15 +24,15 @@ import { Subscription } from "rxjs"; styleUrls: ['inline-alert.component.css'] }) export class InlineAlertComponent { - private inlineAlertType: string = 'alert-danger'; - private inlineAlertClosable: boolean = false; - private alertClose: boolean = true; - private displayedText: string = ""; - private showCancelAction: boolean = false; - private useAppLevelStyle: boolean = false; - private timer: Subscription = null; - private count: number = 0; - private blinking: boolean = false; + inlineAlertType: string = 'alert-danger'; + inlineAlertClosable: boolean = false; + alertClose: boolean = true; + displayedText: string = ""; + showCancelAction: boolean = false; + useAppLevelStyle: boolean = false; + timer: Subscription = null; + count: number = 0; + blinking: boolean = false; @Output() confirmEvt = new EventEmitter(); @@ -90,7 +90,7 @@ export class InlineAlertComponent { public blink() { } - private confirmCancel(): void { + confirmCancel(): void { this.confirmEvt.emit(true); } } \ No newline at end of file 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..6ee5eb2b9 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,14 +3,14 @@ {{'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}} {{p.creation_time | date: 'short'}} - {{totalRecordCount || (projects ? projects.length : 0)}} {{'PROJECT.ITEMS' | translate}} - + {{(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..741c08a34 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,21 @@ 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..f3992075d 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}} - + {{(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/max-length-ext.directive.ts b/src/ui_ng/src/app/shared/max-length-ext.directive.ts index ab5bbbb59..bfc9550e3 100644 --- a/src/ui_ng/src/app/shared/max-length-ext.directive.ts +++ b/src/ui_ng/src/app/shared/max-length-ext.directive.ts @@ -45,7 +45,7 @@ export function maxLengthExtValidator(length: number): ValidatorFn { export class MaxLengthExtValidatorDirective implements Validator, OnChanges { @Input() maxLengthExt: number; - private valFn = Validators.nullValidator; + valFn = Validators.nullValidator; ngOnChanges(changes: SimpleChanges): void { const change = changes['maxLengthExt']; diff --git a/src/ui_ng/src/app/shared/message-handler/message-handler.service.ts b/src/ui_ng/src/app/shared/message-handler/message-handler.service.ts index 253697c35..0be2fe798 100644 --- a/src/ui_ng/src/app/shared/message-handler/message-handler.service.ts +++ b/src/ui_ng/src/app/shared/message-handler/message-handler.service.ts @@ -82,7 +82,7 @@ export class MessageHandlerService { this.msgService.clear(); } - public isAppLevel(error): boolean { + public isAppLevel(error: any): boolean { return error && error.statusCode === httpStatusCode.Unauthorized; } } \ No newline at end of file diff --git a/src/ui_ng/src/app/shared/new-user-form/new-user-form.component.ts b/src/ui_ng/src/app/shared/new-user-form/new-user-form.component.ts index 414962863..c980948fa 100644 --- a/src/ui_ng/src/app/shared/new-user-form/new-user-form.component.ts +++ b/src/ui_ng/src/app/shared/new-user-form/new-user-form.component.ts @@ -42,23 +42,25 @@ export class NewUserFormComponent implements AfterViewChecked, OnInit { //Notify the form value changes @Output() valueChange = new EventEmitter(); + confirmedPwd: string; + constructor(private session: SessionService) { } ngOnInit() { this.resetState(); } - private validationStateMap: any = {}; + validationStateMap: any = {}; - private mailAlreadyChecked: any = {}; - private userNameAlreadyChecked: any = {}; - private emailTooltip: string = 'TOOLTIP.EMAIL'; - private usernameTooltip: string = 'TOOLTIP.USER_NAME'; - private formValueChanged: boolean = false; + mailAlreadyChecked: any = {}; + userNameAlreadyChecked: any = {}; + emailTooltip: string = 'TOOLTIP.EMAIL'; + usernameTooltip: string = 'TOOLTIP.USER_NAME'; + formValueChanged: boolean = false; - private checkOnGoing: any = {}; + checkOnGoing: any = {}; - private resetState(): void { + resetState(): void { this.mailAlreadyChecked = {}; this.userNameAlreadyChecked = {}; this.emailTooltip = 'TOOLTIP.EMAIL'; @@ -82,11 +84,11 @@ export class NewUserFormComponent implements AfterViewChecked, OnInit { return !this.checkOnGoing[key]; } - private getValidationState(key: string): boolean { + getValidationState(key: string): boolean { return !this.validationStateMap[key]; } - private handleValidation(key: string, flag: boolean): void { + handleValidation(key: string, flag: boolean): void { if (flag) { //Checking let cont = this.newUserForm.controls[key]; diff --git a/src/ui_ng/src/app/shared/not-found/not-found.component.ts b/src/ui_ng/src/app/shared/not-found/not-found.component.ts index 6f4df0797..ebe113d99 100644 --- a/src/ui_ng/src/app/shared/not-found/not-found.component.ts +++ b/src/ui_ng/src/app/shared/not-found/not-found.component.ts @@ -23,8 +23,8 @@ const defaultLeftTime = 5; styleUrls: ['not-found.component.css'] }) export class PageNotFoundComponent implements OnInit, OnDestroy{ - private leftSeconds: number = defaultLeftTime; - private timeInterval: any = null; + leftSeconds: number = defaultLeftTime; + timeInterval: any = null; constructor(private router: Router){} diff --git a/src/ui_ng/src/app/shared/port.directive.ts b/src/ui_ng/src/app/shared/port.directive.ts index 65a351e25..d335aaf0b 100644 --- a/src/ui_ng/src/app/shared/port.directive.ts +++ b/src/ui_ng/src/app/shared/port.directive.ts @@ -42,7 +42,7 @@ export function portValidator(): ValidatorFn { }) export class PortValidatorDirective implements Validator { - private valFn = portValidator(); + valFn = portValidator(); validate(control: AbstractControl): { [key: string]: any } { return this.valFn(control); diff --git a/src/ui_ng/src/app/shared/route/auth-user-activate.service.ts b/src/ui_ng/src/app/shared/route/auth-user-activate.service.ts index 9f5bf143d..729424ad8 100644 --- a/src/ui_ng/src/app/shared/route/auth-user-activate.service.ts +++ b/src/ui_ng/src/app/shared/route/auth-user-activate.service.ts @@ -35,7 +35,7 @@ export class AuthCheckGuard implements CanActivate, CanActivateChild { private msgHandler: MessageHandlerService, private searchTrigger: SearchTriggerService) { } - private isGuest(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): boolean { + isGuest(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): boolean { const proRegExp = /\/harbor\/projects\/[\d]+\/.+/i; const libRegExp = /\/harbor\/tags\/[\d]+\/.+/i; if (proRegExp.test(state.url) || libRegExp.test(state.url)) { diff --git a/src/ui_ng/src/app/shared/session.service.ts b/src/ui_ng/src/app/shared/session.service.ts index 75490bbe7..902a0e5c0 100644 --- a/src/ui_ng/src/app/shared/session.service.ts +++ b/src/ui_ng/src/app/shared/session.service.ts @@ -44,18 +44,18 @@ export class SessionService { projectMembers: Member[]; - private headers = new Headers({ + headers = new Headers({ "Content-Type": 'application/json' }); - private formHeaders = new Headers({ + formHeaders = new Headers({ "Content-Type": 'application/x-www-form-urlencoded' }); constructor(private http: Http) { } //Handle the related exceptions - private handleError(error: any): Promise { + handleError(error: any): Promise { return Promise.reject(error.message || error); } diff --git a/src/ui_ng/src/app/shared/shared.module.ts b/src/ui_ng/src/app/shared/shared.module.ts index e336ca191..021e9d6d6 100644 --- a/src/ui_ng/src/app/shared/shared.module.ts +++ b/src/ui_ng/src/app/shared/shared.module.ts @@ -13,7 +13,7 @@ // limitations under the License. import { NgModule } from '@angular/core'; import { CoreModule } from '../core/core.module'; -import { CookieService } from 'angular2-cookie/core'; +import { CookieService } from 'ngx-cookie'; import { SessionService } from '../shared/session.service'; import { MessageComponent } from '../global-message/message.component'; 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/statictics/statistic-handler.service.ts b/src/ui_ng/src/app/shared/statictics/statistic-handler.service.ts index 10838ddc1..182d5e61d 100644 --- a/src/ui_ng/src/app/shared/statictics/statistic-handler.service.ts +++ b/src/ui_ng/src/app/shared/statictics/statistic-handler.service.ts @@ -17,7 +17,7 @@ import { Subject } from 'rxjs/Subject'; @Injectable() export class StatisticHandler { - private refreshSource = new Subject(); + refreshSource = new Subject(); refreshChan$ = this.refreshSource.asObservable(); diff --git a/src/ui_ng/src/app/shared/statictics/statistics-panel.component.ts b/src/ui_ng/src/app/shared/statictics/statistics-panel.component.ts index 2c6a1b7d3..9edfeb3f9 100644 --- a/src/ui_ng/src/app/shared/statictics/statistics-panel.component.ts +++ b/src/ui_ng/src/app/shared/statictics/statistics-panel.component.ts @@ -32,10 +32,11 @@ import { StatisticHandler } from './statistic-handler.service'; export class StatisticsPanelComponent implements OnInit, OnDestroy { - private originalCopy: Statistics = new Statistics(); - private volumesInfo: Volumes = new Volumes(); + originalCopy: Statistics = new Statistics(); + volumesInfo: Volumes = new Volumes(); refreshSub: Subscription; - + small: number; + constructor( private statistics: StatisticsService, private msgHandler: MessageHandlerService, @@ -97,7 +98,7 @@ export class StatisticsPanelComponent implements OnInit, OnDestroy { return this.volumesInfo.storage.total != 0; } - private getGBFromBytes(bytes: number): number { + getGBFromBytes(bytes: number): number { return Math.round((bytes / (1024 * 1024 * 1024))); } } \ No newline at end of file diff --git a/src/ui_ng/src/app/shared/statictics/statistics.service.ts b/src/ui_ng/src/app/shared/statictics/statistics.service.ts index 25f96f078..874aaab69 100644 --- a/src/ui_ng/src/app/shared/statictics/statistics.service.ts +++ b/src/ui_ng/src/app/shared/statictics/statistics.service.ts @@ -29,10 +29,10 @@ const volumesEndpoint = "/api/systeminfo/volumes"; */ @Injectable() export class StatisticsService { - private headers = new Headers({ + headers = new Headers({ "Content-Type": 'application/json' }); - private options = new RequestOptions({ + options = new RequestOptions({ headers: this.headers }); 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..86203d4d2 100644 --- a/src/ui_ng/src/app/shared/target-exists-directive.ts +++ b/src/ui_ng/src/app/shared/target-exists-directive.ts @@ -30,7 +30,7 @@ export class TargetExistsValidatorDirective implements Validator, OnChanges { @Input() targetExists: string; @Input() projectId: number; - private valFn = Validators.nullValidator; + valFn = Validators.nullValidator; constructor( private projectService: ProjectService, @@ -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/new-user-modal.component.ts b/src/ui_ng/src/app/user/new-user-modal.component.ts index 3071ac310..f95d92ff3 100644 --- a/src/ui_ng/src/app/user/new-user-modal.component.ts +++ b/src/ui_ng/src/app/user/new-user-modal.component.ts @@ -29,9 +29,9 @@ import { MessageHandlerService } from '../shared/message-handler/message-handler export class NewUserModalComponent { opened: boolean = false; - private error: any; - private onGoing: boolean = false; - private formValueChanged: boolean = false; + error: any; + onGoing: boolean = false; + formValueChanged: boolean = false; @Output() addNew = new EventEmitter(); @@ -40,11 +40,11 @@ export class NewUserModalComponent { private msgHandler: MessageHandlerService) { } @ViewChild(NewUserFormComponent) - private newUserForm: NewUserFormComponent; + newUserForm: NewUserFormComponent; @ViewChild(InlineAlertComponent) - private inlineAlert: InlineAlertComponent; + inlineAlert: InlineAlertComponent; - private getNewUser(): User { + getNewUser(): User { return this.newUserForm.getData(); } 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..af193750e 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,22 +31,22 @@ 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 { users: User[] = []; originalUsers: Promise; - private onGoing: boolean = false; - private adminMenuText: string = ""; - private adminColumn: string = ""; - private deletionSubscription: Subscription; + onGoing: boolean = false; + adminMenuText: string = ""; + adminColumn: string = ""; + deletionSubscription: Subscription; currentTerm: string; @ViewChild(NewUserModalComponent) - private newUserDialog: NewUserModalComponent; + newUserDialog: NewUserModalComponent; constructor( private userService: UserService, @@ -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,9 +63,11 @@ 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 { + isMySelf(uid: number): boolean { let currentUser = this.session.getCurrentUser(); if (currentUser) { if (currentUser.user_id === uid) { @@ -75,7 +78,7 @@ export class UserComponent implements OnInit, OnDestroy { return false; } - private isMatchFilterTerm(terms: string, testedItem: string): boolean { + isMatchFilterTerm(terms: string, testedItem: string): boolean { return testedItem.indexOf(terms) != -1; } @@ -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); @@ -186,7 +193,7 @@ export class UserComponent implements OnInit, OnDestroy { this.deletionDialogService.openComfirmDialog(msg); } - private delUser(user: User): void { + delUser(user: User): void { this.userService.deleteUser(user.user_id) .then(() => { //Remove it from current user list @@ -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 diff --git a/src/ui_ng/src/app/user/user.service.ts b/src/ui_ng/src/app/user/user.service.ts index b12f9e172..6768a7c82 100644 --- a/src/ui_ng/src/app/user/user.service.ts +++ b/src/ui_ng/src/app/user/user.service.ts @@ -27,7 +27,7 @@ const userMgmtEndpoint = '/api/users'; */ @Injectable() export class UserService { - private httpOptions = new RequestOptions({ + httpOptions = new RequestOptions({ headers: new Headers({ "Content-Type": 'application/json' }) @@ -36,7 +36,7 @@ export class UserService { constructor(private http: Http) { } //Handle the related exceptions - private handleError(error: any): Promise { + handleError(error: any): Promise { return Promise.reject(error.message || error); } diff --git a/src/ui_ng/src/main-aot.ts b/src/ui_ng/src/main-aot.ts new file mode 100644 index 000000000..c5bf0ec89 --- /dev/null +++ b/src/ui_ng/src/main-aot.ts @@ -0,0 +1,11 @@ +import './polyfills.ts'; + +import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; +import { enableProdMode } from '@angular/core'; +import { environment } from './environments/environment'; +import { AppModuleNgFactory } from '../aot/src/app/app.module.ngfactory'; + + +enableProdMode(); + +platformBrowserDynamic().bootstrapModuleFactory(AppModuleNgFactory); diff --git a/src/ui_ng/tsconfig-aot.json b/src/ui_ng/tsconfig-aot.json new file mode 100644 index 000000000..b705b5650 --- /dev/null +++ b/src/ui_ng/tsconfig-aot.json @@ -0,0 +1,25 @@ +{ + "compilerOptions": { + "target": "es5", + "module": "es2015", + "moduleResolution": "node", + "sourceMap": true, + "emitDecoratorMetadata": true, + "experimentalDecorators": true, + "lib": ["es2015", "dom"], + "noImplicitAny": true, + "suppressImplicitAnyIndexErrors": true, + "allowSyntheticDefaultImports": true, + "typeRoots": [ + "./node_modules/@types/" + ] + }, + "files": [ + "src/app/app.module.ts", + "src/main-aot.ts" + ], + "angularCompilerOptions": { + "genDir": "aot", + "skipMetadataEmit" : true + } +} \ No newline at end of file