asdasd

public/app.js

@@ -4,17 +4,29 @@ let quotes = [];
 let currentQuoteId = null;
 let currentCustomerId = null;
 let itemCounter = 0;
+let currentLogoFile = null;
 
 // Initialize app
 document.addEventListener('DOMContentLoaded', () => {
     loadCustomers();
     loadQuotes();
     setDefaultDate();
+    checkCurrentLogo();
     
     // Setup form handlers
     document.getElementById('customer-form').addEventListener('submit', handleCustomerSubmit);
     document.getElementById('quote-form').addEventListener('submit', handleQuoteSubmit);
     document.getElementById('quote-tax-exempt').addEventListener('change', updateTotals);
+    
+    // Setup logo upload handler
+    document.getElementById('logo-upload').addEventListener('change', (e) => {
+        const file = e.target.files[0];
+        if (file) {
+            currentLogoFile = file;
+            document.getElementById('logo-filename').textContent = file.name;
+            document.getElementById('upload-btn').disabled = false;
+        }
+    });
 });
 
 // Tab Management
@@ -29,6 +41,61 @@ function showTab(tabName) {
         loadQuotes();
     } else if (tabName === 'customers') {
         loadCustomers();
+    } else if (tabName === 'settings') {
+        checkCurrentLogo();
+    }
+}
+
+// Logo Management
+async function checkCurrentLogo() {
+    try {
+        const response = await fetch('/api/logo-info');
+        if (response.ok) {
+            const data = await response.json();
+            if (data.hasLogo) {
+                document.getElementById('logo-preview').classList.remove('hidden');
+                document.getElementById('logo-image').src = data.logoPath + '?t=' + Date.now();
+            }
+        }
+    } catch (error) {
+        console.error('Error checking logo:', error);
+    }
+}
+
+async function uploadLogo() {
+    if (!currentLogoFile) {
+        alert('Please select a file first');
+        return;
+    }
+    
+    const formData = new FormData();
+    formData.append('logo', currentLogoFile);
+    
+    const statusDiv = document.getElementById('upload-status');
+    statusDiv.innerHTML = '<p class="text-blue-600">Uploading...</p>';
+    
+    try {
+        const response = await fetch('/api/upload-logo', {
+            method: 'POST',
+            body: formData
+        });
+        
+        if (response.ok) {
+            const data = await response.json();
+            statusDiv.innerHTML = '<p class="text-green-600">✓ Logo uploaded successfully!</p>';
+            document.getElementById('logo-preview').classList.remove('hidden');
+            document.getElementById('logo-image').src = data.path + '?t=' + Date.now();
+            document.getElementById('upload-btn').disabled = true;
+            currentLogoFile = null;
+            document.getElementById('logo-filename').textContent = '';
+            document.getElementById('logo-upload').value = '';
+        } else {
+            const error = await response.json();
+            statusDiv.innerHTML = `<p class="text-red-600">✗ Error: ${error.error}</p>`;
+        }
+    } catch (error) {
+        console.error('Upload error:', error);
+        statusDiv.innerHTML = '<p class="text-red-600">✗ Upload failed</p>';
     }
 }
 

public/index.html

@@ -27,6 +27,7 @@
                     <div class="flex space-x-4">
                         <button onclick="showTab('quotes')" id="tab-quotes" class="px-4 py-2 rounded hover:bg-blue-800 tab-btn">Quotes</button>
                         <button onclick="showTab('customers')" id="tab-customers" class="px-4 py-2 rounded hover:bg-blue-800 tab-btn">Customers</button>
+                        <button onclick="showTab('settings')" id="tab-settings" class="px-4 py-2 rounded hover:bg-blue-800 tab-btn">Settings</button>
                     </div>
                 </div>
             </div>
@@ -88,6 +89,38 @@
                     </table>
                 </div>
             </div>
+
+            <!-- Settings Tab -->
+            <div id="settings-tab" class="tab-content hidden">
+                <div class="mb-6">
+                    <h2 class="text-3xl font-bold text-gray-800">Settings</h2>
+                </div>
+
+                <div class="bg-white rounded-lg shadow-md p-6">
+                    <h3 class="text-xl font-semibold mb-4">Company Logo</h3>
+                    <p class="text-gray-600 mb-4">Upload your company logo to appear on quotes and PDFs. Recommended size: 200x200px (PNG or JPG)</p>
+                    
+                    <div class="mb-4">
+                        <div id="logo-preview" class="mb-4 hidden">
+                            <p class="text-sm text-gray-600 mb-2">Current Logo:</p>
+                            <img id="logo-image" src="" alt="Company Logo" class="h-20 border border-gray-300 rounded">
+                        </div>
+                        
+                        <input type="file" id="logo-upload" accept="image/png,image/jpeg,image/jpg,image/gif" class="hidden">
+                        <button onclick="document.getElementById('logo-upload').click()" 
+                                class="bg-blue-600 hover:bg-blue-700 text-white px-6 py-2 rounded-lg">
+                            Choose Logo
+                        </button>
+                        <span id="logo-filename" class="ml-4 text-gray-600"></span>
+                    </div>
+                    
+                    <button onclick="uploadLogo()" id="upload-btn" class="bg-green-600 hover:bg-green-700 text-white px-6 py-2 rounded-lg disabled:bg-gray-400" disabled>
+                        Upload Logo
+                    </button>
+                    
+                    <div id="upload-status" class="mt-4"></div>
+                </div>
+            </div>
         </div>
     </div>
 
@@ -257,4 +290,4 @@
 
     <script src="app.js"></script>
 </body>
-</html>
+</html>