fix: 결제, 방문자 관리 이슈 수정 모음 (1)

apps/admin/src/components/EnteranceTable/EnteranceTable.styles.ts

@@ -30,7 +30,7 @@ const HeaderItem = styled.span`
     margin-right: 12px;
   }
   &:nth-of-type(1) {
-    width: 120px;
+    width: 130px;
   }
   &:nth-of-type(2) {
     width: 100px;
@@ -74,7 +74,7 @@ const Item = styled.span`
     margin-right: 12px;
   }
   &:nth-of-type(1) {
-    width: 120px;
+    width: 130px;
   }
   &:nth-of-type(2) {
     width: 100px;

apps/admin/src/components/ReservationTable/index.tsx

@@ -20,25 +20,32 @@ const getColumns = (ticketStatus: TicketStatus) => [
   columnHelper.accessor('csReservationId', {
     header: '주문 번호',
   }),
-  columnHelper.accessor('paymentInfo.payerName', {
+  columnHelper.accessor('paymentInfo', {
     header: '결제자명',
+    id: 'payerName',
     cell: (props) => {
       const { searchText = '' } = (props.table.options.meta ?? {}) as { searchText: string };
       return (
         <span
-          dangerouslySetInnerHTML={{ __html: boldText(props.getValue() ?? '-', searchText) }}
+          dangerouslySetInnerHTML={{
+            __html: boldText(props.getValue()?.payerName ?? '-', searchText),
+          }}
         ></span>
       );
     },
   }),
-  columnHelper.accessor('paymentInfo.payerPhoneNumber', {
+  columnHelper.accessor('paymentInfo', {
     header: '연락처',
+    id: 'payerPhoneNumber',
     cell: (props) => {
       const { searchText = '' } = (props.table.options.meta ?? {}) as { searchText: string };
       return (
         <span
           dangerouslySetInnerHTML={{
-            __html: boldText(formatPhoneNumber(props.getValue() ?? '-'), searchText),
+            __html: boldText(
+              formatPhoneNumber(props.getValue()?.payerPhoneNumber ?? '-'),
+              searchText,
+            ),
           }}
         ></span>
       );

apps/admin/src/components/ShowDetailLayout/index.tsx

@@ -238,8 +238,8 @@ const ShowDetailLayout = ({ children }: ShowDetailLayoutProps) => {
                 <Styled.Tab>
                   <TabItem type="INFO" />
                   <TabItem type="TICKET" />
-                  <TabItem type="RESERVATION" />
                   <TabItem type="ENTRANCE" />
+                  <TabItem type="RESERVATION" />
                   <TabItem type="SETTLEMENT" />
                 </Styled.Tab>
               </Styled.TabContainer>

apps/admin/src/components/TicketNameFilter/index.tsx

@@ -64,11 +64,7 @@ const TicketFilterOptions = ({
           size="regular"
           disabled={tempSelectedValues.length === 0}
           onClick={() => {
-            if (
-              tempSelectedValues.length > 0 &&
-              selectedValues.length === 0 &&
-              tempSelectedValues.length !== options.length
-            ) {
+            if (tempSelectedValues.length > 0) {
               updateSelectValues(tempSelectedValues);
             }
             close();

apps/admin/src/pages/ShowReservationPage/ShowReservationPage.styles.ts

@@ -37,21 +37,22 @@ const EmptyTitle = styled.p`
 
 const TicketSummaryContainer = styled.div`
   display: grid;
-  grid-template-columns: 1fr 1fr;
+  grid-template-columns: 1fr;
   grid-gap: 8px;
   margin-bottom: 32px;
   ${mq_lg} {
     margin-bottom: 40px;
+    grid-template-columns: 1fr 1fr;
     display: flex;
   }
 `;
 
 const TicketSummary = styled.div<{ colorTheme: 'grey' | 'red' }>`
   display: flex;
   justify-content: space-between;
-  flex-direction: column;
+  flex-direction: row;
   align-items: start;
-  padding: 16px 20px;
+  padding: 12px 16px;
   border-radius: 8px;
   ${({ colorTheme, theme }) => {
     switch (colorTheme) {
@@ -71,9 +72,9 @@ const TicketSummary = styled.div<{ colorTheme: 'grey' | 'red' }>`
     }
   }}
   ${mq_lg} {
-    flex-direction: row;
-    width: 260px;
+    flex: 1;
     align-items: center;
+    padding: 16px 20px;
     &:not(:last-child) {
       margin-right: 12px;
     }

apps/admin/src/pages/ShowReservationPage/index.tsx

@@ -79,7 +79,6 @@ const ShowReservationPage = () => {
   const {
     salesTicketSoldCount,
     totalSalesAmount,
-    invitationTicketSoldCount,
     totalSoldCount,
     completeCount,
     waitCount,
@@ -100,19 +99,15 @@ const ShowReservationPage = () => {
         <Styled.Container>
           <Styled.TicketSummaryContainer>
             <Styled.TicketSummary colorTheme="grey">
-              <Styled.TicketSumamryLabel>일반 티켓</Styled.TicketSumamryLabel>
+              <Styled.TicketSumamryLabel>결제 건수</Styled.TicketSumamryLabel>
               <Styled.TicketSumamryValue>{salesTicketSoldCount}매</Styled.TicketSumamryValue>
             </Styled.TicketSummary>
             <Styled.TicketSummary colorTheme="grey">
-              <Styled.TicketSumamryLabel>초청 티켓</Styled.TicketSumamryLabel>
-              <Styled.TicketSumamryValue>{invitationTicketSoldCount}매</Styled.TicketSumamryValue>
-            </Styled.TicketSummary>
-            <Styled.TicketSummary colorTheme="grey">
-              <Styled.TicketSumamryLabel>총 발권된 티켓</Styled.TicketSumamryLabel>
+              <Styled.TicketSumamryLabel>발권 티켓</Styled.TicketSumamryLabel>
               <Styled.TicketSumamryValue>{totalSoldCount}매</Styled.TicketSumamryValue>
             </Styled.TicketSummary>
             <Styled.TicketSummary colorTheme="red">
-              <Styled.TicketSumamryLabel>공연 수익</Styled.TicketSumamryLabel>
+              <Styled.TicketSumamryLabel>결제 금액</Styled.TicketSumamryLabel>
               <Styled.TicketSumamryValue>
                 {totalSalesAmount.toLocaleString()}원
               </Styled.TicketSumamryValue>

packages/api/src/queryKey.ts

@@ -262,7 +262,7 @@ export const adminTicketQueryKeys = createQueryKeys('adminTicket', {
         reservationNameOrPhoneNumber,
         salesTicketTypeId: salesTicketTypeId.join(','),
       };
-      if (isUsed) {
+      if (typeof isUsed !== 'undefined') {
         searchParams.isUsed = isUsed;
       }
       return fetcher.get<PageTicketWithReservationResponse>(`web/v1/shows/${showId}/tickets`, {