Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 | 1x | <h1>{{ 'account.user.import.heading' | translate }}</h1>
<p>{{ 'account.user.import.info' | translate }}</p>
@let importedUsers = importedUsers$ | async;
<div class="loading-container">
@if (importedUsers?.length > 0) {
<!-- user import progress bar -->
@let progress = importProgress$ | async;
@if (progress?.total > 0) {
<div class="progress mb-3">
<div
class="progress-bar"
role="progressbar"
[attr.aria-valuemax]="progress.total"
[attr.aria-valuemin]="0"
[attr.aria-valuenow]="progress.current"
[style.width.%]="progress.percentage"
>
<span class="progress-display">
{{
'account.user.import.progress'
| translate
: {
total: progress.total,
processed: progress.current,
percentage: progress.percentage,
}
}}
</span>
</div>
</div>
}
<!-- imported user table -->
<table cdk-table class="table table-lg mobile-optimized" [dataSource]="importedUsers">
<!-- User Name -->
<ng-container cdkColumnDef="userName">
<th *cdkHeaderCellDef cdk-header-cell scope="col">
{{ 'account.user.list.header.name' | translate }}
</th>
<td *cdkCellDef="let imported" cdk-cell [attr.data-label]="'account.user.list.header.name' | translate">
<a class="d-block" [routerLink]="['/account/organization/users', imported.user.email]">
{{ imported.user.firstName }} {{ imported.user.lastName }}
</a>
@if (!imported.user.active) {
<div class="input-help">
{{ 'account.user.list.status.inactive' | translate }}
</div>
}
</td>
</ng-container>
<!-- User Roles -->
<ng-container cdkColumnDef="userRoles">
<th *cdkHeaderCellDef cdk-header-cell scope="col">
{{ 'account.user.list.header.roles' | translate }}
</th>
<td *cdkCellDef="let imported" cdk-cell [attr.data-label]="'account.user.list.header.roles' | translate">
<ish-user-roles-badges [roleIDs]="imported.user.roleIDs" />
</td>
</ng-container>
<!-- User Budget -->
<ng-container cdkColumnDef="userBudget">
<th *cdkHeaderCellDef cdk-header-cell scope="col">
{{ 'account.user.list.header.budget' | translate }}
</th>
<td *cdkCellDef="let imported" cdk-cell [attr.data-label]="'account.user.list.header.budget' | translate">
<dl>
<dt>{{ 'account.user.new.order_spend_limit.label' | translate }}</dt>
<dd>
{{
imported.user.userBudget.orderSpentLimit
? (imported.user.userBudget.orderSpentLimit | ishPrice)
: ('account.budget.unlimited' | translate)
}}
</dd>
@if (imported.user.userBudget.budget) {
<dt>{{ 'account.budget.label' | translate: { '0': imported.user.userBudget.budgetPeriod } }}</dt>
<dd>{{ imported.user.userBudget.budget | ishPrice }}</dd>
} @else {
<dt>{{ 'account.user.budget.label' | translate }}</dt>
<dd>{{ 'account.budget.unlimited' | translate }}</dd>
}
</dl>
</td>
</ng-container>
<!-- Import Status -->
<ng-container cdkColumnDef="status">
<th *cdkHeaderCellDef cdk-header-cell class="w-25" scope="col">
{{ 'account.user.list.header.status' | translate }}
</th>
<td *cdkCellDef="let imported" cdk-cell [attr.data-label]="'account.user.list.header.status' | translate">
<span [ngClass]="imported.status === 'success' ? 'text-success' : 'text-error'">
{{
imported.status === 'success'
? ('account.user.import.status.success' | translate)
: (imported.status | translate)
}}
</span>
</td>
</ng-container>
<!-- Header and Row Declarations -->
<tr *cdkHeaderRowDef="columnsToDisplay" cdk-header-row></tr>
<tr *cdkRowDef="let row; columns: columnsToDisplay" cdk-row></tr>
</table>
<a [routerLink]="['/account/organization/users']">
{{ 'account.user.import.back' | translate }}
</a>
} @else {
@if (loading$ | async) {
<ish-loading />
} @else {
<p>{{ 'account.user.import.empty' | translate }}</p>
}
}
</div>
|