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