Add campaign submit form

static/src/app/statistic/campaign-submit/campaign-submit.component.css

@@ -0,0 +1,8 @@
+.overview {
+  position: fixed;
+  width: 25%;
+  min-width: 300px;
+  padding-left: 50px;
+  padding-top: 70px;
+  margin-left: 10px;
+}

static/src/app/statistic/campaign-submit/campaign-submit.component.html

@@ -0,0 +1,33 @@
+<form #form="ngForm" class="overview">
+  <h3>Kampagne hinzufügen</h3>
+
+  <div class="form-group">
+    <label for="title">Titel</label>
+    <input type="text" class="form-control"
+           [(ngModel)]="campaign.title"
+           name="title"
+           id="title"
+           required maxlength="50"/>
+
+    <show-error text="Name" path="title"></show-error>
+  </div>
+
+  <button id="cancel"
+          (click)="cancel()"
+          class="btn btn-default">
+    Abbrechen
+  </button>
+
+  <button id="save"
+          (click)="saveCampaign()"
+          class="btn btn-default"
+          [disabled]="!form.valid">
+    Bestätigen
+  </button>
+
+  <span *ngIf="showErrorLabel"
+        class="center-block label label-danger" style="font-size: medium; padding: 2px; margin-top: 2px">
+        {{error}}
+      </span>
+
+</form>

static/src/app/statistic/campaign-submit/campaign-submit.component.ts

@@ -0,0 +1,44 @@
+import {Component, ViewChild} from "@angular/core";
+import {ActivatedRoute, Router} from "@angular/router";
+import {NgForm} from "@angular/forms";
+import {Campaign} from "../../models/model-interfaces";
+import {CampaignService} from "../../services/campaign-service/campaign.service";
+
+
+@Component({
+  selector: 'campaign-submit',
+  templateUrl: './campaign-submit.component.html',
+  styleUrls: ['./campaign-submit.component.css']
+})
+export class CampaignSubmitComponent {
+
+  campaign: Campaign = {};
+
+  showErrorLabel = false;
+
+  error;
+
+  @ViewChild(NgForm) form: NgForm;
+
+  constructor(private route: ActivatedRoute,
+              private router: Router,
+              private campaignService: CampaignService) {
+  }
+
+  saveCampaign() {
+    this.campaignService.submitCampaign(this.campaign)
+      .subscribe(campaign => {
+          this.router.navigate(['../overview/' + campaign._id], {relativeTo: this.route});
+        },
+        error => {
+          this.error = error._body.error.message;
+          this.showErrorLabel = true;
+        });
+  }
+
+  cancel() {
+    this.router.navigate(['..'], {relativeTo: this.route});
+    return false;
+  }
+
+}

static/src/app/statistic/stats.routing.ts

@@ -6,6 +6,7 @@ import {WarListComponent} from "./war-list/war-list.component";
 import {StatisticOverviewComponent} from "./overview/stats-overview.component";
 import {WarItemComponent} from "./war-list/war-item.component";
 import {ModuleWithProviders} from "@angular/core";
+import {CampaignSubmitComponent} from "./campaign-submit/campaign-submit.component";
 
 
 export const statsRoutes: Routes = [{
@@ -22,6 +23,11 @@ export const statsRoutes: Routes = [{
     component: StatisticOverviewComponent,
     outlet: 'right'
   },
+  {
+    path: 'new-campaign',
+    component: CampaignSubmitComponent,
+    outlet: 'right'
+  },
   {
     path: 'new',
     component: WarSubmitComponent,
@@ -35,6 +41,6 @@ export const statsRoutes: Routes = [{
 
 export const statsRouterModule: ModuleWithProviders = RouterModule.forChild(statsRoutes);
 
-export const statsRoutingComponents = [StatisticComponent, StatisticOverviewComponent, WarListComponent,
-  WarSubmitComponent, WarDetailComponent, WarItemComponent];
+export const statsRoutingComponents = [StatisticComponent, StatisticOverviewComponent, CampaignSubmitComponent,
+  WarListComponent, WarSubmitComponent, WarDetailComponent, WarItemComponent];
 

static/src/app/statistic/war-list/war-list.component.ts

@@ -31,6 +31,11 @@ export class WarListComponent implements OnInit {
     });
   }
 
+  selectNewCampaign() {
+    this.selectedWarId = null;
+    this.router.navigate([{outlets: {'right': ['new-campaign']}}], {relativeTo: this.route});
+  }
+
   selectNewWar() {
     this.selectedWarId = null;
     this.router.navigate([{outlets: {'right': ['new']}}], {relativeTo: this.route});

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

@@ -6,24 +6,3 @@
   padding-top: 70px;
   margin-left: 10px;
 }
-
-.load-arrow {
-  background: url(../../../assets/loading.png) no-repeat;
-  display: block;
-  width: 120px;
-  height: 120px;
-}
-
-/* Loading Animation */
-.glyphicon-refresh-animate {
-  animation: spin 1.5s linear infinite;
-}
-
-@keyframes spin {
-  0% {
-    transform: rotate(0deg);
-  }
-  100% {
-    transform: rotate(360deg);
-  }
-}