summaryrefslogtreecommitdiffstats
path: root/usecaseui-portal/src/app/views
diff options
context:
space:
mode:
Diffstat (limited to 'usecaseui-portal/src/app/views')
-rw-r--r--usecaseui-portal/src/app/views/robot/robot.component.html21
-rw-r--r--usecaseui-portal/src/app/views/robot/robot.component.less91
-rw-r--r--usecaseui-portal/src/app/views/robot/robot.component.ts35
3 files changed, 147 insertions, 0 deletions
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');
+ });
+ }
+}