diff --git a/_includes/pbc/all/install-features/202400.0/install-the-service-points-customer-account-management-feature.md b/_includes/pbc/all/install-features/202400.0/install-the-service-points-customer-account-management-feature.md new file mode 100644 index 00000000000..89642085cf6 --- /dev/null +++ b/_includes/pbc/all/install-features/202400.0/install-the-service-points-customer-account-management-feature.md @@ -0,0 +1,249 @@ + + + +This document describes how to integrate the Service Points + [Customer Account Management](/docs/pbc/all/customer-relationship-management/{{page.version}}/customer-account-management-feature-overview/customer-account-management-feature-overview.html) feature into a Spryker project. + +## Install feature core + +Follow the steps below to install the Service Points + Customer Account Management feature. + +### Prerequisites + +To start feature integration, integrate the required features: + +| NAME | VERSION | INTEGRATION GUIDE | +|-----------------------------|------------------|--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------| +| Service Points | {{page.version}} | [Install the Service Points feature](/docs/pbc/all/service-points/{{page.version}}/unified-commerce/install-the-service-points-feature.html) | +| Customer Account Management | {{page.version}} | [Install the Customer Account Management feature](/docs/pbc/all/customer-relationship-management/{{page.version}}/install-and-upgrade/install-features/install-the-customer-account-management-feature.html) | + +## 1) Add translations + +1. Append the glossary according to your configuration: + +**data/import/common/common/glossary.csv** + +``` +service_point_widget.validation.error.service_point_not_selected,Please select service point.,en_US +service_point_widget.validation.error.service_point_not_selected,Bitte Servicestelle auswählen.,de_DE +service_point_widget.validation.error.billing_address_not_provided,Please add billing address manually.,en_US +service_point_widget.validation.error.billing_address_not_provided,Bitte fügen Sie die Rechnungsadresse manuell hinzu.,de_DE +service_point_widget.select_location_action,Select a location,en_US +service_point_widget.select_location_action,Wählen Sie einen Standort,de_DE +service_point_widget.change_action,Change,en_US +service_point_widget.change_action,Ändern,de_DE +service_point_widget.location_label,Location:,en_US +service_point_widget.location_label,Standort:,de_DE +service_point_widget.select_your_store_title,Select your store,en_US +service_point_widget.select_your_store_title,Wählen Sie Ihren Store,de_DE +service_point_widget.search,"Search for Store, zip code or city...",en_US +service_point_widget.search,"Suche nach Store, PLZ oder Stadt...",de_DE +service_point_widget.select_store_action,Select store,en_US +service_point_widget.select_store_action,Store auswählen,de_DE +service_point_widget.no_results,"Nothing found...",en_US +service_point_widget.no_results,"Nichts gefunden...",de_DE +``` + +2. Import data: + +```bash +console data:import glossary +``` + +{% info_block warningBox "Verification" %} + +Make sure that the configured data is added to the `spy_glossary_key` and `spy_glossary_translation` tables in the database. + +{% endinfo_block %} + +## 2) Set up behavior + +Enable the following plugins: + +| PLUGIN | SPECIFICATION | PREREQUISITES | NAMESPACE | +|--------------------------------------------------------------------------|---------------------------------------------------------------------------|---------------|------------------------------------------------------------| +| ClickCollectServiceTypeCheckoutAddressCollectionFormExpanderPlugin | Expands the `ServicePoint` subform with a pickupable service type. | | SprykerShop\Yves\ServicePointWidget\Plugin\CustomerPage | +| ClickCollectServiceTypeCheckoutMultiShippingAddressesFormExpanderPlugin | Expands `ServicePoint` with a pickupable service type. | | SprykerShop\Yves\ServicePointWidget\Plugin\CustomerPage | +| ServicePointCheckoutAddressCollectionFormExpanderPlugin | Expands checkout address form with `ServicePoint`. | | SprykerShop\Yves\ServicePointWidget\Plugin\CustomerPage | +| ServicePointCheckoutMultiShippingAddressesFormExpanderPlugin | Expands checkout multi-shipping address form with `ServicePoint`. | | SprykerShop\Yves\ServicePointWidget\Plugin\CustomerPage | +| ServicePointAddressCheckoutAddressCollectionFormExpanderPlugin | Expands shipments with service point address. | | SprykerShop\Yves\ServicePointWidget\Plugin\CustomerPage | +| ClickCollectServicePointAddressFormWidgetCacheKeyGeneratorStrategyPlugin | Skips caching of the `ClickCollectServicePointAddressFormWidget` widget. | | SprykerShop\Yves\ServicePointWidget\Plugin\ShopApplication | + +**src/Pyz/Yves/CustomerPage/CustomerPageDependencyProvider.php** + +```php + + */ + protected function getCheckoutAddressCollectionFormExpanderPlugins(): array + { + return [ + new ServicePointCheckoutAddressCollectionFormExpanderPlugin(), + new ServicePointAddressCheckoutAddressCollectionFormExpanderPlugin(), + new ClickCollectServiceTypeCheckoutAddressCollectionFormExpanderPlugin(), + ]; + } + + /** + * @return list<\SprykerShop\Yves\CustomerPageExtension\Dependency\Plugin\CheckoutMultiShippingAddressesFormExpanderPluginInterface> + */ + protected function getCheckoutMultiShippingAddressesFormExpanderPlugins(): array + { + return [ + new ServicePointCheckoutMultiShippingAddressesFormExpanderPlugin(), + new ClickCollectServiceTypeCheckoutMultiShippingAddressesFormExpanderPlugin(), + ]; + } +} + +``` + +**src/Pyz/Yves/ShopApplication/ShopApplicationDependencyProvider.php** + +```php + + */ + protected function getWidgetCacheKeyGeneratorStrategyPlugins(): array + { + return [ + new ClickCollectServicePointAddressFormWidgetCacheKeyGeneratorStrategyPlugin(), + ]; + } +} +``` + +## 3) Set up widgets + +Register the following plugins to enable widgets: + +| PLUGIN | SPECIFICATION | PREREQUISITES | NAMESPACE | +|-------------------------------------------|---------------------------------------------------------------|---------------|--------------------------------------------| +| ClickCollectServicePointAddressFormWidget | Turns on service point selection during the checkout address step. | | SprykerShop\Yves\ServicePointWidget\Widget | + +**src/Pyz/Yves/ShopApplication/ShopApplicationDependencyProvider.php** + +```php + + */ + protected function getGlobalWidgets(): array + { + return [ + ClickCollectServicePointAddressFormWidget::class, + ]; + } +} +``` + +## 4) Set up the FE part + +Adjust TWIG templates to display the service point selector: + +1. To the `page-layout-main` template of the `ShopUi` module, add the `main-overlay` molecule: + +```twig +{% raw %}{% block globalComponents %} + .... + {% include molecule('main-overlay') only %} +{% endblock %}{% endraw %} +``` + +2. In the `ShopUi` module, to the `icon-spite` atom, add the `cross` icon: + +```twig +{% raw %} + +{% endraw %} +``` + +{% info_block infoBox "The cross icon is already defined" %} + +If the `cross` icon is already defined in the project, it's not necessary to add it again. + +{% endinfo_block %} + +3. For `/resources/form/form.twig` of `ShopUi` module, adjust `choice_widget_expanded` and `checkbox_widget` blocks: + +```twig +{% raw %}{% block choice_widget_expanded -%} + ... + {{- form_widget(child, { + parent_label_class: label_attr.class|default(''), + choices_attr: choices_attr | default({}), + }) -}} + ... +{%- endblock choice_widget_expanded %} + +{%- block checkbox_widget -%} + ... + {%- set inputClass = attr.class | default ~ ' ' ~ choices_attr.class | default -%} + + {% define attributes = { + id: id, + name: full_name, + checked: checked | default(false), + required: required | default(false), + disabled: disabled ?: attr.disabled | default(false), + value: value | default(), + } %} + ... +{%- endblock -%}{% endraw %} +``` + +4. To the `addres` view of the `CheckoutPage` module, add `ClickCollectServicePointAddressFormWidget`: + +```twig +{% raw %}{% widget 'ClickCollectServicePointAddressFormWidget' args [data.checkoutAddressForm] only %}{% endwidget %}{% endraw %} +``` + +{% info_block infoBox "Adding of ClickCollectServicePointAddressFormWidget is automated" %} + +If using the `ShipmentTypeAddressFormWidget` widget, the `ClickCollectServicePointAddressFormWidget` is added automatically. Therefore, you don't need to add it manually. + +{% endinfo_block %} + +5. Build assets: + +```bash +console frontend:yves:build +``` + +{% info_block warningBox "Verification" %} + +Make sure that the following widgets were registered: + +| MODULE | TEST | +|-------------------------------------------|---------------------------------------------------------------------------------| +| ClickCollectServicePointAddressFormWidget | Go to **Address Checkout Step** and make sure that you can select service point. | + +{% endinfo_block %} diff --git a/docs/pbc/all/customer-relationship-management/202400.0/install-and-update/install-features/install-the-customer-account-management-service-points-feature.md b/docs/pbc/all/customer-relationship-management/202400.0/install-and-update/install-features/install-the-customer-account-management-service-points-feature.md new file mode 100644 index 00000000000..bb84186455b --- /dev/null +++ b/docs/pbc/all/customer-relationship-management/202400.0/install-and-update/install-features/install-the-customer-account-management-service-points-feature.md @@ -0,0 +1,8 @@ +--- +title: Install the Customer Account Management + Service Points feature +description: Learn how to integrate the Customer Account Management + Service Points feature into your project +last_updated: Aug 7, 2023 +template: feature-integration-guide-template +--- + +{% include pbc/all/install-features/202400.0/install-the-service-points-customer-account-management-feature.md %} diff --git a/docs/pbc/all/service-points/202400.0/unified-commerce/install-and-upgrade/install-the-customer-account-management-service-points-feature.md b/docs/pbc/all/service-points/202400.0/unified-commerce/install-and-upgrade/install-the-customer-account-management-service-points-feature.md new file mode 100644 index 00000000000..b629a00f19b --- /dev/null +++ b/docs/pbc/all/service-points/202400.0/unified-commerce/install-and-upgrade/install-the-customer-account-management-service-points-feature.md @@ -0,0 +1,8 @@ +--- +title: Install the Service Points + Customer Account Management feature +description: Learn how to integrate the Service Points + Customer Account Management feature into your project +last_updated: Aug 7, 2023 +template: feature-integration-guide-template +--- + +{% include pbc/all/install-features/202400.0/install-the-service-points-customer-account-management-feature.md %}