Als Nutzer des WI möchte ich nicht, dass Tabellen mit vielen Daten so lange laden #300 #312

Merged
edraft merged 4 commits from #300 into support 2023-04-14 23:25:40 +02:00
11 changed files with 83 additions and 26 deletions
Showing only changes of commit 1ebad89c97 - Show all commits

View File

@ -1,6 +1,6 @@
{
"name": "kdb-web",
"version": "1.0.5",
"version": "1.0.dev307",
"scripts": {
"ng": "ng",
"update-version": "ts-node-esm update-version.ts",

View File

@ -23,17 +23,6 @@ export interface User extends DataWithHistory {
userJoinedGameServerCount?: number;
userJoinedGameServers?: UserJoinedGameServer[];
// history?: UserHistory[];
}
export interface UserHistory extends History {
id?: number;
discordId?: number;
xp?: number;
level?: number;
server?: number;
leftServer?: boolean;
}
export interface UserFilter {

View File

@ -94,6 +94,29 @@ export class Queries {
name
}
leftServer
createdAt
modifiedAt
}
}
}
`;
static userProfile = `
query UserProfile($serverId: ID, $userId: ID, $page: Page, $sort: Sort) {
servers(filter: {id: $serverId}) {
userCount
users(filter: {id: $userId}, page: $page, sort: $sort) {
id
discordId
name
xp
ontime
level {
id
name
}
leftServer
server {
id
name
@ -124,9 +147,17 @@ export class Queries {
joinedOn
leavedOn
}
}
}
}
`;
createdAt
modifiedAt
static userQueryWithHistory = `
query UsersWithHistory($serverId: ID, $userId: ID) {
servers(filter: {id: $serverId}) {
userCount
users(filter: {id: $userId}) {
id
history {
id

View File

@ -1,5 +1,16 @@
import { Component, Input, OnInit } from "@angular/core";
import { History } from "../../../../models/data/data.model";
import { UserListQuery } from "../../../../models/graphql/query.model";
import { Server } from "../../../../models/data/server.model";
import { DataService } from "../../../../services/data/data.service";
import { AuthService } from "../../../../services/auth/auth.service";
import { SpinnerService } from "../../../../services/spinner/spinner.service";
import { ToastService } from "../../../../services/toast/toast.service";
import { ConfirmationDialogService } from "../../../../services/confirmation-dialog/confirmation-dialog.service";
import { FormBuilder } from "@angular/forms";
import { TranslateService } from "@ngx-translate/core";
import { ActivatedRoute } from "@angular/router";
import { SidebarService } from "../../../../services/sidebar/sidebar.service";
@Component({
selector: "app-history-btn",
@ -8,19 +19,46 @@ import { History } from "../../../../models/data/data.model";
})
export class HistoryBtnComponent implements OnInit {
@Input() history: History[] = [];
@Input() id: number = 0;
@Input() query: string = "";
@Input() translationKey: string = "";
public showSidebar: boolean = false;
public history: History[] = [];
public constructor() {
public showSidebar: boolean = false;
private server: Server = {};
public constructor(
private authService: AuthService,
private spinner: SpinnerService,
private toastService: ToastService,
private confirmDialog: ConfirmationDialogService,
private fb: FormBuilder,
private translate: TranslateService,
private data: DataService,
private route: ActivatedRoute,
private sidebar: SidebarService
) {
}
public ngOnInit(): void {
this.server = this.sidebar.server$.value ?? {};
}
public openHistory(): void {
this.showSidebar = true;
this.data.query<UserListQuery>(this.query, {
serverId: this.server.id, userId: this.id
},
(x: { servers: Server[] }) => {
return x.servers[0];
}
).subscribe(data => {
this.history = data.users[0].history ?? [];
this.spinner.hideSpinner();
});
let oldHistory: Partial<History> = {};
for (const history of this.history) {
const attributes = Object.keys(history).map((key) => {

View File

@ -160,7 +160,7 @@
<td>
<div class="btn-wrapper">
<app-history-btn *ngIf="!isEditingNew" [history] ="autoRoleRule.history" translationKey="view.server.auto_roles.rules.header"></app-history-btn>
<app-history-btn *ngIf="!isEditingNew" [id] ="autoRoleRule.history" translationKey="view.server.auto_roles.rules.header"></app-history-btn>
<button *ngIf="!editing" pButton pInitEditableRow class="btn icon-btn" icon="pi pi-pencil" (click)="onRowEditInit(dt, autoRoleRule, ri)"></button>
<button *ngIf="!editing" pButton class="btn icon-btn danger-icon-btn" icon="pi pi-trash"
(click)="deleteAutoRoleRule(autoRoleRule)"></button>

View File

@ -193,7 +193,7 @@
<div class="btn-wrapper">
<!-- <button *ngIf="!editing" pButton pInitEditableRow class="btn icon-btn" icon="pi pi-pencil"-->
<!-- (click)="onRowEditInit(dt, autoRole, ri)"></button>-->
<app-history-btn *ngIf="!isEditingNew" [history] ="autoRole.history" translationKey="view.server.auto_roles.header"></app-history-btn>
<app-history-btn *ngIf="!isEditingNew" [id] ="autoRole.history" translationKey="view.server.auto_roles.header"></app-history-btn>
<button *ngIf="!editing" pButton pInitEditableRow class="btn icon-btn" icon="pi pi-sliders-h" [routerLink]="[autoRole.id, 'rules']"></button>
<button *ngIf="!editing" pButton class="btn icon-btn danger-icon-btn" icon="pi pi-trash"
(click)="deleteAutoRole(autoRole)"></button>

View File

@ -184,7 +184,7 @@
</td>
<td>
<div class="btn-wrapper">
<app-history-btn *ngIf="!isEditingNew" [history] ="level.history" translationKey="view.server.levels.header"></app-history-btn>
<app-history-btn *ngIf="!isEditingNew" [id] ="level.history" translationKey="view.server.levels.header"></app-history-btn>
<button *ngIf="!editing" pButton pInitEditableRow class="btn icon-btn" icon="pi pi-pencil"
(click)="onRowEditInit(dt, level, ri)" [disabled]="!user || user.isModerator && !user.isAdmin"></button>
<button *ngIf="!editing" pButton class="btn icon-btn danger-icon-btn" icon="pi pi-trash"

View File

@ -224,7 +224,7 @@
</td>
<td>
<div class="btn-wrapper">
<app-history-btn *ngIf="!isEditingNew" [history] ="member.history" translationKey="view.server.members.header"></app-history-btn>
<app-history-btn *ngIf="!isEditingNew" [id]="member.id" [query]="query" translationKey="view.server.members.header"></app-history-btn>
<button *ngIf="!editing" pButton pInitEditableRow class="btn icon-btn" icon="pi pi-pencil"
(click)="onRowEditInit(dt, member, ri)"></button>
<button *ngIf="!editing" pButton pInitEditableRow class="btn icon-btn" icon="pi pi-user"

View File

@ -81,6 +81,7 @@ export class MembersComponent implements OnInit, OnDestroy {
totalRecords!: number;
private unsubscriber = new Subject<void>();
private server: Server = {};
query = Queries.userQueryWithHistory;
constructor(
private authService: AuthService,

View File

@ -55,11 +55,9 @@ export class ProfileComponent implements OnInit, OnDestroy {
return;
}
this.data.query<UserListQuery>(Queries.usersQuery, {
this.data.query<UserListQuery>(Queries.userProfile, {
serverId: this.server.id,
filter: {
id: params["memberId"]
}
userId: params["memberId"]
},
(x: { servers: Server[] }) => {
return x.servers[0];

View File

@ -5,7 +5,7 @@
"WebVersion": {
"Major": "1",
"Minor": "0",
"Micro": "5"
"Micro": "dev307"
},
"Themes": [
{