import { useState, useEffect } from "react";
import StartClass from "./components/StartClass";
import QuickAccess from "./components/QuickAccess";
import CalendarTaskModule from "./components/CalendarTaskModule";
import StudyStatus from "./components/StudyStatus";
import Rank from "@/components/Rank";
import StageProgress from "@/components/StageProgress";
import TaskList from "./components/TaskList";
import { getClassRanking, getLearningProgressSummary } from "@/services";
import "./index.css";

const Dashboard = () => {
  const [rankData, setRankData] = useState([]); // 班级排名数据

  // 获取整体学习进度
  const queryLearningProgressSummary = async () => {
    const res = await getLearningProgressSummary({ period: "semester" });
    console.log("learningProgressSummary", res);
  };

  // 获取班级排名
  const queryRankData = async () => {
    const res = await getClassRanking();
    if (res.success) {
      setRankData(res.data);
    }
  };

  useEffect(() => {
    queryRankData();
    queryLearningProgressSummary();
  }, []);

  return (
    <div className="dashboard">
      <StageProgress showBlockageAlert={true} />

      <div className="dashboard-grid">
        <StartClass />
        <QuickAccess />
        <CalendarTaskModule />
        <StudyStatus />
        <Rank data={rankData} />
        <TaskList />
      </div>
    </div>
  );
};

export default Dashboard;