fix(checkout): switch package type nicely (#66)

INT-405 --------- Co-authored-by: Freek van Rijt <freekvanrijt@gmail.com>
myparcelnl · Apr 19, 2024 · fb7c8e9 · fb7c8e9
1 parent 3591021
commit fb7c8e9
Show file tree

Hide file tree

Showing 4 changed files with 40 additions and 18 deletions.
diff --git a/src/Resources/app/storefront/src/delivery-options/delivery-options.plugin.js b/src/Resources/app/storefront/src/delivery-options/delivery-options.plugin.js
@@ -24,6 +24,7 @@ export default class DeliveryOptionsPlugin extends Plugin {
     init() {
         //Register elements
         this._registerElements();
+        this._setPackageTypeButton();
 
         //Add mutation listener
         this._addMutationListener();
@@ -44,38 +45,45 @@ export default class DeliveryOptionsPlugin extends Plugin {
     };
 
     _enableSetPackageType() {
-        const btn = document.getElementById('myparcel-set-package-type-button');
-        if (! btn) return;
+        const div = document.getElementById('myparcel-set-package-type-button');
+        if (! div) return;
 
         const defaultPackageType = this.options.config.defaultPackageType;
 
         if ('package' === defaultPackageType) {
-            btn.remove();
+            div.remove();
         } else {
-            btn.addEventListener('click', () => {
-                this.disable = true;
+            div.addEventListener('click', () => {
                 const currentPackageType = this.options.config.packageType;
                 this._setPackageType(currentPackageType === defaultPackageType ? 'package' : defaultPackageType);
             });
         }
     }
 
-    _setPackageTypeButtonText() {
-        const btn = document.getElementById('myparcel-set-package-type-button');
-        if (! btn) return;
+    _setPackageTypeButton() {
+        const div = document.getElementById('myparcel-set-package-type-button');
+        if (! div) return;
+
+        const label = div.querySelector('label');
+        if (! label) return;
 
         const defaultPackageType = this.options.config.defaultPackageType;
         const currentPackageType = this.options.config.packageType;
 
+        if (defaultPackageType !== currentPackageType && this.options.config.allowSetPickupOnly) {
+            // to allow only pickup, both delivery options and delivery options for postnl must be disabled
+            this.options.config.carrierSettings.postnl.allowDeliveryOptions = false;
+            this.options.config.allowDeliveryOptions = false;
+        }
+
         const packageText = this.options.translations.setPackageTypePackage;
         const defaultText = this.options.translations.setPackageTypeDefault;
 
         if (defaultPackageType === currentPackageType) {
-            btn.value = packageText ? packageText : 'Kies pakket';
+            label.innerText = packageText ? packageText : 'Kies pakket';
         } else {
-            btn.value = defaultText ? defaultText : 'Kies standaard';
+            label.innerText = defaultText ? defaultText : 'Kies standaard';
         }
-        btn.disable = false;
     }
 
     _disableButton(disable) {
@@ -145,7 +153,7 @@ export default class DeliveryOptionsPlugin extends Plugin {
     _addListeners() {
         document.addEventListener('myparcel_updated_delivery_options', (event) => {
             this._submitToCart(event.detail);
-            this._setPackageTypeButtonText();
+            this._setPackageTypeButton();
         });
     };
 

diff --git a/src/Resources/config/config.xml b/src/Resources/config/config.xml
@@ -129,6 +129,14 @@
             <defaultValue>true</defaultValue>
         </input-field>
 
+        <input-field type="bool">
+            <name>allowSetPickupOnly</name>
+            <label>When package type package is chosen, allow pickup only</label>
+            <label lang="de-DE">Wenn die Paketart „Paket“ ausgewählt ist, nur Abholung zulassen</label>
+            <label lang="nl-NL">Wanneer pakkettype "pakket" wordt gekozen, enkel ophalen toestaan</label>
+            <defaultValue>false</defaultValue>
+        </input-field>
+
         <input-field type="float">
             <name>priceMorningDelivery</name>
             <label>Morning delivery fee (optional)</label>

diff --git a/src/Resources/views/storefront/component/shipping/shipping-method.html.twig b/src/Resources/views/storefront/component/shipping/shipping-method.html.twig
@@ -7,8 +7,10 @@
                   data-delivery-options-plugin-options='{{ deliveryOptionsPluginOptions|json_encode }}'></template>
         <div id="myparcel-delivery-options"></div>
         {%  if deliveryOptionsPluginOptions.config.allowSetPackageTypeButton %}
-            <input type="button" id="myparcel-set-package-type-button" value="Options" class="btn btn-outline-primary
-             mt-2"/>
+            <div id="myparcel-set-package-type-button">
+                <input type="radio" id="myparcel-set-package-type-radio" class="custom-control-input form-check-input shipping-method-input">
+                <label class="custom-control-label shipping-method-label" for="myparcel-set-package-type-radio">Options</label>
+            </div>
         {%  endif %}
     {% endif %}
 {% endblock %}
diff --git a/src/Service/Config/ConfigGenerator.php b/src/Service/Config/ConfigGenerator.php
@@ -145,7 +145,7 @@ private function addPriceForSetting(string $salesChannelId, string $field, strin
      */
     public function generateConfigForPackage(SalesChannelContext $salesChannelContext, string $locale): array
     {
-        $config                             = [];
+        $config                             = $this->getPackageTypeSettings($salesChannelContext);
         $config                             = array_merge(
             $config,
             $this->getGeneralSettings($salesChannelContext, $locale)
@@ -212,15 +212,15 @@ private function getGeneralSettings(SalesChannelContext $salesChannelContext, st
             'allowRetry'  => false,
         ];
 
-        return array_merge($settings, $this->getPackageTypes($salesChannelContext), $this->generateConfig($salesChannelContext->getSalesChannelId()));
+        return array_merge($settings, $this->generateConfig($salesChannelContext->getSalesChannelId()));
     }
 
     /**
      * @param  \Shopware\Core\System\SalesChannel\SalesChannelContext $salesChannelContext
      *
-     * @return array (packageType, defaultPackageType)
+     * @return array
      */
-    private function getPackageTypes(SalesChannelContext $salesChannelContext): array
+    private function getPackageTypeSettings(SalesChannelContext $salesChannelContext): array
     {
         $cc = $salesChannelContext->getShippingLocation()
             ->getCountry()
@@ -245,6 +245,10 @@ private function getPackageTypes(SalesChannelContext $salesChannelContext): arra
                 'MyPaShopware.config.allowSetPackageTypeButton',
                 $salesChannelContext->getSalesChannelId()
             ),
+            'allowSetPickupOnly' => (bool) $this->systemConfigService->getString(
+                'MyPaShopware.config.allowSetPickupOnly',
+                $salesChannelContext->getSalesChannelId()
+            ),
         ];
     }