feat: 实现查看团队成员模态框

src/pages/admin/TeamDetailModal.jsx

@@ -0,0 +1,33 @@
+import { List, Modal, Typography } from "antd";
+import { useEffect, useState } from "react";
+import axiosInstance from "../../api/axios";
+
+export default function TeamDetailModal({ open, team, onclose }) {
+  const [data, setData] = useState([]);
+
+  const fetchData = async () => {
+    const data = await axiosInstance.get(`/user-team/${team.id}`);
+    setData(data);
+  };
+
+  useEffect(() => {
+    if (open) {
+      fetchData();
+    }
+  }, [open, team]);
+
+  return (
+    <Modal
+      open={open}
+      onCancel={() => {
+        onclose();
+      }}
+    >
+      <List
+        header={<div>{team?.name}</div>}
+        dataSource={data}
+        renderItem={(item) => <List.Item>{item}</List.Item>}
+      />
+    </Modal>
+  );
+}

src/pages/admin/TeamManage.jsx

@@ -3,6 +3,7 @@ import Column from "antd/es/table/Column";
 import { useEffect, useState } from "react";
 import axiosInstance from "../../api/axios";
 import TeamDeleteButton from "../../components/TeamDeleteButton";
+import TeamDetailModal from "./TeamDetailModal";
 
 export default function TeamManage() {
   const [teams, setTeams] = useState([]);
@@ -11,6 +12,8 @@ export default function TeamManage() {
   const [editingId, setEditingId] = useState();
   const [editingName, setEditingName] = useState("");
   const [newTeamName, setNewTeamName] = useState();
+  const [open, setOpen] = useState(false);
+  const [selectedTeam, setSelectedTeam] = useState(null);
 
   const fetchData = async () => {
     const data = await axiosInstance.get("/teams");
@@ -124,6 +127,15 @@ export default function TeamManage() {
                     编辑
                   </Button>
                 )}
+                <Button
+                  size="small"
+                  onClick={() => {
+                    setSelectedTeam(record);
+                    setOpen(true);
+                  }}
+                >
+                  人员列表
+                </Button>
                 <TeamDeleteButton
                   record={record}
                   onConfirm={() => handleDelete(record)}
@@ -133,6 +145,14 @@ export default function TeamManage() {
           }}
         />
       </Table>
+      <TeamDetailModal
+        open={open}
+        team={selectedTeam}
+        onclose={() => {
+          setOpen(false);
+          setSelectedTeam(null);
+        }}
+      />
     </>
   );
 }