#8337 - Added export button in dataset and dmp editors

1. dataset-profile-editor.component.html: Updated how save button appears (save separated from arrow).
2. dataset-profile-editor.component.scss: Commented paddings from .template_action_btn.
3. dataset-wizard.component.html: Added export button | Updated how save button appears (save separated from arrow).
4. dataset-wizard.component.scss: Added class .dataset-export-btn.
5. dmp-editor.component.html: Added export button.
6. dmp-editor.component.scss: Added class .dmp-export-btn.
7. i18n/: Added in language files properties for disabled export button inside editors (DMP-EDITOR.ACTIONS.DISABLED-EXPORT, DATASET-EDITOR.ACTIONS.DISABLED-EXPORT).
This commit is contained in:
Konstantina Galouni 2023-01-20 18:53:54 +02:00
parent 455e3c8fe0
commit a1dbd72bce
16 changed files with 137 additions and 37 deletions

View File

@ -468,9 +468,20 @@
<ng-template #actions>
<div>
<button mat-raised-button class="template_action_btn mr-3" (click)="discardChanges()">{{'DATASET-WIZARD.ACTIONS.CLOSE' | translate}}</button>
<button *ngIf="!viewOnly && form.get('status').value!=1" mat-raised-button class="template_action_btn save-btn" (click)="onSubmit()" [disabled]="!form.valid">
{{'DATASET-PROFILE-EDITOR.ACTIONS.SAVE' |translate}}
<mat-icon (click)="$event.stopPropagation();" style="width: 14px;" [matMenuTriggerFor]="menuSave">expand_more</mat-icon>
<!-- <button *ngIf="!viewOnly && form.get('status').value!=1" mat-raised-button class="template_action_btn save-btn" (click)="onSubmit()" [disabled]="!form.valid">-->
<!-- {{'DATASET-PROFILE-EDITOR.ACTIONS.SAVE' |translate}}-->
<!-- <mat-icon (click)="$event.stopPropagation();" style="width: 14px;" [matMenuTriggerFor]="menuSave">expand_more</mat-icon>-->
<!-- </button>-->
<button *ngIf="!viewOnly && form.get('status').value!=1" [disabled]="!form.valid"
mat-raised-button class="template_action_btn save-btn" type="button">
<span class="d-flex flex-row row">
<span (click)="onSubmit()" class="col">{{'DATASET-PROFILE-EDITOR.ACTIONS.SAVE' |translate}}</span>
<mat-divider [vertical]="true"></mat-divider>
<span class="align-items-center justify-content-center col-4 d-flex"
(click)="$event.stopPropagation();" [matMenuTriggerFor]="menuSave">
<mat-icon >expand_more</mat-icon>
</span>
</span>
</button>
<mat-menu #menuSave="matMenu">
<button [disabled]="!form.valid" mat-menu-item (click)="onSubmit(true)" type="button">{{ 'DATASET-PROFILE-EDITOR.ACTIONS.SAVE-AND-CLOSE' | translate }}</button>

View File

@ -133,17 +133,19 @@ $blue-color-light: #5cf7f2;
border-radius: 30px;
border: 1px solid #129D99;
background: transparent;
padding-left: 2em;
padding-right: 2em;
//padding-left: 2em;
//padding-right: 2em;
height: 2.5em;
min-width: 110px;
width: auto;
box-shadow: 0px 3px 6px #1E202029;
color: #129D99;
flex: 0 0 auto;
&.save-btn{
background-color: #f7dd72;
border: 1px solid transparent;
padding-left: 2em;
padding-right: 2em;
//padding-left: 2em;
//padding-right: 2em;
box-shadow: 0px 3px 6px #1E202029;
color: #212121;

View File

@ -27,15 +27,49 @@
</div>
</div>
<div class="row">
<div class="col-auto d-flex align-items-center p-0" *ngIf="!viewOnly">
<button [disabled]="saving" *ngIf="isDirty()" type="button" mat-raised-button class="dataset-discard-btn" (click)="discardChanges()">
<div class="col-auto d-flex align-items-center">
<button *ngIf="formGroup.get('id').value" [disabled]="isDirty()" [matTooltipDisabled]="!isDirty()"
mat-raised-button class="dataset-export-btn" type="button"
[matMenuTriggerFor]="exportMenu" (click)="$event.stopPropagation();"
[matTooltip]="'DATASET-EDITOR.ACTIONS.DISABLED-EXPORT' | translate">
{{ 'DMP-LISTING.ACTIONS.EXPORT' | translate }}
<mat-icon [disabled]="isDirty()" style="width: 14px;">expand_more</mat-icon>
</button>
<mat-menu #exportMenu="matMenu" xPosition="before">
<button mat-menu-item (click)="downloadPDF(formGroup.get('id').value)">
<i class="fa fa-file-pdf-o pr-2"></i>
<span>{{'GENERAL.FILE-TYPES.PDF' | translate}}</span>
</button>
<button mat-menu-item (click)="downloadDOCX(formGroup.get('id').value)">
<i class="fa fa-file-word-o pr-2"></i>
<span>{{'GENERAL.FILE-TYPES.DOC' | translate}}</span>
</button>
<button mat-menu-item (click)="downloadXML(formGroup.get('id').value)">
<i class="fa fa-file-code-o pr-2"></i>
<span>{{'GENERAL.FILE-TYPES.XML' | translate}}</span>
</button>
</mat-menu>
</div>
<mat-divider *ngIf="formGroup.get('id').value && (!viewOnly || (!lockStatus && !viewOnly) || lockStatus || (hasReversableStatus() && !lockStatus))"
[vertical]="true" class="ml-2 mr-2"></mat-divider>
<div *ngIf="isDirty() && !viewOnly" class="col-auto d-flex align-items-center pr-0">
<button [disabled]="saving" type="button" mat-raised-button class="dataset-discard-btn" (click)="discardChanges()">
{{'DMP-EDITOR.ACTIONS.DISCARD' | translate}}
</button>
</div>
<div class="col-auto d-flex align-items-center">
<button [disabled]="saving" *ngIf="!lockStatus && !viewOnly" mat-raised-button class="dataset-save-btn mr-2" type="button" (click)="save()">
{{ 'DATASET-WIZARD.ACTIONS.SAVE' | translate }}
<mat-icon [disabled]="saving" (click)="$event.stopPropagation();" style="width: 14px;" [matMenuTriggerFor]="menu">expand_more</mat-icon>
<button [disabled]="saving" *ngIf="!lockStatus && !viewOnly" mat-raised-button
class="dataset-save-btn mr-2" type="button">
<span class="d-flex flex-row row">
<span (click)="save()" class="col">{{ 'DATASET-WIZARD.ACTIONS.SAVE' | translate }}</span>
<mat-divider [vertical]="true"></mat-divider>
<span class="align-items-center justify-content-center col-4 d-flex"
(click)="$event.stopPropagation();" [matMenuTriggerFor]="menu">
<mat-icon >expand_more</mat-icon>
</span>
</span>
</button>
<mat-menu #menu="matMenu">
<button [disabled]="saving" mat-menu-item (click)="save(saveAnd.close)" type="button">{{ 'DATASET-WIZARD.ACTIONS.SAVE-AND-CLOSE' | translate }}</button>

View File

@ -208,7 +208,7 @@
align-items: center;
}
.dataset-save-btn {
.dataset-save-btn, .dataset-export-btn {
background: #ffffff 0% 0% no-repeat padding-box;
border-radius: 30px;
opacity: 1;

View File

@ -11,6 +11,38 @@
<div class="subtitle">{{ formGroup.get('label').value }} <span *ngIf="isDirty()" class="changes">({{'DMP-EDITOR.CHANGES' | translate}})</span></div>
</div>
<div class="ml-auto d-flex flex-row">
<div class="col-auto d-flex align-items-center">
<button *ngIf="formGroup.get('id').value" [disabled]="isDirty()" [matTooltipDisabled]="!isDirty()"
mat-raised-button class="dmp-export-btn" type="button"
[matMenuTriggerFor]="exportMenu" (click)="$event.stopPropagation();"
[matTooltip]="'DMP-EDITOR.ACTIONS.DISABLED-EXPORT' | translate">
{{ 'DMP-LISTING.ACTIONS.EXPORT' | translate }}
<mat-icon [disabled]="isDirty()" style="width: 14px;">expand_more</mat-icon>
</button>
<mat-menu #exportMenu="matMenu" xPosition="before">
<button mat-menu-item (click)="downloadPDF(formGroup.get('id').value)">
<i class="fa fa-file-pdf-o pr-2"></i>
<span>{{'GENERAL.FILE-TYPES.PDF' | translate}}</span>
</button>
<button mat-menu-item (click)="downloadDocx(formGroup.get('id').value)">
<i class="fa fa-file-word-o pr-2"></i>
<span>{{'GENERAL.FILE-TYPES.DOC' | translate}}</span>
</button>
<button mat-menu-item (click)="downloadXml(formGroup.get('id').value)">
<i class="fa fa-file-code-o pr-2"></i>
<span>{{'GENERAL.FILE-TYPES.XML' | translate}}</span>
</button>
<button mat-menu-item (click)="downloadJson(formGroup.get('id').value)">
<i class="fa fa-file-o pr-2"></i>
<span>{{'GENERAL.FILE-TYPES.JSON' | translate}}</span>
</button>
</mat-menu>
</div>
<mat-divider *ngIf="formGroup.get('id').value && (isDirty() || isNew || (!isNew && formGroup.enabled && !lockStatus) || lockStatus)"
[vertical]="true" class="ml-2 mr-2"></mat-divider>
<div class="col-auto d-flex align-items-center">
<button [disabled]="saving" *ngIf="isDirty()" type="button" mat-raised-button class="discard-btn mr-3" (click)="discardChanges()">
{{'DMP-EDITOR.ACTIONS.DISCARD' | translate}}
</button>
@ -23,6 +55,7 @@
</button>
</div>
<button *ngIf="lockStatus" mat-raised-button disabled class="dataset-save-btn cursor-default" type="button">{{ 'DMP-OVERVIEW.LOCKED' | translate}}</button>
</div>
</div>
</div>
</div>

View File

@ -157,8 +157,8 @@ a:hover {
align-items: center;
}
.save-btn {
background: #ffffff 0% 0% no-repeat padding-box;
.save-btn, .dmp-export-btn {
background: #ffffff 0% 0% no-repeat padding-box !important;
border-radius: 30px;
opacity: 1;
width: 110px;

View File

@ -1069,7 +1069,8 @@
"LOCK": "DMP ist durch einen anderen Benutzer gesperrt",
"PERMISSION": "Sie sind nicht berechtigt, diesen DMP zu bearbeiten",
"INSERT-MANUALLY": "Insert it manually",
"CREATE-DATASET": "Create new one"
"CREATE-DATASET": "Create new one",
"DISABLED-EXPORT": "Please save your changes to export this DMP"
},
"PLACEHOLDER": {
"DESCRIPTION": "Fill with description",
@ -1278,7 +1279,8 @@
"DISCARD-EDITED-MESSAGE": "All unsaved changes will be reverted to their initial state and you will be redirected back to DMP Editor. Would you like to proceed?",
"DISCARD-EDITED-CONFIRM": "Yes, revert changes and go back.",
"DISCARD-EDITED-DENY": "No."
}
},
"DISABLED-EXPORT": "Please save your changes to export this Dataset"
},
"PLACEHOLDER": {
"DESCRIPTION": "Fill with description",

View File

@ -1069,7 +1069,8 @@
"LOCK": "DMP is locked by another user",
"PERMISSION": "You have no permission to edit this DMP",
"INSERT-MANUALLY": "Insert it manually",
"CREATE-DATASET": "Create new one"
"CREATE-DATASET": "Create new one",
"DISABLED-EXPORT": "Please save your changes to export this DMP"
},
"PLACEHOLDER": {
"DESCRIPTION": "Fill with description",
@ -1278,7 +1279,8 @@
"DISCARD-EDITED-MESSAGE": "All unsaved changes will be reverted to their initial state and you will be redirected back to DMP Editor. Would you like to proceed?",
"DISCARD-EDITED-CONFIRM": "Yes, revert changes and go back.",
"DISCARD-EDITED-DENY": "No."
}
},
"DISABLED-EXPORT": "Please save your changes to export this Dataset"
},
"PLACEHOLDER": {
"DESCRIPTION": "Fill with description",

View File

@ -1069,7 +1069,8 @@
"LOCK": "El PGD ha sido bloqueado por otro usuario",
"PERMISSION": "No tiene permisos para editar este PGD",
"INSERT-MANUALLY": "Insértelo de forma manual",
"CREATE-DATASET": "Crear uno nuevo"
"CREATE-DATASET": "Crear uno nuevo",
"DISABLED-EXPORT": "Please save your changes to export this DMP"
},
"PLACEHOLDER": {
"DESCRIPTION": "Rellenar con la descripción",
@ -1278,7 +1279,8 @@
"DISCARD-EDITED-MESSAGE": "Todos los cambios no grabados volverán a su estado inicial y será redireccionado al editor de PGD. ¿Desea continuar?",
"DISCARD-EDITED-CONFIRM": "Sí, descartar los cambios y volver.",
"DISCARD-EDITED-DENY": "No."
}
},
"DISABLED-EXPORT": "Please save your changes to export this Dataset"
},
"PLACEHOLDER": {
"DESCRIPTION": "Rellenar con la descripción",

View File

@ -1069,7 +1069,8 @@
"LOCK": "Κλειδωμένο Σχέδιο Διαχείρισης Δεδομένων",
"PERMISSION": "Δεν έχετε άδεια να επεξεργαστείτε αυτό το Σχέδιο Διαχείρισης Δεδομένων",
"INSERT-MANUALLY": "Εισάγετε το χειροκίνητα",
"CREATE-DATASET": "Δημιούργια νέου"
"CREATE-DATASET": "Δημιούργια νέου",
"DISABLED-EXPORT": "Παρακαλώ αποθηκεύστε τις αλλαγές σας για να εξάγετε αυτό το Σχέδιο Διαχείρισης Δεδομένων"
},
"PLACEHOLDER": {
"DESCRIPTION": "Συμπληρώστε με περιγραφή",
@ -1278,7 +1279,8 @@
"DISCARD-EDITED-MESSAGE": "All unsaved changes will be reverted to their initial state and you will be redirected back to DMP Editor. Would you like to proceed?",
"DISCARD-EDITED-CONFIRM": "Yes, revert changes and go back.",
"DISCARD-EDITED-DENY": "No."
}
},
"DISABLED-EXPORT": "Παρακαλώ αποθηκεύστε τις αλλαγές σας για να εξάγετε αυτό το Σύνολο Δεδομένων"
},
"PLACEHOLDER": {
"DESCRIPTION": "Συμπληρώστε με περιγραφή",

View File

@ -1069,7 +1069,8 @@
"LOCK": "Plan upravljanja podacima je zaključan od strane drugog korisnika",
"PERMISSION": "Nemate ovlasti za uređivanje ovog Plana",
"INSERT-MANUALLY": "Ručni unos",
"CREATE-DATASET": "Kreirajte novi"
"CREATE-DATASET": "Kreirajte novi",
"DISABLED-EXPORT": "Please save your changes to export this DMP"
},
"PLACEHOLDER": {
"DESCRIPTION": "Dodajte opis",
@ -1278,7 +1279,8 @@
"DISCARD-EDITED-MESSAGE": "Sve nespremljene promjene bit će odbačene, podaci će se vratiti u izvorno stanje i bit ćete preusmjereni natrag na sučelje za uređivanje Plana. Želite li nastaviti?",
"DISCARD-EDITED-CONFIRM": "Da, odbaci promjene.",
"DISCARD-EDITED-DENY": "Ne."
}
},
"DISABLED-EXPORT": "Please save your changes to export this Dataset"
},
"PLACEHOLDER": {
"DESCRIPTION": "Unesite opis",

View File

@ -1069,8 +1069,9 @@
"LOCK": "DMP jest zablokowany przez innego użytkownika",
"PERMISSION": "Nie masz uprawnień do edycji tego DMP",
"INSERT-MANUALLY": "Wstaw ręcznie",
"CREATE-DATASET": "Utwórz nowy"
},
"CREATE-DATASET": "Utwórz nowy",
"DISABLED-EXPORT": "Please save your changes to export this DMP"
},
"PLACEHOLDER": {
"DESCRIPTION": "Dodaj opis",
"ORGANIZATION": "Wybierz organizację",
@ -1278,8 +1279,9 @@
"DISCARD-EDITED-MESSAGE": "Wszystkie niezapisane zmiany zostaną przywrócone do stanu początkowego i nastąpi przekierowanie z powrotem do Edytora DMP. Czy chcesz kontynuować?",
"DISCARD-EDITED-CONFIRM": "Tak, cofnij zmiany i wróć.",
"DISCARD-EDITED-DENY": "Nie"
}
},
},
"DISABLED-EXPORT": "Please save your changes to export this Dataset"
},
"PLACEHOLDER": {
"DESCRIPTION": "Wpisz opis",
"EXTERNAL-LINK": "Podaj zewnętrzny link URL"

View File

@ -1069,7 +1069,8 @@
"LOCK": "O PGD está bloqueado por outro utilizador",
"PERMISSION": "Não tem permissão para editar este PGD",
"INSERT-MANUALLY": "Inserir manualmente",
"CREATE-DATASET": "Criar um novo"
"CREATE-DATASET": "Criar um novo",
"DISABLED-EXPORT": "Please save your changes to export this DMP"
},
"PLACEHOLDER": {
"DESCRIPTION": "Preencha com a descrição",
@ -1278,7 +1279,8 @@
"DISCARD-EDITED-MESSAGE": "Todas as alterações irão ser descartadas e será redirecionado para o editor do PGD. Pretende continuar?",
"DISCARD-EDITED-CONFIRM": "Sim, reverter as alterações e voltar atrás.",
"DISCARD-EDITED-DENY": "Não"
}
},
"DISABLED-EXPORT": "Please save your changes to export this Dataset"
},
"PLACEHOLDER": {
"DESCRIPTION": "Preencher com descrição",

View File

@ -1069,7 +1069,8 @@
"LOCK": "DMP je zamknutý iným používateľom DMP",
"PERMISSION": "Na úpravu tohto DMP nemáte povolenie",
"INSERT-MANUALLY": "Doplniť manuálne",
"CREATE-DATASET": "Vytvoriť nový"
"CREATE-DATASET": "Vytvoriť nový",
"DISABLED-EXPORT": "Please save your changes to export this DMP"
},
"PLACEHOLDER": {
"DESCRIPTION": "Doplniť opis",
@ -1278,7 +1279,8 @@
"DISCARD-EDITED-MESSAGE": "All unsaved changes will be reverted to their initial state and you will be redirected back to DMP Editor. Would you like to proceed?",
"DISCARD-EDITED-CONFIRM": "Yes, revert changes and go back.",
"DISCARD-EDITED-DENY": "No."
}
},
"DISABLED-EXPORT": "Please save your changes to export this Dataset"
},
"PLACEHOLDER": {
"DESCRIPTION": "Doplniť opis",

View File

@ -1069,7 +1069,8 @@
"LOCK": "Plan upravljanja podacima je zaključao drugi korisnik",
"PERMISSION": "Nemate dozvolu da uređujete ovaj Plan",
"INSERT-MANUALLY": "Unesite ručno",
"CREATE-DATASET": "Kreirajte novi"
"CREATE-DATASET": "Kreirajte novi",
"DISABLED-EXPORT": "Please save your changes to export this DMP"
},
"PLACEHOLDER": {
"DESCRIPTION": "Dodajte opis",
@ -1278,7 +1279,8 @@
"DISCARD-EDITED-MESSAGE": "All unsaved changes will be reverted to their initial state and you will be redirected back to DMP Editor. Would you like to proceed?",
"DISCARD-EDITED-CONFIRM": "Yes, revert changes and go back.",
"DISCARD-EDITED-DENY": "No."
}
},
"DISABLED-EXPORT": "Please save your changes to export this Dataset"
},
"PLACEHOLDER": {
"DESCRIPTION": "Dopunite opisom",

View File

@ -1069,7 +1069,8 @@
"LOCK": "VYP başka bir kullanıcı tarafından kilitlendi",
"PERMISSION": "Bu VYP'nı düzenleme yetkiniz yok",
"INSERT-MANUALLY": "Manuel olarak ekle",
"CREATE-DATASET": "Yeni bir tane oluştur"
"CREATE-DATASET": "Yeni bir tane oluştur",
"DISABLED-EXPORT": "Please save your changes to export this DMP"
},
"PLACEHOLDER": {
"DESCRIPTION": "Açıklamaları Doldur",
@ -1278,7 +1279,8 @@
"DISCARD-EDITED-MESSAGE": "All unsaved changes will be reverted to their initial state and you will be redirected back to DMP Editor. Would you like to proceed?",
"DISCARD-EDITED-CONFIRM": "Yes, revert changes and go back.",
"DISCARD-EDITED-DENY": "No."
}
},
"DISABLED-EXPORT": "Please save your changes to export this Dataset"
},
"PLACEHOLDER": {
"DESCRIPTION": "Açıklamayla Doldur",