el-contador 1.0.2 → 1.0.4

package/.env.example

@@ -1,5 +1,6 @@
-# Used by docker-compose for Postgres and the backend.
 # Copy to .env and set values: cp .env.example .env
+# These are used by Docker: the PostgreSQL container creates this user and database
+# automatically on first run. You do not need to install PostgreSQL or create them manually.
 
 DB_USER=el_contador
 DB_PASSWORD=

package/README.md

@@ -4,6 +4,8 @@ Bookkeeping and expense management – expenses, sales, bank transactions, and r
 
 ## Install (first time)
 
+You do **not** need to install PostgreSQL on the host or create a database/user manually. The first run creates everything from your `.env`: PostgreSQL runs in a container and creates the user and database automatically; the app then applies the schema and creates the admin user.
+
 1. Create a project directory and add the package:
 
    ```bash
@@ -12,16 +14,22 @@ Bookkeeping and expense management – expenses, sales, bank transactions, and r
    npm install el-contador
    ```
 
-2. Copy the env template and set at least `DB_PASSWORD` and `SESSION_SECRET`:
+2. Create `.env` with the credentials you want (these will be used to create the PostgreSQL user and database on first run):
 
    ```bash
    cp node_modules/el-contador/.env.example .env
-   # Edit .env: set DB_PASSWORD and SESSION_SECRET
    ```
 
-   `.env` is never published with the package (it is gitignored and not in the published files). Each installation uses its own `.env`; you can also set the Gemini API key later in the admin under **Invoice settings** (see below).
+   Edit `.env` and set at least:
+
+   - **DB_PASSWORD** – password for the database (required).
+   - **SESSION_SECRET** – long random string for session cookies.
+
+   Optional: **DB_USER** (default `el_contador`), **DB_NAME** (default `el_contador_finance`). The first run will create this PostgreSQL user and database inside the container; no separate setup needed.
 
-3. Start the app:
+   Run `npx el-contador` (or `docker compose ...`) from the **same directory** that contains `.env`. If you see `Set DB_PASSWORD in .env`, create or fix `.env` in that directory.
+
+3. Start the app (this starts PostgreSQL and the backend; on first run the DB and admin user are created):
 
    ```bash
    npx el-contador
@@ -33,7 +41,7 @@ Bookkeeping and expense management – expenses, sales, bank transactions, and r
    docker compose -f node_modules/el-contador/docker-compose.yml --env-file .env up -d
    ```
 
-4. Open the admin UI at `http://localhost:3080` (or the port in `ADMIN_PORT`). Log in with the admin user (see `.env`: `INIT_ADMIN_EMAIL` / `INIT_ADMIN_PASSWORD`, or `DB_PASSWORD` if `INIT_ADMIN_PASSWORD` is not set).
+4. Open the admin UI at `http://localhost:3080` (or the port in `ADMIN_PORT`). Log in with the admin user: **INIT_ADMIN_EMAIL** from `.env` (default `admin@example.com`), and **INIT_ADMIN_PASSWORD** or **DB_PASSWORD** if not set.
 
 ## Deploy on another server
 
@@ -98,6 +106,14 @@ Your data (database and uploads) lives in Docker volumes and is not overwritten
 - `el-contador down` or `el-contador stop` – stop containers.
 - `el-contador update` – run `npm update el-contador` then rebuild and start.
 
+If `npx el-contador` fails (e.g. "unknown shorthand flag: 'f'"), your host may have Docker but not the Compose plugin in the expected form. Install **docker-compose** (standalone) or run Compose manually from the same directory as `.env`:
+
+```bash
+docker-compose -f node_modules/el-contador/docker-compose.yml --env-file .env up -d
+```
+
+On Ubuntu: `sudo apt install docker-compose-plugin` (V2) or the standalone `docker-compose` package.
+
 ## Publishing to npm (maintainers)
 
 1. Create an npm account at [npmjs.com/signup](https://www.npmjs.com/signup) if needed.

package/admin/app.html

@@ -157,6 +157,10 @@
     .btn-secondary:hover {
       background: #f8fafc;
     }
+    .btn-secondary.btn-sm {
+      padding: 4px 10px;
+      font-size: 13px;
+    }
 
     .filter-toggles {
       display: inline-flex;
@@ -286,6 +290,24 @@
     @media (max-width: 800px) {
       #reconTwoCol { grid-template-columns: 1fr; }
     }
+
+    .recon-paired-table { width: 100%; }
+    .recon-paired-table td.recon-paired-cell {
+      padding: 6px 10px;
+      vertical-align: middle;
+      font-size: 14px;
+    }
+    .recon-pagination {
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      flex-wrap: wrap;
+      gap: 10px;
+      margin-top: 10px;
+      padding-top: 10px;
+      border-top: 1px solid var(--line);
+    }
+    .recon-pagination button:not(:last-child) { margin-right: 8px; }
   </style>
   <script src="https://cdn.jsdelivr.net/npm/chart.js@4.4.1/dist/chart.umd.min.js"></script>
   <script src="https://cdn.jsdelivr.net/npm/jspdf@2.5.1/dist/jspdf.umd.min.js"></script>
@@ -307,6 +329,7 @@
       <button class="tab-btn" data-tab="sales">Sales</button>
       <button class="tab-btn" data-tab="bank">Bank Transactions</button>
       <button class="tab-btn" data-tab="reconciliation">Reconciliation</button>
+      <button class="tab-btn" data-tab="accounts">Accounts</button>
       <button class="tab-btn" data-tab="customers">Customers</button>
       <button class="tab-btn" data-tab="suppliers">Suppliers</button>
       <button class="tab-btn" data-tab="vat-reports">VAT Reports</button>
@@ -1105,6 +1128,7 @@
       </div>
       <div class="panel">
         <h2>Bank Transactions</h2>
+        <p class="small" style="color: var(--muted);">Delete a line to remove duplicated or mistaken imports.</p>
         <table>
           <thead>
             <tr>
@@ -1113,6 +1137,7 @@
               <th>Description</th>
               <th>Amount</th>
               <th>Status</th>
+              <th>Actions</th>
             </tr>
           </thead>
           <tbody id="bankRows"></tbody>
@@ -1151,6 +1176,7 @@
           <div style="display: flex; align-items: center; flex-wrap: wrap; gap: 12px;">
             <button type="button" id="reconMatchSelected" class="btn-primary" disabled>Match selected</button>
             <button type="button" id="reconCreateAdjustment" class="btn-secondary hidden" title="Create expense to balance">+ Add expense to balance</button>
+            <button type="button" id="reconReconcileToAccount" class="btn-secondary hidden">Reconcile to account</button>
             <span id="reconSelectionStatus" class="small" style="color: var(--muted);"></span>
           </div>
         </div>
@@ -1207,16 +1233,86 @@
         </div>
       </div>
       <div id="reconPairedPanel" class="panel hidden">
-        <table>
+        <table class="recon-paired-table">
           <thead>
             <tr>
-              <th>Bank Transaction</th>
-              <th>Match Info</th>
-              <th>Action</th>
+              <th>Bank</th>
+              <th>Paired with</th>
+              <th></th>
             </tr>
           </thead>
           <tbody id="reconPairedRows"></tbody>
         </table>
+        <div id="reconPairedPagination" class="recon-pagination hidden">
+          <span id="reconPairedPaginationInfo" class="small" style="color: var(--muted);"></span>
+          <div>
+            <button type="button" id="reconPairedPrev" class="btn-secondary" disabled>Previous</button>
+            <button type="button" id="reconPairedNext" class="btn-secondary" disabled>Next</button>
+          </div>
+        </div>
+      </div>
+
+      <div id="reconToAccountModal" class="modal-overlay hidden">
+        <div class="panel" style="max-width: 400px; width: 100%; margin: 16px;">
+          <h2>Reconcile to account</h2>
+          <p class="small" style="color: var(--muted); margin: 0 0 12px 0;">Assign this bank transaction to a ledger account (no expense or invoice).</p>
+          <div class="field">
+            <label for="reconAccountType">Account type *</label>
+            <select id="reconAccountType" class="field" required>
+              <option value="loan">Loan</option>
+              <option value="accrual">Accrual</option>
+              <option value="retro">Retro</option>
+              <option value="other">Other</option>
+            </select>
+          </div>
+          <div class="field">
+            <label for="reconAccountNote">Note (optional)</label>
+            <textarea id="reconAccountNote" class="field" rows="2" placeholder="Short note for this ledger entry"></textarea>
+          </div>
+          <div id="reconToAccountError" class="small" style="color: var(--danger); margin-top: 8px; display: none;"></div>
+          <div class="actions" style="margin-top: 12px;">
+            <button type="button" id="reconToAccountSubmit" class="btn-primary">Submit</button>
+            <button type="button" id="reconToAccountCancel" class="btn-secondary">Cancel</button>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <section id="tab-accounts" class="tab-content hidden">
+      <div class="panel">
+        <h2>Accounts</h2>
+        <p class="small" style="color: var(--muted);">Ledger reconciliation for bank transactions that are not matched to an expense or invoice (e.g. loans, accruals, retros).</p>
+        <div style="display: flex; gap: 12px; align-items: center; flex-wrap: wrap; margin-bottom: 16px;">
+          <label class="small">Account type:</label>
+          <select id="accountsFilterType" class="field" style="width: auto;">
+            <option value="">All</option>
+            <option value="loan">Loan</option>
+            <option value="accrual">Accrual</option>
+            <option value="retro">Retro</option>
+            <option value="other">Other</option>
+          </select>
+          <label class="small">From:</label>
+          <input type="date" id="accountsFilterFrom" class="field" style="width: auto;">
+          <label class="small">To:</label>
+          <input type="date" id="accountsFilterTo" class="field" style="width: auto;">
+        </div>
+        <div style="border: 1px solid var(--line); border-radius: 8px; overflow: hidden;">
+          <table>
+            <thead>
+              <tr>
+                <th>Date</th>
+                <th>Type</th>
+                <th>Description</th>
+                <th style="text-align: right;">Amount</th>
+                <th>Account type</th>
+                <th>Note</th>
+                <th>Actions</th>
+              </tr>
+            </thead>
+            <tbody id="accountsRows"></tbody>
+          </table>
+        </div>
+        <p id="accountsEmpty" class="small" style="color: var(--muted); margin-top: 8px; display: none;">No transactions reconciled to account. Use Reconciliation tab and choose "Reconcile to account" for a bank transaction.</p>
       </div>
     </section>
 
@@ -1833,6 +1929,7 @@
           const bankArrow = bankIsIn ? "&#8593;" : "&#8595;";
           const bankColor = bankIsIn ? "var(--recon-in)" : "var(--recon-out)";
           const bankLabel = bankIsIn ? "Money In" : "Money Out";
+          const actionsCell = tx.reconciled ? "<span class=\"small\" style=\"color: var(--muted);\">Paired</span>" : `<button type="button" data-action="delete-bank" data-id="${tx.id}" class="btn-secondary">Delete</button>`;
           tr.innerHTML = `
             <td>${tx.date}</td>
             <td><span style="color: ${bankColor}; font-weight: 600;"><span style="font-weight: bold;">${bankArrow}</span> ${bankLabel}</span></td>
@@ -1842,6 +1939,7 @@
             </td>
             <td>${money(tx.amount)}</td>
             <td>${statusHtml}</td>
+            <td>${actionsCell}</td>
           `;
           rows.appendChild(tr);
         });
@@ -1944,6 +2042,8 @@
     }
 
     let reconciliationView = 'open'; // 'open' or 'paired'
+    let reconPairedPage = 0;
+    const reconPairedPageSize = 25;
     let reconSelectedBankId = null;
     let reconSuggestedPreSelect = null; // { type: 'expense'|'sale', id } to pre-check when "Use suggested" was clicked
 
@@ -2176,9 +2276,22 @@
                 adjBtn.removeAttribute("data-adjustment-amount");
               }
             }
+            const reconAccountBtn = document.getElementById("reconReconcileToAccount");
+            if (reconAccountBtn) {
+              const onlyBankSelected = !!bankTxId && expenseIds.length === 0 && !saleId;
+              if (onlyBankSelected) {
+                reconAccountBtn.classList.remove("hidden");
+                reconAccountBtn.dataset.bankId = bankTxId;
+              } else {
+                reconAccountBtn.classList.add("hidden");
+                reconAccountBtn.removeAttribute("data-bank-id");
+              }
+            }
           } else {
             overviewPanel.classList.add("hidden");
             if (adjBtn) adjBtn.classList.add("hidden");
+            const reconAccountBtn = document.getElementById("reconReconcileToAccount");
+            if (reconAccountBtn) { reconAccountBtn.classList.add("hidden"); reconAccountBtn.removeAttribute("data-bank-id"); }
           }
         }
 
@@ -2190,33 +2303,44 @@
 
         pairedRows.innerHTML = "";
         const filteredTx = data.bankTransactions
-          .filter((tx) => tx.reconciled)
+          .filter((tx) => tx.reconciled && tx.reconciliationRefType !== "account")
           .sort((a, b) => new Date(b.date) - new Date(a.date));
 
+        const totalCount = filteredTx.length;
+        const totalPages = Math.max(1, Math.ceil(totalCount / reconPairedPageSize));
+        reconPairedPage = Math.min(reconPairedPage, totalPages - 1);
+        const pageTx = filteredTx.slice(reconPairedPage * reconPairedPageSize, (reconPairedPage + 1) * reconPairedPageSize);
+
+        const paginationEl = document.getElementById("reconPairedPagination");
+        const paginationInfo = document.getElementById("reconPairedPaginationInfo");
+        const prevBtn = document.getElementById("reconPairedPrev");
+        const nextBtn = document.getElementById("reconPairedNext");
+        if (paginationEl) paginationEl.classList.toggle("hidden", totalCount <= reconPairedPageSize);
+        if (paginationInfo) {
+          const from = totalCount === 0 ? 0 : reconPairedPage * reconPairedPageSize + 1;
+          const to = Math.min((reconPairedPage + 1) * reconPairedPageSize, totalCount);
+          paginationInfo.textContent = totalCount === 0 ? "" : `Showing ${from}-${to} of ${totalCount}`;
+        }
+        if (prevBtn) prevBtn.disabled = reconPairedPage <= 0;
+        if (nextBtn) nextBtn.disabled = reconPairedPage >= totalPages - 1;
+
         if (!filteredTx.length) {
           const tr = document.createElement("tr");
           tr.innerHTML = `<td colspan="3" class="small" style="color: var(--muted);">No paired transactions yet.</td>`;
           pairedRows.appendChild(tr);
         } else {
-          filteredTx.forEach((tx) => {
+          pageTx.forEach((tx) => {
             const tr = document.createElement("tr");
-            let matchInfo = "";
-            let matchDetails = "";
+            let matchLine = "";
             let unmatchBtn = "";
 
             if (tx.reconciliationRefType === 'expenses') {
               const matchedExpenses = data.expenses.filter((e) => e.bankTransactionId === tx.id);
               const total = matchedExpenses.reduce((s, e) => s + (Number(e.amount) || 0) + (Number(e.vat) || 0), 0);
               const adj = Number(tx.adjustmentAmount) || 0;
-              matchInfo = `<span class="status-pill status-paired">Paired</span>`;
-              matchDetails = `
-                <div style="margin-top: 4px;">
-                  <strong>Expenses (${matchedExpenses.length}):</strong> ${matchedExpenses.map((e) => e.vendor).join(", ")}<br>
-                  <span class="small">Combined total: ${money(total)}</span>
-                  ${Math.abs(adj) >= 0.01 ? `<br><span class="small">Adjustment: ${adj >= 0 ? "+" : ""}${money(adj)}</span>` : ""}
-                </div>
-              `;
-              unmatchBtn = `<button type="button" data-action="unmatch" data-tx-id="${tx.id}" class="btn-secondary" style="margin-top:6px;">Unmatch</button>`;
+              const adjStr = Math.abs(adj) >= 0.01 ? ` (adj ${adj >= 0 ? "+" : ""}${money(adj)})` : "";
+              matchLine = `<span class="status-pill status-paired">Paired</span> Expenses (${matchedExpenses.length}): ${matchedExpenses.map((e) => escapeHtml(e.vendor)).join(", ")} &ndash; ${money(total)}${adjStr}`;
+              unmatchBtn = `<button type="button" data-action="unmatch" data-tx-id="${tx.id}" class="btn-secondary btn-sm">Unmatch</button>`;
             } else if (tx.reconciliationRefId) {
               let matchedItem = null;
               let matchedType = "";
@@ -2231,15 +2355,9 @@
                 const ref = matchedType === "Expense" ? matchedItem.vendor : (matchedItem.invoiceNo || matchedItem.customer);
                 const amount = matchedType === "Expense" ? (Number(matchedItem.amount) || 0) + (Number(matchedItem.vat) || 0) : matchedItem.total;
                 const adj = Number(tx.adjustmentAmount) || 0;
-                matchInfo = `<span class="status-pill status-paired">Paired</span>`;
-                matchDetails = `
-                  <div style="margin-top: 4px;">
-                    <strong>${matchedType}:</strong> ${ref}<br>
-                    <span class="small">${matchedType === "Expense" ? "Expense total" : "Invoice total"}: ${money(amount)}</span>
-                    ${Math.abs(adj) >= 0.01 ? `<br><span class="small">Adjustment: ${adj >= 0 ? "+" : ""}${money(adj)}</span>` : ""}
-                  </div>
-                `;
-                unmatchBtn = `<button type="button" data-action="unmatch" data-tx-id="${tx.id}" class="btn-secondary" style="margin-top:6px;">Unmatch</button>`;
+                const adjStr = Math.abs(adj) >= 0.01 ? ` (adj ${adj >= 0 ? "+" : ""}${money(adj)})` : "";
+                matchLine = `<span class="status-pill status-paired">Paired</span> ${matchedType}: ${escapeHtml(ref)} &ndash; ${money(amount)}${adjStr}`;
+                unmatchBtn = `<button type="button" data-action="unmatch" data-tx-id="${tx.id}" class="btn-secondary btn-sm">Unmatch</button>`;
               }
             }
 
@@ -2247,16 +2365,14 @@
             const txArrow = txIsIn ? "&#8593;" : "&#8595;";
             const txColor = txIsIn ? "var(--recon-in)" : "var(--recon-out)";
             const txLabel = txIsIn ? "Money In" : "Money Out";
+            const dateOnly = (tx.date || "").toString().slice(0, 10);
+            const desc = (tx.description || "").slice(0, 45);
+            const descTrunc = (tx.description || "").length > 45 ? desc + "..." : desc;
+            const pairedOn = tx.reconciledAt ? new Date(tx.reconciledAt).toLocaleDateString() : "—";
             tr.innerHTML = `
-              <td>
-                <strong style="color: ${txColor};"><span style="font-weight: bold;">${txArrow}</span> ${txLabel}</strong><br>
-                ${tx.date} - ${money(tx.amount)}<br>
-                <span class="small">${tx.description}</span>
-              </td>
-              <td>${matchInfo}${matchDetails}${unmatchBtn}
-                <div class="small" style="margin-top: 4px; color: var(--muted);">Paired on: ${tx.reconciledAt ? new Date(tx.reconciledAt).toLocaleDateString() : "Unknown"}</div>
-              </td>
-              <td><span class="status-pill status-done">Completed</span></td>
+              <td class="recon-paired-cell"><span style="color:${txColor};font-weight:600;">${txArrow} ${txLabel}</span> ${dateOnly} ${money(tx.amount)} <span class="small" style="color:var(--muted);">${escapeHtml(descTrunc)}</span></td>
+              <td class="recon-paired-cell"><span class="recon-paired-match">${matchLine}</span> <span class="small" style="color:var(--muted);">Paired ${pairedOn}</span> ${unmatchBtn}</td>
+              <td class="recon-paired-cell"><span class="status-pill status-done">Completed</span></td>
             `;
             pairedRows.appendChild(tr);
           });
@@ -2264,6 +2380,39 @@
       }
     }
 
+    function renderAccounts() {
+      const tbody = document.getElementById("accountsRows");
+      const emptyEl = document.getElementById("accountsEmpty");
+      if (!tbody) return;
+      const typeFilter = (document.getElementById("accountsFilterType") || {}).value || "";
+      const fromFilter = (document.getElementById("accountsFilterFrom") || {}).value || "";
+      const toFilter = (document.getElementById("accountsFilterTo") || {}).value || "";
+      let list = (data.bankTransactions || []).filter((tx) => tx.reconciliationRefType === "account");
+      if (typeFilter) list = list.filter((tx) => tx.accountType === typeFilter);
+      if (fromFilter) list = list.filter((tx) => tx.date >= fromFilter);
+      if (toFilter) list = list.filter((tx) => tx.date <= toFilter);
+      list = list.slice().sort((a, b) => new Date(b.date) - new Date(a.date));
+      tbody.innerHTML = "";
+      if (emptyEl) emptyEl.style.display = list.length === 0 ? "block" : "none";
+      const accountTypeLabel = (v) => ({ loan: "Loan", accrual: "Accrual", retro: "Retro", other: "Other" }[v] || v || "");
+      list.forEach((tx) => {
+        const tr = document.createElement("tr");
+        const isIn = tx.type === "in";
+        const color = isIn ? "var(--recon-in)" : "var(--recon-out)";
+        const typeLabel = isIn ? "Money In" : "Money Out";
+        tr.innerHTML = `
+          <td>${tx.date}</td>
+          <td><span style="color:${color};font-weight:600;">${typeLabel}</span></td>
+          <td>${escapeHtml((tx.description || "").slice(0, 60))}${(tx.description || "").length > 60 ? "..." : ""}</td>
+          <td style="text-align:right;"><strong>${money(tx.amount)}</strong></td>
+          <td>${escapeHtml(accountTypeLabel(tx.accountType))}</td>
+          <td>${escapeHtml((tx.accountNote || "").slice(0, 40))}${(tx.accountNote || "").length > 40 ? "..." : ""}</td>
+          <td><button type="button" class="btn-secondary" data-action="accounts-unmatch" data-bank-id="${tx.id}">Unreconcile</button></td>
+        `;
+        tbody.appendChild(tr);
+      });
+    }
+
     function getReconSelection() {
       const bankRow = document.querySelector("#reconBankRows tr.recon-bank-row.selected");
       const bankTxId = bankRow ? bankRow.dataset.txId : null;
@@ -2688,6 +2837,7 @@
       renderSales();
       renderBank();
       renderReconciliation();
+      renderAccounts();
       renderCustomers();
       renderSuppliers();
       updateCustomerSelect();
@@ -2710,6 +2860,7 @@
       if (tabName === "suppliers") updateSupplierCategorySelects();
       if (tabName === "admin") loadAdminData();
       if (tabName === "tasks") loadTasks();
+      if (tabName === "accounts") renderAccounts();
       if (tabName === "expenses") {
         const msgEl = document.getElementById("expenseApprovalMessage");
         if (msgEl) {
@@ -4334,6 +4485,46 @@
         alert(e.message || "Failed to create adjustment expense.");
       }
     });
+    document.getElementById("reconReconcileToAccount").addEventListener("click", function () {
+      const btn = document.getElementById("reconReconcileToAccount");
+      const bankId = btn && btn.dataset.bankId;
+      if (!bankId) return;
+      document.getElementById("reconToAccountModal").dataset.bankId = bankId;
+      document.getElementById("reconAccountType").value = "other";
+      document.getElementById("reconAccountNote").value = "";
+      document.getElementById("reconToAccountError").style.display = "none";
+      document.getElementById("reconToAccountModal").classList.remove("hidden");
+    });
+    document.getElementById("reconToAccountCancel").addEventListener("click", function () {
+      document.getElementById("reconToAccountModal").classList.add("hidden");
+    });
+    document.getElementById("reconToAccountModal").addEventListener("click", function (e) {
+      if (e.target.id === "reconToAccountModal") document.getElementById("reconToAccountModal").classList.add("hidden");
+    });
+    document.getElementById("reconToAccountSubmit").addEventListener("click", async function () {
+      const modal = document.getElementById("reconToAccountModal");
+      const bankId = modal.dataset.bankId;
+      const accountType = document.getElementById("reconAccountType").value;
+      const accountNote = document.getElementById("reconAccountNote").value.trim() || undefined;
+      const errEl = document.getElementById("reconToAccountError");
+      if (!bankId || !accountType) {
+        errEl.textContent = "Account type is required.";
+        errEl.style.display = "block";
+        return;
+      }
+      errEl.style.display = "none";
+      try {
+        await apiPost("/api/reconciliation/match-account", { bankTransactionId: bankId, accountType, accountNote });
+        document.getElementById("reconToAccountModal").classList.add("hidden");
+        reconSelectedBankId = null;
+        await loadAll();
+        renderReconciliation();
+        renderAccounts();
+      } catch (e) {
+        errEl.textContent = e.message || "Failed to reconcile to account.";
+        errEl.style.display = "block";
+      }
+    });
     document.getElementById("reconOpenNewExpenseModal").addEventListener("click", function () {
       const tx = reconSelectedBankId ? data.bankTransactions.find((t) => t.id === reconSelectedBankId) : null;
       if (!tx || tx.type !== "out") return;
@@ -4461,6 +4652,29 @@
       }
     });
 
+    document.getElementById("accountsRows").addEventListener("click", async (event) => {
+      const btn = event.target.closest("button[data-action='accounts-unmatch']");
+      if (btn && btn.dataset.bankId) {
+        await unmatchTransaction(btn.dataset.bankId);
+      }
+    });
+
+    document.getElementById("bankRows").addEventListener("click", async (event) => {
+      const deleteBtn = event.target.closest("button[data-action='delete-bank']");
+      if (deleteBtn && deleteBtn.dataset.id) {
+        if (!confirm("Delete this bank transaction? If it was matched, the invoice or expense will be unmatched.")) return;
+        await apiDelete("/api/bank-transactions/" + encodeURIComponent(deleteBtn.dataset.id));
+        data.bankTransactions = await apiGet("/api/bank-transactions");
+        renderBank();
+        renderReconciliation();
+        renderAccounts();
+      }
+    });
+
+    document.getElementById("accountsFilterType").addEventListener("change", () => renderAccounts());
+    document.getElementById("accountsFilterFrom").addEventListener("change", () => renderAccounts());
+    document.getElementById("accountsFilterTo").addEventListener("change", () => renderAccounts());
+
     // Reconciliation view toggle handlers
     document.getElementById("reconViewOpen").addEventListener("click", () => {
       reconciliationView = 'open';
@@ -4474,6 +4688,14 @@
       document.getElementById("reconViewOpen").classList.remove("active");
       renderReconciliation();
     });
+    document.getElementById("reconPairedPrev").addEventListener("click", () => {
+      reconPairedPage = Math.max(0, reconPairedPage - 1);
+      renderReconciliation();
+    });
+    document.getElementById("reconPairedNext").addEventListener("click", () => {
+      reconPairedPage += 1;
+      renderReconciliation();
+    });
 
     document.getElementById("btnLogout").addEventListener("click", async () => {
       await fetch("/api/auth/logout", { method: "POST", credentials: "same-origin" });

package/bin/cli.js

@@ -11,10 +11,31 @@ const hasEnv = fs.existsSync(envFile);
 
 const cmd = process.argv[2] || 'start';
 
-function composeArgs(sub) {
-  const a = ['compose', '-f', composePath];
-  if (hasEnv) a.push('--env-file', envFile);
-  return a.concat(sub);
+// Escape for safe use in a shell command (single-quote style)
+function shQuote(s) {
+  return "'" + String(s).replace(/'/g, "'\"'\"'") + "'";
+}
+
+// Run compose via shell so "docker compose" or "docker-compose" is parsed correctly by the OS
+function runCompose(subargs) {
+  const envPart = hasEnv ? ' --env-file ' + shQuote(envFile) : '';
+  const base = ' -f ' + shQuote(composePath) + envPart + ' ';
+  const full = base + subargs.join(' ');
+  const r = spawnSync(
+    process.platform === 'win32' ? 'cmd' : 'sh',
+    [process.platform === 'win32' ? '/c' : '-c', 'docker-compose' + full],
+    { stdio: 'inherit', cwd }
+  );
+  if (r.status === 0) return;
+  const r2 = spawnSync(
+    process.platform === 'win32' ? 'cmd' : 'sh',
+    [process.platform === 'win32' ? '/c' : '-c', 'docker compose' + full],
+    { stdio: 'inherit', cwd }
+  );
+  if (r2.status !== 0) {
+    console.error('el-contador: need "docker-compose" or "docker compose". Install Docker and Docker Compose.');
+    process.exit(1);
+  }
 }
 
 if (cmd === 'update') {
@@ -30,13 +51,11 @@ if (cmd === 'start' || cmd === 'up' || cmd === 'update') {
     process.exit(1);
   }
   if (!hasEnv) console.warn('el-contador: no .env in current directory; copy from node_modules/el-contador/.env.example');
-  const args = composeArgs(['up', '-d']);
-  if (cmd === 'update') args.push('--build');
-  const r = spawnSync('docker', args, { stdio: 'inherit', cwd });
-  process.exit(r.status !== null ? r.status : 1);
+  const subargs = ['up', '-d'];
+  if (cmd === 'update') subargs.push('--build');
+  runCompose(subargs);
 } else if (cmd === 'down' || cmd === 'stop') {
-  const r = spawnSync('docker', composeArgs(['down']), { stdio: 'inherit', cwd });
-  process.exit(r.status !== null ? r.status : 1);
+  runCompose(['down']);
 } else {
   console.log('Usage: el-contador [start|up|down|stop|update]');
   console.log('  start, up   Start the app (default). Requires .env in current directory.');

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "el-contador",
-  "version": "1.0.2",
+  "version": "1.0.4",
   "description": "Bookkeeping and expense management – run with Docker",
   "keywords": ["bookkeeping", "expenses", "docker", "accounting", "finance"],
   "license": "MIT",

package/server/db/init.js

@@ -13,6 +13,19 @@ async function init() {
     await pool.query("ALTER TABLE sales ADD COLUMN IF NOT EXISTS customer_address text");
     await pool.query("ALTER TABLE sales ADD COLUMN IF NOT EXISTS voided boolean NOT NULL DEFAULT false");
     await pool.query("ALTER TABLE sales ADD COLUMN IF NOT EXISTS voided_at timestamptz");
+    await pool.query("ALTER TABLE bank_transactions ADD COLUMN IF NOT EXISTS account_type text");
+    await pool.query("ALTER TABLE bank_transactions ADD COLUMN IF NOT EXISTS account_note text");
+    await pool.query(`
+      DO $$
+      BEGIN
+        IF EXISTS (SELECT 1 FROM pg_constraint WHERE conname = 'bank_transactions_reconciliation_ref_type_check') THEN
+          ALTER TABLE bank_transactions DROP CONSTRAINT bank_transactions_reconciliation_ref_type_check;
+        END IF;
+        ALTER TABLE bank_transactions ADD CONSTRAINT bank_transactions_reconciliation_ref_type_check
+          CHECK (reconciliation_ref_type IN ('expense', 'sale', 'expenses', 'account'));
+      EXCEPTION WHEN duplicate_object THEN NULL;
+      END $$;
+    `);
   } catch (e) { /* columns may already exist */ }
   const bcrypt = require('bcrypt');
   const email = process.env.INIT_ADMIN_EMAIL || 'admin@example.com';

package/server/db/schema.sql

@@ -109,9 +109,11 @@ CREATE TABLE IF NOT EXISTS bank_transactions (
   reference text,
   description text NOT NULL,
   reconciled boolean NOT NULL DEFAULT false,
-  reconciliation_ref_type text CHECK (reconciliation_ref_type IN ('expense', 'sale', 'expenses')),
+  reconciliation_ref_type text CHECK (reconciliation_ref_type IN ('expense', 'sale', 'expenses', 'account')),
   reconciliation_ref_id uuid,
   reconciled_at timestamptz,
+  account_type text,
+  account_note text,
   created_at timestamptz NOT NULL DEFAULT now()
 );
 
@@ -127,14 +129,14 @@ CREATE INDEX IF NOT EXISTS idx_bank_reconciled ON bank_transactions(reconciled);
 -- Migration: Adjustment amount when reconciliation balance is within 0.50 EUR
 ALTER TABLE bank_transactions ADD COLUMN IF NOT EXISTS adjustment_amount numeric(12,2) DEFAULT 0;
 
--- Migration: Allow reconciliation_ref_type 'expenses' for multi-expense match
+-- Migration: Allow reconciliation_ref_type 'expenses' and 'account' for multi-expense match and ledger
 DO $$
 BEGIN
   IF EXISTS (SELECT 1 FROM pg_constraint WHERE conname = 'bank_transactions_reconciliation_ref_type_check') THEN
     ALTER TABLE bank_transactions DROP CONSTRAINT bank_transactions_reconciliation_ref_type_check;
   END IF;
   ALTER TABLE bank_transactions ADD CONSTRAINT bank_transactions_reconciliation_ref_type_check
-    CHECK (reconciliation_ref_type IN ('expense', 'sale', 'expenses'));
+    CHECK (reconciliation_ref_type IN ('expense', 'sale', 'expenses', 'account'));
 EXCEPTION WHEN duplicate_object THEN NULL;
 END $$;
 CREATE INDEX IF NOT EXISTS idx_customers_name ON customers(name);

package/server/routes/bank.js

@@ -174,7 +174,7 @@ router.get('/', async (req, res) => {
   let r;
   try {
     r = await pool.query(
-      'SELECT id, date, type, amount, reference, description, reconciled, reconciliation_ref_type, reconciliation_ref_id, reconciled_at, adjustment_amount, created_at FROM bank_transactions ORDER BY date DESC'
+      'SELECT id, date, type, amount, reference, description, reconciled, reconciliation_ref_type, reconciliation_ref_id, reconciled_at, adjustment_amount, account_type, account_note, created_at FROM bank_transactions ORDER BY date DESC'
     );
   } catch (err) {
     if (err.code === '42703') {
@@ -195,6 +195,8 @@ router.get('/', async (req, res) => {
     reconciliationRefId: row.reconciliation_ref_id,
     reconciledAt: row.reconciled_at,
     adjustmentAmount: row.adjustment_amount != null ? Number(row.adjustment_amount) : 0,
+    accountType: row.account_type ?? null,
+    accountNote: row.account_note ?? null,
     createdAt: row.created_at,
   })));
 });
@@ -229,4 +231,45 @@ router.post('/', async (req, res) => {
   });
 });
 
+/** Delete a bank transaction (e.g. to remove duplicated import). Unlinks reconciliation on expense/sale if present. */
+router.delete('/:id', async (req, res) => {
+  const id = req.params.id;
+  const client = await pool.connect();
+  try {
+    const r = await client.query(
+      'SELECT id, reconciliation_ref_type, reconciliation_ref_id FROM bank_transactions WHERE id = $1',
+      [id]
+    );
+    if (r.rows.length === 0) {
+      return res.status(404).json({ error: 'Bank transaction not found' });
+    }
+    const row = r.rows[0];
+    await client.query('BEGIN');
+    if (row.reconciliation_ref_type === 'expense' && row.reconciliation_ref_id) {
+      await client.query(
+        'UPDATE expenses SET reconciled = false, reconciled_at = NULL, bank_transaction_id = NULL WHERE id = $1',
+        [row.reconciliation_ref_id]
+      );
+    } else if (row.reconciliation_ref_type === 'expenses') {
+      await client.query(
+        'UPDATE expenses SET reconciled = false, reconciled_at = NULL, bank_transaction_id = NULL WHERE bank_transaction_id = $1',
+        [id]
+      );
+    } else if (row.reconciliation_ref_type === 'sale' && row.reconciliation_ref_id) {
+      await client.query(
+        'UPDATE sales SET reconciled = false, reconciled_at = NULL WHERE id = $1',
+        [row.reconciliation_ref_id]
+      );
+    }
+    await client.query('DELETE FROM bank_transactions WHERE id = $1', [id]);
+    await client.query('COMMIT');
+    res.json({ ok: true });
+  } catch (e) {
+    await client.query('ROLLBACK');
+    throw e;
+  } finally {
+    client.release();
+  }
+});
+
 module.exports = router;

package/server/routes/reconciliation.js

@@ -123,7 +123,41 @@ router.post('/match-expenses', async (req, res) => {
   }
 });
 
-/** Unmatch a bank transaction from its expense(s) or sale */
+const ACCOUNT_TYPES = ['loan', 'accrual', 'retro', 'other'];
+
+/** Reconcile a bank transaction to an account (no expense or invoice). For loans, accruals, retros, etc. */
+router.post('/match-account', async (req, res) => {
+  const { bankTransactionId, accountType, accountNote } = req.body || {};
+  if (!bankTransactionId || !accountType || !ACCOUNT_TYPES.includes(accountType)) {
+    return res.status(400).json({
+      error: 'bankTransactionId and accountType required; accountType must be one of: loan, accrual, retro, other',
+    });
+  }
+  const now = new Date().toISOString();
+  try {
+    const txRow = await pool.query(
+      'SELECT id, reconciled FROM bank_transactions WHERE id = $1',
+      [bankTransactionId]
+    );
+    if (txRow.rows.length === 0) {
+      return res.status(404).json({ error: 'Bank transaction not found' });
+    }
+    if (txRow.rows[0].reconciled) {
+      return res.status(400).json({ error: 'Bank transaction is already reconciled' });
+    }
+    const note = accountNote != null ? String(accountNote).trim() : null;
+    await pool.query(
+      `UPDATE bank_transactions SET reconciled = true, reconciliation_ref_type = 'account', reconciliation_ref_id = NULL,
+       reconciled_at = $1, account_type = $2, account_note = $3, adjustment_amount = 0 WHERE id = $4`,
+      [now, accountType, note || null, bankTransactionId]
+    );
+    res.json({ ok: true });
+  } catch (e) {
+    res.status(500).json({ error: e.message });
+  }
+});
+
+/** Unmatch a bank transaction from its expense(s), sale, or account */
 router.post('/unmatch', async (req, res) => {
   const { bankTransactionId } = req.body || {};
   if (!bankTransactionId) {
@@ -141,7 +175,7 @@ router.post('/unmatch', async (req, res) => {
     const row = r.rows[0];
     await client.query('BEGIN');
     await client.query(
-      `UPDATE bank_transactions SET reconciled = false, reconciliation_ref_type = NULL, reconciliation_ref_id = NULL, reconciled_at = NULL, adjustment_amount = 0 WHERE id = $1`,
+      `UPDATE bank_transactions SET reconciled = false, reconciliation_ref_type = NULL, reconciliation_ref_id = NULL, reconciled_at = NULL, adjustment_amount = 0, account_type = NULL, account_note = NULL WHERE id = $1`,
       [bankTransactionId]
     );
     if (row.reconciliation_ref_type === 'expense' && row.reconciliation_ref_id) {