feat: 🎸 新增了一个全局加载组件

src/pages/CompanyJobsPage/index.jsx

@@ -1,27 +1,25 @@
-import { useState, useEffect } from "react";
+import { useState, useEffect, useCallback } from "react";
 import { useNavigate } from "react-router-dom";
 import { jobAPI, interviewAPI, studentAPI } from "@/services/api";
 import { mapJobList, mapInterviewList } from "@/utils/dataMapper";
 import JobList from "./components/JobList";
-
+import { useDispatch } from "react-redux";
+import { setLoadingTrue, setLoadingFalse } from "@/store/slices/loadingSlice";
+// 从Redux store中获取loading状态
 import "./index.css";
 
 const CompanyJobsPage = () => {
+  const dispatch = useDispatch();
+
   const [jobs, setJobs] = useState([]);
   const [interviews, setInterviews] = useState([]);
-  const [loading, setLoading] = useState(true);
   const [isExpand, setIsExpand] = useState(false); // 是否展开
 
   const navigate = useNavigate();
 
-  useEffect(() => {
-    fetchData();
-  }, []);
-
   const fetchData = async () => {
     try {
-      setLoading(true);
-
+      dispatch(setLoadingTrue());
       // Get current user's student ID from API
       let studentId = null;
       try {
@@ -59,12 +57,14 @@ const CompanyJobsPage = () => {
       setJobs(mappedJobs);
       setInterviews(mappedInterviews);
     } catch (error) {
+      dispatch(setLoadingFalse());
+
       console.error("Failed to fetch data:", error);
       // Fallback to empty data
       setJobs([]);
       setInterviews([]);
     } finally {
-      setLoading(false);
+      dispatch(setLoadingFalse());
     }
   };
 
@@ -72,18 +72,9 @@ const CompanyJobsPage = () => {
     navigate("/company-jobs-list");
   };
 
-  if (loading) {
-    return (
-      <div className="company-jobs-page-wrapper">
-        <div
-          className="company-jobs-page"
-          style={{ justifyContent: "center", alignItems: "center" }}
-        >
-          <p>加载中...</p>
-        </div>
-      </div>
-    );
-  }
+  useEffect(() => {
+    fetchData();
+  }, []);
 
   return (
     <div className="company-jobs-page-wrapper">