MaDgiK-CITE
/
argos
13
0
Fork 0
Code Issues Pull Requests Projects Releases 3 Wiki Activity

dataset table

This commit is contained in:
annampak 2017-12-15 17:33:18 +02:00
parent d134efcb55
commit 6c669a1571
9 changed files with 258 additions and 69 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
dmp-frontend/src/app/app.module.ts
View File

@ -104,7 +104,9 @@ 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 { DatasetListingComponent } from './datasets_new/dataset-listing.component';
import { DashboardService } from './services/dashboard/dashboard.service';
import { DatasetService } from './services/dataset/dataset.service';
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';
@ -133,6 +135,7 @@ import { FigurecardComponent } from './shared/components/figurecard/figurecard.c
HomepageComponent,
ModalComponent,
ProjectListingComponent,
DatasetListingComponent,
DataManagementPlanListingComponent,
DatasetsComponent,
ConfirmationComponent,
@ -196,7 +199,7 @@ import { FigurecardComponent } from './shared/components/figurecard/figurecard.c
},
ServerService, VisibilityRulesService, PaginationService, GlobalVariables, AuthGuard, TokenService,
LocalStorageService, RestBase, EestoreService, NativeLoginService, PDFService,
AuthService,DashboardService,
AuthService,DashboardService,DatasetService,
BaseHttpService
],
bootstrap: [AppComponent]

0
dmp-frontend/src/app/datasets_new/dataset-listing.component.css Normal file
View File

59
dmp-frontend/src/app/datasets_new/dataset-listing.component.html Normal file
View File

@ -0,0 +1,59 @@
<div class="container-fluid">
<h3>{{'DATASET-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="label">
<mat-header-cell *matHeaderCellDef>{{'DATASET-LISTING.COLUMNS.NAME' | translate}}</mat-header-cell>
<mat-cell *matCellDef="let row">{{row.label}}</mat-cell>
</ng-container>
<!-- Column Definition: Reference -->
<ng-container cdkColumnDef="reference">
<mat-header-cell *matHeaderCellDef>{{'DATASET-LISTING.COLUMNS.REFERNCE' | translate}}</mat-header-cell>
<mat-cell *matCellDef="let row"> {{row.reference}} </mat-cell>
</ng-container>
<!-- Column Definition: Uri -->
<ng-container cdkColumnDef="uri">
<mat-header-cell *matHeaderCellDef>{{'DATASET-LISTING.COLUMNS.URI' | translate}}</mat-header-cell>
<mat-cell *matCellDef="let row"> {{row.uri}} </mat-cell>
</ng-container>
<!-- Column Definition: Status -->
<ng-container cdkColumnDef="status">
<mat-header-cell *matHeaderCellDef>{{'DATASET-LISTING.COLUMNS.STATUS' | translate}}</mat-header-cell>
<mat-cell *matCellDef="let row"> {{row.status}} </mat-cell>
</ng-container>
<!-- Column Definition: Description -->
<ng-container cdkColumnDef="description">
<mat-header-cell *matHeaderCellDef>{{'DATASET-LISTING.COLUMNS.DESCRIPTION' | translate}}</mat-header-cell>
<mat-cell *matCellDef="let row"> {{row.description}} </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>

128
dmp-frontend/src/app/datasets_new/dataset-listing.component.ts Normal file
View File

@ -0,0 +1,128 @@
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 { ProjectCriteriaComponent } from "../shared/components/criteria/projects/projects-criteria.component";
import { ProjectCriteria } from "../models/criteria/project/ProjectCriteria";
import { Observable } from "rxjs/Observable";
import { DataTableRequest } from "../models/data-table/DataTableRequest";
import { SnackBarNotificationComponent } from "../shared/components/notificaiton/snack-bar-notification.component";
import { DatasetService } from "../services/dataset/dataset.service";
import { DatasetListingModel } from "../models/datasets/DatasetListingModel";
@Component({
selector: 'app-dataset-listing-component',
templateUrl: 'dataset-listing.component.html',
styleUrls: ['./dataset-listing.component.css'],
providers: [DatasetService]
})
export class DatasetListingComponent implements OnInit, AfterViewInit {
@ViewChild(MatPaginator) _paginator: MatPaginator;
@ViewChild(MatSort) sort: MatSort;
@ViewChild(ProjectCriteriaComponent) criteria: ProjectCriteriaComponent;
dataSource: DatasetDataSource | null;
displayedColumns: String[] = ['label', 'reference', 'uri', 'status', 'description', 'actions'];
constructor(
private datasetService: DatasetService,
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 DatasetDataSource(this.datasetService, this._paginator, this.sort, this.languageService, this.snackBar, this.criteria, );
}
rowClick(rowId: String) {
this.router.navigate(['/project/' + rowId]);
}
getDefaultCriteria(): ProjectCriteria {
const defaultCriteria = new ProjectCriteria();
return defaultCriteria;
}
}
export class DatasetDataSource extends DataSource<DatasetListingModel> {
totalCount = 0;
isLoadingResults = false;
constructor(
private _service: DatasetService,
private _paginator: MatPaginator,
private _sort: MatSort,
private _languageService: TranslateService,
private _snackBar: MatSnackBar,
private _criteria: ProjectCriteriaComponent
) {
super();
}
connect(): Observable<DatasetListingModel[]> {
const displayDataChanges = [
this._paginator.page
//this._sort.matSortChange
];
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.data;
})
.map(result => {
if (!result) { return []; }
if (this._paginator.pageIndex === 0) { this.totalCount = result.totalCount; }
return result.data;
});
}
disconnect() {
// No-op
}
}

68
dmp-frontend/src/app/homepage/homepage.component.html
View File

@ -99,71 +99,5 @@
</div>
<div class="container">
<!-- <app-navbar title="Table List"></app-navbar> -->
<div class="row">
<div class="col-mat-12">
<div class="card-dataset">
<div class="card-header">
<i class="material-icons">assignment</i>
<a style = "cursor:pointer;"><i class="material-icons">add_circle</i></a>
</div>
<div class="card-content">
<h4 class="card-title">Active Datasets</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>
<app-dataset-listing-component></app-dataset-listing-component>
</div>

2
dmp-frontend/src/app/homepage/homepage.component.ts
View File

@ -4,6 +4,7 @@ import { ServerService } from '../../app/services/server.service';
import { DashboardService } from '../../app/services/dashboard/dashboard.service';
import { DashboardStatisticsModel } from '../models/dashboard/DashboardStatisticsModel';
import { JsonSerializer } from '../utilities/JsonSerializer';
import { DatasetListingComponent } from '../../app/datasets_new/dataset-listing.component';
@Component({
selector: 'homepage',
@ -33,7 +34,6 @@ export class HomepageComponent implements OnInit{
);
this.dashBoardService.getStatistics().subscribe(data =>{
debugger;
this.dashboardStatisticsData = new JsonSerializer<DashboardStatisticsModel>().fromJSONObject(data,DashboardStatisticsModel);
})

21
dmp-frontend/src/app/models/datasets/DatasetListingModel.ts Normal file
View File

@ -0,0 +1,21 @@
import { Serializable } from "../Serializable";
export class DatasetListingModel implements Serializable<DatasetListingModel> {
public id: String;
private label:String;
private reference: String;
private uri: String;
private description: String;
private status: Number;
fromJSONObject(item: any): DatasetListingModel {
this.id = item.id;
this.label = item.label;
this.reference = item.reference;
this.uri = item.uri;
this.status = item.status;
this.description = item.description;
return this;
}
}

34
dmp-frontend/src/app/services/dataset/dataset.service.ts Normal file
View File

@ -0,0 +1,34 @@
import 'rxjs/add/operator/map';
import { HttpClient, HttpHeaders } from '@angular/common/http';
import { Injectable } from '@angular/core';
import { HostConfiguration } from './../../app.constants';
import { BaseHttpService } from '../../utilities/cite-http-service-module/base-http.service';
import { Observable } from 'rxjs/Observable';
import { DataTableRequest } from '../../models/data-table/DataTableRequest';
import { DataTableData } from '../../models/data-table/DataTableData';
import { DatasetListingModel } from '../../models/datasets/DatasetListingModel';
@Injectable()
export class DatasetService {
private actionUrl: string;
private headers: HttpHeaders;
constructor(private http: BaseHttpService) {
this.actionUrl = HostConfiguration.Server + 'datasets/';
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<DatasetListingModel>> {
return this.http.post<DataTableData<DatasetListingModel>>(this.actionUrl + 'getPaged', dataTableRequest, { headers: this.headers });
}
// getSingle(id: string): Observable<ProjectModel> {
// return this.http.get<ProjectModel>(this.actionUrl + id, { headers: this.headers });
// }
}

10
dmp-frontend/src/assets/lang/en.json
View File

@ -22,6 +22,16 @@
"ACTIONS": "Actions"
}
},
"DATASET-LISTING": {
"TITLE": "Datasets",
"COLUMNS": {
"NAME": "Name",
"REFERNCE": "Reference",
"URI": "Uri",
"STATUS": "Status",
"DESCRIPTION": "Description"
}
},
"PROJECT-EDITOR": {
"TITLE": {
"NEW": "New Project",