benjamin/wgenerator
1
0
Fork 0
Code Releases Activity

Cleanup Code

Browse Source
This commit is contained in:
benjamin
2019-06-02 18:52:15 +02:00
parent 5180b597d2
commit f88454caf7
45 changed files with 1071 additions and 1060 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -1,6 +1,6 @@
import { SongsComponent } from './components/songs/songs.component'; import {SongsComponent} from './components/songs/songs.component';
import { NgModule } from '@angular/core'; import {NgModule} from '@angular/core';
import { Routes, RouterModule } from '@angular/router'; import {RouterModule, Routes} from '@angular/router';
const routes: Routes = [ const routes: Routes = [
{ {
@@ -18,4 +18,5 @@ const routes: Routes = [
imports: [RouterModule.forRoot(routes)], imports: [RouterModule.forRoot(routes)],
exports: [RouterModule] exports: [RouterModule]
}) })
export class AppRoutingModule { } export class AppRoutingModule {
}

1
WEB/src/app/app.component.html
View File

@@ -1,2 +1 @@
<router-outlet></router-outlet> <router-outlet></router-outlet>

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

@@ -1,8 +1,9 @@
import { Component } from '@angular/core'; import {Component} from '@angular/core';
@Component({ @Component({
selector: 'app-root', selector: 'app-root',
templateUrl: './app.component.html', templateUrl: './app.component.html',
styleUrls: ['./app.component.less'] styleUrls: ['./app.component.less']
}) })
export class AppComponent { } export class AppComponent {
}

57
WEB/src/app/app.module.ts
View File

@@ -1,33 +1,33 @@
import { BrowserModule } from '@angular/platform-browser'; import {BrowserModule} from '@angular/platform-browser';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
import { NgModule } from '@angular/core'; import {NgModule} from '@angular/core';
import { ReactiveFormsModule, FormsModule } from '@angular/forms'; import {FormsModule, ReactiveFormsModule} from '@angular/forms';
import { ODataModule } from 'odata-v4-ng'; import {ODataModule} from 'odata-v4-ng';
import { AppRoutingModule } from './app-routing.module'; import {AppRoutingModule} from './app-routing.module';
import { AppComponent } from './app.component'; import {AppComponent} from './app.component';
import { HttpClientModule } from '@angular/common/http'; import {HttpClientModule} from '@angular/common/http';
import { FontAwesomeModule } from '@fortawesome/angular-fontawesome'; import {FontAwesomeModule} from '@fortawesome/angular-fontawesome';
import { MatInputModule } from '@angular/material/input'; import {MatInputModule} from '@angular/material/input';
import { MatTableModule } from '@angular/material/table'; import {MatTableModule} from '@angular/material/table';
import { MatCardModule } from '@angular/material/card'; import {MatCardModule} from '@angular/material/card';
import { MatButtonModule } from '@angular/material/button'; import {MatButtonModule} from '@angular/material/button';
import { MatChipsModule } from '@angular/material/chips'; import {MatChipsModule} from '@angular/material/chips';
import { MatRadioModule } from '@angular/material/radio'; import {MatRadioModule} from '@angular/material/radio';
import { MatSelectModule } from '@angular/material/select'; import {MatSelectModule} from '@angular/material/select';
import { MatTooltipModule } from '@angular/material/tooltip'; import {MatTooltipModule} from '@angular/material/tooltip';
import { MatProgressBarModule } from '@angular/material/progress-bar'; import {MatProgressBarModule} from '@angular/material/progress-bar';
import { TableComponent } from './components/songs/table/table.component'; import {TableComponent} from './components/songs/table/table.component';
import { SongsComponent } from './components/songs/songs.component'; import {SongsComponent} from './components/songs/songs.component';
import { SongComponent } from './components/songs/song/song.component'; import {SongComponent} from './components/songs/song/song.component';
import { SongEditComponent } from './components/songs/song-edit/song-edit.component'; import {SongEditComponent} from './components/songs/song-edit/song-edit.component';
import { SongNewComponent } from './components/songs/song-new/song-new.component'; import {SongNewComponent} from './components/songs/song-new/song-new.component';
import { SongFormComponent } from './components/songs/song-form/song-form.component'; import {SongFormComponent} from './components/songs/song-form/song-form.component';
import { SongFilesComponent } from './components/songs/song-files/song-files.component'; import {SongFilesComponent} from './components/songs/song-files/song-files.component';
import { FileUploadModule } from 'ng2-file-upload'; import {FileUploadModule} from 'ng2-file-upload';
import { SongFileEditComponent } from './components/songs/song-file-edit/song-file-edit.component'; import {SongFileEditComponent} from './components/songs/song-file-edit/song-file-edit.component';
@NgModule({ @NgModule({
declarations: [ declarations: [
@@ -66,4 +66,5 @@ import { SongFileEditComponent } from './components/songs/song-file-edit/song-fi
providers: [], providers: [],
bootstrap: [AppComponent] bootstrap: [AppComponent]
}) })
export class AppModule {} export class AppModule {
}

4
WEB/src/app/components/songs/song-edit/song-edit.component.html
View File

@@ -1,8 +1,8 @@
<div class="song-detail-container"> <div class="song-detail-container">
<mat-card class="mat-elevation-z8" *ngIf="form"> <mat-card *ngIf="form" class="mat-elevation-z8">
<mat-card-header> <mat-card-header>
<div mat-card-avatar> <div mat-card-avatar>
<button mat-icon-button (click)="onBack()" color="warn"> <button (click)="onBack()" color="warn" mat-icon-button>
<fa-icon [icon]="faArrow"></fa-icon> <fa-icon [icon]="faArrow"></fa-icon>
</button> </button>
</div> </div>

2
WEB/src/app/components/songs/song-edit/song-edit.component.less
View File

@@ -1,3 +1,3 @@
:host { :host {
display: block; display: block;
} }

20
WEB/src/app/components/songs/song-edit/song-edit.component.ts
View File

@@ -1,14 +1,9 @@
import { SongsService } from 'src/app/data/songs.service'; import {SongsService} from 'src/app/data/songs.service';
import { FormGroup } from '@angular/forms'; import {FormGroup} from '@angular/forms';
import { import {ChangeDetectionStrategy, ChangeDetectorRef, Component, OnInit} from '@angular/core';
Component, import {EditSongService} from 'src/app/data/edit-song.service';
OnInit, import {faLongArrowAltLeft} from '@fortawesome/free-solid-svg-icons';
ChangeDetectionStrategy, import {State} from 'src/app/data/state';
ChangeDetectorRef
} from '@angular/core';
import { EditSongService } from 'src/app/data/edit-song.service';
import { faLongArrowAltLeft } from '@fortawesome/free-solid-svg-icons';
import { State } from 'src/app/data/state';
@Component({ @Component({
selector: 'app-song-edit', selector: 'app-song-edit',
@@ -25,7 +20,8 @@ export class SongEditComponent implements OnInit {
private editSongService: EditSongService, private editSongService: EditSongService,
private songsService: SongsService, private songsService: SongsService,
private change: ChangeDetectorRef private change: ChangeDetectorRef
) {} ) {
}
ngOnInit() { ngOnInit() {
this.form = this.editSongService.initSongEditForm(true); this.form = this.editSongService.initSongEditForm(true);

2
WEB/src/app/components/songs/song-file-edit/song-file-edit.component.html
View File

@@ -1,9 +1,9 @@
<form *ngIf="form"> <form *ngIf="form">
<mat-form-field> <mat-form-field>
<input <input
[formControl]="form.controls.Name"
matInput matInput
placeholder="Dateiname" placeholder="Dateiname"
[formControl]="form.controls.Name"
/> />
</mat-form-field> </mat-form-field>
<mat-form-field> <mat-form-field>

30
WEB/src/app/components/songs/song-file-edit/song-file-edit.component.ts
View File

@@ -1,16 +1,9 @@
import { SongsService } from './../../../data/songs.service'; import {SongsService} from '../../../data/songs.service';
import { FileType } from './../../../models/files-types.model.ts'; import {FileType} from '../../../models/files-types.model.ts';
import { FormGroup } from '@angular/forms'; import {FormGroup} from '@angular/forms';
import { import {Component, EventEmitter, Input, OnDestroy, OnInit, Output} from '@angular/core';
Component, import {EditSongService} from 'src/app/data/edit-song.service';
OnInit, import {Subscription} from 'rxjs';
OnDestroy,
Input,
Output,
EventEmitter
} from '@angular/core';
import { EditSongService } from 'src/app/data/edit-song.service';
import { Subscription } from 'rxjs';
@Component({ @Component({
selector: 'app-song-file-edit', selector: 'app-song-file-edit',
@@ -23,16 +16,17 @@ export class SongFileEditComponent implements OnInit, OnDestroy {
public form: FormGroup; public form: FormGroup;
public subscription: Subscription; public subscription: Subscription;
public fileTypes = [ public fileTypes = [
{ value: FileType.None, text: null }, {value: FileType.None, text: null},
{ value: FileType.Sheet, text: 'Text' }, {value: FileType.Sheet, text: 'Text'},
{ value: FileType.Chords, text: 'Text + Akkorde' }, {value: FileType.Chords, text: 'Text + Akkorde'},
{ value: FileType.MuseScore, text: 'MuseScore' } {value: FileType.MuseScore, text: 'MuseScore'}
]; ];
constructor( constructor(
private editSongService: EditSongService, private editSongService: EditSongService,
private songService: SongsService private songService: SongsService
) {} ) {
}
public ngOnInit(): void { public ngOnInit(): void {
const form = this.editSongService.initFileEditForm( const form = this.editSongService.initFileEditForm(

48
WEB/src/app/components/songs/song-files/song-files.component.html
View File

@@ -1,74 +1,74 @@
<div class="song-detail-container files" *ngIf="song"> <div *ngIf="song" class="song-detail-container files">
<mat-card class="mat-elevation-z8"> <mat-card class="mat-elevation-z8">
<mat-card-content> <mat-card-content>
<table mat-table [dataSource]="song.Files" class="mat-elevation-z8"> <table [dataSource]="song.Files" class="mat-elevation-z8" mat-table>
<ng-container matColumnDef="name"> <ng-container matColumnDef="name">
<th mat-header-cell *matHeaderCellDef> <th *matHeaderCellDef mat-header-cell>
Angehängte Dateien Angehängte Dateien
</th> </th>
<td mat-cell *matCellDef="let element"> <td *matCellDef="let element" mat-cell>
<span *ngIf="fileEditId !== element.ID">{{ element.Name }}</span> <span *ngIf="fileEditId !== element.ID">{{ element.Name }}</span>
<app-song-file-edit <app-song-file-edit
[fileId]="element.ID"
(back)="onClickEdit(null)" (back)="onClickEdit(null)"
*ngIf="fileEditId === element.ID" *ngIf="fileEditId === element.ID"
[fileId]="element.ID"
></app-song-file-edit> ></app-song-file-edit>
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="action"> <ng-container matColumnDef="action">
<th mat-header-cell *matHeaderCellDef> <th *matHeaderCellDef mat-header-cell>
<input <input
type="file" #newFileUploaderRef
ng2FileSelect
[uploader]="newFileUploader" [uploader]="newFileUploader"
multiple multiple
ng2FileSelect
style="display:none" style="display:none"
#newFileUploaderRef type="file"
/> />
<button <button
mat-icon-button
(click)="newFileUploaderRef.click()" (click)="newFileUploaderRef.click()"
mat-icon-button
matTooltip="neue Datei hochladen" matTooltip="neue Datei hochladen"
matTooltipPosition="left" matTooltipPosition="left"
> >
<fa-icon [icon]="faFileUpload"></fa-icon> <fa-icon [icon]="faFileUpload"></fa-icon>
</button> </button>
</th> </th>
<td mat-cell *matCellDef="let element"> <td *matCellDef="let element" mat-cell>
<button <button
mat-icon-button
(click)="onClickEdit(element.ID)" (click)="onClickEdit(element.ID)"
*ngIf="fileEditId !== element.ID"
mat-icon-button
matTooltip="Eintrag bearbeiten" matTooltip="Eintrag bearbeiten"
matTooltipPosition="left" matTooltipPosition="left"
*ngIf="fileEditId !== element.ID"
> >
<fa-icon [icon]="faEdit"></fa-icon> <fa-icon [icon]="faEdit"></fa-icon>
</button> </button>
<button <button
mat-icon-button
(click)="onClickDownload(element.ID, element.Name)" (click)="onClickDownload(element.ID, element.Name)"
*ngIf="fileEditId !== element.ID"
mat-icon-button
matTooltip="Datei herunterladen" matTooltip="Datei herunterladen"
matTooltipPosition="left" matTooltipPosition="left"
*ngIf="fileEditId !== element.ID"
> >
<fa-icon [icon]="faDownload"></fa-icon> <fa-icon [icon]="faDownload"></fa-icon>
</button> </button>
<button <button
(click)="onClickEdit(null)"
*ngIf="fileEditId === element.ID"
mat-icon-button mat-icon-button
matTooltip="Zurück zur Tabelle" matTooltip="Zurück zur Tabelle"
matTooltipPosition="left" matTooltipPosition="left"
(click)="onClickEdit(null)"
*ngIf="fileEditId === element.ID"
> >
<fa-icon [icon]="faArrow"></fa-icon> <fa-icon [icon]="faArrow"></fa-icon>
</button> </button>
<button <button
(click)="onClickDelete(element.ID)"
*ngIf="fileEditId === element.ID"
mat-icon-button mat-icon-button
matTooltip="Anhang löschen" matTooltip="Anhang löschen"
matTooltipPosition="left" matTooltipPosition="left"
(click)="onClickDelete(element.ID)"
*ngIf="fileEditId === element.ID"
> >
<fa-icon [icon]="faTrash"></fa-icon> <fa-icon [icon]="faTrash"></fa-icon>
</button> </button>
@@ -76,14 +76,14 @@
</ng-container> </ng-container>
<tr <tr
mat-header-row
*matHeaderRowDef="columns"
ng2FileDrop
[uploader]="newFileUploader"
(fileOver)="onFileOverNew($event)" (fileOver)="onFileOverNew($event)"
*matHeaderRowDef="columns"
[class.file-over]="fileOverNew" [class.file-over]="fileOverNew"
[uploader]="newFileUploader"
mat-header-row
ng2FileDrop
></tr> ></tr>
<tr mat-row *matRowDef="let row; columns: columns"></tr> <tr *matRowDef="let row; columns: columns" mat-row></tr>
</table> </table>
</mat-card-content> </mat-card-content>
</mat-card> </mat-card>

1
WEB/src/app/components/songs/song-files/song-files.component.less
View File

@@ -5,6 +5,7 @@
button { button {
font-size: 24px; font-size: 24px;
color: #aaa; color: #aaa;
&:hover { &:hover {
color: #000; color: #000;
} }

27
WEB/src/app/components/songs/song-files/song-files.component.ts
View File

@@ -1,17 +1,11 @@
import { switchMap } from 'rxjs/operators'; import {switchMap} from 'rxjs/operators';
import { Component, OnInit, ChangeDetectorRef } from '@angular/core'; import {ChangeDetectorRef, Component} from '@angular/core';
import { Song } from 'src/app/models/song.model'; import {Song} from 'src/app/models/song.model';
import { SongsService } from 'src/app/data/songs.service'; import {SongsService} from 'src/app/data/songs.service';
import { DownloadService } from 'src/app/data/download.service'; import {DownloadService} from 'src/app/data/download.service';
import { import {faDownload, faEdit, faFileUpload, faLongArrowAltLeft, faTrash} from '@fortawesome/free-solid-svg-icons';
faFileUpload, import {FileuploadFactory} from 'src/app/services/fileupload.factory';
faDownload, import {FileUploader} from 'ng2-file-upload';
faEdit,
faLongArrowAltLeft,
faTrash
} from '@fortawesome/free-solid-svg-icons';
import { FileuploadFactory } from 'src/app/services/fileupload.factory';
import { FileUploader } from 'ng2-file-upload';
@Component({ @Component({
selector: 'app-song-files', selector: 'app-song-files',
@@ -42,7 +36,7 @@ export class SongFilesComponent {
if (_) { if (_) {
this.selectedSongId = _.ID; this.selectedSongId = _.ID;
this.song = _; this.song = _;
this.newFileUploader = this.fileuploadFactory.provideForNewFiles(_.ID); this.newFileUploader = FileuploadFactory.provideForNewFiles(_.ID);
this.newFileUploader.onCompleteItem = () => this.newFileUploader.onCompleteItem = () =>
songService.selectSong(_.ID).subscribe(); songService.selectSong(_.ID).subscribe();
this.newFileUploader.onProgressItem = () => change.markForCheck; this.newFileUploader.onProgressItem = () => change.markForCheck;
@@ -58,12 +52,15 @@ export class SongFilesComponent {
public onClickDownload(fileId: number, filename): void { public onClickDownload(fileId: number, filename): void {
this.downloadService.get(this.selectedSongId, fileId, filename); this.downloadService.get(this.selectedSongId, fileId, filename);
} }
public onFileOverNew(hover: boolean): void { public onFileOverNew(hover: boolean): void {
this.fileOverNew = hover; this.fileOverNew = hover;
} }
public onClickEdit(fileId: number): void { public onClickEdit(fileId: number): void {
this.fileEditId = fileId; this.fileEditId = fileId;
} }
public onClickDelete(fileId: number): void { public onClickDelete(fileId: number): void {
const songId = this.song.ID; const songId = this.song.ID;
this.songService this.songService

2
WEB/src/app/components/songs/song-form/keys.ts
View File

@@ -33,4 +33,4 @@ export const keys = [
'A#', 'A#',
'b', 'b',
'h' 'h'
]; ];

16
WEB/src/app/components/songs/song-form/song-form.component.html
View File

@@ -1,9 +1,9 @@
<form> <form>
<mat-form-field> <mat-form-field>
<input <input
[formControl]="form.controls.Name"
matInput matInput
placeholder="Titel" placeholder="Titel"
[formControl]="form.controls.Name"
/> />
</mat-form-field> </mat-form-field>
<div class="row"> <div class="row">
@@ -13,9 +13,9 @@
</mat-radio-group> </mat-radio-group>
<mat-form-field> <mat-form-field>
<input <input
[formControl]="form.controls.Number"
matInput matInput
placeholder="Nummer" placeholder="Nummer"
[formControl]="form.controls.Number"
/> />
</mat-form-field> </mat-form-field>
<mat-form-field> <mat-form-field>
@@ -28,26 +28,26 @@
</mat-form-field> </mat-form-field>
<mat-form-field> <mat-form-field>
<input <input
[formControl]="form.controls.Tempo"
matInput matInput
placeholder="Tempo" placeholder="Tempo"
[formControl]="form.controls.Tempo"
/> />
</mat-form-field> </mat-form-field>
</div> </div>
<mat-form-field> <mat-form-field>
<textarea <textarea
matInput
placeholder="Liedtext"
[formControl]="form.controls.Text" [formControl]="form.controls.Text"
[matTextareaAutosize]="true" [matTextareaAutosize]="true"
matInput
placeholder="Liedtext"
></textarea> ></textarea>
</mat-form-field> </mat-form-field>
<mat-form-field> <mat-form-field>
<textarea <textarea
matInput
placeholder="Kommentare"
[formControl]="form.controls.Comments" [formControl]="form.controls.Comments"
[matTextareaAutosize]="true" [matTextareaAutosize]="true"
matInput
placeholder="Kommentare"
></textarea> ></textarea>
</mat-form-field> </mat-form-field>
</form> </form>

1
WEB/src/app/components/songs/song-form/song-form.component.less
View File

@@ -1,6 +1,7 @@
form { form {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
.row { .row {
display: grid; display: grid;
grid-template-columns: 3fr 1fr 1fr 1fr; grid-template-columns: 3fr 1fr 1fr 1fr;

6
WEB/src/app/components/songs/song-form/song-form.component.ts
View File

@@ -1,6 +1,6 @@
import { FormGroup } from '@angular/forms'; import {FormGroup} from '@angular/forms';
import { Component, Input } from '@angular/core'; import {Component, Input} from '@angular/core';
import { keys } from './keys'; import {keys} from './keys';
@Component({ @Component({
selector: 'app-song-form', selector: 'app-song-form',

11
WEB/src/app/components/songs/song-new/song-new.component.html
View File

@@ -1,8 +1,8 @@
<div class="song-detail-container"> <div class="song-detail-container">
<mat-card class="mat-elevation-z8" *ngIf="form"> <mat-card *ngIf="form" class="mat-elevation-z8">
<mat-card-header> <mat-card-header>
<div mat-card-avatar> <div mat-card-avatar>
<button mat-icon-button (click)="onBack()" color="warn"> <button (click)="onBack()" color="warn" mat-icon-button>
<fa-icon [icon]="faArrow"></fa-icon> <fa-icon [icon]="faArrow"></fa-icon>
</button> </button>
</div> </div>
@@ -14,9 +14,10 @@
<app-song-form [form]="form"></app-song-form> <app-song-form [form]="form"></app-song-form>
</mat-card-content> </mat-card-content>
<mat-card-actions> <mat-card-actions>
<button mat-button (click)="onClickAdd()"> <button (click)="onClickAdd()" mat-button>
<fa-icon [icon]="faSave"></fa-icon> neu anlegen <fa-icon [icon]="faSave"></fa-icon>
neu anlegen
</button> </button>
</mat-card-actions> </mat-card-actions>
</mat-card> </mat-card>
</div> </div>

15
WEB/src/app/components/songs/song-new/song-new.component.ts
View File

@@ -1,9 +1,9 @@
import { EditSongService } from './../../../data/edit-song.service'; import {EditSongService} from '../../../data/edit-song.service';
import { FormGroup } from '@angular/forms'; import {FormGroup} from '@angular/forms';
import { Component, OnInit, ChangeDetectionStrategy, ChangeDetectorRef } from '@angular/core'; import {ChangeDetectionStrategy, ChangeDetectorRef, Component, OnInit} from '@angular/core';
import { faLongArrowAltLeft, faSave } from '@fortawesome/free-solid-svg-icons'; import {faLongArrowAltLeft, faSave} from '@fortawesome/free-solid-svg-icons';
import { State } from 'src/app/data/state'; import {State} from 'src/app/data/state';
import { SongsService } from 'src/app/data/songs.service'; import {SongsService} from 'src/app/data/songs.service';
@Component({ @Component({
selector: 'app-song-new', selector: 'app-song-new',
@@ -20,7 +20,8 @@ export class SongNewComponent implements OnInit {
private editSongService: EditSongService, private editSongService: EditSongService,
private songsService: SongsService, private songsService: SongsService,
private change: ChangeDetectorRef private change: ChangeDetectorRef
) { } ) {
}
ngOnInit() { ngOnInit() {
this.form = this.editSongService.initSongEditForm(false); this.form = this.editSongService.initSongEditForm(false);

17
WEB/src/app/components/songs/song/song.component.html
View File

@@ -1,28 +1,31 @@
<div class="song-detail-container" *ngIf="song"> <div *ngIf="song" class="song-detail-container">
<mat-card class="mat-elevation-z8"> <mat-card class="mat-elevation-z8">
<mat-card-header> <mat-card-header>
<div mat-card-avatar> <div mat-card-avatar>
<button mat-icon-button (click)="onBack()" color="warn"> <button (click)="onBack()" color="warn" mat-icon-button>
<fa-icon [icon]="faArrow"></fa-icon> <fa-icon [icon]="faArrow"></fa-icon>
</button> </button>
</div> </div>
<mat-card-title>{{ song.Name }}</mat-card-title> <mat-card-title>{{ song.Name }}</mat-card-title>
<mat-card-subtitle> <mat-card-subtitle>
<mat-chip-list> <mat-chip-list>
<mat-chip *ngIf="renderSongType(song.SongType)" [style.background]="renderSongType(song.SongType).color">{{ renderSongType(song.SongType).name }}</mat-chip> <mat-chip *ngIf="renderSongType(song.SongType)"
[style.background]="renderSongType(song.SongType).color">{{ renderSongType(song.SongType).name }}</mat-chip>
<mat-chip *ngIf="song.Key">Tonart: {{ song.Key }}</mat-chip> <mat-chip *ngIf="song.Key">Tonart: {{ song.Key }}</mat-chip>
<mat-chip *ngIf="song.Tempo">Tempo: {{ song.Tempo }}</mat-chip> <mat-chip *ngIf="song.Tempo">Tempo: {{ song.Tempo }}</mat-chip>
</mat-chip-list></mat-card-subtitle </mat-chip-list>
</mat-card-subtitle
> >
</mat-card-header> </mat-card-header>
<mat-card-content> <mat-card-content>
<p *ngFor="let line of text">{{ line }}</p> <p *ngFor="let line of text">{{ line }}</p>
<br /> <br/>
<p *ngFor="let line of comments">{{ line }}</p> <p *ngFor="let line of comments">{{ line }}</p>
</mat-card-content> </mat-card-content>
<mat-card-actions> <mat-card-actions>
<button mat-button (click)="onClickEdit()"> <button (click)="onClickEdit()" mat-button>
<fa-icon [icon]="faEdit"></fa-icon> bearbeiten <fa-icon [icon]="faEdit"></fa-icon>
bearbeiten
</button> </button>
</mat-card-actions> </mat-card-actions>
</mat-card> </mat-card>

39
WEB/src/app/components/songs/song/song.component.ts
View File

@@ -1,13 +1,8 @@
import { SongsService } from 'src/app/data/songs.service'; import {SongsService} from 'src/app/data/songs.service';
import { import {ChangeDetectionStrategy, ChangeDetectorRef, Component} from '@angular/core';
Component, import {faEdit, faLongArrowAltLeft} from '@fortawesome/free-solid-svg-icons';
ChangeDetectionStrategy, import {Song} from 'src/app/models/song.model';
ChangeDetectorRef import {State} from 'src/app/data/state';
} from '@angular/core';
import { faLongArrowAltLeft, faEdit } from '@fortawesome/free-solid-svg-icons';
import { Song } from 'src/app/models/song.model';
import { DownloadService } from 'src/app/data/download.service';
import { State } from 'src/app/data/state';
@Component({ @Component({
selector: 'app-song', selector: 'app-song',
@@ -36,13 +31,6 @@ export class SongComponent {
change.markForCheck(); change.markForCheck();
}); });
} }
public onBack(): void {
this.songService.resetSelectedSong();
}
public onClickEdit(): void {
this.songService.state = State.edit;
}
public get text(): string[] { public get text(): string[] {
return this.song && this.song.Text ? this.song.Text.split(/\r?\n/) : []; return this.song && this.song.Text ? this.song.Text.split(/\r?\n/) : [];
@@ -52,11 +40,22 @@ export class SongComponent {
return this.song && this.song.Comments ? this.song.Comments.split(/\r?\n/) : []; return this.song && this.song.Comments ? this.song.Comments.split(/\r?\n/) : [];
} }
public onBack(): void {
this.songService.resetSelectedSong();
}
public onClickEdit(): void {
this.songService.state = State.edit;
}
public renderSongType(songType: string) { public renderSongType(songType: string) {
switch (songType) { switch (songType) {
case 'Praise': return {name: 'Lobpreis', color: '#99FFB8'}; case 'Praise':
case 'Worship': return {name: 'Anbetung', color: '#C999FF'}; return {name: 'Lobpreis', color: '#99FFB8'};
default: return null; case 'Worship':
return {name: 'Anbetung', color: '#C999FF'};
default:
return null;
} }
} }
} }

8
WEB/src/app/components/songs/songs.component.html
View File

@@ -1,5 +1,5 @@
<app-table></app-table> <app-table></app-table>
<app-song-edit [@blend] *ngIf="songsService.state === State.edit"></app-song-edit> <app-song-edit *ngIf="songsService.state === State.edit" [@blend]></app-song-edit>
<app-song-new [@blend] *ngIf="songsService.state === State.new"></app-song-new> <app-song-new *ngIf="songsService.state === State.new" [@blend]></app-song-new>
<app-song [@blend] *ngIf="songsService.state === State.read"></app-song> <app-song *ngIf="songsService.state === State.read" [@blend]></app-song>
<app-song-files [@blend] *ngIf="songsService.state === State.read"></app-song-files> <app-song-files *ngIf="songsService.state === State.read" [@blend]></app-song-files>

9
WEB/src/app/components/songs/songs.component.ts
View File

@@ -1,7 +1,7 @@
import { blend } from 'src/app/services/animation'; import {blend} from 'src/app/services/animation';
import { Component } from '@angular/core'; import {Component} from '@angular/core';
import { SongsService } from 'src/app/data/songs.service'; import {SongsService} from 'src/app/data/songs.service';
import { State } from 'src/app/data/state'; import {State} from 'src/app/data/state';
@Component({ @Component({
selector: 'app-songs', selector: 'app-songs',
@@ -11,6 +11,7 @@ import { State } from 'src/app/data/state';
}) })
export class SongsComponent { export class SongsComponent {
public State = State; public State = State;
constructor(public songsService: SongsService) { constructor(public songsService: SongsService) {
songsService.loadSongList$().subscribe(); songsService.loadSongList$().subscribe();
} }

32
WEB/src/app/components/songs/table/table.component.html
View File

@@ -1,25 +1,25 @@
<div <div
class="page-container mat-elevation-z8"
[class.pinned]="songsService.state !== State.list" [class.pinned]="songsService.state !== State.list"
class="page-container mat-elevation-z8"
> >
<div class="table-container"> <div class="table-container">
<button <button
mat-icon-button
(click)="onClickNew()" (click)="onClickNew()"
class="button-new" class="button-new"
mat-icon-button
matTooltip="neuen Titel anlegen" matTooltip="neuen Titel anlegen"
matTooltipPosition="left" matTooltipPosition="left"
> >
<fa-icon [icon]="faNew"></fa-icon> <fa-icon [icon]="faNew"></fa-icon>
</button> </button>
<table <table
mat-table
[dataSource]="songsService.songs | async" [dataSource]="songsService.songs | async"
class="mat-elevation-z8" class="mat-elevation-z8"
mat-table
> >
<ng-container matColumnDef="Number"> <ng-container matColumnDef="Number">
<th mat-header-cell *matHeaderCellDef>#</th> <th *matHeaderCellDef mat-header-cell>#</th>
<td mat-cell *matCellDef="let element"> <td *matCellDef="let element" mat-cell>
<mat-chip-list> <mat-chip-list>
<mat-chip>{{ element.Number }}</mat-chip> <mat-chip>{{ element.Number }}</mat-chip>
</mat-chip-list> </mat-chip-list>
@@ -27,13 +27,13 @@
</ng-container> </ng-container>
<ng-container matColumnDef="Name"> <ng-container matColumnDef="Name">
<th mat-header-cell *matHeaderCellDef>Titel</th> <th *matHeaderCellDef mat-header-cell>Titel</th>
<td mat-cell *matCellDef="let element">{{ element.Name }}</td> <td *matCellDef="let element" mat-cell>{{ element.Name }}</td>
</ng-container> </ng-container>
<ng-container matColumnDef="Key"> <ng-container matColumnDef="Key">
<th mat-header-cell *matHeaderCellDef></th> <th *matHeaderCellDef mat-header-cell></th>
<td mat-cell *matCellDef="let element"> <td *matCellDef="let element" mat-cell>
<mat-chip-list *ngIf="element.Key"> <mat-chip-list *ngIf="element.Key">
<mat-chip>{{ element.Key }}</mat-chip> <mat-chip>{{ element.Key }}</mat-chip>
</mat-chip-list> </mat-chip-list>
@@ -41,8 +41,8 @@
</ng-container> </ng-container>
<ng-container matColumnDef="SongType"> <ng-container matColumnDef="SongType">
<th mat-header-cell *matHeaderCellDef></th> <th *matHeaderCellDef mat-header-cell></th>
<td mat-cell *matCellDef="let element"> <td *matCellDef="let element" mat-cell>
<mat-chip-list <mat-chip-list
*ngIf="element.SongType && element.SongType !== 'None'" *ngIf="element.SongType && element.SongType !== 'None'"
> >
@@ -55,20 +55,20 @@
</ng-container> </ng-container>
<ng-container matColumnDef="Tempo"> <ng-container matColumnDef="Tempo">
<th mat-header-cell *matHeaderCellDef></th> <th *matHeaderCellDef mat-header-cell></th>
<td mat-cell *matCellDef="let element"> <td *matCellDef="let element" mat-cell>
<mat-chip-list *ngIf="element.Tempo"> <mat-chip-list *ngIf="element.Tempo">
<mat-chip>{{ element.Tempo }}</mat-chip> <mat-chip>{{ element.Tempo }}</mat-chip>
</mat-chip-list> </mat-chip-list>
</td> </td>
</ng-container> </ng-container>
<tr mat-header-row *matHeaderRowDef="columns; sticky: true"></tr> <tr *matHeaderRowDef="columns; sticky: true" mat-header-row></tr>
<tr <tr
(click)="onClick(row.ID)"
*matRowDef="let row; columns: columns"
[class.selected]="selectedSongId === row.ID" [class.selected]="selectedSongId === row.ID"
mat-row mat-row
*matRowDef="let row; columns: columns"
(click)="onClick(row.ID)"
></tr> ></tr>
</table> </table>
</div> </div>

1
WEB/src/app/components/songs/table/table.component.less
View File

@@ -17,6 +17,7 @@ table {
font-size: 24px; font-size: 24px;
z-index: 1000; z-index: 1000;
color: #aaa; color: #aaa;
&:hover { &:hover {
color: #000; color: #000;
} }

28
WEB/src/app/components/songs/table/table.component.ts
View File

@@ -1,11 +1,7 @@
import { SongsService } from './../../../data/songs.service'; import {SongsService} from '../../../data/songs.service';
import { import {ChangeDetectionStrategy, ChangeDetectorRef, Component} from '@angular/core';
Component, import {State} from 'src/app/data/state';
ChangeDetectionStrategy, import {faFileMedical} from '@fortawesome/free-solid-svg-icons';
ChangeDetectorRef
} from '@angular/core';
import { State } from 'src/app/data/state';
import { faFileMedical } from '@fortawesome/free-solid-svg-icons';
@Component({ @Component({
selector: 'app-table', selector: 'app-table',
@@ -19,9 +15,6 @@ export class TableComponent {
public faNew = faFileMedical; public faNew = faFileMedical;
public columnsFull = ['Number', 'Name', 'Key', 'SongType', 'Tempo']; public columnsFull = ['Number', 'Name', 'Key', 'SongType', 'Tempo'];
public columnsPinned = ['Number', 'Name']; public columnsPinned = ['Number', 'Name'];
public get columns(): string[] {
return this.songsService.state === State.list ? this.columnsFull : this.columnsPinned;
}
constructor( constructor(
public songsService: SongsService, public songsService: SongsService,
@@ -34,11 +27,18 @@ export class TableComponent {
); );
} }
public get columns(): string[] {
return this.songsService.state === State.list ? this.columnsFull : this.columnsPinned;
}
public renderSongType(songType: string) { public renderSongType(songType: string) {
switch (songType) { switch (songType) {
case 'Praise': return {name: 'Lobpreis', color: '#99FFB8'}; case 'Praise':
case 'Worship': return {name: 'Anbetung', color: '#C999FF'}; return {name: 'Lobpreis', color: '#99FFB8'};
default: return null; case 'Worship':
return {name: 'Anbetung', color: '#C999FF'};
default:
return null;
} }
} }

11
WEB/src/app/data/download.service.ts
View File

@@ -1,12 +1,13 @@
import { base } from './urls'; import {base} from './urls';
import { HttpClient } from '@angular/common/http'; import {HttpClient} from '@angular/common/http';
import { Injectable } from '@angular/core'; import {Injectable} from '@angular/core';
@Injectable({ @Injectable({
providedIn: 'root' providedIn: 'root'
}) })
export class DownloadService { export class DownloadService {
constructor(private httpClient: HttpClient) {} constructor(private httpClient: HttpClient) {
}
public get(songId: number, fileId: number, filename: string) { public get(songId: number, fileId: number, filename: string) {
return this.httpClient return this.httpClient
@@ -18,7 +19,7 @@ export class DownloadService {
(response: any) => { (response: any) => {
const contentType = response.headers.get('Content-Type'); const contentType = response.headers.get('Content-Type');
const downloadLink = document.createElement('a'); const downloadLink = document.createElement('a');
const blob = new Blob([response.body], { type: contentType }); const blob = new Blob([response.body], {type: contentType});
downloadLink.href = window.URL.createObjectURL(blob); downloadLink.href = window.URL.createObjectURL(blob);
downloadLink.setAttribute('download', filename); downloadLink.setAttribute('download', filename);
document.body.appendChild(downloadLink); document.body.appendChild(downloadLink);

29
WEB/src/app/data/edit-song.service.ts
View File

@@ -1,16 +1,16 @@
import { FileType } from './../models/files-types.model.ts'; import {SongsService} from 'src/app/data/songs.service';
import { SongsService } from 'src/app/data/songs.service'; import {Injectable} from '@angular/core';
import { Injectable } from '@angular/core'; import {FormControl, FormGroup, Validators} from '@angular/forms';
import { FormGroup, FormControl, Validators } from '@angular/forms'; import {switchMap} from 'rxjs/operators';
import { switchMap } from 'rxjs/operators'; import {Song} from '../models/song.model';
import { Song } from '../models/song.model'; import {Subscription} from 'rxjs';
import { Subscription } from 'rxjs';
@Injectable({ @Injectable({
providedIn: 'root' providedIn: 'root'
}) })
export class EditSongService { export class EditSongService {
constructor(private songsService: SongsService) {} constructor(private songsService: SongsService) {
}
public initSongEditForm(attachSync: boolean): FormGroup { public initSongEditForm(attachSync: boolean): FormGroup {
const song = attachSync const song = attachSync
@@ -25,7 +25,7 @@ export class EditSongService {
updateOn: 'blur', updateOn: 'blur',
validators: Validators.required validators: Validators.required
}), }),
Text: new FormControl(song.Text, { updateOn: 'blur' }), Text: new FormControl(song.Text, {updateOn: 'blur'}),
SongType: new FormControl(song.SongType, { SongType: new FormControl(song.SongType, {
updateOn: 'blur', updateOn: 'blur',
validators: Validators.required validators: Validators.required
@@ -34,8 +34,8 @@ export class EditSongService {
updateOn: 'blur', updateOn: 'blur',
validators: Validators.required validators: Validators.required
}), }),
Tempo: new FormControl(song.Tempo, { updateOn: 'blur' }), Tempo: new FormControl(song.Tempo, {updateOn: 'blur'}),
Comments: new FormControl(song.Comments, { updateOn: 'blur' }) Comments: new FormControl(song.Comments, {updateOn: 'blur'})
}); });
if (attachSync) { if (attachSync) {
@@ -45,7 +45,7 @@ export class EditSongService {
return form; return form;
} }
public initFileEditForm(songId: number, fileId: number): {form: FormGroup, changeSubscription: Subscription } { public initFileEditForm(songId: number, fileId: number): { form: FormGroup, changeSubscription: Subscription } {
const file = this.songsService.selectedSong.value.Files.filter( const file = this.songsService.selectedSong.value.Files.filter(
_ => _.ID === fileId _ => _.ID === fileId
)[0]; )[0];
@@ -64,7 +64,7 @@ export class EditSongService {
switchMap(() => this.songsService.selectSong(songId)) switchMap(() => this.songsService.selectSong(songId))
).subscribe(); ).subscribe();
return {form : form, changeSubscription: changeSubscription}; return {form: form, changeSubscription: changeSubscription};
} }
private attachSync(form: FormGroup, song: Song) { private attachSync(form: FormGroup, song: Song) {
@@ -99,7 +99,8 @@ export class EditSongService {
private firstFreeNumber(): number { private firstFreeNumber(): number {
let number = 0; let number = 0;
const numbers = this.songsService.songs.value.map(_ => _.Number); const numbers = this.songsService.songs.value.map(_ => _.Number);
while (numbers.indexOf(++number) !== -1) {} while (numbers.indexOf(++number) !== -1) {
}
return number; return number;
} }
} }

12
WEB/src/app/data/odata.service.ts
View File

@@ -1,11 +1,11 @@
import { Song } from 'src/app/models/song.model'; import {Expand, ODataQuery, ODataService} from 'odata-v4-ng';
import { ODataService, ODataQuery, Expand } from 'odata-v4-ng'; import {Observable} from 'rxjs';
import { Observable } from 'rxjs'; import {map, tap} from 'rxjs/operators';
import { map, tap } from 'rxjs/operators'; import {base} from './urls';
import { base } from './urls';
export class OdataService { export class OdataService {
private url: string; private url: string;
constructor(private odataService: ODataService, private entity: string) { constructor(private odataService: ODataService, private entity: string) {
this.url = base + '/odata/'; this.url = base + '/odata/';
} }
@@ -35,7 +35,7 @@ export class OdataService {
} }
public patch$(id: number, control: string, value: any): Observable<boolean> { public patch$(id: number, control: string, value: any): Observable<boolean> {
const valueSet = { [control]: value }; const valueSet = {[control]: value};
const query = new ODataQuery(this.odataService, this.url) const query = new ODataQuery(this.odataService, this.url)
.entitySet(this.entity) .entitySet(this.entity)
.entityKey(id); .entityKey(id);

20
WEB/src/app/data/songs.service.ts
View File

@@ -1,13 +1,13 @@
import { HttpClient } from '@angular/common/http'; import {HttpClient} from '@angular/common/http';
import { FileType } from './../models/files-types.model.ts'; import {FileType} from './../models/files-types.model.ts';
import { Injectable } from '@angular/core'; import {Injectable} from '@angular/core';
import { ODataService } from 'odata-v4-ng'; import {ODataService} from 'odata-v4-ng';
import { OdataService } from './odata.service'; import {OdataService} from './odata.service';
import { Song } from '../models/song.model'; import {Song} from '../models/song.model';
import { BehaviorSubject, Observable } from 'rxjs'; import {BehaviorSubject, Observable} from 'rxjs';
import { tap, switchMap } from 'rxjs/operators'; import {switchMap, tap} from 'rxjs/operators';
import { State } from './state'; import {State} from './state';
import { base } from './urls'; import {base} from './urls';
@Injectable({ @Injectable({
providedIn: 'root' providedIn: 'root'

3
WEB/src/app/models/file.model.ts
View File

@@ -1,4 +1,5 @@
import { FileType } from './files-types.model.ts'; import {FileType} from './files-types.model.ts';
export interface File { export interface File {
ID: number; ID: number;
Name: string; Name: string;

2
WEB/src/app/models/song.model.ts
View File

@@ -1,4 +1,4 @@
import { File } from './file.model'; import {File} from './file.model';
export interface Song { export interface Song {
ID: number; ID: number;

14
WEB/src/app/services/animation.ts
View File

@@ -1,13 +1,13 @@
import { trigger, transition, style, animate } from '@angular/animations'; import {animate, style, transition, trigger} from '@angular/animations';
export const blend = trigger('blend', [ export const blend = trigger('blend', [
transition(':enter', [ transition(':enter', [
style({ opacity: 0, display: 'none' }), style({opacity: 0, display: 'none'}),
animate('400ms', style({ opacity: 0 , display: 'none'})), animate('400ms', style({opacity: 0, display: 'none'})),
animate('300ms', style({ opacity: 1, display: 'block' })) animate('300ms', style({opacity: 1, display: 'block'}))
]), ]),
transition(':leave', [ transition(':leave', [
style({ opacity: 1, display: 'block' }), style({opacity: 1, display: 'block'}),
animate('300ms', style({ opacity: 0, display: 'none' })) animate('300ms', style({opacity: 0, display: 'none'}))
]) ])
]); ]);

8
WEB/src/app/services/fileupload.factory.ts
View File

@@ -1,12 +1,12 @@
import { base } from './../data/urls'; import {base} from '../data/urls';
import { Injectable } from '@angular/core'; import {Injectable} from '@angular/core';
import { FileUploader } from 'ng2-file-upload'; import {FileUploader} from 'ng2-file-upload';
@Injectable({ @Injectable({
providedIn: 'root' providedIn: 'root'
}) })
export class FileuploadFactory { export class FileuploadFactory {
public provideForNewFiles(songId: number): FileUploader { public static provideForNewFiles(songId: number): FileUploader {
const uploader = new FileUploader({ const uploader = new FileUploader({
url: base + '/api/songs/' + songId + '/files', url: base + '/api/songs/' + songId + '/files',
autoUpload: true, autoUpload: true,

6
WEB/src/index.html
View File

@@ -5,10 +5,10 @@
<title>Wgenerator</title> <title>Wgenerator</title>
<base href="/"> <base href="/">
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta content="width=device-width, initial-scale=1" name="viewport">
<link rel="icon" type="image/x-icon" href="favicon.ico"> <link href="favicon.ico" rel="icon" type="image/x-icon">
</head> </head>
<body> <body>
<app-root></app-root> <app-root></app-root>
</body> </body>
</html> </html>

8
WEB/src/main.ts
View File

@@ -1,8 +1,8 @@
import { enableProdMode } from '@angular/core'; import {enableProdMode} from '@angular/core';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; import {platformBrowserDynamic} from '@angular/platform-browser-dynamic';
import { AppModule } from './app/app.module'; import {AppModule} from './app/app.module';
import { environment } from './environments/environment'; import {environment} from './environments/environment';
if (environment.production) { if (environment.production) {
enableProdMode(); enableProdMode();

14
WEB/src/polyfills.ts
View File

@@ -59,14 +59,14 @@
* user can disable parts of macroTask/DomEvents patch by setting following flags * user can disable parts of macroTask/DomEvents patch by setting following flags
*/ */
// (window as any).__Zone_disable_requestAnimationFrame = true; // disable patch requestAnimationFrame // (window as any).__Zone_disable_requestAnimationFrame = true; // disable patch requestAnimationFrame
// (window as any).__Zone_disable_on_property = true; // disable patch onProperty such as onclick // (window as any).__Zone_disable_on_property = true; // disable patch onProperty such as onclick
// (window as any).__zone_symbol__BLACK_LISTED_EVENTS = ['scroll', 'mousemove']; // disable patch specified eventNames // (window as any).__zone_symbol__BLACK_LISTED_EVENTS = ['scroll', 'mousemove']; // disable patch specified eventNames
/* /*
* in IE/Edge developer tools, the addEventListener will also be wrapped by zone.js * in IE/Edge developer tools, the addEventListener will also be wrapped by zone.js
* with the following flag, it will bypass `zone.js` patch for IE/Edge * with the following flag, it will bypass `zone.js` patch for IE/Edge
*/ */
// (window as any).__Zone_enable_cross_context_check = true; // (window as any).__Zone_enable_cross_context_check = true;
/*************************************************************************************************** /***************************************************************************************************

14
WEB/src/styles.less
View File

@@ -19,17 +19,21 @@ html {
overflow: hidden; overflow: hidden;
border-radius: 8px; border-radius: 8px;
transition: all 300ms ease-in-out; transition: all 300ms ease-in-out;
.mat-table tbody { .mat-table tbody {
background: none; background: none;
} }
th.mat-header-cell:first-of-type { th.mat-header-cell:first-of-type {
border-top-left-radius: 8px; border-top-left-radius: 8px;
transition: all 300ms ease-in-out; transition: all 300ms ease-in-out;
} }
th.mat-header-cell:last-of-type { th.mat-header-cell:last-of-type {
border-top-right-radius: 8px; border-top-right-radius: 8px;
transition: all 300ms ease-in-out; transition: all 300ms ease-in-out;
} }
.mat-table thead { .mat-table thead {
border-top-right-radius: 8px; border-top-right-radius: 8px;
border-top-left-radius: 8px; border-top-left-radius: 8px;
@@ -40,13 +44,16 @@ html {
tr.selected { tr.selected {
background-color: #0002; background-color: #0002;
} }
tr:hover { tr:hover {
cursor: pointer; cursor: pointer;
background-color: #0001; background-color: #0001;
td { td {
color: #ff9900; color: #ff9900;
} }
} }
td.mat-cell { td.mat-cell {
padding: 0 5px; padding: 0 5px;
} }
@@ -58,14 +65,17 @@ html {
bottom: 0; bottom: 0;
right: 70vw; right: 70vw;
border-radius: 0px; border-radius: 0px;
th.mat-header-cell:first-of-type { th.mat-header-cell:first-of-type {
border-top-left-radius: 0px; border-top-left-radius: 0px;
transition: all 300ms ease-in-out; transition: all 300ms ease-in-out;
} }
th.mat-header-cell:last-of-type { th.mat-header-cell:last-of-type {
border-top-right-radius: 0px; border-top-right-radius: 0px;
transition: all 300ms ease-in-out; transition: all 300ms ease-in-out;
} }
.mat-table thead { .mat-table thead {
border-top-right-radius: 0px; border-top-right-radius: 0px;
border-top-left-radius: 0px; border-top-left-radius: 0px;
@@ -95,9 +105,11 @@ html {
.song-detail-container { .song-detail-container {
margin-left: 30vw; margin-left: 30vw;
.mat-form-field-infix { .mat-form-field-infix {
width: 80px; width: 80px;
} }
.mat-radio-button { .mat-radio-button {
margin: 15px 10px 0 10px; margin: 15px 10px 0 10px;
} }
@@ -106,11 +118,13 @@ html {
.mat-card { .mat-card {
padding: 0; padding: 0;
} }
table { table {
width: 100%; width: 100%;
background: none; background: none;
box-shadow: none; box-shadow: none;
} }
td.mat-cell:last-of-type, td.mat-footer-cell:last-of-type, th.mat-header-cell:last-of-type { td.mat-cell:last-of-type, td.mat-footer-cell:last-of-type, th.mat-header-cell:last-of-type {
padding-right: 8px; padding-right: 8px;
text-align: right; text-align: right;

7
WEB/src/test.ts
View File

@@ -1,11 +1,8 @@
// This file is required by karma.conf.js and loads recursively all the .spec and framework files // This file is required by karma.conf.js and loads recursively all the .spec and framework files
import 'zone.js/dist/zone-testing'; import 'zone.js/dist/zone-testing';
import { getTestBed } from '@angular/core/testing'; import {getTestBed} from '@angular/core/testing';
import { import {BrowserDynamicTestingModule, platformBrowserDynamicTesting} from '@angular/platform-browser-dynamic/testing';
BrowserDynamicTestingModule,
platformBrowserDynamicTesting
} from '@angular/platform-browser-dynamic/testing';
declare const require: any; declare const require: any;