Merge branch 'dmp-refactoring' of code-repo.d4science.org:MaDgiK-CITE/argos into dmp-refactoring
This commit is contained in:
commit
eba8bc9cb6
|
|
@ -1,38 +1,38 @@
|
|||
<div class="row description-template-listing">
|
||||
<div class="col-md-8 offset-md-2">
|
||||
<div class="container-fluid">
|
||||
<div class="row description-template-listing">
|
||||
<div class="col-md-10 offset-md-1">
|
||||
<div class="row mb-4 mt-4">
|
||||
<div class="col">
|
||||
<h4>{{'DESCRIPTION-TEMPLATE-LISTING.TITLE' | translate}}</h4>
|
||||
<app-navigation-breadcrumb />
|
||||
|
||||
<div class="row mb-4 mt-3">
|
||||
<div class="col">
|
||||
<h4>{{'DESCRIPTION-TEMPLATE-LISTING.TITLE' | translate}}</h4>
|
||||
<app-navigation-breadcrumb />
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<button mat-raised-button class="import-btn" (click)="import()">
|
||||
<span class="button-text">
|
||||
{{'DESCRIPTION-TEMPLATE-LISTING.IMPORT.UPLOAD-XML' | translate}}
|
||||
</span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<button mat-raised-button class="import-btn" (click)="import()">
|
||||
<span class="button-text">
|
||||
{{'DESCRIPTION-TEMPLATE-LISTING.IMPORT.UPLOAD-XML' | translate}}
|
||||
</span>
|
||||
</button>
|
||||
<div class="col-auto">
|
||||
<button mat-raised-button class="create-btn" *ngIf="authService.hasPermission(authService.permissionEnum.EditDescriptionTemplate)" [routerLink]="['/description-templates/new']">
|
||||
<mat-icon>add</mat-icon>
|
||||
{{'DESCRIPTION-TEMPLATE-LISTING.CREATE-DESCRIPTION-TEMPLATE' | translate}}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-auto">
|
||||
<button mat-raised-button class="create-btn" *ngIf="authService.hasPermission(authService.permissionEnum.EditDescriptionTemplate)" [routerLink]="['/description-templates/new']">
|
||||
<mat-icon>add</mat-icon>
|
||||
{{'DESCRIPTION-TEMPLATE-LISTING.CREATE-DESCRIPTION-TEMPLATE' | translate}}
|
||||
</button>
|
||||
</div>
|
||||
<app-hybrid-listing [rows]="gridRows" [columns]="gridColumns" [visibleColumns]="visibleColumns" [count]="totalElements" [offset]="currentPageNumber" [limit]="lookup.page.size" [defaultSort]="lookup.order?.items" [externalSorting]="true" (rowActivated)="onRowActivated($event, '/description-templates')" (pageLoad)="alterPage($event)" (columnSort)="onColumnSort($event)" (columnsChanged)="onColumnsChanged($event)" [listItemTemplate]="listItemTemplate">
|
||||
|
||||
<app-description-template-listing-filters hybrid-listing-filters [(filter)]="lookup" (filterChange)="filterChanged($event)" />
|
||||
|
||||
<app-user-settings-picker [key]="userSettingsKey" [userPreference]="lookup" (onSettingSelected)="changeSetting($event)" [autoSelectUserSettings]="autoSelectUserSettings" user-preference-settings />
|
||||
<!-- <button mat-icon-button download-listing-report>
|
||||
<mat-icon>download</mat-icon>
|
||||
</button> -->
|
||||
</app-hybrid-listing>
|
||||
</div>
|
||||
|
||||
<app-hybrid-listing [rows]="gridRows" [columns]="gridColumns" [visibleColumns]="visibleColumns" [count]="totalElements" [offset]="currentPageNumber" [limit]="lookup.page.size" [defaultSort]="lookup.order?.items" [externalSorting]="true" (rowActivated)="onRowActivated($event, '/description-templates')" (pageLoad)="alterPage($event)" (columnSort)="onColumnSort($event)" (columnsChanged)="onColumnsChanged($event)" [listItemTemplate]="listItemTemplate">
|
||||
|
||||
<app-description-template-listing-filters hybrid-listing-filters [(filter)]="lookup" (filterChange)="filterChanged($event)" />
|
||||
|
||||
<app-user-settings-picker [key]="userSettingsKey" [userPreference]="lookup" (onSettingSelected)="changeSetting($event)" [autoSelectUserSettings]="autoSelectUserSettings" user-preference-settings />
|
||||
<!-- <button mat-icon-button download-listing-report>
|
||||
<mat-icon>download</mat-icon>
|
||||
</button> -->
|
||||
</app-hybrid-listing>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -4,9 +4,9 @@
|
|||
}
|
||||
|
||||
.description-template-listing {
|
||||
margin-top: 1.3rem;
|
||||
margin-left: 1rem;
|
||||
margin-right: 2rem;
|
||||
// margin-top: 1.3rem;
|
||||
// margin-left: 1rem;
|
||||
// margin-right: 2rem;
|
||||
|
||||
.mat-header-row {
|
||||
background: #f3f5f8;
|
||||
|
|
|
|||
|
|
@ -1,58 +1,60 @@
|
|||
<div class="row description-template-type-editor">
|
||||
<div class="col-md-8 offset-md-2 colums-gapped">
|
||||
<div class="container-fluid">
|
||||
<div class="row description-template-type-editor">
|
||||
<div class="col-md-10 offset-md-1 colums-gapped">
|
||||
|
||||
<div class="row justify-content-between align-items-center">
|
||||
<div class="col">
|
||||
<app-navigation-breadcrumb />
|
||||
<div class="row justify-content-between align-items-center mb-4 mt-4">
|
||||
<div class="col">
|
||||
<app-navigation-breadcrumb />
|
||||
</div>
|
||||
|
||||
<div class="col-auto">
|
||||
<button mat-button class="action-btn" (click)="cancel()" type="button">{{'DESCRIPTION-TEMPLATE-TYPE-EDITOR.ACTIONS.CANCEL' | translate}}</button>
|
||||
</div>
|
||||
<div class="col-auto" *ngIf="canDelete">
|
||||
<button mat-button (click)="delete()" class="action-btn" type="button">
|
||||
<mat-icon>delete</mat-icon>
|
||||
{{'DESCRIPTION-TEMPLATE-TYPE-EDITOR.ACTIONS.DELETE' | translate}}
|
||||
</button>
|
||||
</div>
|
||||
<div class="col-auto" *ngIf="canFinalize">
|
||||
<button mat-button class="action-btn" (click)="finalize(); formSubmit()">
|
||||
<mat-icon>save</mat-icon>
|
||||
{{'DESCRIPTION-TEMPLATE-TYPE-EDITOR.ACTIONS.FINALIZE' | translate}}
|
||||
</button>
|
||||
</div>
|
||||
<div class="col-auto" *ngIf="canSave">
|
||||
<button mat-button class="action-btn" (click)="save(); formSubmit()">
|
||||
<mat-icon>save</mat-icon>
|
||||
{{'DESCRIPTION-TEMPLATE-TYPE-EDITOR.ACTIONS.SAVE' | translate}}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-auto">
|
||||
<button mat-button class="action-btn" (click)="cancel()" type="button">{{'DESCRIPTION-TEMPLATE-TYPE-EDITOR.ACTIONS.CANCEL' | translate}}</button>
|
||||
</div>
|
||||
<div class="col-auto" *ngIf="canDelete">
|
||||
<button mat-button (click)="delete()" class="action-btn" type="button">
|
||||
<mat-icon>delete</mat-icon>
|
||||
{{'DESCRIPTION-TEMPLATE-TYPE-EDITOR.ACTIONS.DELETE' | translate}}
|
||||
</button>
|
||||
</div>
|
||||
<div class="col-auto" *ngIf="canFinalize">
|
||||
<button mat-button class="action-btn" (click)="finalize(); formSubmit()">
|
||||
<mat-icon>save</mat-icon>
|
||||
{{'DESCRIPTION-TEMPLATE-TYPE-EDITOR.ACTIONS.FINALIZE' | translate}}
|
||||
</button>
|
||||
</div>
|
||||
<div class="col-auto" *ngIf="canSave">
|
||||
<button mat-button class="action-btn" (click)="save(); formSubmit()">
|
||||
<mat-icon>save</mat-icon>
|
||||
{{'DESCRIPTION-TEMPLATE-TYPE-EDITOR.ACTIONS.SAVE' | translate}}
|
||||
</button>
|
||||
</div>
|
||||
<mat-card appearance="outlined">
|
||||
<mat-card-header>
|
||||
<mat-card-title *ngIf="isNew">{{'DESCRIPTION-TEMPLATE-TYPE-EDITOR.NEW' | translate}}</mat-card-title>
|
||||
</mat-card-header>
|
||||
<mat-card-content>
|
||||
<form (ngSubmit)="formSubmit()" [formGroup]="formGroup" *ngIf="formGroup">
|
||||
<div class="row">
|
||||
<div class="col-12 pt-1 pb-1">
|
||||
<span>
|
||||
{{'DESCRIPTION-TEMPLATE-TYPE-EDITOR.FIELDS.NAME' | translate}}
|
||||
</span>
|
||||
</div>
|
||||
<div class="col-12 mt-1">
|
||||
<mat-form-field class="w-100">
|
||||
<input matInput placeholder="{{'DESCRIPTION-TEMPLATE-TYPE-EDITOR.FIELDS.NAME' | translate}}" type="text" name="name" [formControl]="formGroup.get('name')" required>
|
||||
<mat-error *ngIf="formGroup.get('name').hasError('backendError')">
|
||||
{{formGroup.get('name').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('name').hasError('required')">
|
||||
{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</mat-card-content>
|
||||
</mat-card>
|
||||
</div>
|
||||
|
||||
<mat-card appearance="outlined">
|
||||
<mat-card-header>
|
||||
<mat-card-title *ngIf="isNew">{{'DESCRIPTION-TEMPLATE-TYPE-EDITOR.NEW' | translate}}</mat-card-title>
|
||||
</mat-card-header>
|
||||
<mat-card-content>
|
||||
<form (ngSubmit)="formSubmit()" [formGroup]="formGroup" *ngIf="formGroup">
|
||||
<div class="info-grid">
|
||||
<div class="info-grid-label">
|
||||
<span>
|
||||
{{'DESCRIPTION-TEMPLATE-TYPE-EDITOR.FIELDS.NAME' | translate}}
|
||||
</span>
|
||||
</div>
|
||||
<div class="info-grid-value">
|
||||
<mat-form-field class="col-lg-6">
|
||||
<input matInput placeholder="{{'DESCRIPTION-TEMPLATE-TYPE-EDITOR.FIELDS.NAME' | translate}}" type="text" name="name" [formControl]="formGroup.get('name')" required>
|
||||
<mat-error *ngIf="formGroup.get('name').hasError('backendError')">
|
||||
{{formGroup.get('name').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('name').hasError('required')">
|
||||
{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</mat-card-content>
|
||||
</mat-card>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
.description-template-type-editor {
|
||||
padding-top: 1em;
|
||||
// padding-top: 1em;
|
||||
|
||||
.editor-actions {
|
||||
margin-top: 30px;
|
||||
|
|
|
|||
|
|
@ -1,42 +1,43 @@
|
|||
<div class="row description-template-type-listing">
|
||||
<div class="col-md-8 offset-md-2">
|
||||
<div class="container-fluid">
|
||||
<div class="row description-template-type-listing">
|
||||
<div class="col-md-10 offset-md-1">
|
||||
<div class="row mb-4 mt-4">
|
||||
<div class="col">
|
||||
<h4>{{'DESCRIPTION-TEMPLATE-TYPE-LISTING.TITLE' | translate}}</h4>
|
||||
<app-navigation-breadcrumb />
|
||||
|
||||
<div class="row mb-4 mt-3">
|
||||
<div class="col">
|
||||
<h4>{{'DESCRIPTION-TEMPLATE-TYPE-LISTING.TITLE' | translate}}</h4>
|
||||
<app-navigation-breadcrumb />
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<button mat-raised-button class="create-btn"
|
||||
*ngIf="authService.hasPermission(authService.permissionEnum.EditDescriptionTemplateType)"
|
||||
[routerLink]="['/description-template-type/new']">
|
||||
<mat-icon>add</mat-icon>
|
||||
{{'DESCRIPTION-TEMPLATE-TYPE-LISTING.CREATE-TYPE' | translate}}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<button mat-raised-button class="create-btn"
|
||||
*ngIf="authService.hasPermission(authService.permissionEnum.EditDescriptionTemplateType)"
|
||||
[routerLink]="['/description-template-type/new']">
|
||||
<mat-icon>add</mat-icon>
|
||||
{{'DESCRIPTION-TEMPLATE-TYPE-LISTING.CREATE-TYPE' | translate}}
|
||||
</button>
|
||||
</div>
|
||||
<app-hybrid-listing [rows]="gridRows" [columns]="gridColumns" [visibleColumns]="visibleColumns"
|
||||
[count]="totalElements" [offset]="currentPageNumber" [limit]="lookup.page.size"
|
||||
[defaultSort]="lookup.order?.items" [externalSorting]="true" (rowActivated)="onRowActivated($event)"
|
||||
(pageLoad)="alterPage($event)" (columnSort)="onColumnSort($event)"
|
||||
(columnsChanged)="onColumnsChanged($event)" [listItemTemplate]="listItemTemplate">
|
||||
|
||||
<app-description-template-type-listing-filters hybrid-listing-filters [(filter)]="lookup"
|
||||
(filterChange)="filterChanged($event)" />
|
||||
|
||||
<app-user-settings-picker [key]="userSettingsKey" [userPreference]="lookup"
|
||||
(onSettingSelected)="changeSetting($event)" [autoSelectUserSettings]="autoSelectUserSettings"
|
||||
user-preference-settings />
|
||||
<!-- <button mat-icon-button download-listing-report>
|
||||
<mat-icon>download</mat-icon>
|
||||
</button> -->
|
||||
</app-hybrid-listing>
|
||||
</div>
|
||||
|
||||
<app-hybrid-listing [rows]="gridRows" [columns]="gridColumns" [visibleColumns]="visibleColumns"
|
||||
[count]="totalElements" [offset]="currentPageNumber" [limit]="lookup.page.size"
|
||||
[defaultSort]="lookup.order?.items" [externalSorting]="true" (rowActivated)="onRowActivated($event)"
|
||||
(pageLoad)="alterPage($event)" (columnSort)="onColumnSort($event)"
|
||||
(columnsChanged)="onColumnsChanged($event)" [listItemTemplate]="listItemTemplate">
|
||||
|
||||
<app-description-template-type-listing-filters hybrid-listing-filters [(filter)]="lookup"
|
||||
(filterChange)="filterChanged($event)" />
|
||||
|
||||
<app-user-settings-picker [key]="userSettingsKey" [userPreference]="lookup"
|
||||
(onSettingSelected)="changeSetting($event)" [autoSelectUserSettings]="autoSelectUserSettings"
|
||||
user-preference-settings />
|
||||
<!-- <button mat-icon-button download-listing-report>
|
||||
<mat-icon>download</mat-icon>
|
||||
</button> -->
|
||||
</app-hybrid-listing>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<ng-template #listItemTemplate let-item="item" let-isColumnSelected="isColumnSelected">
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
.description-template-type-listing {
|
||||
margin-top: 1.3rem;
|
||||
margin-left: 1rem;
|
||||
margin-right: 2rem;
|
||||
// margin-top: 1.3rem;
|
||||
// margin-left: 1rem;
|
||||
// margin-right: 2rem;
|
||||
|
||||
.mat-header-row{
|
||||
background: #f3f5f8;
|
||||
|
|
|
|||
|
|
@ -1,345 +1,338 @@
|
|||
<!-- <div class="main-content"> -->
|
||||
<div class="container-fluid dmp-blueprint-editor d-flex flex-column">
|
||||
<div class="row align-items-center mb-4" *ngIf="formGroup">
|
||||
<div class="col-auto">
|
||||
<h3 *ngIf="!isFinalized && !isNewVersion && isNew">{{'DMP-BLUEPRINT-EDITOR.TITLE.NEW' | translate}}</h3>
|
||||
<h3 *ngIf="!isClone && !isNewVersion && !isNew">{{formGroup.get('label').value}}</h3>
|
||||
<h3 *ngIf="isClone">
|
||||
<span>{{'DMP-BLUEPRINT-EDITOR.TITLE.CLONE' | translate}}</span>
|
||||
{{formGroup.get('label').value}}
|
||||
</h3>
|
||||
<h3 *ngIf="isNewVersion">
|
||||
<span>{{'DMP-BLUEPRINT-EDITOR.TITLE.NEW-VERSION' | translate}}</span>
|
||||
{{formGroup.get('label').value}}
|
||||
</h3>
|
||||
</div>
|
||||
<div class="col"></div>
|
||||
<div class="col-auto" *ngIf="!isNew">
|
||||
<button [disabled]="isLocked" mat-button class="action-btn" type="button" (click)="delete()">
|
||||
<mat-icon>delete</mat-icon>
|
||||
{{'DMP-BLUEPRINT-EDITOR.ACTIONS.DELETE' | translate}}
|
||||
</button>
|
||||
</div>
|
||||
<div class="col-auto" *ngIf="formGroup.get('status').value==1">
|
||||
<button mat-button class="finalize-btn" (click)="downloadXML()" type="button">{{'DMP-BLUEPRINT-EDITOR.ACTIONS.DOWNLOAD-XML' | translate }}</button>
|
||||
</div>
|
||||
<div *ngIf="formGroup.get('status').value!=1" class="col-auto">
|
||||
<button mat-button class="finalize-btn" (click)="finalize()" [disabled]="!this.isFormValid()" type="button">{{'DMP-BLUEPRINT-EDITOR.ACTIONS.FINALIZE' | translate }}</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="">
|
||||
<form *ngIf="formGroup" (ngSubmit)="formSubmit()">
|
||||
<mat-card class="pt-3 pb-3">
|
||||
<!-- <mat-card-header>
|
||||
<mat-card-title *ngIf="isNew">
|
||||
<h4>{{'DMP-BLUEPRINT-EDITOR.TITLE.NEW' | translate}}</h4>
|
||||
</mat-card-title>
|
||||
<mat-card-title *ngIf="!isNew">
|
||||
<h4>{{formGroup.get('label').value}}</h4>
|
||||
</mat-card-title>
|
||||
</mat-card-header> -->
|
||||
<mat-card-content>
|
||||
<div class="row">
|
||||
<div class="col-6">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.NAME' | translate}}</mat-label>
|
||||
<input matInput type="text" name="label" [formControl]="formGroup.get('label')" required>
|
||||
<mat-error *ngIf="formGroup.get('label').hasError('backendError')">{{formGroup.get('label').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('label').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<h4 class="col-12">{{'DMP-BLUEPRINT-EDITOR.FIELDS.SECTIONS' | translate}}</h4>
|
||||
<div class="container-fluid">
|
||||
<div class="row dmp-blueprint-editor">
|
||||
<div class="col-md-10 offset-md-1">
|
||||
<div class="row align-items-center mt-4 mb-4" *ngIf="formGroup">
|
||||
<div class="col-md col-12">
|
||||
<h3 *ngIf="!isFinalized && !isNewVersion && isNew">{{'DMP-BLUEPRINT-EDITOR.TITLE.NEW' | translate}}</h3>
|
||||
<h3 *ngIf="!isClone && !isNewVersion && !isNew">{{formGroup.get('label').value}}</h3>
|
||||
<h3 *ngIf="isClone">
|
||||
<span>{{'DMP-BLUEPRINT-EDITOR.TITLE.CLONE' | translate}}</span>
|
||||
{{formGroup.get('label').value}}
|
||||
</h3>
|
||||
<h3 *ngIf="isNewVersion">
|
||||
<span>{{'DMP-BLUEPRINT-EDITOR.TITLE.NEW-VERSION' | translate}}</span>
|
||||
{{formGroup.get('label').value}}
|
||||
</h3>
|
||||
</div>
|
||||
<div class="col-md-auto mb-md-0 col-12 mb-2" *ngIf="!isNew">
|
||||
<button [disabled]="isLocked" mat-button class="action-btn" type="button" (click)="delete()">
|
||||
<mat-icon>delete</mat-icon>
|
||||
{{'DMP-BLUEPRINT-EDITOR.ACTIONS.DELETE' | translate}}
|
||||
</button>
|
||||
</div>
|
||||
<div class="col-md-auto col-12" *ngIf="formGroup.get('status').value==1">
|
||||
<button mat-button class="finalize-btn" (click)="downloadXML()" type="button">{{'DMP-BLUEPRINT-EDITOR.ACTIONS.DOWNLOAD-XML' | translate }}</button>
|
||||
</div>
|
||||
<div *ngIf="formGroup.get('status').value!=1" class="col-auto">
|
||||
<button mat-button class="finalize-btn" (click)="finalize()" [disabled]="!this.isFormValid()" type="button">{{'DMP-BLUEPRINT-EDITOR.ACTIONS.FINALIZE' | translate }}</button>
|
||||
</div>
|
||||
</div>
|
||||
<form *ngIf="formGroup" (ngSubmit)="formSubmit()">
|
||||
<mat-card class="pt-3 pb-3">
|
||||
<mat-card-content>
|
||||
<div class="row">
|
||||
<div class="col-6">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.NAME' | translate}}</mat-label>
|
||||
<input matInput type="text" name="label" [formControl]="formGroup.get('label')" required>
|
||||
<mat-error *ngIf="formGroup.get('label').hasError('backendError')">{{formGroup.get('label').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('label').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<h4 class="col-12">{{'DMP-BLUEPRINT-EDITOR.FIELDS.SECTIONS' | translate}}</h4>
|
||||
|
||||
<div class="col-12" cdkDropList (cdkDropListDropped)="dropSections($event)">
|
||||
<div *ngFor="let section of formGroup.get('definition').get('sections').controls; let sectionIndex=index;" class="row mb-3" cdkDrag [cdkDragDisabled]="formGroup.disabled">
|
||||
<div class="col-12">
|
||||
<mat-card class="pt-3 pb-3">
|
||||
<mat-card-header>
|
||||
<div class="row mb-3 d-flex align-items-center">
|
||||
<div class="col-auto d-flex">
|
||||
<mat-card-title>{{'DMP-BLUEPRINT-EDITOR.FIELDS.SECTION-PREFIX' | translate}} {{sectionIndex + 1}}</mat-card-title>
|
||||
</div>
|
||||
<div class="col-auto d-flex"><mat-icon [ngClass]="{'drag-handle-disabled': formGroup.disabled}" cdkDragHandle class="drag-handle">drag_indicator</mat-icon></div>
|
||||
<div class="col-12" cdkDropList (cdkDropListDropped)="dropSections($event)">
|
||||
<div *ngFor="let section of formGroup.get('definition').get('sections').controls; let sectionIndex=index;" class="row mb-3" cdkDrag [cdkDragDisabled]="formGroup.disabled">
|
||||
<div class="col-12">
|
||||
<mat-card class="pt-3 pb-3">
|
||||
<mat-card-header>
|
||||
<div class="row mb-3 d-flex align-items-center">
|
||||
<div class="col-auto d-flex">
|
||||
<mat-card-title>{{'DMP-BLUEPRINT-EDITOR.FIELDS.SECTION-PREFIX' | translate}} {{sectionIndex + 1}}</mat-card-title>
|
||||
</div>
|
||||
<div class="col-auto d-flex"><mat-icon [ngClass]="{'drag-handle-disabled': formGroup.disabled}" cdkDragHandle class="drag-handle">drag_indicator</mat-icon></div>
|
||||
|
||||
<div class="col-auto d-flex">
|
||||
<button mat-icon-button class="action-list-icon" matTooltip="{{'DMP-BLUEPRINT-EDITOR.ACTIONS.REMOVE-SECTION' | translate}}" (click)="removeSection(sectionIndex)" [disabled]="formGroup.disabled">
|
||||
<mat-icon>delete</mat-icon>
|
||||
</button>
|
||||
<div class="col-auto d-flex">
|
||||
<button mat-icon-button class="action-list-icon" matTooltip="{{'DMP-BLUEPRINT-EDITOR.ACTIONS.REMOVE-SECTION' | translate}}" (click)="removeSection(sectionIndex)" [disabled]="formGroup.disabled">
|
||||
<mat-icon>delete</mat-icon>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</mat-card-header>
|
||||
<mat-card-content>
|
||||
<div class="row">
|
||||
<div class="col-6">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.SECTION-NAME' | translate}}</mat-label>
|
||||
<input matInput type="text" name="label" [formControl]="section.get('label')" required>
|
||||
<mat-error *ngIf="section.get('label').hasError('backendError')">{{section.get('label').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="section.get('label').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</mat-card-header>
|
||||
<mat-card-content>
|
||||
<div class="row">
|
||||
<div class="col-6">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.SECTION-NAME' | translate}}</mat-label>
|
||||
<input matInput type="text" name="label" [formControl]="section.get('label')" required>
|
||||
<mat-error *ngIf="section.get('label').hasError('backendError')">{{section.get('label').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="section.get('label').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.SECTION-DESCRIPTION' | translate}}</mat-label>
|
||||
<input matInput type="text" name="description" [formControl]="section.get('description')">
|
||||
<mat-error *ngIf="section.get('description').hasError('backendError')">{{section.get('description').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="section.get('description').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-auto mb-3">
|
||||
<button mat-button class="action-btn" type="button" (click)="addField(sectionIndex)" [disabled]="formGroup.disabled">{{'DMP-BLUEPRINT-EDITOR.ACTIONS.ADD-FIELD' | translate}}</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.SECTION-DESCRIPTION' | translate}}</mat-label>
|
||||
<input matInput type="text" name="description" [formControl]="section.get('description')">
|
||||
<mat-error *ngIf="section.get('description').hasError('backendError')">{{section.get('description').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="section.get('description').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
<div class="row">
|
||||
<div cdkDropList class="col-12 mt-3" (cdkDropListDropped)="dropFields($event, sectionIndex)">
|
||||
<div *ngFor="let field of section.get('fields').controls; let fieldIndex=index;" cdkDrag class="section-fields-wrapper row align-items-center mt-1" [cdkDragDisabled]="formGroup.disabled" (mouseenter)="onSectionHover(fieldIndex)" (mouseleave)="clearHoveredSection()">
|
||||
<div class="col-auto section-options-vertical">
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-auto">
|
||||
<span *ngIf="!isSectionSelected(fieldIndex)" style="font-size: 18px; box-sizing: border-box; display: inline-block; padding: 0.85rem 0.42rem 0 0.45rem;">{{fieldIndex + 1}}</span>
|
||||
<mat-icon *ngIf="isSectionSelected(fieldIndex)" [ngClass]="{'drag-handle-disabled': formGroup.disabled}" cdkDragHandle class="drag-handle" style="margin-top: 0.9rem;">drag_indicator</mat-icon>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<button mat-icon-button matTooltip="{{'DMP-BLUEPRINT-EDITOR.ACTIONS.REMOVE-FIELD' | translate}}" (click)="removeField(sectionIndex, fieldIndex)" [disabled]="formGroup.disabled">
|
||||
<mat-icon>delete</mat-icon>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-auto pr-0 section-options-horizontal">
|
||||
<span *ngIf="!isSectionSelected(fieldIndex)" style="font-size: 18px; box-sizing: border-box; display: inline-block; padding: 0.85rem 0.45rem;">{{fieldIndex + 1}}</span>
|
||||
<mat-icon *ngIf="isSectionSelected(fieldIndex)" [ngClass]="{'drag-handle-disabled': formGroup.disabled}" cdkDragHandle class="drag-handle">drag_indicator</mat-icon>
|
||||
</div>
|
||||
<div class="col">
|
||||
<div class="row">
|
||||
|
||||
<div class="col-12 col-xl-4">
|
||||
<mat-form-field class="mt-3 w-100">
|
||||
<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.CATEGORY' | translate}}</mat-label>
|
||||
<mat-select [formControl]="field.get('category')" [disabled]="field.disabled" (selectionChange)="fieldCategoryChanged(sectionIndex, fieldIndex)">
|
||||
<mat-option *ngFor="let fieldCategory of dmpBlueprintFieldCategoryEnum" [value]="fieldCategory">{{enumUtils.toDmpBlueprintFieldCategoryString(fieldCategory)}}</mat-option>
|
||||
</mat-select>
|
||||
<mat-error *ngIf="field.get('category').hasError('backendError')">{{field.get('category').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="field.get('category').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-12 col-xl-4" *ngIf="field.get('category').value === dmpBlueprintSectionFieldCategory.System">
|
||||
<mat-form-field class="mt-3 w-100">
|
||||
<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.SYSTEM-FIELD-TYPE' | translate}}</mat-label>
|
||||
<mat-select [formControl]="field.get('systemFieldType')" [disabled]="field.disabled">
|
||||
<mat-option *ngFor="let systemFieldType of dmpBlueprintSystemFieldTypeEnum" [disabled]="systemFieldDisabled(systemFieldType)" [value]="systemFieldType">{{enumUtils.toDmpBlueprintSystemFieldTypeString(systemFieldType)}}</mat-option>
|
||||
</mat-select>
|
||||
<mat-error *ngIf="field.get('systemFieldType').hasError('backendError')">{{field.get('systemFieldType').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="field.get('systemFieldType').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-12 col-xl-4" *ngIf="field.get('category').value === dmpBlueprintSectionFieldCategory.Extra">
|
||||
<mat-form-field class="mt-3 w-100">
|
||||
<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.DATA-TYPE' | translate}}</mat-label>
|
||||
<mat-select [formControl]="field.get('dataType')">
|
||||
<mat-option *ngFor="let extraFieldDataType of dmpBlueprintExtraFieldDataTypeEnum" [value]="extraFieldDataType">
|
||||
{{enumUtils.toDmpBlueprintExtraFieldDataTypeString(extraFieldDataType)}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
<mat-error *ngIf="field.get('dataType').hasError('backendError')">{{field.get('dataType').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="field.get('dataType').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-12 col-xl-4" *ngIf="field.get('category').value === dmpBlueprintSectionFieldCategory.ReferenceType">
|
||||
<mat-form-field class="mt-3 w-100">
|
||||
<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.REFERENCE-TYPE' | translate}}</mat-label>
|
||||
<app-single-auto-complete placeholder="{{'DMP-BLUEPRINT-EDITOR.FIELDS.REFERENCE-TYPE' | translate}}" [required]="true" [formControl]="field.get('referenceTypeId')" [configuration]="referenceTypeService.singleAutocompleteConfiguration"></app-single-auto-complete>
|
||||
<mat-error *ngIf="field.get('referenceTypeId').hasError('backendError')">{{field.get('referenceTypeId').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="field.get('referenceTypeId').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-12 col-xl-4" *ngIf="field.get('category').value != null">
|
||||
<mat-form-field class="mt-3 w-100">
|
||||
<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.FIELD-LABEL' | translate}}</mat-label>
|
||||
<input matInput type="text" name="label" [formControl]="field.get('label')">
|
||||
<mat-error *ngIf="field.get('label').hasError('backendError')">{{field.get('label').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="field.get('label').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-12 col-xl-4" *ngIf="field.get('category').value != null">
|
||||
<mat-form-field class="mt-3 w-100">
|
||||
<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.FIELD-PLACEHOLDER' | translate}}</mat-label>
|
||||
<input matInput type="text" name="placeholder" [formControl]="field.get('placeholder')">
|
||||
<mat-error *ngIf="field.get('placeholder').hasError('backendError')">{{field.get('placeholder').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="field.get('placeholder').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-12 col-xl-4" *ngIf="field.get('category').value != null">
|
||||
<mat-form-field class="mt-3 w-100">
|
||||
<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.FIELD-DESCRIPTION' | translate}}</mat-label>
|
||||
<input matInput type="text" name="description" [formControl]="field.get('description')">
|
||||
<mat-error *ngIf="field.get('description').hasError('backendError')">{{field.get('description').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="field.get('description').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-12 col-xl-4" *ngIf="field.get('category').value != null">
|
||||
<mat-form-field class="mt-3 w-100">
|
||||
<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.SEMANTICS' | translate}}</mat-label>
|
||||
<app-multiple-auto-complete placeholder="{{'DMP-BLUEPRINT-EDITOR.FIELDS.SEMANTICS' | translate}}" [hidePlaceholder]="true" [required]="false" [separatorKeysCodes]="separatorKeysCodes" [formControl]="field.get('semantics')" [configuration]="semanticsService.multipleAutocompleteConfiguration">
|
||||
</app-multiple-auto-complete>
|
||||
<mat-error *ngIf="field.get('semantics').hasError('backendError')">{{field.get('semantics').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="field.get('semantics').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 col-xl-auto">
|
||||
<div class="row">
|
||||
<div class="col-auto section-field" *ngIf="field.get('category').value != null">
|
||||
<mat-checkbox [disabled]="field.get('systemFieldType')?.value === dmpBlueprintSystemFieldType.Title || field.get('systemFieldType')?.value === dmpBlueprintSystemFieldType.Description" [formControl]="field.get('required')"><span>{{'DMP-BLUEPRINT-EDITOR.FIELDS.FIELD-REQUIRED' | translate}}</span></mat-checkbox>
|
||||
<mat-error *ngIf="field.get('required').hasError('backendError')">{{field.get('required').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="field.get('required').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</div>
|
||||
<div [hidden]="viewOnly" class="col-auto section-options-horizontal">
|
||||
<button mat-icon-button matTooltip="{{'DMP-BLUEPRINT-EDITOR.ACTIONS.REMOVE-FIELD' | translate}}" (click)="removeField(sectionIndex, fieldIndex)" [disabled]="formGroup.disabled">
|
||||
<mat-icon>delete</mat-icon>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<mat-error *ngIf="section.get('fields').dirty && section.get('fields').hasError('required')">{{'DMP-BLUEPRINT-EDITOR.FIELDS-REQUIRED' | translate}}</mat-error>
|
||||
<mat-error *ngIf="section.get('fields').hasError('backendError')">{{section.get('fields').getError('backendError').message}}</mat-error>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-auto mb-3">
|
||||
<button mat-button class="action-btn" type="button" (click)="addField(sectionIndex)" [disabled]="formGroup.disabled">{{'DMP-BLUEPRINT-EDITOR.ACTIONS.ADD-FIELD' | translate}}</button>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<div class="row d-flex flex-column">
|
||||
<div class="col-auto">
|
||||
<mat-checkbox [formControl]="section.get('hasTemplates')" (change)="removeAllDescriptionTemplates($event, sectionIndex)">
|
||||
{{'DMP-BLUEPRINT-EDITOR.FIELDS.DESCRIPTION-TEMPLATES' | translate}}
|
||||
</mat-checkbox>
|
||||
<mat-error *ngIf="section.get('hasTemplates').hasError('backendError')">{{section.get('hasTemplates').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="section.get('hasTemplates').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</div>
|
||||
<div class="col-auto" *ngIf="section.get('hasTemplates').value == true">
|
||||
<button mat-button class="action-btn" type="button" (click)="addDescriptionTemplate(sectionIndex)" [disabled]="formGroup.disabled">{{'DMP-BLUEPRINT-EDITOR.ACTIONS.ADD-DESCRIPTION-TEMPLATE' | translate}}</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div cdkDropList class="col-12 mt-3" (cdkDropListDropped)="dropFields($event, sectionIndex)">
|
||||
<div *ngFor="let field of section.get('fields').controls; let fieldIndex=index;" cdkDrag class="section-fields-wrapper row align-items-center mt-1" [cdkDragDisabled]="formGroup.disabled" (mouseenter)="onSectionHover(fieldIndex)" (mouseleave)="clearHoveredSection()">
|
||||
|
||||
<div class="row">
|
||||
<div cdkDropList class="col-12 mt-3" (cdkDropListDropped)="dropDescriptionTemplates($event, sectionIndex)">
|
||||
<div *ngFor="let descriptionTemplate of section.get('descriptionTemplates').controls; let descriptionTemplateIndex=index;" cdkDrag class="description-fields-wrapper row align-items-center mt-1" [cdkDragDisabled]="formGroup.disabled" (mouseenter)="onDescriptionTemplateHover(descriptionTemplateIndex)" (mouseleave)="clearHoveredDescriptionTemplate()">
|
||||
|
||||
<div class="col-auto section-options-vertical">
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-auto">
|
||||
<span *ngIf="!isSectionSelected(fieldIndex)" style="font-size: 18px; box-sizing: border-box; display: inline-block; padding: 0.85rem 0.42rem 0 0.45rem;">{{fieldIndex + 1}}</span>
|
||||
<mat-icon *ngIf="isSectionSelected(fieldIndex)" [ngClass]="{'drag-handle-disabled': formGroup.disabled}" cdkDragHandle class="drag-handle" style="margin-top: 0.9rem;">drag_indicator</mat-icon>
|
||||
<span *ngIf="!isDescriptionTemplateSelected(descriptionTemplateIndex)" style="font-size: 18px; box-sizing: border-box; display: inline-block; padding: 0.85rem 0.42rem 0 0.45rem;">{{descriptionTemplateIndex + 1}}</span>
|
||||
<mat-icon *ngIf="isDescriptionTemplateSelected(descriptionTemplateIndex)" [ngClass]="{'drag-handle-disabled': formGroup.disabled}" cdkDragHandle class="drag-handle" style="margin-top: 0.9rem;">drag_indicator</mat-icon>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<button mat-icon-button matTooltip="{{'DMP-BLUEPRINT-EDITOR.ACTIONS.REMOVE-FIELD' | translate}}" (click)="removeField(sectionIndex, fieldIndex)" [disabled]="formGroup.disabled">
|
||||
<button mat-icon-button class="action-list-icon" matTooltip="{{'DMP-BLUEPRINT-EDITOR.ACTIONS.REMOVE-DESCRIPTION-TEMPLATE' | translate}}" (click)="removeDescriptionTemplate(sectionIndex, descriptionTemplateIndex)" [disabled]="formGroup.disabled">
|
||||
<mat-icon>delete</mat-icon>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-auto pr-0 section-options-horizontal">
|
||||
<span *ngIf="!isSectionSelected(fieldIndex)" style="font-size: 18px; box-sizing: border-box; display: inline-block; padding: 0.85rem 0.45rem;">{{fieldIndex + 1}}</span>
|
||||
<mat-icon *ngIf="isSectionSelected(fieldIndex)" [ngClass]="{'drag-handle-disabled': formGroup.disabled}" cdkDragHandle class="drag-handle">drag_indicator</mat-icon>
|
||||
</div>
|
||||
<span *ngIf="!isDescriptionTemplateSelected(descriptionTemplateIndex)" style="font-size: 18px; box-sizing: border-box; display: inline-block; padding: 0.85rem 0.45rem;">{{descriptionTemplateIndex + 1}}</span>
|
||||
<mat-icon *ngIf="isDescriptionTemplateSelected(descriptionTemplateIndex)" [ngClass]="{'drag-handle-disabled': formGroup.disabled}" cdkDragHandle class="drag-handle">drag_indicator</mat-icon>
|
||||
</div>
|
||||
|
||||
<div class="col">
|
||||
<div class="row">
|
||||
|
||||
<div class="col-12 col-xl-4">
|
||||
<mat-form-field class="mt-3 w-100">
|
||||
<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.CATEGORY' | translate}}</mat-label>
|
||||
<mat-select [formControl]="field.get('category')" [disabled]="field.disabled" (selectionChange)="fieldCategoryChanged(sectionIndex, fieldIndex)">
|
||||
<mat-option *ngFor="let fieldCategory of dmpBlueprintFieldCategoryEnum" [value]="fieldCategory">{{enumUtils.toDmpBlueprintFieldCategoryString(fieldCategory)}}</mat-option>
|
||||
</mat-select>
|
||||
<mat-error *ngIf="field.get('category').hasError('backendError')">{{field.get('category').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="field.get('category').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
<div class="col-12 col-lg-6 col-xl-3">
|
||||
<mat-form-field class="w-100 mt-3">
|
||||
<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.DESCRIPTION-TEMPLATE' | translate}}</mat-label>
|
||||
<app-single-auto-complete [formControl]="descriptionTemplate.get('descriptionTemplateGroupId')" [hidePlaceholder]="true" [configuration]="descriptionTempalteGroupSingleAutocompleteConfiguration" (optionActionClicked)="onPreviewDescriptionTemplate($event, i)"></app-single-auto-complete>
|
||||
<mat-error *ngIf="descriptionTemplate.get('descriptionTemplateGroupId').hasError('backendError')">{{descriptionTemplate.get('descriptionTemplateGroupId').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="descriptionTemplate.get('descriptionTemplateGroupId').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-12 col-xl-4" *ngIf="field.get('category').value === dmpBlueprintSectionFieldCategory.System">
|
||||
<mat-form-field class="mt-3 w-100">
|
||||
<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.SYSTEM-FIELD-TYPE' | translate}}</mat-label>
|
||||
<mat-select [formControl]="field.get('systemFieldType')" [disabled]="field.disabled">
|
||||
<mat-option *ngFor="let systemFieldType of dmpBlueprintSystemFieldTypeEnum" [disabled]="systemFieldDisabled(systemFieldType)" [value]="systemFieldType">{{enumUtils.toDmpBlueprintSystemFieldTypeString(systemFieldType)}}</mat-option>
|
||||
</mat-select>
|
||||
<mat-error *ngIf="field.get('systemFieldType').hasError('backendError')">{{field.get('systemFieldType').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="field.get('systemFieldType').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
<div class="col-12 col-lg-6 col-xl-3">
|
||||
<mat-form-field class="w-100 mt-3">
|
||||
<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.DESCRIPTION-TEMPLATE-LABEL' | translate}}</mat-label>
|
||||
<input matInput type="text" name="label" [formControl]="descriptionTemplate.get('label')">
|
||||
<mat-error *ngIf="descriptionTemplate.get('label').hasError('backendError')">{{descriptionTemplate.get('label').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="descriptionTemplate.get('label').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-12 col-xl-4" *ngIf="field.get('category').value === dmpBlueprintSectionFieldCategory.Extra">
|
||||
<mat-form-field class="mt-3 w-100">
|
||||
<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.DATA-TYPE' | translate}}</mat-label>
|
||||
<mat-select [formControl]="field.get('dataType')">
|
||||
<mat-option *ngFor="let extraFieldDataType of dmpBlueprintExtraFieldDataTypeEnum" [value]="extraFieldDataType">
|
||||
{{enumUtils.toDmpBlueprintExtraFieldDataTypeString(extraFieldDataType)}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
<mat-error *ngIf="field.get('dataType').hasError('backendError')">{{field.get('dataType').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="field.get('dataType').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
<div class="col-12 col-lg-6 col-xl-3">
|
||||
<mat-form-field class="w-100 mt-3">
|
||||
<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.DESCRIPTION-TEMPLATE-MIN-MULTIPLICITY' | translate}}</mat-label>
|
||||
<input matInput type="number" min="0" name="minMultiplicity" [formControl]="descriptionTemplate.get('minMultiplicity')">
|
||||
<mat-error *ngIf="descriptionTemplate.get('minMultiplicity').hasError('backendError')">{{descriptionTemplate.get('minMultiplicity').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="descriptionTemplate.get('minMultiplicity').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-12 col-xl-4" *ngIf="field.get('category').value === dmpBlueprintSectionFieldCategory.ReferenceType">
|
||||
<mat-form-field class="mt-3 w-100">
|
||||
<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.REFERENCE-TYPE' | translate}}</mat-label>
|
||||
<app-single-auto-complete placeholder="{{'DMP-BLUEPRINT-EDITOR.FIELDS.REFERENCE-TYPE' | translate}}" [required]="true" [formControl]="field.get('referenceTypeId')" [configuration]="referenceTypeService.singleAutocompleteConfiguration"></app-single-auto-complete>
|
||||
<mat-error *ngIf="field.get('referenceTypeId').hasError('backendError')">{{field.get('referenceTypeId').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="field.get('referenceTypeId').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-12 col-xl-4" *ngIf="field.get('category').value != null">
|
||||
<mat-form-field class="mt-3 w-100">
|
||||
<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.FIELD-LABEL' | translate}}</mat-label>
|
||||
<input matInput type="text" name="label" [formControl]="field.get('label')">
|
||||
<mat-error *ngIf="field.get('label').hasError('backendError')">{{field.get('label').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="field.get('label').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-12 col-xl-4" *ngIf="field.get('category').value != null">
|
||||
<mat-form-field class="mt-3 w-100">
|
||||
<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.FIELD-PLACEHOLDER' | translate}}</mat-label>
|
||||
<input matInput type="text" name="placeholder" [formControl]="field.get('placeholder')">
|
||||
<mat-error *ngIf="field.get('placeholder').hasError('backendError')">{{field.get('placeholder').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="field.get('placeholder').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-12 col-xl-4" *ngIf="field.get('category').value != null">
|
||||
<mat-form-field class="mt-3 w-100">
|
||||
<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.FIELD-DESCRIPTION' | translate}}</mat-label>
|
||||
<input matInput type="text" name="description" [formControl]="field.get('description')">
|
||||
<mat-error *ngIf="field.get('description').hasError('backendError')">{{field.get('description').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="field.get('description').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-12 col-xl-4" *ngIf="field.get('category').value != null">
|
||||
<mat-form-field class="mt-3 w-100">
|
||||
<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.SEMANTICS' | translate}}</mat-label>
|
||||
<app-multiple-auto-complete placeholder="{{'DMP-BLUEPRINT-EDITOR.FIELDS.SEMANTICS' | translate}}" [hidePlaceholder]="true" [required]="false" [separatorKeysCodes]="separatorKeysCodes" [formControl]="field.get('semantics')" [configuration]="semanticsService.multipleAutocompleteConfiguration">
|
||||
</app-multiple-auto-complete>
|
||||
<mat-error *ngIf="field.get('semantics').hasError('backendError')">{{field.get('semantics').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="field.get('semantics').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
<div class="col-12 col-lg-6 col-xl-3">
|
||||
<mat-form-field class="w-100 mt-3">
|
||||
<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.DESCRIPTION-TEMPLATE-MAX-MULTIPLICITY' | translate}}</mat-label>
|
||||
<input matInput type="number" min="1" name="maxMultiplicity" [formControl]="descriptionTemplate.get('maxMultiplicity')">
|
||||
<mat-error *ngIf="descriptionTemplate.get('maxMultiplicity').hasError('backendError')">{{descriptionTemplate.get('maxMultiplicity').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="descriptionTemplate.get('maxMultiplicity').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 col-xl-auto">
|
||||
<div class="col-12 col-xl-auto section-options-horizontal">
|
||||
<div class="row">
|
||||
<div class="col-auto section-field" *ngIf="field.get('category').value != null">
|
||||
<mat-checkbox [disabled]="field.get('systemFieldType')?.value === dmpBlueprintSystemFieldType.Title || field.get('systemFieldType')?.value === dmpBlueprintSystemFieldType.Description" [formControl]="field.get('required')"><span>{{'DMP-BLUEPRINT-EDITOR.FIELDS.FIELD-REQUIRED' | translate}}</span></mat-checkbox>
|
||||
<mat-error *ngIf="field.get('required').hasError('backendError')">{{field.get('required').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="field.get('required').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</div>
|
||||
<div [hidden]="viewOnly" class="col-auto section-options-horizontal">
|
||||
<button mat-icon-button matTooltip="{{'DMP-BLUEPRINT-EDITOR.ACTIONS.REMOVE-FIELD' | translate}}" (click)="removeField(sectionIndex, fieldIndex)" [disabled]="formGroup.disabled">
|
||||
<div class="col-auto">
|
||||
<button mat-icon-button class="action-list-icon" matTooltip="{{'DMP-BLUEPRINT-EDITOR.ACTIONS.REMOVE-DESCRIPTION-TEMPLATE' | translate}}" (click)="removeDescriptionTemplate(sectionIndex, descriptionTemplateIndex)" [disabled]="formGroup.disabled">
|
||||
<mat-icon>delete</mat-icon>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<mat-error *ngIf="section.get('fields').dirty && section.get('fields').hasError('required')">{{'DMP-BLUEPRINT-EDITOR.FIELDS-REQUIRED' | translate}}</mat-error>
|
||||
<mat-error *ngIf="section.get('fields').hasError('backendError')">{{section.get('fields').getError('backendError').message}}</mat-error>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<div class="row d-flex flex-column">
|
||||
<div class="col-auto">
|
||||
<mat-checkbox [formControl]="section.get('hasTemplates')" (change)="removeAllDescriptionTemplates($event, sectionIndex)">
|
||||
{{'DMP-BLUEPRINT-EDITOR.FIELDS.DESCRIPTION-TEMPLATES' | translate}}
|
||||
</mat-checkbox>
|
||||
<mat-error *ngIf="section.get('hasTemplates').hasError('backendError')">{{section.get('hasTemplates').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="section.get('hasTemplates').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</div>
|
||||
<div class="col-auto" *ngIf="section.get('hasTemplates').value == true">
|
||||
<button mat-button class="action-btn" type="button" (click)="addDescriptionTemplate(sectionIndex)" [disabled]="formGroup.disabled">{{'DMP-BLUEPRINT-EDITOR.ACTIONS.ADD-DESCRIPTION-TEMPLATE' | translate}}</button>
|
||||
</div>
|
||||
</div>
|
||||
<mat-error *ngIf="section.get('descriptionTemplates').hasError('backendError')">{{section.get('descriptionTemplates').getError('backendError').message}}</mat-error>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div cdkDropList class="col-12 mt-3" (cdkDropListDropped)="dropDescriptionTemplates($event, sectionIndex)">
|
||||
<div *ngFor="let descriptionTemplate of section.get('descriptionTemplates').controls; let descriptionTemplateIndex=index;" cdkDrag class="description-fields-wrapper row align-items-center mt-1" [cdkDragDisabled]="formGroup.disabled" (mouseenter)="onDescriptionTemplateHover(descriptionTemplateIndex)" (mouseleave)="clearHoveredDescriptionTemplate()">
|
||||
|
||||
<div class="col-auto section-options-vertical">
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-auto">
|
||||
<span *ngIf="!isDescriptionTemplateSelected(descriptionTemplateIndex)" style="font-size: 18px; box-sizing: border-box; display: inline-block; padding: 0.85rem 0.42rem 0 0.45rem;">{{descriptionTemplateIndex + 1}}</span>
|
||||
<mat-icon *ngIf="isDescriptionTemplateSelected(descriptionTemplateIndex)" [ngClass]="{'drag-handle-disabled': formGroup.disabled}" cdkDragHandle class="drag-handle" style="margin-top: 0.9rem;">drag_indicator</mat-icon>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<button mat-icon-button class="action-list-icon" matTooltip="{{'DMP-BLUEPRINT-EDITOR.ACTIONS.REMOVE-DESCRIPTION-TEMPLATE' | translate}}" (click)="removeDescriptionTemplate(sectionIndex, descriptionTemplateIndex)" [disabled]="formGroup.disabled">
|
||||
<mat-icon>delete</mat-icon>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-auto pr-0 section-options-horizontal">
|
||||
<span *ngIf="!isDescriptionTemplateSelected(descriptionTemplateIndex)" style="font-size: 18px; box-sizing: border-box; display: inline-block; padding: 0.85rem 0.45rem;">{{descriptionTemplateIndex + 1}}</span>
|
||||
<mat-icon *ngIf="isDescriptionTemplateSelected(descriptionTemplateIndex)" [ngClass]="{'drag-handle-disabled': formGroup.disabled}" cdkDragHandle class="drag-handle">drag_indicator</mat-icon>
|
||||
</div>
|
||||
|
||||
<div class="col">
|
||||
<div class="row">
|
||||
<div class="col-12 col-lg-6 col-xl-3">
|
||||
<mat-form-field class="w-100 mt-3">
|
||||
<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.DESCRIPTION-TEMPLATE' | translate}}</mat-label>
|
||||
<app-single-auto-complete [formControl]="descriptionTemplate.get('descriptionTemplateGroupId')" [hidePlaceholder]="true" [configuration]="descriptionTempalteGroupSingleAutocompleteConfiguration" (optionActionClicked)="onPreviewDescriptionTemplate($event, i)"></app-single-auto-complete>
|
||||
<mat-error *ngIf="descriptionTemplate.get('descriptionTemplateGroupId').hasError('backendError')">{{descriptionTemplate.get('descriptionTemplateGroupId').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="descriptionTemplate.get('descriptionTemplateGroupId').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-12 col-lg-6 col-xl-3">
|
||||
<mat-form-field class="w-100 mt-3">
|
||||
<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.DESCRIPTION-TEMPLATE-LABEL' | translate}}</mat-label>
|
||||
<input matInput type="text" name="label" [formControl]="descriptionTemplate.get('label')">
|
||||
<mat-error *ngIf="descriptionTemplate.get('label').hasError('backendError')">{{descriptionTemplate.get('label').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="descriptionTemplate.get('label').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-12 col-lg-6 col-xl-3">
|
||||
<mat-form-field class="w-100 mt-3">
|
||||
<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.DESCRIPTION-TEMPLATE-MIN-MULTIPLICITY' | translate}}</mat-label>
|
||||
<input matInput type="number" min="0" name="minMultiplicity" [formControl]="descriptionTemplate.get('minMultiplicity')">
|
||||
<mat-error *ngIf="descriptionTemplate.get('minMultiplicity').hasError('backendError')">{{descriptionTemplate.get('minMultiplicity').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="descriptionTemplate.get('minMultiplicity').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-12 col-lg-6 col-xl-3">
|
||||
<mat-form-field class="w-100 mt-3">
|
||||
<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.DESCRIPTION-TEMPLATE-MAX-MULTIPLICITY' | translate}}</mat-label>
|
||||
<input matInput type="number" min="1" name="maxMultiplicity" [formControl]="descriptionTemplate.get('maxMultiplicity')">
|
||||
<mat-error *ngIf="descriptionTemplate.get('maxMultiplicity').hasError('backendError')">{{descriptionTemplate.get('maxMultiplicity').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="descriptionTemplate.get('maxMultiplicity').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 col-xl-auto section-options-horizontal">
|
||||
<div class="row">
|
||||
<div class="col-auto">
|
||||
<button mat-icon-button class="action-list-icon" matTooltip="{{'DMP-BLUEPRINT-EDITOR.ACTIONS.REMOVE-DESCRIPTION-TEMPLATE' | translate}}" (click)="removeDescriptionTemplate(sectionIndex, descriptionTemplateIndex)" [disabled]="formGroup.disabled">
|
||||
<mat-icon>delete</mat-icon>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div *ngIf="section.get('hasTemplates').value == true" class="col-lg-6 col-12">
|
||||
<mat-form-field class="w-100 mt-3">
|
||||
<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.PREFILLING-SOURCES' | translate}}</mat-label>
|
||||
<app-multiple-auto-complete [formControl]="section.get('prefillingSourcesIds')" [configuration]="prefillingSourceService.multipleAutocompleteConfiguration"></app-multiple-auto-complete>
|
||||
<mat-error *ngIf="section.get('prefillingSourcesIds').hasError('backendError')">{{section.get('prefillingSourcesIds').getError('backendError').message}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<mat-error *ngIf="section.get('descriptionTemplates').hasError('backendError')">{{section.get('descriptionTemplates').getError('backendError').message}}</mat-error>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div *ngIf="section.get('hasTemplates').value == true" class="col-lg-6 col-12">
|
||||
<mat-form-field class="w-100 mt-3">
|
||||
<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.PREFILLING-SOURCES' | translate}}</mat-label>
|
||||
<app-multiple-auto-complete [formControl]="section.get('prefillingSourcesIds')" [configuration]="prefillingSourceService.multipleAutocompleteConfiguration"></app-multiple-auto-complete>
|
||||
<mat-error *ngIf="section.get('prefillingSourcesIds').hasError('backendError')">{{section.get('prefillingSourcesIds').getError('backendError').message}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</mat-card-content>
|
||||
</mat-card-content>
|
||||
|
||||
|
||||
</mat-card>
|
||||
</mat-card>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-12">
|
||||
<div class="row">
|
||||
<div class="col-auto">
|
||||
<button mat-button class="action-btn" type="button" (click)="addSection()" [disabled]="formGroup.disabled">{{'DMP-BLUEPRINT-EDITOR.ACTIONS.ADD-SECTION' | translate}}</button>
|
||||
<mat-error *ngIf="formGroup.get('definition').get('sections').dirty && formGroup.get('definition').get('sections').hasError('required')">{{'DMP-BLUEPRINT-EDITOR.SECTIONS-REQUIRED' | translate}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('definition').get('sections').hasError('backendError')">{{formGroup.get('definition').get('sections').getError('backendError').message}}</mat-error>
|
||||
<div class="col-12">
|
||||
<div class="row">
|
||||
<div class="col-auto">
|
||||
<button mat-button class="action-btn" type="button" (click)="addSection()" [disabled]="formGroup.disabled">{{'DMP-BLUEPRINT-EDITOR.ACTIONS.ADD-SECTION' | translate}}</button>
|
||||
<mat-error *ngIf="formGroup.get('definition').get('sections').dirty && formGroup.get('definition').get('sections').hasError('required')">{{'DMP-BLUEPRINT-EDITOR.SECTIONS-REQUIRED' | translate}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('definition').get('sections').hasError('backendError')">{{formGroup.get('definition').get('sections').getError('backendError').message}}</mat-error>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row mt-4">
|
||||
<div class="col-auto">
|
||||
<button mat-button class="action-btn" (click)="cancel()" type="button">{{'DMP-BLUEPRINT-EDITOR.ACTIONS.CANCEL' | translate}}</button>
|
||||
<div class="row mt-4">
|
||||
<div class="col-auto">
|
||||
<button mat-button class="action-btn" (click)="cancel()" type="button">{{'DMP-BLUEPRINT-EDITOR.ACTIONS.CANCEL' | translate}}</button>
|
||||
</div>
|
||||
<div class="col"></div>
|
||||
<div class="col-auto">
|
||||
<button mat-button class="action-btn" [disabled]="!canSave" type="submit">
|
||||
{{'DMP-BLUEPRINT-EDITOR.ACTIONS.SAVE' | translate}}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col"></div>
|
||||
<div class="col-auto">
|
||||
<button mat-button class="action-btn" [disabled]="!canSave" type="submit">
|
||||
{{'DMP-BLUEPRINT-EDITOR.ACTIONS.SAVE' | translate}}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</mat-card-content>
|
||||
</mat-card>
|
||||
</form>
|
||||
</mat-card-content>
|
||||
</mat-card>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,38 +1,39 @@
|
|||
<div class="row dmp-blueprint-listing">
|
||||
<div class="col-md-8 offset-md-2">
|
||||
<div class="container-fluid">
|
||||
<div class="row dmp-blueprint-listing">
|
||||
<div class="col-md-10 offset-md-1">
|
||||
<div class="row mb-4 mt-4">
|
||||
|
||||
<div class="row mb-4 mt-3">
|
||||
<div class="col">
|
||||
<h4>{{'DMP-BLUEPRINT-LISTING.TITLE' | translate}}</h4>
|
||||
<app-navigation-breadcrumb />
|
||||
<div class="col">
|
||||
<h4>{{'DMP-BLUEPRINT-LISTING.TITLE' | translate}}</h4>
|
||||
<app-navigation-breadcrumb />
|
||||
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<button mat-raised-button class="import-btn" (click)="import()">
|
||||
<span class="button-text">
|
||||
{{'DMP-BLUEPRINT-LISTING.IMPORT.UPLOAD-XML' | translate}}
|
||||
</span>
|
||||
</button>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<button mat-raised-button class="import-btn" (click)="import()">
|
||||
<span class="button-text">
|
||||
{{'DMP-BLUEPRINT-LISTING.IMPORT.UPLOAD-XML' | translate}}
|
||||
</span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="col-auto">
|
||||
<button mat-raised-button class="create-btn" *ngIf="authService.hasPermission(authService.permissionEnum.EditDescriptionTemplateType)" [routerLink]="['/dmp-blueprints/new']">
|
||||
<mat-icon>add</mat-icon>
|
||||
{{'DMP-BLUEPRINT-LISTING.CREATE-DMP-BLUEPRINT' | translate}}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-auto">
|
||||
<button mat-raised-button class="create-btn" *ngIf="authService.hasPermission(authService.permissionEnum.EditDescriptionTemplateType)" [routerLink]="['/dmp-blueprints/new']">
|
||||
<mat-icon>add</mat-icon>
|
||||
{{'DMP-BLUEPRINT-LISTING.CREATE-DMP-BLUEPRINT' | translate}}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<app-hybrid-listing [rows]="gridRows" [columns]="gridColumns" [visibleColumns]="visibleColumns" [count]="totalElements" [offset]="currentPageNumber" [limit]="lookup.page.size" [defaultSort]="lookup.order?.items" [externalSorting]="true" (rowActivated)="onRowActivated($event, '/dmp-blueprints')" (pageLoad)="alterPage($event)" (columnSort)="onColumnSort($event)" (columnsChanged)="onColumnsChanged($event)" [listItemTemplate]="listItemTemplate">
|
||||
|
||||
<app-hybrid-listing [rows]="gridRows" [columns]="gridColumns" [visibleColumns]="visibleColumns" [count]="totalElements" [offset]="currentPageNumber" [limit]="lookup.page.size" [defaultSort]="lookup.order?.items" [externalSorting]="true" (rowActivated)="onRowActivated($event, '/dmp-blueprints')" (pageLoad)="alterPage($event)" (columnSort)="onColumnSort($event)" (columnsChanged)="onColumnsChanged($event)" [listItemTemplate]="listItemTemplate">
|
||||
|
||||
<app-dmp-blueprint-listing-filters hybrid-listing-filters [(filter)]="lookup" (filterChange)="filterChanged($event)" />
|
||||
|
||||
<app-user-settings-picker [key]="userSettingsKey" [userPreference]="lookup" (onSettingSelected)="changeSetting($event)" [autoSelectUserSettings]="autoSelectUserSettings" user-preference-settings />
|
||||
<!-- <button mat-icon-button download-listing-report>
|
||||
<mat-icon>download</mat-icon>
|
||||
</button> -->
|
||||
</app-hybrid-listing>
|
||||
<app-dmp-blueprint-listing-filters hybrid-listing-filters [(filter)]="lookup" (filterChange)="filterChanged($event)" />
|
||||
|
||||
<app-user-settings-picker [key]="userSettingsKey" [userPreference]="lookup" (onSettingSelected)="changeSetting($event)" [autoSelectUserSettings]="autoSelectUserSettings" user-preference-settings />
|
||||
<!-- <button mat-icon-button download-listing-report>
|
||||
<mat-icon>download</mat-icon>
|
||||
</button> -->
|
||||
</app-hybrid-listing>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -4,9 +4,9 @@
|
|||
}
|
||||
|
||||
.dmp-blueprint-listing {
|
||||
margin-top: 1.3rem;
|
||||
margin-left: 1rem;
|
||||
margin-right: 2rem;
|
||||
// margin-top: 1.3rem;
|
||||
// margin-left: 1rem;
|
||||
// margin-right: 2rem;
|
||||
|
||||
.mat-header-row {
|
||||
background: #f3f5f8;
|
||||
|
|
|
|||
|
|
@ -1,31 +1,34 @@
|
|||
<div class="row lock-listing">
|
||||
<div class="col-md-8 offset-md-2">
|
||||
<div class="container-fluid">
|
||||
<div class="row lock-listing">
|
||||
<div class="col-md-10 offset-md-1">
|
||||
|
||||
<div class="row mb-4 mt-3">
|
||||
<div class="col">
|
||||
<h4>{{'LOCK-LISTING.TITLE' | translate}}</h4>
|
||||
<app-navigation-breadcrumb />
|
||||
<div class="row mb-4 mt-4">
|
||||
<div class="col">
|
||||
<h4>{{'LOCK-LISTING.TITLE' | translate}}</h4>
|
||||
<app-navigation-breadcrumb />
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<app-hybrid-listing [rows]="gridRows" [columns]="gridColumns" [visibleColumns]="visibleColumns"
|
||||
[count]="totalElements" [offset]="currentPageNumber" [limit]="lookup.page.size"
|
||||
[defaultSort]="lookup.order?.items" [externalSorting]="true"
|
||||
(pageLoad)="alterPage($event)" (columnSort)="onColumnSort($event)"
|
||||
(columnsChanged)="onColumnsChanged($event)" [listItemTemplate]="listItemTemplate">
|
||||
|
||||
<app-lock-listing-filters hybrid-listing-filters [(filter)]="lookup"
|
||||
(filterChange)="filterChanged($event)" />
|
||||
|
||||
<app-user-settings-picker [key]="userSettingsKey" [userPreference]="lookup"
|
||||
(onSettingSelected)="changeSetting($event)" [autoSelectUserSettings]="autoSelectUserSettings"
|
||||
user-preference-settings />
|
||||
</app-hybrid-listing>
|
||||
|
||||
</div>
|
||||
|
||||
<app-hybrid-listing [rows]="gridRows" [columns]="gridColumns" [visibleColumns]="visibleColumns"
|
||||
[count]="totalElements" [offset]="currentPageNumber" [limit]="lookup.page.size"
|
||||
[defaultSort]="lookup.order?.items" [externalSorting]="true"
|
||||
(pageLoad)="alterPage($event)" (columnSort)="onColumnSort($event)"
|
||||
(columnsChanged)="onColumnsChanged($event)" [listItemTemplate]="listItemTemplate">
|
||||
|
||||
<app-lock-listing-filters hybrid-listing-filters [(filter)]="lookup"
|
||||
(filterChange)="filterChanged($event)" />
|
||||
|
||||
<app-user-settings-picker [key]="userSettingsKey" [userPreference]="lookup"
|
||||
(onSettingSelected)="changeSetting($event)" [autoSelectUserSettings]="autoSelectUserSettings"
|
||||
user-preference-settings />
|
||||
</app-hybrid-listing>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<ng-template #listItemTemplate let-item="item" let-isColumnSelected="isColumnSelected">
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -8,9 +8,9 @@
|
|||
}
|
||||
|
||||
.lock-listing {
|
||||
margin-top: 1.3rem;
|
||||
margin-left: 1rem;
|
||||
margin-right: 2rem;
|
||||
// margin-top: 1.3rem;
|
||||
// margin-left: 1rem;
|
||||
// margin-right: 2rem;
|
||||
|
||||
.mat-header-row{
|
||||
background: #f3f5f8;
|
||||
|
|
|
|||
|
|
@ -1,9 +1,15 @@
|
|||
<div class="row root">
|
||||
<mat-card class="col-md-3 offset-md-4">
|
||||
<div>
|
||||
<div style="color: red;">Warning: Danger zone. It might delete Dataset tags if not careful</div>
|
||||
<button mat-raised-button color="primary" (click)="generateIndex($event)" class="lightblue-btn button">Generate Index</button>
|
||||
<button mat-raised-button color="primary" (click)="clearIndex($event)" class="lightblue-btn button">Clear Index</button>
|
||||
<div class="container-fluid">
|
||||
<div class="row root">
|
||||
<div class="col-md-10 offset-md-1">
|
||||
<div class="mt-4 mb-4"></div>
|
||||
<mat-card class="p-2">
|
||||
<div class="mt-2">
|
||||
<div style="color: red;">Warning: Danger zone. It might delete Dataset tags if not careful</div>
|
||||
<button mat-raised-button color="primary" (click)="generateIndex($event)" class="lightblue-btn button">Generate Index</button>
|
||||
<button mat-raised-button color="primary" (click)="clearIndex($event)" class="lightblue-btn button">Clear Index</button>
|
||||
</div>
|
||||
</mat-card>
|
||||
</div>
|
||||
</mat-card>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
.root {
|
||||
padding-bottom: 2em;
|
||||
// padding-bottom: 2em;
|
||||
|
||||
.button {
|
||||
margin: 5px;
|
||||
|
|
|
|||
|
|
@ -1,76 +1,78 @@
|
|||
<div class="tenant-editor">
|
||||
<div class="col-md-8 offset-md-2 colums-gapped">
|
||||
<div class="row align-items-center mb-4" *ngIf="formGroup">
|
||||
<div class="col-auto">
|
||||
<h3 *ngIf="isNew && !isClone">{{'LANGUAGE-EDITOR.NEW' | translate}}</h3>
|
||||
<app-navigation-breadcrumb />
|
||||
<div class="container-fluid">
|
||||
<div class="row tenant-editor">
|
||||
<div class="col-md-10 offset-md-1 colums-gapped">
|
||||
<div class="row align-items-center mt-4 mb-4" *ngIf="formGroup">
|
||||
<div class="col">
|
||||
<h3 *ngIf="isNew && !isClone">{{'LANGUAGE-EDITOR.NEW' | translate}}</h3>
|
||||
<app-navigation-breadcrumb />
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<button mat-button class="action-btn" (click)="cancel()" type="button">{{'LANGUAGE-EDITOR.ACTIONS.CANCEL' | translate}}</button>
|
||||
</div>
|
||||
<div class="col-auto" *ngIf="!isNew">
|
||||
<button mat-button class="action-btn" type="button" (click)="delete()">
|
||||
<mat-icon>delete</mat-icon>
|
||||
{{'LANGUAGE-EDITOR.ACTIONS.DELETE' | translate}}
|
||||
</button>
|
||||
</div>
|
||||
<div class="col-auto" *ngIf="canSave">
|
||||
<button mat-button class="action-btn" (click)="formSubmit()">
|
||||
<mat-icon>save</mat-icon>
|
||||
{{'LANGUAGE-EDITOR.ACTIONS.SAVE' | translate}}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<button mat-button class="action-btn" (click)="cancel()" type="button">{{'LANGUAGE-EDITOR.ACTIONS.CANCEL' | translate}}</button>
|
||||
</div>
|
||||
<div class="col-auto" *ngIf="!isNew">
|
||||
<button mat-button class="action-btn" type="button" (click)="delete()">
|
||||
<mat-icon>delete</mat-icon>
|
||||
{{'LANGUAGE-EDITOR.ACTIONS.DELETE' | translate}}
|
||||
</button>
|
||||
</div>
|
||||
<div class="col-auto" *ngIf="canSave">
|
||||
<button mat-button class="action-btn" (click)="formSubmit()">
|
||||
<mat-icon>save</mat-icon>
|
||||
{{'LANGUAGE-EDITOR.ACTIONS.SAVE' | translate}}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<form *ngIf="formGroup" (ngSubmit)="formSubmit()">
|
||||
<mat-card appearance="outlined">
|
||||
<mat-card-header>
|
||||
<mat-card-title *ngIf="isNew">{{'LANGUAGE-EDITOR.NEW' | translate}}</mat-card-title>
|
||||
</mat-card-header>
|
||||
<mat-card-content>
|
||||
<div class="row">
|
||||
<div class="col-4" *ngIf="isNew">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'LANGUAGE-EDITOR.FIELDS.CODE' | translate}}</mat-label>
|
||||
<input matInput type="text" name="code" [formControl]="formGroup.get('code')" required>
|
||||
<mat-error *ngIf="formGroup.get('code').hasError('backendError')">{{formGroup.get('code').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('code').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
<form *ngIf="formGroup" (ngSubmit)="formSubmit()">
|
||||
<mat-card appearance="outlined">
|
||||
<mat-card-header>
|
||||
<mat-card-title *ngIf="isNew">{{'LANGUAGE-EDITOR.NEW' | translate}}</mat-card-title>
|
||||
</mat-card-header>
|
||||
<mat-card-content>
|
||||
<div class="row">
|
||||
<div class="col-4" *ngIf="isNew">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'LANGUAGE-EDITOR.FIELDS.CODE' | translate}}</mat-label>
|
||||
<input matInput type="text" name="code" [formControl]="formGroup.get('code')" required>
|
||||
<mat-error *ngIf="formGroup.get('code').hasError('backendError')">{{formGroup.get('code').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('code').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-4" *ngIf="!isNew">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'LANGUAGE-EDITOR.FIELDS.CODE' | translate}}</mat-label>
|
||||
<mat-select (selectionChange)="selectedCodeChanged($event.value)" name= "code" [formControl]="formGroup.get('code')">
|
||||
<mat-option *ngFor="let languageCode of availableLanguageCodes" [value]="languageCode">
|
||||
{{languageCode}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
<mat-error *ngIf="formGroup.get('code').hasError('backendError')">{{formGroup.get('code').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('code').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-4">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'LANGUAGE-EDITOR.FIELDS.ORDINAL' | translate}}</mat-label>
|
||||
<input matInput type="text" name="ordinal" [formControl]="formGroup.get('ordinal')" required>
|
||||
<mat-error *ngIf="formGroup.get('ordinal').hasError('backendError')">{{formGroup.get('ordinal').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('ordinal').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'LANGUAGE-EDITOR.FIELDS.PAYLOAD' | translate}}</mat-label>
|
||||
<input matInput type="text" name="payload" [formControl]="formGroup.get('payload')">
|
||||
<mat-error *ngIf="formGroup.get('payload').hasError('backendError')">{{formGroup.get('payload').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('payload').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
<h9 class="col-12">{{'LANGUAGE-EDITOR.FIELDS.OVERRIDE' | translate}}
|
||||
<mat-checkbox (change)="overrideFromFile($event, formGroup.get('code').value)"></mat-checkbox>
|
||||
</h9>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-4" *ngIf="!isNew">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'LANGUAGE-EDITOR.FIELDS.CODE' | translate}}</mat-label>
|
||||
<mat-select (selectionChange)="selectedCodeChanged($event.value)" name= "code" [formControl]="formGroup.get('code')">
|
||||
<mat-option *ngFor="let languageCode of availableLanguageCodes" [value]="languageCode">
|
||||
{{languageCode}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
<mat-error *ngIf="formGroup.get('code').hasError('backendError')">{{formGroup.get('code').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('code').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-4">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'LANGUAGE-EDITOR.FIELDS.ORDINAL' | translate}}</mat-label>
|
||||
<input matInput type="text" name="ordinal" [formControl]="formGroup.get('ordinal')" required>
|
||||
<mat-error *ngIf="formGroup.get('ordinal').hasError('backendError')">{{formGroup.get('ordinal').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('ordinal').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'LANGUAGE-EDITOR.FIELDS.PAYLOAD' | translate}}</mat-label>
|
||||
<input matInput type="text" name="payload" [formControl]="formGroup.get('payload')">
|
||||
<mat-error *ngIf="formGroup.get('payload').hasError('backendError')">{{formGroup.get('payload').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('payload').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
<h9 class="col-12">{{'LANGUAGE-EDITOR.FIELDS.OVERRIDE' | translate}}
|
||||
<mat-checkbox (change)="overrideFromFile($event, formGroup.get('code').value)"></mat-checkbox>
|
||||
</h9>
|
||||
</div>
|
||||
</div>
|
||||
</mat-card-content>
|
||||
</mat-card>
|
||||
</form>
|
||||
</mat-card-content>
|
||||
</mat-card>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
.tenant-editor {
|
||||
margin-top: 1.3rem;
|
||||
margin-left: 1em;
|
||||
margin-right: 3em;
|
||||
// margin-top: 1.3rem;
|
||||
// margin-left: 1em;
|
||||
// margin-right: 3em;
|
||||
|
||||
.remove {
|
||||
background-color: white;
|
||||
|
|
|
|||
|
|
@ -1,36 +1,37 @@
|
|||
<div class="row language-listing">
|
||||
<div class="col-md-8 offset-md-2">
|
||||
<div class="container-fluid">
|
||||
<div class="row language-listing">
|
||||
<div class="col-md-10 offset-md-1">
|
||||
<div class="row mb-4 mt-4">
|
||||
<div class="col">
|
||||
<h4>{{'LANGUAGE-LISTING.TITLE' | translate}}</h4>
|
||||
<app-navigation-breadcrumb />
|
||||
|
||||
<div class="row mb-4 mt-3">
|
||||
<div class="col">
|
||||
<h4>{{'LANGUAGE-LISTING.TITLE' | translate}}</h4>
|
||||
<app-navigation-breadcrumb />
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<button mat-raised-button class="create-btn"
|
||||
*ngIf="authService.hasPermission(authService.permissionEnum.EditLanguage)"
|
||||
[routerLink]="['/languages/new']">
|
||||
<mat-icon>add</mat-icon>
|
||||
{{'LANGUAGE-LISTING.CREATE' | translate}}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<app-hybrid-listing [rows]="gridRows" [columns]="gridColumns" [visibleColumns]="visibleColumns"
|
||||
[count]="totalElements" [offset]="currentPageNumber" [limit]="lookup.page.size"
|
||||
[defaultSort]="lookup.order?.items" [externalSorting]="true" (rowActivated)="onRowActivated($event)"
|
||||
(pageLoad)="alterPage($event)" (columnSort)="onColumnSort($event)"
|
||||
(columnsChanged)="onColumnsChanged($event)" [listItemTemplate]="listItemTemplate">
|
||||
|
||||
<app-language-listing-filters hybrid-listing-filters [(filter)]="lookup"
|
||||
(filterChange)="filterChanged($event)" />
|
||||
|
||||
<app-user-settings-picker [key]="userSettingsKey" [userPreference]="lookup"
|
||||
(onSettingSelected)="changeSetting($event)" [autoSelectUserSettings]="autoSelectUserSettings"
|
||||
user-preference-settings />
|
||||
</app-hybrid-listing>
|
||||
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<button mat-raised-button class="create-btn"
|
||||
*ngIf="authService.hasPermission(authService.permissionEnum.EditLanguage)"
|
||||
[routerLink]="['/languages/new']">
|
||||
<mat-icon>add</mat-icon>
|
||||
{{'LANGUAGE-LISTING.CREATE' | translate}}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<app-hybrid-listing [rows]="gridRows" [columns]="gridColumns" [visibleColumns]="visibleColumns"
|
||||
[count]="totalElements" [offset]="currentPageNumber" [limit]="lookup.page.size"
|
||||
[defaultSort]="lookup.order?.items" [externalSorting]="true" (rowActivated)="onRowActivated($event)"
|
||||
(pageLoad)="alterPage($event)" (columnSort)="onColumnSort($event)"
|
||||
(columnsChanged)="onColumnsChanged($event)" [listItemTemplate]="listItemTemplate">
|
||||
|
||||
<app-language-listing-filters hybrid-listing-filters [(filter)]="lookup"
|
||||
(filterChange)="filterChanged($event)" />
|
||||
|
||||
<app-user-settings-picker [key]="userSettingsKey" [userPreference]="lookup"
|
||||
(onSettingSelected)="changeSetting($event)" [autoSelectUserSettings]="autoSelectUserSettings"
|
||||
user-preference-settings />
|
||||
</app-hybrid-listing>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
.language-listing {
|
||||
margin-top: 1.3rem;
|
||||
margin-left: 1rem;
|
||||
margin-right: 2rem;
|
||||
// margin-top: 1.3rem;
|
||||
// margin-left: 1rem;
|
||||
// margin-right: 2rem;
|
||||
|
||||
.mat-header-row{
|
||||
background: #f3f5f8;
|
||||
|
|
|
|||
|
|
@ -1,277 +1,278 @@
|
|||
<div class="notification-template-editor">
|
||||
<div class="col-md-10 offset-md-1 colums-gapped">
|
||||
<div class="row align-items-center mb-4" *ngIf="formGroup">
|
||||
<div class="col-auto">
|
||||
<h3 *ngIf="isNew && !isClone">{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.NEW' | translate}}</h3>
|
||||
<app-navigation-breadcrumb />
|
||||
<div class="container-fluid">
|
||||
<div class="row notification-template-editor">
|
||||
<div class="col-md-10 offset-md-1 colums-gapped">
|
||||
<div class="row align-items-center mt-4 mb-4" *ngIf="formGroup">
|
||||
<div class="col-auto">
|
||||
<h3 *ngIf="isNew && !isClone">{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.NEW' | translate}}</h3>
|
||||
<app-navigation-breadcrumb />
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<button mat-button class="action-btn" (click)="cancel()" type="button">{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.ACTIONS.CANCEL' | translate}}</button>
|
||||
</div>
|
||||
<div class="col-auto" *ngIf="!isNew">
|
||||
<button mat-button class="action-btn" type="button" (click)="delete()">
|
||||
<mat-icon>delete</mat-icon>
|
||||
{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.ACTIONS.DELETE' | translate}}
|
||||
</button>
|
||||
</div>
|
||||
<div class="col-auto" *ngIf="canSave">
|
||||
<button mat-button class="action-btn" (click)="formSubmit()">
|
||||
<mat-icon>save</mat-icon>
|
||||
{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.ACTIONS.SAVE' | translate}}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<button mat-button class="action-btn" (click)="cancel()" type="button">{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.ACTIONS.CANCEL' | translate}}</button>
|
||||
</div>
|
||||
<div class="col-auto" *ngIf="!isNew">
|
||||
<button mat-button class="action-btn" type="button" (click)="delete()">
|
||||
<mat-icon>delete</mat-icon>
|
||||
{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.ACTIONS.DELETE' | translate}}
|
||||
</button>
|
||||
</div>
|
||||
<div class="col-auto" *ngIf="canSave">
|
||||
<button mat-button class="action-btn" (click)="formSubmit()">
|
||||
<mat-icon>save</mat-icon>
|
||||
{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.ACTIONS.SAVE' | translate}}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<form *ngIf="formGroup" (ngSubmit)="formSubmit()" >
|
||||
<mat-card appearance="outlined">
|
||||
<mat-card-header>
|
||||
<mat-card-title *ngIf="isNew">{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.NEW' | translate}}</mat-card-title>
|
||||
</mat-card-header>
|
||||
<mat-card-content>
|
||||
<div class="d-flex flex-wrap mt-4">
|
||||
<div class="col-md-12">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.NOTIFICATION-TYPE' | translate}}</mat-label>
|
||||
<mat-select [formControl]="formGroup.get('notificationType')" name="notificationType" required>
|
||||
<mat-option *ngFor="let type of notificationTypeEnum" [value]="type">
|
||||
{{enumUtils.toNotificationTypeString(type)}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
<mat-error *ngIf="formGroup.get('notificationType').hasError('backendError')">{{formGroup.get('notificationType').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('notificationType').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
<form *ngIf="formGroup" (ngSubmit)="formSubmit()" >
|
||||
<mat-card appearance="outlined">
|
||||
<mat-card-header>
|
||||
<mat-card-title *ngIf="isNew">{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.NEW' | translate}}</mat-card-title>
|
||||
</mat-card-header>
|
||||
<mat-card-content>
|
||||
<div class="d-flex flex-wrap mt-4">
|
||||
<div class="col-md-12">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.NOTIFICATION-TYPE' | translate}}</mat-label>
|
||||
<mat-select [formControl]="formGroup.get('notificationType')" name="notificationType" required>
|
||||
<mat-option *ngFor="let type of notificationTypeEnum" [value]="type">
|
||||
{{enumUtils.toNotificationTypeString(type)}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
<mat-error *ngIf="formGroup.get('notificationType').hasError('backendError')">{{formGroup.get('notificationType').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('notificationType').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-4">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.LANGUAGE' | translate}}</mat-label>
|
||||
<mat-select [formControl]="formGroup.get('languageId')" name="language" required>
|
||||
<mat-option *ngFor="let language of languages" [value]="language.id">
|
||||
{{language.code}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
<mat-error *ngIf="formGroup.get('languageId').hasError('backendError')">{{formGroup.get('languageId').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('languageId').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-4">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.KIND' | translate}}</mat-label>
|
||||
<mat-select name="kind" [formControl]="formGroup.get('kind')" required>
|
||||
<mat-option *ngFor="let kind of notificationTemplateKindEnum" [value]="kind">
|
||||
{{enumUtils.toNotificationTemplateKindString(kind)}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
<mat-error *ngIf="formGroup.get('kind').hasError('backendError')">{{formGroup.get('kind').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('kind').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-4">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.CHANNEL' | translate}}</mat-label>
|
||||
<mat-select name="channel" [formControl]="formGroup.get('channel')" required>
|
||||
<mat-option *ngFor="let channel of notificationTemplateChannelEnum" [value]="channel">
|
||||
{{enumUtils.toNotificationTemplateChannelString(channel)}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
<mat-error *ngIf="formGroup.get('channel').hasError('backendError')">{{formGroup.get('channel').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('channel').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-4">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.LANGUAGE' | translate}}</mat-label>
|
||||
<mat-select [formControl]="formGroup.get('languageId')" name="language" required>
|
||||
<mat-option *ngFor="let language of languages" [value]="language.id">
|
||||
{{language.code}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
<mat-error *ngIf="formGroup.get('languageId').hasError('backendError')">{{formGroup.get('languageId').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('languageId').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-4">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.KIND' | translate}}</mat-label>
|
||||
<mat-select name="kind" [formControl]="formGroup.get('kind')" required>
|
||||
<mat-option *ngFor="let kind of notificationTemplateKindEnum" [value]="kind">
|
||||
{{enumUtils.toNotificationTemplateKindString(kind)}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
<mat-error *ngIf="formGroup.get('kind').hasError('backendError')">{{formGroup.get('kind').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('kind').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-4">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.CHANNEL' | translate}}</mat-label>
|
||||
<mat-select name="channel" [formControl]="formGroup.get('channel')" required>
|
||||
<mat-option *ngFor="let channel of notificationTemplateChannelEnum" [value]="channel">
|
||||
{{enumUtils.toNotificationTemplateChannelString(channel)}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
<mat-error *ngIf="formGroup.get('channel').hasError('backendError')">{{formGroup.get('channel').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('channel').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Subject -->
|
||||
<div class="d-flex flex-wrap">
|
||||
<h3 class="col-md-12">{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.SUBJECT-SECTION' | translate}}</h3>
|
||||
<div class="col-md-6">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.SUBJECT-TEXT' | translate}}</mat-label>
|
||||
<input matInput [formControl]="formGroup.get('value').get('subjectText')">
|
||||
<mat-error *ngIf="formGroup.get('value').get('subjectText').hasError('backendError')">{{formGroup.get('value').get('subjectText').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('value').get('subjectText').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
<!-- Subject -->
|
||||
<div class="d-flex flex-wrap">
|
||||
<h3 class="col-md-12">{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.SUBJECT-SECTION' | translate}}</h3>
|
||||
<div class="col-md-6">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.SUBJECT-TEXT' | translate}}</mat-label>
|
||||
<input matInput [formControl]="formGroup.get('value').get('subjectText')">
|
||||
<mat-error *ngIf="formGroup.get('value').get('subjectText').hasError('backendError')">{{formGroup.get('value').get('subjectText').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('value').get('subjectText').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.SUBJECT-KEY' | translate}}</mat-label>
|
||||
<input matInput [formControl]="formGroup.get('value').get('subjectKey')">
|
||||
<mat-error *ngIf="formGroup.get('value').get('subjectKey').hasError('backendError')">{{formGroup.get('value').get('subjectKey').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('value').get('subjectKey').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.SUBJECT-KEY' | translate}}</mat-label>
|
||||
<input matInput [formControl]="formGroup.get('value').get('subjectKey')">
|
||||
<mat-error *ngIf="formGroup.get('value').get('subjectKey').hasError('backendError')">{{formGroup.get('value').get('subjectKey').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('value').get('subjectKey').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
<h4 class="col-md-12">{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.SUBJECT-FIELD-OPTIONS' | translate}}
|
||||
<mat-checkbox [checked]="subjectFieldOptionsEnabled" (change)="subjectFieldOptionsSelectionChanged($event)"></mat-checkbox>
|
||||
</h4>
|
||||
<ng-container *ngIf="subjectFieldOptionsEnabled == true">
|
||||
<app-notification-template-field-options-component
|
||||
[form]="formGroup.get('value').get('subjectFieldOptions')"
|
||||
[validationErrorModel]="editorModel.validationErrorModel"
|
||||
[validationRootPath]="'value.subjectFieldOptions.'"
|
||||
[mandatoryFields]="subjectMandatoryFields"
|
||||
[formatting]="subjectFormatting">
|
||||
</app-notification-template-field-options-component>
|
||||
</ng-container>
|
||||
<h4 class="col-md-12">{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.SUBJECT-FIELD-OPTIONS' | translate}}
|
||||
<mat-checkbox [checked]="subjectFieldOptionsEnabled" (change)="subjectFieldOptionsSelectionChanged($event)"></mat-checkbox>
|
||||
</h4>
|
||||
<ng-container *ngIf="subjectFieldOptionsEnabled == true">
|
||||
<app-notification-template-field-options-component
|
||||
[form]="formGroup.get('value').get('subjectFieldOptions')"
|
||||
[validationErrorModel]="editorModel.validationErrorModel"
|
||||
[validationRootPath]="'value.subjectFieldOptions.'"
|
||||
[mandatoryFields]="subjectMandatoryFields"
|
||||
[formatting]="subjectFormatting">
|
||||
</app-notification-template-field-options-component>
|
||||
</ng-container>
|
||||
|
||||
<!-- Body -->
|
||||
<div>
|
||||
<h3 class="col-md-12">{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.BODY-SECTION' | translate}}</h3>
|
||||
<div class="col-md-6">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.BODY-KEY' | translate}}</mat-label>
|
||||
<input matInput [formControl]="formGroup.get('value').get('bodyKey')">
|
||||
<mat-error *ngIf="formGroup.get('value').get('bodyKey').hasError('backendError')">{{formGroup.get('value').get('bodyKey').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('value').get('bodyKey').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.BODY-TEXT' | translate}}</mat-label>
|
||||
<editor class="w-100 mt-2" [init]="{
|
||||
base_url: '/tinymce',
|
||||
suffix: '.min',
|
||||
height: 800,
|
||||
menubar: true,
|
||||
plugins: [
|
||||
'advlist', 'autolink', 'lists', 'link', 'image', 'charmap', 'print', 'preview', 'anchor',
|
||||
'searchreplace', 'visualblocks', 'fullpage',
|
||||
'insertdatetime', 'media', 'table' ,'paste', 'code', 'help', 'wordcount','importcss',
|
||||
],
|
||||
extended_valid_elements: '*[*]',
|
||||
forced_root_block: '',
|
||||
valid_children: '+body[script],ol[li|div|p|a|ol|table],h2[span],h3[span]',
|
||||
save_enablewhendirty: false,
|
||||
toolbar:
|
||||
'undo redo | formatselect | bold italic backcolor | \
|
||||
alignleft aligncenter alignright alignjustify | \
|
||||
bullist numlist outdent indent | code | searchreplace | preview | removeformat | help | link | image'
|
||||
}" [formControl]="formGroup.get('value').get('bodyText')"></editor>
|
||||
<mat-error *ngIf="formGroup.get('value').get('bodyText').hasError('backendError')">{{formGroup.get('value').get('bodyText').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('value').get('bodyText').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</div>
|
||||
</div>
|
||||
<h4 class="col-md-12">{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.BODY-FIELD-OPTIONS' | translate}}
|
||||
<mat-checkbox [checked]="bodyFieldOptionsEnabled" (change)="bodyFieldOptionsSelectionChanged($event)"></mat-checkbox>
|
||||
</h4>
|
||||
<ng-container *ngIf="bodyFieldOptionsEnabled == true">
|
||||
<app-notification-template-field-options-component
|
||||
[form]="formGroup.get('value').get('bodyFieldOptions')"
|
||||
[validationErrorModel]="editorModel.validationErrorModel"
|
||||
[validationRootPath]="'value.bodyFieldOptions.'"
|
||||
[bodyMandatoryFields]="subjectMandatoryFields"
|
||||
[formatting]="bodyFormatting">
|
||||
</app-notification-template-field-options-component>
|
||||
</ng-container>
|
||||
<!--Extra Options -->
|
||||
<div class="row">
|
||||
<h3 class="col-md-12">{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.EXTRA-OPTIONS' | translate}}</h3>
|
||||
<!-- Body -->
|
||||
<div>
|
||||
<h4 class="col-md-12">{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.ALLOW-ATTACHMENTS' | translate}}
|
||||
<mat-checkbox [formControl]="formGroup.get('value').get('allowAttachments')"></mat-checkbox>
|
||||
<mat-error *ngIf="formGroup.get('value').get('allowAttachments').hasError('backendError')">{{formGroup.get('value').get('allowAttachments').getError('backendError').message}}</mat-error>
|
||||
</h4>
|
||||
<h3 class="col-md-12">{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.BODY-SECTION' | translate}}</h3>
|
||||
<div class="col-md-6">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.BODY-KEY' | translate}}</mat-label>
|
||||
<input matInput [formControl]="formGroup.get('value').get('bodyKey')">
|
||||
<mat-error *ngIf="formGroup.get('value').get('bodyKey').hasError('backendError')">{{formGroup.get('value').get('bodyKey').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('value').get('bodyKey').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.BODY-TEXT' | translate}}</mat-label>
|
||||
<editor class="w-100 mt-2" [init]="{
|
||||
base_url: '/tinymce',
|
||||
suffix: '.min',
|
||||
height: 800,
|
||||
menubar: true,
|
||||
plugins: [
|
||||
'advlist', 'autolink', 'lists', 'link', 'image', 'charmap', 'print', 'preview', 'anchor',
|
||||
'searchreplace', 'visualblocks', 'fullpage',
|
||||
'insertdatetime', 'media', 'table' ,'paste', 'code', 'help', 'wordcount','importcss',
|
||||
],
|
||||
extended_valid_elements: '*[*]',
|
||||
forced_root_block: '',
|
||||
valid_children: '+body[script],ol[li|div|p|a|ol|table],h2[span],h3[span]',
|
||||
save_enablewhendirty: false,
|
||||
toolbar:
|
||||
'undo redo | formatselect | bold italic backcolor | \
|
||||
alignleft aligncenter alignright alignjustify | \
|
||||
bullist numlist outdent indent | code | searchreplace | preview | removeformat | help | link | image'
|
||||
}" [formControl]="formGroup.get('value').get('bodyText')"></editor>
|
||||
<mat-error *ngIf="formGroup.get('value').get('bodyText').hasError('backendError')">{{formGroup.get('value').get('bodyText').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('value').get('bodyText').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-4">
|
||||
<mat-form-field class="col-md-12">
|
||||
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.PRIORITY-KEY' | translate}}</mat-label>
|
||||
<input matInput [formControl]="formGroup.get('value').get('priorityKey')">
|
||||
<mat-error *ngIf="formGroup.get('value').get('priorityKey').hasError('backendError')">{{formGroup.get('value').get('priorityKey').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('value').get('priorityKey').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-4" >
|
||||
<mat-form-field class="chip-list">
|
||||
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.CC' | translate}}</mat-label>
|
||||
<mat-chip-grid #cc [formControl]="formGroup.get('value').get('cc')">
|
||||
<mat-chip-row *ngFor="let field of ccValues"
|
||||
(removed)="removeChipListValues('cc', field)"
|
||||
[editable]="true"
|
||||
(edited)="editChipListValues('cc', $event, field)">
|
||||
{{field}}
|
||||
<button matChipRemove>
|
||||
<mat-icon>cancel</mat-icon>
|
||||
</button>
|
||||
</mat-chip-row>
|
||||
<input placeholder="{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.MANDATORY-PLACEHOLDER' | translate}}"
|
||||
[matChipInputFor]="cc"
|
||||
[matChipInputSeparatorKeyCodes]="separatorKeysCodes"
|
||||
[matChipInputAddOnBlur]="true"
|
||||
(matChipInputTokenEnd)="addChipListValues('cc',$event)"/>
|
||||
</mat-chip-grid>
|
||||
<mat-error *ngIf="formGroup.get('value').get('cc').hasError('backendError')">{{formGroup.get('value').get('cc').getError('backendError').message}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-4">
|
||||
<mat-form-field class="col-auto">
|
||||
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.CC-MODE' | translate}}</mat-label>
|
||||
<mat-select name="ccMode" [formControl]="formGroup.get('value').get('ccMode')">
|
||||
<mat-option *ngFor="let emailOverrideMode of emailOverrideModeEnum" [value]="emailOverrideMode">
|
||||
{{enumUtils.toEmailOverrideModeString(emailOverrideMode)}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
<mat-error *ngIf="formGroup.get('value').get('ccMode').hasError('backendError')">{{formGroup.get('value').get('ccMode').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('value').get('ccMode').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-4" >
|
||||
<mat-form-field class="chip-list">
|
||||
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.BCC' | translate}}</mat-label>
|
||||
<mat-chip-grid #bcc [formControl]="formGroup.get('value').get('bcc')">
|
||||
<mat-chip-row *ngFor="let field of bccValues"
|
||||
(removed)="removeChipListValues('bcc', field)"
|
||||
[editable]="true"
|
||||
(edited)="editChipListValues('bcc', $event, field)">
|
||||
{{field}}
|
||||
<button matChipRemove>
|
||||
<mat-icon>cancel</mat-icon>
|
||||
</button>
|
||||
</mat-chip-row>
|
||||
<input placeholder="{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.MANDATORY-PLACEHOLDER' | translate}}"
|
||||
[matChipInputFor]="bcc"
|
||||
[matChipInputSeparatorKeyCodes]="separatorKeysCodes"
|
||||
[matChipInputAddOnBlur]="true"
|
||||
(matChipInputTokenEnd)="addChipListValues('bcc',$event)"/>
|
||||
</mat-chip-grid>
|
||||
<mat-error *ngIf="formGroup.get('value').get('bcc').hasError('backendError')">{{formGroup.get('value').get('bcc').getError('backendError').message}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-4">
|
||||
<mat-form-field class="col-auto">
|
||||
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.BCC-MODE' | translate}}</mat-label>
|
||||
<mat-select name="bccMode" [formControl]="formGroup.get('value').get('bccMode')">
|
||||
<mat-option *ngFor="let emailOverrideMode of emailOverrideModeEnum" [value]="emailOverrideMode">
|
||||
{{enumUtils.toEmailOverrideModeString(emailOverrideMode)}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
<mat-error *ngIf="formGroup.get('value').get('bccMode').hasError('backendError')">{{formGroup.get('value').get('bccMode').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('value').get('bccMode').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-4" >
|
||||
<mat-form-field class="chip-list">
|
||||
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.EXTRA-DATA-KEYS' | translate}}</mat-label>
|
||||
<mat-chip-grid #extraDataKeys [formControl]="formGroup.get('value').get('extraDataKeys')">
|
||||
<mat-chip-row *ngFor="let field of extraDataKeys"
|
||||
(removed)="removeChipListValues('extraDataKeys', field)"
|
||||
[editable]="true"
|
||||
(edited)="editChipListValues('extraDataKeys', $event, field)">
|
||||
{{field}}
|
||||
<button matChipRemove>
|
||||
<mat-icon>cancel</mat-icon>
|
||||
</button>
|
||||
</mat-chip-row>
|
||||
<input placeholder="{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.MANDATORY-PLACEHOLDER' | translate}}"
|
||||
[matChipInputFor]="extraDataKeys"
|
||||
[matChipInputSeparatorKeyCodes]="separatorKeysCodes"
|
||||
[matChipInputAddOnBlur]="true"
|
||||
(matChipInputTokenEnd)="addChipListValues('extraDataKeys',$event)"/>
|
||||
</mat-chip-grid>
|
||||
<mat-error *ngIf="formGroup.get('value').get('extraDataKeys').hasError('backendError')">{{formGroup.get('value').get('extraDataKeys').getError('backendError').message}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
</mat-card-content>
|
||||
</mat-card>
|
||||
</form>
|
||||
<h4 class="col-md-12">{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.BODY-FIELD-OPTIONS' | translate}}
|
||||
<mat-checkbox [checked]="bodyFieldOptionsEnabled" (change)="bodyFieldOptionsSelectionChanged($event)"></mat-checkbox>
|
||||
</h4>
|
||||
<ng-container *ngIf="bodyFieldOptionsEnabled == true">
|
||||
<app-notification-template-field-options-component
|
||||
[form]="formGroup.get('value').get('bodyFieldOptions')"
|
||||
[validationErrorModel]="editorModel.validationErrorModel"
|
||||
[validationRootPath]="'value.bodyFieldOptions.'"
|
||||
[bodyMandatoryFields]="subjectMandatoryFields"
|
||||
[formatting]="bodyFormatting">
|
||||
</app-notification-template-field-options-component>
|
||||
</ng-container>
|
||||
<!--Extra Options -->
|
||||
<div class="row">
|
||||
<h3 class="col-md-12">{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.EXTRA-OPTIONS' | translate}}</h3>
|
||||
<div>
|
||||
<h4 class="col-md-12">{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.ALLOW-ATTACHMENTS' | translate}}
|
||||
<mat-checkbox [formControl]="formGroup.get('value').get('allowAttachments')"></mat-checkbox>
|
||||
<mat-error *ngIf="formGroup.get('value').get('allowAttachments').hasError('backendError')">{{formGroup.get('value').get('allowAttachments').getError('backendError').message}}</mat-error>
|
||||
</h4>
|
||||
</div>
|
||||
<div class="col-4">
|
||||
<mat-form-field class="col-md-12">
|
||||
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.PRIORITY-KEY' | translate}}</mat-label>
|
||||
<input matInput [formControl]="formGroup.get('value').get('priorityKey')">
|
||||
<mat-error *ngIf="formGroup.get('value').get('priorityKey').hasError('backendError')">{{formGroup.get('value').get('priorityKey').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('value').get('priorityKey').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-4" >
|
||||
<mat-form-field class="chip-list">
|
||||
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.CC' | translate}}</mat-label>
|
||||
<mat-chip-grid #cc [formControl]="formGroup.get('value').get('cc')">
|
||||
<mat-chip-row *ngFor="let field of ccValues"
|
||||
(removed)="removeChipListValues('cc', field)"
|
||||
[editable]="true"
|
||||
(edited)="editChipListValues('cc', $event, field)">
|
||||
{{field}}
|
||||
<button matChipRemove>
|
||||
<mat-icon>cancel</mat-icon>
|
||||
</button>
|
||||
</mat-chip-row>
|
||||
<input placeholder="{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.MANDATORY-PLACEHOLDER' | translate}}"
|
||||
[matChipInputFor]="cc"
|
||||
[matChipInputSeparatorKeyCodes]="separatorKeysCodes"
|
||||
[matChipInputAddOnBlur]="true"
|
||||
(matChipInputTokenEnd)="addChipListValues('cc',$event)"/>
|
||||
</mat-chip-grid>
|
||||
<mat-error *ngIf="formGroup.get('value').get('cc').hasError('backendError')">{{formGroup.get('value').get('cc').getError('backendError').message}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-4">
|
||||
<mat-form-field class="col-auto">
|
||||
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.CC-MODE' | translate}}</mat-label>
|
||||
<mat-select name="ccMode" [formControl]="formGroup.get('value').get('ccMode')">
|
||||
<mat-option *ngFor="let emailOverrideMode of emailOverrideModeEnum" [value]="emailOverrideMode">
|
||||
{{enumUtils.toEmailOverrideModeString(emailOverrideMode)}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
<mat-error *ngIf="formGroup.get('value').get('ccMode').hasError('backendError')">{{formGroup.get('value').get('ccMode').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('value').get('ccMode').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-4" >
|
||||
<mat-form-field class="chip-list">
|
||||
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.BCC' | translate}}</mat-label>
|
||||
<mat-chip-grid #bcc [formControl]="formGroup.get('value').get('bcc')">
|
||||
<mat-chip-row *ngFor="let field of bccValues"
|
||||
(removed)="removeChipListValues('bcc', field)"
|
||||
[editable]="true"
|
||||
(edited)="editChipListValues('bcc', $event, field)">
|
||||
{{field}}
|
||||
<button matChipRemove>
|
||||
<mat-icon>cancel</mat-icon>
|
||||
</button>
|
||||
</mat-chip-row>
|
||||
<input placeholder="{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.MANDATORY-PLACEHOLDER' | translate}}"
|
||||
[matChipInputFor]="bcc"
|
||||
[matChipInputSeparatorKeyCodes]="separatorKeysCodes"
|
||||
[matChipInputAddOnBlur]="true"
|
||||
(matChipInputTokenEnd)="addChipListValues('bcc',$event)"/>
|
||||
</mat-chip-grid>
|
||||
<mat-error *ngIf="formGroup.get('value').get('bcc').hasError('backendError')">{{formGroup.get('value').get('bcc').getError('backendError').message}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-4">
|
||||
<mat-form-field class="col-auto">
|
||||
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.BCC-MODE' | translate}}</mat-label>
|
||||
<mat-select name="bccMode" [formControl]="formGroup.get('value').get('bccMode')">
|
||||
<mat-option *ngFor="let emailOverrideMode of emailOverrideModeEnum" [value]="emailOverrideMode">
|
||||
{{enumUtils.toEmailOverrideModeString(emailOverrideMode)}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
<mat-error *ngIf="formGroup.get('value').get('bccMode').hasError('backendError')">{{formGroup.get('value').get('bccMode').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('value').get('bccMode').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-4" >
|
||||
<mat-form-field class="chip-list">
|
||||
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.EXTRA-DATA-KEYS' | translate}}</mat-label>
|
||||
<mat-chip-grid #extraDataKeys [formControl]="formGroup.get('value').get('extraDataKeys')">
|
||||
<mat-chip-row *ngFor="let field of extraDataKeys"
|
||||
(removed)="removeChipListValues('extraDataKeys', field)"
|
||||
[editable]="true"
|
||||
(edited)="editChipListValues('extraDataKeys', $event, field)">
|
||||
{{field}}
|
||||
<button matChipRemove>
|
||||
<mat-icon>cancel</mat-icon>
|
||||
</button>
|
||||
</mat-chip-row>
|
||||
<input placeholder="{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.MANDATORY-PLACEHOLDER' | translate}}"
|
||||
[matChipInputFor]="extraDataKeys"
|
||||
[matChipInputSeparatorKeyCodes]="separatorKeysCodes"
|
||||
[matChipInputAddOnBlur]="true"
|
||||
(matChipInputTokenEnd)="addChipListValues('extraDataKeys',$event)"/>
|
||||
</mat-chip-grid>
|
||||
<mat-error *ngIf="formGroup.get('value').get('extraDataKeys').hasError('backendError')">{{formGroup.get('value').get('extraDataKeys').getError('backendError').message}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
</mat-card-content>
|
||||
</mat-card>
|
||||
</form>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
.notification-template-editor {
|
||||
margin-top: 1.3rem;
|
||||
margin-left: 1em;
|
||||
margin-right: 3em;
|
||||
// margin-top: 1.3rem;
|
||||
// margin-left: 1em;
|
||||
// margin-right: 3em;
|
||||
|
||||
.remove {
|
||||
background-color: white;
|
||||
|
|
|
|||
|
|
@ -1,36 +1,38 @@
|
|||
<div class="row notification-template-listing">
|
||||
<div class="col-md-8 offset-md-2">
|
||||
<div class="container-fluid">
|
||||
<div class="row notification-template-listing">
|
||||
<div class="col-md-10 offset-md-1">
|
||||
|
||||
<div class="row mb-4 mt-3">
|
||||
<div class="col">
|
||||
<h4>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-LISTING.TITLE' | translate}}</h4>
|
||||
<app-navigation-breadcrumb />
|
||||
<div class="row mb-4 mt-4">
|
||||
<div class="col">
|
||||
<h4>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-LISTING.TITLE' | translate}}</h4>
|
||||
<app-navigation-breadcrumb />
|
||||
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<button mat-raised-button class="create-btn"
|
||||
*ngIf="authService.hasPermission(authService.permissionEnum.EditNotificationTemplate)"
|
||||
[routerLink]="['/notification-templates/new']">
|
||||
<mat-icon>add</mat-icon>
|
||||
{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-LISTING.CREATE' | translate}}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<button mat-raised-button class="create-btn"
|
||||
*ngIf="authService.hasPermission(authService.permissionEnum.EditNotificationTemplate)"
|
||||
[routerLink]="['/notification-templates/new']">
|
||||
<mat-icon>add</mat-icon>
|
||||
{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-LISTING.CREATE' | translate}}
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<app-hybrid-listing [rows]="gridRows" [columns]="gridColumns" [visibleColumns]="visibleColumns"
|
||||
[count]="totalElements" [offset]="currentPageNumber" [limit]="lookup.page.size"
|
||||
[defaultSort]="lookup.order?.items" [externalSorting]="true" (rowActivated)="onRowActivated($event)"
|
||||
(pageLoad)="alterPage($event)" (columnSort)="onColumnSort($event)"
|
||||
(columnsChanged)="onColumnsChanged($event)" [listItemTemplate]="listItemTemplate">
|
||||
|
||||
<app-notification-template-listing-filters hybrid-listing-filters [(filter)]="lookup"
|
||||
(filterChange)="filterChanged($event)" />
|
||||
|
||||
<app-user-settings-picker [key]="userSettingsKey" [userPreference]="lookup"
|
||||
(onSettingSelected)="changeSetting($event)" [autoSelectUserSettings]="autoSelectUserSettings"
|
||||
user-preference-settings />
|
||||
</app-hybrid-listing>
|
||||
|
||||
</div>
|
||||
|
||||
<app-hybrid-listing [rows]="gridRows" [columns]="gridColumns" [visibleColumns]="visibleColumns"
|
||||
[count]="totalElements" [offset]="currentPageNumber" [limit]="lookup.page.size"
|
||||
[defaultSort]="lookup.order?.items" [externalSorting]="true" (rowActivated)="onRowActivated($event)"
|
||||
(pageLoad)="alterPage($event)" (columnSort)="onColumnSort($event)"
|
||||
(columnsChanged)="onColumnsChanged($event)" [listItemTemplate]="listItemTemplate">
|
||||
|
||||
<app-notification-template-listing-filters hybrid-listing-filters [(filter)]="lookup"
|
||||
(filterChange)="filterChanged($event)" />
|
||||
|
||||
<app-user-settings-picker [key]="userSettingsKey" [userPreference]="lookup"
|
||||
(onSettingSelected)="changeSetting($event)" [autoSelectUserSettings]="autoSelectUserSettings"
|
||||
user-preference-settings />
|
||||
</app-hybrid-listing>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
.notification-template-listing {
|
||||
margin-top: 1.3rem;
|
||||
margin-left: 1rem;
|
||||
margin-right: 2rem;
|
||||
// margin-top: 1.3rem;
|
||||
// margin-left: 1rem;
|
||||
// margin-right: 2rem;
|
||||
|
||||
.mat-header-row{
|
||||
background: #f3f5f8;
|
||||
|
|
|
|||
|
|
@ -1,31 +1,33 @@
|
|||
<div class="row notification-listing">
|
||||
<div class="col-md-8 offset-md-2">
|
||||
|
||||
<div class="row mb-4 mt-3">
|
||||
<div class="col">
|
||||
<h4>{{'NOTIFICATION-SERVICE.NOTIFICATION-LISTING.TITLE' | translate}}</h4>
|
||||
<app-navigation-breadcrumb />
|
||||
<div class="container-fluid">
|
||||
<div class="row notification-listing">
|
||||
<div class="col-md-10 offset-md-1">
|
||||
<div class="row mb-4 mt-4">
|
||||
<div class="col">
|
||||
<h4>{{'NOTIFICATION-SERVICE.NOTIFICATION-LISTING.TITLE' | translate}}</h4>
|
||||
<app-navigation-breadcrumb />
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<app-hybrid-listing [rows]="gridRows" [columns]="gridColumns" [visibleColumns]="visibleColumns"
|
||||
[count]="totalElements" [offset]="currentPageNumber" [limit]="lookup.page.size"
|
||||
[defaultSort]="lookup.order?.items" [externalSorting]="true"
|
||||
(pageLoad)="alterPage($event)" (columnSort)="onColumnSort($event)"
|
||||
(columnsChanged)="onColumnsChanged($event)" [listItemTemplate]="listItemTemplate">
|
||||
|
||||
<app-notification-listing-filters hybrid-listing-filters [(filter)]="lookup"
|
||||
(filterChange)="filterChanged($event)" />
|
||||
|
||||
<app-user-settings-picker [key]="userSettingsKey" [userPreference]="lookup"
|
||||
(onSettingSelected)="changeSetting($event)" [autoSelectUserSettings]="autoSelectUserSettings"
|
||||
user-preference-settings />
|
||||
</app-hybrid-listing>
|
||||
|
||||
</div>
|
||||
|
||||
<app-hybrid-listing [rows]="gridRows" [columns]="gridColumns" [visibleColumns]="visibleColumns"
|
||||
[count]="totalElements" [offset]="currentPageNumber" [limit]="lookup.page.size"
|
||||
[defaultSort]="lookup.order?.items" [externalSorting]="true"
|
||||
(pageLoad)="alterPage($event)" (columnSort)="onColumnSort($event)"
|
||||
(columnsChanged)="onColumnsChanged($event)" [listItemTemplate]="listItemTemplate">
|
||||
|
||||
<app-notification-listing-filters hybrid-listing-filters [(filter)]="lookup"
|
||||
(filterChange)="filterChanged($event)" />
|
||||
|
||||
<app-user-settings-picker [key]="userSettingsKey" [userPreference]="lookup"
|
||||
(onSettingSelected)="changeSetting($event)" [autoSelectUserSettings]="autoSelectUserSettings"
|
||||
user-preference-settings />
|
||||
</app-hybrid-listing>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<ng-template #listItemTemplate let-item="item" let-isColumnSelected="isColumnSelected">
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -8,9 +8,9 @@
|
|||
}
|
||||
|
||||
.notification-listing {
|
||||
margin-top: 1.3rem;
|
||||
margin-left: 1rem;
|
||||
margin-right: 2rem;
|
||||
// margin-top: 1.3rem;
|
||||
// margin-left: 1rem;
|
||||
// margin-right: 2rem;
|
||||
|
||||
.mat-header-row{
|
||||
background: #f3f5f8;
|
||||
|
|
|
|||
|
|
@ -1,151 +1,153 @@
|
|||
<div class="prefilling-source-editor">
|
||||
<div class="col-md-10 offset-md-1 colums-gapped" *ngIf="formGroup">
|
||||
<div class="container-fluid">
|
||||
<div class="row prefilling-source-editor">
|
||||
<div class="col-md-10 offset-md-1 colums-gapped" *ngIf="formGroup">
|
||||
|
||||
<div class="row justify-content-between align-items-center">
|
||||
<div class="col">
|
||||
<h3 *ngIf="isNew">{{'PREFILLING-SOURCE-EDITOR.NEW' | translate}}</h3>
|
||||
<app-navigation-breadcrumb />
|
||||
<div class="row justify-content-between align-items-center mt-4 mb-4">
|
||||
<div class="col">
|
||||
<h3 *ngIf="isNew">{{'PREFILLING-SOURCE-EDITOR.NEW' | translate}}</h3>
|
||||
<app-navigation-breadcrumb />
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<button mat-button class="action-btn" (click)="cancel()" type="button">{{'PREFILLING-SOURCE-EDITOR.ACTIONS.CANCEL' | translate}}</button>
|
||||
</div>
|
||||
<div class="col-auto" *ngIf="canDelete">
|
||||
<button mat-button class="action-btn" type="button" (click)="delete()">
|
||||
<mat-icon>delete</mat-icon>
|
||||
{{'PREFILLING-SOURCE-EDITOR.ACTIONS.DELETE' | translate}}
|
||||
</button>
|
||||
</div>
|
||||
<div class="col-auto" *ngIf="canSave">
|
||||
<button mat-button class="action-btn" (click)="formSubmit()">
|
||||
<mat-icon>save</mat-icon>
|
||||
{{'PREFILLING-SOURCE-EDITOR.ACTIONS.SAVE' | translate}}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<button mat-button class="action-btn" (click)="cancel()" type="button">{{'PREFILLING-SOURCE-EDITOR.ACTIONS.CANCEL' | translate}}</button>
|
||||
</div>
|
||||
<div class="col-auto" *ngIf="canDelete">
|
||||
<button mat-button class="action-btn" type="button" (click)="delete()">
|
||||
<mat-icon>delete</mat-icon>
|
||||
{{'PREFILLING-SOURCE-EDITOR.ACTIONS.DELETE' | translate}}
|
||||
</button>
|
||||
</div>
|
||||
<div class="col-auto" *ngIf="canSave">
|
||||
<button mat-button class="action-btn" (click)="formSubmit()">
|
||||
<mat-icon>save</mat-icon>
|
||||
{{'PREFILLING-SOURCE-EDITOR.ACTIONS.SAVE' | translate}}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<form *ngIf="formGroup" (ngSubmit)="formSubmit()">
|
||||
<mat-card appearance="outlined">
|
||||
<mat-card-header>
|
||||
<mat-card-title *ngIf="isNew">{{'PREFILLING-SOURCE-EDITOR.NEW' | translate}}</mat-card-title>
|
||||
</mat-card-header>
|
||||
<mat-card-content>
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'PREFILLING-SOURCE-EDITOR.FIELDS.LABEL' | translate}}</mat-label>
|
||||
<input matInput type="text" name="label" [formControl]="formGroup.get('label')" required>
|
||||
<mat-error *ngIf="formGroup.get('label').hasError('backendError')">{{formGroup.get('label').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('label').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
<form *ngIf="formGroup" (ngSubmit)="formSubmit()">
|
||||
<mat-card appearance="outlined">
|
||||
<mat-card-header>
|
||||
<mat-card-title *ngIf="isNew">{{'PREFILLING-SOURCE-EDITOR.NEW' | translate}}</mat-card-title>
|
||||
</mat-card-header>
|
||||
<mat-card-content>
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'PREFILLING-SOURCE-EDITOR.FIELDS.LABEL' | translate}}</mat-label>
|
||||
<input matInput type="text" name="label" [formControl]="formGroup.get('label')" required>
|
||||
<mat-error *ngIf="formGroup.get('label').hasError('backendError')">{{formGroup.get('label').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('label').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</mat-card-content>
|
||||
</mat-card>
|
||||
<mat-card appearance="outlined">
|
||||
<mat-card-header>
|
||||
<mat-card-title>{{'PREFILLING-SOURCE-EDITOR.FIELDS.FIXED-VALUE-FIELDS' | translate}}</mat-card-title>
|
||||
</mat-card-header>
|
||||
<mat-card-content>
|
||||
<div class="row">
|
||||
<!-- Fixed Value Fields -->
|
||||
</mat-card-content>
|
||||
</mat-card>
|
||||
<mat-card appearance="outlined">
|
||||
<mat-card-header>
|
||||
<mat-card-title>{{'PREFILLING-SOURCE-EDITOR.FIELDS.FIXED-VALUE-FIELDS' | translate}}</mat-card-title>
|
||||
</mat-card-header>
|
||||
<mat-card-content>
|
||||
<div class="row">
|
||||
<!-- Fixed Value Fields -->
|
||||
<div class="col-12">
|
||||
<div *ngFor="let field of formGroup.get('definition').get('fixedValueFields').controls; let fieldIndex=index;" class="row mb-3">
|
||||
<div class="col-12">
|
||||
<div class="row mb-3 d-flex align-items-center">
|
||||
<div class="col-auto d-flex">
|
||||
<mat-card-title>{{'PREFILLING-SOURCE-EDITOR.FIELDS.FIELD' | translate}} {{fieldIndex + 1}}</mat-card-title>
|
||||
</div>
|
||||
<div class="col-auto d-flex">
|
||||
<button mat-icon-button class="action-list-icon" matTooltip="{{'PREFILLING-SOURCE-EDITOR.ACTIONS.REMOVE-FIELD' | translate}}" (click)="removeFixedValueField(fieldIndex)" [disabled]="formGroup.disabled">
|
||||
<mat-icon>delete</mat-icon>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-9">
|
||||
<app-prefilling-source-field-component [form]="field"></app-prefilling-source-field-component>
|
||||
</div>
|
||||
<div class="col-3">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'PREFILLING-SOURCE-EDITOR.FIELDS.FIXED-VALUE' | translate}}</mat-label>
|
||||
<input matInput type="text" name="fixedValue" [formControl]="field.get('fixedValue')">
|
||||
<mat-error *ngIf="field.get('fixedValue').hasError('backendError')">{{field.get('fixedValue').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="field.get('fixedValue').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<button mat-button class="action-btn" type="button" (click)="addFixedValiueField()" [disabled]="formGroup.disabled">{{'PREFILLING-SOURCE-EDITOR.ACTIONS.ADD-FIELD' | translate}}</button>
|
||||
</div>
|
||||
</div>
|
||||
</mat-card-content>
|
||||
</mat-card>
|
||||
<mat-card appearance="outlined">
|
||||
<mat-card-header>
|
||||
<mat-card-title>{{'PREFILLING-SOURCE-EDITOR.FIELDS.FIELDS' | translate}}</mat-card-title>
|
||||
</mat-card-header>
|
||||
<mat-card-content>
|
||||
<!-- Fields -->
|
||||
<div class="col-12">
|
||||
<div *ngFor="let field of formGroup.get('definition').get('fixedValueFields').controls; let fieldIndex=index;" class="row mb-3">
|
||||
<div *ngFor="let field of formGroup.get('definition').get('fields').controls; let fieldIndex=index;" class="row mb-3">
|
||||
<div class="col-12">
|
||||
<div class="row mb-3 d-flex align-items-center">
|
||||
<div class="col-auto d-flex">
|
||||
<mat-card-title>{{'PREFILLING-SOURCE-EDITOR.FIELDS.FIELD' | translate}} {{fieldIndex + 1}}</mat-card-title>
|
||||
</div>
|
||||
<div class="col-auto d-flex">
|
||||
<button mat-icon-button class="action-list-icon" matTooltip="{{'PREFILLING-SOURCE-EDITOR.ACTIONS.REMOVE-FIELD' | translate}}" (click)="removeFixedValueField(fieldIndex)" [disabled]="formGroup.disabled">
|
||||
<button mat-icon-button class="action-list-icon" matTooltip="{{'PREFILLING-SOURCE-EDITOR.ACTIONS.REMOVE-FIELD' | translate}}" (click)="removeField(fieldIndex)" [disabled]="formGroup.disabled">
|
||||
<mat-icon>delete</mat-icon>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-3">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'PREFILLING-SOURCE-EDITOR.FIELDS.CODE' | translate}}</mat-label>
|
||||
<input matInput type="text" name="code" [formControl]="field.get('code')">
|
||||
<mat-error *ngIf="field.get('code').hasError('backendError')">{{field.get('code').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="field.get('code').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-9">
|
||||
<app-prefilling-source-field-component [form]="field"></app-prefilling-source-field-component>
|
||||
</div>
|
||||
<div class="col-3">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'PREFILLING-SOURCE-EDITOR.FIELDS.FIXED-VALUE' | translate}}</mat-label>
|
||||
<input matInput type="text" name="fixedValue" [formControl]="field.get('fixedValue')">
|
||||
<mat-error *ngIf="field.get('fixedValue').hasError('backendError')">{{field.get('fixedValue').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="field.get('fixedValue').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<button mat-button class="action-btn" type="button" (click)="addFixedValiueField()" [disabled]="formGroup.disabled">{{'PREFILLING-SOURCE-EDITOR.ACTIONS.ADD-FIELD' | translate}}</button>
|
||||
<button mat-button class="action-btn" type="button" (click)="addField()" [disabled]="formGroup.disabled">{{'PREFILLING-SOURCE-EDITOR.ACTIONS.ADD-FIELD' | translate}}</button>
|
||||
<button mat-button class="action-btn" *ngIf="formGroup.get('definition').get('fields').value != ''" type="button" (click)="submitFields()" [disabled]="!formGroup.get('definition').get('fields').valid">{{'PREFILLING-SOURCE-EDITOR.ACTIONS.SUBMIT-FIELDS' | translate}}</button>
|
||||
</div>
|
||||
</div>
|
||||
</mat-card-content>
|
||||
</mat-card>
|
||||
<mat-card appearance="outlined">
|
||||
<mat-card-header>
|
||||
<mat-card-title>{{'PREFILLING-SOURCE-EDITOR.FIELDS.FIELDS' | translate}}</mat-card-title>
|
||||
</mat-card-header>
|
||||
<mat-card-content>
|
||||
<!-- Fields -->
|
||||
<div class="col-12">
|
||||
<div *ngFor="let field of formGroup.get('definition').get('fields').controls; let fieldIndex=index;" class="row mb-3">
|
||||
<div class="col-12">
|
||||
<div class="row mb-3 d-flex align-items-center">
|
||||
<div class="col-auto d-flex">
|
||||
<mat-card-title>{{'PREFILLING-SOURCE-EDITOR.FIELDS.FIELD' | translate}} {{fieldIndex + 1}}</mat-card-title>
|
||||
</div>
|
||||
<div class="col-auto d-flex">
|
||||
<button mat-icon-button class="action-list-icon" matTooltip="{{'PREFILLING-SOURCE-EDITOR.ACTIONS.REMOVE-FIELD' | translate}}" (click)="removeField(fieldIndex)" [disabled]="formGroup.disabled">
|
||||
<mat-icon>delete</mat-icon>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-3">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'PREFILLING-SOURCE-EDITOR.FIELDS.CODE' | translate}}</mat-label>
|
||||
<input matInput type="text" name="code" [formControl]="field.get('code')">
|
||||
<mat-error *ngIf="field.get('code').hasError('backendError')">{{field.get('code').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="field.get('code').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-9">
|
||||
<app-prefilling-source-field-component [form]="field"></app-prefilling-source-field-component>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</mat-card-content>
|
||||
</mat-card>
|
||||
|
||||
<mat-card appearance="outlined">
|
||||
<mat-card-header>
|
||||
<mat-card-title>{{'PREFILLING-SOURCE-EDITOR.FIELDS.SOURCE-CONFIGURATION' | translate}}</mat-card-title>
|
||||
</mat-card-header>
|
||||
<mat-card-content>
|
||||
<app-external-fetcher-source-component [formGroup]="formGroup.get('definition').get('searchConfiguration')" [validationErrorModel]="editorModel.validationErrorModel" [validationRootPath]="'definition.searchConfiguration.'"></app-external-fetcher-source-component>
|
||||
<div>
|
||||
<mat-checkbox [formControl]="formGroup.get('definition').get('getEnabled')" (change)="getEnabledChanged($event)">
|
||||
{{'PREFILLING-SOURCE-EDITOR.FIELDS.GET-SOURCE-CONFIGURATION' | translate}}
|
||||
<mat-error *ngIf="formGroup.get('definition').get('getEnabled').hasError('backendError')">{{formGroup.get('definition').get('getEnabled').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('definition').get('getEnabled').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-checkbox>
|
||||
</div>
|
||||
<button mat-button class="action-btn" type="button" (click)="addField()" [disabled]="formGroup.disabled">{{'PREFILLING-SOURCE-EDITOR.ACTIONS.ADD-FIELD' | translate}}</button>
|
||||
<button mat-button class="action-btn" *ngIf="formGroup.get('definition').get('fields').value != ''" type="button" (click)="submitFields()" [disabled]="!formGroup.get('definition').get('fields').valid">{{'PREFILLING-SOURCE-EDITOR.ACTIONS.SUBMIT-FIELDS' | translate}}</button>
|
||||
</div>
|
||||
</mat-card-content>
|
||||
</mat-card>
|
||||
</mat-card-content>
|
||||
</mat-card>
|
||||
|
||||
<mat-card appearance="outlined">
|
||||
<mat-card-header>
|
||||
<mat-card-title>{{'PREFILLING-SOURCE-EDITOR.FIELDS.SOURCE-CONFIGURATION' | translate}}</mat-card-title>
|
||||
</mat-card-header>
|
||||
<mat-card-content>
|
||||
<app-external-fetcher-source-component [formGroup]="formGroup.get('definition').get('searchConfiguration')" [validationErrorModel]="editorModel.validationErrorModel" [validationRootPath]="'definition.searchConfiguration.'"></app-external-fetcher-source-component>
|
||||
<div>
|
||||
<mat-checkbox [formControl]="formGroup.get('definition').get('getEnabled')" (change)="getEnabledChanged($event)">
|
||||
{{'PREFILLING-SOURCE-EDITOR.FIELDS.GET-SOURCE-CONFIGURATION' | translate}}
|
||||
<mat-error *ngIf="formGroup.get('definition').get('getEnabled').hasError('backendError')">{{formGroup.get('definition').get('getEnabled').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('definition').get('getEnabled').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-checkbox>
|
||||
</div>
|
||||
</mat-card-content>
|
||||
</mat-card>
|
||||
|
||||
<mat-card appearance="outlined" *ngIf="formGroup.get('definition').get('getEnabled').value == true">
|
||||
<mat-card-header>
|
||||
<mat-card-title>{{'PREFILLING-SOURCE-EDITOR.FIELDS.GET-SOURCE-CONFIGURATION' | translate}}</mat-card-title>
|
||||
</mat-card-header>
|
||||
<mat-card-content>
|
||||
<app-external-fetcher-source-component [formGroup]="formGroup.get('definition').get('getConfiguration')" [validationErrorModel]="editorModel.validationErrorModel" [validationRootPath]="'definition.getConfiguration.'"></app-external-fetcher-source-component>
|
||||
</mat-card-content>
|
||||
</mat-card>
|
||||
</form>
|
||||
<mat-card appearance="outlined" *ngIf="formGroup.get('definition').get('getEnabled').value == true">
|
||||
<mat-card-header>
|
||||
<mat-card-title>{{'PREFILLING-SOURCE-EDITOR.FIELDS.GET-SOURCE-CONFIGURATION' | translate}}</mat-card-title>
|
||||
</mat-card-header>
|
||||
<mat-card-content>
|
||||
<app-external-fetcher-source-component [formGroup]="formGroup.get('definition').get('getConfiguration')" [validationErrorModel]="editorModel.validationErrorModel" [validationRootPath]="'definition.getConfiguration.'"></app-external-fetcher-source-component>
|
||||
</mat-card-content>
|
||||
</mat-card>
|
||||
</form>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
.prefilling-source-editor {
|
||||
margin-top: 1.3rem;
|
||||
margin-left: 1em;
|
||||
margin-right: 3em;
|
||||
// margin-top: 1.3rem;
|
||||
// margin-left: 1em;
|
||||
// margin-right: 3em;
|
||||
|
||||
.remove {
|
||||
background-color: white;
|
||||
|
|
|
|||
|
|
@ -1,36 +1,38 @@
|
|||
<div class="row prefilling-source-listing">
|
||||
<div class="col-md-8 offset-md-2">
|
||||
<div class="container-fluid">
|
||||
<div class="row prefilling-source-listing">
|
||||
<div class="col-md-10 offset-md-1">
|
||||
|
||||
<div class="row mb-4 mt-3">
|
||||
<div class="col">
|
||||
<h4>{{'PREFILLING-SOURCE-LISTING.TITLE' | translate}}</h4>
|
||||
<app-navigation-breadcrumb />
|
||||
<div class="row mb-4 mt-4">
|
||||
<div class="col">
|
||||
<h4>{{'PREFILLING-SOURCE-LISTING.TITLE' | translate}}</h4>
|
||||
<app-navigation-breadcrumb />
|
||||
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<button mat-raised-button class="create-btn"
|
||||
*ngIf="authService.hasPermission(authService.permissionEnum.EditPrefillingSource)"
|
||||
[routerLink]="['/prefilling-sources/new']">
|
||||
<mat-icon>add</mat-icon>
|
||||
{{'PREFILLING-SOURCE-LISTING.CREATE' | translate}}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<button mat-raised-button class="create-btn"
|
||||
*ngIf="authService.hasPermission(authService.permissionEnum.EditPrefillingSource)"
|
||||
[routerLink]="['/prefilling-sources/new']">
|
||||
<mat-icon>add</mat-icon>
|
||||
{{'PREFILLING-SOURCE-LISTING.CREATE' | translate}}
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<app-hybrid-listing [rows]="gridRows" [columns]="gridColumns" [visibleColumns]="visibleColumns"
|
||||
[count]="totalElements" [offset]="currentPageNumber" [limit]="lookup.page.size"
|
||||
[defaultSort]="lookup.order?.items" [externalSorting]="true" (rowActivated)="onRowActivated($event)"
|
||||
(pageLoad)="alterPage($event)" (columnSort)="onColumnSort($event)"
|
||||
(columnsChanged)="onColumnsChanged($event)" [listItemTemplate]="listItemTemplate">
|
||||
|
||||
<app-prefilling-source-listing-filters hybrid-listing-filters [(filter)]="lookup"
|
||||
(filterChange)="filterChanged($event)" />
|
||||
|
||||
<app-user-settings-picker [key]="userSettingsKey" [userPreference]="lookup"
|
||||
(onSettingSelected)="changeSetting($event)" [autoSelectUserSettings]="autoSelectUserSettings"
|
||||
user-preference-settings />
|
||||
</app-hybrid-listing>
|
||||
|
||||
</div>
|
||||
|
||||
<app-hybrid-listing [rows]="gridRows" [columns]="gridColumns" [visibleColumns]="visibleColumns"
|
||||
[count]="totalElements" [offset]="currentPageNumber" [limit]="lookup.page.size"
|
||||
[defaultSort]="lookup.order?.items" [externalSorting]="true" (rowActivated)="onRowActivated($event)"
|
||||
(pageLoad)="alterPage($event)" (columnSort)="onColumnSort($event)"
|
||||
(columnsChanged)="onColumnsChanged($event)" [listItemTemplate]="listItemTemplate">
|
||||
|
||||
<app-prefilling-source-listing-filters hybrid-listing-filters [(filter)]="lookup"
|
||||
(filterChange)="filterChanged($event)" />
|
||||
|
||||
<app-user-settings-picker [key]="userSettingsKey" [userPreference]="lookup"
|
||||
(onSettingSelected)="changeSetting($event)" [autoSelectUserSettings]="autoSelectUserSettings"
|
||||
user-preference-settings />
|
||||
</app-hybrid-listing>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -4,9 +4,9 @@
|
|||
}
|
||||
|
||||
.prefilling-source-listing {
|
||||
margin-top: 1.3rem;
|
||||
margin-left: 1rem;
|
||||
margin-right: 2rem;
|
||||
// margin-top: 1.3rem;
|
||||
// margin-left: 1rem;
|
||||
// margin-right: 2rem;
|
||||
|
||||
.mat-header-row {
|
||||
background: #f3f5f8;
|
||||
|
|
|
|||
|
|
@ -1,150 +1,151 @@
|
|||
<div class="reference-type-editor">
|
||||
<div class="col-md-8 offset-md-2 colums-gapped">
|
||||
<div class="container-fluid">
|
||||
<div class="row reference-type-editor">
|
||||
<div class="col-md-10 offset-md-1 colums-gapped">
|
||||
<div class="row justify-content-between align-items-center">
|
||||
<div class="col">
|
||||
<h3 *ngIf="isNew">{{'REFERENCE-TYPE-EDITOR.NEW' | translate}}</h3>
|
||||
<app-navigation-breadcrumb />
|
||||
</div>
|
||||
|
||||
<div class="row justify-content-between align-items-center">
|
||||
<div class="col">
|
||||
<h3 *ngIf="isNew">{{'REFERENCE-TYPE-EDITOR.NEW' | translate}}</h3>
|
||||
<app-navigation-breadcrumb />
|
||||
<div class="col-auto">
|
||||
<button mat-button class="action-btn" (click)="cancel()" type="button">{{'REFERENCE-TYPE-EDITOR.ACTIONS.CANCEL' | translate}}</button>
|
||||
</div>
|
||||
<div class="col-auto" *ngIf="canDelete">
|
||||
<button mat-button (click)="delete()" class="action-btn" type="button">
|
||||
<mat-icon>delete</mat-icon>
|
||||
{{'REFERENCE-TYPE-EDITOR.ACTIONS.DELETE' | translate}}
|
||||
</button>
|
||||
</div>
|
||||
<div class="col-auto" *ngIf="canSave">
|
||||
<button mat-button class="action-btn" (click)="formSubmit()">
|
||||
<mat-icon>save</mat-icon>
|
||||
{{'REFERENCE-TYPE-EDITOR.ACTIONS.SAVE' | translate}}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-auto">
|
||||
<button mat-button class="action-btn" (click)="cancel()" type="button">{{'REFERENCE-TYPE-EDITOR.ACTIONS.CANCEL' | translate}}</button>
|
||||
</div>
|
||||
<div class="col-auto" *ngIf="canDelete">
|
||||
<button mat-button (click)="delete()" class="action-btn" type="button">
|
||||
<mat-icon>delete</mat-icon>
|
||||
{{'REFERENCE-TYPE-EDITOR.ACTIONS.DELETE' | translate}}
|
||||
</button>
|
||||
</div>
|
||||
<div class="col-auto" *ngIf="canSave">
|
||||
<button mat-button class="action-btn" (click)="formSubmit()">
|
||||
<mat-icon>save</mat-icon>
|
||||
{{'REFERENCE-TYPE-EDITOR.ACTIONS.SAVE' | translate}}
|
||||
</button>
|
||||
</div>
|
||||
<mat-card appearance="outlined">
|
||||
<mat-card-header>
|
||||
<mat-card-title *ngIf="isNew">{{'REFERENCE-TYPE-EDITOR.NEW' | translate}}</mat-card-title>
|
||||
</mat-card-header>
|
||||
<mat-card-content>
|
||||
<form (ngSubmit)="formSubmit()" [formGroup]="formGroup" *ngIf="formGroup">
|
||||
<div class="row">
|
||||
<div class="col-6">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.NAME' | translate}}</mat-label>
|
||||
<input matInput type="text" name="name" [formControl]="formGroup.get('name')" required>
|
||||
<mat-error *ngIf="formGroup.get('name').hasError('backendError')">{{formGroup.get('name').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('name').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.CODE' | translate}}</mat-label>
|
||||
<input matInput type="text" name="name" [formControl]="formGroup.get('code')" required>
|
||||
<mat-error *ngIf="formGroup.get('code').hasError('backendError')">{{formGroup.get('code').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('code').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
|
||||
<div class="col-12 mt-3 mb-3">
|
||||
<div class="row d-flex align-items-center">
|
||||
<div class="col-auto">
|
||||
<h3 class="m-0">{{'REFERENCE-TYPE-EDITOR.FIELDS.FIELDS' | translate}}</h3>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<button mat-button class="action-btn" type="button" (click)="addField()" [disabled]="formGroup.disabled">{{'REFERENCE-TYPE-EDITOR.ACTIONS.ADD-FIELD' | translate}}</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- FIELDS -->
|
||||
<div class="col-12">
|
||||
<div *ngFor="let field of formGroup.get('definition').get('fields').controls; let fieldIndex=index;" class="row mb-3">
|
||||
<div class="col-12">
|
||||
<div class="row d-flex align-items-center">
|
||||
<div class="col-auto pb-3 d-flex">
|
||||
<span>{{fieldIndex + 1}}</span>
|
||||
</div>
|
||||
<div class="col">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.LABEL' | translate}}</mat-label>
|
||||
<input matInput type="text" name="label" [formControl]="field.get('label')" required>
|
||||
<mat-error *ngIf="field.get('label').hasError('backendError')">{{field.get('label').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="field.get('label').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.DESCRIPTION' | translate}}</mat-label>
|
||||
<input matInput type="text" name="description" [formControl]="field.get('description')">
|
||||
<mat-error *ngIf="field.get('description').hasError('backendError')">{{field.get('description').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="field.get('description').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.CODE' | translate}}</mat-label>
|
||||
<input matInput type="text" name="code" [formControl]="field.get('code')" required>
|
||||
<mat-error *ngIf="field.get('code').hasError('backendError')">{{field.get('code').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="field.get('code').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.DATA-TYPE' | translate}}</mat-label>
|
||||
<mat-select name="dataType" [formControl]="field.get('dataType')">
|
||||
<mat-option *ngFor="let fieldDataType of referenceFieldDataTypeEnum" [value]="fieldDataType">
|
||||
{{enumUtils.toReferenceFieldDataTypeString(fieldDataType)}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
<mat-error *ngIf="field.get('dataType').hasError('backendError')">{{field.get('dataType').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="field.get('dataType').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-auto pb-3 d-flex">
|
||||
<button mat-icon-button class="action-list-icon" matTooltip="{{'REFERENCE-TYPE-EDITOR.ACTIONS.REMOVE-FIELD' | translate}}" (click)="removeField(fieldIndex)" [disabled]="formGroup.disabled">
|
||||
<mat-icon>delete</mat-icon>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<button mat-button class="action-btn" *ngIf="formGroup.get('definition').get('fields').value != ''" type="button" (click)="submitFields()" [disabled]="!formGroup.get('definition').get('fields').valid">{{'REFERENCE-TYPE-EDITOR.ACTIONS.SUBMIT-FIELDS' | translate}}</button>
|
||||
</div>
|
||||
<div class="col-12 mt-3 mb-3">
|
||||
<div class="row d-flex align-items-center">
|
||||
<div class="col-auto">
|
||||
<h3 class="m-0">{{'REFERENCE-TYPE-EDITOR.FIELDS.SOURCES' | translate}}</h3>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<button mat-button class="action-btn" type="button" (click)="addSource()" [disabled]="formGroup.disabled">{{'REFERENCE-TYPE-EDITOR.ACTIONS.ADD-SOURCE' | translate}}</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<div *ngFor="let source of formGroup.get('definition').get('sources').controls; let sourceIndex=index;" class="row">
|
||||
<div class="col-12">
|
||||
<div class="row mb-3 d-flex align-items-center">
|
||||
<div class="col-auto d-flex">
|
||||
<mat-card-title>{{'REFERENCE-TYPE-EDITOR.FIELDS.SOURCE-CONFIGURATION' | translate}} {{sourceIndex + 1}}</mat-card-title>
|
||||
</div>
|
||||
<div class="col-auto d-flex">
|
||||
<button mat-icon-button class="action-list-icon" matTooltip="{{'REFERENCE-TYPE-EDITOR.ACTIONS.REMOVE-SOURCE' | translate}}" (click)="removeSource(sourceIndex)" [disabled]="formGroup.disabled">
|
||||
<mat-icon>delete</mat-icon>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<app-external-fetcher-source-component [formGroup]="source" [validationErrorModel]="editorModel.validationErrorModel" [validationRootPath]="'definition.sources[' + sourceIndex + '].'" [referenceTypeSourceIndex]="sourceIndex" [referenceTypes]="referenceTypes" [sourceKeysMap]="sourceKeysMap">
|
||||
</app-external-fetcher-source-component>
|
||||
</div>
|
||||
</div>
|
||||
<mat-error *ngIf="formGroup.get('definition').get('sources').dirty && formGroup.get('definition').get('sources').hasError('required')">{{'REFERENCE-TYPE-EDITOR.SOURCES-REQUIRED' | translate}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('definition').get('sources').hasError('backendError')">{{formGroup.get('definition').get('sources').getError('backendError').message}}</mat-error>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</mat-card-content>
|
||||
</mat-card>
|
||||
</div>
|
||||
|
||||
<mat-card appearance="outlined">
|
||||
<mat-card-header>
|
||||
<mat-card-title *ngIf="isNew">{{'REFERENCE-TYPE-EDITOR.NEW' | translate}}</mat-card-title>
|
||||
</mat-card-header>
|
||||
<mat-card-content>
|
||||
<form (ngSubmit)="formSubmit()" [formGroup]="formGroup" *ngIf="formGroup">
|
||||
<div class="row">
|
||||
<div class="col-6">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.NAME' | translate}}</mat-label>
|
||||
<input matInput type="text" name="name" [formControl]="formGroup.get('name')" required>
|
||||
<mat-error *ngIf="formGroup.get('name').hasError('backendError')">{{formGroup.get('name').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('name').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.CODE' | translate}}</mat-label>
|
||||
<input matInput type="text" name="name" [formControl]="formGroup.get('code')" required>
|
||||
<mat-error *ngIf="formGroup.get('code').hasError('backendError')">{{formGroup.get('code').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('code').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
|
||||
<div class="col-12 mt-3 mb-3">
|
||||
<div class="row d-flex align-items-center">
|
||||
<div class="col-auto">
|
||||
<h3 class="m-0">{{'REFERENCE-TYPE-EDITOR.FIELDS.FIELDS' | translate}}</h3>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<button mat-button class="action-btn" type="button" (click)="addField()" [disabled]="formGroup.disabled">{{'REFERENCE-TYPE-EDITOR.ACTIONS.ADD-FIELD' | translate}}</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- FIELDS -->
|
||||
<div class="col-12">
|
||||
<div *ngFor="let field of formGroup.get('definition').get('fields').controls; let fieldIndex=index;" class="row mb-3">
|
||||
<div class="col-12">
|
||||
<div class="row d-flex align-items-center">
|
||||
<div class="col-auto pb-3 d-flex">
|
||||
<span>{{fieldIndex + 1}}</span>
|
||||
</div>
|
||||
<div class="col">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.LABEL' | translate}}</mat-label>
|
||||
<input matInput type="text" name="label" [formControl]="field.get('label')" required>
|
||||
<mat-error *ngIf="field.get('label').hasError('backendError')">{{field.get('label').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="field.get('label').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.DESCRIPTION' | translate}}</mat-label>
|
||||
<input matInput type="text" name="description" [formControl]="field.get('description')">
|
||||
<mat-error *ngIf="field.get('description').hasError('backendError')">{{field.get('description').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="field.get('description').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.CODE' | translate}}</mat-label>
|
||||
<input matInput type="text" name="code" [formControl]="field.get('code')" required>
|
||||
<mat-error *ngIf="field.get('code').hasError('backendError')">{{field.get('code').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="field.get('code').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.DATA-TYPE' | translate}}</mat-label>
|
||||
<mat-select name="dataType" [formControl]="field.get('dataType')">
|
||||
<mat-option *ngFor="let fieldDataType of referenceFieldDataTypeEnum" [value]="fieldDataType">
|
||||
{{enumUtils.toReferenceFieldDataTypeString(fieldDataType)}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
<mat-error *ngIf="field.get('dataType').hasError('backendError')">{{field.get('dataType').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="field.get('dataType').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-auto pb-3 d-flex">
|
||||
<button mat-icon-button class="action-list-icon" matTooltip="{{'REFERENCE-TYPE-EDITOR.ACTIONS.REMOVE-FIELD' | translate}}" (click)="removeField(fieldIndex)" [disabled]="formGroup.disabled">
|
||||
<mat-icon>delete</mat-icon>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<button mat-button class="action-btn" *ngIf="formGroup.get('definition').get('fields').value != ''" type="button" (click)="submitFields()" [disabled]="!formGroup.get('definition').get('fields').valid">{{'REFERENCE-TYPE-EDITOR.ACTIONS.SUBMIT-FIELDS' | translate}}</button>
|
||||
</div>
|
||||
<div class="col-12 mt-3 mb-3">
|
||||
<div class="row d-flex align-items-center">
|
||||
<div class="col-auto">
|
||||
<h3 class="m-0">{{'REFERENCE-TYPE-EDITOR.FIELDS.SOURCES' | translate}}</h3>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<button mat-button class="action-btn" type="button" (click)="addSource()" [disabled]="formGroup.disabled">{{'REFERENCE-TYPE-EDITOR.ACTIONS.ADD-SOURCE' | translate}}</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<div *ngFor="let source of formGroup.get('definition').get('sources').controls; let sourceIndex=index;" class="row">
|
||||
<div class="col-12">
|
||||
<div class="row mb-3 d-flex align-items-center">
|
||||
<div class="col-auto d-flex">
|
||||
<mat-card-title>{{'REFERENCE-TYPE-EDITOR.FIELDS.SOURCE-CONFIGURATION' | translate}} {{sourceIndex + 1}}</mat-card-title>
|
||||
</div>
|
||||
<div class="col-auto d-flex">
|
||||
<button mat-icon-button class="action-list-icon" matTooltip="{{'REFERENCE-TYPE-EDITOR.ACTIONS.REMOVE-SOURCE' | translate}}" (click)="removeSource(sourceIndex)" [disabled]="formGroup.disabled">
|
||||
<mat-icon>delete</mat-icon>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<app-external-fetcher-source-component [formGroup]="source" [validationErrorModel]="editorModel.validationErrorModel" [validationRootPath]="'definition.sources[' + sourceIndex + '].'" [referenceTypeSourceIndex]="sourceIndex" [referenceTypes]="referenceTypes" [sourceKeysMap]="sourceKeysMap">
|
||||
</app-external-fetcher-source-component>
|
||||
</div>
|
||||
</div>
|
||||
<mat-error *ngIf="formGroup.get('definition').get('sources').dirty && formGroup.get('definition').get('sources').hasError('required')">{{'REFERENCE-TYPE-EDITOR.SOURCES-REQUIRED' | translate}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('definition').get('sources').hasError('backendError')">{{formGroup.get('definition').get('sources').getError('backendError').message}}</mat-error>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</mat-card-content>
|
||||
</mat-card>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
.reference-type-editor {
|
||||
margin-top: 1.3rem;
|
||||
margin-left: 1em;
|
||||
margin-right: 3em;
|
||||
// margin-top: 1.3rem;
|
||||
// margin-left: 1em;
|
||||
// margin-right: 3em;
|
||||
|
||||
.remove {
|
||||
background-color: white;
|
||||
|
|
|
|||
|
|
@ -1,42 +1,45 @@
|
|||
<div class="row reference-type-listing">
|
||||
<div class="col-md-8 offset-md-2">
|
||||
<div class="container-fluid">
|
||||
<div class="row reference-type-listing">
|
||||
<div class="col-md-10 offset-md-1">
|
||||
|
||||
<div class="row mb-4 mt-3">
|
||||
<div class="col">
|
||||
<h4>{{'REFERENCE-TYPE-LISTING.TITLE' | translate}}</h4>
|
||||
<app-navigation-breadcrumb />
|
||||
<div class="row mb-4 mt-4">
|
||||
<div class="col">
|
||||
<h4>{{'REFERENCE-TYPE-LISTING.TITLE' | translate}}</h4>
|
||||
<app-navigation-breadcrumb />
|
||||
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<button mat-raised-button class="create-btn"
|
||||
*ngIf="authService.hasPermission(authService.permissionEnum.EditReferenceType)"
|
||||
[routerLink]="['/reference-type/new']">
|
||||
<mat-icon>add</mat-icon>
|
||||
{{'REFERENCE-TYPE-LISTING.CREATE-TYPE' | translate}}
|
||||
</button>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<button mat-raised-button class="create-btn"
|
||||
*ngIf="authService.hasPermission(authService.permissionEnum.EditReferenceType)"
|
||||
[routerLink]="['/reference-type/new']">
|
||||
<mat-icon>add</mat-icon>
|
||||
{{'REFERENCE-TYPE-LISTING.CREATE-TYPE' | translate}}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<app-hybrid-listing [rows]="gridRows" [columns]="gridColumns" [visibleColumns]="visibleColumns"
|
||||
[count]="totalElements" [offset]="currentPageNumber" [limit]="lookup.page.size"
|
||||
[defaultSort]="lookup.order?.items" [externalSorting]="true" (rowActivated)="onRowActivated($event)"
|
||||
(pageLoad)="alterPage($event)" (columnSort)="onColumnSort($event)"
|
||||
(columnsChanged)="onColumnsChanged($event)" [listItemTemplate]="listItemTemplate">
|
||||
|
||||
<app-reference-type-listing-filters hybrid-listing-filters [(filter)]="lookup"
|
||||
(filterChange)="filterChanged($event)" />
|
||||
|
||||
<app-user-settings-picker [key]="userSettingsKey" [userPreference]="lookup"
|
||||
(onSettingSelected)="changeSetting($event)" [autoSelectUserSettings]="autoSelectUserSettings"
|
||||
user-preference-settings />
|
||||
<!-- <button mat-icon-button download-listing-report>
|
||||
<mat-icon>download</mat-icon>
|
||||
</button> -->
|
||||
</app-hybrid-listing>
|
||||
|
||||
</div>
|
||||
|
||||
<app-hybrid-listing [rows]="gridRows" [columns]="gridColumns" [visibleColumns]="visibleColumns"
|
||||
[count]="totalElements" [offset]="currentPageNumber" [limit]="lookup.page.size"
|
||||
[defaultSort]="lookup.order?.items" [externalSorting]="true" (rowActivated)="onRowActivated($event)"
|
||||
(pageLoad)="alterPage($event)" (columnSort)="onColumnSort($event)"
|
||||
(columnsChanged)="onColumnsChanged($event)" [listItemTemplate]="listItemTemplate">
|
||||
|
||||
<app-reference-type-listing-filters hybrid-listing-filters [(filter)]="lookup"
|
||||
(filterChange)="filterChanged($event)" />
|
||||
|
||||
<app-user-settings-picker [key]="userSettingsKey" [userPreference]="lookup"
|
||||
(onSettingSelected)="changeSetting($event)" [autoSelectUserSettings]="autoSelectUserSettings"
|
||||
user-preference-settings />
|
||||
<!-- <button mat-icon-button download-listing-report>
|
||||
<mat-icon>download</mat-icon>
|
||||
</button> -->
|
||||
</app-hybrid-listing>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<ng-template #listItemTemplate let-item="item" let-isColumnSelected="isColumnSelected">
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
.reference-type-listing {
|
||||
margin-top: 1.3rem;
|
||||
margin-left: 1rem;
|
||||
margin-right: 2rem;
|
||||
// margin-top: 1.3rem;
|
||||
// margin-left: 1rem;
|
||||
// margin-right: 2rem;
|
||||
|
||||
.mat-header-row{
|
||||
background: #f3f5f8;
|
||||
|
|
|
|||
|
|
@ -1,148 +1,150 @@
|
|||
<div class="reference-editor">
|
||||
<div class="col-md-8 offset-md-2 colums-gapped">
|
||||
<div class="row align-items-center mb-4" *ngIf="formGroup">
|
||||
<div class="col-auto">
|
||||
<h3 *ngIf="isNew && !isClone">{{'REFERENCE-EDITOR.NEW' | translate}}</h3>
|
||||
<app-navigation-breadcrumb />
|
||||
<div class="container-fluid">
|
||||
<div class="row reference-editor">
|
||||
<div class="col-md-10 offset-md-1 colums-gapped">
|
||||
<div class="row align-items-center mt-4 mb-4" *ngIf="formGroup">
|
||||
<div class="col-auto">
|
||||
<h3 *ngIf="isNew && !isClone">{{'REFERENCE-EDITOR.NEW' | translate}}</h3>
|
||||
<app-navigation-breadcrumb />
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<button mat-button class="action-btn" (click)="cancel()" type="button">{{'REFERENCE-EDITOR.ACTIONS.CANCEL' | translate}}</button>
|
||||
</div>
|
||||
<div class="col-auto" *ngIf="!isNew">
|
||||
<button mat-button class="action-btn" type="button" (click)="delete()">
|
||||
<mat-icon>delete</mat-icon>
|
||||
{{'REFERENCE-EDITOR.ACTIONS.DELETE' | translate}}
|
||||
</button>
|
||||
</div>
|
||||
<div class="col-auto" *ngIf="canSave">
|
||||
<button mat-button class="action-btn" (click)="formSubmit()">
|
||||
<mat-icon>save</mat-icon>
|
||||
{{'REFERENCE-EDITOR.ACTIONS.SAVE' | translate}}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<button mat-button class="action-btn" (click)="cancel()" type="button">{{'REFERENCE-EDITOR.ACTIONS.CANCEL' | translate}}</button>
|
||||
</div>
|
||||
<div class="col-auto" *ngIf="!isNew">
|
||||
<button mat-button class="action-btn" type="button" (click)="delete()">
|
||||
<mat-icon>delete</mat-icon>
|
||||
{{'REFERENCE-EDITOR.ACTIONS.DELETE' | translate}}
|
||||
</button>
|
||||
</div>
|
||||
<div class="col-auto" *ngIf="canSave">
|
||||
<button mat-button class="action-btn" (click)="formSubmit()">
|
||||
<mat-icon>save</mat-icon>
|
||||
{{'REFERENCE-EDITOR.ACTIONS.SAVE' | translate}}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<form *ngIf="formGroup" (ngSubmit)="formSubmit()">
|
||||
<mat-card appearance="outlined">
|
||||
<mat-card-header>
|
||||
<mat-card-title *ngIf="isNew">{{'REFERENCE-EDITOR.NEW' | translate}}</mat-card-title>
|
||||
</mat-card-header>
|
||||
<mat-card-content class="pt-2">
|
||||
<div class="row">
|
||||
<div class="col-4">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'REFERENCE-EDITOR.FIELDS.LABEL' | translate}}</mat-label>
|
||||
<input matInput type="text" name="label" [formControl]="formGroup.get('label')" required>
|
||||
<mat-error *ngIf="formGroup.get('label').hasError('backendError')">{{formGroup.get('label').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('label').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-4">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'REFERENCE-EDITOR.FIELDS.REFERENCE' | translate}}</mat-label>
|
||||
<input matInput type="text" name="reference" [formControl]="formGroup.get('reference')" required>
|
||||
<mat-error *ngIf="formGroup.get('reference').hasError('backendError')">{{formGroup.get('reference').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('reference').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-4">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'REFERENCE-EDITOR.FIELDS.TYPE' | translate}}</mat-label>
|
||||
<app-single-auto-complete [required]="formGroup.get('typeId').required" [formControl]="formGroup.get('typeId')" placeholder="{{'REFERENCE-EDITOR.FIELDS.TYPE' | translate}}" [configuration]="referenceTypeService.singleAutocompleteConfiguration">
|
||||
</app-single-auto-complete>
|
||||
<mat-error *ngIf="formGroup.get('typeId').hasError('backendError')">{{formGroup.get('type').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('typeId').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-4">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'REFERENCE-EDITOR.FIELDS.SOURCE' | translate}}</mat-label>
|
||||
<input matInput type="text" name="source" [formControl]="formGroup.get('source')" required>
|
||||
<mat-error *ngIf="formGroup.get('source').hasError('backendError')">{{formGroup.get('source').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('source').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-4">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'REFERENCE-EDITOR.FIELDS.SOURCE-TYPE' | translate}}</mat-label>
|
||||
<mat-select name="type" [formControl]="formGroup.get('sourceType')" required>
|
||||
<mat-option *ngFor="let sourceType of referenceSourceTypeEnum" [value]="sourceType">
|
||||
{{enumUtils.toReferenceSourceTypeString(sourceType)}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
<mat-error *ngIf="formGroup.get('sourceType').hasError('backendError')">{{formGroup.get('sourceType').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('sourceType').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-4">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'REFERENCE-EDITOR.FIELDS.ABBREVIATION' | translate}}</mat-label>
|
||||
<input matInput type="text" name="abbreviation" [formControl]="formGroup.get('abbreviation')">
|
||||
<mat-error *ngIf="formGroup.get('abbreviation').hasError('backendError')">{{formGroup.get('abbreviation').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('abbreviation').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<rich-text-editor-component [form]="formGroup.get('description')" [placeholder]="'REFERENCE-EDITOR.FIELDS.DESCRIPTION-PLACEHOLDER'" [wrapperClasses]="(formGroup.get('description').touched && formGroup.get('description').hasError('required')) ? 'required' : ''" [editable]="formGroup.controls['description'].status !== 'DISABLED'">
|
||||
</rich-text-editor-component>
|
||||
<div [class]="(formGroup.get('description').touched && formGroup.get('description').hasError('required')) ? 'visible' : 'invisible'" class="mat-form-field formGroup-field-subscript-wrapper">
|
||||
<mat-error *ngIf="formGroup.get('description').hasError('backendError')">{{formGroup.get('description').getError('backendError').message}}</mat-error>
|
||||
<mat-error>{{'GENERAL.VALIDATION.REQUIRED'| translate}}</mat-error>
|
||||
<form *ngIf="formGroup" (ngSubmit)="formSubmit()">
|
||||
<mat-card appearance="outlined">
|
||||
<mat-card-header>
|
||||
<mat-card-title *ngIf="isNew">{{'REFERENCE-EDITOR.NEW' | translate}}</mat-card-title>
|
||||
</mat-card-header>
|
||||
<mat-card-content class="pt-2">
|
||||
<div class="row">
|
||||
<div class="col-4">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'REFERENCE-EDITOR.FIELDS.LABEL' | translate}}</mat-label>
|
||||
<input matInput type="text" name="label" [formControl]="formGroup.get('label')" required>
|
||||
<mat-error *ngIf="formGroup.get('label').hasError('backendError')">{{formGroup.get('label').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('label').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-4">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'REFERENCE-EDITOR.FIELDS.REFERENCE' | translate}}</mat-label>
|
||||
<input matInput type="text" name="reference" [formControl]="formGroup.get('reference')" required>
|
||||
<mat-error *ngIf="formGroup.get('reference').hasError('backendError')">{{formGroup.get('reference').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('reference').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-4">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'REFERENCE-EDITOR.FIELDS.TYPE' | translate}}</mat-label>
|
||||
<app-single-auto-complete [required]="formGroup.get('typeId').required" [formControl]="formGroup.get('typeId')" placeholder="{{'REFERENCE-EDITOR.FIELDS.TYPE' | translate}}" [configuration]="referenceTypeService.singleAutocompleteConfiguration">
|
||||
</app-single-auto-complete>
|
||||
<mat-error *ngIf="formGroup.get('typeId').hasError('backendError')">{{formGroup.get('type').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('typeId').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-4">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'REFERENCE-EDITOR.FIELDS.SOURCE' | translate}}</mat-label>
|
||||
<input matInput type="text" name="source" [formControl]="formGroup.get('source')" required>
|
||||
<mat-error *ngIf="formGroup.get('source').hasError('backendError')">{{formGroup.get('source').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('source').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-4">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'REFERENCE-EDITOR.FIELDS.SOURCE-TYPE' | translate}}</mat-label>
|
||||
<mat-select name="type" [formControl]="formGroup.get('sourceType')" required>
|
||||
<mat-option *ngFor="let sourceType of referenceSourceTypeEnum" [value]="sourceType">
|
||||
{{enumUtils.toReferenceSourceTypeString(sourceType)}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
<mat-error *ngIf="formGroup.get('sourceType').hasError('backendError')">{{formGroup.get('sourceType').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('sourceType').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-4">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'REFERENCE-EDITOR.FIELDS.ABBREVIATION' | translate}}</mat-label>
|
||||
<input matInput type="text" name="abbreviation" [formControl]="formGroup.get('abbreviation')">
|
||||
<mat-error *ngIf="formGroup.get('abbreviation').hasError('backendError')">{{formGroup.get('abbreviation').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('abbreviation').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<rich-text-editor-component [form]="formGroup.get('description')" [placeholder]="'REFERENCE-EDITOR.FIELDS.DESCRIPTION-PLACEHOLDER'" [wrapperClasses]="(formGroup.get('description').touched && formGroup.get('description').hasError('required')) ? 'required' : ''" [editable]="formGroup.controls['description'].status !== 'DISABLED'">
|
||||
</rich-text-editor-component>
|
||||
<div [class]="(formGroup.get('description').touched && formGroup.get('description').hasError('required')) ? 'visible' : 'invisible'" class="mat-form-field formGroup-field-subscript-wrapper">
|
||||
<mat-error *ngIf="formGroup.get('description').hasError('backendError')">{{formGroup.get('description').getError('backendError').message}}</mat-error>
|
||||
<mat-error>{{'GENERAL.VALIDATION.REQUIRED'| translate}}</mat-error>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Fields -->
|
||||
<div class="col-12">
|
||||
<h3 class="mb-4">
|
||||
{{'REFERENCE-EDITOR.FIELDS.FIELDS' | translate}}
|
||||
<button mat-button class="action-btn" type="button" (click)="addField()" [disabled]="formGroup.disabled">{{'REFERENCE-EDITOR.ACTIONS.ADD-FIELD' | translate}}</button>
|
||||
</h3>
|
||||
<div *ngFor="let field of formGroup.get('definition').get('fields').controls; let fieldIndex=index;" class="row mb-3">
|
||||
<div class="col-12">
|
||||
<div class="row d-flex align-items-center">
|
||||
<div class="col-auto pb-3 d-flex">
|
||||
<mat-card-title>{{fieldIndex + 1}}</mat-card-title>
|
||||
</div>
|
||||
<div class="col">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'REFERENCE-EDITOR.FIELDS.CODE' | translate}}</mat-label>
|
||||
<input matInput type="text" name="code" [formControl]="field.get('code')" required>
|
||||
<mat-error *ngIf="field.get('code').hasError('backendError')">{{field.get('code').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="field.get('code').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'REFERENCE-EDITOR.FIELDS.DATA-TYPE' | translate}}</mat-label>
|
||||
<mat-select name="type" [formControl]="field.get('dataType')" required>
|
||||
<mat-option *ngFor="let dataType of referenceFieldDataTypeEnum" [value]="dataType">
|
||||
{{enumUtils.toReferenceFieldDataTypeString(dataType)}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
<mat-error *ngIf="field.get('dataType').hasError('backendError')">{{field.get('dataType').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="field.get('dataType').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'REFERENCE-EDITOR.FIELDS.VALUE' | translate}}</mat-label>
|
||||
<input matInput type="text" name="value" [formControl]="field.get('value')">
|
||||
<mat-error *ngIf="field.get('value').hasError('backendError')">{{field.get('value').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="field.get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-auto pb-3 d-flex">
|
||||
<button mat-icon-button class="action-list-icon" matTooltip="{{'REFERENCE-EDITOR.ACTIONS.REMOVE-FIELD' | translate}}" (click)="removeField(fieldIndex)" [disabled]="formGroup.disabled">
|
||||
<mat-icon>delete</mat-icon>
|
||||
</button>
|
||||
<!-- Fields -->
|
||||
<div class="col-12">
|
||||
<h3 class="mb-4">
|
||||
{{'REFERENCE-EDITOR.FIELDS.FIELDS' | translate}}
|
||||
<button mat-button class="action-btn" type="button" (click)="addField()" [disabled]="formGroup.disabled">{{'REFERENCE-EDITOR.ACTIONS.ADD-FIELD' | translate}}</button>
|
||||
</h3>
|
||||
<div *ngFor="let field of formGroup.get('definition').get('fields').controls; let fieldIndex=index;" class="row mb-3">
|
||||
<div class="col-12">
|
||||
<div class="row d-flex align-items-center">
|
||||
<div class="col-auto pb-3 d-flex">
|
||||
<mat-card-title>{{fieldIndex + 1}}</mat-card-title>
|
||||
</div>
|
||||
<div class="col">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'REFERENCE-EDITOR.FIELDS.CODE' | translate}}</mat-label>
|
||||
<input matInput type="text" name="code" [formControl]="field.get('code')" required>
|
||||
<mat-error *ngIf="field.get('code').hasError('backendError')">{{field.get('code').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="field.get('code').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'REFERENCE-EDITOR.FIELDS.DATA-TYPE' | translate}}</mat-label>
|
||||
<mat-select name="type" [formControl]="field.get('dataType')" required>
|
||||
<mat-option *ngFor="let dataType of referenceFieldDataTypeEnum" [value]="dataType">
|
||||
{{enumUtils.toReferenceFieldDataTypeString(dataType)}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
<mat-error *ngIf="field.get('dataType').hasError('backendError')">{{field.get('dataType').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="field.get('dataType').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'REFERENCE-EDITOR.FIELDS.VALUE' | translate}}</mat-label>
|
||||
<input matInput type="text" name="value" [formControl]="field.get('value')">
|
||||
<mat-error *ngIf="field.get('value').hasError('backendError')">{{field.get('value').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="field.get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-auto pb-3 d-flex">
|
||||
<button mat-icon-button class="action-list-icon" matTooltip="{{'REFERENCE-EDITOR.ACTIONS.REMOVE-FIELD' | translate}}" (click)="removeField(fieldIndex)" [disabled]="formGroup.disabled">
|
||||
<mat-icon>delete</mat-icon>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</mat-card-content>
|
||||
</mat-card>
|
||||
</form>
|
||||
</mat-card-content>
|
||||
</mat-card>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
.reference-editor {
|
||||
margin-top: 1.3rem;
|
||||
margin-left: 1em;
|
||||
margin-right: 3em;
|
||||
// margin-top: 1.3rem;
|
||||
// margin-left: 1em;
|
||||
// margin-right: 3em;
|
||||
|
||||
.remove {
|
||||
background-color: white;
|
||||
|
|
|
|||
|
|
@ -1,7 +1,8 @@
|
|||
<div class="row tenant-listing">
|
||||
<div class="col-md-8 offset-md-2">
|
||||
<div class="container-fluid">
|
||||
|
||||
<div class="row mb-4 mt-3">
|
||||
<div class="row">
|
||||
<div class="col-md-10 offset-md-1">
|
||||
<div class="row mb-4 mt-4">
|
||||
<div class="col">
|
||||
<h4>{{'REFERENCE-LISTING.TITLE' | translate}}</h4>
|
||||
<app-navigation-breadcrumb />
|
||||
|
|
@ -33,6 +34,9 @@
|
|||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<ng-template #listItemTemplate let-item="item" let-isColumnSelected="isColumnSelected">
|
||||
|
||||
|
|
|
|||
|
|
@ -1,81 +1,85 @@
|
|||
<div class="tenant-editor">
|
||||
<div class="row align-items-center mb-4" *ngIf="formGroup">
|
||||
<div class="col-auto">
|
||||
<h3 *ngIf="isNew && !isClone">{{'TENANT-EDITOR.NEW' | translate}}</h3>
|
||||
<app-navigation-breadcrumb />
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<button mat-button class="action-btn" (click)="cancel()" type="button">{{'TENANT-EDITOR.ACTIONS.CANCEL' | translate}}</button>
|
||||
</div>
|
||||
<div class="col-auto" *ngIf="!isNew">
|
||||
<button mat-button class="action-btn" type="button" (click)="delete()">
|
||||
<mat-icon>delete</mat-icon>
|
||||
{{'TENANT-EDITOR.ACTIONS.DELETE' | translate}}
|
||||
</button>
|
||||
</div>
|
||||
<div class="col-auto" *ngIf="canSave">
|
||||
<button mat-button class="action-btn" (click)="formSubmit()">
|
||||
<mat-icon>save</mat-icon>
|
||||
{{'TENANT-EDITOR.ACTIONS.SAVE' | translate}}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="container-fluid">
|
||||
<div class="row">
|
||||
<div class="col-md-10 offset-md-1 tenant-editor">
|
||||
<div class="row align-items-center mb-4 mt-4" *ngIf="formGroup">
|
||||
<div class="col-auto">
|
||||
<h3 *ngIf="isNew && !isClone">{{'TENANT-EDITOR.NEW' | translate}}</h3>
|
||||
<app-navigation-breadcrumb />
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<button mat-button class="action-btn" (click)="cancel()" type="button">{{'TENANT-EDITOR.ACTIONS.CANCEL' | translate}}</button>
|
||||
</div>
|
||||
<div class="col-auto" *ngIf="!isNew">
|
||||
<button mat-button class="action-btn" type="button" (click)="delete()">
|
||||
<mat-icon>delete</mat-icon>
|
||||
{{'TENANT-EDITOR.ACTIONS.DELETE' | translate}}
|
||||
</button>
|
||||
</div>
|
||||
<div class="col-auto" *ngIf="canSave">
|
||||
<button mat-button class="action-btn" (click)="formSubmit()">
|
||||
<mat-icon>save</mat-icon>
|
||||
{{'TENANT-EDITOR.ACTIONS.SAVE' | translate}}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<form *ngIf="formGroup" (ngSubmit)="formSubmit()">
|
||||
<mat-card appearance="outlined">
|
||||
<mat-card-header>
|
||||
<mat-card-title *ngIf="isNew">{{'TENANT-EDITOR.NEW' | translate}}</mat-card-title>
|
||||
</mat-card-header>
|
||||
<mat-card-content>
|
||||
<div class="row">
|
||||
<div class="col-4">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'TENANT-EDITOR.FIELDS.NAME' | translate}}</mat-label>
|
||||
<input matInput type="text" name="name" [formControl]="formGroup.get('name')" required>
|
||||
<mat-error *ngIf="formGroup.get('name').hasError('backendError')">{{formGroup.get('name').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('name').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-4">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'TENANT-EDITOR.FIELDS.CODE' | translate}}</mat-label>
|
||||
<input matInput type="text" name="code" [formControl]="formGroup.get('code')" required>
|
||||
<mat-error *ngIf="formGroup.get('code').hasError('backendError')">{{formGroup.get('code').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('code').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<h3>{{'TENANT-EDITOR.FIELDS.DESCRIPTION' | translate}}</h3>
|
||||
<div class="col-12">
|
||||
<rich-text-editor-component [form]="formGroup.get('description')" [placeholder]="'TENANT-EDITOR.FIELDS.DESCRIPTION-PLACEHOLDER'" [wrapperClasses]="(formGroup.get('description').touched && formGroup.get('description').hasError('required')) ? 'required' : ''" [editable]="formGroup.controls['description'].status !== 'DISABLED'">
|
||||
</rich-text-editor-component>
|
||||
<div [class]="(formGroup.get('description').touched && formGroup.get('description').hasError('required')) ? 'visible' : 'invisible'" class="mat-form-field formGroup-field-subscript-wrapper">
|
||||
<mat-error *ngIf="formGroup.get('description').hasError('backendError')">{{formGroup.get('description').getError('backendError').message}}</mat-error>
|
||||
<mat-error>{{'GENERAL.VALIDATION.REQUIRED'| translate}}</mat-error>
|
||||
<form *ngIf="formGroup" (ngSubmit)="formSubmit()">
|
||||
<mat-card appearance="outlined">
|
||||
<mat-card-header>
|
||||
<mat-card-title *ngIf="isNew">{{'TENANT-EDITOR.NEW' | translate}}</mat-card-title>
|
||||
</mat-card-header>
|
||||
<mat-card-content>
|
||||
<div class="row">
|
||||
<div class="col-4">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'TENANT-EDITOR.FIELDS.NAME' | translate}}</mat-label>
|
||||
<input matInput type="text" name="name" [formControl]="formGroup.get('name')" required>
|
||||
<mat-error *ngIf="formGroup.get('name').hasError('backendError')">{{formGroup.get('name').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('name').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-4">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'TENANT-EDITOR.FIELDS.CODE' | translate}}</mat-label>
|
||||
<input matInput type="text" name="code" [formControl]="formGroup.get('code')" required>
|
||||
<mat-error *ngIf="formGroup.get('code').hasError('backendError')">{{formGroup.get('code').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('code').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<h3>{{'TENANT-EDITOR.FIELDS.DESCRIPTION' | translate}}</h3>
|
||||
<div class="col-12">
|
||||
<rich-text-editor-component [form]="formGroup.get('description')" [placeholder]="'TENANT-EDITOR.FIELDS.DESCRIPTION-PLACEHOLDER'" [wrapperClasses]="(formGroup.get('description').touched && formGroup.get('description').hasError('required')) ? 'required' : ''" [editable]="formGroup.controls['description'].status !== 'DISABLED'">
|
||||
</rich-text-editor-component>
|
||||
<div [class]="(formGroup.get('description').touched && formGroup.get('description').hasError('required')) ? 'visible' : 'invisible'" class="mat-form-field formGroup-field-subscript-wrapper">
|
||||
<mat-error *ngIf="formGroup.get('description').hasError('backendError')">{{formGroup.get('description').getError('backendError').message}}</mat-error>
|
||||
<mat-error>{{'GENERAL.VALIDATION.REQUIRED'| translate}}</mat-error>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Deposit -->
|
||||
<div class="col-12">
|
||||
<app-tenant-source-component
|
||||
[form]="formGroup.get('config').get('deposit')"
|
||||
[validationErrorModel]="editorModel.validationErrorModel"
|
||||
[validationRootPath]="'config.deposit.'"
|
||||
[codes]="depositCodes"
|
||||
[label]="'TENANT-EDITOR.FIELDS.DEPOSIT' | translate">
|
||||
</app-tenant-source-component>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<app-tenant-source-component
|
||||
[form]="formGroup.get('config').get('fileTransformers')"
|
||||
[validationErrorModel]="editorModel.validationErrorModel"
|
||||
[validationRootPath]="'config.fileTransformers.'"
|
||||
[codes]="fileTransformersCodes"
|
||||
[label]="'TENANT-EDITOR.FIELDS.FILE-TRANSFORMERS' | translate">
|
||||
</app-tenant-source-component>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Deposit -->
|
||||
<div class="col-12">
|
||||
<app-tenant-source-component
|
||||
[form]="formGroup.get('config').get('deposit')"
|
||||
[validationErrorModel]="editorModel.validationErrorModel"
|
||||
[validationRootPath]="'config.deposit.'"
|
||||
[codes]="depositCodes"
|
||||
[label]="'TENANT-EDITOR.FIELDS.DEPOSIT' | translate">
|
||||
</app-tenant-source-component>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<app-tenant-source-component
|
||||
[form]="formGroup.get('config').get('fileTransformers')"
|
||||
[validationErrorModel]="editorModel.validationErrorModel"
|
||||
[validationRootPath]="'config.fileTransformers.'"
|
||||
[codes]="fileTransformersCodes"
|
||||
[label]="'TENANT-EDITOR.FIELDS.FILE-TRANSFORMERS' | translate">
|
||||
</app-tenant-source-component>
|
||||
</div>
|
||||
</div>
|
||||
</mat-card-content>
|
||||
</mat-card>
|
||||
</form>
|
||||
</div>
|
||||
</mat-card-content>
|
||||
</mat-card>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
.tenant-editor {
|
||||
margin-top: 1.3rem;
|
||||
margin-left: 1em;
|
||||
margin-right: 3em;
|
||||
// margin-top: 1.3rem;
|
||||
// margin-left: 1em;
|
||||
// margin-right: 3em;
|
||||
|
||||
.remove {
|
||||
background-color: white;
|
||||
|
|
|
|||
|
|
@ -1,36 +1,38 @@
|
|||
<div class="row tenant-listing">
|
||||
<div class="col-md-8 offset-md-2">
|
||||
<div class="container-fluid">
|
||||
<div class="row tenant-listing">
|
||||
<div class="col-md-10 offset-md-1">
|
||||
|
||||
<div class="row mb-4 mt-3">
|
||||
<div class="col">
|
||||
<h4>{{'TENANT-LISTING.TITLE' | translate}}</h4>
|
||||
<app-navigation-breadcrumb />
|
||||
<div class="row mb-4 mt-4">
|
||||
<div class="col">
|
||||
<h4>{{'TENANT-LISTING.TITLE' | translate}}</h4>
|
||||
<app-navigation-breadcrumb />
|
||||
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<button mat-raised-button class="create-btn"
|
||||
*ngIf="authService.hasPermission(authService.permissionEnum.EditTenant)"
|
||||
[routerLink]="['/tenants/new']">
|
||||
<mat-icon>add</mat-icon>
|
||||
{{'TENANT-LISTING.CREATE' | translate}}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<button mat-raised-button class="create-btn"
|
||||
*ngIf="authService.hasPermission(authService.permissionEnum.EditTenant)"
|
||||
[routerLink]="['/tenants/new']">
|
||||
<mat-icon>add</mat-icon>
|
||||
{{'TENANT-LISTING.CREATE' | translate}}
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<app-hybrid-listing [rows]="gridRows" [columns]="gridColumns" [visibleColumns]="visibleColumns"
|
||||
[count]="totalElements" [offset]="currentPageNumber" [limit]="lookup.page.size"
|
||||
[defaultSort]="lookup.order?.items" [externalSorting]="true" (rowActivated)="onRowActivated($event)"
|
||||
(pageLoad)="alterPage($event)" (columnSort)="onColumnSort($event)"
|
||||
(columnsChanged)="onColumnsChanged($event)" [listItemTemplate]="listItemTemplate">
|
||||
|
||||
<app-tenant-listing-filters hybrid-listing-filters [(filter)]="lookup"
|
||||
(filterChange)="filterChanged($event)" />
|
||||
|
||||
<app-user-settings-picker [key]="userSettingsKey" [userPreference]="lookup"
|
||||
(onSettingSelected)="changeSetting($event)" [autoSelectUserSettings]="autoSelectUserSettings"
|
||||
user-preference-settings />
|
||||
</app-hybrid-listing>
|
||||
|
||||
</div>
|
||||
|
||||
<app-hybrid-listing [rows]="gridRows" [columns]="gridColumns" [visibleColumns]="visibleColumns"
|
||||
[count]="totalElements" [offset]="currentPageNumber" [limit]="lookup.page.size"
|
||||
[defaultSort]="lookup.order?.items" [externalSorting]="true" (rowActivated)="onRowActivated($event)"
|
||||
(pageLoad)="alterPage($event)" (columnSort)="onColumnSort($event)"
|
||||
(columnsChanged)="onColumnsChanged($event)" [listItemTemplate]="listItemTemplate">
|
||||
|
||||
<app-tenant-listing-filters hybrid-listing-filters [(filter)]="lookup"
|
||||
(filterChange)="filterChanged($event)" />
|
||||
|
||||
<app-user-settings-picker [key]="userSettingsKey" [userPreference]="lookup"
|
||||
(onSettingSelected)="changeSetting($event)" [autoSelectUserSettings]="autoSelectUserSettings"
|
||||
user-preference-settings />
|
||||
</app-hybrid-listing>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,27 +1,27 @@
|
|||
<div class="row user-listing">
|
||||
<div class="col-md-8 offset-md-2">
|
||||
<div class="container-fluid">
|
||||
<div class="row user-listing">
|
||||
<div class="col-md-10 offset-md-1">
|
||||
<div class="row mb-4 mt-4">
|
||||
<div class="col">
|
||||
<h4>{{'USER-LISTING.TITLE' | translate}}</h4>
|
||||
<app-navigation-breadcrumb />
|
||||
|
||||
<div class="row mb-4 mt-3">
|
||||
<div class="col">
|
||||
<h4>{{'USER-LISTING.TITLE' | translate}}</h4>
|
||||
<app-navigation-breadcrumb />
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<button mat-raised-button class="create-btn" (click)="export()" *ngIf="authService.hasPermission(authService.permissionEnum.ExportUsers)">
|
||||
<mat-icon>download</mat-icon>
|
||||
{{'USER-LISTING.ACTIONS.EXPORT' | translate}}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<button mat-raised-button class="create-btn" (click)="export()" *ngIf="authService.hasPermission(authService.permissionEnum.ExportUsers)">
|
||||
<mat-icon>download</mat-icon>
|
||||
{{'USER-LISTING.ACTIONS.EXPORT' | translate}}
|
||||
</button>
|
||||
</div>
|
||||
<app-hybrid-listing [rows]="gridRows" [columns]="gridColumns" [visibleColumns]="visibleColumns" [count]="totalElements" [offset]="currentPageNumber" [limit]="lookup.page.size" [defaultSort]="lookup.order?.items" [externalSorting]="true" (rowActivated)="onUserRowActivated($event)" (pageLoad)="alterPage($event)" (columnSort)="onColumnSort($event)" (columnsChanged)="onColumnsChanged($event)" [listItemTemplate]="listItemTemplate">
|
||||
|
||||
<app-user-listing-filters hybrid-listing-filters [(filter)]="lookup" (filterChange)="filterChanged($event)" />
|
||||
|
||||
<app-user-settings-picker [key]="userSettingsKey" [userPreference]="lookup" (onSettingSelected)="changeSetting($event)" [autoSelectUserSettings]="autoSelectUserSettings" user-preference-settings />
|
||||
</app-hybrid-listing>
|
||||
</div>
|
||||
|
||||
<app-hybrid-listing [rows]="gridRows" [columns]="gridColumns" [visibleColumns]="visibleColumns" [count]="totalElements" [offset]="currentPageNumber" [limit]="lookup.page.size" [defaultSort]="lookup.order?.items" [externalSorting]="true" (rowActivated)="onUserRowActivated($event)" (pageLoad)="alterPage($event)" (columnSort)="onColumnSort($event)" (columnsChanged)="onColumnsChanged($event)" [listItemTemplate]="listItemTemplate">
|
||||
|
||||
<app-user-listing-filters hybrid-listing-filters [(filter)]="lookup" (filterChange)="filterChanged($event)" />
|
||||
|
||||
<app-user-settings-picker [key]="userSettingsKey" [userPreference]="lookup" (onSettingSelected)="changeSetting($event)" [autoSelectUserSettings]="autoSelectUserSettings" user-preference-settings />
|
||||
</app-hybrid-listing>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
.user-listing {
|
||||
margin-top: 1.3rem;
|
||||
margin-left: 1rem;
|
||||
margin-right: 2rem;
|
||||
// margin-top: 1.3rem;
|
||||
// margin-left: 1rem;
|
||||
// margin-right: 2rem;
|
||||
|
||||
.mat-header-row{
|
||||
background: #f3f5f8;
|
||||
|
|
|
|||
|
|
@ -1,48 +1,46 @@
|
|||
<div class="container form-container">
|
||||
<div class="row d-flex justify-content-between align-items-center m-0">
|
||||
<!-- <div class="col-auto"><a class="logo"><img class="logo" src="../../../assets/images/new-dmp-logo.png" onerror="this.style.display='none'"></a></div> -->
|
||||
<div class="col-auto ml-auto close-btn" (click)="close()">
|
||||
<div class="row d-flex justify-content-between align-items-center">
|
||||
<div class="col-auto ml-auto" (click)="close()">
|
||||
<mat-icon class="close-icon">close</mat-icon>
|
||||
</div>
|
||||
</div>
|
||||
<div class="annotation-viewer row">
|
||||
<div class="row">
|
||||
<!-- Create New Thread -->
|
||||
<!-- <div *ngIf="this.canEdit && !this.isDeleted" class="col-12"> -->
|
||||
<div class="col-12">
|
||||
<form class="row p-2 mt-2 mb-3 ml-0 pr-3 mr-0 new-thread" [formGroup]="threadFormGroup">
|
||||
<div class="col-12 col-md mb-2">
|
||||
<mat-form-field appearance="outline" class="w-100">
|
||||
<mat-label>{{'ANNOTATION-DIALOG.THREADS.NEW-THREAD' | translate}}</mat-label>
|
||||
<input matInput formControlName="text" required>
|
||||
<mat-icon matSuffix class="material-symbols-outlined">
|
||||
add_reaction
|
||||
</mat-icon>
|
||||
<mat-error *ngIf="threadFormGroup.get('text').hasError('backendError')">{{threadFormGroup.get('text').getError('backendError')?.message}}</mat-error>
|
||||
<mat-error *ngIf="threadFormGroup.get('text').hasError('required')">{{'COMMONS.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
|
||||
<div class="col-12 col-md-auto pl-md-0 pr-md-0">
|
||||
<mat-form-field class="w-100 protection-input">
|
||||
<mat-label>{{'ANNOTATION-DIALOG.THREADS.PROTECTION.TITLE' | translate}}</mat-label>
|
||||
<mat-select name="thread-protectionType" formControlName="protectionType" required>
|
||||
<mat-option *ngFor="let enumValue of annotationProtectionTypeEnumValues" [value]="enumValue">{{enumUtils.toAnnotationProtectionTypeString(enumValue)}}</mat-option>
|
||||
</mat-select>
|
||||
<mat-error *ngIf="threadFormGroup.get('protectionType').hasError('backendError')">{{threadFormGroup.get('protectionType').getError('backendError')?.message}}</mat-error>
|
||||
<mat-error *ngIf="threadFormGroup.get('protectionType').hasError('required')">{{'COMMONS.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
|
||||
<div class="col-12 send-msg mt-1">
|
||||
<div class="row">
|
||||
<div class="col-auto pr-1">
|
||||
<button type="button" class="normal-btn-sm" (click)="createThread()">{{ 'ANNOTATION-DIALOG.THREADS.SEND' | translate }} <i class="fa fa-paper-plane ml-2"></i></button>
|
||||
</div>
|
||||
<div class="col-auto pl-1">
|
||||
<button type="button" class="normal-btn-light-sm" (click)="close()">{{ 'ANNOTATION-DIALOG.THREADS.CANCEL' | translate }}</button>
|
||||
<form [formGroup]="threadFormGroup">
|
||||
<div class="row mt-2 mb-3">
|
||||
<div class="col-12 col-md mb-2">
|
||||
<mat-form-field appearance="outline" class="w-100">
|
||||
<mat-label>{{'ANNOTATION-DIALOG.THREADS.NEW-THREAD' | translate}}</mat-label>
|
||||
<input matInput formControlName="text" required>
|
||||
<!-- <mat-icon matSuffix class="material-symbols-outlined">
|
||||
add_reaction
|
||||
</mat-icon> -->
|
||||
<mat-error *ngIf="threadFormGroup.get('text').hasError('backendError')">{{threadFormGroup.get('text').getError('backendError')?.message}}</mat-error>
|
||||
<mat-error *ngIf="threadFormGroup.get('text').hasError('required')">{{'COMMONS.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-12 col-md-auto">
|
||||
<mat-form-field class="w-100 protection-input">
|
||||
<mat-label>{{'ANNOTATION-DIALOG.THREADS.PROTECTION.TITLE' | translate}}</mat-label>
|
||||
<mat-select name="thread-protectionType" formControlName="protectionType" required>
|
||||
<mat-option *ngFor="let enumValue of annotationProtectionTypeEnumValues" [value]="enumValue">{{enumUtils.toAnnotationProtectionTypeString(enumValue)}}</mat-option>
|
||||
</mat-select>
|
||||
<mat-error *ngIf="threadFormGroup.get('protectionType').hasError('backendError')">{{threadFormGroup.get('protectionType').getError('backendError')?.message}}</mat-error>
|
||||
<mat-error *ngIf="threadFormGroup.get('protectionType').hasError('required')">{{'COMMONS.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-12 send-msg mt-1">
|
||||
<div class="row">
|
||||
<div class="col-auto pr-1">
|
||||
<button type="button" class="normal-btn-sm" (click)="createThread()">{{ 'ANNOTATION-DIALOG.THREADS.SEND' | translate }} <i class="fa fa-paper-plane ml-2"></i></button>
|
||||
</div>
|
||||
<div class="col-auto pl-1">
|
||||
<button type="button" class="normal-btn-light-sm" (click)="close()">{{ 'ANNOTATION-DIALOG.THREADS.CANCEL' | translate }}</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="col-12 pt-2 gr-color" *ngIf="threads?.size > 0">
|
||||
|
|
@ -55,9 +53,9 @@
|
|||
</div>
|
||||
<div class="col-12">
|
||||
<ng-container *ngFor="let thread of threads">
|
||||
<div class="row" *ngIf="getParentAnnotation(thread).protectionType === annotationProtectionTypeEnum.Private" matTooltip="{{'ANNOTATION-DIALOG.PROTECTION.PRIVATE' | translate}}">
|
||||
<div class="row" *ngIf="getParentAnnotation(thread).protectionType === annotationProtectionTypeEnum.Private">
|
||||
<div class="col-auto ml-auto">
|
||||
<div class="d-flex align-items-center">
|
||||
<div class="d-flex align-items-center" matTooltip="{{'ANNOTATION-DIALOG.PROTECTION.PRIVATE' | translate}}">
|
||||
<img src="/assets/images/annotations/eye-hide.png">
|
||||
<div class="ml-1 mt-1">
|
||||
{{getAnnotationProtectionType(thread)}}
|
||||
|
|
@ -65,9 +63,9 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row ml-auto" *ngIf="getParentAnnotation(thread).protectionType === annotationProtectionTypeEnum.EntityAccessors" matTooltip="{{'ANNOTATION-DIALOG.PROTECTION.ENTITY-ACCESSORS' | translate}}">
|
||||
<div class="row ml-auto" *ngIf="getParentAnnotation(thread).protectionType === annotationProtectionTypeEnum.EntityAccessors">
|
||||
<div class="col-auto ml-auto">
|
||||
<div class="d-flex aling-items center">
|
||||
<div class="d-flex aling-items center" matTooltip="{{'ANNOTATION-DIALOG.PROTECTION.ENTITY-ACCESSORS' | translate}}">
|
||||
<img src="/assets/images/annotations/globe.png" alt="globe">
|
||||
<!-- <i class="material-icons protection-icon icon-{{getAnnotationProtectionType(thread)}}"></i> -->
|
||||
<span class="ml-1">
|
||||
|
|
@ -76,43 +74,99 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row pt-1 pb-1 mt-1 comment-wrapper">
|
||||
<div class="row mt-2 mb-2">
|
||||
<!-- Parent Thread -->
|
||||
<div class="col-12">
|
||||
<div class="row m-0 h-100">
|
||||
<div class="col pt-1">
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<div class="row h-100">
|
||||
<div class="col-auto p-0">
|
||||
<img class="profile-picture" src="/assets/images/annotations/user-profile-2.png" alt="profile-picture">
|
||||
</div>
|
||||
<div class="col">
|
||||
<div class="row">
|
||||
<span class="col user">{{getParentAnnotation(thread).author.name}}</span>
|
||||
<div class="col-auto annotation-time">{{getParentAnnotation(thread).timeStamp | date: "d MMMM, y 'at' h:mm a"}}</div>
|
||||
<div class="container">
|
||||
<div class="row comment-wrapper pt-1 pb-2 h-100">
|
||||
<div class="col-12 pt-1">
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<div class="row h-100">
|
||||
<div class="col-auto pr-0">
|
||||
<img class="profile-picture" src="/assets/images/annotations/user-profile-2.png" alt="profile-picture">
|
||||
</div>
|
||||
<div class="row pt-1">
|
||||
<div class="col-12 annotation-full-text">{{getParentAnnotation(thread).payload}}</div>
|
||||
</div>
|
||||
<div class="row"> <!--pb-2-->
|
||||
<div class="col-12">
|
||||
<button mat-button (click)="enableReply(thread)" class="action-button" [ngClass]="this.replyEnabledPerThread[thread] ? 'active-action' : ''" [disabled]="this.replyEnabledPerThread[thread]">{{ 'ANNOTATION-DIALOG.THREADS.REPLY' | translate}}</button>
|
||||
<div class="col">
|
||||
<div class="row">
|
||||
<span class="col user">{{getParentAnnotation(thread).author.name}}</span>
|
||||
<div class="col-auto annotation-time">{{getParentAnnotation(thread).timeStamp | date: "d MMMM, y 'at' h:mm a"}}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<ng-container *ngIf="annotationsPerThread[thread].length === 1 && !this.showRepliesPerThread[thread]">
|
||||
<button mat-button (click)="showReplies(thread)">
|
||||
<img src="/assets/images/annotations/reply.png" alt="reply"> 1 {{ 'ANNOTATION-DIALOG.THREADS.REPLY' | translate}}
|
||||
</button>
|
||||
</ng-container>
|
||||
<ng-container *ngIf="annotationsPerThread[thread].length > 1 && !this.showRepliesPerThread[thread]">
|
||||
<button mat-button (click)="showReplies(thread)">
|
||||
<img src="/assets/images/annotations/reply.png" alt="reply"> {{ annotationsPerThread[thread].length }} {{ 'ANNOTATION-DIALOG.THREADS.REPLIES' | translate}}
|
||||
</button>
|
||||
</ng-container>
|
||||
<div class="row pt-1">
|
||||
<div class="col-12 annotation-full-text">{{getParentAnnotation(thread).payload}}</div>
|
||||
</div>
|
||||
<div class="row"> <!--pb-2-->
|
||||
<div class="col-12">
|
||||
<button mat-button (click)="enableReply(thread)" class="action-button" [ngClass]="this.replyEnabledPerThread[thread] ? 'active-action' : ''" [disabled]="this.replyEnabledPerThread[thread]">{{ 'ANNOTATION-DIALOG.THREADS.REPLY' | translate}}</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<ng-container *ngIf="annotationsPerThread[thread].length === 1 && !this.showRepliesPerThread[thread]">
|
||||
<button mat-button (click)="showReplies(thread)">
|
||||
<img src="/assets/images/annotations/reply.png" alt="reply"> 1 {{ 'ANNOTATION-DIALOG.THREADS.REPLY' | translate}}
|
||||
</button>
|
||||
</ng-container>
|
||||
<ng-container *ngIf="annotationsPerThread[thread].length > 1 && !this.showRepliesPerThread[thread]">
|
||||
<button mat-button (click)="showReplies(thread)">
|
||||
<img src="/assets/images/annotations/reply.png" alt="reply"> {{ annotationsPerThread[thread].length }} {{ 'ANNOTATION-DIALOG.THREADS.REPLIES' | translate}}
|
||||
</button>
|
||||
</ng-container>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Previous Replies -->
|
||||
<div *ngIf="this.showRepliesPerThread[thread]" class="row">
|
||||
<div *ngFor="let annotation of annotationsPerThread[thread]; let i = index;" class="col-12">
|
||||
<div class="row m-0 h-100">
|
||||
<div class="col-auto pr-0 pl-0">
|
||||
<div class="side-color"></div>
|
||||
</div>
|
||||
<div class="col pt-1">
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<div class="row h-100">
|
||||
<div class="col-auto p-0">
|
||||
<img class="profile-picture" src="/assets/images/annotations/user-profile-2.png" alt="profile-picture">
|
||||
</div>
|
||||
<div class="col">
|
||||
<div class="row">
|
||||
<span class="col user">{{annotation.author.name}}</span>
|
||||
<div class="col-auto annotation-time">{{annotation.timeStamp | date:"d MMMM, y 'at' h:mm a"}}</div>
|
||||
<!-- <div class="col annotation-time">{{annotation.timeStamp | date:'EEEE, MMMM d, y, h:mm a'}}</div> -->
|
||||
</div>
|
||||
|
||||
<div class="row pt-1 pb-1">
|
||||
<div class="col-12 annotation-full-text">{{annotation.payload}}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Type reply in thread -->
|
||||
<div *ngIf="this.replyEnabledPerThread[thread]" class="row">
|
||||
<div class="col-12 mt-2">
|
||||
<div class="row new-reply mr-0">
|
||||
<div class="col">
|
||||
<mat-form-field appearance="outline" class="w-100">
|
||||
<mat-label>{{'ANNOTATION-DIALOG.THREADS.REPLY' | translate}}</mat-label>
|
||||
<input matInput [formControl]="this.threadReplyTextsFG[thread.toString()].get('replyText')" required>
|
||||
<!-- <mat-icon matSuffix class="material-symbols-outlined">
|
||||
add_reaction
|
||||
</mat-icon> -->
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-auto p-0 send-msg">
|
||||
<button class="form-field-margin" mat-icon-button color="black" (click)="replyThread(thread)" matTooltip="{{'ANNOTATION-DIALOG.THREADS.REPLY' | translate}}">
|
||||
<img class="paper-plane" src="/assets/images/annotations/paper-plane.png" alt="paper-plane">
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -121,60 +175,6 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Previous Replies -->
|
||||
<ng-container *ngIf="this.showRepliesPerThread[thread]">
|
||||
<div *ngFor="let annotation of annotationsPerThread[thread]; let i = index;" class="col-12">
|
||||
<div class="row m-0 h-100">
|
||||
<div class="col-auto pr-0 pl-0">
|
||||
<div class="side-color"></div>
|
||||
</div>
|
||||
<div class="col pt-1">
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<div class="row h-100">
|
||||
<div class="col-auto p-0">
|
||||
<img class="profile-picture" src="/assets/images/annotations/user-profile-2.png" alt="profile-picture">
|
||||
</div>
|
||||
<div class="col">
|
||||
<div class="row">
|
||||
<span class="col user">{{annotation.author.name}}</span>
|
||||
<div class="col-auto annotation-time">{{annotation.timeStamp | date:"d MMMM, y 'at' h:mm a"}}</div>
|
||||
<!-- <div class="col annotation-time">{{annotation.timeStamp | date:'EEEE, MMMM d, y, h:mm a'}}</div> -->
|
||||
</div>
|
||||
|
||||
<div class="row pt-1 pb-1">
|
||||
<div class="col-12 annotation-full-text">{{annotation.payload}}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</ng-container>
|
||||
</div>
|
||||
<div class="row mb-2">
|
||||
<!-- Type reply in thread -->
|
||||
<ng-container *ngIf="this.replyEnabledPerThread[thread]">
|
||||
<div class="col-12 mt-2">
|
||||
<div class="row new-reply mr-0">
|
||||
<mat-form-field appearance="outline" class="col pl-0">
|
||||
<mat-label>{{'ANNOTATION-DIALOG.THREADS.REPLY' | translate}}</mat-label>
|
||||
<input matInput [formControl]="this.threadReplyTextsFG[thread.toString()].get('replyText')" required>
|
||||
<mat-icon matSuffix class="material-symbols-outlined">
|
||||
add_reaction
|
||||
</mat-icon>
|
||||
</mat-form-field>
|
||||
<div class="col-auto p-0 send-msg">
|
||||
<button class="form-field-margin" mat-icon-button color="black" (click)="replyThread(thread)" matTooltip="{{'ANNOTATION-DIALOG.THREADS.REPLY' | translate}}">
|
||||
<img class="paper-plane" src="/assets/images/annotations/paper-plane.png" alt="paper-plane">
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</ng-container>
|
||||
</div>
|
||||
</ng-container>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,77 +1,79 @@
|
|||
<div class="main-content listing-main-container h-100">
|
||||
<div class="container-fluid">
|
||||
<div class="d-flex flex-direction-row">
|
||||
<div *ngIf="hasListingItems && listingItems && listingItems.length === 0 && !hasLikeCriteria()" class="card mt-0">
|
||||
<!-- <div class="card mt-0" [style.display]="isVisible ? 'block' : 'none'"> -->
|
||||
<!-- <a class="col-auto d-flex" (click)="closeCard()"><span class="ml-auto pt-3 material-icons clear-icon">clear</span></a> -->
|
||||
<div class="card-content info-text mb-0">
|
||||
<p>{{'DESCRIPTION-LISTING.TEXT-INFO' | translate}} <u class="pointer" [routerLink]="['/explore-descriptions']">{{'DESCRIPTION-LISTING.LINK-PUBLIC-DATASETS' | translate}}</u> {{'DESCRIPTION-LISTING.TEXT-INFO-REST' | translate}}</p>
|
||||
<p class="mt-4 pt-2">{{'DESCRIPTION-LISTING.TEXT-INFO-PAR' | translate}}
|
||||
<div class="d-flex">
|
||||
<button mat-raised-button class="add-description align-self-center yellow-btn" (click)="addNewDescription()">
|
||||
{{'DESCRIPTION-LISTING.ACTIONS.ADD-DESCRIPTION' | translate}}
|
||||
</button>
|
||||
<img class="col-auto ml-auto laptop-img" src="../../../assets/images/dashboard-popup.png">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<p *ngIf="listingItems && listingItems.length > 0 || this.lookup.like" class="col-auto header-title">{{(isPublic ? 'DESCRIPTION-LISTING.TITLE-EXPLORE' : 'DESCRIPTION-LISTING.TITLE') | translate}}</p>
|
||||
<div *ngIf="listingItems && listingItems.length > 0 && !isPublic || this.lookup.like" class="ml-auto">
|
||||
<div class="col-auto">
|
||||
<button mat-raised-button class="add-description align-self-center yellow-btn" (click)="addNewDescription()">
|
||||
{{'DESCRIPTION-LISTING.ACTIONS.ADD-DESCRIPTION' | translate}}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<!-- TODO: implement filters -->
|
||||
<!-- <div *ngIf="listingItems && listingItems.length > 0 || this.lookup.like" class="filter-btn" [style.right]="dialog.getDialogById('filters') ? '446px' : '0px'" [style.width]="scrollbar ? '57px' : '37px'" (click)="openFiltersDialog()">
|
||||
<button mat-raised-button class="p-0">
|
||||
<mat-icon class="mr-4">filter_alt</mat-icon>
|
||||
</button>
|
||||
</div> -->
|
||||
</div>
|
||||
<div>
|
||||
<div class="listing row pb-2">
|
||||
<div *ngIf="listingItems && listingItems.length > 0 || this.lookup.like" class="col-md-12">
|
||||
<div class="d-flex flex-direction-row pt-4">
|
||||
<!-- Sort by -->
|
||||
<span class="d-flex align-items-center">{{'DMP-LISTING.SORT-BY' | translate}}:</span>
|
||||
<mat-form-field class="sort-form col-auto pr-0">
|
||||
<mat-select placeholder="{{'GENERAL.CRITERIA.LIKE'| translate}}" [formControl]="formGroup.get('order')" (selectionChange)="orderByChanged()">
|
||||
<mat-option *ngIf="!isPublic" [value]="order.UpdatedAt">{{enumUtils.toRecentActivityOrderString(order.UpdatedAt)}}</mat-option>
|
||||
<!-- <mat-option *ngIf="isPublic" [value]="order.DATASETPUBLISHED">{{enumUtils.toRecentActivityOrderString(order.DATASETPUBLISHED)}}</mat-option> -->
|
||||
<mat-option [value]="order.Label">{{enumUtils.toRecentActivityOrderString(order.Label)}}</mat-option>
|
||||
<mat-option *ngIf="!isPublic" [value]="order.Status">{{enumUtils.toRecentActivityOrderString(order.Status)}}</mat-option>
|
||||
<!-- <mat-option [value]="order.CREATED">{{enumUtils.toRecentActivityOrderString(order.CREATED)}}</mat-option> -->
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
<!-- End of Sort by -->
|
||||
<div class="d-flex flex-row ml-auto">
|
||||
<!-- Guided Tour -->
|
||||
<div *ngIf="!isPublic" class="center-content" (click)="restartTour()">
|
||||
{{ 'DESCRIPTION-LISTING.ACTIONS.TAKE-A-TOUR'| translate }}
|
||||
</div>
|
||||
<!-- End of Guided Tour -->
|
||||
<!-- Search Filter-->
|
||||
<mat-form-field class="search-form ml-auto col-auto" floatLabel="never">
|
||||
<mat-icon matSuffix>search</mat-icon>
|
||||
<input matInput placeholder="{{'GENERAL.CRITERIA.LIKE'| translate}}" name="likeCriteria" [formControl]="formGroup.get('like')">
|
||||
<mat-error *ngIf="formGroup.get('like').hasError('backendError')">{{formGroup.get('like').getError('backendError').message}}</mat-error>
|
||||
</mat-form-field>
|
||||
<!-- End of Search Filter -->
|
||||
<div class="container-fluid">
|
||||
<div class="row">
|
||||
<div class="col-md-10 offset-md-1">
|
||||
<div class="d-flex flex-direction-row mb-4 mt-4">
|
||||
<div *ngIf="hasListingItems && listingItems && listingItems.length === 0 && !hasLikeCriteria()" class="card mt-0">
|
||||
<!-- <div class="card mt-0" [style.display]="isVisible ? 'block' : 'none'"> -->
|
||||
<!-- <a class="col-auto d-flex" (click)="closeCard()"><span class="ml-auto pt-3 material-icons clear-icon">clear</span></a> -->
|
||||
<div class="card-content info-text mb-0">
|
||||
<p>{{'DESCRIPTION-LISTING.TEXT-INFO' | translate}} <u class="pointer" [routerLink]="['/explore-descriptions']">{{'DESCRIPTION-LISTING.LINK-PUBLIC-DATASETS' | translate}}</u> {{'DESCRIPTION-LISTING.TEXT-INFO-REST' | translate}}</p>
|
||||
<p class="mt-4 pt-2">{{'DESCRIPTION-LISTING.TEXT-INFO-PAR' | translate}}
|
||||
<div class="d-flex">
|
||||
<button mat-raised-button class="add-description align-self-center yellow-btn" (click)="addNewDescription()">
|
||||
{{'DESCRIPTION-LISTING.ACTIONS.ADD-DESCRIPTION' | translate}}
|
||||
</button>
|
||||
<img class="col-auto ml-auto laptop-img" src="../../../assets/images/dashboard-popup.png">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-12 col-sm-12 col-md-9">
|
||||
<div *ngFor="let item of listingItems; let i = index">
|
||||
<app-description-listing-item-component [isPublic]="isPublic" [description]="item" [showDivider]="i != (listingItems.length - 1)"></app-description-listing-item-component>
|
||||
</div>
|
||||
<div *ngIf="listingItems && listingItems.length > 0 && this.lookup?.page?.offset < this.totalCount - 1 && this.pageSize < this.totalCount - 1" class="d-flex justify-content-center">
|
||||
<button type="button" class="btn-load-more" (click)="loadMore()">{{'DESCRIPTION-LISTING.ACTIONS.LOAD-MORE' | translate}}</button>
|
||||
<p *ngIf="listingItems && listingItems.length > 0 || this.lookup.like" class="col-auto header-title">{{(isPublic ? 'DESCRIPTION-LISTING.TITLE-EXPLORE' : 'DESCRIPTION-LISTING.TITLE') | translate}}</p>
|
||||
<div *ngIf="listingItems && listingItems.length > 0 && !isPublic || this.lookup.like" class="ml-auto">
|
||||
<div class="col-auto">
|
||||
<button mat-raised-button class="add-description align-self-center yellow-btn" (click)="addNewDescription()">
|
||||
{{'DESCRIPTION-LISTING.ACTIONS.ADD-DESCRIPTION' | translate}}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div *ngIf="hasListingItems && listingItems && listingItems.length === 0 && this.lookup.like !== ''" class="col-md-12 d-flex justify-content-center pt-4 mt-4 mb-4 pb-4">
|
||||
<span class="empty-list">{{'DESCRIPTION-LISTING.EMPTY-LIST' | translate}}</span>
|
||||
<!-- TODO: implement filters -->
|
||||
<!-- <div *ngIf="listingItems && listingItems.length > 0 || this.lookup.like" class="filter-btn" [style.right]="dialog.getDialogById('filters') ? '446px' : '0px'" [style.width]="scrollbar ? '57px' : '37px'" (click)="openFiltersDialog()">
|
||||
<button mat-raised-button class="p-0">
|
||||
<mat-icon class="mr-4">filter_alt</mat-icon>
|
||||
</button>
|
||||
</div> -->
|
||||
</div>
|
||||
<div>
|
||||
<div class="listing row pb-2">
|
||||
<div *ngIf="listingItems && listingItems.length > 0 || this.lookup.like" class="col-md-12">
|
||||
<div class="d-flex flex-direction-row pt-4">
|
||||
<!-- Sort by -->
|
||||
<span class="d-flex align-items-center">{{'DMP-LISTING.SORT-BY' | translate}}:</span>
|
||||
<mat-form-field class="sort-form col-auto pr-0">
|
||||
<mat-select placeholder="{{'GENERAL.CRITERIA.LIKE'| translate}}" [formControl]="formGroup.get('order')" (selectionChange)="orderByChanged()">
|
||||
<mat-option *ngIf="!isPublic" [value]="order.UpdatedAt">{{enumUtils.toRecentActivityOrderString(order.UpdatedAt)}}</mat-option>
|
||||
<!-- <mat-option *ngIf="isPublic" [value]="order.DATASETPUBLISHED">{{enumUtils.toRecentActivityOrderString(order.DATASETPUBLISHED)}}</mat-option> -->
|
||||
<mat-option [value]="order.Label">{{enumUtils.toRecentActivityOrderString(order.Label)}}</mat-option>
|
||||
<mat-option *ngIf="!isPublic" [value]="order.Status">{{enumUtils.toRecentActivityOrderString(order.Status)}}</mat-option>
|
||||
<!-- <mat-option [value]="order.CREATED">{{enumUtils.toRecentActivityOrderString(order.CREATED)}}</mat-option> -->
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
<!-- End of Sort by -->
|
||||
<div class="d-flex flex-row ml-auto">
|
||||
<!-- Guided Tour -->
|
||||
<div *ngIf="!isPublic" class="center-content" (click)="restartTour()">
|
||||
{{ 'DESCRIPTION-LISTING.ACTIONS.TAKE-A-TOUR'| translate }}
|
||||
</div>
|
||||
<!-- End of Guided Tour -->
|
||||
<!-- Search Filter-->
|
||||
<mat-form-field class="search-form ml-auto col-auto" floatLabel="never">
|
||||
<mat-icon matSuffix>search</mat-icon>
|
||||
<input matInput placeholder="{{'GENERAL.CRITERIA.LIKE'| translate}}" name="likeCriteria" [formControl]="formGroup.get('like')">
|
||||
<mat-error *ngIf="formGroup.get('like').hasError('backendError')">{{formGroup.get('like').getError('backendError').message}}</mat-error>
|
||||
</mat-form-field>
|
||||
<!-- End of Search Filter -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-12 col-sm-12 col-md-9">
|
||||
<div *ngFor="let item of listingItems; let i = index">
|
||||
<app-description-listing-item-component [isPublic]="isPublic" [description]="item" [showDivider]="i != (listingItems.length - 1)"></app-description-listing-item-component>
|
||||
</div>
|
||||
<div *ngIf="listingItems && listingItems.length > 0 && this.lookup?.page?.offset < this.totalCount - 1 && this.pageSize < this.totalCount - 1" class="d-flex justify-content-center">
|
||||
<button type="button" class="btn-load-more" (click)="loadMore()">{{'DESCRIPTION-LISTING.ACTIONS.LOAD-MORE' | translate}}</button>
|
||||
</div>
|
||||
</div>
|
||||
<div *ngIf="hasListingItems && listingItems && listingItems.length === 0 && this.lookup.like !== ''" class="col-md-12 d-flex justify-content-center pt-4 mt-4 mb-4 pb-4">
|
||||
<span class="empty-list">{{'DESCRIPTION-LISTING.EMPTY-LIST' | translate}}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,63 +1,65 @@
|
|||
<div class="main-content listing-main-container h-100">
|
||||
<div class="container-fluid">
|
||||
<div class="d-flex flex-direction-row">
|
||||
<div *ngIf="hasListingItems && listingItems && listingItems.length === 0 && !hasLikeCriteria()" class="card mt-0">
|
||||
<div class="card-content info-text mb-0">
|
||||
<p>{{'DMP-LISTING.TEXT-INFO' | translate}}</p>
|
||||
<p class="mt-4 pt-2">{{'DMP-LISTING.TEXT-INFO-QUESTION' | translate}} <a class="zenodo-link" href="https://zenodo.org/communities/liber-dmp-cat/?page=1&size=20" target="_blank">{{'DMP-LISTING.LINK-ZENODO' | translate}}</a> {{'DMP-LISTING.GET-IDEA' | translate}}</p>
|
||||
<div class="d-flex">
|
||||
<div *ngIf="!isPublic" class="col left-content" (click)="restartTour()">{{ 'GENERAL.ACTIONS.TAKE-A-TOUR'| translate }}</div>
|
||||
<img class="col-auto ml-auto laptop-img" src="../../../assets/images/dashboard-popup.png">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<p *ngIf="listingItems && listingItems.length > 0 || this.lookup.like" class="col-auto header-title">{{(isPublic ? 'GENERAL.TITLES.EXPLORE-PLANS' : 'GENERAL.TITLES.PLANS') | translate}}</p>
|
||||
<!-- TODO: implement filters -->
|
||||
<!-- <div class="filter-btn" [style.right]="this.dialog.getDialogById('filters') ? '446px' : '0px'" [style.width]="scrollbar || this.dialog.getDialogById('filters') ? '57px' : '37px'" (click)="openFiltersDialog()">
|
||||
<button mat-raised-button class="p-0">
|
||||
<mat-icon class="mr-4">filter_alt</mat-icon>
|
||||
</button>
|
||||
</div> -->
|
||||
</div>
|
||||
<div>
|
||||
<div class="listing row pb-2">
|
||||
<div *ngIf="listingItems && listingItems.length > 0 || this.lookup.like" class="col-md-12">
|
||||
<div class="d-flex flex-direction-row pt-4">
|
||||
<!-- Sort by -->
|
||||
<span class="d-flex align-items-center">{{'DMP-LISTING.SORT-BY' | translate}}:</span>
|
||||
<mat-form-field class="sort-form col-auto">
|
||||
<mat-select placeholder="{{'GENERAL.CRITERIA.LIKE'| translate}}" [formControl]="formGroup.get('order')" (selectionChange)="orderByChanged()">
|
||||
<mat-option *ngIf="!isPublic" [value]="order.UpdatedAt">{{enumUtils.toRecentActivityOrderString(order.UpdatedAt)}}</mat-option>
|
||||
<!-- <mat-option *ngIf="isPublic" [value]="order.PUBLISHED">{{enumUtils.toRecentActivityOrderString(order.PUBLISHED)}}</mat-option> -->
|
||||
<mat-option [value]="order.Label">{{enumUtils.toRecentActivityOrderString(order.Label)}}</mat-option>
|
||||
<mat-option *ngIf="!isPublic" [value]="order.Status">{{enumUtils.toRecentActivityOrderString(order.Status)}}</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
<div class="d-flex flex-row ml-auto">
|
||||
<div *ngIf="!isPublic" class="center-content" (click)="restartTour()">{{ 'GENERAL.ACTIONS.TAKE-A-TOUR'| translate }}</div>
|
||||
<mat-form-field class="search-form ml-auto col-auto pr-0"
|
||||
floatLabel="never">
|
||||
<mat-icon matSuffix>search</mat-icon>
|
||||
<input matInput placeholder="{{'GENERAL.CRITERIA.LIKE'| translate}}" name="likeCriteria"
|
||||
[formControl]="formGroup.get('like')">
|
||||
<mat-error *ngIf="formGroup.get('like').hasError('backendError')">
|
||||
{{formGroup.get('like').getError('backendError').message}}</mat-error>
|
||||
</mat-form-field>
|
||||
<div class="row">
|
||||
<div class="col-md-10 offset-md-1">
|
||||
<div class="d-flex flex-direction-row mb-4 mt-4">
|
||||
<div *ngIf="hasListingItems && listingItems && listingItems.length === 0 && !hasLikeCriteria()" class="card">
|
||||
<div class="card-content info-text mb-0">
|
||||
<p>{{'DMP-LISTING.TEXT-INFO' | translate}}</p>
|
||||
<p class="mt-4 pt-2">{{'DMP-LISTING.TEXT-INFO-QUESTION' | translate}} <a class="zenodo-link" href="https://zenodo.org/communities/liber-dmp-cat/?page=1&size=20" target="_blank">{{'DMP-LISTING.LINK-ZENODO' | translate}}</a> {{'DMP-LISTING.GET-IDEA' | translate}}</p>
|
||||
<div class="d-flex">
|
||||
<div *ngIf="!isPublic" class="col left-content" (click)="restartTour()">{{ 'GENERAL.ACTIONS.TAKE-A-TOUR'| translate }}</div>
|
||||
<img class="col-auto ml-auto laptop-img" src="../../../assets/images/dashboard-popup.png">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<p *ngIf="listingItems && listingItems.length > 0 || this.lookup.like" class="col-auto header-title">{{(isPublic ? 'GENERAL.TITLES.EXPLORE-PLANS' : 'GENERAL.TITLES.PLANS') | translate}}</p>
|
||||
<!-- TODO: implement filters -->
|
||||
<!-- <div class="filter-btn" [style.right]="this.dialog.getDialogById('filters') ? '446px' : '0px'" [style.width]="scrollbar || this.dialog.getDialogById('filters') ? '57px' : '37px'" (click)="openFiltersDialog()">
|
||||
<button mat-raised-button class="p-0">
|
||||
<mat-icon class="mr-4">filter_alt</mat-icon>
|
||||
</button>
|
||||
</div> -->
|
||||
</div>
|
||||
<div class="col-md-12 col-sm-12 col-md-9">
|
||||
<div *ngFor="let item of listingItems; let i = index">
|
||||
<app-dmp-listing-item-component [showDivider]="i != (listingItems.length - 1)" [dmp]="item" [isPublic]="isPublic"></app-dmp-listing-item-component>
|
||||
<div>
|
||||
<div class="listing row pb-2">
|
||||
<div *ngIf="listingItems && listingItems.length > 0 || this.lookup.like" class="col-md-12">
|
||||
<div class="d-flex flex-direction-row pt-4">
|
||||
<!-- Sort by -->
|
||||
<span class="d-flex align-items-center">{{'DMP-LISTING.SORT-BY' | translate}}:</span>
|
||||
<mat-form-field class="sort-form col-auto">
|
||||
<mat-select placeholder="{{'GENERAL.CRITERIA.LIKE'| translate}}" [formControl]="formGroup.get('order')" (selectionChange)="orderByChanged()">
|
||||
<mat-option *ngIf="!isPublic" [value]="order.UpdatedAt">{{enumUtils.toRecentActivityOrderString(order.UpdatedAt)}}</mat-option>
|
||||
<!-- <mat-option *ngIf="isPublic" [value]="order.PUBLISHED">{{enumUtils.toRecentActivityOrderString(order.PUBLISHED)}}</mat-option> -->
|
||||
<mat-option [value]="order.Label">{{enumUtils.toRecentActivityOrderString(order.Label)}}</mat-option>
|
||||
<mat-option *ngIf="!isPublic" [value]="order.Status">{{enumUtils.toRecentActivityOrderString(order.Status)}}</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
<div class="d-flex flex-row ml-auto">
|
||||
<div *ngIf="!isPublic" class="center-content" (click)="restartTour()">{{ 'GENERAL.ACTIONS.TAKE-A-TOUR'| translate }}</div>
|
||||
<mat-form-field class="search-form ml-auto col-auto pr-0"
|
||||
floatLabel="never">
|
||||
<mat-icon matSuffix>search</mat-icon>
|
||||
<input matInput placeholder="{{'GENERAL.CRITERIA.LIKE'| translate}}" name="likeCriteria"
|
||||
[formControl]="formGroup.get('like')">
|
||||
<mat-error *ngIf="formGroup.get('like').hasError('backendError')">
|
||||
{{formGroup.get('like').getError('backendError').message}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-12 col-sm-12 col-md-9">
|
||||
<div *ngFor="let item of listingItems; let i = index">
|
||||
<app-dmp-listing-item-component [showDivider]="i != (listingItems.length - 1)" [dmp]="item" [isPublic]="isPublic"></app-dmp-listing-item-component>
|
||||
</div>
|
||||
<div *ngIf="listingItems && listingItems.length > 0 && this.lookup?.page?.offset < this.totalCount - 1 && this.pageSize < this.totalCount - 1" class="d-flex justify-content-center">
|
||||
<button type="button" class="btn-load-more" (click)="loadMore()">{{'GENERAL.ACTIONS.LOAD-MORE' | translate}}</button>
|
||||
</div>
|
||||
</div>
|
||||
<div *ngIf="hasListingItems && listingItems && listingItems.length === 0 && this.lookup.like !== ''" class="col-md-12 d-flex justify-content-center pt-4 mt-4 mb-4 pb-4">
|
||||
<span class="empty-list">{{'DMP-LISTING.EMPTY-LIST' | translate}}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div *ngIf="listingItems && listingItems.length > 0 && this.lookup?.page?.offset < this.totalCount - 1 && this.pageSize < this.totalCount - 1" class="d-flex justify-content-center">
|
||||
<button type="button" class="btn-load-more" (click)="loadMore()">{{'GENERAL.ACTIONS.LOAD-MORE' | translate}}</button>
|
||||
</div>
|
||||
</div>
|
||||
<div *ngIf="hasListingItems && listingItems && listingItems.length === 0 && this.lookup.like !== ''" class="col-md-12 d-flex justify-content-center pt-4 mt-4 mb-4 pb-4">
|
||||
<span class="empty-list">{{'DMP-LISTING.EMPTY-LIST' | translate}}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,28 +1,30 @@
|
|||
<div class="row inapp-notification-listing">
|
||||
<div class="col-md-8 offset-md-2">
|
||||
<div class="container-fluid">
|
||||
<div class="row inapp-notification-listing">
|
||||
<div class="col-md-10 offset-md-1">
|
||||
|
||||
<div class="row mb-4 mt-3">
|
||||
<div class="col">
|
||||
<h4>{{'NOTIFICATION-SERVICE.INAPP-NOTIFICATION-LISTING.TITLE' | translate}}</h4>
|
||||
<app-navigation-breadcrumb />
|
||||
<div class="row mb-4 mt-4">
|
||||
<div class="col">
|
||||
<h4>{{'NOTIFICATION-SERVICE.INAPP-NOTIFICATION-LISTING.TITLE' | translate}}</h4>
|
||||
<app-navigation-breadcrumb />
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<app-hybrid-listing [rows]="gridRows" [columns]="gridColumns" [visibleColumns]="visibleColumns"
|
||||
[count]="totalElements" [offset]="currentPageNumber" [limit]="lookup.page.size"
|
||||
[defaultSort]="lookup.order?.items" [externalSorting]="true" (rowActivated)="onRowActivated($event)"
|
||||
(pageLoad)="alterPage($event)" (columnSort)="onColumnSort($event)"
|
||||
(columnsChanged)="onColumnsChanged($event)" [listItemTemplate]="listItemTemplate">
|
||||
|
||||
<app-mine-inapp-notification-listing-filters hybrid-listing-filters [(filter)]="lookup"
|
||||
(filterChange)="filterChanged($event)" />
|
||||
|
||||
<app-user-settings-picker [key]="userSettingsKey" [userPreference]="lookup"
|
||||
(onSettingSelected)="changeSetting($event)" [autoSelectUserSettings]="autoSelectUserSettings"
|
||||
user-preference-settings />
|
||||
</app-hybrid-listing>
|
||||
|
||||
</div>
|
||||
|
||||
<app-hybrid-listing [rows]="gridRows" [columns]="gridColumns" [visibleColumns]="visibleColumns"
|
||||
[count]="totalElements" [offset]="currentPageNumber" [limit]="lookup.page.size"
|
||||
[defaultSort]="lookup.order?.items" [externalSorting]="true" (rowActivated)="onRowActivated($event)"
|
||||
(pageLoad)="alterPage($event)" (columnSort)="onColumnSort($event)"
|
||||
(columnsChanged)="onColumnsChanged($event)" [listItemTemplate]="listItemTemplate">
|
||||
|
||||
<app-mine-inapp-notification-listing-filters hybrid-listing-filters [(filter)]="lookup"
|
||||
(filterChange)="filterChanged($event)" />
|
||||
|
||||
<app-user-settings-picker [key]="userSettingsKey" [userPreference]="lookup"
|
||||
(onSettingSelected)="changeSetting($event)" [autoSelectUserSettings]="autoSelectUserSettings"
|
||||
user-preference-settings />
|
||||
</app-hybrid-listing>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
.inapp-notification-listing {
|
||||
margin-top: 1.3rem;
|
||||
margin-left: 1rem;
|
||||
margin-right: 2rem;
|
||||
// margin-top: 1.3rem;
|
||||
// margin-left: 1rem;
|
||||
// margin-right: 2rem;
|
||||
|
||||
.mat-header-row{
|
||||
background: #f3f5f8;
|
||||
|
|
|
|||
|
|
@ -1,63 +1,72 @@
|
|||
<div class="supportive-material-editor">
|
||||
<form *ngIf="formGroup" (ngSubmit)="formSubmit()">
|
||||
<div>
|
||||
<mat-card class="col-md-8 offset-md-2 p-3">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'SUPPORTIVE-MATERIAL-EDITOR.FIELDS.MATERIAL-TYPE' | translate}}</mat-label>
|
||||
<mat-select (selectionChange)="selectedMaterialChanged($event.value)" name="type" [formControl]="formGroup.get('type')" required>
|
||||
<mat-option *ngFor="let type of supportiveMaterialTypeEnum" [value]="type">
|
||||
{{enumUtils.toSupportiveMaterialTypeString(type)}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
<mat-error *ngIf="formGroup.get('type').hasError('backendError')">{{formGroup.get('type').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('type').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'SUPPORTIVE-MATERIAL-EDITOR.FIELDS.LANGUAGE' | translate}}</mat-label>
|
||||
<mat-select (selectionChange)="selectedLangChanged($event.value)" name="languageCode" [formControl]="formGroup.get('languageCode')">
|
||||
<mat-option *ngFor="let languageCode of availableLanguageCodes" [value]="languageCode">
|
||||
{{languageCode}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
<mat-error *ngIf="formGroup.get('languageCode').hasError('backendError')">{{formGroup.get('languageCode').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('languageCode').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="container-fluid">
|
||||
<div class="row supportive-material-editor">
|
||||
<div class="col-md-10 offset-md-1">
|
||||
<div class="mt-4"></div>
|
||||
<form *ngIf="formGroup" (ngSubmit)="formSubmit()">
|
||||
<div>
|
||||
<mat-card class="p-1">
|
||||
<div class="container-fluid mt-3">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'SUPPORTIVE-MATERIAL-EDITOR.FIELDS.MATERIAL-TYPE' | translate}}</mat-label>
|
||||
<mat-select (selectionChange)="selectedMaterialChanged($event.value)" name="type" [formControl]="formGroup.get('type')" required>
|
||||
<mat-option *ngFor="let type of supportiveMaterialTypeEnum" [value]="type">
|
||||
{{enumUtils.toSupportiveMaterialTypeString(type)}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
<mat-error *ngIf="formGroup.get('type').hasError('backendError')">{{formGroup.get('type').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('type').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col">
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'SUPPORTIVE-MATERIAL-EDITOR.FIELDS.LANGUAGE' | translate}}</mat-label>
|
||||
<mat-select (selectionChange)="selectedLangChanged($event.value)" name="languageCode" [formControl]="formGroup.get('languageCode')">
|
||||
<mat-option *ngFor="let languageCode of availableLanguageCodes" [value]="languageCode">
|
||||
{{languageCode}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
<mat-error *ngIf="formGroup.get('languageCode').hasError('backendError')">{{formGroup.get('languageCode').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('languageCode').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row" *ngIf="formGroup.get('type').value != null && formGroup.get('languageCode').value">
|
||||
<div class="col">
|
||||
<editor class="w-100" [init]="{
|
||||
base_url: '/tinymce',
|
||||
suffix: '.min',
|
||||
height: 800,
|
||||
menubar: true,
|
||||
plugins: [
|
||||
'advlist autolink lists link image charmap print preview anchor',
|
||||
'searchreplace visualblocks fullscreen fullpage',
|
||||
'insertdatetime media table paste code help wordcount importcss ',
|
||||
'codesample toc visualchars'
|
||||
],
|
||||
extended_valid_elements: '*[*]',
|
||||
forced_root_block: '',
|
||||
valid_children: '+body[script],ol[li|div|p|a|ol|table],h2[span],h3[span]',
|
||||
save_enablewhendirty: false,
|
||||
toolbar:
|
||||
'undo redo | formatselect | bold italic backcolor | \
|
||||
alignleft aligncenter alignright alignjustify | \
|
||||
bullist numlist outdent indent | code codesample | searchreplace | preview | removeformat | help'
|
||||
}" [formControl]="formGroup.get('payload')"></editor>
|
||||
<mat-error *ngIf="formGroup.get('payload').hasError('backendError')">{{formGroup.get('payload').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('payload').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</mat-card>
|
||||
<button mat-fab class="mat-fab-bottom-right save-btn" matTooltip="{{'SUPPORTIVE-MATERIAL-EDITOR.ACTIONS.SAVE' | translate}}" type="submit">
|
||||
<mat-icon class="mat-24">save</mat-icon>
|
||||
</button>
|
||||
</div>
|
||||
<div class="row" *ngIf="formGroup.get('type').value != null && formGroup.get('languageCode').value">
|
||||
<div class="col">
|
||||
<editor class="w-100" [init]="{
|
||||
base_url: '/tinymce',
|
||||
suffix: '.min',
|
||||
height: 800,
|
||||
menubar: true,
|
||||
plugins: [
|
||||
'advlist autolink lists link image charmap print preview anchor',
|
||||
'searchreplace visualblocks fullscreen fullpage',
|
||||
'insertdatetime media table paste code help wordcount importcss ',
|
||||
'codesample toc visualchars'
|
||||
],
|
||||
extended_valid_elements: '*[*]',
|
||||
forced_root_block: '',
|
||||
valid_children: '+body[script],ol[li|div|p|a|ol|table],h2[span],h3[span]',
|
||||
save_enablewhendirty: false,
|
||||
toolbar:
|
||||
'undo redo | formatselect | bold italic backcolor | \
|
||||
alignleft aligncenter alignright alignjustify | \
|
||||
bullist numlist outdent indent | code codesample | searchreplace | preview | removeformat | help'
|
||||
}" [formControl]="formGroup.get('payload')"></editor>
|
||||
<mat-error *ngIf="formGroup.get('payload').hasError('backendError')">{{formGroup.get('payload').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('payload').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</div>
|
||||
</div>
|
||||
</mat-card>
|
||||
<button mat-fab class="mat-fab-bottom-right save-btn" matTooltip="{{'SUPPORTIVE-MATERIAL-EDITOR.ACTIONS.SAVE' | translate}}" type="submit">
|
||||
<mat-icon class="mat-24">save</mat-icon>
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
.supportive-material-editor {
|
||||
//padding-top: 5em;
|
||||
padding-bottom: 2em;
|
||||
margin-top: 1em;
|
||||
// padding-bottom: 2em;
|
||||
// margin-top: 1em;
|
||||
|
||||
.material{
|
||||
//width: 80px;
|
||||
|
|
|
|||
Loading…
Reference in New Issue