RED-9201 - displayed all column labels string in a tooltip

This commit is contained in:
Valentin Mihai 2024-07-25 12:12:50 +03:00
parent a9b399ebbd
commit 0bcb3829c7
4 changed files with 13 additions and 2 deletions

View File

@ -44,8 +44,8 @@
<span>{{ entity.numberOfLines }}</span> <span>{{ entity.numberOfLines }}</span>
</div> </div>
<div class="cell"> <div class="cell" [matTooltip]="entity.columnLabelsString" [matTooltipPosition]="'above'" [matTooltipClass]="'custom-tooltip'">
<span class="ellipsis">{{ entity.columnLabels.join(', ') }}</span> <span class="ellipsis">{{ entity.columnLabelsString }}</span>
</div> </div>
<div class="cell"> <div class="cell">

View File

@ -3,3 +3,9 @@
overflow: hidden; overflow: hidden;
white-space: nowrap; white-space: nowrap;
} }
::ng-deep .custom-tooltip {
max-width: 300px;
white-space: normal;
word-wrap: break-word;
}

View File

@ -30,6 +30,7 @@ import { DossierTemplateActionsComponent } from '../../shared/components/dossier
import { DossierTemplateBreadcrumbsComponent } from '../../shared/components/dossier-template-breadcrumbs/dossier-template-breadcrumbs.component'; import { DossierTemplateBreadcrumbsComponent } from '../../shared/components/dossier-template-breadcrumbs/dossier-template-breadcrumbs.component';
import { AddEditComponentMappingDialogComponent } from './add-edit-component-mapping-dialog/add-edit-component-mapping-dialog.component'; import { AddEditComponentMappingDialogComponent } from './add-edit-component-mapping-dialog/add-edit-component-mapping-dialog.component';
import { download } from '@utils/file-download-utils'; import { download } from '@utils/file-download-utils';
import { MatTooltip } from '@angular/material/tooltip';
@Component({ @Component({
templateUrl: './component-mappings-screen.component.html', templateUrl: './component-mappings-screen.component.html',
@ -49,6 +50,7 @@ import { download } from '@utils/file-download-utils';
InputWithActionComponent, InputWithActionComponent,
IconButtonComponent, IconButtonComponent,
IqserAllowDirective, IqserAllowDirective,
MatTooltip,
], ],
}) })
export default class ComponentMappingsScreenComponent extends ListingComponent<ComponentMapping> implements OnInit { export default class ComponentMappingsScreenComponent extends ListingComponent<ComponentMapping> implements OnInit {

View File

@ -6,6 +6,7 @@ export interface IComponentMapping extends IListable {
fileName: string; fileName: string;
version: number; version: number;
columnLabels: string[]; columnLabels: string[];
columnLabelsString: string;
numberOfLines: number; numberOfLines: number;
encoding: string; encoding: string;
delimiter: string; delimiter: string;
@ -17,6 +18,7 @@ export class ComponentMapping implements IComponentMapping, IListable {
readonly fileName: string; readonly fileName: string;
readonly version: number; readonly version: number;
readonly columnLabels: string[]; readonly columnLabels: string[];
readonly columnLabelsString: string;
readonly numberOfLines: number; readonly numberOfLines: number;
readonly encoding: string; readonly encoding: string;
readonly delimiter: string; readonly delimiter: string;
@ -27,6 +29,7 @@ export class ComponentMapping implements IComponentMapping, IListable {
this.fileName = componentMapping.fileName; this.fileName = componentMapping.fileName;
this.version = componentMapping.version; this.version = componentMapping.version;
this.columnLabels = componentMapping.columnLabels; this.columnLabels = componentMapping.columnLabels;
this.columnLabelsString = componentMapping.columnLabels?.join(', ');
this.numberOfLines = componentMapping.numberOfLines; this.numberOfLines = componentMapping.numberOfLines;
this.encoding = componentMapping.encoding; this.encoding = componentMapping.encoding;
this.delimiter = componentMapping.delimiter; this.delimiter = componentMapping.delimiter;