client/src/app/+my-account/my-account-ownership/my-account-ownership.component.html

   1 <h1>
   2   <my-global-icon iconName="download" aria-hidden="true"></my-global-icon>
   3   <ng-container i18n>My ownership changes</ng-container>
   4 </h1>
   5
   6 <p-table
   7     [value]="videoChangeOwnerships"
   8     [lazy]="true"
   9     [paginator]="totalRecords > 0"
  10     [totalRecords]="totalRecords"
  11     [rows]="rowsPerPage"
  12     [sortField]="sort.field"
  13     [sortOrder]="sort.order"
  14     (onLazyLoad)="loadLazy($event)"
  15 >
  16   <ng-template pTemplate="header">
  17     <tr>
  18       <th style="width: 35%;" i18n>Initiator</th>
  19       <th style="width: 65%;" i18n>Video</th>
  20       <th style="width: 150px;" i18n pSortableColumn="createdAt">
  21         Created
  22         <p-sortIcon field="createdAt"></p-sortIcon>
  23       </th>
  24       <th style="width: 100px;" i18n>Status</th>
  25       <th style="width: 130px;" i18n>Action</th>
  26     </tr>
  27   </ng-template>
  28
  29   <ng-template pTemplate="body" let-videoChangeOwnership>
  30     <tr>
  31       <td>
  32         <a [href]="videoChangeOwnership.initiatorAccount.url" i18n-title title="Open account in a new tab" target="_blank" rel="noopener noreferrer">
  33           <div class="chip two-lines">
  34             <img
  35               class="avatar"
  36               [src]="videoChangeOwnership.initiatorAccount.avatar?.path"
  37               (error)="switchToDefaultAvatar($event)"
  38               alt="Avatar"
  39             >
  40             <div>
  41               {{ videoChangeOwnership.initiatorAccount.displayName }}
  42               <span class="text-muted">{{ videoChangeOwnership.initiatorAccount.nameWithHost }}</span>
  43             </div>
  44           </div>
  45         </a>
  46       </td>
  47
  48       <td>
  49         <a [href]="videoChangeOwnership.video.url" class="video-table-video-link" [title]="videoChangeOwnership.video.name" target="_blank" rel="noopener noreferrer">
  50           <div class="video-table-video">
  51             <div class="video-table-video-image">
  52               <img [src]="videoChangeOwnership.video.thumbnailPath">
  53             </div>
  54             <div class="video-table-video-text">
  55               <div>
  56                 {{ videoChangeOwnership.video.name }}
  57               </div>
  58               <div class="text-muted">by {{ videoChangeOwnership.video.channel?.displayName }} </div>
  59             </div>
  60           </div>
  61         </a>
  62       </td>
  63
  64       <td>{{ videoChangeOwnership.createdAt | date: 'short' }}</td>
  65
  66       <td>
  67         <span class="badge" [ngClass]="getStatusClass(videoChangeOwnership.status)">{{ videoChangeOwnership.status }}</span>
  68       </td>
  69
  70       <td class="action-cell">
  71         <ng-container *ngIf="videoChangeOwnership.status === 'WAITING'">
  72           <my-button i18n-label label="Accept" icon="tick" (click)="openAcceptModal(videoChangeOwnership)"></my-button>
  73           <my-button i18n-label label="Refuse" icon="cross" (click)="refuse(videoChangeOwnership)"></my-button>
  74         </ng-container>
  75       </td>
  76     </tr>
  77   </ng-template>
  78
  79   <ng-template pTemplate="emptymessage">
  80     <tr>
  81       <td colspan="6">
  82         <div class="no-results">
  83           <ng-container i18n>No ownership change request found.</ng-container>
  84         </div>
  85       </td>
  86     </tr>
  87   </ng-template>
  88 </p-table>
  89
  90 <my-account-accept-ownership #myAccountAcceptOwnershipComponent (accepted)="accepted()"></my-account-accept-ownership>