Implement watchlist
This commit is contained in:
Björn Fromme
+2
-2
@@ -61,13 +61,13 @@
|
||||
"typo3-ter/sourceopt": "^1.0",
|
||||
"typo3-ter/html-compress": "^1.1",
|
||||
"typo3-ter/imageoptimizer": "^1.0",
|
||||
"typo3-ter/loginlimit": "^1.0",
|
||||
"doctrine/dbal": "^2.5",
|
||||
"yohang/calendr": "^2.1",
|
||||
"wyrihaximus/html-compress": "^1.4",
|
||||
"symfony/property-access": "^3.4",
|
||||
"symfony/options-resolver": "^3.4",
|
||||
"symfony/serializer": "^3.3"
|
||||
"symfony/serializer": "^3.3",
|
||||
"league/csv": "^8.2"
|
||||
},
|
||||
"scripts": {
|
||||
"typo3-cms-scripts": [
|
||||
|
||||
Generated
+58
-42
@@ -4,7 +4,7 @@
|
||||
"Read more about it at https://getcomposer.org/doc/01-basic-usage.md#installing-dependencies",
|
||||
"This file is @generated automatically"
|
||||
],
|
||||
"content-hash": "f02741f6bee387f8f2b8ec67b91ef940",
|
||||
"content-hash": "b82dc74c08630a468c17439fc8b67cb3",
|
||||
"packages": [
|
||||
{
|
||||
"name": "cogpowered/finediff",
|
||||
@@ -939,6 +939,63 @@
|
||||
],
|
||||
"time": "2014-06-03T12:02:11+00:00"
|
||||
},
|
||||
{
|
||||
"name": "league/csv",
|
||||
"version": "8.2.3",
|
||||
"source": {
|
||||
"type": "git",
|
||||
"url": "https://github.com/thephpleague/csv.git",
|
||||
"reference": "d2aab1e7bde802582c3879acf03d92716577c76d"
|
||||
},
|
||||
"dist": {
|
||||
"type": "zip",
|
||||
"url": "https://api.github.com/repos/thephpleague/csv/zipball/d2aab1e7bde802582c3879acf03d92716577c76d",
|
||||
"reference": "d2aab1e7bde802582c3879acf03d92716577c76d",
|
||||
"shasum": ""
|
||||
},
|
||||
"require": {
|
||||
"ext-mbstring": "*",
|
||||
"php": ">=5.5.0"
|
||||
},
|
||||
"require-dev": {
|
||||
"friendsofphp/php-cs-fixer": "^1.9",
|
||||
"phpunit/phpunit": "^4.0"
|
||||
},
|
||||
"type": "library",
|
||||
"extra": {
|
||||
"branch-alias": {
|
||||
"dev-master": "8.2-dev"
|
||||
}
|
||||
},
|
||||
"autoload": {
|
||||
"psr-4": {
|
||||
"League\\Csv\\": "src"
|
||||
}
|
||||
},
|
||||
"notification-url": "https://packagist.org/downloads/",
|
||||
"license": [
|
||||
"MIT"
|
||||
],
|
||||
"authors": [
|
||||
{
|
||||
"name": "Ignace Nyamagana Butera",
|
||||
"email": "[email protected]",
|
||||
"homepage": "https://github.com/nyamsprod/",
|
||||
"role": "Developer"
|
||||
}
|
||||
],
|
||||
"description": "Csv data manipulation made easy in PHP",
|
||||
"homepage": "http://csv.thephpleague.com",
|
||||
"keywords": [
|
||||
"csv",
|
||||
"export",
|
||||
"filter",
|
||||
"import",
|
||||
"read",
|
||||
"write"
|
||||
],
|
||||
"time": "2018-02-06T08:27:03+00:00"
|
||||
},
|
||||
{
|
||||
"name": "linkorb/jsmin-php",
|
||||
"version": "1.0.0",
|
||||
@@ -2421,7 +2478,6 @@
|
||||
}
|
||||
],
|
||||
"description": "This extension integrates the grid layout concept also to regular content elements - the grid elements.\r\nIt offers a lot of new features like advanced drag & drop or real references, that improve the usability of the page and list module to speed up the daily work with the backend.",
|
||||
"homepage": "https://extensions.typo3.org/extension/gridelements/",
|
||||
"time": "2017-12-23T18:15:17+00:00"
|
||||
},
|
||||
{
|
||||
@@ -2455,7 +2511,6 @@
|
||||
}
|
||||
],
|
||||
"description": "Compress/minify your HTML output",
|
||||
"homepage": "https://extensions.typo3.org/extension/html_compress/",
|
||||
"time": "2016-12-26T10:19:02+00:00"
|
||||
},
|
||||
{
|
||||
@@ -2492,39 +2547,6 @@
|
||||
"abandoned": "christophlehmann/imageoptimizer",
|
||||
"time": "2018-08-20T23:03:56+00:00"
|
||||
},
|
||||
{
|
||||
"name": "typo3-ter/loginlimit",
|
||||
"version": "1.0.3",
|
||||
"dist": {
|
||||
"type": "zip",
|
||||
"url": "https://extensions.typo3.org/extension/download/loginlimit/1.0.3/zip/",
|
||||
"reference": null,
|
||||
"shasum": null
|
||||
},
|
||||
"require": {
|
||||
"typo3/cms-core": ">= 6.2.0, <= 8.7.99"
|
||||
},
|
||||
"replace": {
|
||||
"loginlimit": "self.version"
|
||||
},
|
||||
"type": "typo3-cms-extension",
|
||||
"autoload": {
|
||||
"psr-4": {
|
||||
"WebentwicklerAt\\Loginlimit\\": "Classes/"
|
||||
}
|
||||
},
|
||||
"authors": [
|
||||
{
|
||||
"name": "Gernot Leitgab",
|
||||
"email": "",
|
||||
"company": "Webentwickler.at",
|
||||
"username": "royalknight"
|
||||
}
|
||||
],
|
||||
"description": "Protect backend and/or frontend login against brute-force attacks.",
|
||||
"homepage": "https://extensions.typo3.org/extension/loginlimit/",
|
||||
"time": "2017-09-23T10:40:00+00:00"
|
||||
},
|
||||
{
|
||||
"name": "typo3-ter/media",
|
||||
"version": "4.5.0",
|
||||
@@ -2559,7 +2581,6 @@
|
||||
}
|
||||
],
|
||||
"description": "Media management system for TYPO3 CMS.",
|
||||
"homepage": "https://extensions.typo3.org/extension/media/",
|
||||
"time": "2017-11-02T13:08:04+00:00"
|
||||
},
|
||||
{
|
||||
@@ -2593,7 +2614,6 @@
|
||||
}
|
||||
],
|
||||
"description": "Search Engine Optimization (SEO), Indexed Google-Sitemap (TXT- and XML-Sitemap) for all Extensions (pibase, extbase), Metatags, Canonical-URL, Pagetitle manipulations, Crawler verification, Piwik and Google Analytics support and some more... multi-language- and multi-tree-support",
|
||||
"homepage": "https://extensions.typo3.org/extension/metaseo/",
|
||||
"time": "2017-06-11T18:32:55+00:00"
|
||||
},
|
||||
{
|
||||
@@ -2633,7 +2653,6 @@
|
||||
}
|
||||
],
|
||||
"description": "Simply manage (permanent 301) redirects in the list view. The extension supports multidomain sites, count the redirect usage and shows the last referer. UPDATE! imports the records from realurl.",
|
||||
"homepage": "https://extensions.typo3.org/extension/ods_redirects/",
|
||||
"time": "2017-05-22T22:07:45+00:00"
|
||||
},
|
||||
{
|
||||
@@ -2667,7 +2686,6 @@
|
||||
}
|
||||
],
|
||||
"description": "Provides API for Backend modules to get a proper path to the Frontend page (simulateStatic/RealURL/CoolURI-like)",
|
||||
"homepage": "https://extensions.typo3.org/extension/pagepath/",
|
||||
"time": "2017-02-15T15:40:25+00:00"
|
||||
},
|
||||
{
|
||||
@@ -2704,7 +2722,6 @@
|
||||
"username": "plusb"
|
||||
}
|
||||
],
|
||||
"homepage": "https://extensions.typo3.org/extension/pb_social/",
|
||||
"time": "2018-02-14T11:05:37+00:00"
|
||||
},
|
||||
{
|
||||
@@ -2738,7 +2755,6 @@
|
||||
}
|
||||
],
|
||||
"description": "Optimization of the final page: reformatting the (x)html output, removal of new lines, and quotes. Move development repository to https://github.com/lochmueller/sourceopt",
|
||||
"homepage": "https://extensions.typo3.org/extension/sourceopt/",
|
||||
"time": "2017-06-15T17:25:53+00:00"
|
||||
},
|
||||
{
|
||||
|
||||
@@ -0,0 +1,117 @@
|
||||
<?php
|
||||
|
||||
namespace EP\EpProducts\Controller;
|
||||
|
||||
/***************************************************************
|
||||
*
|
||||
* Copyright notice
|
||||
*
|
||||
* (c) 2018 Björn Fromme <[email protected]>, dreipunktnull
|
||||
*
|
||||
* All rights reserved
|
||||
*
|
||||
* This script is part of the TYPO3 project. The TYPO3 project is
|
||||
* free software; you can redistribute it and/or modify
|
||||
* it under the terms of the GNU General Public License as published by
|
||||
* the Free Software Foundation; either version 3 of the License, or
|
||||
* (at your option) any later version.
|
||||
*
|
||||
* The GNU General Public License can be found at
|
||||
* http://www.gnu.org/copyleft/gpl.html.
|
||||
*
|
||||
* This script is distributed in the hope that it will be useful,
|
||||
* but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||
* GNU General Public License for more details.
|
||||
*
|
||||
* This copyright notice MUST APPEAR in all copies of the script!
|
||||
***************************************************************/
|
||||
|
||||
use EP\EpProducts\Domain\Repository\ProductRepository;
|
||||
use EP\EpProducts\Service\FilterService;
|
||||
use EP\EpProducts\Service\SearchResultService;
|
||||
use EP\EpProducts\Service\SearchResultUrlService;
|
||||
use TYPO3\CMS\Core\Utility\GeneralUtility;
|
||||
use TYPO3\CMS\Extbase\Mvc\Controller\ActionController;
|
||||
|
||||
class AjaxWatchlistController extends ActionController
|
||||
{
|
||||
|
||||
/**
|
||||
* @var ProductRepository
|
||||
*/
|
||||
protected $productRepository;
|
||||
|
||||
/**
|
||||
* @var SearchResultService
|
||||
*/
|
||||
protected $searchResultService;
|
||||
|
||||
/**
|
||||
* @var SearchResultUrlService
|
||||
*/
|
||||
protected $searchResultUrlService;
|
||||
|
||||
/**
|
||||
* @var FilterService
|
||||
*/
|
||||
protected $filterService;
|
||||
|
||||
/**
|
||||
* @param ProductRepository $productRepository
|
||||
* @param SearchResultService $searchResultService
|
||||
* @param SearchResultUrlService $searchResultUrlService
|
||||
* @param FilterService $filterService
|
||||
*/
|
||||
public function __construct
|
||||
(
|
||||
ProductRepository $productRepository,
|
||||
SearchResultService $searchResultService,
|
||||
SearchResultUrlService $searchResultUrlService,
|
||||
FilterService $filterService
|
||||
)
|
||||
{
|
||||
parent::__construct();
|
||||
|
||||
$this->productRepository = $productRepository;
|
||||
$this->searchResultService = $searchResultService;
|
||||
$this->searchResultUrlService = $searchResultUrlService;
|
||||
$this->filterService = $filterService;
|
||||
}
|
||||
|
||||
/**
|
||||
* @param array $watchlistUids
|
||||
* @param string $referringPageUid
|
||||
* @return string
|
||||
*/
|
||||
public function listAction(array $watchlistUids, $referringPageUid)
|
||||
{
|
||||
$productUids = array_map(function ($uid) {
|
||||
list (, $productUid) = GeneralUtility::trimExplode(':', $uid);
|
||||
return $productUid;
|
||||
}, $watchlistUids);
|
||||
|
||||
$hotelUids = array_map(function ($uid) {
|
||||
list ($hotelUid,) = GeneralUtility::trimExplode(':', $uid);
|
||||
return $hotelUid;
|
||||
}, $watchlistUids);
|
||||
|
||||
$watchlistData = $this->productRepository->getWatchlist($productUids, $hotelUids);
|
||||
$watchlist = $this->searchResultService->preprocess($watchlistData);
|
||||
|
||||
$forcedConceptUid = (int) $this->settings['forcedConceptUid'];
|
||||
$filterSettings = $this->filterService->getDefaultFilterSettings($forcedConceptUid);
|
||||
|
||||
$options = [
|
||||
'defaultDetailPageUid' => $this->settings['defaultDetailPageUid'],
|
||||
'referringPageUid' => $referringPageUid,
|
||||
'filterSettings' => $filterSettings,
|
||||
];
|
||||
$this->searchResultUrlService->process($watchlist, $options);
|
||||
|
||||
return json_encode([
|
||||
'data' => $watchlist->getData(),
|
||||
'total' => $watchlist->getTotal()
|
||||
]);
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,40 @@
|
||||
<?php
|
||||
|
||||
namespace EP\EpProducts\Controller;
|
||||
|
||||
/***************************************************************
|
||||
*
|
||||
* Copyright notice
|
||||
*
|
||||
* (c) 2018 Björn Fromme <[email protected]>, dreipunktnull
|
||||
*
|
||||
* All rights reserved
|
||||
*
|
||||
* This script is part of the TYPO3 project. The TYPO3 project is
|
||||
* free software; you can redistribute it and/or modify
|
||||
* it under the terms of the GNU General Public License as published by
|
||||
* the Free Software Foundation; either version 3 of the License, or
|
||||
* (at your option) any later version.
|
||||
*
|
||||
* The GNU General Public License can be found at
|
||||
* http://www.gnu.org/copyleft/gpl.html.
|
||||
*
|
||||
* This script is distributed in the hope that it will be useful,
|
||||
* but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||
* GNU General Public License for more details.
|
||||
*
|
||||
* This copyright notice MUST APPEAR in all copies of the script!
|
||||
***************************************************************/
|
||||
|
||||
use TYPO3\CMS\Extbase\Mvc\Controller\ActionController;
|
||||
|
||||
class WatchlistController extends ActionController
|
||||
{
|
||||
|
||||
public function listAction()
|
||||
{
|
||||
$this->view->assign('referringPageUid', $GLOBALS['TSFE']->id);
|
||||
}
|
||||
|
||||
}
|
||||
@@ -36,6 +36,44 @@ use EP\EpProducts\Utility\DbUtility;
|
||||
|
||||
class ProductRepository extends AbstractRepository
|
||||
{
|
||||
/**
|
||||
* @param array $productUids
|
||||
* @param array $hotelUids
|
||||
* @return array
|
||||
*/
|
||||
public function getWatchlist(array $productUids, array $hotelUids)
|
||||
{
|
||||
$qb = DbUtility::getDbConnection()->createQueryBuilder();
|
||||
|
||||
$query = $qb
|
||||
->select(
|
||||
'date.concept conceptUid', 'date.concept_name conceptName', 'date.concept_code conceptCode',
|
||||
'date.product productUid', 'date.product_name productName', 'date.product_detail_page productDetailPage',
|
||||
'date.product_feature productFeature',
|
||||
'date.country countryUid','date.country_name countryName', 'date.country_code countryCode',
|
||||
'date.region regionUid', 'date.region_name regionName', 'date.region_feature regionFeature',
|
||||
'date.date_start dateStart', 'date.date_end dateEnd',
|
||||
'date.hotel hotelUid', 'date.hotel_name hotelName', 'date.hotel_category hotelCategory',
|
||||
'date.earlybird earlybird', 'date.low_contingent lowContingent', 'date.board board',
|
||||
'date.product_fact productFact', 'date.hotel_fact hotelFact', 'date.region_fact regionFact',
|
||||
'date.services_included servicesIncluded', 'date.min_price minPrice', 'date.nights nights',
|
||||
'date.available available', 'date.pseudo_price pseudoPrice'
|
||||
)
|
||||
->from('tx_epproducts_domain_model_date', 'date')
|
||||
->where('date.product IN (:productUids)')
|
||||
->andWhere('date.hotel IN (:hotelUids)')
|
||||
->andWhere('date.product_searchable = 1')
|
||||
->orderBy('date.concept_sorting')
|
||||
->addOrderBy('date.product_name')
|
||||
->addOrderBy('date.min_price')
|
||||
->addOrderBy('date.date_start')
|
||||
->addOrderBy('date.hotel_name')
|
||||
->setParameter('productUids', $productUids, Connection::PARAM_INT_ARRAY)
|
||||
->setParameter('hotelUids', $hotelUids, Connection::PARAM_INT_ARRAY)
|
||||
;
|
||||
|
||||
return $query->execute()->fetchAll();
|
||||
}
|
||||
|
||||
/**
|
||||
* @param FilterSettings $filterSettings
|
||||
|
||||
@@ -183,7 +183,11 @@ class ProductService implements SingletonInterface
|
||||
$hotelCategory = array_key_exists($teaserData['hotelCategory'], Hotel::$categoryLabels) ?
|
||||
Hotel::$categoryLabels[$teaserData['hotelCategory']] : null;
|
||||
|
||||
// Use compound key, hotel is not unique
|
||||
$key = $teaserData['hotelUid'] . ':' . $teaserData['productUid'];
|
||||
|
||||
return [
|
||||
'key' => $key,
|
||||
'minDateStart' => null,
|
||||
'maxDateEnd' => null,
|
||||
'minPrice' => null,
|
||||
|
||||
@@ -127,6 +127,9 @@ tx_epproducts_ajax_json {
|
||||
AjaxCalendar {
|
||||
1 = range
|
||||
}
|
||||
AjaxWatchlist {
|
||||
1 = list
|
||||
}
|
||||
}
|
||||
|
||||
settings =< plugin.tx_epproducts.settings
|
||||
|
||||
@@ -308,6 +308,17 @@ $GLOBALS['TYPO3_CONF_VARS']['SC_OPTIONS']['scheduler']['tasks'][\EP\EpProducts\T
|
||||
]
|
||||
);
|
||||
|
||||
\TYPO3\CMS\Extbase\Utility\ExtensionUtility::configurePlugin(
|
||||
'EP.' . $_EXTKEY,
|
||||
'watchlist',
|
||||
[
|
||||
'Watchlist' => 'list',
|
||||
],
|
||||
[
|
||||
'Watchlist' => '',
|
||||
]
|
||||
);
|
||||
|
||||
\TYPO3\CMS\Extbase\Utility\ExtensionUtility::configurePlugin(
|
||||
'EP.' . $_EXTKEY,
|
||||
'ajax',
|
||||
@@ -319,6 +330,7 @@ $GLOBALS['TYPO3_CONF_VARS']['SC_OPTIONS']['scheduler']['tasks'][\EP\EpProducts\T
|
||||
'AjaxContent' => 'country,region,city,hotel,product,journey,webcam',
|
||||
'AjaxTable' => 'pricetable,pricetableHtml,eventPricetable',
|
||||
'AjaxCalendar' => 'range',
|
||||
'AjaxWatchlist' => 'list',
|
||||
],
|
||||
[
|
||||
'AjaxSearch' => 'searchresult',
|
||||
@@ -328,6 +340,7 @@ $GLOBALS['TYPO3_CONF_VARS']['SC_OPTIONS']['scheduler']['tasks'][\EP\EpProducts\T
|
||||
'AjaxContent' => 'webcam',
|
||||
'AjaxTable' => 'pricetable,pricetableHtml,eventPricetable',
|
||||
'AjaxCalendar' => 'range',
|
||||
'AjaxWatchlist' => 'list',
|
||||
]
|
||||
);
|
||||
|
||||
|
||||
@@ -143,6 +143,12 @@ if (!defined('TYPO3_MODE')) {
|
||||
'Vertriebspartner Export'
|
||||
);
|
||||
|
||||
\TYPO3\CMS\Extbase\Utility\ExtensionUtility::registerPlugin(
|
||||
'EP.' . $_EXTKEY,
|
||||
'watchlist',
|
||||
'Merkliste'
|
||||
);
|
||||
|
||||
$extensionName = strtolower(\TYPO3\CMS\Core\Utility\GeneralUtility::underscoredToUpperCamelCase($_EXTKEY));
|
||||
|
||||
$pluginSignature = str_replace('_', '', $_EXTKEY) . '_product_detail';
|
||||
|
||||
@@ -43,6 +43,8 @@ plugin.tx_eptheme {
|
||||
groupsContactFormPageUid =
|
||||
# cat=eptheme/200/250; type=string; label=Rating page UID
|
||||
ratingPageUid =
|
||||
# cat=eptheme/200/260; type=string; label=Watchlist page UID
|
||||
watchlistPageUid =
|
||||
|
||||
# cat=eptheme/400/100; type=string; label=Phone number general
|
||||
phoneNumber = 0221 - 272 276 0
|
||||
|
||||
@@ -81,6 +81,7 @@ plugin.tx_eptheme {
|
||||
groupsContactFormPageUid = {$plugin.tx_eptheme.settings.groupsContactFormPageUid}
|
||||
blogDetailPageUid = {$plugin.tx_eptheme.settings.blogDetailPageUid}
|
||||
ratingPageUid = {$plugin.tx_eptheme.settings.ratingPageUid}
|
||||
watchlistPageUid = {$plugin.tx_eptheme.settings.watchlistPageUid}
|
||||
}
|
||||
view {
|
||||
templateRootPaths.0 = EXT:ep_theme/Resources/Private/Templates
|
||||
|
||||
@@ -25,6 +25,7 @@ require('../images/favicon_uch.ico');
|
||||
|
||||
// Import dependencies
|
||||
import Vue from 'vue'
|
||||
import VueSession from 'vue-session'
|
||||
import $ from 'jquery'
|
||||
import dayjs from 'dayjs'
|
||||
import 'dayjs/locale/de'
|
||||
@@ -49,6 +50,8 @@ import Gmap from './components/Gmap.vue'
|
||||
import Calendar from './components/Calendar.vue'
|
||||
import EventPricetable from './components/EventPriceTable.vue'
|
||||
import ContactForm from './components/ContactForm.vue'
|
||||
import WatchlistToggle from './components/WatchlistToggle.vue'
|
||||
import Watchlist from './components/Watchlist.vue'
|
||||
|
||||
// Define global constants
|
||||
const $window = $(window);
|
||||
@@ -56,6 +59,9 @@ const sliderPrevArrow = '<button class="slider-pagination__arrow slider-paginati
|
||||
const sliderNextArrow = '<button class="slider-pagination__arrow slider-pagination__arrow--next"><i class="fa fa-2x fa-chevron-right"></i></button>';
|
||||
const sliderDot = '<button class="slider-pagination__dot" data-role="none" role="button" tabindex="0" />';
|
||||
|
||||
// Enable session handling
|
||||
Vue.use(VueSession);
|
||||
|
||||
// Define date filter for vue templates
|
||||
Vue.filter('date', (value) => {
|
||||
return dayjs(value).format('DD.MM.YYYY');
|
||||
@@ -73,7 +79,9 @@ new Vue({
|
||||
Gmap,
|
||||
Calendar,
|
||||
EventPricetable,
|
||||
ContactForm
|
||||
ContactForm,
|
||||
WatchlistToggle,
|
||||
Watchlist
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
@@ -85,6 +93,12 @@ new Vue({
|
||||
searchbarFixed: false,
|
||||
mobileMode: false,
|
||||
backgroundImageMode: 'mobile',
|
||||
watchlist: []
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
watchlistCount () {
|
||||
return this.watchlist.length;
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
@@ -366,6 +380,25 @@ new Vue({
|
||||
EventBus.$on('scrollTo', (anchorId, offset) => {
|
||||
this.scrollTo(anchorId, offset);
|
||||
});
|
||||
EventBus.$on('watchlistToggle', uid => {
|
||||
let list = this.watchlist;
|
||||
let watchlistIndex = list.indexOf(uid);
|
||||
if (watchlistIndex === -1) {
|
||||
list.push(uid)
|
||||
} else {
|
||||
list.splice(watchlistIndex, 1)
|
||||
}
|
||||
this.watchlist = list;
|
||||
this.$session.set('watchlist', this.watchlist);
|
||||
|
||||
});
|
||||
if (!this.$session.exists()) {
|
||||
this.$session.start();
|
||||
}
|
||||
if (!this.$session.has('watchlist')) {
|
||||
this.$session.set('watchlist', []);
|
||||
}
|
||||
this.watchlist = this.$session.get('watchlist');
|
||||
},
|
||||
mounted () {
|
||||
Vue.nextTick(() => {
|
||||
|
||||
@@ -73,6 +73,12 @@
|
||||
default () {
|
||||
return {};
|
||||
}
|
||||
},
|
||||
watchlist: {
|
||||
type: Array,
|
||||
default () {
|
||||
return [];
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
@@ -133,7 +139,6 @@
|
||||
this.loading = false;
|
||||
EventBus.$emit('ajaxContentLoaded');
|
||||
});
|
||||
|
||||
},
|
||||
resetFilterSettings () {
|
||||
this.filterSettings = this.defaultFilterSettings;
|
||||
|
||||
+11
@@ -59,14 +59,19 @@
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<watchlist-toggle :uid="item.key" :watchlist="watchlist" class="teaserbox-watchlist"></watchlist-toggle>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import dayjs from 'dayjs'
|
||||
import 'dayjs/locale/de'
|
||||
import WatchlistToggle from './WatchlistToggle.vue'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
WatchlistToggle
|
||||
},
|
||||
props: {
|
||||
item: {
|
||||
type: Object,
|
||||
@@ -75,6 +80,12 @@
|
||||
section: {
|
||||
type: Object,
|
||||
required: true
|
||||
},
|
||||
watchlist: {
|
||||
type: Array,
|
||||
default () {
|
||||
return [];
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
|
||||
@@ -0,0 +1,88 @@
|
||||
<template>
|
||||
<div class="watchlist">
|
||||
<template v-for="section in teasers">
|
||||
<h2 class="headline headline--secondary headline--underlined">{{ section.concept.name }}</h2>
|
||||
<div class="searchresult-section" v-bind:class="'searchresult-section--' + section.concept.code">
|
||||
<search-result-item
|
||||
v-for="item in section.items"
|
||||
v-bind:key="item.key"
|
||||
v-bind:item="item"
|
||||
v-bind:section="section"
|
||||
v-bind:watchlist="watchlist"></search-result-item>
|
||||
</div>
|
||||
</template>
|
||||
<div class="alert alert-info" v-if="total === 0">
|
||||
Deine Merkliste ist aktuell leer...
|
||||
</div>
|
||||
<div v-show="loading" class="loader">
|
||||
<img :src="loaderUri" alt="Loading...">
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Vue from 'vue'
|
||||
import EventBus from '../bus'
|
||||
import SearchResultItem from './SearchResultItem.vue'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
SearchResultItem
|
||||
},
|
||||
props: {
|
||||
watchlistUri: {
|
||||
type: String,
|
||||
required: true
|
||||
},
|
||||
loaderUri: {
|
||||
type: String,
|
||||
required: true
|
||||
},
|
||||
referringPageUid: {
|
||||
type: Number,
|
||||
required: true
|
||||
},
|
||||
watchlist: {
|
||||
type: Array,
|
||||
default () {
|
||||
return [];
|
||||
}
|
||||
}
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
teasers: {},
|
||||
total: 0
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
loadList () {
|
||||
if (this.watchlist.length === 0) {
|
||||
this.teasers = {};
|
||||
this.total = 0;
|
||||
return;
|
||||
}
|
||||
let query = {};
|
||||
query['tx_epproducts_ajax[watchlistUids]'] = this.watchlist;
|
||||
query['tx_epproducts_ajax[referringPageUid]'] = this.referringPageUid;
|
||||
this.loading = true;
|
||||
$.post(this.watchlistUri, query, (json) => {
|
||||
this.teasers = json.data;
|
||||
this.total = json.total;
|
||||
this.loading = false;
|
||||
EventBus.$emit('ajaxContentLoaded');
|
||||
});
|
||||
}
|
||||
},
|
||||
created () {
|
||||
EventBus.$on('watchlistToggle', () => {
|
||||
this.loadList();
|
||||
});
|
||||
},
|
||||
mounted () {
|
||||
Vue.nextTick(() => {
|
||||
this.loadList();
|
||||
})
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,37 @@
|
||||
<template>
|
||||
<span v-on:click.prevent="toggleWatchlist()">
|
||||
<template v-if="onWatchlist">
|
||||
<i class="fa fa-minus tooltiptoggle" data-placement="auto" title="Merkliste"></i>
|
||||
</template>
|
||||
<template v-else>
|
||||
<i class="fa fa-plus tooltiptoggle" data-placement="auto" title="Merkliste"></i>
|
||||
</template>
|
||||
</span>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import EventBus from '../bus'
|
||||
|
||||
export default {
|
||||
props: {
|
||||
uid: {
|
||||
type: String,
|
||||
required: true
|
||||
},
|
||||
watchlist: {
|
||||
type: Array,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
toggleWatchlist () {
|
||||
EventBus.$emit('watchlistToggle', this.uid);
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
onWatchlist () {
|
||||
return this.watchlist.indexOf(this.uid) !== -1;
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -36,8 +36,8 @@ $output-bourbon-deprecation-warnings: false;
|
||||
@import "remix/forms";
|
||||
@import "remix/contactnav";
|
||||
@import "remix/faq";
|
||||
|
||||
@import "remix/destination-pulldown";
|
||||
@import "remix/watchlist";
|
||||
|
||||
// core config
|
||||
@import "variables";
|
||||
|
||||
@@ -33,6 +33,7 @@ $output-bourbon-deprecation-warnings: false;
|
||||
@import "remix/socialmedia";
|
||||
@import "remix/contactnav";
|
||||
@import "remix/faq";
|
||||
@import "remix/watchlist";
|
||||
|
||||
// core config
|
||||
@import "variables";
|
||||
|
||||
@@ -33,6 +33,7 @@ $output-bourbon-deprecation-warnings: false;
|
||||
@import "remix/socialmedia";
|
||||
@import "remix/contactnav";
|
||||
@import "remix/faq";
|
||||
@import "remix/watchlist";
|
||||
|
||||
// core config
|
||||
@import "variables";
|
||||
|
||||
@@ -33,6 +33,7 @@ $output-bourbon-deprecation-warnings: false;
|
||||
@import "remix/socialmedia";
|
||||
@import "remix/contactnav";
|
||||
@import "remix/faq";
|
||||
@import "remix/watchlist";
|
||||
|
||||
// core config
|
||||
@import "variables";
|
||||
|
||||
@@ -108,6 +108,9 @@
|
||||
&.youtube {
|
||||
top: 176px;
|
||||
}
|
||||
&.watchlist {
|
||||
top: 220px;
|
||||
}
|
||||
&:hover{
|
||||
right: 0;
|
||||
}
|
||||
|
||||
@@ -100,3 +100,15 @@
|
||||
color: $color-label-low-contingent;
|
||||
}
|
||||
}
|
||||
|
||||
.product-detail {}
|
||||
|
||||
.product-detail__watchlist {
|
||||
display: inline-block;
|
||||
color: white;
|
||||
background-color: $color-brand-primary;
|
||||
font-size: 22px;
|
||||
line-height: 22px;
|
||||
padding: 4px 12px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
@@ -6,6 +6,7 @@
|
||||
text-decoration: none;
|
||||
color: $color-font-base;
|
||||
margin-bottom: 20px;
|
||||
position: relative;
|
||||
|
||||
&:hover {
|
||||
color: $color-font-base;
|
||||
@@ -57,6 +58,11 @@
|
||||
@include mq($from: tablet) {
|
||||
display: flex;
|
||||
flex-wrap: nowrap;
|
||||
|
||||
&:not(:last-child) {
|
||||
padding-bottom: 20px;
|
||||
border-bottom: 2px solid $color-grey;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
@@ -150,7 +156,7 @@
|
||||
|
||||
.teaserbox--landscape & {
|
||||
height: auto;
|
||||
border-style: none solid;
|
||||
border-style: none;
|
||||
|
||||
@include mq($from: tablet) {
|
||||
display: flex;
|
||||
@@ -158,7 +164,7 @@
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
padding: 8px 16px;
|
||||
border-style: solid none;
|
||||
border-style: none;
|
||||
}
|
||||
|
||||
}
|
||||
@@ -189,7 +195,8 @@
|
||||
border-style: solid solid solid none;
|
||||
}
|
||||
|
||||
.teaserbox--searchresult & {
|
||||
.teaserbox--searchresult &,
|
||||
.teaserbox--landscape & {
|
||||
border: none;
|
||||
|
||||
@include mq($from: tablet) {
|
||||
@@ -341,3 +348,30 @@
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.teaserbox-watchlist {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
z-index: 10;
|
||||
@include size(48px);
|
||||
display: block;
|
||||
color: white;
|
||||
&:hover,
|
||||
&:focus,
|
||||
&:visited,
|
||||
&:active {
|
||||
color: white;
|
||||
}
|
||||
cursor: pointer;
|
||||
padding: 4px 0 0 28px;
|
||||
&:before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
z-index: -1;
|
||||
top: 0;
|
||||
left: 0;
|
||||
display: block;
|
||||
@include triangle(48px, $color-brand-secondary, up-right);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -0,0 +1,21 @@
|
||||
.watchlist {
|
||||
position: relative;
|
||||
|
||||
.loader {
|
||||
position: absolute;
|
||||
z-index: 100;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: rgba(white, 0.75);
|
||||
|
||||
img {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
@@ -1,5 +1,9 @@
|
||||
{namespace v=FluidTYPO3\Vhs\ViewHelpers}
|
||||
<div class="ep-contactnav">
|
||||
<a href="{f:uri.page(pageUid: settings.watchlistPageUid)}" class="bg-red watchlist" v-show="watchlistCount > 0" v-cloak>
|
||||
<span class="fa fa-list" aria-hidden="true"></span>
|
||||
<div>Merkliste ({{ watchlistCount }})</div>
|
||||
</a>
|
||||
<a href="tel:{settings.phoneNumberLink}" class="bg-red phone" title="Telefonische Beratung">
|
||||
<span class="fa fa-phone" aria-hidden="true"></span>
|
||||
<div>{settings.phoneNumber}</div>
|
||||
|
||||
@@ -17,7 +17,6 @@
|
||||
</div>
|
||||
<div class="col-sm-4 pull-left product-header__title">
|
||||
<div class="head">
|
||||
<!-- <a href="#" class="add-note" title="Dem Merkzettel hinzufügen"></a> -->
|
||||
{product.concept.name}
|
||||
</div>
|
||||
<div class="content">
|
||||
@@ -27,12 +26,17 @@
|
||||
<f:image class="flag" src="{ep:flagiconSource(countryCode: product.country.code)}" alt="{product.country.name}"/>
|
||||
<f:if condition="{hotel}">
|
||||
<f:then>
|
||||
<a href="{ep:gmapsUrl(hotel: hotel)}" target="_blank" class="ep-property ep-marker"><i class="fa fa-map-marker" aria-hidden="true"></i></a>
|
||||
<a href="{ep:gmapsUrl(hotel: hotel)}" target="_blank" class="ep-property ep-marker">
|
||||
<i class="fa fa-map-marker" aria-hidden="true"></i>
|
||||
</a>
|
||||
</f:then>
|
||||
<f:else>
|
||||
<a href="{ep:gmapsUrl(region: product.region)}" target="_blank" class="ep-property ep-marker"><i class="fa fa-map-marker" aria-hidden="true"></i></a>
|
||||
<a href="{ep:gmapsUrl(region: product.region)}" target="_blank" class="ep-property ep-marker">
|
||||
<i class="fa fa-map-marker" aria-hidden="true"></i>
|
||||
</a>
|
||||
</f:else>
|
||||
</f:if>
|
||||
<watchlist-toggle :watchlist="watchlist" uid="{hotel.uid}:{product.uid}" class="product-detail__watchlist"></watchlist-toggle>
|
||||
<f:if condition="{product.skipassIncluded}">
|
||||
<a href="#" class="ep-property">inkl. Skipass</a>
|
||||
</f:if>
|
||||
@@ -72,3 +76,9 @@
|
||||
</f:if>
|
||||
{v:render.template(file: 'EXT:ep_theme/Resources/Private/Partials/Breadcrumb.html')}
|
||||
</div>
|
||||
<script>
|
||||
import WatchlistToggle from "../../Assets/js/components/WatchlistToggle";
|
||||
export default {
|
||||
components: {WatchlistToggle}
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -94,6 +94,7 @@
|
||||
<a href="{uriLink}" title="{teaser.product.name}" class="button button--full searchresult-item__button">Details & Buchen</a>
|
||||
</div>
|
||||
</div>
|
||||
<watchlist-toggle uid="{teaser.key}" v-bind:watchlist="watchlist" class="teaserbox-watchlist"></watchlist-toggle>
|
||||
</div>
|
||||
</f:section>
|
||||
|
||||
|
||||
@@ -8,6 +8,13 @@
|
||||
|
||||
<f:section name="Content">
|
||||
<f:switch expression="{data.list_type}">
|
||||
<f:comment>Plugin watchlist</f:comment>
|
||||
<f:case value="epproducts_watchlist">
|
||||
<f:render section="Header" arguments="{_all}"/>
|
||||
<ep:container data="{data}">
|
||||
<f:cObject typoscriptObjectPath="tt_content.list.20.{data.list_type}" data="{data}"/>
|
||||
</ep:container>
|
||||
</f:case>
|
||||
<f:comment>Plugin snowreport</f:comment>
|
||||
<f:case value="epproducts_snowreport_list">
|
||||
<f:render section="Header" arguments="{_all}"/>
|
||||
|
||||
@@ -9,11 +9,12 @@
|
||||
<div id="search">
|
||||
<search-result
|
||||
results-uri="{ep:uri.ajax(action: 'searchresult', controller: 'AjaxSearch', format: 'json', noCacheHash: 1)}"
|
||||
:initial-filter-settings='<v:format.json.encode>{filterSettings}</v:format.json.encode>'
|
||||
:initial-filter-options='<v:format.json.encode>{filterOptions}</v:format.json.encode>'
|
||||
:referring-page-uid="{referringPageUid}"
|
||||
v-bind:initial-filter-settings='<v:format.json.encode>{filterSettings}</v:format.json.encode>'
|
||||
v-bind:initial-filter-options='<v:format.json.encode>{filterOptions}</v:format.json.encode>'
|
||||
v-bind:referring-page-uid="{referringPageUid}"
|
||||
argument-prefix="{ep:argumentPrefix(pluginName: 'ajax')}"
|
||||
:date-presets='{settings.datePickerPresets -> v:format.json.encode()}'
|
||||
v-bind:date-presets='{settings.datePickerPresets -> v:format.json.encode()}'
|
||||
v-bind:watchlist="watchlist"
|
||||
inline-template>
|
||||
<div class="searchresult-wrapper">
|
||||
<div class="pagehead pagehead--searchresult">
|
||||
@@ -290,7 +291,8 @@
|
||||
v-for="item in section.items"
|
||||
v-bind:key="item.key"
|
||||
v-bind:item="item"
|
||||
v-bind:section="section"></search-result-item>
|
||||
v-bind:section="section"
|
||||
v-bind:watchlist="watchlist"></search-result-item>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
|
||||
@@ -0,0 +1,14 @@
|
||||
<html xmlns="http://www.w3.org/1999/xhtml" lang="en"
|
||||
xmlns:f="http://typo3.org/ns/fluid/ViewHelpers"
|
||||
xmlns:ep="http://typo3.org/ns/EP/EpTheme/ViewHelpers">
|
||||
|
||||
<f:layout name="Default"/>
|
||||
|
||||
<f:section name="Main">
|
||||
|
||||
<watchlist :watchlist="watchlist" :referring-page-uid="{referringPageUid}"
|
||||
loader-uri="{f:uri.image(src: 'EXT:ep_theme/Resources/Public/images/ajax-loader-white.gif')}"
|
||||
watchlist-uri="{ep:uri.ajax(action: 'list', controller: 'AjaxWatchlist', format: 'json', noCacheHash: 1)}"></watchlist>
|
||||
</f:section>
|
||||
|
||||
</html>
|
||||
Reference in New Issue
Block a user