534f18a160699f1a216620ae040c1667f0891e0a
[usecase-ui.git] /
1 <div class="slicing-resource-table">
2   <div nz-row>
3     <div nz-col nzSpan="12" class="task_status">
4       <span>Status : </span>
5       <nz-select nzShowSearch nzPlaceHolder="Select a processing status" [(ngModel)]="selectedValue"
6         (ngModelChange)="getListOfProcessingStatus()">
7         <nz-option *ngFor="let item of statusOptions" [nzLabel]="item" [nzValue]="item"></nz-option>
8       </nz-select>
9     </div>
10   </div>
11   <div class="slicing-resource-table-list">
12     <nz-table
13             #nsiTable
14             [nzData]="listOfData"
15             [nzFrontPagination]="false"
16             nzShowSizeChanger
17             [nzPageSizeOptions]="[5,10,15,20]"
18             [nzTotal]='total'
19             [(nzPageSize)]="pageSize"
20             [(nzPageIndex)]='pageIndex'
21             [nzLoading]="loading"
22             (nzPageIndexChange)="searchData()"
23             (nzPageSizeChange)="searchData(true)"
24     >
25       <thead>
26         <tr>
27           <th>Service Instance Id</th>
28           <th>Service Instance Name</th>
29           <th>Service Type</th>
30           <th width="85px">Context</th>
31           <th width="110px">Status</th>
32           <th width="140px">Detail</th>
33         </tr>
34       </thead>
35       <tbody>
36         <ng-template ngFor let-data [ngForOf]="nsiTable.data" let-i="index">
37           <tr>
38             <td>{{ data.service_instance_id }}</td>
39             <td>{{ data.service_instance_name }}</td>
40             <td>{{ data.service_type }}</td>
41             <td>{{data.environment_context}}</td>
42             <td>{{data.orchestration_status}}</td>
43             <td>
44               <a (click)="showdetail(data)">View Detail</a>
45             </td>
46           </tr>
47         </ng-template>
48       </tbody>
49     </nz-table>
50   </div>
51 </div>