show assistant replies below avatar and profile name

2026-10-24 22:45:16 +08:00
parent a54913efd2
commit d3b3a0833e
3 changed files with 81 additions and 7 deletions
@@ -1012,13 +1012,15 @@ onBeforeUnmount(() => {
    </template>
    <template v-else>
      <div class="msg-body">
-        <ProfileAvatar
-          v-if="message.role === 'assistant'"
-          class="msg-avatar"
-          :name="assistantProfileName"
-          :avatar="assistantProfileAvatar"
-          :size="40"
-        />
+        <div v-if="message.role === 'assistant'" class="msg-agent-header">
+          <ProfileAvatar
+            class="msg-avatar"
+            :name="assistantProfileName"
+            :avatar="assistantProfileAvatar"
+            :size="40"
+          />
+          <span class="msg-profile-name" :title="assistantProfileName">{{ assistantProfileName }}</span>
+        </div>
        <div class="msg-content" :class="message.role">
          <div
            class="message-bubble"
@@ -1317,11 +1319,30 @@ onBeforeUnmount(() => {
    gap: 8px;

    .msg-body {
+      flex-direction: column;
      max-width: 80%;
      position: relative;
      z-index: 1;
    }

+    .msg-agent-header {
+      display: flex;
+      align-items: center;
+      gap: 10px;
+      min-width: 0;
+      max-width: 100%;
+    }
+
+    .msg-profile-name {
+      min-width: 0;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+      color: $text-secondary;
+      font-size: 13px;
+      font-weight: 600;
+    }
+
    .msg-avatar {
      width: 40px;
      height: 40px;