X-Git-Url: https://git.immae.eu/?a=blobdiff_plain;f=client%2Fsrc%2Fapp%2F%2Badmin%2Fusers%2Fuser-list%2Fuser-list.component.ts;h=339e182067c4610febaaddc509fe3570e4167308;hb=931d3430184143ebd88e5243def6eb1d7acfdbf4;hp=da50b7ed07f9188c6d4585bf583580e1061a76a8;hpb=610d0be13b3d01f653ef269271dd667a57c85ef2;p=github%2FChocobozzz%2FPeerTube.git diff --git a/client/src/app/+admin/users/user-list/user-list.component.ts b/client/src/app/+admin/users/user-list/user-list.component.ts index da50b7ed0..339e18206 100644 --- a/client/src/app/+admin/users/user-list/user-list.component.ts +++ b/client/src/app/+admin/users/user-list/user-list.component.ts @@ -1,13 +1,17 @@ -import { Component, OnInit, ViewChild } from '@angular/core' -import { AuthService, Notifier } from '@app/core' import { SortMeta } from 'primeng/api' -import { ConfirmService, ServerService } from '../../../core' -import { RestPagination, RestTable, UserService } from '../../../shared' -import { I18n } from '@ngx-translate/i18n-polyfill' -import { ServerConfig, User } from '../../../../../../shared' -import { UserBanModalComponent } from '@app/shared/moderation' -import { DropdownAction } from '@app/shared/buttons/action-dropdown.component' -import { Actor } from '@app/shared/actor/actor.model' +import { Component, OnInit, ViewChild } from '@angular/core' +import { ActivatedRoute, Params, Router } from '@angular/router' +import { AuthService, ConfirmService, Notifier, RestPagination, RestTable, ServerService, UserService } from '@app/core' +import { Account, DropdownAction } from '@app/shared/shared-main' +import { UserBanModalComponent } from '@app/shared/shared-moderation' +import { ServerConfig, User, UserRole } from '@shared/models' + +type UserForList = User & { + rawVideoQuota: number + rawVideoQuotaUsed: number + rawVideoQuotaDaily: number + rawVideoQuotaUsedDaily: number +} @Component({ selector: 'my-user-list', @@ -21,19 +25,23 @@ export class UserListComponent extends RestTable implements OnInit { totalRecords = 0 sort: SortMeta = { field: 'createdAt', order: 1 } pagination: RestPagination = { count: this.rowsPerPage, start: 0 } + highlightBannedUsers = false selectedUsers: User[] = [] bulkUserActions: DropdownAction[][] = [] + columns: { id: string, label: string }[] + private _selectedColumns: string[] private serverConfig: ServerConfig constructor ( + protected route: ActivatedRoute, + protected router: Router, private notifier: Notifier, private confirmService: ConfirmService, private serverService: ServerService, - private userService: UserService, private auth: AuthService, - private i18n: I18n + private userService: UserService ) { super() } @@ -46,36 +54,45 @@ export class UserListComponent extends RestTable implements OnInit { return this.serverConfig.signup.requiresEmailVerification } + get selectedColumns () { + return this._selectedColumns + } + + set selectedColumns (val: string[]) { + this._selectedColumns = val + } + ngOnInit () { this.serverConfig = this.serverService.getTmpConfig() this.serverService.getConfig() .subscribe(config => this.serverConfig = config) this.initialize() + this.listenToSearchChange() this.bulkUserActions = [ [ { - label: this.i18n('Delete'), - description: this.i18n('Videos will be deleted, comments will be tombstoned.'), + label: $localize`Delete`, + description: $localize`Videos will be deleted, comments will be tombstoned.`, handler: users => this.removeUsers(users), isDisplayed: users => users.every(u => this.authUser.canManage(u)) }, { - label: this.i18n('Ban'), - description: this.i18n('User won\'t be able to login anymore, but videos and comments will be kept as is.'), + label: $localize`Ban`, + description: $localize`User won't be able to login anymore, but videos and comments will be kept as is.`, handler: users => this.openBanUserModal(users), isDisplayed: users => users.every(u => this.authUser.canManage(u) && u.blocked === false) }, { - label: this.i18n('Unban'), + label: $localize`Unban`, handler: users => this.unbanUsers(users), isDisplayed: users => users.every(u => this.authUser.canManage(u) && u.blocked === true) } ], [ { - label: this.i18n('Set Email as Verified'), + label: $localize`Set Email as Verified`, handler: users => this.setEmailsAsVerified(users), isDisplayed: users => { return this.requiresEmailVerification && @@ -84,16 +101,57 @@ export class UserListComponent extends RestTable implements OnInit { } ] ] + + this.columns = [ + { id: 'username', label: 'Username' }, + { id: 'email', label: 'Email' }, + { id: 'quota', label: 'Video quota' }, + { id: 'role', label: 'Role' }, + { id: 'createdAt', label: 'Created' } + ] + + this.selectedColumns = this.columns.map(c => c.id) + + this.columns.push({ id: 'quotaDaily', label: 'Daily quota' }) + this.columns.push({ id: 'pluginAuth', label: 'Auth plugin' }) + this.columns.push({ id: 'lastLoginDate', label: 'Last login' }) } getIdentifier () { return 'UserListComponent' } + getRoleClass (role: UserRole) { + switch (role) { + case UserRole.ADMINISTRATOR: + return 'badge-purple' + case UserRole.MODERATOR: + return 'badge-blue' + default: + return 'badge-yellow' + } + } + + isSelected (id: string) { + return this.selectedColumns.find(c => c === id) + } + + getColumn (id: string) { + return this.columns.find(c => c.id === id) + } + + getUserVideoQuotaPercentage (user: UserForList) { + return user.rawVideoQuotaUsed * 100 / user.rawVideoQuota + } + + getUserVideoQuotaDailyPercentage (user: UserForList) { + return user.rawVideoQuotaUsedDaily * 100 / user.rawVideoQuotaDaily + } + openBanUserModal (users: User[]) { for (const user of users) { if (user.username === 'root') { - this.notifier.error(this.i18n('You cannot ban root.')) + this.notifier.error($localize`You cannot ban root.`) return } } @@ -105,22 +163,14 @@ export class UserListComponent extends RestTable implements OnInit { this.loadData() } - switchToDefaultAvatar ($event: Event) { - ($event.target as HTMLImageElement).src = Actor.GET_DEFAULT_AVATAR_URL() - } - async unbanUsers (users: User[]) { - const message = this.i18n('Do you really want to unban {{num}} users?', { num: users.length }) - - const res = await this.confirmService.confirm(message, this.i18n('Unban')) + const res = await this.confirmService.confirm($localize`Do you really want to unban ${users.length} users?`, $localize`Unban`) if (res === false) return this.userService.unbanUsers(users) .subscribe( () => { - const message = this.i18n('{{num}} users unbanned.', { num: users.length }) - - this.notifier.success(message) + this.notifier.success($localize`${users.length} users unbanned.`) this.loadData() }, @@ -131,18 +181,18 @@ export class UserListComponent extends RestTable implements OnInit { async removeUsers (users: User[]) { for (const user of users) { if (user.username === 'root') { - this.notifier.error(this.i18n('You cannot delete root.')) + this.notifier.error($localize`You cannot delete root.`) return } } - const message = this.i18n('If you remove these users, you will not be able to create others with the same username!') - const res = await this.confirmService.confirm(message, this.i18n('Delete')) + const message = $localize`If you remove these users, you will not be able to create others with the same username!` + const res = await this.confirmService.confirm(message, $localize`Delete`) if (res === false) return this.userService.removeUser(users).subscribe( () => { - this.notifier.success(this.i18n('{{num}} users deleted.', { num: users.length })) + this.notifier.success($localize`${users.length} users deleted.`) this.loadData() }, @@ -153,7 +203,7 @@ export class UserListComponent extends RestTable implements OnInit { async setEmailsAsVerified (users: User[]) { this.userService.updateUsers(users, { emailVerified: true }).subscribe( () => { - this.notifier.success(this.i18n('{{num}} users email set as verified.', { num: users.length })) + this.notifier.success($localize`${users.length} users email set as verified.`) this.loadData() }, @@ -168,14 +218,17 @@ export class UserListComponent extends RestTable implements OnInit { protected loadData () { this.selectedUsers = [] - this.userService.getUsers(this.pagination, this.sort, this.search) - .subscribe( - resultList => { - this.users = resultList.data - this.totalRecords = resultList.total - }, + this.userService.getUsers({ + pagination: this.pagination, + sort: this.sort, + search: this.search + }).subscribe( + resultList => { + this.users = resultList.data + this.totalRecords = resultList.total + }, - err => this.notifier.error(err.message) - ) + err => this.notifier.error(err.message) + ) } }