Teriuihi
3babde5513
This commit introduces a new `DetailsComponent` for displaying detailed punishment data and establishes a route to view punishment history by ID and type. It also updates the API to support fetching individual punishment records and refines database mappings for improved data handling.
91 lines
4.0 KiB
HTML
91 lines
4.0 KiB
HTML
<ng-container>
|
|
<app-header [current_page]="'bans'" height="200px" background_image="/public/img/backgrounds/staff.png"
|
|
[overlay_gradient]="0.5">>
|
|
<div class="title" header-content>
|
|
<h1>Minecraft Punishments</h1>
|
|
</div>
|
|
</app-header>
|
|
|
|
<main>
|
|
<section class="darkmodeSection">
|
|
<div class="container">
|
|
<div class="columnSection">
|
|
<div class="historyButtonContainer">
|
|
<div [id]="getCurrentButtonId('all')" class="button-outer" (click)="changeHistoryPunishment('all')">
|
|
<span class="button-inner"
|
|
[ngClass]="active">All</span>
|
|
</div>
|
|
<div [id]="getCurrentButtonId('ban')" class="button-outer" (click)="changeHistoryPunishment('ban')">
|
|
<span class="button-inner"
|
|
[ngClass]="active">Bans</span>
|
|
</div>
|
|
<div [id]="getCurrentButtonId('mute')" class="button-outer" (click)="changeHistoryPunishment('mute')">
|
|
<span class="button-inner"
|
|
[ngClass]="active">Mutes</span>
|
|
</div>
|
|
<div [id]="getCurrentButtonId('warn')" class="button-outer" (click)="changeHistoryPunishment('warn')">
|
|
<span class="button-inner"
|
|
[ngClass]="active">Warnings</span>
|
|
</div>
|
|
<div [id]="getCurrentUserTypeButtonId('player')" class="button-outer" (click)="changeUserType('player')"
|
|
style="margin-left: 120px;">
|
|
<span class="button-inner"
|
|
[ngClass]="active">Player</span>
|
|
</div>
|
|
<div [id]="getCurrentUserTypeButtonId('staff')" class="button-outer" (click)="changeUserType('staff')">
|
|
<span class="button-inner"
|
|
[ngClass]="active">Staff</span>
|
|
</div>
|
|
</div>
|
|
<div class="historySearchContainer">
|
|
<input class="historySearch"
|
|
type="search"
|
|
placeholder="Search.."
|
|
[(ngModel)]="searchTerm"
|
|
(input)="filterNames()"
|
|
(keyup.enter)="search()"
|
|
>
|
|
<div class="dropdown-results" *ngIf="filteredNames.length > 0 && searchTerm">
|
|
<div
|
|
class="dropdown-item"
|
|
*ngFor="let name of filteredNames"
|
|
(mousedown)="selectName(name)">
|
|
{{ name }}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="historyTable">
|
|
<app-history [userType]="userType" [punishmentType]="punishmentType"
|
|
[page]="page" [searchTerm]="finalSearchTerm" (pageChange)="updatePageSize($event)"
|
|
(selectItem)="setSearch($event)">
|
|
</app-history>
|
|
</div>
|
|
<div class="changePageButtons">
|
|
<button [ngClass]="{'active': buttonActive(0), 'disabled': !buttonActive(0)}"
|
|
[disabled]="!buttonActive(0)"
|
|
(click)="setPage(0)" class="historyPageButton">
|
|
First page
|
|
</button>
|
|
<button [ngClass]="{'active': buttonActive(0), 'disabled': !buttonActive(0)}"
|
|
[disabled]="!buttonActive(0)"
|
|
(click)="previousPage()" class="historyPageButton">
|
|
Previous page
|
|
</button>
|
|
<span class="pageNumber">{{ this.page }} / {{ getMaxPage() }}</span>
|
|
<button [ngClass]="{'active': buttonActive(getMaxPage()), 'disabled': !buttonActive(getMaxPage())}"
|
|
[disabled]="!buttonActive(getMaxPage())"
|
|
(click)="nextPage()" class="historyPageButton">
|
|
Next page
|
|
</button>
|
|
<button [ngClass]="{'active': buttonActive(getMaxPage()), 'disabled': !buttonActive(getMaxPage())}"
|
|
[disabled]="!buttonActive(getMaxPage())"
|
|
(click)="setPage(getMaxPage())" class="historyPageButton">
|
|
Last page
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</main>
|
|
</ng-container>
|