summaryrefslogtreecommitdiffstats
path: root/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-business-management/slicing-business-table/slicing-business-table.component.html
blob: 00c2f4ada21505b72e6f7cb455cd6fe292682d38 (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
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
<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 #basicTable [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 width=280>Service Instance Id</th>
                    <th width=200>Service Instance Name</th>
                    <th width=110>Service Type</th>
                    <th width=110>S-NSSAI</th>
                    <th width=110>Status</th>
                    <th width=180>Aciton</th>
                    <th width=110>Detail</th>
                </tr>
            </thead>
            <tbody>
                <ng-template ngFor let-data [ngForOf]="basicTable.data" let-i="index">
                    <tr>
                        <td>{{ data.service_instance_id }}</td>
                        <td>{{ data.service_instance_name }}</td>
                        <td>{{ data.service_type?data.service_type:'--' }}</td>
                        <td>{{ data.service_snssai }}</td>
                        <td>
                            <span class="marginLeft10">
                                <span *ngIf="data.last_operation_progress && data.last_operation_progress !== '100'">
                                    {{data.last_operation_progress+'%'}}
                                </span>
                                <br>
                                {{data.orchestration_status}}
                            </span>
                            <br>
                        </td>
                        <td>
                            <div class="action-icon">
                                <nz-switch [ngModel]="data.orchestration_status==='activated'?true:false"
                                    [nzDisabled]="data.orchestration_status === 'processing' || (data.orchestration_status !== 'processing' && data.last_operation_type && data.last_operation_progress && data.last_operation_progress !== '100')"
                                    (ngModelChange)="switchChange(data,i)"></nz-switch>
                                <nz-progress
                                    *ngIf="data.last_operation_type && data.last_operation_progress && data.last_operation_progress !== '100' && data.last_operation_type !== 'DELETE'"
                                    [nzPercent]="data.last_operation_progress" [nzShowInfo]="false" nzStatus="active">
                                </nz-progress>
                            </div>
                            <div class="action-icon">
                                <i [ngClass]="{'cannotclick': data.orchestration_status !== 'deactivated' || (data.last_operation_type && data.last_operation_progress && data.last_operation_progress !== '100' && (data.last_operation_type !== 'DELETE' || data.orchestration_status==='activated'))}"
                                    nz-icon nzType="poweroff" nzTheme="outline" class="anticon anticon-poweroff"
                                    (click)="terminate(data,i)"></i>
                                <nz-progress
                                    *ngIf="data.last_operation_type && data.last_operation_progress && data.last_operation_progress !== '100' && terminateStart[i]"
                                    [nzPercent]="data.last_operation_progress" [nzShowInfo]="false" nzStatus="active">
                                </nz-progress>
                            </div>
                        </td>
                        <td>
                            <a (click)="showdetail(data)"
                            [ngClass]="{'cannotclick':data.last_operation_type && data.last_operation_progress && data.last_operation_progress !== '100'}">View
                                Detail</a>
                        </td>
                    </tr>
                </ng-template>
            </tbody>
        </nz-table>
    </div>
</div>
<app-notification #notification [isServicesList]="false" [parentComponent]="'slicing'"></app-notification>