Skip to main content

Order Management widget

Nemuru brings you the Order Management widget, an embeddable solution in any backoffice or web page to carry out and manage captures, refunds and payments, abstracting you from carrying out any server-side integration with the Nemuru's Order API.

Once the checkout process is successfully confirmed for an specific order, you'll be able to pass the order_id to the Order Management, widget available in Nemuru's JavaScript library. Proceed with the following steps to integrate the widget in your site.

info

Firstly, make sure to load and initialize the nemuru.js JavaScript library if you haven't already.

1. Add a container on your site​

Place a div element where you’d like to display the Order Management widget on your site. This element must have an id attribute. Note that the element must be a div and not a span or other non-block element.

<div id="nemuru-order-management"></div>

2. Display the Order Management widget​

Next, load the widget using the .orderManagement() method available in the Nemuru object provided by the JavaScript library, passing the following fields:

Nemuru.orderManagement({
  container: "nemuru-order-management",
  orderId: "41c325c0-161c-43d6-bb4f-65f6b50b9ba0",
  accessToken: "Q3vDmRUCuTltHvLagKUeny8uVr6CaYHZd4",
  style: {
    color: "#4CC6CD",
    branding: "your_branding",
  },
  onAction: (action) => {
    if (action === "order_capture_created") {
      // do something on capture created
    }
    if (action === "order_refund_created") {
      // do something on refund created
    }
  },
  onClose: () => {
    // do something on close
  },
  onError: (error) => {
    // do something on error
  },
});

Parameter details:

FieldTypeRequiredDescriptionExample
containerstringRequiredThe id attribute of the div element where the Order Management widget will be displayed."nemuru-order-management"
orderIdstringRequiredThe order_id received in the response from the POST Create Order call."41c325c0-161c-43d6-bb4f-65f6b50b9ba0"
accessTokenstringRequiredThe access_token received in the response from the POST Login call."Q3vDmRUCuTltHvLagKUeny8uVr6CaYHZd4"
styleobjectRequiredParameters to configure the appearance of the widget.
style.colorstringOptionalA valid HEX color that will be used to customize the widget, highlighting some elements of it."#3E6AE1"
style.brandingstringRequiredThis value will be provided by Nemuru. Depending on this value, one or another version of the widget will be rendered. This includes: legal texts, different functionalities, UI elements, logos, etc."your_branding"
onActionfunctionOptionalThis callback is fired when a capture or refund is confirmed (after initiation and confirmation by the lender). The callback receives an action string argument which stands for the name of the event. Allowed values are: order_capture_created, order_refund_created
onClosefunctionOptionalThis callback fires when the customer closes the Order Management widget.
onErrorfunctionOptionalThis callback fires every time there is an error. For example, the accessToken is not valid because it has already expired.
info

To open the Order Management widget you'll have to previously get an access token through a server-side call, and pass it to the .orderManagement() function.

3. Server-side notifications​

When you (the merchant) initiate a capture or refund for a given Order through the widget, Nemuru will send a server-side call to your notification_url (URL provided by you in the POST Create Order), notifying about the action, only when confirmed by the lender.

Capture​

The following is a notification example for a capture confirmed by the lender. Note that the event order_capture_created indicates that the capture was successfully created (confirmed) after being initiated from the widget. The API Reference's Notification section provides better details about this request.

POST notification_url                        // notification_url
Authorization: Basic bG9sOnNlY3VyZQ==        // notification_auth
Content-Type: application/json               // notification_auth
{
  "order_id": "e60fb9d8-97d4-4653-bc7e-d49b203a6980",
  "order_reference_1": "76t7y7sau8y398y",
  //highlight-next-line
  "event": "order_capture_created",
  "triggered_at": "2022-03-31T09:42:15+00.00",
  "captured_amount": "875",
  "captured_items": [
    {
      "id": "16d63625-1390-4401-9427-fe5dd1de981c",
      "article": {
        "name": "KIVIK 3-seat sofa",
        "type": "product",
        "category": "physical",
        "reference": "4912345678904",
        "description": "3-seat sofa, with chaise longue/Hillared anthracite",
        "brand": "the-ikea-brand",
        "mpn": "AD6654412-334.22",
        "url": "https://www.ikea.com/ie/en/p/kivik-3-seat-sofa-with-chaise-longue-hillared-anthracite-s89193665/",
        "image_url": "https://www.ikea.com/ie/en/p/kivik-3-seat-sofa-with-chaise-longue-hillared-anthracite-s89193665/",
        "unit_price_with_tax": 875
      },
      "units": 1,
      "total_discount": {
        "amount": 0,
        "currency": "EUR"
      },
      "total_price_with_tax": {
        "amount": 875,
        "currency": "EUR"
      }
    }
  ]
}

Refund​

The following is a notification example for a refund confirmed by the lender. Note that the event order_refund_created indicates that the refund was successfully created (confirmed) after being initiated from the widget. The API Reference's Notification section provides better details about this request.

POST notification_url                        // notification_url
Authorization: Basic bG9sOnNlY3VyZQ==        // notification_auth
Content-Type: application/json               // notification_auth
{
  "order_id": "e60fb9d8-97d4-4653-bc7e-d49b203a6980",
  "order_reference_1": "76t7y7sau8y398y",
  //highlight-next-line
  "event": "order_refund_created",
  "triggered_at": "2022-03-31T09:42:15+00.00",
  "refunded_amount": "875",
  "refunded_items": [
    {
      "id": "16d63625-1390-4401-9427-fe5dd1de981c",
      "article": {
        "name": "KIVIK 3-seat sofa",
        "type": "product",
        "category": "physical",
        "reference": "4912345678904",
        "description": "3-seat sofa, with chaise longue/Hillared anthracite",
        "brand": "the-ikea-brand",
        "mpn": "AD6654412-334.22",
        "url": "https://www.ikea.com/ie/en/p/kivik-3-seat-sofa-with-chaise-longue-hillared-anthracite-s89193665/",
        "image_url": "https://www.ikea.com/ie/en/p/kivik-3-seat-sofa-with-chaise-longue-hillared-anthracite-s89193665/",
        "unit_price_with_tax": 875
      },
      "units": 1,
      "total_discount": {
        "amount": 0,
        "currency": "EUR"
      },
      "total_price_with_tax": {
        "amount": 875,
        "currency": "EUR"
      }
    }
  ]
}