Marmelator/red-ui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1.4k Wiki Activity

Merge branch 'VM/RED-9201' into 'master'

Browse Source 
RED-9201 - UI for Component Mapping Tables

Closes RED-9201

See merge request redactmanager/red-ui!544
This commit is contained in:
Nicoleta Panaghiu 2024-08-14 09:47:09 +02:00
commit 8079079217
3 changed files with 12 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
apps/red-ui/src/app/modules/admin/screens/component-mappings/add-edit-component-mapping-dialog/add-edit-component-mapping-dialog.component.html
View File

@ -30,7 +30,7 @@
<div
class="row"
[matTooltip]="'add-edit-component-mapping.disabled-file-options' | translate"
[matTooltipDisabled]="!disabledFileOptions"
[matTooltipDisabled]="!form.get('encoding')?.disabled"
[matTooltipPosition]="'above'"
>
<div class="iqser-input-group required w-150">
@ -40,13 +40,12 @@
formControlName="delimiter"
name="delimiter"
type="text"
[class.disabled-file-options]="disabledFileOptions"
/>
</div>
<div class="iqser-input-group required w-150">
<label translate="add-edit-component-mapping.form.encoding-type"></label>
<mat-form-field [class.disabled-file-options]="disabledFileOptions">
<mat-form-field>
<mat-select formControlName="encoding">
<mat-option *ngFor="let type of encodingTypeOptions" [value]="type">
{{ translations[type] | translate }}

5
apps/red-ui/src/app/modules/admin/screens/component-mappings/add-edit-component-mapping-dialog/add-edit-component-mapping-dialog.component.scss
View File

@ -18,11 +18,6 @@
font-size: 15px;
}
}
.disabled-file-options {
opacity: 0.5;
pointer-events: none;
}
}
.row:last-child {

14
apps/red-ui/src/app/modules/admin/screens/component-mappings/add-edit-component-mapping-dialog/add-edit-component-mapping-dialog.component.ts
View File

@ -52,7 +52,6 @@ export class AddEditComponentMappingDialogComponent
{
protected readonly encodingTypeOptions = Object.keys(FileAttributeEncodingTypes);
protected readonly translations = fileAttributeEncodingTypesTranslations;
#fileChanged = false;
activeFile: File;
form!: UntypedFormGroup;
@ -73,13 +72,14 @@ export class AddEditComponentMappingDialogComponent
const file = new Blob([fileContent.body as Blob], { type: 'text/csv' });
this.form.get('file').setValue(file);
this.initialFormValue = this.form.getRawValue();
this.#disableEncodingAndDelimiter();
}
}
changeFile(file: File) {
this.#fileChanged = true;
this.form.get('file').setValue(file);
this.form.get('fileName').setValue(file?.name);
this.#enableEncodingAndDelimiter();
}
save() {
@ -96,7 +96,13 @@ export class AddEditComponentMappingDialogComponent
});
}
get disabledFileOptions() {
return this.initialFormValue?.file && !this.#fileChanged;
#disableEncodingAndDelimiter() {
this.form.get('encoding').disable();
this.form.get('delimiter').disable();
}
#enableEncodingAndDelimiter() {
this.form.get('encoding').enable();
this.form.get('delimiter').enable();
}
}