From 1e406016e015f184c15bbbd2ae763777884fea77 Mon Sep 17 00:00:00 2001 From: jerry Date: Wed, 10 Jul 2024 22:57:20 +0900 Subject: [PATCH 01/29] =?UTF-8?q?feat:=20=EB=8D=94=EB=AF=B8=EB=8D=B0?= =?UTF-8?q?=EC=9D=B4=ED=84=B0=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/book/constants/dummy.ts | 26 ++++++++++++++++++++++++++ 1 file changed, 26 insertions(+) create mode 100644 src/pages/book/constants/dummy.ts diff --git a/src/pages/book/constants/dummy.ts b/src/pages/book/constants/dummy.ts new file mode 100644 index 00000000..6b05abe6 --- /dev/null +++ b/src/pages/book/constants/dummy.ts @@ -0,0 +1,26 @@ +import exImg from "src/pages/MyRegisterdShow/constants/silkagel.png"; + +export const BOOK_DETAIL_INFO = { + performanceId: 1, + performanceTitle: "비트밴드 정기공연", + ticketPrice: "5000", + genre: "BAND", + posterImage: exImg, + performanceVenue: "홍대상상마당", + performancePeriod: "2023.12.28~2023.12.29", + performanceTeamName: "비트밴드", + scheduleList: [ + { + scheduleId: 1, + performanceDate: "2023-12-28T19:30:00", + availableTicketCount: 100, + scheduleNumber: "FIRST", + }, + { + scheduleId: 2, + performanceDate: "2023-12-29T19:30:00", + availableTicketCount: 90, + scheduleNumber: "SECOND", + }, + ], +}; From 56035c315e4813a16281fc79c6b73e93f630656c Mon Sep 17 00:00:00 2001 From: jerry Date: Wed, 10 Jul 2024 23:59:08 +0900 Subject: [PATCH 02/29] =?UTF-8?q?feat:=20Info=20=EC=BB=B4=ED=8F=AC?= =?UTF-8?q?=EB=84=8C=ED=8A=B8=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/book/Book.tsx | 25 +++++++- src/pages/book/components/info/Info.styled.ts | 59 +++++++++++++++++++ src/pages/book/components/info/Info.tsx | 41 +++++++++++++ 3 files changed, 124 insertions(+), 1 deletion(-) create mode 100644 src/pages/book/components/info/Info.styled.ts create mode 100644 src/pages/book/components/info/Info.tsx diff --git a/src/pages/book/Book.tsx b/src/pages/book/Book.tsx index 8a162f92..2e3c1144 100644 --- a/src/pages/book/Book.tsx +++ b/src/pages/book/Book.tsx @@ -1,5 +1,28 @@ +import { useState } from "react"; +import styled from "styled-components"; +import Info from "./components/info/Info"; +import { BOOK_DETAIL_INFO } from "./constants/dummy"; + const Book = () => { - return
Book
; + const [detail, setDetail] = useState(BOOK_DETAIL_INFO); + + return ( + + + + ); }; export default Book; + +const ContentWrapper = styled.div` + display: flex; + flex-direction: column; + align-items: center; +`; diff --git a/src/pages/book/components/info/Info.styled.ts b/src/pages/book/components/info/Info.styled.ts new file mode 100644 index 00000000..27ffc0ea --- /dev/null +++ b/src/pages/book/components/info/Info.styled.ts @@ -0,0 +1,59 @@ +import styled from "styled-components"; + +export const InfoContainer = styled.section` + display: flex; + flex-direction: column; + gap: 2rem; + width: 32.7rem; + margin-top: 1.6rem; +`; + +export const InfoTop = styled.div` + display: flex; +`; + +export const InfoPoster = styled.img<{ $imgsrc: string }>` + width: 9.5rem; + height: 12.8rem; + margin-right: 1.4rem; + + background-image: url(${({ $imgsrc }) => $imgsrc}); + background-size: 100% 100%; + border-radius: 4px; +`; + +export const InfoTextBox = styled.div` + display: flex; + flex-direction: column; +`; + +export const InfoType = styled.p` + color: ${({ theme }) => theme.colors.gray_500}; + ${({ theme }) => theme.fonts["caption1-semi"]}; +`; + +export const InfoTitle = styled.h1` + color: ${({ theme }) => theme.colors.white}; + + ${({ theme }) => theme.fonts["body1-normal-semi"]}; +`; + +export const InfoTeamText = styled.span` + margin-right: 0.6rem; + + color: ${({ theme }) => theme.colors.gray_400}; + + ${({ theme }) => theme.fonts["body2-normal-medi"]}; +`; + +export const InfoTeamName = styled.span` + color: ${({ theme }) => theme.colors.white}; + + ${({ theme }) => theme.fonts["body2-normal-medi"]}; +`; + +export const InfoBottom = styled.div` + display: flex; + flex-direction: column; + gap: 0.8rem; +`; diff --git a/src/pages/book/components/info/Info.tsx b/src/pages/book/components/info/Info.tsx new file mode 100644 index 00000000..b77e1746 --- /dev/null +++ b/src/pages/book/components/info/Info.tsx @@ -0,0 +1,41 @@ +import Spacing from "@components/commons/spacing/Spacing"; +import * as S from "./Info.styled"; + +interface InfoProps { + genre: string; + title: string; + teamName: string; + venue: string; + period: string; +} + +const Info = ({ genre, title, teamName, venue, period }: InfoProps) => { + return ( + + + + + + {genre} + + {title} + +
+ 공연진 + {teamName} +
+ + + + + {/* TODO: 변경 */} + {/* } text={venue} /> */} + {venue} + {/* } text={period} /> */} + {period} + + + ); +}; + +export default Info; From 6235615c7f690078a13589e585c4c436198010b5 Mon Sep 17 00:00:00 2001 From: jerry Date: Thu, 11 Jul 2024 01:14:38 +0900 Subject: [PATCH 03/29] =?UTF-8?q?feat:=20=EA=B8=B0=EB=B3=B8=20=ED=8F=B0?= =?UTF-8?q?=ED=8A=B8=20=EC=83=89=EC=83=81=20=ED=9D=B0=EC=83=89=EC=9C=BC?= =?UTF-8?q?=EB=A1=9C=20=EB=B3=80=EA=B2=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/styles/global.ts | 2 ++ 1 file changed, 2 insertions(+) diff --git a/src/styles/global.ts b/src/styles/global.ts index 30e76f15..44648ba2 100644 --- a/src/styles/global.ts +++ b/src/styles/global.ts @@ -60,6 +60,8 @@ const global = createGlobalStyle` margin: 0 auto; overflow-x: hidden; + color: ${({ theme }) => theme.colors.white}; + background-color: ${({ theme }) => theme.colors.gray_900}; } From eecd1e173f54ce744a7bec155a2ab8a779e1d9f5 Mon Sep 17 00:00:00 2001 From: jerry Date: Thu, 11 Jul 2024 01:44:58 +0900 Subject: [PATCH 04/29] =?UTF-8?q?feat:=20Count=20=EC=BB=B4=ED=8F=AC?= =?UTF-8?q?=EB=84=8C=ED=8A=B8=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/book/Book.tsx | 21 ++++++++++ .../book/components/count/Count.styled.ts | 42 +++++++++++++++++++ src/pages/book/components/count/Count.tsx | 29 +++++++++++++ src/pages/book/components/info/Info.styled.ts | 2 +- src/pages/book/constants/dummy.ts | 2 +- 5 files changed, 94 insertions(+), 2 deletions(-) create mode 100644 src/pages/book/components/count/Count.styled.ts create mode 100644 src/pages/book/components/count/Count.tsx diff --git a/src/pages/book/Book.tsx b/src/pages/book/Book.tsx index 2e3c1144..07eaad4a 100644 --- a/src/pages/book/Book.tsx +++ b/src/pages/book/Book.tsx @@ -1,11 +1,23 @@ import { useState } from "react"; import styled from "styled-components"; +import Count from "./components/count/Count"; import Info from "./components/info/Info"; +import Select from "./components/select/Select"; import { BOOK_DETAIL_INFO } from "./constants/dummy"; const Book = () => { const [detail, setDetail] = useState(BOOK_DETAIL_INFO); + const [round, setRound] = useState(1); + + const onMinusClick = () => { + setRound((prev) => prev - 1); + }; + + const onPlusClick = () => { + setRound((prev) => prev + 1); + }; + return ( { venue={detail.performanceVenue} period={detail.performancePeriod} /> + + onChange(value)} /> + + + ); +}; + +export default RadioButton; + +const Label = styled.label<{ checked: boolean }>` + display: flex; + align-items: center; + justify-content: space-between; + padding: 1.2rem 1rem 1.2rem 1.6rem; + + background-color: ${({ theme }) => theme.colors.gray_800}; + cursor: pointer; + border: 2px solid transparent; + border-radius: 6px; + + ${({ checked, theme }) => + checked && + ` + background-color: ${theme.colors.gray_800}; + border: 2px solid ${theme.colors.pink_400}; + `} + + &:hover { + background-color: ${({ theme }) => theme.colors.gray_800}; + border-color: ${({ theme }) => theme.colors.pink_400}; + } +`; + +const Input = styled.input` + display: none; +`; + +const DateTimeDivider = styled.div` + display: inline-block; + width: 1px; + height: 12px; + margin: 0 1rem; + + background-color: ${({ theme }) => theme.colors.gray_500}; +`; + +const Text = styled.span` + color: ${({ theme }) => theme.colors.gray_0}; + ${({ theme }) => theme.fonts["body1-normal-medi"]}; +`; + +const CustomRadio = styled.span<{ checked: boolean }>` + position: relative; + width: 2rem; + height: 2rem; + padding-right: 0.6rem; + ${({ theme, checked }) => + checked + ? `border: 6px solid ${theme.colors.pink_400}` + : `border: 2px solid ${theme.colors.gray_300}`}; + + border-radius: 100%; + + &::after { + position: absolute; + top: 50%; + left: 50%; + display: ${({ checked }) => (checked ? "block" : "none")}; + width: 1rem; + height: 1rem; + + background-color: ${({ theme }) => theme.colors.white}; + transform: translate(-50%, -50%); + border-radius: 50%; + + content: ""; + } +`; diff --git a/src/pages/book/components/select/RadioGroup.tsx b/src/pages/book/components/select/RadioGroup.tsx new file mode 100644 index 00000000..f89e0087 --- /dev/null +++ b/src/pages/book/components/select/RadioGroup.tsx @@ -0,0 +1,27 @@ +import styled from "styled-components"; +import RadioButton from "./RadioButton"; +import { SelectProps } from "./Select"; + +const RadioGroup = ({ selectedValue, handleRadioChange, scheduleList }: SelectProps) => { + return ( + + {scheduleList.map((schedule, i) => ( + + ))} + + ); +}; + +export default RadioGroup; + +export const RadioGroupWrapper = styled.section` + display: flex; + flex-direction: column; + gap: 1.2rem; +`; diff --git a/src/pages/book/components/select/Select.styled.ts b/src/pages/book/components/select/Select.styled.ts new file mode 100644 index 00000000..e9f71ea8 --- /dev/null +++ b/src/pages/book/components/select/Select.styled.ts @@ -0,0 +1,24 @@ +import styled from "styled-components"; + +export const Wrapper = styled.section` + display: flex; + flex-direction: column; + gap: 1.4rem; + width: 100%; + padding: 2.4rem 0; + + border-bottom: 1px solid ${({ theme }) => theme.colors.gray_800}; +`; + +export const Container = styled.div` + display: flex; + justify-content: space-between; + width: 100%; +`; + +export const Title = styled.h2` + margin-bottom: 0.2rem; + + color: ${({ theme }) => theme.colors.white}; + ${({ theme }) => theme.fonts.heading4}; +`; diff --git a/src/pages/book/components/select/Select.tsx b/src/pages/book/components/select/Select.tsx new file mode 100644 index 00000000..53fa0c3b --- /dev/null +++ b/src/pages/book/components/select/Select.tsx @@ -0,0 +1,28 @@ +import RadioGroup from "./RadioGroup"; +import * as S from "./Select.styled"; + +export interface SelectProps { + selectedValue: number; + handleRadioChange: (value: number) => void; + scheduleList: { + scheduleId: number; + performanceDate: string; + availableTicketCount: number; + scheduleNumber: string; + }[]; +} + +const Select = ({ selectedValue, handleRadioChange, scheduleList }: SelectProps) => { + return ( + + 회차 선택 + + + ); +}; + +export default Select; From fd28f493e8051ecfb8ab596faef501710049ee8c Mon Sep 17 00:00:00 2001 From: jerry Date: Fri, 12 Jul 2024 00:59:11 +0900 Subject: [PATCH 19/29] =?UTF-8?q?feat:=20Divider=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/book/Book.tsx | 13 +++++++++++++ src/pages/book/components/info/Info.tsx | 2 +- 2 files changed, 14 insertions(+), 1 deletion(-) diff --git a/src/pages/book/Book.tsx b/src/pages/book/Book.tsx index e392e726..94eb2ec4 100644 --- a/src/pages/book/Book.tsx +++ b/src/pages/book/Book.tsx @@ -89,6 +89,8 @@ const Book = () => { venue={detail.performanceVenue} period={detail.performancePeriod} /> + + onChange(value)} /> - + {isSoldOut ? ( + 매진 + ) : ( + <> + onChange(value)} /> + + + )} ); }; export default RadioButton; -const Label = styled.label<{ checked: boolean }>` +const Label = styled.label<{ checked: boolean; $isSoldOut: boolean }>` display: flex; align-items: center; justify-content: space-between; padding: 1.2rem 1rem 1.2rem 1.6rem; + ${({ $isSoldOut, theme }) => + $isSoldOut + ? ` + color: ${theme.colors.gray_600};` + : `color: ${theme.colors.gray_0}`}; + background-color: ${({ theme }) => theme.colors.gray_800}; cursor: pointer; border: 2px solid transparent; @@ -43,11 +55,6 @@ const Label = styled.label<{ checked: boolean }>` background-color: ${theme.colors.gray_800}; border: 2px solid ${theme.colors.pink_400}; `} - - &:hover { - background-color: ${({ theme }) => theme.colors.gray_800}; - border-color: ${({ theme }) => theme.colors.pink_400}; - } `; const Input = styled.input` @@ -64,7 +71,6 @@ const DateTimeDivider = styled.div` `; const Text = styled.span` - color: ${({ theme }) => theme.colors.gray_0}; ${({ theme }) => theme.fonts["body1-normal-medi"]}; `; @@ -95,3 +101,8 @@ const CustomRadio = styled.span<{ checked: boolean }>` content: ""; } `; + +const SoldOutText = styled.span` + color: ${({ theme }) => theme.colors.gray_600}; + ${({ theme }) => theme.fonts["body2-normal-semi"]}; +`; diff --git a/src/pages/book/components/select/RadioGroup.tsx b/src/pages/book/components/select/RadioGroup.tsx index f89e0087..3de53251 100644 --- a/src/pages/book/components/select/RadioGroup.tsx +++ b/src/pages/book/components/select/RadioGroup.tsx @@ -11,6 +11,7 @@ const RadioGroup = ({ selectedValue, handleRadioChange, scheduleList }: SelectPr label={schedule.performanceDate} value={schedule.scheduleId} checked={selectedValue === schedule.scheduleId} + isSoldOut={schedule.availableTicketCount === 0} onChange={handleRadioChange} /> ))} diff --git a/src/pages/book/constants/dummy.ts b/src/pages/book/constants/dummy.ts index f937a671..a38df027 100644 --- a/src/pages/book/constants/dummy.ts +++ b/src/pages/book/constants/dummy.ts @@ -11,7 +11,7 @@ export const BOOK_DETAIL_INFO = { { scheduleId: 1, performanceDate: "2023-12-28T19:30:00", - availableTicketCount: 100, + availableTicketCount: 0, scheduleNumber: "FIRST", }, { @@ -20,5 +20,11 @@ export const BOOK_DETAIL_INFO = { availableTicketCount: 4, scheduleNumber: "SECOND", }, + { + scheduleId: 3, + performanceDate: "2023-12-30T19:30:00", + availableTicketCount: 8, + scheduleNumber: "THIRD", + }, ], }; From 03ccfe262aaf3242828dff4b416936816679a9ee Mon Sep 17 00:00:00 2001 From: jerry Date: Fri, 12 Jul 2024 02:11:01 +0900 Subject: [PATCH 22/29] =?UTF-8?q?feat:=20=ED=9A=8C=EC=9B=90=20=EC=98=88?= =?UTF-8?q?=EB=A7=A4=20=EC=9A=94=EC=B2=AD=20request=20=ED=98=95=EC=8B=9D?= =?UTF-8?q?=EC=97=90=20=EB=A7=9E=EB=8F=84=EB=A1=9D=20formData=20=EC=B6=94?= =?UTF-8?q?=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/book/Book.tsx | 33 +++++++++++++++++++++++++-------- 1 file changed, 25 insertions(+), 8 deletions(-) diff --git a/src/pages/book/Book.tsx b/src/pages/book/Book.tsx index c715f047..9e5e18bb 100644 --- a/src/pages/book/Book.tsx +++ b/src/pages/book/Book.tsx @@ -15,12 +15,17 @@ import { BOOK_DETAIL_INFO } from "./constants/dummy"; const Book = () => { const { performanceId } = useParams<{ performanceId: string }>(); + // TODO: 회원/비회원 여부 + // navigate 할 때 state로 넘기기 ? + const isNonMember = true; + const [detail, setDetail] = useState(BOOK_DETAIL_INFO); const [selectedValue, setSelectedValue] = useState(); const [round, setRound] = useState(1); const [bookerInfo, setBookerInfo] = useState({ - name: "", - phoneNumber: "", + bookerName: "", + bookerPhoneNumber: "", + birthDate: "", }); const [isTermChecked, setIsTermChecked] = useState(false); const [isOpen, setIsOpen] = useState(false); @@ -63,17 +68,25 @@ const Book = () => { }; const handleClickBookRequst = () => { - // TODO: 티켓 매수 요청 get 요청 후, true 인 상태일 때 바텀 시트 열기 - const formData = { selectedValue, round, bookerInfo, isTermChecked }; + // TODO: 티켓 매수 요청 get 요청 후, true 인 상태이면, 바텀 시트 열기 + + const formData = { + scheduleId: performanceId, + selectedValue, + purchaseTicketCount: round, + ...bookerInfo, + totalPaymentAmount: detail.ticketPrice * round, + }; + console.log(formData); - // TODO: 예매하기 post 요청 + // TODO: 회원, 비회원 여부에 따라서 예매하기 post 요청 // TODO: 완료 페이지로 navigate }; useEffect(() => { - if (selectedValue && bookerInfo.name && bookerInfo.phoneNumber && isTermChecked) { + if (selectedValue && bookerInfo.bookerName && bookerInfo.bookerPhoneNumber && isTermChecked) { setActiveButton(true); } else { setActiveButton(false); @@ -106,7 +119,11 @@ const Book = () => { } /> - + - + { - + ); }; export default Book; - -const ContentWrapper = styled.div` - display: flex; - flex-direction: column; - align-items: center; - padding: 0 2.4rem; -`; - -const Divider = styled.div` - width: 375px; - height: 8px; - margin-top: 1.6rem; - - background: ${({ theme }) => theme.colors.gray_800}; - opacity: 0.6; - border: 1px s; -`; - -const FooterContainer = styled.div` - position: sticky; - bottom: 0; - padding: 2.4rem; - - background-color: ${({ theme }) => theme.colors.gray_900}; -`; diff --git a/src/pages/book/components/select/RadioButton.styled.ts b/src/pages/book/components/select/RadioButton.styled.ts new file mode 100644 index 00000000..6d39c789 --- /dev/null +++ b/src/pages/book/components/select/RadioButton.styled.ts @@ -0,0 +1,76 @@ +import styled from "styled-components"; + +export const Label = styled.label<{ checked: boolean; $isSoldOut: boolean }>` + display: flex; + align-items: center; + justify-content: space-between; + padding: 1.2rem 1rem 1.2rem 1.6rem; + + ${({ $isSoldOut, theme }) => + $isSoldOut + ? ` + color: ${theme.colors.gray_600};` + : `color: ${theme.colors.gray_0}`}; + + background-color: ${({ theme }) => theme.colors.gray_800}; + cursor: pointer; + border: 2px solid transparent; + border-radius: 6px; + + ${({ checked, theme }) => + checked && + ` + background-color: ${theme.colors.gray_800}; + border: 2px solid ${theme.colors.pink_400}; + `} +`; + +export const Input = styled.input` + display: none; +`; + +export const DateTimeDivider = styled.div` + display: inline-block; + width: 1px; + height: 12px; + margin: 0 1rem; + + background-color: ${({ theme }) => theme.colors.gray_500}; +`; + +export const Text = styled.span` + ${({ theme }) => theme.fonts["body1-normal-medi"]}; +`; + +export const CustomRadio = styled.span<{ checked: boolean }>` + position: relative; + width: 2rem; + height: 2rem; + padding-right: 0.6rem; + ${({ theme, checked }) => + checked + ? `border: 6px solid ${theme.colors.pink_400}` + : `border: 2px solid ${theme.colors.gray_300}`}; + + border-radius: 100%; + + &::after { + position: absolute; + top: 50%; + left: 50%; + display: ${({ checked }) => (checked ? "block" : "none")}; + width: 1rem; + height: 1rem; + + background-color: ${({ theme }) => theme.colors.white}; + transform: translate(-50%, -50%); + border-radius: 50%; + + content: ""; + } +`; + +export const SoldOutText = styled.span` + color: ${({ theme }) => theme.colors.gray_600}; + ${({ theme }) => theme.fonts["body2-normal-semi"]}; +`; diff --git a/src/pages/book/components/select/RadioButton.tsx b/src/pages/book/components/select/RadioButton.tsx index cec185ae..bc8e379c 100644 --- a/src/pages/book/components/select/RadioButton.tsx +++ b/src/pages/book/components/select/RadioButton.tsx @@ -1,4 +1,4 @@ -import styled from "styled-components"; +import * as S from "./RadioButton.styled"; interface RadioButtonProps { label: string; @@ -11,98 +11,23 @@ interface RadioButtonProps { const RadioButton = ({ label, value, checked, isSoldOut, onChange }: RadioButtonProps) => { const [date, time] = label.split("T"); return ( - + ); }; export default RadioButton; - -const Label = styled.label<{ checked: boolean; $isSoldOut: boolean }>` - display: flex; - align-items: center; - justify-content: space-between; - padding: 1.2rem 1rem 1.2rem 1.6rem; - - ${({ $isSoldOut, theme }) => - $isSoldOut - ? ` - color: ${theme.colors.gray_600};` - : `color: ${theme.colors.gray_0}`}; - - background-color: ${({ theme }) => theme.colors.gray_800}; - cursor: pointer; - border: 2px solid transparent; - border-radius: 6px; - - ${({ checked, theme }) => - checked && - ` - background-color: ${theme.colors.gray_800}; - border: 2px solid ${theme.colors.pink_400}; - `} -`; - -const Input = styled.input` - display: none; -`; - -const DateTimeDivider = styled.div` - display: inline-block; - width: 1px; - height: 12px; - margin: 0 1rem; - - background-color: ${({ theme }) => theme.colors.gray_500}; -`; - -const Text = styled.span` - ${({ theme }) => theme.fonts["body1-normal-medi"]}; -`; - -const CustomRadio = styled.span<{ checked: boolean }>` - position: relative; - width: 2rem; - height: 2rem; - padding-right: 0.6rem; - ${({ theme, checked }) => - checked - ? `border: 6px solid ${theme.colors.pink_400}` - : `border: 2px solid ${theme.colors.gray_300}`}; - - border-radius: 100%; - - &::after { - position: absolute; - top: 50%; - left: 50%; - display: ${({ checked }) => (checked ? "block" : "none")}; - width: 1rem; - height: 1rem; - - background-color: ${({ theme }) => theme.colors.white}; - transform: translate(-50%, -50%); - border-radius: 50%; - - content: ""; - } -`; - -const SoldOutText = styled.span` - color: ${({ theme }) => theme.colors.gray_600}; - ${({ theme }) => theme.fonts["body2-normal-semi"]}; -`; From 1470b6ba0de232272c48285ffb1fb10d33b3f292 Mon Sep 17 00:00:00 2001 From: jerry Date: Sun, 14 Jul 2024 22:49:46 +0900 Subject: [PATCH 29/29] =?UTF-8?q?fix:=20formData=20=ED=83=80=EC=9E=85=20?= =?UTF-8?q?=EB=B3=80=EA=B2=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/book/typings/formData.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/pages/book/typings/formData.ts b/src/pages/book/typings/formData.ts index fd796dfc..37c695b1 100644 --- a/src/pages/book/typings/formData.ts +++ b/src/pages/book/typings/formData.ts @@ -3,8 +3,8 @@ export interface FormData { selectedValue: number | undefined; purchaseTicketCount: number; totalPaymentAmount: number; - bookerName?: string; - bookerPhoneNumber?: string; + bookerName: string; + bookerPhoneNumber: string; // 비회원일 경우에만 추가될 속성 birthDate?: string; password?: string;