Use proper referring page uri in cached environment

public/typo3conf/ext/ep_products/Classes/Controller/AjaxSearchController.php

@@ -29,6 +29,7 @@ namespace EP\EpProducts\Controller;
 
 use EP\EpProducts\Domain\Model\FilterSettings;
 use EP\EpProducts\Service\FilterService;
+use EP\EpProducts\Service\FilterSettingsEncoder;
 use EP\EpProducts\Service\SearchResultUrlService;
 use EP\EpProducts\Service\SearchResultService;
 use EP\EpProducts\Traits\RequestArgumentTypeConversionTrait;
@@ -122,9 +123,24 @@ class AjaxSearchController extends ActionController
 
         $this->searchResultUrlService->process($searchResult, $options);
 
+        $encodedFilterSettings = FilterSettingsEncoder::encode($filterSettings);
+        $referringPageUri = $this
+            ->uriBuilder
+            ->reset()
+            ->setTargetPageUid($this->settings['defaultSearchPageUid'])
+            ->uriFor(
+                'searchresult',
+                ['filterSettings' => $encodedFilterSettings],
+                'Search',
+                null,
+                'searchresult'
+            )
+        ;
+
         return json_encode([
             'data' => $searchResult->getData(),
             'filterOptions' => $filterOptions,
+            'referringPageUri' => $referringPageUri,
             'meta' => [
                 'organic' => $organic,
                 'total' => $searchResult->getTotal(),

public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/components/SearchResult.vue

@@ -42,11 +42,8 @@
                 resultData: {},
                 resultMeta: null,
                 filterSettings: defaultFilterSettings,
-                filterOptions: defaultFilterOptions,
+                referringPageUri: null,
-                referringPage: {
+                filterOptions: defaultFilterOptions
-                    url: this.referringPageUrl,
-                    label: 'zurück zum Suchergebnis'
-                }
             }
         },
         props: {
@@ -58,10 +55,6 @@
                 type: Object,
                 default: null
             },
-            referringPageUrl: {
-                type: String,
-                default: null
-            },
             argumentPrefix: {
                 type: String,
                 required: true
@@ -127,13 +120,14 @@
                     url: this.resultsUri,
                     method: 'post',
                     data: $.param(query)
-                }).then((response) => {
+                }).then(response => {
                     this.resultData = response.data.data;
                     this.filterOptions = response.data.filterOptions;
+                    this.referringPageUri = response.data.referringPageUri;
                     this.resultMeta = response.data.meta;
                     this.loading = false;
                     EventBus.$emit('ajaxContentLoaded');
-                }).catch(() => {
+                }).finally(() => {
                     this.loading = false;
                 });
             },

public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/components/SearchResultItem.vue

@@ -2,7 +2,7 @@
     <div class="teaserbox teaserbox--landscape teaserbox--searchresult searchresult-item">
         <div class="teaserbox__image">
             <img class="teaserbox__flag" :src="item.country.flag" :alt="item.country.name"/>
-            <a :href="getUrl()" rel="nofollow" title="Details &amp; Buchen">
+            <a :href="url" rel="nofollow" title="Details &amp; Buchen">
                 <picture class="searchresult-item__image">
                     <source media="(min-width: 1201px)" :data-srcset="item.hotel.images.resized.m[0].url + ' 260w'"/>
                     <source media="(max-width: 1200px)" :data-srcset="item.hotel.images.resized.l[0].url + ' 280w'"/>
@@ -44,7 +44,7 @@
             <div class="teaserbox__aside__top">
                 <span class="searchresult-item__label">{{ item.dates.length > 1 ? 'Zeitraum' : 'Termin' }}</span>
                 <span class="searchresult-item__daterange">{{ dateRange }}</span>
-                <a :href="getUrl()" rel="nofollow" title="Details &amp; Buchen"
+                <a :href="url" rel="nofollow" title="Details &amp; Buchen"
                    v-if="item.dates.length && !item.daytrip">
                     <span class="searchresult-item__daterange">
                         <i class="fa fa-arrow-circle-right"></i> {{ item.dates.length }} Termin{{ item.dates.length > 1 ? 'e' : '' }}
@@ -55,7 +55,7 @@
             </div>
             <div class="teaserbox__aside__bottom">
                 <span class="searchresult-item__price">ab {{ item.minPrice }} €</span>
-                <a :href="getUrl()" class="button button--full searchresult-item__button"
+                <a :href="url" class="button button--full searchresult-item__button"
                    rel="nofollow" title="Details &amp; Buchen">
                     Details &amp; Buchen
                 </a>
@@ -82,14 +82,20 @@
             section: {
                 type: Object,
                 required: true
-            }
+            },
-        },
+            referringPageUri: {
-        methods: {
+                type: String,
-            getUrl () {
+                default: null
-                return this.item.detailPageUri + '?ref=' + window.location.pathname;
             }
         },
         computed: {
+            url () {
+                let url = this.item.detailPageUri;
+                if (this.referringPageUri) {
+                    url += '?ref=' + this.referringPageUri;
+                }
+                return url;
+            },
             nightsOptions () {
                 const nights = this.item.nights;
                 if (nights === null) {

public/typo3conf/ext/ep_theme/Resources/Private/Templates/Search/Searchresult.html

@@ -302,7 +302,8 @@
                                                 :key="item.key"
                                                 :item="item"
                                                 :section="section"
-                                                :referring-page="referringPage"></search-result-item>
+                                                :referring-page-uri="referringPageUri"
+                                            ></search-result-item>
                                         </div>
                                     </template>
                                 </div>