文件传输10-传输页面优化1

web/src/lib/clipboard/clipboard-manager-new.ts

@@ -584,16 +584,16 @@ export class ClipboardManager {
 
     private async handleDataChannelMessage(data: any): Promise<void> {
         // Handle different types of data channel messages
-        switch (data.type) {
+        switch (data.type) {            case 'text':
-            case 'text':
                 // Convert array back to ArrayBuffer for decryption
                 const encryptedBuffer = new Uint8Array(data.content).buffer;
                 const decryptedText = await this.decryptData(encryptedBuffer);
                 clipboardState.update(state => ({
                     ...state,
-                    receivedText: decryptedText
+                    receivedText: decryptedText,
+                    activeTab: 'text' // 自动切换到文本分享标签
                 }));
-                console.log('Text received successfully');
+                console.log('Text received successfully, switched to text tab');
                 break;
                 
             case 'file_start':
@@ -604,13 +604,13 @@ export class ClipboardManager {
                     type: data.mimeType || data.type,
                     chunks: [],
                     receivedSize: 0
-                };
+                };                clipboardState.update(state => ({ 
-                clipboardState.update(state => ({ 
                     ...state, 
                     receivingFiles: true, 
-                    transferProgress: 0 
+                    transferProgress: 0,
+                    activeTab: 'files' // 自动切换到文件传输标签
                 }));
-                console.log('Started receiving file:', data.name);
+                console.log('Started receiving file:', data.name, ', switched to files tab');
                 break;
                 
             case 'file_chunk':
@@ -672,8 +672,11 @@ export class ClipboardManager {
             console.error('Data channel not ready');
             return;
         }
-        
+          try {
-        try {
+            // 自动切换到文本分享标签
+            clipboardState.update(state => ({ ...state, activeTab: 'text' }));
+            console.log('Switched to text tab for sending');
+            
             const encryptedText = await this.encryptData(text);
             // Convert ArrayBuffer to Array for JSON serialization
             const encryptedArray = Array.from(new Uint8Array(encryptedText));
@@ -705,9 +708,15 @@ export class ClipboardManager {
             console.log('No files to send');
             return;
         }
-        
+          try {
-        try {
+            // 自动切换到文件传输标签
-            clipboardState.update(state => ({ ...state, sendingFiles: true, transferProgress: 0 }));
+            clipboardState.update(state => ({ 
+                ...state, 
+                sendingFiles: true, 
+                transferProgress: 0,
+                activeTab: 'files'
+            }));
+            console.log('Switched to files tab for sending');
             
             for (let i = 0; i < currentFiles.length; i++) {
                 const file = currentFiles[i];

web/src/lib/clipboard/clipboard-manager.ts

@@ -670,8 +670,11 @@ export class ClipboardManager {
         if (!this.dataChannel || this.dataChannel.readyState !== 'open') {
             console.error('Data channel not ready');
             return;
-        }
+        }        try {
-          try {
+            // 自动切换到文本分享标签
+            clipboardState.update(state => ({ ...state, activeTab: 'text' }));
+            console.log('Switched to text tab for sending');
+            
             console.log('🔐 Encrypting text:', text.substring(0, 20) + '...');
             const encryptedText = await this.encryptData(text);
             // Convert ArrayBuffer to Array for JSON serialization
@@ -705,9 +708,15 @@ export class ClipboardManager {
             console.log('No files to send');
             return;
         }
-        
+          try {
-        try {
+            // 自动切换到文件传输标签
-            clipboardState.update(state => ({ ...state, sendingFiles: true, transferProgress: 0 }));
+            clipboardState.update(state => ({ 
+                ...state, 
+                sendingFiles: true, 
+                transferProgress: 0,
+                activeTab: 'files'
+            }));
+            console.log('Switched to files tab for sending');
             
             for (let i = 0; i < currentFiles.length; i++) {
                 const file = currentFiles[i];

web/src/routes/+layout.svelte

@@ -162,14 +162,25 @@
             var(--button-hover),
             var(--button),
             var(--button-hover)
-        );
+        );        --skeleton-gradient-elevated: linear-gradient(
-
-        --skeleton-gradient-elevated: linear-gradient(
             90deg,
             var(--button-elevated),
             var(--button-elevated-shimmer),
             var(--button-elevated)
-        );
+        );        /* Accent colors for light theme */
+        --accent: #82b52d;
+        --accent-hover: #6fa525;
+        --accent-rgb: 130, 181, 45;
+        --accent-background: rgba(130, 181, 45, 0.1);
+        
+        /* Additional colors for components */
+        --background: #ffffff;
+        --text: #282828;
+        --subtext: #75757e;
+        --orange: #ff9500;
+        --orange-background: rgba(255, 149, 0, 0.1);
+        --yellow: #ffcc02;
+        --yellow-background: rgba(255, 204, 2, 0.1);
     }
 
     :global([data-theme="dark"]) {
@@ -219,14 +230,25 @@
             var(--button),
             var(--button-hover),
             var(--button)
-        );
+        );        --skeleton-gradient-elevated: linear-gradient(
-
-        --skeleton-gradient-elevated: linear-gradient(
             90deg,
             var(--button-elevated),
             var(--button-elevated-hover),
             var(--button-elevated)
-        );
+        );        /* Accent colors for dark theme */
+        --accent: #82b52d;
+        --accent-hover: #9bc53a;
+        --accent-rgb: 130, 181, 45;
+        --accent-background: rgba(130, 181, 45, 0.1);
+        
+        /* Additional colors for components */
+        --background: #000000;
+        --text: #e1e1e1;
+        --subtext: #818181;
+        --orange: #ff9500;
+        --orange-background: rgba(255, 149, 0, 0.1);
+        --yellow: #ffcc02;
+        --yellow-background: rgba(255, 204, 2, 0.1);
     }
 
     :global([data-theme="light"] [data-reduce-transparency="true"]) {