- 
+ {% if service.image %}
+
+ {% else %}
+
+ {% if service.image %}
+
+ {% else %}
+
+
+
+ {% endif %}
{{ service.category.name }}
@@ -296,6 +302,42 @@
@@ -374,29 +416,108 @@ document.getElementById('serviceRequestForm').addEventListener('submit', functio
submitBtn.innerHTML = 'Отправляем...';
submitBtn.disabled = true;
- // Simulate form submission (replace with actual AJAX call)
- setTimeout(() => {
- submitBtn.innerHTML = 'Отправлено!';
- submitBtn.classList.remove('btn-primary-modern');
- submitBtn.classList.add('btn-success');
+ // Получаем CSRF токен
+ const csrfToken = document.querySelector('[name=csrfmiddlewaretoken]').value;
+
+ // Подготавливаем данные для отправки
+ const serviceId = document.getElementById('serviceId').value;
+ const requestData = {
+ client_name: formData.get('first_name') + ' ' + formData.get('last_name'),
+ client_email: formData.get('email'),
+ client_phone: formData.get('phone') || '',
+ description: formData.get('description'),
+ budget: formData.get('budget') || '',
+ timeline: formData.get('timeline') || ''
+ };
+
+ // Отправляем запрос на создание QR-кода
+ fetch(`/service/generate_qr_code/${serviceId}/`, {
+ method: 'POST',
+ headers: {
+ 'Content-Type': 'application/json',
+ 'X-CSRFToken': csrfToken
+ },
+ body: JSON.stringify(requestData)
+ })
+ .then(response => response.json())
+ .then(data => {
+ if (data.qr_code_url) {
+ // Показываем секцию с QR-кодом
+ const qrSection = document.getElementById('qrCodeSection');
+ const qrImage = document.getElementById('qrCodeImage');
+ const telegramLink = document.getElementById('telegramLink');
+
+ qrImage.src = data.qr_code_url;
+ qrImage.style.display = 'block';
+ telegramLink.href = data.registration_link;
+ qrSection.style.display = 'block';
+
+ // Обновляем кнопку
+ submitBtn.innerHTML = 'Перейдите в Telegram для подтверждения';
+ submitBtn.disabled = true;
+
+ // Начинаем проверку статуса подтверждения
+ const serviceRequestId = data.service_request_id;
+ confirmationCheckInterval = setInterval(() => {
+ checkConfirmationStatus(serviceRequestId, confirmationCheckInterval);
+ }, 3000); // Проверяем каждые 3 секунды
+
+ } else {
+ throw new Error(data.error || 'Ошибка при создании заявки');
+ }
+ })
+ .catch(error => {
+ console.error('Error:', error);
+ submitBtn.innerHTML = originalContent;
+ submitBtn.disabled = false;
+ submitBtn.classList.remove('btn-success');
+ submitBtn.classList.add('btn-primary-modern');
- setTimeout(() => {
- const modal = bootstrap.Modal.getInstance(document.getElementById('serviceModal'));
- modal.hide();
-
- // Reset form and button
- this.reset();
- submitBtn.innerHTML = originalContent;
- submitBtn.disabled = false;
- submitBtn.classList.remove('btn-success');
- submitBtn.classList.add('btn-primary-modern');
-
- // Show success notification
- showNotification('Заявка отправлена! Мы свяжемся с вами в ближайшее время.', 'success');
- }, 2000);
- }, 2000);
+ showNotification('Произошла ошибка при создании заявки. Попробуйте еще раз.', 'error');
+ });
});
+// Функция проверки статуса подтверждения
+function checkConfirmationStatus(serviceRequestId, checkInterval) {
+ fetch(`/service/check_status/${serviceRequestId}/`, {
+ method: 'GET',
+ headers: {
+ 'Content-Type': 'application/json',
+ }
+ })
+ .then(response => response.json())
+ .then(data => {
+ if (data.is_verified) {
+ // Останавливаем проверку
+ clearInterval(checkInterval);
+
+ // Скрываем QR-код
+ const qrSection = document.getElementById('qrCodeSection');
+ qrSection.style.display = 'none';
+
+ // Показываем анимацию успеха
+ const successSection = document.getElementById('successSection');
+ successSection.style.display = 'block';
+
+ // Запускаем анимацию галочки
+ setTimeout(() => {
+ const checkmark = successSection.querySelector('.success-checkmark');
+ checkmark.classList.add('animate');
+ }, 100);
+
+ // Закрываем модальное окно через 3 секунды
+ setTimeout(() => {
+ const modal = bootstrap.Modal.getInstance(document.getElementById('serviceModal'));
+ modal.hide();
+ showNotification('Заявка подтверждена! Спасибо за регистрацию в Telegram.', 'success');
+ }, 3000);
+ }
+ })
+ .catch(error => {
+ console.log('Ожидаем подтверждения...', error);
+ });
+}
+
function showNotification(message, type) {
const notification = document.createElement('div');
notification.className = `alert alert-${type} position-fixed top-0 end-0 m-3`;
@@ -413,6 +534,38 @@ function showNotification(message, type) {
notification.remove();
}, 5000);
}
+
+// Reset modal when it's hidden
+let confirmationCheckInterval = null;
+
+document.getElementById('serviceModal').addEventListener('hidden.bs.modal', function() {
+ // Останавливаем проверку подтверждения
+ if (confirmationCheckInterval) {
+ clearInterval(confirmationCheckInterval);
+ confirmationCheckInterval = null;
+ }
+
+ // Сброс формы
+ document.getElementById('serviceRequestForm').reset();
+
+ // Скрытие всех секций
+ document.getElementById('qrCodeSection').style.display = 'none';
+ document.getElementById('qrCodeImage').style.display = 'none';
+ document.getElementById('successSection').style.display = 'none';
+
+ // Убираем анимацию галочки
+ const checkmark = document.querySelector('.success-checkmark');
+ if (checkmark) {
+ checkmark.classList.remove('animate');
+ }
+
+ // Сброс кнопки отправки
+ const submitBtn = document.querySelector('button[type="submit"][form="serviceRequestForm"]');
+ submitBtn.innerHTML = 'Отправить заявку';
+ submitBtn.disabled = false;
+ submitBtn.classList.remove('btn-success');
+ submitBtn.classList.add('btn-primary-modern');
+});