SES-145 Tables in GM screen are now connected to backend #67
@ -26,6 +26,7 @@ import {
|
|||||||
MatTableModule,
|
MatTableModule,
|
||||||
MatSortModule,
|
MatSortModule,
|
||||||
MatDialogModule,
|
MatDialogModule,
|
||||||
|
MatTooltipModule,
|
||||||
} from '@angular/material';
|
} from '@angular/material';
|
||||||
import { UserService } from '../services/user.service';
|
import { UserService } from '../services/user.service';
|
||||||
import { StoreModule } from '@ngrx/store';
|
import { StoreModule } from '@ngrx/store';
|
||||||
@ -39,6 +40,10 @@ import { GameMasterArmorsTableComponent } from './components/game-master-armors-
|
|||||||
import { GameMasterCharacterActionsDialogComponent } from './components/game-master-character-actions-dialog/game-master-character-actions-dialog.component';
|
import { GameMasterCharacterActionsDialogComponent } from './components/game-master-character-actions-dialog/game-master-character-actions-dialog.component';
|
||||||
import { GameMasterWeaponsTableComponent } from './components/game-master-weapons-table/game-master-weapons-table.component';
|
import { GameMasterWeaponsTableComponent } from './components/game-master-weapons-table/game-master-weapons-table.component';
|
||||||
import { AbilitiesComponent } from './components/abilities/abilities.component';
|
import { AbilitiesComponent } from './components/abilities/abilities.component';
|
||||||
|
import { SpellService } from '../services/spell.service';
|
||||||
|
import { WeaponService } from '../services/weapon.service';
|
||||||
|
import { ArmorService } from '../services/armor.service';
|
||||||
|
import { OtherEquipmentService } from '../services/other-equipment.service';
|
||||||
|
|
||||||
@NgModule({
|
@NgModule({
|
||||||
declarations: [
|
declarations: [
|
||||||
@ -81,8 +86,16 @@ import { AbilitiesComponent } from './components/abilities/abilities.component';
|
|||||||
}),
|
}),
|
||||||
MatTableModule,
|
MatTableModule,
|
||||||
MatSortModule,
|
MatSortModule,
|
||||||
|
MatTooltipModule,
|
||||||
|
],
|
||||||
|
providers: [
|
||||||
|
UserService,
|
||||||
|
CharacterService,
|
||||||
|
SpellService,
|
||||||
|
WeaponService,
|
||||||
|
ArmorService,
|
||||||
|
OtherEquipmentService,
|
||||||
],
|
],
|
||||||
providers: [UserService, CharacterService],
|
|
||||||
bootstrap: [AppComponent],
|
bootstrap: [AppComponent],
|
||||||
entryComponents: [
|
entryComponents: [
|
||||||
GameMasterSpellsTableComponent,
|
GameMasterSpellsTableComponent,
|
||||||
|
@ -3,6 +3,10 @@ import { MatTableDataSource } from '@angular/material/table';
|
|||||||
import { ArmorViewModel } from '../../../types/viewmodels/armor-viewmodels/ArmorViewModel';
|
import { ArmorViewModel } from '../../../types/viewmodels/armor-viewmodels/ArmorViewModel';
|
||||||
import { MatPaginator } from '@angular/material/paginator';
|
import { MatPaginator } from '@angular/material/paginator';
|
||||||
import { MatSort } from '@angular/material/sort';
|
import { MatSort } from '@angular/material/sort';
|
||||||
|
import { first } from 'rxjs/operators';
|
||||||
|
import { ErrorResponse } from '../../../types/ErrorResponse';
|
||||||
|
import { HttpErrorResponse } from '@angular/common/http';
|
||||||
|
import { ArmorService } from '../../../services/armor.service';
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
selector: 'app-game-master-armors-table',
|
selector: 'app-game-master-armors-table',
|
||||||
@ -22,29 +26,27 @@ export class GameMasterArmorsTableComponent implements OnInit {
|
|||||||
@ViewChild(MatPaginator, { static: true }) paginator: MatPaginator;
|
@ViewChild(MatPaginator, { static: true }) paginator: MatPaginator;
|
||||||
@ViewChild(MatSort, { static: true }) sort: MatSort;
|
@ViewChild(MatSort, { static: true }) sort: MatSort;
|
||||||
|
|
||||||
constructor() {
|
constructor(private armorService: ArmorService) {
|
||||||
const armors = [
|
armorService
|
||||||
{
|
.GetAllArmors()
|
||||||
id: 1,
|
.pipe(first())
|
||||||
name: 'Test',
|
.subscribe(
|
||||||
category: 'Testowa',
|
(result) => {
|
||||||
minimumStrength: 12,
|
console.log(result);
|
||||||
|
|||||||
weight: 98,
|
this.dataSource = new MatTableDataSource(result);
|
||||||
cost: 123,
|
this.dataSource.paginator = this.paginator;
|
||||||
armorClassBase: 10,
|
this.dataSource.sort = this.sort;
|
||||||
haveDexterityBonus: false,
|
},
|
||||||
haveStealthDisadvantage: false,
|
(error: ErrorResponse | HttpErrorResponse) => {
|
||||||
currencyType: 1,
|
if (error instanceof HttpErrorResponse) {
|
||||||
},
|
error = error.error as ErrorResponse;
|
||||||
];
|
}
|
||||||
|
console.log(error.message);
|
||||||
this.dataSource = new MatTableDataSource(armors);
|
}
|
||||||
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
ngOnInit() {
|
ngOnInit() {}
|
||||||
this.dataSource.paginator = this.paginator;
|
|
||||||
this.dataSource.sort = this.sort;
|
|
||||||
}
|
|
||||||
|
|
||||||
applyFilter(event: Event) {
|
applyFilter(event: Event) {
|
||||||
const filterValue = (event.target as HTMLInputElement).value;
|
const filterValue = (event.target as HTMLInputElement).value;
|
||||||
|
@ -2,13 +2,11 @@ import { Component, OnInit, ViewChild } from '@angular/core';
|
|||||||
import { MatPaginator } from '@angular/material/paginator';
|
import { MatPaginator } from '@angular/material/paginator';
|
||||||
import { MatSort } from '@angular/material/sort';
|
import { MatSort } from '@angular/material/sort';
|
||||||
import { MatTableDataSource } from '@angular/material/table';
|
import { MatTableDataSource } from '@angular/material/table';
|
||||||
|
import { SpellViewModel } from '../../../types/viewmodels/spell-viewmodels/SpellViewModel';
|
||||||
export interface SpellData {
|
import { SpellService } from '../../../services/spell.service';
|
||||||
name: string;
|
import { first } from 'rxjs/operators';
|
||||||
range: string;
|
import { ErrorResponse } from '../../../types/ErrorResponse';
|
||||||
level: number;
|
import { HttpErrorResponse } from '@angular/common/http';
|
||||||
school: string;
|
|
||||||
}
|
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
selector: 'app-game-master-spells-table',
|
selector: 'app-game-master-spells-table',
|
||||||
@ -17,25 +15,31 @@ export interface SpellData {
|
|||||||
})
|
})
|
||||||
export class GameMasterSpellsTableComponent implements OnInit {
|
export class GameMasterSpellsTableComponent implements OnInit {
|
||||||
displayedColumns: string[] = ['Name', 'Range', 'Level', 'School'];
|
displayedColumns: string[] = ['Name', 'Range', 'Level', 'School'];
|
||||||
dataSource: MatTableDataSource<SpellData>;
|
dataSource: MatTableDataSource<SpellViewModel>;
|
||||||
|
|
||||||
@ViewChild(MatPaginator, { static: true }) paginator: MatPaginator;
|
@ViewChild(MatPaginator, { static: true }) paginator: MatPaginator;
|
||||||
@ViewChild(MatSort, { static: true }) sort: MatSort;
|
@ViewChild(MatSort, { static: true }) sort: MatSort;
|
||||||
|
|
||||||
constructor() {
|
constructor(private spellService: SpellService) {
|
||||||
const users = Array.from({ length: 100 }, (_, k) => this.createSepll());
|
spellService
|
||||||
|
.GetAllSpells()
|
||||||
this.dataSource = new MatTableDataSource(users);
|
.pipe(first())
|
||||||
|
.subscribe(
|
||||||
|
(result) => {
|
||||||
|
this.dataSource = new MatTableDataSource(result);
|
||||||
|
this.dataSource.paginator = this.paginator;
|
||||||
|
this.dataSource.sort = this.sort;
|
||||||
|
},
|
||||||
|
(error: ErrorResponse | HttpErrorResponse) => {
|
||||||
|
if (error instanceof HttpErrorResponse) {
|
||||||
|
error = error.error as ErrorResponse;
|
||||||
|
}
|
||||||
|
console.log(error.message);
|
||||||
|
}
|
||||||
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
createSepll(): SpellData {
|
ngOnInit() {}
|
||||||
return { name: 'test', range: 'asd', level: 2, school: 'UAM!!!!' };
|
|
||||||
}
|
|
||||||
|
|
||||||
ngOnInit() {
|
|
||||||
this.dataSource.paginator = this.paginator;
|
|
||||||
this.dataSource.sort = this.sort;
|
|
||||||
}
|
|
||||||
|
|
||||||
applyFilter(event: Event) {
|
applyFilter(event: Event) {
|
||||||
const filterValue = (event.target as HTMLInputElement).value;
|
const filterValue = (event.target as HTMLInputElement).value;
|
||||||
|
@ -1,11 +1,11 @@
|
|||||||
.description-weapon-column {
|
.text-cut {
|
||||||
|
max-width: 60px; /* feel free to include any other value */
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
text-overflow: ellipsis;
|
text-overflow: ellipsis;
|
||||||
}
|
}
|
||||||
|
|
||||||
table {
|
table {
|
||||||
width: 100%;
|
|
||||||
background-color: initial;
|
background-color: initial;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -34,5 +34,4 @@ mat-paginator {
|
|||||||
td,
|
td,
|
||||||
th {
|
th {
|
||||||
color: whitesmoke;
|
color: whitesmoke;
|
||||||
width: 25%;
|
|
||||||
}
|
}
|
||||||
|
@ -3,8 +3,8 @@
|
|||||||
<input matInput (keyup)="applyFilter($event)" placeholder="Ex. Sword" #input>
|
<input matInput (keyup)="applyFilter($event)" placeholder="Ex. Sword" #input>
|
||||||
</mat-form-field>
|
</mat-form-field>
|
||||||
|
|
||||||
<div class="mat-elevation-z8">
|
<div>
|
||||||
<table mat-table [dataSource]="dataSource" matSort>
|
<table mat-table [dataSource]="dataSource" matSort class="w-100 mat-elevation-z8">
|
||||||
|
|
||||||
<ng-container matColumnDef="Name">
|
<ng-container matColumnDef="Name">
|
||||||
<th mat-header-cell *matHeaderCellDef mat-sort-header> Name </th>
|
<th mat-header-cell *matHeaderCellDef mat-sort-header> Name </th>
|
||||||
@ -28,7 +28,9 @@
|
|||||||
|
|
||||||
<ng-container matColumnDef="Description">
|
<ng-container matColumnDef="Description">
|
||||||
<th mat-header-cell *matHeaderCellDef mat-sort-header> Description </th>
|
<th mat-header-cell *matHeaderCellDef mat-sort-header> Description </th>
|
||||||
<td mat-cell *matCellDef="let row" class="description-weapon-column"> {{row.description}} </td>
|
<td mat-cell *matCellDef="let row" class="text-cut" [matTooltip]="row.description">
|
||||||
|
{{row.description}}
|
||||||
|
</td>
|
||||||
</ng-container>
|
</ng-container>
|
||||||
|
|
||||||
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
|
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
|
||||||
|
@ -3,6 +3,10 @@ import { MatTableDataSource } from '@angular/material/table';
|
|||||||
import { MatPaginator } from '@angular/material/paginator';
|
import { MatPaginator } from '@angular/material/paginator';
|
||||||
import { MatSort } from '@angular/material/sort';
|
import { MatSort } from '@angular/material/sort';
|
||||||
import { WeaponViewModel } from '../../../types/viewmodels/weapon-viewmodels/WeaponViewModel';
|
import { WeaponViewModel } from '../../../types/viewmodels/weapon-viewmodels/WeaponViewModel';
|
||||||
|
import { WeaponService } from '../../../services/weapon.service';
|
||||||
|
import { first } from 'rxjs/operators';
|
||||||
|
import { ErrorResponse } from '../../../types/ErrorResponse';
|
||||||
|
import { HttpErrorResponse } from '@angular/common/http';
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
selector: 'app-game-master-weapons-table',
|
selector: 'app-game-master-weapons-table',
|
||||||
@ -22,30 +26,27 @@ export class GameMasterWeaponsTableComponent implements OnInit {
|
|||||||
@ViewChild(MatPaginator, { static: true }) paginator: MatPaginator;
|
@ViewChild(MatPaginator, { static: true }) paginator: MatPaginator;
|
||||||
@ViewChild(MatSort, { static: true }) sort: MatSort;
|
@ViewChild(MatSort, { static: true }) sort: MatSort;
|
||||||
|
|
||||||
constructor() {
|
constructor(private weaponService: WeaponService) {
|
||||||
const weapons = [
|
weaponService
|
||||||
{
|
.GetAllWeapons()
|
||||||
id: 1,
|
.pipe(first())
|
||||||
name: 'Test',
|
.subscribe(
|
||||||
cost: 123,
|
(result) => {
|
||||||
weight: 98,
|
console.log(result);
|
||||||
s426128
commented
możesz usunąć console.log możesz usunąć console.log
|
|||||||
diceCount: 2,
|
this.dataSource = new MatTableDataSource(result);
|
||||||
diceValue: 20,
|
this.dataSource.paginator = this.paginator;
|
||||||
twoHandDamageType: 'Toxic',
|
this.dataSource.sort = this.sort;
|
||||||
description:
|
},
|
||||||
'A japanase battleaxe with a spike on the opposite side of the blade.',
|
(error: ErrorResponse | HttpErrorResponse) => {
|
||||||
weaponType: 'Two-Handed Melee Weapons',
|
if (error instanceof HttpErrorResponse) {
|
||||||
rangeMeele: 50,
|
error = error.error as ErrorResponse;
|
||||||
},
|
}
|
||||||
];
|
console.log(error.message);
|
||||||
|
}
|
||||||
this.dataSource = new MatTableDataSource(weapons);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
ngOnInit() {
|
ngOnInit() {}
|
||||||
this.dataSource.paginator = this.paginator;
|
|
||||||
this.dataSource.sort = this.sort;
|
|
||||||
}
|
|
||||||
|
|
||||||
applyFilter(event: Event) {
|
applyFilter(event: Event) {
|
||||||
const filterValue = (event.target as HTMLInputElement).value;
|
const filterValue = (event.target as HTMLInputElement).value;
|
||||||
|
@ -0,0 +1,34 @@
|
|||||||
|
import { Inject, Injectable } from '@angular/core';
|
||||||
|
import { HttpClient } from '@angular/common/http';
|
||||||
|
import { Observable, of, throwError } from 'rxjs';
|
||||||
|
import { WeaponViewModel } from '../types/viewmodels/weapon-viewmodels/WeaponViewModel';
|
||||||
|
import { Either } from '../types/Either';
|
||||||
|
import { ErrorResponse } from '../types/ErrorResponse';
|
||||||
|
import { switchMap } from 'rxjs/operators';
|
||||||
|
import { ArmorViewModel } from '../types/viewmodels/armor-viewmodels/ArmorViewModel';
|
||||||
|
|
||||||
|
Injectable({
|
||||||
|
providedIn: 'root',
|
||||||
|
});
|
||||||
|
export class ArmorService {
|
||||||
|
private baseUrl = 'api/armor/';
|
||||||
|
constructor(private http: HttpClient, @Inject('BASE_URL') baseUrl: string) {
|
||||||
|
this.baseUrl = baseUrl + this.baseUrl;
|
||||||
|
}
|
||||||
|
|
||||||
|
GetAllArmors(): Observable<ArmorViewModel[]> {
|
||||||
|
return this.http
|
||||||
|
.get<Either<ArmorViewModel[], ErrorResponse>>(
|
||||||
|
this.baseUrl + 'getAllArmor'
|
||||||
|
)
|
||||||
|
.pipe(
|
||||||
|
switchMap((response) => {
|
||||||
|
if (response.isLeft) {
|
||||||
|
return of(response.left);
|
||||||
|
} else {
|
||||||
|
return throwError(response.right);
|
||||||
|
}
|
||||||
|
})
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
@ -0,0 +1,12 @@
|
|||||||
|
import { Inject, Injectable } from '@angular/core';
|
||||||
|
import { HttpClient } from '@angular/common/http';
|
||||||
|
|
||||||
|
Injectable({
|
||||||
|
providedIn: 'root',
|
||||||
|
});
|
||||||
|
export class OtherEquipmentService {
|
||||||
|
private baseUrl = 'api/otherEquipment/';
|
||||||
|
constructor(private http: HttpClient, @Inject('BASE_URL') baseUrl: string) {
|
||||||
|
this.baseUrl = baseUrl + this.baseUrl;
|
||||||
|
}
|
||||||
|
}
|
@ -0,0 +1,33 @@
|
|||||||
|
import { Inject, Injectable } from '@angular/core';
|
||||||
|
import { HttpClient, HttpParams } from '@angular/common/http';
|
||||||
|
import { Observable, of, throwError } from 'rxjs';
|
||||||
|
import { SpellViewModel } from '../types/viewmodels/spell-viewmodels/SpellViewModel';
|
||||||
|
import { Either } from '../types/Either';
|
||||||
|
import { ErrorResponse } from '../types/ErrorResponse';
|
||||||
|
import { switchMap } from 'rxjs/operators';
|
||||||
|
|
||||||
|
Injectable({
|
||||||
|
providedIn: 'root',
|
||||||
|
});
|
||||||
|
export class SpellService {
|
||||||
|
private baseUrl = 'api/spell/';
|
||||||
|
constructor(private http: HttpClient, @Inject('BASE_URL') baseUrl: string) {
|
||||||
|
this.baseUrl = baseUrl + this.baseUrl;
|
||||||
|
}
|
||||||
|
|
||||||
|
GetAllSpells(): Observable<SpellViewModel[]> {
|
||||||
|
return this.http
|
||||||
|
.get<Either<SpellViewModel[], ErrorResponse>>(
|
||||||
|
this.baseUrl + 'getAllSpells'
|
||||||
|
)
|
||||||
|
.pipe(
|
||||||
|
switchMap((response) => {
|
||||||
|
if (response.isLeft) {
|
||||||
|
return of(response.left);
|
||||||
|
} else {
|
||||||
|
return throwError(response.right);
|
||||||
|
}
|
||||||
|
})
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
@ -0,0 +1,34 @@
|
|||||||
|
import { Inject, Injectable } from '@angular/core';
|
||||||
|
import { HttpClient } from '@angular/common/http';
|
||||||
|
import { Observable, of, throwError } from 'rxjs';
|
||||||
|
import { SpellViewModel } from '../types/viewmodels/spell-viewmodels/SpellViewModel';
|
||||||
|
import { Either } from '../types/Either';
|
||||||
|
import { ErrorResponse } from '../types/ErrorResponse';
|
||||||
|
import { switchMap } from 'rxjs/operators';
|
||||||
|
import { WeaponViewModel } from '../types/viewmodels/weapon-viewmodels/WeaponViewModel';
|
||||||
|
|
||||||
|
Injectable({
|
||||||
|
providedIn: 'root',
|
||||||
|
});
|
||||||
|
export class WeaponService {
|
||||||
|
private baseUrl = 'api/weapon/';
|
||||||
|
constructor(private http: HttpClient, @Inject('BASE_URL') baseUrl: string) {
|
||||||
|
this.baseUrl = baseUrl + this.baseUrl;
|
||||||
|
}
|
||||||
|
|
||||||
|
GetAllWeapons(): Observable<WeaponViewModel[]> {
|
||||||
|
return this.http
|
||||||
|
.get<Either<WeaponViewModel[], ErrorResponse>>(
|
||||||
|
this.baseUrl + 'getAllWeapons'
|
||||||
|
)
|
||||||
|
.pipe(
|
||||||
|
switchMap((response) => {
|
||||||
|
if (response.isLeft) {
|
||||||
|
return of(response.left);
|
||||||
|
} else {
|
||||||
|
return throwError(response.right);
|
||||||
|
}
|
||||||
|
})
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
@ -0,0 +1,17 @@
|
|||||||
|
export interface SpellViewModel {
|
||||||
|
id: number;
|
||||||
|
name: string;
|
||||||
|
descriptions: string[];
|
||||||
|
higherLevel: string[];
|
||||||
|
range: string;
|
||||||
|
components: string;
|
||||||
|
material: string;
|
||||||
|
ritual: boolean;
|
||||||
|
duration: string;
|
||||||
|
concentration: boolean;
|
||||||
|
castingTime: string;
|
||||||
|
level: number;
|
||||||
|
school: string;
|
||||||
|
classes: string;
|
||||||
|
subclasses: string;
|
||||||
|
}
|
Loading…
Reference in New Issue
Block a user
możesz usunąć console.log