76 lines
3.7 KiB
HTML
76 lines
3.7 KiB
HTML
{% extends "base.html" %}
|
||
|
||
{% block title %}Контакты - Wanlanda{% endblock %}
|
||
|
||
{% block content %}
|
||
<h1 class="text-3xl sm:text-4xl font-bold mb-8 text-wanlanda-green">Контакты</h1>
|
||
|
||
<div class="grid grid-cols-1 md:grid-cols-2 gap-8">
|
||
<div class="bg-white p-6 rounded-lg shadow">
|
||
<h2 class="text-2xl font-bold mb-4 text-wanlanda-green">Контактная информация</h2>
|
||
<p class="mb-2">Адрес: г. Новокузнецк, ул. Тольятти, д. 5Б, пом. 10</p>
|
||
<p class="mb-2">Телефон: +7 (905) 906-84-65</p>
|
||
<p class="mb-2">Email: anthillsib@gmail.com</p>
|
||
<h3 class="text-xl font-bold mt-6 mb-2 text-wanlanda-green">Часы работы</h3>
|
||
<p class="mb-2">Пн-Пт: 9:00 - 18:00</p>
|
||
<!-- <p class="mb-2">Сб: 10:00 - 15:00</p> -->
|
||
<p class="mb-2">Сб, Вс: выходной</p>
|
||
</div>
|
||
|
||
<div class="bg-white p-6 rounded-lg shadow">
|
||
<h2 class="text-2xl font-bold mb-4 text-wanlanda-green">Напишите нам</h2>
|
||
|
||
<form id="contactForm" onsubmit="submitForm(event)">
|
||
<div class="mb-4">
|
||
<label for="name" class="block text-gray-700 font-bold mb-2">Имя</label>
|
||
<input type="text" id="name" name="name" class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-sybiko-red" required>
|
||
</div>
|
||
<div class="mb-4">
|
||
<label for="email" class="block text-gray-700 font-bold mb-2">Email</label>
|
||
<input type="email" id="email" name="email" class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-sybiko-red" required>
|
||
</div>
|
||
<div class="mb-4">
|
||
<label for="message" class="block text-gray-700 font-bold mb-2">Сообщение</label>
|
||
<textarea id="message" name="message" rows="4" class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-sybiko-red" required></textarea>
|
||
</div>
|
||
<button type="submit" class="bg-wanlanda-green hover:bg-green-700 text-white font-bold py-2 px-4 rounded focus:outline-none focus:shadow-outline">Отправить</button>
|
||
</form>
|
||
<div id="formMessage" class="mt-4 text-center hidden"></div>
|
||
|
||
</div>
|
||
</div>
|
||
|
||
<script>
|
||
async function submitForm(event) {
|
||
event.preventDefault();
|
||
const form = event.target;
|
||
const formData = new FormData(form);
|
||
const formMessage = document.getElementById('formMessage');
|
||
|
||
try {
|
||
const response = await fetch('/submit-form', {
|
||
method: 'POST',
|
||
body: JSON.stringify(Object.fromEntries(formData)),
|
||
headers: {
|
||
'Content-Type': 'application/json'
|
||
}
|
||
});
|
||
|
||
const result = await response.json();
|
||
|
||
if (response.ok) {
|
||
formMessage.textContent = 'Спасибо за ваше сообщение! Мы свяжемся с вами в ближайшее время.';
|
||
formMessage.classList.remove('hidden', 'text-red-500');
|
||
formMessage.classList.add('text-green-500');
|
||
form.reset();
|
||
} else {
|
||
throw new Error(result.detail || 'Произошла ошибка при отправке формы.');
|
||
}
|
||
} catch (error) {
|
||
formMessage.textContent = error.message;
|
||
formMessage.classList.remove('hidden', 'text-green-500');
|
||
formMessage.classList.add('text-red-500');
|
||
}
|
||
}
|
||
</script>
|
||
{% endblock %} |