diff --git a/src/components/CookieConsent.tsx b/src/components/CookieConsent.tsx new file mode 100644 index 0000000..34f2f76 --- /dev/null +++ b/src/components/CookieConsent.tsx @@ -0,0 +1,271 @@ +import React, { useState, useEffect } from 'react'; +import { CookiePreferences, initializeAnalytics, initializeMarketing } from '@/lib/cookie-utils'; + +interface CookieConsentProps { + onAccept?: () => void; + onDecline?: () => void; + onConfigure?: (preferences: CookiePreferences) => void; +} + +const CookieConsent: React.FC = ({ onAccept, onDecline, onConfigure }) => { + const [isVisible, setIsVisible] = useState(false); + const [showDetails, setShowDetails] = useState(false); + const [preferences, setPreferences] = useState({ + necessary: true, // Всегда включены + analytics: false, + marketing: false, + functional: false, + }); + + useEffect(() => { + // Проверяем, есть ли уже согласие в localStorage + const cookieConsent = localStorage.getItem('cookieConsent'); + if (!cookieConsent) { + setIsVisible(true); + } + }, []); + + const handleAcceptAll = () => { + const allAccepted = { + necessary: true, + analytics: true, + marketing: true, + functional: true, + }; + localStorage.setItem('cookieConsent', 'accepted'); + localStorage.setItem('cookiePreferences', JSON.stringify(allAccepted)); + + // Инициализируем сервисы после согласия + initializeAnalytics(); + initializeMarketing(); + + setIsVisible(false); + onAccept?.(); + }; + + const handleDeclineAll = () => { + const onlyNecessary = { + necessary: true, + analytics: false, + marketing: false, + functional: false, + }; + localStorage.setItem('cookieConsent', 'declined'); + localStorage.setItem('cookiePreferences', JSON.stringify(onlyNecessary)); + setIsVisible(false); + onDecline?.(); + }; + + const handleSavePreferences = () => { + localStorage.setItem('cookieConsent', 'configured'); + localStorage.setItem('cookiePreferences', JSON.stringify(preferences)); + + // Инициализируем сервисы согласно настройкам + if (preferences.analytics) { + initializeAnalytics(); + } + if (preferences.marketing) { + initializeMarketing(); + } + + setIsVisible(false); + onConfigure?.(preferences); + }; + + const togglePreference = (key: keyof CookiePreferences) => { + if (key === 'necessary') return; // Необходимые cookies нельзя отключить + setPreferences(prev => ({ + ...prev, + [key]: !prev[key] + })); + }; + + if (!isVisible) return null; + + return ( +
+
+ {!showDetails ? ( + // Основной вид +
+ {/* Текст согласия */} +
+
+ {/* Иконка cookie */} +
+ + + +
+ +
+

+ Мы используем файлы cookie +

+

+ Наш сайт использует файлы cookie для улучшения работы сайта, персонализации контента и анализа трафика. + Продолжая использовать сайт, вы соглашаетесь с нашей{' '} + + политикой конфиденциальности + + {' '}и использованием файлов cookie. +

+
+
+
+ + {/* Кнопки */} +
+ + + +
+
+ ) : ( + // Детальный вид с настройками +
+ {/* Заголовок */} +
+

+ Настройки файлов cookie +

+ +
+ + {/* Настройки cookies */} +
+ {/* Необходимые cookies */} +
+
+
+

Необходимые cookies

+ Обязательные +
+

+ Эти файлы cookie необходимы для работы сайта и не могут быть отключены. +

+
+
+
+
+
+
+
+ + {/* Аналитические cookies */} +
+
+

Аналитические cookies

+

+ Помогают нам понять, как посетители взаимодействуют с сайтом. +

+
+
+ +
+
+ + {/* Маркетинговые cookies */} +
+
+

Маркетинговые cookies

+

+ Используются для отслеживания посетителей и показа релевантной рекламы. +

+
+
+ +
+
+ + {/* Функциональные cookies */} +
+
+

Функциональные cookies

+

+ Обеспечивают расширенную функциональность и персонализацию. +

+
+
+ +
+
+
+ + {/* Кнопки действий */} +
+ + + +
+
+ )} +
+
+ ); +}; + +export default CookieConsent; \ No newline at end of file diff --git a/src/components/LKMenu.tsx b/src/components/LKMenu.tsx index a3bf0ea..42f5fb5 100644 --- a/src/components/LKMenu.tsx +++ b/src/components/LKMenu.tsx @@ -13,6 +13,7 @@ const menuItems = [ { label: 'Адреса доставки', href: '/profile-addresses', icon: 'https://cdn.builder.io/api/v1/image/assets/TEMP/1faca7190a7dd71a66fd3cf0127a8c6e45eac5e6?placeholderIfAbsent=true&apiKey=f5bc5a2dc9b841d0aba1cc6c74a35920' }, { label: 'Гараж', href: '/profile-gar', icon: 'https://cdn.builder.io/api/v1/image/assets/TEMP/783501855b4cb8be4ac47a0733e298c3f3ccfc5e?placeholderIfAbsent=true&apiKey=f5bc5a2dc9b841d0aba1cc6c74a35920' }, { label: 'Настройки аккаунта', href: '/profile-set', icon: 'https://cdn.builder.io/api/v1/image/assets/TEMP/b39907028aa6baf08adc313aed84d1294f2be013?placeholderIfAbsent=true&apiKey=f5bc5a2dc9b841d0aba1cc6c74a35920' }, + { label: 'Настройки cookies', href: '/profile-cookie-settings', icon: 'https://cdn.builder.io/api/v1/image/assets/TEMP/b39907028aa6baf08adc313aed84d1294f2be013?placeholderIfAbsent=true&apiKey=f5bc5a2dc9b841d0aba1cc6c74a35920' }, ]; const financeItems = [ diff --git a/src/components/profile/CookieSettings.tsx b/src/components/profile/CookieSettings.tsx new file mode 100644 index 0000000..2dc2f57 --- /dev/null +++ b/src/components/profile/CookieSettings.tsx @@ -0,0 +1,243 @@ +import React, { useState, useEffect } from 'react'; +import { + getCookiePreferences, + CookiePreferences, + initializeAnalytics, + initializeMarketing, + resetCookieConsent +} from '@/lib/cookie-utils'; + +const CookieSettings: React.FC = () => { + const [preferences, setPreferences] = useState({ + necessary: true, + analytics: false, + marketing: false, + functional: false, + }); + const [isLoading, setIsLoading] = useState(true); + const [isSaving, setIsSaving] = useState(false); + const [saveMessage, setSaveMessage] = useState(null); + + useEffect(() => { + // Загружаем текущие настройки + const currentPreferences = getCookiePreferences(); + if (currentPreferences) { + setPreferences(currentPreferences); + } + setIsLoading(false); + }, []); + + const togglePreference = (key: keyof CookiePreferences) => { + if (key === 'necessary') return; // Необходимые cookies нельзя отключить + setPreferences(prev => ({ + ...prev, + [key]: !prev[key] + })); + }; + + const handleSave = async () => { + setIsSaving(true); + setSaveMessage(null); + + try { + // Сохраняем настройки + localStorage.setItem('cookieConsent', 'configured'); + localStorage.setItem('cookiePreferences', JSON.stringify(preferences)); + + // Инициализируем сервисы согласно настройкам + if (preferences.analytics) { + initializeAnalytics(); + } + if (preferences.marketing) { + initializeMarketing(); + } + + setSaveMessage('Настройки успешно сохранены'); + + // Убираем сообщение через 3 секунды + setTimeout(() => { + setSaveMessage(null); + }, 3000); + } catch (error) { + setSaveMessage('Ошибка при сохранении настроек'); + } finally { + setIsSaving(false); + } + }; + + const handleReset = () => { + resetCookieConsent(); + setPreferences({ + necessary: true, + analytics: false, + marketing: false, + functional: false, + }); + setSaveMessage('Настройки сброшены. Перезагрузите страницу для повторного отображения уведомления о cookies.'); + }; + + if (isLoading) { + return ( +
+
+
+ ); + } + + return ( +
+
+

+ Настройки файлов cookie +

+

+ Управляйте тем, как мы используем файлы cookie на нашем сайте. +

+
+ + {saveMessage && ( +
+ {saveMessage} +
+ )} + +
+ {/* Необходимые cookies */} +
+
+
+

Необходимые cookies

+ + Обязательные + +
+

+ Эти файлы cookie необходимы для работы сайта и не могут быть отключены. + Они обеспечивают базовую функциональность, включая корзину покупок, авторизацию и безопасность. +

+
+ Включает: сессии, корзина, авторизация, безопасность +
+
+
+
+
+
+
+
+ + {/* Аналитические cookies */} +
+
+

Аналитические cookies

+

+ Помогают нам понять, как посетители взаимодействуют с сайтом, чтобы улучшить его работу и пользовательский опыт. +

+
+ Включает: Google Analytics, статистика посещений, анализ поведения +
+
+
+ +
+
+ + {/* Маркетинговые cookies */} +
+
+

Маркетинговые cookies

+

+ Используются для отслеживания посетителей и показа релевантной рекламы. + Помогают измерить эффективность рекламных кампаний. +

+
+ Включает: рекламные пиксели, ретаргетинг, социальные сети +
+
+
+ +
+
+ + {/* Функциональные cookies */} +
+
+

Функциональные cookies

+

+ Обеспечивают расширенную функциональность и персонализацию сайта, + включая предпочтения и настройки пользователя. +

+
+ Включает: языковые настройки, персонализация, чат-боты +
+
+
+ +
+
+
+ + {/* Кнопки действий */} +
+ + + +
+ + {/* Дополнительная информация */} +
+
+
+ + + +
+
+

Информация о cookies

+

+ Изменения настроек cookies вступают в силу немедленно. Некоторые функции сайта могут работать некорректно при отключении определенных типов cookies. +

+
+
+
+
+ ); +}; + +export default CookieSettings; \ No newline at end of file diff --git a/src/lib/cookie-utils.ts b/src/lib/cookie-utils.ts new file mode 100644 index 0000000..a3b1ca5 --- /dev/null +++ b/src/lib/cookie-utils.ts @@ -0,0 +1,61 @@ +interface CookiePreferences { + necessary: boolean; + analytics: boolean; + marketing: boolean; + functional: boolean; +} + +export const getCookieConsent = (): string | null => { + if (typeof window === 'undefined') return null; + return localStorage.getItem('cookieConsent'); +}; + +export const getCookiePreferences = (): CookiePreferences | null => { + if (typeof window === 'undefined') return null; + const preferences = localStorage.getItem('cookiePreferences'); + return preferences ? JSON.parse(preferences) : null; +}; + +export const hasConsentForAnalytics = (): boolean => { + const preferences = getCookiePreferences(); + return preferences?.analytics || false; +}; + +export const hasConsentForMarketing = (): boolean => { + const preferences = getCookiePreferences(); + return preferences?.marketing || false; +}; + +export const hasConsentForFunctional = (): boolean => { + const preferences = getCookiePreferences(); + return preferences?.functional || false; +}; + +export const isConsentGiven = (): boolean => { + const consent = getCookieConsent(); + return consent !== null && consent !== 'declined'; +}; + +export const resetCookieConsent = (): void => { + if (typeof window === 'undefined') return; + localStorage.removeItem('cookieConsent'); + localStorage.removeItem('cookiePreferences'); +}; + +// Функция для интеграции с аналитикой (например, Google Analytics) +export const initializeAnalytics = (): void => { + if (!hasConsentForAnalytics()) return; + + // Здесь можно добавить инициализацию Google Analytics или других сервисов + console.log('Analytics initialized with user consent'); +}; + +// Функция для интеграции с маркетинговыми инструментами +export const initializeMarketing = (): void => { + if (!hasConsentForMarketing()) return; + + // Здесь можно добавить инициализацию маркетинговых пикселей + console.log('Marketing tools initialized with user consent'); +}; + +export type { CookiePreferences }; \ No newline at end of file diff --git a/src/pages/_app.tsx b/src/pages/_app.tsx index a281377..47d9668 100644 --- a/src/pages/_app.tsx +++ b/src/pages/_app.tsx @@ -14,6 +14,7 @@ import { CartProvider } from '@/contexts/CartContext'; import { FavoritesProvider } from '@/contexts/FavoritesContext'; import Layout from "@/components/Layout"; import { Toaster } from 'react-hot-toast'; +import CookieConsent from '@/components/CookieConsent'; export default function App({ Component, pageProps }: AppProps) { const [isMaintenanceMode, setIsMaintenanceMode] = useState(false); @@ -83,6 +84,7 @@ export default function App({ Component, pageProps }: AppProps) { src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js" strategy="afterInteractive" /> + diff --git a/src/pages/privacy-policy.tsx b/src/pages/privacy-policy.tsx new file mode 100644 index 0000000..45aae9a --- /dev/null +++ b/src/pages/privacy-policy.tsx @@ -0,0 +1,177 @@ +import React from 'react'; +import Head from 'next/head'; + +const PrivacyPolicy: React.FC = () => { + return ( + <> + + Политика конфиденциальности | ПротекАвто + + + + +
+
+
+

+ Политика конфиденциальности +

+ +
+
+

+ 1. Общие положения +

+

+ Настоящая Политика конфиденциальности определяет порядок обработки и защиты персональных данных + пользователей интернет-магазина ПротекАвто (далее — «Сайт»). Мы уважаем вашу конфиденциальность + и стремимся защитить ваши персональные данные. +

+
+ +
+

+ 2. Сбор и использование персональных данных +

+

+ Мы собираем следующие категории персональных данных: +

+
    +
  • Контактная информация (имя, телефон, email)
    • +
  • Данные для доставки (адрес, индекс)
    • +
  • Информация о заказах и покупках
    • +
  • Техническая информация (IP-адрес, браузер, устройство)
    • +
+
+ +
+

+ 3. Файлы cookie +

+

+ Наш сайт использует файлы cookie для улучшения пользовательского опыта. Мы используем следующие типы cookie: +

+ +
+
+

Необходимые cookie

+

+ Обеспечивают базовую функциональность сайта, включая корзину покупок, авторизацию и безопасность. +

+
+ +
+

Аналитические cookie

+

+ Помогают нам понять, как посетители используют сайт, чтобы улучшить его работу. +

+
+ +
+

Маркетинговые cookie

+

+ Используются для показа релевантной рекламы и отслеживания эффективности рекламных кампаний. +

+
+ +
+

Функциональные cookie

+

+ Обеспечивают расширенную функциональность и персонализацию сайта. +

+
+
+
+ +
+

+ 4. Цели обработки данных +

+

+ Мы обрабатываем ваши персональные данные для следующих целей: +

+
    +
  • Обработка и выполнение заказов
    • +
  • Связь с клиентами по вопросам заказов
    • +
  • Улучшение качества обслуживания
    • +
  • Анализ использования сайта
    • +
  • Маркетинговые коммуникации (с вашего согласия)
    • +
+
+ +
+

+ 5. Передача данных третьим лицам +

+

+ Мы не продаем и не передаем ваши персональные данные третьим лицам, за исключением случаев, + необходимых для выполнения наших обязательств перед вами (доставка, оплата) или требований законодательства. +

+
+ +
+

+ 6. Защита данных +

+

+ Мы применяем современные технические и организационные меры для защиты ваших персональных данных + от несанкционированного доступа, изменения, раскрытия или уничтожения. +

+
+ +
+

+ 7. Ваши права +

+

+ Вы имеете право: +

+
    +
  • Получить информацию о обработке ваших данных
    • +
  • Внести изменения в ваши данные
    • +
  • Удалить ваши данные
    • +
  • Ограничить обработку данных
    • +
  • Отозвать согласие на обработку данных
    • +
+
+ +
+

+ 8. Контактная информация +

+

+ По вопросам обработки персональных данных вы можете обратиться к нам: +

+
+

+ Email: privacy@protekauto.ru
+ Телефон: +7 (495) 123-45-67
+ Адрес: г. Москва, ул. Примерная, д. 1 +

+
+
+ +
+

+ 9. Изменения в политике +

+

+ Мы оставляем за собой право вносить изменения в настоящую Политику конфиденциальности. + Актуальная версия всегда доступна на данной странице. +

+
+ +
+

+ Последнее обновление: {new Date().toLocaleDateString('ru-RU')} +

+
+
+
+
+
+ + ); +}; + +export default PrivacyPolicy; \ No newline at end of file diff --git a/src/pages/profile-cookie-settings.tsx b/src/pages/profile-cookie-settings.tsx new file mode 100644 index 0000000..3bf7600 --- /dev/null +++ b/src/pages/profile-cookie-settings.tsx @@ -0,0 +1,34 @@ +import React from 'react'; +import Head from 'next/head'; +import LKMenu from '@/components/LKMenu'; +import CookieSettings from '@/components/profile/CookieSettings'; + +const ProfileCookieSettingsPage: React.FC = () => { + return ( + <> + + Настройки cookies | Личный кабинет | ПротекАвто + + + + +
+
+
+ {/* Боковое меню */} +
+ +
+ + {/* Основной контент */} +
+ +
+
+
+
+ + ); +}; + +export default ProfileCookieSettingsPage; \ No newline at end of file diff --git a/src/styles/globals.css b/src/styles/globals.css index 7fd33a3..55a331c 100644 --- a/src/styles/globals.css +++ b/src/styles/globals.css @@ -84,4 +84,20 @@ input[type=number]::-webkit-outer-spin-button { } input[type=number] { -moz-appearance: textfield; +} + +/* Анимация для cookie consent */ +@keyframes slideInFromBottom { + from { + transform: translateY(100%); + opacity: 0; + } + to { + transform: translateY(0); + opacity: 1; + } +} + +.cookie-consent-enter { + animation: slideInFromBottom 0.3s ease-out; } \ No newline at end of file