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

Implemented a workspace component

This commit is contained in:
Nikolaos Laskaris 2017-11-06 15:11:03 +02:00
parent 728c21a515
commit 9428ab55a9
18 changed files with 158 additions and 34 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
dmp-frontend/src/app/app-routing.module.ts
View File

@ -1,27 +1,32 @@
import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import { PageNotFoundComponent } from './not-found.component';
import { EmptyComponent } from './empty.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 { UserWorkspaceComponent } from './user-workspace/user-workspace.component';
import { MainSignInComponent } from './login/main-sign-in/main-sign-in.component';
const appRoutes: Routes = [
{ path: 'dynamic-form', component: DynamicFormComponent, canActivate: [AuthGuard] },
{ path: 'login', component: MainSignInComponent},
{ path: 'projects', component: ProjectsComponent},
{ path: 'dmps', component: DmpComponent},
{ path: '', redirectTo: '/login', pathMatch: 'full' },
//{ path: 'projects', component: ProjectsComponent},
//{ path: 'dmps', component: DmpComponent},
{ path: 'workspace', component: UserWorkspaceComponent},
//{ path: '', component: EmptyComponent},
//{ path: '', redirectTo: '/login', pathMatch: 'full' },
{ path: '**', component: PageNotFoundComponent },
/*
{
path: '',
redirectTo: 'app-root',
pathMatch: 'full'
}
*/
];
@NgModule({

8
dmp-frontend/src/app/app.component.html
View File

@ -44,10 +44,10 @@
<div id="appSidebar" class="sidenav child_div">
<!--<a href="javascript:void(0)" class="closebtn" (click)='slideNav()'>&times;</a>-->
<a href="#">About</a>
<a href="#">Services</a>
<a href="#">Clients</a>
<a href="#">Contact</a>
<a class="cursor">My Workspace</a>
<a class="cursor">Orphan Datasets</a>
<a class="cursor">Clients</a>
<a class="cursor">Contact</a>
</div>
<div id="appBody" class="child_div">

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

@ -21,6 +21,7 @@ import { DynamicFormGroupComponent } from './form/dynamic-form-group/dynamic-for
import { AppRoutingModule } from './app-routing.module';
import { AuthGuard } from './guards/auth.guard';
import { PageNotFoundComponent } from './not-found.component';
import { EmptyComponent } from './empty.component';
import { TocComponent } from './form/tableOfContents/toc.component';
import { PaginationService } from './services/pagination.service';
@ -60,6 +61,7 @@ import { ModalComponent } from './modal/modal.component';
import { StatusToString } from './pipes/various/status-to-string';
import { SidebarModule } from 'ng-sidebar';
import { UserWorkspaceComponent } from './user-workspace/user-workspace.component';
@ -75,11 +77,13 @@ import { SidebarModule } from 'ng-sidebar';
GooggleSignInComponent,
MainSignInComponent,
PageNotFoundComponent,
EmptyComponent,
ModalComponent,
ProjectDetailComponent,
ProjectsComponent,
DmpComponent,
DatasetsComponent,
UserWorkspaceComponent,
ProjectTableFilterPipe,
DmpVersionFilterPipe,

22
dmp-frontend/src/app/datasets/dataset.component.ts
View File

@ -87,8 +87,7 @@ export class DatasetsComponent implements OnInit {
this.datasetProfileDropDown.options = [];
this.saveAndDescribe = false;
this.statusDropDown = new DropdownField();
this.statusDropDown.options =[];
this.statusDropDown.options= [{key:'0', value:"active"},{key:'1', value:"inactive"}]
this.statusDropDown.options= [{key:'', value:null},{key:'0', value:"Active"},{key:'1', value:"Inactive"}]
}
@ -115,6 +114,7 @@ export class DatasetsComponent implements OnInit {
)
}
SaveDataset(){
if(this.dataset.id ==null){
this.dataset.dmp = { "id": this.dmpIdforDatasets }
@ -130,7 +130,6 @@ export class DatasetsComponent implements OnInit {
$("#newDatasetModal").modal("hide");
}
else{
this.dataset.dmp = { "id": this.dmpIdforDatasets }
this.dataset.profile = { "id": this.dataset.profile }
@ -166,10 +165,11 @@ export class DatasetsComponent implements OnInit {
editRow(item, event) {
if (event.toElement.id == "editDataset"){
this.dataset = item;
this.dataset.label = item.label;
this.dataset.uri = item.uri;
//this.dataset.dmp = item.dmp;
this.dataset.profile = item.profile.id;
this.dataset.profile = item.profile==null ? null : item.profile.id;
this.dataset.id = item.id;
$("#newDatasetModal").modal("show");
}
@ -196,4 +196,18 @@ export class DatasetsComponent implements OnInit {
this.ngZone.run(() => this.router.navigate(['dynamic-form', {id: item.profile.id, datasetId:item.id}]));
}
deleteRow(dataset, $event){
this.serverService.deleteDataset(dataset).subscribe(
response => {
console.log("Deleted Successfully the dataset")
},
err => {
console.log("Could not delete the dataset")
}
);
this.getDatasets();
}
}

11
dmp-frontend/src/app/datasets/dataset.html
View File

@ -10,10 +10,9 @@
</th>
<th colspan="1">
<!-- <input class="form-control" [(ngModel)]="versionFilter" placeholder='Filter' /> -->
<select class="form-control" [id]="statusid" [(ngModel)]="statusFilter" [name]="statusDropDown"
#datasetfield >
<select class="form-control" [id]="statusid" [(ngModel)]="statusFilter" [name]="statusDropDown" #datasetfield >
<option *ngFor="let opt of statusDropDown.options" [value]="opt.key">{{opt.value}}</option>
</select>
</select>
</th>
<th>
<button class="btn btn-default" (click)="getDatasets()">
@ -63,7 +62,7 @@
<td>{{dataset?.created | date:'yyyy-MM-dd HH:mm:ss Z'}}</td>
<td>{{dataset?.status | statusToString }}</td>
<td><a class="editGridColumn" (click)="editRow(dataset, $event)"><i class="fa fa-pencil fa-fw" data-toggle="tooltip" title="edit Properties" id="editDataset"></i>
<i class="fa fa-eraser fa-fw" data-toggle="tooltip" title="delete Dataset"></i>
<i class="fa fa-eraser fa-fw" data-toggle="tooltip" (click)="deleteRow(dataset, $event)" title="delete Dataset"></i>
<i class="fa fa-list-alt fa-fw" data-toggle="tooltip" title="describe dataset" id="describeDataset"></i></a></td>
</tr>
@ -84,13 +83,13 @@
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Dataset</h5>
<h5 class="modal-title" >Dataset</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
<form #newProjectForm="ngForm" (ngSubmit)="SaveNewDmp()">
<form #newProjectForm="ngForm" (ngSubmit)="SaveDataset()">
<div class="form-group">
<label for="recipient-name" class="col-form-label">Dataset Profile:</label>
<select class="form-control" [id]="datasetProfileDropDownKey" [(ngModel)]="dataset.profile" [name]="datasetProfileDropDown"

18
dmp-frontend/src/app/dmps/dmp.component.ts
View File

@ -216,6 +216,24 @@ newDmp(item){
$("#newDmpModal").modal("show");
}
deleteRow(dmp, $event){
console.log("delete row")
console.log(dmp);
console.log($event)
this.serverService.deleteDmp(dmp).subscribe(
response => {
console.log("Deleted Successfully the dmp")
},
(err: HttpErrorResponse) => {
console.log("Could not delete the dmp")
}
);
this.getDmps();
}
}

3
dmp-frontend/src/app/dmps/dmps.html
View File

@ -70,9 +70,8 @@
<td>{{dmp?.status | statusToString }}</td>
<td><a class="editGridColumn" (click)="editRow(dmp, $event)"><i class="fa fa-pencil fa-fw" data-toggle="tooltip" title="edit properties" id="editDMP"></i>
<i class="fa fa-clone fa-fw" data-toggle="tooltip" title="create new version" id="changeVersionDMP"></i>
<i class="fa fa-eraser fa-fw" data-toggle="tooltip" title="delete DMP"></i>
<i class="fa fa-eraser fa-fw" data-toggle="tooltip" (click)="deleteRow(dmp, $event)" title="delete DMP"></i>
<i class="fa fa-table fa-fw" data-toggle="tooltip" title="show dataset for this DMP" id="showDatasets"></i></a></td>
</tr>
</tbody>
<tfoot>

6
dmp-frontend/src/app/empty.component.ts Normal file
View File

@ -0,0 +1,6 @@
import { Component } from '@angular/core';
@Component({
template: ''
})
export class EmptyComponent {}

2
dmp-frontend/src/app/login/googgle-sign-in/googgle-sign-in.component.ts
View File

@ -57,7 +57,7 @@ export class GooggleSignInComponent implements OnInit, AfterViewInit {
//simple_notifier("success",null,"Successful login");
let profile = googleUser.getBasicProfile();
this.tokenService.login(googleUser.getAuthResponse().id_token, TokenProvider.google, profile.getName(), profile.getEmail());
this.router.navigate(['/dmps'], { queryParams: { /*returnUrl: this.state.url*/ }});
this.router.navigate(['/workspace'], { queryParams: { /*returnUrl: this.state.url*/ }});
},
function (error) {
//simple_notifier("danger",null,"Failed to login");

6
dmp-frontend/src/app/login/main-sign-in/main-sign-in.component.ts
View File

@ -37,6 +37,10 @@ export class MainSignInComponent implements OnInit {
ngOnInit() {
this.createProjectEditorForm();
//debugger;
if(this.tokenService.isLoggedIn()){
this.router.navigate(['workspace'], { queryParams: { /*returnUrl: this.state.url*/ }});
}
}
@ -49,7 +53,7 @@ export class MainSignInComponent implements OnInit {
simple_notifier("success",null,"Successful login");
this.tokenService.login(response['token'], TokenProvider.native, this.creds.username, response['email']);
this.router.navigate(['/dmps'], { queryParams: { /*returnUrl: this.state.url*/ }});
this.router.navigate(['/workspace'], { queryParams: { /*returnUrl: this.state.url*/ }});
},
err => {
simple_notifier("danger",null,"Failed to login");

8
dmp-frontend/src/app/pipes/dataset-status-filter.pipe.ts
View File

@ -6,16 +6,14 @@ import { Pipe, PipeTransform } from "@angular/core";
})
export class DatasetStatusFilterPipe implements PipeTransform {
transform(array: any[], status: string): any {
transform(array: any[], status: number): any {
if (status) {
return _.filter(array, row => {
return (
row.uri.indexOf(status) > -1 ||
//row.version == query ||
row.id.indexOf(status) > -1
row.status == status
)
});

7
dmp-frontend/src/app/pipes/dataset-table-filter.pipe.ts
View File

@ -16,10 +16,9 @@ export class DatasetTableFilterPipe implements PipeTransform {
if (row.id == null) row.id = "";
return (
row.label.indexOf(query) > -1 ||
//row.version == query ||
row.id.indexOf(query) > -1
row.label.indexOf(query) > -1
//|| row.version == query
//|| row.id.indexOf(query) > -1
)
});

6
dmp-frontend/src/app/services/rest-base.ts
View File

@ -18,14 +18,14 @@ export class RestBase {
/*
/*
protocol: string = "http";
hostname: string ="dl010.madgik.di.uoa.gr" ;//"localhost";//"dl010.madgik.di.uoa.gr";//
port: number = 8080;//8080;//
webappname: string = "dmp-backend";//"dmp-backend-new";//
*/
*/
protocol: string = "http";
hostname: string = "dionysus.di.uoa.gr" ;

8
dmp-frontend/src/app/services/server.service.ts
View File

@ -106,6 +106,9 @@ export class ServerService {
return this.restBase.post("dmp/update", data);
}
public deleteDmp(dmp: any){
return this.restBase.post("dmp/softdelete", dmp);
}
public getDatasetForDmp(data:any){
return this.restBase.post("dmp/getdatasets", data);
@ -127,6 +130,11 @@ public updateDatsetsProfile(data:any){
return this.restBase.post("dataset/update", data);
}
public deleteDataset(dataset: any){
return this.restBase.post("dataset/softdelete", dataset);
}
logOut() {
this.tokenService.logout();

0
dmp-frontend/src/app/user-workspace/user-workspace.component.css Normal file
View File

26
dmp-frontend/src/app/user-workspace/user-workspace.component.html Normal file
View File

@ -0,0 +1,26 @@
<ul class="nav nav-tabs">
<li class="active">
<a href="#my-dmps" data-toggle="tab">My DMPs</a>
</li>
<li>
<a href="#all-projects" data-toggle="tab">Projects</a>
</li>
</ul>
<div class="tab-content clearfix">
<div class="tab-pane active" id="my-dmps">
<dmps></dmps>
</div>
<div class="tab-pane" id="all-projects">
<projects></projects>
</div>
<div class="tab-pane" id="3a">
<h3>We applied clearfix to the tab-content to rid of the gap between the tab and the content</h3>
</div>
<div class="tab-pane" id="4a">
<h3>We use css to change the background color of the content to be equal to the tab</h3>
</div>
</div>

25
dmp-frontend/src/app/user-workspace/user-workspace.component.spec.ts Normal file
View File

@ -0,0 +1,25 @@
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { UserWorkspaceComponent } from './user-workspace.component';
describe('UserWorkspaceComponent', () => {
let component: UserWorkspaceComponent;
let fixture: ComponentFixture<UserWorkspaceComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ UserWorkspaceComponent ]
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(UserWorkspaceComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should be created', () => {
expect(component).toBeTruthy();
});
});

19
dmp-frontend/src/app/user-workspace/user-workspace.component.ts Normal file
View File

@ -0,0 +1,19 @@
import { Component, OnInit } from '@angular/core';
import { DmpComponent } from '../dmps/dmp.component';
import { ProjectsComponent } from '../projects/projects.component';
@Component({
selector: 'app-user-workspace',
templateUrl: './user-workspace.component.html',
styleUrls: ['./user-workspace.component.css']
})
export class UserWorkspaceComponent implements OnInit {
constructor() { }
ngOnInit() {
}
}