]>
Commit | Line | Data |
---|---|---|
cd83ea1b | 1 | <div class="admin-sub-header"> |
c9e3565d | 2 | <h1 i18n class="form-sub-title">Users list</h1> |
dfe3ec6b | 3 | |
4c200caa | 4 | <a class="add-button" routerLink="/admin/users/create"> |
6ad971d5 | 5 | <my-global-icon iconName="add" aria-hidden="true"></my-global-icon> |
b1d40cff | 6 | <ng-container i18n>Create user</ng-container> |
04e0fc48 | 7 | </a> |
897ec54d | 8 | </div> |
04e0fc48 | 9 | |
ab998f7b | 10 | <p-table |
25a42e29 | 11 | [value]="users" [lazy]="true" [paginator]="totalRecords > 0" [totalRecords]="totalRecords" [rows]="rowsPerPage" [rowsPerPageOptions]="rowsPerPageOptions" |
df4c603d | 12 | [sortField]="sort.field" [sortOrder]="sort.order" (onLazyLoad)="loadLazy($event)" dataKey="id" [resizableColumns]="true" |
791645e6 | 13 | [(selection)]="selectedUsers" |
2bc9bd08 | 14 | [showCurrentPageReport]="true" i18n-currentPageReportTemplate |
45c14ae1 | 15 | currentPageReportTemplate="Showing {{'{first}'}} to {{'{last}'}} of {{'{totalRecords}'}} users" |
25a42e29 | 16 | (onPage)="onPage($event)" [expandedRowKeys]="expandedRows" |
9b01cfc7 | 17 | [rowStyleClass]="getRowClasses" |
04e0fc48 | 18 | > |
791645e6 C |
19 | <ng-template pTemplate="caption"> |
20 | <div class="caption"> | |
21 | <div> | |
22 | <my-action-dropdown | |
23 | *ngIf="isInSelectionMode()" i18n-label label="Batch actions" theme="orange" | |
24 | [actions]="bulkUserActions" [entry]="selectedUsers" | |
25 | > | |
26 | </my-action-dropdown> | |
27 | </div> | |
28 | ||
25a42e29 | 29 | <div class="has-feedback has-clear"> |
791645e6 C |
30 | <input |
31 | type="text" name="table-filter" id="table-filter" i18n-placeholder placeholder="Filter..." | |
be27ef3b | 32 | (keyup)="onSearch($event)" |
791645e6 | 33 | > |
25a42e29 RK |
34 | <a class="glyphicon glyphicon-remove-sign form-control-feedback form-control-clear" (click)="resetSearch()"></a> |
35 | <span class="sr-only" i18n>Clear filters</span> | |
791645e6 C |
36 | </div> |
37 | </div> | |
38 | </ng-template> | |
39 | ||
ab998f7b C |
40 | <ng-template pTemplate="header"> |
41 | <tr> | |
791645e6 | 42 | <th style="width: 40px"> |
2cae5f13 | 43 | <p-tableHeaderCheckbox></p-tableHeaderCheckbox> |
791645e6 | 44 | </th> |
2cae5f13 | 45 | <th style="width: 40px"></th> |
df4c603d | 46 | <th pResizableColumn i18n pSortableColumn="username">Username <p-sortIcon field="username"></p-sortIcon></th> |
b1d40cff | 47 | <th i18n>Email</th> |
df4c603d RK |
48 | <th style="width: 140px;" i18n pSortableColumn="videoQuotaUsed">Video quota <p-sortIcon field="videoQuotaUsed"></p-sortIcon></th> |
49 | <th style="width: 120px;" i18n>Role</th> | |
50 | <th style="width: 140px;" pResizableColumn i18n>Auth plugin</th> | |
51 | <th style="width: 150px;" i18n pSortableColumn="createdAt">Created <p-sortIcon field="createdAt"></p-sortIcon></th> | |
9b01cfc7 | 52 | <th style="width: 60px;"></th> |
ab998f7b C |
53 | </tr> |
54 | </ng-template> | |
55 | ||
141b177d C |
56 | <ng-template pTemplate="body" let-expanded="expanded" let-user> |
57 | ||
791645e6 | 58 | <tr [pSelectableRow]="user" [ngClass]="{ banned: user.blocked }"> |
d6af8146 | 59 | <td> |
791645e6 C |
60 | <p-tableCheckbox [value]="user"></p-tableCheckbox> |
61 | </td> | |
62 | ||
d6af8146 | 63 | <td class="expand-cell"> |
141b177d C |
64 | <span *ngIf="user.blockedReason" class="expander" [pRowToggler]="user"> |
65 | <i [ngClass]="expanded ? 'glyphicon glyphicon-menu-down' : 'glyphicon glyphicon-menu-right'"></i> | |
66 | </span> | |
67 | </td> | |
791645e6 | 68 | |
141b177d | 69 | <td> |
d6af8146 RK |
70 | <a i18n-title title="Open account in a new tab" target="_blank" rel="noopener noreferrer" [routerLink]="[ '/accounts/' + user.username ]"> |
71 | <div class="chip two-lines"> | |
72 | <img | |
73 | class="avatar" | |
74 | [src]="user?.account?.avatar?.path" | |
75 | (error)="switchToDefaultAvatar($event)" | |
76 | alt="Avatar" | |
77 | > | |
78 | <div> | |
9b01cfc7 RK |
79 | <span> |
80 | <span *ngIf="user.blocked" i18n-title title="The user was banned" class="glyphicon glyphicon-ban-circle"></span> | |
81 | {{ user.account.displayName }} | |
82 | </span> | |
d6af8146 RK |
83 | <span class="text-muted">{{ user.username }}</span> |
84 | </div> | |
85 | </div> | |
af5767ff | 86 | </a> |
141b177d | 87 | </td> |
5abb9fbb | 88 | |
9b82d49d | 89 | <td *ngIf="!requiresEmailVerification || user.blocked; else emailWithVerificationStatus" [title]="user.email">{{ user.email }}</td> |
5abb9fbb | 90 | |
fc2ec87a JM |
91 | <ng-template #emailWithVerificationStatus> |
92 | <td *ngIf="user.emailVerified === false; else emailVerifiedNotFalse" i18n-title title="User's email must be verified to login"> | |
93 | <em>? {{ user.email }}</em> | |
94 | </td> | |
95 | <ng-template #emailVerifiedNotFalse> | |
96 | <td i18n-title title="User's email is verified / User can login without email verification"> | |
97 | ✓ {{ user.email }} | |
98 | </td> | |
99 | </ng-template> | |
100 | </ng-template> | |
5abb9fbb | 101 | |
a76138ff | 102 | <td>{{ user.videoQuotaUsed }} / {{ user.videoQuota }}</td> |
ab998f7b | 103 | <td>{{ user.roleLabel }}</td> |
8bb71f2e C |
104 | |
105 | <td> | |
106 | <ng-container *ngIf="user.pluginAuth">{{ user.pluginAuth }}</ng-container> | |
107 | </td> | |
108 | ||
df4c603d | 109 | <td [title]="user.createdAt">{{ user.createdAt | date: 'short' }}</td> |
8bb71f2e | 110 | |
ab998f7b | 111 | <td class="action-cell"> |
5ff52366 C |
112 | <my-user-moderation-dropdown |
113 | *ngIf="!isInSelectionMode()" | |
114 | [user]="user" container="body" (userChanged)="onUserChanged()" (userDeleted)="onUserChanged()" | |
115 | > | |
79bd2632 | 116 | </my-user-moderation-dropdown> |
141b177d C |
117 | </td> |
118 | </tr> | |
119 | </ng-template> | |
120 | ||
121 | <ng-template pTemplate="rowexpansion" let-user> | |
122 | <tr class="user-blocked-reason"> | |
123 | <td colspan="7"> | |
124 | <span i18n class="ban-reason-label">Ban reason:</span> | |
125 | {{ user.blockedReason }} | |
ab998f7b C |
126 | </td> |
127 | </tr> | |
128 | </ng-template> | |
129 | </p-table> | |
141b177d | 130 | |
2fbe7f19 | 131 | <my-user-ban-modal #userBanModal (userBanned)="onUserChanged()"></my-user-ban-modal> |