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