aknuth/invoice-system
1
0
Fork 0
Code Issues 2 Pull Requests Packages Projects Releases Wiki Activity

refactoring

Browse Source
This commit is contained in:
Andreas Knuth
2026-03-04 17:03:51 -06:00
parent 27ecafea5f
commit e333628f1c
16 changed files with 1222 additions and 1296 deletions
Download Patch File Download Diff File Expand all files Collapse all files

104
public/index.html
View File

@@ -7,61 +7,12 @@
<script src="https://cdn.tailwindcss.com"></script>
<link href="https://cdn.quilljs.com/1.3.6/quill.snow.css" rel="stylesheet">
<script src="https://cdn.quilljs.com/1.3.6/quill.js"></script>
<script src="js/components/customer-search.js"></script>
<script defer src="https://cdn.jsdelivr.net/npm/alpinejs@3.x.x/dist/cdn.min.js"></script>
<link rel="icon" type="image/x-icon" href="/favicon.ico">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon.png">
<link rel="apple-touch-icon" sizes="192x192" href="/favicon-192.png">
<style>
.modal {
display: none;
}
.modal.active {
display: flex;
}
/* Invoice/Quote Modal - deutlichere Feldumrandungen */
#invoice-modal input,
#invoice-modal select,
#invoice-modal textarea,
#quote-modal input,
#quote-modal select,
#quote-modal textarea {
border: 1.5px solid #9ca3af !important;
}
#invoice-modal input:focus,
#invoice-modal select:focus,
#invoice-modal textarea:focus,
#quote-modal input:focus,
#quote-modal select:focus,
#quote-modal textarea:focus {
border-color: #3b82f6 !important;
box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.2) !important;
}
/* Line Item Felder + Rich Text Editor */
#invoice-modal .ql-container,
#invoice-modal .ql-toolbar,
#quote-modal .ql-container,
#quote-modal .ql-toolbar {
border: 1.5px solid #9ca3af !important;
}
.item-row input,
.item-row select,
.invoice-item input,
.invoice-item select,
#invoice-items input,
#invoice-items select,
#quote-items input,
#quote-items select {
border: 1.5px solid #9ca3af !important;
}
#invoice-items > div,
#quote-items > div,
#invoice-items .border,
#quote-items .border {
border: 1.5px solid #9ca3af !important;
}
</style>
<link rel="stylesheet" href="css/styles.css">
</head>
<body class="bg-gray-100">
<div class="min-h-screen">
@@ -111,7 +62,7 @@
</div>
</div>
<!-- Invoices Tab -->
<!-- Invoices Tab -->
<div id="invoices-tab" class="tab-content hidden">
<div class="flex justify-between items-center mb-4">
<h2 class="text-3xl font-bold text-gray-800">Invoices</h2>
@@ -120,7 +71,6 @@
</button>
</div>
<!-- Toolbar wird von invoice-view.js injiziert -->
<div id="invoice-toolbar"></div>
<div class="bg-white rounded-lg shadow-md overflow-hidden">
@@ -209,6 +159,9 @@
</button>
<div id="qbo-import-result" class="mt-4 hidden"></div>
<hr class="my-8 border-gray-200">
<h3 class="text-xl font-semibold mb-4 text-gray-800">QuickBooks Online Authorization</h3>
<p class="text-gray-600 mb-4">
Wenn der Token abgelaufen ist oder die Verbindung fehlschlägt,
@@ -224,7 +177,6 @@
</div>
<script>
// QBO Status beim Laden prüfen
fetch('/api/qbo/status')
.then(r => r.json())
.then(data => {
@@ -240,6 +192,8 @@
});
</script>
<hr class="my-8 border-gray-200">
<h3 class="text-xl font-semibold mb-4 text-gray-800">QuickBooks Online Connection Test</h3>
<p class="text-gray-600 mb-4">Test the connection and token refresh logic by fetching a report of overdue invoices (> 30 days) directly from QBO.</p>
@@ -260,10 +214,10 @@
</tr>
</thead>
<tbody id="qbo-result-list" class="divide-y divide-gray-200 text-sm">
</tbody>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
@@ -361,13 +315,9 @@
<div class="flex justify-end space-x-3 pt-4">
<button type="button" onclick="closeQuoteModal()"
class="px-6 py-2 bg-gray-200 text-gray-700 rounded-md hover:bg-gray-300">
Cancel
</button>
class="px-6 py-2 bg-gray-200 text-gray-700 rounded-md hover:bg-gray-300">Cancel</button>
<button type="submit"
class="px-6 py-2 bg-blue-600 text-white rounded-md hover:bg-blue-700">
Save Quote
</button>
class="px-6 py-2 bg-blue-600 text-white rounded-md hover:bg-blue-700">Save Quote</button>
</div>
</form>
</div>
@@ -386,7 +336,7 @@
</div>
<form id="invoice-form" class="space-y-6">
<div class="grid grid-cols-6 gap-4">
<div class="grid grid-cols-6 gap-4">
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">Invoice #</label>
<input type="text" id="invoice-number" pattern="[0-9]*"
@@ -495,35 +445,15 @@
<div class="flex justify-end space-x-3 pt-4">
<button type="button" onclick="closeInvoiceModal()"
class="px-6 py-2 bg-gray-200 text-gray-700 rounded-md hover:bg-gray-300">
Cancel
</button>
class="px-6 py-2 bg-gray-200 text-gray-700 rounded-md hover:bg-gray-300">Cancel</button>
<button type="submit"
class="px-6 py-2 bg-blue-600 text-white rounded-md hover:bg-blue-700">
Save Invoice
</button>
class="px-6 py-2 bg-blue-600 text-white rounded-md hover:bg-blue-700">Save Invoice</button>
</div>
</form>
</div>
</div>
<script src="app.js"></script>
<script type="module">
import { loadCustomers, renderCustomerView, injectToolbar as injectCustomerToolbar } from './customer-view.js';
// Override showTab to inject customer toolbar
const originalShowTab = window.showTab;
window.showTab = function(tab) {
originalShowTab(tab);
if (tab === 'customers') {
injectCustomerToolbar();
renderCustomerView();
}
};
// Load customers on init (needed for quote/invoice dropdowns)
loadCustomers();
</script>
<script type="module" src="invoice-view-init.js"></script>
<!-- Single module entry point — all JS loaded from here -->
<script type="module" src="js/app.js"></script>
</body>
</html>