修复聊天室文本显示问题

src/views/AI/chat/index.vue

@@ -43,12 +43,12 @@ let keyWord = ref(null)
 let messages = reactive([
   {
     from: 'user',
-    text: '根据2024年度系统内所有业务类型签订的合同数据指标生成数据看板，根据业务数据生成并且完整展示数据内容，用拼图的形式展现，图表颜色搭配要协调，整体美观',
+    text: '根据2024年度系统内所有业务类型签订的合同数据指标生成数据看板，根据业务数据生成并且完整展示数据内容，用饼图的 形式展现，图表颜色搭配要协调，整体美观',
     time: '2025/03/27 14:30:23'
   },
   {
     from: 'ai',
-    text: '根据用户要求的统计2024年系统每个业务类型产生签订的合同数量，并用拼图展示，生成的统计图是：[此处可插入图表相关展示代码或占位符]',
+    text: '根据用户要求的统计2024年系统每个业务类型产生签订的合同数量，并用饼图展示，生成的统计图是：',
     time: '2025/03/27 14:30:23'
   }
 ])
@@ -108,13 +108,19 @@ onMounted(()=>{
 
 .user-message {
   flex-direction: row-reverse;
-
+  .message-content{
-  .message-content > div {
+    display: flex;
-    text-align: right;
+    flex-direction: column;
+    align-items: flex-end;
   }
 }
 .ai-message {
   flex-direction: row;
+  .message-content{
+    display: flex;
+    flex-direction: column;
+    align-items: flex-start;
+  }
 }
 
 .message-content {
@@ -126,6 +132,7 @@ onMounted(()=>{
   width: calc(100% - 110px);
   padding-top: 15px;
   .message-text {
+    width: auto;
     color: #ffffff;
     font-size: 15px;
     margin-top: 10px;