diff --git a/public/app.js b/public/app.js
index 666fa7c..42ea0bc 100644
--- a/public/app.js
+++ b/public/app.js
@@ -318,8 +318,11 @@ function addQuoteItem(item = null) {
@@ -349,6 +352,35 @@ function addQuoteItem(item = null) {
itemsDiv.appendChild(itemDiv);
+ // Initialize Quill editor for description
+ const editorDiv = itemDiv.querySelector('.item-description-editor');
+ const hiddenInput = itemDiv.querySelector('.item-description-html');
+
+ const quill = new Quill(editorDiv, {
+ theme: 'snow',
+ modules: {
+ toolbar: [
+ ['bold', 'italic', 'underline'],
+ [{ 'list': 'ordered'}, { 'list': 'bullet' }],
+ ['clean']
+ ]
+ }
+ });
+
+ // Load existing content if editing
+ if (item && item.description) {
+ quill.root.innerHTML = item.description;
+ }
+
+ // Save HTML content on change
+ quill.on('text-change', () => {
+ hiddenInput.value = quill.root.innerHTML;
+ updateTotals();
+ });
+
+ // Store quill instance for later access
+ editorDiv.quillInstance = quill;
+
// Get references to inputs for auto-calculation
const qtyInput = itemDiv.querySelector('[data-field="quantity"]');
const rateInput = itemDiv.querySelector('[data-field="rate"]');
@@ -442,9 +474,14 @@ function getQuoteItems() {
const itemDivs = document.querySelectorAll('#quote-items > div');
itemDivs.forEach(div => {
+ const descEditor = div.querySelector('.item-description-editor');
+ const descriptionHTML = descEditor && descEditor.quillInstance
+ ? descEditor.quillInstance.root.innerHTML
+ : '';
+
const item = {
quantity: div.querySelector('[data-field="quantity"]').value,
- description: div.querySelector('[data-field="description"]').value,
+ description: descriptionHTML,
rate: div.querySelector('[data-field="rate"]').value,
amount: div.querySelector('[data-field="amount"]').value,
is_tbd: div.querySelector('[data-field="is_tbd"]').checked
diff --git a/public/index.html b/public/index.html
index a581ac2..99577a5 100644
--- a/public/index.html
+++ b/public/index.html
@@ -5,6 +5,8 @@
Quote Management System - Bay Area Affiliates
+
+