<template>
    <div class="card">
        <Toast />
        <div class="flex justify-content-between align-items-center mb-4">
            <h1 class="text-2xl font-semibold m-0">Управление парсером</h1>
            <Button icon="pi pi-refresh" label="Обновить статус" @click="loadStatus" :loading="loading" severity="secondary" />
        </div>

        <!-- Статус системы -->
        <div class="grid mb-4">
            <div class="col-12 md:col-6">
                <Card>
                    <template #title>
                        <div class="flex align-items-center">
                            <i class="pi pi-cog mr-2"></i>
                            Статус сервиса
                        </div>
                    </template>
                    <template #content>
                        <div v-if="healthLoading" class="text-center py-3">
                            <ProgressSpinner size="30" />
                        </div>
                        <div v-else-if="health" class="space-y-3">
                            <div class="flex justify-content-between align-items-center">
                                <span class="font-medium">Статус:</span>
                                <Tag :value="health.status" :severity="health.status === 'UP' ? 'success' : 'danger'" />
                            </div>
                            <div class="flex justify-content-between align-items-center">
                                <span class="font-medium">Сервис:</span>
                                <span>{{ health.service }}</span>
                            </div>
                            <div class="flex justify-content-between align-items-center">
                                <span class="font-medium">Планировщик:</span>
                                <span>{{ health.scheduler }}</span>
                            </div>
                            <div class="flex justify-content-between align-items-center">
                                <span class="font-medium">Время:</span>
                                <span>{{ formatDate(health.timestamp) }}</span>
                            </div>
                        </div>
                        <div v-else class="text-center py-3 text-color-secondary">
                            <i class="pi pi-exclamation-triangle text-2xl mb-2"></i>
                            <p>Не удалось загрузить статус сервиса</p>
                        </div>
                    </template>
                </Card>
            </div>
            <div class="col-12 md:col-6">
                <Card>
                    <template #title>
                        <div class="flex align-items-center">
                            <i class="pi pi-database mr-2"></i>
                            Статус базы данных
                        </div>
                    </template>
                    <template #content>
                        <div v-if="mongoHealthLoading" class="text-center py-3">
                            <ProgressSpinner size="30" />
                        </div>
                        <div v-else-if="mongoHealth" class="space-y-3">
                            <div class="flex justify-content-between align-items-center">
                                <span class="font-medium">Статус:</span>
                                <Tag :value="mongoHealth.status" :severity="mongoHealth.status === 'UP' ? 'success' : 'danger'" />
                            </div>
                            <div class="flex justify-content-between align-items-center">
                                <span class="font-medium">Сообщение:</span>
                                <span class="text-sm">{{ mongoHealth.message }}</span>
                            </div>
                            <div class="flex justify-content-between align-items-center">
                                <span class="font-medium">Время:</span>
                                <span>{{ formatDate(mongoHealth.timestamp) }}</span>
                            </div>
                            <div v-if="mongoHealth.suggestion" class="mt-3 p-2 bg-orange-50 border-orange-200 rounded">
                                <div class="text-sm text-orange-800">
                                    <i class="pi pi-info-circle mr-1"></i>
                                    {{ mongoHealth.suggestion }}
                                </div>
                            </div>
                        </div>
                        <div v-else class="text-center py-3 text-color-secondary">
                            <i class="pi pi-exclamation-triangle text-2xl mb-2"></i>
                            <p>Не удалось загрузить статус базы данных</p>
                        </div>
                    </template>
                </Card>
            </div>
        </div>

        <!-- Управление парсингом -->
        <Card class="mb-4">
            <template #title>
                <div class="flex align-items-center">
                    <i class="pi pi-play mr-2"></i>
                    Запуск парсинга
                </div>
            </template>
            <template #content>
                <div class="grid">
                    <!-- Кнопка для всех источников -->
                    <div class="col-12 md:col-4">
                        <div class="text-center p-4 border-round bg-blue-50">
                            <i class="pi pi-globe text-blue-500 text-4xl mb-3"></i>
                            <h3 class="text-lg font-semibold mb-2">Все источники</h3>
                            <p class="text-sm text-color-secondary mb-3">Запустить парсинг всех доступных источников</p>
                            <Button label="Запустить все" icon="pi pi-play" @click="parseAll" :loading="parsingAll" severity="info" class="w-full" />
                        </div>
                    </div>

                    <!-- Динамические кнопки для каждого источника -->
                    <div v-if="sourcesLoading" class="col-12">
                        <div class="text-center py-4">
                            <ProgressSpinner size="30" />
                            <p class="mt-2 text-color-secondary">Загрузка источников...</p>
                        </div>
                    </div>
                    <div v-else-if="sources.length === 0" class="col-12">
                        <div class="text-center py-4">
                            <i class="pi pi-exclamation-triangle text-orange-500 text-4xl mb-3"></i>
                            <p class="text-color-secondary">Источники не найдены</p>
                        </div>
                    </div>
                    <div v-else v-for="(source, index) in sources" :key="source" class="col-12 md:col-4">
                        <div class="text-center p-4 border-round" :class="getSourceCardClass(index)">
                            <i :class="getSourceIcon(index)" class="text-4xl mb-3"></i>
                            <h3 class="text-lg font-semibold mb-2">{{ source }}</h3>
                            <p class="text-sm text-color-secondary mb-3">Запустить парсинг только {{ source }}</p>
                            <Button :label="`Запустить ${source}`" icon="pi pi-play" @click="parseSource(getSourceKey(source))" :loading="parsingSources[getSourceKey(source)]" :severity="getSourceSeverity(index)" class="w-full" />
                        </div>
                    </div>
                </div>
            </template>
        </Card>

        <!-- Результаты последнего парсинга -->
        <Card v-if="lastParseResult" class="mb-4">
            <template #title>
                <div class="flex align-items-center">
                    <i class="pi pi-check-circle mr-2"></i>
                    Результаты последнего парсинга
                </div>
            </template>
            <template #content>
                <div class="grid">
                    <div v-for="result in lastParseResult" :key="result.source" class="col-12 md:col-6">
                        <div class="p-3 border-round" :class="getResultCardClass(result.status)">
                            <div class="flex justify-content-between align-items-center mb-2">
                                <h4 class="text-lg font-semibold m-0">{{ result.source }}</h4>
                                <Tag :value="result.status" :severity="getStatusSeverity(result.status)" />
                            </div>
                            <div class="space-y-2">
                                <div class="flex justify-content-between">
                                    <span class="text-sm text-color-secondary">Обработано:</span>
                                    <span class="font-semibold">{{ result.processedItems }}</span>
                                </div>
                                <div class="flex justify-content-between">
                                    <span class="text-sm text-color-secondary">Всего в БД:</span>
                                    <span class="font-semibold">{{ result.totalItemsInDb }}</span>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </template>
        </Card>

        <!-- Статистика -->
        <Card class="mb-4">
            <template #title>
                <div class="flex align-items-center">
                    <i class="pi pi-chart-bar mr-2"></i>
                    Текущая статистика
                </div>
            </template>
            <template #content>
                <div v-if="statsLoading" class="text-center py-3">
                    <ProgressSpinner size="30" />
                </div>
                <div v-else-if="stats" class="grid">
                    <div class="col-12 md:col-3">
                        <div class="text-center p-3 border-round bg-blue-50">
                            <div class="text-2xl font-bold text-blue-900">{{ stats.totalItems || 0 }}</div>
                            <div class="text-sm text-blue-600">Всего новостей</div>
                        </div>
                    </div>
                    <div class="col-12 md:col-3">
                        <div class="text-center p-3 border-round bg-green-50">
                            <div class="text-2xl font-bold text-green-900">{{ sourceCount }}</div>
                            <div class="text-sm text-green-600">Источников</div>
                        </div>
                    </div>
                    <div class="col-12 md:col-3">
                        <div class="text-center p-3 border-round bg-orange-50">
                            <div class="text-2xl font-bold text-orange-900">{{ averagePerSource }}</div>
                            <div class="text-sm text-orange-600">Среднее на источник</div>
                        </div>
                    </div>
                    <div class="col-12 md:col-3">
                        <div class="text-center p-3 border-round bg-purple-50">
                            <div class="text-2xl font-bold text-purple-900">{{ formatDate(stats.lastUpdate) }}</div>
                            <div class="text-sm text-purple-600">Последнее обновление</div>
                        </div>
                    </div>
                </div>
                <div v-else class="text-center py-3 text-color-secondary">
                    <p>Не удалось загрузить статистику</p>
                </div>
            </template>
        </Card>

        <!-- Действия -->
        <div class="flex justify-content-center gap-2">
            <Button label="Перейти к новостям" icon="pi pi-arrow-right" @click="goToNews" severity="info" />
            <Button label="Статистика" icon="pi pi-chart-bar" @click="goToDashboard" severity="secondary" />
        </div>
    </div>
</template>

<script setup>
import NewsService from '@/service/NewsService';
import Button from 'primevue/button';
import Card from 'primevue/card';
import ProgressSpinner from 'primevue/progressspinner';
import Tag from 'primevue/tag';
import { useToast } from 'primevue/usetoast';
import { computed, onMounted, ref } from 'vue';
import { useRouter } from 'vue-router';

const router = useRouter();
const toast = useToast();

// Реактивные данные
const health = ref(null);
const mongoHealth = ref(null);
const stats = ref(null);
const sources = ref([]);
const groupedSources = ref({});
const lastParseResult = ref(null);
const loading = ref(false);
const healthLoading = ref(false);
const mongoHealthLoading = ref(false);
const statsLoading = ref(false);
const sourcesLoading = ref(false);
const parsingAll = ref(false);
const parsingSources = ref({});

// Вычисляемые свойства
const sourceCount = computed(() => {
    return stats.value?.sourceStatistics ? Object.keys(stats.value.sourceStatistics).length : 0;
});

const averagePerSource = computed(() => {
    if (!stats.value?.sourceStatistics || sourceCount.value === 0) return 0;
    const total = Object.values(stats.value.sourceStatistics).reduce((sum, count) => sum + count, 0);
    return Math.round(total / sourceCount.value);
});

// Методы
const loadStatus = async () => {
    loading.value = true;
    try {
        await Promise.all([loadHealth(), loadMongoHealth(), loadStats(), loadSources()]);
    } finally {
        loading.value = false;
    }
};

const loadHealth = async () => {
    healthLoading.value = true;
    try {
        const response = await NewsService.getHealth();
        if (response.success) {
            health.value = response.data;
        }
    } catch (error) {
        console.error('Ошибка при загрузке статуса сервиса:', error);
    } finally {
        healthLoading.value = false;
    }
};

const loadMongoHealth = async () => {
    mongoHealthLoading.value = true;
    try {
        const response = await NewsService.getMongoHealth();
        if (response.success) {
            mongoHealth.value = response.data;
        }
    } catch (error) {
        console.error('Ошибка при загрузке статуса MongoDB:', error);
    } finally {
        mongoHealthLoading.value = false;
    }
};

const loadStats = async () => {
    statsLoading.value = true;
    try {
        const response = await NewsService.getStats();
        if (response.success) {
            stats.value = response.data;
        }
    } catch (error) {
        console.error('Ошибка при загрузке статистики:', error);
    } finally {
        statsLoading.value = false;
    }
};

const loadSources = async () => {
    sourcesLoading.value = true;
    try {
        const response = await NewsService.getSources();
        if (response.success) {
            // Группируем источники по source_name
            const groupedSourcesData = response.data.reduce((groups, source) => {
                const sourceName = source.source_name || source; // Поддержка как объектов, так и строк
                if (!groups[sourceName]) {
                    groups[sourceName] = [];
                }
                groups[sourceName].push(source);
                return groups;
            }, {});

            console.log('Загруженные источники:', response.data);
            console.log('Сгруппированные источники:', groupedSourcesData);

            // Сохраняем сгруппированные данные
            groupedSources.value = groupedSourcesData;

            // Преобразуем в массив для отображения
            sources.value = Object.keys(groupedSourcesData);
        }
    } catch (error) {
        console.error('Ошибка при загрузке источников:', error);
        toast.add({
            severity: 'error',
            summary: 'Ошибка',
            detail: 'Не удалось загрузить список источников',
            life: 3000
        });
    } finally {
        sourcesLoading.value = false;
    }
};

const parseAll = async () => {
    parsingAll.value = true;
    try {
        const response = await NewsService.parseAll();
        if (response.success) {
            lastParseResult.value = response.data;
            toast.add({
                severity: 'success',
                summary: 'Успешно',
                detail: 'Парсинг всех источников завершен успешно',
                life: 3000
            });
            // Обновить статистику
            await loadStats();
        }
    } catch (error) {
        console.error('Ошибка при запуске парсинга всех источников:', error);
        toast.add({
            severity: 'error',
            summary: 'Ошибка',
            detail: error.message || 'Ошибка при запуске парсинга всех источников',
            life: 5000
        });
    } finally {
        parsingAll.value = false;
    }
};

const parseSource = async (source) => {
    parsingSources.value[source] = true;

    try {
        const response = await NewsService.parseSource(source);
        if (response.success) {
            toast.add({
                severity: 'success',
                summary: 'Успешно',
                detail: `Парсинг источника ${source} завершен успешно`,
                life: 3000
            });
            // Обновить статистику
            await loadStats();
        }
    } catch (error) {
        console.error(`Ошибка при запуске парсинга источника ${source}:`, error);
        toast.add({
            severity: 'error',
            summary: 'Ошибка',
            detail: error.message || `Ошибка при запуске парсинга источника ${source}`,
            life: 5000
        });
    } finally {
        parsingSources.value[source] = false;
    }
};

const getResultCardClass = (status) => {
    switch (status) {
        case 'completed':
            return 'bg-green-50 border-green-200';
        case 'failed':
            return 'bg-red-50 border-red-200';
        case 'in_progress':
            return 'bg-yellow-50 border-yellow-200';
        default:
            return 'bg-gray-50 border-gray-200';
    }
};

const getStatusSeverity = (status) => {
    switch (status) {
        case 'completed':
            return 'success';
        case 'failed':
            return 'danger';
        case 'in_progress':
            return 'warning';
        default:
            return 'info';
    }
};

// Вспомогательные методы для источников
const getSourceKey = (sourceName) => {
    // Маппинг названий источников на ключи API
    const sourceMap = {
        'Kursiv Media': 'kursiv',
        'Kapital.kz': 'kapital',
        'LSM.kz': 'lsm',
        РБК: 'rbc',
        Ведомости: 'vedomosti'
    };

    // Сначала проверяем точное совпадение
    if (sourceMap[sourceName]) {
        return sourceMap[sourceName];
    }

    // Затем проверяем частичные совпадения (регистронезависимо)
    const lowerSourceName = sourceName.toLowerCase();
    for (const [key, value] of Object.entries(sourceMap)) {
        if (key.toLowerCase().includes(lowerSourceName) || lowerSourceName.includes(key.toLowerCase())) {
            return value;
        }
    }

    // Если ничего не найдено, создаем ключ из названия
    return sourceName.toLowerCase().replace(/[^a-z0-9]/g, '');
};

const getSourceCardClass = (index) => {
    const classes = ['bg-green-50', 'bg-orange-50', 'bg-purple-50', 'bg-red-50', 'bg-cyan-50'];
    return classes[index % classes.length];
};

const getSourceIcon = (index) => {
    const icons = ['pi pi-building text-green-500', 'pi pi-briefcase text-orange-500', 'pi pi-chart-line text-purple-500', 'pi pi-newspaper text-red-500', 'pi pi-globe text-cyan-500'];
    return icons[index % icons.length];
};

const getSourceSeverity = (index) => {
    const severities = ['success', 'warning', 'help', 'danger', 'info'];
    return severities[index % severities.length];
};

const formatDate = (timestamp) => {
    if (!timestamp) return 'Неизвестно';
    return NewsService.formatDate(new Date(timestamp).toISOString());
};

const goToNews = () => {
    router.push('/news');
};

const goToDashboard = () => {
    router.push('/news/dashboard');
};

// Жизненный цикл
onMounted(() => {
    loadStatus();
});
</script>

<style scoped>
.space-y-2 > * + * {
    margin-top: 0.5rem;
}

.space-y-3 > * + * {
    margin-top: 0.75rem;
}
</style>
