Add CSV download button FE

api/apib/base/access.apib

@@ -18,7 +18,6 @@ So if your server is reachable at `https://cc.myserver.lan` the API endpoint is
 https://cc.myserver.lan/api/
 ```
 
-
 ## Authentication
 
 Requests to most of the API endpoints have to be authenticated using an API token which is received after successfully providing your application credentials to the API.

static/src/app/statistic/war-detail/war-detail.component.css

@@ -10,6 +10,16 @@
   margin-bottom: 10px;
 }
 
+
+form.tab-control {
+  padding: 10px;
+}
+
+span.tab-control {
+  margin: 4px 67px;
+  padding: 4px 16px;
+}
+
 .war-header {
   border-bottom: thin solid lightgrey;
 }
@@ -34,6 +44,10 @@
   color: #f5f5f5;
 }
 
+.nav-tabs > li:last-child {
+  margin-left: 70px;
+}
+
 .nav-link {
   cursor: pointer !important;
   color: #FFF !important;

static/src/app/statistic/war-detail/war-detail.component.html

@@ -24,29 +24,9 @@
     </div>
 
     <div class="pull-left " style="padding-left: 100px; padding-top:15px">
-      <a class="btn btn-default" style="margin: 20px" target="_blank" href="resource/logs/{{war._id}}/clean.log">Logfile
+      <a class="btn btn-default" style="margin: 20px" target="_blank" href="resource/logs/{{war._id}}/clean.log">
-        anzeigen</a>
+        Logfile anzeigen
-      <form class="form-group" *ngIf="tab === 0">
+      </a>
-        <label class="radio-inline">
-          <input type="radio" name="fractSelect"
-                 [checked]="(fractionFilterSelected == undefined) ? 'true' : 'false'"
-                 [(ngModel)]="fractionFilterSelected"
-                 (change)="filterPlayersByFraction()">Alle
-        </label>
-        <label class="radio-inline">
-          <input type="radio" name="fractSelect" value="BLUFOR"
-                 [(ngModel)]="fractionFilterSelected"
-                 #fractRadioBufor
-                 (change)="filterPlayersByFraction(fractRadioBufor.value)">{{fraction.BLUFOR}}
-        </label>
-        <label class="radio-inline">
-          <input type="radio" name="fractSelect" value="OPFOR"
-                 [(ngModel)]="fractionFilterSelected"
-                 #fractRadioOpfor
-                 (change)="filterPlayersByFraction(fractRadioOpfor.value)">{{fraction.OPFOR}}
-        </label>
-        <br>
-      </form>
     </div>
   </div>
 
@@ -60,6 +40,33 @@
     <li class="nav-item" [ngClass]="{active :tab === 2, deactivated :tab !== 2} ">
       <a class="nav-link"><img src="../../../assets/player-stats-btn.png"> Player</a>
     </li>
+    <li>
+      <div *ngIf="tab === 0">
+        <form class="pull-left tab-control">
+          <label class="radio-inline">
+            <input type="radio" name="fractSelect"
+                   [checked]="(fractionFilterSelected == undefined) ? 'true' : 'false'"
+                   [(ngModel)]="fractionFilterSelected"
+                   (change)="filterPlayersByFraction()">Alle
+          </label>
+          <label class="radio-inline">
+            <input type="radio" name="fractSelect" value="BLUFOR"
+                   [(ngModel)]="fractionFilterSelected"
+                   #fractRadioBufor
+                   (change)="filterPlayersByFraction(fractRadioBufor.value)">{{fraction.BLUFOR}}
+          </label>
+          <label class="radio-inline">
+            <input type="radio" name="fractSelect" value="OPFOR"
+                   [(ngModel)]="fractionFilterSelected"
+                   #fractRadioOpfor
+                   (change)="filterPlayersByFraction(fractRadioOpfor.value)">{{fraction.OPFOR}}
+          </label>
+        </form>
+        <span class="btn btn-default pull-left tab-control">
+          Download CSV
+        </span>
+      </div>
+    </li>
   </ul>
 
   <!--Sub-Components (=TABS)-->