RED-5936 - Selecting "Date" or "Number" as a type for a file attribute has not effect

This commit is contained in:
Valentin Mihai 2023-01-25 22:06:41 +02:00
parent acc461d7fc
commit 73fd433c20
7 changed files with 36 additions and 37 deletions

View File

@ -22,31 +22,33 @@
<div class="section">
<div *ngFor="let attr of fileAttributes$ | async" class="attribute">
<div class="small-label">{{ attr.label }}:</div>
<div>{{ attr.value || '-' }}</div>
<div>{{ attr.value ? (isDate(attr) ? (attr.value | date : 'd MMM yyyy') : attr.value) : '-' }}</div>
</div>
</div>
<div *ngIf="stateService.dossier$ | async as dossier" class="section small-label stats-subtitle">
<div>
<mat-icon svgIcon="red:folder"></mat-icon>
<span>{{ 'file-preview.tabs.document-info.details.dossier' | translate: { dossierName: dossier.dossierName } }}</span>
<span>{{ 'file-preview.tabs.document-info.details.dossier' | translate : { dossierName: dossier.dossierName } }}</span>
</div>
<div>
<mat-icon svgIcon="iqser:document"></mat-icon>
<span>{{ 'file-preview.tabs.document-info.details.pages' | translate: { pages: file.numberOfPages } }}</span>
<span>{{ 'file-preview.tabs.document-info.details.pages' | translate : { pages: file.numberOfPages } }}</span>
</div>
<div>
<mat-icon svgIcon="red:calendar"></mat-icon>
<span>{{
'file-preview.tabs.document-info.details.created-on' | translate: { date: file.added | date: 'mediumDate' }
'file-preview.tabs.document-info.details.created-on' | translate : { date: file.added | date : 'mediumDate' }
}}</span>
</div>
<div *ngIf="dossier.dueDate">
<mat-icon svgIcon="red:lightning"></mat-icon>
<span>{{ 'file-preview.tabs.document-info.details.due' | translate: { date: dossier.dueDate | date: 'mediumDate' } }}</span>
<span>{{
'file-preview.tabs.document-info.details.due' | translate : { date: dossier.dueDate | date : 'mediumDate' }
}}</span>
</div>
<div>

View File

@ -5,10 +5,16 @@ import { combineLatest, Observable, switchMap } from 'rxjs';
import { PermissionsService } from '@services/permissions.service';
import { FilePreviewStateService } from '../../services/file-preview-state.service';
import { map } from 'rxjs/operators';
import { File } from '@red/domain';
import { File, FileAttributeConfigType, FileAttributeConfigTypes } from '@red/domain';
import { FilePreviewDialogService } from '../../services/file-preview-dialog.service';
import { FileAttributesService } from '@services/entity-services/file-attributes.service';
interface FileAttribute {
label: string;
value: string;
type: FileAttributeConfigType;
}
@Component({
selector: 'redaction-document-info',
templateUrl: './document-info.component.html',
@ -16,7 +22,7 @@ import { FileAttributesService } from '@services/entity-services/file-attributes
changeDetection: ChangeDetectionStrategy.OnPush,
})
export class DocumentInfoComponent {
readonly fileAttributes$: Observable<{ label: string; value: string }[]>;
readonly fileAttributes$: Observable<FileAttribute[]>;
readonly dossierTemplateName$: Observable<string>;
constructor(
@ -43,4 +49,8 @@ export class DocumentInfoComponent {
edit(file: File) {
this._dialogService.openDialog('documentInfo', null, file);
}
isDate(attribute: FileAttribute) {
return attribute.type === FileAttributeConfigTypes.DATE;
}
}

View File

@ -4,8 +4,14 @@
<form (submit)="save()" [formGroup]="form">
<div class="dialog-content">
<div *ngFor="let attr of attributes" class="iqser-input-group w-300">
<label>{{ attr.label }}</label>
<input [formControlName]="attr.id" [name]="attr.id" type="text" />
<iqser-dynamic-input
[formControlName]="attr.id"
[id]="attr.id"
[label]="attr.label"
[type]="attr.type"
[classList]="'w-300'"
>
</iqser-dynamic-input>
</div>
</div>
<div class="dialog-actions">

View File

@ -67,6 +67,7 @@ export class DocumentInfoService {
return attributes.map(attr => ({
label: attr.label,
value: file?.fileAttributes?.attributeIdToValue[attr.id],
type: attr.type,
}));
}
}

View File

@ -10,31 +10,15 @@
icon="red:attribute"
></iqser-empty-state>
<div
<iqser-dynamic-input
*ngFor="let attr of customAttributes"
[class.datepicker-wrapper]="isSpecificType(attr, dossierAttributeConfigTypes.DATE)"
class="iqser-input-group"
[formControlName]="attr.id"
[id]="attr.id"
[label]="attr.label"
[type]="attr.type"
[classList]="'w-full'"
>
<label>{{ attr.label }}</label>
<ng-container
*ngIf="isSpecificType(attr, dossierAttributeConfigTypes.NUMBER) || isSpecificType(attr, dossierAttributeConfigTypes.TEXT)"
>
<input
[formControlName]="attr.id"
[name]="attr.id"
[type]="isSpecificType(attr, dossierAttributeConfigTypes.NUMBER) ? 'number' : 'text'"
/>
</ng-container>
<ng-container *ngIf="isSpecificType(attr, dossierAttributeConfigTypes.DATE)">
<input [formControlName]="attr.id" [matDatepicker]="picker" placeholder="dd/mm/yy" />
<mat-datepicker-toggle [for]="picker" matSuffix>
<mat-icon matDatepickerToggleIcon svgIcon="red:calendar"></mat-icon>
</mat-datepicker-toggle>
<mat-datepicker #picker></mat-datepicker>
</ng-container>
</div>
</iqser-dynamic-input>
</div>
<div class="separator"></div>

View File

@ -28,10 +28,6 @@
margin-top: 3px;
}
.datepicker-wrapper:not(:first-child) {
margin-top: 14px;
}
.image-attribute {
&.displayed-preview {
flex-direction: row;

@ -1 +1 @@
Subproject commit 1bef72a321c0747eac535294be3b1bbc4f7c38af
Subproject commit eb84e5f34801445fd0ff4b3764e9d3f7d6a6e251