From b44f15f5532ebb4f4ad7ecd815b3d9abf8a6228a Mon Sep 17 00:00:00 2001
From: ohinhyuk <8156217@naver.com>
Date: Tue, 24 Oct 2023 03:36:41 +0900
Subject: [PATCH 1/3] =?UTF-8?q?Fix:=20=EA=B7=B8=EB=A3=B9=20=EB=A7=A4?=
 =?UTF-8?q?=EC=B9=AD=20=EA=B4=80=EB=A6=AC=20=EA=B7=B8=EB=A3=B9=20=EB=AF=B8?=
 =?UTF-8?q?=EB=B0=B0=EC=A0=95=20=ED=95=99=EC=83=9D=20=EC=9D=B4=EB=A9=94?=
 =?UTF-8?q?=EC=9D=BC=20=EC=A0=95=EB=B3=B4=20=EC=B6=94=EA=B0=80(#78)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/Manager/CreateGroupTable.js    |  23 +-
 .../src/components/Manager/UnGroupTable.js    | 199 ++++++++----------
 2 files changed, 109 insertions(+), 113 deletions(-)

diff --git a/histudy-front/src/components/Manager/CreateGroupTable.js b/histudy-front/src/components/Manager/CreateGroupTable.js
index 98be89a..fbe4508 100644
--- a/histudy-front/src/components/Manager/CreateGroupTable.js
+++ b/histudy-front/src/components/Manager/CreateGroupTable.js
@@ -21,6 +21,7 @@ export default function CreateGroupTable({
   const TableHead = {
     all: [
       "이름",
+      "이메일",
       "학번",
       "희망 1과목",
       "희망 2과목",
@@ -105,7 +106,6 @@ export default function CreateGroupTable({
               >
                 {row.name}
               </Box>
-
               <Box
                 sx={{
                   color: "text.secondary",
@@ -119,6 +119,22 @@ export default function CreateGroupTable({
                   py: "20px",
                   borderColor: "primary.border",
                 }}
+              >
+                {row.email}
+              </Box>
+              <Box
+                sx={{
+                  color: "text.secondary",
+                  display: "flex",
+                  flexGrow: 1,
+                  // width: "50px",
+                  marginLeft: "20px",
+                  textOverflow: "ellipsis",
+                  overflowX: "auto",
+                  whiteSpace: "nowrap",
+                  py: "20px",
+                  borderColor: "primary.border",
+                }}
               >
                 {row.sid}
               </Box>
@@ -147,7 +163,7 @@ export default function CreateGroupTable({
                 {row.courses.map((subject, index) => (
                   <Typography
                     sx={{
-                      minWidth: "150px",
+                      minWidth: "80px",
                     }}
                   >
                     {subject.name} ({subject.prof})
@@ -156,7 +172,7 @@ export default function CreateGroupTable({
                 {fillThree(row.courses.length).map((subject, index) => (
                   <Typography
                     sx={{
-                      minWidth: "150px",
+                      minWidth: "80px",
                     }}
                   >
                     {subject}
@@ -170,6 +186,7 @@ export default function CreateGroupTable({
                   display: "flex",
                   flexGrow: 1,
                   py: "20px",
+                  ml: "10px",
                   borderColor: "primary.border",
                 }}
               >
diff --git a/histudy-front/src/components/Manager/UnGroupTable.js b/histudy-front/src/components/Manager/UnGroupTable.js
index 9731f23..4d4b88c 100644
--- a/histudy-front/src/components/Manager/UnGroupTable.js
+++ b/histudy-front/src/components/Manager/UnGroupTable.js
@@ -30,11 +30,12 @@ export default function UnGroupTable({
   const TableHead = {
     group: [
       "그룹",
-      "이름",
+      "학생 정보",
       "희망 1과목",
       "희망 2과목",
       "희망 3과목",
       "함께하고 싶은 친구",
+      "수정",
     ],
   };
 
@@ -78,6 +79,7 @@ export default function UnGroupTable({
           sx={{
             color: "text.secondary",
             display: "flex",
+            justifyContent: "space-between",
             py: "20px",
             borderBottom: 1,
             borderColor: "primary.main",
@@ -87,11 +89,13 @@ export default function UnGroupTable({
           {TableHead[type].map((headElement, index) => (
             <Typography
               key={index}
-              sx={{
-                // flexGrow: 1,
-                // width: longWidthColumnNum === index + 1 && "50%",
-                minWidth: "150px",
-              }}
+              sx={
+                {
+                  // flexGrow: 1,
+                  // width: longWidthColumnNum === index + 1 && "50%",
+                  // minWidth: "150px",
+                }
+              }
             >
               {headElement}
             </Typography>
@@ -104,108 +108,98 @@ export default function UnGroupTable({
                 key={index}
                 sx={{
                   display: "flex",
+                  px: "50px",
+                  justifyContent: "space-between",
                   borderTop: index !== 0 && 1,
-                  // py: "20px",
+                  alignItems: "center",
                   borderColor: "primary.border",
                 }}
               >
                 <Box
                   sx={{
-                    display: "flex",
-                    alignItems: "center",
-                    flexGrow: 1,
+                    color: "text.secondary",
+                    borderColor: "primary.border",
                   }}
                 >
-                  <Box
-                    sx={{
-                      color: "text.secondary",
-                      display: "flex",
-                      flexGrow: 1,
-                      minWidth: "100px",
-                      marginLeft: "50px",
-                      textOverflow: "ellipsis",
-                      overflowX: "auto",
-                      whiteSpace: "nowrap",
-                      // py: "20px",
-                      borderColor: "primary.border",
-                    }}
-                  >
-                    미배정
-                  </Box>
-
-                  <Box
-                    sx={{
-                      color: "text.secondary",
-                      display: "flex",
-                      // flexGrow: 1,
-                      width: "150px",
-                      textOverflow: "ellipsis",
-                      // overflowX: "auto",
-                      whiteSpace: "nowrap",
-                      py: "20px",
-                      borderColor: "primary.border",
-                      // justifyContent: "center",
-                    }}
-                  >
-                    {row.name},{row.sid}
-                  </Box>
+                  미배정
+                </Box>
 
-                  <Box
+                <Select
+                  sx={{
+                    minWidth: "100px",
+                    color: "text.secondary",
+                    display: "flex",
+                    textOverflow: "ellipsis",
+                    whiteSpace: "nowrap",
+                    borderColor: "primary.border",
+                  }}
+                  defaultValue={10}
+                >
+                  <MenuItem value={10}>{row.name}</MenuItem>
+                  <MenuItem value={20}>{row.sid}</MenuItem>
+                  <MenuItem value={30}>{row.email}</MenuItem>
+                </Select>
+                {/* <Box
                     sx={{
                       color: "text.secondary",
                       display: "flex",
+                      
                       flexGrow: 1,
                       marginLeft: "20px",
                       py: "20px",
                       borderColor: "primary.border",
-                      gap: "20px",
+                      // gap: "20px",
                     }}
+                  > */}
+                {row.courses.map((subject, index) => (
+                  <Box
+                    sx={
+                      {
+                        // minWidth: "150px",
+                      }
+                    }
                   >
-                    {row.courses.map((subject, index) => (
-                      <Typography
-                        sx={{
-                          minWidth: "150px",
-                        }}
-                      >
-                        {subject.name} ({subject.prof})
-                      </Typography>
-                    ))}
-                    {fillThree(row.courses.length).map((subject, index) => (
-                      <Typography
-                        sx={{
-                          minWidth: "150px",
-                        }}
-                      >
-                        {subject}
-                      </Typography>
-                    ))}
+                    {subject.name} ({subject.prof})
                   </Box>
-
+                ))}
+                {fillThree(row.courses.length).map((subject, index) => (
                   <Box
-                    sx={{
-                      color: "text.secondary",
-                      display: "flex",
-                      flexGrow: 1,
-                      py: "20px",
-                      borderColor: "primary.border",
-                    }}
+                    sx={
+                      {
+                        // minWidth: "80px",
+                      }
+                    }
                   >
-                    <Select
-                      sx={{ width: "170px", color: "text.secondary" }}
-                      value={row.friends.length > 0 ? row.friends[0].name : ""}
-                    >
-                      {row.friends.map((friend, index) => (
-                        <MenuItem key={index} value={friend.name}>
-                          <Typography>
-                            {friend.name}, {friend.sid}
-                          </Typography>
-                        </MenuItem>
-                      ))}
-                    </Select>
+                    {subject}
                   </Box>
-                </Box>
+                ))}
+                {/* </Box> */}
+
+                {/* <Box
+                  sx={{
+                    color: "text.secondary",
+                    display: "flex",
+                    flexGrow: 1,
+                    py: "20px",
+                    borderColor: "primary.border",
+                  }}
+                > */}
+                <Select
+                  sx={{ color: "text.secondary", width: "150px" }}
+                  value={row.friends.length > 0 ? row.friends[0].name : ""}
+                >
+                  {row.friends.map((friend, index) => (
+                    <MenuItem key={index} value={friend.name}>
+                      <Typography>
+                        {friend.name}, {friend.sid}
+                      </Typography>
+                    </MenuItem>
+                  ))}
+                </Select>
+                {/* </Box> */}
+                {/* </Box> */}
 
-                <Box sx={{ marginRight: "20px", py: "25px" }}>
+                <Box sx={{ py: "25px" }}>
                   <IconButton
                     onClick={() => {
                       handleEdit(index);
@@ -233,6 +227,7 @@ export default function UnGroupTable({
                     display: "flex",
                     alignItems: "center",
                     flexGrow: 1,
+                    px: "20px",
                   }}
                 >
                   <Box
@@ -240,45 +235,29 @@ export default function UnGroupTable({
                       color: "text.secondary",
                       display: "flex",
                       flexGrow: 1,
-                      marginLeft: "20px",
-                      textOverflow: "ellipsis",
-                      overflowX: "auto",
-                      whiteSpace: "nowrap",
                       borderColor: "primary.border",
+                      mr: "10px",
                     }}
                   >
                     <GroupSelector setTeam={setTeam} />
                   </Box>
 
-                  <Box
+                  <Select
                     sx={{
+                      minWidth: "100px",
                       color: "text.secondary",
                       display: "flex",
-                      flexGrow: 1,
-                      width: "120px",
-                      marginLeft: "50px",
-
                       textOverflow: "ellipsis",
-                      overflowX: "auto",
                       whiteSpace: "nowrap",
-                      // py: "20px",
+
                       borderColor: "primary.border",
                     }}
+                    defaultValue={10}
                   >
-                    {row.name},
-                    <TextField
-                      sx={{
-                        width: "100px",
-                        "& input": {
-                          height: "10px",
-                        },
-                      }}
-                      defaultValue={row.sid}
-                      onChange={(e) => {
-                        setSid(e.target.value);
-                      }}
-                    ></TextField>
-                  </Box>
+                    <MenuItem value={10}>{row.name}</MenuItem>
+                    <MenuItem value={20}>{row.sid}</MenuItem>
+                    <MenuItem value={30}>{row.email}</MenuItem>
+                  </Select>
 
                   <Box
                     sx={{

From 86b6a3b30910d4693165c68e43ed27db02361ed5 Mon Sep 17 00:00:00 2001
From: ohinhyuk <8156217@naver.com>
Date: Tue, 24 Oct 2023 03:55:07 +0900
Subject: [PATCH 2/3] =?UTF-8?q?Fix:=20=EA=B7=B8=EB=A3=B9=20=EB=AF=B8?=
 =?UTF-8?q?=EC=B9=AD=EA=B4=80=EB=A6=AC=20=EA=B7=B8=EB=A3=B9=20=EB=B0=B0?=
 =?UTF-8?q?=EC=A0=95=20=ED=95=99=EC=83=9D=20=EC=9D=B4=EB=A9=94=EC=9D=BC=20?=
 =?UTF-8?q?=EC=A0=95=EB=B3=B4=EC=B6=94=EA=B0=80(#78)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/components/Manager/GroupTables.js     | 82 ++++++-------------
 .../src/components/Manager/UnGroupTable.js    | 25 +++---
 2 files changed, 36 insertions(+), 71 deletions(-)

diff --git a/histudy-front/src/components/Manager/GroupTables.js b/histudy-front/src/components/Manager/GroupTables.js
index 88b225a..4523558 100644
--- a/histudy-front/src/components/Manager/GroupTables.js
+++ b/histudy-front/src/components/Manager/GroupTables.js
@@ -44,11 +44,12 @@ export default function GroupTables({
   const TableHead = {
     group: [
       "그룹",
-      "멤버",
+      "학생 정보",
       "희망 1과목",
       "희망 2과목",
       "희망 3과목",
       "함께하고 싶은 친구",
+      "수정",
     ],
   };
   const [edit, setEdit] = useState([false]);
@@ -79,9 +80,10 @@ export default function GroupTables({
     <Box>
       <Box
         sx={{
+          minWidth: "1000px",
           maxHeight: "60vh",
           overflow: "scroll",
-          py: "5px",
+          py: "30px",
           border: 1,
           backgroundColor: "primary.default",
           borderColor: "primary.main",
@@ -93,19 +95,14 @@ export default function GroupTables({
           sx={{
             color: "text.secondary",
             display: "flex",
-            py: "20px",
+            justifyContent: "space-between",
+            py: "0px",
             borderColor: "primary.border",
-            px: "30px",
+            px: "50px",
           }}
         >
           {TableHead[type].map((headElement, index) => (
-            <Typography
-              key={index}
-              sx={{
-                flexGrow: 1,
-                minWidth: "150px",
-              }}
-            >
+            <Typography key={index} sx={{}}>
               {headElement}
             </Typography>
           ))}
@@ -138,82 +135,54 @@ export default function GroupTables({
                         sx={{
                           color: "text.secondary",
                           display: "flex",
-                          flexGrow: 4,
+                          alignItems: "center",
+                          justifyContent: "space-between",
+                          gap: "10px",
+                          px: "10px",
+                          borderBottom: 1,
+                          borderColor: "primary.border",
                         }}
                       >
                         <Box
                           key="Group"
                           sx={{
                             color: "text.secondary",
-                            display: "flex",
-                            flexGrow: 1,
-                            width: "150px",
-                            borderBottom: 1,
-                            marginTop: "20px",
+                            width: "50px",
                             py: "20px",
                             borderColor: "primary.border",
                           }}
                         >
                           <Typography>Group{row.tag}</Typography>
                         </Box>
-                        <Box
+                        <Select
                           sx={{
+                            minWidth: "100px",
                             color: "text.secondary",
-                            display: "flex",
-                            flexGrow: 1,
-                            borderBottom: 1,
-                            py: "20px",
-                            marginTop: "20px",
-                            width: "150px",
                             borderColor: "primary.border",
                           }}
+                          defaultValue={10}
                         >
-                          {index > 0 && ", "}
-                          <Typography>{student.name},</Typography>
-                          <Typography>{student.sid}</Typography>
-                        </Box>
+                          <MenuItem value={10}>{student.name}</MenuItem>
+                          <MenuItem value={20}>{student.sid}</MenuItem>
+                          <MenuItem value={30}>{student.email}</MenuItem>
+                        </Select>
                         <Box
                           sx={{
                             color: "text.secondary",
                             display: "flex",
-                            flexGrow: 1,
-                            py: "20px",
-                            borderBottom: 1,
                             borderColor: "primary.border",
                             alignItems: "center",
                             gap: "20px",
                           }}
                         >
-                          {/* <Select
-                            sx={{ width: "170px", color: "text.secondary" }}
-                            value={
-                              student.courses.length > 0
-                                ? student.courses[0].name
-                                : ""
-                            }
-                          >
-                            {student.courses.map((subject, index) => (
-                              <MenuItem key={index} value={subject.name}>
-                                <Typography>{subject.name}</Typography>
-                              </MenuItem>
-                            ))}
-                          </Select> */}
                           {student.courses.map((subject, index) => (
-                            <Typography
-                              sx={{
-                                minWidth: "150px",
-                              }}
-                            >
+                            <Typography sx={{ width: "120px" }}>
                               {subject.name} ({subject.prof})
                             </Typography>
                           ))}
                           {fillThree(student.courses.length).map(
                             (subject, index) => (
-                              <Typography
-                                sx={{
-                                  minWidth: "150px",
-                                }}
-                              >
+                              <Typography sx={{ minWidth: "120px" }}>
                                 {subject}
                               </Typography>
                             )
@@ -223,9 +192,7 @@ export default function GroupTables({
                           sx={{
                             color: "text.secondary",
                             display: "flex",
-                            flexGrow: 1,
                             py: "20px",
-                            borderBottom: 1,
                             borderColor: "primary.border",
                           }}
                         >
@@ -251,7 +218,6 @@ export default function GroupTables({
                             color: "text.secondary",
                             display: "flex",
                             // flexGrow: 1,
-                            borderBottom: 1,
                             borderColor: "primary.border",
                           }}
                         >
diff --git a/histudy-front/src/components/Manager/UnGroupTable.js b/histudy-front/src/components/Manager/UnGroupTable.js
index 4d4b88c..e3991ff 100644
--- a/histudy-front/src/components/Manager/UnGroupTable.js
+++ b/histudy-front/src/components/Manager/UnGroupTable.js
@@ -65,7 +65,9 @@ export default function UnGroupTable({
     <>
       <Box
         sx={{
+          minWidth: "1000px",
           maxHeight: "60vh",
+
           overflow: "scroll",
           py: "5px",
           border: 1,
@@ -83,7 +85,7 @@ export default function UnGroupTable({
             py: "20px",
             borderBottom: 1,
             borderColor: "primary.main",
-            px: "60px",
+            px: "50px",
           }}
         >
           {TableHead[type].map((headElement, index) => (
@@ -109,6 +111,7 @@ export default function UnGroupTable({
                 sx={{
                   display: "flex",
                   px: "50px",
+                  gap: "10px",
                   justifyContent: "space-between",
                   borderTop: index !== 0 && 1,
                   alignItems: "center",
@@ -153,22 +156,18 @@ export default function UnGroupTable({
                   > */}
                 {row.courses.map((subject, index) => (
                   <Box
-                    sx={
-                      {
-                        // minWidth: "150px",
-                      }
-                    }
+                    sx={{
+                      width: "120px",
+                    }}
                   >
                     {subject.name} ({subject.prof})
                   </Box>
                 ))}
                 {fillThree(row.courses.length).map((subject, index) => (
                   <Box
-                    sx={
-                      {
-                        // minWidth: "80px",
-                      }
-                    }
+                    sx={{
+                      width: "120px",
+                    }}
                   >
                     {subject}
                   </Box>
@@ -286,7 +285,7 @@ export default function UnGroupTable({
                     {row.courses.map((subject, index) => (
                       <Typography
                         sx={{
-                          minWidth: "150px",
+                          minWidth: "120px",
                         }}
                       >
                         {subject.name} ({subject.prof})
@@ -295,7 +294,7 @@ export default function UnGroupTable({
                     {fillThree(row.courses.length).map((subject, index) => (
                       <Typography
                         sx={{
-                          minWidth: "150px",
+                          minWidth: "120px",
                         }}
                       >
                         {subject}

From 8c81bb7c7ebe9b48b7819edc77cdbb2a40697178 Mon Sep 17 00:00:00 2001
From: ohinhyuk <8156217@naver.com>
Date: Tue, 24 Oct 2023 04:27:55 +0900
Subject: [PATCH 3/3] =?UTF-8?q?Fix:=20managerStudent=20=ED=8E=98=EC=9D=B4?=
 =?UTF-8?q?=EC=A7=80=20=EC=9D=B4=EB=A9=94=EC=9D=BC=20=EC=B6=94=EA=B0=80=20?=
 =?UTF-8?q?+=20=EC=97=91=EC=85=80=20=EB=8B=A4=EC=9A=B4=EB=A1=9C=EB=93=9C?=
 =?UTF-8?q?=20=EC=8B=9C=20=EC=9D=B4=EB=A9=94=EC=9D=BC=20=EC=B6=94=EA=B0=80?=
 =?UTF-8?q?(#78)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/Manager/CreateGroupTable.js    | 170 +++++++-----------
 .../components/Manager/StudentListTable.js    | 138 ++++++--------
 .../src/components/Manager/UnGroupTable.js    |  11 +-
 .../src/pages/Manager/ManageStudent.js        |   5 +-
 4 files changed, 127 insertions(+), 197 deletions(-)

diff --git a/histudy-front/src/components/Manager/CreateGroupTable.js b/histudy-front/src/components/Manager/CreateGroupTable.js
index fbe4508..1faaa24 100644
--- a/histudy-front/src/components/Manager/CreateGroupTable.js
+++ b/histudy-front/src/components/Manager/CreateGroupTable.js
@@ -20,13 +20,12 @@ export default function CreateGroupTable({
   };
   const TableHead = {
     all: [
-      "이름",
-      "이메일",
-      "학번",
+      "학생 정보",
       "희망 1과목",
       "희망 2과목",
       "희망 3과목",
       "함께하고 싶은 친구",
+      "삭제",
     ],
   };
 
@@ -54,6 +53,7 @@ export default function CreateGroupTable({
           sx={{
             color: "text.secondary",
             display: "flex",
+            justifyContent: "space-between",
             py: "20px",
 
             borderColor: "primary.main",
@@ -63,11 +63,13 @@ export default function CreateGroupTable({
           {TableHead[type].map((headElement, index) => (
             <Typography
               key={index}
-              sx={{
-                flexGrow: 1,
-                width: longWidthColumnNum === index + 1 && "50%",
-                minWidth: longWidthColumnNum !== index + 1 && "150px",
-              }}
+              sx={
+                {
+                  // flexGrow: 1,
+                  // width: longWidthColumnNum === index + 1 && "50%",
+                  // minWidth: longWidthColumnNum !== index + 1 && "150px",
+                }
+              }
             >
               {headElement}
             </Typography>
@@ -78,79 +80,43 @@ export default function CreateGroupTable({
             key={index}
             sx={{
               display: "flex",
+              justifyContent: "space-between",
+              alignItems: "center",
+              px: "50px",
               borderTop: index !== 0 && 1,
-              // py: "20px",
               borderColor: "primary.border",
             }}
           >
-            <Box
+            {/* <Box
               sx={{
                 display: "flex",
                 alignItems: "center",
-                flexGrow: 1,
               }}
+            > */}
+            <Select
+              sx={{
+                minWidth: "100px",
+                color: "text.secondary",
+                display: "flex",
+                borderColor: "primary.border",
+              }}
+              defaultValue={10}
             >
-              <Box
-                sx={{
-                  color: "text.secondary",
-                  display: "flex",
-                  flexGrow: 1,
-                  width: "50px",
-                  textOverflow: "ellipsis",
-                  overflowX: "auto",
-                  whiteSpace: "nowrap",
-                  py: "20px",
-                  borderColor: "primary.border",
-                  marginLeft: "55px",
-                }}
-              >
-                {row.name}
-              </Box>
-              <Box
-                sx={{
-                  color: "text.secondary",
-                  display: "flex",
-                  flexGrow: 1,
-                  // width: "50px",
-                  marginLeft: "70px",
-                  textOverflow: "ellipsis",
-                  overflowX: "auto",
-                  whiteSpace: "nowrap",
-                  py: "20px",
-                  borderColor: "primary.border",
-                }}
-              >
-                {row.email}
-              </Box>
-              <Box
-                sx={{
-                  color: "text.secondary",
-                  display: "flex",
-                  flexGrow: 1,
-                  // width: "50px",
-                  marginLeft: "20px",
-                  textOverflow: "ellipsis",
-                  overflowX: "auto",
-                  whiteSpace: "nowrap",
-                  py: "20px",
-                  borderColor: "primary.border",
-                }}
-              >
-                {row.sid}
-              </Box>
+              <MenuItem value={10}>{row.name}</MenuItem>
+              <MenuItem value={20}>{row.sid}</MenuItem>
+              <MenuItem value={30}>{row.email}</MenuItem>
+            </Select>
 
-              <Box
+            {/* <Box
                 sx={{
                   color: "text.secondary",
                   display: "flex",
-                  flexGrow: 1,
-                  marginLeft: "20px",
                   py: "20px",
                   borderColor: "primary.border",
                   gap: "30px",
                 }}
-              >
-                {/* <Select
+              > */}
+            {/* <Select
                   sx={{ width: "170px", color: "text.secondary" }}
                   value={row.courses.length > 0 ? row.courses[0].name : ""}
                 >
@@ -160,56 +126,50 @@ export default function CreateGroupTable({
                     </MenuItem>
                   ))}
                 </Select> */}
-                {row.courses.map((subject, index) => (
-                  <Typography
-                    sx={{
-                      minWidth: "80px",
-                    }}
-                  >
-                    {subject.name} ({subject.prof})
-                  </Typography>
-                ))}
-                {fillThree(row.courses.length).map((subject, index) => (
-                  <Typography
-                    sx={{
-                      minWidth: "80px",
-                    }}
-                  >
-                    {subject}
-                  </Typography>
-                ))}
+            {row.courses.map((subject, index) => (
+              <Box
+                sx={{
+                  minWidth: "80px",
+                }}
+              >
+                {subject.name} ({subject.prof})
               </Box>
-
+            ))}
+            {fillThree(row.courses.length).map((subject, index) => (
               <Box
                 sx={{
-                  color: "text.secondary",
-                  display: "flex",
-                  flexGrow: 1,
-                  py: "20px",
-                  ml: "10px",
-                  borderColor: "primary.border",
+                  minWidth: "80px",
                 }}
               >
-                <Select
-                  sx={{ width: "170px", color: "text.secondary" }}
-                  value={row.friends.length > 0 ? row.friends[0].name : ""}
-                >
-                  {row.friends.map((friend, index) => (
-                    <MenuItem key={index} value={friend.name}>
-                      <Typography>
-                        {friend.name}, {friend.sid}
-                      </Typography>
-                    </MenuItem>
-                  ))}
-                </Select>
+                {subject}
               </Box>
-            </Box>
-            <IconButton
-              onClick={() => handleDeleteRow(row.sid)}
+            ))}
+            {/* </Box> */}
+
+            <Box
               sx={{
-                marginRight: "1rem",
+                color: "text.secondary",
+                display: "flex",
+                py: "20px",
+                ml: "10px",
+                borderColor: "primary.border",
               }}
             >
+              <Select
+                sx={{ width: "150px", color: "text.secondary" }}
+                value={row.friends.length > 0 ? row.friends[0].name : ""}
+              >
+                {row.friends.map((friend, index) => (
+                  <MenuItem key={index} value={friend.name}>
+                    <Typography>
+                      {friend.name}, {friend.sid}
+                    </Typography>
+                  </MenuItem>
+                ))}
+              </Select>
+            </Box>
+            {/* </Box> */}
+            <IconButton onClick={() => handleDeleteRow(row.sid)}>
               <Cancel />
             </IconButton>
           </Box>
diff --git a/histudy-front/src/components/Manager/StudentListTable.js b/histudy-front/src/components/Manager/StudentListTable.js
index e5c1458..b9ed19a 100644
--- a/histudy-front/src/components/Manager/StudentListTable.js
+++ b/histudy-front/src/components/Manager/StudentListTable.js
@@ -20,7 +20,6 @@ export default function StudentListTable({
   longWidthColumnNum,
   data,
 }) {
-  console.log("DD", data);
   const { register, getValues, setValue } = useForm({
     initialValues: {
       name: "",
@@ -30,7 +29,18 @@ export default function StudentListTable({
   });
 
   const TableHead = {
-    student: ["이름", "학번", "그룹", "희망과목"],
+    student: [
+      "그룹",
+      "이름",
+      "학번",
+      "",
+      "이메일",
+      "",
+      "",
+      "희망과목",
+      "",
+      "수정",
+    ],
   };
 
   const [edit, setEdit] = useState([false]);
@@ -68,6 +78,7 @@ export default function StudentListTable({
     <>
       <Box
         sx={{
+          minWidth: "1000px",
           py: "5px",
           border: 1,
           backgroundColor: "primary.default",
@@ -82,7 +93,7 @@ export default function StudentListTable({
             color: "text.secondary",
             display: "flex",
             py: "20px",
-
+            justifyContent: "space-between",
             borderColor: "primary.main",
             px: "60px",
           }}
@@ -90,11 +101,11 @@ export default function StudentListTable({
           {TableHead[type].map((headElement, index) => (
             <Typography
               key={index}
-              sx={{
-                flexGrow: 1,
-                width: longWidthColumnNum === index + 1 && "50%",
-                minWidth: longWidthColumnNum !== index + 1 && "150px",
-              }}
+              sx={
+                {
+                  // minWidth: longWidthColumnNum !== index - 3 && "200px",
+                }
+              }
             >
               {headElement}
             </Typography>
@@ -114,120 +125,79 @@ export default function StudentListTable({
                 <Box
                   sx={{
                     display: "flex",
+                    gap: "30px",
+
+                    justifyContent: "space-between",
+                    width: "100%",
                     alignItems: "center",
-                    flexGrow: 1,
+                    px: "50px",
+                    py: "20px",
                   }}
                 >
                   <Box
                     sx={{
                       color: "text.secondary",
                       display: "flex",
-                      flexGrow: 1,
-                      width: "50px",
-                      textOverflow: "ellipsis",
-                      overflowX: "auto",
-                      whiteSpace: "nowrap",
-                      marginLeft: "3rem",
-                      // py: "20px",
-                      borderColor: "primary.border",
                     }}
                   >
-                    {row.name}
+                    Group{row.group}
                   </Box>
 
                   <Box
                     sx={{
                       color: "text.secondary",
                       display: "flex",
-                      flexGrow: 1,
-                      width: "50px",
-                      textOverflow: "ellipsis",
-                      overflowX: "auto",
-                      whiteSpace: "nowrap",
-                      marginLeft: "5rem",
                       borderColor: "primary.border",
                     }}
                   >
-                    {row.sid}
+                    {row.name}
                   </Box>
 
                   <Box
                     sx={{
                       color: "text.secondary",
                       display: "flex",
-                      flexGrow: 1,
-                      width: "50px",
-                      textOverflow: "ellipsis",
-                      overflowX: "auto",
-                      whiteSpace: "nowrap",
-                      marginLeft: "4rem",
                       borderColor: "primary.border",
                     }}
                   >
-                    Group{row.group}
+                    {row.sid}
                   </Box>
+
                   <Box
                     sx={{
                       color: "text.secondary",
-                      display: "flex",
-                      flexGrow: 1,
-                      marginLeft: "20px",
-                      py: "20px",
+
+                      width: "250px",
                       borderColor: "primary.border",
+                      whiteSpace: "normal",
+                      wordWrap: "break-word",
                     }}
                   >
-                    <Select
-                      sx={{ width: "170px", color: "text.secondary" }}
-                      value={row.courses.length > 0 ? row.courses[0].name : ""}
-                    >
-                      {row.courses.map((subject, index) => (
-                        <MenuItem key={index} value={subject.name}>
-                          <Typography>
-                            {subject.name} ({subject.prof})
-                          </Typography>
-                        </MenuItem>
-                      ))}
-                    </Select>
+                    {row.email}
                   </Box>
-                </Box>
 
-                <Box
-                  sx={{
-                    color: "text.secondary",
-                    display: "flex",
-                    borderColor: "primary.border",
-                  }}
-                >
-                  <Box
-                    sx={{
-                      color: "text.secondary",
-                      display: "flex",
-                      flexGrow: 1,
-                      alignItems: "center",
-                      justifyContent: "space-between",
+                  <Select
+                    sx={{ width: "170px", color: "text.secondary" }}
+                    value={row.courses.length > 0 ? row.courses[0].name : ""}
+                  >
+                    {row.courses.map((subject, index) => (
+                      <MenuItem key={index} value={subject.name}>
+                        <Typography>
+                          {subject.name} ({subject.prof})
+                        </Typography>
+                      </MenuItem>
+                    ))}
+                  </Select>
+                  <IconButton
+                    onClick={() => {
+                      handleEdit(index);
+                      setValue("name", row.name);
+                      setValue("sid", row.sid);
+                      setValue("team", row.group);
                     }}
                   >
-                    <Box
-                      sx={{
-                        display: "flex",
-                        alignItems: "center",
-                        marginRight: "20px",
-                      }}
-                    >
-                      <Box sx={{ display: "flex" }}>
-                        <IconButton
-                          onClick={() => {
-                            handleEdit(index);
-                            setValue("name", row.name);
-                            setValue("sid", row.sid);
-                            setValue("team", row.group);
-                          }}
-                        >
-                          <Edit />
-                        </IconButton>
-                      </Box>
-                    </Box>
-                  </Box>
+                    <Edit />
+                  </IconButton>
                 </Box>
               </Box>
             ) : (
diff --git a/histudy-front/src/components/Manager/UnGroupTable.js b/histudy-front/src/components/Manager/UnGroupTable.js
index e3991ff..ff45a0f 100644
--- a/histudy-front/src/components/Manager/UnGroupTable.js
+++ b/histudy-front/src/components/Manager/UnGroupTable.js
@@ -226,7 +226,7 @@ export default function UnGroupTable({
                     display: "flex",
                     alignItems: "center",
                     flexGrow: 1,
-                    px: "20px",
+                    px: "30px",
                   }}
                 >
                   <Box
@@ -235,7 +235,6 @@ export default function UnGroupTable({
                       display: "flex",
                       flexGrow: 1,
                       borderColor: "primary.border",
-                      mr: "10px",
                     }}
                   >
                     <GroupSelector setTeam={setTeam} />
@@ -243,7 +242,7 @@ export default function UnGroupTable({
 
                   <Select
                     sx={{
-                      minWidth: "100px",
+                      minWidth: "80px",
                       color: "text.secondary",
                       display: "flex",
                       textOverflow: "ellipsis",
@@ -285,7 +284,7 @@ export default function UnGroupTable({
                     {row.courses.map((subject, index) => (
                       <Typography
                         sx={{
-                          minWidth: "120px",
+                          width: "120px",
                         }}
                       >
                         {subject.name} ({subject.prof})
@@ -294,7 +293,7 @@ export default function UnGroupTable({
                     {fillThree(row.courses.length).map((subject, index) => (
                       <Typography
                         sx={{
-                          minWidth: "120px",
+                          width: "120px",
                         }}
                       >
                         {subject}
@@ -314,7 +313,7 @@ export default function UnGroupTable({
                     }}
                   >
                     <Select
-                      sx={{ width: "170px", color: "text.secondary" }}
+                      sx={{ width: "140px", color: "text.secondary" }}
                       value={row.friends.length > 0 ? row.friends[0].name : ""}
                     >
                       {row.friends.map((friend, index) => (
diff --git a/histudy-front/src/pages/Manager/ManageStudent.js b/histudy-front/src/pages/Manager/ManageStudent.js
index df813fa..f06c2e1 100644
--- a/histudy-front/src/pages/Manager/ManageStudent.js
+++ b/histudy-front/src/pages/Manager/ManageStudent.js
@@ -58,7 +58,8 @@ export default function ManageStudent() {
     sheetData = studentData.map((student) => ({
       ID: student.id,
       Name: student.name,
-      Number: student.sid,
+      StudentId: student.sid,
+      Email: student.email,
       Group: student.group,
       Courses: student.courses
         .map((subject) => subject.name + `(${subject.prof})`)
@@ -135,7 +136,7 @@ export default function ManageStudent() {
               <StudentListTable
                 data={searchResult}
                 accentColumnNum={-1}
-                longWidthColumnNum={-1}
+                longWidthColumnNum={3}
                 type="student"
               />
             )}