client/src/app/+admin/users/user-edit/user-update.component.ts

   1 import { Component, OnDestroy, OnInit } from '@angular/core'
   2 import { FormBuilder, FormGroup } from '@angular/forms'
   3 import { ActivatedRoute, Router } from '@angular/router'
   4 import { Subscription } from 'rxjs/Subscription'
   5
   6 import { NotificationsService } from 'angular2-notifications'
   7
   8 import { UserService } from '../shared'
   9 import {
  10   USER_EMAIL,
  11   USER_VIDEO_QUOTA,
  12   USER_ROLE,
  13   User
  14 } from '../../../shared'
  15 import { ServerService } from '../../../core'
  16 import { UserEdit } from './user-edit'
  17 import { UserUpdate, UserRole } from '../../../../../../shared'
  18
  19 @Component({
  20   selector: 'my-user-update',
  21   templateUrl: './user-edit.component.html',
  22   styleUrls: [ './user-edit.component.scss' ]
  23 })
  24 export class UserUpdateComponent extends UserEdit implements OnInit, OnDestroy {
  25   error: string
  26   userId: number
  27   username: string
  28
  29   form: FormGroup
  30   formErrors = {
  31     'email': '',
  32     'role': '',
  33     'videoQuota': ''
  34   }
  35   validationMessages = {
  36     'email': USER_EMAIL.MESSAGES,
  37     'role': USER_ROLE.MESSAGES,
  38     'videoQuota': USER_VIDEO_QUOTA.MESSAGES
  39   }
  40
  41   private paramsSub: Subscription
  42
  43   constructor (
  44     protected serverService: ServerService,
  45     private route: ActivatedRoute,
  46     private router: Router,
  47     private notificationsService: NotificationsService,
  48     private formBuilder: FormBuilder,
  49     private userService: UserService
  50   ) {
  51     super()
  52   }
  53
  54   buildForm () {
  55     this.form = this.formBuilder.group({
  56       email:    [ '', USER_EMAIL.VALIDATORS ],
  57       role: [ '', USER_ROLE.VALIDATORS ],
  58       videoQuota: [ '-1', USER_VIDEO_QUOTA.VALIDATORS ]
  59     })
  60
  61     this.form.valueChanges.subscribe(data => this.onValueChanged(data))
  62   }
  63
  64   ngOnInit () {
  65     this.buildForm()
  66
  67     this.paramsSub = this.route.params.subscribe(routeParams => {
  68       const userId = routeParams['id']
  69       this.userService.getUser(userId).subscribe(
  70         user => this.onUserFetched(user),
  71
  72         err => this.error = err.message
  73       )
  74     })
  75   }
  76
  77   ngOnDestroy () {
  78     this.paramsSub.unsubscribe()
  79   }
  80
  81   formValidated () {
  82     this.error = undefined
  83
  84     const userUpdate: UserUpdate = this.form.value
  85
  86     // A select in HTML is always mapped as a string, we convert it to number
  87     userUpdate.videoQuota = parseInt(this.form.value['videoQuota'], 10)
  88
  89     this.userService.updateUser(this.userId, userUpdate).subscribe(
  90       () => {
  91         this.notificationsService.success('Success', `User ${this.username} updated.`)
  92         this.router.navigate([ '/admin/users/list' ])
  93       },
  94
  95       err => this.error = err.message
  96     )
  97   }
  98
  99   isCreation () {
 100     return false
 101   }
 102
 103   getFormButtonTitle () {
 104     return 'Update user'
 105   }
 106
 107   private onUserFetched (userJson: User) {
 108     this.userId = userJson.id
 109     this.username = userJson.username
 110
 111     this.form.patchValue({
 112       email: userJson.email,
 113       role: userJson.role,
 114       videoQuota: userJson.videoQuota
 115     })
 116   }
 117 }