gerrit.onap Code Review - usecase-ui.git/blob

   1 <nz-modal [nzVisible]="showDetail" nzWidth="85%" [nzTitle]="moduleTitle" (nzOnCancel)="handleCancel()"
   2   (nzOnOk)="handleOk()">
   3   <nz-list class="taskmodel_list" [nzDataSource]="checkDetail" nzBordered [nzHeader]="'配置审核详情：'" [nzFooter]="null"
   4     [nzRenderItem]="checkItem">
   5     <ng-template #checkItem let-check>
   6       <nz-list-item nz-row nzType="flex" nzJustify="start" [nzGutter]="8">
   7         <div nz-col nzSpan="10">
   8           <span>Task ID： {{ check.id }}</span>
   9         </div>
  10         <div nz-col nzSpan="8">
  11           <span>Task Name： {{ check.name }}</span>
  12         </div>
  13         <div nz-col nzSpan="6">
  14           <span>S-NSSAI：{{ check.snssai }}</span>
  15         </div>
  16       </nz-list-item>
  17       <nz-list-item nz-row nzType="flex" nzJustify="start" [nzGutter]="8">
  18         <div nz-col nzSpan="10">
  19           <span>Arrived Time： {{ check.arrivedtime }}</span>
  20         </div>
  21         <div nz-col nzSpan="8">
  22           <span>Status： {{ check.status }}</span>
  23         </div>
  24       </nz-list-item>
  25     </ng-template>
  26   </nz-list>
  27
  28   <nz-list class="taskmodel_list" [nzDataSource]="businessRequirement" nzBordered [nzHeader]="'业务需求信息：'"
  29     [nzFooter]="null" [nzRenderItem]="businessItem">
  30     <ng-template #businessItem let-item>
  31       <nz-list-item>
  32         <span class="ant-typography">Name：</span>
  33         {{ item.name }}
  34       </nz-list-item>
  35       <nz-list-item>
  36         <span class="ant-typography">S-NSSAI： </span>
  37         {{ item.snssai }}
  38       </nz-list-item>
  39       <nz-list-item>
  40         <span class="ant-typography">Time： </span>
  41         {{ item.expiretime }}
  42       </nz-list-item>
  43       <nz-list-item>
  44         <span class="ant-typography">Area： </span>
  45         {{ item. area }}
  46       </nz-list-item>
  47     </ng-template>
  48   </nz-list>
  49
  50   <nz-list class="taskmodel_list" [nzDataSource]="NSTinfo" nzBordered [nzHeader]="'匹配NST信息：'" [nzFooter]="null"
  51     [nzRenderItem]="taskItem">
  52     <ng-template #taskItem let-item>
  53       <nz-list-item nz-row nzType="flex" nzJustify="start" [nzGutter]="8">
  54         <div nz-col nzSpan="12">
  55           <span>NST ID： {{ item.id }}</span>
  56         </div>
  57         <div nz-col nzSpan="12">
  58           <span>NST Name： {{ item.name }}</span>
  59         </div>
  60       </nz-list-item>
  61     </ng-template>
  62   </nz-list>
  63
  64
  65   <div>
  66     <nz-list class="taskmodel_list" nzBordered [nzHeader]="'匹配共享切片实例：'" [nzFooter]="null">
  67       <nz-list-item nz-row nzType="flex" nzJustify="start" [nzGutter]="8">
  68         <div nz-col nzSpan="12">
  69           切片实例 ID：
  70           <nz-select nzShowSearch [(ngModel)]="selectedServiceId" (ngModelChange)="serviceIdChange($event)">
  71             <nz-option *ngFor="let p of serviceId" [nzValue]="p" [nzLabel]="p"></nz-option>
  72           </nz-select>
  73         </div>
  74         <div nz-col nzSpan="8">
  75           切片实例名称：{{selectedServiceName}}
  76         </div>
  77         <div nz-col nzSpan="4">
  78           <button nz-button nzType="primary" (click)="resetService()">
  79             <i nz-icon class="anticon anticon-plus"></i>
  80           </button>
  81         </div>
  82       </nz-list-item>
  83       <nz-list-item nz-row nzType="flex" nzJustify="start" [nzGutter]="8">
  84         <p class="listitem_subtitle" nz-col nzSpan="24">匹配的共享切片子网实例：</p>
  85         <nz-card nzType="inner" nz-col nzSpan="24" nzTitle="无线域：">
  86           <div nz-row [nzGutter]="8">
  87             <div nz-col nzSpan="12">
  88               切片子网实例 ID：
  89               <nz-select nzShowSearch [(ngModel)]="selectedServiceId" (ngModelChange)="serviceIdChange($event)">
  90                 <nz-option *ngFor="let p of serviceId" [nzValue]="p" [nzLabel]="p"></nz-option>
  91               </nz-select>
  92             </div>
  93             <div nz-col nzSpan="8">
  94               切片子网实例名称：{{selectedServiceName}}
  95             </div>
  96             <div nz-col nzSpan="4">
  97               <button nz-button nzType="primary" (click)="resetService()"> <i nz-icon
  98                   class="anticon anticon-plus"></i></button>
  99               <button nz-button nzType="primary"> <i nz-icon class="anticon anticon-setting"
 100                   nzTheme="outline"></i></button>
 101             </div>
 102           </div>
 103         </nz-card>
 104         <nz-card nzType="inner" nz-col nzSpan="24" style="margin-top:16px;" nzTitle="传输域：">
 105           <div nz-row [nzGutter]="8">
 106             <div nz-col nzSpan="12">
 107               切片子网实例 ID：
 108               <nz-select nzShowSearch [(ngModel)]="selectedServiceId" (ngModelChange)="serviceIdChange($event)">
 109                 <nz-option *ngFor="let p of serviceId" [nzValue]="p" [nzLabel]="p"></nz-option>
 110               </nz-select>
 111             </div>
 112             <div nz-col nzSpan="8">
 113               切片子网实例名称：{{selectedServiceName}}
 114             </div>
 115             <div nz-col nzSpan="4">
 116               <button nz-button nzType="primary" (click)="resetService()"> <i nz-icon
 117                   class="anticon anticon-plus"></i></button>
 118               <button nz-button nzType="primary"> <i nz-icon class="anticon anticon-setting"
 119                   nzTheme="outline"></i></button>
 120             </div>
 121           </div>
 122         </nz-card>
 123         <nz-card nzType="inner" nz-col nzSpan="24" style="margin-top:16px;" nzTitle="核心网域：">
 124
 125           <div nz-row [nzGutter]="12" nzType="flex" nzAlign="middle">
 126             <div nz-col nzSpan="12">
 127               切片子网实例 ID：
 128               <nz-select nzShowSearch [(ngModel)]="selectedServiceId" (ngModelChange)="serviceIdChange($event)">
 129                 <nz-option *ngFor="let p of serviceId" [nzValue]="p" [nzLabel]="p"></nz-option>
 130               </nz-select>
 131             </div>
 132             <div nz-col nzSpan="8">
 133               切片子网实例名称：{{selectedServiceName}}
 134             </div>
 135             <div nz-col nzSpan="4">
 136               <button nz-button nzType="primary" (click)="resetService()">
 137                 <i nz-icon class="anticon anticon-plus"></i>
 138               </button>
 139               <button nz-button nzType="primary">
 140                 <i nz-icon class="anticon anticon-setting" nzTheme="outline"></i>
 141               </button>
 142             </div>
 143           </div>
 144         </nz-card>
 145       </nz-list-item>
 146     </nz-list>
 147   </div>
 148
 149 </nz-modal>