diff --git a/src/app/shared/components/dialogs/shared-aip-detail/shared-aip-detail.dialog.html b/src/app/shared/components/dialogs/shared-aip-detail/shared-aip-detail.dialog.html
index 9e1b9d9ced8b8754dd49d2da7ee8fc92dde61a5b..0b1549125302ba461cd059f86241c05f3bd5fece 100644
--- a/src/app/shared/components/dialogs/shared-aip-detail/shared-aip-detail.dialog.html
+++ b/src/app/shared/components/dialogs/shared-aip-detail/shared-aip-detail.dialog.html
@@ -7,7 +7,8 @@
<!-- TODO USE COMPONENT BUTTON-TOOLBAR-DETAIL.PRESENTATIONAL-->
<button mat-button
*ngIf="!button.displayCondition || (button.displayCondition(data.aip) | solidifyAsync)"
- [disabled]="!button.disableCondition || (button.disableCondition(data.aip) | solidifyAsync)"
+ [disabled]="(button.disableCondition | isNullOrUndefined) ? false : ((button.disableCondition(data.aip) | isObservable) ?
+ (button.disableCondition(data.aip) | async) : button.disableCondition(data.aip))"
[color]="button.color"
(keydown.enter)="button.callback ? button.callback(data.aip) : undefined"
(click)="button.callback ? button.callback(data.aip) : undefined"
@@ -17,17 +18,6 @@
</button>
</ng-container>
- <button mat-button
- *ngIf="data.isLoading !== null"
- color="primary"
- solidifyShortCuts
- (onEnter)="showHistory()"
- (click)="showHistory()"
- >
- <mat-icon>history</mat-icon>
- {{'deposit.file.button.showHistory' | translate}}
- </button>
-
<button mat-button
color="primary"
solidifyShortCuts
@@ -39,171 +29,223 @@
</button>
</div>
- <div class="container">
- <div class="left-part">
- <dlcm-shared-panel-expandable [titleToTranslate]="'deposit.file.details.delimiter.fileInfo' | translate"
- [isOpen]="true"
- >
- <mat-list>
- <mat-list-item>
- <div class="item-content">
- <span class="key">{{'deposit.file.detail.data.fileName' | translate}}</span>
- <span class="value">{{data.aip.info.name}}</span>
- </div>
- </mat-list-item>
- <mat-divider></mat-divider>
-
- <mat-list-item>
- <div class="item-content">
- <span class="key">{{'deposit.file.detail.data.smartSize' | translate}}</span>
- <span class="value">{{data.aip.smartSize}}</span>
- </div>
- </mat-list-item>
- <mat-divider></mat-divider>
-
- <ng-container *ngIf="data.aip.fileFormat !== null">
- <mat-list-item>
- <div class="item-content">
- <span class="key">{{'deposit.file.detail.data.mimeType' | translate}}</span>
- <span class="value">{{data.aip.fileFormat.contentType}}</span>
- </div>
- </mat-list-item>
- <mat-divider></mat-divider>
-
- <mat-list-item>
- <div class="item-content">
- <span class="key">{{'deposit.file.detail.data.fileFormat' | translate}}</span>
- <span class="value">{{data.aip.fileFormat.format}}</span>
- </div>
- </mat-list-item>
- <mat-divider></mat-divider>
-
- <mat-list-item>
- <div class="item-content">
- <span class="key">{{'deposit.file.detail.data.puid' | translate}}</span>
- <span class="value"><a [href]="getPuidLink(data.aip.fileFormat.puid)"
- target="_blank"
- >{{data.aip.fileFormat.puid}}</a></span>
- </div>
- </mat-list-item>
- <mat-divider></mat-divider>
- </ng-container>
- <mat-list-item>
- <div class="item-content">
- <span class="key">{{'deposit.file.detail.data.complianceLevel' | translate}}</span>
- <span class="value">
- <dlcm-shared-compliance-level-rating [value]="data.aip.info.complianceLevel"
- [withLabel]="false"
- ></dlcm-shared-compliance-level-rating>
- </span>
- </div>
- </mat-list-item>
- <mat-divider></mat-divider>
- </mat-list>
- </dlcm-shared-panel-expandable>
+ <ng-template [ngIf]="breakpointService.isSmallerOrEqualThanMdObs() | async ">
+ <div class="container">
+ <ng-template [ngTemplateOutlet]="leftPartTemplate"></ng-template>
</div>
- <div class="right-part">
- <dlcm-shared-panel-expandable *ngIf="data.aip.checksums !== undefined && data.aip.checksums !== null && data.aip.checksums.length > 0"
- [isOpen]="true"
- [titleToTranslate]="'deposit.file.details.delimiter.checksum' | translate"
- >
- <dlcm-shared-checksum [checksums]="data.aip.checksums"></dlcm-shared-checksum>
- </dlcm-shared-panel-expandable>
-
- <dlcm-shared-panel-expandable *ngIf="data.aip.fileFormat?.tool !== null"
- [titleToTranslate]="'deposit.file.details.delimiter.analyticalTool' | translate"
- >
- <mat-list>
- <mat-list-item>
- <div class="item-content">
- <span class="key">{{'deposit.file.detail.data.tool.name' | translate}}</span>
- <span class="value">{{data.aip.fileFormat.tool.name}}</span>
- </div>
- </mat-list-item>
- <mat-divider></mat-divider>
-
- <mat-list-item>
- <div class="item-content">
- <span class="key">{{'deposit.file.detail.data.tool.version' | translate}}</span>
- <span class="value">{{data.aip.fileFormat.tool.version}}</span>
- </div>
- </mat-list-item>
- <mat-divider></mat-divider>
+ </ng-template>
+
+ <mat-tab-group #matTabGroup
+ mat-align-tabs="center"
+ animationDuration="0ms"
+ >
+ <mat-tab #infoTab>
+ <ng-template mat-tab-label>
+ <mat-icon class="tab-header-icon">info</mat-icon>
+ <span class="tab-header-label"> {{'crud.list.action.info' | translate}}</span>
+ </ng-template>
+ </mat-tab>
+ <mat-tab #historyTab>
+ <ng-template mat-tab-label>
+ <mat-icon class="tab-header-icon">history</mat-icon>
+ <span class="tab-header-label"> {{'crud.list.action.history' | translate}}</span>
+ </ng-template>
+ </mat-tab>
+ </mat-tab-group>
- <mat-list-item>
- <div class="item-content">
- <span class="key">{{'deposit.file.detail.data.tool.description' | translate}}</span>
- <span class="value">{{data.aip.fileFormat.tool.description}}</span>
- </div>
- </mat-list-item>
- <mat-divider></mat-divider>
+ <div class="container">
+ <ng-template [ngIf]="breakpointService.isBiggerThanMdObs() | async "
+ [ngIfThen]="leftPartTemplate"
+ ></ng-template>
+ <ng-template [ngTemplateOutlet]="rightPartTemplate"></ng-template>
+ </div>
- <mat-list-item>
- <div class="item-content">
- <span class="key">{{'deposit.file.detail.data.tool.puid' | translate}}</span>
- <span class="value"><a [href]="getPuidLink(data.aip.fileFormat.tool.puid)"
- target="_blank"
- >{{data.aip.fileFormat.tool.puid}}</a></span>
- </div>
- </mat-list-item>
- </mat-list>
- </dlcm-shared-panel-expandable>
+</dlcm-shared-base-info-dialog>
- <dlcm-shared-panel-expandable *ngIf="data.aip.virusCheck !== null"
- [titleToTranslate]="'deposit.file.details.delimiter.antivirus' | translate"
- >
- <mat-list>
- <mat-list-item>
- <div class="item-content">
- <span class="key">{{'deposit.file.detail.data.tool.name' | translate}}</span>
- <span class="value">{{data.aip.virusCheck.tool.name}}</span>
- </div>
- </mat-list-item>
- <mat-divider></mat-divider>
+<ng-template #rightPartTemplate>
+ <div class="right-part">
+ <ng-template [ngIf]="infoTab.isActive"
+ [ngIfThen]="checksumTemplate"
+ ></ng-template>
+ <ng-template [ngIf]="historyTab.isActive"
+ [ngIfThen]="historyTemplate"
+ ></ng-template>
+ </div>
+</ng-template>
+<ng-template #leftPartTemplate>
+ <div class="left-part">
+ <dlcm-shared-panel-expandable [titleToTranslate]="'deposit.file.details.delimiter.fileInfo' | translate"
+ [isOpen]="true"
+ >
+ <mat-list>
+ <mat-list-item>
+ <div class="item-content">
+ <span class="key">{{'deposit.file.detail.data.fileName' | translate}}</span>
+ <span class="value">{{data.aip.info.name}}</span>
+ </div>
+ </mat-list-item>
+ <mat-divider></mat-divider>
+
+ <mat-list-item>
+ <div class="item-content">
+ <span class="key">{{'deposit.file.detail.data.smartSize' | translate}}</span>
+ <span class="value">{{data.aip.smartSize}}</span>
+ </div>
+ </mat-list-item>
+ <mat-divider></mat-divider>
+
+ <ng-container *ngIf="data.aip.fileFormat !== null">
<mat-list-item>
<div class="item-content">
- <span class="key">{{'deposit.file.detail.data.tool.description' | translate}}</span>
- <span class="value">{{data.aip.virusCheck.tool.description}}</span>
+ <span class="key">{{'deposit.file.detail.data.mimeType' | translate}}</span>
+ <span class="value">{{data.aip.fileFormat.contentType}}</span>
</div>
</mat-list-item>
<mat-divider></mat-divider>
<mat-list-item>
<div class="item-content">
- <span class="key">{{'deposit.file.detail.data.tool.version' | translate}}</span>
- <span class="value">{{data.aip.virusCheck.tool.version}}</span>
+ <span class="key">{{'deposit.file.detail.data.fileFormat' | translate}}</span>
+ <span class="value">{{data.aip.fileFormat.format}}</span>
</div>
</mat-list-item>
<mat-divider></mat-divider>
<mat-list-item>
<div class="item-content">
- <span class="key">{{'deposit.file.detail.data.tool.puid' | translate}}</span>
- <span class="value"><a [href]="getPuidLink(data.aip.virusCheck.tool.puid)"
+ <span class="key">{{'deposit.file.detail.data.puid' | translate}}</span>
+ <span class="value"><a [href]="getPuidLink(data.aip.fileFormat.puid)"
target="_blank"
- >{{data.aip.virusCheck.tool.puid}}</a></span>
- </div>
- </mat-list-item>
- <mat-divider></mat-divider>
-
- <mat-list-item>
- <div class="item-content">
- <span class="key">{{'deposit.file.detail.data.virusCheck.checkDate' | translate}}</span>
- <span class="value">{{data.aip.virusCheck.checkDate}}</span>
- </div>
- </mat-list-item>
- <mat-divider></mat-divider>
-
- <mat-list-item>
- <div class="item-content">
- <span class="key">{{'deposit.file.detail.data.virusCheck.details' | translate}}</span>
- <span class="value">{{data.aip.virusCheck.details}}</span>
+ >{{data.aip.fileFormat.puid}}</a></span>
</div>
</mat-list-item>
<mat-divider></mat-divider>
- </mat-list>
- </dlcm-shared-panel-expandable>
- </div>
+ </ng-container>
+ <mat-list-item>
+ <div class="item-content">
+ <span class="key">{{'deposit.file.detail.data.complianceLevel' | translate}}</span>
+ <span class="value">
+ <dlcm-shared-compliance-level-rating [value]="data.aip.info.complianceLevel"
+ [withLabel]="false"
+ ></dlcm-shared-compliance-level-rating>
+ </span>
+ </div>
+ </mat-list-item>
+ <mat-divider></mat-divider>
+ </mat-list>
+ </dlcm-shared-panel-expandable>
</div>
-</dlcm-shared-base-info-dialog>
+</ng-template>
+
+<ng-template #checksumTemplate>
+ <dlcm-shared-panel-expandable *ngIf="data.aip.checksums !== undefined && data.aip.checksums !== null && data.aip.checksums.length > 0"
+ [isOpen]="true"
+ [titleToTranslate]="'deposit.file.details.delimiter.checksum' | translate"
+ >
+ <dlcm-shared-checksum [checksums]="data.aip.checksums"></dlcm-shared-checksum>
+ </dlcm-shared-panel-expandable>
+
+ <dlcm-shared-panel-expandable *ngIf="data.aip.fileFormat?.tool !== null"
+ [titleToTranslate]="'deposit.file.details.delimiter.analyticalTool' | translate"
+ >
+ <mat-list>
+ <mat-list-item>
+ <div class="item-content">
+ <span class="key">{{'deposit.file.detail.data.tool.name' | translate}}</span>
+ <span class="value">{{data.aip.fileFormat.tool.name}}</span>
+ </div>
+ </mat-list-item>
+ <mat-divider></mat-divider>
+
+ <mat-list-item>
+ <div class="item-content">
+ <span class="key">{{'deposit.file.detail.data.tool.version' | translate}}</span>
+ <span class="value">{{data.aip.fileFormat.tool.version}}</span>
+ </div>
+ </mat-list-item>
+ <mat-divider></mat-divider>
+
+ <mat-list-item>
+ <div class="item-content">
+ <span class="key">{{'deposit.file.detail.data.tool.description' | translate}}</span>
+ <span class="value">{{data.aip.fileFormat.tool.description}}</span>
+ </div>
+ </mat-list-item>
+ <mat-divider></mat-divider>
+
+ <mat-list-item>
+ <div class="item-content">
+ <span class="key">{{'deposit.file.detail.data.tool.puid' | translate}}</span>
+ <span class="value"><a [href]="getPuidLink(data.aip.fileFormat.tool.puid)"
+ target="_blank"
+ >{{data.aip.fileFormat.tool.puid}}</a></span>
+ </div>
+ </mat-list-item>
+ </mat-list>
+ </dlcm-shared-panel-expandable>
+
+ <dlcm-shared-panel-expandable *ngIf="data.aip.virusCheck !== null"
+ [titleToTranslate]="'deposit.file.details.delimiter.antivirus' | translate"
+ >
+ <mat-list>
+ <mat-list-item>
+ <div class="item-content">
+ <span class="key">{{'deposit.file.detail.data.tool.name' | translate}}</span>
+ <span class="value">{{data.aip.virusCheck.tool.name}}</span>
+ </div>
+ </mat-list-item>
+ <mat-divider></mat-divider>
+
+ <mat-list-item>
+ <div class="item-content">
+ <span class="key">{{'deposit.file.detail.data.tool.description' | translate}}</span>
+ <span class="value">{{data.aip.virusCheck.tool.description}}</span>
+ </div>
+ </mat-list-item>
+ <mat-divider></mat-divider>
+
+ <mat-list-item>
+ <div class="item-content">
+ <span class="key">{{'deposit.file.detail.data.tool.version' | translate}}</span>
+ <span class="value">{{data.aip.virusCheck.tool.version}}</span>
+ </div>
+ </mat-list-item>
+ <mat-divider></mat-divider>
+
+ <mat-list-item>
+ <div class="item-content">
+ <span class="key">{{'deposit.file.detail.data.tool.puid' | translate}}</span>
+ <span class="value"><a [href]="getPuidLink(data.aip.virusCheck.tool.puid)"
+ target="_blank"
+ >{{data.aip.virusCheck.tool.puid}}</a></span>
+ </div>
+ </mat-list-item>
+ <mat-divider></mat-divider>
+
+ <mat-list-item>
+ <div class="item-content">
+ <span class="key">{{'deposit.file.detail.data.virusCheck.checkDate' | translate}}</span>
+ <span class="value">{{data.aip.virusCheck.checkDate}}</span>
+ </div>
+ </mat-list-item>
+ <mat-divider></mat-divider>
+
+ <mat-list-item>
+ <div class="item-content">
+ <span class="key">{{'deposit.file.detail.data.virusCheck.details' | translate}}</span>
+ <span class="value">{{data.aip.virusCheck.details}}</span>
+ </div>
+ </mat-list-item>
+ <mat-divider></mat-divider>
+ </mat-list>
+ </dlcm-shared-panel-expandable>
+</ng-template>
+<ng-template #historyTemplate>
+ <dlcm-shared-data-table [columns]="columns"
+ [isLoading]="data.isLoading | async"
+ [datas]="data.statusHistory | async"
+ [queryParameters]="data.queryParametersObs | async"
+ (queryParametersChange)="pagination($event)"
+ ></dlcm-shared-data-table>
+</ng-template>
diff --git a/src/app/shared/components/dialogs/shared-aip-detail/shared-aip-detail.dialog.ts b/src/app/shared/components/dialogs/shared-aip-detail/shared-aip-detail.dialog.ts
index 385cae6687b8c954fda9d0ed9bdd03e080f751b0..c38a5c6f759f6435d9d25d7d985dbc85e0487f9e 100644
--- a/src/app/shared/components/dialogs/shared-aip-detail/shared-aip-detail.dialog.ts
+++ b/src/app/shared/components/dialogs/shared-aip-detail/shared-aip-detail.dialog.ts
@@ -18,6 +18,7 @@ import {
SharedDetailDialog,
SharedDetailDialogData,
} from "@shared/components/dialogs/shared-detail-dialog/shared-detail.dialog";
+import {BreakpointService} from "@shared/services/breakpoint.service";
import {
BaseResource,
NotificationService,
@@ -30,15 +31,15 @@ import {
changeDetection: ChangeDetectionStrategy.OnPush,
})
export class SharedAipDetailDialog<TResource extends BaseResource> extends SharedDetailDialog<TResource> implements OnInit {
- paramMessage: { name: string } = {name: ""};
constructor(protected readonly _store: Store,
protected readonly _dialog: MatDialog,
protected readonly _actions$: Actions,
+ protected readonly _breakpointService: BreakpointService,
protected readonly _notificationService: NotificationService,
protected dialogRef: MatDialogRef<SharedDetailDialog<TResource>>,
@Inject(MAT_DIALOG_DATA) public data: SharedAipDetailDialogData<TResource>) {
- super(_store, _dialog, _actions$, _notificationService, dialogRef, data);
+ super(_store, _dialog, _actions$, _breakpointService, _notificationService, dialogRef, data);
}
}
diff --git a/src/app/shared/components/dialogs/shared-detail-dialog/shared-detail.dialog.scss b/src/app/shared/components/dialogs/shared-detail-dialog/shared-detail.dialog.scss
index 89d7b8fa3cbf0625376b3e0668194ecc93e0eded..cc30606716e3bb14c223558ef279173c371c6a0b 100644
--- a/src/app/shared/components/dialogs/shared-detail-dialog/shared-detail.dialog.scss
+++ b/src/app/shared/components/dialogs/shared-detail-dialog/shared-detail.dialog.scss
@@ -12,15 +12,37 @@ h2 {
margin-top: 10px;
}
+.tab-header-label {
+ padding-left: 10px;
+}
+
+.visualization {
+ .warning-area {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ height: 300px;
+
+ .icon {
+ padding: 10px;
+ }
+
+ .visualization-error-message {
+
+ }
+ }
+}
+
@include respond-to-breakpoint-and-bigger('md') {
.container {
display: flex;
flex-direction: row;
margin-top: 20px;
+ max-height: 505px;
.left-part,
.right-part {
- width: 100%;
overflow: hidden
}
@@ -30,16 +52,54 @@ h2 {
.right-part {
padding-left: 20px;
+ max-height: 100%;
+ overflow: auto;
+ flex: 1;
+ }
+
+ ::ng-deep .mat-paginator-container {
+ flex-wrap: initial;
+ }
+ }
+}
+
+@include respond-to-breakpoint-and-bigger('lg') {
+ .container {
+ .left-part,
+ .right-part {
+ flex: 1;
+ overflow: hidden
+ }
+
+ .left-part {
+ padding-right: 20px;
+ }
+
+ .right-part {
+ padding-left: 20px;
+ max-height: 100%;
+ overflow: auto;
}
}
}
.item-content {
- display: flex;
- justify-content: flex-end;
+ display: grid;
+ grid-template-columns: max-content 10px 1fr;
+ grid-template-areas: "key . value";
width: 100%;
flex-wrap: wrap;
+ .key {
+ grid-area: key;
+ }
+
+ .value {
+ grid-area: value;
+ display: flex;
+ justify-content: flex-end;
+ }
+
.value-list {
word-break: break-all;
}
diff --git a/src/app/shared/components/dialogs/shared-detail-dialog/shared-detail.dialog.ts b/src/app/shared/components/dialogs/shared-detail-dialog/shared-detail.dialog.ts
index 59323ae87ee8248eb2df209e1f60b1a983b4ac89..c3237b0f458a70eba71236e7521c18a1dd337257 100644
--- a/src/app/shared/components/dialogs/shared-detail-dialog/shared-detail.dialog.ts
+++ b/src/app/shared/components/dialogs/shared-detail-dialog/shared-detail.dialog.ts
@@ -14,35 +14,84 @@ import {
Store,
} from "@ngxs/store";
import {SharedHistoryDialog} from "@shared/components/dialogs/shared-history/shared-history.dialog";
+import {FieldTypeEnum} from "@shared/enums/field-type.enum";
import {LocalStateEnum} from "@shared/enums/local-state.enum";
+import {HistoryStatusEnumHelper} from "@shared/helpers/history-status-enum.helper";
+import {DataTableColumns} from "@shared/models/data-table-columns.model";
import {ExtraButtonToolbar} from "@shared/models/extra-button-toolbar.model";
import {StatusHistoryDialog} from "@shared/models/status-history-dialog.model";
import {StatusHistory} from "@shared/models/status-history.model";
+import {BreakpointService} from "@shared/services/breakpoint.service";
import {StatusHistoryNamespace} from "@shared/stores/status-history/status-history-namespace.model";
import {Observable} from "rxjs";
import {
BaseResource,
ClipboardUtil,
NotificationService,
+ OrderEnum,
QueryParameters,
TRANSLATE,
} from "solidify-frontend";
export abstract class SharedDetailDialog<TResource extends BaseResource> extends SharedAbstractContainer implements OnInit {
paramMessage: { name: string } = {name: ""};
+ columns: DataTableColumns[];
protected constructor(protected readonly _store: Store,
protected readonly _dialog: MatDialog,
protected readonly _actions$: Actions,
+ protected readonly _breakpointService: BreakpointService,
protected readonly _notificationService: NotificationService,
protected dialogRef: MatDialogRef<SharedDetailDialog<TResource>>,
@Inject(MAT_DIALOG_DATA) public data: SharedDetailDialogData<TResource>) {
super();
}
+ get breakpointService(): BreakpointService {
+ return this._breakpointService;
+ }
+
ngOnInit(): void {
super.ngOnInit();
this.paramMessage.name = this.data.name;
+ this.columns = [
+ {
+ field: "changeTime",
+ header: TRANSLATE("app.history.table.changeTime"),
+ type: FieldTypeEnum.datetime,
+ order: OrderEnum.descending,
+ isSortable: true,
+ isFilterable: false,
+ },
+ {
+ field: "status",
+ header: TRANSLATE("app.history.table.status"),
+ type: FieldTypeEnum.singleSelect,
+ order: OrderEnum.none,
+ isSortable: false,
+ isFilterable: false,
+ filterEnum: HistoryStatusEnumHelper.getListKeyValue(),
+ translate: true,
+ width: "110px",
+ },
+ {
+ field: "description",
+ header: TRANSLATE("app.history.table.description"),
+ type: FieldTypeEnum.number,
+ order: OrderEnum.none,
+ isSortable: true,
+ isFilterable: false,
+ },
+ {
+ field: "creatorName",
+ header: TRANSLATE("app.history.table.createdBy"),
+ type: FieldTypeEnum.string,
+ order: OrderEnum.none,
+ isSortable: false,
+ isFilterable: false,
+ width: "140px",
+ },
+ ];
}
close(): void {
@@ -72,6 +121,11 @@ export abstract class SharedDetailDialog<TResource extends BaseResource> extends
ClipboardUtil.copyStringToClipboard(this.data.resId);
this._notificationService.showInformation(TRANSLATE("app.notification.idCopyToClipboard"));
}
+
+ pagination($event: QueryParameters): void {
+ this._store.dispatch(new this.data.state.ChangeQueryParameters($event, this.data.resId, this.data.parentId));
+ }
+
}
export interface SharedDetailDialogData<TResource extends BaseResource> {
diff --git a/src/app/shared/components/dialogs/shared-file-detail/shared-file-detail.dialog.html b/src/app/shared/components/dialogs/shared-file-detail/shared-file-detail.dialog.html
index e55923d7d984d26fa64b826e3c75389c82b28368..56a3b6119ab6e8776384d07a634a37349dba3910 100644
--- a/src/app/shared/components/dialogs/shared-file-detail/shared-file-detail.dialog.html
+++ b/src/app/shared/components/dialogs/shared-file-detail/shared-file-detail.dialog.html
@@ -20,24 +20,6 @@
</button>
</ng-container>
- <button mat-button
- color="primary"
- (keydown.enter)="showHistory()"
- (click)="showHistory()"
- >
- <mat-icon>history</mat-icon>
- {{'deposit.file.button.showHistory' | translate}}
- </button>
-
- <button mat-button
- color="primary"
- (keydown.enter)="showPreview()"
- (click)="showPreview()"
- >
- <fa-icon [icon]="'eye'"></fa-icon>
- {{'deposit.file.button.showPreview' | translate}}
- </button>
-
<button mat-button
color="primary"
(keydown.enter)="copyKey()"
@@ -48,204 +30,290 @@
</button>
</div>
+ <ng-template [ngIf]="breakpointService.isSmallerOrEqualThanMdObs() | async ">
+ <div class="container">
+ <ng-template [ngTemplateOutlet]="leftPartTemplate"></ng-template>
+ </div>
+ </ng-template>
+
+ <mat-tab-group #matTabGroup
+ mat-align-tabs="center"
+ animationDuration="0ms"
+ >
+ <mat-tab #infoTab>
+ <ng-template mat-tab-label>
+ <mat-icon class="tab-header-icon">info</mat-icon>
+ <span class="tab-header-label"> {{'crud.list.action.info' | translate}}</span>
+ </ng-template>
+ </mat-tab>
+ <mat-tab #historyTab>
+ <ng-template mat-tab-label>
+ <mat-icon class="tab-header-icon">history</mat-icon>
+ <span class="tab-header-label"> {{'crud.list.action.history' | translate}}</span>
+ </ng-template>
+ </mat-tab>
+ <mat-tab #showPreviewTab>
+ <ng-template mat-tab-label>
+ <mat-icon class="tab-header-icon">remove_red_eye</mat-icon>
+ <span class="tab-header-label">{{'deposit.file.button.showPreview' | translate}}</span>
+ </ng-template>
+ </mat-tab>
+ </mat-tab-group>
+
<div class="container">
- <div class="left-part">
- <dlcm-shared-panel-expandable [titleToTranslate]="'deposit.file.details.delimiter.fileInfo' | translate"
- [isOpen]="true"
- >
- <mat-list>
- <mat-list-item>
- <div class="item-content">
- <span class="key">{{'deposit.file.detail.data.fileName' | translate}}</span>
- <span class="value">{{data.dataFile.fileName}}</span>
- </div>
- </mat-list-item>
- <mat-divider></mat-divider>
-
- <mat-list-item>
- <div class="item-content">
- <span class="key">{{'deposit.file.detail.data.location' | translate}}</span>
- <span class="value">{{data.dataFile.relativeLocation}}</span>
- </div>
- </mat-list-item>
- <mat-divider></mat-divider>
-
- <mat-list-item>
- <div class="item-content">
- <span class="key">{{'deposit.file.detail.data.smartSize' | translate}}</span>
- <span class="value">{{data.dataFile.smartSize}}</span>
- </div>
- </mat-list-item>
- <mat-divider></mat-divider>
-
- <mat-list-item>
- <div class="item-content">
- <span class="key">{{'deposit.file.detail.data.category' | translate}}</span>
- <span class="value">{{data.dataFile.dataCategory}}</span>
- </div>
- </mat-list-item>
- <mat-divider></mat-divider>
-
- <mat-list-item>
- <div class="item-content">
- <span class="key">{{'deposit.file.detail.data.type' | translate}}</span>
- <span class="value">{{data.dataFile.dataType}}</span>
- </div>
- </mat-list-item>
- <mat-divider></mat-divider>
-
- <ng-container *ngIf="data.dataFile.metadataType?.fullName | isNotNullNorUndefined">
- <mat-list-item>
- <div class="item-content">
- <span class="key">{{'deposit.file.detail.data.metadataType' | translate}}</span>
- <span class="value">{{data.dataFile.metadataType.fullName}}</span>
- </div>
- </mat-list-item>
- <mat-divider></mat-divider>
- </ng-container>
-
- <ng-container *ngIf="data.dataFile.fileFormat !== null">
- <mat-list-item>
- <div class="item-content">
- <span class="key">{{'deposit.file.detail.data.mimeType' | translate}}</span>
- <span class="value">{{data.dataFile.fileFormat.contentType}}</span>
- </div>
- </mat-list-item>
- <mat-divider></mat-divider>
-
- <mat-list-item>
- <div class="item-content">
- <span class="key">{{'deposit.file.detail.data.fileFormat' | translate}}</span>
- <span class="value">{{data.dataFile.fileFormat.format}}</span>
- </div>
- </mat-list-item>
- <mat-divider></mat-divider>
-
- <mat-list-item>
- <div class="item-content">
- <span class="key">{{'deposit.file.detail.data.puid' | translate}}</span>
- <span class="value"><a [href]="getPuidLink(data.dataFile.fileFormat.puid)"
- target="_blank"
- >{{data.dataFile.fileFormat.puid}}</a></span>
- </div>
- </mat-list-item>
- <mat-divider></mat-divider>
- </ng-container>
-
- <mat-list-item>
- <div class="item-content">
- <span class="key">{{'deposit.file.detail.data.complianceLevel' | translate}}</span>
- <span class="value">
+ <ng-template [ngIf]="breakpointService.isBiggerThanMdObs() | async "
+ [ngIfThen]="leftPartTemplate"
+ ></ng-template>
+ <ng-template [ngTemplateOutlet]="rightPartTemplate"></ng-template>
+ </div>
+
+</dlcm-shared-base-info-dialog>
+
+<ng-template #rightPartTemplate>
+ <div class="right-part">
+ <ng-template [ngIf]="historyTab.isActive"
+ [ngIfThen]="historyTemplate"
+ ></ng-template>
+ <ng-template [ngIf]="infoTab.isActive"
+ [ngIfThen]="checkSumTemplate"
+ ></ng-template>
+ <ng-template [ngIf]="showPreviewTab.isActive"
+ [ngIfThen]="visualizationTemplate"
+ ></ng-template>
+ </div>
+</ng-template>
+<ng-template #leftPartTemplate>
+ <div class="left-part">
+ <ng-template [ngTemplateOutlet]="infoTemplate"></ng-template>
+ </div>
+</ng-template>
+
+<ng-template #visualizationTemplate>
+
+ <div class="visualization"
+ *ngIf="showPreviewTab.isActive"
+ >
+ <dlcm-file-visualizer
+ [fileToVisualize]="getFileInput()"
+ (errorMessageChange)="visualizationErrorMessage = $event"
+ ></dlcm-file-visualizer>
+ <div *ngIf="visualizationErrorMessage"
+ class="warning-area"
+ >
+ <mat-icon class="icon">warning</mat-icon>
+ <div class="visualization-error-message">{{visualizationErrorMessage | translate}}</div>
+ </div>
+ </div>
+
+</ng-template>
+
+<ng-template #checkSumTemplate>
+ <dlcm-shared-panel-expandable *ngIf="data.dataFile.checksums !== undefined && data.dataFile.checksums !== null && data.dataFile.checksums.length > 0"
+ [isOpen]="true"
+ [titleToTranslate]="'deposit.file.details.delimiter.checksum' | translate"
+ >
+ <dlcm-shared-checksum [checksums]="data.dataFile.checksums"></dlcm-shared-checksum>
+ </dlcm-shared-panel-expandable>
+
+ <dlcm-shared-panel-expandable *ngIf="data.dataFile.fileFormat?.tool !== null"
+ [titleToTranslate]="'deposit.file.details.delimiter.analyticalTool' | translate"
+ >
+ <mat-list>
+ <mat-list-item>
+ <div class="item-content">
+ <span class="key">{{'deposit.file.detail.data.tool.name' | translate}}</span>
+ <span class="value">{{data.dataFile.fileFormat.tool.name}}</span>
+ </div>
+ </mat-list-item>
+ <mat-divider></mat-divider>
+
+ <mat-list-item>
+ <div class="item-content">
+ <span class="key">{{'deposit.file.detail.data.tool.version' | translate}}</span>
+ <span class="value">{{data.dataFile.fileFormat.tool.version}}</span>
+ </div>
+ </mat-list-item>
+ <mat-divider></mat-divider>
+
+ <mat-list-item>
+ <div class="item-content">
+ <span class="key">{{'deposit.file.detail.data.tool.description' | translate}}</span>
+ <span class="value">{{data.dataFile.fileFormat.tool.description}}</span>
+ </div>
+ </mat-list-item>
+ <mat-divider></mat-divider>
+
+ <mat-list-item>
+ <div class="item-content">
+ <span class="key">{{'deposit.file.detail.data.tool.puid' | translate}}</span>
+ <span class="value"><a [href]="getPuidLink(data.dataFile.fileFormat.tool.puid)"
+ target="_blank"
+ >{{data.dataFile.fileFormat.tool.puid}}</a></span>
+ </div>
+ </mat-list-item>
+ </mat-list>
+ </dlcm-shared-panel-expandable>
+
+ <dlcm-shared-panel-expandable [titleToTranslate]="'deposit.file.details.delimiter.antivirus' | translate">
+ <mat-list *ngIf="data.dataFile.virusCheck !== null">
+ <mat-list-item>
+ <div class="item-content">
+ <span class="key">{{'deposit.file.detail.data.tool.name' | translate}}</span>
+ <span class="value">{{data.dataFile.virusCheck.tool.name}}</span>
+ </div>
+ </mat-list-item>
+ <mat-divider></mat-divider>
+
+ <mat-list-item>
+ <div class="item-content">
+ <span class="key">{{'deposit.file.detail.data.tool.description' | translate}}</span>
+ <span class="value">{{data.dataFile.virusCheck.tool.description}}</span>
+ </div>
+ </mat-list-item>
+ <mat-divider></mat-divider>
+
+ <mat-list-item>
+ <div class="item-content">
+ <span class="key">{{'deposit.file.detail.data.tool.version' | translate}}</span>
+ <span class="value">{{data.dataFile.virusCheck.tool.version}}</span>
+ </div>
+ </mat-list-item>
+ <mat-divider></mat-divider>
+
+ <mat-list-item>
+ <div class="item-content">
+ <span class="key">{{'deposit.file.detail.data.tool.puid' | translate}}</span>
+ <span class="value"><a [href]="getPuidLink(data.dataFile.virusCheck.tool.puid)"
+ target="_blank"
+ >{{data.dataFile.virusCheck.tool.puid}}</a></span>
+ </div>
+ </mat-list-item>
+ <mat-divider></mat-divider>
+
+ <mat-list-item>
+ <div class="item-content">
+ <span class="key">{{'deposit.file.detail.data.virusCheck.checkDate' | translate}}</span>
+ <span class="value">{{data.dataFile.virusCheck.checkDate}}</span>
+ </div>
+ </mat-list-item>
+ <mat-divider></mat-divider>
+
+ <mat-list-item>
+ <div class="item-content">
+ <span class="key">{{'deposit.file.detail.data.virusCheck.details' | translate}}</span>
+ <span class="value">{{data.dataFile.virusCheck.details}}</span>
+ </div>
+ </mat-list-item>
+ <mat-divider></mat-divider>
+ </mat-list>
+ </dlcm-shared-panel-expandable>
+</ng-template>
+
+<ng-template #historyTemplate>
+ <dlcm-shared-data-table [columns]="columns"
+ [isLoading]="data.isLoading | async"
+ [datas]="data.statusHistory | async"
+ [queryParameters]="data.queryParametersObs | async"
+ (queryParametersChange)="pagination($event)"
+ ></dlcm-shared-data-table>
+</ng-template>
+
+<ng-template #infoTemplate>
+ <dlcm-shared-panel-expandable [titleToTranslate]="'deposit.file.details.delimiter.fileInfo' | translate"
+ [isOpen]="true"
+ >
+ <mat-list>
+ <mat-list-item>
+ <div class="item-content">
+ <span class="key">{{'deposit.file.detail.data.fileName' | translate}}</span>
+ <span class="value">{{data.dataFile.fileName}}</span>
+ </div>
+ </mat-list-item>
+ <mat-divider></mat-divider>
+
+ <mat-list-item>
+ <div class="item-content">
+ <span class="key">{{'deposit.file.detail.data.location' | translate}}</span>
+ <span class="value">{{data.dataFile.relativeLocation}}</span>
+ </div>
+ </mat-list-item>
+ <mat-divider></mat-divider>
+
+ <mat-list-item>
+ <div class="item-content">
+ <span class="key">{{'deposit.file.detail.data.smartSize' | translate}}</span>
+ <span class="value">{{data.dataFile.smartSize}}</span>
+ </div>
+ </mat-list-item>
+ <mat-divider></mat-divider>
+
+ <mat-list-item>
+ <div class="item-content">
+ <span class="key">{{'deposit.file.detail.data.category' | translate}}</span>
+ <span class="value">{{data.dataFile.dataCategory}}</span>
+ </div>
+ </mat-list-item>
+ <mat-divider></mat-divider>
+
+ <mat-list-item>
+ <div class="item-content">
+ <span class="key">{{'deposit.file.detail.data.type' | translate}}</span>
+ <span class="value">{{data.dataFile.dataType}}</span>
+ </div>
+ </mat-list-item>
+ <mat-divider></mat-divider>
+
+ <ng-container *ngIf="data.dataFile.metadataType?.fullName | isNotNullNorUndefined">
+ <mat-list-item>
+ <div class="item-content">
+ <span class="key">{{'deposit.file.detail.data.metadataType' | translate}}</span>
+ <span class="value">{{data.dataFile.metadataType.fullName}}</span>
+ </div>
+ </mat-list-item>
+ <mat-divider></mat-divider>
+ </ng-container>
+
+ <ng-container *ngIf="data.dataFile.fileFormat !== null">
+ <mat-list-item>
+ <div class="item-content">
+ <span class="key">{{'deposit.file.detail.data.mimeType' | translate}}</span>
+ <span class="value">{{data.dataFile.fileFormat.contentType}}</span>
+ </div>
+ </mat-list-item>
+ <mat-divider></mat-divider>
+
+ <mat-list-item>
+ <div class="item-content">
+ <span class="key">{{'deposit.file.detail.data.fileFormat' | translate}}</span>
+ <span class="value">{{data.dataFile.fileFormat.format}}</span>
+ </div>
+ </mat-list-item>
+ <mat-divider></mat-divider>
+
+ <mat-list-item>
+ <div class="item-content">
+ <span class="key">{{'deposit.file.detail.data.puid' | translate}}</span>
+ <span class="value"><a [href]="getPuidLink(data.dataFile.fileFormat.puid)"
+ target="_blank"
+ >{{data.dataFile.fileFormat.puid}}</a></span>
+ </div>
+ </mat-list-item>
+ <mat-divider></mat-divider>
+ </ng-container>
+
+ <mat-list-item>
+ <div class="item-content">
+ <span class="key">{{'deposit.file.detail.data.complianceLevel' | translate}}</span>
+ <span class="value">
<dlcm-shared-compliance-level-rating [value]="data.dataFile.complianceLevel"
[withLabel]="false"
></dlcm-shared-compliance-level-rating>
</span>
- </div>
- </mat-list-item>
- <mat-divider></mat-divider>
- </mat-list>
- </dlcm-shared-panel-expandable>
- </div>
- <div class="right-part">
- <dlcm-shared-panel-expandable *ngIf="data.dataFile.checksums !== undefined && data.dataFile.checksums !== null && data.dataFile.checksums.length > 0"
- [isOpen]="true"
- [titleToTranslate]="'deposit.file.details.delimiter.checksum' | translate"
- >
- <dlcm-shared-checksum [checksums]="data.dataFile.checksums"></dlcm-shared-checksum>
- </dlcm-shared-panel-expandable>
+ </div>
+ </mat-list-item>
+ <mat-divider></mat-divider>
+ </mat-list>
+ </dlcm-shared-panel-expandable>
+</ng-template>
+
- <dlcm-shared-panel-expandable *ngIf="data.dataFile.fileFormat?.tool !== null"
- [titleToTranslate]="'deposit.file.details.delimiter.analyticalTool' | translate"
- >
- <mat-list>
- <mat-list-item>
- <div class="item-content">
- <span class="key">{{'deposit.file.detail.data.tool.name' | translate}}</span>
- <span class="value">{{data.dataFile.fileFormat.tool.name}}</span>
- </div>
- </mat-list-item>
- <mat-divider></mat-divider>
-
- <mat-list-item>
- <div class="item-content">
- <span class="key">{{'deposit.file.detail.data.tool.version' | translate}}</span>
- <span class="value">{{data.dataFile.fileFormat.tool.version}}</span>
- </div>
- </mat-list-item>
- <mat-divider></mat-divider>
-
- <mat-list-item>
- <div class="item-content">
- <span class="key">{{'deposit.file.detail.data.tool.description' | translate}}</span>
- <span class="value">{{data.dataFile.fileFormat.tool.description}}</span>
- </div>
- </mat-list-item>
- <mat-divider></mat-divider>
-
- <mat-list-item>
- <div class="item-content">
- <span class="key">{{'deposit.file.detail.data.tool.puid' | translate}}</span>
- <span class="value"><a [href]="getPuidLink(data.dataFile.fileFormat.tool.puid)"
- target="_blank"
- >{{data.dataFile.fileFormat.tool.puid}}</a></span>
- </div>
- </mat-list-item>
- </mat-list>
- </dlcm-shared-panel-expandable>
-
- <dlcm-shared-panel-expandable [titleToTranslate]="'deposit.file.details.delimiter.antivirus' | translate">
- <mat-list *ngIf="data.dataFile.virusCheck !== null">
- <mat-list-item>
- <div class="item-content">
- <span class="key">{{'deposit.file.detail.data.tool.name' | translate}}</span>
- <span class="value">{{data.dataFile.virusCheck.tool.name}}</span>
- </div>
- </mat-list-item>
- <mat-divider></mat-divider>
-
- <mat-list-item>
- <div class="item-content">
- <span class="key">{{'deposit.file.detail.data.tool.description' | translate}}</span>
- <span class="value">{{data.dataFile.virusCheck.tool.description}}</span>
- </div>
- </mat-list-item>
- <mat-divider></mat-divider>
-
- <mat-list-item>
- <div class="item-content">
- <span class="key">{{'deposit.file.detail.data.tool.version' | translate}}</span>
- <span class="value">{{data.dataFile.virusCheck.tool.version}}</span>
- </div>
- </mat-list-item>
- <mat-divider></mat-divider>
-
- <mat-list-item>
- <div class="item-content">
- <span class="key">{{'deposit.file.detail.data.tool.puid' | translate}}</span>
- <span class="value"><a [href]="getPuidLink(data.dataFile.virusCheck.tool.puid)"
- target="_blank"
- >{{data.dataFile.virusCheck.tool.puid}}</a></span>
- </div>
- </mat-list-item>
- <mat-divider></mat-divider>
-
- <mat-list-item>
- <div class="item-content">
- <span class="key">{{'deposit.file.detail.data.virusCheck.checkDate' | translate}}</span>
- <span class="value">{{data.dataFile.virusCheck.checkDate}}</span>
- </div>
- </mat-list-item>
- <mat-divider></mat-divider>
-
- <mat-list-item>
- <div class="item-content">
- <span class="key">{{'deposit.file.detail.data.virusCheck.details' | translate}}</span>
- <span class="value">{{data.dataFile.virusCheck.details}}</span>
- </div>
- </mat-list-item>
- <mat-divider></mat-divider>
- </mat-list>
- </dlcm-shared-panel-expandable>
- </div>
- </div>
-</dlcm-shared-base-info-dialog>
diff --git a/src/app/shared/components/dialogs/shared-file-detail/shared-file-detail.dialog.ts b/src/app/shared/components/dialogs/shared-file-detail/shared-file-detail.dialog.ts
index 169dabcf2a826429f8df5e710f504d5bf013dd3e..e5fcf68a509361bb8ae4496f76aca4657327d121 100644
--- a/src/app/shared/components/dialogs/shared-file-detail/shared-file-detail.dialog.ts
+++ b/src/app/shared/components/dialogs/shared-file-detail/shared-file-detail.dialog.ts
@@ -2,7 +2,6 @@ import {
ChangeDetectionStrategy,
Component,
Inject,
- OnInit,
} from "@angular/core";
import {
MAT_DIALOG_DATA,
@@ -17,9 +16,9 @@ import {
SharedDetailDialog,
SharedDetailDialogData,
} from "@shared/components/dialogs/shared-detail-dialog/shared-detail.dialog";
-import {SharedPreviewDialogData} from "@shared/components/dialogs/shared-preview/shared-preview-dialog-data.model";
-import {SharedPreviewDialog} from "@shared/components/dialogs/shared-preview/shared-preview.dialog";
+import {FileInput} from "@shared/filevisualizer/models/file-info.model";
import {DataFile} from "@shared/models/business/data-file.model";
+import {BreakpointService} from "@shared/services/breakpoint.service";
import {
BaseResource,
NotificationService,
@@ -31,30 +30,24 @@ import {
styleUrls: ["../shared-detail-dialog/shared-detail.dialog.scss"],
changeDetection: ChangeDetectionStrategy.OnPush,
})
-export class SharedFileDetailDialog<TResource extends BaseResource> extends SharedDetailDialog<TResource> implements OnInit {
- paramMessage: { name: string } = {name: ""};
+export class SharedFileDetailDialog<TResource extends BaseResource> extends SharedDetailDialog<TResource> {
+
+ visualizationErrorMessage: string;
constructor(protected readonly _store: Store,
protected readonly _dialog: MatDialog,
protected readonly _actions$: Actions,
+ protected readonly _breakpointService: BreakpointService,
protected readonly _notificationService: NotificationService,
protected dialogRef: MatDialogRef<SharedDetailDialog<TResource>>,
@Inject(MAT_DIALOG_DATA) public data: SharedFileDetailDialogData<TResource>) {
- super(_store, _dialog, _actions$, _notificationService, dialogRef, data);
+ super(_store, _dialog, _actions$, _breakpointService, _notificationService, dialogRef, data);
}
- showPreview(): void {
- const previewDialogRef = this._dialog.open(SharedPreviewDialog, {
- width: "min-content",
- minWidth: "500px",
- height: "min-content",
- data: {
- fileInput: {
- dataFile: this.data.dataFile,
- },
-
- } as SharedPreviewDialogData,
- });
+ getFileInput(): FileInput {
+ return {
+ dataFile: this.data.dataFile,
+ };
}
}
diff --git a/src/app/shared/components/presentationals/shared-data-table/shared-data-table.presentational.ts b/src/app/shared/components/presentationals/shared-data-table/shared-data-table.presentational.ts
index ebddd85d51af12815617dca79534bf5907028929..3f24add56999fdd034757d13567dfd080cc9f533 100644
--- a/src/app/shared/components/presentationals/shared-data-table/shared-data-table.presentational.ts
+++ b/src/app/shared/components/presentationals/shared-data-table/shared-data-table.presentational.ts
@@ -128,8 +128,8 @@ export class SharedDataTablePresentational<TResource extends BaseResource> exten
this.resetBannerSelectAll();
}
this._queryParameters = QueryParametersUtil.clone(value);
- if (isNullOrUndefined(value.paging)) {
- this._queryParameters.paging = new Paging(environment.defaultPageSize);
+ if (isNullOrUndefined(value?.paging)) {
+ this._queryParameters.paging = new Paging(environment?.defaultPageSize);
}
}
diff --git a/src/app/shared/components/routables/shared-abstract-detail-edit/shared-abstract-detail-edit.routable.ts b/src/app/shared/components/routables/shared-abstract-detail-edit/shared-abstract-detail-edit.routable.ts
index 15934258af9968ab92b621ffb0cc140a51ddfe9f..d1cac989796c43bbf090c4407d0657c84401cf98 100644
--- a/src/app/shared/components/routables/shared-abstract-detail-edit/shared-abstract-detail-edit.routable.ts
+++ b/src/app/shared/components/routables/shared-abstract-detail-edit/shared-abstract-detail-edit.routable.ts
@@ -27,6 +27,7 @@ import {AppRoutesEnum} from "@shared/enums/routes.enum";
import {CrudHelper} from "@shared/helpers/crud.helper";
import {FormControlKey} from "@shared/models/form-control-key.model";
import {LocalStateModel} from "@shared/models/local-state.model";
+import {BreakpointService} from "@shared/services/breakpoint.service";
import {Observable} from "rxjs";
import {
distinctUntilChanged,
@@ -79,7 +80,7 @@ export abstract class SharedAbstractDetailEditRoutable<TResourceModel extends Ba
protected readonly _parentState?: LocalStateEnum) {
super(_store, _state, _parentState);
}
-
+
ngOnInit(): void {
super.ngOnInit();
this.subscribe(this.getRetrieveEditModeObs());
diff --git a/src/app/shared/filevisualizer/components/file-visualizer.component.ts b/src/app/shared/filevisualizer/components/file-visualizer.component.ts
index 2ab1ed4501350a6dea979f74208cf2d6d76327fe..62ee7a83a7d52915c607b7898d48940b1e0fab6a 100644
--- a/src/app/shared/filevisualizer/components/file-visualizer.component.ts
+++ b/src/app/shared/filevisualizer/components/file-visualizer.component.ts
@@ -71,6 +71,11 @@ export class FileVisualizerPresentational extends CoreAbstractAngularElement imp
@Output("closeVisualizerChange")
readonly closeVisualizerObs: Observable<boolean | undefined> = ObservableUtil.asObservable(this._closeBS);
+ private readonly _errorMessageBS: BehaviorSubject<string> = new BehaviorSubject<string>("");
+
+ @Output("errorMessageChange")
+ readonly errorMessageObs: Observable<string> = ObservableUtil.asObservable(this._errorMessageBS);
+
@Input()
visualizationContainerInput: ElementRef<Element>;
@@ -110,9 +115,13 @@ export class FileVisualizerPresentational extends CoreAbstractAngularElement imp
if (!this.canHandle(fileInfo)) {
this.closeVisualization();
if (!this.canHandleBySize(fileInfo)) {
- this._notificationService.showInformation(TRANSLATE("notification.file.visualizer.file.toobig"), true);
+ const sizeNotSupported = "notification.file.visualizer.file.toobig";
+ this._notificationService.showInformation(TRANSLATE(sizeNotSupported), true);
+ this._errorMessageBS.next(sizeNotSupported);
} else {
- this._notificationService.showInformation(TRANSLATE("notification.file.visualizer.file.notsupported"), true);
+ const notSupportedMessage = "notification.file.visualizer.file.notsupported";
+ this._notificationService.showInformation(TRANSLATE(notSupportedMessage), true);
+ this._errorMessageBS.next(notSupportedMessage);
}
return;
}
diff --git a/src/app/shared/filevisualizer/services/image-file-visualizer.service.ts b/src/app/shared/filevisualizer/services/image-file-visualizer.service.ts
index f3ed5d3e25f20da8501d4a5d6ff22606bef16756..e0fb4e6856a474586e4ba2579ce6c74bd68231ed 100644
--- a/src/app/shared/filevisualizer/services/image-file-visualizer.service.ts
+++ b/src/app/shared/filevisualizer/services/image-file-visualizer.service.ts
@@ -63,7 +63,7 @@ export class ImageFileVisualizerService implements AbstractFileVisualizer {
const url = URL.createObjectURL(fileInfo.blob);
this.img.src = url;
this.img.style.objectFit = "contain";
- this.img.height = 500;
+ this.img.height = 404;
this.img.width = 500;
domElement.appendChild(this.img);
domElement.classList.add("zoom-in");
diff --git a/src/app/shared/filevisualizer/services/mol-file-visualizer.service.ts b/src/app/shared/filevisualizer/services/mol-file-visualizer.service.ts
index 0a7911423f017a02e38c98d5140e1b924cdbc486..1098192ee177a42e6242f2936fe8d09a1bacdd98 100644
--- a/src/app/shared/filevisualizer/services/mol-file-visualizer.service.ts
+++ b/src/app/shared/filevisualizer/services/mol-file-visualizer.service.ts
@@ -66,7 +66,7 @@ export class MolFileVisualizerService implements AbstractFileVisualizer {
const html = "<script src=\"./assets/jsmol/JSmol.min.js\" type=\"text/javascript\"></script>" +
"<script>var info = {\n" +
" color: \"#FFFFFF\",\n" +
- " height: 450,\n" +
+ " height: 375,\n" +
" width: 450,\n" +
" script: \"set antialiasDisplay true;load " + molUrl + " ;cartoon on;color cartoon structure;rotate z 118.48; rotate y 117.66; rotate z -47.64;;\",\n" +
" use: \"HTML5\",\n" +
@@ -82,7 +82,7 @@ export class MolFileVisualizerService implements AbstractFileVisualizer {
iframe.contentWindow.document.write(html);
iframe.contentWindow.document.close();
iframe.width = "500px";
- iframe.height = "500px";
+ iframe.height = "404";
iframe.style.border = "0";
}
diff --git a/src/app/shared/filevisualizer/services/video-classical-file-visualizer.service.ts b/src/app/shared/filevisualizer/services/video-classical-file-visualizer.service.ts
index 6a669de4aa632510c962d29eea6ae9ec7edb7a39..edfe853ae7184054acedcdba312d7fc43676b5a6 100644
--- a/src/app/shared/filevisualizer/services/video-classical-file-visualizer.service.ts
+++ b/src/app/shared/filevisualizer/services/video-classical-file-visualizer.service.ts
@@ -72,7 +72,7 @@ export class VideoClassicalFileVisualizerService implements AbstractFileVisualiz
}
autoResizeElement(): void {
- this.video.height = 500;
+ this.video.height = 404;
this.video.width = 500;
this.video.style.objectFit = "contain";
}
diff --git a/src/assets/i18n/de.json b/src/assets/i18n/de.json
index 66209c1eedfa9b076dfeb43dd6db3c8f70384f76..da8f3aba1a5a7450725a7eb865ef5e0fec840578 100644
--- a/src/assets/i18n/de.json
+++ b/src/assets/i18n/de.json
@@ -1228,6 +1228,7 @@
"goToEdit": "Edit",
"goToReceivedRequestNotification": "See received request",
"goToSentRequestNotification": "See request sent",
+ "info": "Informations",
"history": "History",
"move": "Move",
"resume": "Resume",
diff --git a/src/assets/i18n/en.json b/src/assets/i18n/en.json
index decedd1ab046e1004218acec402ad6573f630ba9..0928337ed756bee14875a99d61ecf3cfad0930ca 100644
--- a/src/assets/i18n/en.json
+++ b/src/assets/i18n/en.json
@@ -1228,6 +1228,7 @@
"goToEdit": "Edit",
"goToReceivedRequestNotification": "See received request",
"goToSentRequestNotification": "See request sent",
+ "info": "Informations",
"history": "History",
"move": "Move",
"resume": "Resume",
diff --git a/src/assets/i18n/fr.json b/src/assets/i18n/fr.json
index 0bedde76601a53444275a11d9a2f0a7fe32c5333..98d2eec06a66c41652646df7f0ffc505f301307a 100644
--- a/src/assets/i18n/fr.json
+++ b/src/assets/i18n/fr.json
@@ -1228,6 +1228,7 @@
"goToEdit": "Modifier",
"goToReceivedRequestNotification": "Voir les requêtes reçues",
"goToSentRequestNotification": "Voir les requêtes envoyées",
+ "info": "Informations",
"history": "Historique",
"move": "Déplacer",
"resume": "Relancer",