example-apps/ROBO/RoboUI/src/app/backuprestore/backuprestore.component.html

   1 <div class="main">
   2     <div class="center">
   3         <button style="margin-right: 05px;" (click)="refreshPage()" mat-raised-button color="primary">Refresh</button>
   4     </div>
   5     <div class="tabs">
   6
   7         <mat-tab-group>
   8             <mat-tab label="Apps">
   9                 Apps
  10                 <div class="appstable">
  11
  12                     <table mat-table [dataSource]="appsDataSource">
  13
  14                         <ng-container matColumnDef="namespace">
  15                             <th mat-header-cell *matHeaderCellDef> NAMESPACE </th>
  16                             <td mat-cell *matCellDef="let apps"> {{apps.namespace}} </td>
  17                         </ng-container>
  18
  19                         <ng-container matColumnDef="name">
  20                             <th mat-header-cell *matHeaderCellDef> NAME </th>
  21                             <td mat-cell *matCellDef="let apps"> {{apps.name}} </td>
  22                         </ng-container>
  23
  24                         <ng-container matColumnDef="ready">
  25                             <th mat-header-cell *matHeaderCellDef> READY </th>
  26                             <td mat-cell *matCellDef="let apps"> {{apps.ready}} </td>
  27                         </ng-container>
  28
  29                         <ng-container matColumnDef="status">
  30                             <th mat-header-cell *matHeaderCellDef> STATUS </th>
  31                             <td mat-cell *matCellDef="let apps"> {{apps.status}} </td>
  32                         </ng-container>
  33
  34                         <ng-container matColumnDef="restarts">
  35                             <th mat-header-cell *matHeaderCellDef> RESTARTS </th>
  36                             <td mat-cell *matCellDef="let apps"> {{apps.restarts}} </td>
  37                         </ng-container>
  38
  39                         <ng-container matColumnDef="age">
  40                             <th mat-header-cell *matHeaderCellDef> AGE </th>
  41                             <td mat-cell *matCellDef="let apps"> {{apps.age}} </td>
  42                         </ng-container>
  43
  44                         <ng-container matColumnDef="ip">
  45                             <th mat-header-cell *matHeaderCellDef> IP </th>
  46                             <td mat-cell *matCellDef="let apps"> {{apps.ip}} </td>
  47                         </ng-container>
  48
  49                         <ng-container matColumnDef="node">
  50                             <th mat-header-cell *matHeaderCellDef> NODE </th>
  51                             <td mat-cell *matCellDef="let apps"> {{apps.node}} </td>
  52                         </ng-container>
  53
  54                         <ng-container matColumnDef="nominatednode">
  55                             <th mat-header-cell *matHeaderCellDef> NOMINATED NODE </th>
  56                             <td mat-cell *matCellDef="let apps"> {{apps.nominatednode}} </td>
  57                         </ng-container>
  58
  59                         <ng-container matColumnDef="readinessgates">
  60                             <th mat-header-cell *matHeaderCellDef> READINESS GATES </th>
  61                             <td mat-cell *matCellDef="let apps"> {{apps.readinessgates}} </td>
  62                         </ng-container>
  63
  64                         <tr mat-header-row *matHeaderRowDef="appsColumns"></tr>
  65                         <tr mat-row *matRowDef="let row; columns: appsColumns;"></tr>
  66                     </table>
  67
  68                     <mat-paginator [pageSizeOptions]="[5, 10, 20]" showFirstLastButtons></mat-paginator>
  69
  70                 </div>
  71             </mat-tab>
  72             <mat-tab label="PVs and PVCs">
  73                 PVs and PVCs
  74                 <div class="pvstable">
  75
  76                     <table mat-table [dataSource]="pvsDataSource">
  77
  78                         <ng-container matColumnDef="namespace">
  79                             <th mat-header-cell *matHeaderCellDef> NAMESPACE </th>
  80                             <td mat-cell *matCellDef="let pvs"> {{pvs.namespace}} </td>
  81                         </ng-container>
  82
  83                         <ng-container matColumnDef="name">
  84                             <th mat-header-cell *matHeaderCellDef> NAME </th>
  85                             <td mat-cell *matCellDef="let pvs"> {{pvs.name}} </td>
  86                         </ng-container>
  87
  88                         <ng-container matColumnDef="status">
  89                             <th mat-header-cell *matHeaderCellDef> STATUS </th>
  90                             <td mat-cell *matCellDef="let pvs"> {{pvs.status}} </td>
  91                         </ng-container>
  92
  93                         <ng-container matColumnDef="volume">
  94                             <th mat-header-cell *matHeaderCellDef> VOLUME </th>
  95                             <td mat-cell *matCellDef="let pvs"> {{pvs.volume}} </td>
  96                         </ng-container>
  97
  98                         <ng-container matColumnDef="capacity">
  99                             <th mat-header-cell *matHeaderCellDef> CAPACITY </th>
 100                             <td mat-cell *matCellDef="let pvs"> {{pvs.capacity}} </td>
 101                         </ng-container>
 102
 103                         <ng-container matColumnDef="accessmodes">
 104                             <th mat-header-cell *matHeaderCellDef> ACCESS MODES </th>
 105                             <td mat-cell *matCellDef="let pvs"> {{pvs.accessmodes}} </td>
 106                         </ng-container>
 107
 108                         <ng-container matColumnDef="storageclass">
 109                             <th mat-header-cell *matHeaderCellDef> STORAGE CLASS </th>
 110                             <td mat-cell *matCellDef="let pvs"> {{pvs.storageclass}} </td>
 111                         </ng-container>
 112
 113                         <ng-container matColumnDef="age">
 114                             <th mat-header-cell *matHeaderCellDef> AGE </th>
 115                             <td mat-cell *matCellDef="let pvs"> {{pvs.age}} </td>
 116                         </ng-container>
 117
 118                         <ng-container matColumnDef="volumemode">
 119                             <th mat-header-cell *matHeaderCellDef> VOLUME NODE </th>
 120                             <td mat-cell *matCellDef="let pvs"> {{pvs.volumemode}} </td>
 121                         </ng-container>
 122
 123                         <ng-container matColumnDef="readinessgates">
 124                             <th mat-header-cell *matHeaderCellDef> READINESS GATES </th>
 125                             <td mat-cell *matCellDef="let pvs"> {{pvs.readinessgates}} </td>
 126                         </ng-container>
 127
 128                         <tr mat-header-row *matHeaderRowDef="pvsColumns"></tr>
 129                         <tr mat-row *matRowDef="let row; columns: pvsColumns;"></tr>
 130                     </table>
 131
 132                     <mat-paginator [pageSizeOptions]="[5, 10, 20]" showFirstLastButtons></mat-paginator>
 133
 134                 </div>
 135                 <div class="center">
 136                     <button style="margin-right: 05px;" (click)="simulateDisaster()" mat-raised-button color="primary">Disaster</button>
 137                 </div>
 138             </mat-tab>
 139             <mat-tab label="Backups">
 140                 Backups
 141                 <div class="backupstable">
 142
 143                     <table mat-table [dataSource]="backupsDataSource">
 144
 145                         <ng-container matColumnDef="name">
 146                             <th mat-header-cell *matHeaderCellDef> NAME </th>
 147                             <td mat-cell *matCellDef="let backups"> {{backups.name}} </td>
 148                         </ng-container>
 149
 150                         <ng-container matColumnDef="status">
 151                             <th mat-header-cell *matHeaderCellDef> STATUS </th>
 152                             <td mat-cell *matCellDef="let backups"> {{backups.status}} </td>
 153                         </ng-container>
 154
 155                         <ng-container matColumnDef="errors">
 156                             <th mat-header-cell *matHeaderCellDef> ERRORS </th>
 157                             <td mat-cell *matCellDef="let backups"> {{backups.errors}} </td>
 158                         </ng-container>
 159
 160                         <ng-container matColumnDef="warnings">
 161                             <th mat-header-cell *matHeaderCellDef> WARNINGS </th>
 162                             <td mat-cell *matCellDef="let backups"> {{backups.warnings}} </td>
 163                         </ng-container>
 164
 165                         <ng-container matColumnDef="created">
 166                             <th mat-header-cell *matHeaderCellDef> CREATED </th>
 167                             <td mat-cell *matCellDef="let backups"> {{backups.created}} </td>
 168                         </ng-container>
 169
 170                         <tr mat-header-row *matHeaderRowDef="backupsColumns"></tr>
 171                         <tr mat-row *matRowDef="let row; columns: backupsColumns;"></tr>
 172                     </table>
 173
 174                     <mat-paginator [pageSizeOptions]="[5, 10, 20]" showFirstLastButtons></mat-paginator>
 175
 176                 </div>
 177                 <div class="backup-det">
 178
 179                     <div style="padding-top:10px; padding-left: 20px">
 180                         <mat-label>Backup Name</mat-label>
 181                         <mat-form-field appearance="fill">
 182                             <mat-label>Backup Name</mat-label>
 183                             <input matInput [ngModelOptions]="{standalone: true}" [(ngModel)]="selectedBackupName">
 184                         </mat-form-field>
 185                     </div>
 186                     <div style="padding-left: 20px">
 187                         <mat-label >Namespace.. </mat-label>
 188                         <mat-form-field appearance="fill">
 189                             <mat-label>Namespace</mat-label>
 190
 191                             <input matInput [ngModelOptions]="{standalone: true}" [(ngModel)]="selectedNamespace">
 192
 193                         </mat-form-field>
 194                     </div>
 195                     <div class="center">
 196                         <button style="margin-right: 05px;" (click)="postBackup()" mat-raised-button color="primary">Backup</button>
 197                     </div>
 198                 </div>
 199
 200             </mat-tab>
 201             <mat-tab label="Restores">
 202                 Restores
 203                 <div class="restorestable">
 204
 205                     <table mat-table [dataSource]="restoresDataSource">
 206
 207                         <ng-container matColumnDef="name">
 208                             <th mat-header-cell *matHeaderCellDef> NAME </th>
 209                             <td mat-cell *matCellDef="let restores"> {{restores.name}} </td>
 210                         </ng-container>
 211
 212                         <ng-container matColumnDef="backup">
 213                             <th mat-header-cell *matHeaderCellDef> BACKUP </th>
 214                             <td mat-cell *matCellDef="let restores"> {{restores.backup}} </td>
 215                         </ng-container>
 216
 217                         <ng-container matColumnDef="status">
 218                             <th mat-header-cell *matHeaderCellDef> STATUS </th>
 219                             <td mat-cell *matCellDef="let restores"> {{restores.status}} </td>
 220                         </ng-container>
 221
 222                         <tr mat-header-row *matHeaderRowDef="restoresColumns"></tr>
 223                         <tr mat-row *matRowDef="let row; columns: restoresColumns;"></tr>
 224                     </table>
 225
 226                     <mat-paginator [pageSizeOptions]="[5, 10, 20]" showFirstLastButtons></mat-paginator>
 227
 228                     <div class="restore-det">
 229                         <div style="padding-left: 20px;">
 230                             <mat-label>Restore Name</mat-label>
 231                             <mat-form-field appearance="fill">
 232                                 <mat-label>Restore Name</mat-label>
 233                                 <input matInput [ngModelOptions]="{standalone: true}" [(ngModel)]="selectedRestoreName">
 234                             </mat-form-field>
 235                         </div>
 236                         <div style="padding-left: 20px;">
 237                             <mat-label>Backup Name</mat-label>
 238                             <mat-form-field appearance="fill">
 239                                 <mat-label>Backup Name</mat-label>
 240                                 <input matInput [ngModelOptions]="{standalone: true}" [(ngModel)]="selectedBackupname">
 241                             </mat-form-field>
 242                         </div>
 243                         <div class="center">
 244                             <button style="margin-right: 05px;" (click)="restore()" mat-raised-button color="primary">Restore</button>
 245                         </div>
 246                     </div>
 247                 </div>
 248             </mat-tab>
 249         </mat-tab-group>
 250
 251     </div>
 252 </div>