First to Site
Ordering Portal

Payment & Submission

Payment flows for submitting orders in the Ordering Portal

Payment & Submission

After completing the order creation wizard (address confirmation, service selection, document upload), customers reach the confirmation page where they review and submit their orders.

Confirmation Page

Route: GET /orders/confirmation/multiple?order_ids=1,2,3

The confirmation page shows:

  • Success banner with green checkmark icon
  • Order summary — list of all orders with service name, price, and document count
  • Total price — prominently displayed in a gradient banner
  • Payment options — based on order cost and account status
  • Terms and conditions checkbox

Order Management

  • Customers can remove individual orders from the batch before submission
  • The total recalculates automatically when orders are removed

Payment Methods

The system supports three payment flows, shown based on conditions:

1. Free Submission ($0 Orders)

When: Total order cost is $0 (e.g., complimentary services)

Route: POST /orders/submit-free

Flow:

  1. Customer clicks "Submit Orders"
  2. All orders are marked as "submitted"
  3. Notifications are sent to FTS staff
  4. Customer is redirected to the success page

2. Place with Account

When: The customer's company has an account (hasAccount = true)

Route: POST /orders/place-with-account

Flow:

  1. Customer clicks "Place with Account"
  2. Orders are marked as "ordered"
  3. Invoice records are created for account billing
  4. No immediate payment is required
  5. Customer is redirected to the success page

3. Credit Card (Stripe)

When: Orders have a cost and no account billing is available

Route: POST /orders/payment/process

Flow:

  1. Customer clicks "Pay with Credit Card"
  2. The backend creates a Stripe payment session
  3. Customer is redirected to the Stripe payment gateway
  4. Customer enters credit card details on Stripe's hosted page
  5. On successful payment, Stripe redirects back to the portal
  6. Orders are marked as "ordered"
  7. Customer sees the success page

Success Page

Route: GET /orders/payment/success

After successful submission or payment:

  • Animated SVG checkmark with circular stroke animation
  • "Payment Successful!" heading
  • Order confirmation details
  • Batch confirmation number
  • List of all submitted orders with IDs
  • Combined total amount

Action Buttons

  • "View Order Details" — navigate to the order(s)
  • "Return to Dashboard" — go back to the main dashboard
  • "Create Another Order" — start a new order wizard

Payment Status on Orders

After payment/submission, orders transition:

  • Free orders: unprocessedsubmitted
  • Account orders: unprocessedordered
  • Stripe orders: unprocessedordered (after payment confirmation)

Error Handling

If payment fails:

  • The customer remains on the Stripe payment page
  • They can retry with different card details
  • If they abandon payment, orders remain in unprocessed status
  • They can return later to complete payment from the order view