From 953c0c65ccf6eb16db3ec63a58125209aad21008 Mon Sep 17 00:00:00 2001 From: Nicoleta Panaghiu Date: Tue, 5 Nov 2024 13:05:40 +0200 Subject: [PATCH] RED-10139: removed some more getters. --- .../user-profile-screen.component.ts | 16 +- .../user-details/user-details.component.ts | 8 +- .../watermark-screen.component.html | 285 +++++++++--------- .../watermark-screen.component.ts | 85 ++++-- 4 files changed, 214 insertions(+), 180 deletions(-) diff --git a/apps/red-ui/src/app/modules/account/screens/user-profile/user-profile-screen/user-profile-screen.component.ts b/apps/red-ui/src/app/modules/account/screens/user-profile/user-profile-screen/user-profile-screen.component.ts index 5594d16dc..214217a8d 100644 --- a/apps/red-ui/src/app/modules/account/screens/user-profile/user-profile-screen/user-profile-screen.component.ts +++ b/apps/red-ui/src/app/modules/account/screens/user-profile/user-profile-screen/user-profile-screen.component.ts @@ -81,28 +81,28 @@ export class UserProfileScreenComponent extends BaseFormComponent { this._loadingService.stop(); } - get languageChanged(): boolean { + get #languageChanged(): boolean { return this.initialFormValue['language'] !== this.form.controls.language.value; } - get themeChanged(): boolean { + get #themeChanged(): boolean { return this.initialFormValue['darkTheme'] !== this.form.controls.darkTheme.value; } - get emailChanged(): boolean { + get #emailChanged(): boolean { return this.initialFormValue['email'] !== this.form.controls.email.value; } - get profileChanged(): boolean { + get #profileChanged(): boolean { return this.profileKeys.some(key => this.initialFormValue[key] !== this.form.get(key).value); } async save(): Promise { try { - if (this.profileChanged) { + if (this.#profileChanged) { const value = this.form.getRawValue() as IProfile; - if (this.emailChanged) { + if (this.#emailChanged) { const dialogRef = this._dialogService.openDialog('confirmPassword'); const password = await firstValueFrom(dialogRef.afterClosed()); if (!password) { @@ -118,12 +118,12 @@ export class UserProfileScreenComponent extends BaseFormComponent { await firstValueFrom(this._userService.loadAll()); } - if (this.languageChanged) { + if (this.#languageChanged) { await this._languageService.change(this.form.controls.language.value); await this._pdfViewer.instance?.UI.setLanguage(this._languageService.currentLanguage); } - if (this.themeChanged) { + if (this.#themeChanged) { await this._userPreferenceService.saveTheme(this.form.controls.darkTheme.value ? 'dark' : 'light'); } diff --git a/apps/red-ui/src/app/modules/admin/dialogs/add-edit-user-dialog/user-details/user-details.component.ts b/apps/red-ui/src/app/modules/admin/dialogs/add-edit-user-dialog/user-details/user-details.component.ts index 9111e481c..cd7813236 100644 --- a/apps/red-ui/src/app/modules/admin/dialogs/add-edit-user-dialog/user-details/user-details.component.ts +++ b/apps/red-ui/src/app/modules/admin/dialogs/add-edit-user-dialog/user-details/user-details.component.ts @@ -38,7 +38,7 @@ export class UserDetailsComponent extends BaseFormComponent implements OnInit { super(); } - get activeRoles(): string[] { + get #activeRoles(): string[] { return this.ROLES.reduce((acc, role) => { if (this.form.get(role).value) { acc.push(role); @@ -47,7 +47,7 @@ export class UserDetailsComponent extends BaseFormComponent implements OnInit { }, []); } - get sendSetPasswordMail() { + get #sendSetPasswordMail() { return !this.form.controls.sendSetPasswordMail.value; } @@ -89,8 +89,8 @@ export class UserDetailsComponent extends BaseFormComponent implements OnInit { this._loadingService.start(); const userData: IProfileUpdateRequest = { ...this.form.getRawValue(), - roles: this.activeRoles, - sendSetPasswordMail: this.sendSetPasswordMail, + roles: this.#activeRoles, + sendSetPasswordMail: this.#sendSetPasswordMail, }; if (!this.user()) { diff --git a/apps/red-ui/src/app/modules/admin/screens/watermark/watermark-screen/watermark-screen.component.html b/apps/red-ui/src/app/modules/admin/screens/watermark/watermark-screen/watermark-screen.component.html index 7a79edcb1..cbf5c762f 100644 --- a/apps/red-ui/src/app/modules/admin/screens/watermark/watermark-screen/watermark-screen.component.html +++ b/apps/red-ui/src/app/modules/admin/screens/watermark/watermark-screen/watermark-screen.component.html @@ -1,144 +1,153 @@
- + @if (loaded$ | async) { + + } -
- + @if (!!instance && changed() && currentUser.isAdmin) { +
+ -
+
+
+ } +
+ +@if (watermark$ | async) { +
+
+
+ + +
+ +
+ + +
+ +
+ +
+ @for (option of orientationOptions; track option) { +
+ ABC +
+ } +
+
+ +
+ +
+
+ @for (alignment of watermarkHorizontalAlignments; track alignment) { +
+ +
+ } +
+
+ @for (alignment of watermarkVerticalAlignments; track alignment) { +
+ +
+ } +
+
+
+ +
+ + + + +
+ +
+ + + + +
+ +
+ + +
+ @if (!form.controls.hexColor?.value || form.controls.hexColor.value?.length === 0) { + + } +
+
+ +
+ +
+ @for (option of fontOptions; track option.value) { +
+ {{ option.display }} +
+ } +
+
+
-
- -
-
-
- - -
- -
- - -
- -
- -
-
- ABC -
-
-
- -
- -
-
-
- -
-
-
-
- -
-
-
-
- -
- - - - -
- -
- - - - -
- -
- - -
- -
-
- -
- -
-
- {{ option.display }} -
-
-
-
-
+} diff --git a/apps/red-ui/src/app/modules/admin/screens/watermark/watermark-screen/watermark-screen.component.ts b/apps/red-ui/src/app/modules/admin/screens/watermark/watermark-screen/watermark-screen.component.ts index f0058cb61..4f3f3aa41 100644 --- a/apps/red-ui/src/app/modules/admin/screens/watermark/watermark-screen/watermark-screen.component.ts +++ b/apps/red-ui/src/app/modules/admin/screens/watermark/watermark-screen/watermark-screen.component.ts @@ -1,7 +1,7 @@ -import { AsyncPipe, NgClass, NgForOf, NgIf } from '@angular/common'; +import { AsyncPipe, NgClass } from '@angular/common'; import { HttpClient } from '@angular/common/http'; -import { ChangeDetectorRef, Component, ElementRef, inject, OnInit, ViewChild } from '@angular/core'; -import { FormBuilder, FormGroup, ReactiveFormsModule } from '@angular/forms'; +import { ChangeDetectorRef, Component, computed, ElementRef, inject, OnInit, viewChild, ViewChild } from '@angular/core'; +import { FormBuilder, FormGroup, ReactiveFormsModule, Validators } from '@angular/forms'; import { MatIcon } from '@angular/material/icon'; import { MatSlider, MatSliderThumb } from '@angular/material/slider'; import { MatTooltip } from '@angular/material/tooltip'; @@ -18,7 +18,15 @@ import { Toaster, } from '@iqser/common-ui'; import { getCurrentUser } from '@iqser/common-ui/lib/users'; -import { AsControl, Debounce, getParam, trackByFactory, UI_ROOT_PATH_FN } from '@iqser/common-ui/lib/utils'; +import { + AsControl, + Debounce, + formStatusToSignal, + formValueToSignal, + getParam, + trackByFactory, + UI_ROOT_PATH_FN, +} from '@iqser/common-ui/lib/utils'; import { TranslateModule } from '@ngx-translate/core'; import WebViewer, { WebViewerInstance } from '@pdftron/webviewer'; import { @@ -77,14 +85,12 @@ interface WatermarkForm { standalone: true, imports: [ PaginatorComponent, - NgIf, IconButtonComponent, TranslateModule, AsyncPipe, ReactiveFormsModule, HasScrollbarDirective, MatTooltip, - NgForOf, NgClass, MatIcon, MatSlider, @@ -93,7 +99,7 @@ interface WatermarkForm { ], }) export class WatermarkScreenComponent implements OnInit { - @ViewChild('viewer', { static: true }) private readonly _viewer: ElementRef; + private readonly _viewer = viewChild.required>('viewer'); readonly #loaded$ = new BehaviorSubject(false); readonly #dossierTemplateId = getParam(DOSSIER_TEMPLATE_ID); readonly #watermarkId = Number(getParam(WATERMARK_ID)); @@ -104,7 +110,7 @@ export class WatermarkScreenComponent implements OnInit { readonly translations = watermarkTranslations; readonly trackBy = trackByFactory(); readonly currentUser = getCurrentUser(); - readonly form = this.#form; + readonly form: FormGroup> = this.#form; readonly watermark$: Observable>; readonly fontOptions = [ { value: 'times-new-roman', display: 'Times' }, @@ -117,6 +123,42 @@ export class WatermarkScreenComponent implements OnInit { readonly watermarkHorizontalAlignments = Object.values(WATERMARK_HORIZONTAL_ALIGNMENTS); readonly watermarkVerticalAlignments = Object.values(WATERMARK_VERTICAL_ALIGNMENTS); currentAlignment: WatermarkAlignment; + readonly loweredWatermarkHorizontalAlignments = this.watermarkHorizontalAlignments.reduce( + (acc, curr: string) => ({ + ...acc, + [curr]: curr.toLowerCase(), + }), + {}, + ); + readonly loweredWatermarkVerticalAlignments = this.watermarkVerticalAlignments.reduce( + (acc, curr: string) => ({ + ...acc, + [curr]: curr.toLowerCase(), + }), + {}, + ); + readonly hexColorStatus = formStatusToSignal(this.form.controls.hexColor); + readonly fontTypeStatus = formStatusToSignal(this.form.controls.fontType); + readonly verticalTextAlignmentStatus = formStatusToSignal(this.form.controls.verticalTextAlignment); + readonly horizontalTextAlignmentStatus = formStatusToSignal(this.form.controls.horizontalTextAlignment); + readonly orientationStatus = formStatusToSignal(this.form.controls.orientation); + readonly formValue = formValueToSignal(this.form); + readonly formStatus = formStatusToSignal(this.form); + readonly changed = computed(() => { + for (const key of Object.keys(this.form.getRawValue())) { + if (this.#watermark[key] !== this.formValue()[key]) { + return true; + } + } + return false; + }); + + readonly valid = computed(() => { + if (!this.formValue()['name'] || !this.formValue()['text']) { + return false; + } + return this.formStatus() === 'VALID'; + }); constructor( private readonly _http: HttpClient, @@ -137,26 +179,10 @@ export class WatermarkScreenComponent implements OnInit { this.watermark$ = obs$.pipe(tap(watermark => this.#initForm(watermark))); } - get changed(): boolean { - for (const key of Object.keys(this.form.getRawValue())) { - if (this.#watermark[key] !== this.form.get(key)?.value) { - return true; - } - } - return false; - } - - get valid(): boolean { - if (!this.form.controls.name?.value || !this.form.controls.text?.value) { - return false; - } - return this.form.valid; - } - - get #form() { - const form: FormGroup> = this._formBuilder.group({ - name: [null], - text: [null], + get #form(): FormGroup> { + const form = this._formBuilder.group({ + name: ['', Validators.required], + text: ['', Validators.required], hexColor: [null], opacity: [null], fontSize: [null], @@ -175,7 +201,6 @@ export class WatermarkScreenComponent implements OnInit { @Debounce() async configChanged() { - console.log('configChanged'); await this.#drawWatermark(); } @@ -258,7 +283,7 @@ export class WatermarkScreenComponent implements OnInit { }, // use nativeElement instead of document.getElementById('viwer') // because WebViewer works better with this approach - this._viewer.nativeElement, + this._viewer().nativeElement, ); this.instance.UI.setTheme(this._userPreferenceService.getTheme());