no message
This commit is contained in:
parent
22582676a3
commit
518a2ffd3c
|
|
@ -1,122 +1,120 @@
|
|||
import { UnauthorizedComponent } from './unauthorized/unauthorized.component';
|
||||
import { NgModule } from '@angular/core';
|
||||
import { RouterModule, Routes } from '@angular/router';
|
||||
import { HomepageComponent } from './homepage/homepage.component';
|
||||
import { AuthGuard } from './shared/guards/auth.guard';
|
||||
import { LoginComponent } from './user-management/login/login.component';
|
||||
import { WelcomepageComponent } from './welcomepage/welcomepage.component';
|
||||
import { B2AccessLoginComponent } from './user-management/login/b2access/b2access-login.component';
|
||||
|
||||
const appRoutes: Routes = [
|
||||
{
|
||||
path: 'datasets',
|
||||
loadChildren: './datasets/dataset.module#DatasetModule',
|
||||
data: {
|
||||
breadcrumb: true
|
||||
},
|
||||
canActivate: [AuthGuard]
|
||||
},
|
||||
{
|
||||
path: 'about',
|
||||
loadChildren: './about/about.module#AboutModule',
|
||||
data: {
|
||||
breadcrumb: true
|
||||
},
|
||||
canActivate: [AuthGuard]
|
||||
},
|
||||
{
|
||||
path: 'projects',
|
||||
loadChildren: './projects/projects.module#ProjectsModule',
|
||||
data: {
|
||||
breadcrumb: true
|
||||
},
|
||||
canActivate: [AuthGuard]
|
||||
},
|
||||
{
|
||||
path: "dmps",
|
||||
loadChildren: './dmps/dmps.module#DataManagementPlanModule',
|
||||
data: {
|
||||
breadcrumb: true
|
||||
},
|
||||
canActivate: [AuthGuard]
|
||||
},
|
||||
{
|
||||
path: "dmp-profiles",
|
||||
loadChildren: './dmp-profiles/dmp-profile.module#DataManagamentPlanProfileModule',
|
||||
data: {
|
||||
breadcrumb: true
|
||||
},
|
||||
canActivate: [AuthGuard]
|
||||
},
|
||||
{
|
||||
path: 'form',
|
||||
loadChildren: './dataset-profile-form/dataset-profile.module#DatasetProfileModule',
|
||||
data: {
|
||||
breadcrumb: true
|
||||
},
|
||||
canActivate: [AuthGuard]
|
||||
},
|
||||
{
|
||||
path: 'home',
|
||||
component: HomepageComponent,
|
||||
data: {
|
||||
breadcrumb: false
|
||||
},
|
||||
canActivate: [AuthGuard]
|
||||
},
|
||||
{
|
||||
path: '',
|
||||
redirectTo: '/welcome',
|
||||
data: {
|
||||
breadcrumbs: false
|
||||
},
|
||||
pathMatch: 'full'
|
||||
},
|
||||
{
|
||||
path: "unauthorized",
|
||||
loadChildren: './unauthorized/unauthorized.module#UnauthorizedModule',
|
||||
data: {
|
||||
breadcrumb: true
|
||||
},
|
||||
},
|
||||
{
|
||||
path: "users",
|
||||
loadChildren: './users/users.module#UsersModule'
|
||||
},
|
||||
{
|
||||
path: "datasetsProfiles",
|
||||
loadChildren: './datasets-admin-listing/dataset-admin.module#DatasetAdminModule',
|
||||
data: {
|
||||
breadcrumb: true
|
||||
},
|
||||
},
|
||||
{
|
||||
path: "welcome",
|
||||
component: WelcomepageComponent,
|
||||
data: {
|
||||
breadcrumb: false
|
||||
},
|
||||
},
|
||||
{
|
||||
path: "api/oauth/authorized/b2access",
|
||||
component: B2AccessLoginComponent,
|
||||
data: {
|
||||
},
|
||||
}
|
||||
{
|
||||
path: 'datasets',
|
||||
loadChildren: './datasets/dataset.module#DatasetModule',
|
||||
data: {
|
||||
breadcrumb: true
|
||||
},
|
||||
canActivate: [AuthGuard]
|
||||
},
|
||||
{
|
||||
path: 'about',
|
||||
loadChildren: './about/about.module#AboutModule',
|
||||
data: {
|
||||
breadcrumb: true
|
||||
},
|
||||
canActivate: [AuthGuard]
|
||||
},
|
||||
{
|
||||
path: 'projects',
|
||||
loadChildren: './projects/projects.module#ProjectsModule',
|
||||
data: {
|
||||
breadcrumb: true
|
||||
},
|
||||
canActivate: [AuthGuard]
|
||||
},
|
||||
{
|
||||
path: "dmps",
|
||||
loadChildren: './dmps/dmps.module#DataManagementPlanModule',
|
||||
data: {
|
||||
breadcrumb: true
|
||||
},
|
||||
canActivate: [AuthGuard]
|
||||
},
|
||||
{
|
||||
path: "dmp-profiles",
|
||||
loadChildren: './dmp-profiles/dmp-profile.module#DataManagamentPlanProfileModule',
|
||||
data: {
|
||||
breadcrumb: true
|
||||
},
|
||||
canActivate: [AuthGuard]
|
||||
},
|
||||
{
|
||||
path: 'form',
|
||||
loadChildren: './dataset-profile-form/dataset-profile.module#DatasetProfileModule',
|
||||
data: {
|
||||
breadcrumb: true
|
||||
},
|
||||
canActivate: [AuthGuard]
|
||||
},
|
||||
{
|
||||
path: 'home',
|
||||
component: HomepageComponent,
|
||||
data: {
|
||||
breadcrumb: false
|
||||
},
|
||||
canActivate: [AuthGuard]
|
||||
},
|
||||
{
|
||||
path: '',
|
||||
redirectTo: '/welcome',
|
||||
data: {
|
||||
breadcrumbs: false
|
||||
},
|
||||
pathMatch: 'full'
|
||||
},
|
||||
{
|
||||
path: "unauthorized",
|
||||
loadChildren: './unauthorized/unauthorized.module#UnauthorizedModule',
|
||||
data: {
|
||||
breadcrumb: true
|
||||
},
|
||||
},
|
||||
{
|
||||
path: "users",
|
||||
loadChildren: './users/users.module#UsersModule'
|
||||
},
|
||||
{
|
||||
path: "datasetsProfiles",
|
||||
loadChildren: './datasets-admin-listing/dataset-admin.module#DatasetAdminModule',
|
||||
data: {
|
||||
breadcrumb: true
|
||||
},
|
||||
},
|
||||
{
|
||||
path: "welcome",
|
||||
component: WelcomepageComponent,
|
||||
data: {
|
||||
breadcrumb: false
|
||||
},
|
||||
},
|
||||
{
|
||||
path: "api/oauth/authorized/b2access",
|
||||
component: B2AccessLoginComponent,
|
||||
data: {
|
||||
},
|
||||
}
|
||||
];
|
||||
|
||||
@NgModule({
|
||||
imports: [
|
||||
RouterModule.forRoot(
|
||||
appRoutes
|
||||
, {
|
||||
useHash: false
|
||||
}
|
||||
)
|
||||
],
|
||||
exports: [
|
||||
RouterModule
|
||||
]
|
||||
imports: [
|
||||
RouterModule.forRoot(
|
||||
appRoutes
|
||||
, {
|
||||
useHash: false
|
||||
}
|
||||
)
|
||||
],
|
||||
exports: [
|
||||
RouterModule
|
||||
]
|
||||
})
|
||||
export class AppRoutingModule { }
|
||||
|
||||
|
|
|
|||
|
|
@ -1,150 +1,145 @@
|
|||
<div class="data-management-plan-editor">
|
||||
|
||||
<mat-card-title *ngIf="isNew">{{'DMP-EDITOR.TITLE.NEW' | translate}}</mat-card-title>
|
||||
<mat-card-title *ngIf="!isNew">
|
||||
<h3>{{formGroup?.get('label')?.value}} </h3>
|
||||
</mat-card-title>
|
||||
<form *ngIf="formGroup" (ngSubmit)="formSubmit()" [formGroup]="formGroup">
|
||||
|
||||
|
||||
<mat-card>
|
||||
|
||||
<mat-card-header>
|
||||
<mat-card-title *ngIf="isNew">{{'DMP-EDITOR.TITLE.NEW' | translate}}</mat-card-title>
|
||||
<mat-card-title *ngIf="!isNew">
|
||||
<h3>{{formGroup.get('label').value}} </h3>
|
||||
</mat-card-title>
|
||||
<div class="fill-space"></div>
|
||||
<div *ngIf="!isNew" flexLayout="row">
|
||||
<div *ngIf="!isNew">
|
||||
<!-- <div fxFlex>
|
||||
<button mat-button type="button" (click)="redirectToProject()">
|
||||
<mat-icon>arrow_right_alt</mat-icon>{{'DMP-EDITOR.ACTIONS.GO-TO-PROJECT' | translate}}</button>
|
||||
</div> -->
|
||||
<div fxFlex>
|
||||
<div>
|
||||
<button mat-button type="button" (click)="redirectToDatasets()">
|
||||
<mat-icon>arrow_right_alt</mat-icon>{{'DMP-EDITOR.ACTIONS.GO-TO-DATASETS' | translate}}</button>
|
||||
</div>
|
||||
<mat-menu #actionsMenu="matMenu">
|
||||
|
||||
<button mat-menu-item (click)="newVersion(this.dataManagementPlan.id, this.dataManagementPlan.label)">
|
||||
<mat-icon>queue</mat-icon>{{'DMP-LISTING.ACTIONS.NEW-VERSION' | translate}}</button>
|
||||
<button mat-menu-item (click)="clone(this.dataManagementPlan.id)">
|
||||
<mat-icon>filter_none</mat-icon>{{'DMP-LISTING.ACTIONS.CLONE' | translate}}</button>
|
||||
</mat-menu>
|
||||
<div fxFlex>
|
||||
<button fxFlex mat-icon-button type="button" [matMenuTriggerFor]="actionsMenu">
|
||||
<div>
|
||||
<button mat-icon-button type="button" [matMenuTriggerFor]="actionsMenu">
|
||||
<mat-icon>more_vert</mat-icon>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</mat-card-header>
|
||||
<mat-card-content>
|
||||
<mat-form-field class="full-width">
|
||||
<input matInput placeholder="{{'DMP-EDITOR.FIELDS.NAME' | translate}}" type="text" name="label" formControlName="label" required>
|
||||
<mat-error *ngIf="formGroup.get('label').errors?.backendError">{{baseErrorModel.label}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('label').errors?.required">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
<div class="row">
|
||||
<mat-form-field class="col-md-12">
|
||||
<input matInput placeholder="{{'DMP-EDITOR.FIELDS.NAME' | translate}}" type="text" name="label" formControlName="label" required>
|
||||
<mat-error *ngIf="formGroup.get('label').errors?.backendError">{{baseErrorModel.label}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('label').errors?.required">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
|
||||
<mat-form-field class="full-width">
|
||||
<textarea matInput class="description-area" placeholder="{{'DMP-EDITOR.FIELDS.DESCRIPTION' | translate}}" formControlName="description"
|
||||
required></textarea>
|
||||
<mat-error *ngIf="formGroup.get('description').errors?.backendError">{{errorModel.description}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('description').errors?.required">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
<mat-form-field class="col-md-12">
|
||||
<textarea matInput class="description-area" placeholder="{{'DMP-EDITOR.FIELDS.DESCRIPTION' | translate}}" formControlName="description"
|
||||
required></textarea>
|
||||
<mat-error *ngIf="formGroup.get('description').errors?.backendError">{{errorModel.description}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('description').errors?.required">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
|
||||
<auto-complete class="mat-form-field-full-width" placeholder="{{this.languageResolverService.getBy('dmpEditor') | translate}}"
|
||||
[configuration]="projectAutoCompleteConfiguration" titleKey="label" [control]="formGroup.get('project')" [required]="true">
|
||||
</auto-complete>
|
||||
<auto-complete class="col-md-6" placeholder="{{this.languageResolverService.getBy('dmpEditor') | translate}}" [configuration]="projectAutoCompleteConfiguration"
|
||||
titleKey="label" [control]="formGroup.get('project')" [required]="true">
|
||||
</auto-complete>
|
||||
|
||||
<!-- <app-dynamic-fields-project [formGroup]="formGroup"></app-dynamic-fields-project> -->
|
||||
<!-- <app-dynamic-fields-project [formGroup]="formGroup"></app-dynamic-fields-project> -->
|
||||
|
||||
<td-chips color="accent" [items]="filteredProfiles" formControlName="profiles" placeholder="{{'DMP-EDITOR.FIELDS.PROFILES' | translate}}"
|
||||
(inputChange)="filterProfiles($event)" requireMatch required>
|
||||
<ng-template td-chip let-chip="chip">
|
||||
<div class="tc-grey-100 bgc-teal-700" td-chip-avatar>{{chip.label.substring(0, 1).toUpperCase()}}</div>
|
||||
{{chip.label}}
|
||||
</ng-template>
|
||||
<ng-template td-autocomplete-option let-option="option">
|
||||
<div layout="row" layout-align="start center">
|
||||
{{option.label}}
|
||||
</div>
|
||||
</ng-template>
|
||||
<mat-progress-bar [style.height.px]="2" *ngIf="filteredProfilesAsync" mode="indeterminate"></mat-progress-bar>
|
||||
<span *ngIf="formGroup.get('profiles').touched || !formGroup.get('profiles').pristine">
|
||||
<mat-error style="font-size:10.5px" *ngIf="formGroup.get('profiles').errors?.required">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</span>
|
||||
</td-chips>
|
||||
<!-- <button mat-button (click)="availableProfiles()">View All</button> -->
|
||||
<a style="float:right" href="#" (click)="availableProfiles()">View All</a>
|
||||
<td-chips class="col-md-6" color="accent" [items]="filteredProfiles" formControlName="profiles" placeholder="{{'DMP-EDITOR.FIELDS.PROFILES' | translate}}"
|
||||
(inputChange)="filterProfiles($event)" requireMatch required>
|
||||
<ng-template td-chip let-chip="chip">
|
||||
<div class="tc-grey-100 bgc-teal-700" td-chip-avatar>{{chip.label.substring(0, 1).toUpperCase()}}</div>
|
||||
{{chip.label}}
|
||||
</ng-template>
|
||||
<ng-template td-autocomplete-option let-option="option">
|
||||
<div>
|
||||
{{option.label}}
|
||||
</div>
|
||||
</ng-template>
|
||||
<mat-progress-bar [style.height.px]="2" *ngIf="filteredProfilesAsync" mode="indeterminate"></mat-progress-bar>
|
||||
<span *ngIf="formGroup.get('profiles').touched || !formGroup.get('profiles').pristine">
|
||||
<mat-error style="font-size:10.5px" *ngIf="formGroup.get('profiles').errors?.required">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</span>
|
||||
</td-chips>
|
||||
<!-- <button mat-button (click)="availableProfiles()">View All</button> -->
|
||||
<a style="float:right" href="#" (click)="availableProfiles()">View All</a>
|
||||
|
||||
<!-- <auto-complete-chip class="mat-form-field-full-width" placeholder="{{'DMP-EDITOR.FIELDS.ORGANISATIONS' | translate}}" [configuration]="organisationsAutoCompleteConfiguration"
|
||||
<!-- <auto-complete-chip placeholder="{{'DMP-EDITOR.FIELDS.ORGANISATIONS' | translate}}" [configuration]="organisationsAutoCompleteConfiguration"
|
||||
titleKey="name" [control]="formGroup.get('organisations')" [required]="true">
|
||||
</auto-complete-chip> -->
|
||||
|
||||
<td-chips color="accent" [items]="filteredOrganisations" formControlName="organisations" placeholder="{{'DMP-EDITOR.FIELDS.ORGANISATIONS' | translate}}"
|
||||
(inputChange)="filterOrganisations($event)" requireMatch>
|
||||
<ng-template td-chip let-chip="chip">
|
||||
<div class="tc-grey-100 bgc-teal-700" td-chip-avatar>{{chip.name.substring(0, 1).toUpperCase()}}</div>
|
||||
{{chip.name}}
|
||||
</ng-template>
|
||||
<ng-template td-autocomplete-option let-option="option">
|
||||
<div layout="row" layout-align="start center">
|
||||
{{option.name}}
|
||||
</div>
|
||||
</ng-template>
|
||||
<mat-progress-bar [style.height.px]="2" *ngIf="filteringOrganisationsAsync" mode="indeterminate"></mat-progress-bar>
|
||||
</td-chips>
|
||||
|
||||
<div layout="row" layout-align="start center">
|
||||
<td-chips style="margin-bottom:25px; display:inline-block; width:90%" color="accent" [items]="filteredResearchers" formControlName="researchers"
|
||||
placeholder="{{'DMP-EDITOR.FIELDS.RESEARCHERS' | translate}}" (inputChange)="filterResearchers($event)" requireMatch>
|
||||
<td-chips class="col-md-6" color="accent" [items]="filteredOrganisations" formControlName="organisations" placeholder="{{'DMP-EDITOR.FIELDS.ORGANISATIONS' | translate}}"
|
||||
(inputChange)="filterOrganisations($event)" requireMatch>
|
||||
<ng-template td-chip let-chip="chip">
|
||||
<div class="tc-grey-100 bgc-teal-700" td-chip-avatar>{{chip.name.substring(0, 1).toUpperCase()}}</div>
|
||||
{{chip.name}}
|
||||
</ng-template>
|
||||
<ng-template td-autocomplete-option let-option="option">
|
||||
<div layout="row" layout-align="start center">
|
||||
<div>
|
||||
{{option.name}}
|
||||
</div>
|
||||
</ng-template>
|
||||
<mat-progress-bar [style.height.px]="2" *ngIf="filteringResearchersAsync" mode="indeterminate"></mat-progress-bar>
|
||||
<mat-progress-bar [style.height.px]="2" *ngIf="filteringOrganisationsAsync" mode="indeterminate"></mat-progress-bar>
|
||||
</td-chips>
|
||||
|
||||
<button style="display:inline-block;" mat-icon-button type="button" (click)="addResearcher()">
|
||||
<mat-icon aria-label="Example icon-button with a heart icon">add_circle</mat-icon>
|
||||
</button>
|
||||
<div class="col-md-6">
|
||||
<td-chips style="margin-bottom:25px; display:inline-block; width:90%" color="accent" [items]="filteredResearchers" formControlName="researchers"
|
||||
placeholder="{{'DMP-EDITOR.FIELDS.RESEARCHERS' | translate}}" (inputChange)="filterResearchers($event)" requireMatch>
|
||||
<ng-template td-chip let-chip="chip">
|
||||
<div class="tc-grey-100 bgc-teal-700" td-chip-avatar>{{chip.name.substring(0, 1).toUpperCase()}}</div>
|
||||
{{chip.name}}
|
||||
</ng-template>
|
||||
<ng-template td-autocomplete-option let-option="option">
|
||||
<div>
|
||||
{{option.name}}
|
||||
</div>
|
||||
</ng-template>
|
||||
<mat-progress-bar [style.height.px]="2" *ngIf="filteringResearchersAsync" mode="indeterminate"></mat-progress-bar>
|
||||
</td-chips>
|
||||
|
||||
<button style="display:inline-block;" mat-icon-button type="button" (click)="addResearcher()">
|
||||
<mat-icon aria-label="Example icon-button with a heart icon">add_circle</mat-icon>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<h3 mat-subheader class="col-md-12">{{'DMP-EDITOR.FIELDS.PROFILE' | translate}}</h3>
|
||||
|
||||
<mat-form-field class="col-md-6">
|
||||
<input type="text" placeholder="{{'DMP-EDITOR.FIELDS.PROFILE' | translate}}" [formControl]="textCtrl" matInput [matAutocomplete]="auto">
|
||||
<mat-autocomplete #auto="matAutocomplete" [displayWith]="displayWith">
|
||||
<mat-option *ngFor="let option of filteredOptions | async" [value]="option" (click)="selectOption(option)">
|
||||
{{ option.label }}
|
||||
</mat-option>
|
||||
</mat-autocomplete>
|
||||
</mat-form-field>
|
||||
<app-dynamic-dmp-field-resolver class="col-md-12" *ngIf="dataManagementPlan.definition" [formGroup]="formGroup" [dataManagementPlanProfile]="dataManagementPlan.definition"></app-dynamic-dmp-field-resolver>
|
||||
|
||||
<mat-form-field class="col-md-6">
|
||||
<input matInput placeholder="Version" disabled [value]="formGroup.get('version').value== undefined ?0 :formGroup.get('version').value">
|
||||
</mat-form-field>
|
||||
|
||||
|
||||
<mat-list *ngIf="associatedUsers?.length" role="list" class="col-md-12">
|
||||
<h3 mat-subheader>Associated Users</h3>
|
||||
<mat-list-item role="listitem" *ngFor="let user of associatedUsers">
|
||||
<mat-icon mat-list-icon>person</mat-icon>
|
||||
<div>{{user.name}}</div>
|
||||
</mat-list-item>
|
||||
</mat-list>
|
||||
|
||||
|
||||
<div class="col-md-12">
|
||||
<button mat-raised-button color="primary" (click)="cancel()" type="button">{{'DMP-EDITOR.ACTIONS.CANCEL' | translate}}</button>
|
||||
<!-- <button *ngIf="!isNew" mat-raised-button color="primary" (click)="invite()" type="button">{{'DMP-EDITOR.ACTIONS.INVITE' | translate}}</button> -->
|
||||
<button mat-raised-button color="primary" type="submit">{{'DMP-EDITOR.ACTIONS.SAVE' | translate}}</button>
|
||||
<button *ngIf="!isNew" mat-raised-button color="primary" type="button" (click)="openConfirm(formGroup.get('label').value, formGroup.get('id').value)">{{'DMP-EDITOR.ACTIONS.DELETE' | translate}}</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<h3 mat-subheader>{{'DMP-EDITOR.FIELDS.PROFILE' | translate}}</h3>
|
||||
|
||||
<mat-form-field class="full-width">
|
||||
<input type="text" placeholder="{{'DMP-EDITOR.FIELDS.PROFILE' | translate}}" [formControl]="textCtrl" matInput [matAutocomplete]="auto">
|
||||
<mat-autocomplete #auto="matAutocomplete" [displayWith]="displayWith">
|
||||
<mat-option *ngFor="let option of filteredOptions | async" [value]="option" (click)="selectOption(option)">
|
||||
{{ option.label }}
|
||||
</mat-option>
|
||||
</mat-autocomplete>
|
||||
</mat-form-field>
|
||||
<app-dynamic-dmp-field-resolver class="full-width" *ngIf="dataManagementPlan.definition" [formGroup]="formGroup" [dataManagementPlanProfile]="dataManagementPlan.definition"></app-dynamic-dmp-field-resolver>
|
||||
|
||||
<mat-form-field class="full-width">
|
||||
<input matInput placeholder="Version" disabled [value]="formGroup.get('version').value== undefined ?0 :formGroup.get('version').value">
|
||||
</mat-form-field>
|
||||
|
||||
|
||||
<mat-list *ngIf="associatedUsers?.length" role="list">
|
||||
<h3 mat-subheader>Associated Users</h3>
|
||||
<mat-list-item role="listitem" *ngFor="let user of associatedUsers">
|
||||
<mat-icon mat-list-icon>person</mat-icon>
|
||||
<div>{{user.name}}</div>
|
||||
</mat-list-item>
|
||||
</mat-list>
|
||||
|
||||
|
||||
<div layout="row" class="full-width text-right" align="end">
|
||||
<button mat-raised-button color="primary" (click)="cancel()" type="button">{{'DMP-EDITOR.ACTIONS.CANCEL' | translate}}</button>
|
||||
<!-- <button *ngIf="!isNew" mat-raised-button color="primary" (click)="invite()" type="button">{{'DMP-EDITOR.ACTIONS.INVITE' | translate}}</button> -->
|
||||
<button mat-raised-button color="primary" type="submit">{{'DMP-EDITOR.ACTIONS.SAVE' | translate}}</button>
|
||||
<button *ngIf="!isNew" mat-raised-button color="primary" type="button" (click)="openConfirm(formGroup.get('label').value, formGroup.get('id').value)">{{'DMP-EDITOR.ACTIONS.DELETE' | translate}}</button>
|
||||
</div>
|
||||
|
||||
|
||||
</mat-card-content>
|
||||
</mat-card>
|
||||
</form>
|
||||
|
|
|
|||
|
|
@ -1,7 +1,3 @@
|
|||
.full-width {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.input-table {
|
||||
table-layout: fixed;
|
||||
}
|
||||
|
|
@ -11,12 +7,6 @@
|
|||
}
|
||||
|
||||
.data-management-plan-editor {
|
||||
.mat-form-field-full-width {
|
||||
mat-form-field {
|
||||
width: 100%;
|
||||
padding: 3px;
|
||||
}
|
||||
}
|
||||
.fill-space {
|
||||
flex: 1 1 auto;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -35,276 +35,276 @@ import { IBreadCrumbComponent } from "../../shared/components/breadcrumb/definit
|
|||
import { BreadcrumbItem } from "../../shared/components/breadcrumb/definition/breadcrumb-item";
|
||||
|
||||
@Component({
|
||||
selector: 'app-dmp-editor-component',
|
||||
templateUrl: 'dmp-editor.component.html',
|
||||
styleUrls: ['./dmp-editor.component.scss'],
|
||||
encapsulation: ViewEncapsulation.None
|
||||
selector: 'app-dmp-editor-component',
|
||||
templateUrl: 'dmp-editor.component.html',
|
||||
styleUrls: ['./dmp-editor.component.scss'],
|
||||
encapsulation: ViewEncapsulation.None
|
||||
})
|
||||
export class DataManagementPlanEditorComponent implements AfterViewInit, IBreadCrumbComponent {
|
||||
|
||||
|
||||
breadCrumbs: Observable<BreadcrumbItem[]>;
|
||||
isNew = true;
|
||||
textCtrl = new FormControl();
|
||||
dataManagementPlan: DataManagementPlanModel;
|
||||
formGroup: FormGroup = null;
|
||||
breadCrumbs: Observable<BreadcrumbItem[]>;
|
||||
isNew = true;
|
||||
textCtrl = new FormControl();
|
||||
dataManagementPlan: DataManagementPlanModel;
|
||||
formGroup: FormGroup = null;
|
||||
|
||||
filteringOrganisationsAsync: boolean = false;
|
||||
filteringResearchersAsync: boolean = false;
|
||||
filteredProfilesAsync: boolean = false;
|
||||
filteredOrganisations: ExternalSourcesItemModel[];
|
||||
filteredResearchers: ExternalSourcesItemModel[];
|
||||
filteredProfiles: DatasetProfileModel[];
|
||||
filteringOrganisationsAsync: boolean = false;
|
||||
filteringResearchersAsync: boolean = false;
|
||||
filteredProfilesAsync: boolean = false;
|
||||
filteredOrganisations: ExternalSourcesItemModel[];
|
||||
filteredResearchers: ExternalSourcesItemModel[];
|
||||
filteredProfiles: DatasetProfileModel[];
|
||||
|
||||
projectAutoCompleteConfiguration: AutoCompleteConfiguration;
|
||||
organisationsAutoCompleteConfiguration: AutoCompleteChipConfiguration;
|
||||
createNewVersion;
|
||||
associatedUsers: Array<DmpUsersModel>
|
||||
filteredOptions: Observable<DataManagementPlanProfileListingModel>
|
||||
projectAutoCompleteConfiguration: AutoCompleteConfiguration;
|
||||
organisationsAutoCompleteConfiguration: AutoCompleteChipConfiguration;
|
||||
createNewVersion;
|
||||
associatedUsers: Array<DmpUsersModel>
|
||||
filteredOptions: Observable<DataManagementPlanProfileListingModel>
|
||||
|
||||
constructor(
|
||||
private dmpProfileService: DataManagementPlanProfileService,
|
||||
private dataManagementPlanService: DataManagementPlanService,
|
||||
private projectService: ProjectService,
|
||||
private externalSourcesService: ExternalSourcesService,
|
||||
private route: ActivatedRoute,
|
||||
public snackBar: MatSnackBar,
|
||||
public router: Router,
|
||||
public language: TranslateService,
|
||||
private _service: DataManagementPlanService,
|
||||
public dialog: MatDialog,
|
||||
private _dialogService: TdDialogService,
|
||||
private _viewContainerRef: ViewContainerRef,
|
||||
private languageResolverService: LanguageResolverService
|
||||
) {
|
||||
this.filteredOptions = dmpProfileService.getAll({ criteria: new DataManagementPlanProfileCriteria() });
|
||||
}
|
||||
constructor(
|
||||
private dmpProfileService: DataManagementPlanProfileService,
|
||||
private dataManagementPlanService: DataManagementPlanService,
|
||||
private projectService: ProjectService,
|
||||
private externalSourcesService: ExternalSourcesService,
|
||||
private route: ActivatedRoute,
|
||||
public snackBar: MatSnackBar,
|
||||
public router: Router,
|
||||
public language: TranslateService,
|
||||
private _service: DataManagementPlanService,
|
||||
public dialog: MatDialog,
|
||||
private _dialogService: TdDialogService,
|
||||
private _viewContainerRef: ViewContainerRef,
|
||||
private languageResolverService: LanguageResolverService
|
||||
) {
|
||||
this.filteredOptions = dmpProfileService.getAll({ criteria: new DataManagementPlanProfileCriteria() });
|
||||
}
|
||||
|
||||
ngAfterViewInit() {
|
||||
this.route.params.subscribe((params: Params) => {
|
||||
const itemId = params['id'];
|
||||
ngAfterViewInit() {
|
||||
this.route.params.subscribe((params: Params) => {
|
||||
const itemId = params['id'];
|
||||
|
||||
let projectRequestItem: RequestItem<ProjectCriteria> = new RequestItem();
|
||||
projectRequestItem.criteria = new ProjectCriteria();
|
||||
let organisationRequestItem: RequestItem<BaseCriteria> = new RequestItem();
|
||||
organisationRequestItem.criteria = new BaseCriteria();
|
||||
this.projectAutoCompleteConfiguration = new AutoCompleteConfiguration(this.projectService.getWithExternal.bind(this.projectService), projectRequestItem);
|
||||
this.organisationsAutoCompleteConfiguration = new AutoCompleteChipConfiguration(this.externalSourcesService.searchDMPOrganizations.bind(this.externalSourcesService), organisationRequestItem);
|
||||
let projectRequestItem: RequestItem<ProjectCriteria> = new RequestItem();
|
||||
projectRequestItem.criteria = new ProjectCriteria();
|
||||
let organisationRequestItem: RequestItem<BaseCriteria> = new RequestItem();
|
||||
organisationRequestItem.criteria = new BaseCriteria();
|
||||
this.projectAutoCompleteConfiguration = new AutoCompleteConfiguration(this.projectService.getWithExternal.bind(this.projectService), projectRequestItem);
|
||||
this.organisationsAutoCompleteConfiguration = new AutoCompleteChipConfiguration(this.externalSourcesService.searchDMPOrganizations.bind(this.externalSourcesService), organisationRequestItem);
|
||||
|
||||
if (itemId != null) {
|
||||
this.isNew = false;
|
||||
this.dataManagementPlanService.getSingle(itemId).map(data => data as DataManagementPlanModel)
|
||||
.subscribe(async data => {
|
||||
this.dataManagementPlan = JsonSerializer.fromJSONObject(data, DataManagementPlanModel);
|
||||
this.formGroup = this.dataManagementPlan.buildForm();
|
||||
if (this.formGroup.get("profile") && this.formGroup.get("profile").value) {
|
||||
this.textCtrl.patchValue(this.formGroup.get("profile").value);
|
||||
}
|
||||
this.breadCrumbs = Observable.of([
|
||||
{
|
||||
parentComponentName: "DataManagementPlanListingComponent",
|
||||
label: 'DMPs',
|
||||
url: "dmps",
|
||||
notFoundResolver: [await this.projectService.getSingle(this.dataManagementPlan.project.id).map(x => ({ label: x.label, url: '/projects/edit/' + x.id }) as BreadcrumbItem).toPromise()]
|
||||
}
|
||||
]
|
||||
)
|
||||
this.associatedUsers = data.associatedUsers;
|
||||
});
|
||||
} else {
|
||||
this.dataManagementPlan = new DataManagementPlanModel();
|
||||
setTimeout(async () => {
|
||||
this.formGroup = this.dataManagementPlan.buildForm();
|
||||
if (this.formGroup.get("profile") && this.formGroup.get("profile").value) {
|
||||
this.textCtrl.patchValue(this.formGroup.get("profile").value);
|
||||
}
|
||||
this.breadCrumbs = Observable.of([
|
||||
{
|
||||
parentComponentName: "DataManagementPlanListingComponent",
|
||||
label: 'DMPs',
|
||||
url: "dmps",
|
||||
}
|
||||
])
|
||||
});
|
||||
}
|
||||
if (itemId != null) {
|
||||
this.isNew = false;
|
||||
this.dataManagementPlanService.getSingle(itemId).map(data => data as DataManagementPlanModel)
|
||||
.subscribe(async data => {
|
||||
this.dataManagementPlan = JsonSerializer.fromJSONObject(data, DataManagementPlanModel);
|
||||
this.formGroup = this.dataManagementPlan.buildForm();
|
||||
if (this.formGroup.get("profile") && this.formGroup.get("profile").value) {
|
||||
this.textCtrl.patchValue(this.formGroup.get("profile").value);
|
||||
}
|
||||
this.breadCrumbs = Observable.of([
|
||||
{
|
||||
parentComponentName: "DataManagementPlanListingComponent",
|
||||
label: 'DMPs',
|
||||
url: "dmps",
|
||||
notFoundResolver: [await this.projectService.getSingle(this.dataManagementPlan.project.id).map(x => ({ label: x.label, url: '/projects/edit/' + x.id }) as BreadcrumbItem).toPromise()]
|
||||
}
|
||||
]
|
||||
)
|
||||
this.associatedUsers = data.associatedUsers;
|
||||
});
|
||||
} else {
|
||||
this.dataManagementPlan = new DataManagementPlanModel();
|
||||
setTimeout(async () => {
|
||||
this.formGroup = this.dataManagementPlan.buildForm();
|
||||
if (this.formGroup.get("profile") && this.formGroup.get("profile").value) {
|
||||
this.textCtrl.patchValue(this.formGroup.get("profile").value);
|
||||
}
|
||||
this.breadCrumbs = Observable.of([
|
||||
{
|
||||
parentComponentName: "DataManagementPlanListingComponent",
|
||||
label: 'DMPs',
|
||||
url: "dmps",
|
||||
}
|
||||
])
|
||||
});
|
||||
}
|
||||
|
||||
});
|
||||
this.route
|
||||
.queryParams
|
||||
.subscribe(params => {
|
||||
this.createNewVersion = params["clone"];
|
||||
});
|
||||
}
|
||||
});
|
||||
this.route
|
||||
.queryParams
|
||||
.subscribe(params => {
|
||||
this.createNewVersion = params["clone"];
|
||||
});
|
||||
}
|
||||
|
||||
formSubmit(): void {
|
||||
//this.touchAllFormFields(this.formGroup);
|
||||
if (!this.isFormValid()) { return; }
|
||||
this.onSubmit();
|
||||
}
|
||||
formSubmit(): void {
|
||||
//this.touchAllFormFields(this.formGroup);
|
||||
if (!this.isFormValid()) { return; }
|
||||
this.onSubmit();
|
||||
}
|
||||
|
||||
public isFormValid() {
|
||||
return this.formGroup.valid;
|
||||
}
|
||||
public isFormValid() {
|
||||
return this.formGroup.valid;
|
||||
}
|
||||
|
||||
onSubmit(): void {
|
||||
this.dataManagementPlanService.createDataManagementPlan(this.formGroup.value).subscribe(
|
||||
complete => this.onCallbackSuccess(),
|
||||
error => this.onCallbackError(error)
|
||||
)
|
||||
}
|
||||
onSubmit(): void {
|
||||
this.dataManagementPlanService.createDataManagementPlan(this.formGroup.value).subscribe(
|
||||
complete => this.onCallbackSuccess(),
|
||||
error => this.onCallbackError(error)
|
||||
)
|
||||
}
|
||||
|
||||
onCallbackSuccess(): void {
|
||||
this.snackBar.openFromComponent(SnackBarNotificationComponent, {
|
||||
data: { message: this.isNew ? 'GENERAL.SNACK-BAR.SUCCESSFUL-CREATION' : 'GENERAL.SNACK-BAR.SUCCESSFUL-UPDATE', language: this.language },
|
||||
duration: 3000,
|
||||
})
|
||||
this.router.navigate(['/dmps']);
|
||||
}
|
||||
onCallbackSuccess(): void {
|
||||
this.snackBar.openFromComponent(SnackBarNotificationComponent, {
|
||||
data: { message: this.isNew ? 'GENERAL.SNACK-BAR.SUCCESSFUL-CREATION' : 'GENERAL.SNACK-BAR.SUCCESSFUL-UPDATE', language: this.language },
|
||||
duration: 3000,
|
||||
})
|
||||
this.router.navigate(['/dmps']);
|
||||
}
|
||||
|
||||
onCallbackError(error: any) {
|
||||
this.setErrorModel(error.error);
|
||||
//this.validateAllFormFields(this.formGroup);
|
||||
}
|
||||
onCallbackError(error: any) {
|
||||
this.setErrorModel(error.error);
|
||||
//this.validateAllFormFields(this.formGroup);
|
||||
}
|
||||
|
||||
public setErrorModel(errorModel: BaseErrorModel) {
|
||||
Object.keys(errorModel).forEach(item => {
|
||||
(<any>this.dataManagementPlan.errorModel)[item] = (<any>errorModel)[item];
|
||||
})
|
||||
}
|
||||
public setErrorModel(errorModel: BaseErrorModel) {
|
||||
Object.keys(errorModel).forEach(item => {
|
||||
(<any>this.dataManagementPlan.errorModel)[item] = (<any>errorModel)[item];
|
||||
})
|
||||
}
|
||||
|
||||
public cancel(): void {
|
||||
this.router.navigate(['/dmps']);
|
||||
}
|
||||
public cancel(): void {
|
||||
this.router.navigate(['/dmps']);
|
||||
}
|
||||
|
||||
public invite(): void {
|
||||
this.router.navigate(['/invite/' + this.dataManagementPlan.id]);
|
||||
}
|
||||
public invite(): void {
|
||||
this.router.navigate(['/invite/' + this.dataManagementPlan.id]);
|
||||
}
|
||||
|
||||
filterOrganisations(value: string): void {
|
||||
filterOrganisations(value: string): void {
|
||||
|
||||
this.filteredOrganisations = undefined;
|
||||
if (value) {
|
||||
this.filteringOrganisationsAsync = true;
|
||||
this.filteredOrganisations = undefined;
|
||||
if (value) {
|
||||
this.filteringOrganisationsAsync = true;
|
||||
|
||||
this.externalSourcesService.searchDMPOrganizations(value).subscribe(items => {
|
||||
this.filteredOrganisations = items;
|
||||
this.filteringOrganisationsAsync = false;
|
||||
this.externalSourcesService.searchDMPOrganizations(value).subscribe(items => {
|
||||
this.filteredOrganisations = items;
|
||||
this.filteringOrganisationsAsync = false;
|
||||
|
||||
// this.filteredOrganisations = items.filter((filteredObj: any) => {
|
||||
// return this.objectsModel ? this.objectsModel.indexOf(filteredObj) < 0 : true;
|
||||
// });
|
||||
// this.filteredOrganisations = items.filter((filteredObj: any) => {
|
||||
// return this.objectsModel ? this.objectsModel.indexOf(filteredObj) < 0 : true;
|
||||
// });
|
||||
|
||||
});
|
||||
});
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
filterResearchers(value: string): void {
|
||||
filterResearchers(value: string): void {
|
||||
|
||||
this.filteredResearchers = undefined;
|
||||
if (value) {
|
||||
this.filteringResearchersAsync = true;
|
||||
this.filteredResearchers = undefined;
|
||||
if (value) {
|
||||
this.filteringResearchersAsync = true;
|
||||
|
||||
this.externalSourcesService.searchDMPResearchers({ criteria: { name: value, like: null } }).subscribe(items => {
|
||||
this.filteredResearchers = items;
|
||||
this.filteringResearchersAsync = false;
|
||||
this.externalSourcesService.searchDMPResearchers({ criteria: { name: value, like: null } }).subscribe(items => {
|
||||
this.filteredResearchers = items;
|
||||
this.filteringResearchersAsync = false;
|
||||
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
filterProfiles(value: string): void {
|
||||
filterProfiles(value: string): void {
|
||||
|
||||
this.filteredProfiles = undefined;
|
||||
if (value) {
|
||||
this.filteredProfilesAsync = true;
|
||||
this.filteredProfiles = undefined;
|
||||
if (value) {
|
||||
this.filteredProfilesAsync = true;
|
||||
|
||||
const request = new RequestItem<DatasetProfileCriteria>();
|
||||
let criteria = new DatasetProfileCriteria();
|
||||
criteria.like = value;
|
||||
request.criteria = criteria;
|
||||
this._service.searchDMPProfiles(request).subscribe(items => {
|
||||
this.filteredProfiles = items;
|
||||
this.filteredProfilesAsync = false;
|
||||
});
|
||||
}
|
||||
}
|
||||
const request = new RequestItem<DatasetProfileCriteria>();
|
||||
let criteria = new DatasetProfileCriteria();
|
||||
criteria.like = value;
|
||||
request.criteria = criteria;
|
||||
this._service.searchDMPProfiles(request).subscribe(items => {
|
||||
this.filteredProfiles = items;
|
||||
this.filteredProfilesAsync = false;
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
addResearcher(rowId: any, rowName: any) {
|
||||
let dialogRef = this.dialog.open(AddResearchersComponent, {
|
||||
height: '255px',
|
||||
width: '700px',
|
||||
data: {
|
||||
dmpId: rowId,
|
||||
dmpName: rowName
|
||||
}
|
||||
});
|
||||
addResearcher(rowId: any, rowName: any) {
|
||||
let dialogRef = this.dialog.open(AddResearchersComponent, {
|
||||
height: '255px',
|
||||
width: '700px',
|
||||
data: {
|
||||
dmpId: rowId,
|
||||
dmpName: rowName
|
||||
}
|
||||
});
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
availableProfiles() {
|
||||
let dialogRef = this.dialog.open(AvailableProfilesComponent, {
|
||||
height: '355px',
|
||||
width: '700px',
|
||||
data: {
|
||||
availableProfiles() {
|
||||
let dialogRef = this.dialog.open(AvailableProfilesComponent, {
|
||||
height: '355px',
|
||||
width: '700px',
|
||||
data: {
|
||||
|
||||
}
|
||||
});
|
||||
dialogRef.afterClosed().subscribe(result => {
|
||||
this.formGroup.get("profiles").setValue(result);
|
||||
});
|
||||
}
|
||||
});
|
||||
dialogRef.afterClosed().subscribe(result => {
|
||||
this.formGroup.get("profiles").setValue(result);
|
||||
});
|
||||
|
||||
return false;
|
||||
}
|
||||
return false;
|
||||
}
|
||||
|
||||
openConfirm(dmpLabel, id): void {
|
||||
this._dialogService.openConfirm({
|
||||
message: 'Are you sure you want to delete the "' + dmpLabel + '"',
|
||||
disableClose: true || false, // defaults to false
|
||||
viewContainerRef: this._viewContainerRef, //OPTIONAL
|
||||
title: 'Confirm', //OPTIONAL, hides if not provided
|
||||
cancelButton: 'No', //OPTIONAL, defaults to 'CANCEL'
|
||||
acceptButton: 'Yes' //OPTIONAL, defaults to 'ACCEPT'
|
||||
// width: '500px', //OPTIONAL, defaults to 400px
|
||||
}).afterClosed().subscribe((accept: boolean) => {
|
||||
if (accept) {
|
||||
this.dataManagementPlanService.delete(id).subscribe(() => {
|
||||
this.router.navigate(['/dmps'])
|
||||
});
|
||||
} else {
|
||||
// DO SOMETHING ELSE
|
||||
}
|
||||
});
|
||||
}
|
||||
openConfirm(dmpLabel, id): void {
|
||||
this._dialogService.openConfirm({
|
||||
message: 'Are you sure you want to delete the "' + dmpLabel + '"',
|
||||
disableClose: true || false, // defaults to false
|
||||
viewContainerRef: this._viewContainerRef, //OPTIONAL
|
||||
title: 'Confirm', //OPTIONAL, hides if not provided
|
||||
cancelButton: 'No', //OPTIONAL, defaults to 'CANCEL'
|
||||
acceptButton: 'Yes' //OPTIONAL, defaults to 'ACCEPT'
|
||||
// width: '500px', //OPTIONAL, defaults to 400px
|
||||
}).afterClosed().subscribe((accept: boolean) => {
|
||||
if (accept) {
|
||||
this.dataManagementPlanService.delete(id).subscribe(() => {
|
||||
this.router.navigate(['/dmps'])
|
||||
});
|
||||
} else {
|
||||
// DO SOMETHING ELSE
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
selectOption(option: any) {
|
||||
this.dataManagementPlan.definition = null;
|
||||
this.formGroup.get("profile").patchValue(option, { emitEvent: false })
|
||||
this.dmpProfileService.getSingle(option.id).subscribe(result => {
|
||||
this.dataManagementPlan.definition = result.definition;
|
||||
})
|
||||
}
|
||||
selectOption(option: any) {
|
||||
this.dataManagementPlan.definition = null;
|
||||
this.formGroup.get("profile").patchValue(option, { emitEvent: false })
|
||||
this.dmpProfileService.getSingle(option.id).subscribe(result => {
|
||||
this.dataManagementPlan.definition = result.definition;
|
||||
})
|
||||
}
|
||||
|
||||
displayWith(item: any) {
|
||||
if (!item) return null;
|
||||
return item["label"];
|
||||
}
|
||||
displayWith(item: any) {
|
||||
if (!item) return null;
|
||||
return item["label"];
|
||||
}
|
||||
|
||||
redirectToProject() {
|
||||
this.router.navigate(["projects/edit/" + this.dataManagementPlan.project.id])
|
||||
}
|
||||
redirectToProject() {
|
||||
this.router.navigate(["projects/edit/" + this.dataManagementPlan.project.id])
|
||||
}
|
||||
|
||||
redirectToDatasets() {
|
||||
this.router.navigate(["datasets/dmp/" + this.dataManagementPlan.id])
|
||||
}
|
||||
redirectToDatasets() {
|
||||
this.router.navigate(["datasets/dmp/" + this.dataManagementPlan.id])
|
||||
}
|
||||
|
||||
newVersion(id: String, label: String) {
|
||||
this.router.navigate(['/dmps/new_version/' + id, { dmpLabel: label }]);
|
||||
}
|
||||
newVersion(id: String, label: String) {
|
||||
this.router.navigate(['/dmps/new_version/' + id, { dmpLabel: label }]);
|
||||
}
|
||||
|
||||
clone(id: String) {
|
||||
this.router.navigate(['/dmps/clone/' + id]);
|
||||
}
|
||||
clone(id: String) {
|
||||
this.router.navigate(['/dmps/clone/' + id]);
|
||||
}
|
||||
|
||||
}
|
||||
|
|
|
|||
|
|
@ -77,10 +77,18 @@
|
|||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
<div class="col-md-12 text-right" align="end">
|
||||
<button mat-raised-button color="primary" (click)="cancel()" type="button">{{'PROJECT-EDITOR.ACTIONS.CANCEL' | translate}}</button>
|
||||
<button *ngIf="isNew || editMode" mat-raised-button color="primary" type="submit">{{'PROJECT-EDITOR.ACTIONS.SAVE' | translate}}</button>
|
||||
<button *ngIf="!isNew && editMode" mat-raised-button color="primary" type="button" (click)="delete()">{{'PROJECT-EDITOR.ACTIONS.DELETE' | translate}}</button>
|
||||
<div class="col-md-12">
|
||||
<div class="row">
|
||||
<div class="col-auto">
|
||||
<button mat-raised-button color="primary" (click)="cancel()" type="button">{{'PROJECT-EDITOR.ACTIONS.CANCEL' | translate}}</button>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<button *ngIf="isNew || editMode" mat-raised-button color="primary" type="submit">{{'PROJECT-EDITOR.ACTIONS.SAVE' | translate}}</button>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<button *ngIf="!isNew && editMode" mat-raised-button color="primary" type="button" (click)="delete()">{{'PROJECT-EDITOR.ACTIONS.DELETE' | translate}}</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</mat-card-content>
|
||||
|
|
|
|||
|
|
@ -1,65 +1,68 @@
|
|||
<div>
|
||||
<h3>{{languageResolverService.getBy('listingTitle') | translate}}</h3>
|
||||
|
||||
<app-projects-criteria-component></app-projects-criteria-component>
|
||||
<mat-card class="mat-card">
|
||||
<mat-card-header>
|
||||
<mat-progress-bar *ngIf="dataSource?.isLoadingResults" mode="query"></mat-progress-bar>
|
||||
<!-- <mat-progress-bar *ngIf="dataSource?.isLoadingResults" mode="query"></mat-progress-bar> -->
|
||||
</mat-card-header>
|
||||
<mat-card-content>
|
||||
<div class="row">
|
||||
<app-projects-criteria-component class="col-md-12"></app-projects-criteria-component>
|
||||
<mat-table class="col-md-12" [dataSource]="dataSource" matSort (matSortChange)="refresh()">
|
||||
|
||||
<mat-table [dataSource]="dataSource" matSort (matSortChange)="refresh()">
|
||||
<ng-container cdkColumnDef="avatar">
|
||||
<mat-header-cell *matHeaderCellDef mat-sort-header="avatar">{{'PROJECT-LISTING.COLUMNS.AVATAR' | translate}}</mat-header-cell>
|
||||
<mat-cell *matCellDef="let row">
|
||||
<img mat-card-avatar [src]="host+'files/'+row.files[0].id+'?location='+row.files[0].location+'&type='+row.files[0].type">
|
||||
</mat-cell>
|
||||
</ng-container>
|
||||
<!-- Column Definition: Name -->
|
||||
<ng-container cdkColumnDef="name">
|
||||
<mat-header-cell *matHeaderCellDef mat-sort-header="label">{{'PROJECT-LISTING.COLUMNS.NAME' | translate}}</mat-header-cell>
|
||||
<mat-cell *matCellDef="let row">{{row.label}}</mat-cell>
|
||||
</ng-container>
|
||||
|
||||
<ng-container cdkColumnDef="avatar">
|
||||
<mat-header-cell *matHeaderCellDef mat-sort-header="avatar">{{'PROJECT-LISTING.COLUMNS.AVATAR' | translate}}</mat-header-cell>
|
||||
<mat-cell *matCellDef="let row">
|
||||
<img mat-card-avatar [src]="host+'files/'+row.files[0].id+'?location='+row.files[0].location+'&type='+row.files[0].type">
|
||||
</mat-cell>
|
||||
</ng-container>
|
||||
<!-- Column Definition: Name -->
|
||||
<ng-container cdkColumnDef="name">
|
||||
<mat-header-cell *matHeaderCellDef mat-sort-header="label">{{'PROJECT-LISTING.COLUMNS.NAME' | translate}}</mat-header-cell>
|
||||
<mat-cell *matCellDef="let row">{{row.label}}</mat-cell>
|
||||
</ng-container>
|
||||
<!-- Column Definition: Αbbreviation -->
|
||||
<ng-container cdkColumnDef="abbreviation">
|
||||
<mat-header-cell *matHeaderCellDef mat-sort-header="abbreviation">{{'PROJECT-LISTING.COLUMNS.ABBREVIATION' | translate}}</mat-header-cell>
|
||||
<mat-cell *matCellDef="let row"> {{row.abbreviation}} </mat-cell>
|
||||
</ng-container>
|
||||
|
||||
<!-- Column Definition: Αbbreviation -->
|
||||
<ng-container cdkColumnDef="abbreviation">
|
||||
<mat-header-cell *matHeaderCellDef mat-sort-header="abbreviation">{{'PROJECT-LISTING.COLUMNS.ABBREVIATION' | translate}}</mat-header-cell>
|
||||
<mat-cell *matCellDef="let row"> {{row.abbreviation}} </mat-cell>
|
||||
</ng-container>
|
||||
<!-- Column Definition: Start -->
|
||||
<ng-container cdkColumnDef="start">
|
||||
<mat-header-cell *matHeaderCellDef mat-sort-header="startdate">{{'PROJECT-LISTING.COLUMNS.START' | translate}}</mat-header-cell>
|
||||
<mat-cell *matCellDef="let row"> {{row.startDate | date:'shortDate'}} </mat-cell>
|
||||
</ng-container>
|
||||
|
||||
<!-- Column Definition: Start -->
|
||||
<ng-container cdkColumnDef="start">
|
||||
<mat-header-cell *matHeaderCellDef mat-sort-header="startdate">{{'PROJECT-LISTING.COLUMNS.START' | translate}}</mat-header-cell>
|
||||
<mat-cell *matCellDef="let row"> {{row.startDate | date:'shortDate'}} </mat-cell>
|
||||
</ng-container>
|
||||
<!-- Column Definition: End -->
|
||||
<ng-container cdkColumnDef="end">
|
||||
<mat-header-cell *matHeaderCellDef mat-sort-header="enddate">{{'PROJECT-LISTING.COLUMNS.END' | translate}}</mat-header-cell>
|
||||
<mat-cell *matCellDef="let row"> {{row.endDate | date:'shortDate'}} </mat-cell>
|
||||
</ng-container>
|
||||
|
||||
<!-- Column Definition: End -->
|
||||
<ng-container cdkColumnDef="end">
|
||||
<mat-header-cell *matHeaderCellDef mat-sort-header="enddate">{{'PROJECT-LISTING.COLUMNS.END' | translate}}</mat-header-cell>
|
||||
<mat-cell *matCellDef="let row"> {{row.endDate | date:'shortDate'}} </mat-cell>
|
||||
</ng-container>
|
||||
|
||||
<!-- Column Definition: End -->
|
||||
<ng-container cdkColumnDef="dmps">
|
||||
<mat-header-cell *matHeaderCellDef>{{'PROJECT-LISTING.COLUMNS.DMPS' | translate}}</mat-header-cell>
|
||||
<mat-cell *matCellDef="let row" (click)="$event.stopPropagation()">
|
||||
<app-url-listing [items]="row.dmps" [urlLimit]="5" [parameters]="{ projectLabel: row.label }"></app-url-listing>
|
||||
</mat-cell>
|
||||
</ng-container>
|
||||
<!-- Column Definition: End -->
|
||||
<ng-container cdkColumnDef="dmps">
|
||||
<mat-header-cell *matHeaderCellDef>{{'PROJECT-LISTING.COLUMNS.DMPS' | translate}}</mat-header-cell>
|
||||
<mat-cell *matCellDef="let row" (click)="$event.stopPropagation()">
|
||||
<app-url-listing [items]="row.dmps" [urlLimit]="5" [parameters]="{ projectLabel: row.label }"></app-url-listing>
|
||||
</mat-cell>
|
||||
</ng-container>
|
||||
|
||||
|
||||
<!-- Column Definition: Submission Time -->
|
||||
<!-- <ng-container cdkColumnDef="actions">
|
||||
<!-- Column Definition: Submission Time -->
|
||||
<!-- <ng-container cdkColumnDef="actions">
|
||||
<mat-header-cell *matHeaderCellDef>{{'PROJECT-LISTING.COLUMNS.ACTIONS' | translate}}</mat-header-cell>
|
||||
<mat-cell *matCellDef="let row"></mat-cell>
|
||||
</ng-container> -->
|
||||
|
||||
<mat-header-row *matHeaderRowDef="displayedColumns"></mat-header-row>
|
||||
<mat-row *matRowDef="let row; columns: displayedColumns" (click)="rowClick(row.id)"></mat-row>
|
||||
<mat-header-row *matHeaderRowDef="displayedColumns"></mat-header-row>
|
||||
<mat-row *matRowDef="let row; columns: displayedColumns" (click)="rowClick(row.id)"></mat-row>
|
||||
|
||||
</mat-table>
|
||||
<mat-paginator #paginator [length]="dataSource?.totalCount" [pageSizeOptions]="[10, 25, 100]">
|
||||
</mat-paginator>
|
||||
</mat-table>
|
||||
<mat-paginator #paginator [length]="dataSource?.totalCount" [pageSizeOptions]="[10, 25, 100]">
|
||||
</mat-paginator>
|
||||
</div>
|
||||
</mat-card-content>
|
||||
</mat-card>
|
||||
|
||||
<button mat-fab class="mat-fab-bottom-right" color="primary" [routerLink]=" ['./new'] ">
|
||||
|
|
|
|||
|
|
@ -1,34 +1,31 @@
|
|||
.mat-table {
|
||||
margin: 24px;
|
||||
}
|
||||
h3 {
|
||||
margin-top: 0px;
|
||||
}
|
||||
|
||||
h3{
|
||||
margin-top: 0px;
|
||||
}
|
||||
.mat-fab-bottom-right {
|
||||
top: auto !important;
|
||||
right: 20px !important;
|
||||
bottom: 10px !important;
|
||||
left: auto !important;
|
||||
position: fixed !important;
|
||||
}
|
||||
.mat-fab-bottom-right {
|
||||
top: auto !important;
|
||||
right: 20px !important;
|
||||
bottom: 10px !important;
|
||||
left: auto !important;
|
||||
position: fixed !important;
|
||||
}
|
||||
|
||||
.full-width {
|
||||
width: 100%;
|
||||
}
|
||||
.full-width {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.mat-card {
|
||||
margin: 16px 0;
|
||||
}
|
||||
.mat-card {
|
||||
margin: 16px 0;
|
||||
}
|
||||
|
||||
.mat-row {
|
||||
cursor: pointer;
|
||||
}
|
||||
.mat-row {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
mat-row:hover {
|
||||
background-color: lightgray;
|
||||
}
|
||||
mat-row:hover {
|
||||
background-color: lightgray;
|
||||
}
|
||||
|
||||
mat-row:nth-child(odd){
|
||||
background-color:#eef0fb;
|
||||
}
|
||||
mat-row:nth-child(odd) {
|
||||
background-color: #eef0fb;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -24,7 +24,7 @@
|
|||
</mat-autocomplete>
|
||||
</div> -->
|
||||
|
||||
<mat-form-field>
|
||||
<mat-form-field class="autocomplete-input">
|
||||
<input matInput [matAutocomplete]="auto" [formControl]="control" placeholder="{{placeholder}}" [required]="required">
|
||||
<mat-error *ngIf="control['errors'] && control['errors']['required']">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
<mat-progress-spinner matSuffix mode="indeterminate" *ngIf="loading" [diameter]="22"></mat-progress-spinner>
|
||||
|
|
|
|||
|
|
@ -1,37 +1,23 @@
|
|||
<div class="project-criteria">
|
||||
<mat-card class="mat-card">
|
||||
<mat-card-header>
|
||||
<mat-card-title>
|
||||
<h4>{{'CRITERIA.FILTERS'| translate}}</h4>
|
||||
</mat-card-title>
|
||||
</mat-card-header>
|
||||
<div class="row">
|
||||
<div class="col-md-4">
|
||||
<mat-form-field>
|
||||
<input matInput placeholder=" {{'CRITERIA.PROJECTS.LIKE'| translate}}" name="projectCriteriaLike" [(ngModel)]="criteria.like"
|
||||
(ngModelChange)="controlModified()">
|
||||
<mat-error *ngIf="baseErrorModel?.like">{{baseErrorModel['criteria.like']}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<mat-form-field>
|
||||
<input matInput (focus)="periodStartPicker.open()" (click)="periodStartPicker.open()" placeholder=" {{this.languageResolver.getBy('criteriaStart')| translate}}"
|
||||
[matDatepicker]="periodStartPicker" name="projectCriteriaPeriodStart" [(ngModel)]="criteria.periodStart" (ngModelChange)="controlModified()">
|
||||
<mat-datepicker-toggle matSuffix [for]="periodStartPicker"></mat-datepicker-toggle>
|
||||
<mat-datepicker #periodStartPicker></mat-datepicker>
|
||||
</mat-form-field>
|
||||
<mat-error *ngIf="baseErrorModel['criteria.periodStart']">{{baseErrorModel['criteria.periodStart']}}</mat-error>
|
||||
<div class="row">
|
||||
<!-- <h4 class="col-md-12">{{'CRITERIA.FILTERS'| translate}}</h4> -->
|
||||
<mat-form-field class="col-md-4">
|
||||
<input matInput placeholder=" {{'CRITERIA.PROJECTS.LIKE'| translate}}" name="projectCriteriaLike" [(ngModel)]="criteria.like"
|
||||
(ngModelChange)="controlModified()">
|
||||
<mat-error *ngIf="baseErrorModel?.like">{{baseErrorModel['criteria.like']}}</mat-error>
|
||||
</mat-form-field>
|
||||
<mat-form-field class="col-md-4">
|
||||
<input matInput (focus)="periodStartPicker.open()" (click)="periodStartPicker.open()" placeholder=" {{this.languageResolver.getBy('criteriaStart')| translate}}"
|
||||
[matDatepicker]="periodStartPicker" name="projectCriteriaPeriodStart" [(ngModel)]="criteria.periodStart" (ngModelChange)="controlModified()">
|
||||
<mat-datepicker-toggle matSuffix [for]="periodStartPicker"></mat-datepicker-toggle>
|
||||
<mat-datepicker #periodStartPicker></mat-datepicker>
|
||||
</mat-form-field>
|
||||
<mat-error *ngIf="baseErrorModel['criteria.periodStart']">{{baseErrorModel['criteria.periodStart']}}</mat-error>
|
||||
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<mat-form-field>
|
||||
<input matInput (focus)="periodEndPicker.open()" (click)="periodEndPicker.open()" name="projectCriteriaPeriodEnd" placeholder=" {{this.languageResolver.getBy('criteriaEnd')| translate}}"
|
||||
[matDatepicker]="periodEndPicker" [(ngModel)]="criteria.periodEnd" (ngModelChange)="controlModified()">
|
||||
<mat-error *ngIf="baseErrorModel['criteria.periodEnd']">{{baseErrorModel['criteria.periodEnd']}}</mat-error>
|
||||
<mat-datepicker-toggle matSuffix [for]="periodEndPicker"></mat-datepicker-toggle>
|
||||
<mat-datepicker #periodEndPicker></mat-datepicker>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
</mat-card>
|
||||
<mat-form-field class="col-md-4">
|
||||
<input matInput (focus)="periodEndPicker.open()" (click)="periodEndPicker.open()" name="projectCriteriaPeriodEnd" placeholder=" {{this.languageResolver.getBy('criteriaEnd')| translate}}"
|
||||
[matDatepicker]="periodEndPicker" [(ngModel)]="criteria.periodEnd" (ngModelChange)="controlModified()">
|
||||
<mat-error *ngIf="baseErrorModel['criteria.periodEnd']">{{baseErrorModel['criteria.periodEnd']}}</mat-error>
|
||||
<mat-datepicker-toggle matSuffix [for]="periodEndPicker"></mat-datepicker-toggle>
|
||||
<mat-datepicker #periodEndPicker></mat-datepicker>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,10 +0,0 @@
|
|||
.project-criteria {
|
||||
mat-form-field {
|
||||
padding-bottom: 5px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
mat-card {
|
||||
padding-bottom: 0px;
|
||||
}
|
||||
}
|
||||
Loading…
Reference in New Issue