import { ref, watch } from 'vue';
import { getTaskFragments, getTaskReports } from '@/api/studySessions';

/** 历史残片 / 历史报告共用的列表项形状（模板只消费这些字段） */
export interface SessionHistoryRecord {
    id: number;
    sessionNum: string;
    content: string;
    sessionExpectation?: string;
}

/**
 * 学习会话页的“历史学习记录”面板：按任务分页查询历史残片与报告，
 * 支持关键字搜索（300ms 防抖）与 tab 切换。
 */
export function useSessionHistory(taskNum: string) {
    const PAGE_SIZE = 10;

    const showHistory = ref(false);
    const historyTab = ref("fragments");
    const historyKeyword = ref("");
    let historyDebounce: ReturnType<typeof setTimeout> | null = null;
    const loadingHistory = ref(false);
    const historyFragments = ref<SessionHistoryRecord[]>([]);
    const fragmentsTotal = ref(0);
    const fragmentsPage = ref(1);
    const historyReports = ref<SessionHistoryRecord[]>([]);
    const reportsTotal = ref(0);
    const reportsPage = ref(1);

    watch(showHistory, (val) => {
        if (val) {
            // 展开时立即加载当前 tab 的数据
            if (historyTab.value === "fragments") loadHistoryFragments();
            else loadHistoryReports();
        }
    });

    const loadHistoryFragments = async () => {
        loadingHistory.value = true;
        try {
            const res = await getTaskFragments(taskNum, fragmentsPage.value, PAGE_SIZE, historyKeyword.value || undefined);
            const data = res?.data;
            historyFragments.value = data?.records || [];
            fragmentsTotal.value = data?.total || 0;
        } catch {
            historyFragments.value = [];
            fragmentsTotal.value = 0;
        } finally {
            loadingHistory.value = false;
        }
    };

    const loadHistoryReports = async () => {
        loadingHistory.value = true;
        try {
            const res = await getTaskReports(taskNum, reportsPage.value, PAGE_SIZE, historyKeyword.value || undefined);
            const data = res?.data;
            historyReports.value = data?.records || [];
            reportsTotal.value = data?.total || 0;
        } catch {
            historyReports.value = [];
            reportsTotal.value = 0;
        } finally {
            loadingHistory.value = false;
        }
    };

    const searchHistory = () => {
        if (historyDebounce) clearTimeout(historyDebounce);
        historyDebounce = setTimeout(() => {
            fragmentsPage.value = 1;
            reportsPage.value = 1;
            if (historyTab.value === "fragments") loadHistoryFragments();
            else loadHistoryReports();
        }, 300);
    };

    const onHistoryTabChange = () => {
        fragmentsPage.value = 1;
        reportsPage.value = 1;
        if (historyTab.value === "fragments") loadHistoryFragments();
        else loadHistoryReports();
    };

    const onFragmentsPageChange = (p: number) => {
        fragmentsPage.value = p;
        loadHistoryFragments();
    };

    const onReportsPageChange = (p: number) => {
        reportsPage.value = p;
        loadHistoryReports();
    };

    return {
        PAGE_SIZE,
        showHistory,
        historyTab,
        historyKeyword,
        loadingHistory,
        historyFragments,
        fragmentsTotal,
        fragmentsPage,
        historyReports,
        reportsTotal,
        reportsPage,
        searchHistory,
        onHistoryTabChange,
        onFragmentsPageChange,
        onReportsPageChange,
    };
}