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

Prettified all the things

Browse Source
This commit is contained in:
Nicolai Ort 2020-07-10 22:49:11 +02:00
parent 073b621494
commit ac0b901c35
50 changed files with 2155 additions and 1632 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

49
.prettierignore Normal file
View File

@ -0,0 +1,49 @@
# See http://help.github.com/ignore-files/ for more about ignoring files.
# compiled output
dist
tmp
out-tsc
assets
src\assets
# Only exists if Bazel was run
bazel-out
# dependencies
node_modules
# profiling files
chrome-profiler-events*.json
speed-measure-plugin*.json
# IDEs and editors
.idea
.project
.classpath
.c9
*.launch
.settings/
*.sublime-workspace
package-lock.json
# IDE - VSCode
.vscode
# misc
.sass-cache
connect.lock
coverage
libpeerconnection.log
npm-debug.log
yarn-error.log
testem.log
/typings
# System Files
.DS_Store
Thumbs.db
# Other ignore files
.gitignore
.dockerignore
.gitlab-ci.yml

16
README.md
View File

@ -3,6 +3,7 @@
This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 9.1.7.
## Angular CLI
### Development server
Run `ng serve` for a dev server. Navigate to `http://localhost:4200/`. The app will automatically reload if you change any of the source files.
@ -28,27 +29,32 @@ Run `ng e2e` to execute the end-to-end tests via [Protractor](http://www.protrac
To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI README](https://github.com/angular/angular-cli/blob/master/README.md).
## Deploy with Docker
> Prerequisite: Docker and/or Docker Compose have to be installed on your system </br>
> The Docker installation instructions for most operation systems can be found here: [https://docs.docker.com/get-docker/](https://docs.docker.com/get-docker/) </br>
> The Docker Compose installation instructions for most operation systems can be found here: [https://docs.docker.com/compose/install/](https://docs.docker.com/compose/install/)
> To use the prebuild images log into the private registry: docker login -u testuser -p LpH2v1mShPpC8Xeimkd2AISA03zaC+vq scrumdev.azurecr.io
### Quick Deployment with Docker Compose
1. Clone the git repo
2. Open the cloned repo's folder in a shell of your choice (as long as it supports Docker)
3. Tell Docker Compose to run the app alongside a database with `docker-compose up`
Other useful commands:
* Run attached (in the background): `docker-compose up -d`
* Stop: `docker-compose down`
* Restart: `docker-compose restart`
- Run attached (in the background): `docker-compose up -d`
- Stop: `docker-compose down`
- Restart: `docker-compose restart`
### Build the Container yourself (and run it)
1. Clone the git repo
2. Open the cloned repo's folder in a shell of your choice (as long as it supports Docker)
3. Tell Docker to build the app under the name "taskboard/frontend" with `docker build -t taskboard/frontend .`
4. Tell Docker to run the app on port 8080 with `docker run -p 8080:80 taskboard/frontend`
Other useful commands:
* Run detached: `docker run -d -p 8080:80 taskboard/frontend`
* Run under specified name: `docker run -p 8080:80 --name frontend taskboard/frontend`
- Run detached: `docker run -d -p 8080:80 taskboard/frontend`
- Run under specified name: `docker run -p 8080:80 --name frontend taskboard/frontend`

21
angular.json
View File

@ -20,17 +20,13 @@
"tsConfig": "tsconfig.app.json",
"preserveSymlinks": true,
"aot": true,
"assets": [
"src/favicon.ico",
"src/assets"
],
"assets": ["src/favicon.ico", "src/assets"],
"styles": [
"node_modules/bootstrap/dist/css/bootstrap.min.css",
"src/styles.scss",
"src/assets/scss/black-dashboard.scss"
],
"scripts": [
]
"scripts": []
},
"configurations": {
"production": {
@ -87,13 +83,8 @@
"polyfills": "src/polyfills.ts",
"tsConfig": "tsconfig.spec.json",
"karmaConfig": "karma.conf.js",
"assets": [
"src/favicon.ico",
"src/assets"
],
"styles": [
"src/styles.scss"
],
"assets": ["src/favicon.ico", "src/assets"],
"styles": ["src/styles.scss"],
"scripts": []
}
},
@ -105,9 +96,7 @@
"tsconfig.spec.json",
"e2e/tsconfig.json"
],
"exclude": [
"**/node_modules/**"
]
"exclude": ["**/node_modules/**"]
}
},
"e2e": {

24
e2e/protractor.conf.js
View File

@ -2,31 +2,31 @@
// Protractor configuration file, see link for more information
// https://github.com/angular/protractor/blob/master/lib/config.ts
const { SpecReporter } = require('jasmine-spec-reporter');
const { SpecReporter } = require("jasmine-spec-reporter");
/**
* @type { import("protractor").Config }
*/
exports.config = {
allScriptsTimeout: 11000,
specs: [
'./src/**/*.e2e-spec.ts'
],
specs: ["./src/**/*.e2e-spec.ts"],
capabilities: {
browserName: 'chrome'
browserName: "chrome",
},
directConnect: true,
baseUrl: 'http://localhost:4200/',
framework: 'jasmine',
baseUrl: "http://localhost:4200/",
framework: "jasmine",
jasmineNodeOpts: {
showColors: true,
defaultTimeoutInterval: 30000,
print: function() {}
print: function () {},
},
onPrepare() {
require('ts-node').register({
project: require('path').join(__dirname, './tsconfig.json')
require("ts-node").register({
project: require("path").join(__dirname, "./tsconfig.json"),
});
jasmine.getEnv().addReporter(new SpecReporter({ spec: { displayStacktrace: true } }));
}
jasmine
.getEnv()
.addReporter(new SpecReporter({ spec: { displayStacktrace: true } }));
},
};

6
e2e/src/app.e2e-spec.ts
View File

@ -16,8 +16,10 @@ describe('workspace-project App', () => {
afterEach(async () => {
// Assert that there are no errors emitted from the browser
const logs = await browser.manage().logs().get(logging.Type.BROWSER);
expect(logs).not.toContain(jasmine.objectContaining({
expect(logs).not.toContain(
jasmine.objectContaining({
level: logging.Level.SEVERE,
} as logging.Entry));
} as logging.Entry)
);
});
});

4
e2e/src/app.po.ts
View File

@ -6,6 +6,8 @@ export class AppPage {
}
getTitleText(): Promise<string> {
return element(by.css('app-root .content span')).getText() as Promise<string>;
return element(by.css('app-root .content span')).getText() as Promise<
string
>;
}
}

6
e2e/tsconfig.json
View File

@ -4,10 +4,6 @@
"outDir": "../out-tsc/e2e",
"module": "commonjs",
"target": "es5",
"types": [
"jasmine",
"jasminewd2",
"node"
]
"types": ["jasmine", "jasminewd2", "node"]
}
}

28
karma.conf.js
View File

@ -3,30 +3,30 @@
module.exports = function (config) {
config.set({
basePath: '',
frameworks: ['jasmine', '@angular-devkit/build-angular'],
basePath: "",
frameworks: ["jasmine", "@angular-devkit/build-angular"],
plugins: [
require('karma-jasmine'),
require('karma-chrome-launcher'),
require('karma-jasmine-html-reporter'),
require('karma-coverage-istanbul-reporter'),
require('@angular-devkit/build-angular/plugins/karma')
require("karma-jasmine"),
require("karma-chrome-launcher"),
require("karma-jasmine-html-reporter"),
require("karma-coverage-istanbul-reporter"),
require("@angular-devkit/build-angular/plugins/karma"),
],
client: {
clearContext: false // leave Jasmine Spec Runner output visible in browser
clearContext: false, // leave Jasmine Spec Runner output visible in browser
},
coverageIstanbulReporter: {
dir: require('path').join(__dirname, './coverage/frontend'),
reports: ['html', 'lcovonly', 'text-summary'],
fixWebpackSourcePaths: true
dir: require("path").join(__dirname, "./coverage/frontend"),
reports: ["html", "lcovonly", "text-summary"],
fixWebpackSourcePaths: true,
},
reporters: ['progress', 'kjhtml'],
reporters: ["progress", "kjhtml"],
port: 9876,
colors: true,
logLevel: config.LOG_INFO,
autoWatch: true,
browsers: ['Chrome'],
browsers: ["Chrome"],
singleRun: false,
restartOnFileChange: true
restartOnFileChange: true,
});
};

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

@ -1,5 +1,4 @@
<div class="container-fluid">
<div class="sidebar">
<div class="logo">
<a class="simple-text logo-normal">
@ -69,8 +68,16 @@
-->
<li class="adjustments-line text-center color-change">
<span class="color-label"> LIGHT MODE </span>
<span class=" badge light-badge mr-2" (click)="changeDashboardColor('white-content')"> </span>
<span class=" badge dark-badge ml-2" (click)="changeDashboardColor('black-content')"> </span>
<span
class="badge light-badge mr-2"
(click)="changeDashboardColor('white-content')"
>
</span>
<span
class="badge dark-badge ml-2"
(click)="changeDashboardColor('black-content')"
>
</span>
<span class="color-label"> DARK MODE </span>
</li>
</ul>

12
src/app/app.component.spec.ts
View File

@ -5,12 +5,8 @@ import { AppComponent } from './app.component';
describe('AppComponent', () => {
beforeEach(async(() => {
TestBed.configureTestingModule({
imports: [
RouterTestingModule
],
declarations: [
AppComponent
],
imports: [RouterTestingModule],
declarations: [AppComponent],
}).compileComponents();
}));
@ -30,6 +26,8 @@ describe('AppComponent', () => {
const fixture = TestBed.createComponent(AppComponent);
fixture.detectChanges();
const compiled = fixture.debugElement.nativeElement;
expect(compiled.querySelector('.content span').textContent).toContain('frontend app is running!');
expect(compiled.querySelector('.content span').textContent).toContain(
'frontend app is running!'
);
});
});

5
src/app/app.component.ts
View File

@ -3,7 +3,7 @@ import { Component } from '@angular/core';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
styleUrls: ['./app.component.css'],
})
export class AppComponent {
/*
@ -25,8 +25,7 @@ export class AppComponent {
var body = document.getElementsByTagName('body')[0];
if (body && color === 'white-content') {
body.classList.add(color);
}
else if(body.classList.contains('white-content')) {
} else if (body.classList.contains('white-content')) {
body.classList.remove('white-content');
}
}

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

@ -30,7 +30,7 @@ import { BacklogComponent } from './components/backlog/backlog.component';
SprintTableComponent,
DashboardComponent,
UserstoryInnerTableComponent,
BacklogComponent
BacklogComponent,
],
imports: [
BrowserModule,

75
src/app/components/backlog/backlog.component.html
View File

@ -4,7 +4,9 @@
<div class="row">
<div class="col-lg-6 container-fluid"></div>
<div align="right" class="col-lg-6 container-fluid">
<button class="btn btn-secondary" (click)="openSprintForm()">Neuer Sprint</button>
<button class="btn btn-secondary" (click)="openSprintForm()">
Neuer Sprint
</button>
</div>
</div>
@ -24,14 +26,30 @@
<h3 *ngIf="selectedSprint === currentSprint">Aktueller Sprint:</h3>
<h3 *ngIf="selectedSprint !== currentSprint">Sprint:</h3>
<div ngbDropdown="ngbDropdown" class="dropdown">
<button ngbDropdownToggle="ngbDropdownToggle" class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenu2" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<button
ngbDropdownToggle="ngbDropdownToggle"
class="btn btn-secondary dropdown-toggle"
type="button"
id="dropdownMenu2"
data-toggle="dropdown"
aria-haspopup="true"
aria-expanded="false"
>
{{ selectedSprint.title }}
({{ toDateString(selectedSprint.startDate) }}
-
{{ toDateString(selectedSprint.endDate) }})
</button>
<div ngbDropdownMenu="ngbDropdownMenu" class="dropdown-menu" aria-labelledby="dropdownMenu2">
<option ngbDropdownItem="ngbDropdownItem" *ngFor="let s of sprints" (click)="this.selectedSprint = s;">
<div
ngbDropdownMenu="ngbDropdownMenu"
class="dropdown-menu"
aria-labelledby="dropdownMenu2"
>
<option
ngbDropdownItem="ngbDropdownItem"
*ngFor="let s of sprints"
(click)="this.selectedSprint = s"
>
{{ s.title }}
({{ toDateString(selectedSprint.startDate) }}
-
@ -50,17 +68,28 @@
<div class="card" style="width: 150%;">
<div class="card-body">
<h4 class="card-title">{{ story.title }}</h4>
<h6 class="card-subtitle mb-2 text-muted">Prio:
{{story.priority}}</h6>
<h6 class="card-subtitle mb-2 text-muted">
Prio: {{ story.priority }}
</h6>
<p class="card-text">{{ story.content }}</p>
<div title="Badges">
<span class="badge badge-primary">Category:
{{story.categoryid || "N/A"}}</span>
<span class="badge badge-info">Status:
{{story.statusid || "N/A"}}</span>
<span class="badge badge-primary"
>Category: {{ story.categoryid || "N/A" }}</span
>
<span class="badge badge-info"
>Status: {{ story.statusid || "N/A" }}</span
>
</div>
<div style="text-align: right;" *ngIf="selectedSprint != undefined">
<button type="button" rel="tooltip" (click)="addToSprintBacklog(story)" class="btn btn-sm btn-success btn-icon">
<div
style="text-align: right;"
*ngIf="selectedSprint != undefined"
>
<button
type="button"
rel="tooltip"
(click)="addToSprintBacklog(story)"
class="btn btn-sm btn-success btn-icon"
>
<i class="fas fa-plus-square"></i>
</button>
</div>
@ -74,17 +103,25 @@
<div class="card" style="width: 150%;">
<div class="card-body">
<h4 class="card-title">{{ story.title }}</h4>
<h6 class="card-subtitle mb-2 text-muted">Prio:
{{story.priority}}</h6>
<h6 class="card-subtitle mb-2 text-muted">
Prio: {{ story.priority }}
</h6>
<p class="card-text">{{ story.content }}</p>
<div title="Badges">
<span class="badge badge-primary">Category:
{{story.categoryid || "N/A"}}</span>
<span class="badge badge-info">Status:
{{story.statusid || "N/A"}}</span>
<span class="badge badge-primary"
>Category: {{ story.categoryid || "N/A" }}</span
>
<span class="badge badge-info"
>Status: {{ story.statusid || "N/A" }}</span
>
</div>
<div style="text-align: right;">
<button type="button" rel="tooltip" (click)="deleteFromSprintBacklog(story)" class="btn btn-danger btn-sm btn-icon">
<button
type="button"
rel="tooltip"
(click)="deleteFromSprintBacklog(story)"
class="btn btn-danger btn-sm btn-icon"
>
<i class="fa fa-trash"></i>
</button>
</div>

27
src/app/components/backlog/backlog.component.ts
View File

@ -9,14 +9,11 @@ import {
import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
import { SprintFormComponent } from '../sprint-form/sprint-form.component';
@Component({
selector: 'app-backlog',
templateUrl: './backlog.component.html',
styleUrls: ['./backlog.component.css'],
})
export class BacklogComponent {
public status: ScrumStatus[] = [];
public categories: ScrumCategory[] = [];
@ -31,7 +28,7 @@ export class BacklogComponent{
*/
constructor(
private backendService: BackendService,
private modalService: NgbModal,
private modalService: NgbModal
) {
backendService.getSprints().subscribe((response) => {
if (response.status > 399) {
@ -80,19 +77,19 @@ export class BacklogComponent{
* The relation to the sprint is determined by the userstory's sprintid.
* If no sprint is selected it just returns an empty array.
*/
public get choosen(): ScrumUserstory[]
{
if(this.selectedSprint === undefined){return null;}
return this.storys.filter(u => u.sprintid == this.selectedSprint.id);
public get choosen(): ScrumUserstory[] {
if (this.selectedSprint === undefined) {
return null;
}
return this.storys.filter((u) => u.sprintid == this.selectedSprint.id);
}
/**
* Getter that returns an array with all userstories that aren't in any sprint.
* The relation to no sprint is determined by the userstory's sprintid being undefined.
*/
public get backlog(): ScrumUserstory[]
{
return this.storys.filter(u => u.sprintid === undefined);
public get backlog(): ScrumUserstory[] {
return this.storys.filter((u) => u.sprintid === undefined);
}
/**
@ -101,7 +98,9 @@ export class BacklogComponent{
*/
public get currentSprint(): ScrumSprint {
const now = Date.now();
return this.sprints.find(s => Date.parse(s.startDate) < now && Date.parse(s.endDate) > now);
return this.sprints.find(
(s) => Date.parse(s.startDate) < now && Date.parse(s.endDate) > now
);
}
//#endregion getters
@ -145,10 +144,10 @@ export class BacklogComponent{
const modalRef = this.modalService.open(SprintFormComponent, {
backdrop: 'static',
keyboard: true,
size: "md",
size: 'md',
});
modalRef.result.then(result => {
modalRef.result.then((result) => {
this.sprints.push(result);
});
}

68
src/app/components/dashboard/dashboard.component.html
View File

@ -1,36 +1,57 @@
<div class="container-fluid">
<div class="content">
<h3>Dashboard</h3>
<div>
<div class="row px-3 py-2">
<ng-container *ngIf="selectedSprint === undefined">
<h3 class="mr-3 text-primary">Alle Userstories</h3>
<a [routerLink]="['sprints']">Lege einen Sprint an, um Userstories zu organisieren.</a>
<a [routerLink]="['sprints']"
>Lege einen Sprint an, um Userstories zu organisieren.</a
>
</ng-container>
<ng-container *ngIf="selectedSprint !== undefined">
<h3 class="mr-3 text-primary" *ngIf="selectedSprint === currentSprint">Aktueller Sprint:</h3>
<h3 class="mr-3 text-primary" *ngIf="selectedSprint !== currentSprint">Sprint:</h3>
<h3
class="mr-3 text-primary"
*ngIf="selectedSprint === currentSprint"
>
Aktueller Sprint:
</h3>
<h3
class="mr-3 text-primary"
*ngIf="selectedSprint !== currentSprint"
>
Sprint:
</h3>
<h3 class="mr-3 custom-text-secondary">{{ selectedSprint.title }}</h3>
<h3 class="mr-3">{{toDateString(selectedSprint.startDate)}} - {{toDateString(selectedSprint.endDate)}}</h3>
<h3 class="mr-3">
{{ toDateString(selectedSprint.startDate) }} -
{{ toDateString(selectedSprint.endDate) }}
</h3>
<label class="mr-3">
<select class="select custom-select custom-text-secondary" [(ngModel)]="selectedSprint">
<select
class="select custom-select custom-text-secondary"
[(ngModel)]="selectedSprint"
>
<option class="bg-secondary text-dark" [ngValue]="currentSprint">
{{ currentSprint.title }} (aktuell)
</option>
<option value="" disabled="disabled">─────────────────────────</option>
<option class="text-dark" *ngFor="let sprint of sprints" [ngValue]="sprint">
<option value="" disabled="disabled"
>─────────────────────────</option
>
<option
class="text-dark"
*ngFor="let sprint of sprints"
[ngValue]="sprint"
>
<ng-container *ngIf="sprint === currentSprint">
{{ sprint.title }} (aktuell)
</ng-container>
<ng-container *ngIf="sprint !== currentSprint">
{{sprint.title}} ({{toDateString(sprint.startDate)}} - {{toDateString(sprint.endDate)}})
{{ sprint.title }} ({{ toDateString(sprint.startDate) }} -
{{ toDateString(sprint.endDate) }})
</ng-container>
</option>
</select>
@ -46,13 +67,10 @@
>
Verbleibende Tage: {{ getRemainingDaysInSprint() }}
</h3>
</ng-container>
</div>
<div class="row">
<div class="p-3 col-12 col-xl-6 col-lg-6 col-md-12 col-sm-12">
<div class="card">
<div class="card-header">
@ -61,17 +79,17 @@
</span>
</div>
<div class="card-body">
<div *ngIf="selectedSprint !== undefined && usedStatus.length === 0">
Zum Sprint "{{selectedSprint.title}}" sind aktuell keine Userstories vorhanden.
<div
*ngIf="selectedSprint !== undefined && usedStatus.length === 0"
>
Zum Sprint "{{ selectedSprint.title }}" sind aktuell keine
Userstories vorhanden.
</div>
<canvas id="done-stories-chart"></canvas>
</div>
</div>
<div class="card-deck">
<div
class="card text-center"
*ngFor="let status of usedStatus"
>
<div class="card text-center" *ngFor="let status of usedStatus">
<div class="card-header">
<span class="text-large">
{{ status.title }}
@ -89,13 +107,13 @@
<div class="p-3 col-12 col-xl-6 col-lg-6 col-md-12 col-sm-12">
<div class="card">
<div class="card-body">
<app-userstory-inner-table [storys]="selectedSprintUserstories"></app-userstory-inner-table>
<app-userstory-inner-table
[storys]="selectedSprintUserstories"
></app-userstory-inner-table>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>

79
src/app/components/dashboard/dashboard.component.ts
View File

@ -1,31 +1,44 @@
import { Component, OnChanges } from '@angular/core';
import { forkJoin } from 'rxjs';
import Chart from 'chart.js';
import {BackendService, ScrumSprint, ScrumStatus, ScrumUserstory} from '../../services/backend.service';
import {
BackendService,
ScrumSprint,
ScrumStatus,
ScrumUserstory,
} from '../../services/backend.service';
@Component({
selector: 'app-dashboard',
templateUrl: 'dashboard.component.html',
styleUrls: ['./dashboard.component.css']
styleUrls: ['./dashboard.component.css'],
})
export class DashboardComponent {
/**
* Returns the status that are used by at least one userstory.
*/
public get usedStatus(): ScrumStatus[] {
return this.status.filter(s => this.selectedSprintUserstories.find(us => us.statusid === s.id) !== undefined);
return this.status.filter(
(s) =>
this.selectedSprintUserstories.find((us) => us.statusid === s.id) !==
undefined
);
}
public get selectedSprintUserstories(): ScrumUserstory[] {
if (this.selectedSprint === undefined) {
return this.userstories;
}
return this.userstories.filter(us => us.sprintid === this.selectedSprint.id);
return this.userstories.filter(
(us) => us.sprintid === this.selectedSprint.id
);
}
public get currentSprint(): ScrumSprint {
const now = Date.now();
return this.sprints.find(s => Date.parse(s.startDate) < now && Date.parse(s.endDate) > now);
return this.sprints.find(
(s) => Date.parse(s.startDate) < now && Date.parse(s.endDate) > now
);
}
private _selectedSprint: ScrumSprint;
@ -53,10 +66,17 @@ export class DashboardComponent {
constructor(private backendService: BackendService) {
// download userstories, status and sprints and update
// the chart whenever a new response is there
forkJoin([backendService.getUserstories(), backendService.getAllStatus(), backendService.getSprints()])
.subscribe(results => {
forkJoin([
backendService.getUserstories(),
backendService.getAllStatus(),
backendService.getSprints(),
]).subscribe((results) => {
const [userstoryResponse, statusResponse, sprintResponse] = results;
if (userstoryResponse.status > 399 || statusResponse.status > 399 || sprintResponse.status > 399) {
if (
userstoryResponse.status > 399 ||
statusResponse.status > 399 ||
sprintResponse.status > 399
) {
alert('Fehler');
} else {
this.userstories.push(...userstoryResponse.body);
@ -77,31 +97,35 @@ export class DashboardComponent {
private createChart() {
// @ts-ignore
const context = document.getElementById('done-stories-chart').getContext('2d');
const context = document
.getElementById('done-stories-chart')
.getContext('2d');
if (this.usedStatus.length === 0) {
this.chart.destroy();
}
else {
} else {
this.chart = new Chart(context, {
type: 'pie',
data: {
labels: this.usedStatus.map(s => s.title),
datasets: [{
data: this.usedStatus.map(s => this.getNumberOfUserstoriesByStatus(s)),
labels: this.usedStatus.map((s) => s.title),
datasets: [
{
data: this.usedStatus.map((s) =>
this.getNumberOfUserstoriesByStatus(s)
),
backgroundColor: this.getBackgroundColors(),
options: {
legend: {
display: true,
position: 'right',
labels: {
fontColor: 'rgba(255, 255, 255, 0.8)'
}
}
}
}]
}
fontColor: 'rgba(255, 255, 255, 0.8)',
},
},
},
},
],
},
});
this.chart.update();
this.chart.render();
@ -133,14 +157,18 @@ export class DashboardComponent {
}
public getNumberOfUserstoriesByStatus(status: ScrumStatus): number {
return this.selectedSprintUserstories.filter(us => us.statusid === status.id).length;
return this.selectedSprintUserstories.filter(
(us) => us.statusid === status.id
).length;
}
public getRemainingDaysInSprint(): number {
if (this.selectedSprint === undefined) {
return undefined;
}
return Math.floor((Date.parse(this.selectedSprint.endDate) - Date.now()) / 86400000);
return Math.floor(
(Date.parse(this.selectedSprint.endDate) - Date.now()) / 86400000
);
}
/**
@ -154,7 +182,8 @@ export class DashboardComponent {
return undefined;
}
const deltaFromNow = Date.parse(sprint.endDate) - now;
const deltaFromStart = Date.parse(sprint.endDate) - Date.parse(sprint.startDate);
return Math.floor(3 * deltaFromNow / deltaFromStart);
const deltaFromStart =
Date.parse(sprint.endDate) - Date.parse(sprint.startDate);
return Math.floor((3 * deltaFromNow) / deltaFromStart);
}
}

46
src/app/components/sprint-form/sprint-form.component.html
View File

@ -10,22 +10,52 @@
<form (ngSubmit)="onSubmit()">
<div class="form-group">
<label for="Title">Titel</label>
<input type="text" class="form-control" id="Title" required name="title" [(ngModel)]="sprint.title"
id="titleField">
<input
type="text"
class="form-control"
id="Title"
required
name="title"
[(ngModel)]="sprint.title"
id="titleField"
/>
</div>
<div class="form-group">
<label for="date">Startdatum</label>
<input #startDate type="Date" class="form-control" id="Date" required name="date"
[value]="sprint.startDate | date: 'yyyy-MM-dd'" (change)="sprint.startDate=startDate.value"
id="startDateField">
<input
#startDate
type="Date"
class="form-control"
id="Date"
required
name="date"
[value]="sprint.startDate | date: 'yyyy-MM-dd'"
(change)="sprint.startDate = startDate.value"
id="startDateField"
/>
</div>
<div class="form-group">
<label for="Date">Enddatum</label>
<input #endDate type="date" class="form-control" id="Date" required name="date"
[value]="sprint.endDate | date: 'yyyy-MM-dd'" (change)="sprint.endDate=endDate.value" id="endDateField">
<input
#endDate
type="date"
class="form-control"
id="Date"
required
name="date"
[value]="sprint.endDate | date: 'yyyy-MM-dd'"
(change)="sprint.endDate = endDate.value"
id="endDateField"
/>
</div>
<div>
<button (click)="onClose()" type="dismiss" class="btn btn-secondary" data-dismiss="modal">Abbrechen
<button
(click)="onClose()"
type="dismiss"
class="btn btn-secondary"
data-dismiss="modal"
>
Abbrechen
</button>
<button type="submit" class="btn btn-primary">Sprint starten</button>
</div>

12
src/app/components/sprint-form/sprint-form.component.ts
View File

@ -1,15 +1,12 @@
// Importing necessary components and interfaces.
import { Component, OnInit, Input } from '@angular/core';
import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
import {
BackendService,
ScrumSprint
} from '../../services/backend.service';
import { BackendService, ScrumSprint } from '../../services/backend.service';
@Component({
selector: 'app-task-form',
templateUrl: './sprint-form.component.html',
styleUrls: ['./sprint-form.component.css']
styleUrls: ['./sprint-form.component.css'],
})
// Class implements the logic for a popup window form to create and modify sprints.
@ -18,7 +15,10 @@ export class SprintFormComponent implements OnInit {
public editing: Boolean;
public sprintid: string;
constructor(private backendService: BackendService, private activeModalService: NgbActiveModal) { }
constructor(
private backendService: BackendService,
private activeModalService: NgbActiveModal
) {}
// If no sprint exists a new one will be created.
// In other cases the sprint exists and gets modifiable.

76
src/app/components/tabels/sprint/sprint-table.component.html
View File

@ -4,40 +4,66 @@
Sprints
</h3>
<button class="btn btn-secondary" (click)="openSprintForm()">Neuer Sprint</button>
<button class="btn btn-secondary" (click)="openSprintForm()">
Neuer Sprint
</button>
<table class="table">
<thead>
<tr>
<th (click)="sortById()" class="sortable">
<span>ID</span>
<span>
<span *ngIf="sortBy != 'id'"><i class="fa fa-sort fa-lg"></i></span>
<span *ngIf="sortDescending && sortBy === 'id'"><i class="fa fa-sort-up fa-lg"></i></span>
<span *ngIf="sortDescending === false && sortBy === 'id'"><i class="fa fa-sort-down fa-lg"></i></span>
<span *ngIf="sortBy != 'id'"
><i class="fa fa-sort fa-lg"></i
></span>
<span *ngIf="sortDescending && sortBy === 'id'"
><i class="fa fa-sort-up fa-lg"></i
></span>
<span *ngIf="sortDescending === false && sortBy === 'id'"
><i class="fa fa-sort-down fa-lg"></i
></span>
</span>
</th>
<th (click)="sortByTitle()" class="sortable">
<span>Titel</span>
<span>
<span *ngIf="sortBy != 'title'"><i class="fa fa-sort fa-lg"></i></span>
<span *ngIf="sortDescending && sortBy === 'title'"><i class="fa fa-sort-up fa-lg"></i></span>
<span *ngIf="sortDescending === false && sortBy === 'title'"><i class="fa fa-sort-down fa-lg"></i></span>
<span *ngIf="sortBy != 'title'"
><i class="fa fa-sort fa-lg"></i
></span>
<span *ngIf="sortDescending && sortBy === 'title'"
><i class="fa fa-sort-up fa-lg"></i
></span>
<span *ngIf="sortDescending === false && sortBy === 'title'"
><i class="fa fa-sort-down fa-lg"></i
></span>
</span>
</th>
<th (click)="sortByStartDate()" class="sortable">
<span>Start</span>
<span>
<span *ngIf="sortBy != 'startDate'"><i class="fa fa-sort fa-lg"></i></span>
<span *ngIf="sortDescending && sortBy === 'startDate'"><i class="fa fa-sort-up fa-lg"></i></span>
<span *ngIf="sortDescending === false && sortBy === 'startDate'"><i class="fa fa-sort-down fa-lg"></i></span>
<span *ngIf="sortBy != 'startDate'"
><i class="fa fa-sort fa-lg"></i
></span>
<span *ngIf="sortDescending && sortBy === 'startDate'"
><i class="fa fa-sort-up fa-lg"></i
></span>
<span *ngIf="sortDescending === false && sortBy === 'startDate'"
><i class="fa fa-sort-down fa-lg"></i
></span>
</span>
</th>
<th (click)="sortByEndDate()" class="sortable">
<span>End</span>
<span>
<span *ngIf="sortBy != 'endDate'"><i class="fa fa-sort fa-lg"></i></span>
<span *ngIf="sortDescending && sortBy === 'endDate'"><i class="fa fa-sort-up fa-lg"></i></span>
<span *ngIf="sortDescending === false && sortBy === 'endDate'"><i class="fa fa-sort-down fa-lg"></i></span>
<span *ngIf="sortBy != 'endDate'"
><i class="fa fa-sort fa-lg"></i
></span>
<span *ngIf="sortDescending && sortBy === 'endDate'"
><i class="fa fa-sort-up fa-lg"></i
></span>
<span *ngIf="sortDescending === false && sortBy === 'endDate'"
><i class="fa fa-sort-down fa-lg"></i
></span>
</span>
</th>
<th></th>
@ -45,22 +71,34 @@
</thead>
<tbody>
<tr *ngFor="let sprint of items" [class.table-info]="sprint.id === highlightId">
<tr
*ngFor="let sprint of items"
[class.table-info]="sprint.id === highlightId"
>
<td>{{ sprint.id }}</td>
<td>{{ sprint.title }}</td>
<td>{{sprint.startDate | date:'dd.MM.yyyy'}}</td>
<td>{{sprint.endDate | date:'dd.MM.yyyy'}}</td>
<td>{{ sprint.startDate | date: "dd.MM.yyyy" }}</td>
<td>{{ sprint.endDate | date: "dd.MM.yyyy" }}</td>
<td>
<button type="button" rel="tooltip" (click)="openSprintForm(sprint)" class="btn btn-success btn-sm btn-icon">
<button
type="button"
rel="tooltip"
(click)="openSprintForm(sprint)"
class="btn btn-success btn-sm btn-icon"
>
<i class="fa fa-pencil-alt"></i>
</button>
<button type="button" rel="tooltip" (click)="deleteSprint(sprint)" class="btn btn-danger btn-sm btn-icon">
<button
type="button"
rel="tooltip"
(click)="deleteSprint(sprint)"
class="btn btn-danger btn-sm btn-icon"
>
<i class="fa fa-trash"></i>
</button>
</td>
</tr>
</tbody>
</table>
</div>
</div>

129
src/app/components/tabels/task/task-table.component.html
View File

@ -1,7 +1,10 @@
<div class="container-fluid">
<div class="content">
<h3>
<a *ngIf="filterUserstoryId" [routerLink]="['/userstories', {id: filterUserstoryId}]">
<a
*ngIf="filterUserstoryId"
[routerLink]="['/userstories', { id: filterUserstoryId }]"
>
Userstory #{{ filterUserstoryId }}
&gt;
</a>
@ -11,7 +14,9 @@
<a [routerLink]="'/tasks'">Alle Tasks anzeigen</a>
</div>
<button class="btn btn-secondary" (click)="openTaskForm()">Neuer Task</button>
<button class="btn btn-secondary" (click)="openTaskForm()">
Neuer Task
</button>
<table class="table">
<thead>
@ -19,66 +24,118 @@
<th (click)="sortById()" class="sortable">
<span>ID</span>
<span>
<span *ngIf="sortBy != 'id'"><i class="fa fa-sort fa-lg"></i></span>
<span *ngIf="sortDescending && sortBy === 'id'"><i class="fa fa-sort-up fa-lg"></i></span>
<span *ngIf="sortDescending === false && sortBy === 'id'"><i class="fa fa-sort-down fa-lg"></i></span>
<span *ngIf="sortBy != 'id'"
><i class="fa fa-sort fa-lg"></i
></span>
<span *ngIf="sortDescending && sortBy === 'id'"
><i class="fa fa-sort-up fa-lg"></i
></span>
<span *ngIf="sortDescending === false && sortBy === 'id'"
><i class="fa fa-sort-down fa-lg"></i
></span>
</span>
</th>
<th (click)="sortByTitle()" class="sortable">
<span>Titel</span>
<span>
<span *ngIf="sortBy != 'title'"><i class="fa fa-sort fa-lg"></i></span>
<span *ngIf="sortDescending && sortBy === 'title'"><i class="fa fa-sort-up fa-lg"></i></span>
<span *ngIf="sortDescending === false && sortBy === 'title'"><i class="fa fa-sort-down fa-lg"></i></span>
<span *ngIf="sortBy != 'title'"
><i class="fa fa-sort fa-lg"></i
></span>
<span *ngIf="sortDescending && sortBy === 'title'"
><i class="fa fa-sort-up fa-lg"></i
></span>
<span *ngIf="sortDescending === false && sortBy === 'title'"
><i class="fa fa-sort-down fa-lg"></i
></span>
</span>
</th>
<th (click)="sortByTasks()" class="sortable">
<span>Userstory</span>
<span>
<span *ngIf="sortBy != 'userstory'"><i class="fa fa-sort fa-lg"></i></span>
<span *ngIf="sortDescending && sortBy === 'userstory'"><i class="fa fa-sort-up fa-lg"></i></span>
<span *ngIf="sortDescending === false && sortBy === 'userstory'"><i class="fa fa-sort-down fa-lg"></i></span>
<span *ngIf="sortBy != 'userstory'"
><i class="fa fa-sort fa-lg"></i
></span>
<span *ngIf="sortDescending && sortBy === 'userstory'"
><i class="fa fa-sort-up fa-lg"></i
></span>
<span *ngIf="sortDescending === false && sortBy === 'userstory'"
><i class="fa fa-sort-down fa-lg"></i
></span>
</span>
</th>
<th (click)="sortByStatus()" class="sortable">
<span>Status</span>
<span>
<span *ngIf="sortBy != 'statusid'"><i class="fa fa-sort fa-lg"></i></span>
<span *ngIf="sortDescending && sortBy === 'statusid'"><i class="fa fa-sort-up fa-lg"></i></span>
<span *ngIf="sortDescending === false && sortBy === 'statusid'"><i class="fa fa-sort-down fa-lg"></i></span>
<span *ngIf="sortBy != 'statusid'"
><i class="fa fa-sort fa-lg"></i
></span>
<span *ngIf="sortDescending && sortBy === 'statusid'"
><i class="fa fa-sort-up fa-lg"></i
></span>
<span *ngIf="sortDescending === false && sortBy === 'statusid'"
><i class="fa fa-sort-down fa-lg"></i
></span>
</span>
</th>
<th class="sortable">
<div class="d-inline-block">
<span (click)="sortByPrio()">Priorität: </span>
<div ngbDropdown class="d-inline-block">
<span id="dropdownBasic1" ngbDropdownToggle>{{filterPriority || "All"}}</span>
<span id="dropdownBasic1" ngbDropdownToggle>{{
filterPriority || "All"
}}</span>
<div ngbDropdownMenu aria-labelledby="dropdownBasic1">
<option ngbDropdownItem (click)="filterPriority=null">All</option>
<option ngbDropdownItem *ngFor="let p of getAllPriorities()" (click)="filterPriority=p">{{p}}</option>
<option ngbDropdownItem (click)="filterPriority = null"
>All</option
>
<option
ngbDropdownItem
*ngFor="let p of getAllPriorities()"
(click)="filterPriority = p"
>{{ p }}</option
>
</div>
</div>
<span (click)="sortByPrio()">
<span *ngIf="sortBy != 'priority'"><i class="fa fa-sort fa-lg"></i></span>
<span *ngIf="sortDescending && sortBy === 'priority'"><i class="fa fa-sort-up fa-lg"></i></span>
<span *ngIf="sortDescending === false && sortBy === 'priority'"><i class="fa fa-sort-down fa-lg"></i></span>
<span *ngIf="sortBy != 'priority'"
><i class="fa fa-sort fa-lg"></i
></span>
<span *ngIf="sortDescending && sortBy === 'priority'"
><i class="fa fa-sort-up fa-lg"></i
></span>
<span *ngIf="sortDescending === false && sortBy === 'priority'"
><i class="fa fa-sort-down fa-lg"></i
></span>
</span>
</div>
</th>
<th (click)="sortByAssigned()" class="sortable">
<span>Assigned To</span>
<span>
<span *ngIf="sortBy != 'assignedtoid'"><i class="fa fa-sort fa-lg"></i></span>
<span *ngIf="sortDescending && sortBy === 'assignedtoid'"><i class="fa fa-sort-up fa-lg"></i></span>
<span *ngIf="sortDescending === false && sortBy === 'assignedtoid'"><i class="fa fa-sort-down fa-lg"></i></span>
<span *ngIf="sortBy != 'assignedtoid'"
><i class="fa fa-sort fa-lg"></i
></span>
<span *ngIf="sortDescending && sortBy === 'assignedtoid'"
><i class="fa fa-sort-up fa-lg"></i
></span>
<span
*ngIf="sortDescending === false && sortBy === 'assignedtoid'"
><i class="fa fa-sort-down fa-lg"></i
></span>
</span>
</th>
<th (click)="sortByCategory()" class="sortable">
<span>Category</span>
<span>
<span *ngIf="sortBy != 'categoryid'"><i class="fa fa-sort fa-lg"></i></span>
<span *ngIf="sortDescending && sortBy === 'categoryid'"><i class="fa fa-sort-up fa-lg"></i></span>
<span *ngIf="sortDescending === false && sortBy === 'categoryid'"><i class="fa fa-sort-down fa-lg"></i></span>
<span *ngIf="sortBy != 'categoryid'"
><i class="fa fa-sort fa-lg"></i
></span>
<span *ngIf="sortDescending && sortBy === 'categoryid'"
><i class="fa fa-sort-up fa-lg"></i
></span>
<span *ngIf="sortDescending === false && sortBy === 'categoryid'"
><i class="fa fa-sort-down fa-lg"></i
></span>
</span>
</th>
<th></th>
@ -86,7 +143,10 @@
</thead>
<tbody>
<tr *ngFor="let task of filteredItems" [class.table-info]="task.id === highlightId">
<tr
*ngFor="let task of filteredItems"
[class.table-info]="task.id === highlightId"
>
<td>{{ task.id }}</td>
<td>{{ task.title }}</td>
<td>
@ -111,16 +171,25 @@
</a>
</td>
<td>
<button type="button" rel="tooltip" (click)="openTaskForm(task)" class="btn btn-success btn-sm btn-icon">
<button
type="button"
rel="tooltip"
(click)="openTaskForm(task)"
class="btn btn-success btn-sm btn-icon"
>
<i class="fa fa-pencil-alt"></i>
</button>
<button type="button" rel="tooltip" (click)="deleteTask(task)" class="btn btn-danger btn-sm btn-icon">
<button
type="button"
rel="tooltip"
(click)="deleteTask(task)"
class="btn btn-danger btn-sm btn-icon"
>
<i class="fa fa-trash"></i>
</button>
</td>
</tr>
</tbody>
</table>
</div>
</div>

108
src/app/components/tabels/userstory-inner-table/userstory-inner-table.component.html
View File

@ -1,64 +1,108 @@
<button class="btn btn-secondary my-3" (click)="openUserstoryForm()">Neue Userstory</button>
<button class="btn btn-secondary my-3" (click)="openUserstoryForm()">
Neue Userstory
</button>
<table class="table">
<thead>
<tr>
<th (click)="sortById()" class="sortable">
<span>ID</span>
<span>
<span *ngIf="sortBy != 'id'"><i class="fa fa-sort fa-lg"></i></span>
<span *ngIf="sortDescending && sortBy === 'id'"><i class="fa fa-sort-up fa-lg"></i></span>
<span *ngIf="sortDescending === false && sortBy === 'id'"><i class="fa fa-sort-down fa-lg"></i></span>
<span *ngIf="sortDescending && sortBy === 'id'"
><i class="fa fa-sort-up fa-lg"></i
></span>
<span *ngIf="sortDescending === false && sortBy === 'id'"
><i class="fa fa-sort-down fa-lg"></i
></span>
</span>
</th>
<th (click)="sortByTitle()" class="sortable">
<span>Titel</span>
<span>
<span *ngIf="sortBy != 'title'"><i class="fa fa-sort fa-lg"></i></span>
<span *ngIf="sortDescending && sortBy === 'title'"><i class="fa fa-sort-up fa-lg"></i></span>
<span *ngIf="sortDescending === false && sortBy === 'title'"><i class="fa fa-sort-down fa-lg"></i></span>
<span *ngIf="sortBy != 'title'"
><i class="fa fa-sort fa-lg"></i
></span>
<span *ngIf="sortDescending && sortBy === 'title'"
><i class="fa fa-sort-up fa-lg"></i
></span>
<span *ngIf="sortDescending === false && sortBy === 'title'"
><i class="fa fa-sort-down fa-lg"></i
></span>
</span>
</th>
<th (click)="sortByTasks()" class="sortable">
<span>Tasks</span>
<span>
<span *ngIf="sortBy != 'tasks'"><i class="fa fa-sort fa-lg"></i></span>
<span *ngIf="sortDescending && sortBy === 'tasks'"><i class="fa fa-sort-up fa-lg"></i></span>
<span *ngIf="sortDescending === false && sortBy === 'tasks'"><i class="fa fa-sort-down fa-lg"></i></span>
<span *ngIf="sortBy != 'tasks'"
><i class="fa fa-sort fa-lg"></i
></span>
<span *ngIf="sortDescending && sortBy === 'tasks'"
><i class="fa fa-sort-up fa-lg"></i
></span>
<span *ngIf="sortDescending === false && sortBy === 'tasks'"
><i class="fa fa-sort-down fa-lg"></i
></span>
</span>
</th>
<th (click)="sortByStatus()" class="sortable">
<span>Status</span>
<span>
<span *ngIf="sortBy != 'statusid'"><i class="fa fa-sort fa-lg"></i></span>
<span *ngIf="sortDescending && sortBy === 'statusid'"><i class="fa fa-sort-up fa-lg"></i></span>
<span *ngIf="sortDescending === false && sortBy === 'statusid'"><i class="fa fa-sort-down fa-lg"></i></span>
<span *ngIf="sortBy != 'statusid'"
><i class="fa fa-sort fa-lg"></i
></span>
<span *ngIf="sortDescending && sortBy === 'statusid'"
><i class="fa fa-sort-up fa-lg"></i
></span>
<span *ngIf="sortDescending === false && sortBy === 'statusid'"
><i class="fa fa-sort-down fa-lg"></i
></span>
</span>
</th>
<th class="sortable">
<div class="d-inline-block">
<span (click)="sortByPrio()">Priorität: </span>
<div ngbDropdown class="d-inline-block">
<span id="dropdownBasic1" ngbDropdownToggle>{{filterPriority || "All"}}</span>
<span id="dropdownBasic1" ngbDropdownToggle>{{
filterPriority || "All"
}}</span>
<div ngbDropdownMenu aria-labelledby="dropdownBasic1">
<option ngbDropdownItem (click)="filterPriority=null">All</option>
<option ngbDropdownItem *ngFor="let p of getAllPriorities()" (click)="filterPriority=p">{{p}}</option>
<option ngbDropdownItem (click)="filterPriority = null"
>All</option
>
<option
ngbDropdownItem
*ngFor="let p of getAllPriorities()"
(click)="filterPriority = p"
>{{ p }}</option
>
</div>
</div>
<span (click)="sortByPrio()">
<span *ngIf="sortBy != 'priority'"><i class="fa fa-sort fa-lg"></i></span>
<span *ngIf="sortDescending && sortBy === 'priority'"><i class="fa fa-sort-up fa-lg"></i></span>
<span *ngIf="sortDescending === false && sortBy === 'priority'"><i class="fa fa-sort-down fa-lg"></i></span>
<span *ngIf="sortBy != 'priority'"
><i class="fa fa-sort fa-lg"></i
></span>
<span *ngIf="sortDescending && sortBy === 'priority'"
><i class="fa fa-sort-up fa-lg"></i
></span>
<span *ngIf="sortDescending === false && sortBy === 'priority'"
><i class="fa fa-sort-down fa-lg"></i
></span>
</span>
</div>
</th>
<th (click)="sortByCategory()" class="sortable">
<span>Category</span>
<span>
<span *ngIf="sortBy != 'categoryid'"><i class="fa fa-sort fa-lg"></i></span>
<span *ngIf="sortDescending && sortBy === 'categoryid'"><i class="fa fa-sort-up fa-lg"></i></span>
<span *ngIf="sortDescending === false && sortBy === 'categoryid'"><i class="fa fa-sort-down fa-lg"></i></span>
<span *ngIf="sortBy != 'categoryid'"
><i class="fa fa-sort fa-lg"></i
></span>
<span *ngIf="sortDescending && sortBy === 'categoryid'"
><i class="fa fa-sort-up fa-lg"></i
></span>
<span *ngIf="sortDescending === false && sortBy === 'categoryid'"
><i class="fa fa-sort-down fa-lg"></i
></span>
</span>
</th>
<th></th>
@ -66,7 +110,10 @@
</thead>
<tbody>
<tr *ngFor="let userstory of filteredItems" [class.table-info]="userstory.id === highlightId">
<tr
*ngFor="let userstory of filteredItems"
[class.table-info]="userstory.id === highlightId"
>
<td>{{ userstory.id }}</td>
<td>{{ userstory.title }}</td>
<td>
@ -86,14 +133,23 @@
</a>
</td>
<td>
<button type="button" rel="tooltip" (click)="openUserstoryForm(userstory)" class="btn btn-success btn-sm btn-icon">
<button
type="button"
rel="tooltip"
(click)="openUserstoryForm(userstory)"
class="btn btn-success btn-sm btn-icon"
>
<i class="fa fa-pencil-alt"></i>
</button>
<button type="button" rel="tooltip" (click)="deleteUserstory(userstory)" class="btn btn-danger btn-sm btn-icon">
<button
type="button"
rel="tooltip"
(click)="deleteUserstory(userstory)"
class="btn btn-danger btn-sm btn-icon"
>
<i class="fa fa-trash"></i>
</button>
</td>
</tr>
</tbody>
</table>

196
src/app/components/task-form/task-form.component.html
View File

@ -10,14 +10,29 @@
<div class="col-8" style="text-align: left;">
<h4 class="card-title">Neuen Task anlegen</h4>
<div ngbDropdown class="dropdown card-text">
<span ngbDropdownToggle class="dropdown" id="dropdownMenuUserstory" data-toggle="dropdown"
aria-haspopup="true" aria-expanded="false">
Gehört zu Story: {{getUserstoryTitleById(task.userstoryid) || "Keine"}}
<span
ngbDropdownToggle
class="dropdown"
id="dropdownMenuUserstory"
data-toggle="dropdown"
aria-haspopup="true"
aria-expanded="false"
>
Gehört zu Story:
{{ getUserstoryTitleById(task.userstoryid) || "Keine" }}
<i class="fa fa-caret-down"></i>
</span>
<div ngbDropdownMenu class="dropdown-menu" aria-labelledby="dropdownMenuUserstory">
<option ngbDropdownItem *ngFor="let userstory of userstories"
(click)="task.userstoryid = userstory.id">{{ userstory.title }}</option>
<div
ngbDropdownMenu
class="dropdown-menu"
aria-labelledby="dropdownMenuUserstory"
>
<option
ngbDropdownItem
*ngFor="let userstory of userstories"
(click)="task.userstoryid = userstory.id"
>{{ userstory.title }}</option
>
</div>
</div>
</div>
@ -28,74 +43,166 @@
<div class="col-8">
<div class="form-group">
<label for="Title">Titel</label>
<input type="text" class="form-control" id="Title" required name="title"
[(ngModel)]="task.title" id="titleField" />
<input
type="text"
class="form-control"
id="Title"
required
name="title"
[(ngModel)]="task.title"
id="titleField"
/>
</div>
<div class="form-group">
<label for="Inhalt">What to do?</label>
<textarea type="text" class="form-control" id="Story" required name="story" rows="5"
[(ngModel)]="task.content"></textarea>
<textarea
type="text"
class="form-control"
id="Story"
required
name="story"
rows="5"
[(ngModel)]="task.content"
></textarea>
</div>
</div>
<div class="col-4">
<div ngbDropdown class="dropdown">
<button ngbDropdownToggle class="btn btn-secondary dropdown-toggle" type="button"
id="dropdownMenu2" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<button
ngbDropdownToggle
class="btn btn-secondary dropdown-toggle"
type="button"
id="dropdownMenu2"
data-toggle="dropdown"
aria-haspopup="true"
aria-expanded="false"
>
Prio: {{ task.priority }}
</button>
<div ngbDropdownMenu class="dropdown-menu" aria-labelledby="dropdownMenu2">
<option ngbDropdownItem *ngFor="let p of getAllPriorities()" (click)="task.priority=p">
{{p}}</option>
<div
ngbDropdownMenu
class="dropdown-menu"
aria-labelledby="dropdownMenu2"
>
<option
ngbDropdownItem
*ngFor="let p of getAllPriorities()"
(click)="task.priority = p"
>
{{ p }}</option
>
</div>
</div>
<div class="form-group">
<div ngbDropdown class="dropdown" [autoClose]="false">
<button ngbDropdownToggle class="btn btn-secondary dropdown-toggle" type="button"
id="dropdownMenu3" data-toggle="dropdown" aria-haspopup="true"
aria-expanded="false">
<button
ngbDropdownToggle
class="btn btn-secondary dropdown-toggle"
type="button"
id="dropdownMenu3"
data-toggle="dropdown"
aria-haspopup="true"
aria-expanded="false"
>
Status: {{ getStatusTitleById(task.statusid) }}
</button>
<div ngbDropdownMenu class="dropdown-menu" aria-labelledby="dropdownMenu2">
<div
ngbDropdownMenu
class="dropdown-menu"
aria-labelledby="dropdownMenu2"
>
<div class="card-text" for="Inhalt">Status wählen</div>
<option disable-auto-close ngbDropdownItem *ngFor="let status of allStatus"
(click)="task.statusid = status.id">{{ status.title }}</option>
<option
disable-auto-close
ngbDropdownItem
*ngFor="let status of allStatus"
(click)="task.statusid = status.id"
>{{ status.title }}</option
>
<div class="dropdown-divider"></div>
<div class="card-text" for="Inhalt">Neuer Status</div>
<input #statusname type="text" id="statusname" class="dropdown-item"
(change)="status.title=statusname.value" placeholder="New Title..."
style="background-color: rgba(211, 211, 211, 0.342);">
<button disable-auto-close ngbDropdownItem class="dropdown-item" type="button"
(click)="createTaskStatus(status)">Status anlegen</button>
<button disable-auto-close ngbDropdownItem class="dropdown-item" type="button"
(click)="deleteStatus(task.statusid)">Status löschen</button>
<input
#statusname
type="text"
id="statusname"
class="dropdown-item"
(change)="status.title = statusname.value"
placeholder="New Title..."
style="background-color: rgba(211, 211, 211, 0.342);"
/>
<button
disable-auto-close
ngbDropdownItem
class="dropdown-item"
type="button"
(click)="createTaskStatus(status)"
>
Status anlegen
</button>
<button
disable-auto-close
ngbDropdownItem
class="dropdown-item"
type="button"
(click)="deleteStatus(task.statusid)"
>
Status löschen
</button>
</div>
</div>
<div class="dropdown-menu">
<select class="form-control custom-select mr-sm-2" id="status" required name="status"
[(ngModel)]="task.statusid">
<option *ngFor="let status of allStatus" [value]="status.id">{{
status.title
}}</option>
<select
class="form-control custom-select mr-sm-2"
id="status"
required
name="status"
[(ngModel)]="task.statusid"
>
<option
*ngFor="let status of allStatus"
[value]="status.id"
>{{ status.title }}</option
>
</select>
</div>
</div>
<div class="form-group">
<div ngbDropdown class="dropdown" [autoClose]="true">
<button ngbDropdownToggle class="btn btn-secondary dropdown-toggle" type="button"
id="dropdownMenu4" data-toggle="dropdown" aria-haspopup="true"
aria-expanded="false">
<button
ngbDropdownToggle
class="btn btn-secondary dropdown-toggle"
type="button"
id="dropdownMenu4"
data-toggle="dropdown"
aria-haspopup="true"
aria-expanded="false"
>
Bearbeiter: {{ getAuthorById(task.assignedtoid) }}
</button>
<div ngbDropdownMenu class="dropdown-menu" aria-labelledby="dropdownMenu2">
<div
ngbDropdownMenu
class="dropdown-menu"
aria-labelledby="dropdownMenu2"
>
<div class="card-text" for="Inhalt">User wählen</div>
<option disable-auto-close ngbDropdownItem *ngFor="let user of allUser"
(click)="task.assignedtoid = user.id">{{ user.name }}</option>
<option
disable-auto-close
ngbDropdownItem
*ngFor="let user of allUser"
(click)="task.assignedtoid = user.id"
>{{ user.name }}</option
>
</div>
</div>
<div class="dropdown-menu">
<select class="form-control custom-select mr-sm-2" id="assignedto" required name="assignedto"
[(ngModel)]="task.assignedtoid">
<select
class="form-control custom-select mr-sm-2"
id="assignedto"
required
name="assignedto"
[(ngModel)]="task.assignedtoid"
>
<option *ngFor="let user of allUser" [value]="user.id">{{
user.name
}}</option>
@ -106,7 +213,12 @@
</div>
<div class="row">
<div class="col-6">
<button (click)="onClose()" type="dismiss" class="btn btn-secondary" data-dismiss="modal">
<button
(click)="onClose()"
type="dismiss"
class="btn btn-secondary"
data-dismiss="modal"
>
Abbrechen
</button>
<button type="submit" class="btn btn-primary">Erstellen</button>

5
src/app/components/task-form/task-form.component.spec.ts
View File

@ -8,9 +8,8 @@ describe('TaskFormComponent', () => {
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ TaskFormComponent ]
})
.compileComponents();
declarations: [TaskFormComponent],
}).compileComponents();
}));
beforeEach(() => {

23
src/app/components/task-form/task-form.component.ts
View File

@ -9,7 +9,7 @@ import {
ScrumCategory,
ScrumUser,
ScrumProject,
ScrumUserstory
ScrumUserstory,
} from '../../services/backend.service';
import { Observable } from 'rxjs';
import { HttpResponse } from '@angular/common/http';
@ -17,7 +17,7 @@ import { HttpResponse } from '@angular/common/http';
@Component({
selector: 'app-task-form',
templateUrl: './task-form.component.html',
styleUrls: ['./task-form.component.css']
styleUrls: ['./task-form.component.css'],
})
// Class implements the logic for a popup window form to create and modify tasks.
@ -28,11 +28,14 @@ export class TaskFormComponent implements OnInit {
public userstoryId: string;
public userstories: any[] = [];
public allStatus: any[] = [];
public status: ScrumStatus = { title: "", description: "" };
public status: ScrumStatus = { title: '', description: '' };
public allUser: any[] = [];
public user: ScrumUser = { name: "" };
public user: ScrumUser = { name: '' };
constructor(private backendService: BackendService, private activeModalService: NgbActiveModal) {
constructor(
private backendService: BackendService,
private activeModalService: NgbActiveModal
) {
this.getUserStories();
this.getTaskStatus();
this.getAllUsers();
@ -84,7 +87,9 @@ export class TaskFormComponent implements OnInit {
if (!this.task.userstoryid) {
return null;
}
this.backendService.getUserstory(this.task.userstoryid).subscribe((response) => {
this.backendService
.getUserstory(this.task.userstoryid)
.subscribe((response) => {
if (response.status > 399) {
alert('Fehler');
} else {
@ -121,8 +126,7 @@ export class TaskFormComponent implements OnInit {
this.backendService.postStatus(status).subscribe((response) => {
if (response.status > 399) {
alert('Fehler');
}
else {
} else {
this.allStatus.push(response.body);
}
});
@ -135,8 +139,7 @@ export class TaskFormComponent implements OnInit {
this.backendService.deleteStatus(status).subscribe((response) => {
if (response.status > 399) {
alert('Fehler');
}
else {
} else {
const index = this.allStatus.indexOf(status);
if (index !== -1) {
this.allStatus.splice(index, 1);

248
src/app/components/userstory-form/userstory-form.component.html
View File

@ -17,107 +17,240 @@
<div class="col-8">
<div class="form-group">
<label for="Title">Titel</label>
<input type="text" class="form-control" id="Title" required name="title"
[(ngModel)]="userstory.title" id="titleField" />
<input
type="text"
class="form-control"
id="Title"
required
name="title"
[(ngModel)]="userstory.title"
id="titleField"
/>
</div>
<div class="form-group">
<label for="Inhalt">Story</label>
<textarea type="text" class="form-control" id="Story" required name="story" rows="5"
[(ngModel)]="userstory.content"></textarea>
<textarea
type="text"
class="form-control"
id="Story"
required
name="story"
rows="5"
[(ngModel)]="userstory.content"
></textarea>
</div>
</div>
<div class="col-4">
<div ngbDropdown class="dropdown">
<button ngbDropdownToggle class="btn btn-secondary dropdown-toggle" type="button"
id="dropdownMenu2" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<button
ngbDropdownToggle
class="btn btn-secondary dropdown-toggle"
type="button"
id="dropdownMenu2"
data-toggle="dropdown"
aria-haspopup="true"
aria-expanded="false"
>
Prio: {{ userstory.priority }}
</button>
<div ngbDropdownMenu class="dropdown-menu" aria-labelledby="dropdownMenu2">
<option ngbDropdownItem *ngFor="let p of getAllPriorities()"
(click)="userstory.priority=p">
{{p}}</option>
<div
ngbDropdownMenu
class="dropdown-menu"
aria-labelledby="dropdownMenu2"
>
<option
ngbDropdownItem
*ngFor="let p of getAllPriorities()"
(click)="userstory.priority = p"
>
{{ p }}</option
>
</div>
</div>
<div class="form-group">
<div ngbDropdown class="dropdown" [autoClose]="false">
<button ngbDropdownToggle class="btn btn-secondary dropdown-toggle" type="button"
id="dropdownMenu2" data-toggle="dropdown" aria-haspopup="true"
aria-expanded="false">
<button
ngbDropdownToggle
class="btn btn-secondary dropdown-toggle"
type="button"
id="dropdownMenu2"
data-toggle="dropdown"
aria-haspopup="true"
aria-expanded="false"
>
Status: {{ getStatusTitleById(userstory.statusid) }}
</button>
<div ngbDropdownMenu class="dropdown-menu" aria-labelledby="dropdownMenu2">
<div
ngbDropdownMenu
class="dropdown-menu"
aria-labelledby="dropdownMenu2"
>
<div class="card-text" for="Inhalt">Status wählen</div>
<option disable-auto-close ngbDropdownItem *ngFor="let status of allStatus"
(click)="userstory.statusid = status.id">{{ status.title }}</option>
<option
disable-auto-close
ngbDropdownItem
*ngFor="let status of allStatus"
(click)="userstory.statusid = status.id"
>{{ status.title }}</option
>
<div class="dropdown-divider"></div>
<div class="card-text" for="Inhalt">Neuer Status</div>
<input #statusname type="text" id="statusname" class="dropdown-item"
(change)="status.title=statusname.value" placeholder="New Title..."
style="background-color: rgba(211, 211, 211, 0.342);">
<button disable-auto-close ngbDropdownItem class="dropdown-item" type="button"
(click)="createUserstoryStatus(status)">Status anlegen</button>
<button disable-auto-close ngbDropdownItem class="dropdown-item" type="button"
(click)="deleteStatus(userstory.statusid)">Status löschen</button>
<input
#statusname
type="text"
id="statusname"
class="dropdown-item"
(change)="status.title = statusname.value"
placeholder="New Title..."
style="background-color: rgba(211, 211, 211, 0.342);"
/>
<button
disable-auto-close
ngbDropdownItem
class="dropdown-item"
type="button"
(click)="createUserstoryStatus(status)"
>
Status anlegen
</button>
<button
disable-auto-close
ngbDropdownItem
class="dropdown-item"
type="button"
(click)="deleteStatus(userstory.statusid)"
>
Status löschen
</button>
</div>
</div>
<div class="dropdown-menu">
<select class="form-control custom-select mr-sm-2" id="prio" required name="prio"
[(ngModel)]="userstory.statusid">
<option *ngFor="let status of allStatus" [value]="status.id">{{
status.title
}}</option>
<select
class="form-control custom-select mr-sm-2"
id="prio"
required
name="prio"
[(ngModel)]="userstory.statusid"
>
<option
*ngFor="let status of allStatus"
[value]="status.id"
>{{ status.title }}</option
>
</select>
</div>
</div>
<div class="form-group">
<div ngbDropdown class="dropdown" [autoClose]="false">
<button ngbDropdownToggle class="btn btn-secondary dropdown-toggle" type="button"
id="dropdownMenu2" data-toggle="dropdown" aria-haspopup="true"
aria-expanded="false">
<button
ngbDropdownToggle
class="btn btn-secondary dropdown-toggle"
type="button"
id="dropdownMenu2"
data-toggle="dropdown"
aria-haspopup="true"
aria-expanded="false"
>
Kategorie: {{ getCategoryById(userstory.categoryid) }}
</button>
<div ngbDropdownMenu class="dropdown-menu" aria-labelledby="dropdownMenu2">
<div
ngbDropdownMenu
class="dropdown-menu"
aria-labelledby="dropdownMenu2"
>
<div class="card-text" for="Inhalt">Kategorie wählen</div>
<option disable-auto-close ngbDropdownItem *ngFor="let category of allCategories"
(click)="userstory.categoryid = category.id">{{ category.title }}</option>
<option
disable-auto-close
ngbDropdownItem
*ngFor="let category of allCategories"
(click)="userstory.categoryid = category.id"
>{{ category.title }}</option
>
<div class="dropdown-divider"></div>
<div class="card-text" for="Inhalt">Neue Kategorie</div>
<input #categoryname type="text" id="categoryname" class="dropdown-item"
(change)="category.title=categoryname.value" placeholder="New Title..."
style="background-color: rgba(211, 211, 211, 0.342);">
<button disable-auto-close ngbDropdownItem class="dropdown-item" type="button"
(click)="createUserstoryCategory(category)">Kategorie anlegen</button>
<button disable-auto-close ngbDropdownItem class="dropdown-item" type="button"
(click)="deleteCategory(userstory.categoryid)">Kategorie löschen</button>
<input
#categoryname
type="text"
id="categoryname"
class="dropdown-item"
(change)="category.title = categoryname.value"
placeholder="New Title..."
style="background-color: rgba(211, 211, 211, 0.342);"
/>
<button
disable-auto-close
ngbDropdownItem
class="dropdown-item"
type="button"
(click)="createUserstoryCategory(category)"
>
Kategorie anlegen
</button>
<button
disable-auto-close
ngbDropdownItem
class="dropdown-item"
type="button"
(click)="deleteCategory(userstory.categoryid)"
>
Kategorie löschen
</button>
</div>
</div>
<div class="dropdown-menu">
<select class="form-control custom-select mr-sm-2" id="prio" required name="prio"
[(ngModel)]="userstory.categoryid">
<option *ngFor="let category of allCategories" [value]="category.id">{{
category.title
}}</option>
<select
class="form-control custom-select mr-sm-2"
id="prio"
required
name="prio"
[(ngModel)]="userstory.categoryid"
>
<option
*ngFor="let category of allCategories"
[value]="category.id"
>{{ category.title }}</option
>
</select>
</div>
</div>
<div class="form-group">
<div ngbDropdown class="dropdown" [autoClose]="true">
<button ngbDropdownToggle class="btn btn-secondary dropdown-toggle" type="button"
id="dropdownMenu2" data-toggle="dropdown" aria-haspopup="true"
aria-expanded="false">
<button
ngbDropdownToggle
class="btn btn-secondary dropdown-toggle"
type="button"
id="dropdownMenu2"
data-toggle="dropdown"
aria-haspopup="true"
aria-expanded="false"
>
Autor: {{ getAuthorById(userstory.createdbyid) }}
</button>
<div ngbDropdownMenu class="dropdown-menu" aria-labelledby="dropdownMenu2">
<div
ngbDropdownMenu
class="dropdown-menu"
aria-labelledby="dropdownMenu2"
>
<div class="card-text" for="Inhalt">User wählen</div>
<option disable-auto-close ngbDropdownItem *ngFor="let user of allUser"
(click)="userstory.createdbyid = user.id">{{ user.name }}</option>
<option
disable-auto-close
ngbDropdownItem
*ngFor="let user of allUser"
(click)="userstory.createdbyid = user.id"
>{{ user.name }}</option
>
</div>
</div>
<div class="dropdown-menu">
<select class="form-control custom-select mr-sm-2" id="prio" required name="prio"
[(ngModel)]="userstory.createdbyid">
<select
class="form-control custom-select mr-sm-2"
id="prio"
required
name="prio"
[(ngModel)]="userstory.createdbyid"
>
<option *ngFor="let user of allUser" [value]="user.id">{{
user.name
}}</option>
@ -128,7 +261,12 @@
</div>
<div class="row">
<div class="col-6">
<button (click)="onClose()" type="dismiss" class="btn btn-secondary" data-dismiss="modal">
<button
(click)="onClose()"
type="dismiss"
class="btn btn-secondary"
data-dismiss="modal"
>
Abbrechen
</button>
<button type="submit" class="btn btn-primary">Erstellen</button>

35
src/app/components/userstory-form/userstory-form.component.ts
View File

@ -1,7 +1,11 @@
// Importing necessary components and interfaces.
import { Component, OnInit, Input } from '@angular/core';
import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
import { BackendService, ScrumUserstory, Priority } from '../../services/backend.service';
import {
BackendService,
ScrumUserstory,
Priority,
} from '../../services/backend.service';
import {
ScrumTask,
ScrumStatus,
@ -13,21 +17,24 @@ import {
@Component({
selector: 'app-userstory-form',
templateUrl: './userstory-form.component.html',
styleUrls: ['./userstory-form.component.css']
styleUrls: ['./userstory-form.component.css'],
})
// Class implements the logic for a popup window form to create and modify userstories.
export class UserstoryFormComponent implements OnInit {
@Input() public userstory: ScrumUserstory;
public allStatus: any[] = [];
public status: ScrumStatus = { title: "", description: "" };
public status: ScrumStatus = { title: '', description: '' };
public allUser: any[] = [];
public user: ScrumUser = { name: "" };
public user: ScrumUser = { name: '' };
public allCategories: any[] = [];
public category: ScrumCategory = { title: "" };
public category: ScrumCategory = { title: '' };
private editing: boolean;
constructor(private backendService: BackendService, private activeModalService: NgbActiveModal) {
constructor(
private backendService: BackendService,
private activeModalService: NgbActiveModal
) {
this.getUserstoryStatus();
this.getAllUsers();
this.getUserstoryCategory();
@ -55,7 +62,9 @@ export class UserstoryFormComponent implements OnInit {
}
});
} else {
this.backendService.postUserstory(this.userstory).subscribe((response) => {
this.backendService
.postUserstory(this.userstory)
.subscribe((response) => {
if (response.status > 399) {
alert('Fehler');
}
@ -87,8 +96,7 @@ export class UserstoryFormComponent implements OnInit {
this.backendService.postStatus(status).subscribe((response) => {
if (response.status > 399) {
alert('Fehler');
}
else {
} else {
this.allStatus.push(response.body);
}
});
@ -101,8 +109,7 @@ export class UserstoryFormComponent implements OnInit {
this.backendService.deleteStatus(status).subscribe((response) => {
if (response.status > 399) {
alert('Fehler');
}
else {
} else {
const index = this.allStatus.indexOf(status);
if (index !== -1) {
this.allStatus.splice(index, 1);
@ -169,8 +176,7 @@ export class UserstoryFormComponent implements OnInit {
this.backendService.postCategory(category).subscribe((response) => {
if (response.status > 399) {
alert('Fehler');
}
else {
} else {
this.allCategories.push(response.body);
}
});
@ -183,8 +189,7 @@ export class UserstoryFormComponent implements OnInit {
this.backendService.deleteCategory(category).subscribe((response) => {
if (response.status > 399) {
alert('Fehler');
}
else {
} else {
const index = this.allCategories.indexOf(category);
if (index !== -1) {
this.allCategories.splice(index, 1);

2
src/app/services/sorting.service.ts
View File

@ -21,4 +21,4 @@ export function getNumberForPriority(priority: Priority): number {
case Priority.Low:
return 0;
}
};
}

2
src/environments/environment.prod.ts
View File

@ -1,3 +1,3 @@
export const environment = {
production: true
production: true,
};

4
src/environments/environment.ts
View File

@ -4,8 +4,8 @@
export const environment = {
production: false,
apiUrl: window["env"]["apiUrl"] || "default",
debug: window["env"]["debug"] || false
apiUrl: window['env']['apiUrl'] || 'default',
debug: window['env']['debug'] || false,
};
/*

21
src/index.html
View File

@ -1,18 +1,23 @@
<!doctype html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta charset="utf-8" />
<title>Frontend</title>
<base href="/">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" type="image/x-icon" href="favicon.ico">
<base href="/" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="icon" type="image/x-icon" href="favicon.ico" />
<script src="assets/env.js"></script>
<!-- Fonts and icons -->
<link href="https://fonts.googleapis.com/css?family=Poppins:200,300,400,600,700,800" rel="stylesheet">
<link href="https://use.fontawesome.com/releases/v5.0.6/css/all.css" rel="stylesheet"/>
<link
href="https://fonts.googleapis.com/css?family=Poppins:200,300,400,600,700,800"
rel="stylesheet"
/>
<link
href="https://use.fontawesome.com/releases/v5.0.6/css/all.css"
rel="stylesheet"
/>
</head>
<body>
<app-root></app-root>
</body>
</html>

5
src/main.ts
View File

@ -8,5 +8,6 @@ if (environment.production) {
enableProdMode();
}
platformBrowserDynamic().bootstrapModule(AppModule)
.catch(err => console.error(err));
platformBrowserDynamic()
.bootstrapModule(AppModule)
.catch((err) => console.error(err));

1
src/polyfills.ts
View File

@ -61,7 +61,6 @@ import '@angular/localize/init';
*/
import 'zone.js/dist/zone'; // Included with Angular CLI.
/***************************************************************************************************
* APPLICATION IMPORTS
*/

1
src/styles.css
View File

@ -6,4 +6,3 @@
.white-content .custom-text-secondary {
color: black !important;
}

2
src/test.ts
View File

@ -4,7 +4,7 @@ import 'zone.js/dist/zone-testing';
import { getTestBed } from '@angular/core/testing';
import {
BrowserDynamicTestingModule,
platformBrowserDynamicTesting
platformBrowserDynamicTesting,
} from '@angular/platform-browser-dynamic/testing';
declare const require: any;

9
tsconfig.app.json
View File

@ -4,11 +4,6 @@
"outDir": "./out-tsc/app",
"types": []
},
"files": [
"src/main.ts",
"src/polyfills.ts"
],
"include": [
"src/**/*.d.ts"
]
"files": ["src/main.ts", "src/polyfills.ts"],
"include": ["src/**/*.d.ts"]
}

5
tsconfig.json
View File

@ -11,10 +11,7 @@
"moduleResolution": "node",
"importHelpers": true,
"target": "es2015",
"lib": [
"es2018",
"dom"
]
"lib": ["es2018", "dom"]
},
"angularCompilerOptions": {
"fullTemplateTypeCheck": true,

15
tsconfig.spec.json
View File

@ -2,17 +2,8 @@
"extends": "./tsconfig.json",
"compilerOptions": {
"outDir": "./out-tsc/spec",
"types": [
"jasmine",
"node"
]
"types": ["jasmine", "node"]
},
"files": [
"src/test.ts",
"src/polyfills.ts"
],
"include": [
"src/**/*.spec.ts",
"src/**/*.d.ts"
]
"files": ["src/test.ts", "src/polyfills.ts"],
"include": ["src/**/*.spec.ts", "src/**/*.d.ts"]
}

71
tslint.json
View File

@ -2,10 +2,7 @@
"extends": "tslint:recommended",
"rules": {
"align": {
"options": [
"parameters",
"statements"
]
"options": ["parameters", "statements"]
},
"array-type": false,
"arrow-return-shorthand": true,
@ -16,34 +13,16 @@
"component-class-suffix": true,
"contextual-lifecycle": true,
"directive-class-suffix": true,
"directive-selector": [
true,
"attribute",
"app",
"camelCase"
],
"component-selector": [
true,
"element",
"app",
"kebab-case"
],
"directive-selector": [true, "attribute", "app", "camelCase"],
"component-selector": [true, "element", "app", "kebab-case"],
"eofline": true,
"import-blacklist": [
true,
"rxjs/Rx"
],
"import-blacklist": [true, "rxjs/Rx"],
"import-spacing": true,
"indent": {
"options": [
"spaces"
]
"options": ["spaces"]
},
"max-classes-per-file": false,
"max-line-length": [
true,
140
],
"max-line-length": [true, 140],
"member-ordering": [
true,
{
@ -55,35 +34,17 @@
]
}
],
"no-console": [
true,
"debug",
"info",
"time",
"timeEnd",
"trace"
],
"no-console": [true, "debug", "info", "time", "timeEnd", "trace"],
"no-empty": false,
"no-inferrable-types": [
true,
"ignore-params"
],
"no-inferrable-types": [true, "ignore-params"],
"no-non-null-assertion": true,
"no-redundant-jsdoc": true,
"no-switch-case-fall-through": true,
"no-var-requires": false,
"object-literal-key-quotes": [
true,
"as-needed"
],
"quotemark": [
true,
"single"
],
"object-literal-key-quotes": [true, "as-needed"],
"quotemark": [true, "single"],
"semicolon": {
"options": [
"always"
]
"options": ["always"]
},
"space-before-function-paren": {
"options": {
@ -113,11 +74,7 @@
]
},
"variable-name": {
"options": [
"ban-keywords",
"check-format",
"allow-pascal-case"
]
"options": ["ban-keywords", "check-format", "allow-pascal-case"]
},
"whitespace": {
"options": [
@ -142,7 +99,5 @@
"use-lifecycle-interface": true,
"use-pipe-transform-interface": true
},
"rulesDirectory": [
"codelyzer"
]
"rulesDirectory": ["codelyzer"]
}