1<#assign serviceVehicule=serviceLocator.findService("bnp.service.display.vehicule.BnpServiceDisplayVehicule")>
2<#assign groupId=themeDisplay.getLayout().getGroupId()>
3<#assign end_point="similar-vehicles">
4<#assign partnerVehicleId=request.getParameter( "partnerVehicleId")>
5<#assign partnerCode=request.getParameter( "code")>
6<#assign totalVehicles=propsUtil.get("bnp.similar.vehicles.number")!4>
7
8<#if serviceVehicule.getVehicles(groupId, totalVehicles?string, partnerVehicleId, partnerCode, end_point, request)??>
9 <#assign similarVehicles = serviceVehicule.getVehicles(groupId, totalVehicles?string, partnerVehicleId, partnerCode, end_point, request)>
10 <#if similarVehicles.getVehicles()??>
11 <div class="bnp-vehicle-cards-list">
12 <div class="container bnp-vehicle-cards-list__container">
13 <div class="bnp-vehicle-cards-list__header">
14 <h2 class="h2">${other_vehicles_title.getData()}</h2>
15 </div>
16 <div class="bnp-vehicle-cards-list__list">
17
18 <#assign vehicles = similarVehicles.getVehicles()>
19 <#list vehicles as vehicle>
20 <#assign picture = vehicle.getPicture()>
21
22 <div class="bnp-vehicle-cards-list__list-item">
23 <#if vehicle.getStateAid()?? && vehicle.getStateAid()?has_content && vehicle.getStateAid()?seq_contains(3)>
24 <div class="bnp-vehicle-card__3-loyers"></div>
25 </#if>
26 <div class="bnp-card bnp-vehicle-card with-shadow">
27 <#if vehicle.getDetailVehicleUrl()??>
28 <a href="${vehicle.getDetailVehicleUrl()}" class="bnp-vehicle-card__link">
29 <#else>
30 <a href="${linkDetailWording.getFriendlyUrl()}?partnerVehicleId=${vehicle.getPartnerVehicleId()}&code=${vehicle.getPartner().getCode()}" class="bnp-vehicle-card__link">
31 </#if>
32 <div class="bnp-vehicle-card__image">
33 <#if picture??>
34 <#if vehicle.getHasPicture()>
35 <img src="${propsUtil.get('bnp.ws.relay')}${picture}" alt=""/>
36 <#else>
37 <img src="${picture}" alt=""/>
38 </#if>
39 </#if>
40 </div>
41 </a>
42 <#assign productCode = "VAT">
43 <#assign theme = "bg-color-bnp-credit">
44 <#if vehicle.getVehicleRates()[0].getProduct().getWsCode() == "A" || vehicle.getVehicleRates()[0].getProduct().getWsCode() == "L" >
45 <#assign productCode = "LOA">
46 <#assign theme = "bg-color-bnp-projects">
47 </#if>
48 <div class="bnp-vehicle-card__tag">
49 <div class="bnp-tag ${theme}">${vehicle.getVehicleRates()[0].getProduct().getName()}</div>
50 </div>
51 <div class="bnp-vehicle-card__content">
52 <#if vehicle.getDetailVehicleUrl()??>
53 <a href="${vehicle.getDetailVehicleUrl()}" class="bnp-vehicle-card__link">
54 <#else>
55 <a href="${linkDetailWording.getFriendlyUrl()}?partnerVehicleId=${vehicle.getPartnerVehicleId()}&code=${vehicle.getPartner().getCode()}" class="bnp-vehicle-card__link">
56 </#if>
57 <div class="bnp-vehicle-card__link-name">${vehicle.getBrand()} ${vehicle.getModel()}</div>
58 <#assign labelNormalized = vehicle.getLabel()?lower_case?replace('é','e')?replace('è','e')?replace('ê','e')?replace('ë','e')?replace('ê','e')?replace('à','a')?replace('ä','a')?replace('î','i')?replace('ï','i')?replace('ö','o')?replace('ù','u')>
59 <#assign modelNormalized = vehicle.getModel()?lower_case?replace('é','e')?replace('è','e')?replace('ê','e')?replace('ë','e')?replace('ê','e')?replace('à','a')?replace('ä','a')?replace('î','i')?replace('ï','i')?replace('ö','o')?replace('ù','u')>
60 <#if labelNormalized?contains(modelNormalized)>
61 <#assign indexModelInLabel = labelNormalized?index_of(modelNormalized)>
62 <#assign newString = vehicle.getLabel()?substring(0, indexModelInLabel) + vehicle.getLabel()?substring(indexModelInLabel + vehicle.getModel()?length, vehicle.getLabel()?length)>
63 <div class="bnp-vehicle-card__link-model">${newString}</div>
64 <#else>
65 <div class="bnp-vehicle-card__link-model">${vehicle.getLabel()}</div>
66 </#if>
67 <ul class="bnp-vehicle-card__infos">
68 <li class="bnp-vehicle-card__infos-item">${vehicle.getEnergy()}</li>
69 <li class="bnp-vehicle-card__infos-item">${vehicle.getKilometer()} km</li>
70 <li class="bnp-vehicle-card__infos-item">${vehicle.getInServiceDate()[5..6]}/${vehicle.getInServiceDate()[0..3]}</li>
71 </ul>
72 <div class="bnp-vehicle-card__guarantee">Garantie 12 mois minimum</div>
73 <#assign amountFormated = vehicle.getAmount()?string(",###")?replace(",", " ")>
74 <div class="bnp-vehicle-card__prices">
75 <div class="bnp-vehicle-card__prices-new">Prix du véhicule :
76 <strong>${amountFormated} €</strong></div>
77 </div>
78 <div class="bnp-vehicle-card__rent">
79 <#if productCode == "LOA">
80 Loyer de <#else> Mensualité de
81 </#if>
82 <br/><span
83 class="size-18">${vehicle.getVehicleRates()[0].getMonthlyPayment()} € / mois</span>
84 </div>
85 </a>
86 <div class="bnp-vehicle-card__conditions">
87 <button type="button" class="bnp-vehicle-card__conditions-link" data-toggle="modal"
88 data-productcode="${productCode}" data-target="#modal__bnp"
89 data-amount="${vehicle.getAmount()}"
90 data-numberOfTerms="${vehicle.getVehicleRates()[0].getNumberOfTerms()}"
91 data-firstMonthlyPayment="${vehicle.getVehicleRates()[0].getFirstMonthlyPayment()}"
92 data-monthlyPayment="${vehicle.getVehicleRates()[0].getMonthlyPayment()}"
93 data-totalDueAmountWithOptionsAndVr="${vehicle.getVehicleRates()[0].getTotalDueAmountWithOptionsAndVr()}"
94 data-deposit="${vehicle.getVehicleRates()[0].getDeposit()}"
95 data-creditAmount="${vehicle.getVehicleRates()[0].getCreditAmount()}"
96 data-monthlyPaymentWithOptions="${vehicle.getVehicleRates()[0].getMonthlyPaymentWithOptions()}"
97 data-totalCreditCostWithOptions="${vehicle.getVehicleRates()[0].getTotalCreditCostWithOptions()}"
98 data-totalDueAmountWithOptions="${vehicle.getVehicleRates()[0].getTotalDueAmountWithOptions()}"
99 data-interest="${vehicle.getVehicleRates()[0].getInterest()}"
100 data-dossierFees="${vehicle.getVehicleRates()[0].getDossierFees()}"
101 data-taea="${vehicle.getVehicleRates()[0].getTaeg()}"
102 data-tnc="${vehicle.getVehicleRates()[0].getTnc()}"
103 >
104 *Conditions de l'offre
105 </button>
106 </div>
107 <#if vehicle.getStateAid()?? && vehicle.getStateAid()?has_content>
108 <div class="bnp-vehicle-card__prime-offres-fiche-vehicule"></div>
109 </#if>
110 <#if ctaLabel?? && ctaLabel.getData()??>
111 <#if vehicle.getDetailVehicleUrl()??>
112 <a type="button" href="${vehicle.getDetailVehicleUrl()}" class="bnp-vehicle-card__cta-link bnp-button secondary">${ctaLabel.getData()}</a>
113 <#else>
114 <a type="button" href="${linkDetailWording.getFriendlyUrl()}?partnerVehicleId=${vehicle.getPartnerVehicleId()}&code=${vehicle.getPartner().getCode()} class="bnp-vehicle-card__cta-link bnp-button secondary">${ctaLabel.getData()}</a>
115 </#if>
116 </#if>
117 </div>
118 </div>
119 </div>
120 </#list>
121 </div>
122
123 <div class="bnp-vehicle-cards-list__nav tns-nav">
124 <button data-nav="0" type="button" class="tns-nav-active"></button>
125 <button data-nav="1" type="button"></button>
126 <button data-nav="2" type="button"></button>
127 <button data-nav="3" type="button"></button>
128 </div>
129 </div>
130 </div>
131</#if>
132<#else>
133 <@liferay.language key="detail.infos.bloc.error" />
134</#if>
135<style>
136.bnp-vehicle-card__prime-offres-fiche-vehicule{
137 top : unset;
138 bottom : 68px;
139}
140</style>
Accueil
