added clients to server-dashboard #80

This commit is contained in:
Jonas Drescher 2023-02-19 17:45:50 +01:00
parent a2a0056873
commit bf776177d4
12 changed files with 216 additions and 61 deletions

View File

@ -0,0 +1,16 @@
import {Server} from "./server.model";
import {Data} from "./data.model";
export interface Client extends Data {
id?: number;
discordId?: string;
name?: string;
sentMessageCount?: number;
receivedMessageCount?: number;
deletedMessageCount?: number;
receivedCommandCount?: number;
movedUsersCount?: number;
server?: Server;
}

View File

@ -1,6 +1,7 @@
import { Data } from "./data.model";
import { User } from "./user.model";
import { Level } from "./level.model";
import {Data} from "./data.model";
import {User} from "./user.model";
import {Level} from "./level.model";
import {Client} from "./client.model";
export interface Server extends Data {
id?: number;
@ -10,7 +11,7 @@ export interface Server extends Data {
autoRoleCount?: number;
autoRoles?: [];
clientCount?: number;
clients?: [];
clients?: Client[];
levelCount?: number;
levels?: Level[];
userCount?: number;

View File

@ -1,15 +1,4 @@
export class Queries {
static serversListQuery = `
query ServerInfo($filter: ServerFilter, $page: Page, $sort: Sort) {
serverCount
servers(filter: $filter, page: $page, sort: $sort) {
id
name
iconURL
userCount
}
}
`;
static serversQuery = `
query ServerInfo($filter: ServerFilter, $page: Page, $sort: Sort) {
@ -18,6 +7,16 @@ export class Queries {
name
iconURL
userCount
clients{
id
discordId
name
sentMessageCount
receivedMessageCount
deletedMessageCount
receivedCommandCount
movedUsersCount
}
}
}
`;

View File

@ -1,19 +1,19 @@
import { Component, OnInit } from "@angular/core";
import { FormBuilder, FormControl, FormGroup } from "@angular/forms";
import { Router } from "@angular/router";
import { TranslateService } from "@ngx-translate/core";
import { debounceTime, throwError } from "rxjs";
import { ConfirmationDialogService } from "src/app/services/confirmation-dialog/confirmation-dialog.service";
import { DataService } from "src/app/services/data/data.service";
import { SpinnerService } from "src/app/services/spinner/spinner.service";
import { ToastService } from "src/app/services/toast/toast.service";
import { Server, ServerFilter } from "../../../../../models/data/server.model";
import { catchError } from "rxjs/operators";
import { Queries } from "../../../../../models/graphql/queries.model";
import { Page } from "../../../../../models/graphql/filter/page.model";
import { Sort } from "../../../../../models/graphql/filter/sort.model";
import { Query } from "../../../../../models/graphql/query.model";
import { SidebarService } from "../../../../../services/sidebar/sidebar.service";
import {Component, OnInit} from "@angular/core";
import {FormBuilder, FormControl, FormGroup} from "@angular/forms";
import {Router} from "@angular/router";
import {TranslateService} from "@ngx-translate/core";
import {debounceTime, throwError} from "rxjs";
import {ConfirmationDialogService} from "src/app/services/confirmation-dialog/confirmation-dialog.service";
import {DataService} from "src/app/services/data/data.service";
import {SpinnerService} from "src/app/services/spinner/spinner.service";
import {ToastService} from "src/app/services/toast/toast.service";
import {Server, ServerFilter} from "../../../../../models/data/server.model";
import {catchError} from "rxjs/operators";
import {Queries} from "../../../../../models/graphql/queries.model";
import {Page} from "../../../../../models/graphql/filter/page.model";
import {Sort} from "../../../../../models/graphql/filter/sort.model";
import {Query} from "../../../../../models/graphql/query.model";
import {SidebarService} from "../../../../../services/sidebar/sidebar.service";
@Component({
selector: "app-dashboard",
@ -84,7 +84,7 @@ export class DashboardComponent implements OnInit {
loadNextPage() {
this.spinnerService.showSpinner();
this.data.query<Query>(Queries.serversListQuery, {
this.data.query<Query>(Queries.serversQuery, {
filter: this.filter,
page: this.page,
sort: this.sort

View File

@ -0,0 +1,34 @@
<div class="client">
<div class="client-info">
<label class="client-info-header">Id: </label>
<label class="client-info-value">{{client.id}}</label>
</div>
<div class="client-info">
<label class="client-info-header">Discord Id: </label>
<label class="client-info-value">{{client.discordId}}</label>
</div>
<div class="client-info">
<label class="client-info-header">Name: </label>
<label class="client-info-value">{{client.name}}</label>
</div>
<div class="client-info">
<label class="client-info-header">Send Message Count: </label>
<label class="client-info-value">{{client.sentMessageCount}}</label>
</div>
<div class="client-info">
<label class="client-info-header">Received Message Count: </label>
<label class="client-info-value">{{client.receivedMessageCount}}</label>
</div>
<div class="client-info">
<label class="client-info-header">Deleted Message Count: </label>
<label class="client-info-value">{{client.deletedMessageCount}}</label>
</div>
<div class="client-info">
<label class="client-info-header">Received Command Count: </label>
<label class="client-info-value">{{client.receivedCommandCount}}</label>
</div>
<div class="client-info">
<label class="client-info-header">Moved Users Count: </label>
<label class="client-info-value">{{client.movedUsersCount}}</label>
</div>
</div>

View File

@ -0,0 +1,9 @@
////@media screen and (max-width: 1660px) {
// .client {
// //flex-direction: column !important;
// align-content: flex-start !important;
// }
// .client-info {
// margin-bottom: 5%;
// }
//}

View File

@ -0,0 +1,23 @@
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { ClientComponent } from './client.component';
describe('ClientComponent', () => {
let component: ClientComponent;
let fixture: ComponentFixture<ClientComponent>;
beforeEach(async () => {
await TestBed.configureTestingModule({
declarations: [ ClientComponent ]
})
.compileComponents();
fixture = TestBed.createComponent(ClientComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});

View File

@ -0,0 +1,25 @@
import {Component, Input} from '@angular/core';
import {Client} from "../../../../../../models/data/client.model";
@Component({
selector: 'app-client',
templateUrl: './client.component.html',
styleUrls: ['./client.component.scss']
})
export class ClientComponent {
@Input() client: Client = {
createdAt: "", modifiedAt: "",
deletedMessageCount: 0,
discordId: "",
id: 0,
movedUsersCount: 0,
name: "",
receivedCommandCount: 0,
receivedMessageCount: 0,
sentMessageCount: 0,
server: undefined
};
}

View File

@ -27,6 +27,12 @@
{{server.userCount}}
{{'view.dashboard.server.member_count' | translate}}
</div>
<div class="client-data"
*ngFor="let client of server.clients">
<i class="pi pi-discord"></i>
<app-client class="client-component" [client]="client"></app-client>
</div>
</div>
</div>

View File

@ -5,6 +5,7 @@ import { ServerRoutingModule } from './server-routing.module';
import { SharedModule } from '../../shared/shared.module';
import { ProfileComponent } from './profile/profile.component';
import { MembersComponent } from './members/members.component';
import { ClientComponent } from './server-dashboard/components/client/client.component';
@ -12,7 +13,8 @@ import { MembersComponent } from './members/members.component';
declarations: [
ServerDashboardComponent,
ProfileComponent,
MembersComponent
MembersComponent,
ClientComponent
],
imports: [
CommonModule,

View File

@ -258,7 +258,6 @@ header {
padding: 20px;
.logo {
overflow: hidden;
img {
width: 4rem;
@ -270,7 +269,7 @@ header {
.info {
display: flex;
flex-direction: column;
width: 100%;
gap: 10px;
.name {
@ -282,6 +281,41 @@ header {
.data {
}
.client-data {
display: flex;
flex-direction: row;
width: 100%;
.client-component {
width: 100%;
.client {
display: flex;
flex-direction: row;
align-content: stretch !important;
flex-wrap: wrap;
gap: 10px;
.client-info {
display: flex;
flex-direction: column;
margin-left: 2%;
.client-info-header {
margin-bottom: 5px;
white-space: nowrap;
font-weight: bold
}
.client-info-value {
white-space: nowrap;
}
}
}
}
}
}
}
}

6
package-lock.json generated Normal file
View File

@ -0,0 +1,6 @@
{
"name": "kd_discord_bot",
"lockfileVersion": 3,
"requires": true,
"packages": {}
}