Skip to main content
Version: 2.x

Payment on account

This guide explains how Front-Commerce allows using Payment on account in a headless commerce project.

Payment on account is a payment method for B2B contexts. It allows companies to make place orders using the credit limit that is specified in their profile. There is only one way to accept such payments in your Front-Commerce application for now.

Magento2 B2B​

Since version 2.11

Enable Payment on account​

note

This feature is directly provided by Adobe Commerce. Please refer to the corresponding documentation page to properly configure it on Magento side.

In addition, this feature is also controlled by the roles and the associated permissions assigned to a user within the company. For now, those roles can only be set programmtically or through the Magento frontend. In local environments, to make sure a company user can use the Payment on account method you need to:

  1. login as the administrator of the company or as a user having the Manage roles and permissions permission.
  2. go to https://magento-front.example.com/company/role/
  3. for the role assigned to the user, check the permissions Sales / Allow Checkout / Use Pay On Account method and Company Credit / View

Enable the B2B module​

First, you need to enable and integrate the Front-Commerce B2B module for Magento2.

Register the Payment on account payment component​

  1. Override the file that lets you register additional payments components in Front-Commerce

    mkdir -p my-module/web/theme/modules/Checkout/Payment/AdditionalPaymentInformation/
    cp -u node_modules/front-commerce/src/web/theme/modules/Checkout/Payment/AdditionalPaymentInformation/getAdditionalDataComponent.js my-module/web/theme/modules/Checkout/Payment/AdditionalPaymentInformation/getAdditionalDataComponent.js

  2. Register the component PaymentOnAccount to be used for companycredit payments in getAdditionalDataComponent.js

    my-module/web/theme/modules/Checkout/Payment/AdditionalPaymentInformation/getAdditionalDataComponent.js
    +import PaymentOnAccount from "theme/modules/Checkout/Payment/AdditionalPaymentInformation/PaymentOnAccount";

    const ComponentMap = {
    +  companycredit: PaymentOnAccount,
    };

And that's it. After having restarted Front-Commerce, a company customer having Payment on account enabled should be able to use this payment method.