Teriuihi
66d641b825
Enhanced the bans component to retain search state using the History API. Updated the history component to support paginated and filtered data loading based on user input and search terms.
45 lines
1.7 KiB
HTML
45 lines
1.7 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>Punishment History</h1>
|
|
</div>
|
|
</app-header>
|
|
|
|
<main>
|
|
<section class="darkmodeSection">
|
|
<div class="container">
|
|
<div class="columnSection">
|
|
<div class="historyTypeContainer">
|
|
<button class="button-outer" (click)="punishmentType = 'all'">All</button>
|
|
<button class="button-outer" (click)="punishmentType = 'ban'">Bans</button>
|
|
<button class="button-outer" (click)="punishmentType = 'mute'">Mutes</button>
|
|
<button class="button-outer" (click)="punishmentType = 'warn'">Warnings</button>
|
|
</div>
|
|
<div class="historySearchContainer">
|
|
<input class="historySearch"
|
|
type="text"
|
|
placeholder="Search.."
|
|
[(ngModel)]="searchTerm"
|
|
(input)="filterNames()"
|
|
>
|
|
<button class="searchButton" (click)="search()">Search</button>
|
|
<div class="search-dropdown" *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"></app-history>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</main>
|
|
</ng-container>
|