API endpoint: /plugin/delivery

Umožňuje vytvořit na eshopu vlastní způsob dopravy a v objednávkovém formuláři zobrazit interaktivní výběr dodací adresy.

Vytvoření nového způsobu dopravy

POST /plugin/delivery

 
    {
        "name": "My Delivery Method",
        "description": "Optional Description",
        "image": "https://plugin.tld/images/icon.png",
        "widget": "<script src="https://plugin.tld/delivery.js"></script>"
    }
 

Výše uvedený požadavek vytvoří na eshopu základ nového způsobu dopravy. Uživateli eshopu je ponechána volnost novou dopravu detailněji nastavit (cena dopravy, propojení se způsoby plateb, název atd.)


Příklad:

 
    $curl = curl_init();
    curl_setopt_array($curl, array(
        CURLOPT_URL => 'https://api.webareal.cz/plugin/delivery',
        CURLOPT_RETURNTRANSFER => true,
        CURLOPT_ENCODING => '',
        CURLOPT_MAXREDIRS => 10,
        CURLOPT_TIMEOUT => 0,
        CURLOPT_FOLLOWLOCATION => true,
        CURLOPT_HTTP_VERSION => CURL_HTTP_VERSION_1_1,
        CURLOPT_CUSTOMREQUEST => 'POST',
        CURLOPT_POSTFIELDS => json_encode([
            "name" => "My Delivery Method",
            "description" => "Optional Description",
            "image" => "https://plugin.tld/images/icon.png",
            "widget" => "<script src="https://plugin.tld/delivery.js"></script>"
        ])
        CURLOPT_HTTPHEADER => array(
            'X-Wa-api-token: ' . $api_token, // apiToken získáte při instalaci doplňku, viz. nápověda
            'Authorization: Bearer ' . $bearer, // access token získáte zde, údaje zde (záložka API přístup)
            'Content-Type: application/json'
      ),
    ));

    $response = curl_exec($curl);
    curl_close($curl);
    echo $response;
 


Práce s widgetem

Pokud zákazník na eshopu zvolil tento způsob dopravy, je na stránce objednávkového formuláře vypsán zadaný HTML/JS kód.

Eshop definuje JS rozhraní BS.delivery pro zjednodušení práce s popup oknem widgetu a uložení zvolené dodací adresy.

Metody objektu:

  • openWindow(options) - zobrazení okna widgetu. Parametr options je objekt s následujícími vlastnostmi:
    • title <string> - název okna
    • body <HTMLElement> - obsah okna
    • dialogSize <string> - velikost okna. Možné hodnoty: md, lg, full
  • closeWindow() - zavření okna widgetu
  • goBack() - vrácení zákazníka na předchozí krok objednávkového procesu
  • save(address) - potvrzení volby dodací adresy. Metoda vrací Promise objekt. Parametr address je objekt s následujícími vlastnostmi:
    • name <string> - jméno na dodací adrese (volitelné)
    • address <string> - ulice, číslo popisné…
    • city <string> - město
    • zipCode <string> - poštovní směrovací číslo
    • data <Object> - volitelné vlastní údaje (např. identifikátor zvolené pobočky).

Ukázka jednoduché implementace widgetu

 
    document.addEventListener('DOMContentLoaded', () => {
        "use strict";

        const options = {
            title: 'My Delivery',
            body: content,
            dialogSize: 'lg'
        };

        const template = `
            <div>
                <h5>Select pickup point</h5>
                <button type="button" class="js-plugin-close">Close</button>
                <button type="button" class="js-plugin-confirm">Confirm</button>
            </div>
        `;

        const content = document.createElement('div');
        content.innerHTML = template;

        const buttons = content.querySelectorAll('button');
        for(const button of buttons) {
            button.addEventListener('click', e => {
                if(e.target.classList.contains('js-plugin-close')) {
                    BS.delivery.closeWindow();
                } else {
                    BS.delivery.save({
                        name: 'Name',
                        address: 'Street, 12',
                        city: 'City',
                        zipCode: '12345',
                        data: {
                            point: 1,
                        }
                    }).then(address => {
                        console.log(address);
                        BS.delivery.closeWindow();
                    }).catch(e => {
                        console.log(e);
                    });
                }
            })
        }

        setTimeout(() => {
            BS.delivery.openWindow(options);
        }, 500);
    });
 

Předání vlastních údajů po vytvoření objednávky

Pokud má doplněk registrován order.create webhook, je objekt s údaji o objednávce rozšířen o vlastní hodnoty address objektu pod klíčem pluginData.