Multi-point delivery order creation feature on RO SDK

Sample Index

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Ahamove RO SDK</title>
    <script>
      function init() {
        const path = [
          {
            address: "84 Đường An Dương Vương, Phường 09, Quận 05, Hồ Chí Minh, Việt Nam",
            name: "CHỊ LOAN",
            mobile: "0909634751",
            remarks: "LÔ H "
          },
          {
            address: "351 Đường Phan Xích Long, Phường 01, Quận Phú Nhuận",
            name: "CHỊ TÂM ĐAN ",
            mobile: "0987235325",
            cod: 420000,
            tracking_number: "SO_0001",
          },
          {
            address: "83 Đường Số 5, Phường 17, Gò Vấp",
            name: "FB PHUC HOANG",
            mobile: "0907935292",
            cod: 245000,
            tracking_number: "SO_0002",
          },
          {
            address: "26 Út Tịch, Phường 04, Quận Tân Bình",
            name: "CHỊ XUÂN",
            mobile: "0908158017",
            tracking_number: "SO_0003",
          },
          {
            address: "290 Nguyễn Thị Nhỏ, Phường 06, Quận 11",
            name: "CHỊ TÂM ĐAN ",
            mobile: "0987235325",
            cod: 420000,
            tracking_number: "SO_0004",
          },
          {
            address: "16 Tân Khai, Phường 4, Tân Bình, Ho Chi Minh City",
            short_address: "16 Tân Khai",
            name: "FB QUANG",
            mobile: "0907935292",
            cod: 245000,
            tracking_number: "SO_0005",
          }
        ];
        const token = "<TOKEN>";  //user token
        const src = "https://rostg.ahamove.com"; //domain staging

        const container_id = "kiotvietId"; //custom container
        let ahamove = WebRoSdk;
        ahamove.initIframe({
          container_id,
          close_button: true, //toggle close button, default is false
          token,
          src,
          path,
          service_ids: ["BIKE", "TRUCK"],
          request_ids: ["TIP", "COD", "BULKY"],
          promo_code: "AHAKM",
          payment_method: [
            {
              payment: "cash",
            },
            {
              payment: "cash_by_recipient",
            },
            {
              payment: "balance",
            },
          ],
          default_payment_method: {
            service_id: "SGN-BIKE",
            service_method: "BALANCE",
            public_method: "BALANCE",
          },
        });

        ahamove.addEventListener("SUBMIT_ORDER_LIST", ({ data }) => {
          console.log("on SUBMIT_ORDER_LIST", data);
          setTimeout(() => {
            // ahamove.destroy()
            // Passing container_id value if use container_id
            ahamove.destroy(container_id);
          }, 3000);
        });
      }
    </script>
  </head>

  <body style="background-color: grey">
    <button onclick="init()">Init RO SDK</button>
    <div class="kiotviet-screen" style="max-width: 80%; margin: auto">
      <div id="kiotvietId"></div>
    </div>

    <script src="https://vncdn.ahamove.com/public/web-ro-sdk/index.0.1.2.js"></script>
  </body>
</html>

Request Payload

Request payload
export interface SDKProps {
  token: string;
  path: Array<IPoint>;
  service_ids: Array<string>;
  request_ids: Array<string>;
  promo_code: string;
  payment_method: Array<PaymentMethod>;
  default_payment_method: DefaultPaymentMethod;
  close_button?: boolean;
  src?: string;
  container_id?: string;
}

export interface IPoint {
  address: string;
  name: string;
  mobile: string;
  remarks?: string;
  cod?: number;
  tracking_number?: string;
}

export interface PaymentMethod {
  payment: string;
}

export interface DefaultPaymentMethod {
  service_id: string | null;
  service_method: string | null;
  public_method: string | null;
}

function addEventListener, initIframe

SDKProps

Parameter	Type	Required	Description
token	string	Yes	User's token
path	Array	Yes	List of pickup point information (`path[0]`) and delivery points (`path[x]`, x>0)
service_ids	Array	Yes	List of services displayed on RO
request_ids	Array	Yes	List of types of special requests displayed per service_id
promo_code	string	Yes	Available promo code
payment_method	Array	Yes	List of payment methods
default_payment_method	Array	Yes	List of default payment methods, configurable per service_id
close_button	boolean	Yes	Toggle close button
src	string	Yes	RO data source - Staging Domain: https://rostg.ahamove.com - Production Domain: https://ro.ahamove.com
container_id	string	Yes	Customer ID on the integrated platform

IPoint

Parameter	Type	Required	Description
address	string	Yes	Pickup and drop-off address
name	string	Yes	Sender or receiver name
mobile	string	Yes	Sender or receiver phone number
remarks	string	No	Remarks for delivery points
cod	number	No	Cash on delivery amount, applicable for drop-off points
tracking_number	string	No	Package tracking number (internal order number of the Partner, not required but Ahamove recommends having this in `path[x]`)

PaymentMethod

Parameter	Type	Required	Description
payment	string	Yes	Delivery fee payment methods

DefaultPaymentMethod

Parameter	Type	Required	Description
service_id	string	Yes	Service to be configured with default payment method
service_method	string	Yes	Corresponding service payment method
public_method	string	Yes	Public payment method

Important Information

Pickup point information is the information of the first path (path[0])
Delivery point information is the information from the second path onwards (path[x], x>0)
The user's token when optimizing and creating orders on the RO SDK is get from the Account Registration API
List of service_id can be obtained from the Get List of Services API and filter the service ID that support multi-stop order creation ( max_stop_points > 1 )
List of request_id types can be obtained from List of Special Requests
Promo code promo_code allows customers to input codes provided by Ahamove when using RO SDK on the Partner's system
The result returned by Ahamove when the Partner confirms the order creation in RO SDK is a list of information fields and data of each order to connect these data to Ahamove's order creation API

Main Features

Route Optimization

Allows customers to upload delivery points via an Excel file or manual input
Allows customers to filter and search for delivery point information
Uses Optimization Algorithms to optimize routes based on distance, volume, etc., to minimize costs and shorten delivery distances.
Allows customers to select the number of delivery points and the maximum distance for a multi-stop delivery order when optimized

Multi-Stop Delivery Order Creation

Customers can visually see the optimized routes on the map
Customers can edit the information of delivery points before confirming the order
Customers can change the service type, special requests, and payment methods of the order
Customers can create scheduled orders