summaryrefslogtreecommitdiffstats
path: root/usecaseui-portal/src/app
diff options
context:
space:
mode:
Diffstat (limited to 'usecaseui-portal/src/app')
-rw-r--r--usecaseui-portal/src/app/app.module.ts8
-rw-r--r--usecaseui-portal/src/app/core/services/onboard.service.ts21
-rw-r--r--usecaseui-portal/src/app/shared/utils/recorder.ts149
-rw-r--r--usecaseui-portal/src/app/views/onboard-vnf-vm/onboard-vnf-vm.component.html245
-rw-r--r--usecaseui-portal/src/app/views/onboard-vnf-vm/onboard-vnf-vm.component.ts118
-rw-r--r--usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/business-order/business-order.component.ts26
-rw-r--r--usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/csmf-slicing-business-management.component.html4
-rw-r--r--usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/csmf-slicing-business-management.component.ts24
-rw-r--r--usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/input-business-order/input-business-order.component.html38
-rw-r--r--usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/input-business-order/input-business-order.component.less50
-rw-r--r--usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/input-business-order/input-business-order.component.spec.ts25
-rw-r--r--usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/input-business-order/input-business-order.component.ts101
12 files changed, 678 insertions, 131 deletions
diff --git a/usecaseui-portal/src/app/app.module.ts b/usecaseui-portal/src/app/app.module.ts
index be1f08a3..16f8bc43 100644
--- a/usecaseui-portal/src/app/app.module.ts
+++ b/usecaseui-portal/src/app/app.module.ts
@@ -71,6 +71,7 @@ import {
} from "@angular/common";
// common function util
import { Util } from "./shared/utils/utils";
+import { Recorder} from './shared/utils/recorder';
// common function http
import { Http } from "./shared/utils/http";
// Custom service
@@ -110,6 +111,7 @@ import { NsiModelComponent } from "./views/services/slicing-management/slicing-r
import { NssiModelComponent } from "./views/services/slicing-management/slicing-resource-management/nssi-management/nssi-model/nssi-model.component";
import { CsmfSlicingBusinessManagementComponent } from "./views/services/slicing-management/csmf-slicing-business-management/csmf-slicing-business-management.component";
import { BusinessOrderComponent } from "./views/services/slicing-management/csmf-slicing-business-management/business-order/business-order.component";
+import { InputBusinessOrderComponent } from './views/services/slicing-management/csmf-slicing-business-management/input-business-order/input-business-order.component';
import { SotnManagementComponent } from "./views/services/sotn-management/sotn-management.component";
import { OrderServiceComponent } from "./views/services/sotn-management/order-service/order-service.component";
import { ManageServiceComponent } from "./views/services/sotn-management/manage-service/manage-service.component";
@@ -122,7 +124,8 @@ import { CitySelectComponent } from "./shared/components/city-select/city-select
{ provide: LocationStrategy, useClass: HashLocationStrategy },
{ provide: NZ_I18N, useValue: en_US },
Util,
- Http,
+ Http,
+ Recorder,
ServiceListService,
HomesService,
onboardService,
@@ -180,7 +183,8 @@ import { CitySelectComponent } from "./shared/components/city-select/city-select
NsiModelComponent,
NssiModelComponent,
CsmfSlicingBusinessManagementComponent,
- BusinessOrderComponent,
+ BusinessOrderComponent,
+ InputBusinessOrderComponent,
MdonsCreationComponent,
MdonsDetailComponent,
DisableControlDirective,
diff --git a/usecaseui-portal/src/app/core/services/onboard.service.ts b/usecaseui-portal/src/app/core/services/onboard.service.ts
index e7b1bfc6..20d9c244 100644
--- a/usecaseui-portal/src/app/core/services/onboard.service.ts
+++ b/usecaseui-portal/src/app/core/services/onboard.service.ts
@@ -27,12 +27,14 @@ export class onboardService {
onboardTableData: this.baseUrl + "/uui-lcm/ns-packages",
onboardDataVNF: this.baseUrl + "/uui-lcm/vnf-packages",
onboardDataPNF: this.baseUrl + "/uui-lcm/pnf-packages",
+ onboardDataModel: this.baseUrl + "/intent/listModel",
sdc_nsListData: this.baseUrl + "/uui-lcm/sdc-ns-packages", // GET
sdc_vnfListData: this.baseUrl + "/uui-lcm/sdc-vf-packages", // GET
onboardNs: this.baseUrl + "/uui-lcm/ns-packages", //POST
-
+ analysisInput: this.baseUrl + "/intent/predict", //POST
onboardVNF: this.baseUrl + "/uui-lcm/vf-packages", //POST
deleteNspack: this.baseUrl + "/uui-lcm/deleteNsdPackage",
+ deleteModelpack: this.baseUrl + "/intent/deleteModel",
// Delete Vnf vfc package
deleteVnfPack: this.baseUrl + "/uui-lcm/deleteVnfPackage",
// Delete Pnf package
@@ -64,6 +66,17 @@ export class onboardService {
getOnboardTablePnfData() {
return this.http.get<any>(this.url.onboardDataPNF);
}
+ // MODEL Data
+ getOnboardTableModelData() {
+ return this.http.get<any>(this.url.onboardDataModel);
+ }
+ // MODEL Data
+ getOnboardTableActiveModelData(url) {
+ return this.http.get<any>(url);
+ }
+ analysisInputText(requestBody) {
+ return this.http.post<any>(this.url["analysisInput"], requestBody);
+ }
//onboard sdc ns
getNsonboard(requestBody) {
return this.http.post<any>(this.url["onboardNs"], requestBody);
@@ -87,7 +100,11 @@ export class onboardService {
let params = new HttpParams({ fromObject: {"pnfdInfoId":paramsObj }});
return this.http.delete<any>(this.url.deletePnfPack , {params});
}
-
+ // Delete model package
+ deleteModelIdData(paramsObj) {
+ let params = new HttpParams({ fromObject: { "modelId": paramsObj }});
+ return this.http.delete<any>(this.url.deleteModelpack,{params});
+ }
// The following APIs function are not optimizable-------------------
//create--Get the id after dragging the file before uploading
diff --git a/usecaseui-portal/src/app/shared/utils/recorder.ts b/usecaseui-portal/src/app/shared/utils/recorder.ts
new file mode 100644
index 00000000..65cf9136
--- /dev/null
+++ b/usecaseui-portal/src/app/shared/utils/recorder.ts
@@ -0,0 +1,149 @@
+export class Recorder {
+ mediaStreams: any;
+ audioInput: any;
+ recorder: any;
+ leftDataList: any[] = [];
+ rightDataList: any[] = [];
+
+ throwError(message) {
+ alert(message);
+ throw new function () { this.toString = function () { return message; } };
+ }
+
+ // start sound recording
+ beforeStartRecord() {
+ let getUserMedia = window.navigator.mediaDevices.getUserMedia || null;
+ if (!getUserMedia) {
+ this.throwError('The current browser does not support recording.');
+ return;
+ }
+ window.navigator.mediaDevices.getUserMedia({
+ audio: true
+ }).then(mediaStream => {
+ this.mediaStreams = mediaStream;
+ this.startRecord();
+ }).catch(err => {
+
+ })
+ }
+
+ startRecord() {
+ // Clear data before recording again
+ let audioContext = new (window["AudioContext"] || window["webkitAudioContext"])();
+ this.recorder = this.createJSNode(audioContext);
+ this.recorder.connect(audioContext.destination);
+ this.recorder.onaudioprocess = (event) => {
+ // console.log(event.inputBuffer);
+ let audioBuffer = event.inputBuffer;
+ let leftChannelData = audioBuffer.getChannelData(0),
+ rightChannelData = audioBuffer.getChannelData(1);
+ // console.log(leftChannelData, rightChannelData);
+ // need to clone data
+ this.leftDataList.push(leftChannelData.slice(0));
+ this.rightDataList.push(rightChannelData.slice(0));
+ }
+ this.audioInput = audioContext.createMediaStreamSource(this.mediaStreams);
+ }
+
+ createJSNode(audioContext) {
+ const BUFFER_SIZE = 4096;
+ const INPUT_CHANNEL_COUNT = 2;
+ const OUTPUT_CHANNEL_COUNT = 2;
+ let creator = audioContext.createScriptProcessor || audioContext.createJavaScriptNode;
+ creator = creator.bind(audioContext);
+ return creator(BUFFER_SIZE,
+ INPUT_CHANNEL_COUNT, OUTPUT_CHANNEL_COUNT);
+ }
+
+ // stop sound recording
+ stopRecord() {
+ this.mediaStreams.getAudioTracks()[0].stop();
+ this.recorder.disconnect();
+ this.audioInput.disconnect();
+ }
+
+ // Play recording related functional components
+ mergeArray(list) {
+ let length = list.length * list[0].length;
+ let data = new Float32Array(length),
+ offset = 0;
+ for (let i = 0; i < list.length; i++) {
+ data.set(list[i], offset);
+ offset += list[i].length;
+ }
+ return data;
+ }
+
+ playRecord() {
+ let leftData = this.mergeArray(this.leftDataList);
+ let rightData = this.mergeArray(this.rightDataList);
+ let allData = this.interleaveLeftAndRight(leftData, rightData);
+ let blob = this.createWavFile(allData);
+ let _URL = window["URL"] || window["webkitURL"];
+ return _URL.createObjectURL(blob);
+ }
+
+ // Cross merge left and right channel data
+ interleaveLeftAndRight(left, right) {
+ let totalLength = left.length + right.length;
+ let data = new Float32Array(totalLength);
+ for (let i = 0; i < left.length; i++) {
+ let k = i * 2;
+ data[k] = left[i];
+ data[k + 1] = right[i];
+ }
+ return data;
+ }
+
+ createWavFile(audioData) {
+ const WAV_HEAD_SIZE = 44;
+ let buffer = new ArrayBuffer(audioData.length * 2 + WAV_HEAD_SIZE),
+ // need to use a view to manipulate the buffer
+ view = new DataView(buffer);
+ // Write wav header information
+ // Resource exchange file identifier
+ this.writeUTFBytes(view, 0, 'RIFF');
+ // The total number of bytes from the beginning of the next address to the end of the file is - 8
+ view.setUint32(4, 44 + audioData.length * 2, true);
+ // Wav file flag
+ this.writeUTFBytes(view, 8, 'WAVE');
+ // Waveform format flag
+ this.writeUTFBytes(view, 12, 'fmt ');
+ // Filter bytes, generally 0x10 = 16
+ view.setUint32(16, 16, true);
+ // sample format (raw)
+ view.setUint16(20, 1, true);
+ // stereo (2 channels)
+ view.setUint16(22, 2, true);
+ // sample rate
+ view.setUint32(24, 44100, true);
+ // byte rate (sample rate * block align)
+ view.setUint32(28, 44100 * 2, true);
+ // block align (channel count * bytes per sample)
+ view.setUint16(32, 2 * 2, true);
+ // bits per sample
+ view.setUint16(34, 16, true);
+ // data sub-chunk
+ // data chunk identifier
+ this.writeUTFBytes(view, 36, 'data');
+ // data chunk length
+ view.setUint32(40, audioData.length * 2, true);
+
+ // Write PCM data
+ let length = audioData.length;
+ let index = 44;
+ let volume = 1;
+ for (let i = 0; i < length; i++) {
+ view.setInt16(index, audioData[i] * (0x7FFF * volume), true);
+ index += 2;
+ }
+ return new Blob([new Uint8Array(buffer)], { type: 'audio/wav' });
+ }
+
+ writeUTFBytes(view, offset, string) {
+ var lng = string.length;
+ for (var i = 0; i < lng; i++) {
+ view.setUint8(offset + i, string.charCodeAt(i));
+ }
+ }
+} \ No newline at end of file
diff --git a/usecaseui-portal/src/app/views/onboard-vnf-vm/onboard-vnf-vm.component.html b/usecaseui-portal/src/app/views/onboard-vnf-vm/onboard-vnf-vm.component.html
index c48d68f9..34e78e60 100644
--- a/usecaseui-portal/src/app/views/onboard-vnf-vm/onboard-vnf-vm.component.html
+++ b/usecaseui-portal/src/app/views/onboard-vnf-vm/onboard-vnf-vm.component.html
@@ -16,108 +16,151 @@
<!-- tab -->
<nz-tabset [nzTabPosition]="'top'" [nzType]="'card'">
- <nz-tab *ngFor="let tab of tabs" [nzTitle]="tab" (nzClick)="handleTabChange(tab)"></nz-tab>
+ <nz-tab *ngFor="let tab of tabs" [nzTitle]="tab" (nzClick)="handleTabChange(tab)"></nz-tab>
</nz-tabset>
<div class="list">
- <!-- upload -->
- <div class="listUploadContainer">
- <div class="listupload">
- <nz-upload nzType="drag" [(nzFileList)]="fileList" [nzBeforeUpload]="beforeUpload">
- <p class="ant-upload-drag-icon">
- <i nz-icon type="inbox" class="anticon anticon-inbox"></i>
- </p>
- <p class="ant-upload-text"> {{"i18nTextDefine_Click_CSAR_File" | translate}} </p>
- <p class="ant-upload-hint"></p>
- </nz-upload>
- <button nz-button [nzLoading]="uploading" (click)="onClick()" [disabled]="fileList.length == 0" class="upload">
- {{ uploading ? 'Uploading' : 'Start Upload' }}
- </button>
- </div>
- <div class="listlin"></div>
- <div class="listfile">
- <div class="listFileTitle"> {{"i18nTextDefine_Uploaded_files" | translate}} </div>
- <div class="nouploadfile" [style.display]="display">{{"i18nTextDefine_Nofileuploading" | translate}}</div>
- <div class="listfilebgc" *ngIf="file">
- <i class="anticon anticon-link icon"></i>
- <div class="color" [ngClass]="{'progress':file.status}">{{file.name}}</div>
- <div class="color" *ngIf="file.status">
- <nz-progress [nzPercent]="file.progress" [nzShowInfo]="false"></nz-progress>
- </div>
- <div class="color" *ngIf="!file.status">
- <span *ngIf="file.success === 0">{{"i18nTextDefine_File_upload_completed" | translate}}</span>
- <span *ngIf="file.success === 1">{{"i18nTextDefine_File_upload_failed" | translate}}</span>
- </div>
- <div *ngIf="!file.status">
- <i class="anticon anticon-check-circle success" *ngIf="file.success === 0"></i>
- <i class="anticon anticon-exclamation-circle fail" *ngIf="file.success === 1"></i>
- </div>
- </div>
- </div>
- </div>
- <!-- table -->
- <nz-spin [nzSpinning]="isSpinning" class="listContainer">
- <div class="mask" *ngIf="isSpinning"></div>
- <nz-table #nzTable [nzData]="currentTab === 'NS'? nsTableData: (currentTab === 'VNF'? vnfTableData : pnfTableData)" nzShowSizeChanger [nzFrontPagination]="true"
- [nzShowQuickJumper]="true" [nzPageSizeOptions]="[5,10,15,20]" [(nzPageSize)]="pageSize"
- [(nzPageIndex)]='pageIndex' nzSize="middle">
- <thead>
- <tr class="theadColor">
- <th nzWidth="15%"> {{"i18nTextDefine_NO" | translate}} </th>
- <th nzWidth="15%"> {{"i18nTextDefine_Name" | translate}} </th>
- <th nzWidth="15%"> {{"i18nTextDefine_Version" | translate}} </th>
- <th nzWidth="15%"> {{"i18nTextDefine_OnboardingState" | translate}} </th>
- <th nzWidth="15%" *ngIf="currentTab !== 'PNF'"> {{"i18nTextDefine_OperationalState" | translate}} </th>
- <th nzWidth="10%"> {{"i18nTextDefine_UsageState" | translate}} </th>
- <th nzWidth="15%"> {{"i18nTextDefine_Operationbutton" | translate}} </th>
- </tr>
- </thead>
- <tbody *ngIf="currentTab === 'NS'">
- <tr *ngFor="let item of nzTable.data;let i = index;">
- <td>{{i+1}}</td>
- <td>{{item.nsdName || item.name }}</td>
- <td>{{item.nsdVersion || item.version}}</td>
- <td>{{item.nsdOnboardingState ? item.nsdOnboardingState : status}}</td>
- <td>{{item.nsdOperationalState}}</td>
- <td>{{item.nsdUsageState}}</td>
- <td>
- <i [ngClass]="{'cannotclick': isUpdate}"
- class="anticon anticon-upload upicon" #upload_icon (click)="updataService(item.uuid)"
- *ngIf="item.uuid"></i>
- <i class="anticon anticon-delete" (click)="showDeleteConfirm(item.id)"
- *ngIf="item.id"></i>
- </td>
- </tr>
- </tbody>
- <tbody *ngIf="currentTab === 'VNF'">
- <tr *ngFor="let item of nzTable.data;let i = index;">
- <td>{{i+1}}</td>
- <td>{{item.vnfProductName || item.name }}</td>
- <td>{{item.vnfdVersion || item.version}}</td>
- <td>{{item.onboardingState}}</td>
- <td>{{item.operationalState}}</td>
- <td>{{item.usageState}}</td>
- <td>
- <i [ngClass]="{'cannotclick': isUpdate}"
- class="anticon anticon-upload upicon" #upload_icon (click)="updataService(item.uuid)"
- *ngIf="item.uuid"></i>
- <i class="anticon anticon-delete" (click)="showDeleteConfirm(item.id)"
- *ngIf="item.id"></i>
- </td>
- </tr>
- </tbody>
- <tbody *ngIf="currentTab === 'PNF'" >
- <tr *ngFor="let item of nzTable.data; let i = index;">
- <td>{{i+1}}</td>
- <td>{{item.pnfdName}}</td>
- <td>{{item.pnfdVersion}}</td>
- <td>{{item.pnfdOnboardingState}}</td>
- <td>{{item.pnfdUsageState}}</td>
- <td>
- <i class="anticon anticon-delete" (click)="showDeleteConfirm(item.id)"></i>
- </td>
- </tr>
- </tbody>
- </nz-table>
- </nz-spin>
+ <!-- upload -->
+ <div class="listUploadContainer">
+ <div class="listupload">
+ <nz-upload nzType="drag" [(nzFileList)]="fileList" [nzBeforeUpload]="beforeUpload">
+ <p class="ant-upload-drag-icon">
+ <i nz-icon type="inbox" class="anticon anticon-inbox"></i>
+ </p>
+ <p class="ant-upload-text"> {{"i18nTextDefine_Click_CSAR_File" | translate}} </p>
+ <p class="ant-upload-hint"></p>
+ </nz-upload>
+ <button nz-button [nzLoading]="uploading" (click)="onClick()" [disabled]="fileList.length == 0" class="upload">
+ {{ uploading ? 'Uploading' : 'Start Upload' }}
+ </button>
+ </div>
+ <div class="listlin"></div>
+ <div class="listfile">
+ <div class="listFileTitle"> {{"i18nTextDefine_Uploaded_files" | translate}} </div>
+ <div class="nouploadfile" [style.display]="display">{{"i18nTextDefine_Nofileuploading" | translate}}</div>
+ <div class="listfilebgc" *ngIf="file">
+ <i class="anticon anticon-link icon"></i>
+ <div class="color" [ngClass]="{'progress':file.status}">{{file.name}}</div>
+ <div class="color" *ngIf="file.status">
+ <nz-progress [nzPercent]="file.progress" [nzShowInfo]="false"></nz-progress>
+ </div>
+ <div class="color" *ngIf="!file.status">
+ <span *ngIf="file.success === 0">{{"i18nTextDefine_File_upload_completed" | translate}}</span>
+ <span *ngIf="file.success === 1">{{"i18nTextDefine_File_upload_failed" | translate}}</span>
+ </div>
+ <div *ngIf="!file.status">
+ <i class="anticon anticon-check-circle success" *ngIf="file.success === 0"></i>
+ <i class="anticon anticon-exclamation-circle fail" *ngIf="file.success === 1"></i>
+ </div>
+ </div>
+ </div>
+ </div>
+ <!-- table -->
+ <nz-spin [nzSpinning]="isSpinning" class="listContainer">
+ <div class="mask" *ngIf="isSpinning"></div>
+ <nz-table
+ #nzTable
+ [nzData]="currentTab === 'NS'
+ ? nsTableData
+ : (currentTab === 'VNF'
+ ? vnfTableData
+ : (currentTab === 'PNF'
+ ? pnfTableData
+ : modelTableData
+ )
+ )"
+ nzShowSizeChanger
+ [nzFrontPagination]="true"
+ [nzShowQuickJumper]="true"
+ [nzPageSizeOptions]="[5,10,15,20]"
+ [(nzPageSize)]="pageSize"
+ [(nzPageIndex)]='pageIndex'
+ nzSize="middle"
+ >
+ <thead *ngIf="currentTab !== 'NLP Model Reource'">
+ <tr class="theadColor">
+ <th nzWidth="15%"> {{"i18nTextDefine_NO" | translate}} </th>
+ <th nzWidth="15%"> {{"i18nTextDefine_Name" | translate}} </th>
+ <th nzWidth="15%"> {{"i18nTextDefine_Version" | translate}} </th>
+ <th nzWidth="15%"> {{"i18nTextDefine_OnboardingState" | translate}} </th>
+ <th nzWidth="15%" *ngIf="currentTab !== 'PNF'"> {{"i18nTextDefine_OperationalState" | translate}} </th>
+ <th nzWidth="10%"> {{"i18nTextDefine_UsageState" | translate}} </th>
+ <th nzWidth="15%"> {{"i18nTextDefine_Operationbutton" | translate}} </th>
+ </tr>
+ </thead>
+ <thead *ngIf="currentTab === 'NLP Model Reource'">
+ <tr class="theadColor">
+ <th nzWidth="8%"> {{"i18nTextDefine_NO" | translate}} </th>
+ <th nzWidth="18%"> {{"i18nTextDefine_Name" | translate}} </th>
+ <th nzWidth="18%"> {{"i18nTextDefine_Size" | translate}} </th>
+ <th nzWidth="18%"> {{"i18nTextDefine_CreateTime" | translate}} </th>
+ <th nzWidth="18%"> {{"i18nTextDefine_Status" | translate}} </th>
+ <th nzWidth="20%"> {{"i18nTextDefine_Operation" | translate}} </th>
+ </tr>
+ </thead>
+ <tbody *ngIf="currentTab === 'NS'">
+ <tr *ngFor="let item of nzTable.data;let i = index;">
+ <td>{{i+1}}</td>
+ <td>{{item.nsdName || item.name }}</td>
+ <td>{{item.nsdVersion || item.version}}</td>
+ <td>{{item.nsdOnboardingState ? item.nsdOnboardingState : status}}</td>
+ <td>{{item.nsdOperationalState}}</td>
+ <td>{{item.nsdUsageState}}</td>
+ <td>
+ <i [ngClass]="{'cannotclick': isUpdate}"
+ class="anticon anticon-upload upicon" #upload_icon (click)="updataService(item.uuid)"
+ *ngIf="item.uuid"></i>
+ <i class="anticon anticon-delete" (click)="showDeleteConfirm(item.id)"
+ *ngIf="item.id"></i>
+ </td>
+ </tr>
+ </tbody>
+ <tbody *ngIf="currentTab === 'VNF'">
+ <tr *ngFor="let item of nzTable.data;let i = index;">
+ <td>{{i+1}}</td>
+ <td>{{item.vnfProductName || item.name }}</td>
+ <td>{{item.vnfdVersion || item.version}}</td>
+ <td>{{item.onboardingState}}</td>
+ <td>{{item.operationalState}}</td>
+ <td>{{item.usageState}}</td>
+ <td>
+ <i [ngClass]="{'cannotclick': isUpdate}"
+ class="anticon anticon-upload upicon" #upload_icon (click)="updataService(item.uuid)"
+ *ngIf="item.uuid"></i>
+ <i class="anticon anticon-delete" (click)="showDeleteConfirm(item.id)"
+ *ngIf="item.id"></i>
+ </td>
+ </tr>
+ </tbody>
+ <tbody *ngIf="currentTab === 'PNF'" >
+ <tr *ngFor="let item of nzTable.data; let i = index;">
+ <td>{{i+1}}</td>
+ <td>{{item.pnfdName}}</td>
+ <td>{{item.pnfdVersion}}</td>
+ <td>{{item.pnfdOnboardingState}}</td>
+ <td>{{item.pnfdUsageState}}</td>
+ <td>
+ <i class="anticon anticon-delete" (click)="showDeleteConfirm(item.id)"></i>
+ </td>
+ </tr>
+ </tbody>
+ <tbody *ngIf="currentTab === 'NLP Model Reource'">
+ <tr *ngFor="let item of nzTable.data;let i = index;">
+ <td>{{i+1}}</td>
+ <td>{{item.modelName}}</td>
+ <td>{{item.size}}</td>
+ <td>{{item.createTime}}</td>
+ <td>{{item.active ? 'Active' : 'Inactive'}}</td>
+ <td>
+ <button nz-button nzType="primary" class="buy-button" (click)="showDeleteConfirm(item.id)">
+ Delete
+ </button>
+ <button nz-button nzType="primary" class="buy-button" (click)="activedModelFile(item)">
+ Actived
+ </button>
+ </td>
+ </tr>
+ </tbody>
+ </nz-table>
+ </nz-spin>
</div>
<app-notification #notification [isServicesList]="false"></app-notification> \ No newline at end of file
diff --git a/usecaseui-portal/src/app/views/onboard-vnf-vm/onboard-vnf-vm.component.ts b/usecaseui-portal/src/app/views/onboard-vnf-vm/onboard-vnf-vm.component.ts
index 98f40637..0a25f2b1 100644
--- a/usecaseui-portal/src/app/views/onboard-vnf-vm/onboard-vnf-vm.component.ts
+++ b/usecaseui-portal/src/app/views/onboard-vnf-vm/onboard-vnf-vm.component.ts
@@ -31,7 +31,7 @@ export class OnboardVnfVmComponent implements OnInit {
@ViewChild('notification') notification: any;
// upload
- tabs: string[] = ['NS', 'VNF', 'PNF'];
+ tabs: string[] = ['NS', 'VNF', 'PNF', 'NLP Model Reource'];
currentTab: string = 'NS'
fileList: UploadFile[] = [];
uploading: boolean = false;
@@ -43,6 +43,7 @@ export class OnboardVnfVmComponent implements OnInit {
nsTableData: any[];
vnfTableData: any[];
pnfTableData: any[];
+ modelTableData: any[];
status: string = "Onboard Available";
pageIndex: number = 1;
pageSize: number = 10;
@@ -55,7 +56,8 @@ export class OnboardVnfVmComponent implements OnInit {
url = {
ns: '/api/nsd/v1/ns_descriptors/*_*/nsd_content',
vnf: '/api/vnfpkgm/v1/vnf_packages/*_*/package_content',
- pnf: '/api/nsd/v1/pnf_descriptors/*_*/pnfd_content'
+ pnf: '/api/nsd/v1/pnf_descriptors/*_*/pnfd_content',
+ model: '/api/usecaseui-server/v1/intent/uploadModel'
};
file: {
@@ -94,6 +96,9 @@ export class OnboardVnfVmComponent implements OnInit {
case 'PNF':
this.getTablePnfData()
break
+ case 'NLP Model Reource':
+ this.getTableModelData();
+ break
}
}
@@ -113,8 +118,10 @@ export class OnboardVnfVmComponent implements OnInit {
API = 'createNetworkServiceData';
} else if (this.currentTab === 'VNF') {
API = 'createVnfData';
- } else {
+ } else if (this.currentTab === 'PNF') {
API = 'createPnfData';
+ } else {
+ return false;
}
this.myhttp.getCreatensData(API, this.requestBody)//on-line
.subscribe((data) => {
@@ -128,8 +135,58 @@ export class OnboardVnfVmComponent implements OnInit {
// Drag and drop and click the upload button
onClick(): void {
this.display = 'none';
- let tab = this.currentTab === 'NS' ? 'ns' : (this.currentTab === 'VNF' ? 'vnf' : 'pnf')
- this.handleUpload(this.url[tab].replace("*_*", this.infoId));
+ let tab = this.currentTab === 'NS' ? 'ns' : (this.currentTab === 'VNF' ? 'vnf' : (this.currentTab === 'PNF' ? 'pnf' : 'model'));
+ let url = tab === "model" ? this.url[tab] : this.url[tab].replace("*_*", this.infoId);
+ tab === "model" ? this.handleUploadModel(url) : this.handleUpload(url);
+ }
+
+ handleUploadModel(url: string): void {
+ const formData = new FormData();
+ // tslint:disable-next-line:no-any
+ this.fileList.forEach((file: any) => {
+ formData.set('file', file);
+ });
+ this.uploading = true;
+ this.file = {
+ name: this.fileList[0].name,
+ uid: this.fileList[0].uid,
+ progress: 0,
+ status: true,
+ success: 0
+ };
+ let requery = (file) => {
+ file.progress += 3;
+ setTimeout(() => {
+ if (file.progress < 100) {
+ requery(file)
+ }
+ }, 100)
+ };
+ requery(this.file);
+ const req = new HttpRequest('POST', url, formData, {
+ reportProgress: true,
+ withCredentials: true
+ });
+ //Upload pre-empty array
+ this.fileList = [];
+ this.http.request(req)
+ .pipe(filter(e => e instanceof HttpResponse))
+ .subscribe(
+ (event: {}) => {
+ this.file.progress = 100;
+ this.file.status = false;
+ this.uploading = false;
+ this.msg.success('upload successfully.');
+ this.getTableModelData();
+ },
+ err => {
+ this.file.progress = 100;
+ this.file.status = false;
+ this.file.success = 1;
+ this.uploading = false;
+ this.msg.error('upload failed.');
+ }
+ );
}
handleUpload(url: string): void {
@@ -244,6 +301,22 @@ export class OnboardVnfVmComponent implements OnInit {
})
}
+ // Get Model list
+ getTableModelData() {
+ this.isSpinning = true;
+ this.myhttp.getOnboardTableModelData()
+ .subscribe((data) => {
+ data.forEach(element => {
+ element['size'] = `${element['size']}K`;
+ })
+ this.modelTableData = data;
+ this.isSpinning = false; //loading hide
+ }, (err) => {
+ console.error(err);
+ this.isSpinning = false;
+ })
+ }
+
// confirm
showConfirm(requestBody: object, id: string): void {
let API = this.currentTab === 'NS' ? 'getNsonboard' : 'getVnfonboard';
@@ -333,17 +406,20 @@ export class OnboardVnfVmComponent implements OnInit {
API = 'deleteNsIdData';
} else if (this.currentTab === 'VNF') {
API = 'deleteVnfIdData';
- } else {
+ } else if (this.currentTab === 'PNF') {
API = 'deletePnfIdData';
+ } else {
+ API = 'deleteModelIdData';
}
this.myhttp[API](pkgid)
.subscribe((data) => {
resolve()
- if(data.status === 'FAILED'){
- this.notification.notificationFailed(this.currentTab, 'delete', pkgid);
- }else {
- this.notification.notificationSuccess(this.currentTab, 'delete', pkgid);
- }
+ let tipTitle = this.currentTab === 'NLP Model Reource' ? 'MODELREOURCE' : this.currentTab
+ if(data.status === 'FAILED'){
+ this.notification.notificationFailed(tipTitle, 'delete', pkgid);
+ }else {
+ this.notification.notificationSuccess(tipTitle, 'delete', pkgid);
+ }
//refresh list after successful deletion
switch (this.currentTab) {
case 'NS':
@@ -355,10 +431,30 @@ export class OnboardVnfVmComponent implements OnInit {
case 'PNF':
this.getTablePnfData();
break
+ case 'NLP Model Reource':
+ this.getTableModelData();
+ break
}
}, (err) => {
console.log(err);
this.notification.notificationFailed(this.currentTab, 'delete', pkgid);
})
}
+
+ // Actived Model Resource
+ activedModelFile(data) {
+ console.log('actived model');
+ let url = `/api/usecaseui-server/v1/intent/activeModel?modelId=${data.id}`;
+ this.myhttp.getOnboardTableActiveModelData(url)
+ .subscribe((data) => {
+ if(data.status === 'FAILED'){
+ this.msg.success('Actived Failed');
+ return;
+ }
+ this.msg.success('Actived Successfully');
+ this.getTableModelData();
+ }, (err) => {
+ console.error(err);
+ });
+ }
}
diff --git a/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/business-order/business-order.component.ts b/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/business-order/business-order.component.ts
index 2418c904..693d6487 100644
--- a/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/business-order/business-order.component.ts
+++ b/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/business-order/business-order.component.ts
@@ -19,17 +19,26 @@ export class BusinessOrderComponent implements OnInit {
ngOnInit() {}
ngOnChanges() {
- this.AreaFormatting();
+ let areaList = ["Beijing;Beijing;Haidian District;Wanshoulu Street"];
+ if (this.modelParams && this.showModel) {
+ this.slicing_order_info = {...this.modelParams};
+ if (this.slicing_order_info.coverageArea) {
+ areaList = [];
+ areaList.push(this.slicing_order_info.coverageArea.split(" ").join(";"));
+ }
+ }
+ this.AreaFormatting(areaList);
}
- detailFn(flag){
+ detailFn(flag){
COMMUNICATION_FORM_ITEMS.forEach((item, index) => {
- if(item.key=='coverageAreaNumber'){
- item["coverflag"] = flag == true ? false:true
- }
+ if(item.key=='coverageAreaNumber'){
+ item["coverflag"] = flag == true ? false:true
+ }
})
}
- @Input() showModel: boolean;
+ @Input() showModel: boolean;
+ @Input() modelParams: any;
@Output() cancel = new EventEmitter<boolean>();
comunicationFormItems = COMMUNICATION_FORM_ITEMS;
slicing_order_info = {
@@ -47,9 +56,8 @@ export class BusinessOrderComponent implements OnInit {
validateRulesShow: any[] = [];
rulesText: any[] = [];
areaLevel: number = 4;
- masktext: string = MASKTEXT ;
- AreaFormatting(): void {
- let areaList = ["Beijing;Beijing;Haidian District;Wanshoulu Street"];
+ masktext: string = MASKTEXT ;
+ AreaFormatting(areaList): void {
this.areaList = areaList.map((item: any) => {
let arr = item.split(";");
item = arr.map((it, index) => {
diff --git a/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/csmf-slicing-business-management.component.html b/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/csmf-slicing-business-management.component.html
index 6b43a8af..f229d7cf 100644
--- a/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/csmf-slicing-business-management.component.html
+++ b/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/csmf-slicing-business-management.component.html
@@ -8,6 +8,7 @@
</nz-select>
</div>
<button nz-button nzType="primary" class="buy-button" (click)="OrderModelShow()">Create</button>
+ <button nz-button nzType="primary" class="buy-button" (click)="inputOrderModelShow()">Smart Create</button>
</div>
<div class="slicing-resource-table-list">
<nz-table #basicTable [nzData]="listOfData" [nzFrontPagination]="false" nzShowSizeChanger
@@ -68,5 +69,6 @@
</tbody>
</nz-table>
</div>
- <app-business-order [showModel]="businessOrderShow" (cancel)="orderModelClose($event)"></app-business-order>
+ <app-input-business-order [showModel]="inputBusinessOrderShow" (modalOpreation)="inputOrderModelClose($event)"></app-input-business-order>
+ <app-business-order [modelParams]="orderForm" [showModel]="businessOrderShow" (cancel)="orderModelClose($event)"></app-business-order>
</div> \ No newline at end of file
diff --git a/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/csmf-slicing-business-management.component.ts b/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/csmf-slicing-business-management.component.ts
index a0a96b3f..6eb5e936 100644
--- a/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/csmf-slicing-business-management.component.ts
+++ b/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/csmf-slicing-business-management.component.ts
@@ -47,7 +47,9 @@ export class CsmfSlicingBusinessManagementComponent implements OnInit {
statusOptions: any[] = BUSINESS_STATUS;
progressingTimer: any[] = [];
terminateStart: any[] = [];
- businessOrderShow: boolean = false;
+ businessOrderShow: boolean = false;
+ inputBusinessOrderShow: boolean = false;
+ orderForm: any;
getCSMFBusinessList(): void {
this.loading = true;
// this.listOfData = []; //solve the problem of blank screen after each operation
@@ -232,10 +234,22 @@ export class CsmfSlicingBusinessManagementComponent implements OnInit {
}
OrderModelShow(): void {
- this.businessOrderShow = true;
+ this.orderForm = null;
+ this.businessOrderShow = true;
}
orderModelClose($event: any): void {
- this.businessOrderShow = $event;
- this.getCSMFBusinessList();
- }
+ this.businessOrderShow = $event;
+ this.getCSMFBusinessList();
+ }
+ inputOrderModelShow(): void {
+ this.inputBusinessOrderShow = true;
+ }
+ inputOrderModelClose($event: any): void {
+ this.inputBusinessOrderShow = false;
+ if ($event.cancel) {
+ return;
+ }
+ this.orderForm = $event.param;
+ this.businessOrderShow = true;
+ }
}
diff --git a/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/input-business-order/input-business-order.component.html b/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/input-business-order/input-business-order.component.html
new file mode 100644
index 00000000..a448f3e0
--- /dev/null
+++ b/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/input-business-order/input-business-order.component.html
@@ -0,0 +1,38 @@
+<nz-spin nzTip='Loading...' [nzSpinning]="isSpinning">
+ <nz-modal [(nzVisible)]="showModel" nzTitle="Communication Service Message" (nzOnCancel)="handleCancel()"
+ (nzOnOk)="handleOk()" nzWidth="450px" nzHeight="600px">
+ <div class="subnet_params_container">
+ <nz-radio-group [(ngModel)]="radioValue">
+ <label nz-radio nzValue="text">Text Input</label>
+ <label nz-radio nzValue="audio">Audio Input</label>
+ </nz-radio-group>
+ <form nz-form *ngIf='radioValue === "text"' class='text-form-class'>
+ <nz-form-item>
+ <nz-form-control [nzSpan]="24">
+ <textarea [id]="communicationMessage" nz-tooltip
+ [ngClass]="{'error-input-border':validateRulesShow[0] === true}" nz-input
+ placeholder="Please input communicationMessage" [nzAutosize]="{ minRows: 6, maxRows: 6 }"
+ [(ngModel)]="communicationMessage" name="communicationMessage"
+ (blur)="this.Util.validator('communicationMessage','communicationMessage',communicationMessage,0,rulesText,validateRulesShow)">
+ </textarea>
+ <nz-form-explain *ngIf="validateRulesShow[0]" class="validateRules">{{rulesText[0]}}
+ </nz-form-explain>
+ </nz-form-control>
+ </nz-form-item>
+ </form>
+ <div *ngIf='radioValue === "audio"' class="audio_class">
+ <div class="recode_class">
+ <span>Sound Recording: </span>
+ <i *ngIf='!isPlay' class="anticon anticon-play-circle-o audioBtn" (click)="startAudio()"></i>
+ <i *ngIf='isPlay' class="anticon anticon-pause-circle-o audioBtn" (click)="stopAudio()"></i>
+
+ </div>
+ <div class="play_class">
+ <span>Audition: </span>
+ <button (click)="playAudio()">Click To Play</button>
+ <audio class="audio-node" id="audio_id" autoplay></audio>
+ </div>
+ </div>
+ </div>
+ </nz-modal>
+</nz-spin>
diff --git a/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/input-business-order/input-business-order.component.less b/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/input-business-order/input-business-order.component.less
new file mode 100644
index 00000000..025518f4
--- /dev/null
+++ b/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/input-business-order/input-business-order.component.less
@@ -0,0 +1,50 @@
+.subnet_params_container{
+ padding-left: 3%;
+ .subnet_params_area{
+ margin-right: 5px;
+ }
+ .ant-btn-icon-only{
+ padding: 0 5px !important;
+ }
+ .subnet_params_button{
+ margin-top: 7px;
+ margin-left: 10px;
+ }
+ .subnet_params_icon{
+ font-size: 14px;
+ }
+ .audio_class{
+ height: 130px;
+ .recode_class{
+ margin-top: 30px;
+ position: relative;
+ span{
+ font-size: 26px;
+ }
+ .audioBtn{
+ font-size: 27px;
+ position: absolute;
+ top: 10px;
+ left: 217px;
+ }
+ .anticon-pause-circle-o{
+ color: red;
+ }
+ }
+ .play_class{
+ font-size: 26px;
+ margin-top: 20px;
+ }
+ }
+}
+.ant-form-item {
+ margin-top: 20px;
+ margin-bottom: -5px;
+}
+
+.validateRules{
+ color: red;
+}
+.error-input-border{
+ border-color: red!important;
+} \ No newline at end of file
diff --git a/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/input-business-order/input-business-order.component.spec.ts b/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/input-business-order/input-business-order.component.spec.ts
new file mode 100644
index 00000000..ffdd130f
--- /dev/null
+++ b/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/input-business-order/input-business-order.component.spec.ts
@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { InputBusinessOrderComponent } from './input-business-order.component';
+
+describe('InputBusinessOrderComponent', () => {
+ let component: InputBusinessOrderComponent;
+ let fixture: ComponentFixture<InputBusinessOrderComponent>;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [ InputBusinessOrderComponent ]
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(InputBusinessOrderComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/input-business-order/input-business-order.component.ts b/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/input-business-order/input-business-order.component.ts
new file mode 100644
index 00000000..3196bbba
--- /dev/null
+++ b/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/input-business-order/input-business-order.component.ts
@@ -0,0 +1,101 @@
+import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core';
+import { Util } from '../../../../../shared/utils/utils';
+import { onboardService } from '../../../../../core/services/onboard.service';
+import { Recorder } from '../../../../../shared/utils/recorder';
+
+@Component({
+ selector: 'app-input-business-order',
+ templateUrl: './input-business-order.component.html',
+ styleUrls: ['./input-business-order.component.less']
+})
+export class InputBusinessOrderComponent implements OnInit {
+
+ constructor(private Util: Util, private Recorder: Recorder, private myhttp: onboardService) { }
+
+ @Input() showModel: boolean;
+ @Output() modalOpreation = new EventEmitter();
+ isSpinning: boolean = false;
+ communicationMessage: String = "";
+ validateRulesShow: any[] = [];
+ rulesText: any[] = [];
+ radioValue: String = 'text';
+ isPlay: boolean = false;
+ clickRepeat: boolean = false;
+
+ ngOnInit() {
+ this.validateRulesShow = [];
+ this.rulesText = [];
+ this.communicationMessage = '';
+ }
+
+ ngOnChange() {
+ }
+
+ handleCancel(): void {
+ this.showModel = false;
+ this.communicationMessage = "";
+ this.modalOpreation.emit({ "cancel": true });
+ }
+
+ handleOk(): void {
+ if (this.clickRepeat) {
+ return;
+ }
+ this.clickRepeat = true;
+ if (this.radioValue === "text") {
+ this.submitFormMessage();
+ return;
+ }
+ this.clickRepeat = false;
+ this.communicationMessage = "";
+ this.showModel = false;
+ let defaultParams = {
+ coverageArea: "Beijing Beijing Haiding Wanshoulu",
+ expDataRateDL: "1000",
+ expDataRateUL: "1000",
+ latency: "10",
+ maxNumberofUEs: "10",
+ name: "exclusive slicing service",
+ resourceSharingLevel: "shared",
+ uEMobilityLevel: "stationary"
+ }
+ this.modalOpreation.emit({ "cancel": false, "param": defaultParams });
+ }
+ submitFormMessage(): void {
+ this.Util.validator("communicationMessage", "communicationMessage", this.communicationMessage, 0, this.rulesText, this.validateRulesShow);
+ if (this.validateRulesShow.indexOf(true) > -1) {
+ this.clickRepeat = false;
+ return
+ }
+ let params = {
+     "title": "predict",
+     "text": this.communicationMessage
+ };
+ this.myhttp["analysisInputText"](params)
+ .subscribe((data) => {
+ this.clickRepeat = false;
+ if (data === 0) {
+ return;
+ }
+ let orderForm = { ...data };
+ this.communicationMessage = "";
+ this.showModel = false;
+ this.modalOpreation.emit({ "cancel": false, "param": orderForm });
+ }, (err) => {
+ this.clickRepeat = false;
+ console.log(err);
+ })
+ }
+ startAudio(): void {
+ this.isPlay = true;
+ this.Recorder.beforeStartRecord();
+ }
+ stopAudio(): void {
+ this.isPlay = false;
+ this.Recorder.stopRecord();
+ }
+ playAudio(): void {
+ let audio = document.querySelector('audio');
+ audio["src"] = this.Recorder.playRecord();
+ }
+}