diff --git a/docker-compose.yml b/docker-compose.yml index 5a818a8..53f59ae 100644 --- a/docker-compose.yml +++ b/docker-compose.yml @@ -3,7 +3,7 @@ services: build: context: . dockerfile: Dockerfile - image: tradus-web:1.3.40 + image: tradus-web:1.3.41 container_name: tradus-web ports: - '6000:80' diff --git a/src/views/ChatAgentView.vue b/src/views/ChatAgentView.vue index f687804..b3bc6ac 100644 --- a/src/views/ChatAgentView.vue +++ b/src/views/ChatAgentView.vue @@ -1101,11 +1101,14 @@ const stopStreaming = async () => { align-items: center; height: 100%; text-align: center; + min-height: 0; + overflow-y: auto; } .welcome-content { max-width: 500px; - padding: 0 1rem; + padding: 2rem 1rem; + width: 100%; } .welcome-icon { @@ -1123,14 +1126,14 @@ const stopStreaming = async () => { .welcome-content p { color: var(--color-text-secondary); - margin-bottom: 1.5rem; + margin-bottom: 2rem; line-height: 1.6; } .example-questions { display: flex; flex-direction: column; - gap: 0.75rem; + gap: 1rem; align-items: center; } @@ -1532,59 +1535,63 @@ const stopStreaming = async () => { .chat-messages { padding: 1rem; - padding-bottom: 80px; /* 为固定输入框留出空间 */ + padding-bottom: 100px; /* 为固定输入框留出空间 */ } - .conversation-header { - padding: 0.75rem 1rem; - } - - .conversation-title-container { - gap: 0.25rem; - } - - .conversation-title { - font-size: 1rem; - } - - .dropdown-icon { - width: 16px; - height: 16px; - } - - /* 移动端让会话操作按钮始终可见 */ - .conversation-actions { - opacity: 1; - } - - .conversation-actions .action-btn { - padding: 0.5rem; - } - - .conversation-actions .action-btn svg { - width: 16px; - height: 16px; + .welcome-message { + height: auto; + min-height: calc(100vh - 160px); /* 减去header和输入框的高度 */ + align-items: flex-start; + padding-top: 2rem; } .welcome-content { - padding: 0 1rem; + padding: 0 1rem 2rem 1rem; + max-width: 100%; + } + + .welcome-icon { + font-size: 2.5rem; + margin-bottom: 1rem; + } + + .welcome-content h3 { + font-size: 1.25rem; + margin-bottom: 0.75rem; + } + + .welcome-content p { + margin-bottom: 1.5rem; + font-size: 0.9rem; + } + + .example-questions { + gap: 1rem; + } + + .example-title { + font-size: 0.85rem; + margin-bottom: 0.75rem; } .example-grid { grid-template-columns: 1fr; - max-width: 400px; + max-width: 100%; gap: 0.75rem; - padding: 0 0.5rem; + padding: 0; } .example-question { - padding: 0.8rem 1.25rem; + padding: 0.75rem 1rem; font-size: 0.85rem; - min-height: 50px; + min-height: 48px; + margin: 0 0.5rem; + text-align: center; + justify-content: center; } .example-icon { - font-size: 1rem; + font-size: 1.1rem; } .chat-input { @@ -1699,7 +1706,65 @@ const stopStreaming = async () => { } .chat-messages { - padding: 1.5rem 0.75rem 80px 0.75rem; /* 为固定输入框留出空间 */ + padding: 1rem 0.75rem 100px 0.75rem; /* 为固定输入框留出空间 */ + } + + .welcome-message { + height: auto; + min-height: calc(100vh - 180px); /* 减去header和输入框的高度 */ + align-items: flex-start; + padding-top: 1rem; + } + + .welcome-content { + padding: 0 0.5rem 2rem 0.5rem; + max-width: 100%; + } + + .welcome-icon { + font-size: 2rem; + margin-bottom: 1rem; + } + + .welcome-content h3 { + font-size: 1.1rem; + margin-bottom: 0.5rem; + } + + .welcome-content p { + margin-bottom: 1.25rem; + font-size: 0.85rem; + line-height: 1.5; + } + + .example-questions { + gap: 0.75rem; + } + + .example-title { + font-size: 0.8rem; + margin-bottom: 0.5rem; + } + + .example-grid { + grid-template-columns: 1fr; + max-width: 100%; + gap: 0.5rem; + padding: 0; + } + + .example-question { + padding: 0.6rem 0.75rem; + font-size: 0.8rem; + min-height: 44px; + margin: 0; + text-align: center; + justify-content: center; + border-radius: 8px; + } + + .example-icon { + font-size: 1rem; } .conversation-header { @@ -1719,8 +1784,18 @@ const stopStreaming = async () => { height: 16px; } - .welcome-content { - padding: 0 1rem; + /* 移动端让会话操作按钮始终可见 */ + .conversation-actions { + opacity: 1; + } + + .conversation-actions .action-btn { + padding: 0.5rem; + } + + .conversation-actions .action-btn svg { + width: 16px; + height: 16px; } }