diff --git a/dmp-frontend/src/app/app-routing.module.ts b/dmp-frontend/src/app/app-routing.module.ts index c128949dd..5f5c491d1 100644 --- a/dmp-frontend/src/app/app-routing.module.ts +++ b/dmp-frontend/src/app/app-routing.module.ts @@ -15,7 +15,7 @@ import { BreadcrumbService } from './services/breadcrumb.service'; const appRoutes: Routes = [ //{ path: 'dynamic-form/:id', component: DynamicFormComponent, canActivate: [AuthGuard] }, { path: 'dynamic-form', component: DynamicFormComponent, canActivate: [AuthGuard] }, - //{ path: 'dataset', component: DatasetsComponent }, + { path: 'dataset', component: DatasetsComponent }, { path: 'login', component: MainSignInComponent}, { path: 'projects', component: ProjectsComponent}, { path: 'dmps', component: DmpComponent}, diff --git a/dmp-frontend/src/app/app.component.html b/dmp-frontend/src/app/app.component.html index d9b7e651f..4ee6d4ad0 100644 --- a/dmp-frontend/src/app/app.component.html +++ b/dmp-frontend/src/app/app.component.html @@ -61,8 +61,8 @@ -
- +
+
diff --git a/dmp-frontend/src/app/app.component.ts b/dmp-frontend/src/app/app.component.ts index e6e2273b3..817af16be 100644 --- a/dmp-frontend/src/app/app.component.ts +++ b/dmp-frontend/src/app/app.component.ts @@ -3,11 +3,12 @@ import { ServerService } from './services/server.service'; import { FieldBase } from '../app/form/fields/field-base'; import { JsonObjest } from '../app/entities/JsonObject.class'; import { TokenService, TokenProvider } from './services/login/token.service'; -import { Router, CanActivate, ActivatedRouteSnapshot, RouterStateSnapshot } from '@angular/router'; +import { Router, CanActivate, ActivatedRouteSnapshot, RouterStateSnapshot, ActivatedRoute, NavigationExtras } from '@angular/router'; import { MainSignInComponent } from './login/main-sign-in/main-sign-in.component'; import {BreadcrumbModule,MenuItem} from 'primeng/primeng'; import { BreadcrumbService } from './services/breadcrumb.service'; +import { BreadcrumbComponent } from './widgets/breadcrumb/breadcrumb.component'; import { AutocompleteRemoteComponent } from './form/fields/autocomplete-remote/autocomplete-remote.component'; @@ -31,7 +32,7 @@ export class AppComponent implements OnInit { - constructor(private tokenService : TokenService, private router: Router, private breadcrumbService : BreadcrumbService) { + constructor(private tokenService : TokenService, private router: Router, private breadcrumbService : BreadcrumbService, private route: ActivatedRoute) { } @@ -44,6 +45,7 @@ export class AppComponent implements OnInit { this.breadcrumbData = data; } ); + this.breadcrumbService.breadcrumbHomeEmitter.subscribe( (data) => { this.breadcrumbHome = data; diff --git a/dmp-frontend/src/app/app.module.ts b/dmp-frontend/src/app/app.module.ts index b7ee0bb57..389735956 100644 --- a/dmp-frontend/src/app/app.module.ts +++ b/dmp-frontend/src/app/app.module.ts @@ -70,6 +70,7 @@ import { UserWorkspaceComponent } from './user-workspace/user-workspace.componen import { AutocompleteRemoteComponent } from './form/fields/autocomplete-remote/autocomplete-remote.component'; import { Ng4LoadingSpinnerModule } from 'ng4-loading-spinner'; +import { BreadcrumbComponent } from './widgets/breadcrumb/breadcrumb.component'; @@ -100,7 +101,8 @@ import { Ng4LoadingSpinnerModule } from 'ng4-loading-spinner'; DmpTableFilterPipe, DatasetTableFilterPipe, DatasetStatusFilterPipe, - StatusToString + StatusToString, + BreadcrumbComponent ], imports: [ BrowserModule, diff --git a/dmp-frontend/src/app/datasets/dataset.component.ts b/dmp-frontend/src/app/datasets/dataset.component.ts index 57c66c9ae..05423a030 100644 --- a/dmp-frontend/src/app/datasets/dataset.component.ts +++ b/dmp-frontend/src/app/datasets/dataset.component.ts @@ -41,6 +41,8 @@ export class DatasetsComponent implements OnInit { public sortBy = "label"; public sortOrder = "asc"; + dmpIdforDatasets: string; + // for tableIds showIDs : boolean = false; @@ -50,25 +52,14 @@ export class DatasetsComponent implements OnInit { @Input() datasets: Dataset[]; @Input() datasetProfileDropDown: DropdownField; @Input() datasetCount = 0; - @Input() dmpIdforDatasets: string; + @Input() dmpLabelforDatasets: string; @Input() statusDropDown: DropdownField; dataset: any; saveAndDescribe:boolean; - - dataSetValue: boolean - @Input() - get dataSetVisibe() { - return this.dataSetValue; - } - @Output() - public dataSetValueChange = new EventEmitter(); - - set dataSetVisibe(value: any) { - this.dataSetValue = value - this.dataSetValueChange.emit(this.dataSetValue) - } + dataSetValue: boolean = true; + constructor( @@ -77,21 +68,27 @@ export class DatasetsComponent implements OnInit { private router: Router, private ngZone: NgZone, private spinnerService: Ng4LoadingSpinnerService) { + this.dataset = this.createEmptyDataset(); this.datasetProfileDropDown = new DropdownField(); this.datasetProfileDropDown.options = []; this.saveAndDescribe = false; this.statusDropDown = new DropdownField(); - this.statusDropDown.options= [{key:'', value:null},{key:'0', value:"Active"},{key:'1', value:"Inactive"}, {key:'2', value:"Submitted"}, {key:'3', value:"Cancel"}] + this.statusDropDown.options= [{key:'', value:null},{key:'0', value:"Active"},{key:'1', value:"Inactive"}] } ngOnInit() { - //this.projects = this.serverService.getDummyProjects(); - this.datasets = []; - console.log(this.dmpIdforDatasets); - this.getDatasets(); + + + this.route + .queryParams + .subscribe(params => { + this.dmpIdforDatasets = params['dmpid']; + this.getDatasets(); + }); + this.serverService.getAllDatsetsProfile().subscribe( response => { diff --git a/dmp-frontend/src/app/dmps/dmp.component.ts b/dmp-frontend/src/app/dmps/dmp.component.ts index f7f8395a2..bf7ef8414 100644 --- a/dmp-frontend/src/app/dmps/dmp.component.ts +++ b/dmp-frontend/src/app/dmps/dmp.component.ts @@ -217,24 +217,6 @@ export class DmpComponent implements OnInit{ } - showDatasetsOfDmp(item){ - this.stateConfig.dmps.selectedID = item.id; - this.stateConfig.dmps.selectedLabel = item.label; - if(this.stateConfig.datasets.tableVisible == false){ - this.stateConfig.datasets.tableVisible = true; - this.stateConfig.dmps.tableVisible = false; - - this.breadcrumbData.push({label:"Datasets of '"+this.stateConfig.dmps.selectedLabel+"'" /* , command:""*/}) - this.breadcrumbService.breadcrumbDataEmitter.emit(this.breadcrumbData); - } - else{ - this.datasetsComponent.getDatasetForDmpMethod(item.id); - - } - } - - - editDmp(item){ this.dmp = item; this.dmp.project = item.project.id; @@ -311,5 +293,10 @@ export class DmpComponent implements OnInit{ } + showDatasetsOfDmp(item){ + this.router.navigate(['/dataset'], { queryParams: { "dmpid":item.id }}); + } + + } diff --git a/dmp-frontend/src/app/dmps/dmps.html b/dmp-frontend/src/app/dmps/dmps.html index 32869b670..882c2075c 100644 --- a/dmp-frontend/src/app/dmps/dmps.html +++ b/dmp-frontend/src/app/dmps/dmps.html @@ -227,10 +227,6 @@
- - - - diff --git a/dmp-frontend/src/app/form/dynamic-form.component.ts b/dmp-frontend/src/app/form/dynamic-form.component.ts index 7d403354a..d50ea7b66 100644 --- a/dmp-frontend/src/app/form/dynamic-form.component.ts +++ b/dmp-frontend/src/app/form/dynamic-form.component.ts @@ -17,6 +17,9 @@ import { AutocompleteRemoteComponent } from './fields/autocomplete-remote/autoco import { AngularDraggableModule } from 'angular2-draggable'; +import {MenuItem} from 'primeng/primeng'; +import { BreadcrumbService } from '../services/breadcrumb.service'; + import './../../assets/xml2json.min.js'; declare var X2JS: any; @@ -64,7 +67,7 @@ export class DynamicFormComponent implements OnInit { expandedToc : boolean = true; - constructor(private qcs: FieldControlService, private serverService: ServerService, private dataModelService: dataModelBuilder, private router: Router, + constructor(private qcs: FieldControlService, private breadcrumbService : BreadcrumbService, private serverService: ServerService, private dataModelService: dataModelBuilder, private router: Router, private route: ActivatedRoute, private pagerService: PaginationService, private tokenService: TokenService) { this.form = this.qcs.toFormGroup(new Array(), new Array()); this.xml2jsonOBJ = new X2JS(); @@ -77,6 +80,7 @@ export class DynamicFormComponent implements OnInit { ngOnInit() { +/* //this.route.fragment.subscribe(fragment => { this.fragment = fragment; }); //navigate to certain section of the page, it doesn't use anymore let sub = this.route.params.subscribe(params => { this.id = params.id; @@ -193,7 +197,11 @@ export class DynamicFormComponent implements OnInit { var formScroller = new PerfectScrollbar("#form-container"); var tocScroller = new PerfectScrollbar("#toc-container"); + */ + + //this.breadcrumbService.breadcrumbDataEmitter + } scrollToElemID(elemID) { diff --git a/dmp-frontend/src/app/projects/project.html b/dmp-frontend/src/app/projects/project.html index 9a243d53b..5b5bb2ec4 100644 --- a/dmp-frontend/src/app/projects/project.html +++ b/dmp-frontend/src/app/projects/project.html @@ -124,8 +124,3 @@ - - - - - diff --git a/dmp-frontend/src/app/projects/projects.component.ts b/dmp-frontend/src/app/projects/projects.component.ts index 82fe7f5f8..93a62ba3e 100644 --- a/dmp-frontend/src/app/projects/projects.component.ts +++ b/dmp-frontend/src/app/projects/projects.component.ts @@ -52,29 +52,13 @@ export class ProjectsComponent implements OnInit{ public sortBy = "label"; public sortOrder = "asc"; - //visibility rules for containers - tableVisible: boolean = true; - editorVisible: boolean = false; - // for tableIds showIDs : boolean = false; -// END ALTERNATIVE - returnUrl: string; - @Input() projectCount = 0; - @Input() datasetDropDown:DropdownField; - @Input() statusDropDown: DropdownField; - //@Input() dataSetVisibe:boolean; - @Input() datasets: Dataset[]; + statusDropDown: DropdownField; + project: any; - modalEditedRow: ModalComponent; - public item:any; - public show:boolean = false; - public dataSetVisibe:boolean = false; - @ViewChild(DataTable) projectsTable; - @ViewChild(DataTable) datasetsTable; - @ViewChild('isignOutBtn') isignOutBtn; options: DatepickerOptions = { @@ -93,12 +77,8 @@ export class ProjectsComponent implements OnInit{ private route: ActivatedRoute, private breadcrumbService : BreadcrumbService, private router: Router) { - this.datasetDropDown = new DropdownField(); - this.datasetDropDown.options = []; - this.datasets = []; this.statusDropDown = new DropdownField(); this.statusDropDown.options= [{key:'0', value:"Active"},{key:'1', value:"Inactive"}] - //this.projects = []; this.project = this.getEmptyProject(); } @@ -143,7 +123,7 @@ getProjects(muted? : boolean){ ); } - +/* getDMPs(){ this.serverService.listDmpsLabelID().subscribe( response =>{ @@ -164,6 +144,7 @@ getDMPs(){ } ) } +*/ showDatasets(){ //dmpId, event //this.dataSetVisibe = true; @@ -192,7 +173,7 @@ SaveProject(){ $("#newEditProjectModal").modal("hide"); } - newProject(item){ + newProject(){ this.project = this.getEmptyProject(); $("#newEditProjectModal").modal("show"); diff --git a/dmp-frontend/src/app/services/breadcrumb.service.ts b/dmp-frontend/src/app/services/breadcrumb.service.ts index 631c3f6ef..75cd5d94e 100644 --- a/dmp-frontend/src/app/services/breadcrumb.service.ts +++ b/dmp-frontend/src/app/services/breadcrumb.service.ts @@ -1,19 +1,25 @@ -import { OnInit, Injectable, EventEmitter } from '@angular/core'; -import {Observable} from 'rxjs/Observable'; -import {MenuItem} from 'primeng/primeng'; +import { OnInit, Injectable, EventEmitter, Input } from '@angular/core'; +import { Observable } from 'rxjs/Observable'; +import { MenuItem } from 'primeng/primeng'; @Injectable() -export class BreadcrumbService implements OnInit{ +export class BreadcrumbService implements OnInit { + + + breadcrumbHomeEmitter: EventEmitter = new EventEmitter(); + breadcrumbDataEmitter: EventEmitter> = new EventEmitter>(); + + @Input() currentHome: MenuItem; + @Input() currentData: Array; + - breadcrumbHomeEmitter : EventEmitter = new EventEmitter(); - breadcrumbDataEmitter : EventEmitter> = new EventEmitter>(); - ngOnInit() { + console.log("Intiated the service") } - - setData(breadcrumbData : Array){ + + setData(breadcrumbData: Array) { this.breadcrumbDataEmitter.emit(breadcrumbData); } @@ -21,7 +27,11 @@ export class BreadcrumbService implements OnInit{ this.breadcrumbHomeEmitter.emit(breadcrumbHome); } - clearAll(){ + appendMenuItem(menuItem: MenuItem) { + // + } + + clearAll() { this.breadcrumbDataEmitter.emit(new Array()); } diff --git a/dmp-frontend/src/app/widgets/breadcrumb/breadcrumb.component.css b/dmp-frontend/src/app/widgets/breadcrumb/breadcrumb.component.css new file mode 100644 index 000000000..e69de29bb diff --git a/dmp-frontend/src/app/widgets/breadcrumb/breadcrumb.component.html b/dmp-frontend/src/app/widgets/breadcrumb/breadcrumb.component.html new file mode 100644 index 000000000..d8e887943 --- /dev/null +++ b/dmp-frontend/src/app/widgets/breadcrumb/breadcrumb.component.html @@ -0,0 +1,2 @@ + + diff --git a/dmp-frontend/src/app/widgets/breadcrumb/breadcrumb.component.spec.ts b/dmp-frontend/src/app/widgets/breadcrumb/breadcrumb.component.spec.ts new file mode 100644 index 000000000..d7beb3313 --- /dev/null +++ b/dmp-frontend/src/app/widgets/breadcrumb/breadcrumb.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { BreadcrumbComponent } from './breadcrumb.component'; + +describe('BreadcrumbComponent', () => { + let component: BreadcrumbComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ BreadcrumbComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(BreadcrumbComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should be created', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/dmp-frontend/src/app/widgets/breadcrumb/breadcrumb.component.ts b/dmp-frontend/src/app/widgets/breadcrumb/breadcrumb.component.ts new file mode 100644 index 000000000..e336074cd --- /dev/null +++ b/dmp-frontend/src/app/widgets/breadcrumb/breadcrumb.component.ts @@ -0,0 +1,73 @@ +import { Component, OnInit } from '@angular/core'; +import { Router, CanActivate, ActivatedRouteSnapshot, RouterStateSnapshot, ActivatedRoute, NavigationEnd } from '@angular/router'; +import {BreadcrumbModule,MenuItem} from 'primeng/primeng'; + +@Component({ + selector: 'breadcrumb', + templateUrl: './breadcrumb.component.html', + styleUrls: ['./breadcrumb.component.css'] +}) +export class BreadcrumbComponent implements OnInit { + + + breadcrumbHome: MenuItem = {icon: 'fa fa-home', routerLink: "/welcome"}; + breadcrumbData: MenuItem[] = new Array(); + + + constructor(private router: Router, private route: ActivatedRoute) { + router.events.subscribe( + event =>{ + console.log("Router event captured") + console.log(event) + + + if(event instanceof NavigationEnd){ + //this.breadcrumbData.push("") + console.log(event.urlAfterRedirects); + console.log(this.route); + + + //this.breadcrumbData.length = 0; + this.route.children.forEach( child => { + let menuItem : MenuItem = this.guessMenuItemFromActivatedRoute(child, event); + if(menuItem != null) + this.breadcrumbData.push(menuItem); + }) + + } + }); + + } + + guessMenuItemFromActivatedRoute(activatedRoute : any, event : NavigationEnd) { //it's important to leave it as "any" + let componentName = activatedRoute.component.name; + let params = activatedRoute.queryParams.getValue(); + let url = event.urlAfterRedirects.split("?")[0]; + + let label = null; + if(componentName == "ProjectsComponent") { + label = "My Projects"; + } + if(componentName == "DmpComponent"){ + label = "My Data Management Plans"; + } + + if(label != null) + return {"label": label, "routerLink": url, "queryParams" : params }; + + return null; + } + + + ngOnInit() { + + } + + getPaths(){ + + return this.breadcrumbData; + } + + + +}