s5l.ru-crm

🎯 ПОЛНЫЙ ПРОМТ ДЛЯ РАЗРАБОТКИ ИНТЕРНЕТ-МАГАЗИНА "БРАЕР-КОЛОР"

📋 ТЕХНИЧЕСКОЕ ЗАДАНИЕ

ВАЖНО: debug является глобально объявленной переменной во всем приложении. НЕ используйте debug = require 'debug' в компонентах.

🎯 КОНТЕКСТ ПРОЕКТА

Название: Интернет-магазин лакокрасочной продукции "Браер-Колор"
Тип: SPA (Single Page Application) с современным минималистичным дизайном
Аналоги: Функциональность m-kraski.ru с дизайном https://braer-color.ru/
Архитектура: Мультидоменная, мультиязычная PWA с офлайн-режимом GIT репозитарий: https://gogs.osvoj.ru/oleg/s5l.ru-crm Текущая версия промта https://gogs.osvoj.ru/oleg/s5l.ru-crm/raw/master/README.md

📊 ОБРАЗЕЦ CSV ФАЙЛА ДЛЯ ИМПОРТА

📝 СПЕЦИФИКАЦИЯ CSV

Разделитель: ; (точка с запятой)
Кодировка: UTF-8
Обязательные поля: Артикул*, Название товара, Цена, руб.*

🎯 ПРИМЕР CSV СТРОКИ

№;Артикул*;Название товара;Цена, руб.*;Цена до скидки, руб.;НДС, %*;Рассрочка;Баллы за отзывы;SKU;Штрихкод (Серийный номер / EAN);Вес в упаковке, г*;Ширина упаковки, мм*;Высота упаковки, мм*;Длина упаковки, мм*;Ссылка на главное фото*;Ссылки на дополнительные фото;Ссылки на фото 360;Артикул фото;Бренд*;Название модели (для объединения в одну карточку)*;Единиц в одном товаре;Цвет товара;Название цвета;Тип*;Класс опасности товара*;Степень блеска покрытия;Работы;Вес товара, г;Количество товара в УЕИ;#Хештеги;Аннотация;Rich-контент JSON;Название группы;Образец цвета;Партномер;Гарантия;Страна-изготовитель;Комплектация;ТН ВЭД коды ЕАЭС;Срок годности в днях;Количество заводских упаковок;Вид краски;Объем, л;Время высыхания, часов;Вес, кг;Расход, л/м2;Назначение грунтовки;Рекомендуемое количество слоев;Расход, кг/м2;Область применения состава;Количество компонентов;Особенности ЛКМ;Макс. температура эксплуатации, С°;Материал основания;Основа краски;Основа грунтовки;Способ нанесения;Форма выпуска средства;Назначение;Тип помещения;Возможность колеровки;Вид выпуска товара;Тип растворителя;Эффект краски;Марка эмали;Можно мыть;Базис;Аэрозоль;Помещение;Название модели для шаблона наименования;Ошибка;Предупреждение
1;4673764201943;Грунтовка глубокого проникновения для стен под обои и покраску ЭкоКрас 1кг;528,00;1 056,00;20;Да;Нет;;4673764201943;1000;100;55;250;https://cdn1.ozone.ru/s3/multimedia-1-o/7663357104.jpg;"https://cdn1.ozone.ru/s3/multimedia-1-8/7663357124.jpg
https://cdn1.ozone.ru/s3/multimedia-1-w/7663352504.jpg
https://cdn1.ozone.ru/s3/multimedia-1-r/7663357179.jpg
https://cdn1.ozone.ru/s3/multimedia-1-b/7663352483.jpg
https://cdn1.ozone.ru/s3/multimedia-1-c/7663352556.jpg
https://cdn1.ozone.ru/s3/multimedia-1-t/7663352537.jpg
https://cdn1.ozone.ru/s3/multimedia-1-o/7663352496.jpg
https://cdn1.ozone.ru/s3/multimedia-1-k/7663352492.jpg
https://cdn1.ozone.ru/s3/multimedia-1-y/7663365970.jpg
https://cdn1.ozone.ru/s3/multimedia-1-m/7663365922.jpg
https://cdn1.ozone.ru/s3/multimedia-1-1/7663365937.jpg
https://cdn1.ozone.ru/s3/multimedia-1-p/7663352533.jpg";;;ЭкоКрас;4673764201943;1;прозрачный;;Грунтовка;Не опасен;;"Внутренние;Наружные";;;#Грунтовка #ГрунтДляСтен #АкриловаяГрунтовка #СтроительныеМатериалы #ГлубокогоПроникновения #УниверсальнаяГрунтовка #АдгезионнаяГрунтовка #АнтисептическаяГрунтовка #ДляВнутреннихРабот #ДляНаружныхРабот #ДляБетона #ДляГипсокартона #ДляДерева #Быстросохнущая #Водостойкая #Укрепляющая #Противогрибковая #БелаяГрунтовка #ПодОбои #ПодШтукатурку #ПодПокраску #ПодПлитку #ДляРовныхСтен #РемонтДома #ОтделкаПомещений #СтроительныеРаботы #КачественныйРемонт #СтроительныеТовары #профессиональная_грунтовка #грунтовка_концентрат_премиум;"Премиум грунтовка глубокого проникновения для подготовки поверхностей перед финишной отделкой...";"{""content"": [{""widgetName"": ""raTextBlock"", ""title"": {""items"": [{""type"": ""text"", ""content"": ""Грунтовка глубокого проникновения PRIMER 1:4 концентрат ImPasto 1кг""}], ""size"": ""size5"", ""color"": ""color1""}, ""theme"": ""primary"", ""padding"": ""type2"", ""gapSize"": ""m"", ""text"": {""size"": ""size2"", ""align"": ""left"", ""color"": ""color1"", ""items"": [{""type"": ""text"", ""content"": ""Премиум грунтовка глубокого проникновения для подготовки поверхностей перед финишной отделкой...""}]}}], ""version"": 0.3}";экокрас;https://cdn1.ozone.ru/s3/multimedia-1-q/7218190898.jpg;;2 года;Россия;Грунтовка глубокого проникновения ЭкоКрас 1кг- 1шт;;990;1;;1;24;1;0,05;"Глубокого проникновения;Обеспыливающая;Пропиточная;Укрепляющая;Универсальная";;;"По бетону;Для фасадов;Для хобби и творчества;Для швов;По кирпичу;По штукатурке;Универсальная";;;;"Бетон;Газобетон;Кирпич;Пенобетон;Штукатурка";;Акриловая;"Валик;Кисть;Краскопульт;Пистолет";Готовый раствор;;"С повышенной влажностью;С умеренной влажностью;Сухое";;;;;;;;;;;;

🔧 ОБРАБОТКА НЕОБЯЗАТЕЛЬНЫХ ПОЛЕЙ

ВАЖНО: Система должна обрабатывать ЛЮБЫЕ необязательные поля, даже с неизвестными именами. Все дополнительные поля сохраняются в атрибуты товара.

# Пример обработки произвольных полей
extractAllAttributes: (csvRow) ->
  attributes = {}
  
  # Обязательные технические поля
  requiredFields = [
    'Вес в упаковке, г*', 'Ширина упаковки, мм*', 'Высота упаковки, мм*', 
    'Длина упаковки, мм*', 'Объем, л', 'Время высыхания, часов'
  ]
  
  # Обрабатываем все поля CSV
  for key, value of csvRow
    if value and value.toString().trim() != ''
      # Сохраняем все поля, кроме системных
      if not key in ['№', 'Артикул*', 'Название товара', 'Цена, руб.*', 'Ссылка на главное фото*', 'Ссылки на дополнительные фото']
        attributes[key] = value.toString().trim()
  
  log "Извлечено атрибутов: #{Object.keys(attributes).length}"
  return attributes

🎯 ПОДРОБНОЕ ЛОГГИРОВАНИЕ

📝 ТРЕБОВАНИЯ К ЛОГГИРОВАНИЮ

Обязательно логировать:

• Начало и завершение всех основных операций
• Ошибки с полным стектрейсом
• Прогресс длительных операций (импорт, синхронизация)
• Пользовательские действия (добавление в корзину, авторизация)
• Изменения состояния приложения
• Запросы к базе данных

Пример детального логгирования:

importFromCSV: (file, domain, onProgress) ->
  log "🚀 Начало импорта CSV файла: #{file.name}"
  log "📊 Домен для импорта: #{domain}"
  log "📁 Размер файла: #{file.size} байт"
  
  return new Promise (resolve, reject) =>
    reader = new FileReader()
    
    reader.onload = (e) =>
      try
        log "✅ Файл успешно прочитан, начало парсинга CSV"
        results = Papa.parse(e.target.result, {
          header: true
          delimiter: ';'
          skipEmptyLines: true
          encoding: 'UTF-8'
        })
        
        log "📈 CSV распарсен: #{results.data.length} строк найдено"
        
        validProducts = results.data.filter (row) => 
          isValid = row and row['Артикул*'] and row['Название товара'] and row['Цена, руб.*']
          if not isValid
            log "⚠️ Пропущена строка из-за отсутствия обязательных полей: #{JSON.stringify(row)}"
          return isValid
        
        log "✅ Валидных товаров для импорта: #{validProducts.length}"
        
        this.processProductsInBatches(validProducts, domain, onProgress)
          .then (results) =>
            log "🎉 Импорт успешно завершен: #{results.length} товаров обработано"
            resolve(results)
          .catch (error) =>
            log "❌ Ошибка в процессе импорта: #{error.message}"
            reject(error)
        
      catch error
        log "💥 Критическая ошибка парсинга CSV: #{error.message}"
        log "🔍 Stack trace:", error.stack
        reject(new Error("Ошибка парсинга CSV: #{error.message}"))
    
    reader.onerror = (error) ->
      log "❌ Ошибка чтения файла: #{error}"
      reject(new Error('Ошибка чтения файла'))
    
    reader.readAsText(file, 'UTF-8')

🛠 ТЕХНИЧЕСКИЙ СТЕК

• Шаблонизатор: Pug с Vue компонентами
• Стилизация: Stylus + CSS переменные + BEM методология
• Логика: CoffeeScript + Vue.js 3 (runtime + compiler)
• Маршрутизация: Vue Router
• База данных: PouchDB (клиент) + CouchDB (сервер)
• Анимации: CSS transitions/transforms + Vue transitions

🚨 КРИТИЧЕСКИЕ ПРАВИЛА РАЗРАБОТКИ

❌ ЗАПРЕЩЕНО:

1. Использование rgba() функций в стилях
2. Прямое использование console.log (только глобальный log)
3. Многострочные атрибуты в Pug
4. @import в стилях компонентов
5. JavaScript операторы в CoffeeScript
6. Объявление debug в компонентах

✅ ОБЯЗАТЕЛЬНО:

1. Полные листинги файлов компонентов
2. Адаптивная верстка (mobile-first)
3. BEM методология именования классов
4. CSS переменные для цветов и прозрачностей
5. Подробное логгирование всех операций
6. Обработка всех необязательных полей CSV

📅 ПОЭТАПНЫЙ ПЛАН РАЗРАБОТКИ

🎯 ЭТАП 1: БАЗОВАЯ АРХИТЕКТУРА ✅

• Настройка сборки и конфигурации
• Базовая структура Vue приложения
• PouchDB сервис и дизайн-документы
• Главный layout и система стилей
• Система типов и интерфейсов

🎯 ЭТАП 2: АДМИН-ПАНЕЛЬ ⚠️ В РАБОТЕ

• Layout админ-панели
• Компонент управления товарами
• ТЕКУЩАЯ ЗАДАЧА: Система импорта товаров
• Редактор категорий с загрузкой изображений
• Управление слайдами главной страницы
• Управление статьями блога
• Настройки доменов и мультиязычности

🎯 ЭТАП 3: КЛИЕНТСКАЯ ЧАСТЬ

• Главная страница с адаптивным дизайном
• Каталог товаров с фильтрацией
• Страница товара с галереей
• Корзина и оформление заказа
• Блог и система статей

🎯 ЭТАП 4: ДОПОЛНИТЕЛЬНЫЕ ФУНКЦИИ

• Поиск по товарам
• Система отзывов и рейтингов
• Личный кабинет пользователя
• Система скидок и промокодов
• Интеграция с платежными системами

🎯 ЭТАП 5: ОПТИМИЗАЦИЯ И ТЕСТИРОВАНИЕ

• PWA функциональность (офлайн-режим)
• Оптимизация производительности
• Тестирование на разных устройствах
• Деплой и настройка продакшн-окружения

📊 ТЕКУЩОЕ СОСТОЯНИЕ ПРОЕКТА

✅ ВЫПОЛНЕНО

🎯 БЛИЖАЙШИЕ ЗАДАЧИ

1. Работа с данными

   • PouchDB сервис с синхронизацией
   • Дизайн-документы для CouchDB
   • Система типов данных

2. Базовые компоненты

   • Главный layout приложения
   • Layout админ-панели
   • Система уведомлений

3. Стили и дизайн

   • CSS переменные и дизайн-система
   • Адаптивная верстка
   • Темная/светлая темы

4. Система импорта товаров ⚠️ ПРИОРИТЕТ

   • Компонент загрузки CSV файлов
   • Парсинг и валидация данных
   • Пакетная обработка товаров
   • Создание категорий на лету

5. Админ-панель

   • Управление товарами
   • Система прогресса операций
   • Обработка ошибок импорта

6. Завершить компонент импорта товаров

7. Реализовать редактор категорий

8. Создать компонент управления слайдами

9. Разработать главную страницу магазина

🔄 В РАБОТЕ СЕЙЧАС

отвечай на русском Анализировать реализованный код, по git репозитарию https://gogs.osvoj.ru/oleg/s5l.ru-crm.git Проверяй промт и изменения в нём по адресу https://gogs.osvoj.ru/oleg/s5l.ru-crm/raw/master/README.md

1. Базовая архитектура
   • Напиши базовые файлы системы
   • Система роутинга
   • Глобальная конфигурация
   • Напиши следущую задачу на выполнение (после завершения отладки, созданых файлов)