summaryrefslogtreecommitdiffstats
path: root/usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/slicing-task-model/slicing-task-model.component.html
blob: f864dc922ab3017a38e108887ceaa4f6bea6b600 (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
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
<nz-modal [nzVisible]="showDetail" nzWidth="85%" [nzTitle]="moduleTitle" (nzOnCancel)="handleCancel()"
  (nzOnOk)="handleOk()">
  <nz-list class="taskmodel_list" [nzDataSource]="checkDetail" nzBordered [nzHeader]="'配置审核详情:'" [nzFooter]="null"
    [nzRenderItem]="checkItem">
    <ng-template #checkItem let-check>
      <nz-list-item nz-row nzType="flex" nzJustify="start" [nzGutter]="8">
        <div nz-col nzSpan="10">
          <span>Task ID: {{ check.id }}</span>
        </div>
        <div nz-col nzSpan="8">
          <span>Task Name: {{ check.name }}</span>
        </div>
        <div nz-col nzSpan="6">
          <span>S-NSSAI:{{ check.snssai }}</span>
        </div>
      </nz-list-item>
      <nz-list-item nz-row nzType="flex" nzJustify="start" [nzGutter]="8">
        <div nz-col nzSpan="10">
          <span>Arrived Time: {{ check.arrivedtime }}</span>
        </div>
        <div nz-col nzSpan="8">
          <span>Status: {{ check.status }}</span>
        </div>
      </nz-list-item>
    </ng-template>
  </nz-list>

  <nz-list class="taskmodel_list" [nzDataSource]="businessRequirement" nzBordered [nzHeader]="'业务需求信息:'"
    [nzFooter]="null" [nzRenderItem]="businessItem">
    <ng-template #businessItem let-item>
      <nz-list-item>
        <span class="ant-typography">Name:</span>
        {{ item.name }}
      </nz-list-item>
      <nz-list-item>
        <span class="ant-typography">S-NSSAI: </span>
        {{ item.snssai }}
      </nz-list-item>
      <nz-list-item>
        <span class="ant-typography">Time: </span>
        {{ item.expiretime }}
      </nz-list-item>
      <nz-list-item>
        <span class="ant-typography">Area: </span>
        {{ item. area }}
      </nz-list-item>
    </ng-template>
  </nz-list>

  <nz-list class="taskmodel_list" [nzDataSource]="NSTinfo" nzBordered [nzHeader]="'匹配NST信息:'" [nzFooter]="null"
    [nzRenderItem]="taskItem">
    <ng-template #taskItem let-item>
      <nz-list-item nz-row nzType="flex" nzJustify="start" [nzGutter]="8">
        <div nz-col nzSpan="12">
          <span>NST ID: {{ item.id }}</span>
        </div>
        <div nz-col nzSpan="12">
          <span>NST Name: {{ item.name }}</span>
        </div>
      </nz-list-item>
    </ng-template>
  </nz-list>


  <div>
    <nz-list class="taskmodel_list" nzBordered [nzHeader]="'匹配共享切片实例:'" [nzFooter]="null">
      <nz-list-item nz-row nzType="flex" nzJustify="start" [nzGutter]="8">
        <div nz-col nzSpan="12">
          切片实例 ID:
          <nz-select nzShowSearch [(ngModel)]="selectedServiceId" (ngModelChange)="serviceIdChange($event)">
            <nz-option *ngFor="let p of serviceId" [nzValue]="p" [nzLabel]="p"></nz-option>
          </nz-select>
        </div>
        <div nz-col nzSpan="8">
          切片实例名称:{{selectedServiceName}}
        </div>
        <div nz-col nzSpan="4">
          <button nz-button nzType="primary" (click)="resetService()">
            <i nz-icon class="anticon anticon-plus"></i>
          </button>
        </div>
      </nz-list-item>
      <nz-list-item nz-row nzType="flex" nzJustify="start" [nzGutter]="8">
        <p class="listitem_subtitle" nz-col nzSpan="24">匹配的共享切片子网实例:</p>
        <nz-card nzType="inner" nz-col nzSpan="24" nzTitle="无线域:">
          <div nz-row [nzGutter]="8">
            <div nz-col nzSpan="12">
              切片子网实例 ID:
              <nz-select nzShowSearch [(ngModel)]="selectedServiceId" (ngModelChange)="serviceIdChange($event)">
                <nz-option *ngFor="let p of serviceId" [nzValue]="p" [nzLabel]="p"></nz-option>
              </nz-select>
            </div>
            <div nz-col nzSpan="8">
              切片子网实例名称:{{selectedServiceName}}
            </div>
            <div nz-col nzSpan="4">
              <button nz-button nzType="primary" (click)="resetService()"> <i nz-icon
                  class="anticon anticon-plus"></i></button>
              <button nz-button nzType="primary"> <i nz-icon class="anticon anticon-setting"
                  nzTheme="outline"></i></button>
            </div>
          </div>
        </nz-card>
        <nz-card nzType="inner" nz-col nzSpan="24" style="margin-top:16px;" nzTitle="传输域:">
          <div nz-row [nzGutter]="8">
            <div nz-col nzSpan="12">
              切片子网实例 ID:
              <nz-select nzShowSearch [(ngModel)]="selectedServiceId" (ngModelChange)="serviceIdChange($event)">
                <nz-option *ngFor="let p of serviceId" [nzValue]="p" [nzLabel]="p"></nz-option>
              </nz-select>
            </div>
            <div nz-col nzSpan="8">
              切片子网实例名称:{{selectedServiceName}}
            </div>
            <div nz-col nzSpan="4">
              <button nz-button nzType="primary" (click)="resetService()"> <i nz-icon
                  class="anticon anticon-plus"></i></button>
              <button nz-button nzType="primary"> <i nz-icon class="anticon anticon-setting"
                  nzTheme="outline"></i></button>
            </div>
          </div>
        </nz-card>
        <nz-card nzType="inner" nz-col nzSpan="24" style="margin-top:16px;" nzTitle="核心网域:">

          <div nz-row [nzGutter]="12" nzType="flex" nzAlign="middle">
            <div nz-col nzSpan="12">
              切片子网实例 ID:
              <nz-select nzShowSearch [(ngModel)]="selectedServiceId" (ngModelChange)="serviceIdChange($event)">
                <nz-option *ngFor="let p of serviceId" [nzValue]="p" [nzLabel]="p"></nz-option>
              </nz-select>
            </div>
            <div nz-col nzSpan="8">
              切片子网实例名称:{{selectedServiceName}}
            </div>
            <div nz-col nzSpan="4">
              <button nz-button nzType="primary" (click)="resetService()">
                <i nz-icon class="anticon anticon-plus"></i>
              </button>
              <button nz-button nzType="primary">
                <i nz-icon class="anticon anticon-setting" nzTheme="outline"></i>
              </button>
            </div>
          </div>
        </nz-card>
      </nz-list-item>
    </nz-list>
  </div>

</nz-modal>