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

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