Invoices & Payments
What the homeowner sees when they log into the customer portal to view and pay their bills.
URL: portal.mikescontracting.com/invoices
What This Screen Is
The Invoices & Payments screen is the customer's dedicated billing view inside the portal. It's not a simplified version of the contractor's invoicing admin — it's a purpose-built screen designed for a homeowner who needs to know one thing quickly: what do I owe, and how do I pay it?
The screen shows every invoice tied to the customer's account across all their projects. Unpaid and overdue invoices surface first with prominent call-to-action buttons. Paid invoices drop to the bottom with easy access to receipts. The contractor's internal markup, Stripe account details, payment processing costs, and any other financial information beyond the customer's billed amount are never visible here.
Same invoice, different view. The underlying invoice record is the same object the contractor sees in their CRM. What differs is which fields are exposed. Customers see: line items, total, due date, status, and receipt. They never see: cost breakdown, margins, Stripe account info, or any other customer's data.
Invoice List — What the Customer Sees
The customer lands on a filtered table view of all invoices on their account. Overdue invoices appear at the top with a red status badge. Unpaid invoices follow with a blue badge and a green Pay Now button. Paid invoices sit below with a receipt link. The customer can filter by status using the pill filters at the top.
Filter tabs: All | Unpaid | Paid
Example invoice list:
| Invoice # | Project | Date | Amount | Status | Actions |
|---|---|---|---|---|---|
| INV-2041 | Deck Replacement | May 14, 2026 | $4,200.00 | Unpaid | [Pay Now] [PDF] |
| INV-2038 | Gutter Cleaning | Apr 28, 2026 | $850.00 | Paid | [Receipt] [PDF] |
| INV-2031 | Roof Inspection | Mar 10, 2026 | $350.00 | Paid | [Receipt] [PDF] |
Footer summary: 3 invoices · Outstanding: $4,200 · Total paid: $1,200
Pay Now Flow
Tapping Pay Now on any unpaid or overdue invoice opens a Stripe Checkout session. The customer pays directly through Stripe's PCI-compliant hosted page — card data never touches the portal server. On success, the customer is redirected back to the portal where the invoice status updates to Paid, a receipt link appears, and an email receipt is dispatched automatically.
- Click Pay Now — Customer taps Pay Now on any unpaid invoice. If a saved card is on file it's pre-filled automatically.
- Stripe Checkout — PCI-compliant Stripe page loads. Card entry or saved card confirmation. One click to pay.
- Payment Processed — Stripe confirms the charge. Portal receives webhook. Invoice status flips to Paid immediately.
- Receipt Delivered — Email receipt dispatched automatically. Receipt link appears in portal. Contractor notified in CRM.
Example Stripe checkout:
- Merchant: Elite Home Services
- Amount: $8,400.00
- Invoice: INV-3918 — Roof Replacement · 412 Lakeview Dr
- Saved card: Visa ending in 4242 — expires 09/28 (Saved)
- Or enter a new card number...
- [Pay $8,400.00]
- Secured by Stripe · Your card data is never stored on this site
What Happens on Success
- Customer redirected back to the portal invoice list — status badge flips to Paid with today's date.
- Email receipt sent to the customer's registered address within seconds.
- Contractor's CRM marks the invoice as paid and logs the payment timestamp.
- If the invoice was tied to a project, the project's payment status updates too.
- Receipt link appears in the portal for the customer to access at any time.
What Happens on Failure
- Stripe surfaces the decline reason (insufficient funds, expired card, etc.) directly on the checkout page.
- Customer is prompted to add a new payment method — no silent retry loop.
- Invoice status remains Unpaid. No partial charges are applied.
- Contractor is not notified of card declines — this stays between Stripe and the customer.
PDF Download — Full Itemized Invoice
Every invoice has a Download PDF option available regardless of payment status. The PDF is generated server-side with the contractor's branding: logo, business name, address, license number, and contact details appear in the header.
PDF Contents
- Header: Contractor logo, business name, license number, phone, address
- Bill To: Customer name, service address, invoice number, issue date, due date
- Line Items: Description, quantity, unit price, line total for each item
- Totals: Subtotal, applicable taxes, total due (or total paid)
- Payment Info: For unpaid invoices — QR code and portal URL to pay online. For paid invoices — payment date, method (e.g., "Visa ****4242"), and a "PAID" stamp watermark.
- Terms: Contractor's payment terms as configured in the CRM settings
What's NOT in the PDF
- No cost/markup breakdown — customer sees billable amounts only
- No internal notes or crew assignments
- No contractor's Stripe account identifier or payout details
- No other customers' data
Payment History
Below the invoice list (or accessible via a tab), the customer sees a chronological ledger of every payment they've made. Dates, amounts, invoice references, and receipt links all appear here. This is the customer's permanent financial record of their relationship with the contractor.
URL: portal.mikescontracting.com/invoices/history
Example payment history:
| Payment | Date | Card | Amount | Receipt |
|---|---|---|---|---|
| INV-2038 — Gutter Cleaning | Apr 30, 2026 | Visa ****4242 · Pay Now | $850.00 | Receipt |
| INV-2031 — Roof Inspection | Mar 12, 2026 | Visa ****4242 · Pay Now | $350.00 | Receipt |
Payment History Details
- All payments listed in reverse chronological order (newest first)
- Each row shows: invoice reference, project name, payment date, method (card type + last 4), amount, and receipt link
- Installment payments show the installment number (e.g., "Installment 2 of 3") so the customer can track multi-payment invoices
- Auto-pay charges are labeled as "Auto-pay" vs manual "Pay Now" payments for transparency
Partial Payments & Installments
If the contractor has enabled installments for a specific invoice in the CRM, the customer sees a modified Pay Now flow. Instead of one lump sum, the checkout shows the installment schedule: amount due today and the remaining installment dates and amounts. The customer can pay the next installment only — they cannot pay ahead or adjust the schedule. Schedule changes must be initiated by the contractor.
Installment Rules
- Contractor-controlled: The installment schedule is set in the CRM by the contractor. Customers cannot request or modify installment terms.
- What customer sees: "Payment 1 of 3 — $3,000 due today. Next payment: $3,000 on June 15."
- Auto-pay eligible: If the customer saves a card, subsequent installments can be charged automatically on their due dates (customer must opt in).
- Overdue installment: Flags the invoice as Overdue (same as a lump-sum overdue), with the specific overdue installment amount shown.
- Pay in full: Customer can always choose to pay the remaining balance in full at any time, even if installments are set.
Auto-Pay & Saved Card
During any checkout flow the customer can opt to save their card. Once saved, future invoices can be set to auto-pay on the due date — the customer gets an email notification 3 days before the charge and another on the day of. They can remove a saved card or turn off auto-pay at any time from their portal account settings.
Saved Card Rules
- Card data is stored by Stripe only — the portal and CRM hold only a tokenized reference (last 4 digits + expiry)
- Customer can save multiple cards but only one can be set as the auto-pay default
- Auto-pay notifications: 3 days before charge (email), on charge day (email + SMS if opted in), on failure (email with link to update card)
- Contractor cannot charge the customer's saved card manually — auto-pay is customer-controlled only
- Removing a saved card cancels any pending auto-pay and marks future installments as manual-pay-required
Invoice Column Reference
| Column | What Customer Sees | Notes |
|---|---|---|
| Invoice # | INV-XXXX (unique reference number) | Same number the contractor uses internally; helps customer reference it if they call in |
| Project | Project name + service address (short form) | Links to the project detail page in the portal if the project is still active |
| Date | Invoice issue date | Not the due date — due date appears inside the invoice detail / PDF |
| Amount | Total invoice amount (billed amount only) | For installment invoices: shows the full invoice total, not the installment amount |
| Status | Paid / Unpaid / Overdue | Overdue = past due date and unpaid. Status updates in real time on payment. |
| Actions — Unpaid | Pay Now button + Download PDF link | Pay Now opens Stripe checkout. PDF works immediately (no payment required to download). |
| Actions — Overdue | Pay Now button (green) + Download PDF link | Same as Unpaid — no late fees shown unless contractor has configured them in the CRM |
| Actions — Paid | Receipt link + Download PDF link | Receipt is the Stripe-generated payment confirmation. PDF is the full itemized invoice with PAID stamp. |
What's Visible vs Hidden
The customer portal is intentionally opaque to internal business data.
| Data Point | Visible to Customer | Why |
|---|---|---|
| Invoice line items (what they're billed for) | Yes | Customer has a right to see what they're being charged for |
| Invoice total amount | Yes | Required for payment |
| Payment due date | Yes | Inside invoice detail and PDF — not in the list column for brevity |
| Payment history (their own) | Yes | Customer's financial record of the relationship |
| Receipt for completed payment | Yes | Required for customer records |
| Installment schedule (if set) | Yes | Customer needs to know what they owe and when |
| Contractor's cost / markup breakdown | No | Internal business data — margins, material costs, labor rates are private |
| Contractor's Stripe account details | No | Financial plumbing — irrelevant and potentially sensitive |
| Stripe processing fees | No | Contractor's cost to accept payment — customer sees billed amount only |
| Other customers' invoices | No | Hard access control — every customer sees only their own data |
| Internal CRM invoice notes | No | Contractor's operational comments — dispute notes, internal flags, etc. |
| Contractor's bank / payout schedule | No | Confidential business financial information |
Related Pages
- Customer Portal Overview — Full feature map of the customer-facing portal — tracker, payments, scheduling, and more
- Estimates — Customer Portal — Where customers review, approve, or decline estimates the contractor sent them
- My Projects — Customer Portal — Status, photos, documents, and messages for all the customer's jobs
- Invoices & Payments — Cloud CRM — The contractor's admin view — invoice creation, Stripe setup, payment tracking, and installment configuration