Update contact page

This commit is contained in:
2026-01-22 09:37:07 +01:00
parent 11ee273b15
commit b5c2cfca18
4 changed files with 373 additions and 152 deletions

View File

@@ -86,6 +86,14 @@
'products' => '/upload/filemanager/icon/available-products-1.svg',
'contact' => '<a href="tel:+48 17 859 56 71">+48 17 859 56 71</a><br/>
<a href="mailto:zapytania@vidok.com">zapytania@vidok.com</a>',
],
'contact' => [
'phone' => [
'+48 17 859 56 71',
],
'email' => [
'zapytania@vidok.com'
]
]
],
[
@@ -108,6 +116,18 @@
<a href="mailto:l.paczkowska@vidok.com">l.paczkowska@vidok.com</a><br/>
<a href="mailto:r.obrocki@vidok.com">r.obrocki@vidok.com</a><br/>
<a href="mailto:s.szela@vidok.com">s.szela@vidok.com</a>',
],
'contact' => [
'phone' => [
'+48 17 853 93 62',
'+48 17 853 94 32',
'+48 735 209 241',
],
'email' => [
'l.paczkowska@vidok.com',
'r.obrocki@vidok.com',
's.szela@vidok.com'
]
]
],
[
@@ -126,6 +146,14 @@
'products' => '/upload/filemanager/icon/available-products-1.svg',
'contact' => '<a href="tel:+48 15 822 98 94">+48 15 822 98 94</a><br/>
<a href="mailto:tarnobrzeg@vidok.com">tarnobrzeg@vidok.com</a>',
],
'contact' => [
'phone' => [
'+48 15 822 98 94',
],
'email' => [
'tarnobrzeg@vidok.com'
]
]
],
[
@@ -144,6 +172,14 @@
'products' => '/upload/filemanager/icon/available-products-1.svg',
'contact' => '<a href="tel:+48 17 225 26 45,">+48 17 225 26 45,</a><br/>
<a href="mailto:lancut@vidok.com">lancut@vidok.com</a>',
],
'contact' => [
'phone' => [
'+48 17 225 26 45,'
],
'email' => [
'lancut@vidok.com'
]
]
],
[
@@ -163,6 +199,15 @@
'contact' => '<a href="tel:+48 882 035 893,">+48 882 035 893,</a><br/>
<a href="tel:+48 13 464 03 38,">+48 13 464 03 38,</a><br/>
<a href="mailto:sanok@vidok.com">sanok@vidok.com</a>',
],
'contact' => [
'phone' => [
'+48 882 035 893,',
'+48 13 464 03 38,'
],
'email' => [
'sanok@vidok.com'
]
]
],
[
@@ -181,6 +226,14 @@
'products' => '/upload/filemanager/icon/available-products-1.svg',
'contact' => '<a href="tel:+48 16 676 02 27,">+48 16 676 02 27,</a><br/>
<a href="mailto:przemysl@vidok.com">przemysl@vidok.com</a>',
],
'contact' => [
'phone' => [
'+48 16 676 02 27,'
],
'email' => [
'przemysl@vidok.com'
]
]
],
@@ -201,6 +254,15 @@
'contact' => '<a href="tel:+48 784 919 155">+48 784 919 155</a><br/>
<a href="tel:12 415 95 49">12 415 95 49</a><br/>
<a href="mailto:krakow@vidok.com">krakow@vidok.com</a>',
],
'contact' => [
'phone' => [
'+48 784 919 155',
'12 415 95 49'
],
'email' => [
'krakow@vidok.com'
]
]
],
[
@@ -220,6 +282,15 @@
'contact' => '<a href="tel:+48 661 804 867">+48 661 804 867</a><br/>
<a href="tel:+48 18 447 68 96">+48 18 447 68 96</a><br/>
<a href="mailto:zakopane@vidok.com">zakopane@vidok.com</a>',
],
'contact' => [
'phone' => [
'+48 661 804 867',
'+48 18 447 68 96'
],
'email' => [
'zakopane@vidok.com'
]
]
],
@@ -241,6 +312,15 @@
'contact' => '<a href="tel:+48 511 071 485">+48 511 071 485</a><br/>
<a href="tel:+48 516 499 983">+48 516 499 983</a><br/>
<a href="mailto:nowytarg@vidok.com">nowytarg@vidok.com</a>',
],
'contact' => [
'phone' => [
'+48 511 071 485',
'+48 516 499 983'
],
'email' => [
'nowytarg@vidok.com'
]
]
],
[
@@ -259,6 +339,14 @@
'products' => '/upload/filemanager/icon/available-products-1.svg',
'contact' => '<a href="tel:+48 13 432 73 11">+48 13 432 73 11</a><br/>
<a href="mailto:krosno@vidok.com">krosno@vidok.com</a>',
],
'contact' => [
'phone' => [
'+48 13 432 73 11'
],
'email' => [
'krosno@vidok.com'
]
]
],
];
@@ -655,7 +743,7 @@
];
?>
<div class="main-page">
<div class="main-page" id="contactApp">
<div class="container">
<div class="row">
<div class="col-12">
@@ -838,20 +926,20 @@
</section>
<section class="box-7" id="box-map-showrooms" style="position: relative; display: flex; height: 700px;">
<div id="showrooms-sidebar" style="width: 350px; overflow-y: auto; background: #f9f9f9; border-right: 1px solid #ddd; padding: 15px;">
<div id="showrooms-sidebar">
<div id="results-list">
<p>Wpisz miasto</p>
<!-- <p>Wpisz miasto</p> -->
</div>
</div>
<div id="map" style="flex-grow: 1; height: 100%;"></div>
<div id="showroom-popup" class="showroom-card--popup" style="display:none; position: absolute; z-index: 999; left: 50%; top: 50%; transform: translate(-50%, -50%); background: #fff; padding: 20px; box-shadow: 0 0 20px rgba(0,0,0,0.2); width: 450px;">
<div id="showroom-popup" class="showroom-card--popup">
<div class="showroom-card--popup-wrapper">
<span class="close-popup" style="float:right; cursor:pointer;">&times;</span>
<div class="popup--head">
<p class="text"></p>
<strong>VIDOK Okna i Drzwi</strong>
<p class="text">PUNKT SPRZEDAŻY</p>
<p>VIDOK Okna i Drzwi</p>
<span class="close-popup">&times;</span>
</div>
<div class="popup--body">
<div class="popup--body-info">
@@ -859,7 +947,7 @@
<div class="info-time"><p></p></div>
<div class="info-products">
<p>Dostępne produkty</p>
<img src="" alt="" style="max-width: 100px;">
<img src="" alt="">
</div>
<div class="info-contact"><p></p></div>
</div>
@@ -992,6 +1080,8 @@
let map, markerCluster;
let markers = [];
const mapPointIcon = "https://maps.google.com/mapfiles/ms/icons/yellow-dot.png";
/**
* Inicjalizacja mapy Google
*/
@@ -1005,6 +1095,14 @@
map = new google.maps.Map(document.getElementById("map"), mapOptions);
const bigMap = new google.maps.Map(
document.getElementById("big-map"),
{
...mapOptions,
center: {lat: 50.0411, lng: 21.9991},
zoom: 11.2,
}
);
// Utworzenie markerów dla wszystkich salonów
renderMarkers();
@@ -1024,7 +1122,8 @@
markers = showrooms.map((item) => {
const marker = new google.maps.Marker({
position: { lat: parseFloat(item.position.lat), lng: parseFloat(item.position.lng) },
title: item.city
title: item.city,
icon: mapPointIcon
});
marker.addListener("click", () => openShowroomPopup(item));
@@ -1092,6 +1191,7 @@
// 1. Czyszczenie kontenera
$resultsContainer.empty();
$('#results-list').parent().addClass('has-results');
// 2. Filtrowanie i obliczanie dystansu
let filtered = showrooms
@@ -1125,44 +1225,66 @@
const itemType = 'SALON SPRZEDAŻY';
console.log('item: ', item);
const $el = `
<div class="sidebar-item" data-lat="${lat}" data-lng="${lng}">
<div class="sidebar-item--wrapper">
<div class="item-type"><span>${itemType}</span></div>
<div class="item-type"><span>${itemType}<\/span><\/div>
<div class="item-working-hours">
<p>
<strong>Godziny otwarcia:</strong><br/>
Pn-Pt: 7:30-16:30<br/>
Sob-Nd: nieczynne
</p>
</div>
${item.data_popup.time}
<\/p>
<\/div>
<div class="item-location">
<p>
<strong>Rudna Mała<br/>Centrala, Rzeszów</strong>
<br/> Rudna Mała 75/k. Rzeszowa<br/>
36-054 Rudna Mała<br/>
gm. Głogów Małopolski
</p>
</div>
${item.data.text}
<\/p>
<\/div>
<div class="item-contact">
<ul>
<li>
<img src="/upload/filemanager/icon/iphone.svg" alt="">
<a href="tel:+48 17 859 56 71">+48 17 859 56 71</a>
</li>
<li>
<img src="/upload/filemanager/icon/envelope.svg" alt="">
<a href="mailto:zapytania@vidok.com">zapytania@vidok.com</a>
</li>
</ul>
</div>
</div>
</div>
${renderContacts(item)}
<\/ul>
<\/div>
<\/div>
<\/div>
`;
return $el;
}
function renderContacts(item) {
if (item.contact) {
let html = '';
if (Array.isArray(item.contact.phone)) {
item.contact.phone.forEach(phone => {
html += `
<li>
<img src="/upload/filemanager/icon/iphone.svg" alt="">
<a href="tel:${phone.replace(/\s+/g, '')}">${phone}<\/a>
<\/li>
`;
});
}
if (Array.isArray(item.contact.email)) {
item.contact.email.forEach(email => {
html += `
<li>
<img src="/upload/filemanager/icon/envelope.svg" alt="">
<a href="mailto:${email}">${email}<\/a>
<\/li>
`;
});
}
return html;
}
return '';
}
/**
* Globalna obsługa kliknięcia w elementy listy (Event Delegation)
*/
@@ -1170,6 +1292,8 @@
// Pobieramy współrzędne z atrybutów data-
const lat = $(this).data('lat');
const lng = $(this).data('lng');
$(this).addClass('active').siblings().removeClass('active');
if (lat && lng) {
focusOnMarker(lat, lng);
@@ -1185,7 +1309,8 @@
$popup.find('.info-time p').html(item.data_popup.time);
$popup.find('.info-contact p').html(item.data_popup.contact);
$popup.find('.info-products img').attr('src', item.data_popup.products);
$popup.fadeIn();
// $popup.fadeIn();
$popup.addClass('active');
}
/**
@@ -1227,7 +1352,8 @@
}
$(document).on('click', '.close-popup', function() {
$('#showroom-popup').fadeOut();
// $('#showroom-popup').fadeOut();
$('#showroom-popup').removeClass('active');
});
});
</script>