6 files changed, 165 insertions, 1 deletions
diff --git a/usecaseui-portal/src/app/app-routing.module.ts b/usecaseui-portal/src/app/app-routing.module.ts
index 9c9235f4..ed744106 100644
--- a/usecaseui-portal/src/app/app-routing.module.ts
+++ b/usecaseui-portal/src/app/app-routing.module.ts
@@ -36,6 +36,7 @@ import { MonitorServiceComponent } from './views/services/sotn-management/monito
 import { OrderServiceComponent } from './views/services/sotn-management/order-service/order-service.component';
 import { SotnManagementComponent } from './views/services/sotn-management/sotn-management.component';
 import { IntentManagementComponent } from './views/intent-management/intent-management.component';
+import { RobotComponent } from './views/robot/robot.component';
 
 
 
@@ -71,7 +72,8 @@ const routes: Routes = [
   { path: 'network/ccvpn-network', component: CcvpnNetworkComponent },
   { path: 'network/mdons-network', component: MdonsNetworkComponent },
   { path: 'intent-management', component:IntentManagementComponent},
-  { path: '**', redirectTo: 'home', pathMatch: 'full' }
+  { path: 'robot', component: RobotComponent }
+  //{ path: '**', redirectTo: 'home', pathMatch: 'full' }
 ];
 
 @NgModule({
diff --git a/usecaseui-portal/src/app/app.component.html b/usecaseui-portal/src/app/app.component.html
index cb4c9f7d..c965d18b 100644
--- a/usecaseui-portal/src/app/app.component.html
+++ b/usecaseui-portal/src/app/app.component.html
@@ -142,6 +142,19 @@
           </span>
         </a>
       </li>
+                 <!-- robot -->
+      <li nz-menu-item [ngClass]="{'activeMenuBar': url === 'robot'}">
+        <a routerLink="robot">
+          <span title>
+            <i>
+              <img
+                src="{{url === 'robot' ? 'assets/images/robot-active.png':'assets/images/robot-hui.png'}}"
+                alt="home">
+            </i>
+            <span>{{"i18nTextDefine_robot" | translate}} </span>
+          </span>
+        </a>
+      </li>
       <hr>
     </ul>
   </nz-sider>
diff --git a/usecaseui-portal/src/app/app.module.ts b/usecaseui-portal/src/app/app.module.ts
index 965ffa10..852c6660 100644
--- a/usecaseui-portal/src/app/app.module.ts
+++ b/usecaseui-portal/src/app/app.module.ts
@@ -116,6 +116,7 @@ import { InputIntentStateComponent } from './views/intent-management/input-inten
 import { InputIntentConditionComponent } from './views/intent-management/input-intent-condition/input-intent-condition.component';
 import { IntentReportDetailComponent } from './views/intent-management/intent-report-detail/intent-report-detail.component';
 import { AngularDateTimePickerModule } from 'angular2-datetimepicker';
+import { RobotComponent } from './views/robot/robot.component';
 
 export function HttpLoaderFactory(httpClient: HttpClient) {
 	return new TranslateHttpLoader(httpClient, "./assets/i18n/", ".json");
@@ -221,6 +222,7 @@ registerLocaleData(en);
 		InputIntentStateComponent,
 		InputIntentConditionComponent,
 		IntentReportDetailComponent,
+		RobotComponent
 	],
 	imports: [
 		BrowserModule,
diff --git a/usecaseui-portal/src/app/views/robot/robot.component.html b/usecaseui-portal/src/app/views/robot/robot.component.html
new file mode 100644
index 00000000..38363a8a
--- /dev/null
+++ b/usecaseui-portal/src/app/views/robot/robot.component.html
@@ -0,0 +1,21 @@
+<body >
+<div class="chat-container">
+    <div *ngFor="let chat of chatHistory">
+      <div class="question">
+          <img src="assets/images/user.png">
+          <span>{{ chat.question }}</span>
+      </div>
+        <br>
+        <div class="answer"><img src="assets/images/answer.png">
+            <span>{{ chat.answer }}</span>
+        </div>
+        <br>
+    </div>
+</div>
+<div class="input-wrapper">
+  <textarea nz-tooltip nz-input [nzAutosize]="{ minRows: 2, maxRows: 2 }" [(ngModel)]="question" class="text-input"></textarea>
+  <i class="icon" (click)="submitQuestion()">
+      <img src="assets/images/send.png">
+  </i>
+</div>
+</body>
+\ No newline at end of file
diff --git a/usecaseui-portal/src/app/views/robot/robot.component.less b/usecaseui-portal/src/app/views/robot/robot.component.less
new file mode 100644
index 00000000..be02efd8
--- /dev/null
+++ b/usecaseui-portal/src/app/views/robot/robot.component.less
@@ -0,0 +1,91 @@
+body {
+  background-color: #e6e6fa;
+  width: 100%;
+  margin: 0;
+  padding: 0;
+  min-height: 100vh;
+  display: flex;
+  flex-direction: column;
+}
+.chat-container {
+  margin: 20px 0;
+  padding: 0 100px;
+}
+.question {
+  display: flex;
+}
+.record-input{
+  margin-left: 10px;
+  resize: none;
+}
+.question span {
+  background-color: white;
+  font-size: 16px;
+  margin-left: 10px;
+  padding: 10px;
+  border-radius: 8px;
+}
+.question img {
+  width: 28px;
+  height: 28px;
+}
+
+.answer {
+  display: flex;
+}
+.answer span{
+  background-color: white;
+  font-size: 16px;
+  margin-left: 10px;
+  padding: 10px;
+  border-radius: 8px;
+  white-space: pre-line;
+}
+.answer img {
+  width: 28px;
+  height: 28px;
+}
+
+.chat-input {
+    margin-top: 30px;
+    padding-left: 1100px;
+}
+
+.input-wrapper {
+  display: flex;
+  justify-content: space-around;
+  width: e("calc(100% - 240px)");
+  margin: 0 100px;
+  margin-left: 138px;
+  padding: 10px;
+  background: #fff;
+  border-radius: 8px;
+  border: 2px solid #8a2be2;
+}
+
+.text-input {
+  width: e("calc(100% - 50px)");
+  background-color: white;
+  color: black;
+  text-align: left;
+  border: 0;
+  resize: none;
+
+  &:focus {
+    border: 0 !important;
+    box-shadow: none;
+  }
+}
+
+.icon {
+  width: 50px;
+  height: 50px;
+  cursor: pointer;
+
+  >img {
+    width: 35px;
+    height: 31px;
+    margin-top: 15px;
+    margin-left: 15px;
+  }
+}
diff --git a/usecaseui-portal/src/app/views/robot/robot.component.ts b/usecaseui-portal/src/app/views/robot/robot.component.ts
new file mode 100644
index 00000000..5304e876
--- /dev/null
+++ b/usecaseui-portal/src/app/views/robot/robot.component.ts
@@ -0,0 +1,35 @@
+import { Component, OnInit } from '@angular/core';
+import { NzMessageService } from 'ng-zorro-antd';
+import { HttpClient } from '@angular/common/http';
+
+@Component({
+  selector: 'app-robot',
+  templateUrl: './robot.component.html',
+  styleUrls: ['./robot.component.less']
+})
+export class RobotComponent implements OnInit {
+
+  question: string;
+  communicationMessage: string;
+  chatHistory: { question: string, answer: string }[] = [];
+  apiUrl = '/api/usecaseui-llm-adaptation/v1/getHelper';
+
+  constructor(
+  private http: HttpClient,
+  private message: NzMessageService
+  ) { }
+  ngOnInit() {}
+
+   submitQuestion() {
+    this.http.post<any>(this.apiUrl,this.question,{ responseType: 'text' as 'json'}).subscribe((data) => {
+       if(data==''){
+          this.chatHistory.push({ question: this.question, answer: 'network error' });
+       }else{
+        this.chatHistory.push({ question: this.question, answer: data });
+       }
+        this.question = '';
+      }, error => {
+        this.message.error('error');
+      });
+  }
+}