diff --git a/src/ui_ng/lib/src/config/config.ts b/src/ui_ng/lib/src/config/config.ts index a5672b35a..383e490f7 100644 --- a/src/ui_ng/lib/src/config/config.ts +++ b/src/ui_ng/lib/src/config/config.ts @@ -100,7 +100,7 @@ export class Configuration { this.verify_remote_cert = new BoolValueItem(false, true); this.scan_all_policy = new ComplexValueItem({ type: "daily", - parameters: { + parameter: { daily_time: 0 } }, true); diff --git a/src/ui_ng/lib/src/config/registry-config.component.html.ts b/src/ui_ng/lib/src/config/registry-config.component.html.ts index 6402681bd..98c594fa8 100644 --- a/src/ui_ng/lib/src/config/registry-config.component.html.ts +++ b/src/ui_ng/lib/src/config/registry-config.component.html.ts @@ -1,7 +1,12 @@ export const REGISTRY_CONFIG_HTML: string = `
- - - + + + +
+ + +
+
`; \ No newline at end of file diff --git a/src/ui_ng/lib/src/config/registry-config.component.spec.ts b/src/ui_ng/lib/src/config/registry-config.component.spec.ts index ed1a2894e..65dfc83a3 100644 --- a/src/ui_ng/lib/src/config/registry-config.component.spec.ts +++ b/src/ui_ng/lib/src/config/registry-config.component.spec.ts @@ -8,6 +8,7 @@ import { ReplicationConfigComponent } from './replication/replication-config.com import { SystemSettingsComponent } from './system/system-settings.component'; import { VulnerabilityConfigComponent } from './vulnerability/vulnerability-config.component'; import { RegistryConfigComponent } from './registry-config.component'; +import { ConfirmationDialogComponent } from '../confirmation-dialog/confirmation-dialog.component'; import { ConfigurationService, @@ -29,7 +30,7 @@ describe('RegistryConfigComponent (inline template)', () => { mockConfig.verify_remote_cert.value = true; mockConfig.scan_all_policy.value = { type: "daily", - parameters: { + parameter: { daily_time: 0 } }; @@ -46,7 +47,8 @@ describe('RegistryConfigComponent (inline template)', () => { ReplicationConfigComponent, SystemSettingsComponent, VulnerabilityConfigComponent, - RegistryConfigComponent + RegistryConfigComponent, + ConfirmationDialogComponent ], providers: [ ErrorHandler, diff --git a/src/ui_ng/lib/src/config/registry-config.component.ts b/src/ui_ng/lib/src/config/registry-config.component.ts index f3b21a94c..49c61fbd4 100644 --- a/src/ui_ng/lib/src/config/registry-config.component.ts +++ b/src/ui_ng/lib/src/config/registry-config.component.ts @@ -1,10 +1,22 @@ -import { Component, OnInit, EventEmitter, Output } from '@angular/core'; +import { Component, OnInit, EventEmitter, Output, ViewChild } from '@angular/core'; import { Configuration, ComplexValueItem } from './config'; import { REGISTRY_CONFIG_HTML } from './registry-config.component.html'; import { ConfigurationService } from '../service/index'; import { toPromise } from '../utils'; import { ErrorHandler } from '../error-handler'; +import { + ReplicationConfigComponent, + SystemSettingsComponent, + VulnerabilityConfigComponent +} from './index'; + +import { ConfirmationState, ConfirmationTargets, ConfirmationButtons } from '../shared/shared.const'; +import { ConfirmationDialogComponent } from '../confirmation-dialog/confirmation-dialog.component'; +import { ConfirmationMessage } from '../confirmation-dialog/confirmation-message'; +import { ConfirmationAcknowledgement } from '../confirmation-dialog/confirmation-state-message'; +import { TranslateService } from '@ngx-translate/core'; + @Component({ selector: 'hbr-registry-config', @@ -13,27 +25,56 @@ import { ErrorHandler } from '../error-handler'; export class RegistryConfigComponent implements OnInit { config: Configuration = new Configuration(); configCopy: Configuration; + onGoing: boolean = false; - @Output() configChanged: EventEmitter = new EventEmitter(); + @ViewChild("replicationConfig") replicationCfg: ReplicationConfigComponent; + @ViewChild("systemSettings") systemSettings: SystemSettingsComponent; + @ViewChild("vulnerabilityConfig") vulnerabilityCfg: VulnerabilityConfigComponent; + @ViewChild("cfgConfirmationDialog") confirmationDlg: ConfirmationDialogComponent; constructor( private configService: ConfigurationService, - private errorHandler: ErrorHandler + private errorHandler: ErrorHandler, + private translate: TranslateService ) { } + get shouldDisable(): boolean { + return !this.isValid() || !this.hasChanges() || this.onGoing; + } + ngOnInit(): void { //Initialize this.load(); } + isValid(): boolean { + return this.replicationCfg && + this.replicationCfg.isValid && + this.systemSettings && + this.systemSettings.isValid && + this.vulnerabilityCfg && + this.vulnerabilityCfg.isValid; + } + + hasChanges(): boolean { + return !this._isEmptyObject(this.getChanges()); + } + //Load configurations load(): void { + this.onGoing = true; toPromise(this.configService.getConfigurations()) .then((config: Configuration) => { - this.configCopy = Object.assign({}, config); + this.onGoing = false; + + this.configCopy = this._clone(config); this.config = config; }) - .catch(error => this.errorHandler.error(error)); + .catch(error => { + this.onGoing = false; + + this.errorHandler.error(error); + }); } //Save configuration changes @@ -45,26 +86,48 @@ export class RegistryConfigComponent implements OnInit { return; } - //Fix policy parameters issue - let scanningAllPolicy = changes["scan_all_policy"]; - if (scanningAllPolicy && - scanningAllPolicy.type !== "daily" && - scanningAllPolicy.parameters) { - delete (scanningAllPolicy.parameters); - } - + this.onGoing = true; toPromise(this.configService.saveConfigurations(changes)) .then(() => { - this.configChanged.emit(changes); + this.onGoing = false; + + this.translate.get("CONFIG.SAVE_SUCCESS").subscribe((res: string) => { + this.errorHandler.info(res); + }); + //Reload to fetch all the updates + this.load(); }) - .catch(error => this.errorHandler.error(error)); + .catch(error => { + this.onGoing = false; + this.errorHandler.error(error); + }); + } + + //Cancel the changes if have + cancel(): void { + let msg = new ConfirmationMessage( + "CONFIG.CONFIRM_TITLE", + "CONFIG.CONFIRM_SUMMARY", + "", + {}, + ConfirmationTargets.CONFIG + ); + this.confirmationDlg.open(msg); + } + + //Confirm cancel + confirmCancel(ack: ConfirmationAcknowledgement): void { + if (ack && ack.source === ConfirmationTargets.CONFIG && + ack.state === ConfirmationState.CONFIRMED) { + this.reset(); + } } reset(): void { //Reset to the values of copy let changes: { [key: string]: any | any[] } = this.getChanges(); for (let prop in changes) { - this.config[prop] = Object.assign({}, this.configCopy[prop]); + this.config[prop] = this._clone(this.configCopy[prop]); } } @@ -107,4 +170,10 @@ export class RegistryConfigComponent implements OnInit { _isEmptyObject(obj: any): boolean { return !obj || JSON.stringify(obj) === "{}"; } + + //Deeper clone all + _clone(srcObj: any): any { + if (!srcObj) return null; + return JSON.parse(JSON.stringify(srcObj)); + } } \ No newline at end of file diff --git a/src/ui_ng/lib/src/config/vulnerability/vulnerability-config.component.template.ts b/src/ui_ng/lib/src/config/vulnerability/vulnerability-config.component.template.ts index 67c0fc373..361f4cb1b 100644 --- a/src/ui_ng/lib/src/config/vulnerability/vulnerability-config.component.template.ts +++ b/src/ui_ng/lib/src/config/vulnerability/vulnerability-config.component.template.ts @@ -5,7 +5,7 @@ export const VULNERABILITY_CONFIG_HTML: string = `
- diff --git a/src/ui_ng/lib/src/config/vulnerability/vulnerability-config.component.ts b/src/ui_ng/lib/src/config/vulnerability/vulnerability-config.component.ts index ee57b9894..b8cceb360 100644 --- a/src/ui_ng/lib/src/config/vulnerability/vulnerability-config.component.ts +++ b/src/ui_ng/lib/src/config/vulnerability/vulnerability-config.component.ts @@ -30,13 +30,13 @@ export class VulnerabilityConfigComponent { this.config = cfg; if (this.config.scan_all_policy && this.config.scan_all_policy.value) { - if (this.config.scan_all_policy.value.type === "daily"){ - if(!this.config.scan_all_policy.value.parameters){ - this.config.scan_all_policy.value.parameters = { - daily_time: 0 - }; - } + if (this.config.scan_all_policy.value.type === "daily") { + if (!this.config.scan_all_policy.value.parameter) { + this.config.scan_all_policy.value.parameter = { + daily_time: 0 + }; } + } } this.configChange.emit(this.config); } @@ -51,8 +51,8 @@ export class VulnerabilityConfigComponent { } let timeOffset: number = 0;//seconds - if (this.config.scan_all_policy.value.parameters) { - let daily_time = this.config.scan_all_policy.value.parameters.daily_time; + if (this.config.scan_all_policy.value.parameter) { + let daily_time = this.config.scan_all_policy.value.parameter.daily_time; if (daily_time && typeof daily_time === "number") { timeOffset = +daily_time; } @@ -99,8 +99,9 @@ export class VulnerabilityConfigComponent { return; } - if (!this.config.scan_all_policy.value.parameters) { - this.config.scan_all_policy.value.parameters = { + //Double confirm inner parameter existing. + if (!this.config.scan_all_policy.value.parameter) { + this.config.scan_all_policy.value.parameter = { daily_time: 0 }; } @@ -124,7 +125,41 @@ export class VulnerabilityConfigComponent { utcTimes -= ONE_DAY_SECONDS; } - this.config.scan_all_policy.value.parameters.daily_time = utcTimes; + this.config.scan_all_policy.value.parameter.daily_time = utcTimes; + } + + //Scanning type + get scanningType(): string { + if (this.config && + this.config.scan_all_policy && + this.config.scan_all_policy.value) { + return this.config.scan_all_policy.value.type; + } else { + //default + return "none"; + } + } + + set scanningType(v: string) { + if (this.config && + this.config.scan_all_policy && + this.config.scan_all_policy.value) { + let type: string = (v && v.trim() !== "") ? v : "none"; + this.config.scan_all_policy.value.type = type; + if (type !== "daily") { + //No parameter + if (this.config.scan_all_policy.value.parameter) { + delete (this.config.scan_all_policy.value.parameter); + } + } else { + //Has parameter + if (!this.config.scan_all_policy.value.parameter) { + this.config.scan_all_policy.value.parameter = { + daily_time: 0 + }; + } + } + } } @ViewChild("systemConfigFrom") systemSettingsForm: NgForm; diff --git a/src/ui_ng/package.json b/src/ui_ng/package.json index 190f33685..56b3f804d 100644 --- a/src/ui_ng/package.json +++ b/src/ui_ng/package.json @@ -31,7 +31,7 @@ "clarity-icons": "^0.9.8", "clarity-ui": "^0.9.8", "core-js": "^2.4.1", - "harbor-ui": "^0.2.40", + "harbor-ui": "^0.2.52", "intl": "^1.2.5", "mutationobserver-shim": "^0.3.2", "ngx-cookie": "^1.0.0", diff --git a/src/ui_ng/src/app/config/config.component.html b/src/ui_ng/src/app/config/config.component.html index 060a4b21e..b5b19707f 100644 --- a/src/ui_ng/src/app/config/config.component.html +++ b/src/ui_ng/src/app/config/config.component.html @@ -16,7 +16,7 @@
@@ -41,7 +41,6 @@ -
\ No newline at end of file diff --git a/src/ui_ng/src/app/config/config.component.ts b/src/ui_ng/src/app/config/config.component.ts index b99734116..f239e8d45 100644 --- a/src/ui_ng/src/app/config/config.component.ts +++ b/src/ui_ng/src/app/config/config.component.ts @@ -71,11 +71,6 @@ export class ConfigurationComponent implements OnInit, OnDestroy { private appConfigService: AppConfigService, private session: SessionService) { } - consoleTest(): void { - console.log(this.allConfig, this.originalCopy); - console.log("-------------"); - console.log(this.getChanges()); - } isCurrentTabLink(tabId: string): boolean { return this.currentTabId === tabId; }