custom/plugins/SendcloudShipping/src/Resources/views/storefront/base.html.twig line 1

Open in your IDE?
  1. {% sw_extends '@Storefront/storefront/base.html.twig' %}
  3. {% block base_script_hmr_mode %}
  4.     {{ parent() }}
  5.     <script type="text/javascript" src="https://embed.sendcloud.sc/spp/1.0.0/api.min.js"></script>
  6.     <script>
  7.         (function () {
  8.             document.addEventListener("DOMContentLoaded", function () {
  9.                 // form has different names before shopware6.4.0
  10.                 let shippingMethodsForm = document.confirmShippingForm || document.changeShippingForm;
  12.                 if (shippingMethodsForm) {
  13.                     let servicePointDeliveryId = document.querySelector('#servicePointDeliveryId');
  14.                     let servicePointInfoElement = document.querySelector('#servicePointInfo');
  15.                     let radioButtons = shippingMethodsForm.shippingMethodId;
  16.                     let selectServicePointButton = document.querySelector('#selectServicePointButton');
  17.                     let servicePointEndpointUrl = document.querySelector('#servicePointEndpointUrl');
  18.                     let apiKey = document.querySelector('#sendcloudApiKey');
  19.                     let carriers = document.querySelector('#sendcloudCarriers');
  20.                     let zip = document.querySelector('#sendcloudZip');
  21.                     let countryCode = document.querySelector('#sendcloudCountry');
  22.                     let customerNumber = document.querySelector('#sendcloudCustomerNumber');
  23.                     let submitOrderBtn = document.getElementById('confirmFormSubmit');
  24.                     let isSubmitBtnDisabled = document.getElementById('sendcloud-is-submit-btn-disabled');
  26.                     if (isSubmitBtnDisabled) {
  27.                         submitOrderBtn.disabled = true;
  28.                     }
  30.                     for (let i = 0; i < radioButtons.length; i++) {
  31.                         radioButtons[i].addEventListener('change', onRadioButtonChange);
  32.                     }
  34.                     if (selectServicePointButton) {
  35.                         selectServicePointButton.addEventListener('click', openServicePointPicker);
  36.                     }
  38.                     onFormLoaded();
  40.                     function onFormLoaded() {
  41.                         for (let i = 0; i < radioButtons.length; i++) {
  42.                             if (radioButtons[i].checked && servicePointDeliveryId && radioButtons[i].value === servicePointDeliveryId.value) {
  43.                                 if (selectServicePointButton) {
  44.                                     selectServicePointButton.style.display = 'block';
  45.                                 }
  47.                                 onShippingMethodsLoad();
  48.                             } else {
  49.                                 if (selectServicePointButton) {
  50.                                     servicePointInfoElement.style.display = 'none';
  51.                                 }
  52.                             }
  53.                         }
  54.                     }
  56.                     function onRadioButtonChange(event) {
  57.                         if (servicePointDeliveryId && servicePointDeliveryId.value === event.target.value && selectServicePointButton) {
  58.                             selectServicePointButton.style.display = 'block';
  59.                             onShippingMethodsLoad();
  60.                         } else {
  61.                             enableSaveButton();
  62.                             if (selectServicePointButton) {
  63.                                 selectServicePointButton.style.display = 'none';
  64.                                 servicePointInfoElement.style.display = 'none';
  65.                             }
  66.                         }
  67.                     }
  69.                     function onShippingMethodsLoad() {
  70.                         fetch(servicePointEndpointUrl.value + '?customerNumber=' + customerNumber.value)
  71.                             .then(function (response) {
  72.                                 return response.json()
  73.                             })
  74.                             .then(function (servicePointInfoResponse) {
  75.                                 if (servicePointInfoResponse.servicePointInfo.name) {
  76.                                     enableSaveButton();
  77.                                     showServicePointInfo(servicePointInfoResponse.servicePointInfo)
  78.                                 } else {
  79.                                     disableSaveButton();
  80.                                 }
  81.                             });
  82.                     }
  84.                     function disableSaveButton() {
  85.                         modifySaveButton('none');
  86.                     }
  88.                     function enableSaveButton() {
  89.                         modifySaveButton('');
  90.                     }
  92.                     function modifySaveButton(display) {
  93.                         let saveButton = shippingMethodsForm.querySelector('button[type="submit"]');
  94.                         if (saveButton) {
  95.                             saveButton.style.display = display;
  96.                         }
  97.                     }
  99.                     function showServicePointInfo(servicePointInfo) {
  100.                         if (servicePointInfoElement) {
  101.                             servicePointInfoElement.style.display = 'block';
  102.                             document.querySelector('#servicePointName').innerText = servicePointInfo.name;
  103.                             document.querySelector('#servicePointStreet').innerText = servicePointInfo.street;
  104.                             document.querySelector('#servicePointZipAndCity').innerText = servicePointInfo.postal_code + ' ' + servicePointInfo.city;
  105.                             document.querySelector('#servicePointCountry').innerText = servicePointInfo.country;
  106.                         }
  107.                     }
  109.                     function openServicePointPicker() {
  110.                         let config = {
  111.                             'apiKey': apiKey ? apiKey.value : null,
  112.                             'country': countryCode ? countryCode.value : 'NL',
  113.                             'postalCode': zip ? zip.value : '',
  114.                             'language': 'en',
  115.                             'carriers': carriers ? carriers.value : '',
  116.                             'weight': '2'
  117.                         };
  119.                         sendcloud.servicePoints.open(
  120.                             config,
  121.                             function (servicePointObject) {
  122.                                 console.log(servicePointObject);
  123.                                 fetch(servicePointEndpointUrl.value + '/save?customerNumber=' + customerNumber.value, {
  124.                                     method: 'POST',
  125.                                     headers: {
  126.                                         'Accept': 'application/json',
  127.                                         'Content-Type': 'application/json'
  128.                                     },
  129.                                     body: JSON.stringify(servicePointObject)
  130.                                 })
  131.                                     .then(function (response) {
  132.                                         return response.json()
  133.                                     })
  134.                                     .then(function () {
  135.                                         enableSaveButton();
  136.                                         showServicePointInfo(servicePointObject);
  137.                                         reloadPage();
  138.                                     });
  139.                             },
  140.                             function (errors) {
  141.                                 errors.forEach(function (error) {
  142.                                     console.log('Failure callback, reason: ' + error);
  143.                                 });
  144.                             }
  145.                         );
  146.                     }
  148.                     /**
  149.                      * Reload page if shipping methods are not in the popup window (versions 6.4.x)
  150.                      */
  151.                     function reloadPage() {
  152.                         if (!document.confirmShippingForm) {
  153.                             window.location.reload();
  154.                         }
  155.                     }
  156.                 }
  157.             });
  158.         })();
  159.     </script>
  160. {% endblock %}