gsd
/
Facti13.Frontend.Angular
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

интеграция табличек в профиль

master
gsd 2 months ago
parent
2f44565bac
commit
9e68fea7fb
11 changed files with 360 additions and 350 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 5
      src/app/app.module.ts
  2. 97
      src/app/pages/banlist-page/banlist-page.component.html
  3. 55
      src/app/pages/banlist-page/banlist-page.component.ts
  4. 168
      src/app/pages/banlist-page/banlist-search-table.ts
  5. 22
      src/app/pages/internal-components/abstract-search-table.component.ts
  6. 2
      src/app/pages/internal-components/dialogs/BanViewDialog.ts
  7. 146
      src/app/pages/messages-page/message-search-table.ts
  8. 110
      src/app/pages/messages-page/messages-page.component.html
  9. 18
      src/app/pages/messages-page/messages-page.component.scss
  10. 49
      src/app/pages/messages-page/messages-page.component.ts
  11. 38
      src/app/pages/profile-page/profile-page.component.html

5
src/app/app.module.ts
View File

@ -50,6 +50,8 @@ import {FilterMatChipDateEnd} from "./pages/internal-components/search-filters/b
import {FilterMatChipBanId} from "./pages/internal-components/search-filters/FilterMatChipBanId";
import {BanViewDialog} from "./pages/internal-components/dialogs/BanViewDialog";
import {MatDialogModule} from "@angular/material/dialog";
import {MessageSearchTable} from "./pages/messages-page/message-search-table";
import {BanlistSearchTable} from "./pages/banlist-page/banlist-search-table";
registerLocaleData(localeRu, "ru")
@ -64,6 +66,9 @@ registerLocaleData(localeRu, "ru")
RulesPageComponent,
BanlistPageComponent,
MessagesPageComponent,
//tables
MessageSearchTable,
BanlistSearchTable,
//search filters
FilterMatChipAccount,
FilterMatChipMessage,

97
src/app/pages/banlist-page/banlist-page.component.html
View File

@ -7,102 +7,7 @@
<div class="content-in-border">
<app-need-auth-to-continue *ngIf="!authService.isAuth()"></app-need-auth-to-continue>
<div *ngIf="authService.isAuth">
<div style="padding-bottom: 10px;">
<mat-chip-list>
<mat-chip [matMenuTriggerFor]="addFilter">Искать по...</mat-chip>
<mat-menu #addFilter>
<button mat-menu-item (click)="filter.addAccountToSearch('')">Профилю</button>
<button mat-menu-item [matMenuTriggerFor]="timeSelect">Времени</button>
</mat-menu>
<mat-menu #timeSelect>
<button mat-menu-item (click)="filter.addEndTimeToSearch()">До ...</button>
<button mat-menu-item (click)="filter.addBeginTimeToSearch()">После ...</button>
</mat-menu>
<mat-chip *ngIf="filter.updated" (click)="updateData()">Обновить</mat-chip>
<app-filter-mat-chip-account
[filter]="filter"
></app-filter-mat-chip-account>
<app-filter-mat-chip-date-begin
[filter]="filter">
</app-filter-mat-chip-date-begin>
<app-filter-mat-chip-date-end
[filter]="filter">
</app-filter-mat-chip-date-end>
<app-filter-mat-chip-banid
[filter]="filter">
</app-filter-mat-chip-banid>
</mat-chip-list>
</div>
<div>
<div class="loading-shade"
*ngIf="loading || err">
<mat-spinner *ngIf="loading"></mat-spinner>
<div class="err" *ngIf="err">
Слишком много запросов или сервер не отвечает, обнови страницу.
<br>
<button mat-button (click)="err=false; loading=false">Закрыть</button>
</div>
</div>
<table mat-table [dataSource]="dataSource" style="width: 100%">
<ng-container matColumnDef="id">
<th mat-header-cell *matHeaderCellDef> ID бана </th>
<td mat-cell *matCellDef="let row" [matMenuTriggerFor]="banIdMenu"> {{row.id}}
<mat-menu #banIdMenu><button mat-menu-item (click)="filter.addBanIdToSearch(row.id)">Искать по ид</button></mat-menu></td>
</ng-container>
<ng-container matColumnDef="player_name">
<th mat-header-cell *matHeaderCellDef> Имя игрока </th>
<td mat-cell *matCellDef="let row" [matMenuTriggerFor]="accountMenu"> {{row.player_name}}
<mat-menu #accountMenu>
<button mat-menu-item (click)="filter.addAccountToSearch(row.player_name)">Добавить в поиск</button>
<button mat-menu-item (click)="authService.searchPlayer(row.account_id)">Открыть профиль</button>
</mat-menu></td>
</ng-container>
<ng-container matColumnDef="date">
<th mat-header-cell *matHeaderCellDef> Время </th>
<td mat-cell *matCellDef="let row" [matMenuTriggerFor]="dateMenu"> {{row.timestamp | date:"HH:mm dd/MM/yyyy"}}
<mat-menu #dateMenu>
<button mat-menu-item (click)="filter.addEndTimeToSearch(row.timestamp)">Искать до {{row.timestamp | date:"HH:mm:ss dd/MM/yyyy"}}</button>
<button mat-menu-item (click)="filter.addBeginTimeToSearch(row.timestamp)">Искать после {{row.timestamp | date:"HH:mm:ss dd/MM/yyyy"}}</button>
</mat-menu></td>
</ng-container>
<ng-container matColumnDef="reason">
<th mat-header-cell *matHeaderCellDef> Причина </th>
<td mat-cell *matCellDef="let row"> {{row.ban_reason}}</td>
</ng-container>
<ng-container matColumnDef="admin_name">
<th mat-header-cell *matHeaderCellDef> Модератор </th>
<td mat-cell *matCellDef="let row"> {{row.banned_by}}</td>
</ng-container>
<ng-container matColumnDef="action">
<th mat-header-cell *matHeaderCellDef> Действие </th>
<td mat-cell *matCellDef="let row">
<mat-icon [matMenuTriggerFor]="actionMenu" style="cursor: pointer">view_headline</mat-icon>
<mat-menu #actionMenu>
<button mat-menu-item (click)="openBanDialog(row)">Подробнее</button>
<button mat-menu-item *ngIf="row.active==true&&authService.isModerator()">Разбанить</button>
</mat-menu>
</td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns;" [style]="{'background-color':row.active?'rgba(255,0,0,0.25)':''}"></tr>
<!-- Row shown when there is no matching data. -->
<div *ngIf="!loading">
<tr class="mat-row" *matNoDataRow>
<td class="mat-cell" colspan="4">Бан лист пуст</td>
</tr>
</div>
</table>
<mat-paginator
[pageSizeOptions]="[5, 10, 25, 100]"
[pageSize]="10"
(page)="updateData()"
></mat-paginator>
</div>
<app-banlist-search-table></app-banlist-search-table>
</div>
</div>
</div>

55
src/app/pages/banlist-page/banlist-page.component.ts
View File

@ -16,60 +16,9 @@ import {BanViewDialog} from "../internal-components/dialogs/BanViewDialog";
templateUrl: './banlist-page.component.html',
styleUrls: ['./banlist-page.component.scss']
})
export class BanlistPageComponent extends AbstractSearchTable<Ban, BanSearchFilter>{
export class BanlistPageComponent {
displayedColumns: string[] = ['id', 'player_name', 'date', 'reason', 'admin_name', 'action'];
constructor(public override authService: AuthService,
protected override serverService: ServerService,
protected override playerService: PlayerService,
protected override router: Router,
protected override route: ActivatedRoute,
private banService: BanService,
private dialog: MatDialog) {
super(authService, serverService, playerService, route, router);
super.filter = new BanSearchFilter();
}
private getBanList(): boolean {
this.filter.updated = false;
this.loading = true;
this.banService.getBanList(this.filter, this.paginator).subscribe(
(res) => {
this.dataSource = new MatTableDataSource<Ban>(res.data);
this.err = false;
}, (e) => this.err = true, () => this.loading = false
)
return true;
}
override updateData() {
super.updateData();
this.getBanList();
}
openBanDialog(ban: Ban) {
this.dialog.open(
BanViewDialog, {
data: ban
}
);
}
addAdminIdToSearch(name: string) {
if (this.filter.admin_ids == null)
this.filter.admin_ids = [];
if (this.filter.admin_ids.indexOf(name) == -1)
this.filter.admin_ids.push(name);
this.filter.updated = true;
}
removeAdminIdFromSearch(name: string) {
if (this.filter.admin_ids == null) return;
this.filter.admin_ids = this.filter.admin_ids.filter(v => v !== name);
this.filter.updated = true;
}
getCount() {
return this.paginator?.length;
constructor(public authService: AuthService) {
}
}

168
src/app/pages/banlist-page/banlist-search-table.ts
View File

@ -0,0 +1,168 @@
import {Component} from "@angular/core";
import {AbstractSearchTable} from "../internal-components/abstract-search-table.component";
import {Ban} from "../../entities/ban/Ban";
import {BanSearchFilter} from "../../entities/search/BanSearchFilter";
import {AuthService} from "../../services/auth.service";
import {ServerService} from "../../services/server.service";
import {PlayerService} from "../../services/player.service";
import {ActivatedRoute, Router} from "@angular/router";
import {BanService} from "../../services/ban.service";
import {MatDialog} from "@angular/material/dialog";
import {MatTableDataSource} from "@angular/material/table";
import {BanViewDialog} from "../internal-components/dialogs/BanViewDialog";
@Component({
selector: "app-banlist-search-table",
template: `
<div style="padding-bottom: 10px;">
<mat-chip-list>
<mat-chip [matMenuTriggerFor]="addFilter">Искать по...</mat-chip>
<mat-menu #addFilter>
<button mat-menu-item (click)="filter.addAccountToSearch('')" [disabled]="account_id!=null">Профилю</button>
<button mat-menu-item [matMenuTriggerFor]="timeSelect">Времени</button>
</mat-menu>
<mat-menu #timeSelect>
<button mat-menu-item (click)="filter.addEndTimeToSearch()">До ...</button>
<button mat-menu-item (click)="filter.addBeginTimeToSearch()">После ...</button>
</mat-menu>
<mat-chip *ngIf="filter.updated" (click)="updateData()">Обновить</mat-chip>
<app-filter-mat-chip-account
[filter]="filter"
[hidden]="account_id!=null"
></app-filter-mat-chip-account>
<app-filter-mat-chip-date-begin
[filter]="filter">
</app-filter-mat-chip-date-begin>
<app-filter-mat-chip-date-end
[filter]="filter">
</app-filter-mat-chip-date-end>
<app-filter-mat-chip-banid
[filter]="filter">
</app-filter-mat-chip-banid>
</mat-chip-list>
</div>
<div>
<div class="loading-shade"
*ngIf="loading || err">
<mat-spinner *ngIf="loading"></mat-spinner>
<div class="err" *ngIf="err">
Слишком много запросов или сервер не отвечает, обнови страницу.
<br>
<button mat-button (click)="err=false; loading=false">Закрыть</button>
</div>
</div>
<table mat-table [dataSource]="dataSource" style="width: 100%">
<ng-container matColumnDef="id">
<th mat-header-cell *matHeaderCellDef> ID бана </th>
<td mat-cell *matCellDef="let row" [matMenuTriggerFor]="banIdMenu"> {{row.id}}
<mat-menu #banIdMenu><button mat-menu-item (click)="filter.addBanIdToSearch(row.id)">Искать по ид</button></mat-menu></td>
</ng-container>
<ng-container matColumnDef="player_name">
<th mat-header-cell *matHeaderCellDef> Имя игрока </th>
<td mat-cell *matCellDef="let row" [matMenuTriggerFor]="accountMenu"> {{row.player_name}}
<mat-menu #accountMenu>
<button mat-menu-item (click)="filter.addAccountToSearch(row.player_name)">Добавить в поиск</button>
<button mat-menu-item (click)="authService.searchPlayer(row.account_id)">Открыть профиль</button>
</mat-menu></td>
</ng-container>
<ng-container matColumnDef="date">
<th mat-header-cell *matHeaderCellDef> Время </th>
<td mat-cell *matCellDef="let row" [matMenuTriggerFor]="dateMenu"> {{row.timestamp | date:"HH:mm dd/MM/yyyy"}}
<mat-menu #dateMenu>
<button mat-menu-item (click)="filter.addEndTimeToSearch(row.timestamp)">Искать до {{row.timestamp | date:"HH:mm:ss dd/MM/yyyy"}}</button>
<button mat-menu-item (click)="filter.addBeginTimeToSearch(row.timestamp)">Искать после {{row.timestamp | date:"HH:mm:ss dd/MM/yyyy"}}</button>
</mat-menu></td>
</ng-container>
<ng-container matColumnDef="reason">
<th mat-header-cell *matHeaderCellDef> Причина </th>
<td mat-cell *matCellDef="let row"> {{row.ban_reason}}</td>
</ng-container>
<ng-container matColumnDef="admin_name">
<th mat-header-cell *matHeaderCellDef> Модератор </th>
<td mat-cell *matCellDef="let row"> {{row.banned_by}}</td>
</ng-container>
<ng-container matColumnDef="action">
<th mat-header-cell *matHeaderCellDef> Действие </th>
<td mat-cell *matCellDef="let row">
<mat-icon [matMenuTriggerFor]="actionMenu" style="cursor: pointer">view_headline</mat-icon>
<mat-menu #actionMenu>
<button mat-menu-item (click)="openBanDialog(row)">Подробнее</button>
<button mat-menu-item *ngIf="row.active==true&&authService.isModerator()">Разбанить</button>
</mat-menu>
</td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns;" [style]="{'background-color':row.active?'rgba(255,0,0,0.25)':''}"></tr>
<!-- Row shown when there is no matching data. -->
<div *ngIf="!loading">
<tr class="mat-row" *matNoDataRow>
<td class="mat-cell" colspan="4">Бан лист пуст</td>
</tr>
</div>
</table>
<mat-paginator
[pageSizeOptions]="[5, 10, 25, 100]"
[pageSize]="10"
(page)="updateData()"
></mat-paginator>
</div>
`
})
export class BanlistSearchTable extends AbstractSearchTable<Ban, BanSearchFilter> {
displayedColumns: string[] = ['id', 'player_name', 'date', 'reason', 'admin_name', 'action'];
constructor(public override authService: AuthService,
protected override serverService: ServerService,
protected override playerService: PlayerService,
protected override router: Router,
protected override route: ActivatedRoute,
private banService: BanService,
private dialog: MatDialog) {
super(authService, serverService, playerService, route, router);
super.filter = new BanSearchFilter();
}
private getBanList(): boolean {
this.filter.updated = false;
this.loading = true;
this.banService.getBanList(this.filter, this.paginator).subscribe(
(res) => {
this.dataSource = new MatTableDataSource<Ban>(res.data);
this.err = false;
}, (e) => this.err = true, () => this.loading = false
)
return true;
}
override updateData() {
super.updateData();
this.getBanList();
}
openBanDialog(ban: Ban) {
this.dialog.open(
BanViewDialog, {
data: ban
}
);
}
addAdminIdToSearch(name: string) {
if (this.filter.admin_ids == null)
this.filter.admin_ids = [];
if (this.filter.admin_ids.indexOf(name) == -1)
this.filter.admin_ids.push(name);
this.filter.updated = true;
}
removeAdminIdFromSearch(name: string) {
if (this.filter.admin_ids == null) return;
this.filter.admin_ids = this.filter.admin_ids.filter(v => v !== name);
this.filter.updated = true;
}
}

22
src/app/pages/internal-components/abstract-search-table.component.ts
View File

@ -1,4 +1,4 @@
import {AfterViewInit, Component, ViewChild} from "@angular/core";
import {AfterViewInit, Component, Input, ViewChild} from "@angular/core";
import {MatTableDataSource} from "@angular/material/table";
import {Message} from "../../entities/profile/Message";
import {MatPaginator} from "@angular/material/paginator";
@ -21,6 +21,9 @@ export abstract class AbstractSearchTable<T,U extends SearchFilter> implements A
loading: boolean = false;
err: boolean = false;
@Input("account_id")
//[U:1:%s]
account_id: number | null = null;
protected constructor(public authService: AuthService,
protected serverService: ServerService,
@ -32,15 +35,20 @@ export abstract class AbstractSearchTable<T,U extends SearchFilter> implements A
}
public updateData() {
this.router.navigate([], {
relativeTo: this.route,
queryParams: this.filter.createQuery(this.paginator),
queryParamsHandling: "merge"
})
if (this.account_id == null)
this.router.navigate([], {
relativeTo: this.route,
queryParams: this.filter.createQuery(this.paginator),
queryParamsHandling: "merge"
})
}
ngAfterViewInit(): void {
this.filter.fromQuery(this.route.snapshot.queryParamMap, this.paginator);
if (this.account_id == null)
this.filter.fromQuery(this.route.snapshot.queryParamMap, this.paginator);
else
this.filter.addAccountToSearch(`[U:1:${this.account_id}]`);
this.updateData();
this.serverService.getStats("servers").subscribe(
(res) => {

2
src/app/pages/internal-components/dialogs/BanViewDialog.ts
View File

@ -43,7 +43,7 @@ import {AuthService} from "../../../services/auth.service";
<mat-dialog-actions>
<button mat-button mat-raised-button style="cursor: pointer" (click)="authService.searchPlayer(ban.steam_id);close()">Открыть профиль</button>
<button mat-button mat-raised-button style="cursor: pointer" (click)="authService.searchPlayer(ban.banned_by_id);close()">Профиль модератора</button>
<button mat-button mat-raised-button [disabled]="ban.unbanned_by_id ==null || ban.unbanned_by_id == 'STEAM_0:0:0'">Профиль кто разбанил</button>
<button mat-button mat-raised-button [disabled]="ban.unbanned_by_id ==null || ban.unbanned_by_id == 'STEAM_0:0:0'" (click)="authService.searchPlayer(ban.unbanned_by_id);close()">Профиль кто разбанил</button>
<button mat-button mat-raised-button mat-dialog-close="true">Закрыть</button>
</mat-dialog-actions>
`

146
src/app/pages/messages-page/message-search-table.ts
View File

@ -0,0 +1,146 @@
import {Component} from "@angular/core";
import {AbstractSearchTable} from "../internal-components/abstract-search-table.component";
import {Message} from "../../entities/profile/Message";
import {MessageSearchFilter} from "../../entities/search/MessageSearchFilter";
import {AuthService} from "../../services/auth.service";
import {MessageService} from "../../services/message.service";
import {ServerService} from "../../services/server.service";
import {PlayerService} from "../../services/player.service";
import {ActivatedRoute, Router} from "@angular/router";
import {MatTableDataSource} from "@angular/material/table";
@Component({
selector: 'app-message-search',
styleUrls: ['messages-page.component.scss'],
template: `
<div style="padding-bottom: 10px;">
<mat-chip-list>
<mat-chip [matMenuTriggerFor]="addFilter">Искать по...</mat-chip>
<mat-menu #addFilter>
<button mat-menu-item (click)="filter.addAccountToSearch('')" [disabled]="account_id!=null">Профилю</button>
<button mat-menu-item [matMenuTriggerFor]="timeSelect">Времени</button>
<button mat-menu-item (click)="filter.addServerToSearch()">Серверу</button>
<button mat-menu-item (click)="filter.addMessageToSearch('')">Содержимому</button>
</mat-menu>
<mat-menu #timeSelect>
<button mat-menu-item (click)="filter.addEndTimeToSearch()">До ...</button>
<button mat-menu-item (click)="filter.addBeginTimeToSearch()">После ...</button>
</mat-menu>
<mat-chip *ngIf="filter.updated" (click)="updateData()">Обновить</mat-chip>
<app-filter-mat-chip-account
[filter]="filter"
[hidden]="account_id!=null"
></app-filter-mat-chip-account>
<app-filter-mat-chip-message
[filter]="filter">
</app-filter-mat-chip-message>
<app-filter-mat-chip-server
[filter]="filter"
[serverList]="serverList">
</app-filter-mat-chip-server>
<app-filter-mat-chip-date-begin
[filter]="filter">
</app-filter-mat-chip-date-begin>
<app-filter-mat-chip-date-end
[filter]="filter">
</app-filter-mat-chip-date-end>
</mat-chip-list>
</div>
<div>
<div class="loading-shade"
*ngIf="loading || err">
<mat-spinner *ngIf="loading"></mat-spinner>
<div class="err" *ngIf="err">
Слишком много запросов или сервер не отвечает, обнови страницу.
<br>
<button mat-button (click)="err=false; loading=false">Закрыть</button>
</div>
</div>
<table mat-table [dataSource]="dataSource" style="width: 100%">
<ng-container matColumnDef="account_name">
<th mat-header-cell *matHeaderCellDef> Игрок </th>
<td mat-cell *matCellDef="let row" [matMenuTriggerFor]="accountMenu"> {{row.account_name}}
<mat-menu #accountMenu>
<button mat-menu-item (click)="filter.addAccountToSearch(row.account_name)">Добавить в поиск</button>
<button mat-menu-item (click)="authService.searchPlayer(row.account_id)">Открыть профиль</button>
</mat-menu></td>
</ng-container>
<ng-container matColumnDef="date">
<th mat-header-cell *matHeaderCellDef> Дата </th>
<td mat-cell *matCellDef="let row" [matMenuTriggerFor]="dateMenu"> {{row.utime*1000 | date:"HH:mm:ss dd/MM/yyyy"}}
<mat-menu #dateMenu>
<button mat-menu-item (click)="filter.addEndTimeToSearch(row.utime*1000)">Искать до {{row.utime*1000 | date:"HH:mm:ss dd/MM/yyyy"}}</button>
<button mat-menu-item (click)="filter.addBeginTimeToSearch(row.utime*1000)">Искать после {{row.utime*1000 | date:"HH:mm:ss dd/MM/yyyy"}}</button>
</mat-menu>
</td>
</ng-container>
<ng-container matColumnDef="message">
<th mat-header-cell *matHeaderCellDef> Сообщение </th>
<td mat-cell *matCellDef="let row" [matMenuTriggerFor]="messageMenu"> {{row.message}}
<mat-menu #messageMenu>
<button mat-menu-item (click)="filter.addMessageToSearch(row.message)">Добавить в поиск</button>
</mat-menu></td>
</ng-container>
<ng-container matColumnDef="serverName">
<th mat-header-cell *matHeaderCellDef> Сервер </th>
<td mat-cell *matCellDef="let row" [matMenuTriggerFor]="serverMenu"> {{row.serverName}}
<mat-menu #serverMenu>
<button mat-menu-item (click)="filter.addServerToSearch(row.server_id)">Добавить в поиск</button>
</mat-menu>
</td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
<!-- Row shown when there is no matching data. -->
<div *ngIf="!loading">
<tr class="mat-row" *matNoDataRow>
<td class="mat-cell" colspan="4">Нет сообщений</td>
</tr>
</div>
</table>
<mat-paginator
[pageSizeOptions]="[5, 10, 25, 100]"
[pageSize]="10"
(page)="updateData()"
></mat-paginator>
</div>
`
})
export class MessageSearchTable extends AbstractSearchTable<Message, MessageSearchFilter> {
displayedColumns: string[] = ['account_name', 'date', 'message', 'serverName'];
constructor(public override authService: AuthService,
private messageService: MessageService,
protected override serverService: ServerService,
protected override playerService: PlayerService,
protected override router: Router,
protected override route: ActivatedRoute) {
super(authService, serverService, playerService, route, router);
super.filter = new MessageSearchFilter();
}
private getMessages(): boolean {
this.filter.updated = false;
this.loading = true;
this.messageService.getMessages(this.filter, this.paginator).subscribe(
(res) => {
this.dataSource = new MatTableDataSource<Message>(res.data);
this.err = false;
}, (e) => this.err = true, () => this.loading = false
)
return true;
}
override updateData() {
super.updateData();
this.getMessages();
}
}

110
src/app/pages/messages-page/messages-page.component.html
View File

@ -1,110 +0,0 @@
<div class="content-in-center-header" style="flex-direction: column;">
<h1>Сообщения</h1>
<h3>Все что ты пишешь в чате игре, общедоступное достояние</h3>
</div>
<div class="content-in-center">
<div class="content-in-border">
<app-need-auth-to-continue *ngIf="!authService.isAuth()"></app-need-auth-to-continue>
<div *ngIf="authService.isAuth()">
<div style="padding-bottom: 10px;">
<mat-chip-list>
<mat-chip [matMenuTriggerFor]="addFilter">Искать по...</mat-chip>
<mat-menu #addFilter>
<button mat-menu-item (click)="filter.addAccountToSearch('')">Профилю</button>
<button mat-menu-item [matMenuTriggerFor]="timeSelect">Времени</button>
<button mat-menu-item (click)="filter.addServerToSearch()">Серверу</button>
<button mat-menu-item (click)="filter.addMessageToSearch('')">Содержимому</button>
</mat-menu>
<mat-menu #timeSelect>
<button mat-menu-item (click)="filter.addEndTimeToSearch()">До ...</button>
<button mat-menu-item (click)="filter.addBeginTimeToSearch()">После ...</button>
</mat-menu>
<mat-chip *ngIf="filter.updated" (click)="updateData()">Обновить</mat-chip>
<app-filter-mat-chip-account
[filter]="filter"
></app-filter-mat-chip-account>
<app-filter-mat-chip-message
[filter]="filter">
</app-filter-mat-chip-message>
<app-filter-mat-chip-server
[filter]="filter"
[serverList]="serverList">
</app-filter-mat-chip-server>
<app-filter-mat-chip-date-begin
[filter]="filter">
</app-filter-mat-chip-date-begin>
<app-filter-mat-chip-date-end
[filter]="filter">
</app-filter-mat-chip-date-end>
</mat-chip-list>
</div>
<div>
<div class="loading-shade"
*ngIf="loading || err">
<mat-spinner *ngIf="loading"></mat-spinner>
<div class="err" *ngIf="err">
Слишком много запросов или сервер не отвечает, обнови страницу.
<br>
<button mat-button (click)="err=false; loading=false">Закрыть</button>
</div>
</div>
<table mat-table [dataSource]="dataSource" style="width: 100%">
<ng-container matColumnDef="account_name">
<th mat-header-cell *matHeaderCellDef> Игрок </th>
<td mat-cell *matCellDef="let row" [matMenuTriggerFor]="accountMenu"> {{row.account_name}}
<mat-menu #accountMenu>
<button mat-menu-item (click)="filter.addAccountToSearch(row.account_name)">Добавить в поиск</button>
<button mat-menu-item (click)="authService.searchPlayer(row.account_id)">Открыть профиль</button>
</mat-menu></td>
</ng-container>
<ng-container matColumnDef="date">
<th mat-header-cell *matHeaderCellDef> Дата </th>
<td mat-cell *matCellDef="let row" [matMenuTriggerFor]="dateMenu"> {{row.utime*1000 | date:"HH:mm:ss dd/MM/yyyy"}}
<mat-menu #dateMenu>
<button mat-menu-item (click)="filter.addEndTimeToSearch(row.utime*1000)">Искать до {{row.utime*1000 | date:"HH:mm:ss dd/MM/yyyy"}}</button>
<button mat-menu-item (click)="filter.addBeginTimeToSearch(row.utime*1000)">Искать после {{row.utime*1000 | date:"HH:mm:ss dd/MM/yyyy"}}</button>
</mat-menu>
</td>
</ng-container>
<ng-container matColumnDef="message">
<th mat-header-cell *matHeaderCellDef> Сообщение </th>
<td mat-cell *matCellDef="let row" [matMenuTriggerFor]="messageMenu"> {{row.message}}
<mat-menu #messageMenu>
<button mat-menu-item (click)="filter.addMessageToSearch(row.message)">Добавить в поиск</button>
</mat-menu></td>
</ng-container>
<ng-container matColumnDef="serverName">
<th mat-header-cell *matHeaderCellDef> Сервер </th>
<td mat-cell *matCellDef="let row" [matMenuTriggerFor]="serverMenu"> {{row.serverName}}
<mat-menu #serverMenu>
<button mat-menu-item (click)="filter.addServerToSearch(row.server_id)">Добавить в поиск</button>
</mat-menu>
</td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
<!-- Row shown when there is no matching data. -->
<div *ngIf="!loading">
<tr class="mat-row" *matNoDataRow>
<td class="mat-cell" colspan="4">Нет сообщений</td>
</tr>
</div>
</table>
<mat-paginator
[pageSizeOptions]="[5, 10, 25, 100]"
[pageSize]="10"
(page)="updateData()"
></mat-paginator>
</div>
</div>
</div>
</div>

18
src/app/pages/messages-page/messages-page.component.scss
View File

@ -5,21 +5,3 @@
::ng-deep .mat-form-field-underline {
display: none;
}
.loading-shade {
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
background: rgba(0, 0, 0, 0.15);
z-index: 1;
display: flex;
align-items: center;
justify-content: center;
}
.err {
max-width: 360px;
text-align: center;
}

49
src/app/pages/messages-page/messages-page.component.ts
View File

@ -14,37 +14,24 @@ import {ActivatedRoute, Router} from "@angular/router";
@Component({
selector: 'app-messages-page',
templateUrl: './messages-page.component.html',
styleUrls: ['./messages-page.component.scss']
})
export class MessagesPageComponent extends AbstractSearchTable<Message, MessageSearchFilter> {
displayedColumns: string[] = ['account_name', 'date', 'message', 'serverName'];
constructor(public override authService: AuthService,
private messageService: MessageService,
protected override serverService: ServerService,
protected override playerService: PlayerService,
protected override router: Router,
protected override route: ActivatedRoute) {
super(authService, serverService, playerService, route, router);
super.filter = new MessageSearchFilter();
}
styleUrls: ['./messages-page.component.scss'],
template: `
<div class="content-in-center-header" style="flex-direction: column;">
<h1>Сообщения</h1>
<h3>Все что ты пишешь в чате игре, общедоступное достояние</h3>
</div>
private getMessages(): boolean {
this.filter.updated = false;
this.loading = true;
this.messageService.getMessages(this.filter, this.paginator).subscribe(
(res) => {
this.dataSource = new MatTableDataSource<Message>(res.data);
this.err = false;
}, (e) => this.err = true, () => this.loading = false
)
return true;
}
override updateData() {
super.updateData();
this.getMessages();
<div class="content-in-center">
<div class="content-in-border">
<app-need-auth-to-continue *ngIf="!authService.isAuth()"></app-need-auth-to-continue>
<div *ngIf="authService.isAuth()">
<app-message-search></app-message-search>
</div>
</div>
</div>
`
})
export class MessagesPageComponent {
constructor(public authService: AuthService) {
}
}

38
src/app/pages/profile-page/profile-page.component.html
View File

@ -114,41 +114,13 @@
</mat-list>
</mat-expansion-panel>
<!--История банов-->
<mat-expansion-panel hideToggle (click)="getBanList()">
<mat-expansion-panel hideToggle *ngIf="profile!=null && profile.steamids!=null">
<mat-expansion-panel-header>
<mat-panel-title>
История банов
</mat-panel-title>
</mat-expansion-panel-header>
<mat-progress-bar *ngIf="profile!=null &&profile.ban_list!=null&&profile.ban_list.length==1&&profile.ban_list[0].id == 0" mode="indeterminate"></mat-progress-bar>
<mat-accordion>
<mat-expansion-panel hideToggle *ngFor="let ban of profile.ban_list" expanded>
<mat-expansion-panel-header *ngIf="ban.id!=0">
<mat-panel-title>
{{ban.id==getMaxValue()?ban.ban_reason:ban.ban_utime*1000|date}}
</mat-panel-title>
</mat-expansion-panel-header>
<div *ngIf="ban.id !=getMaxValue()" class="container responsive-grid-100">
<mat-card>
<mat-card-title>#{{ban.id}}</mat-card-title>
<mat-card-subtitle>ид бана</mat-card-subtitle>
</mat-card>
<mat-card>
<mat-card-title>{{ban.ban_reason}}</mat-card-title>
<mat-card-subtitle>причина</mat-card-subtitle>
</mat-card>
<mat-card>
<mat-card-title>{{ban.ban_length>0?ban.ban_length + ' минут':'навсегда мог'}}</mat-card-title>
<mat-card-subtitle>{{ban.ban_length>0?'был':'остаться'}} в бане</mat-card-subtitle>
</mat-card>
<mat-card *ngIf="ban.unbanned_by_id != 'STEAM_0:0:0'">
<mat-card-title>разбанил модератор</mat-card-title>
<mat-card-subtitle>открыть профиль</mat-card-subtitle>
</mat-card>
</div>
<p *ngIf="ban.id==getMaxValue()">Круто у него это получилось</p>
</mat-expansion-panel>
</mat-accordion>
<app-banlist-search-table [account_id]="profile.steamids.account_id"></app-banlist-search-table>
</mat-expansion-panel>
<mat-expansion-panel hideToggle>
@ -171,15 +143,13 @@
<p>Табличку с репортом</p>
</div>
</mat-expansion-panel>
<mat-expansion-panel hideToggle>
<mat-expansion-panel hideToggle *ngIf="profile!=null && profile.steamids!=null">
<mat-expansion-panel-header>
<mat-panel-title>
Сообщения пользователя
</mat-panel-title>
</mat-expansion-panel-header>
<div>
<p>табличку с поиском сообщений</p>
</div>
<app-message-search [account_id]="profile.steamids.account_id"></app-message-search>
</mat-expansion-panel>
<mat-expansion-panel hideToggle>
<mat-expansion-panel-header>

Write Preview
Loading…
Cancel
Save