niggl/srumboard_frontend
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Merge branch 'master' into deployment/cicd

Browse Source
This commit is contained in:
Nicolai Ort 2020-06-10 12:37:16 +02:00
commit f35f878136
12 changed files with 428 additions and 191 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
src/app/app-routing.module.ts
View File

@ -1,8 +1,15 @@
import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { TaskListComponent } from './task-list/task-list.component';
import { UserstoryListComponent } from './userstory-list/userstory-list.component';
const routes: Routes = [];
const routes: Routes = [
{ path: 'tasks', component: TaskListComponent },
{ path: 'userstories', component: UserstoryListComponent },
{ path: '', redirectTo: '/tasks', pathMatch: 'full' },
];
@NgModule({
imports: [RouterModule.forRoot(routes)],

2
src/app/app.component.html
View File

@ -1 +1 @@
<app-task-list></app-task-list>
<router-outlet></router-outlet>

68
src/app/app.module.ts
View File

@ -1,32 +1,36 @@
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HttpClientModule } from '@angular/common/http';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { TaskListComponent } from './task-list/task-list.component';
import { BackendService } from './services/backend.service';
import { TaskFormComponent } from './task-form/task-form.component';
import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
@NgModule({
declarations: [
AppComponent,
TaskListComponent,
TaskFormComponent
],
imports: [
BrowserModule,
AppRoutingModule,
HttpClientModule,
FormsModule,
NgbModule
],
providers: [
BackendService,
],
bootstrap: [AppComponent]
})
export class AppModule { }
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HttpClientModule } from '@angular/common/http';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { BackendService } from './services/backend.service';
import { TaskListComponent } from './task-list/task-list.component';
import { TaskFormComponent } from './task-form/task-form.component';
import { UserstoryListComponent } from './userstory-list/userstory-list.component';
import { UserstoryFormComponent } from './userstory-form/userstory-form.component';
import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
@NgModule({
declarations: [
AppComponent,
TaskListComponent,
TaskFormComponent,
UserstoryListComponent,
UserstoryFormComponent
],
imports: [
BrowserModule,
AppRoutingModule,
HttpClientModule,
FormsModule,
NgbModule
],
providers: [
BackendService,
],
bootstrap: [AppComponent]
})
export class AppModule { }

188
src/app/services/backend.service.ts
View File

@ -1,56 +1,132 @@
import {Injectable} from '@angular/core';
import {HttpClient, HttpResponse} from '@angular/common/http';
import {Observable} from 'rxjs';
import {environment} from '../../environments/environment';
@Injectable()
export class BackendService {
constructor(private httpClient: HttpClient) {}
public getTasks(): Observable<HttpResponse<Task[]>> {
const url = `${environment.apiUrl}/tasks`;
return this.httpClient.get<Task[]>(url, { observe: 'response' });
}
public getTask(id: number): Observable<HttpResponse<Task>> {
const url = `${environment.apiUrl}/tasks/${id}`;
return this.httpClient.get<Task>(url, { observe: 'response' });
}
public postTask(task: Task): Observable<HttpResponse<Task>> {
const url = `${environment.apiUrl}/tasks`;
return this.httpClient.post<Task>(url, task, { observe: 'response' });
}
public putTask(task: Task): Observable<HttpResponse<any>> {
const url = `${environment.apiUrl}/tasks/${task.id}`;
return this.httpClient.put(url, task, { observe: 'response' });
}
public deleteTask(task: Task): Observable<HttpResponse<any>> {
const url = `${environment.apiUrl}/tasks/${task.id}`;
return this.httpClient.delete(url, {observe: 'response'});
}
}
export enum Priority {
High="high",
Medium="medium",
Low="low"
}
export interface Task {
id?: number;
title: string;
content?: string;
status?: number;
category?: number;
assignedto?: number;
sprint?: number;
project?: number;
userstory?: number;
priority?: Priority;
}
import {Injectable} from '@angular/core';
import {HttpClient, HttpResponse} from '@angular/common/http';
import {Observable} from 'rxjs';
import {environment} from '../../environments/environment';
@Injectable()
export class BackendService {
constructor(private httpClient: HttpClient) {}
public getTasks(): Observable<HttpResponse<ScrumTask[]>> {
const url = `${environment.apiUrl}/tasks`;
return this.httpClient.get<ScrumTask[]>(url, { observe: 'response' });
}
public getTask(id: number): Observable<HttpResponse<ScrumTask>> {
const url = `${environment.apiUrl}/tasks/${id}`;
return this.httpClient.get<ScrumTask>(url, { observe: 'response' });
}
public postTask(task: ScrumTask): Observable<HttpResponse<ScrumTask>> {
const url = `${environment.apiUrl}/tasks`;
return this.httpClient.post<ScrumTask>(url, task, { observe: 'response' });
}
public putTask(task: ScrumTask): Observable<HttpResponse<any>> {
const url = `${environment.apiUrl}/tasks/${task.id}`;
return this.httpClient.put(url, task, { observe: 'response' });
}
public deleteTask(task: ScrumTask): Observable<HttpResponse<any>> {
const url = `${environment.apiUrl}/tasks/${task.id}`;
return this.httpClient.delete(url, {observe: 'response'});
}
public getUserstories(): Observable<HttpResponse<ScrumUserstory[]>> {
const url = `${environment.apiUrl}/userstories`;
return this.httpClient.get<ScrumUserstory[]>(url, { observe: 'response' });
}
public getUserstory(id: number): Observable<HttpResponse<ScrumUserstory>> {
const url = `${environment.apiUrl}/userstories/${id}`;
return this.httpClient.get<ScrumUserstory>(url, { observe: 'response' });
}
public postUserstory(userstory: ScrumUserstory): Observable<HttpResponse<ScrumUserstory>> {
const url = `${environment.apiUrl}/userstories`;
return this.httpClient.post<ScrumUserstory>(url, userstory, { observe: 'response' });
}
public putUserstory(userstory: ScrumUserstory): Observable<HttpResponse<any>> {
const url = `${environment.apiUrl}/userstories/${userstory.id}`;
return this.httpClient.put(url, userstory, { observe: 'response' });
}
public deleteUserstory(userstory: ScrumUserstory): Observable<HttpResponse<any>> {
const url = `${environment.apiUrl}/userstories/${userstory.id}`;
return this.httpClient.delete(url, {observe: 'response'});
}
}
export enum Priority {
High="high",
Medium="medium",
Low="low"
}
export interface ScrumTask {
id?: number;
title: string;
content?: string;
status?: number;
category?: number;
assignedto?: number;
sprint?: number;
project?: number;
userstory?: number;
priority?: Priority;
}
export interface ScrumUserstory {
id?: number;
title: string;
content?: string;
priority?: Priority;
status?: number;
category?: number;
createdby?: number;
project?: number;
}
export interface ScrumSprint{
id?: number;
title: string;
description: string;
startDate: Date;
endDate: Date;
project: number;
}
export interface ScrumCategory {
id?: number;
title: string;
description?: string;
color?: string;
project: number;
}
export interface ScrumStatus {
id? : number;
title: string;
description: string;
}
export interface ScrumUser {
id?: number;
name: string;
}
export interface ScrumProject {
id?: number;
title: string;
isprivate: boolean;
}

104
src/app/task-form/task-form.component.ts
View File

@ -1,52 +1,52 @@
import { Component, OnInit, Input } from '@angular/core';
import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
import { BackendService, Task, Priority } from '../services/backend.service';
@Component({
selector: 'app-task-form',
templateUrl: './task-form.component.html',
styleUrls: ['./task-form.component.css']
})
export class TaskFormComponent implements OnInit {
public title: string;
public content: string;
public prio: Priority;
@Input()
public task: Task;
private submitted: boolean;
constructor(private backendService: BackendService, private activeModalService: NgbActiveModal) { }
ngOnInit(): void {
if (this.task !== null && this.task !== undefined) {
this.title = this.task.title;
this.content = this.task.content;
this.prio = this.task.priority;
}
}
onSubmit() {
if (this.task !== null && this.task !== undefined) {
this.task.title = this.title;
this.task.content = this.content;
this.task.priority = this.prio;
this.backendService.putTask(this.task).subscribe(response => {
if (response.status > 399) {
alert('Fehler');
}
});
}
else {
this.task = { title: this.title, content: this.content, priority: this.prio };
this.backendService.postTask(this.task).subscribe(response => {
if (response.status > 399) {
alert('Fehler');
}
});
}
this.submitted = true;
this.activeModalService.close();
}
}
import { Component, OnInit, Input } from '@angular/core';
import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
import { BackendService, ScrumTask, Priority } from '../services/backend.service';
@Component({
selector: 'app-task-form',
templateUrl: './task-form.component.html',
styleUrls: ['./task-form.component.css']
})
export class TaskFormComponent implements OnInit {
public title: string;
public content: string;
public prio: Priority;
@Input()
public task: ScrumTask;
private submitted: boolean;
constructor(private backendService: BackendService, private activeModalService: NgbActiveModal) { }
ngOnInit(): void {
if (this.task !== null && this.task !== undefined) {
this.title = this.task.title;
this.content = this.task.content;
this.prio = this.task.priority;
}
}
onSubmit() {
if (this.task !== null && this.task !== undefined) {
this.task.title = this.title;
this.task.content = this.content;
this.task.priority = this.prio;
this.backendService.putTask(this.task).subscribe(response => {
if (response.status > 399) {
alert('Fehler');
}
});
}
else {
this.task = { title: this.title, content: this.content, priority: this.prio };
this.backendService.postTask(this.task).subscribe(response => {
if (response.status > 399) {
alert('Fehler');
}
});
}
this.submitted = true;
this.activeModalService.close(this.task);
}
}

103
src/app/task-list/task-list.component.ts
View File

@ -1,49 +1,54 @@
import { Component, OnInit } from '@angular/core';
import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
import { BackendService, Task } from '../services/backend.service';
import { TaskFormComponent } from '../task-form/task-form.component';
@Component({
selector: 'app-task-list',
templateUrl: './task-list.component.html',
styleUrls: ['./task-list.component.css']
})
export class TaskListComponent implements OnInit {
public tasks: Task[] = [];
constructor(private backendService: BackendService, private modalService: NgbModal) {
backendService.getTasks().subscribe(response => {
if (response.status > 399) {
alert('Fehler');
}
else {
this.tasks.push(...response.body);
}
});
}
ngOnInit(): void {
}
public deleteTask(task: Task) {
this.backendService.deleteTask(task).subscribe(response => {
if (response.status > 399) {
alert('Fehler');
}
});
const index = this.tasks.indexOf(task);
if (index !== -1) {
this.tasks.splice(index, 1);
}
}
public openTaskForm(editTask: Task) {
const modalRef = this.modalService.open(TaskFormComponent, {
backdrop: 'static',
keyboard: true,
});
modalRef.componentInstance.task = editTask;
}
}
import { Component, OnInit } from '@angular/core';
import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
import { BackendService, ScrumTask } from '../services/backend.service';
import { TaskFormComponent } from '../task-form/task-form.component';
@Component({
selector: 'app-task-list',
templateUrl: './task-list.component.html',
styleUrls: ['./task-list.component.css']
})
export class TaskListComponent implements OnInit {
public tasks: ScrumTask[] = [];
constructor(private backendService: BackendService, private modalService: NgbModal) {
backendService.getTasks().subscribe(response => {
if (response.status > 399) {
alert('Fehler');
}
else {
this.tasks.push(...response.body);
}
});
}
ngOnInit(): void {
}
public deleteTask(task: ScrumTask) {
this.backendService.deleteTask(task).subscribe(response => {
if (response.status > 399) {
alert('Fehler');
}
});
const index = this.tasks.indexOf(task);
if (index !== -1) {
this.tasks.splice(index, 1);
}
}
public openTaskForm(editTask: ScrumTask) {
const modalRef = this.modalService.open(TaskFormComponent, {
backdrop: 'static',
keyboard: true,
});
if (editTask === null) {
modalRef.result.then(result => {
this.tasks.push(result);
});
}
modalRef.componentInstance.task = editTask;
}
}

0
src/app/userstory-form/userstory-form.component.css Normal file
View File

25
src/app/userstory-form/userstory-form.component.html Normal file
View File

@ -0,0 +1,25 @@
<div class="modal-content p-3">
<form (ngSubmit)="onSubmit()">
<div class="form-group">
<label for="Title">Titel</label>
<input type="text" class="form-control" id="Title" required name="title" [(ngModel)]="title">
</div>
<div class="form-group">
<label for="Inhalt">Inhalt</label>
<input type="text" class="form-control" id="Content" required name="content" [(ngModel)]="content">
</div>
<div class="form-group">
<label for="Prio">Prio</label>
<select class="form-control" id="prio" required name="prio" [(ngModel)]="prio">
<option value="low">Low</option>
<option value="medium">Medium</option>
<option value="high">High</option>
</select>
</div>
<button type="submit" class="btn btn-success">Submit</button>
</form>
</div>

52
src/app/userstory-form/userstory-form.component.ts Normal file
View File

@ -0,0 +1,52 @@
import { Component, OnInit, Input } from '@angular/core';
import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
import { BackendService, ScrumUserstory, Priority } from '../services/backend.service';
@Component({
selector: 'app-userstory-form',
templateUrl: './userstory-form.component.html',
styleUrls: ['./userstory-form.component.css']
})
export class UserstoryFormComponent implements OnInit {
public title: string;
public content: string;
public prio: Priority;
@Input()
public userstory: ScrumUserstory;
private submitted: boolean;
constructor(private backendService: BackendService, private activeModalService: NgbActiveModal) { }
ngOnInit(): void {
if (this.userstory !== null && this.userstory !== undefined) {
this.title = this.userstory.title;
this.content = this.userstory.content;
this.prio = this.userstory.priority;
}
}
onSubmit() {
if (this.userstory !== null && this.userstory !== undefined) {
this.userstory.title = this.title;
this.userstory.content = this.content;
this.userstory.priority = this.prio;
this.backendService.putUserstory(this.userstory).subscribe(response => {
if (response.status > 399) {
alert('Fehler');
}
});
}
else {
this.userstory = { title: this.title, content: this.content, priority: this.prio };
this.backendService.postUserstory(this.userstory).subscribe(response => {
if (response.status > 399) {
alert('Fehler');
}
});
}
this.submitted = true;
this.activeModalService.close(this.userstory);
}
}

0
src/app/userstory-list/userstory-list.component.css Normal file
View File

14
src/app/userstory-list/userstory-list.component.html Normal file
View File

@ -0,0 +1,14 @@
<button class="btn btn-dark m-3" (click)="openUserstoryForm(null)">Neu</button>
<ul class="list-group m-3">
<li *ngFor="let userstory of userstories" class="list-group-item">
<span>Titel: {{userstory.title}}</span>
<br/>
<span>Inhalt: {{userstory.content}}</span>
<br/>
<span>Priotität: {{userstory.priority}}</span>
<br>
<button class="btn btn-secondary m-2" (click)="openUserstoryForm(userstory)">Bearbeiten</button>
<button class="btn btn-secondary m-2" (click)="deleteUserstory(userstory)">Löschen</button>
</li>
</ul>

54
src/app/userstory-list/userstory-list.component.ts Normal file
View File

@ -0,0 +1,54 @@
import { Component, OnInit } from '@angular/core';
import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
import { BackendService, ScrumUserstory } from '../services/backend.service';
import { UserstoryFormComponent } from '../userstory-form/userstory-form.component';
@Component({
selector: 'app-userstory-list',
templateUrl: './userstory-list.component.html',
styleUrls: ['./userstory-list.component.css']
})
export class UserstoryListComponent implements OnInit {
public userstories: ScrumUserstory[] = [];
constructor(private backendService: BackendService, private modalService: NgbModal) {
backendService.getUserstories().subscribe(response => {
if (response.status > 399) {
alert('Fehler');
}
else {
this.userstories.push(...response.body);
}
});
}
ngOnInit(): void {
}
public deleteUserstory(userstory: ScrumUserstory) {
this.backendService.deleteUserstory(userstory).subscribe(response => {
if (response.status > 399) {
alert('Fehler');
}
});
const index = this.userstories.indexOf(userstory);
if (index !== -1) {
this.userstories.splice(index, 1);
}
}
public openUserstoryForm(editUserstory: ScrumUserstory) {
const modalRef = this.modalService.open(UserstoryFormComponent, {
backdrop: 'static',
keyboard: true,
});
if (editUserstory === null) {
modalRef.result.then(result => {
this.userstories.push(result);
});
}
modalRef.componentInstance.userstory = editUserstory;
}
}