Skip to content

Commit eba5c2e

Browse files
jiwon234jiwon234
committed
스타일 디테일 수정과 없는 데이터에 대한 화면처리
style: 스타일 디테일 수정 fix: 없는 데이터에 대한 메시지 처리
1 parent ea56cca commit eba5c2e

File tree

12 files changed

+85
-60
lines changed

12 files changed

+85
-60
lines changed

‎src/components/Navbar.jsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -80,7 +80,7 @@ function NavbarDefault() {
8080
</CenterArea>
8181
<RightArea>
8282
<IconLink to="/search"><img src={SearchIcon} alt="Search Icon" /></IconLink>
83-
<IconLink to="/mypage"><img src={ProfileIcon} alt="Profile Icon" /></IconLink>
83+
<IconLink to="/mypage/my/tickets"><img src={ProfileIcon} alt="Profile Icon" /></IconLink>
8484
</RightArea>
8585
</NavTop>
8686
<NavBottom>

‎src/components/mypage/account/Authenticate.jsx‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -67,6 +67,7 @@ const AuthArea = styled.div`
6767
gap: 60px;
6868
6969
.Title{
70+
7071
font-size: 16px;
7172
font-weight: 500;
7273
color: #000000;

‎src/components/mypage/myticket/TicketContainer.jsx‎

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -19,10 +19,9 @@ const TicketContainer = ({ alt, details, isDisabled }) => {
1919
const korStatus = {
2020
RESERVE_AWAIT: "입금 대기중",
2121
RESERVED: "예매 완료",
22-
EXPIRED: "예매 기한 만료",
22+
EXPIRED: "사용 완료",
2323
CANCEL_AWAIT: "취소 대기중",
2424
CANCELED: "취소 완료",
25-
2625
}
2726
const navigate = useNavigate();
2827

@@ -72,7 +71,7 @@ const TicketContainer = ({ alt, details, isDisabled }) => {
7271
</Item>
7372
<Item>
7473
<Label>상태</Label>
75-
<Value
74+
<Value color="#A00000"
7675
// color={label === "취소가능일시" ? "#A00000" : undefined}
7776
>{korStatus[reservationStatus]}</Value>
7877
</Item>

‎src/pages/board/item/LostBoard.jsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -84,8 +84,8 @@ const [searchParams, setSearchParams] = useState({
8484
*/}
8585

8686
<SearchContainer fields={fieldsForFour} onSearchChange={handleSearchChange} />
87-
{loading && <div>로딩 중...</div>}
88-
{error && <div>에러 발생: {error}</div>}
87+
{loading && <div style={{marginTop:'32px'}}>로딩 중...</div>}
88+
{error && <div style={{marginTop:'32px'}}>에러 발생: {error}</div>}
8989
{data?.result?.posts?.length == 0 ? <div style={{marginTop: '30px'}}>아직 작성된 게시글이 없습니다.</div> :
9090
!loading && !error && (
9191
<>

‎src/pages/mypage/MyPage.jsx‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -120,13 +120,15 @@ const MyPageWrapper = styled.div`
120120
display: flex;
121121
flex-direction: row;
122122
gap: 115px;
123+
align-items: stretch;
123124
`
124125

125126
const Aside = styled.div`
126127
display: flex;
127128
flex-direction: column;
128129
justify-content: space-between;
129-
height: 100vh; /* 창 높이를 기준으로 설정 */
130+
height: auto;
131+
flex-shrink: 0;
130132
`
131133

132134
const Main = styled.div`
@@ -190,6 +192,7 @@ const AsideBottom = styled.div`
190192
display: flex;
191193
flex-direction: column;
192194
gap: 12px;
195+
margin-top:200px;
193196
`
194197

195198
const Button = styled.button`

‎src/pages/mypage/my/LikedMusical.jsx‎

Lines changed: 24 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -21,22 +21,29 @@ function LikedMusical() {
2121

2222

2323
return (
24+
2425
<Container>
25-
<MusicalList>
26-
{data?.result?.map((musical) => (
27-
<Card key={musical.id} onClick={() => navigate(`/detail/${musical.id}`)}>
28-
<Image src={musical.posterUrl} alt={musical.name} />
29-
<CardHeader>
30-
<CardTitle>{musical.name}</CardTitle>
31-
<LikeButton>
32-
<img src={Heart} alt="Like" width={24} height={24}/>
33-
</LikeButton>
34-
</CardHeader>
35-
<Theater>{musical.place}</Theater>
36-
<Period>{musical.duration}</Period>
37-
</Card>
38-
))}
39-
</MusicalList>
26+
{loading && <div style={{marginTop:'32px'}}>로딩 중...</div>}
27+
{error && <div style={{marginTop:'32px'}}>에러 발생: {error}</div>}
28+
{data?.result?.length > 0 ? (
29+
<MusicalList>
30+
{data.result.map((musical) => (
31+
<Card key={musical.id} onClick={() => navigate(`/detail/${musical.id}`)}>
32+
<Image src={musical.posterUrl} alt={musical.name} />
33+
<CardHeader>
34+
<CardTitle>{musical.name}</CardTitle>
35+
<LikeButton>
36+
<img src={Heart} alt="Like" width={24} height={24} />
37+
</LikeButton>
38+
</CardHeader>
39+
<Theater>{musical.place}</Theater>
40+
<Period>{musical.duration}</Period>
41+
</Card>
42+
))}
43+
</MusicalList>
44+
) : (
45+
<p style={{marginTop:'32px'}}>좋아요한 뮤지컬이 없습니다.</p>
46+
)}
4047
</Container>
4148
);
4249
}
@@ -47,8 +54,7 @@ export default LikedMusical;
4754
const Container = styled.div`
4855
display: flex;
4956
max-width: 1440px;
50-
height: 864px;
51-
margin-top:30px;
57+
5258
`;
5359

5460

@@ -57,7 +63,7 @@ const MusicalList = styled.div`
5763
grid-template-columns: repeat(3, 1fr); /* 한 줄에 3개 */
5864
gap: 6px; /* 카드 간 간격 */
5965
margin-left: -35px;
60-
66+
margin-top:30px;
6167
`;
6268

6369
const Card = styled.div`

‎src/pages/mypage/my/MyPosts.jsx‎

Lines changed: 13 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -35,18 +35,20 @@ function MyPosts() {
3535

3636
return (
3737
<>
38-
{loading && <div>로딩 중...</div>}
39-
{error && <div>에러 발생: {error}</div>}
38+
{loading && <div style={{marginTop:'32px'}}>로딩 중...</div>}
39+
{error && <div style={{marginTop:'32px'}}>에러 발생: {error}</div>}
4040
{!loading && !error && (
41-
<>
42-
<PostList details={data?.result?.posts} headers={tableHeaders} cols={3} boardType='mypost'/>
43-
<PageNavigator
44-
currentPage={currentPage}
45-
totalPages={totalPages}
46-
onPageChange={setCurrentPage}
47-
/>
48-
</>
49-
)}
41+
<>
42+
{data?.result?.posts?.length > 0 ? (
43+
<>
44+
<PostList details={data?.result?.posts} headers={tableHeaders} cols={3} boardType="mypost" />
45+
<PageNavigator currentPage={currentPage} totalPages={totalPages} onPageChange={setCurrentPage} />
46+
</>
47+
) : (
48+
<p style={{marginTop:'32px'}}>아직 작성된 게시글이 없습니다.</p>
49+
)}
50+
</>
51+
)}
5052

5153
</>
5254
);

‎src/pages/mypage/my/Tickets.jsx‎

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -35,15 +35,13 @@ function Tickets() {
3535

3636
{activeTab === "예매완료" && (
3737
<>
38-
<h2>예매완료</h2>
3938
<TicketList status="RESERVED"/>
4039
</>
4140
)}
4241

4342
{activeTab === "예매취소" && (
4443
<>
45-
<h2>예매취소</h2>
46-
<p>예매 취소의 경우 티켓컨테이너가 회색으로 보인다.</p>
44+
{/*<p>예매 취소의 경우 티켓컨테이너가 회색으로 보인다.</p>*/}
4745
<TicketList status="CANCELED"/>
4846
</>
4947
)}
@@ -67,7 +65,7 @@ const Wrapper = styled.div`
6765
const NavBar = styled.nav`
6866
display: flex;
6967
gap: 20px;
70-
margin-bottom: 60px;
68+
margin-bottom: 40px;
7169
margin-top: 16px;
7270
`;
7371

‎src/pages/mypage/my/ticket/CancelTicket.jsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -44,7 +44,7 @@ function CancelTicket() {
4444
const korStatus = {
4545
RESERVE_AWAIT: "입금 대기중",
4646
RESERVED: "예매 완료",
47-
EXPIRED: "예매 기한 만료",
47+
EXPIRED: "사용 완료",
4848
CANCEL_AWAIT: "취소 대기중",
4949
CANCELED: "취소 완료",
5050

‎src/pages/mypage/my/ticket/TicketDetailPage.jsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -57,7 +57,7 @@ function TicketDetailPage() {
5757
const korStatus = {
5858
RESERVE_AWAIT: "입금 대기중",
5959
RESERVED: "예매 완료",
60-
EXPIRED: "예매 기한 만료",
60+
EXPIRED: "사용 완료",
6161
CANCEL_AWAIT: "취소 대기중",
6262
CANCELED: "취소 완료",
6363

0 commit comments

Comments
 (0)