Bap Share Widget
Bosch Gallery
Bap Vpf React Widget
Características clave
preguntas frecuentes
Video
Activos de ventas
Bap Product Carousel
Bap Product Carousel
Detalles del producto
Detalles del producto no está disponible temporalmente.
- Contáctenos
- Buscar
-
Bosch mundial
Selector de idioma
Bosch AutoParts Search
Menú de navegación
Se ha producido un error al procesar la plantilla.
The following has evaluated to null or missing:
==> childAssetCategory.getUrl() [in template "20097#20123#649649" at line 231, column 110]
----
Tip: If the failing expression is known to legally refer to something that's sometimes null or missing, either specify a default value like myOptionalVar!myDefault, or use <#if myOptionalVar??>when-present<#else>when-missing</#if>. (These only cover the last step of the expression; to cover the whole expression, use parenthesis: (myOptionalVar.foo)!myDefault, (myOptionalVar.foo)??
----
----
FTL stack trace ("~" means nesting-related):
- Failed at: ${childAssetCategory.getUrl()} [in template "20097#20123#649649" at line 231, column 108]
----
1<#assign BapProductNavService = serviceLocator.findService("com.bosch.autoparts.product.nav.service.BapProductNavService")>
2<#assign countryCode = locale.getCountry()?lower_case>
3<#assign storedVehicles = []>
4<#assign selctedVehicle = "">
5<#if countryCode == "mx">
6<#assign listAssetCategory = BapProductNavService.getNavigationCategory(themeDisplay, "product categories mx")>
7
8<#else>
9
10<#assign listAssetCategory = BapProductNavService.getNavigationCategory(themeDisplay, "product categories")>
11</#if>
12
13
14<#assign siteUrl = themeDisplay.getScopeGroup().getFriendlyURL()>
15<#assign pageURL = themeDisplay.getLayout().getFriendlyURL()>
16<#assign categoryBaseUrl = propsUtil.get("category-page-base-url")>
17<#assign productsPageUrl = propsUtil.get("products-page-url-"+themeDisplay.getLanguageId())>
18
19<div id="bap-navigation" role="navigation">
20 <#if entries?has_content>
21 <div id="main-nav-container">
22 <div id="parent-nav-container" class="container">
23
24 <div class="navbar-expand-md navbar-light ">
25 <div class="navbar-toggler-container">
26 <button class="navbar-toggler" id="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
27 <i class="bap-icon bap-list-view-mobile"> </i>
28 </button>
29
30 <button type="button" id="close" class="close" aria-label="Close">
31 <i class="bap-icon bap-close" aria-hidden="true"> </i>
32 </button>
33 </div>
34 <a
35 href="${themeDisplay.getPortalURL()}"
36 class="auto-parts"
37 >
38 <@liferay.language key="label-auto-parts" />
39 </a>
40 </div>
41 <div class="border-bottom-mob" id="nav-mob-line" style="display:none" ></div>
42
43 <ul class="nav nav-tabs d-none d-lg-block" id="myTab" role="list">
44 <li class="nav-item" onClick="openSecondLevel('Products')">
45 <a
46 class="nav-link"
47 id="products-tab"
48 data-toggle="tab"
49 href="#bap-products"
50 >
51 <span><@liferay.language key="label-products" /></span>
52 <i class="bap-icon bap-right"> </i>
53 </a>
54 </li>
55
56 <#list entries as entry>
57 <#if entry.hasChildren()>
58 <li class="nav-item" onClick="openSecondLevel('${entry.getName()}')" >
59 <a
60
61 class="nav-link"
62 id="${entry.getName()?replace(' ', '')?lower_case}-tab"
63 data-toggle="tab"
64 href="#${entry.getName()?replace(' ', '')?lower_case}"
65 >
66
67 <span>${entry.getName()}</span>
68 <i class="bap-icon bap-right"> </i>
69 </a>
70 </li>
71 <#else>
72 <#assign
73 active_class = ""
74 />
75
76 <#if pageURL?replace('/', '')?lower_case == entry.getName()?lower_case >
77 <#assign
78 active_class = "active"
79 />
80 </#if>
81
82 <li class="nav-item">
83 <a
84 onClick="performAnalyticsNavigation('${entry.getName()}','')"
85 class="nav-link ${active_class}"
86 ${entry.getTarget()}
87 id="${entry.getName()?replace(' ', '')?lower_case}-tab"
88 href="${entry.getURL()}"
89 >${entry.getName()}</a>
90 </li>
91 </#if>
92 </#list>
93 <li class="auto-parts-lg">
94 <a
95 href="${themeDisplay.getPortalURL()}"
96 class="auto-parts"
97 >
98 <@liferay.language key="label-auto-parts" />
99 </a>
100 </li>
101 </ul>
102 </div>
103 </div>
104 </#if>
105 <div id="child-nav-container" class="container">
106 <div class="tab-content">
107 <#if entries?has_content>
108
109 <#list entries as entry>
110 <div class="tab-pane fade" id="${entry.getName()?replace(' ', '')?lower_case}" role="tabpanel" aria-labelledby="${entry.getName()?replace(' ', '')?lower_case}">
111 <#list entry.getChildren()?chunk(4) as row>
112 <div class="row col-md-12">
113 <#list row as page>
114 <div class="col-md-3">
115 <#if page.hasChildren()>
116 <a id="${page.getName()?replace(' ', '')?lower_case}-tab"
117 href="#${page.getName()?replace(' ', '')?lower_case}-pane"
118 data-toggle="tab"
119 onClick="performAnalyticsNavigation('${entry.getName()}','${page.getName()}')"
120 >
121 <span>${page.getName()}</span>
122 <i class="bap-icon bap-right"> </i>
123 </a>
124 <#else>
125 <a
126 onClick="performAnalyticsNavigation('${entry.getName()}','${page.getName()}')"
127 id="${page.getName()?replace(' ', '')?lower_case}-tab" ${page.getTarget()}
128 href="${page.getURL()}"
129 >${page.getName()}</a>
130 </#if>
131 </div>
132 </#list>
133 </div>
134 </#list>
135 </div>
136 </#list>
137
138 <#list entries as entry>
139 <#list entry.getChildren() as child>
140 <div class="tab-pane fade" id="${child.getName()?replace(' ', '')?lower_case}-pane" role="tabpanel" aria-labelledby="${child.getName()?replace(' ', '')?lower_case}">
141 <div class="row col-md-12">
142 <div class="col-md-3">
143 <a href="#${entry.getName()?replace(' ', '')?lower_case}"
144 data-toggle="tab"
145 >${child.getName()}</a>
146 </div>
147 </div>
148 <#list child.getChildren()?chunk(4) as row>
149 <div class="row col-md-12">
150 <#list row as grandchild>
151 <div class="col-md-3">
152 <a href="${grandchild.getURL()}" ${grandchild.getTarget()}>${grandchild.getName()}</a>
153 </div>
154 </#list>
155 </div>
156 </#list>
157 </div>
158 </#list>
159 </#list>
160
161 </#if>
162
163 <#-- TOP LEVEL PRODUCT NAV -->
164
165 <div class="tab-pane fade" id="bap-products" role="tabpanel" aria-labelledby="products">
166 <div class="row">
167 <div class="col-md-12 back-icon-mobile">
168 <a id="back-close">
169 <i class="bap-icon bap-arrow-left"> </i>
170 </a>
171 </div>
172 <#list listAssetCategory as assetCategory>
173 <#if assetCategory.getParentCategoryId() == 0 >
174 <div class="col-md-3">
175 <#if assetCategory.isLeafNode()>
176 <a onClick="performAnalyticsNavigation('Products','${assetCategory.getName()}')" href="${categoryBaseUrl}${assetCategory.getUrl()}"
177 >${assetCategory.getName()}</a>
178 <#else>
179 <a onClick="performAnalyticsNavigation('Products','${assetCategory.getName()}')" href="#${assetCategory.getName()?replace(' ', '')?lower_case}-pane"
180 data-toggle="tab"
181 >
182 <span>${assetCategory.getName()}</span>
183 <i class="bap-icon bap-right"> </i>
184 </a>
185 </#if>
186
187 </div>
188 </#if>
189 </#list>
190 <div class="col-md-12 view-all-link">
191 <a class="catalog-url" href="${productsPageUrl}">
192 <span><@liferay.language key="label-view-all" /></span> <i class="bap-icon bap-right"> </i>
193 </a>
194 </div>
195 </div>
196 </div>
197
198 <#-- SECONDARY LEVEL PRODUCT NAV -->
199
200 <#list listAssetCategory as assetCategory>
201 <#if assetCategory.getParentCategoryId() == 0 >
202 <div class="tab-pane fade" id="${assetCategory.getName()?replace(' ', '')?lower_case}-pane" role="tabpanel" aria-labelledby="${assetCategory.getName()?replace(' ', '')?lower_case}">
203 <div class="row">
204 <div class="back-icon">
205 <a class="tertiary-back-arrow"
206 href="#bap-products"
207 data-toggle="tab"
208 > <i class="bap-icon bap-left"> </i> </a>
209 <a class="tertiary-back-data"
210 href="${categoryBaseUrl}${assetCategory.getUrl()}"
211 > ${assetCategory.getName()}</a>
212 </div>
213 </div>
214 <div class="back-icon-mobile">
215 <div class="row">
216 <a
217 href="#bap-products"
218 data-toggle="tab"
219 >
220 <i class="bap-icon bap-arrow-left"> </i>
221 </a>
222 <a class="tertiary-back-data"
223 href="${categoryBaseUrl}${assetCategory.getUrl()}"
224 > ${assetCategory.getName()}</a>
225 </div>
226 </div>
227 <div class="row">
228 <#list listAssetCategory as childAssetCategory>
229 <#if childAssetCategory.getParentCategoryId() == assetCategory.getCategoryId() >
230 <div class="col-md-3">
231 <a href="${categoryBaseUrl}${childAssetCategory.getUrl()}">${childAssetCategory.getName()}</a>
232 </div>
233 </#if>
234 </#list>
235 </div>
236 </div>
237 </#if>
238 </#list>
239 </div>
240 </div>
241</div>
242
243<script>
244 $(function() {
245
246
247
248 $('.tab-pane a').on('click', function(){
249 $('.tab-pane a').removeClass('active');
250 });
251
252
253 $('#navbar-toggler').on('click', function(){
254 handleHamburgerButton();
255 });
256
257
258 $('.nav-item').on('click', function(){
259 if ( $('#myTab').css('display') == 'none' || $('#myTab').css("visibility") == "hidden"){
260 $('#myTab').removeClass("d-none d-lg-block");
261 }else{
262 $('#myTab').addClass("d-none d-lg-block");
263 }
264
265 $('.tab-content').show();
266 $('#navbar-toggler').hide();
267 $('#close').show();
268 $("#nav-mob-line").hide();
269
270 //Priti
271 if($('#bap-products.active').length > 0){
272 $("#main-nav-container").removeClass("bottom-border");
273 }
274 else{
275 $("#main-nav-container").addClass("bottom-border");
276 }
277 });
278
279
280 $('#close').on('click', function(){
281 handleCloseButton();
282 });
283
284 $('#back-close').on('click', function(){
285 handleBackButton();
286 });
287
288 $('#bap-navigation a').on('click', function() {
289 if (window.matchMedia('screen and (max-width: 768px)').matches) {
290 $(window).scrollTop($('#bap-navigation').offset().top - 50);
291 }
292 });
293 });
294
295 function getSelectedVehicle(){
296
297 var countryCode = "${countryCode}" ;
298 var storedVehicles = [];
299 var selctedVehicleName = '';
300 if(countryCode == 'mx'){
301 if( window.localStorage.getItem("bap.vehicles_mx") !== null){
302 storedVehicles = window.localStorage.getItem("bap.vehicles_mx");
303 }
304 }
305 else{
306 if( window.localStorage.getItem("bap.vehicles") !== null){
307 storedVehicles = window.localStorage.getItem("bap.vehicles")
308 }
309 }
310
311 if(storedVehicles.length > 0){
312
313 let selectedVehicle = JSON.parse(storedVehicles).filter(function (e) {
314 return e.active == true;
315 });
316 if(selectedVehicle.length > 0){
317 selctedVehicleName = selectedVehicle[0].vehicleName;
318 }
319
320 }
321 //alert("selctedVehicle=="+selctedVehicleName)
322 return selctedVehicleName;
323 //priti
324 }
325
326 function performAnalyticsNavigation(category,subCategory){
327 //debugger;
328 var selectedVehicalName = getSelectedVehicle();
329 //alert("selectedVehicalName=="+selectedVehicalName +" category=="+category+" subCategory=="+subCategory);
330 window.dataLayer = window.dataLayer || [];
331 dataLayer.push({
332 'event': 'navigation',
333 'navi_category': category, //e.g.:products
334 'navi_subcategory': subCategory, //e.g.:brakes
335 'vehicle': selectedVehicalName //e.g.:2020 Ford EcoSport 1.0L L3 GAS
336 });
337 }
338
339 function handleHamburgerButton(){
340 if ( $('#myTab').css('display') == 'none' || $('#myTab').css("visibility") == "hidden"){
341 $('#myTab').removeClass("d-none d-lg-block");
342 $("#nav-mob-line").show();
343 }else{
344 $('#myTab').addClass("d-none d-lg-block");
345 $("#nav-mob-line").hide();
346 }
347 $('.tab-content').hide();
348 }
349
350 function handleCloseButton(){
351 if($(window).width() < 767){
352 $('.nav-link.active').removeClass("active");
353 $('.tab-pane.fade.active.show').removeClass("active show");
354 $('#navbar-toggler').show();
355 $('#close').hide();
356 $("#main-nav-container").removeClass("bottom-border");
357 }
358 }
359
360 function handleBackButton(){
361 if($(window).width() < 767){
362 $('.nav-link.active').removeClass("active");
363 $('.tab-pane.fade.active.show').removeClass("active show");
364 $('#myTab').removeClass("d-none d-md-block");
365 $('#navbar-toggler').show();
366 $('#close').hide();
367 $("#nav-mob-line").show();
368 $("#main-nav-container").removeClass("bottom-border");
369 }
370 }
371
372 function openSecondLevel(category){
373 performAnalyticsNavigation(category,'')
374 $('#navbar-toggler').hide();
375 $('#close').show();
376 }
377
378 $(document).on('click', '#bap-navigation .nav-link.active', function() {
379 var href = $(this).attr('href').substring(1);
380 $(this).toggleClass('active');
381 $('.tab-pane[id="' + href + '"]').removeClass('active');
382 $(".tab-content").find(".tab-pane.fade.active").removeClass('active');
383 if($(window).width() > 767){
384 $("#main-nav-container").removeClass("bottom-border");
385 }
386 });
387
388 $(document).mouseup(function(e)
389 {
390 var parentNavContainer = $("#parent-nav-container");
391 var childNavContainer = $("#child-nav-container");
392
393 if (!parentNavContainer.is(e.target) && parentNavContainer.has(e.target).length === 0
394 && !childNavContainer.is(e.target) && childNavContainer.has(e.target).length === 0
395 )
396 {
397 $("#products-tab").removeClass('active');
398 $("#main-nav-container").removeClass("bottom-border");
399 $('#myTab').addClass("d-none d-lg-block");
400 $("#nav-mob-line").hide();
401 $("#bap-navigation .tab-content").find(".tab-pane.fade.active").removeClass('active');
402 }
403 });
404
405</script>