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="status">
  25                             <th mat-header-cell *matHeaderCellDef> STATUS </th>
  26                             <td mat-cell *matCellDef="let apps"> {{apps.status}} </td>
  27                         </ng-container>
  28
  29                         <ng-container matColumnDef="ip">
  30                             <th mat-header-cell *matHeaderCellDef> IP </th>
  31                             <td mat-cell *matCellDef="let apps"> {{apps.ip}} </td>
  32                         </ng-container>
  33
  34                         <ng-container matColumnDef="node">
  35                             <th mat-header-cell *matHeaderCellDef> NODE </th>
  36                             <td mat-cell *matCellDef="let apps"> {{apps.node}} </td>
  37                         </ng-container>
  38
  39                         <tr mat-header-row *matHeaderRowDef="appsColumns"></tr>
  40                         <tr mat-row *matRowDef="let row; columns: appsColumns;"></tr>
  41                     </table>
  42
  43                     <mat-paginator [pageSizeOptions]="[5, 10, 20, 40]" showFirstLastButtons></mat-paginator>
  44
  45                 </div>
  46             </mat-tab>
  47
  48
  49             <mat-tab label="PVCs">
  50                 PVCs
  51                 <div class="pvstable">
  52
  53                     <table mat-table [dataSource]="pvsDataSource">
  54
  55                         <ng-container matColumnDef="namespace">
  56                             <th mat-header-cell *matHeaderCellDef> NAMESPACE </th>
  57                             <td mat-cell *matCellDef="let pvs"> {{pvs.namespace}} </td>
  58                         </ng-container>
  59
  60                         <ng-container matColumnDef="name">
  61                             <th mat-header-cell *matHeaderCellDef> NAME </th>
  62                             <td mat-cell *matCellDef="let pvs"> {{pvs.name}} </td>
  63                         </ng-container>
  64
  65                         <ng-container matColumnDef="status">
  66                             <th mat-header-cell *matHeaderCellDef> STATUS </th>
  67                             <td mat-cell *matCellDef="let pvs"> {{pvs.status}} </td>
  68                         </ng-container>
  69
  70                         <ng-container matColumnDef="volume">
  71                             <th mat-header-cell *matHeaderCellDef> VOLUME </th>
  72                             <td mat-cell *matCellDef="let pvs"> {{pvs.volume}} </td>
  73                         </ng-container>
  74
  75
  76                         <ng-container matColumnDef="storageclass">
  77                             <th mat-header-cell *matHeaderCellDef> STORAGE CLASS </th>
  78                             <td mat-cell *matCellDef="let pvs"> {{pvs.storageclass}} </td>
  79                         </ng-container>
  80
  81                         <ng-container matColumnDef="volumemode">
  82                             <th mat-header-cell *matHeaderCellDef> VOLUMEMODE </th>
  83                             <td mat-cell *matCellDef="let pvs"> {{pvs.volumemode}} </td>
  84                         </ng-container>
  85
  86                         <ng-container matColumnDef="readinessgates">
  87                             <th mat-header-cell *matHeaderCellDef> READINESS GATES </th>
  88                             <td mat-cell *matCellDef="let pvs"> {{pvs.readinessgates}} </td>
  89                         </ng-container>
  90
  91                         <tr mat-header-row *matHeaderRowDef="pvsColumns"></tr>
  92                         <tr mat-row *matRowDef="let row; columns: pvsColumns;"></tr>
  93                     </table>
  94
  95                     <mat-paginator [pageSizeOptions]="[5, 10, 20]" showFirstLastButtons></mat-paginator>
  96
  97                 </div>
  98                 <div class="center">
  99                     <button style="margin-right: 05px;" (click)="simulateDisaster()" mat-raised-button color="primary">Disaster</button>
 100                 </div>
 101             </mat-tab>
 102             <mat-tab label="Backups">
 103                 Backups
 104                 <div class="backupstable">
 105
 106                     <table mat-table [dataSource]="backupsDataSource">
 107
 108                         <ng-container matColumnDef="name">
 109                             <th mat-header-cell *matHeaderCellDef> NAME </th>
 110                             <td mat-cell *matCellDef="let backups"> {{backups.name}} </td>
 111                         </ng-container>
 112
 113                         <ng-container matColumnDef="status">
 114                             <th mat-header-cell *matHeaderCellDef> STATUS </th>
 115                             <td mat-cell *matCellDef="let backups"> {{backups.status}} </td>
 116                         </ng-container>
 117
 118                         <ng-container matColumnDef="errors">
 119                             <th mat-header-cell *matHeaderCellDef> ERRORS </th>
 120                             <td mat-cell *matCellDef="let backups"> {{backups.errors}} </td>
 121                         </ng-container>
 122
 123                         <ng-container matColumnDef="warnings">
 124                             <th mat-header-cell *matHeaderCellDef> WARNINGS </th>
 125                             <td mat-cell *matCellDef="let backups"> {{backups.warnings}} </td>
 126                         </ng-container>
 127
 128                         <ng-container matColumnDef="created">
 129                             <th mat-header-cell *matHeaderCellDef> CREATED </th>
 130                             <td mat-cell *matCellDef="let backups"> {{backups.created}} </td>
 131                         </ng-container>
 132
 133                         <tr mat-header-row *matHeaderRowDef="backupsColumns"></tr>
 134                         <tr mat-row *matRowDef="let row; columns: backupsColumns;"></tr>
 135                     </table>
 136
 137                     <mat-paginator [pageSizeOptions]="[5, 10, 20]" showFirstLastButtons></mat-paginator>
 138
 139                 </div>
 140                 <div class="backup-det">
 141
 142                     <div style="padding-top:10px; padding-left: 20px">
 143                         <mat-label>Backup Name</mat-label>
 144                         <mat-form-field appearance="fill">
 145                             <mat-label>Backup Name</mat-label>
 146                             <input matInput [ngModelOptions]="{standalone: true}" [(ngModel)]="selectedBackupName">
 147                         </mat-form-field>
 148                     </div>
 149                     <div style="padding-left: 20px">
 150                         <mat-label >Namespace.. </mat-label>
 151                         <mat-form-field appearance="fill">
 152                             <mat-label>Namespace</mat-label>
 153
 154                             <input matInput [ngModelOptions]="{standalone: true}" [(ngModel)]="selectedNamespace">
 155
 156                         </mat-form-field>
 157                     </div>
 158                     <div class="center">
 159                         <button style="margin-right: 05px;" (click)="postBackup()" mat-raised-button color="primary">Backup</button>
 160                     </div>
 161                 </div>
 162
 163             </mat-tab>
 164             <mat-tab label="Restores">
 165                 Restores
 166                 <div class="restorestable">
 167
 168                     <table mat-table [dataSource]="restoresDataSource">
 169
 170                         <ng-container matColumnDef="name">
 171                             <th mat-header-cell *matHeaderCellDef> NAME </th>
 172                             <td mat-cell *matCellDef="let restores"> {{restores.name}} </td>
 173                         </ng-container>
 174
 175                         <ng-container matColumnDef="backup">
 176                             <th mat-header-cell *matHeaderCellDef> BACKUP </th>
 177                             <td mat-cell *matCellDef="let restores"> {{restores.backup}} </td>
 178                         </ng-container>
 179
 180                         <ng-container matColumnDef="status">
 181                             <th mat-header-cell *matHeaderCellDef> STATUS </th>
 182                             <td mat-cell *matCellDef="let restores"> {{restores.status}} </td>
 183                         </ng-container>
 184
 185                         <tr mat-header-row *matHeaderRowDef="restoresColumns"></tr>
 186                         <tr mat-row *matRowDef="let row; columns: restoresColumns;"></tr>
 187                     </table>
 188
 189                     <mat-paginator [pageSizeOptions]="[5, 10, 20]" showFirstLastButtons></mat-paginator>
 190
 191                     <div class="restore-det">
 192                         <div style="padding-left: 20px;">
 193                             <mat-label>Restore Name</mat-label>
 194                             <mat-form-field appearance="fill">
 195                                 <mat-label>Restore Name</mat-label>
 196                                 <input matInput [ngModelOptions]="{standalone: true}" [(ngModel)]="selectedRestoreName">
 197                             </mat-form-field>
 198                         </div>
 199                         <div style="padding-left: 20px;">
 200                             <mat-label>Backup Name</mat-label>
 201                             <mat-form-field appearance="fill">
 202                                 <mat-label>Backup Name</mat-label>
 203                                 <input matInput [ngModelOptions]="{standalone: true}" [(ngModel)]="selectedBackupname">
 204                             </mat-form-field>
 205                         </div>
 206                         <div class="center">
 207                             <button style="margin-right: 05px;" (click)="restore()" mat-raised-button color="primary">Restore</button>
 208                         </div>
 209                     </div>
 210                 </div>
 211             </mat-tab>
 212         </mat-tab-group>
 213
 214     </div>
 215 </div>