centaline-data-driven-v3 0.0.81 → 0.0.82

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "centaline-data-driven-v3",
-  "version": "0.0.81",
+  "version": "0.0.82",
   "private": false,
   "description": "centaline-data-driven-v3",
   "main": "dist/centaline-data-driven-v3.umd.js",

package/src/components/web/AIChat.vue

@@ -17,7 +17,8 @@
             <template v-for="message in model.messages">
                 <div :key="message.id" class="message" v-if="message.content"
                     :class="{ 'user-message': message.sender === 'user', 'ai-message': message.sender === 'ai' }">
-                    <div class="chat-message" :style="{color:message.type=='error'?'red':''}" v-html="htmlContent(message)">
+                    <div class="chat-message" :style="{ color: message.type == 'error' ? 'red' : '' }"
+                        v-html="htmlContent(message)">
                     </div>
                 </div>
                 <div v-else class="loading-container">
@@ -29,7 +30,8 @@
         <!-- 输入区域 -->
         <div class="chat-editor" v-if="showAI">
             <div class="chat-input-editor-container">
-                <textarea ref="textareaRef" class="chat-input" v-model="inputMessage" @keydown="handleKeydown"
+                <textarea ref="textareaRef" class="chat-input" 
+                v-model="inputMessage" @keydown="handleKeydown"
                     :placeholder="model.placeholder"></textarea>
 
 
@@ -55,7 +57,7 @@
 
 
 <script setup lang="ts">
-import { ref, reactive, nextTick, watch, computed } from 'vue'
+import { ref, onActivated, nextTick, watch, computed } from 'vue'
 import AIChat from '../../loader/src/AIChat'
 import common from '../../utils/common'
 import { marked } from 'marked';
@@ -139,6 +141,13 @@ function load(data) {
     action();
 }
 
+onActivated(() => {
+    nextTick(() => {
+        if (inputMessage.value) {
+            inputMessage.value.focus();
+        }
+    })
+})
 // Marked 配置
 marked.setOptions({
     breaks: true,
@@ -225,9 +234,9 @@ const scheduleScroll = (flagScroll) => {
     if (!scrollPending) {
         if (messagesContainer.value) {
             const container = messagesContainer.value;
-   
+
             const distanceToBottom = container.scrollHeight - (container.scrollTop + container.clientHeight);
-            if (flagScroll||distanceToBottom <= 20) {
+            if (flagScroll || distanceToBottom <= 20) {
                 scrollPending = true
                 nextTick(() => {
                     if (messagesContainer.value) {
@@ -636,9 +645,9 @@ function hideAI() {
     overflow: auto;
     resize: none;
     /* 禁用手动调整大小 */
-    min-height: 20px;
+    min-height: 40px;
     /* 设置最大高度 */
-    max-height: 55px;
+    max-height: 65px;
     /* 设置最大高度 */
 }
 
@@ -647,6 +656,10 @@ function hideAI() {
     outline: none;
 }
 
+.chat-input::placeholder {
+  color: #a8abb2;
+  opacity: 1;
+}
 .chat-editor-action {
     display: flex;
     justify-content: space-between;