Add SQL Dashboard (lazy implementation) (CC-24)

static/src/app/app.component.html

@@ -48,6 +48,9 @@
               <span class="caret"></span>
             </a>
             <ul class="dropdown-menu">
+              <li>
+                <a routerLink="{{config.request}}/{{config.sqlDashboardPath}}">Offene Anträge</a>
+              </li>
               <li>
                 <a routerLink="{{config.request}}/{{config.requestPromotionPath}}">Beförderung</a>
               </li>

static/src/app/app.config.ts

@@ -17,7 +17,6 @@ export class AppConfig {
   public readonly apiSquadPath = this.apiUrl + '/squads/';
   public readonly apiUserPath = this.apiUrl + '/users/';
   public readonly apiWarPath = this.apiUrl + '/wars';
-
 }
 
 export const RouteConfig = {
@@ -34,5 +33,6 @@ export const RouteConfig = {
   requestAwardPath: 'award',
   requestPromotionPath: 'promotion',
   confirmAwardPath: 'confirm-award',
-  confirmPromotionPath: 'confirm-promotion'
+  confirmPromotionPath: 'confirm-promotion',
+  sqlDashboardPath: 'sql-dashboard',
 };

static/src/app/models/model-interfaces.ts

@@ -94,6 +94,7 @@ export interface Promotion {
   oldRankLvl: number;
   newRankLvl: number;
   rejectReason?: string;
+  confirmed?: number;
 }
 
 export interface Decoration {

static/src/app/request/request.module.ts

@@ -8,10 +8,11 @@ import {ConfirmAwardComponent} from './confirm-award/confirm-award.component';
 import {ConfirmPromotionComponent} from './confirm-promotion/confirm-promotion.component';
 import {RequestAwardComponent} from './award/req-award.component';
 import {RequestPromotionComponent} from './promotion/req-promotion.component';
+import {SqlDashboardComponent} from "./sql-dashboard/sql-dashboard.component";
 
 @NgModule({
   declarations: [RequestComponent, RequestPromotionComponent, RequestAwardComponent, ConfirmPromotionComponent,
-    ConfirmAwardComponent, FilterRankPipe],
+    ConfirmAwardComponent, SqlDashboardComponent, FilterRankPipe],
   imports: [CommonModule, SharedModule, requestRouterModule]
 })
 export class RequestModule {

static/src/app/request/request.routing.ts

@@ -8,6 +8,7 @@ import {RequestPromotionComponent} from './promotion/req-promotion.component';
 import {RequestComponent} from './request.component';
 import {RouteConfig} from '../app.config';
 import {LoginGuardHL, LoginGuardSQL} from '../login';
+import {SqlDashboardComponent} from './sql-dashboard/sql-dashboard.component';
 
 
 export const requestRoutes: Routes = [{
@@ -23,6 +24,11 @@ export const requestRoutes: Routes = [{
     component: RequestPromotionComponent,
     canActivate: [LoginGuardSQL]
   },
+  {
+    path: RouteConfig.sqlDashboardPath,
+    component: SqlDashboardComponent,
+    canActivate: [LoginGuardSQL]
+  },
   {
     path: RouteConfig.confirmAwardPath,
     component: ConfirmAwardComponent,
@@ -32,7 +38,7 @@ export const requestRoutes: Routes = [{
     path: RouteConfig.confirmPromotionPath,
     component: ConfirmPromotionComponent,
     canActivate: [LoginGuardHL]
-  }
+  },
 ];
 
 export const requestRouterModule: ModuleWithProviders = RouterModule.forChild(requestRoutes);

static/src/app/request/sql-dashboard/sql-dashboard.component.css

@@ -0,0 +1,33 @@
+.overview {
+  margin-left: 25px !important;
+}
+
+.decoration-preview {
+  padding: 5px;
+}
+
+.trash {
+  cursor: pointer;
+}
+
+.table {
+  overflow-wrap: break-word;
+  table-layout: fixed;
+}
+
+.table-container {
+  margin-top: 40px;
+  overflow-x: auto;
+  width: 90%;
+  min-width: 800px;
+  padding: 5px;
+}
+
+.form-group {
+  width: 25%;
+  min-width: 300px;
+}
+
+h3 {
+  margin: 80px 0 20px -20px;
+}

static/src/app/request/sql-dashboard/sql-dashboard.component.html

@@ -0,0 +1,80 @@
+<form #form="ngForm" class="overview">
+  <h3>SQL Dashboard</h3>
+
+  <div class="table-container">
+    <label>Beförderungsanträge</label>
+    <table class="table table-hover">
+      <thead>
+      <tr>
+        <th class="col-sm-1">Teilnehmer</th>
+        <th class="col-sm-1">Alter Rang</th>
+        <th class="col-sm-1">Neuer Rang</th>
+        <th class="col-sm-1 ">Antragsteller</th>
+        <th class="col-sm-1 text-center">Datum</th>
+      </tr>
+      </thead>
+      <tbody *ngFor="let promotion of promotions">
+      <tr>
+        <td class="table-cell-id">
+          {{promotion.userId.username}}
+        </td>
+        <td *ngFor="let rank of (ranks | rankfilter: promotion.oldRankLvl)">
+          {{rank.name}}
+        </td>
+        <td *ngFor="let rank of (ranks | rankfilter: promotion.newRankLvl)">
+          {{rank.name}}
+        </td>
+        <td>
+          {{promotion.proposer.username}}
+        </td>
+        <td class="text-center">
+          {{promotion.timestamp | date: 'dd.MM.yyyy'}}
+        </td>
+      </tr>
+      </tbody>
+    </table>
+  </div>
+
+  <div class="table-container">
+    <label>Anträge für Orden/ Auszeichnungen</label>
+    <table class="table table-hover">
+      <thead>
+      <tr>
+        <th class="col-sm-1">Teilnehmer</th>
+        <th class="col-sm-1">Bild</th>
+        <th class="col-sm-2">Bezeichnung</th>
+        <th class="col-sm-2">Begründung</th>
+        <th class="col-sm-1 ">Antragsteller</th>
+        <th class="col-sm-1 text-right">Datum</th>
+      </tr>
+      </thead>
+      <tbody *ngFor="let award of awards">
+      <tr>
+        <td class="table-cell-id">
+          {{award.userId.username}}
+        </td>
+        <td class="table-cell-id" *ngIf="award.decorationId.isMedal">
+          <img height="40px" src="resource/decoration/{{award.decorationId._id}}.png">
+        </td>
+        <td class="table-cell-id" *ngIf="!award.decorationId.isMedal">
+          <img width="60px" src="resource/decoration/{{award.decorationId._id}}.png">
+        </td>
+        <td>
+          {{award.decorationId.name}}
+        </td>
+        <td>
+          {{award.reason}}
+        </td>
+        <td>
+          {{award.proposer?.username}}
+        </td>
+        <td class="text-right">
+          {{award.date | date: 'dd.MM.yyyy'}}
+        </td>
+      </tr>
+      </tbody>
+    </table>
+  </div>
+
+
+</form>

static/src/app/request/sql-dashboard/sql-dashboard.component.ts

@@ -0,0 +1,60 @@
+import {Component, OnInit, ViewChild} from '@angular/core';
+import {ActivatedRoute, Router} from '@angular/router';
+import {Promotion, Rank} from '../../models/model-interfaces';
+import {NgForm} from '@angular/forms';
+import {UserService} from '../../services/army-management/user.service';
+import {RankService} from '../../services/army-management/rank.service';
+import {PromotionService} from '../../services/army-management/promotion.service';
+import {LoginService} from '../../services/app-user-service/login-service';
+import {AwardingService} from "../../services/army-management/awarding.service";
+
+
+@Component({
+  templateUrl: './sql-dashboard.component.html',
+  styleUrls: ['./sql-dashboard.component.css', '../../style/overview.css'],
+})
+export class SqlDashboardComponent implements OnInit {
+
+  @ViewChild(NgForm) form: NgForm;
+
+  ranks: Rank[];
+
+  promotions: Promotion[] = [];
+
+  awards = [];
+
+  constructor(private router: Router,
+              private route: ActivatedRoute,
+              private rankService: RankService,
+              private userService: UserService,
+              private promotionService: PromotionService,
+              private awardingService: AwardingService,
+              private loginService: LoginService) {
+  }
+
+  ngOnInit() {
+    const currentUser = this.loginService.getCurrentUser();
+
+    this.promotionService.getSquadPromotions(currentUser.squad._id).subscribe(promotions => {
+      this.promotions = promotions.filter(promotion => promotion.confirmed === 0);
+    });
+
+    this.userService.findUsers('', undefined, currentUser.squad._id).subscribe(users => {
+      users.forEach(user => {
+        this.awardingService.getUserAwardings(user._id).subscribe(awardings => {
+          const unprocessedUserAwardings = awardings.filter(award => award.confirmed === 0);
+          this.awards = this.awards.concat(unprocessedUserAwardings);
+        });
+      });
+    });
+
+    this.rankService.findRanks('', currentUser.squad.fraction).subscribe(ranks => {
+      this.ranks = ranks;
+    });
+  }
+
+  cancel() {
+    this.router.navigate(['..'], {relativeTo: this.route});
+    return false;
+  }
+}