feat: add intent based service

Signed-off-by: liuwh7 <liuwh7@asiainfo.com>
Change-Id: If63eb5e61f01751771ad090728f33214077edd6f
Issue-ID: USECASEUI-605

4 files changed, 210 insertions, 0 deletions

diff --git a/usecaseui-portal/src/app/views/services/intent-based-services/smart-cloud-leased-modal/smart-cloud-leased-modal.component.html b/usecaseui-portal/src/app/views/services/intent-based-services/smart-cloud-leased-modal/smart-cloud-leased-modal.component.html
new file mode 100644
index 00000000..2ad1cea2
--- /dev/null
+++ b/usecaseui-portal/src/app/views/services/intent-based-services/smart-cloud-leased-modal/smart-cloud-leased-modal.component.html
@@ -0,0 +1,42 @@
+<nz-modal
+  [(nzVisible)]="samrtCloudLeasedLineShowFlag"
+  nzTitle="Create Cloud Leased Line"
+  (nzOnCancel)="handleCancel(true)"
+  (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 nz-button nzType="default" [disabled]='isDisable' (click)="playAudio()">Click To Play</button>
+        <audio class="audio-node" id="audio_id" autoplay></audio>
+      </div>
+    </div>
+  </div>
+</nz-modal>
diff --git a/usecaseui-portal/src/app/views/services/intent-based-services/smart-cloud-leased-modal/smart-cloud-leased-modal.component.less b/usecaseui-portal/src/app/views/services/intent-based-services/smart-cloud-leased-modal/smart-cloud-leased-modal.component.less
new file mode 100644
index 00000000..50d3af28
--- /dev/null
+++ b/usecaseui-portal/src/app/views/services/intent-based-services/smart-cloud-leased-modal/smart-cloud-leased-modal.component.less
@@ -0,0 +1,53 @@
+.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: 17px;
+      }
+      .audioBtn{
+        font-size: 20px;
+        position: absolute;
+        top: 5px;
+        left: 142px;
+      }
+      .anticon-pause-circle-o{
+        color: red;
+      }
+    }
+    .play_class{
+      font-size: 17px;
+      margin-top: 20px;
+      button {
+        margin-left: 2px;
+      }
+    }
+  }
+}
+.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/intent-based-services/smart-cloud-leased-modal/smart-cloud-leased-modal.component.spec.ts b/usecaseui-portal/src/app/views/services/intent-based-services/smart-cloud-leased-modal/smart-cloud-leased-modal.component.spec.ts
new file mode 100644
index 00000000..ffdd130f
--- /dev/null
+++ b/usecaseui-portal/src/app/views/services/intent-based-services/smart-cloud-leased-modal/smart-cloud-leased-modal.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/intent-based-services/smart-cloud-leased-modal/smart-cloud-leased-modal.component.ts b/usecaseui-portal/src/app/views/services/intent-based-services/smart-cloud-leased-modal/smart-cloud-leased-modal.component.ts
new file mode 100644
index 00000000..014a1c4c
--- /dev/null
+++ b/usecaseui-portal/src/app/views/services/intent-based-services/smart-cloud-leased-modal/smart-cloud-leased-modal.component.ts
@@ -0,0 +1,90 @@
+import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
+import { NzMessageService } from 'ng-zorro-antd';
+import { intentBaseService } from '../../../../core/services/intentBase.service';
+import { Recorder } from '../../../../shared/utils/recorder';
+import { Util } from '../../../../shared/utils/utils';
+
+@Component({
+  selector: 'app-smart-cloud-leased-modal',
+  templateUrl: './smart-cloud-leased-modal.component.html',
+  styleUrls: ['./smart-cloud-leased-modal.component.less']
+})
+export class SmartCloudLeasedModalComponent implements OnInit {
+
+  constructor(
+    private Util: Util,
+    private Recorder: Recorder,
+    private myhttp: intentBaseService,
+    private msg: NzMessageService
+  ) {}
+  
+  @Input() samrtCloudLeasedLineShowFlag: boolean;
+  @Output() resolveEmitter = new EventEmitter();
+
+  communicationMessage: String = "";
+  validateRulesShow: any[] = [];
+  rulesText: any[] = [];
+  radioValue: String = 'text';
+  isPlay: boolean = false;
+  clickRepeat: boolean = false;
+  isDisable: boolean = true;
+  
+  ngOnInit() {
+    this.validateRulesShow = [];
+    this.rulesText = [];
+    this.communicationMessage = '';
+  }
+
+  ngOnChange() {}
+
+  handleCancel(flag): void {
+    this.samrtCloudLeasedLineShowFlag = false;
+    this.communicationMessage = "";
+    this.resolveEmitter.emit({ "cancel": flag });
+  }
+
+  handleOk(): void {
+    if (this.radioValue === 'text') {
+      this.submitFormMessage();
+      return;
+    }
+    
+  }
+
+  submitFormAudio() {
+    this.handleCancel(false);
+  }
+
+  submitFormMessage(): void {
+    let params = {
+      "title": "predict",
+      "text": this.communicationMessage
+    };
+    this.myhttp.intentInstancePredict(params).subscribe(
+      (response) => {
+        console.log(response);
+        this.handleCancel(false);
+      },
+      (err) => {
+        console.log(err);
+      }
+    )
+  }
+
+  startAudio(): void {
+    this.isPlay = true;
+    this.isDisable = true;
+    this.Recorder.beforeStartRecord();
+  }
+
+  stopAudio(): void {
+    this.isPlay = false;
+    this.isDisable = false;
+    this.Recorder.stopRecord();
+  }
+
+  playAudio(): void {
+    let audio = document.querySelector('audio');
+    audio["src"] = this.Recorder.playRecord();
+  }
+}