Add edit profile page

api/models/app-user.js

@@ -9,6 +9,10 @@ const AppUserSchema = new Schema({
     required: true,
     unique: true
   },
+  display_name: {
+    type: String,
+    required: true
+  },
   password: {
     type: String,
     required: true

api/routes/authenticate.js

@@ -8,9 +8,6 @@ const Q = require('q');
 const _ = require('lodash');
 const logger = require('debug')('cc:authenticate');
 
-const apiAuthenticationMiddleware = require('../middleware/auth-middleware');
-const checkAdmin = require('../middleware/permission-check').checkAdmin;
-
 // HTTP status codes by name
 const codes = require('./http-codes');
 
@@ -60,6 +57,7 @@ let authCheck = (username, password, res) => {
       deferred.resolve({
         _id: user._id,
         username: user.username,
+        display_name: user.display_name,
         permission: user.permission,
         squad: user.squad,
         token: jwt.sign({sub: user._id}, config.secret, {expiresIn: diff * 60}),
@@ -115,6 +113,7 @@ let create = (userParam) => {
     // add hashed password to user object
     user.password = bcrypt.hashSync(userParam.password, 10);
     user.username = user.username.toLowerCase();
+    user.display_name = user.username;
 
     const newUser = new AppUserModel(user);
     newUser.save((err, doc) => {

static/src/app/app.component.html

@@ -77,6 +77,9 @@
           <li *ngIf="loginService.hasPermission(4)" routerLinkActive="active">
             <a routerLink='{{config.adminPanelPath}}' class="link">Admin Panel</a>
           </li>
+          <li *ngIf="loginService.isLoggedIn()" class="link" style="cursor: pointer">
+            <a routerLink="{{config.editProfilePath}}">{{loginService.getCurrentUser().display_name}}</a>
+          </li>
           <li *ngIf="loginService.isLoggedIn()" class="link" style="cursor: pointer">
             <a (click)="logout()">Abmelden</a>
           </li>

static/src/app/app.config.ts

@@ -31,5 +31,6 @@ export const RouteConfig = {
   requestAwardPath: 'award',
   requestPromotionPath: 'promotion',
   confirmAwardPath: 'confirm-award',
-  confirmPromotionPath: 'confirm-promotion'
+  confirmPromotionPath: 'confirm-promotion',
+  editProfilePath: 'edit-profile'
 }

static/src/app/app.routing.ts

@@ -23,6 +23,10 @@ export const appRoutes: Routes = [
     path: RouteConfig.loginPath,
     component: LoginComponent
   },
+  {
+    path: RouteConfig.editProfilePath,
+    loadChildren: './profile/edit-profile.module#EditProfileModule'
+  },
   {
     path: RouteConfig.signUpPath,
     component: SignupComponent

static/src/app/models/app-validators.ts

@@ -1,114 +0,0 @@
-import {Directive, forwardRef} from '@angular/core';
-import {AbstractControl, FormControl, NG_ASYNC_VALIDATORS, NG_VALIDATORS} from '@angular/forms';
-import {UserService} from "../services/user-service/user.service";
-
-export function asyncIfNotBacklogThenAssignee(control): Promise<any> {
-  const promise = new Promise((resolve, reject) => {
-    setTimeout(() => {
-      resolve(ifNotBacklogThanAssignee(control));
-    }, 500);
-  });
-  return promise;
-}
-
-export function ifNotBacklogThanAssignee(formGroup: FormControl): { [key: string]: any } {
-  const nameControl = formGroup.get('assignee.name');
-  const stateControl = formGroup.get('state');
-  if (!nameControl || !stateControl) {
-    return null;
-  }
-  if (stateControl.value !== 'BACKLOG' &&
-    (!nameControl.value || nameControl.value === '')) {
-    return {'assigneeRequired': true};
-  }
-  return null;
-}
-
-@Directive({
-  selector: '[ifNotBacklogThanAssignee]',
-  providers: [
-    {
-      provide: NG_VALIDATORS,
-      useExisting: IfNotBacklogThanAssigneeValidatorDirective, multi: true
-    }]
-})
-export class IfNotBacklogThanAssigneeValidatorDirective {
-
-  public validate(formGroup: AbstractControl): { [key: string]: any } {
-    const nameControl = formGroup.get('assignee.name');
-    const stateControl = formGroup.get('state');
-    if (!nameControl || !stateControl) {
-      return null;
-    }
-    if (stateControl.value !== 'BACKLOG' &&
-      (!nameControl.value || nameControl.value === '')) {
-      return {'assigneeRequired': true};
-    }
-    return null;
-  }
-}
-
-@Directive({
-  selector: '[emailValidator]',
-  providers: [{
-    provide: NG_VALIDATORS,
-    useExisting: EmailValidatorDirective, multi: true
-  }]
-})
-export class EmailValidatorDirective {
-  validate(control: AbstractControl): { [key: string]: any } {
-    const re = /^([\w-]+(?:\.[\w-]+)*)@((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$/i;
-    if (!control.value || control.value === '' || re.test(control.value)) {
-      return null;
-    } else {
-      return {'invalidEMail': true};
-    }
-  }
-}
-
-export function emailValidator(control): { [key: string]: any } {
-  return new EmailValidatorDirective().validate(control);
-}
-
-export function emailValidator2(control): { [key: string]: any } {
-  const re = /^([\w-]+(?:\.[\w-]+)*)@((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$/i;
-  if (!control.value || control.value === '' || re.test(control.value)) {
-    return null;
-  } else {
-    return {'invalidEMail': true};
-  }
-}
-
-@Directive({
-  selector: '[pjmUserExistsValidator]',
-  providers: [
-    {
-      provide: NG_ASYNC_VALIDATORS,
-      useExisting: forwardRef(() => UserExistsValidatorDirective), multi: true
-    }
-  ]
-})
-export class UserExistsValidatorDirective {
-  constructor(private userService: UserService) {
-  }
-
-  // validate(control: AbstractControl): Observable<any> {
-  //   return this.userService.checkUserExists(control.value)
-  //     .map(userExists => {
-  //       return (userExists === false) ? {userNotFound: true} : null;
-  //     });
-  // }
-}
-
-@Directive({
-  selector: '[emailValidator]',
-  providers: [
-    {provide: NG_VALIDATORS, useValue: emailValidator, multi: true}
-  ]
-})
-export class EmailValidatorWithFunctionDirective {
-}
-
-
-export const APPLICATION_VALIDATORS = [IfNotBacklogThanAssigneeValidatorDirective,
-  EmailValidatorDirective];

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

@@ -1,6 +1,7 @@
 export interface AppUser {
   _id?: string;
   username?: string;
+  display_name?: string;
   squad?: Squad;
   secret?: string;
   activated: boolean;

static/src/app/profile/edit-profile.component.html

@@ -0,0 +1,71 @@
+<div class="overview">
+
+  <h2>Profil editieren</h2>
+
+  <!--<span *ngIf="showSuccessLabel"-->
+        <!--class="label label-success label-small"-->
+        <!--style="margin-left: inherit">-->
+        <!--Erfolgreich gespeichert-->
+  <!--</span>-->
+
+  <!--<div class="pull-left" style="margin-top:20px;">-->
+    <!--<div class="table-container" style="width: 75%; min-width: 500px">-->
+      <!--<table class="table table-hover">-->
+        <!--<thead>-->
+        <!--<tr class="table-head">-->
+          <!--<th class="col-sm-1" style="border-radius: 10px 0 0 0;">Username</th>-->
+          <!--<th class="col-sm-1">Activated</th>-->
+          <!--<th class="col-sm-1">Secret</th>-->
+          <!--<th class="col-sm-1">Fraktion/ Squad</th>-->
+          <!--<th class="col-sm-1">Permission</th>-->
+          <!--<th class="col-sm-1 text-center" style="border-radius: 0 10px 0 0;"></th>-->
+        <!--</tr>-->
+        <!--</thead>-->
+        <!--<tbody *ngFor="let user of users$ | async">-->
+        <!--<tr class="cell-outline">-->
+          <!--<td>-->
+            <!--{{user.username}}-->
+          <!--</td>-->
+          <!--<td style="font-weight: bold">-->
+            <!--<select id="activated" name="activated" class="form-control btn dropdown-toggle"-->
+                    <!--[(ngModel)]="user.activated" (change)="updateAppUser(user)">-->
+              <!--<option value="true">activated</option>-->
+              <!--<option value="false">deactivated</option>-->
+            <!--</select>-->
+          <!--</td>-->
+          <!--<td>-->
+            <!--{{user.secret}}-->
+          <!--</td>-->
+          <!--<td>-->
+            <!--<select class="form-control"-->
+                    <!--name="squad"-->
+                    <!--id="squad"-->
+                    <!--[(ngModel)]="user.squad"-->
+                    <!--[compareWith]="equals"-->
+                    <!--(change)="updateAppUser(user)">-->
+              <!--<option [value]="0">Ohne Fraktion/ Squad</option>-->
+              <!--<option *ngFor="let squad of squads" [ngValue]="squad">-->
+                <!--{{squad.fraction == 'BLUFOR'? 'NATO' : 'CSAT'}}: {{squad.name}}-->
+              <!--</option>-->
+            <!--</select>-->
+          <!--</td>-->
+          <!--<td>-->
+            <!--<select id="permission" name="permission" class="form-control btn dropdown-toggle"-->
+                    <!--[(ngModel)]="user.permission" (change)="updateAppUser(user)">-->
+              <!--<option value="0">User</option>-->
+              <!--<option value="1">SQL</option>-->
+              <!--<option value="2">HL</option>-->
+              <!--<option value="3">MT</option>-->
+              <!--<option value="4">Admin</option>-->
+            <!--</select>-->
+          <!--</td>-->
+          <!--<td class="text-center">-->
+            <!--<span class="glyphicon glyphicon-trash trash" title="Löschen" (click)="deleteUser(user)"></span>-->
+          <!--</td>-->
+        <!--</tr>-->
+        <!--</tbody>-->
+      <!--</table>-->
+    <!--</div>-->
+  <!--</div>-->
+
+</div>

static/src/app/profile/edit-profile.component.ts

@@ -0,0 +1,40 @@
+import {Component} from "@angular/core";
+import {AppUser, Squad} from "../models/model-interfaces";
+import {Observable} from "rxjs/Observable";
+import {AppUserService} from "../services/app-user-service/app-user.service";
+import {SquadService} from "../services/squad-service/squad.service";
+import {LoginService} from "../services/login-service/login-service";
+import {Router} from "@angular/router";
+
+
+@Component({
+  selector: 'edit-profile',
+  templateUrl: './edit-profile.component.html',
+  styleUrls: ['./edit-profile.component.css']
+})
+export class EditProfileComponent {
+
+  user = {};
+
+  showSuccessLabel = false;
+
+  constructor(private appUserService: AppUserService,
+              private loginService: LoginService,
+              private router: Router) {
+  }
+
+  ngOnInit() {
+    this.user = this.appUserService.getUsers();
+  }
+
+  deleteUser(user) {
+    if (confirm('Bistdu dir sicher dass du deinen Nutzer Account "' + user.username + '" loeschen willst?')) {
+      this.appUserService.deleteUser(user)
+        .subscribe((res) => {
+          this.loginService.logout();
+          // TODO: redirect to /
+        })
+    }
+  }
+
+}

static/src/app/profile/edit-profile.module.ts

@@ -0,0 +1,15 @@
+import {NgModule} from "@angular/core";
+import {SharedModule} from "../shared.module";
+import {AppUserService} from "../services/app-user-service/app-user.service";
+import {CommonModule} from "@angular/common";
+import {RouterModule} from "@angular/router";
+import {EditProfileComponent} from "./edit-profile.component";
+import {AppUserStore} from "../services/stores/app-user.store";
+
+@NgModule({
+  declarations: [EditProfileComponent],
+  imports: [CommonModule, SharedModule, RouterModule.forChild([{path: '', component: EditProfileComponent}])],
+  providers: [AppUserStore, AppUserService]
+})
+export class EditProfileModule {
+}