1<!DOCTYPE html> 2<html lang="pl"> 3<head> 4 <meta charset="UTF-8"> 5 <meta name="viewport" content="width=device-width, initial-scale=1.0"> 6 <title> 7 Porsche Cayenne Black Edition - Porsche Inter Auto Polska </title> 8 <meta name="description" 9 content="Poznaj Porsche Cayenne Black Edition w Porsche Centrum PoznaÅ, Porsche Centrum Warszawa oraz Porsche Centrum Warszawa OkÄcie"> 10 <link rel="icon" 11 href="/cayenne-black-edition/favicon.ico" 12 type="image/x-icon"> 13 <link rel="stylesheet" 14 href="/cayenne-black-edition/fonts/styles.css"> 15 <link rel="stylesheet" 16 href="/cayenne-black-edition/css/glide.core.min.css"> 17 <link rel="stylesheet" 18 href="/cayenne-black-edition/css/style.css?v=5"> 19 <link rel="stylesheet" 20 href="/cayenne-black-edition/css/swiper-bundle.css"> 21 <link rel="stylesheet" 22 href="/cayenne-black-edition/css/swiper-custom.css"> 23 24
24<script src="/cayenne-black-edition/js/swiperInit.js"></script>
24 25
25<script src="/cayenne-black-edition/js/swiper-bundle.min.js"> </script>
25 26
26<script src="/cayenne-black-edition/js/vue3.5.13.js"> 27 </script>
27 28
28<script src="/cayenne-black-edition/js/gsap.js"> 29 </script>
29 30
30<script src="/cayenne-black-edition/js/axios.js"> 31 </script>
31 32
32<script src="/cayenne-black-edition/js/slider.js"> 33 </script>
33 34
34<script> window.settings ={"assets_url":"\/cayenne-black-edition\/","component_url":"components\/","pages_url":"pages\/","page":"index","webapi_url":"https:\/\/webapi.porscheinterauto.com.pl","page_url":"\/cayenne-black-edition\/","campaign_id":2218,"department_id":1,"title":"Porsche Cayenne Black Edition - Porsche Inter Auto Polska","description":"Poznaj Porsche Cayenne Black Edition w Porsche Centrum Pozna\u0144, Porsche Centrum Warszawa oraz Porsche Centrum Warszawa Ok\u0119cie"} </script>
34 35 <!-- Google Tag Manager --> 36
36<script>
vendor: 455 bytes, lines 36-46
36 37 (function (w, d, s, l, i) { 38 w[l] = w[l] || []; 39 w[l].push({ "gtm.start": new Date().getTime(), event: "gtm.js" }); 40 var f = d.getElementsByTagName(s)[0], 41 j = d.createElement(s), 42 dl = l != "dataLayer" ? "&l=" + l : ""; 43 j.async = true; 44 j.src = "https://www.googletagmanager.com/gtm.js?id=" + i + dl; 45 f.parentNode.insertBefore(j, f); 46 })(window, document, "script", "dataLayer", "
46GTM-T342NFGD
vendor: 8 bytes, lines 46-47
46"); 47
47</script>
47 48 <!-- End Google Tag Manager --> 49 50 <!-- OneTrust Cookie Consent Notice start for porsche-pia.pl --> 51
51<script type="text/javascript" src="https://phs.my.onetrust.eu/cdn/cookies/consent/019ecba4-322a-7714-9b38-00b42ce6b83f/OtAutoBlock.js"></script>
51 52 53
53<script src="https://phs.my.onetrust.eu/cdn/cookies/scripttemplates/otSDKStub.js" type="text/javascript" charset="UTF-8" data-domain-script="019ecba4-322a-7714-9b38-00b42ce6b83f"></script>
53 54 55
55<script type="text/javascript"> 56 function OptanonWrapper() { } 57 </script>
57 58 <!-- Koniec powiadomienia o zgód plików cookie OneTrust dla porsche-pia.pl --> 59 60</head> 61 62<body> 63 <!-- Google Tag Manager (noscript) -->
vendor: 87 bytes, lines 63-66
63 64 <noscript 65 ><iframe 66 src="https://www.googletagmanager.com/ns.html?id=
66GTM-T342NFGD
vendor: 126 bytes, lines 66-72
66" 67 height="0" 68 width="0" 69 style="display: none; visibility: hidden" 70 ></iframe 71 ></noscript> 72
72<!-- End Google Tag Manager (noscript) --> 73 <nav 74 class="c-logo-bar c-logo-bar--default"> 75 <div class="c-logo-bar__wrap"> 76 <div class="c-logo-bar__logo"> 77 <img src="/cayenne-black-edition/images/porsche-logo-new-white.png" /> 78 </div> 79 </div> 80</nav><section class="c-baner"> 81 <div class="c-baner__image"> 82 <img src="/cayenne-black-edition/images/baner_new.webp" alt="Nowe Cayenne Black Edition"> 83 </div> 84 <div class="c-baner__content"> 85 <h1>Nowe Porsche Cayenne Black Edition.</h1> 86 <p>Sprawdź w ofercie leasingu już od <strong>4499 zÅ netto/mies.</strong> <br> <span>Z ubezpieczeniem komunikacyjnym za 1%</span></p> 87 <a href="#offers"> 88 <div class="c-baner__content-btn">Sprawdź dostÄpne modele</div> 89 </a> 90 </div> 91</section><section class="c-photoText container"> 92 <div class="c-photoText__content"> 93 <h3>Poznaj finansowanie <br/> Porsche Cayenne Black Edition - leasing MRV z korzystnÄ ratÄ .</h3> 94 <div class="c-photoText__content-installment"> 95 Już od <span><strong>4499 zÅ</strong></span> netto/mies. </div> 96 <div class="c-photoText__content-info">Z ubezpieczeniem komunikacyjnym za 1%</div> 97 <div class="c-photoText__content-text"><strong>Parametry Leasingu:</strong> <br/> <ul><li>10% opÅaty wstÄpnej </li><li>okres finansowania - 36 miesiÄcy</li><li>limit przebiegu: 45 000 km</li></ul></div> 98 </div> 99 <div class="c-photoText__image"> 100 <img src="/cayenne-black-edition/images/IMG-2.webp" alt="Esencja elegancji Nowe Porsche Cayenne Black Edition"> 101 </div> 102</section><section id="offers" class="porsche-offers"> 103 <div class="porsche-offers__watermark" aria-hidden="true"> 104 <img src="/cayenne-black-edition/images/oferty-logo.svg" alt="Oferty" class="porsche-offers__watermark-img"> 105 </div> 106 107 <div class="container"> 108 109 <div v-if="isLoading" class="porsche-offers__loading"> 110 Trwa Åadowanie ofert Porsche... 111 </div> 112 113 <div v-else-if="offers.length" class="porsche-offers__grid"> 114 <article v-for="car in offers" :key="car.id" class="porsche-card-offer"> 115 116 <div class="porsche-card-offer__image-wrapper"> 117 <img v-if="car.photo" :src="car.photo" :alt="car.name || 'Porsche'" class="porsche-card-offer__image"> 118 119 <!-- <div v-if="car.price_list && car.price_list > car.price" class="porsche-card-offer__badge"> 120 Zyskujesz {{ formatNumber(car.price_list - car.price) }} zÅ 121 </div> --> 122 </div> 123 124 <div class="porsche-card-offer__body"> 125 <h3 class="porsche-card-offer__title"> 126 Porsche {{ car.name || car.model_name }} 127 </h3> 128 129 <h4 class="porsche-card-offer__subTitle"> 130 Lokalizacja: <br> 131 <span>{{ car.dealer_name }}</span> 132 </h4> 133 134 <div class="porsche-card-offer__specs"> 135 <span>{{ car.fuel }}</span> 136 <span v-if="car.transmission" class="porsche-card-offer__divider">|</span> 137 <span>{{ car.transmission }}</span> 138 <span class="porsche-card-offer__divider">|</span> 139 <span>{{ car.production_year }}</span> 140 <span class="porsche-card-offer__divider">|</span> 141 <span>{{ formatNumber(car.mileage || 0) }} km</span> 142 </div> 143 144 <div class="porsche-card-offer__prices"> 145 146 <div class="porsche-card-offer__price-box"> 147 <span class="porsche-card-offer__price-label">Cena:</span> 148 <span class="porsche-card-offer__price-val porsche-card-offer__price-val--regular"> 149 <strong>{{ formatNumber(car.price) }}</strong> PLN 150 </span> 151 <span class="porsche-card-offer__vat">brutto</span> 152 </div> 153 154 <!-- <div class="porsche-card-offer__price-box">
155 <span class="porsche-card-offer__price-label">Cena{{ car.price < car.price_list ? ' katalogowa' : '' }}:</span> 156 <span class="porsche-card-offer__price-val porsche-card-offer__price-val--regular"> 157 <strong>{{ formatNumber(car.price < car.price_list ? car.price_list : car.price) }}</strong> PLN 158 </span> 159 <span class="porsche-card-offer__vat">brutto</span> 160 </div> 161 162 <div v-if="car.price < car.price_list" class="porsche-card-offer__price-box"> 163 <span class="porsche-card-offer__price-label">Cena ofertowa:</span> 164 <span class="porsche-card-offer__price-val porsche-card-offer__price-val--offer"> 165 <strong>{{ formatNumber(car.price) }}</strong> PLN 166 </span> 167 <span class="porsche-card-offer__vat porsche-card-offer__vat--red">brutto</span> 168 </div> --> 169 </div> 170 171 <div class="porsche-card-offer__actions"> 172 <a 173 href="#formApp" 174 class="porsche-card-offer__btn porsche-card-offer__btn--primary" 175 @click="selectCarModel(car.dealer_id, car.id, 'offer')"> 176 Zapytaj o ofertÄ 177 </a> 178 <a 179 href="#formApp" 180 class="porsche-card-offer__btn porsche-card-offer__btn--secondary" 181 @click="selectCarModel(car.dealer_id, car.id, 'reservation')"> 182 PoproÅ o rezerwacjÄ 183 </a> 184 </div> 185 </div> 186 187 </article> 188 </div> 189 190 <div v-else class="porsche-offers__empty"> 191 Aktualnie brak dostÄpnych ofert dla tego modelu. 192 </div> 193 194 <div class="porsche-offers__showMore porsche-card-offer__btn porsche-card-offer__btn--secondary" v-if="showMore" @click="loadMore()"> 195 Pokaż wiÄcej 196 </div> 197 198 </div> 199</section>
200<script> 201 const { 202 createApp, 203 ref, 204 computed, 205 onMounted 206 } = Vue 207 208 createApp({ 209 setup() { 210 const limitDefault = 9; 211 const limit = ref(9); 212 213 const formRef = ref(null); 214 const offers = ref([]); 215 const isLoading = ref(false); 216 217 const offersCount = ref(0); 218 219 const showMore = ref(false); 220 221 // Lista ID samochodów do usuniecia 222 const EXCLUDED_CAR_IDS = [ 223 260228, 260231, 260234, 268901, // Taycan 224 268906, 268907, 268909, 268910 // Macan Electric 225 ]; 226 227 const getOffers = async () => { 228 if(!showMore.value) { isLoading.value = true; } 229 try { 230 const apiUrl = `https://webapi.porscheinterauto.com.pl/cars?type_id=3&page=1&category_id=0&model_ids[]=1282&fuel_ids[]=2001&fuel_ids[]=2002&fuel_ids[]=2003&fuel_ids[]=2004&fuel_ids[]=2005&fuel_ids[]=2007&fuel_ids[]=2008&fuel_ids[]=2009&fuel_ids[]=2010&fuel_ids[]=2011&fuel_ids[]=2012&fuel_ids[]=2013&fuel_ids[]=2014&order=5&limit=${limit.value}&dealer_ids[]=10&dealer_ids[]=11&dealer_ids[]=28&dealer_ids[]=44&brand_ids[]=87&has_price_lowest=0`; 231 232 const response = await axios.get(apiUrl); 233 const fetchedOffers = response.data?.cars || response.data?.items || []; 234 235 // Filtrowanie pobranych ofert z pominiÄciem wykluczonych ID 236 offers.value = fetchedOffers.filter(car => !EXCLUDED_CAR_IDS.includes(car.id)); 237 238 offersCount.value = response.data?.count 239 if(offersCount.value > limit.value && offers.value.length == limit.value) { 240 showMore.value = true 241 } else { 242 showMore.value = false 243 } 244 } catch (error) { 245 console.error("BÅÄ d podczas pobierania ofert Porsche:", error); 246 offers.value = []; 247 } finally { 248 isLoading.value = false; 249 } 250 }; 251
252 const loadMore = () => { 253 limit.value += limitDefault; 254 getOffers(); 255 }; 256 257 const formatNumber = (num) => { 258 if (!num) return "0"; 259 return num.toString().replace(/\B(?=(\d{3})+(?!\d))/g, " "); 260 }; 261 262 onMounted(() => { 263 getOffers(); 264 }); 265 266 const trackMeta = () => { 267 // if (typeof fbq === 'function') { 268 // fbq('track', 'pia_porsche_polczynska_outgoing_click'); 269 // } 270 }; 271 272 const selectCarModel = (dealer_id, id, type) => { 273 const event = new CustomEvent('car-model-selected', { 274 detail: { 275 dealer_id, 276 id, 277 type 278 } 279 }); 280 window.dispatchEvent(event); 281 }; 282 283 const offersRef = ref(null); 284 const versionsRef = ref(null); 285 286 return { 287 selectCarModel, 288 formRef, 289 offers, 290 formatNumber, 291 offersRef, 292 versionsRef, 293 trackMeta, 294 isLoading, 295 showMore, 296 loadMore 297 }; 298 } 299 }).mount('#offers') 300</script>
300<section class="c-header__bg" style="background-image: url('/cayenne-black-edition/images/CY26J5ZID0007_low.webp')"> 301 <div class="c-header container"> 302 <div class="c-header__content"> 303 <div class="c-header__content-container"> 304 <h3>CzerÅ, która definiuje charakter.</h3> 305 <p>Nowe Porsche Cayenne Black Edition to harmonijne poÅÄ czenie siÅy i elegancji. WyjÄ tkowy design wyróżniajÄ cy siÄ gÅÄbokim, metalicznym wykoÅczeniem czerni, akcentami w kolorze High-Gloss Black i 21-calowymi felgami Cayenne Exclusive Design tworzy sylwetkÄ, której nie sposób pomyliÄ z żadnÄ innÄ .</p> 306 </div> 307 <div class="c-header__content-image"> 308 <img src="/cayenne-black-edition/images/Black_Edition_Schriftzug_final.webp" alt="Black Edition"> 309 </div> 310 </div> 311 </div> 312</section><section class="c-fullImage"> 313 <img src="/cayenne-black-edition/images/CAR-INFO.webp" alt="Informacje o nowym Cayenne Black Edition"> 314</section><section class="priceList container" id="pricelist"> 315 <div class="priceList__content" :class="{'active' : toggleList}"> 316 <div class="priceList__content-container"> 317 <table> 318 <thead> 319 <tr> 320 <th>Opcja</th> 321 <th>Cena</th> 322 <th>Take-rate</th> 323 </tr> 324 </thead> 325 <tbody> 326 <tr> 327 <td>Przedni zderzak SportDesign / Pakiet SportDesign dla S PHEV</td> 328 <td>15 994 / 26 491 zÅ</td> 329 <td>65,5%</td> 330 </tr> 331 <tr> 332 <td>WnÄtrze wykoÅczone gÅadkÄ skórÄ w kolorze czarnym</td> 333 <td>17 105 zÅ</td> 334 <td>89,9%</td> 335 </tr> 336 <tr> 337 <td>Przyciemnione reflektory LED Matrix HD</td> 338 <td>14 141 zÅ</td> 339 <td>70,8%</td> 340 </tr> 341 <tr> 342 <td>21-calowe obrÄcze Spyder RS Design</td> 343 <td>12 690 zÅ</td> 344 <td>96,4%</td> 345 </tr> 346 <tr> 347 <td>Adaptacyjne zawieszenie pneumatyczne z systemem poziomowania i regulacjÄ przeÅwitu oraz PASM (dla Base oraz Base PHEV)</td> 348 <td>11 732 zÅ</td> 349 <td>96,3%</td> 350 </tr> 351 <tr> 352 <td>Dach panoramiczny (dla SUV)</td> 353 <td>10 065 zÅ</td> 354 <td>77,2%</td> 355 </tr> 356 <tr> 357 <td>NagÅoÅnienie BOSE® Surround Sound System</td> 358 <td>7 287 zÅ</td> 359 <td>93,2%</td> 360 </tr> 361 <tr> 362 <td>Adaptacyjny tempomat</td> 363 <td>7 287 zÅ</td> 364 <td>84,0%</td> 365 </tr> 366 <tr> 367 <td>Fotele komfortowe z przodu 14-kierunkowa</td> 368 <td>6 452 zÅ</td> 369 <td>93,5%</td> 370 </tr> 371 <tr> 372 <td>Sportowe koÅcówki ukÅadu wydechowego w kolorze Dark Bronze</td> 373 <td>4 260 zÅ</td> 374 <td>66,8%</td> 375 </tr> 376 <tr> 377 <td>Asystent zmiany pasa ruchu</td> 378 <td>4 260 zÅ</td> 379 <td>94,9%</td> 380 </tr> 381 <tr> 382 <td>NakÅadki progów drzwi wykoÅczone szczotkowanym aluminium w kolorze czarnym, podÅwietlane</td> 383 <td>3 088 zÅ</td> 384 <td>15,1%</td> 385 </tr> 386 <tr> 387 <td>Kierownica sportowa GT, podgrzewana</td> 388 <td>2 809 zÅ</td> 389 <td>79,2%</td> 390 </tr> 391 <tr> 392 <td>Lusterka zewnÄtrzne lakierowane na kolor czarny</td> 393 <td>2 778 zÅ</td> 394 <td>30,2%</td> 395 </tr> 396 <tr> 397 <td>Pakiet wykoÅczenia wnÄtrza gÅÄboko szczotkowanym aluminium</td> 398 <td>2 778 zÅ</td> 399 <td>17,4%</td> 400 </tr> 401 <tr> 402 <td>Napis âPORSCHEâ i oznaczenie modelu lakierowane na kolor czarny (wysoki poÅysk)</td> 403 <td>2 717 zÅ</td> 404 <td>42,6%</td> 405 </tr> 406 <tr> 407 <td>Przyciemnione szyby z tyÅu</td> 408 <td>2 594 zÅ</td> 409 <td>87,5%</td> 410 </tr> 411 <tr> 412 <td>LED-owe projektory napisu âPORSCHEâ umieszczone w drzwiach</td> 413 <td>1 853 zÅ</td> 414 <td>30,7%</td> 415 </tr> 416 <tr> 417 <td>Herb Porsche na zagÅówkach foteli z przodu</td> 418 <td>1 543 zÅ</td> 419 <td>72,0%</td> 420 </tr> 421 <tr> 422 <td>Korek wlewu paliwa Exclusive Design</td> 423 <td>915 zÅ</td> 424 <td>5,1%</td> 425 </tr> 426 <tr> 427 <td>Zbiornik paliwa o pojemnoÅci 90 l (dla Base)</td> 428 <td>618 zÅ</td> 429 <td>88,9%</td> 430 </tr> 431 </tbody> 432 <thead> 433 <tr> 434 <th>Suma</th> 435 <th>134 766 zÅ</th> 436 <th></th> 437 </tr> 438 </thead> 439 </table> 440 </div> 441 </div> 442 <div class="priceList__btn" @click="toggleList = !toggleList"> 443 <div class="priceList__btn-txt"> 444 <div>
445 <span v-if="!toggleList">Zobacz wszystkie opcje</span> 446 <span v-else>ZwiÅ listÄ wyposażenia</span> 447 </div> 448 <div class="icon" :class="{'rotate' : !toggleList}"> 449 <img src="/cayenne-black-edition/images/arrow-head-up.png" alt=""> 450 </div> 451 </div> 452 </div> 453</section> 454
455<script> 456 const { 457 createApp: listCreateApp, 458 ref: listRef 459 } = Vue 460 461 listCreateApp({ 462 setup() { 463 const toggleList = listRef(false); 464 465 return { 466 toggleList 467 } 468 } 469 }).mount('#pricelist') 470</script>
470<section class="c-image container"> 471 <img src="/cayenne-black-edition/images/IMG-1-new.webp" alt="Nowe Cayenne Black Edition"> 472</section><section class="c-intro container"> 473 <div class="c-intro__box"> 474 <div class="c-intro__box-image"> 475 <img src="/cayenne-black-edition/images/box.webp" alt="Nowe Cayenne Black Edition to wyraz siÅy"> 476 </div> 477 <div class="c-intro__box-content"> 478 <h2>Tam, gdzie prostota spotyka fascynacjÄ, a ekskluzywnoÅÄ ÅÄ czy siÄ z pasjÄ .</h2> 479 <p>Nowe Cayenne Black Edition to wyraz siÅy, stylu i ponadczasowej elegancji â teraz dostÄpne w atrakcyjnym finansowaniu Volkswagen Financial Serivces.</p> 480 </div> 481 </div> 482 <div class="c-intro__buttons"> 483 <div> 484 <h3>JesteÅ zainteresowany naszÄ ofertÄ ?</h3> 485 <p>Poznaj szczegóÅy wyjÄ tkowej oferty na Cayenne Black Edition. WypeÅnij krótki formularz, a nasz doradca przedstawi Ci peÅnÄ propozycjÄ finansowania. To pierwszy krok do Åwiata Porsche.</p> 486 </div> 487 <a href="#form" target="_self"> 488 <div class="c-intro__buttons-btn"> 489 WypeÅnij formularz </div> 490 </a> 491 </div> 492</section><section class="c-desc container space" style="opacity: 0.8;"> 493 Leasing Volkswagen Financial Services Polska Sp. z o.o. dla przedsiÄbiorców na nowe samochody Porsche. Podana rata ma charakter orientacyjny przy zaÅożeniu: okres leasingu: 36 miesiÄcy, opÅata wstÄpna: 10%, przebieg: 15 tys. km/rok, wartoÅÄ koÅcowa okreÅlona w umowie. Dane o zużyciu paliwa i emisji CO2 sprawdź na stronie <a href="https://www.porsche.com/poland/legal/wltp/" target="_blank">www.porsche.pl/porsche-wltp/</a>. Ubezpieczenie oferuje Volkswagen Serwis Ubezpieczeniowy Sp. z o.o. jako agent ubezpieczeniowy. MateriaÅ nie stanowi oferty w rozumieniu Kodeksu cywilnego.</section><section id="formApp">
494 <div class="c-form-bg" id="form"> 495 <div class="container"> 496 <div class="c-form" v-if="!send"> 497 <div class="c-form__header"> 498 <h2>Odkryj radoÅÄ wyboru <br/> i poznaj model Porsche Cayenne.</h2> 499 <p>WypeÅnij formularz, a skontaktuje siÄ z TobÄ doradca Porsche, by przedstawiÄ szczegóÅy oferty.</p> 500 </div> 501 <div class="c-form__content"> 502 <div class="c-form__content-elem"> 503 <!-- <label for="first_name">ImiÄ <sup>*</sup></label> --> 504 <input 505 type="text" 506 id="first_name" 507 name="first_name" 508 :class="['c-form__input', {'c-form__input--error': formErrors.first_name}]" 509 v-model="form.first_name" 510 placeholder="ImiÄ" 511 @input="validateForm"> 512 <span v-if="formErrors.first_name" class="c-form__error-message">{{ formErrors.first_name }}</span> 513 </div> 514 <div class="c-form__content-elem"> 515 <!-- <label for="last_name">Nazwisko <sup>*</sup></label> --> 516 <input 517 type="text" 518 id="last_name" 519 name="last_name" 520 :class="['c-form__input', {'c-form__input--error': formErrors.last_name}]" 521 v-model="form.last_name" 522 placeholder="Nazwisko" 523 @input="validateForm"> 524 <span v-if="formErrors.last_name" class="c-form__error-message">{{ formErrors.last_name }}</span> 525 </div> 526 <div class="c-form__content-elem"> 527 <!-- <label for="email">E-mail <sup>*</sup></label> --> 528 <input 529 type="text" 530 id="email" 531 name="email" 532 :class="['c-form__input', {'c-form__input--error': formErrors.email}]" 533 v-model="form.email" 534 placeholder="E-mail" 535 @input="validateForm"> 536 <span v-if="formErrors.email" class="c-form__error-message">{{ formErrors.email }}</span> 537 </div> 538 <div class="c-form__content-elem"> 539 <!-- <label for="phone_number">Numer telefonu <sup>*</sup></label> --> 540 <input 541 type="text" 542 id="phone_number" 543 name="phone_number" 544 :class="['c-form__input', {'c-form__input--error': formErrors.phone_number}]" 545 v-model="form.phone_number" 546 placeholder="Numer telefonu" 547 @input="validateForm"> 548 <span v-if="formErrors.phone_number" class="c-form__error-message">{{ formErrors.phone_number }}</span> 549 </div> 550 <div class="c-form__content-elem full"> 551 <!-- <label for="dealer_id">Wybierz swojego dealera Porsche <sup>*</sup></label> --> 552 <select 553 id="dealer_id" 554 name="dealer_id" 555 :class="['c-form__input', {'c-form__input--error': formErrors.dealer_id}]" 556 v-model="form.dealer_id" 557 @change="checkDealer($event)"> 558 <option value="" disabled default> Wybierz swojego dealera Porsche</option> 559 <option value="10" data-name="Porsche Centrum PoznaÅ">Porsche Centrum PoznaÅ</option> 560 <option value="11" data-name="Porsche Centrum Warszawa">Porsche Centrum Warszawa</option> 561 <option value="28" data-name="Porsche Centrum Warszawa OkÄcie">Porsche Centrum Warszawa OkÄcie</option> 562 <option value="44" data-name="Porsche Centrum Warszawa Wawer">Porsche Centrum Warszawa Wawer</option> 563 <option value="28" data-name="Porsche Store Warszawa">Porsche Store Warszawa</option> 564 </select> 565 <span v-if="formErrors.dealer_id" class="c-form__error-message">{{ formErrors.dealer_id }}</span> 566 </div> 567 <div class="c-form__content-elem full"> 568 <textarea id="description" name="description" placeholder="Dodatkowa wiadomoÅÄ" v-model="form.description"></textarea> 569 </div> 570 </div> 571 <div class="c-form__accepts"> 572 <div class="c-form__accepts-elem"> 573 Administratorem PaÅstwa danych osobowych jest spóÅka Porsche Inter Auto 574 Polska Sp. z o.o. z siedzibÄ w Warszawie (02-178) ul. Sekundowa 1, zarejestrowana w rejestrze 575 przedsiÄbiorców prowadzonym przez SÄ d Rejonowy dla m.st. Warszawy, XIV WydziaÅ Gospodarczy Krajowego 576 Rejestru SÄ dowego pod numerem KRS 0000108213.
577 <!-- <span v-show="isConsentVisible"> --> 578 MogÄ siÄ PaÅstwo z nami 579 skontaktowaÄ przy pomocy numeru telefonu +48 22 223 15 15 oraz adresu e-mail: 580 [email protected]. Informujemy, że podane przez PaÅstwa dane bÄdziemy przetwarzaÄ w celu 581 obsÅugi PaÅstwa zapytania, w tym w celu kontaktu z PaÅstwem w tym zakresie. BÄdziemy przetwarzaÄ 582 PaÅstwa dane osobowe także w innych celach, jeÅli wyraÅ¼Ä na to PaÅstwo odrÄbnÄ zgodÄ. Podanie 583 przez 584 PaÅstwa danych osobowych jest dobrowolne. PrzysÅuguje PaÅstwu prawo do Å¼Ä dania od nas dostÄpu do 585 swoich danych osobowych, prawo do ich sprostowania, usuniÄcia, ograniczenia przetwarzania, prawo 586 do 587 przenoszenia danych a także prawo do sprzeciwu wobec przetwarzania przez nas PaÅstwa danych 588 osobowych. WiÄcej na ten temat przeczytajÄ PaÅstwo w naszej Polityce PrywatnoÅci 589 (http://www.porscheinterauto.pl/rodo). 590 <!-- </span> --> 591 <!-- <span class="c-form__expand-btn" @click="toggleConsentVisibility">{{isConsentVisible ? 'ZwiÅ' : 'RozwiÅ' }}</span> --> 592 </div> 593 <div class="c-form__accepts-elem"> 594 <div class="c-form__accepts-accept"> 595 <input id="terms" type="checkbox" name="terms" v-model="form.terms" @change="validateForm" /> 596 <label for="terms" class="c-form__checkbox"> 597 Potwierdzam zapoznanie siÄ z klauzulÄ informacyjnÄ i 598 zasadami przetwarzania moich danych osobowych 599 </label> 600 </div> 601 <div class="c-form__error-message-wrapper c-form__error-message-wrapper--checkbox"> 602 <span v-if="formErrors.terms" class="c-form__error-message">{{ formErrors.terms }}</span> 603 </div> 604 </div> 605 <div class="c-form__accepts-elem"> 606 ZGODA MARKETINGOWA 607 <br /><br /> 608 Aby móc przetwarzaÄ PaÅstwa dane w celu przesyÅania PaÅstwu informacji dotyczÄ cych promocji, akcji 609 marketingowych, organizowanych wydarzeÅ w zwiÄ zku z naszÄ dziaÅalnoÅciÄ oraz oferowanych przez nas 610 produktów i usÅug za poÅrednictwem wskazanych poniżej kanaÅów komunikacji, prosimy PaÅstwa o 611 wskazanie 612 preferowanych form komunikacji z PaÅstwem poprzez wyrażenie poniżej wskazanych zgód. 613 <!-- <span v-show="isAgreementVisible"> --> 614 W każdej chwili mogÄ PaÅstwo cofnÄ Ä zgodÄ na kontakt marketingowy. 615 <br /><br /> 616 *Wyrażam zgodÄ na przekazanie mi informacji handlowej i wykorzystanie wskazanych przeze mnie 617 danych 618 do celów marketingu bezpoÅredniego w rozumieniu art. 172 ust. 1 ustawy Prawo telekomunikacyjne. 619 Moja 620 zgoda dotyczy kontaktowania siÄ ze mnÄ za poÅrednictwem: 621 <!-- </span> 622 <span class="c-form__expand-btn" 623 @click="toggleAgreementVisibility">{{ isAgreementVisible ? 'ZwiÅ' : 'RozwiÅ' }}</span> --> 624 </div> 625 <div class="c-form__accepts-elem c-form__accepts-elem--flex"> 626 <div> 627 <div class="c-form__accepts-accept"> 628 <input id="accept-email9" type="checkbox" name="accept-email9" v-model="form.acceptemail9" @change="validateForm" /> 629 <label for="accept-email9" class="c-form__checkbox"> 630 Email 631 </label> 632 </div> 633 <div class="c-form__error-message-wrapper c-form__error-message-wrapper--checkbox">
634 <span v-if="formErrors.acceptemail9" class="c-form__error-message">{{ formErrors.acceptemail9 }}</span> 635 </div> 636 </div> 637 <div> 638 <div class="c-form__accepts-accept"> 639 <input id="acceptphone9" type="checkbox" name="acceptphone9" v-model="form.acceptphone9" @change="validateForm" /> 640 <label for="acceptphone9" class="c-form__checkbox"> 641 Telefon 642 </label> 643 </div> 644 <div class="c-form__error-message-wrapper c-form__error-message-wrapper--checkbox"> 645 <span v-if="formErrors.acceptphone9" class="c-form__error-message">{{ formErrors.acceptphone9 }}</span> 646 </div> 647 </div> 648 </div> 649 <div class="c-form__desc"> 650 * Udzielenie zgody marketingowej jest nieobowiÄ zkowe. 651 </div> 652 </div> 653 <div class="c-form__button" :disabled="sending" v-if="!sending" @click="onSubmit()"> 654 WyÅlij 655 </div> 656 657 </div> 658 659 <div v-if="isFormPopupVisible" class="c-form__popup-overlay"> 660 <div ref="formPopupRef" class="c-form__popup"> 661 <span @click="closePopup" class="c-form__popup-close" tabindex="0" role="button" 662 title="Zamknij">✖</span> 663 <div v-html="formMessage"></div> 664 </div> 665 </div> 666 </div> 667</div> 668 669</section>
670<script> 671document.addEventListener('DOMContentLoaded', function() { 672 function initForm() { 673 const { 674 createApp, 675 ref, 676 computed, 677 onMounted 678 } = Vue 679 680 createApp({ 681 setup() { 682 const lmsUrl = "https://lms-api.activemotors.pl/send/"; 683 const formMessage = ref(""); 684 const isFormPopupVisible = ref(false); 685 const isConsentVisible = ref(false); 686 const isAgreementVisible = ref(false); 687 const send = ref(false); 688 const sending = ref(false); 689 const toggleConsentVisibility = () => 690 (isConsentVisible.value = !isConsentVisible.value); 691 const toggleAgreementVisibility = () => 692 (isAgreementVisible.value = !isAgreementVisible.value); 693 694 const offerId = ref(""); 695 696 const form = ref({ 697 dealer_id: "", 698 first_name: "", 699 last_name: "", 700 phone_number: "", 701 email: "", 702 terms: false, 703 description: "" 704 }); 705 706 const formErrors = ref({ 707 dealer_id: "", 708 first_name: "", 709 last_name: "", 710 phone_number: "", 711 email: "", 712 terms: "" 713 }); 714 715 const accepts = ref({ 716 acceptemail9: false, 717 acceptphone9: false 718 }) 719 720 const validateForm = () => { 721 let valid = true; 722 formErrors.value = { 723 dealer_id: "", 724 first_name: "", 725 last_name: "", 726 phone_number: "", 727 email: "", 728 terms: "", 729 }; 730 731 if (!form.value.dealer_id) { 732 formErrors.value.dealer_id = "ProszÄ wybraÄ swojego dealera Porsche"; 733 valid = false; 734 } 735 736 if (!form.value.first_name) { 737 formErrors.value.first_name = "ImiÄ jest wymagane."; 738 valid = false; 739 } 740 741 if (!form.value.last_name) { 742 formErrors.value.last_name = "Nazwisko jest wymagane."; 743 valid = false; 744 } 745 746 if (!form.value.phone_number) { 747 formErrors.value.phone_number = "Numer telefonu jest wymagany."; 748 valid = false; 749 } else if (!/^\+?[0-9]{9,15}$/.test(form.value.phone_number)) { 750 formErrors.value.phone_number = "Numer telefonu jest nieprawidÅowy."; 751 valid = false; 752 } 753 754 if (!form.value.email) { 755 formErrors.value.email = "Email jest wymagany."; 756 valid = false; 757 } else if (!/\S+@\S+\.\S+/.test(form.value.email)) { 758 formErrors.value.email = "Email jest nieprawidÅowy."; 759 valid = false; 760 } 761 762 if (!form.value.terms) { 763 formErrors.value.terms = "Musisz zaakceptowaÄ warunki."; 764 valid = false; 765 } 766 767 return valid; 768 }; 769 770 onMounted(() => { 771 window.addEventListener('car-model-selected', (event) => { 772 if(event.detail.dealer_id) { form.value.dealer_id = event.detail.dealer_id } 773 form.value.description = `${event.detail.type == 'offer' ? 'Zapytanie o ofertÄ' : 'ProÅba o rezerwacjÄ'}: Porsche Cayenne (ID: ${event.detail.id})`; 774 }); 775 }); 776 777 const closePopup = () => { 778 gsap.to(".c-form__popup", { 779 opacity: 0, 780 y: -200, 781 duration: 0.2, 782 onComplete: () => (isFormPopupVisible.value = false), 783 }); 784 }; 785 786 const checkDealer = (event) => { 787 const selectedOption = event.target.options[event.target.selectedIndex]; 788 const name = selectedOption.dataset.name; 789 790 if(name == "Porsche Store Warszawa") { 791 form.value.description = "Wybrany salon Porsche Store Warszawa"; 792 }else{ 793 form.value.description = ""; 794 } 795 }; 796 797 const onSubmit = async (values) => { 798 window.dataLayer.push({'event': 'KlikniÄcie w guzik wyÅlij formularz'}); 799 800 if (!validateForm()) { 801 return 802 } 803 804 if (offerId.value) { 805 form.value.description += "| Jestem zainteresowany ofertÄ o id: " + offerId.value; 806 } 807 808 sending.value = true; 809 810 const formData = { 811 ...form.value, 812 'accept-email9': accepts.value.acceptemail9, 813 'accept-phone9': accepts.value.acceptphone9, 814 department_id: window.settings.department_id, 815 origin_id: 11, 816 ip: "85.221.212.38", 817 url: window.location.href, 818 campaign_id: window.settings.campaign_id, 819 }; 820 821 const form_data = new FormData(); 822 823 for (const key in formData) { 824 if (formData[key]) { 825 form_data.append(key, formData[key]); 826 } 827 } 828 829 try { 830 const { 831 data: { 832 msg 833 }, 834 } = await axios.post(lmsUrl, form_data); 835 window.dataLayer.push({'event': 'WysÅanie formularza'}); 836 // formMessage.value = msg; 837 send.value = true; 838 // isFormPopupVisible.value = true; 839 840 window.location.href = '/thank-you'; 841 } catch (error) { 842 console.log(error); 843 } 844 }; 845 846 return { 847 send, 848 sending, 849 isConsentVisible, 850 isAgreementVisible, 851 toggleAgreementVisibility, 852 toggleConsentVisibility, 853 isFormPopupVisible, 854 closePopup,
855 formMessage, 856 onSubmit, 857 form, 858 accepts, 859 formErrors, 860 validateForm, 861 offerId, 862 checkDealer 863 } 864 } 865 }).mount('#formApp') 866 } 867 initForm(); 868}); 869</script>
869<footer class="c-footer"> 870 <div class="c-footer__wrapper"> 871 <p class="c-footer__main"> 872 Porsche Centrum PoznaÅ 873 </p> 874 <br> 875 <p>ul. Warszawska 67, 61-028 PoznaÅ</p> 876 <br> 877 <a href="tel:61 84 911 52">Telefon: 61 84 911 52</a> 878 <br> 879 <a href="tel:61 84 911 52"><button>ZadzwoÅ i zapytaj o ofertÄ</button></a> 880 </div> 881 <div class="c-footer__wrapper"> 882 <p class="c-footer__main">Porsche Centrum Warszawa</p> 883 <br> 884 <p>ul. PoÅczyÅska 125, 01-303 Warszawa</p> 885 <br> 886 <a href="tel:22 22 316 66">Telefon: 22 22 316 66</a> 887 <br> 888 <a href="tel:22 22 316 66"><button>ZadzwoÅ i zapytaj o ofertÄ</button></a> 889 </div> 890 <div class="c-footer__wrapper"> 891 <p class="c-footer__main">Porsche Centrum Warszawa OkÄcie</p> 892 <br> 893 <p>ul. Sekundowa 1A, 02-178 Warszawa</p> 894 <br> 895 <a href="tel:22 22 316 65">Telefon: 22 22 316 65</a> 896 <br> 897 <a href="tel:22 22 316 65"><button>ZadzwoÅ i zapytaj o ofertÄ</button></a> 898 </div> 899 <div class="c-footer__wrapper"> 900 <p class="c-footer__main">Porsche Centrum Warszawa Wawer</p> 901 <br> 902 <p>ul. WaÅ MiedzeszyÅski 245, 04-866 Warszawa</p> 903 <br> 904 <a href="tel:22 24 51 911">Telefon: 22 24 51 911</a> 905 <br> 906 <a href="tel:22 24 51 911"><button>ZadzwoÅ i zapytaj o ofertÄ</button></a> 907 </div> 908 <div class="c-footer__wrapper"> 909 <p class="c-footer__main">Porsche Store Warszawa</p> 910 <br> 911 <p>ul. LeszczyÅska 1a, 00-312 Warszawa</p> 912 <br> 913 <a href="tel:22 49 02 911">Telefon: 22 49 02 911</a> 914 <br> 915 <a href="tel:22 49 02 911"><button>ZadzwoÅ i zapytaj o ofertÄ</button></a> 916 </div> 917</footer></body> 918 919</html>
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.