Commit 30386c1d authored by Thodoris Nestoridis's avatar Thodoris Nestoridis

UI + Readme

parent 08e9211f
......@@ -14,7 +14,7 @@
<label for="title">Requirement Title</label>
<input type="text" class="form-control" id="title"
required
[(ngModel)]="boilerplate.title" name="title">
[(ngModel)]="boilerplate.title" name="title" >
</div>
<div class="form-group">
<label for="has_prefix" placement="left" ngbTooltip="A requirement may have a prefix that can be a simple one
......@@ -54,7 +54,7 @@
/>
</div>
<button (click)="saveBoilerplate()" class="btn btn-success">Submit</button>
<button (click)="saveBoilerplate()" class="btn btn-success" >Submit</button>
</form>
</div>
</div>
......
......@@ -3,6 +3,7 @@ import { ActivatedRoute, Router } from '@angular/router';
import { Boilerplate } from 'src/app/models/boilerplate.model';
import { BoilerplateService } from 'src/app/services/boilerplate.service';
import { NotifierService } from "angular-notifier";
import { GroupBoilerplate } from 'src/app/models/boilerplate.model';
@Component({
......@@ -18,19 +19,53 @@ export class AddBoilerplateComponent implements OnInit {
has_main: true,
has_suffix: false
};
currentProject: GroupBoilerplate = {
title_bgroup: "",
};
boilerplates?: Boilerplate[];
submitted = false;
private readonly notifier: NotifierService;
searchText = '';
constructor(private boilerplatelService: BoilerplateService, private route: ActivatedRoute,
constructor(private boilerplateService: BoilerplateService, private route: ActivatedRoute,
private router: Router, notifierService: NotifierService) {
this.notifier = notifierService;
}
ngOnInit(): void {
this.retrieveBoilerplates(this.route.snapshot.params.gb);
this.getProject(this.route.snapshot.params.gb);
}
getProject(gb: any): void {
this.boilerplateService.getgroupboil(gb)
.subscribe(
data => {
this.currentProject = data;
this.boilerplate.title = data.title_bgroup.replace(/\s/g, '_')+'_'+this.boilerplates?.length ;
},
error => {
console.log(error);
});
}
retrieveBoilerplates(gb: any): void {
this.boilerplateService.getAll(gb)
.subscribe(
data => {
this.boilerplates = data;
},
error => {
console.log(error);
});
}
saveBoilerplate(): void {
const data = {
group_of_boilerplate: this.route.snapshot.params.gb,
......@@ -44,7 +79,7 @@ export class AddBoilerplateComponent implements OnInit {
data.title = data.title?.replace(/ /g, "_")
}
this.boilerplatelService.create(this.route.snapshot.params.gb, data)
this.boilerplateService.create(this.route.snapshot.params.gb, data)
.subscribe(
response => {
this.notifier.notify("success", "Requirement " + this.boilerplate.title + " created");
......
......@@ -12,9 +12,11 @@
<form name="myForm" ngNativeValidate>
<div class="form-group">
<label for="title_bgroup">Project title</label>
<input type="text" class="form-control" id="title_bgroup" required [(ngModel)]="groupboilerplate.title_bgroup"
<input type="text" class="form-control" id="title_bgroup" (keypress)="omit_special_char($event)" required [(ngModel)]="groupboilerplate.title_bgroup"
name="title_bgroup">
</div>
<div *ngIf="this.titleval" class="text-danger"> Plase do not use special characters (!@#$%^&*()) </div>
<div class="form-group">
<label for="description">Description of project</label>
<textarea type="text" class="form-control" id="description" required [(ngModel)]="groupboilerplate.description"
......@@ -30,5 +32,5 @@
</mat-select>
</mat-form-field>
</form>
<button (click)="saveBoilerplate()" class="btn btn-success">Submit</button>
<button (click)="saveBoilerplate()" class="btn btn-success" >Submit</button>
</div>
\ No newline at end of file
......@@ -20,6 +20,8 @@ export class AddGroupboilComponent implements OnInit {
submitted = false;
private readonly notifier: NotifierService;
titleval = false;
constructor(private boilerplatelService: BoilerplateService, private router: Router, notifierService: NotifierService) {
this.notifier = notifierService;
}
......@@ -27,6 +29,14 @@ export class AddGroupboilComponent implements OnInit {
ngOnInit(): void {
this.getOntologies();
}
omit_special_char(event:any) {
var k;
k = event.charCode; //(Both can be used)
if((k > 64 && k < 91) || (k > 96 && k < 123) || k == 8 || k == 32 || (k >= 48 && k <= 57)){this.titleval=false}
else{this.titleval=true}
}
saveBoilerplate(): void {
const data = {
title_bgroup: this.groupboilerplate.title_bgroup,
......
<nav aria-label="breadcrumb">
<ol class="breadcrumb">
<li class="breadcrumb-item"><a routerLink="../../">Projects</a></li>
<li class="breadcrumb-item" aria-current="page">Requirement List</li>
</ol>
</nav>
<div class="list row">
<div class="col">
......@@ -50,6 +52,7 @@
<div [hidden]="!showSpinner">
<mat-progress-bar mode="indeterminate"></mat-progress-bar>
</div>
<div class="mat-elevation-z8">
<table mat-table [dataSource]="newdataSource" class="mat-elevation-z8">
<!-- Checkbox Column -->
......@@ -73,6 +76,7 @@
</ng-container> -->
<!-- Name Column -->
<ng-container matColumnDef="prefix_data" >
<th mat-header-cell *matHeaderCellDef> Prefix </th>
<td mat-cell *matCellDef="let element" [matTooltip]="element.prefix_data && element.prefix_data.length > 70 ? element.prefix_data : null"
......@@ -118,35 +122,18 @@
<div *ngIf="!this.spinnerchart">
<div echarts [options]="chartOption" class="demo-chart"></div>
</div>
<div *ngIf='boilerplates?.length === 0' class="alert alert-warning" role="alert">No available requirements, please add a new requirement</div>
<div class="content">
<div fxLayout="row wrap">
<div fxFlex="33.3%">
<div fxFlex="100%">
<mat-card class="example-card">
<mat-card-header>
<div class="example-header-image"></div>
<mat-card-title>N. Requirements</mat-card-title>
<mat-card-subtitle>{{getnumreq()}}</mat-card-subtitle>
</mat-card-header>
</mat-card>
</div>
<div fxFlex="33.3%">
<mat-card class="example-card">
<mat-card-header>
<div class="example-header-image"></div>
<mat-card-title>Complete Requirement</mat-card-title>
<mat-card-subtitle>{{getnumreq() - getincreq()}}</mat-card-subtitle>
</mat-card-header>
</mat-card>
</div>
<div fxFlex="33.3%">
<mat-card class="example-card">
<mat-card-header>
<div class="example-header-image"></div>
<mat-card-title>Incomplete Requirement</mat-card-title>
<mat-card-subtitle>{{getincreq()}}</mat-card-subtitle>
<mat-card-title>N. Requirements: {{getnumreq()}}</mat-card-title>
</mat-card-header>
</mat-card>
</div>
</div>
</div>
\ No newline at end of file
......@@ -10,6 +10,8 @@ import { MatPaginator } from '@angular/material/paginator';
import { EChartsOption } from 'echarts';
import { NotifierService } from "angular-notifier";
import { SelectionModel } from '@angular/cdk/collections';
import { GroupBoilerplate } from 'src/app/models/boilerplate.model';
......@@ -44,6 +46,12 @@ export class BoilerplateListComponent implements OnInit {
],
};
currentProject: GroupBoilerplate = {
title_bgroup: "",
};
spinnerchart=true;
private readonly notifier: NotifierService;
boilerplates?: Boilerplate[];
......@@ -83,6 +91,7 @@ export class BoilerplateListComponent implements OnInit {
constructor(private boilerplateService: BoilerplateService, private prefixService: PrefixService, private route: ActivatedRoute,
private router: Router, notifierService: NotifierService) {
this.notifier = notifierService;
}
......@@ -92,6 +101,18 @@ export class BoilerplateListComponent implements OnInit {
this.getInfer();
}
getProject(gb: any): void {
this.boilerplateService.getgroupboil(gb)
.subscribe(
data => {
this.currentProject = data;
//console.log(data);
},
error => {
console.log(error);
});
}
getCurrentOntology(): void {
this.boilerplateService.getCurrentOntolgies(this.route.snapshot.params.gb)
.subscribe(res => {
......@@ -291,14 +312,6 @@ export class BoilerplateListComponent implements OnInit {
getnumreq(): any {
return this.boilerplatesdata?.length
}
getincreq(): any {
if (this.get_metrics('IncompleteRequirement').length > 0) {
return this.get_metrics('IncompleteRequirement').length;
}
else return 0;
}
/** Whether the number of selected elements matches the total number of rows. */
isAllSelected() {
const numSelected = this.selection.selected.length;
......
......@@ -88,7 +88,14 @@ export class SignupComponent implements OnInit {
this.authService.signup(this.form.value.fullname, this.form.value.username, this.form.value.email, this.form.value.password, this.form.value.confirmPassword).subscribe(
success => {console.log('SUCCESS');},
error => {console.log(error.statusText);
if (error.statusText == 'OK') {this.sended = true}
if (error.statusText == 'OK') {
this.sended = true
setTimeout(() =>
{
this.router.navigate(['/login']);
},
2000);
}
else{this.notifier.notify("warning",(JSON.stringify("There might be a problem with your registration. Please try again later.")));}
}
);
......
......@@ -43,7 +43,7 @@
[ngStyle]=" showflow(this.suffixControl.value) ? {'visibility': 'visible'} : {'visibility': 'hidden'}">
<mat-form-field class="example-full-width">
<mat-label *ngIf="flowControl.value !=null">Flow or Function : {{this.flowControl.value.split(':')[0]}}:{{this.flowControl.value.split(':')[this.flowControl.value.split(':').length -2]}}</mat-label>
<input type="text" placeholder="Pick one" aria-label="SufFlow" matInput [formControl]="flowControl" required
<input type="text" placeholder="Pick one" aria-label="SufFlow" matInput [formControl]="flowControl"
[matAutocomplete]="autoflow" (blur)="closed($event, this.flowControl)" >
<mat-autocomplete autoActiveFirstOption #autoflow="matAutocomplete" showPanel="true" [displayWith]="displayFn" panelWidth="string" panelWidth="string">
<mat-option *ngFor="let option of flowfilteredOptions | async" [value]="option">
......
......@@ -30,6 +30,10 @@ export class BoilerplateService {
return this.http.delete(`${baseUrlgb}${id}`);
}
getgroupboil(id: any): Observable<any> {
return this.http.get(`${baseUrlgb}${id}`);
}
getAllInfer(gb: any): Observable<InferenceResults[]> {
return this.http.get<[InferenceResults]>(baseUrlgb + gb + inferUrl);
}
......
......@@ -12,9 +12,13 @@
will run only services needed for development like PostgreSQL, Redis etc
#### Deployment mode
`sudo docker-compose -f build/docker-compose-api.yml build`
`sudo docker-compose -f build/docker-compose-api.yml up`
will run all needed services and API (backend application)
Will run all needed services and API (backend application)
then connect to the docker container (the current name of container is "build_api_reqman_1") to create the super user
`sudo docker exec -it build_api_reqman_1 /bin/bash `
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment