All files / projects/organization-management/src/app/pages/user-import user-import-page.component.html

100% Statements 1/1
100% Branches 0/0
100% Functions 0/0
100% Lines 1/1

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 1211x                                                                                                                                                                                                                                                
<h1>{{ 'account.user.import.heading' | translate }}</h1>
<p>{{ 'account.user.import.info' | translate }}</p>
 
@if (importedUsers$ | async; as importedUsers) {
<div class="loading-container">
  @if (importedUsers.length > 0) {
  <!-- user import progress bar -->
  @if (importProgress$ | async; as progress) { @if (progress.total > 0) {
  <div class="mb-3">
    <div class="progress">
      <div
        class="progress-bar"
        role="progressbar"
        [style.width.%]="progress.percentage"
        [attr.aria-valuemin]="0"
        [attr.aria-valuenow]="progress.current"
        [attr.aria-valuemax]="progress.total"
      >
        <span class="progress-display">
          {{
            'account.user.import.progress'
              | translate
                : {
                    total: progress.total,
                    processed: progress.current,
                    percentage: progress.percentage
                  }
          }}
        </span>
      </div>
    </div>
  </div>
  } }
 
  <!-- imported user table -->
  <table cdk-table [dataSource]="importedUsers" class="table table-lg mobile-optimized">
    <!-- User Name -->
    <ng-container cdkColumnDef="userName">
      <th scope="col" cdk-header-cell *cdkHeaderCellDef>
        {{ 'account.user.list.header.name' | translate }}
      </th>
      <td cdk-cell *cdkCellDef="let imported" [attr.data-label]="'account.user.list.header.name' | translate">
        <a [routerLink]="['/account/organization/users', imported.user.email]" class="d-block">
          {{ 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 scope="col" cdk-header-cell *cdkHeaderCellDef>
        {{ 'account.user.list.header.roles' | translate }}
      </th>
      <td cdk-cell *cdkCellDef="let imported" [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 scope="col" cdk-header-cell *cdkHeaderCellDef>
        {{ 'account.user.list.header.budget' | translate }}
      </th>
      <td cdk-cell *cdkCellDef="let imported" [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 scope="col" cdk-header-cell *cdkHeaderCellDef class="w-25">
        {{ 'account.user.list.header.status' | translate }}
      </th>
      <td cdk-cell *cdkCellDef="let imported" [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 cdk-header-row *cdkHeaderRowDef="columnsToDisplay"></tr>
    <tr cdk-row *cdkRowDef="let row; columns: columnsToDisplay"></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>
}