Compare commits
9 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
953c0c65cc | ||
|
|
7ef5fc7bc9 | ||
|
|
a2870531c9 | ||
|
|
b7ff80ecac | ||
|
|
4bf2e79c57 | ||
|
|
4945b6a9f2 | ||
|
|
03804df3b9 | ||
|
|
57d3c008cc | ||
|
|
f00a92a5ea |
@ -1,14 +1,15 @@
|
||||
<iqser-side-nav [title]="'account-settings' | translate">
|
||||
<ng-container *ngFor="let item of items">
|
||||
<div
|
||||
*ngIf="item.show"
|
||||
[routerLinkActiveOptions]="{ exact: false }"
|
||||
[routerLink]="'../' + item.screen"
|
||||
[attr.help-mode-key]="item.helpModeKey"
|
||||
class="item"
|
||||
routerLinkActive="active"
|
||||
>
|
||||
{{ item.label | translate }}
|
||||
</div>
|
||||
</ng-container>
|
||||
@for (item of items; track item.helpModeKey) {
|
||||
@if (item.show) {
|
||||
<div
|
||||
[routerLinkActiveOptions]="{ exact: false }"
|
||||
[routerLink]="'../' + item.screen"
|
||||
[attr.help-mode-key]="item.helpModeKey"
|
||||
class="item"
|
||||
routerLinkActive="active"
|
||||
>
|
||||
{{ item.label | translate }}
|
||||
</div>
|
||||
}
|
||||
}
|
||||
</iqser-side-nav>
|
||||
|
||||
@ -6,7 +6,6 @@ import { User } from '@red/domain';
|
||||
import { getCurrentUser } from '@iqser/common-ui/lib/users';
|
||||
import { SideNavComponent } from '@common-ui/shared';
|
||||
import { TranslateModule } from '@ngx-translate/core';
|
||||
import { NgForOf, NgIf } from '@angular/common';
|
||||
import { RouterLink, RouterLinkActive } from '@angular/router';
|
||||
|
||||
interface NavItem {
|
||||
@ -22,7 +21,7 @@ interface NavItem {
|
||||
styleUrls: ['./account-side-nav.component.scss'],
|
||||
changeDetection: ChangeDetectionStrategy.OnPush,
|
||||
standalone: true,
|
||||
imports: [SideNavComponent, TranslateModule, NgForOf, NgIf, RouterLinkActive, RouterLink],
|
||||
imports: [SideNavComponent, TranslateModule, RouterLinkActive, RouterLink],
|
||||
})
|
||||
export class AccountSideNavComponent {
|
||||
readonly currentUser = getCurrentUser<User>();
|
||||
|
||||
@ -8,9 +8,11 @@
|
||||
<div class="content-container full-height">
|
||||
<div class="overlay-shadow"></div>
|
||||
<div [ngClass]="!isWarningsScreen && 'dialog'">
|
||||
<div *ngIf="!isWarningsScreen" class="dialog-header">
|
||||
<div class="heading-l" [translate]="translations[path]"></div>
|
||||
</div>
|
||||
@if (!isWarningsScreen) {
|
||||
<div class="dialog-header">
|
||||
<div class="heading-l" [translate]="translations[path]"></div>
|
||||
</div>
|
||||
}
|
||||
|
||||
<router-outlet></router-outlet>
|
||||
</div>
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
import { ChangeDetectionStrategy, Component, OnInit, ViewContainerRef } from '@angular/core';
|
||||
import { Router, RouterOutlet } from '@angular/router';
|
||||
import { accountTranslations } from '@translations/account-translations';
|
||||
import { NgClass, NgIf } from '@angular/common';
|
||||
import { NgClass } from '@angular/common';
|
||||
import { AccountSideNavComponent } from '../account-side-nav/account-side-nav.component';
|
||||
import { TranslateModule } from '@ngx-translate/core';
|
||||
|
||||
@ -11,7 +11,7 @@ import { TranslateModule } from '@ngx-translate/core';
|
||||
styleUrls: ['./base-account-screen-component.scss'],
|
||||
changeDetection: ChangeDetectionStrategy.OnPush,
|
||||
standalone: true,
|
||||
imports: [NgClass, NgIf, RouterOutlet, AccountSideNavComponent, TranslateModule],
|
||||
imports: [NgClass, RouterOutlet, AccountSideNavComponent, TranslateModule],
|
||||
})
|
||||
export class BaseAccountScreenComponent implements OnInit {
|
||||
readonly translations = accountTranslations;
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
<form (submit)="save()" [formGroup]="form">
|
||||
<div class="dialog-content">
|
||||
<div *ngFor="let category of notificationCategories">
|
||||
@for (category of notificationCategories; track category) {
|
||||
<div class="iqser-input-group header w-full">
|
||||
<mat-slide-toggle color="primary" formControlName="{{ category }}Enabled"
|
||||
>{{ translations[category] | translate }}
|
||||
@ -8,26 +8,31 @@
|
||||
</div>
|
||||
|
||||
<!-- TODO: This lots of getters-->
|
||||
<div *ngIf="isCategoryActive(category)" class="options-content">
|
||||
<div [translate]="'notifications-screen.options-title'" class="statement"></div>
|
||||
@if (isCategoryActive(category)) {
|
||||
<div class="options-content">
|
||||
<div [translate]="'notifications-screen.options-title'" class="statement"></div>
|
||||
|
||||
<div *ngFor="let key of notificationGroupsKeys; let i = index" class="group">
|
||||
<div [translate]="translations[key]" class="group-title"></div>
|
||||
<div class="iqser-input-group">
|
||||
<ng-container *ngFor="let preference of getRssFilteredSettings(notificationGroupsValues[i])">
|
||||
<mat-checkbox
|
||||
(change)="addRemovePreference($event.checked, category, preference)"
|
||||
*ngIf="!skipPreference(preference)"
|
||||
[checked]="isPreferenceChecked(category, preference)"
|
||||
color="primary"
|
||||
>
|
||||
{{ translations[preference] | translate }}
|
||||
</mat-checkbox>
|
||||
</ng-container>
|
||||
</div>
|
||||
@for (key of notificationGroupsKeys; track key) {
|
||||
<div class="group">
|
||||
<div [translate]="translations[key]" class="group-title"></div>
|
||||
<div class="iqser-input-group">
|
||||
@for (preference of getRssFilteredSettings(notificationGroupsValues[$index]); track preference) {
|
||||
@if (!skipPreference(preference)) {
|
||||
<mat-checkbox
|
||||
(change)="addRemovePreference($event.checked, category, preference)"
|
||||
[checked]="isPreferenceChecked(category, preference)"
|
||||
color="primary"
|
||||
>
|
||||
{{ translations[preference] | translate }}
|
||||
</mat-checkbox>
|
||||
}
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
}
|
||||
</div>
|
||||
|
||||
<div class="dialog-actions">
|
||||
|
||||
@ -14,7 +14,6 @@ import {
|
||||
import { firstValueFrom } from 'rxjs';
|
||||
import { notificationsSettingsTranslations } from '@translations/notifications-settings-translations';
|
||||
import { getCurrentUser } from '@iqser/common-ui/lib/users';
|
||||
import { NgForOf, NgIf } from '@angular/common';
|
||||
import { MatSlideToggle } from '@angular/material/slide-toggle';
|
||||
import { TranslateModule } from '@ngx-translate/core';
|
||||
import { MatCheckbox } from '@angular/material/checkbox';
|
||||
@ -26,7 +25,7 @@ const RSS_EXCLUDED_SETTINGS = ['USER_PROMOTED_TO_APPROVER', 'USER_DEGRADED_TO_RE
|
||||
styleUrls: ['./notifications-screen.component.scss'],
|
||||
changeDetection: ChangeDetectionStrategy.OnPush,
|
||||
standalone: true,
|
||||
imports: [ReactiveFormsModule, NgForOf, MatSlideToggle, TranslateModule, NgIf, MatCheckbox, IconButtonComponent],
|
||||
imports: [ReactiveFormsModule, MatSlideToggle, TranslateModule, MatCheckbox, IconButtonComponent],
|
||||
})
|
||||
export class NotificationsScreenComponent extends BaseFormComponent implements OnInit {
|
||||
readonly #toaster = inject(Toaster);
|
||||
|
||||
@ -12,7 +12,7 @@
|
||||
}}</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
<mat-checkbox *ngIf="displayExtraOptionAddRedaction" formControlName="addRedactionApplyToAll">{{
|
||||
<mat-checkbox *ngIf="displayExtraOptionAddRedaction()" formControlName="addRedactionApplyToAll">{{
|
||||
'dialog-defaults-form.extra-option-label' | translate
|
||||
}}</mat-checkbox>
|
||||
</div>
|
||||
@ -25,7 +25,7 @@
|
||||
}}</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
<mat-checkbox *ngIf="displayExtraOptionRemoveRedaction" formControlName="removeRedactionApplyToAll">{{
|
||||
<mat-checkbox *ngIf="displayExtraOptionRemoveRedaction()" formControlName="removeRedactionApplyToAll">{{
|
||||
'dialog-defaults-form.extra-option-label' | translate
|
||||
}}</mat-checkbox>
|
||||
</div>
|
||||
@ -39,7 +39,7 @@
|
||||
}}</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
<mat-checkbox *ngIf="displayExtraOptionRemoveRecommendation" formControlName="removeRecommendationApplyToAll">{{
|
||||
<mat-checkbox *ngIf="displayExtraOptionRemoveRecommendation()" formControlName="removeRecommendationApplyToAll">{{
|
||||
'dialog-defaults-form.extra-option-label' | translate
|
||||
}}</mat-checkbox>
|
||||
</div>
|
||||
@ -51,7 +51,7 @@
|
||||
<mat-option *ngFor="let option of hintAddOptions" [value]="option.value">{{ option.label | translate }}</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
<mat-checkbox *ngIf="displayExtraOptionAddHint" formControlName="addHintApplyToAll">{{
|
||||
<mat-checkbox *ngIf="displayExtraOptionAddHint()" formControlName="addHintApplyToAll">{{
|
||||
'dialog-defaults-form.extra-option-label' | translate
|
||||
}}</mat-checkbox>
|
||||
</div>
|
||||
@ -62,7 +62,7 @@
|
||||
<mat-option *ngFor="let option of removeOptions" [value]="option.value">{{ option.label | translate }}</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
<mat-checkbox *ngIf="displayExtraOptionRemoveHint" formControlName="removeHintApplyToAll">{{
|
||||
<mat-checkbox *ngIf="displayExtraOptionRemoveHint()" formControlName="removeHintApplyToAll">{{
|
||||
'dialog-defaults-form.extra-option-label' | translate
|
||||
}}</mat-checkbox>
|
||||
</div>
|
||||
|
||||
@ -1,11 +1,11 @@
|
||||
import { NgForOf, NgIf } from '@angular/common';
|
||||
import { ChangeDetectorRef, Component, inject } from '@angular/core';
|
||||
import { ChangeDetectorRef, Component, computed, inject } from '@angular/core';
|
||||
import { FormBuilder, FormGroup, ReactiveFormsModule } from '@angular/forms';
|
||||
import { MatCheckbox } from '@angular/material/checkbox';
|
||||
import { MatFormField } from '@angular/material/form-field';
|
||||
import { MatOption, MatSelect } from '@angular/material/select';
|
||||
import { BaseFormComponent } from '@common-ui/form';
|
||||
import { AsControl } from '@common-ui/utils';
|
||||
import { AsControl, formValueToSignal } from '@common-ui/utils';
|
||||
import { IconButtonComponent } from '@iqser/common-ui';
|
||||
import { TranslateModule } from '@ngx-translate/core';
|
||||
import { PreferencesKeys, UserPreferenceService } from '@users/user-preference.service';
|
||||
@ -48,57 +48,53 @@ export class DialogDefaultsComponent extends BaseFormComponent {
|
||||
readonly #formBuilder = inject(FormBuilder);
|
||||
readonly #userPreferences = inject(UserPreferenceService);
|
||||
readonly #changeDetectorRef = inject(ChangeDetectorRef);
|
||||
form: FormGroup<AsControl<DefaultOptionsForm>> = this.#formBuilder.group({
|
||||
addRedaction: this.#userPreferences.getAddRedactionDefaultOption(),
|
||||
addHint: this.#userPreferences.getAddHintDefaultOption(),
|
||||
removeRedaction: this.#userPreferences.getRemoveRedactionDefaultOption(),
|
||||
removeRecommendation: this.#userPreferences.getRemoveRecommendationDefaultOption(),
|
||||
removeHint: this.#userPreferences.getRemoveHintDefaultOption(),
|
||||
addRedactionApplyToAll: this.#userPreferences.getBool(PreferencesKeys.addRedactionDefaultExtraOption),
|
||||
removeRedactionApplyToAll: this.#userPreferences.getBool(PreferencesKeys.removeRedactionDefaultExtraOption),
|
||||
removeRecommendationApplyToAll: this.#userPreferences.getBool(PreferencesKeys.removeRecommendationDefaultExtraOption),
|
||||
addHintApplyToAll: this.#userPreferences.getBool(PreferencesKeys.addHintDefaultExtraOption),
|
||||
removeHintApplyToAll: this.#userPreferences.getBool(PreferencesKeys.removeHintDefaultExtraOption),
|
||||
});
|
||||
initialFormValue = this.form.getRawValue();
|
||||
|
||||
readonly redactionAddOptions = redactionAddOptions;
|
||||
readonly hintAddOptions = hintAddOptions;
|
||||
readonly removeOptions = removeOptions;
|
||||
readonly redactionRemoveOptions = redactionRemoveOptions;
|
||||
readonly recommendationRemoveOptions = recommendationRemoveOptions;
|
||||
|
||||
constructor() {
|
||||
super();
|
||||
}
|
||||
form: FormGroup<AsControl<DefaultOptionsForm>> = this.#formBuilder.group(this.#initialFormValue);
|
||||
initialFormValue = this.form.getRawValue();
|
||||
|
||||
get displayExtraOptionAddRedaction() {
|
||||
return RedactOrHintOptions.IN_DOSSIER === this.form.controls.addRedaction.value;
|
||||
}
|
||||
readonly formToSignalMap = {
|
||||
addRedaction: formValueToSignal<DefaultOptionsForm['addRedaction']>(this.form.controls.addRedaction),
|
||||
addHint: formValueToSignal<DefaultOptionsForm['addHint']>(this.form.controls.addHint),
|
||||
removeRedaction: formValueToSignal<DefaultOptionsForm['removeRedaction']>(this.form.controls.removeRedaction),
|
||||
removeHint: formValueToSignal<DefaultOptionsForm['removeHint']>(this.form.controls.removeHint),
|
||||
removeRecommendation: formValueToSignal<DefaultOptionsForm['removeRecommendation']>(this.form.controls.removeRecommendation),
|
||||
};
|
||||
|
||||
get displayExtraOptionAddHint() {
|
||||
return RedactOrHintOptions.IN_DOSSIER === this.form.controls.addHint.value;
|
||||
}
|
||||
|
||||
get displayExtraOptionRemoveRedaction() {
|
||||
return (
|
||||
readonly displayExtraOptionAddRedaction = computed(() => RedactOrHintOptions.IN_DOSSIER === this.formToSignalMap['addRedaction']());
|
||||
readonly displayExtraOptionAddHint = computed(() => RedactOrHintOptions.IN_DOSSIER === this.formToSignalMap['addHint']());
|
||||
readonly displayExtraOptionRemoveRedaction = computed(() =>
|
||||
(
|
||||
[RemoveRedactionOptions.IN_DOSSIER, RemoveRedactionOptions.FALSE_POSITIVE] as Partial<
|
||||
RemoveRedactionOption | SystemDefaultType
|
||||
>[]
|
||||
).includes(this.form.controls.removeRedaction.value);
|
||||
}
|
||||
).includes(this.formToSignalMap['removeRedaction']()),
|
||||
);
|
||||
readonly displayExtraOptionRemoveHint = computed(() => RemoveRedactionOptions.IN_DOSSIER === this.formToSignalMap['removeHint']());
|
||||
readonly displayExtraOptionRemoveRecommendation = computed(
|
||||
() => RemoveRedactionOptions.DO_NOT_RECOMMEND === this.formToSignalMap['removeRecommendation'](),
|
||||
);
|
||||
|
||||
get displayExtraOptionRemoveHint() {
|
||||
return RemoveRedactionOptions.IN_DOSSIER === this.form.controls.removeHint.value;
|
||||
}
|
||||
|
||||
get displayExtraOptionRemoveRecommendation() {
|
||||
return RemoveRedactionOptions.DO_NOT_RECOMMEND === this.form.controls.removeRecommendation.value;
|
||||
get #initialFormValue() {
|
||||
return {
|
||||
addRedaction: this.#userPreferences.getAddRedactionDefaultOption(),
|
||||
addHint: this.#userPreferences.getAddHintDefaultOption(),
|
||||
removeRedaction: this.#userPreferences.getRemoveRedactionDefaultOption(),
|
||||
removeRecommendation: this.#userPreferences.getRemoveRecommendationDefaultOption(),
|
||||
removeHint: this.#userPreferences.getRemoveHintDefaultOption(),
|
||||
addRedactionApplyToAll: this.#userPreferences.getBool(PreferencesKeys.addRedactionDefaultExtraOption),
|
||||
removeRedactionApplyToAll: this.#userPreferences.getBool(PreferencesKeys.removeRedactionDefaultExtraOption),
|
||||
removeRecommendationApplyToAll: this.#userPreferences.getBool(PreferencesKeys.removeRecommendationDefaultExtraOption),
|
||||
addHintApplyToAll: this.#userPreferences.getBool(PreferencesKeys.addHintDefaultExtraOption),
|
||||
removeHintApplyToAll: this.#userPreferences.getBool(PreferencesKeys.removeHintDefaultExtraOption),
|
||||
} as DefaultOptionsForm;
|
||||
}
|
||||
|
||||
async save(): Promise<any> {
|
||||
const formValue = this.form.value;
|
||||
|
||||
if (this.initialFormValue.addRedaction !== this.form.controls.addRedaction.value) {
|
||||
await this.#userPreferences.saveAddRedactionDefaultOption(this.form.controls.addRedaction.value);
|
||||
}
|
||||
@ -115,7 +111,7 @@ export class DialogDefaultsComponent extends BaseFormComponent {
|
||||
await this.#userPreferences.saveRemoveHintDefaultOption(this.form.controls.removeHint.value);
|
||||
}
|
||||
|
||||
if (this.displayExtraOptionAddRedaction) {
|
||||
if (this.displayExtraOptionAddRedaction()) {
|
||||
if (this.initialFormValue.addRedactionApplyToAll !== this.form.controls.addRedactionApplyToAll.value) {
|
||||
await this.#userPreferences.saveAddRedactionDefaultExtraOption(this.form.controls.addRedactionApplyToAll.value);
|
||||
}
|
||||
@ -123,7 +119,7 @@ export class DialogDefaultsComponent extends BaseFormComponent {
|
||||
await this.#userPreferences.saveAddRedactionDefaultExtraOption('undefined');
|
||||
}
|
||||
|
||||
if (this.displayExtraOptionAddHint) {
|
||||
if (this.displayExtraOptionAddHint()) {
|
||||
if (this.initialFormValue.addHintApplyToAll !== this.form.controls.addHintApplyToAll.value) {
|
||||
await this.#userPreferences.saveAddHintDefaultExtraOption(this.form.controls.addHintApplyToAll.value);
|
||||
}
|
||||
@ -131,7 +127,7 @@ export class DialogDefaultsComponent extends BaseFormComponent {
|
||||
await this.#userPreferences.saveAddHintDefaultExtraOption('undefined');
|
||||
}
|
||||
|
||||
if (this.displayExtraOptionRemoveRedaction) {
|
||||
if (this.displayExtraOptionRemoveRedaction()) {
|
||||
if (this.initialFormValue.removeRedactionApplyToAll !== this.form.controls.removeRedactionApplyToAll.value) {
|
||||
await this.#userPreferences.saveRemoveRedactionDefaultExtraOption(this.form.controls.removeRedactionApplyToAll.value);
|
||||
}
|
||||
@ -139,7 +135,7 @@ export class DialogDefaultsComponent extends BaseFormComponent {
|
||||
await this.#userPreferences.saveRemoveRedactionDefaultExtraOption('undefined');
|
||||
}
|
||||
|
||||
if (this.displayExtraOptionRemoveHint) {
|
||||
if (this.displayExtraOptionRemoveHint()) {
|
||||
if (this.initialFormValue.removeHintApplyToAll !== this.form.controls.removeHintApplyToAll.value) {
|
||||
await this.#userPreferences.saveRemoveHintDefaultExtraOption(this.form.controls.removeHintApplyToAll.value);
|
||||
}
|
||||
@ -147,7 +143,7 @@ export class DialogDefaultsComponent extends BaseFormComponent {
|
||||
await this.#userPreferences.saveRemoveHintDefaultExtraOption('undefined');
|
||||
}
|
||||
|
||||
if (this.displayExtraOptionRemoveRecommendation) {
|
||||
if (this.displayExtraOptionRemoveRecommendation()) {
|
||||
if (this.initialFormValue.removeRecommendationApplyToAll !== this.form.controls.removeRecommendationApplyToAll.value) {
|
||||
await this.#userPreferences.saveRemoveRecommendationDefaultExtraOption(
|
||||
this.form.controls.removeRecommendationApplyToAll.value,
|
||||
@ -164,17 +160,6 @@ export class DialogDefaultsComponent extends BaseFormComponent {
|
||||
}
|
||||
|
||||
#patchValues() {
|
||||
this.form.patchValue({
|
||||
addRedaction: this.#userPreferences.getAddRedactionDefaultOption(),
|
||||
addHint: this.#userPreferences.getAddHintDefaultOption(),
|
||||
removeRedaction: this.#userPreferences.getRemoveRedactionDefaultOption(),
|
||||
removeRecommendation: this.#userPreferences.getRemoveRecommendationDefaultOption(),
|
||||
removeHint: this.#userPreferences.getRemoveHintDefaultOption(),
|
||||
addRedactionApplyToAll: this.#userPreferences.getBool(PreferencesKeys.addRedactionDefaultExtraOption),
|
||||
removeRedactionApplyToAll: this.#userPreferences.getBool(PreferencesKeys.removeRedactionDefaultExtraOption),
|
||||
removeRecommendationApplyToAll: this.#userPreferences.getBool(PreferencesKeys.removeRecommendationDefaultExtraOption),
|
||||
addHintApplyToAll: this.#userPreferences.getBool(PreferencesKeys.addHintDefaultExtraOption),
|
||||
removeHintApplyToAll: this.#userPreferences.getBool(PreferencesKeys.removeHintDefaultExtraOption),
|
||||
});
|
||||
this.form.patchValue(this.#initialFormValue);
|
||||
}
|
||||
}
|
||||
|
||||
@ -22,8 +22,7 @@ import { MatFormField } from '@angular/material/form-field';
|
||||
import { MatOption, MatSelect, MatSelectTrigger } from '@angular/material/select';
|
||||
import { MatSlideToggle } from '@angular/material/slide-toggle';
|
||||
import { PdfViewer } from '../../../../pdf-viewer/services/pdf-viewer.service';
|
||||
import { formControlToSignal } from '@utils/functions';
|
||||
import { AsControl } from '@common-ui/utils';
|
||||
import { AsControl, formValueToSignal } from '@common-ui/utils';
|
||||
|
||||
interface UserProfileForm {
|
||||
email: string;
|
||||
@ -59,7 +58,7 @@ export class UserProfileScreenComponent extends BaseFormComponent {
|
||||
|
||||
readonly profileKeys = ['email', 'firstName', 'lastName'];
|
||||
readonly languages = this._translateService.langs;
|
||||
readonly language = formControlToSignal<UserProfileForm['language']>(this.form.controls.language);
|
||||
readonly language = formValueToSignal<UserProfileForm['language']>(this.form.controls.language);
|
||||
readonly languageSelectLabel = computed(() => this.translations[this.language()]);
|
||||
|
||||
constructor(
|
||||
@ -82,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<void> {
|
||||
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) {
|
||||
@ -119,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');
|
||||
}
|
||||
|
||||
|
||||
@ -3,10 +3,8 @@ import { ReactiveFormsModule, UntypedFormBuilder, UntypedFormGroup, Validators }
|
||||
import { AdminDialogService } from '../../../services/admin-dialog.service';
|
||||
import { BaseFormComponent, IconButtonComponent, LoadingService, Toaster } from '@iqser/common-ui';
|
||||
import { rolesTranslations } from '@translations/roles-translations';
|
||||
import { marker as _ } from '@biesbjerg/ngx-translate-extract-marker';
|
||||
import { User } from '@red/domain';
|
||||
import { UserService } from '@users/user.service';
|
||||
import { HttpStatusCode } from '@angular/common/http';
|
||||
import { firstValueFrom } from 'rxjs';
|
||||
import { IProfileUpdateRequest } from '@iqser/common-ui/lib/users';
|
||||
import { TranslateModule } from '@ngx-translate/core';
|
||||
@ -40,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);
|
||||
@ -49,7 +47,7 @@ export class UserDetailsComponent extends BaseFormComponent implements OnInit {
|
||||
}, []);
|
||||
}
|
||||
|
||||
get sendSetPasswordMail() {
|
||||
get #sendSetPasswordMail() {
|
||||
return !this.form.controls.sendSetPasswordMail.value;
|
||||
}
|
||||
|
||||
@ -91,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()) {
|
||||
|
||||
@ -6,8 +6,8 @@ import { JustificationsService } from '@services/entity-services/justifications.
|
||||
import { BaseDialogComponent, CircleButtonComponent, HasScrollbarDirective, IconButtonComponent } from '@iqser/common-ui';
|
||||
import { firstValueFrom } from 'rxjs';
|
||||
import { TranslateModule } from '@ngx-translate/core';
|
||||
import { formControlToSignal } from '@utils/functions';
|
||||
import { toSignal } from '@angular/core/rxjs-interop';
|
||||
import { formValueToSignal } from '@common-ui/utils';
|
||||
|
||||
interface DialogData {
|
||||
justification?: Justification;
|
||||
@ -22,7 +22,7 @@ interface DialogData {
|
||||
})
|
||||
export class AddEditJustificationDialogComponent extends BaseDialogComponent {
|
||||
readonly form = this.#getForm();
|
||||
readonly name = formControlToSignal(this.form.controls['name']);
|
||||
readonly name = formValueToSignal(this.form.controls['name']);
|
||||
readonly allJustifications = toSignal(this._justificationService.all$);
|
||||
readonly technicalName = computed(() => {
|
||||
if (this.data.justification) {
|
||||
|
||||
@ -1,144 +1,153 @@
|
||||
<div class="content-container">
|
||||
<div #viewer class="viewer"></div>
|
||||
|
||||
<redaction-paginator (changePage)="navigateTo($event)" *ngIf="loaded$ | async"></redaction-paginator>
|
||||
@if (loaded$ | async) {
|
||||
<redaction-paginator (changePage)="navigateTo($event)"></redaction-paginator>
|
||||
}
|
||||
|
||||
<div *ngIf="!!instance && changed && currentUser.isAdmin" class="changes-box">
|
||||
<iqser-icon-button
|
||||
(action)="save()"
|
||||
[disabled]="!valid"
|
||||
[label]="'watermark-screen.action.save' | translate"
|
||||
[type]="iconButtonTypes.primary"
|
||||
icon="iqser:check"
|
||||
></iqser-icon-button>
|
||||
@if (!!instance && changed() && currentUser.isAdmin) {
|
||||
<div class="changes-box">
|
||||
<iqser-icon-button
|
||||
(action)="save()"
|
||||
[disabled]="!valid()"
|
||||
[label]="'watermark-screen.action.save' | translate"
|
||||
[type]="iconButtonTypes.primary"
|
||||
icon="iqser:check"
|
||||
></iqser-icon-button>
|
||||
|
||||
<div (click)="revert()" [translate]="'watermark-screen.action.revert'" class="all-caps-label cancel"></div>
|
||||
<div (click)="revert()" [translate]="'watermark-screen.action.revert'" class="all-caps-label cancel"></div>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
|
||||
@if (watermark$ | async) {
|
||||
<div class="right-container" [attr.help-mode-key]="'watermarks'" iqserHasScrollbar>
|
||||
<form (keyup)="configChanged()" [formGroup]="form">
|
||||
<div class="iqser-input-group required w-300">
|
||||
<label [translate]="'watermark-screen.form.name-label'"></label>
|
||||
<input [placeholder]="'watermark-screen.form.name-placeholder' | translate" formControlName="name" type="text" />
|
||||
</div>
|
||||
|
||||
<div class="iqser-input-group required w-300">
|
||||
<label [translate]="'watermark-screen.form.text-label'"></label>
|
||||
<textarea
|
||||
[placeholder]="'watermark-screen.form.text-placeholder' | translate"
|
||||
class="w-full"
|
||||
formControlName="text"
|
||||
iqserHasScrollbar
|
||||
name="text"
|
||||
rows="4"
|
||||
type="text"
|
||||
></textarea>
|
||||
</div>
|
||||
|
||||
<div class="iqser-input-group">
|
||||
<label [translate]="'watermark-screen.form.orientation'" class="all-caps-label mb-8"></label>
|
||||
<div class="square-options">
|
||||
@for (option of orientationOptions; track option) {
|
||||
<div
|
||||
(click)="setValue('orientation', option)"
|
||||
[class.active]="form.controls.orientation.value === option"
|
||||
[class.disabled]="orientationStatus() === 'DISABLED'"
|
||||
[ngClass]="option"
|
||||
>
|
||||
<span>ABC</span>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="iqser-input-group">
|
||||
<label [translate]="'watermark-screen.form.alignment'" class="all-caps-label mb-8"></label>
|
||||
<div class="flex">
|
||||
<div [class.disabled]="horizontalTextAlignmentStatus() === 'DISABLED'" class="alignment-buttons">
|
||||
@for (alignment of watermarkHorizontalAlignments; track alignment) {
|
||||
<div
|
||||
(click)="alignHorizontally(alignment)"
|
||||
[class.active]="currentAlignment.horizontal === alignment"
|
||||
[class.disabled]="horizontalTextAlignmentStatus() === 'DISABLED'"
|
||||
[matTooltipPosition]="'above'"
|
||||
[matTooltip]="translations.HORIZONTAL[alignment] | translate"
|
||||
[ngClass]="'horizontal-' + loweredWatermarkHorizontalAlignments[alignment]"
|
||||
class="alignment"
|
||||
>
|
||||
<mat-icon [svgIcon]="'red:align-horizontal-' + loweredWatermarkHorizontalAlignments[alignment]"></mat-icon>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
<div [class.disabled]="verticalTextAlignmentStatus() === 'DISABLED'" class="alignment-buttons">
|
||||
@for (alignment of watermarkVerticalAlignments; track alignment) {
|
||||
<div
|
||||
(click)="alignVertically(alignment)"
|
||||
[class.active]="currentAlignment.vertical === alignment"
|
||||
[class.disabled]="verticalTextAlignmentStatus() === 'DISABLED'"
|
||||
[matTooltipPosition]="'above'"
|
||||
[matTooltip]="translations.VERTICAL[alignment] | translate"
|
||||
[ngClass]="'vertical-' + loweredWatermarkVerticalAlignments[alignment]"
|
||||
class="alignment"
|
||||
>
|
||||
<mat-icon [svgIcon]="'red:align-vertical-' + loweredWatermarkVerticalAlignments[alignment]"></mat-icon>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="iqser-input-group w-150">
|
||||
<label [translate]="'watermark-screen.form.font-size'" class="all-caps-label"></label>
|
||||
<mat-slider color="primary" max="50" min="5">
|
||||
<input (change)="configChanged()" formControlName="fontSize" matSliderThumb />
|
||||
</mat-slider>
|
||||
</div>
|
||||
|
||||
<div class="iqser-input-group w-150">
|
||||
<label [translate]="'watermark-screen.form.opacity'" class="all-caps-label"></label>
|
||||
<mat-slider color="primary" min="1">
|
||||
<input (change)="configChanged()" formControlName="opacity" matSliderThumb />
|
||||
</mat-slider>
|
||||
</div>
|
||||
|
||||
<div class="iqser-input-group w-150">
|
||||
<label [translate]="'watermark-screen.form.color'" class="all-caps-label mb-5"></label>
|
||||
<input
|
||||
[placeholder]="'watermark-screen.form.color-placeholder' | translate"
|
||||
class="hex-color-input"
|
||||
formControlName="hexColor"
|
||||
name="hexColor"
|
||||
type="text"
|
||||
/>
|
||||
<div
|
||||
(colorPickerChange)="setValue('hexColor', $event)"
|
||||
[class.disabled]="hexColorStatus() === 'DISABLED'"
|
||||
[colorPicker]="form.controls.hexColor.value"
|
||||
[cpDisabled]="hexColorStatus() === 'DISABLED'"
|
||||
[cpOutputFormat]="'hex'"
|
||||
[cpPosition]="'top-right'"
|
||||
[cpUseRootViewContainer]="true"
|
||||
[style.background]="form.controls.hexColor.value"
|
||||
class="input-icon"
|
||||
>
|
||||
@if (!form.controls.hexColor?.value || form.controls.hexColor.value?.length === 0) {
|
||||
<mat-icon svgIcon="iqser:color-picker"></mat-icon>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="iqser-input-group">
|
||||
<label [translate]="'watermark-screen.form.font-type'" class="all-caps-label mb-8"></label>
|
||||
<div class="square-options">
|
||||
@for (option of fontOptions; track option.value) {
|
||||
<div
|
||||
(click)="setValue('fontType', option.value)"
|
||||
[class.active]="form.controls.fontType.value === option.value"
|
||||
[class.disabled]="fontTypeStatus() === 'DISABLED'"
|
||||
[ngClass]="option.value"
|
||||
>
|
||||
{{ option.display }}
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div *ngIf="watermark$ | async" class="right-container" [attr.help-mode-key]="'watermarks'" iqserHasScrollbar>
|
||||
<form (keyup)="configChanged()" [formGroup]="form">
|
||||
<div class="iqser-input-group required w-300">
|
||||
<label [translate]="'watermark-screen.form.name-label'"></label>
|
||||
<input [placeholder]="'watermark-screen.form.name-placeholder' | translate" formControlName="name" type="text" />
|
||||
</div>
|
||||
|
||||
<div class="iqser-input-group required w-300">
|
||||
<label [translate]="'watermark-screen.form.text-label'"></label>
|
||||
<textarea
|
||||
[placeholder]="'watermark-screen.form.text-placeholder' | translate"
|
||||
class="w-full"
|
||||
formControlName="text"
|
||||
iqserHasScrollbar
|
||||
name="text"
|
||||
rows="4"
|
||||
type="text"
|
||||
></textarea>
|
||||
</div>
|
||||
|
||||
<div class="iqser-input-group">
|
||||
<label [translate]="'watermark-screen.form.orientation'" class="all-caps-label mb-8"></label>
|
||||
<div class="square-options">
|
||||
<div
|
||||
(click)="setValue('orientation', option)"
|
||||
*ngFor="let option of orientationOptions"
|
||||
[class.active]="form.controls.orientation.value === option"
|
||||
[class.disabled]="form.controls.orientation.disabled"
|
||||
[ngClass]="option"
|
||||
>
|
||||
<span>ABC</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="iqser-input-group">
|
||||
<label [translate]="'watermark-screen.form.alignment'" class="all-caps-label mb-8"></label>
|
||||
<div class="flex">
|
||||
<div [class.disabled]="form.controls.horizontalTextAlignment.disabled" class="alignment-buttons">
|
||||
<div
|
||||
(click)="alignHorizontally(alignment)"
|
||||
*ngFor="let alignment of watermarkHorizontalAlignments"
|
||||
[class.active]="currentAlignment.horizontal === alignment"
|
||||
[class.disabled]="form.controls.horizontalTextAlignment.disabled"
|
||||
[matTooltipPosition]="'above'"
|
||||
[matTooltip]="translations.HORIZONTAL[alignment] | translate"
|
||||
[ngClass]="'horizontal-' + alignment.toLowerCase()"
|
||||
class="alignment"
|
||||
>
|
||||
<mat-icon [svgIcon]="'red:align-horizontal-' + alignment.toLowerCase()"></mat-icon>
|
||||
</div>
|
||||
</div>
|
||||
<div [class.disabled]="form.controls.verticalTextAlignment.disabled" class="alignment-buttons">
|
||||
<div
|
||||
(click)="alignVertically(alignment)"
|
||||
*ngFor="let alignment of watermarkVerticalAlignments"
|
||||
[class.active]="currentAlignment.vertical === alignment"
|
||||
[class.disabled]="form.controls.verticalTextAlignment.disabled"
|
||||
[matTooltipPosition]="'above'"
|
||||
[matTooltip]="translations.VERTICAL[alignment] | translate"
|
||||
[ngClass]="'vertical-' + alignment.toLowerCase()"
|
||||
class="alignment"
|
||||
>
|
||||
<mat-icon [svgIcon]="'red:align-vertical-' + alignment.toLowerCase()"></mat-icon>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="iqser-input-group w-150">
|
||||
<label [translate]="'watermark-screen.form.font-size'" class="all-caps-label"></label>
|
||||
<mat-slider color="primary" max="50" min="5">
|
||||
<input (change)="configChanged()" formControlName="fontSize" matSliderThumb />
|
||||
</mat-slider>
|
||||
</div>
|
||||
|
||||
<div class="iqser-input-group w-150">
|
||||
<label [translate]="'watermark-screen.form.opacity'" class="all-caps-label"></label>
|
||||
<mat-slider color="primary" min="1">
|
||||
<input (change)="configChanged()" formControlName="opacity" matSliderThumb />
|
||||
</mat-slider>
|
||||
</div>
|
||||
|
||||
<div class="iqser-input-group w-150">
|
||||
<label [translate]="'watermark-screen.form.color'" class="all-caps-label mb-5"></label>
|
||||
<input
|
||||
[placeholder]="'watermark-screen.form.color-placeholder' | translate"
|
||||
class="hex-color-input"
|
||||
formControlName="hexColor"
|
||||
name="hexColor"
|
||||
type="text"
|
||||
/>
|
||||
<div
|
||||
(colorPickerChange)="setValue('hexColor', $event)"
|
||||
[class.disabled]="form.controls.hexColor.disabled"
|
||||
[colorPicker]="form.controls.hexColor.value"
|
||||
[cpDisabled]="form.controls.hexColor.disabled"
|
||||
[cpOutputFormat]="'hex'"
|
||||
[cpPosition]="'top-right'"
|
||||
[cpUseRootViewContainer]="true"
|
||||
[style.background]="form.controls.hexColor.value"
|
||||
class="input-icon"
|
||||
>
|
||||
<mat-icon
|
||||
*ngIf="!form.controls.hexColor?.value || form.controls.hexColor.value?.length === 0"
|
||||
svgIcon="iqser:color-picker"
|
||||
></mat-icon>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="iqser-input-group">
|
||||
<label [translate]="'watermark-screen.form.font-type'" class="all-caps-label mb-8"></label>
|
||||
<div class="square-options">
|
||||
<div
|
||||
(click)="setValue('fontType', option.value)"
|
||||
*ngFor="let option of fontOptions"
|
||||
[class.active]="form.controls.fontType.value === option.value"
|
||||
[class.disabled]="form.controls.fontType.disabled"
|
||||
[ngClass]="option.value"
|
||||
>
|
||||
{{ option.display }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
}
|
||||
|
||||
@ -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<HTMLDivElement>;
|
||||
private readonly _viewer = viewChild.required<ElementRef<HTMLDivElement>>('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<User>();
|
||||
readonly form = this.#form;
|
||||
readonly form: FormGroup<AsControl<WatermarkForm>> = this.#form;
|
||||
readonly watermark$: Observable<Partial<IWatermark>>;
|
||||
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<AsControl<WatermarkForm>> = this._formBuilder.group({
|
||||
name: [null],
|
||||
text: [null],
|
||||
get #form(): FormGroup<AsControl<WatermarkForm>> {
|
||||
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());
|
||||
|
||||
@ -1,82 +1,84 @@
|
||||
<a
|
||||
*ngIf="stats as dossierTemplate"
|
||||
[attr.help-mode-key]="!dossierTemplate.isEmpty ? 'open_dossier_template' : null"
|
||||
[class.empty]="dossierTemplate.isEmpty"
|
||||
[routerLink]="dossierTemplate.isEmpty ? null : ['..', dossierTemplate.dossierTemplateId, 'dossiers']"
|
||||
class="dialog"
|
||||
>
|
||||
<ng-container *ngIf="!dossierTemplate.isEmpty; else empty">
|
||||
<div class="flex-2">
|
||||
<div class="heading mb-6">{{ dossierTemplate.name }}</div>
|
||||
<div class="stats-subtitle">
|
||||
<div>
|
||||
<mat-icon svgIcon="red:archive"></mat-icon>
|
||||
<span
|
||||
[innerHTML]="
|
||||
'dossier-template-stats.archived-dossiers' | translate: { count: dossierTemplate.numberOfArchivedDossiers }
|
||||
"
|
||||
></span>
|
||||
</div>
|
||||
<div>
|
||||
<mat-icon svgIcon="iqser:trash"></mat-icon>
|
||||
<span
|
||||
[innerHTML]="
|
||||
'dossier-template-stats.deleted-dossiers' | translate: { count: dossierTemplate.numberOfDeletedDossiers }
|
||||
"
|
||||
></span>
|
||||
</div>
|
||||
<div>
|
||||
<mat-icon svgIcon="red:user"></mat-icon>
|
||||
<span [innerHTML]="'dossier-template-stats.total-people' | translate: { count: dossierTemplate.numberOfPeople }"></span>
|
||||
</div>
|
||||
<div>
|
||||
<mat-icon svgIcon="iqser:pages"></mat-icon>
|
||||
<span
|
||||
[innerHTML]="'dossier-template-stats.analyzed-pages' | translate: { count: dossierTemplate.numberOfPages }"
|
||||
></span>
|
||||
@if (stats(); as dossierTemplate) {
|
||||
<a
|
||||
[attr.help-mode-key]="!isTemplateEmpty() ? 'open_dossier_template' : null"
|
||||
[class.empty]="isTemplateEmpty()"
|
||||
[routerLink]="isTemplateEmpty() ? null : ['..', dossierTemplate.dossierTemplateId, 'dossiers']"
|
||||
class="dialog"
|
||||
>
|
||||
@if (!isTemplateEmpty()) {
|
||||
<div class="flex-2">
|
||||
<div class="heading mb-6">{{ dossierTemplate.name }}</div>
|
||||
<div class="stats-subtitle">
|
||||
<div>
|
||||
<mat-icon svgIcon="red:archive"></mat-icon>
|
||||
<span
|
||||
[innerHTML]="
|
||||
'dossier-template-stats.archived-dossiers' | translate: { count: dossierTemplate.numberOfArchivedDossiers }
|
||||
"
|
||||
></span>
|
||||
</div>
|
||||
<div>
|
||||
<mat-icon svgIcon="iqser:trash"></mat-icon>
|
||||
<span
|
||||
[innerHTML]="
|
||||
'dossier-template-stats.deleted-dossiers' | translate: { count: dossierTemplate.numberOfDeletedDossiers }
|
||||
"
|
||||
></span>
|
||||
</div>
|
||||
<div>
|
||||
<mat-icon svgIcon="red:user"></mat-icon>
|
||||
<span
|
||||
[innerHTML]="'dossier-template-stats.total-people' | translate: { count: dossierTemplate.numberOfPeople }"
|
||||
></span>
|
||||
</div>
|
||||
<div>
|
||||
<mat-icon svgIcon="iqser:pages"></mat-icon>
|
||||
<span
|
||||
[innerHTML]="'dossier-template-stats.analyzed-pages' | translate: { count: dossierTemplate.numberOfPages }"
|
||||
></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex-3">
|
||||
<redaction-donut-chart
|
||||
[config]="dossierStates()"
|
||||
[radius]="63"
|
||||
[strokeWidth]="15"
|
||||
[subtitles]="['dossier-template-stats.active-dossiers' | translate: { count: dossierTemplate.numberOfActiveDossiers }]"
|
||||
direction="row"
|
||||
totalType="sum"
|
||||
></redaction-donut-chart>
|
||||
</div>
|
||||
<div class="flex-3">
|
||||
<redaction-donut-chart
|
||||
[config]="workflowStatuses()"
|
||||
[radius]="63"
|
||||
[strokeWidth]="15"
|
||||
[subtitles]="['dossier-template-stats.total-documents' | translate]"
|
||||
direction="row"
|
||||
totalType="sum"
|
||||
></redaction-donut-chart>
|
||||
</div>
|
||||
} @else {
|
||||
<div class="text-muted">
|
||||
<div class="heading mb-8">
|
||||
{{ dossierTemplate.name }}
|
||||
</div>
|
||||
<div>
|
||||
{{ 'dashboard.empty-template.description' | translate }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex-3">
|
||||
<redaction-donut-chart
|
||||
[config]="translateChartService.translateAndSortDossierStates(dossierTemplate.dossiersChartConfig, dossierTemplate.id)"
|
||||
[radius]="63"
|
||||
[strokeWidth]="15"
|
||||
[subtitles]="['dossier-template-stats.active-dossiers' | translate: { count: dossierTemplate.numberOfActiveDossiers }]"
|
||||
direction="row"
|
||||
totalType="sum"
|
||||
></redaction-donut-chart>
|
||||
</div>
|
||||
<div class="flex-3">
|
||||
<redaction-donut-chart
|
||||
[config]="translateChartService.translateWorkflowStatus(dossierTemplate.documentsChartConfig)"
|
||||
[radius]="63"
|
||||
[strokeWidth]="15"
|
||||
[subtitles]="['dossier-template-stats.total-documents' | translate]"
|
||||
direction="row"
|
||||
totalType="sum"
|
||||
></redaction-donut-chart>
|
||||
</div>
|
||||
</ng-container>
|
||||
|
||||
<ng-template #empty>
|
||||
<div class="text-muted">
|
||||
<div class="heading mb-8">
|
||||
{{ dossierTemplate.name }}
|
||||
</div>
|
||||
<div>
|
||||
{{ 'dashboard.empty-template.description' | translate }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<iqser-icon-button
|
||||
(action)="newDossier()"
|
||||
*ngIf="permissionsService.canCreateDossier(dossierTemplate)"
|
||||
[attr.help-mode-key]="'new_dossier'"
|
||||
[label]="'dashboard.empty-template.new-dossier' | translate"
|
||||
[type]="iconButtonTypes.primary"
|
||||
[buttonId]="(dossierTemplate.name | snakeCase) + '-icon-button'"
|
||||
icon="iqser:plus"
|
||||
></iqser-icon-button>
|
||||
</ng-template>
|
||||
</a>
|
||||
@if (canCreateDossier()) {
|
||||
<iqser-icon-button
|
||||
(action)="newDossier()"
|
||||
[attr.help-mode-key]="'new_dossier'"
|
||||
[label]="'dashboard.empty-template.new-dossier' | translate"
|
||||
[type]="iconButtonTypes.primary"
|
||||
[buttonId]="(dossierTemplate.name | snakeCase) + '-icon-button'"
|
||||
icon="iqser:plus"
|
||||
></iqser-icon-button>
|
||||
}
|
||||
}
|
||||
</a>
|
||||
}
|
||||
|
||||
@ -1,11 +1,10 @@
|
||||
import { Component, Input } from '@angular/core';
|
||||
import { Component, computed, input } from '@angular/core';
|
||||
import { DashboardStats } from '@red/domain';
|
||||
import { IconButtonComponent, IconButtonTypes } from '@iqser/common-ui';
|
||||
import { TranslateChartService } from '@services/translate-chart.service';
|
||||
import { SharedDialogService } from '@shared/services/dialog.service';
|
||||
import { Roles } from '@users/roles';
|
||||
import { PermissionsService } from '@services/permissions.service';
|
||||
import { NgIf } from '@angular/common';
|
||||
import { RouterLink } from '@angular/router';
|
||||
import { MatIcon } from '@angular/material/icon';
|
||||
import { TranslateModule } from '@ngx-translate/core';
|
||||
@ -17,13 +16,20 @@ import { SnakeCasePipe } from '@common-ui/pipes/snake-case.pipe';
|
||||
templateUrl: './template-stats.component.html',
|
||||
styleUrls: ['./template-stats.component.scss'],
|
||||
standalone: true,
|
||||
imports: [NgIf, RouterLink, MatIcon, TranslateModule, DonutChartComponent, IconButtonComponent, SnakeCasePipe],
|
||||
imports: [RouterLink, MatIcon, TranslateModule, DonutChartComponent, IconButtonComponent, SnakeCasePipe],
|
||||
})
|
||||
export class TemplateStatsComponent {
|
||||
readonly iconButtonTypes = IconButtonTypes;
|
||||
readonly roles = Roles;
|
||||
|
||||
@Input() stats: DashboardStats;
|
||||
readonly stats = input<DashboardStats>();
|
||||
|
||||
readonly dossierStates = computed(() =>
|
||||
this.translateChartService.translateAndSortDossierStates(this.stats().dossiersChartConfig, this.stats().id),
|
||||
);
|
||||
readonly workflowStatuses = computed(() => this.translateChartService.translateWorkflowStatus(this.stats().documentsChartConfig));
|
||||
readonly isTemplateEmpty = computed(() => this.stats().isEmpty);
|
||||
readonly canCreateDossier = computed(() => this.permissionsService.canCreateDossier(this.stats()));
|
||||
|
||||
constructor(
|
||||
private readonly _dialogService: SharedDialogService,
|
||||
@ -32,6 +38,6 @@ export class TemplateStatsComponent {
|
||||
) {}
|
||||
|
||||
newDossier(): void {
|
||||
this._dialogService.openDialog('addDossier', { dossierTemplateId: this.stats.dossierTemplateId });
|
||||
this._dialogService.openDialog('addDossier', { dossierTemplateId: this.stats().dossierTemplateId });
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,9 +1,11 @@
|
||||
<ng-container (longPress)="forceReanalysisAction($event)" *ngIf="selectedFiles.length" redactionLongPress>
|
||||
<redaction-expandable-file-actions
|
||||
[actions]="buttons"
|
||||
[buttonType]="buttonType"
|
||||
[maxWidth]="maxWidth"
|
||||
[tooltipPosition]="IqserTooltipPositions.above"
|
||||
>
|
||||
</redaction-expandable-file-actions>
|
||||
</ng-container>
|
||||
@if (selectedFiles().length) {
|
||||
<ng-container (longPress)="forceReanalysisAction($event)" redactionLongPress>
|
||||
<redaction-expandable-file-actions
|
||||
[actions]="buttons"
|
||||
[buttonType]="buttonType()"
|
||||
[maxWidth]="maxWidth()"
|
||||
[tooltipPosition]="IqserTooltipPositions.above"
|
||||
>
|
||||
</redaction-expandable-file-actions>
|
||||
</ng-container>
|
||||
}
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import { Component, Input, OnChanges } from '@angular/core';
|
||||
import { Component, input, OnChanges } from '@angular/core';
|
||||
import { marker as _ } from '@biesbjerg/ngx-translate-extract-marker';
|
||||
import { CircleButtonType, CircleButtonTypes } from '@iqser/common-ui';
|
||||
import { Action, ActionTypes, Dossier, File, ProcessingFileStatuses } from '@red/domain';
|
||||
@ -8,14 +8,13 @@ import { UserPreferenceService } from '@users/user-preference.service';
|
||||
import { BulkActionsService } from '../../services/bulk-actions.service';
|
||||
import { ExpandableFileActionsComponent } from '@shared/components/expandable-file-actions/expandable-file-actions.component';
|
||||
import { IqserTooltipPositions } from '@common-ui/utils';
|
||||
import { NgIf } from '@angular/common';
|
||||
|
||||
@Component({
|
||||
selector: 'redaction-dossier-overview-bulk-actions [dossier] [selectedFiles]',
|
||||
templateUrl: './dossier-overview-bulk-actions.component.html',
|
||||
styleUrls: ['./dossier-overview-bulk-actions.component.scss'],
|
||||
standalone: true,
|
||||
imports: [LongPressDirective, ExpandableFileActionsComponent, NgIf],
|
||||
imports: [LongPressDirective, ExpandableFileActionsComponent],
|
||||
})
|
||||
export class DossierOverviewBulkActionsComponent implements OnChanges {
|
||||
#analysisForced: boolean;
|
||||
@ -37,10 +36,10 @@ export class DossierOverviewBulkActionsComponent implements OnChanges {
|
||||
#toggleAnalysisTooltip: string;
|
||||
#allFilesAreExcluded: boolean;
|
||||
#canMoveToSameState: boolean;
|
||||
@Input() dossier: Dossier;
|
||||
@Input() selectedFiles: File[];
|
||||
@Input() buttonType: CircleButtonType = CircleButtonTypes.default;
|
||||
@Input() maxWidth: number;
|
||||
readonly dossier = input<Dossier>();
|
||||
readonly selectedFiles = input<File[]>();
|
||||
readonly buttonType = input<CircleButtonType>(CircleButtonTypes.default);
|
||||
readonly maxWidth = input<number>();
|
||||
buttons: Action[];
|
||||
readonly IqserTooltipPositions = IqserTooltipPositions;
|
||||
|
||||
@ -50,12 +49,12 @@ export class DossierOverviewBulkActionsComponent implements OnChanges {
|
||||
private readonly _bulkActionsService: BulkActionsService,
|
||||
) {}
|
||||
|
||||
private get _buttons(): Action[] {
|
||||
get #buttons(): Action[] {
|
||||
const actions: Action[] = [
|
||||
{
|
||||
id: 'delete-files-btn',
|
||||
type: ActionTypes.circleBtn,
|
||||
action: () => this._bulkActionsService.delete(this.selectedFiles),
|
||||
action: () => this._bulkActionsService.delete(this.selectedFiles()),
|
||||
tooltip: _('dossier-overview.bulk.delete'),
|
||||
icon: 'iqser:trash',
|
||||
show: this.#canDelete,
|
||||
@ -63,7 +62,7 @@ export class DossierOverviewBulkActionsComponent implements OnChanges {
|
||||
{
|
||||
id: 'assign-files-btn',
|
||||
type: ActionTypes.circleBtn,
|
||||
action: () => this._bulkActionsService.assign(this.selectedFiles),
|
||||
action: () => this._bulkActionsService.assign(this.selectedFiles()),
|
||||
tooltip: this.#assignTooltip,
|
||||
icon: 'red:assign',
|
||||
show: this.#canAssign,
|
||||
@ -71,7 +70,7 @@ export class DossierOverviewBulkActionsComponent implements OnChanges {
|
||||
{
|
||||
id: 'assign-files-to-me-btn',
|
||||
type: ActionTypes.circleBtn,
|
||||
action: () => this._bulkActionsService.assignToMe(this.selectedFiles),
|
||||
action: () => this._bulkActionsService.assignToMe(this.selectedFiles()),
|
||||
tooltip: _('dossier-overview.assign-me'),
|
||||
icon: 'red:assign-me',
|
||||
show: this.#canAssignToSelf,
|
||||
@ -79,7 +78,7 @@ export class DossierOverviewBulkActionsComponent implements OnChanges {
|
||||
{
|
||||
id: 'to-new-btn',
|
||||
type: ActionTypes.circleBtn,
|
||||
action: () => this._bulkActionsService.setToNew(this.selectedFiles),
|
||||
action: () => this._bulkActionsService.setToNew(this.selectedFiles()),
|
||||
tooltip: _('dossier-overview.back-to-new'),
|
||||
icon: 'red:undo',
|
||||
show: this.#canSetToNew,
|
||||
@ -87,7 +86,7 @@ export class DossierOverviewBulkActionsComponent implements OnChanges {
|
||||
{
|
||||
id: 'to-under-approval-btn',
|
||||
type: ActionTypes.circleBtn,
|
||||
action: () => this._bulkActionsService.setToUnderApproval(this.selectedFiles),
|
||||
action: () => this._bulkActionsService.setToUnderApproval(this.selectedFiles()),
|
||||
tooltip: _('dossier-overview.under-approval'),
|
||||
icon: 'red:ready-for-approval',
|
||||
show: this.#canSetToUnderApproval,
|
||||
@ -95,7 +94,7 @@ export class DossierOverviewBulkActionsComponent implements OnChanges {
|
||||
{
|
||||
id: 'to-under-review-btn',
|
||||
type: ActionTypes.circleBtn,
|
||||
action: () => this._bulkActionsService.backToUnderReview(this.selectedFiles),
|
||||
action: () => this._bulkActionsService.backToUnderReview(this.selectedFiles()),
|
||||
tooltip: _('dossier-overview.under-review'),
|
||||
icon: 'red:undo',
|
||||
show: this.#canSetToUnderReview,
|
||||
@ -103,14 +102,14 @@ export class DossierOverviewBulkActionsComponent implements OnChanges {
|
||||
{
|
||||
id: 'download-files-btn',
|
||||
type: ActionTypes.downloadBtn,
|
||||
show: !this.selectedFiles.some(file => file.processingStatus === ProcessingFileStatuses.ERROR || !file.lastProcessed),
|
||||
files: this.selectedFiles,
|
||||
dossier: this.dossier,
|
||||
show: !this.selectedFiles().some(file => file.processingStatus === ProcessingFileStatuses.ERROR || !file.lastProcessed),
|
||||
files: this.selectedFiles(),
|
||||
dossier: this.dossier(),
|
||||
},
|
||||
{
|
||||
id: 'approve-files-btn',
|
||||
type: ActionTypes.circleBtn,
|
||||
action: () => this._bulkActionsService.approve(this.selectedFiles),
|
||||
action: () => this._bulkActionsService.approve(this.selectedFiles()),
|
||||
disabled: !this.#canApprove,
|
||||
tooltip: this.#canApprove ? _('dossier-overview.approve') : _('dossier-overview.approve-disabled'),
|
||||
icon: 'red:approved',
|
||||
@ -119,7 +118,7 @@ export class DossierOverviewBulkActionsComponent implements OnChanges {
|
||||
{
|
||||
id: 'set-under-approval-btn',
|
||||
type: ActionTypes.circleBtn,
|
||||
action: () => this._bulkActionsService.setToUnderApproval(this.selectedFiles),
|
||||
action: () => this._bulkActionsService.setToUnderApproval(this.selectedFiles()),
|
||||
tooltip: _('dossier-overview.under-approval'),
|
||||
icon: 'red:undo',
|
||||
show: this.#canUndoApproval,
|
||||
@ -127,7 +126,7 @@ export class DossierOverviewBulkActionsComponent implements OnChanges {
|
||||
{
|
||||
id: 'ocr-files-btn',
|
||||
type: ActionTypes.circleBtn,
|
||||
action: () => this._bulkActionsService.ocr(this.selectedFiles),
|
||||
action: () => this._bulkActionsService.ocr(this.selectedFiles()),
|
||||
tooltip: _('dossier-overview.ocr-file'),
|
||||
icon: 'iqser:ocr',
|
||||
show: this.#canOcr,
|
||||
@ -135,17 +134,17 @@ export class DossierOverviewBulkActionsComponent implements OnChanges {
|
||||
{
|
||||
id: 'reanalyse-files-btn',
|
||||
type: ActionTypes.circleBtn,
|
||||
action: () => this._bulkActionsService.reanalyse(this.selectedFiles),
|
||||
action: () => this._bulkActionsService.reanalyse(this.selectedFiles()),
|
||||
tooltip: _('dossier-overview.bulk.reanalyse'),
|
||||
icon: 'iqser:refresh',
|
||||
show:
|
||||
this.#canReanalyse &&
|
||||
(this.#analysisForced || this.#canEnableAutoAnalysis || this.selectedFiles.every(file => file.isError)),
|
||||
(this.#analysisForced || this.#canEnableAutoAnalysis || this.selectedFiles().every(file => file.isError)),
|
||||
},
|
||||
{
|
||||
id: 'stop-automatic-analysis-btn',
|
||||
type: ActionTypes.circleBtn,
|
||||
action: () => this._bulkActionsService.toggleAutomaticAnalysis(this.selectedFiles),
|
||||
action: () => this._bulkActionsService.toggleAutomaticAnalysis(this.selectedFiles()),
|
||||
tooltip: _('dossier-overview.stop-auto-analysis'),
|
||||
icon: 'red:disable-analysis',
|
||||
show: this.#canDisableAutoAnalysis,
|
||||
@ -153,7 +152,7 @@ export class DossierOverviewBulkActionsComponent implements OnChanges {
|
||||
{
|
||||
id: 'start-automatic-analysis-btn',
|
||||
type: ActionTypes.circleBtn,
|
||||
action: () => this._bulkActionsService.toggleAutomaticAnalysis(this.selectedFiles),
|
||||
action: () => this._bulkActionsService.toggleAutomaticAnalysis(this.selectedFiles()),
|
||||
tooltip: _('dossier-overview.start-auto-analysis'),
|
||||
icon: 'red:enable-analysis',
|
||||
show: this.#canEnableAutoAnalysis,
|
||||
@ -161,7 +160,7 @@ export class DossierOverviewBulkActionsComponent implements OnChanges {
|
||||
{
|
||||
id: 'toggle-analysis-btn',
|
||||
type: ActionTypes.toggle,
|
||||
action: () => this._bulkActionsService.toggleAnalysis(this.selectedFiles, !this.#allFilesAreExcluded),
|
||||
action: () => this._bulkActionsService.toggleAnalysis(this.selectedFiles(), !this.#allFilesAreExcluded),
|
||||
tooltip: this.#toggleAnalysisTooltip,
|
||||
checked: !this.#allFilesAreExcluded,
|
||||
show: this.#canToggleAnalysis,
|
||||
@ -172,56 +171,56 @@ export class DossierOverviewBulkActionsComponent implements OnChanges {
|
||||
}
|
||||
|
||||
ngOnChanges() {
|
||||
this._setup();
|
||||
this.#setup();
|
||||
}
|
||||
|
||||
forceReanalysisAction($event: LongPressEvent) {
|
||||
this.#analysisForced = !$event.touchEnd && this._userPreferenceService.isIqserDevMode;
|
||||
this._setup();
|
||||
this.#setup();
|
||||
}
|
||||
|
||||
private _setup() {
|
||||
if (!this.selectedFiles.length) {
|
||||
#setup() {
|
||||
if (!this.selectedFiles().length) {
|
||||
return;
|
||||
}
|
||||
const allFilesAreUnderReviewOrUnassigned = this.selectedFiles.reduce(
|
||||
const allFilesAreUnderReviewOrUnassigned = this.selectedFiles().reduce(
|
||||
(acc, file) => acc && (file.isUnderReview || file.isNew),
|
||||
true,
|
||||
);
|
||||
const allFilesAreUnderApproval = this.selectedFiles.reduce((acc, file) => acc && file.isUnderApproval, true);
|
||||
const allFilesAreApproved = this.selectedFiles.reduce((acc, file) => acc && file.isApproved, true);
|
||||
this.#allFilesAreExcluded = this.selectedFiles.reduce((acc, file) => acc && file.excluded, true);
|
||||
const allFilesAreUnderApproval = this.selectedFiles().reduce((acc, file) => acc && file.isUnderApproval, true);
|
||||
const allFilesAreApproved = this.selectedFiles().reduce((acc, file) => acc && file.isApproved, true);
|
||||
this.#allFilesAreExcluded = this.selectedFiles().reduce((acc, file) => acc && file.excluded, true);
|
||||
this.#canMoveToSameState = allFilesAreUnderReviewOrUnassigned || allFilesAreUnderApproval || allFilesAreApproved;
|
||||
|
||||
this.#canAssign =
|
||||
this.#canMoveToSameState &&
|
||||
(this._permissionsService.canAssignUser(this.selectedFiles, this.dossier) ||
|
||||
this._permissionsService.canUnassignUser(this.selectedFiles, this.dossier));
|
||||
this.#canAssignToSelf = this.#canMoveToSameState && this._permissionsService.canAssignToSelf(this.selectedFiles, this.dossier);
|
||||
(this._permissionsService.canAssignUser(this.selectedFiles(), this.dossier()) ||
|
||||
this._permissionsService.canUnassignUser(this.selectedFiles(), this.dossier()));
|
||||
this.#canAssignToSelf = this.#canMoveToSameState && this._permissionsService.canAssignToSelf(this.selectedFiles(), this.dossier());
|
||||
|
||||
this.#canDelete = this._permissionsService.canSoftDeleteFile(this.selectedFiles, this.dossier);
|
||||
this.#canDelete = this._permissionsService.canSoftDeleteFile(this.selectedFiles(), this.dossier());
|
||||
|
||||
this.#canReanalyse = this._permissionsService.canReanalyseFile(this.selectedFiles, this.dossier);
|
||||
this.#canReanalyse = this._permissionsService.canReanalyseFile(this.selectedFiles(), this.dossier());
|
||||
|
||||
this.#canDisableAutoAnalysis = this._permissionsService.canDisableAutoAnalysis(this.selectedFiles, this.dossier);
|
||||
this.#canDisableAutoAnalysis = this._permissionsService.canDisableAutoAnalysis(this.selectedFiles(), this.dossier());
|
||||
|
||||
this.#canEnableAutoAnalysis = this._permissionsService.canEnableAutoAnalysis(this.selectedFiles, this.dossier);
|
||||
this.#canEnableAutoAnalysis = this._permissionsService.canEnableAutoAnalysis(this.selectedFiles(), this.dossier());
|
||||
|
||||
this.#canToggleAnalysis = this._permissionsService.canToggleAnalysis(this.selectedFiles, this.dossier);
|
||||
this.#canToggleAnalysis = this._permissionsService.canToggleAnalysis(this.selectedFiles(), this.dossier());
|
||||
|
||||
this.#canOcr = this._permissionsService.canOcrFile(this.selectedFiles, this.dossier);
|
||||
this.#canOcr = this._permissionsService.canOcrFile(this.selectedFiles(), this.dossier());
|
||||
|
||||
this.#canSetToNew = this._permissionsService.canSetToNew(this.selectedFiles, this.dossier);
|
||||
this.#canSetToNew = this._permissionsService.canSetToNew(this.selectedFiles(), this.dossier());
|
||||
|
||||
this.#canSetToUnderReview = this._permissionsService.canSetUnderReview(this.selectedFiles, this.dossier);
|
||||
this.#canSetToUnderReview = this._permissionsService.canSetUnderReview(this.selectedFiles(), this.dossier());
|
||||
|
||||
this.#canSetToUnderApproval = this._permissionsService.canSetUnderApproval(this.selectedFiles, this.dossier);
|
||||
this.#canSetToUnderApproval = this._permissionsService.canSetUnderApproval(this.selectedFiles(), this.dossier());
|
||||
|
||||
this.#isReadyForApproval = this._permissionsService.isReadyForApproval(this.selectedFiles, this.dossier);
|
||||
this.#isReadyForApproval = this._permissionsService.isReadyForApproval(this.selectedFiles(), this.dossier());
|
||||
|
||||
this.#canApprove = this._permissionsService.canBeApproved(this.selectedFiles, this.dossier);
|
||||
this.#canApprove = this._permissionsService.canBeApproved(this.selectedFiles(), this.dossier());
|
||||
|
||||
this.#canUndoApproval = this._permissionsService.canUndoApproval(this.selectedFiles, this.dossier);
|
||||
this.#canUndoApproval = this._permissionsService.canUndoApproval(this.selectedFiles(), this.dossier());
|
||||
|
||||
this.#assignTooltip = allFilesAreUnderApproval ? _('dossier-overview.assign-approver') : _('dossier-overview.assign-reviewer');
|
||||
|
||||
@ -229,6 +228,6 @@ export class DossierOverviewBulkActionsComponent implements OnChanges {
|
||||
? _('file-preview.toggle-analysis.enable')
|
||||
: _('file-preview.toggle-analysis.disable');
|
||||
|
||||
this.buttons = this._buttons;
|
||||
this.buttons = this.#buttons;
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,81 +1,97 @@
|
||||
<ng-container *ngIf="dossierStats$ | async as stats">
|
||||
@if (dossierStats$ | async; as stats) {
|
||||
<div>
|
||||
<mat-icon svgIcon="iqser:document"></mat-icon>
|
||||
<span>{{ 'dossier-overview.dossier-details.stats.documents' | translate : { count: stats.numberOfFiles } }}</span>
|
||||
<span>{{ 'dossier-overview.dossier-details.stats.documents' | translate: { count: stats.numberOfFiles } }}</span>
|
||||
</div>
|
||||
|
||||
<div *ngIf="stats.numberOfProcessingFiles">
|
||||
<mat-icon svgIcon="red:reanalyse"></mat-icon>
|
||||
<span>{{
|
||||
'dossier-overview.dossier-details.stats.processing-documents' | translate : { count: stats.numberOfProcessingFiles }
|
||||
}}</span>
|
||||
</div>
|
||||
@if (stats.numberOfProcessingFiles) {
|
||||
<div>
|
||||
<mat-icon svgIcon="red:reanalyse"></mat-icon>
|
||||
<span>{{
|
||||
'dossier-overview.dossier-details.stats.processing-documents' | translate: { count: stats.numberOfProcessingFiles }
|
||||
}}</span>
|
||||
</div>
|
||||
}
|
||||
|
||||
<div>
|
||||
<mat-icon svgIcon="red:user"></mat-icon>
|
||||
<span>{{ 'dossier-overview.dossier-details.stats.people' | translate : { count: dossier.memberIds.length } }}</span>
|
||||
<span>{{ 'dossier-overview.dossier-details.stats.people' | translate: { count: dossier().memberIds.length } }}</span>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<mat-icon svgIcon="iqser:pages"></mat-icon>
|
||||
<span>{{ 'dossier-overview.dossier-details.stats.analysed-pages' | translate : { count: stats.numberOfPages | number } }}</span>
|
||||
<span>{{ 'dossier-overview.dossier-details.stats.analysed-pages' | translate: { count: stats.numberOfPages | number } }}</span>
|
||||
</div>
|
||||
|
||||
<div *ngIf="dossier.date | date : 'd MMM yyyy' as date">
|
||||
<mat-icon svgIcon="iqser:calendar"></mat-icon>
|
||||
<span [innerHTML]="'dossier-overview.dossier-details.stats.created-on' | translate : { date }"></span>
|
||||
</div>
|
||||
@if (dossier().date | date: 'd MMM yyyy'; as date) {
|
||||
<div>
|
||||
<mat-icon svgIcon="iqser:calendar"></mat-icon>
|
||||
<span [innerHTML]="'dossier-overview.dossier-details.stats.created-on' | translate: { date }"></span>
|
||||
</div>
|
||||
}
|
||||
|
||||
<div *ngIf="dossier.dueDate | date : 'd MMM yyyy' as dueDate">
|
||||
<mat-icon svgIcon="red:lightning"></mat-icon>
|
||||
<span [innerHTML]="'dossier-overview.dossier-details.stats.due-date' | translate : { date: dueDate }"></span>
|
||||
</div>
|
||||
@if (dossier().dueDate | date: 'd MMM yyyy'; as dueDate) {
|
||||
<div>
|
||||
<mat-icon svgIcon="red:lightning"></mat-icon>
|
||||
<span [innerHTML]="'dossier-overview.dossier-details.stats.due-date' | translate: { date: dueDate }"></span>
|
||||
</div>
|
||||
}
|
||||
|
||||
<div>
|
||||
<mat-icon svgIcon="red:template"></mat-icon>
|
||||
<span>{{ dossierTemplateName }} </span>
|
||||
</div>
|
||||
|
||||
<div
|
||||
(click)="openEditDossierDialog('dossierDictionary')"
|
||||
*ngIf="!isDocumine"
|
||||
[attr.help-mode-key]="'edit_dossier_dossier_dictionary'"
|
||||
class="link-property"
|
||||
>
|
||||
<mat-icon svgIcon="red:dictionary"></mat-icon>
|
||||
<span>{{ 'dossier-overview.dossier-details.dictionary' | translate }} </span>
|
||||
</div>
|
||||
@if (!isDocumine) {
|
||||
<div
|
||||
(click)="openEditDossierDialog('dossierDictionary')"
|
||||
[attr.help-mode-key]="'edit_dossier_dossier_dictionary'"
|
||||
class="link-property"
|
||||
>
|
||||
<mat-icon svgIcon="red:dictionary"></mat-icon>
|
||||
<span>{{ 'dossier-overview.dossier-details.dictionary' | translate }} </span>
|
||||
</div>
|
||||
}
|
||||
|
||||
<!--TODO: Navigate to trash with filter on click?-->
|
||||
<div>
|
||||
<mat-icon svgIcon="iqser:trash"></mat-icon>
|
||||
<span>{{ 'dossier-overview.dossier-details.stats.deleted' | translate : { count: stats.numberOfSoftDeletedFiles } }}</span>
|
||||
<span>{{ 'dossier-overview.dossier-details.stats.deleted' | translate: { count: stats.numberOfSoftDeletedFiles } }}</span>
|
||||
</div>
|
||||
</ng-container>
|
||||
}
|
||||
|
||||
<ng-container *ngIf="dossierAttributes?.length">
|
||||
<div
|
||||
(click)="attributesExpanded = true"
|
||||
*ngIf="!attributesExpanded"
|
||||
[attr.help-mode-key]="'edit_dossier_dossier_attributes'"
|
||||
class="all-caps-label show-attributes"
|
||||
>
|
||||
{{ 'dossier-overview.dossier-details.attributes.expand' | translate : { count: dossierAttributes.length } }}
|
||||
</div>
|
||||
|
||||
<div *ngIf="attributesExpanded" [attr.help-mode-key]="'edit_dossier_dossier_attributes'" class="attributes">
|
||||
<div (click)="openEditDossierDialog('dossierAttributes')" *ngFor="let attr of dossierAttributes" class="link-property">
|
||||
<mat-icon svgIcon="red:attribute"></mat-icon>
|
||||
<span *ngIf="!attr.value"> {{ attr.label + ': -' }}</span>
|
||||
<span *ngIf="attr.value && attr.type === 'DATE'"> {{ attr.label + ': ' + (attr.value | date : 'd MMM yyyy') }}</span>
|
||||
<span *ngIf="attr.value && attr.type === 'IMAGE'">
|
||||
{{ attr.label + ': ' + ('dossier-overview.dossier-details.attributes.image-uploaded' | translate) }}</span
|
||||
>
|
||||
<span *ngIf="attr.value && (attr.type === 'TEXT' || attr.type === 'NUMBER')"> {{ attr.label + ': ' + attr.value }}</span>
|
||||
@if (dossierAttributes()?.length) {
|
||||
@if (!attributesExpanded) {
|
||||
<div
|
||||
(click)="attributesExpanded = true"
|
||||
[attr.help-mode-key]="'edit_dossier_dossier_attributes'"
|
||||
class="all-caps-label show-attributes"
|
||||
>
|
||||
{{ 'dossier-overview.dossier-details.attributes.expand' | translate: { count: dossierAttributes().length } }}
|
||||
</div>
|
||||
} @else {
|
||||
<div [attr.help-mode-key]="'edit_dossier_dossier_attributes'" class="attributes">
|
||||
@for (attr of dossierAttributes(); track attr.id) {
|
||||
<div (click)="openEditDossierDialog('dossierAttributes')" class="link-property">
|
||||
<mat-icon svgIcon="red:attribute"></mat-icon>
|
||||
@if (!attr.value) {
|
||||
<span> {{ attr.label + ': -' }}</span>
|
||||
}
|
||||
@if (attr.value && attr.type === 'DATE') {
|
||||
<span> {{ attr.label + ': ' + (attr.value | date: 'd MMM yyyy') }}</span>
|
||||
}
|
||||
@if (attr.value && attr.type === 'IMAGE') {
|
||||
<span> {{ attr.label + ': ' + ('dossier-overview.dossier-details.attributes.image-uploaded' | translate) }}</span>
|
||||
}
|
||||
@if (attr.value && (attr.type === 'TEXT' || attr.type === 'NUMBER')) {
|
||||
<span> {{ attr.label + ': ' + attr.value }}</span>
|
||||
}
|
||||
</div>
|
||||
}
|
||||
|
||||
<div (click)="attributesExpanded = false" class="all-caps-label hide-attributes">
|
||||
{{ 'dossier-overview.dossier-details.attributes.show-less' | translate }}
|
||||
<div (click)="attributesExpanded = false" class="all-caps-label hide-attributes">
|
||||
{{ 'dossier-overview.dossier-details.attributes.show-less' | translate }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</ng-container>
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
import { AsyncPipe, DecimalPipe, NgForOf, NgIf } from '@angular/common';
|
||||
import { Component, Input, OnInit } from '@angular/core';
|
||||
import { AsyncPipe, DecimalPipe } from '@angular/common';
|
||||
import { Component, input, OnInit, untracked } from '@angular/core';
|
||||
import { MatIcon } from '@angular/material/icon';
|
||||
import { getConfig, largeDialogConfig } from '@iqser/common-ui';
|
||||
import { TranslateModule } from '@ngx-translate/core';
|
||||
@ -17,11 +17,11 @@ import { DossiersDialogService } from '../../../shared-dossiers/services/dossier
|
||||
templateUrl: './dossier-details-stats.component.html',
|
||||
styleUrls: ['./dossier-details-stats.component.scss'],
|
||||
standalone: true,
|
||||
imports: [MatIcon, NgIf, AsyncPipe, TranslateModule, DatePipe, DecimalPipe, NgForOf],
|
||||
imports: [MatIcon, AsyncPipe, TranslateModule, DatePipe, DecimalPipe],
|
||||
})
|
||||
export class DossierDetailsStatsComponent implements OnInit {
|
||||
@Input() dossierAttributes: DossierAttributeWithValue[];
|
||||
@Input() dossier: Dossier;
|
||||
readonly dossierAttributes = input<DossierAttributeWithValue[]>();
|
||||
readonly dossier = input<Dossier>();
|
||||
|
||||
attributesExpanded = false;
|
||||
dossierTemplateName: string;
|
||||
@ -36,14 +36,16 @@ export class DossierDetailsStatsComponent implements OnInit {
|
||||
) {}
|
||||
|
||||
ngOnInit() {
|
||||
this.dossierStats$ = this._dossierStatsService.watch$(this.dossier.id);
|
||||
this.dossierTemplateName = this._dossierTemplatesService.find(this.dossier.dossierTemplateId)?.name || '-';
|
||||
const dossier = untracked(this.dossier);
|
||||
this.dossierStats$ = this._dossierStatsService.watch$(dossier.id);
|
||||
this.dossierTemplateName = this._dossierTemplatesService.find(dossier.dossierTemplateId)?.name || '-';
|
||||
}
|
||||
|
||||
openEditDossierDialog(section: string): void {
|
||||
const data = { dossierId: this.dossier.id, section };
|
||||
const dossier = untracked(this.dossier);
|
||||
const data = { dossierId: dossier.id, section };
|
||||
this._dialogService.open(EditDossierDialogComponent, data, { ...largeDialogConfig, width: '98vw', maxWidth: '98vw' }, async () => {
|
||||
await firstValueFrom(this._filesService.loadAll(this.dossier.id));
|
||||
await firstValueFrom(this._filesService.loadAll(dossier.id));
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
<ng-container *ngIf="componentContext$ | async as ctx">
|
||||
@if (componentContext$ | async; as ctx) {
|
||||
<div class="collapsed-wrapper">
|
||||
<ng-container *ngTemplateOutlet="collapsible; context: { action: 'expand', tooltip: (expandTooltip | translate) }"></ng-container>
|
||||
<div class="all-caps-label" translate="dossier-details.title"></div>
|
||||
@ -14,7 +14,7 @@
|
||||
<div class="mt-24">
|
||||
<div class="all-caps-label" translate="dossier-details.owner"></div>
|
||||
<div class="mt-12 flex">
|
||||
<ng-container *ngIf="!editingOwner; else editOwner">
|
||||
@if (!editingOwner) {
|
||||
<iqser-initials-avatar [user]="ctx.dossier?.ownerId" [withName]="true" color="gray" size="large"></iqser-initials-avatar>
|
||||
|
||||
<iqser-circle-button
|
||||
@ -25,7 +25,14 @@
|
||||
[tooltip]="'dossier-details.edit-owner' | translate"
|
||||
class="ml-14"
|
||||
></iqser-circle-button>
|
||||
</ng-container>
|
||||
} @else {
|
||||
<redaction-assign-user-dropdown
|
||||
(cancel)="editingOwner = false"
|
||||
(save)="editingOwner = false; assignOwner($event, ctx.dossier)"
|
||||
[options]="managers()"
|
||||
[value]="ctx.dossier?.ownerId"
|
||||
></redaction-assign-user-dropdown>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -38,69 +45,63 @@
|
||||
></redaction-team-members>
|
||||
</div>
|
||||
|
||||
<ng-container *ngIf="ctx.dossierStats as stats">
|
||||
<div *ngIf="stats.hasFiles" class="mt-24">
|
||||
<redaction-donut-chart
|
||||
(subtitleChanged)="onSubtitleChanged($event)"
|
||||
[config]="chartConfig"
|
||||
[filterKey]="'statusFilters'"
|
||||
[helpModeKey]="'dashboard_in_dossier'"
|
||||
[radius]="63"
|
||||
[strokeWidth]="15"
|
||||
[subtitles]="[
|
||||
'dossier-overview.dossier-details.charts.documents-in-dossier' | translate,
|
||||
'dossier-overview.dossier-details.charts.pages-in-dossier' | translate,
|
||||
]"
|
||||
direction="row"
|
||||
></redaction-donut-chart>
|
||||
</div>
|
||||
|
||||
<div *ngIf="ctx.statusConfig as statusConfig" class="mt-24">
|
||||
<div class="all-caps-label mb-8" translate="dossier-details.document-status"></div>
|
||||
<iqser-progress-bar
|
||||
*ngFor="let config of statusConfig"
|
||||
[attr.help-mode-key]="'dashboard_in_dossier'"
|
||||
[config]="config"
|
||||
filterKey="processingTypeFilters"
|
||||
></iqser-progress-bar>
|
||||
</div>
|
||||
|
||||
<div
|
||||
*ngIf="stats.hasFiles && !isDocumine && ctx.needsWorkFilters as filters"
|
||||
[attr.help-mode-key]="'dashboard_in_dossier'"
|
||||
class="mt-32 legend pb-32"
|
||||
>
|
||||
<div
|
||||
(click)="filterService.toggleFilter('needsWorkFilters', filter.id)"
|
||||
*ngFor="let filter of filters"
|
||||
[class.active]="filter.checked"
|
||||
>
|
||||
<redaction-type-filter [dossierTemplateId]="ctx.dossier?.dossierTemplateId" [filter]="filter"></redaction-type-filter>
|
||||
@if (ctx.dossierStats; as stats) {
|
||||
@if (stats.hasFiles) {
|
||||
<div class="mt-24">
|
||||
<redaction-donut-chart
|
||||
(subtitleChanged)="onSubtitleChanged($event)"
|
||||
[config]="chartConfig"
|
||||
[filterKey]="'statusFilters'"
|
||||
[helpModeKey]="'dashboard_in_dossier'"
|
||||
[radius]="63"
|
||||
[strokeWidth]="15"
|
||||
[subtitles]="[
|
||||
'dossier-overview.dossier-details.charts.documents-in-dossier' | translate,
|
||||
'dossier-overview.dossier-details.charts.pages-in-dossier' | translate,
|
||||
]"
|
||||
direction="row"
|
||||
></redaction-donut-chart>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
@if (ctx.statusConfig; as statusConfig) {
|
||||
<div class="mt-24">
|
||||
<div class="all-caps-label mb-8" translate="dossier-details.document-status"></div>
|
||||
@for (config of statusConfig; track config.id) {
|
||||
<iqser-progress-bar
|
||||
[attr.help-mode-key]="'dashboard_in_dossier'"
|
||||
[config]="config"
|
||||
filterKey="processingTypeFilters"
|
||||
></iqser-progress-bar>
|
||||
}
|
||||
</div>
|
||||
}
|
||||
|
||||
@if (stats.hasFiles && !isDocumine && ctx.needsWorkFilters; as filters) {
|
||||
<div [attr.help-mode-key]="'dashboard_in_dossier'" class="mt-32 legend pb-32">
|
||||
@for (filter of filters; track filter.id) {
|
||||
<div (click)="filterService.toggleFilter('needsWorkFilters', filter.id)" [class.active]="filter.checked">
|
||||
<redaction-type-filter
|
||||
[dossierTemplateId]="ctx.dossier?.dossierTemplateId"
|
||||
[filter]="filter"
|
||||
></redaction-type-filter>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
}
|
||||
<div [class.mt-24]="!stats.hasFiles" class="pb-32">
|
||||
<redaction-dossier-details-stats
|
||||
[dossierAttributes]="dossierAttributes"
|
||||
[dossierAttributes]="dossierAttributes()"
|
||||
[dossier]="ctx.dossier"
|
||||
></redaction-dossier-details-stats>
|
||||
</div>
|
||||
</ng-container>
|
||||
|
||||
<div *ngIf="ctx.dossier?.description as description" class="pb-32">
|
||||
<div class="heading" translate="dossier-overview.dossier-details.description"></div>
|
||||
<div class="mt-8">{{ description }}</div>
|
||||
</div>
|
||||
|
||||
<ng-template #editOwner>
|
||||
<redaction-assign-user-dropdown
|
||||
(cancel)="editingOwner = false"
|
||||
(save)="editingOwner = false; assignOwner($event, ctx.dossier)"
|
||||
[options]="managers"
|
||||
[value]="ctx.dossier?.ownerId"
|
||||
></redaction-assign-user-dropdown>
|
||||
</ng-template>
|
||||
</ng-container>
|
||||
}
|
||||
@if (ctx.dossier?.description; as description) {
|
||||
<div class="pb-32">
|
||||
<div class="heading" translate="dossier-overview.dossier-details.description"></div>
|
||||
<div class="mt-8">{{ description }}</div>
|
||||
</div>
|
||||
}
|
||||
}
|
||||
|
||||
<ng-template #collapsible let-action="action" let-tooltip="tooltip">
|
||||
<iqser-circle-button
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
import { AsyncPipe, NgForOf, NgIf, NgTemplateOutlet } from '@angular/common';
|
||||
import { Component, EventEmitter, Input, Output } from '@angular/core';
|
||||
import { AsyncPipe, NgTemplateOutlet } from '@angular/common';
|
||||
import { Component, computed, input, output } from '@angular/core';
|
||||
import { marker as _ } from '@biesbjerg/ngx-translate-extract-marker';
|
||||
import {
|
||||
CircleButtonComponent,
|
||||
@ -55,14 +55,12 @@ interface DossierDetailsContext {
|
||||
standalone: true,
|
||||
imports: [
|
||||
NgTemplateOutlet,
|
||||
NgIf,
|
||||
AsyncPipe,
|
||||
CircleButtonComponent,
|
||||
IqserAllowDirective,
|
||||
TranslateModule,
|
||||
DonutChartComponent,
|
||||
IqserLoadingModule,
|
||||
NgForOf,
|
||||
TypeFilterComponent,
|
||||
DossierDetailsStatsComponent,
|
||||
AssignUserDropdownComponent,
|
||||
@ -74,8 +72,8 @@ export class DossierDetailsComponent extends ContextComponent<DossierDetailsCont
|
||||
#currentChartSubtitleIndex = 0;
|
||||
readonly #dossierId = getParam(DOSSIER_ID);
|
||||
protected readonly circleButtonTypes = CircleButtonTypes;
|
||||
@Input() dossierAttributes: DossierAttributeWithValue[];
|
||||
@Output() readonly toggleCollapse = new EventEmitter();
|
||||
readonly dossierAttributes = input<DossierAttributeWithValue[]>();
|
||||
readonly toggleCollapse = output();
|
||||
editingOwner = false;
|
||||
readonly roles = Roles;
|
||||
readonly currentUser = getCurrentUser<User>();
|
||||
@ -84,6 +82,12 @@ export class DossierDetailsComponent extends ContextComponent<DossierDetailsCont
|
||||
chartConfig: DonutChartConfig[] = [];
|
||||
readonly isDocumine = getConfig().IS_DOCUMINE;
|
||||
readonly IqserTooltipPositions = IqserTooltipPositions;
|
||||
readonly managers = computed(() =>
|
||||
this._userService
|
||||
.allUsers()
|
||||
.filter(u => u.isManager)
|
||||
.map(u => u.id),
|
||||
);
|
||||
|
||||
constructor(
|
||||
private readonly _toaster: Toaster,
|
||||
@ -113,10 +117,6 @@ export class DossierDetailsComponent extends ContextComponent<DossierDetailsCont
|
||||
});
|
||||
}
|
||||
|
||||
get managers() {
|
||||
return this._userService.all.filter(u => u.isManager).map(u => u.id);
|
||||
}
|
||||
|
||||
async assignOwner(user: User | string, dossier: Dossier) {
|
||||
const owner = typeof user === 'string' ? this._userService.find(user) : user;
|
||||
const dossierRequest: IDossierRequest = { ...dossier, ownerId: owner.id };
|
||||
|
||||
@ -1,89 +1,94 @@
|
||||
<ng-container *ngIf="configService.listingMode$ | async as mode">
|
||||
@if (configService.listingMode$ | async; as mode) {
|
||||
<div
|
||||
(click)="handleFieldClick($event)"
|
||||
(mousedown)="handleClick($event)"
|
||||
[ngClass]="{ 'workflow-attribute': mode === 'workflow', 'file-name-column': fileNameColumn }"
|
||||
[ngClass]="{ 'workflow-attribute': mode === 'workflow', 'file-name-column': fileNameColumn() }"
|
||||
class="file-attribute"
|
||||
>
|
||||
<div [ngClass]="{ 'workflow-value': mode === 'workflow' }" class="value" *ngIf="!isInEditMode || mode === 'workflow'">
|
||||
<mat-icon *ngIf="!fileAttribute.editable" [matTooltip]="'readonly' | translate" svgIcon="red:read-only"></mat-icon>
|
||||
<span
|
||||
*ngIf="!isDate; else date"
|
||||
[style.max-width]="attributeValueWidth()"
|
||||
[matTooltip]="fileAttributeValue"
|
||||
[ngClass]="{ hide: isInEditMode, 'clamp-3': mode !== 'workflow' }"
|
||||
>
|
||||
<b *ngIf="mode === 'workflow' && !isInEditMode"> {{ fileAttribute.label }}: </b>
|
||||
{{ fileAttributeValue || '-' }}
|
||||
</span>
|
||||
<ng-template #date>
|
||||
<span [ngClass]="{ hide: isInEditMode, 'clamp-3': mode !== 'workflow' }">
|
||||
<b *ngIf="mode === 'workflow' && !isInEditMode"> {{ fileAttribute.label }}: </b>
|
||||
{{ fileAttributeValue ? (fileAttributeValue | date: 'd MMM yyyy') : '-' }}
|
||||
</span>
|
||||
</ng-template>
|
||||
</div>
|
||||
|
||||
<ng-container
|
||||
*ngIf="
|
||||
(fileAttributesService.isEditingFileAttribute() === false || isInEditMode) &&
|
||||
!file.isInitialProcessing &&
|
||||
permissionsService.canEditFileAttributes(file, dossier) &&
|
||||
fileAttribute.editable
|
||||
"
|
||||
>
|
||||
<div
|
||||
(click)="editFileAttribute($event)"
|
||||
*ngIf="!isInEditMode; else input"
|
||||
[attr.help-mode-key]="'edit_file_attributes'"
|
||||
[class.help-mode-button]="helpModeService.isHelpModeActive$ | async"
|
||||
[ngClass]="{
|
||||
'workflow-edit-button': mode === 'workflow',
|
||||
'action-buttons edit-button': !fileNameColumn,
|
||||
'filename-edit-button': fileNameColumn,
|
||||
}"
|
||||
>
|
||||
<div [ngClass]="{ 'workflow-edit-icon': mode === 'workflow', 'edit-icon': !fileNameColumn }">
|
||||
<mat-icon [svgIcon]="'iqser:edit'"></mat-icon>
|
||||
</div>
|
||||
@if (!isInEditMode || mode === 'workflow') {
|
||||
<div [ngClass]="{ 'workflow-value': mode === 'workflow' }" class="value">
|
||||
@if (!fileAttribute().editable) {
|
||||
<mat-icon [matTooltip]="'readonly' | translate" svgIcon="red:read-only"></mat-icon>
|
||||
}
|
||||
@if (!isDate()) {
|
||||
<span
|
||||
[style.max-width]="attributeValueWidth()"
|
||||
[matTooltip]="value()"
|
||||
[ngClass]="{ hide: isInEditMode, 'clamp-3': mode !== 'workflow' }"
|
||||
>
|
||||
@if (mode === 'workflow' && !isInEditMode) {
|
||||
<b> {{ fileAttribute().label }}: </b>
|
||||
}
|
||||
{{ value() || '-' }}
|
||||
</span>
|
||||
} @else {
|
||||
<span [ngClass]="{ hide: isInEditMode, 'clamp-3': mode !== 'workflow' }">
|
||||
@if (mode === 'workflow' && !isInEditMode) {
|
||||
<b> {{ fileAttribute().label }}: </b>
|
||||
}
|
||||
{{ value() ? (value() | date: 'd MMM yyyy') : '-' }}
|
||||
</span>
|
||||
}
|
||||
</div>
|
||||
</ng-container>
|
||||
}
|
||||
|
||||
@if (
|
||||
(fileAttributesService.isEditingFileAttribute() === false || isInEditMode) &&
|
||||
!file().isInitialProcessing &&
|
||||
permissionsService.canEditFileAttributes(file(), dossier()) &&
|
||||
fileAttribute().editable
|
||||
) {
|
||||
@if (!isInEditMode) {
|
||||
<div
|
||||
(click)="editFileAttribute($event)"
|
||||
[attr.help-mode-key]="'edit_file_attributes'"
|
||||
[class.help-mode-button]="helpModeService.isHelpModeActive$ | async"
|
||||
[ngClass]="{
|
||||
'workflow-edit-button': mode === 'workflow',
|
||||
'action-buttons edit-button': !fileNameColumn(),
|
||||
'filename-edit-button': fileNameColumn(),
|
||||
}"
|
||||
>
|
||||
<div [ngClass]="{ 'workflow-edit-icon': mode === 'workflow', 'edit-icon': !fileNameColumn() }">
|
||||
<mat-icon [svgIcon]="'iqser:edit'"></mat-icon>
|
||||
</div>
|
||||
</div>
|
||||
} @else {
|
||||
<div
|
||||
[ngClass]="{ 'workflow-edit-input': mode === 'workflow', 'file-name-column-input': fileNameColumn() }"
|
||||
class="edit-input"
|
||||
iqserStopPropagation
|
||||
>
|
||||
<form [formGroup]="form" [style.width]="inputFormWidth()">
|
||||
<iqser-dynamic-input
|
||||
(closedDatepicker)="closedDatepicker = $event"
|
||||
(keyup.enter)="form.valid && save()"
|
||||
(keydown.escape)="close()"
|
||||
[style.width]="inputFieldWidth()"
|
||||
[formControlName]="fileAttribute().id"
|
||||
[id]="fileAttribute().id"
|
||||
[ngClass]="{ 'workflow-input': mode === 'workflow' || fileNameColumn(), 'file-name-input': fileNameColumn() }"
|
||||
[type]="fileAttribute().type"
|
||||
></iqser-dynamic-input>
|
||||
|
||||
<iqser-circle-button
|
||||
(action)="save()"
|
||||
[disabled]="disabled"
|
||||
[icon]="'iqser:check'"
|
||||
[size]="mode === 'workflow' || fileNameColumn() ? 15 : 34"
|
||||
[ngClass]="{ 'file-name-btn': fileNameColumn() }"
|
||||
class="save"
|
||||
></iqser-circle-button>
|
||||
|
||||
<iqser-circle-button
|
||||
(action)="close()"
|
||||
[ngClass]="{ 'file-name-btn': fileNameColumn() }"
|
||||
[icon]="'iqser:close'"
|
||||
[size]="mode === 'workflow' || fileNameColumn() ? 15 : 34"
|
||||
></iqser-circle-button>
|
||||
</form>
|
||||
</div>
|
||||
}
|
||||
}
|
||||
</div>
|
||||
|
||||
<ng-template #input>
|
||||
<div
|
||||
[ngClass]="{ 'workflow-edit-input': mode === 'workflow', 'file-name-column-input': fileNameColumn }"
|
||||
class="edit-input"
|
||||
iqserStopPropagation
|
||||
>
|
||||
<form [formGroup]="form" [style.width]="inputFormWidth()">
|
||||
<iqser-dynamic-input
|
||||
(closedDatepicker)="closedDatepicker = $event"
|
||||
(keyup.enter)="form.valid && save()"
|
||||
(keydown.escape)="close()"
|
||||
[style.width]="inputFieldWidth()"
|
||||
[formControlName]="fileAttribute.id"
|
||||
[id]="fileAttribute.id"
|
||||
[ngClass]="{ 'workflow-input': mode === 'workflow' || fileNameColumn, 'file-name-input': fileNameColumn }"
|
||||
[type]="fileAttribute.type"
|
||||
></iqser-dynamic-input>
|
||||
|
||||
<iqser-circle-button
|
||||
(action)="save()"
|
||||
[disabled]="disabled"
|
||||
[icon]="'iqser:check'"
|
||||
[size]="mode === 'workflow' || fileNameColumn ? 15 : 34"
|
||||
[ngClass]="{ 'file-name-btn': fileNameColumn }"
|
||||
class="save"
|
||||
></iqser-circle-button>
|
||||
|
||||
<iqser-circle-button
|
||||
(action)="close()"
|
||||
[ngClass]="{ 'file-name-btn': fileNameColumn }"
|
||||
[icon]="'iqser:close'"
|
||||
[size]="mode === 'workflow' || fileNameColumn ? 15 : 34"
|
||||
></iqser-circle-button>
|
||||
</form>
|
||||
</div>
|
||||
</ng-template>
|
||||
</ng-container>
|
||||
}
|
||||
|
||||
@ -1,9 +1,8 @@
|
||||
import { AsyncPipe, NgClass, NgIf, NgTemplateOutlet } from '@angular/common';
|
||||
import { Component, computed, effect, HostListener, input, Input, OnDestroy } from '@angular/core';
|
||||
import { AsyncPipe, NgClass, NgTemplateOutlet } from '@angular/common';
|
||||
import { Component, computed, effect, HostListener, input, untracked } from '@angular/core';
|
||||
import { AbstractControl, FormBuilder, FormsModule, ReactiveFormsModule, UntypedFormGroup, ValidatorFn } from '@angular/forms';
|
||||
import { MatIconModule } from '@angular/material/icon';
|
||||
import { MatTooltipModule } from '@angular/material/tooltip';
|
||||
import { NavigationEnd, Router } from '@angular/router';
|
||||
import { marker as _ } from '@biesbjerg/ngx-translate-extract-marker';
|
||||
import { DynamicInputComponent } from '@common-ui/inputs/dynamic-input/dynamic-input.component';
|
||||
import {
|
||||
@ -22,9 +21,9 @@ import { FilesService } from '@services/files/files.service';
|
||||
import { PermissionsService } from '@services/permissions.service';
|
||||
import { DatePipe } from '@shared/pipes/date.pipe';
|
||||
import dayjs from 'dayjs';
|
||||
import { firstValueFrom, Subscription } from 'rxjs';
|
||||
import { filter, map, tap } from 'rxjs/operators';
|
||||
import { firstValueFrom } from 'rxjs';
|
||||
import { ConfigService } from '../../config.service';
|
||||
import { toSignal } from '@angular/core/rxjs-interop';
|
||||
|
||||
@Component({
|
||||
selector: 'redaction-file-attribute',
|
||||
@ -32,7 +31,6 @@ import { ConfigService } from '../../config.service';
|
||||
styleUrls: ['./file-attribute.component.scss'],
|
||||
standalone: true,
|
||||
imports: [
|
||||
NgIf,
|
||||
NgClass,
|
||||
MatTooltipModule,
|
||||
MatIconModule,
|
||||
@ -47,31 +45,33 @@ import { ConfigService } from '../../config.service';
|
||||
StopPropagationDirective,
|
||||
],
|
||||
})
|
||||
export class FileAttributeComponent extends BaseFormComponent implements OnDestroy {
|
||||
readonly #subscriptions = new Subscription();
|
||||
export class FileAttributeComponent extends BaseFormComponent {
|
||||
isInEditMode = false;
|
||||
closedDatepicker = true;
|
||||
@Input({ required: true }) fileAttribute!: IFileAttributeConfig;
|
||||
@Input({ required: true }) file!: File;
|
||||
readonly fileAttribute = input.required<IFileAttributeConfig>();
|
||||
readonly file = input.required<File>();
|
||||
readonly dossier = input<Dossier>();
|
||||
readonly fileNameColumn = input(false);
|
||||
readonly width = input<number>();
|
||||
|
||||
readonly isText = computed(() => this.fileAttribute().type === FileAttributeConfigTypes.TEXT);
|
||||
readonly value = computed(() => this.file().fileAttributes.attributeIdToValue[this.fileAttribute().id]);
|
||||
readonly isDate = computed(() => this.fileAttribute().type === FileAttributeConfigTypes.DATE);
|
||||
|
||||
readonly #selectedLength = toSignal(this._listingService.selectedLength$);
|
||||
readonly #shouldClose = computed(
|
||||
() =>
|
||||
(this.fileAttributesService.isEditingFileAttribute() &&
|
||||
this.file &&
|
||||
this.fileAttribute &&
|
||||
(this.fileAttribute.id !== this.fileAttributesService.openAttributeEdit() ||
|
||||
this.file.fileId !== this.fileAttributesService.fileEdit())) ||
|
||||
(this.fileAttribute().id !== this.fileAttributesService.openAttributeEdit() ||
|
||||
this.file().fileId !== this.fileAttributesService.fileEdit())) ||
|
||||
!this.fileAttributesService.openAttributeEdits().length,
|
||||
);
|
||||
@Input({ required: true }) dossier!: Dossier;
|
||||
@Input() fileNameColumn = false;
|
||||
readonlyAttrs: string[] = [];
|
||||
readonly width = input<number>();
|
||||
readonly inputFormWidth = computed(() => (this.width() ? this.width() + 'px' : 'unset'));
|
||||
readonly inputFieldWidth = computed(() => (this.width() ? this.width() - 50 + 'px' : 'unset'));
|
||||
readonly attributeValueWidth = computed(() => (this.width() ? `${this.width() * 0.9}px` : 'unset'));
|
||||
|
||||
constructor(
|
||||
router: Router,
|
||||
private readonly _toaster: Toaster,
|
||||
private readonly _formBuilder: FormBuilder,
|
||||
private readonly _filesService: FilesService,
|
||||
@ -82,14 +82,11 @@ export class FileAttributeComponent extends BaseFormComponent implements OnDestr
|
||||
readonly configService: ConfigService,
|
||||
) {
|
||||
super();
|
||||
const sub = router.events.pipe(filter(event => event instanceof NavigationEnd)).subscribe(() => this.close());
|
||||
this.#subscriptions.add(sub);
|
||||
|
||||
const sub2 = this._listingService.selectedLength$.pipe(
|
||||
map(selectedLength => !!selectedLength),
|
||||
tap(() => this.close()),
|
||||
);
|
||||
this.#subscriptions.add(sub2.subscribe());
|
||||
effect(() => {
|
||||
if (this.#selectedLength()) {
|
||||
this.close();
|
||||
}
|
||||
});
|
||||
|
||||
effect(
|
||||
() => {
|
||||
@ -101,27 +98,11 @@ export class FileAttributeComponent extends BaseFormComponent implements OnDestr
|
||||
);
|
||||
}
|
||||
|
||||
get isDate(): boolean {
|
||||
return this.fileAttribute.type === FileAttributeConfigTypes.DATE;
|
||||
}
|
||||
|
||||
get isNumber(): boolean {
|
||||
return this.fileAttribute.type === FileAttributeConfigTypes.NUMBER;
|
||||
}
|
||||
|
||||
get isText(): boolean {
|
||||
return this.fileAttribute.type === FileAttributeConfigTypes.TEXT;
|
||||
}
|
||||
|
||||
get fileAttributeValue(): string {
|
||||
return this.file.fileAttributes.attributeIdToValue[this.fileAttribute.id];
|
||||
}
|
||||
|
||||
@Debounce(60)
|
||||
@HostListener('document:click', ['$event'])
|
||||
clickOutside($event: MouseEvent) {
|
||||
const clickCalendarCell = ($event.target as HTMLElement).classList?.contains('mat-calendar-body-cell-content');
|
||||
if (this.isDate) {
|
||||
if (this.isDate()) {
|
||||
this.#focusOnEditInput();
|
||||
}
|
||||
|
||||
@ -135,13 +116,9 @@ export class FileAttributeComponent extends BaseFormComponent implements OnDestr
|
||||
$event.preventDefault();
|
||||
}
|
||||
|
||||
ngOnDestroy() {
|
||||
this.#subscriptions.unsubscribe();
|
||||
}
|
||||
|
||||
handleFieldClick($event: MouseEvent) {
|
||||
$event.preventDefault();
|
||||
if (!this.fileNameColumn) {
|
||||
if (!this.fileNameColumn()) {
|
||||
this.editFileAttribute($event);
|
||||
}
|
||||
}
|
||||
@ -149,34 +126,34 @@ export class FileAttributeComponent extends BaseFormComponent implements OnDestr
|
||||
editFileAttribute($event: MouseEvent) {
|
||||
$event.preventDefault();
|
||||
if (
|
||||
!this.file.isInitialProcessing &&
|
||||
this.permissionsService.canEditFileAttributes(this.file, this.dossier) &&
|
||||
this.fileAttribute.editable &&
|
||||
!this.file().isInitialProcessing &&
|
||||
this.permissionsService.canEditFileAttributes(this.file(), this.dossier()) &&
|
||||
this.fileAttribute().editable &&
|
||||
!this.isInEditMode
|
||||
) {
|
||||
$event.stopPropagation();
|
||||
this.fileAttributesService.openAttributeEdits.update(value => [
|
||||
...value,
|
||||
{ attribute: this.fileAttribute.id, file: this.file.id },
|
||||
{ attribute: this.fileAttribute().id, file: this.file().id },
|
||||
]);
|
||||
this.fileAttributesService.setFileEdit(this.file.fileId);
|
||||
this.fileAttributesService.setOpenAttributeEdit(this.fileAttribute.id);
|
||||
this.fileAttributesService.setFileEdit(this.file().fileId);
|
||||
this.fileAttributesService.setOpenAttributeEdit(this.fileAttribute().id);
|
||||
this.#toggleEdit();
|
||||
}
|
||||
}
|
||||
|
||||
async save() {
|
||||
const rawFormValue = this.form.getRawValue();
|
||||
const fileAttrValue = rawFormValue[this.fileAttribute.id];
|
||||
const fileAttrValue = rawFormValue[this.fileAttribute().id];
|
||||
const attributeIdToValue = {
|
||||
...this.#getForm().getRawValue(),
|
||||
[this.fileAttribute.id]: this.#formatAttributeValue(fileAttrValue),
|
||||
[this.fileAttribute().id]: this.#formatAttributeValue(fileAttrValue),
|
||||
};
|
||||
try {
|
||||
await firstValueFrom(
|
||||
this.fileAttributesService.setFileAttributes({ attributeIdToValue }, this.file.dossierId, this.file.fileId),
|
||||
this.fileAttributesService.setFileAttributes({ attributeIdToValue }, this.file().dossierId, this.file().fileId),
|
||||
);
|
||||
await this._filesService.reload(this.file.dossierId, this.file);
|
||||
await this._filesService.reload(this.file().dossierId, this.file());
|
||||
this.initialFormValue = rawFormValue;
|
||||
this._toaster.success(_('file-attribute.update.success'));
|
||||
} catch (e) {
|
||||
@ -188,6 +165,8 @@ export class FileAttributeComponent extends BaseFormComponent implements OnDestr
|
||||
|
||||
close(): void {
|
||||
if (this.isInEditMode) {
|
||||
const fileAttribute = untracked(this.fileAttribute);
|
||||
const file = untracked(this.file);
|
||||
this.form = this.#getForm();
|
||||
this.#toggleEdit();
|
||||
this.fileAttributesService.openAttributeEdits.update(value =>
|
||||
@ -195,8 +174,8 @@ export class FileAttributeComponent extends BaseFormComponent implements OnDestr
|
||||
val =>
|
||||
JSON.stringify(val) !==
|
||||
JSON.stringify({
|
||||
attribute: this.fileAttribute.id,
|
||||
file: this.file.id,
|
||||
attribute: fileAttribute.id,
|
||||
file: file.id,
|
||||
}),
|
||||
),
|
||||
);
|
||||
@ -204,18 +183,20 @@ export class FileAttributeComponent extends BaseFormComponent implements OnDestr
|
||||
}
|
||||
|
||||
#initFileAttributes() {
|
||||
const configs = this.fileAttributesService.getFileAttributeConfig(this.file.dossierTemplateId).fileAttributeConfigs;
|
||||
const file = untracked(this.file);
|
||||
const configs = this.fileAttributesService.getFileAttributeConfig(file.dossierTemplateId).fileAttributeConfigs;
|
||||
this.readonlyAttrs = configs.filter(config => config.editable === false).map(config => config.id);
|
||||
configs.forEach(config => {
|
||||
if (!this.file.fileAttributes.attributeIdToValue[config.id]) {
|
||||
this.file.fileAttributes.attributeIdToValue[config.id] = null;
|
||||
if (!file.fileAttributes.attributeIdToValue[config.id]) {
|
||||
file.fileAttributes.attributeIdToValue[config.id] = null;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
#getForm(): UntypedFormGroup {
|
||||
const config = {};
|
||||
const fileAttributes = this.file.fileAttributes.attributeIdToValue;
|
||||
const file = untracked(this.file);
|
||||
const fileAttributes = file.fileAttributes.attributeIdToValue;
|
||||
Object.keys(fileAttributes).forEach(key => {
|
||||
const attrValue = fileAttributes[key];
|
||||
config[key] = [
|
||||
@ -231,19 +212,25 @@ export class FileAttributeComponent extends BaseFormComponent implements OnDestr
|
||||
}
|
||||
|
||||
#checkEmptyInput(): ValidatorFn {
|
||||
const isText = untracked(this.isText);
|
||||
const fileAttribute = untracked(this.fileAttribute);
|
||||
const value = untracked(this.value);
|
||||
return (control: AbstractControl) =>
|
||||
(this.isText && !control.get(this.fileAttribute.id)?.value?.trim().length && !this.fileAttributeValue) ||
|
||||
control.get(this.fileAttribute.id)?.value === this.fileAttributeValue
|
||||
(isText && !control.get(fileAttribute.id)?.value?.trim().length && !this.value()) ||
|
||||
control.get(fileAttribute.id)?.value === value
|
||||
? { emptyString: true }
|
||||
: null;
|
||||
}
|
||||
|
||||
#checkDate(): ValidatorFn {
|
||||
const isDate = untracked(this.isDate);
|
||||
const fileAttribute = untracked(this.fileAttribute);
|
||||
const value = untracked(this.value);
|
||||
return (control: AbstractControl) => {
|
||||
const expr = new RegExp('(0?[1-9]|[12][0-9]|3[01])(/|.)(0?[1-9]|1[12])(/|.)\\d{2}');
|
||||
return this.isDate
|
||||
? (!expr.test(control.get(this.fileAttribute.id)?.value) && control.get(this.fileAttribute.id)?.value?.length) ||
|
||||
this.#formatAttributeValue(control.get(this.fileAttribute.id)?.value) === this.fileAttributeValue
|
||||
return isDate
|
||||
? (!expr.test(control.get(fileAttribute.id)?.value) && control.get(fileAttribute.id)?.value?.length) ||
|
||||
this.#formatAttributeValue(control.get(fileAttribute.id)?.value) === value
|
||||
? { invalidDate: true }
|
||||
: null
|
||||
: null;
|
||||
@ -251,11 +238,12 @@ export class FileAttributeComponent extends BaseFormComponent implements OnDestr
|
||||
}
|
||||
|
||||
#formatAttributeValue(attrValue) {
|
||||
if (this.isDate) {
|
||||
const isDate = untracked(this.isDate);
|
||||
if (isDate) {
|
||||
return attrValue && dayjs(attrValue).format('YYYY-MM-DD');
|
||||
}
|
||||
|
||||
if (this.isText) {
|
||||
const isText = untracked(this.isText);
|
||||
if (isText) {
|
||||
return attrValue.trim().replaceAll(/\s\s+/g, ' ');
|
||||
}
|
||||
|
||||
@ -277,9 +265,12 @@ export class FileAttributeComponent extends BaseFormComponent implements OnDestr
|
||||
}
|
||||
|
||||
#focusOnEditInput(): void {
|
||||
if (this.isDate || this.isText) {
|
||||
const isDate = untracked(this.isDate);
|
||||
const isText = untracked(this.isText);
|
||||
const fileAttribute = untracked(this.fileAttribute);
|
||||
if (isDate || isText) {
|
||||
setTimeout(() => {
|
||||
const input = document.getElementById(this.fileAttribute.id) as HTMLInputElement;
|
||||
const input = document.getElementById(fileAttribute.id) as HTMLInputElement;
|
||||
if (!input) {
|
||||
return;
|
||||
}
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
<iqser-page-header
|
||||
(closeAction)="router.navigate([dossier.dossiersListRouterLink])"
|
||||
(closeAction)="router.navigate([dossier().dossiersListRouterLink])"
|
||||
[actionConfigs]="actionConfigs"
|
||||
[helpModeKey]="'document'"
|
||||
[showCloseButton]="true"
|
||||
@ -10,40 +10,43 @@
|
||||
[attr.help-mode-key]="isDocumine ? 'dossier_download_dossier' : 'download_dossier_in_dossier'"
|
||||
[buttonId]="'download-files-btn'"
|
||||
[disabled]="downloadFilesDisabled$ | async"
|
||||
[dossier]="dossier"
|
||||
[dossier]="dossier()"
|
||||
[files]="entitiesService.all$ | async"
|
||||
dossierDownload
|
||||
></redaction-file-download-btn>
|
||||
|
||||
<iqser-circle-button
|
||||
(action)="downloadDossierAsCSV()"
|
||||
*ngIf="permissionsService.canDownloadCsvReport(dossier)"
|
||||
[attr.help-mode-key]="'download_csv'"
|
||||
[disabled]="listingService.areSomeSelected$ | async"
|
||||
[icon]="'iqser:csv'"
|
||||
[tooltip]="'dossier-overview.header-actions.download-csv' | translate"
|
||||
></iqser-circle-button>
|
||||
@if (permissionsService.canDownloadCsvReport(dossier())) {
|
||||
<iqser-circle-button
|
||||
(action)="downloadDossierAsCSV()"
|
||||
[attr.help-mode-key]="'download_csv'"
|
||||
[disabled]="listingService.areSomeSelected$ | async"
|
||||
[icon]="'iqser:csv'"
|
||||
[tooltip]="'dossier-overview.header-actions.download-csv' | translate"
|
||||
></iqser-circle-button>
|
||||
}
|
||||
|
||||
<iqser-circle-button
|
||||
(action)="reanalyseDossier()"
|
||||
*ngIf="permissionsService.displayReanalyseBtn(dossier)"
|
||||
[disabled]="listingService.areSomeSelected$ | async"
|
||||
[icon]="'iqser:refresh'"
|
||||
[tooltipClass]="'small warn'"
|
||||
[tooltip]="'dossier-overview.new-rule.toast.actions.reanalyse-all' | translate"
|
||||
[type]="circleButtonTypes.warn"
|
||||
></iqser-circle-button>
|
||||
@if (permissionsService.displayReanalyseBtn(dossier())) {
|
||||
<iqser-circle-button
|
||||
(action)="reanalyseDossier()"
|
||||
[disabled]="listingService.areSomeSelected$ | async"
|
||||
[icon]="'iqser:refresh'"
|
||||
[tooltipClass]="'small warn'"
|
||||
[tooltip]="'dossier-overview.new-rule.toast.actions.reanalyse-all' | translate"
|
||||
[type]="circleButtonTypes.warn"
|
||||
></iqser-circle-button>
|
||||
}
|
||||
|
||||
<iqser-circle-button
|
||||
(action)="upload.emit()"
|
||||
*ngIf="permissionsService.canUploadFiles(dossier)"
|
||||
[attr.help-mode-key]="'upload_document'"
|
||||
[buttonId]="'upload-document-btn'"
|
||||
[icon]="'iqser:upload'"
|
||||
[tooltip]="'dossier-overview.header-actions.upload-document' | translate"
|
||||
[type]="circleButtonTypes.primary"
|
||||
class="ml-14"
|
||||
></iqser-circle-button>
|
||||
@if (permissionsService.canUploadFiles(dossier())) {
|
||||
<iqser-circle-button
|
||||
(action)="upload.emit()"
|
||||
[attr.help-mode-key]="'upload_document'"
|
||||
[buttonId]="'upload-document-btn'"
|
||||
[icon]="'iqser:upload'"
|
||||
[tooltip]="'dossier-overview.header-actions.upload-document' | translate"
|
||||
[type]="circleButtonTypes.primary"
|
||||
class="ml-14"
|
||||
></iqser-circle-button>
|
||||
}
|
||||
</ng-container>
|
||||
</iqser-page-header>
|
||||
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
|
||||
import { Component, input, OnInit, output, untracked } from '@angular/core';
|
||||
import {
|
||||
ActionConfig,
|
||||
CircleButtonComponent,
|
||||
@ -25,9 +25,8 @@ import { Router } from '@angular/router';
|
||||
import { Roles } from '@users/roles';
|
||||
import { SortingService } from '@iqser/common-ui/lib/sorting';
|
||||
import { List, some } from '@iqser/common-ui/lib/utils';
|
||||
import { ComponentLogService } from '@services/files/component-log.service';
|
||||
import { MatMenu, MatMenuItem, MatMenuTrigger } from '@angular/material/menu';
|
||||
import { AsyncPipe, NgIf } from '@angular/common';
|
||||
import { AsyncPipe } from '@angular/common';
|
||||
import { TranslateModule } from '@ngx-translate/core';
|
||||
import { FileDownloadBtnComponent } from '@shared/components/buttons/file-download-btn/file-download-btn.component';
|
||||
import { ViewModeSelectionComponent } from '../view-mode-selection/view-mode-selection.component';
|
||||
@ -44,7 +43,6 @@ import { ViewModeSelectionComponent } from '../view-mode-selection/view-mode-sel
|
||||
AsyncPipe,
|
||||
TranslateModule,
|
||||
FileDownloadBtnComponent,
|
||||
NgIf,
|
||||
ViewModeSelectionComponent,
|
||||
DisableStopPropagationDirective,
|
||||
MatMenu,
|
||||
@ -52,8 +50,8 @@ import { ViewModeSelectionComponent } from '../view-mode-selection/view-mode-sel
|
||||
],
|
||||
})
|
||||
export class DossierOverviewScreenHeaderComponent implements OnInit {
|
||||
@Input() dossier: Dossier;
|
||||
@Output() readonly upload = new EventEmitter<void>();
|
||||
readonly dossier = input<Dossier>();
|
||||
readonly upload = output();
|
||||
readonly circleButtonTypes = CircleButtonTypes;
|
||||
readonly roles = Roles;
|
||||
actionConfigs: List<ActionConfig>;
|
||||
@ -84,13 +82,14 @@ export class DossierOverviewScreenHeaderComponent implements OnInit {
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
this.actionConfigs = this.configService.actionConfig(this.dossier.id, this.listingService.areSomeSelected$);
|
||||
this.actionConfigs = this.configService.actionConfig(this.dossier().id, this.listingService.areSomeSelected$);
|
||||
}
|
||||
|
||||
async reanalyseDossier() {
|
||||
this._loadingService.start();
|
||||
try {
|
||||
await this._reanalysisService.reanalyzeDossier(this.dossier, true);
|
||||
const dossier = untracked(this.dossier);
|
||||
await this._reanalysisService.reanalyzeDossier(dossier, true);
|
||||
this._toaster.success(_('dossier-overview.reanalyse-dossier.success'));
|
||||
} catch (e) {
|
||||
this._toaster.error(_('dossier-overview.reanalyse-dossier.error'));
|
||||
@ -101,12 +100,13 @@ export class DossierOverviewScreenHeaderComponent implements OnInit {
|
||||
async downloadDossierAsCSV() {
|
||||
const displayedEntities = await firstValueFrom(this.listingService.displayed$);
|
||||
const entities = this.sortingService.defaultSort(displayedEntities);
|
||||
const fileName = this.dossier.dossierName + '.export.csv';
|
||||
const dossier = untracked(this.dossier);
|
||||
const fileName = dossier.dossierName + '.export.csv';
|
||||
const mapper = (file?: File) => ({
|
||||
...file,
|
||||
hasAnnotations: file.hasRedactions,
|
||||
assignee: this._userService.getName(file.assignee) || '-',
|
||||
primaryAttribute: this._primaryFileAttributeService.getPrimaryFileAttributeValue(file, this.dossier.dossierTemplateId),
|
||||
primaryAttribute: this._primaryFileAttributeService.getPrimaryFileAttributeValue(file, this.dossier().dossierTemplateId),
|
||||
});
|
||||
const documineOnlyFields = ['hasAnnotations'];
|
||||
const redactionOnlyFields = ['hasHints', 'hasImages', 'hasUpdates', 'hasRedactions'];
|
||||
|
||||
@ -1,34 +1,43 @@
|
||||
<div class="needs-work">
|
||||
<redaction-annotation-icon
|
||||
*ngIf="file.analysisRequired"
|
||||
[color]="analysisColor$ | async"
|
||||
[label]="(workloadTranslations['analysis'] | translate)[0]"
|
||||
type="square"
|
||||
></redaction-annotation-icon>
|
||||
<redaction-annotation-icon
|
||||
*ngIf="updated"
|
||||
[color]="updatedColor$ | async"
|
||||
[label]="(workloadTranslations['updated'] | translate)[0]"
|
||||
type="square"
|
||||
></redaction-annotation-icon>
|
||||
<redaction-annotation-icon
|
||||
*ngIf="file.hasRedactions"
|
||||
[color]="redactionColor$ | async"
|
||||
[label]="'redaction-abbreviation' | translate"
|
||||
type="square"
|
||||
></redaction-annotation-icon>
|
||||
<redaction-annotation-icon
|
||||
*ngIf="file.hasImages"
|
||||
[color]="imageColor$ | async"
|
||||
[label]="(workloadTranslations['image'] | translate)[0]"
|
||||
type="square"
|
||||
></redaction-annotation-icon>
|
||||
<redaction-annotation-icon
|
||||
*ngIf="file.hintsOnly"
|
||||
[color]="hintColor$ | async"
|
||||
[label]="(workloadTranslations['hint'] | translate)[0]"
|
||||
type="circle"
|
||||
></redaction-annotation-icon>
|
||||
<mat-icon *ngIf="file.hasAnnotationComments" svgIcon="red:comment"></mat-icon>
|
||||
<ng-container *ngIf="noWorkloadItems"> -</ng-container>
|
||||
@if (file().analysisRequired) {
|
||||
<redaction-annotation-icon
|
||||
[color]="analysisColor$ | async"
|
||||
[label]="(workloadTranslations['analysis'] | translate)[0]"
|
||||
type="square"
|
||||
></redaction-annotation-icon>
|
||||
}
|
||||
@if (updated()) {
|
||||
<redaction-annotation-icon
|
||||
[color]="updatedColor$ | async"
|
||||
[label]="(workloadTranslations['updated'] | translate)[0]"
|
||||
type="square"
|
||||
></redaction-annotation-icon>
|
||||
}
|
||||
@if (file().hasRedactions) {
|
||||
<redaction-annotation-icon
|
||||
[color]="redactionColor$ | async"
|
||||
[label]="'redaction-abbreviation' | translate"
|
||||
type="square"
|
||||
></redaction-annotation-icon>
|
||||
}
|
||||
@if (file().hasImages) {
|
||||
<redaction-annotation-icon
|
||||
[color]="imageColor$ | async"
|
||||
[label]="(workloadTranslations['image'] | translate)[0]"
|
||||
type="square"
|
||||
></redaction-annotation-icon>
|
||||
}
|
||||
@if (file().hintsOnly) {
|
||||
<redaction-annotation-icon
|
||||
[color]="hintColor$ | async"
|
||||
[label]="(workloadTranslations['hint'] | translate)[0]"
|
||||
type="circle"
|
||||
></redaction-annotation-icon>
|
||||
}
|
||||
@if (file().hasAnnotationComments) {
|
||||
<mat-icon svgIcon="red:comment"></mat-icon>
|
||||
}
|
||||
@if (noWorkloadItems()) {
|
||||
-
|
||||
}
|
||||
</div>
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import { ChangeDetectionStrategy, Component, Input, OnInit } from '@angular/core';
|
||||
import { ChangeDetectionStrategy, Component, computed, input, OnInit } from '@angular/core';
|
||||
import { annotationDefaultColorConfig, DefaultBasedColorType, File } from '@red/domain';
|
||||
import { DossiersService } from '@services/dossiers/dossiers.service';
|
||||
import { DefaultColorsService } from '@services/entity-services/default-colors.service';
|
||||
@ -7,7 +7,7 @@ import { UserService } from '@users/user.service';
|
||||
import { Observable } from 'rxjs';
|
||||
import { map } from 'rxjs/operators';
|
||||
import { AnnotationIconComponent } from '@shared/components/annotation-icon/annotation-icon.component';
|
||||
import { AsyncPipe, NgIf } from '@angular/common';
|
||||
import { AsyncPipe } from '@angular/common';
|
||||
import { TranslateModule } from '@ngx-translate/core';
|
||||
import { MatIcon } from '@angular/material/icon';
|
||||
import { workloadTranslations } from '@translations/workload-translations';
|
||||
@ -18,11 +18,11 @@ import { workloadTranslations } from '@translations/workload-translations';
|
||||
styleUrls: ['./file-workload.component.scss'],
|
||||
changeDetection: ChangeDetectionStrategy.OnPush,
|
||||
standalone: true,
|
||||
imports: [AnnotationIconComponent, AsyncPipe, TranslateModule, MatIcon, NgIf],
|
||||
imports: [AnnotationIconComponent, AsyncPipe, TranslateModule, MatIcon],
|
||||
})
|
||||
export class FileWorkloadComponent implements OnInit {
|
||||
#dossierTemplateId: string;
|
||||
@Input() file: File;
|
||||
file = input<File>();
|
||||
imageColor$: Observable<string>;
|
||||
updatedColor$: Observable<string>;
|
||||
analysisColor$: Observable<string>;
|
||||
@ -30,6 +30,20 @@ export class FileWorkloadComponent implements OnInit {
|
||||
redactionColor$: Observable<string>;
|
||||
readonly workloadTranslations = workloadTranslations;
|
||||
|
||||
readonly updated = computed(
|
||||
() => this.file().hasUpdates && this.file().assignee === this._userService.currentUser.id && !this.file().isApproved,
|
||||
);
|
||||
|
||||
readonly noWorkloadItems = computed(
|
||||
() =>
|
||||
!this.updated() &&
|
||||
!this.file().analysisRequired &&
|
||||
!this.file().hasRedactions &&
|
||||
!this.file().hasImages &&
|
||||
!this.file().hintsOnly &&
|
||||
!this.file().hasAnnotationComments,
|
||||
);
|
||||
|
||||
constructor(
|
||||
private readonly _userService: UserService,
|
||||
private readonly _defaultColorsService: DefaultColorsService,
|
||||
@ -37,23 +51,8 @@ export class FileWorkloadComponent implements OnInit {
|
||||
private readonly _dictionariesMapService: DictionariesMapService,
|
||||
) {}
|
||||
|
||||
get updated(): boolean {
|
||||
return this.file.hasUpdates && this.file.assignee === this._userService.currentUser.id && !this.file.isApproved;
|
||||
}
|
||||
|
||||
get noWorkloadItems(): boolean {
|
||||
return (
|
||||
!this.updated &&
|
||||
!this.file.analysisRequired &&
|
||||
!this.file.hasRedactions &&
|
||||
!this.file.hasImages &&
|
||||
!this.file.hintsOnly &&
|
||||
!this.file.hasAnnotationComments
|
||||
);
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
this.#dossierTemplateId = this._dossiersService.find(this.file.dossierId).dossierTemplateId;
|
||||
this.#dossierTemplateId = this._dossiersService.find(this.file().dossierId).dossierTemplateId;
|
||||
this.updatedColor$ = this.#getDefaultColor$('updated');
|
||||
this.analysisColor$ = this.#getDefaultColor$('analysis');
|
||||
this.hintColor$ = this.#getDefaultColor$('hint');
|
||||
|
||||
@ -1,78 +1,94 @@
|
||||
<div class="cell" [class.file-name-cell]="!fileAttributesService.isEditingFileAttribute()">
|
||||
<redaction-file-name-column [dossierTemplateId]="dossierTemplateId" [file]="file" [dossier]="dossier"></redaction-file-name-column>
|
||||
<redaction-file-name-column
|
||||
[dossierTemplateId]="dossierTemplateId()"
|
||||
[file]="file()"
|
||||
[dossier]="dossier()"
|
||||
></redaction-file-name-column>
|
||||
</div>
|
||||
|
||||
<div class="cell">
|
||||
<redaction-date-column [date]="file.added" [isError]="file.isError"></redaction-date-column>
|
||||
<redaction-date-column [date]="file().added" [isError]="file().isError"></redaction-date-column>
|
||||
</div>
|
||||
|
||||
<div class="cell">
|
||||
<redaction-date-column [date]="file.redactionModificationDate" [isError]="file.isError"></redaction-date-column>
|
||||
<redaction-date-column [date]="file().redactionModificationDate" [isError]="file().isError"></redaction-date-column>
|
||||
</div>
|
||||
|
||||
<div *ngFor="let config of displayedAttributes" class="cell">
|
||||
<redaction-file-attribute [file]="file" [dossier]="dossier" [fileAttribute]="config"></redaction-file-attribute>
|
||||
</div>
|
||||
@for (config of displayedAttributes(); track config.id) {
|
||||
<div class="cell">
|
||||
<redaction-file-attribute [file]="file()" [dossier]="dossier()" [fileAttribute]="config"></redaction-file-attribute>
|
||||
</div>
|
||||
}
|
||||
|
||||
<!-- always show A for error-->
|
||||
<div *ngIf="file.isError && !isDocumine" class="cell">
|
||||
<redaction-annotation-icon color="#dd4d50" label="A" type="square"></redaction-annotation-icon>
|
||||
</div>
|
||||
|
||||
<ng-container *ngIf="!file.isError">
|
||||
<div class="cell" *ngIf="!isDocumine">
|
||||
<redaction-file-workload *ngIf="!file.excluded" [file]="file"></redaction-file-workload>
|
||||
@if (file().isError && !isDocumine) {
|
||||
<div class="cell">
|
||||
<redaction-annotation-icon color="#dd4d50" label="A" type="square"></redaction-annotation-icon>
|
||||
</div>
|
||||
}
|
||||
|
||||
@if (!file().isError) {
|
||||
@if (!isDocumine) {
|
||||
<div class="cell">
|
||||
@if (!file().excluded) {
|
||||
<redaction-file-workload [file]="file()"></redaction-file-workload>
|
||||
}
|
||||
</div>
|
||||
}
|
||||
|
||||
<div class="user-column cell">
|
||||
<iqser-initials-avatar [user]="file.assignee" [withName]="true"></iqser-initials-avatar>
|
||||
<iqser-initials-avatar [user]="file().assignee" [withName]="true"></iqser-initials-avatar>
|
||||
</div>
|
||||
|
||||
<div class="cell">
|
||||
<div class="small-label stats-subtitle">
|
||||
<div>
|
||||
<mat-icon svgIcon="iqser:pages"></mat-icon>
|
||||
{{ file.numberOfPages }}
|
||||
{{ file().numberOfPages }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</ng-container>
|
||||
}
|
||||
|
||||
<div [class.extend-cols]="file.isError" class="status-container cell">
|
||||
<div *ngIf="file.isError" class="small-label error" translate="dossier-overview.file-listing.file-entry.file-error"></div>
|
||||
<div [class.extend-cols]="file().isError" class="status-container cell">
|
||||
@if (file().isError) {
|
||||
<div class="small-label error" translate="dossier-overview.file-listing.file-entry.file-error"></div>
|
||||
}
|
||||
|
||||
<div *ngIf="file.isUnprocessed" class="small-label" translate="dossier-overview.file-listing.file-entry.file-pending"></div>
|
||||
@if (file().isUnprocessed) {
|
||||
<div class="small-label" translate="dossier-overview.file-listing.file-entry.file-pending"></div>
|
||||
}
|
||||
|
||||
<div class="status-wrapper">
|
||||
<ng-container *ngIf="file.isOcrProcessing; else defaultProcessing">
|
||||
@if (file().isOcrProcessing) {
|
||||
<redaction-ocr-progress-bar
|
||||
[numberOfOCRedPages]="file.numberOfOCRedPages"
|
||||
[numberOfPagesToOCR]="file.numberOfPagesToOCR"
|
||||
[numberOfOCRedPages]="file().numberOfOCRedPages"
|
||||
[numberOfPagesToOCR]="file().numberOfPagesToOCR"
|
||||
[progressColor]="'primary'"
|
||||
></redaction-ocr-progress-bar>
|
||||
</ng-container>
|
||||
} @else {
|
||||
<redaction-processing-indicator [file]="file()"></redaction-processing-indicator>
|
||||
|
||||
@if (!file().isError && !file().isUnprocessed && !file().isInitialProcessing) {
|
||||
<iqser-status-bar
|
||||
[configs]="[
|
||||
{
|
||||
color: file().workflowStatus,
|
||||
length: 1,
|
||||
},
|
||||
]"
|
||||
></iqser-status-bar>
|
||||
}
|
||||
}
|
||||
</div>
|
||||
|
||||
<ng-template #defaultProcessing>
|
||||
<redaction-processing-indicator [file]="file"></redaction-processing-indicator>
|
||||
|
||||
<iqser-status-bar
|
||||
*ngIf="!file.isError && !file.isUnprocessed && !file.isInitialProcessing"
|
||||
[configs]="[
|
||||
{
|
||||
color: file.workflowStatus,
|
||||
length: 1,
|
||||
},
|
||||
]"
|
||||
></iqser-status-bar>
|
||||
</ng-template>
|
||||
|
||||
<redaction-file-actions
|
||||
*ngIf="!file.isProcessing"
|
||||
[dossier]="dossier"
|
||||
[file]="file"
|
||||
[singleEntityAction]="true"
|
||||
class="mr-4"
|
||||
type="dossier-overview-list"
|
||||
></redaction-file-actions>
|
||||
@if (!file().isProcessing) {
|
||||
<redaction-file-actions
|
||||
[dossier]="dossier()"
|
||||
[file]="file()"
|
||||
[singleEntityAction]="true"
|
||||
class="mr-4"
|
||||
type="dossier-overview-list"
|
||||
></redaction-file-actions>
|
||||
}
|
||||
</div>
|
||||
|
||||
@ -1,11 +1,10 @@
|
||||
import { Component, Input } from '@angular/core';
|
||||
import { Component, input } from '@angular/core';
|
||||
import { getConfig } from '@iqser/common-ui';
|
||||
import { Dossier, File, IFileAttributeConfig } from '@red/domain';
|
||||
import { FileAttributesService } from '@services/entity-services/file-attributes.service';
|
||||
import { FileNameColumnComponent } from '@shared/components/file-name-column/file-name-column.component';
|
||||
import { DateColumnComponent } from '../../../shared-dossiers/components/date-column/date-column.component';
|
||||
import { FileAttributeComponent } from '../file-attribute/file-attribute.component';
|
||||
import { NgForOf, NgIf } from '@angular/common';
|
||||
import { AnnotationIconComponent } from '@shared/components/annotation-icon/annotation-icon.component';
|
||||
import { FileWorkloadComponent } from './file-workload/file-workload.component';
|
||||
import { InitialsAvatarComponent, IqserUsersModule } from '@common-ui/users';
|
||||
@ -25,7 +24,6 @@ import { TranslateModule } from '@ngx-translate/core';
|
||||
FileNameColumnComponent,
|
||||
DateColumnComponent,
|
||||
FileAttributeComponent,
|
||||
NgIf,
|
||||
AnnotationIconComponent,
|
||||
FileWorkloadComponent,
|
||||
IqserUsersModule,
|
||||
@ -35,15 +33,14 @@ import { TranslateModule } from '@ngx-translate/core';
|
||||
StatusBarComponent,
|
||||
FileActionsComponent,
|
||||
TranslateModule,
|
||||
NgForOf,
|
||||
InitialsAvatarComponent,
|
||||
],
|
||||
})
|
||||
export class TableItemComponent {
|
||||
@Input({ required: true }) file: File;
|
||||
@Input({ required: true }) dossier: Dossier;
|
||||
@Input({ required: true }) displayedAttributes: IFileAttributeConfig[];
|
||||
@Input({ required: true }) dossierTemplateId: string;
|
||||
readonly file = input.required<File>();
|
||||
readonly dossier = input.required<Dossier>();
|
||||
readonly displayedAttributes = input.required<IFileAttributeConfig[]>();
|
||||
readonly dossierTemplateId = input.required<string>();
|
||||
|
||||
readonly isDocumine = getConfig().IS_DOCUMINE;
|
||||
|
||||
|
||||
@ -1,21 +1,23 @@
|
||||
<div *ngIf="configService.listingMode$ | async as mode" class="view-mode-selection">
|
||||
<div class="all-caps-label" translate="view-mode.view-as"></div>
|
||||
@if (configService.listingMode$ | async; as mode) {
|
||||
<div class="view-mode-selection">
|
||||
<div class="all-caps-label" translate="view-mode.view-as"></div>
|
||||
|
||||
<iqser-circle-button
|
||||
(action)="setListingMode(listingModes.table)"
|
||||
[attr.aria-expanded]="mode === listingModes.table"
|
||||
[attr.help-mode-key]="'document_list_view'"
|
||||
[tooltip]="'view-mode.list' | translate"
|
||||
greySelected
|
||||
icon="iqser:list"
|
||||
></iqser-circle-button>
|
||||
<iqser-circle-button
|
||||
(action)="setListingMode(listingModes.table)"
|
||||
[attr.aria-expanded]="mode === listingModes.table"
|
||||
[attr.help-mode-key]="'document_list_view'"
|
||||
[tooltip]="'view-mode.list' | translate"
|
||||
greySelected
|
||||
icon="iqser:list"
|
||||
></iqser-circle-button>
|
||||
|
||||
<iqser-circle-button
|
||||
(action)="setListingMode(listingModes.workflow)"
|
||||
[attr.aria-expanded]="mode === listingModes.workflow"
|
||||
[attr.help-mode-key]="'workflow_view'"
|
||||
[tooltip]="'view-mode.workflow' | translate"
|
||||
greySelected
|
||||
icon="iqser:lanes"
|
||||
></iqser-circle-button>
|
||||
</div>
|
||||
<iqser-circle-button
|
||||
(action)="setListingMode(listingModes.workflow)"
|
||||
[attr.aria-expanded]="mode === listingModes.workflow"
|
||||
[attr.help-mode-key]="'workflow_view'"
|
||||
[tooltip]="'view-mode.workflow' | translate"
|
||||
greySelected
|
||||
icon="iqser:lanes"
|
||||
></iqser-circle-button>
|
||||
</div>
|
||||
}
|
||||
|
||||
@ -3,7 +3,7 @@ import { CircleButtonComponent, ListingMode, ListingModes, ListingService } from
|
||||
import { File } from '@red/domain';
|
||||
import { ConfigService } from '../../config.service';
|
||||
import { TranslateModule } from '@ngx-translate/core';
|
||||
import { AsyncPipe, NgIf } from '@angular/common';
|
||||
import { AsyncPipe } from '@angular/common';
|
||||
|
||||
@Component({
|
||||
selector: 'redaction-view-mode-selection',
|
||||
@ -11,7 +11,7 @@ import { AsyncPipe, NgIf } from '@angular/common';
|
||||
styleUrls: ['./view-mode-selection.component.scss'],
|
||||
changeDetection: ChangeDetectionStrategy.OnPush,
|
||||
standalone: true,
|
||||
imports: [CircleButtonComponent, TranslateModule, AsyncPipe, NgIf],
|
||||
imports: [CircleButtonComponent, TranslateModule, AsyncPipe],
|
||||
})
|
||||
export class ViewModeSelectionComponent {
|
||||
readonly listingModes = ListingModes;
|
||||
|
||||
@ -7,41 +7,44 @@
|
||||
<div class="details">
|
||||
<div
|
||||
[attr.help-mode-key]="'workflow_view'"
|
||||
[matTooltip]="file.filename"
|
||||
[routerLink]="file.routerLink"
|
||||
[matTooltip]="file().filename"
|
||||
[routerLink]="fileRouterLink()"
|
||||
class="filename pointer"
|
||||
matTooltipPosition="above"
|
||||
>
|
||||
{{ file.filename }}
|
||||
{{ file().filename }}
|
||||
</div>
|
||||
|
||||
<redaction-file-stats [file]="file"></redaction-file-stats>
|
||||
<redaction-file-stats [file]="file()"></redaction-file-stats>
|
||||
</div>
|
||||
|
||||
<div class="user">
|
||||
<iqser-initials-avatar [user]="file.assignee"></iqser-initials-avatar>
|
||||
<iqser-initials-avatar [user]="file().assignee"></iqser-initials-avatar>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div *ngFor="let config of displayedAttributes; trackBy: trackBy" class="small-label mt-8 attribute">
|
||||
<redaction-file-attribute [dossier]="dossier" [fileAttribute]="config" [file]="file"></redaction-file-attribute>
|
||||
</div>
|
||||
@for (config of displayedAttributes(); track config.id) {
|
||||
<div class="small-label mt-8 attribute">
|
||||
<redaction-file-attribute [dossier]="dossier()" [fileAttribute]="config" [file]="file()"></redaction-file-attribute>
|
||||
</div>
|
||||
}
|
||||
|
||||
<redaction-file-workload [file]="file"></redaction-file-workload>
|
||||
<redaction-file-workload [file]="file()"></redaction-file-workload>
|
||||
|
||||
<div class="file-actions overflow-visible">
|
||||
<redaction-processing-indicator [file]="file" class="mr-8"></redaction-processing-indicator>
|
||||
<redaction-processing-indicator [file]="file()" class="mr-8"></redaction-processing-indicator>
|
||||
|
||||
<div #actionsWrapper class="actions-wrapper">
|
||||
<redaction-file-actions
|
||||
*ngIf="!file.isProcessing"
|
||||
[dossier]="dossier"
|
||||
[file]="file"
|
||||
[maxWidth]="width"
|
||||
[singleEntityAction]="true"
|
||||
iqserDisableStopPropagation
|
||||
type="dossier-overview-workflow"
|
||||
></redaction-file-actions>
|
||||
@if (!file().isProcessing) {
|
||||
<redaction-file-actions
|
||||
[dossier]="dossier()"
|
||||
[file]="file()"
|
||||
[maxWidth]="width"
|
||||
[singleEntityAction]="true"
|
||||
iqserDisableStopPropagation
|
||||
type="dossier-overview-workflow"
|
||||
></redaction-file-actions>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import { ChangeDetectorRef, Component, computed, ElementRef, Input, OnInit, Optional, ViewChild } from '@angular/core';
|
||||
import { ChangeDetectorRef, Component, computed, ElementRef, input, OnInit, Optional, ViewChild } from '@angular/core';
|
||||
import { DisableStopPropagationDirective, HelpModeService } from '@iqser/common-ui';
|
||||
import { Debounce, trackByFactory } from '@iqser/common-ui/lib/utils';
|
||||
import { Dossier, File, IFileAttributeConfig } from '@red/domain';
|
||||
@ -11,7 +11,7 @@ import { FileAttributeComponent } from '../file-attribute/file-attribute.compone
|
||||
import { FileWorkloadComponent } from '../table-item/file-workload/file-workload.component';
|
||||
import { ProcessingIndicatorComponent } from '@shared/components/processing-indicator/processing-indicator.component';
|
||||
import { FileActionsComponent } from '../../../shared-dossiers/components/file-actions/file-actions.component';
|
||||
import { AsyncPipe, NgForOf, NgIf } from '@angular/common';
|
||||
import { AsyncPipe } from '@angular/common';
|
||||
|
||||
@Component({
|
||||
selector: 'redaction-workflow-item',
|
||||
@ -27,10 +27,8 @@ import { AsyncPipe, NgForOf, NgIf } from '@angular/common';
|
||||
FileWorkloadComponent,
|
||||
ProcessingIndicatorComponent,
|
||||
FileActionsComponent,
|
||||
NgIf,
|
||||
DisableStopPropagationDirective,
|
||||
AsyncPipe,
|
||||
NgForOf,
|
||||
InitialsAvatarComponent,
|
||||
],
|
||||
})
|
||||
@ -38,9 +36,10 @@ export class WorkflowItemComponent implements OnInit {
|
||||
@ViewChild('actionsWrapper', { static: true }) private _actionsWrapper: ElementRef;
|
||||
width: number;
|
||||
readonly trackBy = trackByFactory();
|
||||
@Input({ required: true }) file: File;
|
||||
@Input({ required: true }) dossier: Dossier;
|
||||
@Input({ required: true }) displayedAttributes: IFileAttributeConfig[];
|
||||
readonly file = input.required<File>();
|
||||
readonly dossier = input.required<Dossier>();
|
||||
readonly displayedAttributes = input.required<IFileAttributeConfig[]>();
|
||||
readonly fileRouterLink = computed(() => this.file().routerLink);
|
||||
|
||||
constructor(
|
||||
readonly fileAttributesService: FileAttributesService,
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
<ng-container *ngIf="(files$ | async) && dossier$ | async as dossier">
|
||||
@if ((files$ | async) && dossier$ | async; as dossier) {
|
||||
<section>
|
||||
<redaction-dossier-overview-screen-header
|
||||
(upload)="fileInput.click()"
|
||||
@ -8,60 +8,64 @@
|
||||
<div class="overlay-shadow"></div>
|
||||
|
||||
<div class="content-inner">
|
||||
<div *ngIf="listingMode$ | async as mode" [class.extended]="collapsedDetails" class="content-container">
|
||||
<iqser-table
|
||||
(noDataAction)="fileInput.click()"
|
||||
*ngIf="mode === listingModes.table"
|
||||
[bulkActions]="bulkActions"
|
||||
[hasScrollButton]="true"
|
||||
[headerHelpModeKey]="'document_list'"
|
||||
[helpModeKey]="'document'"
|
||||
[itemSize]="80"
|
||||
[noDataButtonIcon]="'iqser:upload'"
|
||||
[noDataButtonLabel]="'dossier-overview.no-data.action' | translate"
|
||||
[noDataIcon]="'iqser:document'"
|
||||
[noDataText]="'dossier-overview.no-data.title' | translate"
|
||||
[noMatchText]="'dossier-overview.no-match.title' | translate"
|
||||
[selectionEnabled]="true"
|
||||
[showNoDataButton]="permissionsService.canUploadFiles(dossier)"
|
||||
[tableColumnConfigs]="tableColumnConfigs"
|
||||
[tableItemClasses]="{ disabled: disabledFn, 'last-opened': lastOpenedFn }"
|
||||
[rowIdPrefix]="'file'"
|
||||
[namePropertyKey]="'filename'"
|
||||
></iqser-table>
|
||||
@if (listingMode$ | async; as mode) {
|
||||
<div [class.extended]="collapsedDetails" class="content-container">
|
||||
@if (mode === listingModes.table) {
|
||||
<iqser-table
|
||||
(noDataAction)="fileInput.click()"
|
||||
[bulkActions]="bulkActions"
|
||||
[hasScrollButton]="true"
|
||||
[headerHelpModeKey]="'document_list'"
|
||||
[helpModeKey]="'document'"
|
||||
[itemSize]="80"
|
||||
[noDataButtonIcon]="'iqser:upload'"
|
||||
[noDataButtonLabel]="'dossier-overview.no-data.action' | translate"
|
||||
[noDataIcon]="'iqser:document'"
|
||||
[noDataText]="'dossier-overview.no-data.title' | translate"
|
||||
[noMatchText]="'dossier-overview.no-match.title' | translate"
|
||||
[selectionEnabled]="true"
|
||||
[showNoDataButton]="permissionsService.canUploadFiles(dossier)"
|
||||
[tableColumnConfigs]="tableColumnConfigs"
|
||||
[tableItemClasses]="{ disabled: disabledFn, 'last-opened': lastOpenedFn }"
|
||||
[rowIdPrefix]="'file'"
|
||||
[namePropertyKey]="'filename'"
|
||||
></iqser-table>
|
||||
} @else if (mode === listingModes.workflow) {
|
||||
<iqser-workflow
|
||||
(addElement)="fileInput.click()"
|
||||
(noDataAction)="fileInput.click()"
|
||||
[addElementIcon]="'iqser:upload'"
|
||||
[bulkActions]="bulkActions"
|
||||
[config]="workflowConfig"
|
||||
[itemClasses]="{ disabled: disabledFn }"
|
||||
[noDataButtonIcon]="'iqser:upload'"
|
||||
[noDataButtonLabel]="'dossier-overview.no-data.action' | translate"
|
||||
[noDataIcon]="'iqser:document'"
|
||||
[noDataText]="'dossier-overview.no-data.title' | translate"
|
||||
[showNoDataButton]="true"
|
||||
[id]="'workflow-view'"
|
||||
addElementColumn="NEW"
|
||||
>
|
||||
<ng-template #workflowItemTemplate let-entity="entity">
|
||||
<redaction-workflow-item
|
||||
[displayedAttributes]="displayedWorkflowAttributes"
|
||||
[dossier]="dossier"
|
||||
[file]="entity"
|
||||
></redaction-workflow-item>
|
||||
</ng-template>
|
||||
</iqser-workflow>
|
||||
}
|
||||
</div>
|
||||
}
|
||||
|
||||
<iqser-workflow
|
||||
(addElement)="fileInput.click()"
|
||||
(noDataAction)="fileInput.click()"
|
||||
*ngIf="mode === listingModes.workflow"
|
||||
[addElementIcon]="'iqser:upload'"
|
||||
[bulkActions]="bulkActions"
|
||||
[config]="workflowConfig"
|
||||
[itemClasses]="{ disabled: disabledFn }"
|
||||
[noDataButtonIcon]="'iqser:upload'"
|
||||
[noDataButtonLabel]="'dossier-overview.no-data.action' | translate"
|
||||
[noDataIcon]="'iqser:document'"
|
||||
[noDataText]="'dossier-overview.no-data.title' | translate"
|
||||
[showNoDataButton]="true"
|
||||
[id]="'workflow-view'"
|
||||
addElementColumn="NEW"
|
||||
>
|
||||
<ng-template #workflowItemTemplate let-entity="entity">
|
||||
<redaction-workflow-item
|
||||
[displayedAttributes]="displayedWorkflowAttributes"
|
||||
[dossier]="dossier"
|
||||
[file]="entity"
|
||||
></redaction-workflow-item>
|
||||
</ng-template>
|
||||
</iqser-workflow>
|
||||
</div>
|
||||
|
||||
<div *ngIf="dossierAttributes$ | async" [class.collapsed]="collapsedDetails" class="right-container">
|
||||
<redaction-dossier-details
|
||||
(toggleCollapse)="collapsedDetails = !collapsedDetails"
|
||||
[dossierAttributes]="dossierAttributes"
|
||||
></redaction-dossier-details>
|
||||
</div>
|
||||
@if (dossierAttributes$ | async) {
|
||||
<div [class.collapsed]="collapsedDetails" class="right-container">
|
||||
<redaction-dossier-details
|
||||
(toggleCollapse)="collapsedDetails = !collapsedDetails"
|
||||
[dossierAttributes]="dossierAttributes"
|
||||
></redaction-dossier-details>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</section>
|
||||
|
||||
@ -82,7 +86,7 @@
|
||||
[file]="file"
|
||||
></redaction-table-item>
|
||||
</ng-template>
|
||||
</ng-container>
|
||||
}
|
||||
|
||||
<ng-template #needsWorkFilterTemplate let-filter="filter">
|
||||
<redaction-type-filter [dossierTemplateId]="dossierTemplateId" [filter]="filter"></redaction-type-filter>
|
||||
|
||||
@ -45,7 +45,7 @@ import { filter, skip, switchMap, tap } from 'rxjs/operators';
|
||||
import { ConfigService } from '../config.service';
|
||||
import { BulkActionsService } from '../services/bulk-actions.service';
|
||||
import { DossiersCacheService } from '@services/dossiers/dossiers-cache.service';
|
||||
import { AsyncPipe, NgIf } from '@angular/common';
|
||||
import { AsyncPipe } from '@angular/common';
|
||||
import { DossierOverviewScreenHeaderComponent } from '../components/screen-header/dossier-overview-screen-header.component';
|
||||
import { TranslateModule } from '@ngx-translate/core';
|
||||
import { WorkflowItemComponent } from '../components/workflow-item/workflow-item.component';
|
||||
@ -64,7 +64,6 @@ import { TypeFilterComponent } from '@shared/components/type-filter/type-filter.
|
||||
AsyncPipe,
|
||||
IqserListingModule,
|
||||
TranslateModule,
|
||||
NgIf,
|
||||
WorkflowItemComponent,
|
||||
DossierDetailsComponent,
|
||||
DossierOverviewBulkActionsComponent,
|
||||
@ -128,11 +127,11 @@ export default class DossierOverviewScreenComponent extends ListingComponent<Fil
|
||||
this.#updateFileAttributes();
|
||||
}
|
||||
|
||||
get checkedRequiredFilters(): NestedFilter[] {
|
||||
get #checkedRequiredFilters(): NestedFilter[] {
|
||||
return this.filterService.getGroup('quickFilters')?.filters.filter(f => f.required && f.checked);
|
||||
}
|
||||
|
||||
get checkedNotRequiredFilters(): NestedFilter[] {
|
||||
get #checkedNotRequiredFilters(): NestedFilter[] {
|
||||
return this.filterService.getGroup('quickFilters')?.filters.filter(f => !f.required && f.checked);
|
||||
}
|
||||
|
||||
@ -270,8 +269,8 @@ export default class DossierOverviewScreenComponent extends ListingComponent<Fil
|
||||
this.#fileAttributeConfigs,
|
||||
this.#dossier.dossierTemplateId,
|
||||
this._needsWorkFilterTemplate,
|
||||
() => this.checkedRequiredFilters,
|
||||
() => this.checkedNotRequiredFilters,
|
||||
() => this.#checkedRequiredFilters,
|
||||
() => this.#checkedNotRequiredFilters,
|
||||
);
|
||||
this.filterService.addFilterGroups(filterGroups, true);
|
||||
}
|
||||
|
||||
@ -1 +1,3 @@
|
||||
<iqser-status-bar *ngIf="stats" [configs]="statusBarConfig"></iqser-status-bar>
|
||||
@if (stats()) {
|
||||
<iqser-status-bar [configs]="statusBarConfig()"></iqser-status-bar>
|
||||
}
|
||||
|
||||
@ -1,27 +1,22 @@
|
||||
import { ChangeDetectionStrategy, Component, Input, OnChanges } from '@angular/core';
|
||||
import { ChangeDetectionStrategy, Component, computed, input } from '@angular/core';
|
||||
import { DossierStats, StatusSorter } from '@red/domain';
|
||||
import { List } from '@iqser/common-ui/lib/utils';
|
||||
import { StatusBarComponent, StatusBarConfig } from '@iqser/common-ui/lib/shared';
|
||||
import { NgIf } from '@angular/common';
|
||||
|
||||
@Component({
|
||||
selector: 'redaction-dossier-documents-status',
|
||||
templateUrl: './dossier-documents-status.component.html',
|
||||
changeDetection: ChangeDetectionStrategy.OnPush,
|
||||
standalone: true,
|
||||
imports: [StatusBarComponent, NgIf],
|
||||
imports: [StatusBarComponent],
|
||||
})
|
||||
export class DossierDocumentsStatusComponent implements OnChanges {
|
||||
@Input() stats: DossierStats;
|
||||
statusBarConfig: List<StatusBarConfig<string>>;
|
||||
export class DossierDocumentsStatusComponent {
|
||||
readonly stats = input<DossierStats>();
|
||||
readonly statusBarConfig = computed(() => this.#statusConfig);
|
||||
|
||||
private get _statusConfig(): List<StatusBarConfig<string>> {
|
||||
const { fileCountPerWorkflowStatus } = this.stats;
|
||||
get #statusConfig(): List<StatusBarConfig<string>> {
|
||||
const { fileCountPerWorkflowStatus } = this.stats();
|
||||
const statuses = Object.keys(fileCountPerWorkflowStatus).sort(StatusSorter.byStatus);
|
||||
return statuses.map(status => ({ length: fileCountPerWorkflowStatus[status], color: status }));
|
||||
}
|
||||
|
||||
ngOnChanges(): void {
|
||||
this.statusBarConfig = this._statusConfig;
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,15 +1,13 @@
|
||||
<div class="needs-work">
|
||||
<redaction-annotation-icon
|
||||
*ngIf="dossierStats.hasRedactionsFilePresent"
|
||||
[color]="redactionColor$ | async"
|
||||
[label]="'redaction-abbreviation' | translate"
|
||||
type="square"
|
||||
></redaction-annotation-icon>
|
||||
@if (dossierStats().hasRedactionsFilePresent) {
|
||||
<redaction-annotation-icon
|
||||
[color]="redactionColor$ | async"
|
||||
[label]="'redaction-abbreviation' | translate"
|
||||
type="square"
|
||||
></redaction-annotation-icon>
|
||||
}
|
||||
|
||||
<redaction-annotation-icon
|
||||
*ngIf="dossierStats.hasHintsNoRedactionsFilePresent"
|
||||
[color]="hintColor$ | async"
|
||||
label="H"
|
||||
type="circle"
|
||||
></redaction-annotation-icon>
|
||||
@if (dossierStats().hasHintsNoRedactionsFilePresent) {
|
||||
<redaction-annotation-icon [color]="hintColor$ | async" label="H" type="circle"></redaction-annotation-icon>
|
||||
}
|
||||
</div>
|
||||
|
||||
@ -1,9 +1,9 @@
|
||||
import { ChangeDetectionStrategy, Component, Input, OnChanges, SimpleChanges } from '@angular/core';
|
||||
import { ChangeDetectionStrategy, Component, input, OnChanges, SimpleChanges } from '@angular/core';
|
||||
import { DefaultColorType, Dossier, DossierStats } from '@red/domain';
|
||||
import { DefaultColorsService } from '@services/entity-services/default-colors.service';
|
||||
import { BehaviorSubject, Observable, switchMap } from 'rxjs';
|
||||
import { AnnotationIconComponent } from '@shared/components/annotation-icon/annotation-icon.component';
|
||||
import { AsyncPipe, NgIf } from '@angular/common';
|
||||
import { AsyncPipe } from '@angular/common';
|
||||
import { TranslateModule } from '@ngx-translate/core';
|
||||
|
||||
@Component({
|
||||
@ -12,12 +12,12 @@ import { TranslateModule } from '@ngx-translate/core';
|
||||
styleUrls: ['./dossier-workload-column.component.scss'],
|
||||
changeDetection: ChangeDetectionStrategy.OnPush,
|
||||
standalone: true,
|
||||
imports: [AnnotationIconComponent, AsyncPipe, TranslateModule, NgIf],
|
||||
imports: [AnnotationIconComponent, AsyncPipe, TranslateModule],
|
||||
})
|
||||
export class DossierWorkloadColumnComponent implements OnChanges {
|
||||
readonly #dossierTemplateId$ = new BehaviorSubject<string>(null);
|
||||
@Input() dossier: Dossier;
|
||||
@Input() dossierStats: DossierStats;
|
||||
readonly dossier = input<Dossier>();
|
||||
readonly dossierStats = input<DossierStats>();
|
||||
readonly hintColor$: Observable<string>;
|
||||
readonly redactionColor$: Observable<string>;
|
||||
|
||||
@ -30,7 +30,7 @@ export class DossierWorkloadColumnComponent implements OnChanges {
|
||||
|
||||
ngOnChanges(changes: SimpleChanges): void {
|
||||
if (changes.dossier) {
|
||||
this.#dossierTemplateId$.next(this.dossier.dossierTemplateId);
|
||||
this.#dossierTemplateId$.next(this.dossier().dossierTemplateId);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -1,30 +1,32 @@
|
||||
<div *ngIf="stats$ | async as stats">
|
||||
<redaction-donut-chart
|
||||
[config]="dossiersChartConfig$ | async"
|
||||
[radius]="80"
|
||||
[strokeWidth]="15"
|
||||
[subtitles]="['dossier-template-stats.active-dossiers' | translate : { count: stats.numberOfActiveDossiers }]"
|
||||
filterKey="dossierStatesFilters"
|
||||
></redaction-donut-chart>
|
||||
@if (stats$ | async; as stats) {
|
||||
<div>
|
||||
<redaction-donut-chart
|
||||
[config]="dossiersChartConfig$ | async"
|
||||
[radius]="80"
|
||||
[strokeWidth]="15"
|
||||
[subtitles]="['dossier-template-stats.active-dossiers' | translate: { count: stats.numberOfActiveDossiers }]"
|
||||
filterKey="dossierStatesFilters"
|
||||
></redaction-donut-chart>
|
||||
|
||||
<div class="dossier-stats-container">
|
||||
<div class="dossier-stats-item">
|
||||
<mat-icon svgIcon="red:needs-work"></mat-icon>
|
||||
<div>
|
||||
<div class="heading">{{ stats.numberOfPages | number }}</div>
|
||||
<div [translateParams]="{ count: stats.numberOfPages }" [translate]="'dossier-listing.stats.analyzed-pages'"></div>
|
||||
<div class="dossier-stats-container">
|
||||
<div class="dossier-stats-item">
|
||||
<mat-icon svgIcon="red:needs-work"></mat-icon>
|
||||
<div>
|
||||
<div class="heading">{{ stats.numberOfPages | number }}</div>
|
||||
<div [translateParams]="{ count: stats.numberOfPages }" [translate]="'dossier-listing.stats.analyzed-pages'"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="dossier-stats-item">
|
||||
<mat-icon svgIcon="red:user"></mat-icon>
|
||||
<div>
|
||||
<div class="heading">{{ stats.numberOfPeople }}</div>
|
||||
<div translate="dossier-listing.stats.total-people"></div>
|
||||
<div class="dossier-stats-item">
|
||||
<mat-icon svgIcon="red:user"></mat-icon>
|
||||
<div>
|
||||
<div class="heading">{{ stats.numberOfPeople }}</div>
|
||||
<div translate="dossier-listing.stats.total-people"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
<div class="right-chart">
|
||||
<redaction-donut-chart
|
||||
|
||||
@ -6,7 +6,7 @@ import { map } from 'rxjs/operators';
|
||||
import { DashboardStatsService } from '@services/dossier-templates/dashboard-stats.service';
|
||||
import { getParam } from '@iqser/common-ui/lib/utils';
|
||||
import { DonutChartComponent } from '@shared/components/donut-chart/donut-chart.component';
|
||||
import { AsyncPipe, DecimalPipe, NgIf } from '@angular/common';
|
||||
import { AsyncPipe, DecimalPipe } from '@angular/common';
|
||||
import { TranslateModule } from '@ngx-translate/core';
|
||||
import { MatIcon } from '@angular/material/icon';
|
||||
|
||||
@ -16,7 +16,7 @@ import { MatIcon } from '@angular/material/icon';
|
||||
styleUrls: ['./dossiers-listing-details.component.scss'],
|
||||
changeDetection: ChangeDetectionStrategy.OnPush,
|
||||
standalone: true,
|
||||
imports: [DonutChartComponent, AsyncPipe, NgIf, TranslateModule, MatIcon, DecimalPipe],
|
||||
imports: [DonutChartComponent, AsyncPipe, TranslateModule, MatIcon, DecimalPipe],
|
||||
})
|
||||
export class DossiersListingDetailsComponent {
|
||||
readonly stats$: Observable<DashboardStats>;
|
||||
|
||||
@ -1,18 +1,20 @@
|
||||
<ng-container *ngIf="stats$ | async as stats">
|
||||
@if (stats$ | async; as stats) {
|
||||
<div class="cell">
|
||||
<redaction-dossier-name-column [dossierStats]="stats" [dossier]="dossier"></redaction-dossier-name-column>
|
||||
<redaction-dossier-name-column [dossierStats]="stats" [dossier]="dossier()"></redaction-dossier-name-column>
|
||||
</div>
|
||||
|
||||
<div class="cell">
|
||||
<redaction-date-column [date]="stats.fileManipulationDate"></redaction-date-column>
|
||||
</div>
|
||||
|
||||
<div class="cell" *ngIf="!isDocumine">
|
||||
<redaction-dossier-workload-column [dossierStats]="stats" [dossier]="dossier"></redaction-dossier-workload-column>
|
||||
</div>
|
||||
@if (!isDocumine) {
|
||||
<div class="cell">
|
||||
<redaction-dossier-workload-column [dossierStats]="stats" [dossier]="dossier()"></redaction-dossier-workload-column>
|
||||
</div>
|
||||
}
|
||||
|
||||
<div class="cell user-column">
|
||||
<iqser-initials-avatar [user]="dossier.ownerId" [withName]="true"></iqser-initials-avatar>
|
||||
<iqser-initials-avatar [user]="dossier().ownerId" [withName]="true"></iqser-initials-avatar>
|
||||
</div>
|
||||
|
||||
<div class="cell status-container">
|
||||
@ -20,8 +22,8 @@
|
||||
</div>
|
||||
|
||||
<div class="cell">
|
||||
<redaction-dossier-state [dossier]="dossier"></redaction-dossier-state>
|
||||
<redaction-dossier-state [dossier]="dossier()"></redaction-dossier-state>
|
||||
|
||||
<redaction-dossiers-listing-actions [dossier]="dossier"></redaction-dossiers-listing-actions>
|
||||
<redaction-dossiers-listing-actions [dossier]="dossier()"></redaction-dossiers-listing-actions>
|
||||
</div>
|
||||
</ng-container>
|
||||
}
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import { ChangeDetectionStrategy, Component, Input, OnChanges } from '@angular/core';
|
||||
import { ChangeDetectionStrategy, Component, input, OnChanges } from '@angular/core';
|
||||
import { Dossier, DossierStats } from '@red/domain';
|
||||
import { DossierStatsService } from '@services/dossiers/dossier-stats.service';
|
||||
import { BehaviorSubject, Observable } from 'rxjs';
|
||||
@ -6,7 +6,7 @@ import { switchMap, tap } from 'rxjs/operators';
|
||||
import { getConfig } from '@iqser/common-ui';
|
||||
import { DossierNameColumnComponent } from '@shared/components/dossier-name-column/dossier-name-column.component';
|
||||
import { DateColumnComponent } from '../../../shared-dossiers/components/date-column/date-column.component';
|
||||
import { AsyncPipe, NgIf } from '@angular/common';
|
||||
import { AsyncPipe } from '@angular/common';
|
||||
import { DossierWorkloadColumnComponent } from '../dossier-workload-column/dossier-workload-column.component';
|
||||
import { InitialsAvatarComponent } from '@common-ui/users';
|
||||
import { DossierDocumentsStatusComponent } from '../dossier-documents-status/dossier-documents-status.component';
|
||||
@ -23,7 +23,6 @@ import { DossiersListingActionsComponent } from '../../../shared-dossiers/compon
|
||||
DossierNameColumnComponent,
|
||||
DateColumnComponent,
|
||||
AsyncPipe,
|
||||
NgIf,
|
||||
DossierWorkloadColumnComponent,
|
||||
InitialsAvatarComponent,
|
||||
DossierDocumentsStatusComponent,
|
||||
@ -32,7 +31,7 @@ import { DossiersListingActionsComponent } from '../../../shared-dossiers/compon
|
||||
],
|
||||
})
|
||||
export class TableItemComponent implements OnChanges {
|
||||
@Input() dossier!: Dossier;
|
||||
readonly dossier = input.required<Dossier>();
|
||||
|
||||
readonly stats$: Observable<DossierStats>;
|
||||
readonly isDocumine = getConfig().IS_DOCUMINE;
|
||||
@ -43,14 +42,14 @@ export class TableItemComponent implements OnChanges {
|
||||
switchMap(dossierId => this.dossierStatsService.watch$(dossierId)),
|
||||
// TODO required for sorting the dossier table - fix me Baby one more time!
|
||||
tap(stats => {
|
||||
this.dossier.changedDate = stats.fileManipulationDate;
|
||||
this.dossier().changedDate = stats.fileManipulationDate;
|
||||
}),
|
||||
);
|
||||
}
|
||||
|
||||
ngOnChanges() {
|
||||
if (this.dossier) {
|
||||
this.#ngOnChanges$.next(this.dossier.id);
|
||||
if (this.dossier()) {
|
||||
this.#ngOnChanges$.next(this.dossier().id);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -18,7 +18,7 @@
|
||||
[noDataButtonLabel]="'dossier-listing.no-data.action' | translate"
|
||||
[noDataText]="'dossier-listing.no-data.title' | translate"
|
||||
[noMatchText]="'dossier-listing.no-match.title' | translate"
|
||||
[showNoDataButton]="permissionsService.canCreateDossier(dossierTemplate())"
|
||||
[showNoDataButton]="canCreateDossier()"
|
||||
[tableColumnConfigs]="tableColumnConfigs"
|
||||
[rowIdPrefix]="'dossier'"
|
||||
[namePropertyKey]="'dossierName'"
|
||||
@ -27,7 +27,9 @@
|
||||
</div>
|
||||
|
||||
<div class="right-container" iqserHasScrollbar>
|
||||
<redaction-dossiers-listing-details *ngIf="(entitiesService.noData$ | async) === false"></redaction-dossiers-listing-details>
|
||||
@if ((entitiesService.noData$ | async) === false) {
|
||||
<redaction-dossiers-listing-details></redaction-dossiers-listing-details>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
@ -51,7 +51,8 @@ export class DossiersListingScreenComponent extends ListingComponent<Dossier> im
|
||||
readonly dossierTemplates = toSignal(this.dossierTemplatesService.all$);
|
||||
readonly dossierTemplate = computed(() => this.dossierTemplates().find(template => this.dossierTemplateId === template.id));
|
||||
readonly buttonConfigs = computed(() => this._configService.buttonsConfig(this.dossierTemplate()));
|
||||
readonly computeFilters$ = this._activeDossiersService.all$.pipe(tap(() => this._computeAllFilters()));
|
||||
readonly canCreateDossier = computed(() => this.permissionsService.canCreateDossier(this.dossierTemplate()));
|
||||
readonly computeFilters$ = this._activeDossiersService.all$.pipe(tap(() => this.#computeAllFilters()));
|
||||
@ViewChild('needsWorkFilterTemplate', {
|
||||
read: TemplateRef,
|
||||
static: true,
|
||||
@ -92,7 +93,7 @@ export class DossiersListingScreenComponent extends ListingComponent<Dossier> im
|
||||
this._loadingService.stop();
|
||||
}
|
||||
|
||||
private _computeAllFilters() {
|
||||
#computeAllFilters() {
|
||||
const filterGroups = this._configService.filterGroups(
|
||||
this.entitiesService.all,
|
||||
this._needsWorkFilterTemplate,
|
||||
|
||||
@ -60,7 +60,7 @@ export class AnnotationActionsComponent {
|
||||
AnnotationPermissions.forUser(
|
||||
this._permissionsService.isApprover(this._state.dossier()),
|
||||
this.annotations(),
|
||||
this._state.dictionaries,
|
||||
untracked(this._state.dictionaries),
|
||||
this._iqserPermissionsService,
|
||||
this._state.file().excludedFromAutomaticAnalysis,
|
||||
),
|
||||
|
||||
@ -1,44 +1,42 @@
|
||||
<div class="details">
|
||||
<redaction-annotation-icon
|
||||
[color]="annotation.color"
|
||||
[label]="annotation.isEarmark ? '' : ((annotationTypesTranslations[annotation.superType] | translate)?.[0] | uppercase)"
|
||||
[type]="annotation.iconShape"
|
||||
[color]="annotation().color"
|
||||
[label]="isEarmark() ? '' : ((annotationTypesTranslations[annotation().superType] | translate)?.[0] | uppercase)"
|
||||
[type]="iconShape()"
|
||||
class="mt-6 mr-10"
|
||||
></redaction-annotation-icon>
|
||||
|
||||
<div class="flex-1">
|
||||
<div>
|
||||
<strong>{{ annotation.superTypeLabel | translate }}</strong>
|
||||
<strong>{{ annotation().superTypeLabel | translate }}</strong>
|
||||
|
||||
<strong *ngIf="annotation.pending" class="pending-analysis">
|
||||
{{ 'annotation.pending' | translate }}
|
||||
<strong *ngIf="annotation().pending" class="pending-analysis">
|
||||
{{ 'annotation().pending' | translate }}
|
||||
</strong>
|
||||
</div>
|
||||
|
||||
<div *ngIf="annotation.typeLabel">
|
||||
<div *ngIf="annotation().typeLabel">
|
||||
<strong>
|
||||
<span>{{ annotation.descriptor | translate }}</span
|
||||
<span>{{ descriptor() | translate }}</span
|
||||
>:
|
||||
</strong>
|
||||
{{ annotation.typeLabel }}
|
||||
{{ annotation().typeLabel }}
|
||||
</div>
|
||||
|
||||
<div
|
||||
*deny="roles.getRss; if: !!annotation.shortContent && !annotation.isHint && !annotation.isSkipped && !annotation.isIgnoredHint"
|
||||
>
|
||||
<strong><span translate="content"></span>: </strong>{{ annotation.shortContent }}
|
||||
<div *deny="roles.getRss; if: !!annotation().shortContent && !isHint() && !isSkipped() && !isIgnoredHint()">
|
||||
<strong><span translate="content"></span>: </strong>{{ annotation().shortContent }}
|
||||
</div>
|
||||
|
||||
<div *ngIf="annotation.isEarmark">
|
||||
<strong><span translate="color"></span>: </strong>{{ annotation.color }}
|
||||
<div *ngIf="isEarmark()">
|
||||
<strong><span translate="color"></span>: </strong>{{ annotation().color }}
|
||||
</div>
|
||||
|
||||
<div *ngIf="annotation.isEarmark">
|
||||
<strong><span translate="size"></span>: </strong>{{ annotation.width }}x{{ annotation.height }} px
|
||||
<div *ngIf="isEarmark()">
|
||||
<strong><span translate="size"></span>: </strong>{{ width() }}x{{ height() }} px
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="active-icon-marker-container">
|
||||
<iqser-round-checkbox *ngIf="multiSelectService.active() && isSelected" active></iqser-round-checkbox>
|
||||
<iqser-round-checkbox *ngIf="multiSelectService.active() && isSelected()" active></iqser-round-checkbox>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
import { NgIf, UpperCasePipe } from '@angular/common';
|
||||
import { Component, Input } from '@angular/core';
|
||||
import { Component, computed, input } from '@angular/core';
|
||||
import { RoundCheckboxComponent } from '@common-ui/inputs/round-checkbox/round-checkbox.component';
|
||||
import { getConfig, IqserDenyDirective } from '@iqser/common-ui';
|
||||
import { AnnotationWrapper } from '@models/file/annotation.wrapper';
|
||||
@ -20,8 +20,17 @@ export class AnnotationCardComponent {
|
||||
protected readonly roles = Roles;
|
||||
protected readonly annotationTypesTranslations = annotationTypesTranslations;
|
||||
protected readonly isDocumine = getConfig().IS_DOCUMINE;
|
||||
@Input() annotation: AnnotationWrapper;
|
||||
@Input() isSelected = false;
|
||||
annotation = input<AnnotationWrapper>();
|
||||
isSelected = input(false);
|
||||
|
||||
readonly isEarmark = computed(() => this.annotation().isEarmark);
|
||||
readonly iconShape = computed(() => this.annotation().iconShape);
|
||||
readonly width = computed(() => this.annotation().width);
|
||||
readonly height = computed(() => this.annotation().height);
|
||||
readonly isHint = computed(() => this.annotation().isHint);
|
||||
readonly isSkipped = computed(() => this.annotation().isSkipped);
|
||||
readonly isIgnoredHint = computed(() => this.annotation().isIgnoredHint);
|
||||
readonly descriptor = computed(() => this.annotation().descriptor);
|
||||
|
||||
constructor(readonly multiSelectService: MultiSelectService) {}
|
||||
}
|
||||
|
||||
@ -8,7 +8,7 @@
|
||||
matTooltipPosition="above"
|
||||
></redaction-annotation-card>
|
||||
|
||||
@if (!annotation().item.isEarmark) {
|
||||
@if (!isEarmark()) {
|
||||
<div class="actions-wrapper">
|
||||
@if (!annotation().item.pending) {
|
||||
<div
|
||||
|
||||
@ -42,6 +42,8 @@ export class AnnotationWrapperComponent {
|
||||
protected readonly multiSelectService = inject(MultiSelectService);
|
||||
readonly #isDocumine = getConfig().IS_DOCUMINE;
|
||||
|
||||
readonly isEarmark = computed(() => this.annotation().item.isEarmark);
|
||||
|
||||
constructor() {
|
||||
effect(() => {
|
||||
this.active = this.annotation().isSelected;
|
||||
|
||||
@ -23,7 +23,9 @@
|
||||
<div class="section">
|
||||
<div *ngFor="let attr of _fileAttributes()" class="attribute">
|
||||
<div class="small-label">{{ attr.label }}:</div>
|
||||
<div>{{ attr.value ? (isDate(attr) ? (attr.value | date : 'd MMM yyyy') : attr.value) : '-' }}</div>
|
||||
<div>
|
||||
{{ attr.value ? (attr.type === FileAttributeConfigTypes.DATE ? (attr.value | date: 'd MMM yyyy') : attr.value) : '-' }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -31,23 +33,23 @@
|
||||
<div>
|
||||
<mat-icon svgIcon="red:folder"></mat-icon>
|
||||
<span
|
||||
[innerHTML]="'file-preview.tabs.document-info.details.dossier' | translate : { dossierName: _state.dossier().dossierName }"
|
||||
[innerHTML]="'file-preview.tabs.document-info.details.dossier' | translate: { dossierName: _state.dossier().dossierName }"
|
||||
></span>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<mat-icon svgIcon="iqser:document"></mat-icon>
|
||||
<span>{{ 'file-preview.tabs.document-info.details.pages' | translate : { pages: _state.file().numberOfPages } }}</span>
|
||||
<span>{{ 'file-preview.tabs.document-info.details.pages' | translate: { pages: _state.file().numberOfPages } }}</span>
|
||||
</div>
|
||||
|
||||
<div *ngIf="_state.file().added | date : 'mediumDate' as added">
|
||||
<div *ngIf="_state.file().added | date: 'mediumDate' as added">
|
||||
<mat-icon svgIcon="iqser:calendar"></mat-icon>
|
||||
<span [innerHTML]="'file-preview.tabs.document-info.details.created-on' | translate : { date: added }"></span>
|
||||
<span [innerHTML]="'file-preview.tabs.document-info.details.created-on' | translate: { date: added }"></span>
|
||||
</div>
|
||||
|
||||
<div *ngIf="_state.dossier().dueDate | date : 'mediumDate' as dueDate">
|
||||
<div *ngIf="_state.dossier().dueDate | date: 'mediumDate' as dueDate">
|
||||
<mat-icon svgIcon="red:lightning"></mat-icon>
|
||||
<span [innerHTML]="'file-preview.tabs.document-info.details.due' | translate : { date: dueDate }"></span>
|
||||
<span [innerHTML]="'file-preview.tabs.document-info.details.due' | translate: { date: dueDate }"></span>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
|
||||
@ -43,6 +43,7 @@ export class DocumentInfoComponent extends ContextComponent<Context> {
|
||||
this._fileAttributesConfig();
|
||||
return this._attributes();
|
||||
});
|
||||
protected readonly FileAttributeConfigTypes = FileAttributeConfigTypes;
|
||||
|
||||
constructor(
|
||||
readonly permissionsService: PermissionsService,
|
||||
@ -56,10 +57,6 @@ export class DocumentInfoComponent extends ContextComponent<Context> {
|
||||
this._dialogService.openDialog('documentInfo', this._state.file());
|
||||
}
|
||||
|
||||
isDate(attribute: FileAttribute) {
|
||||
return attribute.type === FileAttributeConfigTypes.DATE;
|
||||
}
|
||||
|
||||
closeView() {
|
||||
this._documentInfoService.hide();
|
||||
setLocalStorageDataByFileId(this._state.fileId, 'show-document-info', false);
|
||||
|
||||
@ -54,7 +54,7 @@
|
||||
<div class="editing-actions">
|
||||
<iqser-icon-button
|
||||
(action)="save()"
|
||||
[disabled]="disabled"
|
||||
[disabled]="disabled()"
|
||||
[label]="'component-management.actions.save' | translate"
|
||||
[type]="iconButtonTypes.primary"
|
||||
></iqser-icon-button>
|
||||
|
||||
@ -48,7 +48,16 @@ export class EditableStructuredComponentValueComponent implements OnInit {
|
||||
protected entryLabel: string;
|
||||
protected editing = false;
|
||||
protected initialEntry: IComponentLogEntry;
|
||||
readonly disabled = computed(() => {
|
||||
for (let i = 0; i < this.currentEntry().componentValues.length; i++) {
|
||||
if (this.currentEntry().componentValues[i].value !== this.initialEntry.componentValues[i]?.value) {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
return this.currentEntry().componentValues.length === this.initialEntry.componentValues.length;
|
||||
});
|
||||
protected readonly iconButtonTypes = IconButtonTypes;
|
||||
readonly #initialEntry = computed(() => JSON.parse(JSON.stringify(this.entry())));
|
||||
|
||||
constructor(
|
||||
readonly helpModeService: HelpModeService,
|
||||
@ -56,26 +65,13 @@ export class EditableStructuredComponentValueComponent implements OnInit {
|
||||
private readonly _state: FilePreviewStateService,
|
||||
) {}
|
||||
|
||||
get disabled() {
|
||||
for (let i = 0; i < this.currentEntry().componentValues.length; i++) {
|
||||
if (this.currentEntry().componentValues[i].value !== this.initialEntry.componentValues[i]?.value) {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
return this.currentEntry().componentValues.length === this.initialEntry.componentValues.length;
|
||||
}
|
||||
|
||||
get #initialEntry() {
|
||||
return JSON.parse(JSON.stringify(this.entry()));
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
this.currentEntry = signal(this.entry());
|
||||
this.reset();
|
||||
}
|
||||
|
||||
reset() {
|
||||
this.initialEntry = this.#initialEntry;
|
||||
this.initialEntry = this.#initialEntry();
|
||||
this.entryLabel = this.parseName(this.currentEntry().name);
|
||||
this.deselect();
|
||||
}
|
||||
|
||||
@ -172,7 +172,7 @@
|
||||
translate="file-preview.tabs.annotations.reset"
|
||||
></a>
|
||||
{{ 'file-preview.tabs.annotations.the-filters' | translate }}
|
||||
} @else if (state.componentReferenceIds?.length === 0) {
|
||||
} @else if (state.componentReferenceIdsSignal()?.length === 0) {
|
||||
{{ 'file-preview.tabs.annotations.no-annotations' | translate }}
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,19 +1,19 @@
|
||||
<div
|
||||
(click)="pageSelected.emit(number)"
|
||||
(click)="pageSelected.emit(pageNumber())"
|
||||
(dblclick)="toggleReadState()"
|
||||
*ngIf="assigneeChanged$ | async"
|
||||
[class.active]="isActive"
|
||||
[class.read]="read"
|
||||
[id]="'quick-nav-page-' + number"
|
||||
[class.active]="isActive()"
|
||||
[class.read]="read()"
|
||||
[id]="'quick-nav-page-' + pageNumber()"
|
||||
class="page-wrapper"
|
||||
>
|
||||
<mat-icon [svgIcon]="showDottedIcon ? 'red:excluded-page' : 'red:page'"></mat-icon>
|
||||
<mat-icon [svgIcon]="showDottedIcon() ? 'red:excluded-page' : 'red:page'"></mat-icon>
|
||||
|
||||
<div class="text">{{ number }}</div>
|
||||
<div class="text">{{ pageNumber() }}</div>
|
||||
|
||||
<div *ngIf="activeSelection" class="dot"></div>
|
||||
<div *ngIf="activeSelection()" class="dot"></div>
|
||||
|
||||
<div *ngIf="pageRotationService.rotations()[number]" class="rotated">
|
||||
<div *ngIf="pageRotationService.rotations()[pageNumber()]" class="rotated">
|
||||
<mat-icon svgIcon="red:rotation"></mat-icon>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import { Component, effect, EventEmitter, inject, Input, OnChanges, Output } from '@angular/core';
|
||||
import { Component, computed, effect, inject, input, output, untracked } from '@angular/core';
|
||||
import { PermissionsService } from '@services/permissions.service';
|
||||
import { ViewedPagesService } from '@services/files/viewed-pages.service';
|
||||
import { FilePreviewStateService } from '../../services/file-preview-state.service';
|
||||
@ -12,6 +12,9 @@ import { PdfViewer } from '../../../pdf-viewer/services/pdf-viewer.service';
|
||||
import { NGXLogger } from 'ngx-logger';
|
||||
import { AsyncPipe, NgIf } from '@angular/common';
|
||||
import { MatIcon } from '@angular/material/icon';
|
||||
import { MultiSelectService } from '../../services/multi-select.service';
|
||||
import { AnnotationsListingService } from '../../services/annotations-listing.service';
|
||||
import { toSignal } from '@angular/core/rxjs-interop';
|
||||
|
||||
@Component({
|
||||
selector: 'redaction-page-indicator',
|
||||
@ -20,16 +23,26 @@ import { MatIcon } from '@angular/material/icon';
|
||||
standalone: true,
|
||||
imports: [NgIf, AsyncPipe, MatIcon],
|
||||
})
|
||||
export class PageIndicatorComponent implements OnChanges {
|
||||
export class PageIndicatorComponent {
|
||||
readonly #multiSelectService = inject(MultiSelectService);
|
||||
readonly #listingService = inject(AnnotationsListingService);
|
||||
readonly #config = getConfig<AppConfig>();
|
||||
readonly #logger = inject(NGXLogger);
|
||||
@Input({ required: true }) number: number;
|
||||
@Input() showDottedIcon = false;
|
||||
@Input() activeSelection = false;
|
||||
@Input() read = false;
|
||||
@Output() readonly pageSelected = new EventEmitter<number>();
|
||||
readonly pageNumber = input.required<number>();
|
||||
readonly viewedPages = input.required<ViewedPage[]>();
|
||||
readonly showDottedIcon = computed(() => this._state.file().excludedPages.includes(this.pageNumber()));
|
||||
readonly selectedLength = toSignal(this.#listingService.selectedLength$);
|
||||
readonly activeSelection = computed(
|
||||
() =>
|
||||
this.#multiSelectService.active() &&
|
||||
this.selectedLength() &&
|
||||
this.#listingService.selected.find(p => p.pageNumber === this.pageNumber()),
|
||||
);
|
||||
readonly read = computed(() => this.viewedPages().find(p => p.page === this.pageNumber()));
|
||||
readonly pageSelected = output<number>();
|
||||
pageReadTimeout: number = null;
|
||||
readonly assigneeChanged$: Observable<boolean>;
|
||||
isActive = computed(() => untracked(this.pageNumber) === this._pdf.currentPage());
|
||||
|
||||
constructor(
|
||||
private readonly _viewedPagesService: ViewedPagesService,
|
||||
@ -48,27 +61,19 @@ export class PageIndicatorComponent implements OnChanges {
|
||||
);
|
||||
|
||||
effect(() => {
|
||||
if (this.isActive) {
|
||||
if (this.isActive()) {
|
||||
this.handlePageRead();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
get isActive() {
|
||||
return this.number === this._pdf.currentPage();
|
||||
}
|
||||
|
||||
ngOnChanges() {
|
||||
this.handlePageRead();
|
||||
}
|
||||
|
||||
async toggleReadState() {
|
||||
if (!this._permissionService.canMarkPagesAsViewed(this._state.file())) {
|
||||
this.#logger.info('[PAGES] Cannot toggle read state');
|
||||
return;
|
||||
}
|
||||
|
||||
if (this.read) {
|
||||
const read = untracked(this.read);
|
||||
if (read) {
|
||||
await this.#markPageUnread();
|
||||
} else {
|
||||
await this.#markPageRead();
|
||||
@ -85,9 +90,10 @@ export class PageIndicatorComponent implements OnChanges {
|
||||
clearTimeout(this.pageReadTimeout);
|
||||
}
|
||||
|
||||
if (this.isActive && !this.read) {
|
||||
const read = untracked(this.read);
|
||||
if (this.isActive() && !read) {
|
||||
this.pageReadTimeout = window.setTimeout(async () => {
|
||||
if (this.isActive && !this.read) {
|
||||
if (this.isActive() && !read) {
|
||||
await this.#markPageRead();
|
||||
}
|
||||
}, this.#config.AUTO_READ_TIME * 1000);
|
||||
@ -95,19 +101,21 @@ export class PageIndicatorComponent implements OnChanges {
|
||||
}
|
||||
|
||||
async #markPageRead() {
|
||||
this.#logger.info('[PAGES] Mark page read', this.number);
|
||||
const number = untracked(this.pageNumber);
|
||||
this.#logger.info('[PAGES] Mark page read', number);
|
||||
|
||||
const fileId = this._state.fileId;
|
||||
await this._viewedPagesService.add({ page: this.number }, this._state.dossierId, fileId);
|
||||
const viewedPage = new ViewedPage({ page: this.number, fileId });
|
||||
await this._viewedPagesService.add({ page: number }, this._state.dossierId, fileId);
|
||||
const viewedPage = new ViewedPage({ page: number, fileId });
|
||||
this._viewedPagesMapService.add(fileId, viewedPage);
|
||||
}
|
||||
|
||||
async #markPageUnread() {
|
||||
this.#logger.info('[PAGES] Mark page unread', this.number);
|
||||
const number = untracked(this.pageNumber);
|
||||
this.#logger.info('[PAGES] Mark page unread', number);
|
||||
|
||||
const fileId = this._state.fileId;
|
||||
await this._viewedPagesService.remove(this._state.dossierId, fileId, this.number);
|
||||
this._viewedPagesMapService.delete(fileId, this.number);
|
||||
await this._viewedPagesService.remove(this._state.dossierId, fileId, number);
|
||||
this._viewedPagesMapService.delete(fileId, number);
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,10 +1,9 @@
|
||||
<div *ngIf="viewedPages$ | async as viewedPages" class="pages" id="pages" [attr.help-mode-key]="'workload_page_list'">
|
||||
<redaction-page-indicator
|
||||
(pageSelected)="pageSelectedByClick($event)"
|
||||
*ngFor="let pageNumber of pages; trackBy: trackBy"
|
||||
[activeSelection]="pageHasSelection(pageNumber)"
|
||||
[number]="pageNumber"
|
||||
[read]="!!getViewedPage(viewedPages, pageNumber)"
|
||||
[showDottedIcon]="isPageExcluded(pageNumber)"
|
||||
></redaction-page-indicator>
|
||||
<div class="pages" id="pages" [attr.help-mode-key]="'workload_page_list'">
|
||||
@for (pageNumber of pages(); track pageNumber) {
|
||||
<redaction-page-indicator
|
||||
(pageSelected)="pageSelectedByClick($event)"
|
||||
[pageNumber]="pageNumber"
|
||||
[viewedPages]="viewedPages()"
|
||||
></redaction-page-indicator>
|
||||
}
|
||||
</div>
|
||||
|
||||
@ -1,14 +1,12 @@
|
||||
import { AsyncPipe, NgForOf, NgIf } from '@angular/common';
|
||||
import { AfterViewInit, Component, inject, Input } from '@angular/core';
|
||||
import { AfterViewInit, Component, inject, input } from '@angular/core';
|
||||
import { List } from '@iqser/common-ui/lib/utils';
|
||||
import { ViewedPage } from '@red/domain';
|
||||
import { ViewedPagesMapService } from '@services/files/viewed-pages-map.service';
|
||||
import scrollIntoView from 'scroll-into-view-if-needed';
|
||||
import { PdfViewer } from '../../../pdf-viewer/services/pdf-viewer.service';
|
||||
import { AnnotationsListingService } from '../../services/annotations-listing.service';
|
||||
import { FilePreviewStateService } from '../../services/file-preview-state.service';
|
||||
import { MultiSelectService } from '../../services/multi-select.service';
|
||||
import { PageIndicatorComponent } from '../page-indicator/page-indicator.component';
|
||||
import { toSignal } from '@angular/core/rxjs-interop';
|
||||
|
||||
@Component({
|
||||
selector: 'redaction-pages',
|
||||
@ -19,11 +17,10 @@ import { PageIndicatorComponent } from '../page-indicator/page-indicator.compone
|
||||
})
|
||||
export class PagesComponent implements AfterViewInit {
|
||||
readonly #state = inject(FilePreviewStateService);
|
||||
readonly #multiSelectService = inject(MultiSelectService);
|
||||
readonly #listingService = inject(AnnotationsListingService);
|
||||
protected readonly _pdf = inject(PdfViewer);
|
||||
@Input({ required: true }) pages: List<number>;
|
||||
readonly pages = input.required<List<number>>();
|
||||
readonly viewedPages$ = inject(ViewedPagesMapService).get$(this.#state.fileId);
|
||||
readonly viewedPages = toSignal(this.viewedPages$);
|
||||
|
||||
ngAfterViewInit() {
|
||||
setTimeout(() => {
|
||||
@ -45,18 +42,4 @@ export class PagesComponent implements AfterViewInit {
|
||||
pageSelectedByClick($event: number): void {
|
||||
this._pdf.navigateTo($event);
|
||||
}
|
||||
|
||||
readonly trackBy = (_index: number, item: number) => item;
|
||||
|
||||
pageHasSelection(page: number) {
|
||||
return this.#multiSelectService.active() && !!this.#listingService.selected.find(a => a.pageNumber === page);
|
||||
}
|
||||
|
||||
isPageExcluded(pageNumber: number): boolean {
|
||||
return this.#state.file().excludedPages.includes(pageNumber);
|
||||
}
|
||||
|
||||
getViewedPage(viewedPages: ViewedPage[], pageNumber: number) {
|
||||
return viewedPages.find(p => p.page === pageNumber);
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
<cdk-virtual-scroll-viewport [itemSize]="LIST_ITEM_SIZE" [ngStyle]="{ height: redactedTextsAreaHeight + 'px' }">
|
||||
<cdk-virtual-scroll-viewport [itemSize]="LIST_ITEM_SIZE" [ngStyle]="{ height: redactedTextsAreaHeight() + 'px' }">
|
||||
<ul>
|
||||
<li *cdkVirtualFor="let value of values">{{ value }}</li>
|
||||
<li *cdkVirtualFor="let value of values()">{{ value }}</li>
|
||||
</ul>
|
||||
</cdk-virtual-scroll-viewport>
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import { Component, Input } from '@angular/core';
|
||||
import { Component, computed, input } from '@angular/core';
|
||||
import { CdkFixedSizeVirtualScroll, CdkVirtualForOf, CdkVirtualScrollViewport } from '@angular/cdk/scrolling';
|
||||
import { NgStyle } from '@angular/common';
|
||||
|
||||
@ -13,10 +13,9 @@ const MAX_ITEMS_DISPLAY = 5;
|
||||
styleUrl: './selected-annotations-list.component.scss',
|
||||
})
|
||||
export class SelectedAnnotationsListComponent {
|
||||
@Input({ required: true }) values: string[];
|
||||
values = input.required<string[]>();
|
||||
readonly redactedTextsAreaHeight = computed(() =>
|
||||
this.values.length <= MAX_ITEMS_DISPLAY ? LIST_ITEM_SIZE * this.values.length : LIST_ITEM_SIZE * MAX_ITEMS_DISPLAY,
|
||||
);
|
||||
protected readonly LIST_ITEM_SIZE = LIST_ITEM_SIZE;
|
||||
|
||||
get redactedTextsAreaHeight() {
|
||||
return this.values.length <= MAX_ITEMS_DISPLAY ? LIST_ITEM_SIZE * this.values.length : LIST_ITEM_SIZE * MAX_ITEMS_DISPLAY;
|
||||
}
|
||||
}
|
||||
|
||||
@ -16,7 +16,7 @@
|
||||
<redaction-editable-structured-component-value
|
||||
#editableComponent
|
||||
[entry]="entry"
|
||||
[canEdit]="canEdit"
|
||||
[canEdit]="canEdit()"
|
||||
(deselectLast)="deselectLast()"
|
||||
(revertOverride)="revertOverride($event)"
|
||||
(overrideValue)="overrideValue($event)"
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import { Component, effect, Input, OnInit, signal, ViewChildren } from '@angular/core';
|
||||
import { Component, computed, effect, input, OnInit, signal, viewChild } from '@angular/core';
|
||||
import { List } from '@common-ui/utils';
|
||||
import { IconButtonTypes, LoadingService } from '@iqser/common-ui';
|
||||
import { ComponentLogEntry, Dictionary, File, IComponentLogEntry, WorkflowFileStatuses } from '@red/domain';
|
||||
@ -21,13 +21,14 @@ import { FilePreviewStateService } from '../../services/file-preview-state.servi
|
||||
imports: [PopupFilterComponent, NgIf, AsyncPipe, TranslateModule, NgForOf, EditableStructuredComponentValueComponent],
|
||||
})
|
||||
export class StructuredComponentManagementComponent implements OnInit {
|
||||
file = input<File>();
|
||||
dictionaries = input<Dictionary[]>();
|
||||
editableComponents = viewChild<List<EditableStructuredComponentValueComponent>>('editableComponent');
|
||||
canEdit = computed(() => this.file().workflowStatus !== WorkflowFileStatuses.APPROVED);
|
||||
protected readonly componentLogData = signal<ComponentLogEntry[] | undefined>(undefined);
|
||||
protected readonly componentLogData$ = toObservable(this.componentLogData);
|
||||
protected readonly iconButtonTypes = IconButtonTypes;
|
||||
protected displayedComponents$: Observable<ComponentLogEntry[]>;
|
||||
@Input() file: File;
|
||||
@Input() dictionaries: Dictionary[];
|
||||
@ViewChildren('editableComponent') editableComponents: List<EditableStructuredComponentValueComponent>;
|
||||
|
||||
constructor(
|
||||
private readonly _componentLogService: ComponentLogService,
|
||||
@ -42,17 +43,13 @@ export class StructuredComponentManagementComponent implements OnInit {
|
||||
});
|
||||
}
|
||||
|
||||
get canEdit() {
|
||||
return this.file.workflowStatus !== WorkflowFileStatuses.APPROVED;
|
||||
}
|
||||
|
||||
async ngOnInit(): Promise<void> {
|
||||
await this.#loadData();
|
||||
this.displayedComponents$ = this.#displayedComponents$();
|
||||
}
|
||||
|
||||
deselectLast() {
|
||||
const lastSelected = this.editableComponents.find(c => c.selected);
|
||||
const lastSelected = this.editableComponents().find(c => c.selected);
|
||||
if (lastSelected) {
|
||||
lastSelected.deselect();
|
||||
}
|
||||
@ -61,7 +58,9 @@ export class StructuredComponentManagementComponent implements OnInit {
|
||||
async revertOverride(originalKey: string) {
|
||||
this._loadingService.start();
|
||||
await firstValueFrom(
|
||||
this._componentLogService.revertOverride(this.file.dossierTemplateId, this.file.dossierId, this.file.fileId, [originalKey]),
|
||||
this._componentLogService.revertOverride(this.file().dossierTemplateId, this.file().dossierId, this.file().fileId, [
|
||||
originalKey,
|
||||
]),
|
||||
);
|
||||
await this.#loadData();
|
||||
}
|
||||
@ -69,7 +68,7 @@ export class StructuredComponentManagementComponent implements OnInit {
|
||||
async overrideValue(componentLogEntry: IComponentLogEntry) {
|
||||
this._loadingService.start();
|
||||
await firstValueFrom(
|
||||
this._componentLogService.override(this.file.dossierTemplateId, this.file.dossierId, this.file.fileId, componentLogEntry),
|
||||
this._componentLogService.override(this.file().dossierTemplateId, this.file().dossierId, this.file().fileId, componentLogEntry),
|
||||
);
|
||||
await this.#loadData();
|
||||
}
|
||||
@ -84,10 +83,10 @@ export class StructuredComponentManagementComponent implements OnInit {
|
||||
async #loadData(): Promise<void> {
|
||||
const componentLogData = await firstValueFrom(
|
||||
this._componentLogService.getComponentLogData(
|
||||
this.file.dossierTemplateId,
|
||||
this.file.dossierId,
|
||||
this.file.fileId,
|
||||
this.dictionaries,
|
||||
this.file().dossierTemplateId,
|
||||
this.file().dossierId,
|
||||
this.file().fileId,
|
||||
this.dictionaries(),
|
||||
),
|
||||
);
|
||||
this.#computeFilters(componentLogData);
|
||||
|
||||
@ -67,7 +67,7 @@
|
||||
|
||||
<mat-form-field>
|
||||
<mat-select formControlName="dictionary" [placeholder]="'add-hint.dialog.content.type-placeholder' | translate">
|
||||
<mat-select-trigger>{{ displayedDictionaryLabel }}</mat-select-trigger>
|
||||
<mat-select-trigger>{{ displayedDictionaryLabel() }}</mat-select-trigger>
|
||||
<mat-option
|
||||
*ngFor="let dictionary of dictionaries"
|
||||
[matTooltip]="dictionary.description"
|
||||
@ -100,7 +100,7 @@
|
||||
[label]="'add-hint.dialog.actions.save' | translate"
|
||||
[submit]="true"
|
||||
[type]="iconButtonTypes.primary"
|
||||
[disabled]="disabled"
|
||||
[disabled]="_disabled()"
|
||||
>
|
||||
</iqser-icon-button>
|
||||
|
||||
|
||||
@ -1,6 +1,5 @@
|
||||
import { NgClass, NgForOf, NgIf, NgStyle } from '@angular/common';
|
||||
import { Component, OnInit } from '@angular/core';
|
||||
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
|
||||
import { Component, computed, effect, OnInit } from '@angular/core';
|
||||
import { FormBuilder, ReactiveFormsModule, UntypedFormGroup } from '@angular/forms';
|
||||
import { MatDialogClose } from '@angular/material/dialog';
|
||||
import { MatFormField } from '@angular/material/form-field';
|
||||
@ -24,10 +23,10 @@ import { DictionaryService } from '@services/entity-services/dictionary.service'
|
||||
import { Roles } from '@users/roles';
|
||||
import { UserPreferenceService } from '@users/user-preference.service';
|
||||
import { calcTextWidthInPixels, stringToBoolean } from '@utils/functions';
|
||||
import { tap } from 'rxjs/operators';
|
||||
import { SystemDefaultOption, SystemDefaults } from '../../../account/utils/dialog-defaults';
|
||||
import { getRedactOrHintOptions } from '../../utils/dialog-options';
|
||||
import { AddHintData, AddHintResult, RedactOrHintOption, RedactOrHintOptions } from '../../utils/dialog-types';
|
||||
import { formValueToSignal } from '@common-ui/utils';
|
||||
|
||||
const MAXIMUM_TEXT_AREA_WIDTH = 421;
|
||||
|
||||
@ -67,11 +66,22 @@ export class AddHintDialogComponent extends IqserDialogComponent<AddHintDialogCo
|
||||
readonly maximumSelectedTextWidth = 567;
|
||||
dictionaryRequest = false;
|
||||
dictionaries: Dictionary[] = [];
|
||||
form!: UntypedFormGroup;
|
||||
form = this.#getForm();
|
||||
isEditingSelectedText = false;
|
||||
selectedTextRows = 1;
|
||||
textWidth: number;
|
||||
|
||||
dictionary = formValueToSignal(this.form.get('dictionary'));
|
||||
displayedDictionaryLabel = computed(() => {
|
||||
if (this.dictionary()) {
|
||||
return this.dictionaries.find(d => d.type === this.dictionary())?.label ?? null;
|
||||
}
|
||||
return null;
|
||||
});
|
||||
|
||||
_disabled = computed(() => this.#isRss || !this.dictionary());
|
||||
readonly optionValue = formValueToSignal<DetailsRadioOption<RedactOrHintOption>>(this.form.get('option'));
|
||||
|
||||
constructor(
|
||||
private readonly _activeDossiersService: ActiveDossiersService,
|
||||
private readonly _dictionaryService: DictionaryService,
|
||||
@ -80,7 +90,7 @@ export class AddHintDialogComponent extends IqserDialogComponent<AddHintDialogCo
|
||||
private readonly _userPreferences: UserPreferenceService,
|
||||
) {
|
||||
super();
|
||||
this.#dossier = _activeDossiersService.find(this.data.dossierId);
|
||||
this.#dossier = this._activeDossiersService.find(this.data.dossierId);
|
||||
this.#applyToAllDossiers = this.applyToAll;
|
||||
this.options = getRedactOrHintOptions(
|
||||
this.#dossier,
|
||||
@ -92,20 +102,13 @@ export class AddHintDialogComponent extends IqserDialogComponent<AddHintDialogCo
|
||||
this.#isRss,
|
||||
);
|
||||
|
||||
this.form = this.#getForm();
|
||||
this.textWidth = calcTextWidthInPixels(this.form.controls.selectedText.value);
|
||||
|
||||
this.form
|
||||
.get('option')
|
||||
.valueChanges.pipe(
|
||||
tap((option: DetailsRadioOption<RedactOrHintOption>) => {
|
||||
this.dictionaryRequest = option.value === RedactOrHintOptions.IN_DOSSIER;
|
||||
this.#setDictionaries();
|
||||
this.#resetValues();
|
||||
}),
|
||||
takeUntilDestroyed(),
|
||||
)
|
||||
.subscribe();
|
||||
effect(() => {
|
||||
this.dictionaryRequest = this.optionValue().value === RedactOrHintOptions.IN_DOSSIER;
|
||||
this.#setDictionaries();
|
||||
this.#resetValues();
|
||||
});
|
||||
}
|
||||
|
||||
toggleEditingSelectedText() {
|
||||
@ -120,14 +123,6 @@ export class AddHintDialogComponent extends IqserDialogComponent<AddHintDialogCo
|
||||
this.form.patchValue({ selectedText: this.initialText });
|
||||
}
|
||||
|
||||
get displayedDictionaryLabel() {
|
||||
const dictType = this.form.get('dictionary').value;
|
||||
if (dictType) {
|
||||
return this.dictionaries.find(d => d.type === dictType)?.label ?? null;
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
get applyToAll() {
|
||||
return this.isSystemDefault || this._userPreferences.getAddHintDefaultExtraOption() === 'undefined'
|
||||
? this.data.applyToAllDossiers ?? true
|
||||
@ -150,10 +145,6 @@ export class AddHintDialogComponent extends IqserDialogComponent<AddHintDialogCo
|
||||
return defaultOption ?? this.options[0];
|
||||
}
|
||||
|
||||
get disabled() {
|
||||
return this.#isRss || !this.form.get('dictionary').value;
|
||||
}
|
||||
|
||||
async ngOnInit(): Promise<void> {
|
||||
this.#setDictionaries();
|
||||
this.#resetValues();
|
||||
|
||||
@ -28,7 +28,7 @@
|
||||
<input formControlName="section" name="section" type="text" />
|
||||
</div>
|
||||
|
||||
<div *ngIf="this.allRectangles" class="iqser-input-group w-400">
|
||||
<div *ngIf="allRectangles" class="iqser-input-group w-400">
|
||||
<label [translate]="'change-legal-basis-dialog.content.classification'"></label>
|
||||
<input formControlName="classification" name="classification" type="text" />
|
||||
</div>
|
||||
|
||||
@ -34,6 +34,7 @@ import { LegalBasisOption } from '../../utils/dialog-types';
|
||||
})
|
||||
export class ChangeLegalBasisDialogComponent extends BaseDialogComponent implements OnInit {
|
||||
legalOptions: LegalBasisOption[] = [];
|
||||
allRectangles = this._data.annotations.reduce((acc, a) => acc && a.AREA, true);
|
||||
|
||||
constructor(
|
||||
private readonly _justificationsService: JustificationsService,
|
||||
@ -44,10 +45,6 @@ export class ChangeLegalBasisDialogComponent extends BaseDialogComponent impleme
|
||||
this.form = this._getForm();
|
||||
}
|
||||
|
||||
get allRectangles(): boolean {
|
||||
return this._data.annotations.reduce((acc, a) => acc && a.AREA, true);
|
||||
}
|
||||
|
||||
async ngOnInit() {
|
||||
const data = await firstValueFrom(this._justificationsService.getForDossierTemplate(this._data.dossier.dossierTemplateId));
|
||||
|
||||
|
||||
@ -13,7 +13,7 @@
|
||||
|
||||
<mat-form-field>
|
||||
<mat-select [placeholder]="'add-annotation.dialog.content.type-placeholder' | translate" formControlName="dictionary">
|
||||
<mat-select-trigger>{{ displayedDictionaryLabel }}</mat-select-trigger>
|
||||
<mat-select-trigger>{{ displayedDictionaryLabel() }}</mat-select-trigger>
|
||||
<mat-option
|
||||
*ngFor="let dictionary of dictionaries"
|
||||
[matTooltip]="dictionary.description"
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import { Component, inject, OnInit } from '@angular/core';
|
||||
import { Component, computed, inject, OnInit } from '@angular/core';
|
||||
import { FormBuilder, ReactiveFormsModule } from '@angular/forms';
|
||||
import { CircleButtonComponent, HasScrollbarDirective, IconButtonComponent, IconButtonTypes, IqserDialogComponent } from '@iqser/common-ui';
|
||||
import { Dictionary, IAddRedactionRequest } from '@red/domain';
|
||||
@ -11,6 +11,7 @@ import { NgForOf } from '@angular/common';
|
||||
import { MatTooltip } from '@angular/material/tooltip';
|
||||
import { TranslateModule } from '@ngx-translate/core';
|
||||
import { MatDialogClose } from '@angular/material/dialog';
|
||||
import { formValueToSignal } from '@common-ui/utils';
|
||||
|
||||
@Component({
|
||||
templateUrl: './add-annotation-dialog.component.html',
|
||||
@ -38,6 +39,15 @@ export class AddAnnotationDialogComponent
|
||||
readonly iconButtonTypes = IconButtonTypes;
|
||||
dictionaries: Dictionary[] = [];
|
||||
readonly form = this.#getForm();
|
||||
readonly dictionaryType = formValueToSignal(this.form.controls.dictionary);
|
||||
|
||||
readonly displayedDictionaryLabel = computed(() => {
|
||||
const dictType = this.dictionaryType();
|
||||
if (dictType) {
|
||||
return this.dictionaries.find(d => d.type === dictType)?.label ?? null;
|
||||
}
|
||||
return null;
|
||||
});
|
||||
|
||||
constructor(
|
||||
private readonly _dictionaryService: DictionaryService,
|
||||
@ -46,14 +56,6 @@ export class AddAnnotationDialogComponent
|
||||
super();
|
||||
}
|
||||
|
||||
get displayedDictionaryLabel() {
|
||||
const dictType = this.form.controls.dictionary.value;
|
||||
if (dictType) {
|
||||
return this.dictionaries.find(d => d.type === dictType)?.label ?? null;
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
get disabled() {
|
||||
return !this.form.controls.dictionary.value;
|
||||
}
|
||||
|
||||
@ -12,7 +12,7 @@
|
||||
<label [translate]="'edit-redaction.dialog.content.type'"></label>
|
||||
<mat-form-field>
|
||||
<mat-select [placeholder]="'edit-redaction.dialog.content.unchanged' | translate" formControlName="type">
|
||||
<mat-select-trigger>{{ displayedDictionaryLabel }}</mat-select-trigger>
|
||||
<mat-select-trigger>{{ displayedDictionaryLabel() }}</mat-select-trigger>
|
||||
<mat-option
|
||||
*ngFor="let dictionary of dictionaries"
|
||||
[matTooltip]="dictionary.description"
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import { Component, OnInit } from '@angular/core';
|
||||
import { Component, computed, OnInit } from '@angular/core';
|
||||
import { FormBuilder, ReactiveFormsModule, UntypedFormGroup } from '@angular/forms';
|
||||
import {
|
||||
CircleButtonComponent,
|
||||
@ -20,6 +20,7 @@ import { MatOption, MatSelect, MatSelectTrigger } from '@angular/material/select
|
||||
import { MatTooltip } from '@angular/material/tooltip';
|
||||
import { TranslateModule } from '@ngx-translate/core';
|
||||
import { MatDialogClose } from '@angular/material/dialog';
|
||||
import { formValueToSignal } from '@common-ui/utils';
|
||||
|
||||
@Component({
|
||||
templateUrl: 'edit-annotation-dialog.component.html',
|
||||
@ -50,9 +51,19 @@ export class EditAnnotationDialogComponent
|
||||
readonly roles = Roles;
|
||||
readonly iconButtonTypes = IconButtonTypes;
|
||||
readonly redactedTexts: string[];
|
||||
readonly #dossier: Dossier = this._activeDossiersService.find(this.data.dossierId);
|
||||
dictionaries: Dictionary[] = [];
|
||||
form: UntypedFormGroup;
|
||||
readonly #dossier: Dossier;
|
||||
form: UntypedFormGroup = this.#getForm();
|
||||
showList = this.data.annotations.every(annotation => annotation.isSkipped || annotation.isRedacted);
|
||||
selectedDictionaryType = formValueToSignal(this.form.get('type'));
|
||||
|
||||
displayedDictionaryLabel = computed(() => {
|
||||
const selectedDictionaryType = this.selectedDictionaryType();
|
||||
if (selectedDictionaryType) {
|
||||
return this.dictionaries.find(d => d.type === selectedDictionaryType)?.label ?? null;
|
||||
}
|
||||
return null;
|
||||
});
|
||||
|
||||
constructor(
|
||||
private readonly _activeDossiersService: ActiveDossiersService,
|
||||
@ -60,25 +71,11 @@ export class EditAnnotationDialogComponent
|
||||
private readonly _formBuilder: FormBuilder,
|
||||
) {
|
||||
super();
|
||||
this.#dossier = this._activeDossiersService.find(this.data.dossierId);
|
||||
const annotations = this.data.annotations;
|
||||
this.redactedTexts = annotations.map(annotation => annotation.value);
|
||||
this.form = this.#getForm();
|
||||
this.initialFormValue = JSON.parse(JSON.stringify(this.form.getRawValue()));
|
||||
}
|
||||
|
||||
get displayedDictionaryLabel() {
|
||||
const selectedDictionaryType = this.form.get('type').value;
|
||||
if (selectedDictionaryType) {
|
||||
return this.dictionaries.find(d => d.type === selectedDictionaryType)?.label ?? null;
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
get showList() {
|
||||
return this.data.annotations.every(annotation => annotation.isSkipped || annotation.isRedacted);
|
||||
}
|
||||
|
||||
async ngOnInit(): Promise<void> {
|
||||
this.#setTypes();
|
||||
}
|
||||
|
||||
@ -20,7 +20,7 @@
|
||||
<ul *cdkVirtualFor="let text of redactedTexts; let idx = index">
|
||||
<li>
|
||||
{{
|
||||
(isFalsePositive
|
||||
(isFalsePositive()
|
||||
? 'remove-annotation.dialog.content.list-item-false-positive'
|
||||
: 'remove-annotation.dialog.content.list-item'
|
||||
)
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
import { CdkFixedSizeVirtualScroll, CdkVirtualForOf } from '@angular/cdk/scrolling';
|
||||
import { NgIf, NgStyle } from '@angular/common';
|
||||
import { Component } from '@angular/core';
|
||||
import { Component, computed } from '@angular/core';
|
||||
import { FormBuilder, ReactiveFormsModule, UntypedFormGroup } from '@angular/forms';
|
||||
import { MatDialogClose } from '@angular/material/dialog';
|
||||
import { DetailsRadioOption } from '@common-ui/inputs/details-radio/details-radio-option';
|
||||
@ -17,6 +17,7 @@ import {
|
||||
import { TranslateModule } from '@ngx-translate/core';
|
||||
import { getRemoveRedactionOptions } from '../../../utils/dialog-options';
|
||||
import { RemoveAnnotationData, RemoveAnnotationOption, RemoveAnnotationOptions, RemoveAnnotationResult } from '../../../utils/dialog-types';
|
||||
import { formValueToSignal } from '@common-ui/utils';
|
||||
|
||||
@Component({
|
||||
templateUrl: 'remove-annotation-dialog.component.html',
|
||||
@ -46,6 +47,8 @@ export class RemoveAnnotationDialogComponent extends IqserDialogComponent<
|
||||
readonly iconButtonTypes = IconButtonTypes;
|
||||
readonly options: DetailsRadioOption<RemoveAnnotationOption>[];
|
||||
readonly redactedTexts: string[];
|
||||
readonly option = formValueToSignal<DetailsRadioOption<RemoveAnnotationOption>>(this.form.get('option'));
|
||||
readonly isFalsePositive = computed(() => this.option().value === RemoveAnnotationOptions.FALSE_POSITIVE);
|
||||
|
||||
form!: UntypedFormGroup;
|
||||
|
||||
@ -56,10 +59,6 @@ export class RemoveAnnotationDialogComponent extends IqserDialogComponent<
|
||||
this.form = this.#getForm();
|
||||
}
|
||||
|
||||
get isFalsePositive(): boolean {
|
||||
return this.form.get('option').value.value === RemoveAnnotationOptions.FALSE_POSITIVE;
|
||||
}
|
||||
|
||||
get #applyToAllDossiers(): boolean {
|
||||
const selectedOption = this.form.get('option').value.value;
|
||||
return selectedOption === RemoveAnnotationOptions.IN_DOSSIER || selectedOption === RemoveAnnotationOptions.FALSE_POSITIVE;
|
||||
|
||||
@ -18,6 +18,7 @@ interface RevertValueResult {}
|
||||
})
|
||||
export class RevertValueDialogComponent extends IqserDialogComponent<RevertValueDialogComponent, RevertValueData, RevertValueResult> {
|
||||
protected readonly entry = this.data.entry;
|
||||
readonly valueDescription = this.#valueDescription;
|
||||
|
||||
constructor(private readonly _translateService: TranslateService) {
|
||||
super();
|
||||
@ -26,7 +27,7 @@ export class RevertValueDialogComponent extends IqserDialogComponent<RevertValue
|
||||
this.close(ConfirmOptions.CONFIRM);
|
||||
}
|
||||
|
||||
get valueDescription(): string {
|
||||
get #valueDescription(): string {
|
||||
const componentRuleString = this._translateService.instant('revert-value-dialog.component-rule');
|
||||
const valueDescription = this.entry.componentValues[0]?.valueDescription || '';
|
||||
return `<strong>${componentRuleString}</strong> ${valueDescription}`;
|
||||
|
||||
@ -30,7 +30,7 @@
|
||||
[placeholder]="isBulkEdit ? ('edit-redaction.dialog.content.unchanged' | translate) : ''"
|
||||
formControlName="type"
|
||||
>
|
||||
<mat-select-trigger>{{ displayedDictionaryLabel }}</mat-select-trigger>
|
||||
<mat-select-trigger>{{ displayedDictionaryLabel() }}</mat-select-trigger>
|
||||
<mat-option
|
||||
(click)="typeChanged()"
|
||||
*ngFor="let dictionary of typeSelectOptions"
|
||||
@ -44,8 +44,8 @@
|
||||
</mat-form-field>
|
||||
</div>
|
||||
|
||||
<ng-container *ngIf="showExtras && !hiddenReason">
|
||||
<div [class.required]="!form.controls.reason.disabled" class="iqser-input-group w-450">
|
||||
<ng-container *ngIf="showExtras && !hiddenReason()">
|
||||
<div [class.required]="!reasonDisabled()" class="iqser-input-group w-450">
|
||||
<label [translate]="'edit-redaction.dialog.content.reason'"></label>
|
||||
<mat-form-field>
|
||||
<mat-select
|
||||
@ -81,7 +81,7 @@
|
||||
<label [translate]="'edit-redaction.dialog.content.section'"></label>
|
||||
<input
|
||||
[placeholder]="
|
||||
isBulkEdit && !hideParagraphPlaceholder ? ('edit-redaction.dialog.content.unchanged' | translate) : ''
|
||||
isBulkEdit && !hideParagraphPlaceholder() ? ('edit-redaction.dialog.content.unchanged' | translate) : ''
|
||||
"
|
||||
formControlName="section"
|
||||
name="section"
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
import { NgForOf, NgIf } from '@angular/common';
|
||||
import { Component, inject, OnInit } from '@angular/core';
|
||||
import { Component, computed, inject, OnInit } from '@angular/core';
|
||||
import { FormControl, FormGroup, ReactiveFormsModule } from '@angular/forms';
|
||||
import { MatDialogClose } from '@angular/material/dialog';
|
||||
import { MatFormField } from '@angular/material/form-field';
|
||||
@ -38,6 +38,7 @@ import {
|
||||
import { DetailsRadioComponent } from '@common-ui/inputs/details-radio/details-radio.component';
|
||||
import { DetailsRadioOption } from '@common-ui/inputs/details-radio/details-radio-option';
|
||||
import { validatePageRange } from '../../utils/form-validators';
|
||||
import { formStatusToSignal, formValueToSignal, isJustOne } from '@common-ui/utils';
|
||||
import { parseRectanglePosition, parseSelectedPageNumbers, prefillPageRange } from '../../utils/enhance-manual-redaction-request.utils';
|
||||
|
||||
interface TypeSelectOptions {
|
||||
@ -95,10 +96,33 @@ export class EditRedactionDialogComponent
|
||||
typeSelectOptions: TypeSelectOptions[] = [];
|
||||
readonly form = this.#getForm();
|
||||
hasTypeChanged = false;
|
||||
initialReasonDisabled = this.someSkipped;
|
||||
initialReasonDisabled = this.#someSkipped;
|
||||
protected readonly roles = Roles;
|
||||
readonly #dossier = inject(ActiveDossiersService).find(this.data.dossierId);
|
||||
|
||||
readonly formStatus = formStatusToSignal(this.form);
|
||||
readonly formInvalid = computed(() => this.formStatus() === 'INVALID');
|
||||
readonly dictionaryType = formValueToSignal(this.form.controls.type);
|
||||
readonly reasonStatus = formStatusToSignal(this.form.controls.reason);
|
||||
readonly reasonValue = formValueToSignal(this.form.controls.reason);
|
||||
readonly sectionValue = formValueToSignal(this.form.controls.section);
|
||||
readonly displayedDictionaryLabel = computed(() => {
|
||||
const selectedDictionaryType = this.dictionaryType();
|
||||
if (selectedDictionaryType) {
|
||||
return this.typeSelectOptions.find(option => option.type === selectedDictionaryType)?.label ?? null;
|
||||
}
|
||||
return null;
|
||||
});
|
||||
readonly reasonDisabled = computed(() => this.reasonStatus() === 'DISABLED');
|
||||
readonly hiddenReason = computed(() => this.isImage && this.reasonDisabled());
|
||||
readonly hideParagraphPlaceholder = computed(
|
||||
() => this.sectionValue() !== this.initialFormValue['section'] || this.#isFieldEmpty('section'),
|
||||
);
|
||||
readonly hideReasonPlaceholder = this.#hideReasonPlaceholder;
|
||||
|
||||
readonly isBulkEdit = !isJustOne(this.annotations);
|
||||
readonly showExtras = (this.isImage && this.isRedacted) || !(this.isImage || this.isHint);
|
||||
|
||||
constructor(
|
||||
private readonly _justificationsService: JustificationsService,
|
||||
private readonly _dictionaryService: DictionaryService,
|
||||
@ -114,54 +138,27 @@ export class EditRedactionDialogComponent
|
||||
}
|
||||
}
|
||||
|
||||
get displayedDictionaryLabel() {
|
||||
const selectedDictionaryType = this.form.controls.type.value;
|
||||
if (selectedDictionaryType) {
|
||||
return this.typeSelectOptions.find(option => option.type === selectedDictionaryType)?.label ?? null;
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
get showExtras() {
|
||||
return (this.isImage && this.isRedacted) || !(this.isImage || this.isHint);
|
||||
}
|
||||
|
||||
get disabled() {
|
||||
return (
|
||||
this.form.invalid ||
|
||||
(!this.isImage && this.showExtras && !this.form.controls.reason.disabled ? !this.form.controls.reason.value : false)
|
||||
);
|
||||
return this.formInvalid() || (!this.isImage && this.showExtras && !this.reasonDisabled() ? !this.reasonValue() : false);
|
||||
}
|
||||
|
||||
get someSkipped() {
|
||||
get #someSkipped() {
|
||||
return this.annotations.some(annotation => annotation.isSkipped);
|
||||
}
|
||||
|
||||
get redactBasedTypes() {
|
||||
get #redactBasedTypes() {
|
||||
return this._dictionaryService.getRedactionTypes(this.#dossier.dossierTemplateId).map(dictionary => dictionary.type);
|
||||
}
|
||||
|
||||
get isRedactBasedType() {
|
||||
return this.redactBasedTypes.includes(this.form.controls.type.value);
|
||||
get #isRedactBasedType() {
|
||||
return this.#redactBasedTypes.includes(this.form.controls.type.value);
|
||||
}
|
||||
|
||||
get hideReasonPlaceholder() {
|
||||
return (this.hasTypeChanged && this.isRedactBasedType) || this.#isFieldEmpty('legalBasisValue');
|
||||
get #hideReasonPlaceholder() {
|
||||
return (this.hasTypeChanged && this.#isRedactBasedType) || this.#isFieldEmpty('legalBasisValue');
|
||||
}
|
||||
|
||||
get hideParagraphPlaceholder() {
|
||||
return this.form.controls.section.value !== this.initialFormValue['section'] || this.#isFieldEmpty('section');
|
||||
}
|
||||
|
||||
get hiddenReason() {
|
||||
return this.isImage && this.form.controls.reason.disabled;
|
||||
}
|
||||
|
||||
get isBulkEdit() {
|
||||
return this.annotations.length > 1;
|
||||
}
|
||||
|
||||
get sameType() {
|
||||
get #sameType() {
|
||||
return this.annotations.every(annotation => annotation.type === this.annotations[0].type);
|
||||
}
|
||||
|
||||
@ -196,7 +193,7 @@ export class EditRedactionDialogComponent
|
||||
const selectedDictionaryType = this.form.controls.type.value;
|
||||
|
||||
const initialReason = this.form.get('type').value === this.initialFormValue.type && !this.initialReasonDisabled;
|
||||
if (this.redactBasedTypes.includes(selectedDictionaryType) || initialReason) {
|
||||
if (this.#redactBasedTypes.includes(selectedDictionaryType) || initialReason) {
|
||||
this.form.controls.reason.enable();
|
||||
this.hasTypeChanged = true;
|
||||
if (initialReason) {
|
||||
@ -239,7 +236,7 @@ export class EditRedactionDialogComponent
|
||||
this.isImage,
|
||||
this.isHint,
|
||||
this.annotations.every(annotation => annotation.isOCR),
|
||||
this.sameType ? this.annotations[0].type : null,
|
||||
this.#sameType ? this.annotations[0].type : null,
|
||||
);
|
||||
|
||||
this.typeSelectOptions = this.dictionaries.map(dictionary => ({
|
||||
@ -257,10 +254,10 @@ export class EditRedactionDialogComponent
|
||||
#getForm() {
|
||||
const sameSection = this.annotations.every(annotation => annotation.section === this.annotations[0].section);
|
||||
return new FormGroup({
|
||||
reason: new FormControl<LegalBasisOption>({ value: null, disabled: this.someSkipped }),
|
||||
reason: new FormControl<LegalBasisOption>({ value: null, disabled: this.#someSkipped }),
|
||||
comment: new FormControl<string>(null),
|
||||
type: new FormControl<string>({
|
||||
value: this.sameType ? this.annotations[0].type : null,
|
||||
value: this.#sameType ? this.annotations[0].type : null,
|
||||
disabled: this.isImported,
|
||||
}),
|
||||
section: new FormControl<string>({ value: sameSection ? this.annotations[0].section : null, disabled: this.isImported }),
|
||||
|
||||
@ -33,7 +33,7 @@
|
||||
|
||||
<div class="iqser-input-group w-400">
|
||||
<label [translate]="'manual-annotation.dialog.content.legalBasis'"></label>
|
||||
<input [value]="form.get('reason').value?.legalBasis" disabled type="text" />
|
||||
<input [value]="reasonValue().legalBasis" disabled type="text" />
|
||||
</div>
|
||||
}
|
||||
|
||||
|
||||
@ -10,9 +10,8 @@ import {
|
||||
IqserDialogComponent,
|
||||
} from '@iqser/common-ui';
|
||||
import { JustificationsService } from '@services/entity-services/justifications.service';
|
||||
import { Dossier, ILegalBasisChangeRequest } from '@red/domain';
|
||||
import { ILegalBasisChangeRequest } from '@red/domain';
|
||||
import { firstValueFrom } from 'rxjs';
|
||||
import { AnnotationWrapper } from '@models/file/annotation.wrapper';
|
||||
import { Roles } from '@users/roles';
|
||||
import { marker as _ } from '@biesbjerg/ngx-translate-extract-marker';
|
||||
import {
|
||||
@ -29,6 +28,7 @@ import { MatFormField } from '@angular/material/form-field';
|
||||
import { MatTooltip } from '@angular/material/tooltip';
|
||||
import { TranslateModule } from '@ngx-translate/core';
|
||||
import { DetailsRadioComponent } from '@common-ui/inputs/details-radio/details-radio.component';
|
||||
import { formValueToSignal } from '@common-ui/utils';
|
||||
|
||||
const DOCUMINE_LEGAL_BASIS = 'n-a.';
|
||||
|
||||
@ -70,6 +70,13 @@ export class ForceAnnotationDialogComponent
|
||||
]);
|
||||
|
||||
legalOptions: LegalBasisOption[] = [];
|
||||
readonly isImageHint = this.data.annotations.every(annotation => annotation.IMAGE_HINT);
|
||||
readonly isHintDialog = this.data.hint;
|
||||
readonly isImageDialog = this.data.image;
|
||||
readonly dialogTitle = this.#dialogTitle;
|
||||
|
||||
readonly reasonValue = formValueToSignal<ILegalBasisChangeRequest>(this.form.get('reason'));
|
||||
|
||||
protected readonly roles = Roles;
|
||||
|
||||
constructor(
|
||||
@ -81,23 +88,11 @@ export class ForceAnnotationDialogComponent
|
||||
this.form = this.#getForm();
|
||||
}
|
||||
|
||||
get isImageHint() {
|
||||
return this.data.annotations.every(annotation => annotation.IMAGE_HINT);
|
||||
}
|
||||
|
||||
get isHintDialog() {
|
||||
return this.data.hint;
|
||||
}
|
||||
|
||||
get isImageDialog() {
|
||||
return this.data.image;
|
||||
}
|
||||
|
||||
get disabled(): boolean {
|
||||
return !this.valid;
|
||||
}
|
||||
|
||||
get dialogTitle(): string {
|
||||
get #dialogTitle(): string {
|
||||
return this.isImageHint
|
||||
? _('manual-annotation.dialog.header.force-redaction-image-hint')
|
||||
: this.isHintDialog
|
||||
|
||||
@ -9,12 +9,7 @@
|
||||
<div class="iqser-input-group required w-150">
|
||||
<label translate="highlight-action-dialog.form.color.label"></label>
|
||||
<input class="hex-color-input" formControlName="color" name="color" type="text" />
|
||||
<div
|
||||
[colorPicker]="form.get('color').value"
|
||||
[cpDisabled]="true"
|
||||
[style.background]="form.get('color').value"
|
||||
class="input-icon"
|
||||
></div>
|
||||
<div [colorPicker]="colorValue()" [cpDisabled]="true" [style.background]="colorValue()" class="input-icon"></div>
|
||||
</div>
|
||||
|
||||
<iqser-details-radio [displayInRow]="true" [options]="options" class="mt-25" formControlName="option"></iqser-details-radio>
|
||||
|
||||
@ -14,6 +14,7 @@ import { highlightsTranslations } from '@translations/highlights-translations';
|
||||
import { Roles } from '@users/roles';
|
||||
import { ColorPickerModule } from 'ngx-color-picker';
|
||||
import { firstValueFrom } from 'rxjs';
|
||||
import { formValueToSignal } from '@common-ui/utils';
|
||||
|
||||
export interface HighlightActionData {
|
||||
readonly operation: EarmarkOperation;
|
||||
@ -59,6 +60,8 @@ export class HighlightActionDialogComponent extends BaseDialogComponent {
|
||||
},
|
||||
];
|
||||
|
||||
readonly colorValue = formValueToSignal(this.form.get('color'));
|
||||
|
||||
constructor(
|
||||
protected readonly _dialogRef: MatDialogRef<HighlightActionDialogComponent>,
|
||||
private readonly _textHighlightService: EarmarksService,
|
||||
|
||||
@ -28,7 +28,7 @@
|
||||
|
||||
<div *deny="roles.getRss" class="iqser-input-group w-450">
|
||||
<label [translate]="'manual-annotation.dialog.content.legalBasis'"></label>
|
||||
<input [value]="form.get('reason').value?.legalBasis" disabled type="text" />
|
||||
<input [value]="reasonValue().legalBasis" disabled type="text" />
|
||||
</div>
|
||||
|
||||
<div class="iqser-input-group w-450">
|
||||
|
||||
@ -9,7 +9,7 @@ import {
|
||||
IqserDialogComponent,
|
||||
Toaster,
|
||||
} from '@iqser/common-ui';
|
||||
import { Dossier, IAddRedactionRequest, SuperTypes } from '@red/domain';
|
||||
import { Dossier, IAddRedactionRequest, ILegalBasisChangeRequest, SuperTypes } from '@red/domain';
|
||||
import { ActiveDossiersService } from '@services/dossiers/active-dossiers.service';
|
||||
import { JustificationsService } from '@services/entity-services/justifications.service';
|
||||
import { Roles } from '@users/roles';
|
||||
@ -33,6 +33,7 @@ import { getRectangleRedactOptions } from '../../utils/dialog-options';
|
||||
import { DetailsRadioComponent } from '@common-ui/inputs/details-radio/details-radio.component';
|
||||
import { SystemDefaults } from '../../../account/utils/dialog-defaults';
|
||||
import { validatePageRange } from '../../utils/form-validators';
|
||||
import { formValueToSignal } from '@common-ui/utils';
|
||||
|
||||
export const NON_READABLE_CONTENT = 'non-readable content';
|
||||
|
||||
@ -68,7 +69,8 @@ export class RectangleAnnotationDialog
|
||||
protected readonly options: DetailsRadioOption<RectangleRedactOption>[];
|
||||
protected legalOptions: LegalBasisOption[] = [];
|
||||
|
||||
readonly form: UntypedFormGroup;
|
||||
readonly form: UntypedFormGroup = this.#getForm();
|
||||
readonly reasonValue = formValueToSignal<ILegalBasisChangeRequest>(this.form.get('reason'));
|
||||
|
||||
constructor(
|
||||
private readonly activeDossiersService: ActiveDossiersService,
|
||||
@ -81,7 +83,6 @@ export class RectangleAnnotationDialog
|
||||
|
||||
this.options = getRectangleRedactOptions();
|
||||
|
||||
this.form = this.#getForm();
|
||||
this.initialFormValue = this.form.getRawValue();
|
||||
}
|
||||
|
||||
|
||||
@ -22,7 +22,7 @@
|
||||
|
||||
<mat-form-field>
|
||||
<mat-select [placeholder]="'redact-text.dialog.content.unchanged' | translate" formControlName="dictionary">
|
||||
<mat-select-trigger>{{ displayedDictionaryLabel }}</mat-select-trigger>
|
||||
<mat-select-trigger>{{ displayedDictionaryLabel() }}</mat-select-trigger>
|
||||
<mat-option
|
||||
(click)="typeChanged()"
|
||||
*ngFor="let dictionary of dictionaries"
|
||||
|
||||
@ -1,6 +1,5 @@
|
||||
import { NgForOf, NgIf } from '@angular/common';
|
||||
import { Component, inject, OnInit } from '@angular/core';
|
||||
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
|
||||
import { Component, computed, effect, inject, OnInit } from '@angular/core';
|
||||
import { FormBuilder, ReactiveFormsModule } from '@angular/forms';
|
||||
import { MatDialogClose } from '@angular/material/dialog';
|
||||
import { MatFormField } from '@angular/material/form-field';
|
||||
@ -16,7 +15,6 @@ import { ActiveDossiersService } from '@services/dossiers/active-dossiers.servic
|
||||
import { DictionaryService } from '@services/entity-services/dictionary.service';
|
||||
import { JustificationsService } from '@services/entity-services/justifications.service';
|
||||
import { firstValueFrom } from 'rxjs';
|
||||
import { tap } from 'rxjs/operators';
|
||||
import {
|
||||
SelectedAnnotationsTableComponent,
|
||||
ValueColumn,
|
||||
@ -30,6 +28,7 @@ import {
|
||||
RedactRecommendationResult,
|
||||
ResizeOptions,
|
||||
} from '../../utils/dialog-types';
|
||||
import { formValueToSignal } from '@common-ui/utils';
|
||||
|
||||
@Component({
|
||||
templateUrl: './redact-recommendation-dialog.component.html',
|
||||
@ -81,6 +80,17 @@ export class RedactRecommendationDialogComponent
|
||||
{ label: redaction.typeLabel },
|
||||
]);
|
||||
|
||||
readonly dictionaryType = formValueToSignal(this.form.controls.dictionary);
|
||||
readonly optionValue = formValueToSignal<DetailsRadioOption<RedactOrHintOption>>(this.form.controls.option);
|
||||
|
||||
readonly displayedDictionaryLabel = computed(() => {
|
||||
const dictType = this.dictionaryType();
|
||||
if (dictType) {
|
||||
return this.dictionaries.find(d => d.type === dictType)?.label ?? null;
|
||||
}
|
||||
return null;
|
||||
});
|
||||
|
||||
constructor(
|
||||
private readonly _justificationsService: JustificationsService,
|
||||
private readonly _dictionaryService: DictionaryService,
|
||||
@ -88,32 +98,19 @@ export class RedactRecommendationDialogComponent
|
||||
super();
|
||||
this.options = getRedactOrHintOptions(this.#dossier, this.#applyToAllDossiers, this.data.isApprover, false, true);
|
||||
|
||||
this.form.controls.option.valueChanges
|
||||
.pipe(
|
||||
tap((option: DetailsRadioOption<RedactOrHintOption>) => {
|
||||
this.dictionaryRequest = option.value === RedactOrHintOptions.IN_DOSSIER;
|
||||
this.#setDictionaries();
|
||||
this.#resetValues();
|
||||
}),
|
||||
takeUntilDestroyed(),
|
||||
)
|
||||
.subscribe();
|
||||
effect(() => {
|
||||
this.dictionaryRequest = this.optionValue().value === RedactOrHintOptions.IN_DOSSIER;
|
||||
this.#setDictionaries();
|
||||
this.#resetValues();
|
||||
});
|
||||
|
||||
this.form.controls.option.setValue(this.options[0]);
|
||||
}
|
||||
|
||||
get isBulkLocal(): boolean {
|
||||
get #isBulkLocal(): boolean {
|
||||
return this.form.controls.option.value.value === ResizeOptions.IN_DOCUMENT;
|
||||
}
|
||||
|
||||
get displayedDictionaryLabel() {
|
||||
const dictType = this.form.controls.dictionary.value;
|
||||
if (dictType) {
|
||||
return this.dictionaries.find(d => d.type === dictType)?.label ?? null;
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
get disabled() {
|
||||
return !this.form.controls.dictionary.value;
|
||||
}
|
||||
@ -157,7 +154,7 @@ export class RedactRecommendationDialogComponent
|
||||
this.close({
|
||||
redaction,
|
||||
isMulti: this.isMulti,
|
||||
bulkLocal: this.isBulkLocal,
|
||||
bulkLocal: this.#isBulkLocal,
|
||||
});
|
||||
}
|
||||
|
||||
@ -189,7 +186,7 @@ export class RedactRecommendationDialogComponent
|
||||
}
|
||||
|
||||
const commentValue = this.form.controls.comment.value;
|
||||
addRedactionRequest.comment = commentValue ? (this.isBulkLocal ? commentValue : { text: commentValue }) : null;
|
||||
addRedactionRequest.comment = commentValue ? (this.#isBulkLocal ? commentValue : { text: commentValue }) : null;
|
||||
addRedactionRequest.addToAllDossiers = this.data.isApprover && this.dictionaryRequest && this.#applyToAllDossiers;
|
||||
return addRedactionRequest;
|
||||
}
|
||||
|
||||
@ -91,7 +91,7 @@
|
||||
|
||||
<mat-form-field>
|
||||
<mat-select [placeholder]="'redact-text.dialog.content.type-placeholder' | translate" formControlName="dictionary">
|
||||
<mat-select-trigger>{{ displayedDictionaryLabel$ | async }}</mat-select-trigger>
|
||||
<mat-select-trigger>{{ displayedDictionaryLabel() }}</mat-select-trigger>
|
||||
<mat-option
|
||||
(click)="typeChanged()"
|
||||
*ngFor="let dictionary of dictionaries"
|
||||
@ -120,7 +120,7 @@
|
||||
|
||||
<div class="dialog-actions">
|
||||
<iqser-icon-button
|
||||
[disabled]="!form.valid"
|
||||
[disabled]="!isFormValid()"
|
||||
[label]="'redact-text.dialog.actions.save' | translate"
|
||||
[submit]="true"
|
||||
[type]="iconButtonTypes.primary"
|
||||
|
||||
@ -1,6 +1,5 @@
|
||||
import { AsyncPipe, NgClass, NgForOf, NgIf, NgStyle } from '@angular/common';
|
||||
import { Component, inject, OnInit } from '@angular/core';
|
||||
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
|
||||
import { Component, computed, effect, inject, OnInit } from '@angular/core';
|
||||
import { FormBuilder, FormGroup, ReactiveFormsModule, Validators } from '@angular/forms';
|
||||
import { MatDialogClose } from '@angular/material/dialog';
|
||||
import { MatFormField } from '@angular/material/form-field';
|
||||
@ -17,8 +16,7 @@ import { JustificationsService } from '@services/entity-services/justifications.
|
||||
import { Roles } from '@users/roles';
|
||||
import { UserPreferenceService } from '@users/user-preference.service';
|
||||
import { calcTextWidthInPixels, stringToBoolean } from '@utils/functions';
|
||||
import { firstValueFrom, Observable } from 'rxjs';
|
||||
import { map, tap } from 'rxjs/operators';
|
||||
import { firstValueFrom } from 'rxjs';
|
||||
import { SystemDefaultOption, SystemDefaults } from '../../../account/utils/dialog-defaults';
|
||||
import { getRedactOrHintOptions } from '../../utils/dialog-options';
|
||||
import {
|
||||
@ -30,6 +28,7 @@ import {
|
||||
ResizeOptions,
|
||||
} from '../../utils/dialog-types';
|
||||
import { enhanceManualRedactionRequest, EnhanceRequestData } from '../../utils/enhance-manual-redaction-request.utils';
|
||||
import { formStatusToSignal, formValueToSignal } from '@common-ui/utils';
|
||||
|
||||
const MAXIMUM_TEXT_AREA_WIDTH = 421;
|
||||
|
||||
@ -63,19 +62,33 @@ export class RedactTextDialogComponent
|
||||
{
|
||||
readonly #dossier = inject(ActiveDossiersService).find(this.data.dossierId);
|
||||
readonly #manualRedactionTypeExists = inject(DictionaryService).hasManualType(this.#dossier.dossierTemplateId);
|
||||
#applyToAllDossiers = this.applyToAll;
|
||||
#applyToAllDossiers = this.#applyToAll;
|
||||
readonly roles = Roles;
|
||||
readonly iconButtonTypes = IconButtonTypes;
|
||||
readonly initialText = this.data?.manualRedactionEntryWrapper?.manualRedactionEntry?.value;
|
||||
readonly form: FormGroup;
|
||||
readonly options: DetailsRadioOption<RedactOrHintOption>[] = getRedactOrHintOptions(
|
||||
this.#dossier,
|
||||
this.#applyToAllDossiers,
|
||||
this.data.isApprover,
|
||||
this.data.isPageExcluded,
|
||||
);
|
||||
readonly form: FormGroup = this.#getForm();
|
||||
readonly formStatus = formStatusToSignal(this.form);
|
||||
readonly isFormValid = computed(() => this.formStatus() === 'VALID');
|
||||
|
||||
readonly dictionaryType = formValueToSignal(this.form.controls.dictionary);
|
||||
readonly displayedDictionaryLabel = computed(() => {
|
||||
return this.dictionaries.find(d => d.type === this.dictionaryType())?.label ?? null;
|
||||
});
|
||||
|
||||
readonly optionValue = formValueToSignal<DetailsRadioOption<RedactOrHintOption>>(this.form.controls.option);
|
||||
|
||||
dictionaryRequest = false;
|
||||
legalOptions: LegalBasisOption[] = [];
|
||||
dictionaries: Dictionary[] = [];
|
||||
isEditingSelectedText = false;
|
||||
modifiedText = this.initialText;
|
||||
selectedTextRows = 1;
|
||||
readonly options: DetailsRadioOption<RedactOrHintOption>[];
|
||||
readonly displayedDictionaryLabel$: Observable<string>;
|
||||
readonly maximumTextAreaWidth = MAXIMUM_TEXT_AREA_WIDTH;
|
||||
readonly maximumSelectedTextWidth = 567;
|
||||
|
||||
@ -88,44 +101,34 @@ export class RedactTextDialogComponent
|
||||
private readonly _userPreferences: UserPreferenceService,
|
||||
) {
|
||||
super();
|
||||
this.options = getRedactOrHintOptions(this.#dossier, this.#applyToAllDossiers, this.data.isApprover, this.data.isPageExcluded);
|
||||
this.form = this.#getForm();
|
||||
this.#setupValidators(this.dictionaryRequest ? RedactOrHintOptions.IN_DOSSIER : RedactOrHintOptions.ONLY_HERE);
|
||||
this.textWidth = calcTextWidthInPixels(this.form.controls.selectedText.value);
|
||||
this.form.controls.option.valueChanges
|
||||
.pipe(
|
||||
tap((option: DetailsRadioOption<RedactOrHintOption>) => {
|
||||
this.dictionaryRequest = option.value === RedactOrHintOptions.IN_DOSSIER;
|
||||
if (this.dictionaryRequest) {
|
||||
this.#setDictionaries();
|
||||
this.form.patchValue({ selectedText: this.modifiedText });
|
||||
} else {
|
||||
this.isEditingSelectedText = false;
|
||||
this.modifiedText = this.form.controls.selectedText.value;
|
||||
this.form.patchValue({ selectedText: this.initialText }, { emitEvent: true });
|
||||
}
|
||||
this.#setupValidators(option.value);
|
||||
this.#resetValues();
|
||||
}),
|
||||
takeUntilDestroyed(),
|
||||
)
|
||||
.subscribe();
|
||||
|
||||
this.displayedDictionaryLabel$ = this.form.controls.dictionary.valueChanges.pipe(
|
||||
map(dictionary => this.dictionaries.find(d => d.type === dictionary)?.label ?? null),
|
||||
);
|
||||
effect(() => {
|
||||
this.dictionaryRequest = this.optionValue().value === RedactOrHintOptions.IN_DOSSIER;
|
||||
if (this.dictionaryRequest) {
|
||||
this.#setDictionaries();
|
||||
this.form.patchValue({ selectedText: this.modifiedText });
|
||||
} else {
|
||||
this.isEditingSelectedText = false;
|
||||
this.modifiedText = this.form.controls.selectedText.value;
|
||||
this.form.patchValue({ selectedText: this.initialText }, { emitEvent: true });
|
||||
}
|
||||
this.#setupValidators(this.optionValue().value);
|
||||
this.#resetValues();
|
||||
});
|
||||
}
|
||||
|
||||
get isBulkLocal() {
|
||||
get #isBulkLocal() {
|
||||
return this.form.controls.option.value.value === ResizeOptions.IN_DOCUMENT;
|
||||
}
|
||||
|
||||
get isSystemDefault(): boolean {
|
||||
get #isSystemDefault(): boolean {
|
||||
return this._userPreferences.getAddRedactionDefaultOption() === SystemDefaultOption.SYSTEM_DEFAULT;
|
||||
}
|
||||
|
||||
get defaultOption() {
|
||||
const defaultOption = this.isSystemDefault
|
||||
get #defaultOption() {
|
||||
const defaultOption = this.#isSystemDefault
|
||||
? this.#getOption(SystemDefaults.ADD_REDACTION_DEFAULT)
|
||||
: this.#getOption(this._userPreferences.getAddRedactionDefaultOption() as RedactOrHintOption);
|
||||
this.dictionaryRequest = defaultOption.value === RedactOrHintOptions.IN_DOSSIER;
|
||||
@ -136,9 +139,9 @@ export class RedactTextDialogComponent
|
||||
return defaultOption ?? this.options[0];
|
||||
}
|
||||
|
||||
get applyToAll() {
|
||||
return this.isSystemDefault || this._userPreferences.getAddRedactionDefaultExtraOption() === 'undefined'
|
||||
? this.data.applyToAllDossiers ?? true
|
||||
get #applyToAll() {
|
||||
return this.#isSystemDefault || this._userPreferences.getAddRedactionDefaultExtraOption() === 'undefined'
|
||||
? (this.data.applyToAllDossiers ?? true)
|
||||
: stringToBoolean(this._userPreferences.getAddRedactionDefaultExtraOption());
|
||||
}
|
||||
|
||||
@ -186,7 +189,7 @@ export class RedactTextDialogComponent
|
||||
this.close({
|
||||
redaction,
|
||||
dictionary: this.dictionaries.find(d => d.type === this.form.controls.dictionary.value),
|
||||
bulkLocal: this.isBulkLocal,
|
||||
bulkLocal: this.#isBulkLocal,
|
||||
});
|
||||
}
|
||||
|
||||
@ -232,7 +235,7 @@ export class RedactTextDialogComponent
|
||||
reason: [null as LegalBasisOption],
|
||||
comment: [null],
|
||||
dictionary: [this.#manualRedactionTypeExists ? SuperTypes.ManualRedaction : null],
|
||||
option: this.defaultOption,
|
||||
option: this.#defaultOption,
|
||||
});
|
||||
}
|
||||
|
||||
@ -243,7 +246,7 @@ export class RedactTextDialogComponent
|
||||
}
|
||||
|
||||
#resetValues() {
|
||||
this.#applyToAllDossiers = this.applyToAll;
|
||||
this.#applyToAllDossiers = this.#applyToAll;
|
||||
this.options[2].additionalCheck.checked = this.#applyToAllDossiers;
|
||||
if (this.dictionaryRequest) {
|
||||
this.form.controls.reason.setValue(null);
|
||||
@ -267,7 +270,7 @@ export class RedactTextDialogComponent
|
||||
comment: this.form.controls.comment.value,
|
||||
isApprover: this.data.isApprover,
|
||||
applyToAllDossiers: this.#applyToAllDossiers,
|
||||
bulkLocal: this.isBulkLocal,
|
||||
bulkLocal: this.#isBulkLocal,
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,6 +1,5 @@
|
||||
import { NgStyle } from '@angular/common';
|
||||
import { Component, computed } from '@angular/core';
|
||||
import { toSignal } from '@angular/core/rxjs-interop';
|
||||
import { FormBuilder, ReactiveFormsModule, UntypedFormGroup } from '@angular/forms';
|
||||
import { MatDialogClose } from '@angular/material/dialog';
|
||||
import { DetailsRadioOption } from '@common-ui/inputs/details-radio/details-radio-option';
|
||||
@ -18,7 +17,6 @@ import { TranslateModule } from '@ngx-translate/core';
|
||||
import { Roles } from '@users/roles';
|
||||
import { UserPreferenceService } from '@users/user-preference.service';
|
||||
import { stringToBoolean } from '@utils/functions';
|
||||
import { map } from 'rxjs/operators';
|
||||
import { SystemDefaultOption, SystemDefaults } from '../../../account/utils/dialog-defaults';
|
||||
import {
|
||||
SelectedAnnotationsTableComponent,
|
||||
@ -37,6 +35,8 @@ import {
|
||||
import { isJustOne } from '@common-ui/utils';
|
||||
import { validatePageRange } from '../../utils/form-validators';
|
||||
import { parseRectanglePosition, parseSelectedPageNumbers, prefillPageRange } from '../../utils/enhance-manual-redaction-request.utils';
|
||||
import { toSignal } from '@angular/core/rxjs-interop';
|
||||
import { map } from 'rxjs/operators';
|
||||
|
||||
@Component({
|
||||
templateUrl: './remove-redaction-dialog.component.html',
|
||||
@ -112,11 +112,12 @@ export class RemoveRedactionDialogComponent extends IqserDialogComponent<
|
||||
readonly redactedTexts = this.data.redactions.map(annotation => annotation.value);
|
||||
form: UntypedFormGroup = this._formBuilder.group({
|
||||
comment: [null],
|
||||
option: [this.defaultOption, validatePageRange(this.data.file.numberOfPages, true)],
|
||||
option: [this.#defaultOption, validatePageRange(this.data.file.numberOfPages, true)],
|
||||
});
|
||||
|
||||
readonly selectedOption = toSignal(this.form.get('option').valueChanges.pipe(map(value => value.value)));
|
||||
readonly isFalsePositive = computed(() => this.selectedOption() === RemoveRedactionOptions.FALSE_POSITIVE);
|
||||
readonly hasFalsePositiveOption = !!this.options.find(option => option.value === RemoveRedactionOptions.FALSE_POSITIVE);
|
||||
readonly tableColumns = computed<ValueColumn[]>(() => [
|
||||
{ label: 'Value', width: '25%' },
|
||||
{ label: 'Type', width: '25%' },
|
||||
@ -135,6 +136,11 @@ export class RemoveRedactionDialogComponent extends IqserDialogComponent<
|
||||
]),
|
||||
);
|
||||
|
||||
readonly isBulk = !isJustOne(this.data.redactions);
|
||||
readonly redactedTextsAreaHeight = this.redactedTexts.length <= 10 ? 18 * this.redactedTexts.length : 180;
|
||||
readonly dialogContentHeight = this.options.length * 75 + 230;
|
||||
readonly typeTranslationArg = { type: this.annotationsType };
|
||||
|
||||
constructor(
|
||||
private readonly _formBuilder: FormBuilder,
|
||||
private readonly _userPreferences: UserPreferenceService,
|
||||
@ -150,32 +156,12 @@ export class RemoveRedactionDialogComponent extends IqserDialogComponent<
|
||||
}
|
||||
}
|
||||
|
||||
get hasFalsePositiveOption() {
|
||||
return !!this.options.find(option => option.value === RemoveRedactionOptions.FALSE_POSITIVE);
|
||||
}
|
||||
|
||||
get defaultOption() {
|
||||
get #defaultOption() {
|
||||
const removeDefaultOption = this.#getOption(this.defaultOptionPreference as RemoveRedactionOption);
|
||||
if (!!removeDefaultOption && !removeDefaultOption.disabled) return removeDefaultOption;
|
||||
return this.options[0];
|
||||
}
|
||||
|
||||
get typeTranslationArg() {
|
||||
return { type: this.annotationsType };
|
||||
}
|
||||
|
||||
get isBulk() {
|
||||
return !isJustOne(this.data.redactions);
|
||||
}
|
||||
|
||||
get redactedTextsAreaHeight() {
|
||||
return this.redactedTexts.length <= 10 ? 18 * this.redactedTexts.length : 180;
|
||||
}
|
||||
|
||||
get dialogContentHeight() {
|
||||
return this.options.length * 75 + 230;
|
||||
}
|
||||
|
||||
extraOptionChanged(option: DetailsRadioOption<RemoveRedactionOption | RectangleRedactOption>): void {
|
||||
if (option.value === RectangleRedactOptions.MULTIPLE_PAGES) {
|
||||
setTimeout(() => {
|
||||
|
||||
@ -3,7 +3,7 @@
|
||||
<div [innerHTML]="'resize-redaction.dialog.header' | translate: { type: dialogHeaderType }" class="dialog-header heading-l"></div>
|
||||
|
||||
<div class="dialog-content redaction">
|
||||
<ng-container *ngIf="!redaction.isImage && !redaction.AREA">
|
||||
<ng-container *ngIf="!isImage && !redaction.AREA">
|
||||
<div class="flex-start">
|
||||
<label [translate]="'resize-redaction.dialog.content.original-text'"></label>
|
||||
<span class="multi-line-ellipsis"
|
||||
@ -26,7 +26,7 @@
|
||||
|
||||
<mat-form-field>
|
||||
<mat-select formControlName="dictionary">
|
||||
<mat-select-trigger>{{ displayedDictionaryLabel }}</mat-select-trigger>
|
||||
<mat-select-trigger>{{ displayedDictionaryLabel() }}</mat-select-trigger>
|
||||
<mat-option [value]="entity?.type">
|
||||
<span> {{ redaction.typeLabel }} </span>
|
||||
</mat-option>
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
import { NgIf } from '@angular/common';
|
||||
import { Component, inject } from '@angular/core';
|
||||
import { Component, computed, inject } from '@angular/core';
|
||||
import { FormBuilder, FormControl, FormGroup, ReactiveFormsModule } from '@angular/forms';
|
||||
import { MatDialogClose } from '@angular/material/dialog';
|
||||
import { MatFormField } from '@angular/material/form-field';
|
||||
@ -12,6 +12,13 @@ import { ActiveDossiersService } from '@services/dossiers/active-dossiers.servic
|
||||
import { DictionariesMapService } from '@services/entity-services/dictionaries-map.service';
|
||||
import { getResizeRedactionOptions } from '../../utils/dialog-options';
|
||||
import { ResizeOptions, ResizeRedactionData, ResizeRedactionOption, ResizeRedactionResult } from '../../utils/dialog-types';
|
||||
import { AsControl, formValueToSignal } from '@common-ui/utils';
|
||||
|
||||
interface ResizeForm {
|
||||
comment: string;
|
||||
dictionary: string;
|
||||
option: DetailsRadioOption<ResizeRedactionOption>;
|
||||
}
|
||||
|
||||
@Component({
|
||||
templateUrl: './resize-redaction-dialog.component.html',
|
||||
@ -44,11 +51,17 @@ export class ResizeRedactionDialogComponent extends IqserDialogComponent<
|
||||
readonly dictionaries = inject(DictionariesMapService).get(this.#dossier.dossierTemplateId);
|
||||
readonly entity = this.dictionaries.find(d => d.type === this.data.redaction.type);
|
||||
readonly redaction = this.data.redaction;
|
||||
readonly form: FormGroup<{
|
||||
comment: FormControl<string>;
|
||||
dictionary: FormControl<string>;
|
||||
option: FormControl<DetailsRadioOption<ResizeRedactionOption>>;
|
||||
}>;
|
||||
readonly isImage = this.redaction.isImage;
|
||||
readonly form: FormGroup<AsControl<ResizeForm>> = this.#getForm();
|
||||
readonly dialogHeaderType = this.data.redaction.HINT ? 'hint' : this.data.redaction.isSkippedImageHint ? 'image' : 'redaction';
|
||||
readonly dictionaryType = formValueToSignal(this.form.get('dictionary'));
|
||||
readonly displayedDictionaryLabel = computed(() => {
|
||||
const dictType = this.dictionaryType();
|
||||
if (dictType) {
|
||||
return this.dictionaries.find(d => d.type === dictType)?.label ?? null;
|
||||
}
|
||||
return null;
|
||||
});
|
||||
|
||||
constructor(private readonly _formBuilder: FormBuilder) {
|
||||
super();
|
||||
@ -60,19 +73,6 @@ export class ResizeRedactionDialogComponent extends IqserDialogComponent<
|
||||
this.data.isApprover,
|
||||
this.data.permissions.canResizeInDictionary,
|
||||
);
|
||||
this.form = this.#getForm();
|
||||
}
|
||||
|
||||
get dialogHeaderType() {
|
||||
return this.data.redaction.HINT ? 'hint' : this.data.redaction.isSkippedImageHint ? 'image' : 'redaction';
|
||||
}
|
||||
|
||||
get displayedDictionaryLabel() {
|
||||
const dictType = this.form.get('dictionary').value;
|
||||
if (dictType) {
|
||||
return this.dictionaries.find(d => d.type === dictType)?.label ?? null;
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
save() {
|
||||
|
||||
@ -5,11 +5,12 @@
|
||||
|
||||
<div class="content-inner">
|
||||
<div class="content-container">
|
||||
<redaction-structured-component-management
|
||||
*ngIf="isDocumine"
|
||||
[file]="file"
|
||||
[dictionaries]="state.dictionaries"
|
||||
></redaction-structured-component-management>
|
||||
@if (isDocumine) {
|
||||
<redaction-structured-component-management
|
||||
[file]="file"
|
||||
[dictionaries]="state.dictionaries()"
|
||||
></redaction-structured-component-management>
|
||||
}
|
||||
</div>
|
||||
|
||||
<div class="right-container" [class.documine-container]="isDocumine">
|
||||
|
||||
@ -7,11 +7,9 @@ import { AnnotationWrapper } from '@models/file/annotation.wrapper';
|
||||
import { Core } from '@pdftron/webviewer';
|
||||
import {
|
||||
DictionaryEntryTypes,
|
||||
DownloadFileTypes,
|
||||
EarmarkOperation,
|
||||
type IBulkLocalRemoveRequest,
|
||||
IBulkRecategorizationRequest,
|
||||
ILegalBasisChangeRequest,
|
||||
IRecategorizationRequest,
|
||||
IRectangle,
|
||||
type IRemoveRedactionRequest,
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import { Injectable } from '@angular/core';
|
||||
import { Injectable, untracked } from '@angular/core';
|
||||
import { marker as _ } from '@biesbjerg/ngx-translate-extract-marker';
|
||||
import { getConfig } from '@iqser/common-ui';
|
||||
import { Filter, handleCheckedValue, IFilter, INestedFilter, NestedFilter } from '@iqser/common-ui/lib/filtering';
|
||||
@ -78,7 +78,8 @@ export class AnnotationProcessingService {
|
||||
const filters: INestedFilter[] = [];
|
||||
|
||||
this._fileDataService.all?.forEach(a => {
|
||||
const dictionary = this._state.dictionaries.find(dictionary => dictionary.type === a.type);
|
||||
const dictionaries = untracked(this._state.dictionaries);
|
||||
const dictionary = dictionaries.find(dictionary => dictionary.type === a.type);
|
||||
const doesTypeExist = !!dictionary;
|
||||
if (
|
||||
(this.#isDocumine && !this.#devMode && a.isOCR) ||
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import { effect, inject, Injectable, Signal, signal } from '@angular/core';
|
||||
import { effect, inject, Injectable, Signal, signal, untracked } from '@angular/core';
|
||||
import { toObservable } from '@angular/core/rxjs-interop';
|
||||
import { marker as _ } from '@biesbjerg/ngx-translate-extract-marker';
|
||||
import { EntitiesService, getConfig, Toaster } from '@iqser/common-ui';
|
||||
@ -180,7 +180,7 @@ export class FileDataService extends EntitiesService<AnnotationWrapper, Annotati
|
||||
const file = this._state.file();
|
||||
let annotations: AnnotationWrapper[] = [];
|
||||
const defaultColors = this._defaultColorsService.find(this._state.dossierTemplateId);
|
||||
let dictionaries = this._state.dictionaries;
|
||||
let dictionaries = untracked(this._state.dictionaries);
|
||||
let checkDictionary = true;
|
||||
|
||||
for (const entry of entityLog.entityLogEntry) {
|
||||
|
||||
@ -43,12 +43,14 @@ export class FilePreviewStateService {
|
||||
readonly blob$: Observable<Blob>;
|
||||
readonly componentReferenceIds$: Observable<string[] | null>;
|
||||
readonly #componentReferenceIds$ = new BehaviorSubject<string[] | null>(null);
|
||||
readonly componentReferenceIdsSignal: Signal<string[] | null>;
|
||||
readonly dossierId = getParam(DOSSIER_ID);
|
||||
readonly dossierTemplateId = getParam(DOSSIER_TEMPLATE_ID);
|
||||
readonly fileId = getParam(FILE_ID);
|
||||
readonly excludedPages: WritableSignal<number[]>;
|
||||
readonly updateExcludedPagesStyle = computed(() => this.excludedPages());
|
||||
readonly isEditingReviewer = signal(false);
|
||||
readonly dictionaries: Signal<Dictionary[]>;
|
||||
|
||||
constructor(
|
||||
private readonly _permissionsService: PermissionsService,
|
||||
@ -76,6 +78,14 @@ export class FilePreviewStateService {
|
||||
this.blob$ = this.#blob$;
|
||||
|
||||
this.dossierDictionary = toSignal(inject(DossierDictionariesMapService).watch$(this.dossierId, 'dossier_redaction'));
|
||||
this.dictionaries = computed(() => {
|
||||
const dictionaries = this._dictionariesMapService.get(this.dossierTemplateId);
|
||||
if (this.dossierDictionary()) {
|
||||
dictionaries.push(this.dossierDictionary());
|
||||
}
|
||||
|
||||
return dictionaries;
|
||||
});
|
||||
this.#dossierFilesChange$
|
||||
.pipe(
|
||||
switchMap(() => this._filesService.loadAll(this.dossierId)),
|
||||
@ -92,21 +102,14 @@ export class FilePreviewStateService {
|
||||
},
|
||||
{ allowSignalWrites: true },
|
||||
);
|
||||
|
||||
this.componentReferenceIdsSignal = toSignal(this.componentReferenceIds$);
|
||||
}
|
||||
|
||||
set componentReferenceIds(ids: string[]) {
|
||||
this.#componentReferenceIds$.next(ids);
|
||||
}
|
||||
|
||||
get dictionaries(): Dictionary[] {
|
||||
const dictionaries = this._dictionariesMapService.get(this.dossierTemplateId);
|
||||
if (this.dossierDictionary()) {
|
||||
dictionaries.push(this.dossierDictionary());
|
||||
}
|
||||
|
||||
return dictionaries;
|
||||
}
|
||||
|
||||
get blob(): Promise<Blob> {
|
||||
return firstValueFrom(this.blob$);
|
||||
}
|
||||
@ -133,10 +136,6 @@ export class FilePreviewStateService {
|
||||
);
|
||||
}
|
||||
|
||||
get componentReferenceIds() {
|
||||
return this.#componentReferenceIds$.getValue();
|
||||
}
|
||||
|
||||
reloadBlob(): void {
|
||||
this.#reloadBlob$.next(true);
|
||||
}
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import { inject, Injectable, NgZone } from '@angular/core';
|
||||
import { inject, Injectable, NgZone, untracked } from '@angular/core';
|
||||
import { marker as _ } from '@biesbjerg/ngx-translate-extract-marker';
|
||||
import { getConfig, IqserPermissionsService } from '@iqser/common-ui';
|
||||
import { AnnotationPermissions } from '@models/file/annotation.permissions';
|
||||
@ -135,7 +135,7 @@ export class PdfAnnotationActionsService {
|
||||
#getAnnotationsPermissions(annotations: AnnotationWrapper[]): AnnotationPermissions {
|
||||
const dossier = this.#state.dossier();
|
||||
const isApprover = this.#permissionsService.isApprover(dossier);
|
||||
const dictionaries = this.#state.dictionaries;
|
||||
const dictionaries = untracked(this.#state.dictionaries);
|
||||
const autoAnalysisDisabled = this.#state.file().excludedFromAutomaticAnalysis;
|
||||
const permissions = annotations.map(a =>
|
||||
AnnotationPermissions.forUser(isApprover, a, dictionaries, this.#iqserPermissionsService, autoAnalysisDisabled),
|
||||
|
||||
@ -1,33 +1,30 @@
|
||||
<div (longPress)="forceReanalysisAction($event)" class="action-buttons" redactionLongPress>
|
||||
<iqser-circle-button
|
||||
(action)="openEditDossierDialog(dossier.id)"
|
||||
(action)="openEditDossierDialog(dossier().id)"
|
||||
*allow="roles.dossiers.read; if: currentUser.isUser"
|
||||
[attr.help-mode-key]="'edit_dossier'"
|
||||
[icon]="
|
||||
((iqserPermissionsService.has$(roles.dossiers.edit) | async) && currentUser.isManager) || canEditDossierDictionary
|
||||
? 'iqser:edit'
|
||||
: 'red:info'
|
||||
"
|
||||
[icon]="(hasEditDossierRole() && currentUser.isManager) || canEditDossierDictionary() ? 'iqser:edit' : 'red:info'"
|
||||
[tooltip]="
|
||||
(((iqserPermissionsService.has$(roles.dossiers.edit) | async) && currentUser.isManager) || canEditDossierDictionary
|
||||
((hasEditDossierRole() && currentUser.isManager) || canEditDossierDictionary()
|
||||
? 'dossier-listing.edit.action'
|
||||
: 'dossier-listing.dossier-info.action'
|
||||
) | translate
|
||||
"
|
||||
></iqser-circle-button>
|
||||
|
||||
<iqser-circle-button
|
||||
(action)="reanalyseDossier(dossier)"
|
||||
*ngIf="displayReanalyseBtn"
|
||||
[tooltip]="'dossier-listing.reanalyse.action' | translate"
|
||||
icon="iqser:refresh"
|
||||
></iqser-circle-button>
|
||||
@if (displayReanalyseBtn) {
|
||||
<iqser-circle-button
|
||||
(action)="reanalyseDossier(dossier())"
|
||||
[tooltip]="'dossier-listing.reanalyse.action' | translate"
|
||||
icon="iqser:refresh"
|
||||
></iqser-circle-button>
|
||||
}
|
||||
|
||||
<redaction-file-download-btn
|
||||
[attr.help-mode-key]="isDocumine ? 'template_download_dossier' : 'download_dossier'"
|
||||
[buttonId]="'download-dossier-files-' + dossier.id"
|
||||
[buttonId]="'download-dossier-files-' + dossier().id"
|
||||
[disabled]="downloadBtnDisabled"
|
||||
[dossier]="dossier"
|
||||
[dossier]="dossier()"
|
||||
[files]="files"
|
||||
dossierDownload
|
||||
></redaction-file-download-btn>
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
import { AsyncPipe, NgIf } from '@angular/common';
|
||||
import { Component, Input, OnChanges } from '@angular/core';
|
||||
import { AsyncPipe } from '@angular/common';
|
||||
import { Component, computed, input, OnChanges } from '@angular/core';
|
||||
import { CircleButtonComponent, getConfig, IqserAllowDirective, IqserPermissionsService, largeDialogConfig } from '@iqser/common-ui';
|
||||
import { getCurrentUser } from '@iqser/common-ui/lib/users';
|
||||
import { TranslateModule } from '@ngx-translate/core';
|
||||
@ -13,12 +13,13 @@ import { Roles } from '@users/roles';
|
||||
import { UserPreferenceService } from '@users/user-preference.service';
|
||||
import { EditDossierDialogComponent } from '../../dialogs/edit-dossier-dialog/edit-dossier-dialog.component';
|
||||
import { DossiersDialogService } from '../../services/dossiers-dialog.service';
|
||||
import { toSignal } from '@angular/core/rxjs-interop';
|
||||
|
||||
@Component({
|
||||
selector: 'redaction-dossiers-listing-actions [dossier]',
|
||||
templateUrl: './dossiers-listing-actions.component.html',
|
||||
standalone: true,
|
||||
imports: [LongPressDirective, CircleButtonComponent, IqserAllowDirective, TranslateModule, NgIf, FileDownloadBtnComponent, AsyncPipe],
|
||||
imports: [LongPressDirective, CircleButtonComponent, IqserAllowDirective, TranslateModule, FileDownloadBtnComponent, AsyncPipe],
|
||||
})
|
||||
export class DossiersListingActionsComponent implements OnChanges {
|
||||
readonly roles = Roles;
|
||||
@ -30,7 +31,9 @@ export class DossiersListingActionsComponent implements OnChanges {
|
||||
displayReanalyseBtn = false;
|
||||
downloadBtnDisabled = false;
|
||||
|
||||
@Input() dossier: Dossier;
|
||||
readonly dossier = input<Dossier>();
|
||||
readonly canEditDossierDictionary = computed(() => this.permissionsService.canEditDossierDictionary(this.dossier()));
|
||||
readonly hasEditDossierRole = toSignal(this.iqserPermissionsService.has$(this.roles.dossiers.edit));
|
||||
|
||||
constructor(
|
||||
private readonly _reanalysisService: ReanalysisService,
|
||||
@ -41,14 +44,10 @@ export class DossiersListingActionsComponent implements OnChanges {
|
||||
private readonly _userPreferenceService: UserPreferenceService,
|
||||
) {}
|
||||
|
||||
get canEditDossierDictionary() {
|
||||
return this.permissionsService.canEditDossierDictionary(this.dossier);
|
||||
}
|
||||
|
||||
ngOnChanges() {
|
||||
this.files = this.filesMapService.get(this.dossier.id);
|
||||
this.files = this.filesMapService.get(this.dossier().id);
|
||||
this.downloadBtnDisabled = this.files.some(file => !file.lastProcessed);
|
||||
this.displayReanalyseBtn = this.permissionsService.displayReanalyseBtn(this.dossier) && this.analysisForced;
|
||||
this.displayReanalyseBtn = this.permissionsService.displayReanalyseBtn(this.dossier()) && this.analysisForced;
|
||||
}
|
||||
|
||||
forceReanalysisAction($event: LongPressEvent) {
|
||||
|
||||
@ -30,13 +30,13 @@ import { DossiersService } from '@services/dossiers/dossiers.service';
|
||||
import { DossierStatesMapService } from '@services/entity-services/dossier-states-map.service';
|
||||
import { TrashService } from '@services/entity-services/trash.service';
|
||||
import { PermissionsService } from '@services/permissions.service';
|
||||
import { dateWithoutTime, formControlToSignal } from '@utils/functions';
|
||||
import { dateWithoutTime } from '@utils/functions';
|
||||
import dayjs from 'dayjs';
|
||||
import { firstValueFrom } from 'rxjs';
|
||||
import { DossiersDialogService } from '../../../services/dossiers-dialog.service';
|
||||
import { type EditDossierDialogComponent } from '../edit-dossier-dialog.component';
|
||||
import { EditDossierSaveResult, EditDossierSectionInterface } from '../edit-dossier-section.interface';
|
||||
import { AsControl, isJustOne } from '@common-ui/utils';
|
||||
import { AsControl, formValueToSignal, isJustOne } from '@common-ui/utils';
|
||||
import { DossierStatesService } from '@services/entity-services/dossier-states.service';
|
||||
|
||||
interface GeneralInfoForm {
|
||||
@ -85,8 +85,8 @@ export class EditDossierGeneralInfoComponent implements OnInit, EditDossierSecti
|
||||
dueDate: [null],
|
||||
});
|
||||
initialFormValue: GeneralInfoForm;
|
||||
readonly dossierStatusIdControl = formControlToSignal(this.form.controls.dossierStatusId);
|
||||
readonly dossierTemplateIdControl = formControlToSignal<GeneralInfoForm['dossierTemplateId']>(this.form.controls.dossierTemplateId);
|
||||
readonly dossierStatusIdControl = formValueToSignal(this.form.controls.dossierStatusId);
|
||||
readonly dossierTemplateIdControl = formValueToSignal<GeneralInfoForm['dossierTemplateId']>(this.form.controls.dossierTemplateId);
|
||||
readonly states = signal([null]);
|
||||
readonly stateNameAndColor = computed(() => {
|
||||
const nameAndColor = {};
|
||||
|
||||
@ -0,0 +1,13 @@
|
||||
<svg:circle
|
||||
[attr.cx]="cx()"
|
||||
[attr.cy]="cy()"
|
||||
[attr.r]="radius()"
|
||||
[attr.stroke-dasharray]="circumference()"
|
||||
[attr.stroke-dashoffset]="strokeDashOffset()"
|
||||
[attr.stroke-width]="strokeWidth()"
|
||||
[attr.stroke]="stroke()"
|
||||
[attr.transform]="circleTransformValue()"
|
||||
[class]="config().color"
|
||||
fill="transparent"
|
||||
xmlns:svg="http://www.w3.org/2000/svg"
|
||||
/>
|
||||
|
After Width: | Height: | Size: 387 B |
@ -0,0 +1,4 @@
|
||||
:host {
|
||||
display: contents;
|
||||
height: fit-content;
|
||||
}
|
||||
Some files were not shown because too many files have changed in this diff Show More
Loading…
x
Reference in New Issue
Block a user