AI 对话web、wx优化

urbanLifelineWeb/packages/workcase_wechat/pages/index/index.scss

@@ -261,6 +261,15 @@
     gap: 8px;
 }
 
+// 消息内容包装器（包含气泡和文件列表）
+.message-content-wrapper {
+    display: flex;
+    flex-direction: column;
+    align-items: flex-end;
+    gap: 8px;
+    max-width: 260px;
+}
+
 .bot-message-content {
     display: flex;
     flex-direction: row;
@@ -426,18 +435,121 @@
 .chat-input-wrap {
     position: relative;
     display: flex;
-    flex-direction: row;
-    align-items: center;
+    flex-direction: column;
     background: #fff;
     border-radius: 24px;
     padding: 4px;
     box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
 }
 
+// 已上传文件预览区
+.uploaded-files {
+    display: flex;
+    flex-direction: row;
+    flex-wrap: wrap;
+    gap: 8px;
+    padding: 8px 8px 4px;
+    border-bottom: 1px solid #f0f0f0;
+}
+
+.uploaded-file-item {
+    position: relative;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    width: 80px;
+    background: #f5f5f5;
+    border-radius: 8px;
+    padding: 8px;
+    gap: 4px;
+}
+
+.file-preview-image {
+    width: 64px;
+    height: 64px;
+    border-radius: 6px;
+    overflow: hidden;
+}
+
+.preview-img {
+    width: 100%;
+    height: 100%;
+}
+
+.file-preview-doc {
+    width: 64px;
+    height: 64px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    background: #fff;
+    border-radius: 6px;
+}
+
+.doc-icon {
+    font-size: 32px;
+}
+
+.file-name {
+    font-size: 11px;
+    color: #666;
+    width: 100%;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    text-align: center;
+}
+
+.remove-file-btn {
+    position: absolute;
+    top: -4px;
+    right: -4px;
+    width: 20px;
+    height: 20px;
+    border-radius: 10px;
+    background: #ff4d4f;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+
+.remove-icon {
+    font-size: 12px;
+    color: #fff;
+}
+
+// 输入行（上传按钮+输入框+发送按钮）
+.input-row {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    padding: 4px;
+}
+
+.upload-btn {
+    width: 40px;
+    height: 40px;
+    border-radius: 20px;
+    background: #f5f5f5;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    flex-shrink: 0;
+    margin-right: 4px;
+}
+
+.upload-btn.uploading {
+    background: #e6f7ff;
+}
+
+.upload-icon {
+    font-size: 20px;
+}
+
 .chat-input {
     flex: 1;
     height: 40px;
-    padding: 0 16px;
+    padding: 0 12px;
     background: transparent;
     border: none;
     font-size: 14px;
@@ -458,6 +570,16 @@
     align-items: center;
     justify-content: center;
     flex-shrink: 0;
+    margin-left: 4px;
+}
+
+.send-btn.active {
+    background: linear-gradient(135deg, #5b9eff 0%, #4b87ff 100%);
+    border-color: #4b87ff;
+}
+
+.send-btn.active .send-icon {
+    color: #fff;
 }
 
 .send-icon {
@@ -465,6 +587,65 @@
     color: #4b87ff;
 }
 
+// 消息中的文件列表
+.message-files {
+    display: flex;
+    flex-direction: row;
+    flex-wrap: wrap;
+    gap: 8px;
+    width: 100%;
+}
+
+.message-file-item {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    width: 70px;
+}
+
+.file-thumb {
+    width: 70px;
+    height: 70px;
+    border-radius: 8px;
+    overflow: hidden;
+    background: #f5f5f5;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    gap: 4px;
+}
+
+.file-thumb.image {
+    border: 1px solid #e5e5e5;
+    background: #fff;
+}
+
+.file-img {
+    width: 100%;
+    height: 100%;
+}
+
+.file-thumb.doc {
+    background: #f5f5f5;
+    padding: 8px;
+}
+
+.file-icon {
+    font-size: 28px;
+}
+
+.file-name-small {
+    font-size: 10px;
+    color: #666;
+    text-align: center;
+    width: 100%;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    padding: 0 4px;
+}
+
 // 打字指示器动画
 .typing-indicator {
     display: flex;