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