This site uses cookies. Visit our cookies policy page or click the link in any footer for more information and to change your preferences.

Accept all cookies Accept only essential cookies

Code development platform for open source projects from the European Union institutions :large_blue_circle: EU Login authentication by SMS has been phased out. To see alternatives please check here

Skip to content
Snippets Groups Projects
Commit bea3623c authored by Joze RIHTARSIC's avatar Joze RIHTARSIC
Browse files

[EDELIVERY-13955] fix table headers

parent a6156316
Branches
Tags
No related merge requests found
Pipeline #220612 failed
Show whitespace changes
Inline Side-by-side
Showing
with 99 additions and 28 deletions
smp-angular/src/app/common/components/smp-table/smp-table-coldef.model.ts
+ 2
− 1
View file @ bea3623c
......@@ -8,4 +8,5 @@ export interface SmpTableColDef {
cell?: (row: any) => any;
tooltip?: (row: any) => any;
style?:string;
headerStyle?: string;
}
smp-angular/src/app/common/components/smp-table/smp-table.component.css
+ 15
− 1
View file @ bea3623c
......@@ -19,6 +19,16 @@
.smp-table-cell {
word-break: break-all;
word-wrap: break-word;
font-size: 0.8em;
padding: 1px 5px;
}
.smp-table-cell-header {
font-weight: bold;
font-size: 0.9em;
padding: 1px 5px;
text-align: left;
}
.smp-table-row {
......@@ -40,4 +50,8 @@
padding-top: 1em;
}
.smp-table-header-row{
min-height: 36px;
}
smp-angular/src/app/common/components/smp-table/smp-table.component.html
+ 4
− 2
View file @ bea3623c
......@@ -14,7 +14,8 @@
<ng-container *ngFor="let colDef of columnDefList; let colIndex = index"
matColumnDef="{{colDef.columnDef}}">
<mat-header-cell *matHeaderCellDef
[style]="colDef.style">{{ colDef.header | translate }}
class="smp-table-cell-header"
[style]="getHeaderStyle(colDef)">{{ colDef.header | translate }}
</mat-header-cell>
<mat-cell class="smp-table-cell" *matCellDef="let row"
......@@ -23,7 +24,8 @@
>{{ colDef.cell(row) }}</mat-cell>
</ng-container>
<!-- configure table header -->
<mat-header-row *matHeaderRowDef="displayedColumns;sticky: true"></mat-header-row>
<mat-header-row *matHeaderRowDef="displayedColumns;sticky: true"
class="smp-table-header-row"></mat-header-row>
<!-- configure table rows -->
<mat-row class="smp-table-row" *matRowDef="let odd = odd; let row; columns: displayedColumns;"
(click)="onRowClickedEvent(row)"
......
smp-angular/src/app/common/components/smp-table/smp-table.component.ts
+ 7
− 0
View file @ bea3623c
......@@ -114,4 +114,11 @@ export class SmpTableComponent implements AfterViewInit {
}
}
getHeaderStyle(col: SmpTableColDef): string {
if (!col) {
return '';
}
return ( col?.style?col.style:'') + ' ' +( col?.headerStyle?col.headerStyle:'') ;
}
}
smp-angular/src/app/common/panels/document-events-panel/document-events-panel.component.ts
+ 5
− 5
View file @ bea3623c
......@@ -80,33 +80,33 @@ export class DocumentEventsPanelComponent implements AfterViewInit, BeforeLeaveG
columnDef: 'date',
header: 'document.events.panel.label.date',
cell: (row: DocumentVersionEventRo) => this.dateTimeService.formatDateTimeForUserLocal(row.eventOn),
style: 'font-size: 0.8em; flex-grow: 0;flex-basis: 80px; padding: 5px;justify-content : center;'
style: 'flex-basis: 150px;flex-grow: 0;'
} as SmpTableColDef,
{
columnDef: 'eventType',
header: 'document.events.panel.label.type',
cell: (row: DocumentVersionEventRo) => row.eventType,
style: 'font-size: 0.8em; padding: 5px;justify-content : center;flex-grow: 0;flex-basis:80px;'
style: 'flex-basis:80px;flex-grow: 0;'
} as SmpTableColDef,
{
columnDef: 'status',
header: 'document.events.panel.label.status',
cell: (row: DocumentVersionEventRo) => row.documentVersionStatus,
style: 'font-size: 0.8em; padding: 5px;justify-content : center;flex-grow: 0;flex-basis:80px;'
style: 'flex-basis:80px;flex-grow: 0;'
} as SmpTableColDef,
{
columnDef: 'username',
header: 'document.events.panel.label.username',
cell: (row: DocumentVersionEventRo) => row.username,
style: 'font-size: 0.8em; padding: 5px;justify-content : center;'
style: 'flex-grow: 1;'
} as SmpTableColDef,
{
columnDef: 'eventSource',
header: 'document.events.panel.label.source',
cell: (row: DocumentVersionEventRo) => row.eventSourceType,
style: 'font-size: 0.8em; flex-grow: 0;flex-basis:100px;padding: 5px;justify-content : center;'
style: 'flex-basis:60px;flex-grow: 0;'
} as SmpTableColDef,
];
}
......
smp-angular/src/app/common/panels/document-properties-panel/document-properties-panel.component.ts
+ 2
− 2
View file @ bea3623c
......@@ -76,13 +76,13 @@ export class DocumentPropertiesPanelComponent implements BeforeLeaveGuard, Contr
header: 'document.properties.panel.label.property',
cell: (row: DocumentPropertyRo) => row.property,
tooltip: (row: DocumentPropertyRo) => row.desc,
style: 'font-size: 0.8em; padding: 0 5px;flex-grow: 0;flex-basis:40%;'
style: 'flex-grow: 0;flex-basis:40%;'
} as SmpTableColDef,
{
columnDef: 'value',
header: 'document.properties.panel.label.value',
cell: (row: DocumentPropertyRo) => row.value,
style: 'font-size: 0.8em; padding: 0 5px;'
style: 'flex-grow: 1;'
} as SmpTableColDef
];
}
......
smp-angular/src/app/common/panels/document-versions-panel/document-versions-panel.component.ts
+ 4
− 4
View file @ bea3623c
......@@ -82,25 +82,25 @@ export class DocumentVersionsPanelComponent implements BeforeLeaveGuard, Control
columnDef: 'version',
header: 'document.versions.panel.label.version',
cell: (row: DocumentVersionRo) => row.version,
style: 'font-size: 0.8em;padding: 5px;justify-content : center;flex-grow: 0;flex-basis:70px;'
style: 'flex-grow: 0;flex-basis:70px;'
} as SmpTableColDef,
{
columnDef: 'status',
header: 'document.versions.panel.label.status',
cell: (row: DocumentVersionRo) => row.versionStatus,
style: 'font-size: 0.8em;padding: 5px;justify-content:center;flex-grow: 0;flex-basis:100px;'
style: 'flex-grow: 1;'
} as SmpTableColDef,
{
columnDef: 'createdOn',
header: 'document.versions.panel.label.created',
cell: (row: DocumentVersionRo) => this.dateTimeService.formatDateTimeForUserLocal(row.createdOn),
style: 'font-size: 0.8em; padding: 5px;justify-content:center;'
style: 'flex-basis: 150px;flex-grow: 0;'
} as SmpTableColDef,
{
columnDef: 'lastUpdatedOn',
header: 'document.versions.panel.label.updated',
cell: (row: DocumentVersionRo) => this.dateTimeService.formatDateTimeForUserLocal(row.lastUpdatedOn),
style: 'font-size: 0.8em; padding: 5px;justify-content:center;'
style: 'flex-basis: 150px;flex-grow: 0;'
} as SmpTableColDef
];
}
......
smp-angular/src/app/system-settings/admin-domain/admin-domain.component.css
+ 7
− 0
View file @ bea3623c
......@@ -31,3 +31,10 @@
height: 100%;
max-width: 800px
}
.domain-table-cell-header {
font-weight: bold;
font-size: 0.9em;
padding: 1px 5px;
text-align: center;
}
smp-angular/src/app/system-settings/admin-domain/admin-domain.component.html
+ 1
− 1
View file @ bea3623c
......@@ -92,7 +92,7 @@
<table class="mat-elevation-z2" id="admin-domain-table" mat-table
[dataSource]="dataSource" matSort>
<ng-container matColumnDef="domainCode">
<th mat-header-cell *matHeaderCellDef mat-sort-header>{{ "admin.domain.label.domain.code" | translate }}</th>
<th mat-header-cell *matHeaderCellDef mat-sort-header class="domain-table-cell-header">{{ "admin.domain.label.domain.code" | translate }}</th>
<td mat-cell *matCellDef="let row"
[matTooltip]="row.domainCode">{{ row.domainCode }}
</td>
......
smp-angular/src/app/system-settings/admin-domain/domain-properties-panel/domain-properties-panel.component.html
+ 3
− 3
View file @ bea3623c
......@@ -4,19 +4,19 @@
<table id="admin-domain-properties-table" mat-table
[dataSource]="propertyDataSource" matSort>
<ng-container matColumnDef="systemDefault">
<th mat-header-cell *matHeaderCellDef mat-sort-header>{{ "domain.properties.label.system.default" | translate }}</th>
<th mat-header-cell *matHeaderCellDef mat-sort-header class="domprop-table-cell-header">{{ "domain.properties.label.system.default" | translate }}</th>
<td mat-cell *matCellDef="let row">
<mat-checkbox checked="{{row.systemDefault}}" disabled></mat-checkbox>
</td>
</ng-container>
<ng-container matColumnDef="property">
<th mat-header-cell *matHeaderCellDef mat-sort-header>{{ "domain.properties.label.domain.property" | translate }}</th>
<th mat-header-cell *matHeaderCellDef mat-sort-header class="domprop-table-cell-header">{{ "domain.properties.label.domain.property" | translate }}</th>
<td mat-cell *matCellDef="let row"
[matTooltip]="row.desc">{{ row.property }}
</td>
</ng-container>
<ng-container matColumnDef="value">
<th mat-header-cell *matHeaderCellDef mat-sort-header>{{ "domain.properties.label.domain.value" | translate }}</th>
<th mat-header-cell *matHeaderCellDef mat-sort-header class="domprop-table-cell-header">{{ "domain.properties.label.domain.value" | translate }}</th>
<td mat-cell *matCellDef="let row">{{ getTableRowValue(row) }}</td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
......
smp-angular/src/app/system-settings/admin-domain/domain-properties-panel/domain-properties-panel.component.scss
+ 8
− 0
View file @ bea3623c
......@@ -24,3 +24,11 @@
.table-row {
font-weight: normal;
}
.domprop-table-cell-header {
font-weight: bold;
font-size: 0.9em;
padding: 1px 5px;
text-align: left;
}
smp-angular/src/app/system-settings/admin-extension/extension.component.css
+ 8
− 0
View file @ bea3623c
......@@ -19,3 +19,11 @@
padding-top: 1em;
}
.extension-table-cell-header {
font-weight: bold;
font-size: 0.9em;
padding: 1px 5px;
text-align: left;
align-self: start;
}
smp-angular/src/app/system-settings/admin-extension/extension.component.html
+ 3
− 3
View file @ bea3623c
......@@ -22,13 +22,13 @@
<!-- Name Column -->
<ng-container matColumnDef="name">
<th mat-header-cell *matHeaderCellDef mat-sort-header>{{ "extensions.label.name" | translate }}</th>
<th mat-header-cell *matHeaderCellDef mat-sort-header class="extension-table-cell-header">{{ "extensions.label.name" | translate }}</th>
<td mat-cell *matCellDef="let row"> {{row.name}} </td>
</ng-container>
<!-- Version Column -->
<ng-container matColumnDef="version">
<th mat-header-cell *matHeaderCellDef mat-sort-header>{{ "extensions.label.version" | translate }}</th>
<ng-container matColumnDef="version" class="extension-table-cell-header">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="extension-table-cell-header">{{ "extensions.label.version" | translate }}</th>
<td mat-cell *matCellDef="let row"> {{row.version}}</td>
</ng-container>
......
smp-angular/src/app/system-settings/admin-keystore/admin-keystore.component.css
+ 8
− 0
View file @ bea3623c
......@@ -26,3 +26,11 @@
display: block;
cursor: pointer;
}
.keystore-table-cell-header {
font-weight: bold;
font-size: 0.9em;
padding: 1px 5px;
text-align: left;
align-self: start;
}
smp-angular/src/app/system-settings/admin-keystore/admin-keystore.component.html
+ 2
− 2
View file @ bea3623c
......@@ -37,14 +37,14 @@
<table class="mat-elevation-z2" id="admin-keystore-table" mat-table [dataSource]="dataSource" matSort>
<ng-container matColumnDef="alias" [matTooltip]="selected?.certificateId">
<th mat-header-cell *matHeaderCellDef mat-sort-header>{{ "admin.keystore.label.alias" | translate }}</th>
<th mat-header-cell *matHeaderCellDef mat-sort-header class="keystore-table-cell-header">{{ "admin.keystore.label.alias" | translate }}</th>
<td mat-cell *matCellDef="let row"
[ngClass]="{'datatable-row-error': row.invalid}"
[matTooltip]="row.certificateId">{{row.alias}}</td>
</ng-container>
<ng-container matColumnDef="entry-type">
<th mat-header-cell *matHeaderCellDef>{{ "admin.keystore.label.type" | translate }}</th>
<th mat-header-cell *matHeaderCellDef class="keystore-table-cell-header">{{ "admin.keystore.label.type" | translate }}</th>
<td mat-cell *matCellDef="let row"
[ngClass]="{'datatable-row-error': row.invalid}"
[matTooltip]="(row.containingKey ? 'admin.keystore.label.key.pair': 'admin.keystore.label.certificate') | translate">
......
smp-angular/src/app/system-settings/admin-truststore/admin-truststore.component.css
+ 7
− 1
View file @ bea3623c
......@@ -12,7 +12,6 @@
padding-top: 1em;
}
#admin-truststore-table {
width: 100%;
padding-top: 1em;
......@@ -26,3 +25,10 @@
display: block;
cursor: pointer;
}
.truststore-table-cell-header {
font-weight: bold;
font-size: 0.9em;
padding: 1px 5px;
text-align: center;
}
smp-angular/src/app/system-settings/admin-truststore/admin-truststore.component.html
+ 1
− 1
View file @ bea3623c
......@@ -49,7 +49,7 @@
<!-- Name Column -->
<ng-container matColumnDef="alias">
<th mat-header-cell *matHeaderCellDef mat-sort-header>{{ "admin.truststore.label.alias" | translate }}</th>
<th mat-header-cell *matHeaderCellDef mat-sort-header class="truststore-table-cell-header">{{ "admin.truststore.label.alias" | translate }}</th>
<td mat-cell *matCellDef="let row"
[ngClass]="{'datatable-row-error': row.invalid}"
[matTooltip]="row.certificateId">{{row.alias}}</td>
......
smp-angular/src/app/system-settings/admin-users/admin-user.component.css
+ 7
− 0
View file @ bea3623c
......@@ -17,3 +17,10 @@
width: 100%;
padding-top: 1em;
}
.user-table-cell-header {
font-weight: bold;
font-size: 0.9em;
padding: 1px 5px;
text-align: left;
}
smp-angular/src/app/system-settings/admin-users/admin-user.component.html
+ 2
− 2
View file @ bea3623c
......@@ -41,12 +41,12 @@
</mat-toolbar>
<table class="mat-elevation-z2" id="admin-user-table" mat-table [dataSource]="userData" >
<ng-container matColumnDef="username">
<th mat-header-cell *matHeaderCellDef >{{ "admin.user.label.username" | translate }}</th>
<th mat-header-cell *matHeaderCellDef class="user-table-cell-header" >{{ "admin.user.label.username" | translate }}</th>
<td mat-cell *matCellDef="let row" [matTooltip]="row.username">{{row.username}}</td>
</ng-container>
<ng-container matColumnDef="fullName">
<th mat-header-cell *matHeaderCellDef >{{ "admin.user.label.full.name" | translate }}</th>
<th mat-header-cell *matHeaderCellDef class="user-table-cell-header" >{{ "admin.user.label.full.name" | translate }}</th>
<td mat-cell *matCellDef="let row" [matTooltip]="row.username">{{row.fullName}}</td>
</ng-container>
......
smp-angular/src/assets/i18n/en.json
+ 3
− 0
View file @ bea3623c
......@@ -634,10 +634,13 @@
"domain.properties.button.reset": "Reset",
"domain.properties.button.save": "Save",
"domain.properties.label.filter": "Filter by prop. name",
"domain.properties.placeholder.filter": "Filter by property name",
"domain.properties.label.domain.property": "Domain property",
"domain.properties.label.domain.value": "Domain value",
"domain.properties.label.system.default": "Sys. Def.",
"domain.properties.label.no.properties.found": "No Domain properties found",
"domain.properties.label.no.filter.found": "No data matching the filter {{filterValue}}\"",
"domain.properties.panel.title": "Domain properties",
"domain.resource.type.panel.button.reset": "Reset",
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment

For further information about the platform and support, please see https://code.europa.eu/info/about