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

RED-8748 - WIP on component management view

Browse Source
This commit is contained in:
Valentin Mihai 2024-04-12 13:29:48 +03:00
parent 09fce959d4
commit 7c940010fd
9 changed files with 82 additions and 51 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
apps/red-ui/src/app/modules/file-preview/components/documine-export/documine-export.component.html
View File

@ -2,6 +2,16 @@
{{ 'documine-export.document' | translate }}
</button>
<button [matTooltipPosition]="'above'" [matTooltip]="'documine-export.export-tooltip' | translate" class="red-tab">
<button
[matMenuTriggerFor]="bulkComponentDownloadMenu"
[matTooltipPosition]="'above'"
[matTooltip]="'documine-export.export-tooltip' | translate"
class="red-tab"
>
{{ 'documine-export.export' | translate }}
</button>
<mat-menu #bulkComponentDownloadMenu="matMenu">
<button (click)="downloadComponentAsJSON()" [innerHTML]="'component-download.json' | translate" mat-menu-item></button>
<button (click)="downloadComponentAsXML()" [innerHTML]="'component-download.xml' | translate" mat-menu-item></button>
</mat-menu>

19
apps/red-ui/src/app/modules/file-preview/components/documine-export/documine-export.component.ts
View File

@ -1,7 +1,22 @@
import { Component } from '@angular/core';
import { Component, Input } from '@angular/core';
import { firstValueFrom } from 'rxjs';
import { Dossier } from '@red/domain';
import { ComponentLogService } from '@services/files/component-log.service';
@Component({
selector: 'redaction-documine-export',
templateUrl: './documine-export.component.html',
})
export class DocumineExportComponent {}
export class DocumineExportComponent {
@Input() dossier: Dossier;
constructor(private readonly _componentLogService: ComponentLogService) {}
downloadComponentAsJSON() {
return firstValueFrom(this._componentLogService.exportJSON(this.dossier.dossierTemplateId, this.dossier.dossierId));
}
async downloadComponentAsXML() {
return firstValueFrom(this._componentLogService.exportXML(this.dossier.dossierTemplateId, this.dossier.dossierId));
}
}

2
apps/red-ui/src/app/modules/file-preview/components/file-header/file-header.component.html
View File

@ -1,7 +1,7 @@
<div class="page-header">
<div class="flex">
<redaction-view-switch *ngIf="!isDocumine"></redaction-view-switch>
<redaction-documine-export *ngIf="isDocumine"></redaction-documine-export>
<redaction-documine-export *ngIf="isDocumine" [dossier]="state.dossier()"></redaction-documine-export>
</div>
<!-- TODO: mode this file preview header to a separate component-->

10
apps/red-ui/src/app/modules/file-preview/components/structured-component-management/structured-component-management.component.html
View File

@ -3,6 +3,16 @@
<iqser-popup-filter [primaryFiltersSlug]="'primaryFilters'" [secondaryFiltersSlug]="'secondaryFilters'"></iqser-popup-filter>
</div>
<div *ngIf="componentLogData() as componentLogEntries" class="table">
<div class="table-header">{{ 'component-management.table-header.component' | translate }}</div>
<div class="table-header">{{ 'component-management.table-header.value' | translate }}</div>
<ng-container *ngFor="let entry of componentLogEntries">
<div>{{ entry.name }}</div>
<div>{{ entry.componentValues[0].value ?? entry.componentValues[0].originalValue }}</div>
</ng-container>
</div>
<!--<div *ngIf="componentLogData() as componentLogEntries" class="table output-data">-->
<!-- <div class="table-header">{{ 'component-log-dialog.table-header.component' | translate }}</div>-->
<!-- <div class="table-header">{{ 'component-log-dialog.table-header.value' | translate }}</div>-->

30
apps/red-ui/src/app/modules/file-preview/components/structured-component-management/structured-component-management.component.scss
View File

@ -6,7 +6,7 @@
min-height: 36px;
background: var(--iqser-grey-8);
border-bottom: 1px solid var(--iqser-separator);
padding: 0 10px;
padding: 0 10px 0 26px;
::ng-deep span {
color: var(--iqser-text);
@ -16,6 +16,34 @@
}
}
.table {
display: grid;
grid-template-columns: 40% 1fr;
font-size: 12px;
overflow: scroll;
height: calc(100% - 40px);
div {
padding: 10px 0 10px 0;
&:not(:nth-last-child(-n + 2)) {
border-bottom: 1px solid var(--iqser-separator);
}
&:nth-of-type(odd) {
margin-left: 26px;
}
&:nth-of-type(even) {
margin-right: 26px;
}
}
.table-header {
font-weight: 600;
}
}
//.rss-row {
// display: flex;
// flex-direction: row;

18
apps/red-ui/src/assets/i18n/redact/de.json
View File

@ -498,20 +498,12 @@
"tooltip": "",
"xml": ""
},
"component-log-dialog": {
"actions": {
"cancel-edit": "Cancel",
"edit": "Edit",
"save": "Save",
"undo": "Undo to: {value}"
},
"table-header": {
"component": "Component",
"value": "Value"
}
},
"component-management": {
"components": ""
"components": "",
"table-header": {
"component": "",
"value": ""
}
},
"component-rules-screen": {
"error": {

12
apps/red-ui/src/assets/i18n/redact/en.json
View File

@ -498,21 +498,13 @@
"tooltip": "",
"xml": ""
},
"component-log-dialog": {
"actions": {
"cancel-edit": "Cancel",
"edit": "Edit",
"save": "Save",
"undo": "Undo to: {value}"
},
"component-management": {
"components": "Components",
"table-header": {
"component": "Component",
"value": "Value"
}
},
"component-management": {
"components": "Components"
},
"component-rules-screen": {
"error": {
"generic": ""

18
apps/red-ui/src/assets/i18n/scm/de.json
View File

@ -498,20 +498,12 @@
"tooltip": "Component download",
"xml": "Download as XML"
},
"component-log-dialog": {
"actions": {
"cancel-edit": "Cancel",
"edit": "Edit",
"save": "Save",
"undo": "Undo"
},
"table-header": {
"component": "Component",
"value": "Value"
}
},
"component-management": {
"components": ""
"components": "",
"table-header": {
"component": "",
"value": ""
}
},
"component-rules-screen": {
"error": {

12
apps/red-ui/src/assets/i18n/scm/en.json
View File

@ -498,21 +498,13 @@
"tooltip": "Component download",
"xml": "Download as XML"
},
"component-log-dialog": {
"actions": {
"cancel-edit": "Cancel",
"edit": "Edit",
"save": "Save",
"undo": "Undo to: {value}"
},
"component-management": {
"components": "Components",
"table-header": {
"component": "Component",
"value": "Value"
}
},
"component-management": {
"components": "Components"
},
"component-rules-screen": {
"error": {
"generic": "Something went wrong... Component rules update failed!"