|
|
@@ -1,24 +1,45 @@
|
|
|
+
|
|
|
<ion-header>
|
|
|
<ion-toolbar>
|
|
|
+ <ion-buttons slot="start">
|
|
|
+ <ion-back-button defaultHref="/tabs/tab1"></ion-back-button>
|
|
|
+ </ion-buttons>
|
|
|
<ion-title>
|
|
|
- AIGC 消息发送
|
|
|
+ AI面试模拟
|
|
|
</ion-title>
|
|
|
</ion-toolbar>
|
|
|
</ion-header>
|
|
|
|
|
|
<ion-content>
|
|
|
- <ion-item>
|
|
|
- <ion-input placeholder="输入消息" [(ngModel)]="userInput"></ion-input>
|
|
|
- </ion-item>
|
|
|
-
|
|
|
- <ion-button expand="block" (click)="sendMessage()">发送</ion-button>
|
|
|
-
|
|
|
+ <ion-card >
|
|
|
+ <ion-card-header style="display: flex; align-items: left;">
|
|
|
+ <div style="display: flex; align-items: center;">
|
|
|
+ <ion-icon name="person-circle" style="font-size: 2em; margin-right: 8px;"></ion-icon>
|
|
|
+ <ion-label>assistant</ion-label>
|
|
|
+ </div>
|
|
|
+ </ion-card-header>
|
|
|
+ <ion-card-content>
|
|
|
+ 你好，我是你的专属ai面试官，你可以这么问我“请你为我模拟c++算法工程师面试场景”
|
|
|
+ </ion-card-content>
|
|
|
+ </ion-card>
|
|
|
<ion-card *ngFor="let message of messageList">
|
|
|
- <ion-card-header>
|
|
|
- {{message?.role}}
|
|
|
+ <ion-card-header style="display: flex; align-items: left;">
|
|
|
+ <div style="display: flex; align-items: center;">
|
|
|
+ <ion-icon name="person-circle" style="font-size: 2em; margin-right: 8px;"></ion-icon>
|
|
|
+ <ion-label>{{message?.role}}</ion-label>
|
|
|
+ </div>
|
|
|
</ion-card-header>
|
|
|
<ion-card-content>
|
|
|
{{ message?.content }}
|
|
|
</ion-card-content>
|
|
|
</ion-card>
|
|
|
</ion-content>
|
|
|
+
|
|
|
+<ion-footer>
|
|
|
+ <ion-toolbar>
|
|
|
+ <ion-item>
|
|
|
+ <ion-input placeholder="输入消息" [(ngModel)]="userInput"></ion-input>
|
|
|
+ </ion-item>
|
|
|
+ <ion-button expand="block" (click)="sendMessage()">发送</ion-button>
|
|
|
+ </ion-toolbar>
|
|
|
+</ion-footer>
|
