summaryrefslogtreecommitdiffstats
path: root/usecaseui-portal/src/app/views/maas
diff options
context:
space:
mode:
Diffstat (limited to 'usecaseui-portal/src/app/views/maas')
-rw-r--r--usecaseui-portal/src/app/views/maas/build/application-management.component.html34
-rw-r--r--usecaseui-portal/src/app/views/maas/build/application-management.component.less8
-rw-r--r--usecaseui-portal/src/app/views/maas/build/application-management.component.ts4
-rw-r--r--usecaseui-portal/src/app/views/maas/knowledge-base-management/knowledge-base-management.component.ts3
-rw-r--r--usecaseui-portal/src/app/views/maas/maas.module.ts11
-rw-r--r--usecaseui-portal/src/app/views/maas/use/code-block.directive.spec.ts8
-rw-r--r--usecaseui-portal/src/app/views/maas/use/code-block.directive.ts38
-rw-r--r--usecaseui-portal/src/app/views/maas/use/use-application.component.html9
-rw-r--r--usecaseui-portal/src/app/views/maas/use/use-application.component.less463
-rw-r--r--usecaseui-portal/src/app/views/maas/use/use-application.component.ts35
10 files changed, 545 insertions, 68 deletions
diff --git a/usecaseui-portal/src/app/views/maas/build/application-management.component.html b/usecaseui-portal/src/app/views/maas/build/application-management.component.html
index 53e112be..f67d169f 100644
--- a/usecaseui-portal/src/app/views/maas/build/application-management.component.html
+++ b/usecaseui-portal/src/app/views/maas/build/application-management.component.html
@@ -27,27 +27,27 @@
>
<thead>
<tr>
- <th nzWidth="9%" style="font-size: 20px;">No</th>
- <th nzWidth="12%" style="font-size: 20px;">Application Name</th>
- <th nzWidth="13%" style="font-size: 20px;">Application Description</th>
- <th nzWidth="11%" style="font-size: 20px;">Application Type</th>
- <th nzWidth="11%" style="font-size: 20px;">Operator</th>
- <th nzWidth="11%" style="font-size: 20px;">MaaS</th>
- <th nzWidth="11%" style="font-size: 20px;">Knowledge Base</th>
- <th nzWidth="11%" style="font-size: 20px;">Large Model</th>
- <th nzWidth="11%" style="font-size: 20px;">{{"i18nTextDefine_Action" | translate}}</th>
+ <th nzWidth="9%" class="head-column">No</th>
+ <th nzWidth="12%" class="head-column">Application Name</th>
+ <th nzWidth="13%" class="head-column">Application Description</th>
+ <th nzWidth="11%" class="head-column">Application Type</th>
+ <th nzWidth="11%" class="head-column">Operator</th>
+ <th nzWidth="11%" class="head-column">MaaS</th>
+ <th nzWidth="11%" class="head-column">Knowledge Base</th>
+ <th nzWidth="11%" class="head-column">Large Model</th>
+ <th nzWidth="11%" class="head-column">{{"i18nTextDefine_Action" | translate}}</th>
</tr>
</thead>
<tbody>
<tr *ngFor="let data of basicTable.data; let i = index">
- <td>{{i+1}}</td>
- <td>{{data.applicationName}}</td>
- <td>{{data.applicationDescription}}</td>
- <td>{{data.applicationType}}</td>
- <td>{{data.operatorName}}</td>
- <td>{{data.maaSPlatformName}}</td>
- <td>{{data.knowledgeBaseName}}</td>
- <td>{{data.largeModelName}}</td>
+ <td class="column">{{i+1}}</td>
+ <td class="column">{{data.applicationName}}</td>
+ <td class="column">{{data.applicationDescription}}</td>
+ <td class="column">{{data.applicationType}}</td>
+ <td class="column">{{data.operatorName}}</td>
+ <td class="column">{{data.maaSPlatformName}}</td>
+ <td class="column">{{data.knowledgeBaseName}}</td>
+ <td class="column">{{data.largeModelName}}</td>
<td>
<i class="anticon anticon-menu-fold" (click)="displayApplicationDetails(data)"></i>
<i class="anticon anticon-edit" (click)="edit(data)"></i>
diff --git a/usecaseui-portal/src/app/views/maas/build/application-management.component.less b/usecaseui-portal/src/app/views/maas/build/application-management.component.less
index beefd0f9..7d78a838 100644
--- a/usecaseui-portal/src/app/views/maas/build/application-management.component.less
+++ b/usecaseui-portal/src/app/views/maas/build/application-management.component.less
@@ -14,6 +14,14 @@
margin-top: 7px;
}
}
+ .head-column {
+ font-size: 20px;
+ word-break: break-word;
+ }
+
+ .column {
+ word-break: break-word;
+ }
.anticon-edit,.anticon-delete,.anticon-menu-fold{
font-size: 18px;
margin-right: 10px;
diff --git a/usecaseui-portal/src/app/views/maas/build/application-management.component.ts b/usecaseui-portal/src/app/views/maas/build/application-management.component.ts
index 00c0c405..0fb862ac 100644
--- a/usecaseui-portal/src/app/views/maas/build/application-management.component.ts
+++ b/usecaseui-portal/src/app/views/maas/build/application-management.component.ts
@@ -86,7 +86,7 @@ export class ApplicationManagementComponent implements OnInit {
this.applicationDetail = data.result_body;
},
() => {
- this.message.error('Failed to obtain knowledge base data');
+ this.message.error('Failed to obtain application data');
}
)
}
@@ -97,7 +97,7 @@ export class ApplicationManagementComponent implements OnInit {
}
showDeleteConfirm(data: Application): void {
- this.modalService.error({
+ this.modalService.confirm({
nzTitle: this.translate.instant('maas.deleteTitle'),
nzContent: this.translate.instant('maas.application.deleteApplicationContent'),
nzOkText: 'Yes',
diff --git a/usecaseui-portal/src/app/views/maas/knowledge-base-management/knowledge-base-management.component.ts b/usecaseui-portal/src/app/views/maas/knowledge-base-management/knowledge-base-management.component.ts
index 26b672cc..843387b3 100644
--- a/usecaseui-portal/src/app/views/maas/knowledge-base-management/knowledge-base-management.component.ts
+++ b/usecaseui-portal/src/app/views/maas/knowledge-base-management/knowledge-base-management.component.ts
@@ -101,7 +101,8 @@ export class KnowledgeBaseManagementComponent implements OnInit {
nzOkText: 'Yes',
nzOkType: 'danger',
nzOnOk: () => this.deleteKnowledgeBase(data),
- nzCancelText: 'No'
+ nzCancelText: 'No',
+ nzIconType: 'warning',
});
}
diff --git a/usecaseui-portal/src/app/views/maas/maas.module.ts b/usecaseui-portal/src/app/views/maas/maas.module.ts
index 8c666903..d7aae679 100644
--- a/usecaseui-portal/src/app/views/maas/maas.module.ts
+++ b/usecaseui-portal/src/app/views/maas/maas.module.ts
@@ -15,7 +15,9 @@ import { EditKnowledgeBaseComponent } from './knowledge-base-management/edit-kno
import { EditApplicationComponent } from './build/edit-application/edit-application.component';
import { MaasService } from './maas-service.service';
import { KnowledgeBaseService } from './knowledge-base-management/knowledge-base.service';
-
+import { MarkdownModule } from 'ngx-markdown';
+import { ClipboardModule } from 'ngx-clipboard';
+import { CodeBlockDirective } from './use/code-block.directive';
@NgModule({
providers: [
MaasApi,
@@ -24,7 +26,9 @@ import { KnowledgeBaseService } from './knowledge-base-management/knowledge-base
],
imports: [
SharedModule,
- MaasRoutingModule
+ MaasRoutingModule,
+ MarkdownModule.forChild(),
+ ClipboardModule
],
declarations: [
ApplicationManagementComponent,
@@ -37,7 +41,8 @@ import { KnowledgeBaseService } from './knowledge-base-management/knowledge-base
CreateKnowledgeBaseComponent,
KnowledgeBaseDetailComponent,
EditKnowledgeBaseComponent,
- EditApplicationComponent
+ EditApplicationComponent,
+ CodeBlockDirective
]
})
export class MaasModule { }
diff --git a/usecaseui-portal/src/app/views/maas/use/code-block.directive.spec.ts b/usecaseui-portal/src/app/views/maas/use/code-block.directive.spec.ts
new file mode 100644
index 00000000..296e9a53
--- /dev/null
+++ b/usecaseui-portal/src/app/views/maas/use/code-block.directive.spec.ts
@@ -0,0 +1,8 @@
+import { CodeBlockDirective } from './code-block.directive';
+
+describe('CodeBlockDirective', () => {
+ it('should create an instance', () => {
+ const directive = new CodeBlockDirective();
+ expect(directive).toBeTruthy();
+ });
+});
diff --git a/usecaseui-portal/src/app/views/maas/use/code-block.directive.ts b/usecaseui-portal/src/app/views/maas/use/code-block.directive.ts
new file mode 100644
index 00000000..31247184
--- /dev/null
+++ b/usecaseui-portal/src/app/views/maas/use/code-block.directive.ts
@@ -0,0 +1,38 @@
+import { AfterViewChecked, AfterViewInit, Directive, ElementRef, Renderer2 } from '@angular/core';
+import { TranslateService } from '@ngx-translate/core';
+import { NzMessageService } from 'ng-zorro-antd';
+import { ClipboardService } from 'ngx-clipboard';
+
+@Directive({
+ selector: '[appCodeBlock]'
+})
+export class CodeBlockDirective implements AfterViewChecked {
+
+ constructor(private el: ElementRef, private renderer: Renderer2, private clipboardService: ClipboardService,
+ private message: NzMessageService, private translate: TranslateService
+ ) { }
+
+ ngAfterViewChecked() {
+ this.setCopyButton();
+ }
+
+setCopyButton() {
+ const preElements = this.el.nativeElement.querySelectorAll('pre');
+
+ preElements.forEach(pre => {
+ const codeElement = pre.querySelector('code');
+ const copyButtonExists = pre.querySelector('button.copy-button');
+ if (codeElement && !copyButtonExists) {
+ const copyButton = this.renderer.createElement('button');
+ this.renderer.addClass(copyButton, 'copy-button');
+ this.renderer.setProperty(copyButton, 'innerHTML', 'Copy');
+ this.renderer.listen(copyButton, 'click', () => {
+ this.clipboardService.copyFromContent(codeElement.innerText);
+ this.message.success(this.translate.instant('maas.copy_to_clipboard'));
+ });
+ this.renderer.insertBefore(pre, copyButton, codeElement);
+ }
+ });
+}
+
+}
diff --git a/usecaseui-portal/src/app/views/maas/use/use-application.component.html b/usecaseui-portal/src/app/views/maas/use/use-application.component.html
index f8c65794..6509fbbe 100644
--- a/usecaseui-portal/src/app/views/maas/use/use-application.component.html
+++ b/usecaseui-portal/src/app/views/maas/use/use-application.component.html
@@ -34,7 +34,7 @@
</div>
</div>
<div class="question-container">
- <span class="question-text">{{ chat.question }}</span>
+ <markdown class="question-text" [data]="chat.question"></markdown>
</div>
</div>
<br>
@@ -45,8 +45,11 @@
[nz-tooltip]="'maas.copy' | translate"></span>
</div>
<span class="answer-text">
- <span class="answer" [ngClass]="{'hidden-cursor': chat.status==='finished'}" #answerText
- id="answerText">{{chat.answer}}</span>
+ <markdown appCodeBlock class="markdown answer-markdown" [ngClass]="{'hidden-cursor': chat.status==='finished'}" *ngIf="chat.answer else default" [data]="chat.answer"></markdown>
+ <ng-template #default>
+ <span class="answer default" [ngClass]="{'hidden-cursor': chat.status==='finished'}" #answerText>
+ </span>
+ </ng-template>
</span>
</div>
<br>
diff --git a/usecaseui-portal/src/app/views/maas/use/use-application.component.less b/usecaseui-portal/src/app/views/maas/use/use-application.component.less
index c2f926fb..bb2e0d12 100644
--- a/usecaseui-portal/src/app/views/maas/use/use-application.component.less
+++ b/usecaseui-portal/src/app/views/maas/use/use-application.component.less
@@ -9,15 +9,11 @@
}
.fixed-select-wrapper {
- position: fixed;
- top: 20px;
- left: 50%;
- transform: translateX(-50%);
- z-index: 1000;
+ padding: 20px 0 0 100px;
}
.chat-container {
- margin: 60px 0;
+ margin: 20px 0;
padding: 0 100px;
}
@@ -43,59 +39,65 @@
display: flex;
border-radius: 8px;
overflow: hidden;
- border: 1px solid #fff;
margin-right: 8px;
height: 24px;
margin-top:3px;
}
-.question-icon-actions span:not(:first-child) {
- border-left: 1px solid #fff;
-}
-
.question-action {
width: 24px;
padding-top: 4px;
}
.question-container {
- margin: 8px 0;
+ border-radius: 8px;
+ background-color: white;
}
.question-text {
- background-color: white;
font-size: 16px;
- padding: 10px;
- border-radius: 8px;
}
.answer-action {
height: 24px;
width: 24px;
- border: 1px solid #fff;
border-radius: 8px;
padding-top: 3px;
}
-#answerText {
+.answer {
font-size: 16px;
- padding: 10px;
white-space: pre-line;
width: auto;
display: inline-block;
position: relative;
- min-height: 40px;
}
-.answer::after {
+.answer::after{
+ content: '';
+ display: inline-block;
+ width: 2px;
+ height: 16px;
+ background-color: black;
+ position: absolute;
+ animation: blink 1s step-end infinite;
+ margin-top: -20px;
+}
+
+.answer-markdown::after {
content: '';
display: inline-block;
- width: 1px;
+ width: 2px;
height: 16px;
background-color: black;
position: absolute;
animation: blink 1s step-end infinite;
- margin-top: 5px;
+ margin-top: -10px;
+}
+
+.answer-markdown {
+ font-size: 16px;
+ position: relative;
}
.hidden-cursor::after {
@@ -107,6 +109,7 @@
background-color: white;
display: inline-block;
border-radius: 8px;
+ padding: 8px;
}
.answer-container img, .answer-icon img, .question img{
@@ -219,4 +222,420 @@
50% {
background-color: black;
}
+}
+
+.copy-button {
+ position: absolute;
+ right: 0;
+ top: 0;
+ background-color: #485264;
+ color: white;
+ border: none;
+ padding: 5px 10px;
+ cursor: pointer;
+ border-radius: 3px;
+}
+
+.default {
+ padding: 0 5px;
+}
+
+:host ::ng-deep .question-text p,
+:host ::ng-deep :host ::ng-deep .markdown p {
+ margin: 8px;
+}
+
+:host ::ng-deep .markdown ul,
+:host ::ng-deep .markdown ol {
+ padding-left: 14px;
+}
+
+:host ::ng-deep .markdown > *:first-child {
+ margin-top: 0 !important;
+}
+:host ::ng-deep .markdown > *:last-child {
+ margin-bottom: 0 !important;
+}
+:host ::ng-deep .markdown a.absent {
+ color: #cc0000;
+}
+:host ::ng-deep .markdown a.anchor {
+ bottom: 0;
+ cursor: pointer;
+ display: block;
+ left: 0;
+ margin-left: -30px;
+ padding-left: 30px;
+ position: absolute;
+ top: 0;
+}
+:host ::ng-deep .markdown h1,
+:host ::ng-deep .markdown h2,
+:host ::ng-deep .markdown h3,
+:host ::ng-deep .markdown h4,
+:host ::ng-deep .markdown h5,
+:host ::ng-deep .markdown h6 {
+ cursor: text;
+ font-weight: bold;
+ margin: 10px 0;
+ padding: 0;
+ position: relative;
+}
+:host ::ng-deep .markdown h1 .mini-icon-link,
+:host ::ng-deep .markdown h2 .mini-icon-link,
+:host ::ng-deep .markdown h3 .mini-icon-link,
+:host ::ng-deep .markdown h4 .mini-icon-link,
+:host ::ng-deep .markdown h5 .mini-icon-link,
+:host ::ng-deep .markdown h6 .mini-icon-link {
+ display: none;
+}
+:host ::ng-deep .markdown h1:hover a.anchor,
+:host ::ng-deep .markdown h2:hover a.anchor,
+:host ::ng-deep .markdown h3:hover a.anchor,
+:host ::ng-deep .markdown h4:hover a.anchor,
+:host ::ng-deep .markdown h5:hover a.anchor,
+:host ::ng-deep .markdown h6:hover a.anchor {
+ line-height: 1;
+ margin-left: -22px;
+ padding-left: 0;
+ text-decoration: none;
+ top: 15%;
+}
+:host ::ng-deep .markdown h1:hover a.anchor .mini-icon-link,
+:host ::ng-deep .markdown h2:hover a.anchor .mini-icon-link,
+:host ::ng-deep .markdown h3:hover a.anchor .mini-icon-link,
+:host ::ng-deep .markdown h4:hover a.anchor .mini-icon-link,
+:host ::ng-deep .markdown h5:hover a.anchor .mini-icon-link,
+:host ::ng-deep .markdown h6:hover a.anchor .mini-icon-link {
+ display: inline-block;
+}
+:host ::ng-deep .markdown h1 tt,
+:host ::ng-deep .markdown h1 code,
+:host ::ng-deep .markdown h2 tt,
+:host ::ng-deep .markdown h2 code,
+:host ::ng-deep .markdown h3 tt,
+:host ::ng-deep .markdown h3 code,
+:host ::ng-deep .markdown h4 tt,
+:host ::ng-deep .markdown h4 code,
+:host ::ng-deep .markdown h5 tt,
+:host ::ng-deep .markdown h5 code,
+:host ::ng-deep .markdown h6 tt,
+:host ::ng-deep .markdown h6 code {
+ font-size: inherit;
+}
+:host ::ng-deep .markdown h1 {
+ font-size: 1.75rem;
+}
+:host ::ng-deep .markdown h2 {
+ font-size: 1.5rem;
+}
+:host ::ng-deep .markdown h3 {
+ font-size: 1.25rem;
+}
+:host ::ng-deep .markdown h4 {
+ font-size: 1rem;
+}
+:host ::ng-deep .markdown h5 {
+ font-size: 14px;
+}
+:host ::ng-deep .markdown h6 {
+ font-size: 12px;
+}
+:host ::ng-deep .markdown p,
+:host ::ng-deep .markdown blockquote,
+:host ::ng-deep .markdown ul,
+:host ::ng-deep .markdown ol,
+:host ::ng-deep .markdown dl,
+:host ::ng-deep .markdown table,
+:host ::ng-deep .markdown pre {
+ margin: 14px 0;
+}
+:host ::ng-deep .markdown > h2:first-child,
+:host ::ng-deep .markdown > h1:first-child,
+:host ::ng-deep .markdown > h1:first-child + h2,
+:host ::ng-deep .markdown > h3:first-child,
+:host ::ng-deep .markdown > h4:first-child,
+:host ::ng-deep .markdown > h5:first-child,
+:host ::ng-deep .markdown > h6:first-child {
+ margin-top: 0;
+ padding-top: 0;
+}
+:host ::ng-deep .markdown a:first-child h1,
+:host ::ng-deep .markdown a:first-child h2,
+:host ::ng-deep .markdown a:first-child h3,
+:host ::ng-deep .markdown a:first-child h4,
+:host ::ng-deep .markdown a:first-child h5,
+:host ::ng-deep .markdown a:first-child h6 {
+ margin-top: 0;
+ padding-top: 0;
+}
+:host ::ng-deep .markdown h1 + p,
+:host ::ng-deep .markdown h2 + p,
+:host ::ng-deep .markdown h3 + p,
+:host ::ng-deep .markdown h4 + p,
+:host ::ng-deep .markdown h5 + p,
+:host ::ng-deep .markdown h6 + p {
+ margin-top: 0;
+}
+:host ::ng-deep .markdown li p.first {
+ display: inline-block;
+}
+:host ::ng-deep .markdown ul,
+:host ::ng-deep .markdown ol {
+ padding-left: 2em;
+}
+:host ::ng-deep .markdown ul.no-list,
+:host ::ng-deep .markdown ol.no-list {
+ list-style-type: none;
+ padding: 0;
+}
+:host ::ng-deep .markdown ul li > *:first-child,
+:host ::ng-deep .markdown ol li > *:first-child {
+ margin-top: 0;
+}
+:host ::ng-deep .markdown ul,
+:host ::ng-deep .markdown ol {
+ padding-left: 14px;
+}
+:host ::ng-deep .markdown dl {
+ padding: 0;
+}
+:host ::ng-deep .markdown dl dt {
+ font-size: 14px;
+ font-style: italic;
+ font-weight: bold;
+ margin: 15px 0 5px;
+ padding: 0;
+}
+:host ::ng-deep .markdown dl dt:first-child {
+ padding: 0;
+}
+:host ::ng-deep .markdown dl dt > *:first-child {
+ margin-top: 0;
+}
+:host ::ng-deep .markdown dl dt > *:last-child {
+ margin-bottom: 0;
+}
+:host ::ng-deep .markdown dl dd {
+ margin: 0 0 15px;
+ padding: 0 15px;
+}
+:host ::ng-deep .markdown dl dd > *:first-child {
+ margin-top: 0;
+}
+:host ::ng-deep .markdown dl dd > *:last-child {
+ margin-bottom: 0;
+}
+:host ::ng-deep .markdown blockquote {
+ border-left: 4px solid #dddddd;
+ color: #777777;
+ padding: 0 15px;
+}
+:host ::ng-deep .markdown blockquote > *:first-child {
+ margin-top: 0;
+}
+:host ::ng-deep .markdown blockquote > *:last-child {
+ margin-bottom: 0;
+}
+:host ::ng-deep .markdown table {
+ width: 100%;
+}
+:host ::ng-deep .markdown table th {
+ font-weight: bold;
+}
+:host ::ng-deep .markdown table th,
+:host ::ng-deep .markdown table td {
+ padding: 6px 13px;
+}
+:host ::ng-deep .markdown table tr {
+ background-color: #ffffff;
+}
+:host ::ng-deep .markdown table tr:nth-child(2n) {
+ background-color: #f0f0f0;
+}
+:host ::ng-deep .markdown img {
+ max-width: 100%;
+}
+:host ::ng-deep .markdown span.frame {
+ display: block;
+ overflow: hidden;
+}
+:host ::ng-deep .markdown span.frame > span {
+ border: 1px solid #dddddd;
+ display: block;
+ float: left;
+ margin: 13px 0 0;
+ overflow: hidden;
+ padding: 7px;
+ width: auto;
+}
+:host ::ng-deep .markdown span.frame span img {
+ display: block;
+ float: left;
+}
+:host ::ng-deep .markdown span.frame span span {
+ clear: both;
+ color: #333333;
+ display: block;
+ padding: 5px 0 0;
+}
+:host ::ng-deep .markdown span.align-center {
+ clear: both;
+ display: block;
+ overflow: hidden;
+}
+:host ::ng-deep .markdown span.align-center > span {
+ display: block;
+ margin: 13px auto 0;
+ overflow: hidden;
+ text-align: center;
+}
+:host ::ng-deep .markdown span.align-center span img {
+ margin: 0 auto;
+ text-align: center;
+}
+:host ::ng-deep .markdown span.align-right {
+ clear: both;
+ display: block;
+ overflow: hidden;
+}
+:host ::ng-deep .markdown span.align-right > span {
+ display: block;
+ margin: 13px 0 0;
+ overflow: hidden;
+ text-align: right;
+}
+:host ::ng-deep .markdown span.align-right span img {
+ margin: 0;
+ text-align: right;
+}
+:host ::ng-deep .markdown span.float-left {
+ display: block;
+ float: left;
+ margin-right: 13px;
+ overflow: hidden;
+}
+:host ::ng-deep .markdown span.float-left span {
+ margin: 13px 0 0;
+}
+:host ::ng-deep .markdown span.float-right {
+ display: block;
+ float: right;
+ margin-left: 13px;
+ overflow: hidden;
+}
+:host ::ng-deep .markdown span.float-right > span {
+ display: block;
+ margin: 13px auto 0;
+ overflow: hidden;
+ text-align: right;
+}
+:host ::ng-deep .markdown code,
+:host ::ng-deep .markdown tt {
+ border: 1px solid #dee0e2;
+ background-color: #f4f6f8;
+ border-radius: 3px;
+ margin: 0 2px;
+ padding: 0 5px;
+}
+:host ::ng-deep .markdown pre > code {
+ background: none repeat scroll 0 0 transparent;
+ border: medium none;
+ margin: 0;
+ padding: 0;
+}
+:host ::ng-deep .markdown .highlight pre,
+:host ::ng-deep .markdown pre {
+ border: 1px solid #cccccc;
+ border-radius: 3px 3px 3px 3px;
+ font-size: 14px;
+ line-height: 19px;
+ overflow: auto;
+ padding: 6px 10px;
+}
+:host ::ng-deep .markdown pre code,
+:host ::ng-deep .markdown pre tt {
+ background-color: transparent !important;
+ border: medium none;
+}
+:host ::ng-deep .markdown hr {
+ margin: 10px 0;
+ border-color: #C4CBD7;
+}
+:host ::ng-deep .markdown {
+ tab-size: 4;
+ word-spacing: normal;
+ width: 100%;
+ font-size: 14px;
+
+ * {
+ word-break: break-word;
+ }
+
+ pre {
+ display: block;
+ width: 100%;
+ padding: 15px;
+ margin: 0;
+ border: none;
+ border-radius: 0;
+ // background-color: gray !important;
+ overflow-x: auto;
+ color: gray;
+ position: relative;
+ }
+
+ pre code {
+ width: 100%;
+ }
+
+ a {
+ text-decoration: underline;
+ color: #2B5FD9;
+ }
+
+ table {
+ border-collapse: separate;
+ border-spacing: 0px;
+ color: #383F50;
+
+ thead tr:first-child th {
+ border-bottom-width: 1px;
+ border-left-width: 1px;
+ border-top-width: 1px;
+ border-color: #ccc;
+ background-color: rgba(236, 236, 241, 0.2);
+ overflow: hidden;
+
+ &:first-child {
+ border-top-left-radius: 0.375rem;
+ }
+ &:last-child {
+ border-right-width: 1px;
+ border-top-right-radius: 0.375rem;
+ }
+ }
+
+ td {
+ border-bottom-width: 1px;
+ border-left-width: 1px;
+ border-color: #ccc;
+
+ &:last-of-type {
+ border-right-width: 1px;
+ }
+ }
+
+ tbody tr:last-child {
+ overflow: hidden;
+ td {
+ &:first-child {
+ border-bottom-left-radius: 0.375rem;
+ }
+ &:last-child {
+ border-bottom-right-radius: 0.375rem;
+ }
+ }
+ }
+ }
} \ No newline at end of file
diff --git a/usecaseui-portal/src/app/views/maas/use/use-application.component.ts b/usecaseui-portal/src/app/views/maas/use/use-application.component.ts
index e73463d6..b02a2d60 100644
--- a/usecaseui-portal/src/app/views/maas/use/use-application.component.ts
+++ b/usecaseui-portal/src/app/views/maas/use/use-application.component.ts
@@ -13,7 +13,6 @@ export type Chat = { question: string, answer: string, questionId: string, statu
styleUrls: ['./use-application.component.less']
})
export class UseApplicationComponent implements OnInit {
-
question: string;
communicationMessage: string;
chatHistory: Chat[] = [];
@@ -31,15 +30,14 @@ export class UseApplicationComponent implements OnInit {
private route: ActivatedRoute,
private myhttp: MaasApi,
private translate: TranslateService,
- private maasService: MaasService,
- private renderer: Renderer2
+ private maasService: MaasService
) { }
- ngOnInit() {
- this.fetchAllApplication();
+ async ngOnInit() {
+ await this.fetchAllApplication();
this.route.queryParams.subscribe(params => {
this.queryParams = params;
- this.selectedName = this.queryParams.id;
+ this.selectedName = this.queryParams.id || this.selectedName;
});
}
@@ -102,20 +100,17 @@ export class UseApplicationComponent implements OnInit {
chat.answer += event.data.replace(/__SPACE__/g, ' ');
}
- fetchAllApplication(): void {
- this.myhttp.getAllApplication()
- .subscribe(
- (data) => {
- this.options = data.result_body.map(item => ({
- nzValue: item.applicationId,
- nzLabel: item.applicationName
- }));
- this.selectedName = this.options.length > 0 ? this.options[0].nzValue : '';
- },
- () => {
- this.message.error('Failed to obtain intent data');
- }
- )
+ async fetchAllApplication(): Promise<void> {
+ try {
+ const data = await this.myhttp.getAllApplication().toPromise();
+ this.options = data.result_body.map(item => ({
+ nzValue: item.applicationId,
+ nzLabel: item.applicationName
+ }));
+ this.selectedName = this.options.length > 0 ? this.options[0].nzValue : '';
+ } catch {
+ this.message.error('Failed to obtain intent data');
+ }
}
async copy(content: string): Promise<void> {