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, 40]" showFirstLastButtons></mat-paginator>
  69
  70                 </div>
  71             </mat-tab>
  72
  73
  74             <mat-tab label="PVCs">
  75                 PVCs
  76                 <div class="pvstable">
  77
  78                     <table mat-table [dataSource]="pvsDataSource">
  79
  80                         <ng-container matColumnDef="namespace">
  81                             <th mat-header-cell *matHeaderCellDef> NAMESPACE </th>
  82                             <td mat-cell *matCellDef="let pvs"> {{pvs.namespace}} </td>
  83                         </ng-container>
  84
  85                         <ng-container matColumnDef="name">
  86                             <th mat-header-cell *matHeaderCellDef> NAME </th>
  87                             <td mat-cell *matCellDef="let pvs"> {{pvs.name}} </td>
  88                         </ng-container>
  89
  90                         <ng-container matColumnDef="status">
  91                             <th mat-header-cell *matHeaderCellDef> STATUS </th>
  92                             <td mat-cell *matCellDef="let pvs"> {{pvs.status}} </td>
  93                         </ng-container>
  94
  95                         <ng-container matColumnDef="volume">
  96                             <th mat-header-cell *matHeaderCellDef> VOLUME </th>
  97                             <td mat-cell *matCellDef="let pvs"> {{pvs.volume}} </td>
  98                         </ng-container>
  99
 100                         <!-- <ng-container matColumnDef="capacity">
 101                             <th mat-header-cell *matHeaderCellDef> CAPACITY </th>
 102                             <td mat-cell *matCellDef="let pvs"> {{pvs.capacity}} </td>
 103                         </ng-container> -->
 104
 105                         <!-- <ng-container matColumnDef="accessmodes">
 106                             <th mat-header-cell *matHeaderCellDef> ACCESS MODES </th>
 107                             <td mat-cell *matCellDef="let pvs"> {{pvs.accessmodes}} </td>
 108                         </ng-container> -->
 109
 110                         <ng-container matColumnDef="storageclass">
 111                             <th mat-header-cell *matHeaderCellDef> STORAGE CLASS </th>
 112                             <td mat-cell *matCellDef="let pvs"> {{pvs.storageclass}} </td>
 113                         </ng-container>
 114
 115                         <!-- <ng-container matColumnDef="age">
 116                             <th mat-header-cell *matHeaderCellDef> AGE </th>
 117                             <td mat-cell *matCellDef="let pvs"> {{pvs.age}} </td>
 118                         </ng-container> -->
 119
 120                         <ng-container matColumnDef="volumemode">
 121                             <th mat-header-cell *matHeaderCellDef> VOLUMEMODE </th>
 122                             <td mat-cell *matCellDef="let pvs"> {{pvs.volumemode}} </td>
 123                         </ng-container>
 124
 125                         <ng-container matColumnDef="readinessgates">
 126                             <th mat-header-cell *matHeaderCellDef> READINESS GATES </th>
 127                             <td mat-cell *matCellDef="let pvs"> {{pvs.readinessgates}} </td>
 128                         </ng-container>
 129
 130                         <tr mat-header-row *matHeaderRowDef="pvsColumns"></tr>
 131                         <tr mat-row *matRowDef="let row; columns: pvsColumns;"></tr>
 132                     </table>
 133
 134                     <mat-paginator [pageSizeOptions]="[5, 10, 20]" showFirstLastButtons></mat-paginator>
 135
 136                 </div>
 137                 <div class="center">
 138                     <button style="margin-right: 05px;" (click)="simulateDisaster()" mat-raised-button color="primary">Disaster-Simulator</button>
 139                 </div>
 140             </mat-tab>
 141             <mat-tab label="Backups">
 142                 Backups
 143                 <div class="backupstable">
 144
 145                     <table mat-table [dataSource]="backupsDataSource">
 146
 147                         <ng-container matColumnDef="name">
 148                             <th mat-header-cell *matHeaderCellDef> NAME </th>
 149                             <td mat-cell *matCellDef="let backups"> {{backups.name}} </td>
 150                         </ng-container>
 151
 152                         <ng-container matColumnDef="status">
 153                             <th mat-header-cell *matHeaderCellDef> STATUS </th>
 154                             <td mat-cell *matCellDef="let backups"> {{backups.status}} </td>
 155                         </ng-container>
 156
 157                         <ng-container matColumnDef="errors">
 158                             <th mat-header-cell *matHeaderCellDef> ERRORS </th>
 159                             <td mat-cell *matCellDef="let backups"> {{backups.errors}} </td>
 160                         </ng-container>
 161
 162                         <ng-container matColumnDef="warnings">
 163                             <th mat-header-cell *matHeaderCellDef> WARNINGS </th>
 164                             <td mat-cell *matCellDef="let backups"> {{backups.warnings}} </td>
 165                         </ng-container>
 166
 167                         <ng-container matColumnDef="created">
 168                             <th mat-header-cell *matHeaderCellDef> CREATED </th>
 169                             <td mat-cell *matCellDef="let backups"> {{backups.created}} </td>
 170                         </ng-container>
 171
 172                         <tr mat-header-row *matHeaderRowDef="backupsColumns"></tr>
 173                         <tr mat-row *matRowDef="let row; columns: backupsColumns;"></tr>
 174                     </table>
 175
 176                     <mat-paginator [pageSizeOptions]="[5, 10, 20]" showFirstLastButtons></mat-paginator>
 177
 178                 </div>
 179                 <div class="backup-det">
 180
 181                     <div style="padding-top:10px; padding-left: 20px">
 182                         <mat-label>Backup Name</mat-label>
 183                         <mat-form-field appearance="fill">
 184                             <mat-label>Backup Name</mat-label>
 185                             <input matInput [ngModelOptions]="{standalone: true}" [(ngModel)]="selectedBackupName">
 186                         </mat-form-field>
 187                     </div>
 188                     <div style="padding-left: 20px">
 189                         <mat-label >Namespace.. </mat-label>
 190                         <mat-form-field appearance="fill">
 191                             <mat-label>Namespace</mat-label>
 192
 193                             <input matInput [ngModelOptions]="{standalone: true}" [(ngModel)]="selectedNamespace">
 194
 195                         </mat-form-field>
 196                     </div>
 197                     <div class="center">
 198                         <button style="margin-right: 05px;" (click)="postBackup()" mat-raised-button color="primary">Backup</button>
 199                     </div>
 200                 </div>
 201
 202             </mat-tab>
 203             <mat-tab label="Restores">
 204                 Restores
 205                 <div class="restorestable">
 206
 207                     <table mat-table [dataSource]="restoresDataSource">
 208
 209                         <ng-container matColumnDef="name">
 210                             <th mat-header-cell *matHeaderCellDef> NAME </th>
 211                             <td mat-cell *matCellDef="let restores"> {{restores.name}} </td>
 212                         </ng-container>
 213
 214                         <ng-container matColumnDef="backup">
 215                             <th mat-header-cell *matHeaderCellDef> BACKUP </th>
 216                             <td mat-cell *matCellDef="let restores"> {{restores.backup}} </td>
 217                         </ng-container>
 218
 219                         <ng-container matColumnDef="status">
 220                             <th mat-header-cell *matHeaderCellDef> STATUS </th>
 221                             <td mat-cell *matCellDef="let restores"> {{restores.status}} </td>
 222                         </ng-container>
 223
 224                         <tr mat-header-row *matHeaderRowDef="restoresColumns"></tr>
 225                         <tr mat-row *matRowDef="let row; columns: restoresColumns;"></tr>
 226                     </table>
 227
 228                     <mat-paginator [pageSizeOptions]="[5, 10, 20]" showFirstLastButtons></mat-paginator>
 229
 230                     <div class="restore-det">
 231                         <div style="padding-left: 20px;">
 232                             <mat-label>Restore Name</mat-label>
 233                             <mat-form-field appearance="fill">
 234                                 <mat-label>Restore Name</mat-label>
 235                                 <input matInput [ngModelOptions]="{standalone: true}" [(ngModel)]="selectedRestoreName">
 236                             </mat-form-field>
 237                         </div>
 238                         <div style="padding-left: 20px;">
 239                             <mat-label>Backup Name</mat-label>
 240                             <mat-form-field appearance="fill">
 241                                 <mat-label>Backup Name</mat-label>
 242                                 <input matInput [ngModelOptions]="{standalone: true}" [(ngModel)]="selectedBackupname">
 243                             </mat-form-field>
 244                         </div>
 245                         <div class="center">
 246                             <button style="margin-right: 05px;" (click)="restore()" mat-raised-button color="primary">Restore</button>
 247                         </div>
 248                     </div>
 249                 </div>
 250             </mat-tab>
 251         </mat-tab-group>
 252
 253     </div>
 254 </div>