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