Fixed styling & added game server to profile #130

kdb-web/src/app/models/data/user.model.ts

@@ -3,6 +3,7 @@ import { Level, LevelFilter } from "./level.model";
 import { Server, ServerFilter } from "./server.model";
 import { UserJoinedServer } from "./user_joined_server.model";
 import { UserJoinedVoiceChannel } from "./user_joined_voice_channel.model";
+import { UserJoinedGameServer } from "./user_joined_game_server.model";
 
 export interface User extends Data {
   id?: number;
@@ -22,7 +23,7 @@ export interface User extends Data {
   joinedVoiceChannels?: UserJoinedVoiceChannel[];
 
   userJoinedGameServerCount?: number;
-  userJoinedGameServers?: [];
+  userJoinedGameServers?: UserJoinedGameServer[];
 }
 
 export interface UserFilter {

kdb-web/src/app/models/data/user_joined_game_server.model.ts

@@ -0,0 +1,11 @@
+import { Data } from "./data.model";
+import { User } from "./user.model";
+
+export interface UserJoinedGameServer extends Data {
+  id: number;
+  gameServer: string;
+  user: User;
+  time: number;
+  joinedOn: string;
+  leavedOn: string;
+}

kdb-web/src/app/models/graphql/queries.model.ts

@@ -122,6 +122,7 @@ export class Queries {
         userJoinedGameServers {
           id
           gameServer
+          time
           joinedOn
           leavedOn
         }

kdb-web/src/app/modules/admin/auth-users/components/auth-user/auth-user.component.html

@@ -224,7 +224,7 @@
 
       <ng-template pTemplate="emptymessage">
         <tr>
-          <td colspan="7">{{'admin.auth_users.no_entries_found' | translate}}</td>
+          <td colspan="9">{{'admin.auth_users.no_entries_found' | translate}}</td>
         </tr>
       </ng-template>
 

kdb-web/src/app/modules/shared/shared.module.ts

@@ -19,6 +19,7 @@ import { AuthRolePipe } from './pipes/auth-role.pipe';
 import { IpAddressPipe } from './pipes/ip-address.pipe';
 import { BoolPipe } from './pipes/bool.pipe';
 import { PanelMenuModule } from 'primeng/panelmenu';
+import { PanelModule } from "primeng/panel";
 
 
 
@@ -47,6 +48,7 @@ import { PanelMenuModule } from 'primeng/panelmenu';
     TranslateModule,
     DynamicDialogModule,
     PanelMenuModule,
+    PanelModule,
   ],
   exports: [
     ButtonModule,
@@ -66,6 +68,7 @@ import { PanelMenuModule } from 'primeng/panelmenu';
     TranslateModule,
     DynamicDialogModule,
     PanelMenuModule,
+    PanelModule,
     AuthRolePipe,
     IpAddressPipe,
     BoolPipe,

kdb-web/src/app/modules/view/server/members/members.component.html

@@ -238,7 +238,7 @@
       <ng-template pTemplate="emptymessage">
         <tr></tr>
         <tr>
-          <td colspan="7">{{'view.server.members.no_entries_found' | translate}}</td>
+          <td colspan="10">{{'view.server.members.no_entries_found' | translate}}</td>
         </tr>
         <tr></tr>
       </ng-template>

kdb-web/src/app/modules/view/server/profile/profile.component.html

@@ -77,51 +77,73 @@
     </div>
 
     <div class="content-divider"></div>
-    <div class="content-row">
-      <h3>{{'view.server.profile.joined_voice_channel.header' | translate}}</h3>
-    </div>
 
-    <div *ngFor="let join of user.joinedVoiceChannels;">
-      <div class="content-row">
-        <div class="content-column">
-          <div class="content-data-name">{{'view.server.profile.joined_voice_channel.time' | translate}}:</div>
-          <div class="content-data-value">{{join.time}} {{'general.hours' | translate}}</div>
-        </div>
+    <p-panel header="{{'view.server.profile.joined_voice_channel.header' | translate}}" [toggleable]="true">
+      <div *ngFor="let join of user.joinedVoiceChannels;">
+        <div class="content-row">
+          <div class="content-column">
+            <div class="content-data-name">{{'view.server.profile.joined_voice_channel.time' | translate}}:</div>
+            <div class="content-data-value">{{join.time}} {{'general.hours' | translate}}</div>
+          </div>
 
-        <div class="content-column">
-          <div class="content-data-name">{{'view.server.profile.joined_voice_channel.channel' | translate}}:</div>
-          <div class="content-data-value">{{join.channelName}}</div>
-        </div>
+          <div class="content-column">
+            <div class="content-data-name">{{'view.server.profile.joined_voice_channel.channel' | translate}}:</div>
+            <div class="content-data-value">{{join.channelName}}</div>
+          </div>
 
-        <div class="content-column">
-          <div class="content-data-name">{{'view.server.profile.joined_voice_channel.joined_at' | translate}}:</div>
-          <div class="content-data-value">{{join.joinedOn | date:'dd.MM.yyyy HH:mm:ss'}}</div>
-        </div>
+          <div class="content-column">
+            <div class="content-data-name">{{'common.joined_at' | translate}}:</div>
+            <div class="content-data-value">{{join.joinedOn | date:'dd.MM.yyyy HH:mm:ss'}}</div>
+          </div>
 
-        <div class="content-column">
-          <div class="content-data-name">{{'view.server.profile.joined_voice_channel.leaved_at' | translate}}:</div>
-          <div class="content-data-value">{{join.leavedOn | date:'dd.MM.yyyy HH:mm:ss'}}</div>
+          <div class="content-column">
+            <div class="content-data-name">{{'common.leaved_at' | translate}}:</div>
+            <div class="content-data-value">{{join.leavedOn | date:'dd.MM.yyyy HH:mm:ss'}}</div>
+          </div>
         </div>
       </div>
-    </div>
 
-    <div class="content-divider"></div>
-    <div class="content-row">
-      <h3>{{'view.server.profile.joined_server.header' | translate}}</h3>
-    </div>
+    </p-panel>
+    <p-panel header="{{'view.server.profile.joined_game_server.header' | translate}}" [toggleable]="true">
+      <div *ngFor="let join of user.userJoinedGameServers;">
+        <div class="content-row">
+          <div class="content-column">
+            <div class="content-data-name">{{'view.server.profile.joined_game_server.time' | translate}}:</div>
+            <div class="content-data-value">{{join.time}} {{'general.hours' | translate}}</div>
+          </div>
 
-    <div *ngFor="let join of user.joinedServers;">
-      <div class="content-row">
-        <div class="content-column">
-          <div class="content-data-name">{{'view.server.profile.joined_server.joined_at' | translate}}:</div>
-          <div class="content-data-value">{{join.joinedOn | date:'dd.MM.yyyy HH:mm:ss'}}</div>
-        </div>
+          <div class="content-column">
+            <div class="content-data-name">{{'view.server.profile.joined_game_server.name' | translate}}:</div>
+            <div class="content-data-value">{{join.gameServer}}</div>
+          </div>
 
-        <div class="content-column">
-          <div class="content-data-name">{{'view.server.profile.joined_server.leaved_at' | translate}}:</div>
-          <div class="content-data-value">{{join.leavedOn | date:'dd.MM.yyyy HH:mm:ss'}}</div>
+          <div class="content-column">
+            <div class="content-data-name">{{'common.joined_at' | translate}}:</div>
+            <div class="content-data-value">{{join.joinedOn | date:'dd.MM.yyyy HH:mm:ss'}}</div>
+          </div>
+
+          <div class="content-column">
+            <div class="content-data-name">{{'common.leaved_at' | translate}}:</div>
+            <div class="content-data-value">{{join.leavedOn | date:'dd.MM.yyyy HH:mm:ss'}}</div>
+          </div>
         </div>
       </div>
-    </div>
+    </p-panel>
+
+    <p-panel header="{{'view.server.profile.joined_server.header' | translate}}" [toggleable]="true">
+      <div *ngFor="let join of user.joinedServers;">
+        <div class="content-row">
+          <div class="content-column">
+            <div class="content-data-name">{{'common.joined_at' | translate}}:</div>
+            <div class="content-data-value">{{join.joinedOn | date:'dd.MM.yyyy HH:mm:ss'}}</div>
+          </div>
+
+          <div class="content-column">
+            <div class="content-data-name">{{'common.leaved_at' | translate}}:</div>
+            <div class="content-data-value">{{join.leavedOn | date:'dd.MM.yyyy HH:mm:ss'}}</div>
+          </div>
+        </div>
+      </div>
+    </p-panel>
   </div>
 </div>

kdb-web/src/assets/i18n/de.json

@@ -173,15 +173,16 @@
         "joined_voice_channel": {
           "header": "Sprachkanal-beitritte",
           "time": "Zeit",
-          "channel": "Sprachkanal",
-          "joined_at": "Beigetreten am",
-          "leaved_at": "Verlassen am"
+          "channel": "Sprachkanal"
+        },
+        "joined_game_server": {
+          "header": "Gameserver-beitritte",
+          "time": "Spielzeit",
+          "name": "Gameserver"
         },
         "joined_server": {
           "header": "Server-beitritte",
-          "time": "Zeit",
-          "joined_at": "Beigetreten am",
-          "leaved_at": "Verlassen am"
+          "time": "Zeit"
         },
         "permission_denied": "Zugriff Verweigert!",
         "permission_denied_d": "Du musst Moderator sein, um andere Profile sehen zu können!"
@@ -264,6 +265,8 @@
   "common": {
     "created_at": "Erstellt am",
     "modified_at": "Bearbeitet am",
+    "joined_at": "Beigetreten am",
+    "leaved_at": "Verlassen am",
     "bool_as_string": {
       "true": "Ja",
       "false": "Nein"

kdb-web/src/styles.scss

@@ -152,6 +152,10 @@ header {
             margin: 5px 0;
           }
 
+          p-panel {
+            margin: 5px 0;
+          }
+
           .content-input-field {
             width: 50% !important;
             margin: 0 !important;