Boolti-221 fix: 결제 완료 페이지에 결제 수단 및 할부 정보 추가

Nexters · Apr 24, 2024 · 84d66ba · 84d66ba
1 parent aa67007
commit 84d66ba
Show file tree

Hide file tree

Showing 8 changed files with 93 additions and 130 deletions.
diff --git a/data/src/main/java/com/nexters/boolti/data/network/request/ReservationSalesTicketRequest.kt b/data/src/main/java/com/nexters/boolti/data/network/request/ReservationSalesTicketRequest.kt
@@ -1,6 +1,10 @@
 package com.nexters.boolti.data.network.request
 
-import com.nexters.boolti.domain.model.PaymentType
+import com.nexters.boolti.domain.model.PaymentType.ACCOUNT_TRANSFER
+import com.nexters.boolti.domain.model.PaymentType.CARD
+import com.nexters.boolti.domain.model.PaymentType.FREE
+import com.nexters.boolti.domain.model.PaymentType.SIMPLE_PAYMENT
+import com.nexters.boolti.domain.model.PaymentType.UNDEFINED
 import com.nexters.boolti.domain.request.TicketingRequest
 import kotlinx.serialization.Serializable
 
@@ -29,8 +33,10 @@ internal fun TicketingRequest.Normal.toData(): ReservationSalesTicketRequest = R
     depositorPhoneNumber = depositorPhoneNumber,
     paymentAmount = paymentAmount,
     means = when (paymentType) {
-        PaymentType.ACCOUNT_TRANSFER -> "ACCOUNT_TRANSFER"
-        PaymentType.CARD -> "CARD"
-        PaymentType.UNDEFINED -> ""
+        ACCOUNT_TRANSFER -> "ACCOUNT_TRANSFER"
+        CARD -> "CARD"
+        SIMPLE_PAYMENT -> "SIMPLE_PAYMENT"
+        FREE -> "FREE"
+        UNDEFINED -> ""
     },
 )
diff --git a/data/src/main/java/com/nexters/boolti/data/network/response/ReservationDetailResponse.kt b/data/src/main/java/com/nexters/boolti/data/network/response/ReservationDetailResponse.kt
@@ -28,6 +28,7 @@ internal data class ReservationDetailResponse(
     val depositorName: String = "",
     val depositorPhoneNumber: String = "",
     val csReservationId: String,
+    val cardDetail: CardDetailResponse? = null,
 ) {
     fun toDomain(): ReservationDetail {
         return ReservationDetail(
@@ -51,6 +52,18 @@ internal data class ReservationDetailResponse(
             depositorName = depositorName,
             depositorPhoneNumber = depositorPhoneNumber,
             csReservationId = csReservationId,
+            cardDetail = cardDetail?.toDomain(),
+        )
+    }
+
+    @Serializable
+    internal data class CardDetailResponse(
+        val installmentPlanMonths: Int,
+        val issuerCode: String,
+    ) {
+        fun toDomain(): ReservationDetail.CardDetail = ReservationDetail.CardDetail(
+            installmentPlanMonths = installmentPlanMonths,
+            issuerCode = issuerCode,
         )
     }
 }
diff --git a/domain/src/main/java/com/nexters/boolti/domain/model/PaymentType.kt b/domain/src/main/java/com/nexters/boolti/domain/model/PaymentType.kt
@@ -3,5 +3,7 @@ package com.nexters.boolti.domain.model
 enum class PaymentType {
     ACCOUNT_TRANSFER,
     CARD,
+    FREE,
+    SIMPLE_PAYMENT,
     UNDEFINED,
 }
diff --git a/domain/src/main/java/com/nexters/boolti/domain/model/ReservationDetail.kt b/domain/src/main/java/com/nexters/boolti/domain/model/ReservationDetail.kt
@@ -23,4 +23,14 @@ data class ReservationDetail(
     val depositorName: String,
     val depositorPhoneNumber: String,
     val csReservationId: String,
-)
+    val cardDetail: CardDetail?,
+) {
+    /**
+     * @param installmentPlanMonths 할부 개월 수. 0 이면 일시불
+     * @param issuerCode 카드 발급사 [숫자 코드](https://docs.tosspayments.com/reference/codes#%EC%B9%B4%EB%93%9C%EC%82%AC-%EC%BD%94%EB%93%9C)
+     */
+    data class CardDetail(
+        val installmentPlanMonths: Int,
+        val issuerCode: String,
+    )
+}
diff --git a/...ion/src/main/java/com/nexters/boolti/presentation/screen/payment/PaymentCompleteScreen.kt b/...ion/src/main/java/com/nexters/boolti/presentation/screen/payment/PaymentCompleteScreen.kt
@@ -18,7 +18,8 @@ import androidx.compose.ui.Modifier
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
-import com.nexters.boolti.domain.model.PaymentType
+import com.nexters.boolti.domain.model.PaymentType.ACCOUNT_TRANSFER
+import com.nexters.boolti.domain.model.PaymentType.CARD
 import com.nexters.boolti.domain.model.ReservationDetail
 import com.nexters.boolti.domain.model.ReservationState
 import com.nexters.boolti.presentation.R
@@ -67,13 +68,33 @@ fun PaymentCompleteScreen(
             }
             SectionDivider(modifier = Modifier.padding(top = 24.dp))
 
+            val payment = when (reservation.paymentType) {
+                ACCOUNT_TRANSFER -> stringResource(R.string.payment_account_transfer)
+                CARD -> {
+                    val installment = reservation.cardDetail?.installmentPlanMonths?.let { months ->
+                        if (months == 0) {
+                            stringResource(R.string.payment_pay_in_full)
+                        } else {
+                            stringResource(R.string.payment_installment_plan_months, months)
+                        }
+                    }
+                    StringBuilder(reservation.bankName)
+                        .apply {
+                            installment?.let { append(" / $it") }
+                        }
+                        .toString()
+                }
+
+                else -> null
+            }
             InfoRow(
                 modifier = Modifier.padding(top = 24.dp),
                 label = stringResource(R.string.payment_amount_label),
                 value = stringResource(
                     R.string.unit_won,
                     reservation.totalAmountPrice
-                ), // TODO (카카오뱅크카드 / 일시불) 형태의 정보 추가
+                ),
+                value2 = payment?.let { "($it)" },
             )
             InfoRow(
                 modifier = Modifier.padding(top = 16.dp),
@@ -135,23 +156,34 @@ private fun InfoRow(
     modifier: Modifier = Modifier,
     label: String,
     value: String,
+    value2: String? = null,
 ) {
-    Row(
-        modifier = modifier,
-        verticalAlignment = Alignment.CenterVertically,
-    ) {
-        Text(
-            modifier = Modifier.width(100.dp),
-            text = label,
-            style = MaterialTheme.typography.bodyLarge,
-            color = Grey30,
-        )
-        Text(
-            modifier = Modifier.padding(horizontal = 12.dp),
-            text = value,
-            style = MaterialTheme.typography.bodyLarge,
-            color = Grey15,
-        )
+    Column {
+        Row(
+            modifier = modifier,
+            verticalAlignment = Alignment.CenterVertically,
+        ) {
+            Text(
+                modifier = Modifier.width(100.dp),
+                text = label,
+                style = MaterialTheme.typography.bodyLarge,
+                color = Grey30,
+            )
+            Text(
+                modifier = Modifier.padding(horizontal = 12.dp),
+                text = value,
+                style = MaterialTheme.typography.bodyLarge,
+                color = Grey15,
+            )
+        }
+        value2?.let {
+            Text(
+                modifier = Modifier.padding(horizontal = 112.dp),
+                text = it,
+                style = MaterialTheme.typography.bodyLarge,
+                color = Grey15,
+            )
+        }
     }
 }
 
@@ -177,19 +209,20 @@ private fun PaymentCompleteScreenPreview() {
                 ticketName = "Juliet Greer",
                 isInviteTicket = false,
                 ticketCount = 6931,
-                bankName = "Corinne Leon",
+                bankName = "카카오뱅크카드",
                 accountNumber = "graece",
                 accountHolder = "reprimique",
                 salesEndDateTime = LocalDateTime.now(),
-                paymentType = PaymentType.UNDEFINED,
+                paymentType = CARD,
                 totalAmountPrice = 3473,
                 reservationState = ReservationState.REFUNDING,
                 completedDateTime = null,
                 ticketHolderName = "Cedric Butler",
                 ticketHolderPhoneNumber = "(453) 355-6682",
                 depositorName = "Dick Haley",
                 depositorPhoneNumber = "(869) 823-0418",
-                csReservationId = "mutat"
+                csReservationId = "mutat",
+                cardDetail = ReservationDetail.CardDetail(3, ""),
             ),
             navigateToReservation = {},
             navigateToTicketDetail = {},

diff --git a/presentation/src/main/java/com/nexters/boolti/presentation/screen/payment/PaymentScreen.kt b/presentation/src/main/java/com/nexters/boolti/presentation/screen/payment/PaymentScreen.kt
@@ -1,6 +1,5 @@
 package com.nexters.boolti.presentation.screen.payment
 
-import android.os.Build
 import androidx.activity.compose.BackHandler
 import androidx.compose.foundation.layout.padding
 import androidx.compose.material3.Scaffold
@@ -14,20 +13,17 @@ import androidx.compose.ui.Modifier
 import androidx.compose.ui.platform.LocalClipboardManager
 import androidx.compose.ui.platform.LocalContext
 import androidx.compose.ui.res.stringResource
-import androidx.compose.ui.text.AnnotatedString
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
 import androidx.hilt.navigation.compose.hiltViewModel
 import androidx.lifecycle.compose.collectAsStateWithLifecycle
-import com.nexters.boolti.domain.model.PaymentType
 import com.nexters.boolti.domain.model.ReservationDetail
 import com.nexters.boolti.domain.model.ReservationState
 import com.nexters.boolti.presentation.R
 import com.nexters.boolti.presentation.component.BtAppBar
 import com.nexters.boolti.presentation.component.BtAppBarDefaults
 import com.nexters.boolti.presentation.component.ToastSnackbarHost
 import com.nexters.boolti.presentation.theme.BooltiTheme
-import kotlinx.coroutines.launch
 
 @Composable
 fun PaymentScreen(
@@ -70,44 +66,13 @@ fun PaymentScreen(
                             navigateToTicketDetail = navigateToTicketDetail,
                         )
 
-                    else -> ProgressPayment(
-                        modifier = Modifier.padding(innerPadding),
-                        reservation = reservation,
-                        onClickCopyAccountNumber = {
-                            clipboardManager.setText(AnnotatedString(it))
-                            if (Build.VERSION.SDK_INT <= Build.VERSION_CODES.S_V2) {
-                                scope.launch {
-                                    snackbarHostState.showSnackbar(
-                                        message = context.getString(R.string.account_number_copied_message),
-                                    )
-                                }
-                            }
-                        }
-                    )
+                    else -> Unit
                 }
             }
         }
     }
 }
 
-@Composable
-private fun ProgressPayment(
-    modifier: Modifier = Modifier,
-    reservation: ReservationDetail,
-    onClickCopyAccountNumber: (accountNumber: String) -> Unit,
-) {
-    when (reservation.paymentType) {
-        PaymentType.ACCOUNT_TRANSFER -> AccountTransferContent(
-            modifier = modifier,
-            reservation = reservation,
-            onClickCopyAccountNumber = onClickCopyAccountNumber
-        )
-
-        PaymentType.CARD -> Unit
-        PaymentType.UNDEFINED -> Unit
-    }
-}
-
 @Composable
 private fun PaymentToolbar(
     onClickHome: () -> Unit,

diff --git a/...ntation/src/main/java/com/nexters/boolti/presentation/screen/ticketing/TicketingScreen.kt b/...ntation/src/main/java/com/nexters/boolti/presentation/screen/ticketing/TicketingScreen.kt
@@ -8,13 +8,9 @@ import androidx.compose.animation.core.Spring
 import androidx.compose.animation.core.animateFloatAsState
 import androidx.compose.animation.core.spring
 import androidx.compose.animation.core.tween
-import androidx.compose.foundation.ExperimentalFoundationApi
-import androidx.compose.foundation.MarqueeAnimationMode
 import androidx.compose.foundation.background
-import androidx.compose.foundation.basicMarquee
 import androidx.compose.foundation.border
 import androidx.compose.foundation.clickable
-import androidx.compose.foundation.focusable
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
@@ -50,8 +46,6 @@ import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.clip
 import androidx.compose.ui.draw.rotate
-import androidx.compose.ui.focus.FocusRequester
-import androidx.compose.ui.focus.focusRequester
 import androidx.compose.ui.graphics.Brush
 import androidx.compose.ui.graphics.RectangleShape
 import androidx.compose.ui.layout.ContentScale
@@ -73,10 +67,6 @@ import androidx.lifecycle.compose.collectAsStateWithLifecycle
 import coil.compose.AsyncImage
 import com.nexters.boolti.domain.model.Currency
 import com.nexters.boolti.domain.model.InviteCodeStatus
-import com.nexters.boolti.domain.model.PaymentType
-import com.nexters.boolti.domain.model.PaymentType.ACCOUNT_TRANSFER
-import com.nexters.boolti.domain.model.PaymentType.CARD
-import com.nexters.boolti.domain.model.PaymentType.UNDEFINED
 import com.nexters.boolti.presentation.BuildConfig
 import com.nexters.boolti.presentation.R
 import com.nexters.boolti.presentation.component.BTTextField
@@ -799,51 +789,6 @@ private fun SectionTicketInfo(label: String, value: String, marginTop: Dp = 16.d
     }
 }
 
-@OptIn(ExperimentalFoundationApi::class)
-@Composable
-private fun PaymentType(
-    paymentType: PaymentType,
-    modifier: Modifier = Modifier,
-    selected: Boolean = false,
-    onClick: () -> Unit,
-) {
-    val focusRequester = remember { FocusRequester() }
-    val label = when (paymentType) {
-        ACCOUNT_TRANSFER -> stringResource(R.string.payment_account_transfer)
-        CARD -> stringResource(R.string.payment_credit_check_card)
-        UNDEFINED -> ""
-    }
-
-    LaunchedEffect(selected) {
-        if (selected) focusRequester.requestFocus()
-    }
-
-    Box(
-        modifier = modifier
-            .clip(RoundedCornerShape(4.dp))
-            .background(MaterialTheme.colorScheme.surfaceTint)
-            .border(
-                width = 1.dp,
-                color = if (selected) MaterialTheme.colorScheme.outlineVariant else MaterialTheme.colorScheme.outline,
-                shape = RoundedCornerShape(4.dp),
-            )
-            .clickable(onClick = onClick),
-        contentAlignment = Alignment.Center,
-    ) {
-        Text(
-            modifier = Modifier
-                .padding(vertical = 12.dp)
-                .basicMarquee(animationMode = MarqueeAnimationMode.WhileFocused)
-                .focusRequester(focusRequester)
-                .focusable(),
-            text = label,
-            style = MaterialTheme.typography.bodyLarge,
-            color = if (selected) MaterialTheme.colorScheme.onSurface else MaterialTheme.colorScheme.onSurfaceVariant,
-            maxLines = 1,
-        )
-    }
-}
-
 @Preview
 @Composable
 private fun TicketingDetailScreenPreview() {
@@ -873,16 +818,3 @@ private fun OrderAgreementItemPreview() {
         }
     }
 }
-
-@Preview
-@Composable
-private fun PaymentTypePreview() {
-    BooltiTheme {
-        Surface {
-            PaymentType(
-                paymentType = CARD,
-                selected = true,
-            ) {}
-        }
-    }
-}
diff --git a/presentation/src/main/res/values/strings.xml b/presentation/src/main/res/values/strings.xml
@@ -132,6 +132,8 @@
     <string name="payment_credit_check_card">신용・체크 카드</string>
     <string name="payment_account_transfer">계좌 이체</string>
     <string name="payment_card">카드</string>
+    <string name="payment_installment_plan_months">%d개월</string>
+    <string name="payment_pay_in_full">일시불</string>
     <string name="name_label">이름</string>
     <string name="contact_label">연락처</string>
     <string name="ticketing_name_placeholder">실명을 입력해 주세요</string>