Merge pull request #139 from MUIT-UMC/dev

브랜치 최신화

Author: Remi1001100

src/App.jsx

@@ -57,6 +57,7 @@ import AdminEvent from "./pages/adminpage/event/AdminEvent";
 import AdminEventDetail from "./pages/adminpage/event/AdminEventDetail";
 import AdminVision from "./pages/adminpage/vision/AdminVision";
 import AdminVisionDetail from "./pages/adminpage/vision/AdminVisionDetail";
+import AdminVisionUpdate from "./pages/adminpage/vision/AdminVisionUpdate";
 import AdminQuery from "./pages/adminpage/query/AdminQuery";
 import AdminQueryDetail from "./pages/adminpage/query/AdminQueryDetail";
 import AdminMypage from "./pages/adminpage/mypage/AdminMypage";
@@ -171,6 +172,7 @@ function App() {
             <Route path="event/detail/:musicalId" element={<AdminEventDetail />} />
             <Route path="vision" element={<AdminVision />} />
             <Route path="vision/detail/:placeId" element={<AdminVisionDetail />} />
+            <Route path="vision/detail/:placeId/update" element={<AdminVisionUpdate />} />
             <Route path="query" element={<AdminQuery />} />
             <Route path="query/detail/:queryId" element={<AdminQueryDetail />} />
             <Route path="mypage" element={<AdminMypage />} />

src/assets/icons/CheckRed.svg

@@ -220,21 +220,27 @@ function Sidebar({onClose}) {
     }
   };
 
+  const isLoggedIn = !!localStorage.getItem("accessToken");
+
   return (
     <SidebarOverlay onClick={handleOverlayClick}>
       <SidebarContainer onClick={handleContainerClick}>
         <SideMenuArea>
           <MenuTop>
             <SideMenuLink to="/">홈</SideMenuLink>
             <SideMenuLink to="/vision">시야 확인</SideMenuLink>
+            <SideMenuLink to="/small-theater">소극장 공연</SideMenuLink>
             <SideMenuLink to="/event-check">이벤트 확인</SideMenuLink>
-            <SideMenuLink to="/small-theater">소극장 연극</SideMenuLink>
             <SideMenuLink to="/board/item/lost" >게시판</SideMenuLink>
           </MenuTop>
           <Bar><img src={DivideBarIcon} alt="Bar Icon" /></Bar>
           <MenuBottom>
-            <SideMenuLink to="/login">로그인</SideMenuLink>
-            <SideMenuLink to="/signup">회원가입</SideMenuLink>
+            {!isLoggedIn && (
+              <>
+                <SideMenuLink to="/login">로그인</SideMenuLink>
+                <SideMenuLink to="/signup">회원가입</SideMenuLink>
+              </>
+            )}
             <SideMenuLink to="/mypage" onClick={handleLinkClick}>마이 페이지</SideMenuLink>
           </MenuBottom>
         </SideMenuArea>

src/components/Navbar.jsx

@@ -4,32 +4,42 @@ import ChevronLeft from "../../assets/icons/ChevronLeft.svg";
 import ChevronRight from "../../assets/icons/ChevronRight.svg";
 
 const PageNavigator = ({ currentPage, totalPages, onPageChange }) => {
+  const pagesPerGroup = 5; // 5개씩 끊어서 표시
+  const currentGroup = Math.floor(currentPage / pagesPerGroup);
+  const startPage = currentGroup * pagesPerGroup;
+  const endPage = Math.min(startPage + pagesPerGroup, totalPages);
+
   const handlePageClick = (page) => {
-    if (page >= 0 && page <= totalPages) {
+    if (page >= 0 && page < totalPages) {
       onPageChange(page);
     }
   };
 
   return (
     <PageNavigatorWrapper>
+      {/* 이전 5개 이동 */}
       <Img
         src={ChevronLeft}
-        visibility={currentPage === 0 ? "hidden" : "visible"}
-        onClick={() => handlePageClick(currentPage - 1)}
+        visibility={currentGroup === 0 ? "hidden" : "visible"}
+        onClick={() => handlePageClick(startPage - pagesPerGroup)}
       />
-      {Array.from({ length: totalPages }, (_, index) => (
+
+      {/* 현재 그룹의 페이지 번호 표시 */}
+      {Array.from({ length: endPage - startPage }, (_, index) => (
         <PageNumber
-          key={index}
-          color={currentPage === index ? "#A00000" : undefined}
-          onClick={() => handlePageClick(index)}
+          key={startPage + index}
+          color={currentPage === startPage + index ? "#A00000" : undefined}
+          onClick={() => handlePageClick(startPage + index)}
         >
-          {index + 1}
+          {startPage + index + 1}
         </PageNumber>
       ))}
+
+      {/* 다음 5개 이동 */}
       <Img
         src={ChevronRight}
-        visibility={currentPage === totalPages-1 ? "hidden" : "visible"}
-        onClick={() => handlePageClick(currentPage + 1)}
+        visibility={endPage >= totalPages ? "hidden" : "visible"}
+        onClick={() => handlePageClick(startPage + pagesPerGroup)}
       />
     </PageNavigatorWrapper>
   );

src/components/board/PageNavigator.jsx

@@ -92,8 +92,7 @@ const PostListWrapper = styled.table`
   margin-top: 32px;
   font-family: Pretendard, sans-serif;
   text-align: center;
-
-
+table-layout: fixed; /* 고정된 레이아웃 */
   
   th, td {
     
@@ -118,24 +117,56 @@ const PostListWrapper = styled.table`
   td:nth-child(1) {
     text-align: left;
     padding-left: 50px;
+    min-width: 40%;
+    max-width: 50%;
+  }
+    td:nth-child(2) {
+    text-align: left;
+    padding-left: 50px;
+    width: 20%;
+    max-width: 190px;
+  }
+        td:nth-child(3) {
+    text-align: left;
+    padding-left: 50px;
+    width: 20%;
+  }
+        td:nth-child(4) {
+    text-align: left;
+    padding-left: 50px;
+    width: 20%;
   }
     th:nth-child(1) {
     text-align: left;
     padding-left: 94px;
+    min-width: 40%;
+    max-width: 50%;
+  }
+    th:nth-child(2) {
+    width:20%;
+  }
+    th:nth-child(3) {
+    width:20%;
+  }    th:nth-child(4) {
+    width:20%;
   }
 
   td {
     color: #000;
     border-bottom: 1px solid #E6E6E6;
     padding-top: 18px;
     padding-bottom: 18px;
-
+    padding-right: 20px;
   /* Body-tiny-md */
   font-family: Pretendard;
   font-size: 14px;
   font-style: normal;
   font-weight: 500;
   line-height: normal;
+
+  overflow: hidden; /* 넘치는 내용 숨김 */
+  white-space: nowrap; /* 줄바꿈 방지 */
+  text-overflow: ellipsis; /* ... 처리 */
   }
 
   tbody tr:hover {

src/components/board/PostList.jsx

@@ -113,15 +113,20 @@ const NavWrapper = styled.div`
 `
 
 const Text = styled.div`
-  color: ${(props) => props.color ? props.color: '#000'};
-
-  /* Body-me */
+  color: ${(props) => props.color || "#000"};
   font-family: Pretendard;
   font-size: 16px;
   font-style: normal;
   font-weight: 500;
   line-height: 25px; /* 156.25% */
-`
+  text-align:left; 
+  display: -webkit-box;
+  -webkit-line-clamp: 2;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  word-break: break-word;
+`;
 const Img = styled.img`
 height: 88px;
 width: 88px;

src/components/board/PostList2.jsx

@@ -16,7 +16,7 @@ const Step2 = () => {
   const navigate = useNavigate();
   const location = useLocation();
   const peopleCount = location.state?.peopleCount || 1;
-  const [selectedTicketId, setSelectedTicketId] = useState("1");
+  const [selectedTicketName, setSelectedTicketName] = useState("일반 예매");
 
   const url = `/tickets/${amateurId}/ticketInfo`;
   const { data, error, loading } = useCustomFetch(url, {
@@ -32,18 +32,19 @@ const Step2 = () => {
 
 
   // 🎯 선택된 티켓 정보 찾기
-  const selectedTicket = ticketInfo.tickets.find(ticket => ticket.amateurTicketId === selectedTicketId);
+  const selectedTicket = ticketInfo.tickets.find(ticket => ticket.ticketName === selectedTicketName);
   const ticketPrice = selectedTicket ? selectedTicket.price : 0;
 
   // 🎯 할인 선택 핸들러
   const handleDiscountChange = (event) => {
-    setSelectedTicketId(event.target.value);
+    setSelectedTicketName(event.target.value);
   };
+
   const handleNextStep = () => {
     navigate('../step3', {
       state: {
         peopleCount,
-        selectedTicketId,
+        selectedTicketName,
         ticketInfo,
       },
     });
@@ -69,22 +70,22 @@ const Step2 = () => {
               <Option>
                 <RadioButton type="radio" 
                   name="discount" 
-                  value="1" 
-                  checked={selectedTicketId === "1"} 
+                  value="일반 예매"
+                  checked={selectedTicketName === "일반 예매"}
                   onChange={handleDiscountChange} /> 할인 없음
               </Option>
               <Option>
                 <RadioButton type="radio" 
                   name="discount" 
-                  value="2" 
-                  checked={selectedTicketId === "2"} 
+                  value="홍대생 할인"
+                  checked={selectedTicketName === "홍대생 할인"} 
                   onChange={handleDiscountChange} /> 홍대생 할인
               </Option>
               <Option>
                 <RadioButton  type="radio" 
                   name="discount" 
-                  value="2" 
-                  checked={selectedTicketId === "2"} 
+                  value="홍대생 할인"
+                  checked={selectedTicketName === "홍대생 할인"}
                   onChange={handleDiscountChange} /> 지인 할인
               </Option>
             </Options>

src/components/buy/Step2.jsx

@@ -15,7 +15,7 @@ const Step3 = () => {
   const {amateurId} = useParams();
   const navigate = useNavigate();
     const location = useLocation();
-    const { peopleCount = 1, selectedTicketId = '1' } = location.state || {};
+    const { peopleCount = 1, selectedTicketName="일반 예매" } = location.state || {};
 
   const url = `/tickets/${amateurId}/ticketInfo`;
   const { data, error, loading } = useCustomFetch(url, {
@@ -32,9 +32,7 @@ const Step3 = () => {
   const memberInfo = data.result.reserveConfirmMemberDTO;
 
   // 선택된 티켓 정보 찾기
-  const selectedTicket = ticketInfo.tickets.find(
-    (ticket) => ticket.amateurTicketId === selectedTicketId
-  );
+  const selectedTicket = ticketInfo.tickets.find(ticket => ticket.ticketName === selectedTicketName);
   const ticketPrice = selectedTicket ? selectedTicket.price : 0;
   // 총 결제 금액 계산
   const totalAmount = ticketPrice * peopleCount;
@@ -43,12 +41,12 @@ const Step3 = () => {
     navigate('../step4', {
       state: {
         peopleCount,
-        selectedTicketId,
+        selectedTicketName,
         ticketInfo,
+        amateurTicketId: selectedTicket.amateurTicketId,
       },
     });
   };
-  
 
      return (
       <Container>

src/components/buy/Step3.jsx

@@ -8,20 +8,20 @@ const token = localStorage.getItem("accessToken");
 
 const Step4 = () => {
   const navigate = useNavigate();
-  const { amateurId } = useParams();
+  // const { amateurTicketId } = useParams();
   const [accountName, setAccountName] = useState("");
   const [isSubmitting, setIsSubmitting] = useState(false);
   const isButtonActive = accountName.trim().length > 0;  
   const location = useLocation();
-  const { peopleCount, selectedTicketId,ticketInfo } = location.state || {};
+  const { peopleCount, selectedTicketName="일반 예매",ticketInfo,amateurTicketId } = location.state || {};
+  console.log("ticketId",amateurTicketId)
 
   const handleSubmit = async () => {
     if (!isButtonActive || isSubmitting) return;
 
     setIsSubmitting(true);
 
-    const url = `${import.meta.env.VITE_APP_SERVER_URL}/tickets/purchase/${amateurId}`;
-  
+    const url = `${import.meta.env.VITE_APP_SERVER_URL}/tickets/purchase/${amateurTicketId}`;
     try {
       const response = await fetch(url, {
         method: 'POST',
@@ -51,9 +51,7 @@ const Step4 = () => {
     }
   };
     // 선택된 티켓 정보 찾기
-    const selectedTicket = ticketInfo.tickets.find(
-      (ticket) => ticket.amateurTicketId === selectedTicketId
-    );
+    const selectedTicket = ticketInfo.tickets.find(ticket => ticket.ticketName === selectedTicketName);
     const ticketPrice = selectedTicket ? selectedTicket.price : 0;
     // 총 결제 금액 계산
     const totalAmount = ticketPrice * peopleCount;