Default issue date field to today's date

Prefill 'Datum vystaveni' with the current local date when opening a
new invoice, instead of leaving it blank. Also switch date formatting
to use local date components instead of toISOString() to avoid UTC
timezone shifting the displayed date.

Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>

app/src/app.js

@@ -10,7 +10,7 @@ const { normalizeInvoiceData } = require('./invoice-data');
 const app = express();
 const sessionDurationMs = 1000 * 60 * 60 * 24 * 30;
 
-app.use(express.json());
+app.use(express.json({ limit: '2mb' }));
 
 const hashPassword = (password, salt = crypto.randomBytes(16).toString('hex')) => new Promise((resolve, reject) => {
     crypto.scrypt(password, salt, 64, (error, derivedKey) => {
@@ -480,6 +480,20 @@ app.delete('/api/invoices', requireAuth, async (req, res, next) => {
 });
 
 const pdfText = (value) => String(value || 'Neuvedeno');
+const formatCzechDate = (value) => {
+    const date = new Date(`${value}T00:00:00`);
+    return Number.isNaN(date.getTime()) ? '' : date.toLocaleDateString('cs-CZ');
+};
+const toDateInputValue = (date) => date.toISOString().slice(0, 10);
+const resolveIssueDate = (issueDate) => issueDate || toDateInputValue(new Date());
+const resolveDueDate = (dueDate, issueDate) => {
+    if (dueDate) {
+        return dueDate;
+    }
+    const due = new Date(`${resolveIssueDate(issueDate)}T00:00:00`);
+    due.setDate(due.getDate() + 14);
+    return toDateInputValue(due);
+};
 const formatCzechNumber = (value) => Number(value || 0).toLocaleString('cs-CZ', {
     minimumFractionDigits: 2,
     maximumFractionDigits: 2
@@ -535,6 +549,7 @@ const renderInvoicePdf = async (document, invoice) => {
         width: 180,
         margin: 1
     }) : null;
+    const signatureBuffer = data.signature ? Buffer.from(data.signature.split(',')[1], 'base64') : null;
     const pageWidth = document.page.width - document.page.margins.left - document.page.margins.right;
     const navy = '#183b56';
     const line = '#d8d4cc';
@@ -553,13 +568,25 @@ const renderInvoicePdf = async (document, invoice) => {
     const partyWidth = (pageWidth - 24) / 2;
     const customerX = document.page.margins.left + partyWidth + 24;
 
+    const issueDate = resolveIssueDate(data.issueDate);
+    const dueDate = resolveDueDate(data.dueDate, data.issueDate);
+
     const headerY = document.y;
     document.fillColor(navy).font(boldFont).fontSize(25).text('Faktura', document.page.margins.left, headerY);
     document.fillColor(navy).font(boldFont).fontSize(16).text(invoice.invoice_number, customerX, headerY, {
         width: partyWidth,
         align: 'right'
     });
-    document.y = headerY + 40;
+    document.fillColor(bodyText).font(regularFont).fontSize(9)
+        .text(`Datum vystavení: ${formatCzechDate(issueDate)}`, customerX, headerY + 22, {
+            width: partyWidth,
+            align: 'right'
+        })
+        .text(`Datum splatnosti: ${formatCzechDate(dueDate)}`, customerX, headerY + 35, {
+            width: partyWidth,
+            align: 'right'
+        });
+    document.y = headerY + 52;
 
     const partyTop = document.y;
     const drawParty = (x, title, profile, name) => {
@@ -574,28 +601,29 @@ const renderInvoicePdf = async (document, invoice) => {
 
     const tableTop = document.y + 12;
     const columns = [0, pageWidth * 0.52, pageWidth * 0.68, pageWidth * 0.82, pageWidth];
-    const rowHeight = 25;
-    document.rect(document.page.margins.left, tableTop, pageWidth, rowHeight).fill('#eef1f3');
+    const headerRowHeight = 25;
+    const itemRowHeight = 22.5;
+    document.rect(document.page.margins.left, tableTop, pageWidth, headerRowHeight).fill('#eef1f3');
     document.fillColor(navy).font(boldFont).fontSize(9);
     ['Položka', 'Množství', 'MJ', 'Cena za MJ'].forEach((heading, index) => {
         document.text(heading, document.page.margins.left + columns[index] + 6, tableTop + 8, {
             width: columns[index + 1] - columns[index] - 12
         });
     });
-    document.y = tableTop + rowHeight;
+    document.y = tableTop + headerRowHeight;
     (data.items || []).forEach((item, index) => {
         const rowTop = document.y;
-        document.rect(document.page.margins.left, rowTop, pageWidth, rowHeight)
+        document.rect(document.page.margins.left, rowTop, pageWidth, itemRowHeight)
             .fill(index % 2 ? lightBlue : warm);
-        document.moveTo(document.page.margins.left, rowTop + rowHeight)
-            .lineTo(document.page.margins.left + pageWidth, rowTop + rowHeight)
+        document.moveTo(document.page.margins.left, rowTop + itemRowHeight)
+            .lineTo(document.page.margins.left + pageWidth, rowTop + itemRowHeight)
             .strokeColor(line).lineWidth(0.7).stroke();
         document.fillColor(bodyText).font(regularFont).fontSize(9);
         [pdfText(item.popis), formatCzechNumber(item.mnozstvi), pdfText(item.mernaJednotka), `${formatCzechNumber(item.cenaZaMj)} Kč`]
-            .forEach((value, columnIndex) => document.text(value, document.page.margins.left + columns[columnIndex] + 6, rowTop + 8, {
+            .forEach((value, columnIndex) => document.text(value, document.page.margins.left + columns[columnIndex] + 6, rowTop + 6, {
                 width: columns[columnIndex + 1] - columns[columnIndex] - 12
             }));
-        document.y = rowTop + rowHeight;
+        document.y = rowTop + itemRowHeight;
     });
 
     document.y += 18;
@@ -607,16 +635,31 @@ const renderInvoicePdf = async (document, invoice) => {
     document.y += 35;
     document.moveTo(document.page.margins.left, document.y).lineTo(document.page.margins.left + pageWidth, document.y)
         .strokeColor(navy).lineWidth(1.5).stroke();
-    document.y += 12;
-    const paymentTop = document.y;
-    document.roundedRect(document.page.margins.left, paymentTop, pageWidth, 165, 4).fillAndStroke('#f4f7fb', line);
+    const paymentCardHeight = 105;
+    const paymentTop = document.page.height - document.page.margins.bottom - paymentCardHeight;
+    const paymentLineHeight = 18;
+    const qrSize = paymentLineHeight * 3;
+    if (signatureBuffer) {
+        const signatureWidth = 145;
+        const signatureHeight = signatureWidth / 2;
+        const signatureGap = 8;
+        const signatureX = document.page.margins.left + pageWidth - signatureWidth;
+        document.image(signatureBuffer, signatureX, paymentTop - signatureGap - signatureHeight, {
+            fit: [signatureWidth, signatureHeight]
+        });
+    }
+    document.roundedRect(document.page.margins.left, paymentTop, pageWidth, paymentCardHeight, 4)
+        .fillAndStroke('#f4f7fb', line);
     document.fillColor(navy).font(boldFont).fontSize(11).text('Platební údaje', document.page.margins.left + 10, paymentTop + 10);
     document.fillColor(bodyText).font(regularFont).fontSize(10)
         .text(`Číslo účtu: ${pdfText(payment.cisloUctu)}`, document.page.margins.left + 10, paymentTop + 35)
-        .text(`IBAN: ${pdfText(payment.iban)}`, document.page.margins.left + 10, paymentTop + 55)
-        .text(`SWIFT: ${pdfText(payment.swift)}`, document.page.margins.left + 10, paymentTop + 75);
+        .text(`IBAN: ${pdfText(payment.iban)}`, document.page.margins.left + 10, paymentTop + 35 + paymentLineHeight)
+        .text(`SWIFT: ${pdfText(payment.swift)}`, document.page.margins.left + 10, paymentTop + 35 + paymentLineHeight * 2);
     if (qrBuffer) {
-        document.image(qrBuffer, document.page.margins.left + pageWidth - 155, paymentTop + 10, { width: 145, height: 145 });
+        document.image(qrBuffer, document.page.margins.left + pageWidth - qrSize - 10, paymentTop + 30, {
+            width: qrSize,
+            height: qrSize
+        });
     }
     document.end();
 };

app/src/invoice-data.js

@@ -1,3 +1,5 @@
+const SIGNATURE_DATA_URL_PATTERN = /^data:image\/(png|jpeg);base64,[A-Za-z0-9+/]+=*$/;
+
 const normalizeInvoiceData = (data) => {
     if (!data || !Array.isArray(data.items)) {
         return null;
@@ -16,11 +18,16 @@ const normalizeInvoiceData = (data) => {
         return null;
     }
 
+    const signature = typeof data.signature === 'string' && SIGNATURE_DATA_URL_PATTERN.test(data.signature)
+        ? data.signature
+        : null;
+
     return {
         supplier: data.supplier || {},
         customer: data.customer || {},
         payment: data.payment || {},
         items,
+        signature,
         total: items.reduce((sum, item) => sum + item.mnozstvi * item.cenaZaMj, 0)
     };
 };

app/src/static/index.html

@@ -325,13 +325,28 @@
 
                     <div class="due-date-group">
                         <div class="form-group">
-                            <label for="dueDateOption">Datum splatnosti</label>
-                            <select id="dueDateOption">
-                                <option value="14">14 dní</option>
-                                <option value="30">30 dní</option>
-                            </select>
+                            <label for="issueDate">Datum vystavení</label>
+                            <input type="date" id="issueDate" name="issueDate" placeholder="Dnešní datum" />
                         </div>
-                        <output id="dueDateDisplay" class="due-date-display"></output>
+                        <div class="form-group">
+                            <label for="dueDate">Datum splatnosti</label>
+                            <input type="date" id="dueDate" name="dueDate" placeholder="14 dní od vystavení" />
+                        </div>
+                    </div>
+                </div>
+
+                <div class="form-chapter signature-row">
+                    <div class="form-group signature-group">
+                        <label for="signatureInput">Podpis (nepovinné)</label>
+                        <div id="signatureDropzone" class="signature-dropzone" tabindex="0" role="button" aria-label="Nahrát podpis kliknutím nebo přetažením souboru">
+                            <img id="signaturePreview" class="signature-preview" alt="Náhled podpisu" hidden />
+                            <p id="signatureDropzoneText" class="signature-dropzone-text">Přetáhněte sem obrázek podpisu (420×210 px, JPG nebo PNG) nebo klikněte pro výběr souboru</p>
+                            <input type="file" id="signatureInput" accept="image/png,image/jpeg" hidden />
+                        </div>
+                        <div class="signature-actions">
+                            <button type="button" id="removeSignatureButton" class="secondary-button" hidden>Odstranit podpis</button>
+                        </div>
+                        <p id="signatureStatus" class="signature-status" role="status" aria-live="polite"></p>
                     </div>
                 </div>
 

app/src/static/script.js

@@ -46,11 +46,17 @@ const invoiceStartingNumberInput = document.getElementById("invoiceStartingNumbe
 const saveNumberingSettingsButton = document.getElementById("saveNumberingSettingsButton");
 const cancelNumberingSettingsButton = document.getElementById("cancelNumberingSettingsButton");
 const numberingSettingsStatus = document.getElementById("numberingSettingsStatus");
-const dueDateOption = document.getElementById("dueDateOption");
-const dueDateDisplay = document.getElementById("dueDateDisplay");
+const issueDateInput = document.getElementById("issueDate");
+const dueDateInput = document.getElementById("dueDate");
 const paymentPresetSelect = document.getElementById("paymentPresetSelect");
 const paymentPresetName = document.getElementById("paymentPresetName");
 const savePaymentPresetButton = document.getElementById("savePaymentPresetButton");
+const signatureDropzone = document.getElementById("signatureDropzone");
+const signatureInput = document.getElementById("signatureInput");
+const signaturePreview = document.getElementById("signaturePreview");
+const signatureDropzoneText = document.getElementById("signatureDropzoneText");
+const removeSignatureButton = document.getElementById("removeSignatureButton");
+const signatureStatus = document.getElementById("signatureStatus");
 const loadPaymentPresetButton = document.getElementById("loadPaymentPresetButton");
 const deletePaymentPresetButton = document.getElementById("deletePaymentPresetButton");
 
@@ -74,6 +80,93 @@ let invoices = [];
 let paymentPresets = [];
 let currentInvoiceId = null;
 let isRegistrationMode = false;
+let signatureDataUrl = null;
+
+const SIGNATURE_WIDTH = 420;
+const SIGNATURE_HEIGHT = 210;
+
+const setSignatureStatus = (message, isError = false) => {
+    signatureStatus.textContent = message || "";
+    signatureStatus.classList.toggle("is-error", Boolean(isError));
+};
+
+const applySignaturePreview = (dataUrl) => {
+    signatureDataUrl = dataUrl || null;
+    if (signatureDataUrl) {
+        signaturePreview.src = signatureDataUrl;
+        signaturePreview.hidden = false;
+        signatureDropzoneText.hidden = true;
+        removeSignatureButton.hidden = false;
+    } else {
+        signaturePreview.hidden = true;
+        signaturePreview.src = "";
+        signatureDropzoneText.hidden = false;
+        removeSignatureButton.hidden = true;
+    }
+};
+
+const readImageDimensions = (dataUrl) => new Promise((resolve, reject) => {
+    const image = new Image();
+    image.onload = () => resolve({ width: image.naturalWidth, height: image.naturalHeight });
+    image.onerror = () => reject(new Error("Obrázek se nepodařilo načíst."));
+    image.src = dataUrl;
+});
+
+const handleSignatureFile = async (file) => {
+    if (!file) {
+        return;
+    }
+    if (!["image/png", "image/jpeg"].includes(file.type)) {
+        setSignatureStatus("Podporovány jsou pouze soubory JPG nebo PNG.", true);
+        return;
+    }
+    try {
+        const dataUrl = await new Promise((resolve, reject) => {
+            const reader = new FileReader();
+            reader.onload = () => resolve(reader.result);
+            reader.onerror = () => reject(new Error("Soubor se nepodařilo načíst."));
+            reader.readAsDataURL(file);
+        });
+        const { width, height } = await readImageDimensions(dataUrl);
+        if (width !== SIGNATURE_WIDTH || height !== SIGNATURE_HEIGHT) {
+            setSignatureStatus(`Obrázek musí mít rozměry přesně ${SIGNATURE_WIDTH}×${SIGNATURE_HEIGHT} px (nahráno ${width}×${height} px).`, true);
+            return;
+        }
+        applySignaturePreview(dataUrl);
+        setSignatureStatus("Podpis byl nahrán.");
+    } catch (error) {
+        setSignatureStatus(error.message, true);
+    }
+};
+
+signatureDropzone.addEventListener("click", () => signatureInput.click());
+signatureDropzone.addEventListener("keydown", (event) => {
+    if (event.key === "Enter" || event.key === " ") {
+        event.preventDefault();
+        signatureInput.click();
+    }
+});
+signatureDropzone.addEventListener("dragover", (event) => {
+    event.preventDefault();
+    signatureDropzone.classList.add("is-dragover");
+});
+signatureDropzone.addEventListener("dragleave", () => {
+    signatureDropzone.classList.remove("is-dragover");
+});
+signatureDropzone.addEventListener("drop", (event) => {
+    event.preventDefault();
+    signatureDropzone.classList.remove("is-dragover");
+    handleSignatureFile(event.dataTransfer.files[0]);
+});
+signatureInput.addEventListener("change", () => {
+    handleSignatureFile(signatureInput.files[0]);
+    signatureInput.value = "";
+});
+removeSignatureButton.addEventListener("click", (event) => {
+    event.stopPropagation();
+    applySignaturePreview(null);
+    setSignatureStatus("");
+});
 
 const profileFieldMap = {
     nazevSpolecnosti: "NazevSpolecnosti",
@@ -114,17 +207,21 @@ const getClientLabel = (client) => [
 
 const formatCzechDate = (dateValue) => new Date(`${dateValue}T00:00:00`).toLocaleDateString("cs-CZ");
 
-const getDueDays = () => Number.parseInt(dueDateOption.value, 10) || 14;
+const toDateInputValue = (date) => [
+    date.getFullYear(),
+    String(date.getMonth() + 1).padStart(2, "0"),
+    String(date.getDate()).padStart(2, "0")
+].join("-");
+
+const getIssueDate = () => issueDateInput.value || toDateInputValue(new Date());
 
 const getDueDate = () => {
-    const dueDate = new Date();
-    dueDate.setHours(0, 0, 0, 0);
-    dueDate.setDate(dueDate.getDate() + getDueDays());
-    return dueDate.toISOString().slice(0, 10);
-};
-
-const updateDueDate = () => {
-    dueDateDisplay.textContent = `Splatnost: ${formatCzechDate(getDueDate())}`;
+    if (dueDateInput.value) {
+        return dueDateInput.value;
+    }
+    const dueDate = new Date(`${getIssueDate()}T00:00:00`);
+    dueDate.setDate(dueDate.getDate() + 14);
+    return toDateInputValue(dueDate);
 };
 
 const updateClientTypeFields = () => {
@@ -240,6 +337,8 @@ deletePaymentPresetButton.addEventListener("click", async () => {
 });
 
 const readInvoiceData = () => ({
+    issueDate: getIssueDate(),
+    dueDate: getDueDate(),
     supplier: {
         ...readProfileFields("dodavatel"),
         typSubjektu: supplierTypeSelect.value
@@ -253,6 +352,7 @@ const readInvoiceData = () => ({
         iban: getValue("iban"),
         swift: getValue("swift")
     },
+    signature: signatureDataUrl,
     total: Number.parseFloat(getValue("total").replace(",", ".")) || 0,
     items: Array.from(itemsContainer.querySelectorAll(".invoice-item")).map((item) => {
         const inputs = item.querySelectorAll("input");
@@ -269,6 +369,8 @@ const clearInvoiceEditor = () => {
     currentInvoiceId = null;
     invoiceNumberDisplay.textContent = "Nová faktura";
     invoiceSaveStatus.textContent = "";
+    issueDateInput.value = toDateInputValue(new Date());
+    dueDateInput.value = "";
     writeProfileFields("odberatel", {});
     clientSelect.value = "";
     clientTypeSelect.value = "osoba";
@@ -279,6 +381,8 @@ const clearInvoiceEditor = () => {
     ["cisloUctu", "iban", "swift"].forEach((id) => {
         document.getElementById(id).value = "";
     });
+    applySignaturePreview(null);
+    setSignatureStatus("");
     itemsContainer.replaceChildren();
     itemIndex = 0;
     updateTotal();
@@ -288,6 +392,8 @@ const loadInvoiceIntoEditor = (invoice) => {
     currentInvoiceId = invoice.id;
     invoiceNumberDisplay.textContent = invoice.invoiceNumber;
     invoiceSaveStatus.textContent = "";
+    issueDateInput.value = invoice.data.issueDate || "";
+    dueDateInput.value = invoice.data.dueDate || "";
     writeProfileFields("dodavatel", invoice.data.supplier || {});
     supplierTypeSelect.value = invoice.data.supplier?.typSubjektu || "osoba";
     updateSupplierTypeFields();
@@ -300,6 +406,8 @@ const loadInvoiceIntoEditor = (invoice) => {
     ["cisloUctu", "iban", "swift"].forEach((id) => {
         document.getElementById(id).value = invoice.data.payment?.[id] || "";
     });
+    applySignaturePreview(invoice.data.signature || null);
+    setSignatureStatus("");
     itemsContainer.replaceChildren();
     itemIndex = 0;
     (invoice.data.items || []).forEach((item) => addInvoiceItem(item));

app/src/static/style.css

@@ -627,6 +627,72 @@ body {
     gap: 2rem;
 }
 
+.signature-row {
+    align-items: flex-start;
+}
+
+.signature-group {
+    width: 100%;
+    max-width: 420px;
+}
+
+.signature-dropzone {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    gap: 0.5rem;
+    min-height: 120px;
+    padding: 1rem;
+    text-align: center;
+    color: var(--muted-ink);
+    background: #fff;
+    border: 2px dashed #c8d0d5;
+    border-radius: 0.5rem;
+    cursor: pointer;
+    transition: border-color 0.15s ease, background 0.15s ease;
+}
+
+.signature-dropzone:hover,
+.signature-dropzone:focus-visible {
+    border-color: var(--blue);
+    outline: none;
+}
+
+.signature-dropzone.is-dragover {
+    border-color: var(--blue);
+    background: rgba(43, 111, 143, 0.08);
+}
+
+.signature-dropzone-text {
+    margin: 0;
+    font-size: 0.85rem;
+    line-height: 1.4;
+}
+
+.signature-preview {
+    display: block;
+    max-width: 100%;
+    max-height: 130px;
+    object-fit: contain;
+    border-radius: 0.25rem;
+}
+
+.signature-actions {
+    margin-top: 0.5rem;
+}
+
+.signature-status {
+    margin: 0.4rem 0 0;
+    min-height: 1.1rem;
+    color: var(--muted-ink);
+    font-size: 0.8rem;
+}
+
+.signature-status.is-error {
+    color: #b3261e;
+}
+
 .total-amount-group {
     grid-column: 1 / -1;
     margin: 0;

app/test/app.test.js

@@ -30,4 +30,23 @@ describe('normalizeInvoiceData', () => {
             { mnozstvi: 'not-a-number', cenaZaMj: 10 }
         ] })).toBeNull();
     });
+
+    test('accepts a valid signature data URL and rejects invalid ones', () => {
+        const withValidSignature = normalizeInvoiceData({
+            items: [{ mnozstvi: 1, cenaZaMj: 10 }],
+            signature: 'data:image/png;base64,aGVsbG8='
+        });
+        expect(withValidSignature.signature).toBe('data:image/png;base64,aGVsbG8=');
+
+        const withInvalidSignature = normalizeInvoiceData({
+            items: [{ mnozstvi: 1, cenaZaMj: 10 }],
+            signature: 'not-a-data-url'
+        });
+        expect(withInvalidSignature.signature).toBeNull();
+
+        const withoutSignature = normalizeInvoiceData({
+            items: [{ mnozstvi: 1, cenaZaMj: 10 }]
+        });
+        expect(withoutSignature.signature).toBeNull();
+    });
 });