Tabs Projects+Dmps v0.1 , dmp component, sign out bug fix, project-modal-dataset
This commit is contained in:
parent
265cc65999
commit
90871d7061
|
@ -7,7 +7,6 @@ import { JsonObjest } from '../app/entities/JsonObject.class';
|
|||
@Component({
|
||||
selector: 'app-root',
|
||||
template: `
|
||||
<!-- <h1 class="title">Angular Router</h1>-->
|
||||
|
||||
<router-outlet></router-outlet>
|
||||
`,
|
||||
|
|
|
@ -25,6 +25,8 @@ import { ProjectsModule } from './projects/project.module';
|
|||
import { PaginationService } from './services/pagination.service';
|
||||
import { EestoreService } from './services/eestore.service';
|
||||
import { DatasetsModule } from './datasets/dataset.module';
|
||||
import { DmpModule } from './dmps/dmp.module';
|
||||
import { TabModule } from './tabs/tab.module';
|
||||
|
||||
@NgModule({
|
||||
declarations: [
|
||||
|
@ -43,7 +45,9 @@ import { DatasetsModule } from './datasets/dataset.module';
|
|||
FormsModule,
|
||||
HttpModule,
|
||||
HttpClientModule,
|
||||
TabModule,
|
||||
ProjectsModule,
|
||||
DmpModule,
|
||||
DatasetsModule,
|
||||
AppRoutingModule,
|
||||
DataTableModule
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
import { Component, OnInit, Input, ViewChild, NgZone } from '@angular/core';
|
||||
import { Component, OnInit, Input, ViewChild, NgZone ,Output ,EventEmitter} from '@angular/core';
|
||||
import {GoogleSignInSuccess} from 'angular-google-signin';
|
||||
import { Router, ActivatedRoute } from '@angular/router';
|
||||
import { ServerService } from '../../app/services/server.service';
|
||||
|
@ -36,6 +36,19 @@ export class DatasetsComponent implements OnInit{
|
|||
|
||||
@ViewChild(DataTable) projectsTable;
|
||||
|
||||
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)
|
||||
}
|
||||
|
||||
constructor(
|
||||
private serverService: ServerService,
|
||||
private route: ActivatedRoute,
|
||||
|
@ -47,7 +60,7 @@ export class DatasetsComponent implements OnInit{
|
|||
ngOnInit() {
|
||||
//this.projects = this.serverService.getDummyProjects();
|
||||
this.datasets = [];
|
||||
this.serverService.getAllDatasets().subscribe(
|
||||
this.serverService.getAllDataSet().subscribe(
|
||||
response => {
|
||||
|
||||
console.log("response");
|
||||
|
|
|
@ -0,0 +1,21 @@
|
|||
import { NgModule } from '@angular/core';
|
||||
import { RouterModule, Routes } from '@angular/router';
|
||||
|
||||
import { DmpComponent } from './dmp.component';
|
||||
import { DynamicFormComponent } from '../form/dynamic-form.component';
|
||||
import { AuthGuard } from '../guards/auth.guard';
|
||||
|
||||
const projectsRoutes: Routes = [
|
||||
{ path: 'tabs/dmps', component: DmpComponent },
|
||||
{ path: 'dynamic-form/:id', component: DynamicFormComponent, canActivate: [AuthGuard] }
|
||||
];
|
||||
|
||||
@NgModule({
|
||||
imports: [
|
||||
RouterModule.forChild(projectsRoutes)
|
||||
],
|
||||
exports: [
|
||||
RouterModule
|
||||
]
|
||||
})
|
||||
export class DmpRoutingModule { }
|
|
@ -0,0 +1,160 @@
|
|||
import { Component, OnInit, Input, Output, EventEmitter, ViewChild } from '@angular/core';
|
||||
import {GoogleSignInSuccess} from 'angular-google-signin';
|
||||
import { Router, ActivatedRoute } from '@angular/router';
|
||||
import { ServerService } from '../../app/services/server.service';
|
||||
import { Dmp } from '../entities/model/Dmp';
|
||||
import { Dataset } from '../entities/model/dataset';
|
||||
import { Project } from '../entities/model/project';
|
||||
import { DataTable, DataTableTranslations, DataTableResource } from 'angular-4-data-table-bootstrap-4';
|
||||
import { DropdownField } from '../../app/form/fields/dropdown/field-dropdown';
|
||||
import { Param } from '../entities/model/param';
|
||||
import { ModalComponent } from '../modal/modal.component';
|
||||
import { HttpErrorResponse } from '@angular/common/http';
|
||||
import { FormGroup, FormControl } from '@angular/forms'; //na dw an xreiazontai
|
||||
import { NgForm } from '@angular/forms';
|
||||
|
||||
@Component({
|
||||
selector: 'dmps',
|
||||
templateUrl: 'dmps.html',
|
||||
providers: [ServerService]
|
||||
})
|
||||
|
||||
export class DmpComponent implements OnInit{
|
||||
@Input() dmps: Dmp[];
|
||||
dmp:any;
|
||||
dmpResource :DataTableResource<Dmp>;
|
||||
@Input() dmpCount = 0;
|
||||
@Input() projectsDropDown:DropdownField;
|
||||
//@Input() dataSetVisibe:boolean;
|
||||
@Input() projects: Project[];
|
||||
|
||||
@ViewChild(DataTable) dmpsTable;
|
||||
@ViewChild(DataTable) datasetsTable;
|
||||
@ViewChild('isignOutBtn') isignOutBtn;
|
||||
|
||||
constructor(
|
||||
private serverService: ServerService,
|
||||
private route: ActivatedRoute,
|
||||
private router: Router){
|
||||
this.projectsDropDown = new DropdownField();
|
||||
this.projectsDropDown.options = [];
|
||||
this.projects = [];
|
||||
this.dmp = {
|
||||
label: '',
|
||||
abbreviation:'',
|
||||
reference:'',
|
||||
uri:'',
|
||||
definition:''
|
||||
}
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
//this.projects = this.serverService.getDummyProjects();
|
||||
gapi.load('auth2', function() {
|
||||
gapi.auth2.init({});
|
||||
});
|
||||
this.dmps = [];
|
||||
this.serverService.getDmpOfUser().subscribe(
|
||||
response => {
|
||||
debugger;
|
||||
|
||||
response.forEach(resp => {
|
||||
let pr = new Dmp();
|
||||
pr.id = resp.id;
|
||||
pr.id = resp.label;
|
||||
pr.name = resp.abbreviation;
|
||||
pr.dataset = resp.definition;
|
||||
this.dmps.push(pr);
|
||||
var params = {limit:8,offset:0, sortAsc:false}
|
||||
this.afterLoad();
|
||||
this.dmpResource.query(params).then(dmps => this.dmps = dmps);
|
||||
}
|
||||
);
|
||||
},
|
||||
(err: HttpErrorResponse) => {
|
||||
if (err.error instanceof Error) {
|
||||
// A client-side or network error occurred. Handle it accordingly.
|
||||
console.log('An error occurred:', err.error.message);
|
||||
} else {
|
||||
// The backend returned an unsuccessful response code.
|
||||
// The response body may contain clues as to what went wrong,
|
||||
if(err.status == 401){
|
||||
this.isignOutBtn.nativeElement.click();
|
||||
}
|
||||
console.log(`Backend returned code ${err.status}, body was: ${err.error}`);
|
||||
}
|
||||
}
|
||||
);
|
||||
|
||||
this.serverService.getAllProjects().subscribe(
|
||||
response => {
|
||||
console.log("response");
|
||||
console.log(response);
|
||||
//let params = new Param();
|
||||
response.forEach((dmp) => {
|
||||
let params = new Param();
|
||||
params.key = dmp.id;
|
||||
params.value = dmp.label;
|
||||
this.projectsDropDown.options.push(params);
|
||||
});
|
||||
|
||||
}
|
||||
)
|
||||
}
|
||||
|
||||
reloadDmps(params) {
|
||||
this.dmpResource = new DataTableResource(this.dmps);
|
||||
this.dmpResource.query(params).then(projects => this.dmps = projects);
|
||||
}
|
||||
|
||||
afterLoad(){
|
||||
this.dmpResource = new DataTableResource(this.dmps);
|
||||
this.dmpResource.count().then(count => this.dmpCount = count);
|
||||
}
|
||||
|
||||
myFunction() {
|
||||
var input, filter, table, tr, td, i;
|
||||
input = document.getElementById("myInput");
|
||||
filter = input.value.toUpperCase();
|
||||
table = document.getElementById("projects-grid");
|
||||
tr = table.getElementsByTagName("tr");
|
||||
for (i = 0; i < tr.length; i++) {
|
||||
td = tr[i].getElementsByTagName("td")[3];
|
||||
if (td) {
|
||||
if (td.innerText.toUpperCase().indexOf(filter) > -1) {
|
||||
tr[i].style.display = "";
|
||||
} else {
|
||||
tr[i].style.display = "none";
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
SaveNewDmp(){ debugger;
|
||||
console.log(this.dmp, this.dmp.projectsDropDownKey);
|
||||
//this.http.post('http://someurl', JSON.stringify(this.project))
|
||||
this.serverService.createDmpForProject(this.dmp, this.dmp.projectsDropDownKey)
|
||||
.subscribe(
|
||||
response =>{
|
||||
console.log("response");
|
||||
console.log(response);
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
// special params:
|
||||
translations = <DataTableTranslations>{
|
||||
indexColumn: 'Index column',
|
||||
expandColumn: 'Expand column',
|
||||
selectColumn: 'Select column',
|
||||
paginationLimit: 'Max results',
|
||||
paginationRange: 'Result range'
|
||||
};
|
||||
|
||||
signOut() {
|
||||
this.serverService.logOut();
|
||||
}
|
||||
|
||||
|
||||
}
|
|
@ -0,0 +1,24 @@
|
|||
import { NgModule } from '@angular/core';
|
||||
import { CommonModule } from '@angular/common';
|
||||
import { FormsModule } from '@angular/forms';
|
||||
import {DataTableModule } from 'angular-4-data-table-bootstrap-4';
|
||||
|
||||
import { DmpComponent } from './dmp.component';
|
||||
|
||||
import { DmpRoutingModule } from './dmp-routing.module';
|
||||
import { DatasetsModule } from '../datasets/dataset.module';
|
||||
|
||||
@NgModule({
|
||||
imports: [
|
||||
CommonModule,
|
||||
FormsModule,
|
||||
DmpRoutingModule,
|
||||
DataTableModule,
|
||||
DatasetsModule
|
||||
],
|
||||
declarations: [
|
||||
DmpComponent
|
||||
],
|
||||
providers: [ ]
|
||||
})
|
||||
export class DmpModule {}
|
|
@ -0,0 +1,116 @@
|
|||
<meta name="google-signin-client_id" content="524432312250-vhgidft856v8qftsc81kls4c74v87d8o.apps.googleusercontent.com">
|
||||
|
||||
<div style="margin: auto; max-width: 1000px; margin-top:50px">
|
||||
<div>
|
||||
<span>Filter: </span>
|
||||
<input type="text" id="myInput" (keyup)="myFunction()" placeholder="Search for labels.." title="Type in a name">
|
||||
</div>
|
||||
<data-table id="dmps-grid" headerTitle="My Dmps" [items]="dmps" [itemCount]="dmpCount" (reload)="reloadDmps($event)"
|
||||
[limit]="8" [sortBy]="'rating'" [sortAsc]="false" [selectColumn]="true" [multiSelect]="false" [substituteRows]="false"
|
||||
[expandableRows]="true" [translations]="translations" [indexColumnHeader]="'#'" [selectOnRowClick]="true">
|
||||
|
||||
<data-table-column [property]="'label'" [header]="'Label'" [sortable]="true">
|
||||
</data-table-column>
|
||||
<data-table-column [property]="'abbreviation'" [header]="'Abbreviation'" [sortable]="true">
|
||||
</data-table-column>
|
||||
<data-table-column [property]="'startDate'" [header]="'Start Date'" [sortable]="true">
|
||||
</data-table-column>
|
||||
<data-table-column [property]="'endDate'" [header]="'End Date'" [sortable]="true">
|
||||
</data-table-column>
|
||||
<data-table-column [property]="'active'" [header]="'Status'" [width]="100" [resizable]="true">
|
||||
<template #dataTableHeader let-item="item">
|
||||
<span>Active</span>
|
||||
</template>
|
||||
<template #dataTableCell let-item="item">
|
||||
<span style="color: grey">
|
||||
<span class="fa fa-check" *ngIf="item.active"></span>
|
||||
<span class="fa fa-times" *ngIf="!item.active"></span>
|
||||
</span>
|
||||
</template>
|
||||
</data-table-column>
|
||||
<data-table-column header="Actions">
|
||||
<template #dataTableHeader let-item="item">
|
||||
<i>Actions</i>
|
||||
</template>
|
||||
<template #dataTableCell let-item="item">
|
||||
<a class="editGridColumn" (click) = "editRow(item)"><i class="fa fa-pencil fa-fw"></i></a> <!--data-toggle="modal" data-target="#exampleModalDmps" -->
|
||||
</template>
|
||||
</data-table-column>
|
||||
</data-table>
|
||||
<div style="margin-top: 10px">
|
||||
<b>Selected:</b>
|
||||
<!-- <span *ngIf="dmpsTable.selectedRow == null"><i>No item selected</i></span>
|
||||
<span [textContent]="dmpsTable.selectedRow && dmpsTable.selectedRow.item.name"></span> -->
|
||||
</div>
|
||||
<button type="button" class="btn btn-info" data-toggle="modal" data-target="#exampleModal">New Dmp</button>
|
||||
|
||||
<!-- <select class="form-control" [id]="datasetDropDownKey" [(ngModel)]="datasetDropDownKey">
|
||||
<option *ngFor="let opt of datasetDropDown.options" [value]="opt.key">{{opt.value}}</option>
|
||||
</select> -->
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
|
||||
<div class="modal-dialog" role="document">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title" id="exampleModalLabel">Create New DMP</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)="SaveNewDmp()">
|
||||
<div class="form-group">
|
||||
<label for="recipient-name" class="col-form-label">Project:</label>
|
||||
<select class="form-control" [id]="projectsDropDownKey" [(ngModel)]="dmp.projectsDropDownKey" [name]="projectsDropDown" #datasetfield>
|
||||
<option *ngFor="let opt of projectsDropDown.options" [value]="opt.key">{{opt.value}}</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="label-name" class="form-control-label">Label:</label>
|
||||
<input type="text" class="form-control" id="label-name" [(ngModel)]= "dmp.label" name = "label">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="abbreviation-text" class="form-control-label">Abbreviation:</label>
|
||||
<input class="form-control" id="abbreviation-text" [(ngModel)]= "dmp.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)]= "dmp.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)]= "dmp.uri" name = "uri">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="start-date" class="form-control-label">Start Date:</label>
|
||||
<input class="form-control" id="startDate-date" [(ngModel)]= "dmp.startDate" name = "startDate">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="end-date" class="form-control-label">End Date:</label>
|
||||
<input class="form-control" id="endDate-date" [(ngModel)]= "dmp.endDate" name = "endDate">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="code-name" class="form-control-label">Code:</label>
|
||||
<input type="text" class="form-control" id="code-name" disabled>
|
||||
</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" (click)="SaveNewDmp();">Save Dmp</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!--Modal for DMPs-->
|
||||
<!-- <modal *ngIf="item && show" [(show)]="show" [item]="item" [(dataSetVisibe)]="dataSetVisibe"></modal> -->
|
||||
|
||||
<!--DATASET TABLE-->
|
||||
<!--<datasets-table *ngIf="dataSetVisibe" [(dataSetVisibe)]="dataSetVisibe"></datasets-table> *ngIf="dataSetVisibe == true"-->
|
||||
|
||||
<a href="#" (click)="signOut();" #isignOutBtn >Sign out</a>
|
||||
<router-outlet></router-outlet>
|
|
@ -179,7 +179,6 @@ signOut2() {
|
|||
}
|
||||
|
||||
onValueChanged(data?: any) {
|
||||
debugger;
|
||||
if (!this.form) { return; }
|
||||
const form = this.form;
|
||||
|
||||
|
|
|
@ -1,13 +1,15 @@
|
|||
import { Injectable } from '@angular/core';
|
||||
import { Router, CanActivate, ActivatedRouteSnapshot, RouterStateSnapshot } from '@angular/router';
|
||||
import { TokenService, TokenProvider } from '../services/token.service';
|
||||
|
||||
@Injectable()
|
||||
export class AuthGuard implements CanActivate {
|
||||
|
||||
constructor(private router: Router) { }
|
||||
constructor(private router: Router, private tokenService: TokenService) { }
|
||||
|
||||
canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {
|
||||
if (localStorage.getItem('currentUser')) {
|
||||
//if (localStorage.getItem('currentUser')) { it always returns true
|
||||
if(this.tokenService.getToken()!=null){
|
||||
// logged in so return true
|
||||
return true;
|
||||
}
|
||||
|
|
|
@ -66,7 +66,7 @@ export class LoginComponent implements OnInit, AfterViewInit {
|
|||
this.tokenService.setUsername(profile.getName());
|
||||
this.tokenService.setEmail(profile.getEmail());
|
||||
|
||||
this.ngZone.run(() => this.router.navigateByUrl('projects'));
|
||||
this.ngZone.run(() => this.router.navigateByUrl('tabs'));
|
||||
|
||||
window.location.reload();
|
||||
|
||||
|
|
|
@ -1,10 +1,12 @@
|
|||
import { Component, OnInit, Input, ViewChild, ElementRef } from '@angular/core';
|
||||
import { Component, OnInit, Input,Output,EventEmitter, ViewChild, ElementRef, NgZone } from '@angular/core';
|
||||
import { ServerService } from '../../app/services/server.service';
|
||||
import { DropdownField } from '../../app/form/fields/dropdown/field-dropdown';
|
||||
import { Param } from '../entities/model/param';
|
||||
import { Dataset } from '../entities/model/dataset';
|
||||
import { Project } from '../entities/model/project';
|
||||
import { DataTable, DataTableTranslations, DataTableResource } from 'angular-4-data-table-bootstrap-4';
|
||||
import { Router, ActivatedRoute } from '@angular/router';
|
||||
|
||||
declare var jquery:any;
|
||||
declare var $ :any;
|
||||
|
||||
|
@ -16,21 +18,49 @@ declare var $ :any;
|
|||
export class ModalComponent implements OnInit {
|
||||
|
||||
@Input() datasetDropDown: DropdownField;
|
||||
@Input() dataSetVisibe:boolean;
|
||||
// public dataSetVisibe:boolean;
|
||||
@Input() datasets: Dataset[];
|
||||
@Input() project: Project;
|
||||
public project: Project;
|
||||
datasetResource :DataTableResource<Dataset>;
|
||||
@Input() datasetCount = 0;
|
||||
@Input('show-modal') showModal: boolean;
|
||||
|
||||
@ViewChild('modalDmps') modalDmps;
|
||||
|
||||
constructor(private serverService: ServerService) {
|
||||
@Input()
|
||||
public item:any
|
||||
showValue:boolean
|
||||
@Input()
|
||||
get show(){
|
||||
return this.showValue;
|
||||
}
|
||||
@Output()
|
||||
public showChange = new EventEmitter();
|
||||
|
||||
set show(value:any){
|
||||
this.showValue = value
|
||||
this.showChange.emit(this.showValue)
|
||||
}
|
||||
|
||||
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)
|
||||
}
|
||||
|
||||
constructor(private serverService: ServerService, private router: Router, private ngZone: NgZone) {
|
||||
this.datasetDropDown = new DropdownField();
|
||||
this.datasetDropDown.options = [];
|
||||
this.dataSetVisibe= false;
|
||||
//this.dataSetVisibe= false;
|
||||
this.datasets = [];
|
||||
this.project = new Project();
|
||||
|
||||
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
|
@ -49,35 +79,30 @@ export class ModalComponent implements OnInit {
|
|||
|
||||
}
|
||||
)
|
||||
|
||||
if(this.show) this.showModal()
|
||||
}
|
||||
|
||||
show(gridRow){
|
||||
this.project.label = gridRow.label;
|
||||
this.project.abbreviation = gridRow.abbreviation;
|
||||
this.project.uri = gridRow.uri;
|
||||
|
||||
|
||||
showModal(){
|
||||
this.project.label = this.item.label;
|
||||
this.project.abbreviation = this.item.abbreviation;
|
||||
this.project.uri = this.item.uri;
|
||||
this.project.id = this.item.id;
|
||||
$("#exampleModalDmps").modal("show");
|
||||
}
|
||||
|
||||
closeModal(){
|
||||
$("#exampleModalDmps").modal("hide");
|
||||
this.show = false;
|
||||
}
|
||||
|
||||
showDatasets(dmpId, event) {
|
||||
debugger;
|
||||
this.dataSetVisibe = true;
|
||||
this.serverService.getAllDatasets().subscribe(
|
||||
response => {
|
||||
console.log("response");
|
||||
console.log(response);
|
||||
//let params = new Param();
|
||||
response.forEach((dataset) => {
|
||||
let dt = new Dataset();
|
||||
dt.id = dataset.id;
|
||||
dt.name = dataset.label;
|
||||
dt.uriDataset = dataset.uri;
|
||||
this.datasets.push(dt);
|
||||
var params = { limit: 8, offset: 0, sortAsc: false }
|
||||
this.afterLoad();
|
||||
this.datasetResource.query(params).then(datasets => this.datasets = datasets);
|
||||
});
|
||||
});
|
||||
$("#exampleModalDmps").modal("hide");
|
||||
this.show = false;
|
||||
// this.ngZone.run(() => this.router.navigateByUrl('dataset')); //change router
|
||||
|
||||
}
|
||||
|
||||
|
|
|
@ -16,37 +16,37 @@
|
|||
</select>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="label-name" class="form-control-label">Label:</label>
|
||||
<input type="text" class="form-control" id="label-name" [(ngModel)]= "project.label" name = "label">
|
||||
<label for="label-name" class="form-control-label">Label:{{project.label}}</label>
|
||||
<input type="text" class="form-control" id="label" [(ngModel)]= "project.label" name = "label">
|
||||
</div>
|
||||
<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">
|
||||
<input class="form-control" id="abbreviation" [(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">
|
||||
<input class="form-control" id="reference" [(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">
|
||||
<input class="form-control" id="uri" [(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" id="startDate-date" [(ngModel)]= "project.startDate" name = "startDate">
|
||||
<input class="form-control" id="startDate" [(ngModel)]= "project.startDate" name = "startDate">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="end-date" class="form-control-label">End Date:</label>
|
||||
<input class="form-control" id="endDate-date" [(ngModel)]= "project.endDate" name = "endDate">
|
||||
<input class="form-control" id="endDate" [(ngModel)]= "project.endDate" name = "endDate">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="code-name" class="form-control-label">Code:</label>
|
||||
<input type="text" class="form-control" id="code-name" disabled>
|
||||
<input type="text" class="form-control" id="code" [(ngModel)]= "project.id" name = "id" disabled>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
|
||||
<button type="button" class="btn btn-secondary" data-dismiss="modal" (click)= "closeModal()">Close</button>
|
||||
<button type="button" class="btn btn-primary">Save</button>
|
||||
<button type="button" class="btn btn-primary" (click)= "showDatasets(datasetfield.value, exampleModalDmps)" >Show Datasets</button>
|
||||
</div>
|
||||
|
@ -55,4 +55,4 @@
|
|||
</div>
|
||||
|
||||
<!--DATASET TABLE-->
|
||||
<datasets-table *ngIf="dataSetVisibe == true"></datasets-table>
|
||||
<!-- <datasets-table *ngIf="dataSetVisibe == true"></datasets-table> -->
|
||||
|
|
|
@ -7,7 +7,7 @@ import { DynamicFormComponent } from '../form/dynamic-form.component';
|
|||
import { AuthGuard } from '../guards/auth.guard';
|
||||
|
||||
const projectsRoutes: Routes = [
|
||||
{ path: 'projects', component: ProjectsComponent },
|
||||
{ path: 'tabs/projects', component: ProjectsComponent }, // canActivate: [AuthGuard]
|
||||
{ path: 'dynamic-form/:id', component: DynamicFormComponent, canActivate: [AuthGuard] }
|
||||
];
|
||||
|
||||
|
|
|
@ -1,3 +1,10 @@
|
|||
<meta name="google-signin-client_id" content="524432312250-vhgidft856v8qftsc81kls4c74v87d8o.apps.googleusercontent.com">
|
||||
|
||||
<nav>
|
||||
<a routerLink="projects" routerLinkActive="active">Projects</a>
|
||||
<a routerLink="dmps" routerLinkActive="active">My Dmps</a>
|
||||
</nav>
|
||||
|
||||
<div style="margin: auto; max-width: 1000px; margin-top:50px">
|
||||
<div>
|
||||
<span>Filter: </span>
|
||||
|
@ -99,10 +106,10 @@
|
|||
</div>
|
||||
|
||||
<!--Modal for DMPs-->
|
||||
<modal></modal>
|
||||
<modal *ngIf="item && show" [(show)]="show" [item]="item" [(dataSetVisibe)]="dataSetVisibe"></modal>
|
||||
|
||||
<!--DATASET TABLE-->
|
||||
<datasets-table *ngIf="dataSetVisibe == true"></datasets-table>
|
||||
<datasets-table *ngIf="dataSetVisibe" [(dataSetVisibe)]="dataSetVisibe"></datasets-table> <!--*ngIf="dataSetVisibe == true"-->
|
||||
|
||||
<a href="#" (click)="signOut2();" #isignOutBtn >Sign out</a>
|
||||
<a href="#" (click)="signOut();" #isignOutBtn >Sign out</a>
|
||||
<router-outlet></router-outlet>
|
|
@ -1,4 +1,4 @@
|
|||
import { Component, OnInit, Input, ViewChild } from '@angular/core';
|
||||
import { Component, OnInit, Input, Output, EventEmitter, ViewChild } from '@angular/core';
|
||||
import {GoogleSignInSuccess} from 'angular-google-signin';
|
||||
import { Router, ActivatedRoute } from '@angular/router';
|
||||
import { ServerService } from '../../app/services/server.service';
|
||||
|
@ -12,24 +12,11 @@ import { ModalComponent } from '../modal/modal.component';
|
|||
import { HttpErrorResponse } from '@angular/common/http';
|
||||
import { FormGroup, FormControl } from '@angular/forms'; //na dw an xreiazontai
|
||||
import { NgForm } from '@angular/forms';
|
||||
import { TokenService, TokenProvider } from '../services/token.service';
|
||||
|
||||
@Component({
|
||||
selector: 'projects',
|
||||
templateUrl: 'project.html',
|
||||
// template: `
|
||||
// <h1 class="title">Projects</h1>
|
||||
|
||||
// <ul class="list-group col-md-4">
|
||||
// <li *ngFor="let project of projects"
|
||||
// class="list-group-item">
|
||||
// <a [routerLink]="['/dynamic-form', project.id]" >
|
||||
// {{ project.name }}
|
||||
// </a>
|
||||
// </li>
|
||||
// </ul>
|
||||
|
||||
// <router-outlet></router-outlet>
|
||||
// `,
|
||||
providers: [ServerService]
|
||||
})
|
||||
|
||||
|
@ -40,11 +27,13 @@ export class ProjectsComponent implements OnInit{
|
|||
datasetResource :DataTableResource<Dataset>;
|
||||
@Input() projectCount = 0;
|
||||
@Input() datasetDropDown:DropdownField;
|
||||
@Input() dataSetVisibe:boolean;
|
||||
//@Input() dataSetVisibe:boolean;
|
||||
@Input() datasets: Dataset[];
|
||||
project: any;
|
||||
modalEditedRow: ModalComponent;
|
||||
|
||||
public item:any;
|
||||
public show:boolean = false;
|
||||
public dataSetVisibe:boolean = false;
|
||||
@ViewChild(DataTable) projectsTable;
|
||||
@ViewChild(DataTable) datasetsTable;
|
||||
@ViewChild('isignOutBtn') isignOutBtn;
|
||||
|
@ -52,10 +41,9 @@ export class ProjectsComponent implements OnInit{
|
|||
constructor(
|
||||
private serverService: ServerService,
|
||||
private route: ActivatedRoute,
|
||||
private router: Router){
|
||||
private router: Router, private tokenService: TokenService){
|
||||
this.datasetDropDown = new DropdownField();
|
||||
this.datasetDropDown.options = [];
|
||||
this.dataSetVisibe= false;
|
||||
this.datasets = [];
|
||||
this.project = {
|
||||
label: '',
|
||||
|
@ -64,10 +52,13 @@ export class ProjectsComponent implements OnInit{
|
|||
uri:'',
|
||||
definition:''
|
||||
}
|
||||
this.modalEditedRow = new ModalComponent(serverService);
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
|
||||
gapi.load('auth2', function() {
|
||||
gapi.auth2.init({});
|
||||
});
|
||||
//this.projects = this.serverService.getDummyProjects();
|
||||
this.projects = [];
|
||||
this.serverService.getProjectOfUer().subscribe( //getProjects()
|
||||
|
@ -93,7 +84,7 @@ export class ProjectsComponent implements OnInit{
|
|||
}
|
||||
);
|
||||
},
|
||||
(err: HttpErrorResponse) => {debugger;
|
||||
(err: HttpErrorResponse) => {
|
||||
if (err.error instanceof Error) {
|
||||
// A client-side or network error occurred. Handle it accordingly.
|
||||
console.log('An error occurred:', err.error.message);
|
||||
|
@ -136,35 +127,8 @@ getDMPs(){
|
|||
)
|
||||
}
|
||||
|
||||
showDatasets(dmpId, event){debugger;
|
||||
this.dataSetVisibe = true;
|
||||
this.serverService.getAllDatasets().subscribe(
|
||||
response =>{
|
||||
console.log("response");
|
||||
console.log(response);
|
||||
//let params = new Param();
|
||||
response.forEach((dataset) => {
|
||||
let dt = new Dataset();
|
||||
dt.id = dataset.id;
|
||||
dt.name = dataset.label;
|
||||
dt.uriDataset = dataset.uri;
|
||||
this.datasets.push(dt);
|
||||
var params = {limit:8,offset:0, sortAsc:false}
|
||||
this.afterLoad();
|
||||
this.datasetResource.query(params).then(datasets => this.datasets = datasets);
|
||||
},
|
||||
(err: HttpErrorResponse) => {
|
||||
if (err.error instanceof Error) {
|
||||
// A client-side or network error occurred. Handle it accordingly.
|
||||
console.log('An error occurred:', err.error.message);
|
||||
} else {
|
||||
// The backend returned an unsuccessful response code.
|
||||
// The response body may contain clues as to what went wrong,
|
||||
console.log(`Backend returned code ${err.status}, body was: ${err.error}`);
|
||||
}
|
||||
}
|
||||
);
|
||||
});
|
||||
showDatasets(){debugger; //dmpId, event
|
||||
//this.dataSetVisibe = true;
|
||||
|
||||
}
|
||||
|
||||
|
@ -187,7 +151,8 @@ myFunction() {
|
|||
}
|
||||
|
||||
editRow(item){
|
||||
this.modalEditedRow.show(item);
|
||||
this.show = true;
|
||||
this.item = item;
|
||||
}
|
||||
|
||||
SaveNewProject(){
|
||||
|
@ -211,6 +176,10 @@ SaveNewProject(){
|
|||
paginationRange: 'Result range'
|
||||
};
|
||||
|
||||
signOut() {
|
||||
this.serverService.logOut();
|
||||
}
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
|
|
@ -15,15 +15,15 @@ export class RestBase {
|
|||
this.xml2jsonOBJ = new X2JS();
|
||||
}
|
||||
|
||||
protocol: string = "http";
|
||||
hostname: string ="dl010.madgik.di.uoa.gr" ;//"localhost";//"dl010.madgik.di.uoa.gr";//
|
||||
port: number = 8080;//8080;//
|
||||
webappname: string = "dmp-backend-2";//"dmp-backend-new";//
|
||||
// protocol: string = "http";
|
||||
// hostname: string ="dl010.madgik.di.uoa.gr" ;//"localhost";//"dl010.madgik.di.uoa.gr";//
|
||||
// port: number = 8080;//8080;//
|
||||
// webappname: string = "dmp-backend-1";//"dmp-backend-new";//
|
||||
|
||||
/*protocol: string = "http";
|
||||
protocol: string = "http";
|
||||
hostname: string ="dionysus.di.uoa.gr" ;
|
||||
port: number = 7070;
|
||||
webappname: string = "dmp-backend-1";//"dmp-backend-new";//*/
|
||||
webappname: string = "dmp-backend";//"dmp-backend-new";//
|
||||
|
||||
|
||||
proxyPath : string = this.protocol+"://"+this.hostname+":"+this.port+"/"+this.webappname+"/proxy/";
|
||||
|
|
|
@ -96,8 +96,23 @@ export class ServerService {
|
|||
return this.restBase.post("project/createofuser", data);
|
||||
}
|
||||
|
||||
public getAllDataSet(){
|
||||
return this.restBase.get("dataset/getAll");
|
||||
}
|
||||
|
||||
signOut2() {
|
||||
public getDmpOfUser(){
|
||||
return this.restBase.get("dmp/getofuser");
|
||||
}
|
||||
|
||||
public createDmpForProject(data:any, projectid: string){
|
||||
return this.restBase.post("dmp/createforproject", data);
|
||||
// return this.restBase.post('dmp/createforproject', data, {
|
||||
// params: new HttpParams().set('projectid', projectid),
|
||||
// })
|
||||
}
|
||||
|
||||
|
||||
logOut() {
|
||||
|
||||
var auth2 = gapi.auth2.getAuthInstance();
|
||||
auth2.signOut().then(function () {
|
||||
|
|
|
@ -0,0 +1,22 @@
|
|||
import { NgModule } from '@angular/core';
|
||||
import { CommonModule } from '@angular/common';
|
||||
import { FormsModule } from '@angular/forms';
|
||||
import {DataTableModule } from 'angular-4-data-table-bootstrap-4';
|
||||
|
||||
import { TabComponent } from './tabs.component';
|
||||
|
||||
import { TabRoutingModule } from './tabs-routing.module';
|
||||
|
||||
@NgModule({
|
||||
imports: [
|
||||
CommonModule,
|
||||
FormsModule,
|
||||
TabRoutingModule,
|
||||
DataTableModule
|
||||
],
|
||||
declarations: [
|
||||
TabComponent
|
||||
],
|
||||
providers: [ ]
|
||||
})
|
||||
export class TabModule {}
|
|
@ -0,0 +1,19 @@
|
|||
import { NgModule } from '@angular/core';
|
||||
import { RouterModule, Routes } from '@angular/router';
|
||||
|
||||
import { TabComponent } from './tabs.component';
|
||||
import { AuthGuard } from '../guards/auth.guard';
|
||||
|
||||
const tabsRoutes: Routes = [
|
||||
{ path: 'tabs', component: TabComponent, canActivate: [AuthGuard] },
|
||||
];
|
||||
|
||||
@NgModule({
|
||||
imports: [
|
||||
RouterModule.forChild(tabsRoutes)
|
||||
],
|
||||
exports: [
|
||||
RouterModule
|
||||
]
|
||||
})
|
||||
export class TabRoutingModule { }
|
|
@ -0,0 +1,15 @@
|
|||
import { Component } from '@angular/core';
|
||||
|
||||
@Component({
|
||||
selector: 'my-app',
|
||||
template: `
|
||||
<h1 class="title">Angular Router</h1>
|
||||
<nav>
|
||||
<a routerLink="projects" routerLinkActive="active">Projects</a>
|
||||
<a routerLink="dmps" routerLinkActive="active">My Dmps</a>
|
||||
</nav>
|
||||
<router-outlet></router-outlet>
|
||||
`
|
||||
})
|
||||
export class TabComponent {
|
||||
}
|
Loading…
Reference in New Issue