no message
This commit is contained in:
parent
29245df4f7
commit
8132fbc161
|
|
@ -4,13 +4,16 @@ import { PageNotFoundComponent } from './not-found.component';
|
|||
import { HomepageComponent } from './homepage/homepage.component';
|
||||
import { DynamicFormComponent } from './form/dynamic-form.component';
|
||||
import { AuthGuard } from './guards/auth.guard';
|
||||
import { ProjectsComponent } from './projects/projects.component';
|
||||
import { DatasetsComponent } from './datasets/dataset.component';
|
||||
import { DmpComponent } from './dmps/dmp.component';
|
||||
import { AppComponent } from './app.component';
|
||||
import { MainSignInComponent } from './login/main-sign-in/main-sign-in.component';
|
||||
import { DmpDetailedComponent } from './viewers/dmp-detailed/dmp-detailed.component';
|
||||
import { ProjectDetailedComponent } from './viewers/project-detailed/project-detailed.component';
|
||||
import { ProjectListingModel } from './models/projects/ProjectListingModel';
|
||||
import { ProjectListingComponent } from './projects/project-listing.component';
|
||||
import { DataManagementPlanListingComponent } from './dmps/dmp-listing.component';
|
||||
import { ProjectEditorComponent } from './projects/editor/project-editor.component';
|
||||
import { DataManagementPlanEditorComponent } from './dmps/editor/dmp-editor.component';
|
||||
|
||||
|
||||
const appRoutes: Routes = [
|
||||
|
|
@ -18,26 +21,31 @@ const appRoutes: Routes = [
|
|||
{ path: 'dynamic-form/:id', component: DynamicFormComponent, canActivate: [AuthGuard] },
|
||||
{ path: 'dataset', component: DatasetsComponent },
|
||||
{ path: 'login', component: MainSignInComponent},
|
||||
{ path: 'projects', component: ProjectsComponent},
|
||||
{ path: 'dmps',
|
||||
component: DmpComponent,
|
||||
children: [
|
||||
{
|
||||
path: "dmp",
|
||||
component: DmpDetailedComponent,
|
||||
data: {
|
||||
//breadcrumb: "Sign In"
|
||||
}
|
||||
},
|
||||
{
|
||||
path: "project",
|
||||
component: ProjectDetailedComponent,
|
||||
data: {
|
||||
//breadcrumb: "Sign Up"
|
||||
}
|
||||
}
|
||||
]
|
||||
},
|
||||
{ path: 'projects', component: ProjectListingComponent},
|
||||
{ path: 'project/:id', component: ProjectEditorComponent},
|
||||
{ path: 'projects/new', component: ProjectEditorComponent},
|
||||
{ path: 'dmps', component: DataManagementPlanListingComponent},
|
||||
{ path: 'dmp/:id', component: DataManagementPlanEditorComponent},
|
||||
{ path: 'dmps/new', component: DataManagementPlanEditorComponent},
|
||||
// { path: 'dmps',
|
||||
// component: DataManagementPlanListingComponent,
|
||||
// children: [
|
||||
// {
|
||||
// path: "dmp",
|
||||
// component: DmpDetailedComponent,
|
||||
// data: {
|
||||
// //breadcrumb: "Sign In"
|
||||
// }
|
||||
// },
|
||||
// {
|
||||
// path: "project",
|
||||
// component: ProjectDetailedComponent,
|
||||
// data: {
|
||||
// //breadcrumb: "Sign Up"
|
||||
// }
|
||||
// }
|
||||
// ]
|
||||
// },
|
||||
{ path: 'welcome', component: HomepageComponent},
|
||||
{ path: '', redirectTo: '/login', pathMatch: 'full' },
|
||||
{ path: '**', component: PageNotFoundComponent }
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
export const HostConfiguration = {
|
||||
Server: 'http://localhost:4200/',
|
||||
Server: 'http://192.168.32.103:8080/',
|
||||
//CASHost: 'https://login-devel.uoa.gr/login',
|
||||
//Service: 'http://elkefinman/login'
|
||||
}
|
||||
|
|
@ -71,15 +71,12 @@ import { DatasetTableFilterPipe } from './pipes/dataset-table-filter.pipe';
|
|||
import { DatasetStatusFilterPipe } from './pipes/dataset-status-filter.pipe';
|
||||
import { DatasetsComponent } from './datasets/dataset.component';
|
||||
|
||||
|
||||
import { DmpComponent } from './dmps/dmp.component';
|
||||
import { DmpTableFilterPipe } from './pipes/dmp-table-filter.pipe';
|
||||
import { DmpStatusFilterPipe } from './pipes/dmp-status-filter.pipe';
|
||||
import { DmpVersionFilterPipe } from './pipes/dmp-version-filter.pipe';
|
||||
|
||||
|
||||
import { ProjectTableFilterPipe } from './pipes/project-table-filter.pipe';
|
||||
import { ProjectsComponent } from './projects/projects.component';
|
||||
import { ModalComponent } from './modal/modal.component';
|
||||
import { NgDatepickerModule } from 'ng2-datepicker';
|
||||
|
||||
|
|
@ -106,6 +103,11 @@ import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
|
|||
import { SharedModule } from './shared/shared.module';
|
||||
import { MaterialModule } from './shared/material/material.module';
|
||||
import { AuthService } from './services/auth/auth.service';
|
||||
import { ProjectListingComponent } from './projects/project-listing.component';
|
||||
import { BaseHttpService } from './utilities/cite-http-service-module/base-http.service';
|
||||
import { DataManagementPlanListingComponent } from './dmps/dmp-listing.component';
|
||||
import { ProjectEditorComponent } from './projects/editor/project-editor.component';
|
||||
import { DataManagementPlanEditorComponent } from './dmps/editor/dmp-editor.component';
|
||||
|
||||
@NgModule({
|
||||
declarations: [
|
||||
|
|
@ -125,8 +127,8 @@ import { AuthService } from './services/auth/auth.service';
|
|||
PageNotFoundComponent,
|
||||
HomepageComponent,
|
||||
ModalComponent,
|
||||
ProjectsComponent,
|
||||
DmpComponent,
|
||||
ProjectListingComponent,
|
||||
DataManagementPlanListingComponent,
|
||||
DatasetsComponent,
|
||||
ConfirmationComponent,
|
||||
AutocompleteRemoteComponent,
|
||||
|
|
@ -143,6 +145,8 @@ import { AuthService } from './services/auth/auth.service';
|
|||
ProgressBarComponent,
|
||||
DynamicFieldCheckBoxComponent,
|
||||
BreadcrumbComponent, DmpDetailedComponent, ProjectDetailedComponent,
|
||||
ProjectEditorComponent,
|
||||
DataManagementPlanEditorComponent
|
||||
|
||||
],
|
||||
imports: [
|
||||
|
|
@ -187,7 +191,8 @@ import { AuthService } from './services/auth/auth.service';
|
|||
},
|
||||
ServerService, VisibilityRulesService, PaginationService, GlobalVariables, AuthGuard, TokenService,
|
||||
LocalStorageService, RestBase, EestoreService, NativeLoginService, PDFService,
|
||||
AuthService
|
||||
AuthService,
|
||||
BaseHttpService
|
||||
],
|
||||
bootstrap: [AppComponent]
|
||||
})
|
||||
|
|
|
|||
|
|
@ -0,0 +1,20 @@
|
|||
.mat-card {
|
||||
overflow: auto;
|
||||
padding: 0px;
|
||||
}
|
||||
|
||||
.mat-table {
|
||||
margin: 24px;
|
||||
}
|
||||
|
||||
.mat-progress-bar {
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.mat-fab-bottom-right {
|
||||
top: auto !important;
|
||||
right: 20px !important;
|
||||
bottom: 10px !important;
|
||||
left: auto !important;
|
||||
position: fixed !important;
|
||||
}
|
||||
|
|
@ -0,0 +1,190 @@
|
|||
<div class="container-fluid">
|
||||
<h3>{{'DMP-LISTING.TITLE' | translate}}</h3>
|
||||
|
||||
<app-dmp-criteria-component></app-dmp-criteria-component>
|
||||
<mat-card class="mat-card">
|
||||
<mat-progress-bar *ngIf="dataSource?.isLoadingResults" mode="query"></mat-progress-bar>
|
||||
|
||||
<mat-table [dataSource]="dataSource" matSort>
|
||||
|
||||
<!-- Column Definition: Name -->
|
||||
<ng-container cdkColumnDef="name">
|
||||
<mat-header-cell *matHeaderCellDef>{{'DMP-LISTING.COLUMNS.NAME' | translate}}</mat-header-cell>
|
||||
<mat-cell *matCellDef="let row">{{row.name}}</mat-cell>
|
||||
</ng-container>
|
||||
|
||||
<!-- Column Definition: Αbbreviation -->
|
||||
<ng-container cdkColumnDef="abbreviation">
|
||||
<mat-header-cell *matHeaderCellDef>{{'DMP-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>{{'DMP-LISTING.COLUMNS.START' | translate}}</mat-header-cell>
|
||||
<mat-cell *matCellDef="let row"> {{row.start}} </mat-cell>
|
||||
</ng-container>
|
||||
|
||||
<!-- Column Definition: End -->
|
||||
<ng-container cdkColumnDef="end">
|
||||
<mat-header-cell *matHeaderCellDef>{{'DMP-LISTING.COLUMNS.END' | translate}}</mat-header-cell>
|
||||
<mat-cell *matCellDef="let row"> {{row.end}} </mat-cell>
|
||||
</ng-container>
|
||||
|
||||
<!-- Column Definition: Submission Time -->
|
||||
<ng-container cdkColumnDef="actions">
|
||||
<mat-header-cell *matHeaderCellDef>{{'DMP-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-table>
|
||||
<mat-paginator #paginator
|
||||
[length]="dataSource?.totalCount"
|
||||
[pageSizeOptions]="[10, 25, 100]">
|
||||
</mat-paginator>
|
||||
</mat-card>
|
||||
|
||||
<button mat-fab class="mat-fab-bottom-right" color="primary" [routerLink]=" ['./new'] ">
|
||||
<mat-icon class="mat-24">add</mat-icon>
|
||||
</button>
|
||||
</div>
|
||||
<!-- <meta name="google-signin-client_id" content="524432312250-vhgidft856v8qftsc81kls4c74v87d8o.apps.googleusercontent.com">
|
||||
|
||||
<table class="table table-striped" [mfData]="tableData | projectTableFilter : filterQuery : whoami?.id : onlyMyProjects"
|
||||
#mf="mfDataTable" [mfRowsOnPage]="rowsOnPage" [(mfSortBy)]="sortBy" [(mfSortOrder)]="sortOrder">
|
||||
<thead>
|
||||
<tr>
|
||||
<th colspan="1">
|
||||
<input class="form-control" [(ngModel)]="filterQuery" placeholder='Filter' />
|
||||
</th>
|
||||
<th style="width:50px;">
|
||||
<button class="btn btn-default" (click)="getProjects('false')">
|
||||
<span class="glyphicon glyphicon-refresh"></span>
|
||||
</button>
|
||||
</th>
|
||||
<th colspan="1">
|
||||
<div class="checkbox">
|
||||
<label><input type="checkbox" [(ngModel)]="onlyMyProjects" >Show only my projects</label>
|
||||
</div>
|
||||
</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<th [ngClass]="{true:'visible', false:'invisible'}[showIDs]">
|
||||
<mfDefaultSorter by="id">ID</mfDefaultSorter>
|
||||
</th>
|
||||
<th>
|
||||
<mfDefaultSorter by="label">Label</mfDefaultSorter>
|
||||
</th>
|
||||
<th>
|
||||
<mfDefaultSorter by="abbreviation">Αbbreviation</mfDefaultSorter>
|
||||
</th>
|
||||
<th>
|
||||
<mfDefaultSorter by="startdate">Start Date</mfDefaultSorter>
|
||||
</th>
|
||||
<th>
|
||||
<mfDefaultSorter by="enddate">End Date</mfDefaultSorter>
|
||||
</th>
|
||||
<th>
|
||||
<mfDefaultSorter by="status">Status</mfDefaultSorter>
|
||||
</th>
|
||||
<th>
|
||||
<mfDefaultSorter by="description">Description</mfDefaultSorter>
|
||||
</th>
|
||||
<th>
|
||||
<mfDefaultSorter>Actions </mfDefaultSorter>
|
||||
</th>
|
||||
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr class="grayout-empty-table" *ngIf="!mf.data[0]">
|
||||
<td colspan="7">No elements</td>
|
||||
</tr>
|
||||
|
||||
<tr *ngFor="let project of mf.data" class="hover">
|
||||
<td [ngClass]="{true:'visible', false:'invisible'}[showIDs]">{{project?.id}}</td>
|
||||
<td>{{(project?.label?.length > 40) ? (project?.label | slice:0:40)+'...':(project?.label) }}</td>
|
||||
<td>{{project?.abbreviation}}</td>
|
||||
<td>{{project?.startdate | date:'medium' }}</td>
|
||||
<td>{{project?.enddate | date:'medium'}}</td>
|
||||
<td>{{project?.status | statusToString}}</td>
|
||||
<td>{{(project?.description?.length > 40) ? (project?.description | slice:0:40)+'...':(project?.description) }}</td>
|
||||
<td>
|
||||
<a [ngClass]="{'not-active': whoami?.id!=project?.creationUser?.id }" class="editGridColumn" (click)="editRow(project, $event)">
|
||||
<i class="fa fa-pencil fa-fw" data-toggle="tooltip" title="edit properties" id="editDMP" ></i>
|
||||
</a>
|
||||
</td>
|
||||
|
||||
</tr>
|
||||
</tbody>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<td colspan="1">
|
||||
<button type="button" class="btn btn-info btncustom" (click)="newProject(item)">New Project</button>
|
||||
</td>
|
||||
<td colspan="5">
|
||||
|
||||
<mfBootstrapPaginator [rowsOnPageSet]="[5,10,20]"></mfBootstrapPaginator>
|
||||
</td>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
|
||||
|
||||
<div class="modal fade" id="newEditProjectModal" tabindex="-1" role="dialog" aria-labelledby="newProjectModalLabel" aria-hidden="true">
|
||||
<div class="modal-dialog" role="document">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title" id="exampleModalLabel">Project</h5>
|
||||
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
|
||||
<span aria-hidden="true">×</span>
|
||||
</button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<form #newProjectForm="ngForm" (ngSubmit)="SaveProject()" novalidate>
|
||||
|
||||
<label for="label-name" class="form-control-label">Label:</label>
|
||||
<input type="text" class="form-control" id="label-name" [(ngModel)]= "project.label" name = "label" required>
|
||||
<div class="form-group">
|
||||
<label for="abbreviation-text" class="form-control-label">Abbreviation:</label>
|
||||
<input class="form-control" id="abbreviation-text" [(ngModel)]= "project.abbreviation" name = "abbreviation">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="reference-text" class="form-control-label">Reference:</label>
|
||||
<input class="form-control" id="reference-text" [(ngModel)]= "project.reference" name = "reference">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="uri-text" class="form-control-label">Uri:</label>
|
||||
<input class="form-control" id="uri-text" [(ngModel)]= "project.uri" name = "uri">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="start-date" class="form-control-label">Start Date:</label>
|
||||
<input class="form-control" type='date' class="form-control" [(ngModel)]= "project.startdate" id='start-date' name = "startdate" required/>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="end-date" class="form-control-label">End Date:</label>
|
||||
<input class="form-control" type='date' class="form-control" [(ngModel)]= "project.enddate" id='end-date' name = "enddate" required/>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="status-name" class="col-form-label">Status:</label>
|
||||
<select class="form-control" id="statusid" [(ngModel)]="project.status" name="statusDropDown">
|
||||
<option *ngFor="let opt of statusDropDown.options" [value]="opt.key">{{opt.value}}</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="code-name" class="form-control-label">Description:</label>
|
||||
<textarea rows="3" class="form-control" name="desc" id="description" [(ngModel)]= "project.description"> </textarea>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
|
||||
<button type="submit" class="btn btn-primary" [disabled]="!newProjectForm.form.valid" (click)="SaveProject();">Save project</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
-->
|
||||
|
|
@ -0,0 +1,146 @@
|
|||
import { Component, ViewChild, OnInit, AfterViewInit } from "@angular/core";
|
||||
import { MatPaginator, MatSort, MatSnackBar } from "@angular/material";
|
||||
import { Router } from "@angular/router";
|
||||
import { TranslateService } from "@ngx-translate/core";
|
||||
import { DataSource } from "@angular/cdk/table";
|
||||
import { Observable } from "rxjs/Observable";
|
||||
import { DataTableRequest } from "../models/data-table/DataTableRequest";
|
||||
import { SnackBarNotificationComponent } from "../shared/components/notificaiton/snack-bar-notification.component";
|
||||
import { DataManagementPlanService } from "../services/data-management-plan/data-management-plan.service";
|
||||
import { DataManagementPlanCriteriaComponent } from "../shared/components/criteria/data-management-plan/dmp-criteria.component";
|
||||
import { DataManagementPlanCriteria } from "../models/criteria/data-management-plan/DataManagementPlanCriteria";
|
||||
import { DataManagementPlanListingModel } from "../models/data-managemnt-plans/DataManagementPlanListingModel";
|
||||
|
||||
|
||||
|
||||
@Component({
|
||||
selector: 'app-dmp-listing-component',
|
||||
templateUrl: 'dmp-listing.component.html',
|
||||
styleUrls: ['./dmp-listing.component.css'],
|
||||
providers: [DataManagementPlanService]
|
||||
})
|
||||
export class DataManagementPlanListingComponent implements OnInit, AfterViewInit {
|
||||
|
||||
@ViewChild(MatPaginator) _paginator: MatPaginator;
|
||||
@ViewChild(MatSort) sort: MatSort;
|
||||
@ViewChild(DataManagementPlanCriteriaComponent) criteria: DataManagementPlanCriteriaComponent;
|
||||
|
||||
dataSource: DataManagementPlanDataSource | null;
|
||||
displayedColumns: String[] = ['name', 'abbreviation', 'start', 'end'];
|
||||
|
||||
constructor(
|
||||
private projectService: DataManagementPlanService,
|
||||
private router: Router,
|
||||
private languageService: TranslateService,
|
||||
public snackBar: MatSnackBar,
|
||||
) {
|
||||
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
|
||||
}
|
||||
|
||||
ngAfterViewInit() {
|
||||
setTimeout(() => {
|
||||
this.criteria.setRefreshCallback(() => this.refresh());
|
||||
this.criteria.setCriteria(this.getDefaultCriteria());
|
||||
this.criteria.controlModified();
|
||||
});
|
||||
}
|
||||
|
||||
refresh() {
|
||||
this.dataSource = new DataManagementPlanDataSource(this.projectService, this._paginator, this.sort, this.languageService, this.snackBar, this.criteria, );
|
||||
}
|
||||
|
||||
rowClick(rowId: String) {
|
||||
this.router.navigate(['/forms/' + rowId]);
|
||||
}
|
||||
|
||||
getDefaultCriteria(): DataManagementPlanCriteria {
|
||||
const defaultCriteria = new DataManagementPlanCriteria();
|
||||
return defaultCriteria;
|
||||
}
|
||||
|
||||
// canShowOwner(): boolean {
|
||||
// const principal: Principal = this.authentication.current();
|
||||
// if (principal) {
|
||||
// const principalRoles = principal.appRoles;
|
||||
// for (let i = 0; i < principalRoles.length; i++) {
|
||||
// if (principalRoles[i] === Principal.AppRole.Admin || principalRoles[i] === Principal.AppRole.BudgetManager) {
|
||||
// return true;
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// return false;
|
||||
// }
|
||||
}
|
||||
|
||||
export class DataManagementPlanDataSource extends DataSource<DataManagementPlanListingModel> {
|
||||
|
||||
totalCount = 0;
|
||||
isLoadingResults = false;
|
||||
|
||||
constructor(
|
||||
private _service: DataManagementPlanService,
|
||||
private _paginator: MatPaginator,
|
||||
private _sort: MatSort,
|
||||
private _languageService: TranslateService,
|
||||
private _snackBar: MatSnackBar,
|
||||
private _criteria: DataManagementPlanCriteriaComponent
|
||||
) {
|
||||
super();
|
||||
|
||||
//this._paginator.page.subscribe((pageEvent: PageEvent) => {
|
||||
// this.store.dispatch(new LoadPhotosRequestAction(pageEvent.pageIndex, pageEvent.pageSize))
|
||||
//})
|
||||
}
|
||||
|
||||
connect(): Observable<DataManagementPlanListingModel[]> {
|
||||
const displayDataChanges = [
|
||||
this._paginator.page
|
||||
//this._sort.matSortChange
|
||||
];
|
||||
|
||||
// If the user changes the sort order, reset back to the first page.
|
||||
//this._sort.matSortChange.subscribe(() => {
|
||||
// this._paginator.pageIndex = 0;
|
||||
//})
|
||||
|
||||
return Observable.merge(...displayDataChanges)
|
||||
.startWith(null)
|
||||
.switchMap(() => {
|
||||
setTimeout(() => {
|
||||
this.isLoadingResults = true;
|
||||
});
|
||||
const startIndex = this._paginator.pageIndex * this._paginator.pageSize;
|
||||
const request = new DataTableRequest(startIndex, this._paginator.pageSize);
|
||||
request.projectCriteria = this._criteria.getFormData();
|
||||
return this._service.getPaged(request);
|
||||
})
|
||||
.catch((error: any) => {
|
||||
this._snackBar.openFromComponent(SnackBarNotificationComponent, {
|
||||
data: { message: 'GENERAL.SNACK-BAR.FORMS-BAD-REQUEST', language: this._languageService },
|
||||
duration: 3000,
|
||||
extraClasses: ['snackbar-warning']
|
||||
});
|
||||
this._criteria.onCallbackError(error);
|
||||
return Observable.of(null);
|
||||
})
|
||||
.map(result => {
|
||||
setTimeout(() => {
|
||||
this.isLoadingResults = false;
|
||||
});
|
||||
return result;
|
||||
})
|
||||
.map(result => {
|
||||
if (!result) { return []; }
|
||||
if (this._paginator.pageIndex === 0) { this.totalCount = result.totalCount; }
|
||||
return result.data;
|
||||
});
|
||||
}
|
||||
|
||||
disconnect() {
|
||||
// No-op
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,20 @@
|
|||
.mat-card {
|
||||
overflow: auto;
|
||||
padding: 0px;
|
||||
}
|
||||
|
||||
.mat-table {
|
||||
margin: 24px;
|
||||
}
|
||||
|
||||
.mat-progress-bar {
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.mat-fab-bottom-right {
|
||||
top: auto !important;
|
||||
right: 20px !important;
|
||||
bottom: 10px !important;
|
||||
left: auto !important;
|
||||
position: fixed !important;
|
||||
}
|
||||
|
|
@ -0,0 +1,190 @@
|
|||
<div class="container-fluid">
|
||||
<h3>{{'PROJECT-LISTING.TITLE' | translate}}</h3>
|
||||
|
||||
<app-projects-criteria-component></app-projects-criteria-component>
|
||||
<mat-card class="mat-card">
|
||||
<mat-progress-bar *ngIf="dataSource?.isLoadingResults" mode="query"></mat-progress-bar>
|
||||
|
||||
<mat-table [dataSource]="dataSource" matSort>
|
||||
|
||||
<!-- Column Definition: Name -->
|
||||
<ng-container cdkColumnDef="name">
|
||||
<mat-header-cell *matHeaderCellDef>{{'PROJECT-LISTING.COLUMNS.NAME' | translate}}</mat-header-cell>
|
||||
<mat-cell *matCellDef="let row">{{row.name}}</mat-cell>
|
||||
</ng-container>
|
||||
|
||||
<!-- Column Definition: Αbbreviation -->
|
||||
<ng-container cdkColumnDef="abbreviation">
|
||||
<mat-header-cell *matHeaderCellDef>{{'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>{{'PROJECT-LISTING.COLUMNS.START' | translate}}</mat-header-cell>
|
||||
<mat-cell *matCellDef="let row"> {{row.start}} </mat-cell>
|
||||
</ng-container>
|
||||
|
||||
<!-- Column Definition: End -->
|
||||
<ng-container cdkColumnDef="end">
|
||||
<mat-header-cell *matHeaderCellDef>{{'PROJECT-LISTING.COLUMNS.END' | translate}}</mat-header-cell>
|
||||
<mat-cell *matCellDef="let row"> {{row.end}} </mat-cell>
|
||||
</ng-container>
|
||||
|
||||
<!-- 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-table>
|
||||
<mat-paginator #paginator
|
||||
[length]="dataSource?.totalCount"
|
||||
[pageSizeOptions]="[10, 25, 100]">
|
||||
</mat-paginator>
|
||||
</mat-card>
|
||||
|
||||
<button mat-fab class="mat-fab-bottom-right" color="primary" [routerLink]=" ['./new'] ">
|
||||
<mat-icon class="mat-24">add</mat-icon>
|
||||
</button>
|
||||
</div>
|
||||
<!-- <meta name="google-signin-client_id" content="524432312250-vhgidft856v8qftsc81kls4c74v87d8o.apps.googleusercontent.com">
|
||||
|
||||
<table class="table table-striped" [mfData]="tableData | projectTableFilter : filterQuery : whoami?.id : onlyMyProjects"
|
||||
#mf="mfDataTable" [mfRowsOnPage]="rowsOnPage" [(mfSortBy)]="sortBy" [(mfSortOrder)]="sortOrder">
|
||||
<thead>
|
||||
<tr>
|
||||
<th colspan="1">
|
||||
<input class="form-control" [(ngModel)]="filterQuery" placeholder='Filter' />
|
||||
</th>
|
||||
<th style="width:50px;">
|
||||
<button class="btn btn-default" (click)="getProjects('false')">
|
||||
<span class="glyphicon glyphicon-refresh"></span>
|
||||
</button>
|
||||
</th>
|
||||
<th colspan="1">
|
||||
<div class="checkbox">
|
||||
<label><input type="checkbox" [(ngModel)]="onlyMyProjects" >Show only my projects</label>
|
||||
</div>
|
||||
</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<th [ngClass]="{true:'visible', false:'invisible'}[showIDs]">
|
||||
<mfDefaultSorter by="id">ID</mfDefaultSorter>
|
||||
</th>
|
||||
<th>
|
||||
<mfDefaultSorter by="label">Label</mfDefaultSorter>
|
||||
</th>
|
||||
<th>
|
||||
<mfDefaultSorter by="abbreviation">Αbbreviation</mfDefaultSorter>
|
||||
</th>
|
||||
<th>
|
||||
<mfDefaultSorter by="startdate">Start Date</mfDefaultSorter>
|
||||
</th>
|
||||
<th>
|
||||
<mfDefaultSorter by="enddate">End Date</mfDefaultSorter>
|
||||
</th>
|
||||
<th>
|
||||
<mfDefaultSorter by="status">Status</mfDefaultSorter>
|
||||
</th>
|
||||
<th>
|
||||
<mfDefaultSorter by="description">Description</mfDefaultSorter>
|
||||
</th>
|
||||
<th>
|
||||
<mfDefaultSorter>Actions </mfDefaultSorter>
|
||||
</th>
|
||||
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr class="grayout-empty-table" *ngIf="!mf.data[0]">
|
||||
<td colspan="7">No elements</td>
|
||||
</tr>
|
||||
|
||||
<tr *ngFor="let project of mf.data" class="hover">
|
||||
<td [ngClass]="{true:'visible', false:'invisible'}[showIDs]">{{project?.id}}</td>
|
||||
<td>{{(project?.label?.length > 40) ? (project?.label | slice:0:40)+'...':(project?.label) }}</td>
|
||||
<td>{{project?.abbreviation}}</td>
|
||||
<td>{{project?.startdate | date:'medium' }}</td>
|
||||
<td>{{project?.enddate | date:'medium'}}</td>
|
||||
<td>{{project?.status | statusToString}}</td>
|
||||
<td>{{(project?.description?.length > 40) ? (project?.description | slice:0:40)+'...':(project?.description) }}</td>
|
||||
<td>
|
||||
<a [ngClass]="{'not-active': whoami?.id!=project?.creationUser?.id }" class="editGridColumn" (click)="editRow(project, $event)">
|
||||
<i class="fa fa-pencil fa-fw" data-toggle="tooltip" title="edit properties" id="editDMP" ></i>
|
||||
</a>
|
||||
</td>
|
||||
|
||||
</tr>
|
||||
</tbody>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<td colspan="1">
|
||||
<button type="button" class="btn btn-info btncustom" (click)="newProject(item)">New Project</button>
|
||||
</td>
|
||||
<td colspan="5">
|
||||
|
||||
<mfBootstrapPaginator [rowsOnPageSet]="[5,10,20]"></mfBootstrapPaginator>
|
||||
</td>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
|
||||
|
||||
<div class="modal fade" id="newEditProjectModal" tabindex="-1" role="dialog" aria-labelledby="newProjectModalLabel" aria-hidden="true">
|
||||
<div class="modal-dialog" role="document">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title" id="exampleModalLabel">Project</h5>
|
||||
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
|
||||
<span aria-hidden="true">×</span>
|
||||
</button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<form #newProjectForm="ngForm" (ngSubmit)="SaveProject()" novalidate>
|
||||
|
||||
<label for="label-name" class="form-control-label">Label:</label>
|
||||
<input type="text" class="form-control" id="label-name" [(ngModel)]= "project.label" name = "label" required>
|
||||
<div class="form-group">
|
||||
<label for="abbreviation-text" class="form-control-label">Abbreviation:</label>
|
||||
<input class="form-control" id="abbreviation-text" [(ngModel)]= "project.abbreviation" name = "abbreviation">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="reference-text" class="form-control-label">Reference:</label>
|
||||
<input class="form-control" id="reference-text" [(ngModel)]= "project.reference" name = "reference">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="uri-text" class="form-control-label">Uri:</label>
|
||||
<input class="form-control" id="uri-text" [(ngModel)]= "project.uri" name = "uri">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="start-date" class="form-control-label">Start Date:</label>
|
||||
<input class="form-control" type='date' class="form-control" [(ngModel)]= "project.startdate" id='start-date' name = "startdate" required/>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="end-date" class="form-control-label">End Date:</label>
|
||||
<input class="form-control" type='date' class="form-control" [(ngModel)]= "project.enddate" id='end-date' name = "enddate" required/>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="status-name" class="col-form-label">Status:</label>
|
||||
<select class="form-control" id="statusid" [(ngModel)]="project.status" name="statusDropDown">
|
||||
<option *ngFor="let opt of statusDropDown.options" [value]="opt.key">{{opt.value}}</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="code-name" class="form-control-label">Description:</label>
|
||||
<textarea rows="3" class="form-control" name="desc" id="description" [(ngModel)]= "project.description"> </textarea>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
|
||||
<button type="submit" class="btn btn-primary" [disabled]="!newProjectForm.form.valid" (click)="SaveProject();">Save project</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
-->
|
||||
|
|
@ -0,0 +1,34 @@
|
|||
import { Component, ViewChild, OnInit, AfterViewInit } from "@angular/core";
|
||||
import { MatPaginator, MatSort, MatSnackBar } from "@angular/material";
|
||||
import { Router } from "@angular/router";
|
||||
import { TranslateService } from "@ngx-translate/core";
|
||||
import { DataSource } from "@angular/cdk/table";
|
||||
import { Observable } from "rxjs/Observable";
|
||||
import { DataManagementPlanService } from "../../services/data-management-plan/data-management-plan.service";
|
||||
|
||||
|
||||
|
||||
@Component({
|
||||
selector: 'app-dmp-editor-component',
|
||||
templateUrl: 'dmp-editor.component.html',
|
||||
styleUrls: ['./dmp-editor.component.css'],
|
||||
})
|
||||
export class DataManagementPlanEditorComponent implements OnInit, AfterViewInit {
|
||||
|
||||
constructor(
|
||||
private projectService: DataManagementPlanService,
|
||||
private router: Router,
|
||||
private languageService: TranslateService,
|
||||
public snackBar: MatSnackBar
|
||||
) {
|
||||
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
|
||||
}
|
||||
|
||||
ngAfterViewInit() {
|
||||
|
||||
}
|
||||
}
|
||||
|
|
@ -6,151 +6,3 @@
|
|||
<p><a class="btn btn-primary btn-lg" href="#" role="button">Learn more</a></p>
|
||||
-->
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<div class="container">
|
||||
<!-- <app-navbar title="Table List"></app-navbar> -->
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<div class="card">
|
||||
<div class="card-header">
|
||||
<i class="material-icons">assignment</i>
|
||||
</div>
|
||||
<div class="card-content">
|
||||
<h4 class="card-title">Simple Table</h4>
|
||||
<div class="table-responsive">
|
||||
<table class="table">
|
||||
<thead class="text-primary">
|
||||
<tr>
|
||||
<th>First Name</th>
|
||||
<th>Country</th>
|
||||
<th>City</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Dakota Rice</td>
|
||||
<td>Niger</td>
|
||||
<td>Oud-Turnhout</td>
|
||||
<td class="text-primary">$36,738</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Minerva Hooper</td>
|
||||
<td>Curaçao</td>
|
||||
<td>Sinaai-Waas</td>
|
||||
<td class="text-primary">$23,789</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Sage Rodriguez</td>
|
||||
<td>Netherlands</td>
|
||||
<td>Baileux</td>
|
||||
<td class="text-primary">$56,142</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Philip Chaney</td>
|
||||
<td>Korea, South</td>
|
||||
<td>Overland Park</td>
|
||||
<td class="text-primary">$38,735</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Doris Greene</td>
|
||||
<td>Malawi</td>
|
||||
<td>Feldkirchen in Kärnten</td>
|
||||
<td class="text-primary">$63,542</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Mason Porter</td>
|
||||
<td>Chile</td>
|
||||
<td>Gloucester</td>
|
||||
<td class="text-primary">$78,615</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<div class="card">
|
||||
<div class="card-header">
|
||||
<i class="material-icons">assignment</i>
|
||||
</div>
|
||||
<div class="card-content">
|
||||
<h4 class="card-title">Striped Table</h4>
|
||||
<div class="table-responsive">
|
||||
<table class="table table-striped">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>#</th>
|
||||
<th></th>
|
||||
<th>Product Name</th>
|
||||
<th>Type</th>
|
||||
<th>Quantity</th>
|
||||
<th class="text-right">Price</th>
|
||||
<th class="text-right">Amount</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>1</td>
|
||||
<td><md-checkbox></md-checkbox></td>
|
||||
<td>Moleskine Agenda</td>
|
||||
<td>Oud-Office</td>
|
||||
<td>25</td>
|
||||
<td class="text-right">€ 49</td>
|
||||
<td class="text-right">€ 1,225</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>2</td>
|
||||
<td><md-checkbox></md-checkbox></td>
|
||||
<td>Stabilo Pen</td>
|
||||
<td>Office</td>
|
||||
<td>35</td>
|
||||
<td class="text-right">€ 10</td>
|
||||
<td class="text-right">€ 300</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>3</td>
|
||||
<td><md-checkbox></md-checkbox></td>
|
||||
<td>A4 Paper Pack</td>
|
||||
<td>Office</td>
|
||||
<td>50</td>
|
||||
<td class="text-right">€ 599.00</td>
|
||||
<td class="text-right">€ 109</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>4</td>
|
||||
<td><md-checkbox></md-checkbox></td>
|
||||
<td>Apple iPad</td>
|
||||
<td>Meeting</td>
|
||||
<td>20</td>
|
||||
<td class="text-right">€ 10.99</td>
|
||||
<td class="text-right">€ 4,999</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>5</td>
|
||||
<td><md-checkbox></md-checkbox></td>
|
||||
<td>Apple iPhone</td>
|
||||
<td>Communication</td>
|
||||
<td>10</td>
|
||||
<td class="text-right">€ 499.00</td>
|
||||
<td class="text-right">€ 5,999</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="5"></td>
|
||||
<td style="font-weight: 500; font-size: 1.25em;" class="text-right">Total</td>
|
||||
<td style="font-size: 26px" class="text-right">€12,999</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
@ -1,4 +1,4 @@
|
|||
import { BaseCriteria } from "./BaseCriteria";
|
||||
import { BaseCriteria } from "../BaseCriteria";
|
||||
|
||||
export class DataManagementPlanCriteria extends BaseCriteria {
|
||||
public PeriodStart: Date;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
import { BaseCriteria } from "./BaseCriteria";
|
||||
import { BaseCriteria } from "../BaseCriteria";
|
||||
|
||||
export class ProjectCriteria extends BaseCriteria {
|
||||
public PeriodStart: Date;
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
import { Serializable } from "../Serializable";
|
||||
|
||||
export class DmpModel implements Serializable<DmpModel> {
|
||||
export class DataManagementPlanListingModel implements Serializable<DataManagementPlanListingModel> {
|
||||
public id: String;
|
||||
public label: String;
|
||||
public abbreviation: String;
|
||||
|
|
@ -11,7 +11,7 @@ export class DmpModel implements Serializable<DmpModel> {
|
|||
public endDate: Date;
|
||||
public description: String;
|
||||
|
||||
fromJSONObject(item: any): DmpModel {
|
||||
fromJSONObject(item: any): DataManagementPlanListingModel {
|
||||
this.id = item.id;
|
||||
this.label = item.label;
|
||||
this.abbreviation = item.abbreviation;
|
||||
|
|
@ -1,6 +1,6 @@
|
|||
import { Serializable } from "../Serializable";
|
||||
|
||||
export class DmpListingModel implements Serializable<DmpListingModel> {
|
||||
export class DataManagementPlanModel implements Serializable<DataManagementPlanModel> {
|
||||
public id: String;
|
||||
public label: String;
|
||||
public abbreviation: String;
|
||||
|
|
@ -11,7 +11,7 @@ export class DmpListingModel implements Serializable<DmpListingModel> {
|
|||
public endDate: Date;
|
||||
public description: String;
|
||||
|
||||
fromJSONObject(item: any): DmpListingModel {
|
||||
fromJSONObject(item: any): DataManagementPlanModel {
|
||||
this.id = item.id;
|
||||
this.label = item.label;
|
||||
this.abbreviation = item.abbreviation;
|
||||
|
|
@ -1,5 +1,5 @@
|
|||
import { ProjectCriteria } from "../criteria/ProjectCriteria";
|
||||
import { DataManagementPlanCriteria } from "../criteria/DataManagementPlanCriteria";
|
||||
import { DataManagementPlanCriteria } from "../criteria/data-management-plan/DataManagementPlanCriteria";
|
||||
import { ProjectCriteria } from "../criteria/project/ProjectCriteria";
|
||||
|
||||
export class DataTableRequest {
|
||||
offset = 0;
|
||||
|
|
|
|||
|
|
@ -18,8 +18,8 @@ export class ProjectListingModel implements Serializable<ProjectListingModel> {
|
|||
this.reference = item.reference;
|
||||
this.uri = item.uri;
|
||||
this.status = item.status;
|
||||
this.startDate = item.startDate;
|
||||
this.endDate = item.endDate;
|
||||
this.startDate = item.startdate;
|
||||
this.endDate = item.enddate;
|
||||
this.description = item.description;
|
||||
|
||||
return this;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,8 @@
|
|||
import { Serializable } from "../Serializable";
|
||||
import { ValidationContext } from "../../utilities/validators/ValidationContext";
|
||||
import { FormGroup, FormBuilder, FormControl, Validators } from "@angular/forms";
|
||||
import { BackendErrorValidator } from "../../utilities/validators/BackendErrorValidator";
|
||||
import { BaseErrorModel } from "../error/BaseErrorModel";
|
||||
|
||||
export class ProjectModel implements Serializable<ProjectModel> {
|
||||
public id: String;
|
||||
|
|
@ -11,6 +15,8 @@ export class ProjectModel implements Serializable<ProjectModel> {
|
|||
public endDate: Date;
|
||||
public description: String;
|
||||
|
||||
public errorModel: BaseErrorModel = new BaseErrorModel();
|
||||
|
||||
fromJSONObject(item: any): ProjectModel {
|
||||
this.id = item.id;
|
||||
this.label = item.label;
|
||||
|
|
@ -24,4 +30,32 @@ export class ProjectModel implements Serializable<ProjectModel> {
|
|||
|
||||
return this;
|
||||
}
|
||||
|
||||
buildForm(context: ValidationContext = null, disabled: boolean = false): FormGroup {
|
||||
if (context == null) { context = this.createValidationContext(); }
|
||||
|
||||
const formGroup = new FormBuilder().group({
|
||||
label: [{ value: this.label, disabled: disabled }, context.getValidation('label').validators],
|
||||
abbreviation: [{ value: this.abbreviation, disabled: disabled }, context.getValidation('abbreviation').validators],
|
||||
reference: [{ value: this.reference, disabled: disabled }],
|
||||
uri: [{ value: this.uri, disabled: disabled }, context.getValidation('uri').validators],
|
||||
description: [{ value: this.description, disabled: disabled }, context.getValidation('description').validators],
|
||||
startDate: [{ value: this.startDate, disabled: disabled }, context.getValidation('startDate').validators],
|
||||
endDate: [{ value: this.endDate, disabled: disabled }, context.getValidation('endDate').validators]
|
||||
});
|
||||
|
||||
return formGroup;
|
||||
}
|
||||
|
||||
createValidationContext(): ValidationContext {
|
||||
const baseContext: ValidationContext = new ValidationContext();
|
||||
baseContext.validation.push({ key: 'label', validators: [Validators.required, BackendErrorValidator(this.errorModel, 'label')] });
|
||||
baseContext.validation.push({ key: 'abbreviation', validators: [Validators.required, BackendErrorValidator(this.errorModel, 'abbreviation')] });
|
||||
baseContext.validation.push({ key: 'uri', validators: [Validators.required, BackendErrorValidator(this.errorModel, 'uri')] });
|
||||
baseContext.validation.push({ key: 'description', validators: [Validators.required, BackendErrorValidator(this.errorModel, 'description')] });
|
||||
baseContext.validation.push({ key: 'startDate', validators: [Validators.required, BackendErrorValidator(this.errorModel, 'startDate')] });
|
||||
baseContext.validation.push({ key: 'endDate', validators: [Validators.required, BackendErrorValidator(this.errorModel, 'endDate')] });
|
||||
|
||||
return baseContext;
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,20 @@
|
|||
.mat-card {
|
||||
overflow: auto;
|
||||
padding: 0px;
|
||||
}
|
||||
|
||||
.mat-table {
|
||||
margin: 24px;
|
||||
}
|
||||
|
||||
.mat-progress-bar {
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.mat-fab-bottom-right {
|
||||
top: auto !important;
|
||||
right: 20px !important;
|
||||
bottom: 10px !important;
|
||||
left: auto !important;
|
||||
position: fixed !important;
|
||||
}
|
||||
|
|
@ -0,0 +1,66 @@
|
|||
<div>
|
||||
<form *ngIf="formGroup" class="expense-list" (ngSubmit)="formSubmit()" [formGroup]="formGroup">
|
||||
<mat-card>
|
||||
<mat-card-title *ngIf="isNew">{{'PROJECT-EDITOR.TITLE.NEW' | translate}}</mat-card-title>
|
||||
<mat-card-title *ngIf="!isNew">{{'PROJECT-EDITOR.TITLE.EDIT' | translate}} {{project.label}}</mat-card-title>
|
||||
<mat-card-content>
|
||||
|
||||
<mat-form-field>
|
||||
<input matInput placeholder="{{'PROJECT-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>
|
||||
<input matInput placeholder="{{'PROJECT-EDITOR.FIELDS.ABBREVIATION' | translate}}" type="text" name="abbreviation" formControlName="abbreviation"
|
||||
required>
|
||||
<mat-error *ngIf="formGroup.get('abbreviation').errors?.backendError">{{baseErrorModel.abbreviation}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('abbreviation').errors?.required">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
|
||||
<mat-form-field>
|
||||
<input matInput placeholder="{{'PROJECT-EDITOR.FIELDS.URI' | translate}}" type="text" name="uri" formControlName="uri" required>
|
||||
<mat-error *ngIf="formGroup.get('uri').errors?.backendError">{{baseErrorModel.uri}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('uri').errors?.required">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
|
||||
<table class="input-table full-width">
|
||||
<tr>
|
||||
<td>
|
||||
<mat-form-field>
|
||||
<input matInput (focus)="startDate.open()" (click)="startDate.open()" placeholder="{{'PROJECT-EDITOR.FIELDS.START' | translate}}"
|
||||
class="table-input" [matDatepicker]="startDate" formControlName="startDate" required>
|
||||
<mat-datepicker-toggle matSuffix [for]="startDate"></mat-datepicker-toggle>
|
||||
<mat-datepicker #startDate></mat-datepicker>
|
||||
<mat-error *ngIf="formGroup.get('startDate').errors?.backendError">{{baseErrorModel.startDate}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('startDate').errors?.required">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</td>
|
||||
<td>
|
||||
<mat-form-field>
|
||||
<input matInput (focus)="endDate.open()" (click)="endDate.open()" placeholder="{{'PROJECT-EDITOR.FIELDS.END' | translate}}"
|
||||
class="table-input" [matDatepicker]="endDate" formControlName="endDate" required>
|
||||
<mat-datepicker-toggle matSuffix [for]="endDate"></mat-datepicker-toggle>
|
||||
<mat-datepicker #endDate></mat-datepicker>
|
||||
<mat-error *ngIf="formGroup.get('endDate').errors?.backendError">{{baseErrorModel.endDate}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('endDate').errors?.required">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</mat-card-content>
|
||||
</mat-card>
|
||||
|
||||
<mat-card>
|
||||
<mat-card-content>
|
||||
<div layout="row" class="full-width text-right" align="end">
|
||||
<!-- <button mat-raised-button color="primary" (click)="cancel()" type="button">{{'FORM-EXPENSE-LIST.EDITOR.ACTIONS.CANCEL' | translate}}</button>
|
||||
<button *ngIf="this.item.status == 0" mat-raised-button color="primary" type="submit" (click)="save()">{{'FORM-EXPENSE-LIST.EDITOR.ACTIONS.SAVE' | translate}}</button>
|
||||
<button *ngIf="this.item.status == 0" mat-raised-button color="primary" type="submit" (click)="submit()">{{'FORM-EXPENSE-LIST.EDITOR.ACTIONS.SUBMIT' | translate}}</button>
|
||||
<button *ngIf="!isNew && this.item.status == 0" mat-raised-button color="primary" type="submit" (click)="delete()">{{'FORM-EXPENSE-LIST.EDITOR.ACTIONS.DELETE' | translate}}</button> -->
|
||||
</div>
|
||||
</mat-card-content>
|
||||
</mat-card>
|
||||
</form>
|
||||
</div>
|
||||
|
|
@ -0,0 +1,51 @@
|
|||
import { Component, ViewChild, OnInit, AfterViewInit } from "@angular/core";
|
||||
import { MatPaginator, MatSort, MatSnackBar } from "@angular/material";
|
||||
import { Router, ActivatedRoute, Params } from "@angular/router";
|
||||
import { TranslateService } from "@ngx-translate/core";
|
||||
import { DataSource } from "@angular/cdk/table";
|
||||
import { Observable } from "rxjs/Observable";
|
||||
import { DataManagementPlanService } from "../../services/data-management-plan/data-management-plan.service";
|
||||
import { ProjectModel } from "../../models/projects/ProjectModel";
|
||||
import { ProjectService } from "../../services/project/project.service";
|
||||
import { JsonSerializer } from "../../utilities/JsonSerializer";
|
||||
import { FormGroup } from "@angular/forms";
|
||||
|
||||
|
||||
|
||||
@Component({
|
||||
selector: 'app-project-editor-component',
|
||||
templateUrl: 'project-editor.component.html',
|
||||
styleUrls: ['./project-editor.component.css'],
|
||||
providers: [ProjectService]
|
||||
})
|
||||
export class ProjectEditorComponent implements AfterViewInit {
|
||||
|
||||
isNew = true;
|
||||
project: ProjectModel;
|
||||
formGroup: FormGroup = null;
|
||||
|
||||
constructor(
|
||||
private projectService: ProjectService,
|
||||
private route: ActivatedRoute,
|
||||
) {
|
||||
|
||||
}
|
||||
|
||||
ngAfterViewInit() {
|
||||
this.route.params.subscribe((params: Params) => {
|
||||
const itemId = params['id'];
|
||||
|
||||
if (itemId != null) {
|
||||
this.isNew = false;
|
||||
this.projectService.getSingle(itemId).map(data => data as ProjectModel)
|
||||
.subscribe(data => {
|
||||
this.project = new JsonSerializer<ProjectModel>().fromJSONObject(data, ProjectModel);
|
||||
this.formGroup = this.project.buildForm();
|
||||
});
|
||||
} else {
|
||||
this.project = new ProjectModel();
|
||||
this.formGroup = this.project.buildForm();
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
|
@ -10,7 +10,7 @@
|
|||
<!-- Column Definition: Name -->
|
||||
<ng-container cdkColumnDef="name">
|
||||
<mat-header-cell *matHeaderCellDef>{{'PROJECT-LISTING.COLUMNS.NAME' | translate}}</mat-header-cell>
|
||||
<mat-cell *matCellDef="let row">{{row.name}}</mat-cell>
|
||||
<mat-cell *matCellDef="let row">{{row.label}}</mat-cell>
|
||||
</ng-container>
|
||||
|
||||
<!-- Column Definition: Αbbreviation -->
|
||||
|
|
@ -22,13 +22,13 @@
|
|||
<!-- Column Definition: Start -->
|
||||
<ng-container cdkColumnDef="start">
|
||||
<mat-header-cell *matHeaderCellDef>{{'PROJECT-LISTING.COLUMNS.START' | translate}}</mat-header-cell>
|
||||
<mat-cell *matCellDef="let row"> {{row.start}} </mat-cell>
|
||||
<mat-cell *matCellDef="let row"> {{row.startDate}} </mat-cell>
|
||||
</ng-container>
|
||||
|
||||
<!-- Column Definition: End -->
|
||||
<ng-container cdkColumnDef="end">
|
||||
<mat-header-cell *matHeaderCellDef>{{'PROJECT-LISTING.COLUMNS.END' | translate}}</mat-header-cell>
|
||||
<mat-cell *matCellDef="let row"> {{row.end}} </mat-cell>
|
||||
<mat-cell *matCellDef="let row"> {{row.endDate}} </mat-cell>
|
||||
</ng-container>
|
||||
|
||||
<!-- Column Definition: Submission Time -->
|
||||
|
|
|
|||
|
|
@ -19,14 +19,14 @@ import { SnackBarNotificationComponent } from "../shared/components/notificaiton
|
|||
styleUrls: ['./project-listing.component.css'],
|
||||
providers: [ProjectService]
|
||||
})
|
||||
export class FormsComponent implements OnInit, AfterViewInit {
|
||||
export class ProjectListingComponent implements OnInit, AfterViewInit {
|
||||
|
||||
@ViewChild(MatPaginator) _paginator: MatPaginator;
|
||||
@ViewChild(MatSort) sort: MatSort;
|
||||
@ViewChild(ProjectCriteriaComponent) criteria: ProjectCriteriaComponent;
|
||||
|
||||
dataSource: FormsDataSource | null;
|
||||
displayedColumns: String[] = ['type', 'projectName', 'submissionTime', 'description', 'status'];
|
||||
dataSource: ProjectDataSource | null;
|
||||
displayedColumns: String[] = ['name', 'abbreviation', 'start', 'end', 'actions'];
|
||||
|
||||
constructor(
|
||||
private projectService: ProjectService,
|
||||
|
|
@ -50,11 +50,11 @@ export class FormsComponent implements OnInit, AfterViewInit {
|
|||
}
|
||||
|
||||
refresh() {
|
||||
this.dataSource = new FormsDataSource(this.projectService, this._paginator, this.sort, this.languageService, this.snackBar, this.criteria, );
|
||||
this.dataSource = new ProjectDataSource(this.projectService, this._paginator, this.sort, this.languageService, this.snackBar, this.criteria, );
|
||||
}
|
||||
|
||||
rowClick(rowId: String) {
|
||||
this.router.navigate(['/forms/' + rowId]);
|
||||
this.router.navigate(['/project/' + rowId]);
|
||||
}
|
||||
|
||||
getDefaultCriteria(): ProjectCriteria {
|
||||
|
|
@ -76,7 +76,7 @@ export class FormsComponent implements OnInit, AfterViewInit {
|
|||
// }
|
||||
}
|
||||
|
||||
export class FormsDataSource extends DataSource<ProjectListingModel> {
|
||||
export class ProjectDataSource extends DataSource<ProjectListingModel> {
|
||||
|
||||
totalCount = 0;
|
||||
isLoadingResults = false;
|
||||
|
|
|
|||
|
|
@ -6,8 +6,8 @@ import { BaseHttpService } from '../../utilities/cite-http-service-module/base-h
|
|||
import { Observable } from 'rxjs/Observable';
|
||||
import { DataTableRequest } from '../../models/data-table/DataTableRequest';
|
||||
import { DataTableData } from '../../models/data-table/DataTableData';
|
||||
import { DmpListingModel } from '../../models/data-managemnt-plans/DmpListingModel';
|
||||
import { DmpModel } from '../../models/data-managemnt-plans/DmpModel';
|
||||
import { DataManagementPlanModel } from '../../models/data-managemnt-plans/DataManagementPlanModel';
|
||||
import { DataManagementPlanListingModel } from '../../models/data-managemnt-plans/DataManagementPlanListingModel';
|
||||
|
||||
|
||||
@Injectable()
|
||||
|
|
@ -18,18 +18,18 @@ export class DataManagementPlanService {
|
|||
|
||||
constructor(private http: BaseHttpService) {
|
||||
|
||||
this.actionUrl = HostConfiguration.Server + 'api/dmp/';
|
||||
this.actionUrl = HostConfiguration.Server + 'api/dmps/';
|
||||
|
||||
this.headers = new HttpHeaders();
|
||||
this.headers = this.headers.set('Content-Type', 'application/json');
|
||||
this.headers = this.headers.set('Accept', 'application/json');
|
||||
}
|
||||
|
||||
getPaged(dataTableRequest: DataTableRequest): Observable<DataTableData<DmpListingModel>> {
|
||||
return this.http.post<DataTableData<DmpListingModel>>(this.actionUrl + 'getPaged', JSON.stringify(dataTableRequest), { headers: this.headers });
|
||||
getPaged(dataTableRequest: DataTableRequest): Observable<DataTableData<DataManagementPlanListingModel>> {
|
||||
return this.http.post<DataTableData<DataManagementPlanListingModel>>(this.actionUrl + 'getPaged', dataTableRequest, { headers: this.headers });
|
||||
}
|
||||
|
||||
getSingle(id: string): Observable<DmpModel> {
|
||||
return this.http.get<DmpModel>(this.actionUrl + id, { headers: this.headers });
|
||||
getSingle(id: string): Observable<DataManagementPlanModel> {
|
||||
return this.http.get<DataManagementPlanModel>(this.actionUrl + id, { headers: this.headers });
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -18,7 +18,7 @@ export class ProjectService {
|
|||
|
||||
constructor(private http: BaseHttpService) {
|
||||
|
||||
this.actionUrl = HostConfiguration.Server + 'api/project/';
|
||||
this.actionUrl = HostConfiguration.Server + 'dmp-backend/rest/projects/';
|
||||
|
||||
this.headers = new HttpHeaders();
|
||||
this.headers = this.headers.set('Content-Type', 'application/json');
|
||||
|
|
@ -26,7 +26,7 @@ export class ProjectService {
|
|||
}
|
||||
|
||||
getPaged(dataTableRequest: DataTableRequest): Observable<DataTableData<ProjectListingModel>> {
|
||||
return this.http.post<DataTableData<ProjectListingModel>>(this.actionUrl + 'getPaged', JSON.stringify(dataTableRequest), { headers: this.headers });
|
||||
return this.http.post<DataTableData<ProjectListingModel>>(this.actionUrl + 'getPaged', dataTableRequest, { headers: this.headers });
|
||||
}
|
||||
|
||||
getSingle(id: string): Observable<ProjectModel> {
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
import { Component, OnInit, Input } from '@angular/core';
|
||||
import { FormControl, FormGroup, NgForm, FormArray, AbstractControl } from '@angular/forms';
|
||||
import { CriteriaErrorModel } from '../../../../models/criteria/criteriaErrorModel';
|
||||
import { BaseCriteriaErrorModel } from '../../../../models/criteria/BaseCriteriaErrorModel';
|
||||
|
||||
@Component({
|
||||
selector: 'base-criteria-component',
|
||||
|
|
@ -14,14 +14,13 @@ export class BaseCriteriaComponent implements OnInit {
|
|||
|
||||
public refreshCallback: Function = null;
|
||||
public formGroup: FormGroup = null;
|
||||
public errorModel: BaseCriteriaErrorModel = new BaseCriteriaErrorModel();
|
||||
|
||||
constructor(
|
||||
public baseErrorModel?: CriteriaErrorModel,
|
||||
) {
|
||||
constructor(errorModel: BaseCriteriaErrorModel) {
|
||||
this.errorModel = errorModel;
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
if (this.baseErrorModel == null) { this.baseErrorModel = new CriteriaErrorModel(); }
|
||||
}
|
||||
|
||||
controlModified(): void {
|
||||
|
|
@ -87,15 +86,15 @@ export class BaseCriteriaComponent implements OnInit {
|
|||
this.validateAllFormFields(this.formGroup);
|
||||
}
|
||||
|
||||
public setErrorModel(errorModel: CriteriaErrorModel) {
|
||||
public setErrorModel(errorModel: BaseCriteriaErrorModel) {
|
||||
Object.keys(errorModel).forEach(item => {
|
||||
(<any>this.baseErrorModel)[item] = (<any>errorModel)[item];
|
||||
(<any>this.errorModel)[item] = (<any>errorModel)[item];
|
||||
})
|
||||
}
|
||||
|
||||
public clearErrorModel() {
|
||||
Object.keys(this.baseErrorModel).forEach(item => {
|
||||
(<any>this.baseErrorModel)[item] = '';
|
||||
Object.keys(this.errorModel).forEach(item => {
|
||||
(<any>this.errorModel)[item] = '';
|
||||
})
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,34 @@
|
|||
<form class="form-criteria">
|
||||
<mat-card class="mat-card">
|
||||
<div class="row">
|
||||
<div class="col-sm-6 col-md-2">
|
||||
<mat-form-field>
|
||||
<input matInput
|
||||
(focus)="periodStartPicker.open()"
|
||||
(click)="periodStartPicker.open()"
|
||||
placeholder=" {{'CRITERIA.FORMS.PERIOD-FROM'| translate}}"
|
||||
[matDatepicker]="periodStartPicker"
|
||||
name="projectCriteriaPeriodStart"
|
||||
[ngModel]="this.criteria.PeriodStart" (ngModelChange)="controlModified()">
|
||||
<mat-error *ngIf="getFormControl('periodStart').errors?.backendError">{{baseErrorModel['Criteria.PeriodStart']}}</mat-error>
|
||||
<mat-datepicker-toggle matSuffix [for]="periodStartPicker"></mat-datepicker-toggle>
|
||||
<mat-datepicker #periodStartPicker></mat-datepicker>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-sm-6 col-md-2">
|
||||
<mat-form-field>
|
||||
<input matInput
|
||||
(focus)="periodEndPicker.open()"
|
||||
(click)="periodEndPicker.open()"
|
||||
name="projectCriteriaPeriodEnd"
|
||||
placeholder=" {{'CRITERIA.FORMS.PERIOD-TO'| translate}}"
|
||||
[matDatepicker]="periodEndPicker"
|
||||
[ngModel]="this.criteria.PeriodEnd" (ngModelChange)="controlModified()">
|
||||
<mat-error *ngIf="getFormControl('periodEnd').errors?.backendError">{{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>
|
||||
</form>
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
.form-criteria {
|
||||
mat-form-field {
|
||||
padding-bottom: 5px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
mat-card {
|
||||
padding-bottom: 0px;
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,68 @@
|
|||
import { TranslateService } from '@ngx-translate/core';
|
||||
import { Component, OnInit } from '@angular/core';
|
||||
import { FormControl, FormGroup, FormBuilder, Validators } from '@angular/forms';
|
||||
import { BaseCriteriaComponent } from '../base/base-criteria.component';
|
||||
import { ValidationContext, Validation } from '../../../../utilities/validators/ValidationContext';
|
||||
import { BackendErrorValidator } from '../../../../utilities/validators/BackendErrorValidator';
|
||||
import { DataManagementPlanCriteria } from '../../../../models/criteria/data-management-plan/DataManagementPlanCriteria';
|
||||
import { DataManagementPlanCriteriaErrorModel } from '../../../../models/criteria/data-management-plan/DataManagementPlanCriteriaErrorModel';
|
||||
|
||||
@Component({
|
||||
selector: 'app-dmp-criteria-component',
|
||||
templateUrl: './dmp-criteria.component.html',
|
||||
styleUrls: ['./dmp-criteria.component.scss'],
|
||||
providers: [
|
||||
]
|
||||
})
|
||||
|
||||
export class DataManagementPlanCriteriaComponent extends BaseCriteriaComponent implements OnInit {
|
||||
|
||||
// public form: DataManagementPlanType;
|
||||
// public formStatus: DataManagementPlanStatus;
|
||||
public criteria: DataManagementPlanCriteria = new DataManagementPlanCriteria();
|
||||
|
||||
constructor(
|
||||
public language: TranslateService,
|
||||
public formBuilder: FormBuilder
|
||||
) {
|
||||
super(new DataManagementPlanCriteriaErrorModel());
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
super.ngOnInit();
|
||||
if (this.criteria == null) { this.criteria = new DataManagementPlanCriteria(); }
|
||||
if (this.formGroup == null) { this.formGroup = this.buildForm(); }
|
||||
}
|
||||
|
||||
setCriteria(criteria: DataManagementPlanCriteria): void {
|
||||
this.criteria = criteria;
|
||||
this.formGroup = this.buildForm();
|
||||
}
|
||||
|
||||
public fromJSONObject(item: any): DataManagementPlanCriteria {
|
||||
this.criteria = new DataManagementPlanCriteria();
|
||||
this.criteria.PeriodStart = new Date(item.PeriodStart);
|
||||
this.criteria.PeriodEnd = new Date(item.PeriodEnd);
|
||||
return this.criteria;
|
||||
}
|
||||
|
||||
buildForm(): FormGroup {
|
||||
const context: ValidationContext = this.createValidationContext();
|
||||
|
||||
return this.formBuilder.group({
|
||||
periodStart: [this.criteria.PeriodStart, context.getValidation('periodStart').validators],
|
||||
periodEnd: [this.criteria.PeriodEnd, context.getValidation('periodEnd').validators],
|
||||
});
|
||||
}
|
||||
|
||||
createValidationContext(): ValidationContext {
|
||||
const validationContext: ValidationContext = new ValidationContext();
|
||||
const validationArray: Validation[] = new Array<Validation>();
|
||||
|
||||
validationArray.push({ key: 'periodStart', validators: [BackendErrorValidator(this.errorModel, 'Criteria.PeriodStart')] }); //must add 'Criteria.' because the criteria validator is inside the request validator
|
||||
validationArray.push({ key: 'periodEnd', validators: [BackendErrorValidator(this.errorModel, 'Criteria.PeriodEnd')] });
|
||||
|
||||
validationContext.validation = validationArray;
|
||||
return validationContext;
|
||||
}
|
||||
}
|
||||
|
|
@ -1,52 +1,32 @@
|
|||
<form class="form-criteria" [formGroup]="formGroup">
|
||||
<form class="form-criteria">
|
||||
<mat-card class="mat-card">
|
||||
<div class="row">
|
||||
<div class="col-sm-6 col-md-2">
|
||||
<mat-form-field>
|
||||
<input matInput
|
||||
(focus)="periodFromPicker.open()"
|
||||
(click)="periodFromPicker.open()"
|
||||
(focus)="periodStartPicker.open()"
|
||||
(click)="periodStartPicker.open()"
|
||||
placeholder=" {{'CRITERIA.FORMS.PERIOD-FROM'| translate}}"
|
||||
[matDatepicker]="periodFromPicker"
|
||||
formControlName="periodFrom"
|
||||
[ngModel]="this.criteria.PeriodFrom" (ngModelChange)="controlModified()">
|
||||
<mat-error *ngIf="getFormControl('periodFrom').errors?.backendError">{{baseErrorModel['Criteria.PeriodFrom']}}</mat-error>
|
||||
<mat-datepicker-toggle matSuffix [for]="periodFromPicker"></mat-datepicker-toggle>
|
||||
<mat-datepicker #periodFromPicker></mat-datepicker>
|
||||
[matDatepicker]="periodStartPicker"
|
||||
name="projectCriteriaPeriodStart"
|
||||
[ngModel]="this.criteria.PeriodStart" (ngModelChange)="controlModified()">
|
||||
<mat-error *ngIf="getFormControl('periodStart').errors?.backendError">{{baseErrorModel['Criteria.PeriodStart']}}</mat-error>
|
||||
<mat-datepicker-toggle matSuffix [for]="periodStartPicker"></mat-datepicker-toggle>
|
||||
<mat-datepicker #periodStartPicker></mat-datepicker>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-sm-6 col-md-2">
|
||||
<mat-form-field>
|
||||
<input matInput
|
||||
(focus)="periodToPicker.open()"
|
||||
(click)="periodToPicker.open()"
|
||||
(focus)="periodEndPicker.open()"
|
||||
(click)="periodEndPicker.open()"
|
||||
name="projectCriteriaPeriodEnd"
|
||||
placeholder=" {{'CRITERIA.FORMS.PERIOD-TO'| translate}}"
|
||||
[matDatepicker]="periodToPicker"
|
||||
formControlName="periodTo"
|
||||
[ngModel]="this.criteria.PeriodTo" (ngModelChange)="controlModified()">
|
||||
<mat-error *ngIf="getFormControl('periodTo').errors?.backendError">{{baseErrorModel['Criteria.PeriodTo']}}</mat-error>
|
||||
<mat-datepicker-toggle matSuffix [for]="periodToPicker"></mat-datepicker-toggle>
|
||||
<mat-datepicker #periodToPicker></mat-datepicker>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-sm-6 col-md-5">
|
||||
<mat-form-field>
|
||||
<mat-select placeholder="{{'CRITERIA.FORMS.TYPE' | translate}}"
|
||||
formControlName="type"
|
||||
(change)="controlModified()">
|
||||
<mat-option>{{'TYPES.FORM-TYPE.ANY' | translate}}</mat-option>
|
||||
<mat-option *ngFor="let type of getFormTypeValues()" [value]="type">{{getFormTypeWithLanguage(type)}}</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-sm-6 col-md-3">
|
||||
<mat-form-field>
|
||||
<mat-select placeholder="{{'CRITERIA.FORMS.STATUS' | translate}}"
|
||||
formControlName="status"
|
||||
(change)="controlModified()"
|
||||
multiple>
|
||||
<mat-option *ngFor="let status of getFormStatusValues()" [value]="status">{{getFormStatusWithLanguage(status)}}</mat-option>
|
||||
</mat-select>
|
||||
[matDatepicker]="periodEndPicker"
|
||||
[ngModel]="this.criteria.PeriodEnd" (ngModelChange)="controlModified()">
|
||||
<mat-error *ngIf="getFormControl('periodEnd').errors?.backendError">{{baseErrorModel['Criteria.PeriodEnd']}}</mat-error>
|
||||
<mat-datepicker-toggle matSuffix [for]="periodEndPicker"></mat-datepicker-toggle>
|
||||
<mat-datepicker #periodEndPicker></mat-datepicker>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -23,10 +23,9 @@ export class ProjectCriteriaComponent extends BaseCriteriaComponent implements O
|
|||
|
||||
constructor(
|
||||
public language: TranslateService,
|
||||
public errorModel: ProjectCriteriaErrorModel,
|
||||
public formBuilder: FormBuilder
|
||||
) {
|
||||
super(errorModel);
|
||||
super(new ProjectCriteriaErrorModel());
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
|
|
|
|||
|
|
@ -5,23 +5,31 @@ import { NavigationComponent } from './components/navigation/navigation.componen
|
|||
import { SnackBarNotificationComponent } from './components/notificaiton/snack-bar-notification.component';
|
||||
import { MaterialModule } from './material/material.module';
|
||||
import { TranslateModule } from '@ngx-translate/core';
|
||||
import { ProjectCriteriaComponent } from './components/criteria/projects/projects-criteria.component';
|
||||
import { FormsModule } from '@angular/forms';
|
||||
import { DataManagementPlanCriteriaComponent } from './components/criteria/data-management-plan/dmp-criteria.component';
|
||||
|
||||
@NgModule({
|
||||
imports: [
|
||||
CommonModule,
|
||||
RouterModule,
|
||||
MaterialModule,
|
||||
TranslateModule
|
||||
RouterModule,
|
||||
MaterialModule,
|
||||
TranslateModule,
|
||||
FormsModule
|
||||
],
|
||||
|
||||
declarations: [
|
||||
NavigationComponent,
|
||||
SnackBarNotificationComponent
|
||||
NavigationComponent,
|
||||
SnackBarNotificationComponent,
|
||||
ProjectCriteriaComponent,
|
||||
DataManagementPlanCriteriaComponent
|
||||
],
|
||||
|
||||
exports: [
|
||||
NavigationComponent,
|
||||
SnackBarNotificationComponent
|
||||
NavigationComponent,
|
||||
SnackBarNotificationComponent,
|
||||
ProjectCriteriaComponent,
|
||||
DataManagementPlanCriteriaComponent
|
||||
],
|
||||
entryComponents: [
|
||||
]
|
||||
|
|
|
|||
|
|
@ -3,8 +3,8 @@ import { RouterModule, Routes } from '@angular/router';
|
|||
|
||||
import { TabComponent } from './tabs.component';
|
||||
import { AuthGuard } from '../guards/auth.guard';
|
||||
import { ProjectsComponent } from '../projects/projects.component';
|
||||
import { DmpComponent } from '../dmps/dmp.component';
|
||||
import { ProjectListingComponent } from '../projects/project-listing.component';
|
||||
import { DataManagementPlanListingComponent } from '../dmps/dmp-listing.component';
|
||||
|
||||
const tabsRoutes: Routes = [
|
||||
{
|
||||
|
|
@ -12,16 +12,16 @@ const tabsRoutes: Routes = [
|
|||
children: [
|
||||
{
|
||||
path: 'projects',
|
||||
component: ProjectsComponent
|
||||
component: ProjectListingComponent
|
||||
},
|
||||
{
|
||||
path: 'dmps',
|
||||
component: DmpComponent
|
||||
component: DataManagementPlanListingComponent
|
||||
}
|
||||
]
|
||||
},
|
||||
{ path: 'tabs/projects', component: ProjectsComponent }, // canActivate: [AuthGuard]
|
||||
{ path: 'tabs/dmps', component: DmpComponent }
|
||||
// { path: 'tabs/projects', component: ProjectListingComponent }, // canActivate: [AuthGuard]
|
||||
// { path: 'tabs/dmps', component: DataManagementPlanListingComponent }
|
||||
];
|
||||
|
||||
@NgModule({
|
||||
|
|
|
|||
|
|
@ -0,0 +1,6 @@
|
|||
import { ValidationContext } from "../validators/ValidationContext";
|
||||
import { FormGroup } from "@angular/forms";
|
||||
|
||||
export interface FormGenerator {
|
||||
buildForm(validation: ValidationContext, disabled?: boolean): FormGroup;
|
||||
}
|
||||
|
|
@ -1,7 +1,7 @@
|
|||
import { ValidatorFn } from '@angular/forms';
|
||||
|
||||
export class ValidationContext {
|
||||
validation: Validation[];
|
||||
validation: Validation[] = [];
|
||||
|
||||
getValidation(key: string): Validation {
|
||||
for (let i = 0; i < this.validation.length; i++) {
|
||||
|
|
|
|||
|
|
@ -1,5 +1,37 @@
|
|||
{
|
||||
"NAV-BAR": {
|
||||
"TITLE": "DMPS"
|
||||
},
|
||||
"PROJECT-LISTING": {
|
||||
"TITLE": "Projects",
|
||||
"COLUMNS": {
|
||||
"NAME": "Name",
|
||||
"ABBREVIATION": "Abbreviation",
|
||||
"START": "Start",
|
||||
"END": "End",
|
||||
"ACTIONS": "Actions"
|
||||
}
|
||||
},
|
||||
"DMP-LISTING": {
|
||||
"TITLE": "Data Management Plans",
|
||||
"COLUMNS": {
|
||||
"NAME": "Name",
|
||||
"ABBREVIATION": "Abbreviation",
|
||||
"START": "Start",
|
||||
"END": "End",
|
||||
"ACTIONS": "Actions"
|
||||
}
|
||||
},
|
||||
"PROJECT-EDITOR": {
|
||||
"TITLE": {
|
||||
"NEW": "New Project",
|
||||
"EDIT": "Edit"
|
||||
}
|
||||
},
|
||||
"CRITERIA": {
|
||||
"FORMS": {
|
||||
"PERIOD-FROM": "Start",
|
||||
"PERIOD-TO": "End"
|
||||
}
|
||||
}
|
||||
}
|
||||
Loading…
Reference in New Issue