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

Finished breadcrumb

This commit is contained in:
satyr 2017-11-16 00:55:49 +02:00
parent 2fa8d7bdfd
commit 25d28ac77d
12 changed files with 49 additions and 125 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -10,7 +10,6 @@ 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';
import { BreadcrumbService } from './services/breadcrumb.service';
const appRoutes: Routes = [
//{ path: 'dynamic-form/:id', component: DynamicFormComponent, canActivate: [AuthGuard] },
@ -46,7 +45,6 @@ const appRoutes: Routes = [
RouterModule
],
providers: [
BreadcrumbService
]
})
export class AppRoutingModule { }

24
dmp-frontend/src/app/app.component.ts
View File

@ -6,7 +6,6 @@ import { TokenService, TokenProvider } from './services/login/token.service';
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';
@ -32,32 +31,12 @@ export class AppComponent implements OnInit {
constructor(private tokenService : TokenService, private router: Router, private breadcrumbService : BreadcrumbService, private route: ActivatedRoute) {
constructor(private tokenService : TokenService, private router: Router, private route: ActivatedRoute) {
}
ngOnInit() {
this.clearbreadCrumb();
this.breadcrumbService.breadcrumbDataEmitter.subscribe(
(data) => {
this.breadcrumbData = data;
}
);
this.breadcrumbService.breadcrumbHomeEmitter.subscribe(
(data) => {
this.breadcrumbHome = data;
}
);
}
clearbreadCrumb(){
this.breadcrumbData.length = 0;
}
@ -82,7 +61,6 @@ export class AppComponent implements OnInit {
}
logout(){
this.breadcrumbService.clearAll();
this.tokenService.logout();
location.reload();
}

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

@ -35,7 +35,6 @@ import { GlobalInterceptor } from './services/interceptor';
import { TabModule } from './tabs/tab.module';
import { AngularDraggableModule } from 'angular2-draggable';
import { BreadcrumbService } from './services/breadcrumb.service';
import { NativeLoginService } from './services/login/native-login.service';
import { GooggleSignInComponent } from './login/googgle-sign-in/googgle-sign-in.component';
import { MainSignInComponent } from './login/main-sign-in/main-sign-in.component';
@ -127,7 +126,7 @@ import { BreadcrumbComponent } from './widgets/breadcrumb/breadcrumb.component';
useClass: GlobalInterceptor,
multi: true,
},
ServerService, BreadcrumbService, dataModelBuilder, GlobalVariables, AuthGuard, PaginationService, TokenService, LocalStorageService, RestBase, EestoreService,NativeLoginService
ServerService, dataModelBuilder, GlobalVariables, AuthGuard, PaginationService, TokenService, LocalStorageService, RestBase, EestoreService,NativeLoginService
],
bootstrap: [AppComponent]
})

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

@ -189,7 +189,6 @@ export class DatasetsComponent implements OnInit {
}
editRow(item, event) {
debugger;
if (event.toElement.id == "editDataset"){
//this.dataset = item;
this.dataset.label = item.label;
@ -221,7 +220,8 @@ export class DatasetsComponent implements OnInit {
}
describeDataset(item) {
this.ngZone.run(() => this.router.navigate(['dynamic-form', {id: item.profile.id, datasetId:item.id}]));
this.router.navigate(['/dynamic-form'], { queryParams: {id: item.profile.id, datasetId:item.id, label: item.label}});
//this.ngZone.run(() => this.router.navigate(['dynamic-form', {id: item.profile.id, datasetId:item.id, label: item.label}]));
}
markDatasetForDelete(dataset){

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

@ -17,7 +17,6 @@ import { NgForm } from '@angular/forms';
import { DatasetsComponent } from '../datasets/dataset.component';
import { StatusToString } from '../pipes/various/status-to-string';
import {MenuItem} from 'primeng/primeng';
import { BreadcrumbService } from '../services/breadcrumb.service';
declare var $ :any;
@ -45,24 +44,6 @@ export class DmpComponent implements OnInit{
// for tableIds
showIDs : boolean = false;
public stateConfig : any = {
"dmps" : {
"tableVisible" : true,
"dmpDescriptionVisible" : false,
"selectedID" : null,
"selectedLabel" : null
},
"datasets" : {
"tableVisible" : false,
"selectedID" : null,
"selectedLabel" : null
}
}
//breadcrumbHome: MenuItem = {icon: 'fa fa-home'};
breadcrumbData: MenuItem[] = new Array<MenuItem>();
dmp : any = null;
@ -75,7 +56,6 @@ export class DmpComponent implements OnInit{
constructor(
private serverService: ServerService,
private route: ActivatedRoute,
private breadcrumbService : BreadcrumbService,
private router: Router){
this.projectsDropDown = new DropdownField();
this.projectsDropDown.options = [];
@ -121,8 +101,6 @@ export class DmpComponent implements OnInit{
}
)
this.showDmps();
}
showDMPDetails(dmp) {
@ -133,17 +111,6 @@ export class DmpComponent implements OnInit{
}
showDmps(){
this.stateConfig.dmps.tableVisible = true;
this.stateConfig.datasets.tableVisible = false;
this.breadcrumbService.clearAll();
this.breadcrumbData.length = 0;
this.breadcrumbData.push({label:'My Data Management Plans ', command: (onclick)=> { this.showDmps() }});
this.breadcrumbService.setData(this.breadcrumbData);
}
getDmps(muted? : boolean){
this.serverService.getDmpOfUser().subscribe(
@ -294,7 +261,7 @@ export class DmpComponent implements OnInit{
}
showDatasetsOfDmp(item){
this.router.navigate(['/dataset'], { queryParams: { "dmpid":item.id }});
this.router.navigate(['/dataset'], { queryParams: { "dmpid":item.id , "label":item.label}});
}

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

@ -1,5 +1,5 @@
<table *ngIf="stateConfig.dmps.tableVisible" class="table table-striped customTable" [mfData]="tableData | dmpTableFilter : filterQuery | dmpVersionFilter : versionFilter |dmpstatusFilter: statusFilter"
<table class="table table-striped customTable" [mfData]="tableData | dmpTableFilter : filterQuery | dmpVersionFilter : versionFilter |dmpstatusFilter: statusFilter"
#mf="mfDataTable" [mfRowsOnPage]="rowsOnPage" [(mfSortBy)]="sortBy" [(mfSortOrder)]="sortOrder">
<thead>
<tr class="rowFilter">

7
dmp-frontend/src/app/form/dynamic-form.component.ts
View File

@ -18,7 +18,6 @@ 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;
@ -67,7 +66,7 @@ export class DynamicFormComponent implements OnInit {
expandedToc : boolean = true;
constructor(private qcs: FieldControlService, private breadcrumbService : BreadcrumbService, private serverService: ServerService, private dataModelService: dataModelBuilder, private router: Router,
constructor(private qcs: FieldControlService, 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();
@ -80,9 +79,11 @@ 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 => {
let sub = this.route.queryParams.subscribe(params => {
this.id = params.id;
this.datasetId = params.datasetId;
//this.datasetProperties = params.datasetProperties

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

@ -4,7 +4,6 @@ import { NativeLoginService } from '../../services/login/native-login.service';
import { TokenService, TokenProvider } from '../../services/login/token.service';
import {Router} from '@angular/router';
import {MenuItem} from 'primeng/primeng';
import { BreadcrumbService } from '../../services/breadcrumb.service';
import '../../../assets/custom.js';
declare function simple_notifier(type: string, title: string, message:string): any;
@ -22,7 +21,7 @@ export class MainSignInComponent implements OnInit {
creds : any = {"username":"","password":""};
constructor( private fb: FormBuilder, private nativeLogin : NativeLoginService, private tokenService : TokenService, private router : Router, private breadcrumbService: BreadcrumbService) {
constructor( private fb: FormBuilder, private nativeLogin : NativeLoginService, private tokenService : TokenService, private router : Router) {
}
@ -38,7 +37,6 @@ export class MainSignInComponent implements OnInit {
ngOnInit() {
this.breadcrumbService.clearAll();
this.createForm();
if(this.tokenService.isLoggedIn()){
this.router.navigate(['/welcome'], { queryParams: { /*returnUrl: this.state.url*/ }});

6
dmp-frontend/src/app/projects/projects.component.ts
View File

@ -18,7 +18,6 @@ import { DatepickerOptions } from 'ng2-datepicker';
import { StatusToString} from '../pipes/various/status-to-string';
import { ConfirmationComponent } from '../widgets/confirmation/confirmation.component';
import {MenuItem} from 'primeng/primeng';
import { BreadcrumbService } from '../services/breadcrumb.service';
import { ProjectTableFilterPipe } from '../pipes/project-table-filter.pipe';
@ -75,7 +74,6 @@ export class ProjectsComponent implements OnInit{
constructor(
private serverService: ServerService,
private route: ActivatedRoute,
private breadcrumbService : BreadcrumbService,
private router: Router) {
this.statusDropDown = new DropdownField();
this.statusDropDown.options= [{key:'0', value:"Active"},{key:'1', value:"Inactive"}]
@ -103,10 +101,6 @@ getEmptyProject(){
this.getProjects();
this.breadcrumbService.clearAll();
this.breadcrumbData.push({label:'My Projects', routerLink:"/projects"});
this.breadcrumbService.setData(this.breadcrumbData);
}

38
dmp-frontend/src/app/services/breadcrumb.service.ts
View File

@ -1,38 +0,0 @@
import { OnInit, Injectable, EventEmitter, Input } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import { MenuItem } from 'primeng/primeng';
@Injectable()
export class BreadcrumbService implements OnInit {
breadcrumbHomeEmitter: EventEmitter<MenuItem> = new EventEmitter<MenuItem>();
breadcrumbDataEmitter: EventEmitter<Array<MenuItem>> = new EventEmitter<Array<MenuItem>>();
@Input() currentHome: MenuItem;
@Input() currentData: Array<MenuItem>;
ngOnInit() {
console.log("Intiated the service")
}
setData(breadcrumbData: Array<MenuItem>) {
this.breadcrumbDataEmitter.emit(breadcrumbData);
}
setHome(breadcrumbHome: MenuItem) {
this.breadcrumbHomeEmitter.emit(breadcrumbHome);
}
appendMenuItem(menuItem: MenuItem) {
//
}
clearAll() {
this.breadcrumbDataEmitter.emit(new Array<MenuItem>());
}
}

2
dmp-frontend/src/app/widgets/breadcrumb/breadcrumb.component.html
View File

@ -1,2 +1,2 @@
<!-- breadcrumb bar -->
<p-breadcrumb *ngIf="breadcrumbData?.length != 0" [model]="getPaths()" [home]="breadcrumbHome"></p-breadcrumb>
<p-breadcrumb *ngIf="breadcrumbData?.length != 0" [model]="breadcrumbData" [home]="breadcrumbHome"></p-breadcrumb>

47
dmp-frontend/src/app/widgets/breadcrumb/breadcrumb.component.ts
View File

@ -13,6 +13,9 @@ export class BreadcrumbComponent implements OnInit {
breadcrumbHome: MenuItem = {icon: 'fa fa-home', routerLink: "/welcome"};
breadcrumbData: MenuItem[] = new Array<MenuItem>();
ngOnInit() {
}
constructor(private router: Router, private route: ActivatedRoute) {
router.events.subscribe(
@ -30,8 +33,10 @@ export class BreadcrumbComponent implements OnInit {
//this.breadcrumbData.length = 0;
this.route.children.forEach( child => {
let menuItem : MenuItem = this.guessMenuItemFromActivatedRoute(child, event);
if(menuItem != null)
this.breadcrumbData.push(menuItem);
if(menuItem != null) {
this.adaptBreadcrumbByMenuItem(menuItem);
//this.breadcrumbData.push(menuItem);
}
})
}
@ -39,34 +44,56 @@ export class BreadcrumbComponent implements OnInit {
}
guessMenuItemFromActivatedRoute(activatedRoute : any, event : NavigationEnd) { //it's important to leave it as "any"
let menuItem : MenuItem = null;
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(componentName == "DatasetsComponent"){
label = "Datasets of DMP '"+params["label"]+"'";
}
if(componentName == "DynamicFormComponent"){
label = "Form of dataset '"+params["label"]+"'";
}
if(label != null)
return {"label": label, "routerLink": url, "queryParams" : params };
menuItem = {"label": label, "routerLink": url, "queryParams" : params };
return null;
console.log("COMPONENT NAME="+componentName);
return menuItem;
}
ngOnInit() {
adaptBreadcrumbByMenuItem(menuItem : MenuItem){
let breadcrumbDataNew: MenuItem[] = new Array<MenuItem>();
for(var i=0; i<this.breadcrumbData.length;i++){
if(this.breadcrumbData[i].label == menuItem.label)
break;
else
breadcrumbDataNew.push(this.breadcrumbData[i]);
}
this.breadcrumbData = breadcrumbDataNew;
this.breadcrumbData.push(menuItem);
}
getPaths(){
return this.breadcrumbData;
}