diff --git a/SessionCompanion/SessionCompanion/ClientApp/src/app/components/player-armors-table/player-armors-table.component.css b/SessionCompanion/SessionCompanion/ClientApp/src/app/components/player-armors-table/player-armors-table.component.css
index 63c69a9..a4eef06 100644
--- a/SessionCompanion/SessionCompanion/ClientApp/src/app/components/player-armors-table/player-armors-table.component.css
+++ b/SessionCompanion/SessionCompanion/ClientApp/src/app/components/player-armors-table/player-armors-table.component.css
@@ -1,5 +1,11 @@
+.text-cut {
+ max-width: 60px; /* feel free to include any other value */
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
+}
+
table {
- width: 100%;
background-color: initial;
}
@@ -28,7 +34,6 @@ mat-paginator {
td,
th {
color: whitesmoke;
- width: 25%;
}
.text-centre {
diff --git a/SessionCompanion/SessionCompanion/ClientApp/src/app/components/player-armors-table/player-armors-table.component.html b/SessionCompanion/SessionCompanion/ClientApp/src/app/components/player-armors-table/player-armors-table.component.html
index 779c60c..0708404 100644
--- a/SessionCompanion/SessionCompanion/ClientApp/src/app/components/player-armors-table/player-armors-table.component.html
+++ b/SessionCompanion/SessionCompanion/ClientApp/src/app/components/player-armors-table/player-armors-table.component.html
@@ -1,4 +1,5 @@
Your armors:
+
Filter
@@ -17,11 +18,6 @@
{{row.category}} |
-
- Minimum Strength |
- {{row.minimumStrength}}% |
-
-
Weight |
{{row.weight}} |
@@ -40,5 +36,6 @@
-
+
+
diff --git a/SessionCompanion/SessionCompanion/ClientApp/src/app/components/player-armors-table/player-armors-table.component.ts b/SessionCompanion/SessionCompanion/ClientApp/src/app/components/player-armors-table/player-armors-table.component.ts
index e8e5cfe..9ebcadc 100644
--- a/SessionCompanion/SessionCompanion/ClientApp/src/app/components/player-armors-table/player-armors-table.component.ts
+++ b/SessionCompanion/SessionCompanion/ClientApp/src/app/components/player-armors-table/player-armors-table.component.ts
@@ -19,7 +19,6 @@ export class PlayerArmorsTableComponent implements OnInit {
displayedColumns: string[] = [
'name',
'category',
- 'minimumStrength',
'weight',
'cost',
];
diff --git a/SessionCompanion/SessionCompanion/ClientApp/src/app/components/player-other-equipment-table/player-other-equipment-table.component.css b/SessionCompanion/SessionCompanion/ClientApp/src/app/components/player-other-equipment-table/player-other-equipment-table.component.css
index e69de29..a4eef06 100644
--- a/SessionCompanion/SessionCompanion/ClientApp/src/app/components/player-other-equipment-table/player-other-equipment-table.component.css
+++ b/SessionCompanion/SessionCompanion/ClientApp/src/app/components/player-other-equipment-table/player-other-equipment-table.component.css
@@ -0,0 +1,43 @@
+.text-cut {
+ max-width: 60px; /* feel free to include any other value */
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
+}
+
+table {
+ background-color: initial;
+}
+
+mat-paginator {
+ background-color: initial;
+ color: white;
+}
+
+::ng-deep .mat-select-arrow {
+ color: whitesmoke;
+}
+
+::ng-deep .mat-select-value {
+ color: white;
+}
+
+.mat-sort-header-container {
+ color: whitesmoke !important;
+}
+
+.mat-form-field {
+ font-size: 14px;
+ width: 100%;
+}
+
+td,
+th {
+ color: whitesmoke;
+}
+
+.text-centre {
+ padding: 1%;
+ text-align: center;
+ align-items: center
+}
diff --git a/SessionCompanion/SessionCompanion/ClientApp/src/app/components/player-other-equipment-table/player-other-equipment-table.component.html b/SessionCompanion/SessionCompanion/ClientApp/src/app/components/player-other-equipment-table/player-other-equipment-table.component.html
index 219c271..7db917a 100644
--- a/SessionCompanion/SessionCompanion/ClientApp/src/app/components/player-other-equipment-table/player-other-equipment-table.component.html
+++ b/SessionCompanion/SessionCompanion/ClientApp/src/app/components/player-other-equipment-table/player-other-equipment-table.component.html
@@ -1 +1,34 @@
-player-other-equipment-table works!
+Your other equipment:
+
+ Filter
+
+
+
+
+
+
+
+ Name |
+ {{row.name}} |
+
+
+
+ Cost |
+ {{row.cost}} $ |
+
+
+
+ Description |
+ {{row.description}} |
+
+
+
+
+
+
+ No data matching the filter "{{input.value}}" |
+
+
+
+
+
diff --git a/SessionCompanion/SessionCompanion/ClientApp/src/app/components/player-other-equipment-table/player-other-equipment-table.component.ts b/SessionCompanion/SessionCompanion/ClientApp/src/app/components/player-other-equipment-table/player-other-equipment-table.component.ts
index 5f934a0..e40a32b 100644
--- a/SessionCompanion/SessionCompanion/ClientApp/src/app/components/player-other-equipment-table/player-other-equipment-table.component.ts
+++ b/SessionCompanion/SessionCompanion/ClientApp/src/app/components/player-other-equipment-table/player-other-equipment-table.component.ts
@@ -1,4 +1,14 @@
-import { Component, OnInit } from '@angular/core';
+import { Component, OnInit, ViewChild } from '@angular/core';
+import { MatTableDataSource } from '@angular/material/table';
+import { MatPaginator } from '@angular/material/paginator';
+import { MatSort } from '@angular/material/sort';
+import { OtherEquipmentViewModel} from '../../../types/viewmodels/otherEquipment-viewmodels/OtherEquipmentViewModel';
+import { first } from 'rxjs/operators';
+import { ErrorResponse } from '../../../types/ErrorResponse';
+import { HttpErrorResponse } from '@angular/common/http';
+import { EquipmentService } from '../../../services/equipment.service';
+import { Store } from '@ngrx/store';
+import { AppState } from '../../store/models/app-state.model';
@Component({
selector: 'app-player-other-equipment-table',
@@ -6,10 +16,52 @@ import { Component, OnInit } from '@angular/core';
styleUrls: ['./player-other-equipment-table.component.css']
})
export class PlayerOtherEquipmentTableComponent implements OnInit {
+ displayedColumns: string[] = [
+ 'name',
+ 'cost',
+ 'description',
+ ];
+ dataSource: MatTableDataSource;
- constructor() { }
+ @ViewChild(MatPaginator, { static: true }) paginator: MatPaginator;
+ @ViewChild(MatSort, { static: true }) sort: MatSort;
+
+ constructor(private store: Store, private equipmentService: EquipmentService) {}
ngOnInit() {
+ this.getCharacterOtherEquipment();
}
+ getCharacterOtherEquipment() {
+ this.store
+ .select((s) => s.playerStore.characterId)
+ .pipe(first())
+ .subscribe((characterId) => {
+ this.equipmentService
+ .getCharacterOtherEquipment(characterId)
+ .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.error(error.message);
+ }
+ );
+ });
+ }
+
+ applyFilter(event: Event) {
+ const filterValue = (event.target as HTMLInputElement).value;
+ this.dataSource.filter = filterValue.trim().toLowerCase();
+
+ if (this.dataSource.paginator) {
+ this.dataSource.paginator.firstPage();
+ }
+ }
}
diff --git a/SessionCompanion/SessionCompanion/ClientApp/src/app/components/player-weapons-table/player-weapons-table.component.html b/SessionCompanion/SessionCompanion/ClientApp/src/app/components/player-weapons-table/player-weapons-table.component.html
index a4d1940..a813753 100644
--- a/SessionCompanion/SessionCompanion/ClientApp/src/app/components/player-weapons-table/player-weapons-table.component.html
+++ b/SessionCompanion/SessionCompanion/ClientApp/src/app/components/player-weapons-table/player-weapons-table.component.html
@@ -35,5 +35,5 @@
-
+