# Рефакторинг API запросов - Инструкция по тестированию

## ✅ Что было сделано

### Проблема
При переходе на главную страницу выполнялось **10+ дублирующихся API запросов**:
- `/api/v1/departments/my-departments/` - **3 раза** (!!!)
- `/api/v1/calendar/events/?start=...&end=...` - **2-3 раза** для каждого периода

### Решение
Создана система централизованного управления данными с кешированием и дедупликацией:

1. **DataManager** - умный менеджер данных
   - Кеширование с TTL (Time To Live)
   - Дедупликация одновременных запросов
   - Система подписки на изменения
   - Логирование для отладки

2. **API обертки**:
   - `calendarApi.js` - события календаря (TTL 30 сек)
   - `departmentsApi.js` - отделы пользователя (TTL 60 сек)

3. **Рефакторинг calendarWidget.js**:
   - Заменены прямые `fetch()` на API обертки
   - Автоматическое переиспользование данных между виджетами

## 🧪 Тестирование

### 1. Проверка работы календаря

```bash
# На сервере
cd /home/igor/EUSRR
git pull origin master
sudo systemctl restart eusrr
```

### 2. Откройте DevTools в браузере

1. **Открыть главную страницу** (`/`)
2. **F12 → вкладка Network**
3. **Очистить** (кнопка 🚫)
4. **Обновить страницу** (F5)

**Ожидаемый результат:**
- `/api/v1/departments/my-departments/` - **1 раз** (было 3)
- `/api/v1/calendar/events/?start=...` - **1 раз на период** (было 2-3)

### 3. Проверка кеширования

1. **Вкладка Console в DevTools**
2. **Обновите страницу** (F5)
3. Ищите логи:
   ```
   [DataManager] Fetching: departments:my
   [DataManager] Fetching: calendar:events:{"end":"...","start":"..."}
   ```

4. **Переключите календарь** (Компания → Отдел → Компания)
5. Ищите логи:
   ```
   [DataManager] Cache HIT: calendar:events:{"end":"...","start":"..."}
   ```

### 4. Проверка дедупликации

1. **Console в DevTools**
2. **Быстро несколько раз** переключите календарь
3. Ищите логи:
   ```
   [DataManager] Request DEDUPED: calendar:events:...
   ```

## 📊 Метрики до/после

### ДО рефакторинга:
- **API запросов:** ~10-15
- **Дублирования:** 3-4x для departments, 2-3x для calendar
- **Время загрузки:** зависит от сети

### ПОСЛЕ рефакторинга:
- **API запросов:** 3-5 (первая загрузка)
- **Дублирования:** 0 (кеш + дедупликация)
- **Повторная загрузка:** мгновенная (кеш)

## 🐛 Отладка

### Проверить статистику кеша:

```javascript
// В консоли браузера
window.dataManager.getStats()
// → {cacheSize: 5, pendingCount: 0, subscribersCount: 0, keys: [...]}
```

### Очистить кеш вручную:

```javascript
window.dataManager.clear()
```

### Инвалидировать конкретные данные:

```javascript
// Календарь
window.dataManager.invalidatePattern(/^calendar:/)

// Отделы
window.dataManager.invalidate('departments:my')
```

## ⚠️ Возможные проблемы

### 1. "Старые данные в календаре"
**Причина:** Долгий TTL кеша (30 сек)  
**Решение:** Уменьшить TTL в `calendarApi.js` или добавить кнопку "Обновить"

### 2. "Календарь не загружается"
**Причина:** Ошибка в импортах модулей  
**Решение:** Проверить консоль на ошибки импорта

### 3. "Лог 'Cache HIT' не появляется"
**Причина:** Слишком короткий TTL или кеш очищается  
**Решение:** Проверить `dataManager.getStats()` в консоли

## 🚀 Следующие шаги

### Приоритет 2: Расширить кеширование

Добавить обертки для других API:
- `notificationsApi.js` - уведомления
- `postsApi.js` - посты ленты
- `employeesApi.js` - сотрудники

### Приоритет 3: Batch API

Создать endpoint для загрузки нескольких периодов календаря за 1 запрос:

```python
# backend/api/v1/views.py
class BatchCalendarEventsView(APIView):
    def post(self, request):
        ranges = request.data.get('ranges', [])
        result = {}
        for r in ranges:
            key = f"{r['start']}_{r['end']}"
            result[key] = get_events(r['start'], r['end'])
        return Response(result)
```

## 📝 Заметки

- Кеш хранится **в памяти** (очищается при перезагрузке страницы)
- TTL можно настроить для каждого запроса
- DataManager работает как singleton (один экземпляр на всё приложение)
- Дедупликация работает только для **одновременных** запросов