From 275a57880f41740deea5a2e938e3d891536e31b1 Mon Sep 17 00:00:00 2001 From: jinukeu Date: Sat, 20 Jan 2024 15:32:03 +0900 Subject: [PATCH 1/3] =?UTF-8?q?feat:=20=EB=B0=9B=EC=9D=80=20=EB=B4=89?= =?UTF-8?q?=ED=88=AC=20=EC=83=81=EC=84=B8=20ui?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../susu/feature/navigator/MainNavigator.kt | 6 + .../com/susu/feature/navigator/MainScreen.kt | 1 + .../ReceivedEnvelopeDetailScreen.kt | 126 ++++++++++++++++++ .../envelopdetail/component/DetailItem.kt | 72 ++++++++++ .../ledgerdetail/LedgerDetailContract.kt | 1 + .../ledgerdetail/LedgerDetailScreen.kt | 3 + .../ledgerdetail/LedgerDetailViewModel.kt | 1 + .../received/navigation/ReceivedNavigation.kt | 17 +++ 8 files changed, 227 insertions(+) create mode 100644 feature/received/src/main/java/com/susu/feature/received/envelopdetail/ReceivedEnvelopeDetailScreen.kt create mode 100644 feature/received/src/main/java/com/susu/feature/received/envelopdetail/component/DetailItem.kt diff --git a/feature/navigator/src/main/java/com/susu/feature/navigator/MainNavigator.kt b/feature/navigator/src/main/java/com/susu/feature/navigator/MainNavigator.kt index 2868279f..c041a6b1 100644 --- a/feature/navigator/src/main/java/com/susu/feature/navigator/MainNavigator.kt +++ b/feature/navigator/src/main/java/com/susu/feature/navigator/MainNavigator.kt @@ -17,6 +17,7 @@ import com.susu.feature.mypage.navigation.navigateMyPageInfo import com.susu.feature.mypage.navigation.navigateMyPageSocial import com.susu.feature.received.navigation.ReceivedRoute import com.susu.feature.received.navigation.navigateEnvelopeAdd +import com.susu.feature.received.navigation.navigateEnvelopeDetail import com.susu.feature.received.navigation.navigateLedgerAdd import com.susu.feature.received.navigation.navigateLedgerDetail import com.susu.feature.received.navigation.navigateLedgerEdit @@ -50,6 +51,7 @@ internal class MainNavigator( in listOf( ReceivedRoute.ledgerSearchRoute, ReceivedRoute.ledgerFilterRoute, + ReceivedRoute.envelopeDetailRoute, SentRoute.sentEnvelopeRoute, SentRoute.sentEnvelopeDetailRoute, SentRoute.sentEnvelopeEditRoute, @@ -149,6 +151,10 @@ internal class MainNavigator( navController.navigateEnvelopeAdd() } + fun navigateEnvelopeDetail() { + navController.navigateEnvelopeDetail() + } + fun popBackStackIfNotHome() { if (!isSameCurrentDestination(SentRoute.route)) { navController.popBackStack() diff --git a/feature/navigator/src/main/java/com/susu/feature/navigator/MainScreen.kt b/feature/navigator/src/main/java/com/susu/feature/navigator/MainScreen.kt index 6227a1e0..71d8c489 100644 --- a/feature/navigator/src/main/java/com/susu/feature/navigator/MainScreen.kt +++ b/feature/navigator/src/main/java/com/susu/feature/navigator/MainScreen.kt @@ -108,6 +108,7 @@ internal fun MainScreen( navigateLedgerFilter = navigator::navigateLedgerFilter, navigateLedgerAdd = navigator::navigateLedgerAdd, navigateEnvelopAdd = navigator::navigateEnvelopeAdd, + navigateEnvelopeDetail = navigator::navigateEnvelopeDetail, onShowSnackbar = viewModel::onShowSnackbar, onShowDialog = viewModel::onShowDialog, handleException = viewModel::handleException, diff --git a/feature/received/src/main/java/com/susu/feature/received/envelopdetail/ReceivedEnvelopeDetailScreen.kt b/feature/received/src/main/java/com/susu/feature/received/envelopdetail/ReceivedEnvelopeDetailScreen.kt new file mode 100644 index 00000000..3b0b4203 --- /dev/null +++ b/feature/received/src/main/java/com/susu/feature/received/envelopdetail/ReceivedEnvelopeDetailScreen.kt @@ -0,0 +1,126 @@ +package com.susu.feature.received.envelopdetail + +import androidx.compose.foundation.background +import androidx.compose.foundation.layout.Box +import androidx.compose.foundation.layout.Column +import androidx.compose.foundation.layout.Spacer +import androidx.compose.foundation.layout.fillMaxSize +import androidx.compose.foundation.layout.padding +import androidx.compose.foundation.layout.size +import androidx.compose.foundation.rememberScrollState +import androidx.compose.foundation.verticalScroll +import androidx.compose.material3.Text +import androidx.compose.runtime.Composable +import androidx.compose.ui.Modifier +import androidx.compose.ui.tooling.preview.Preview +import com.susu.core.designsystem.component.appbar.SusuDefaultAppBar +import com.susu.core.designsystem.component.appbar.icon.BackIcon +import com.susu.core.designsystem.component.appbar.icon.DeleteText +import com.susu.core.designsystem.component.appbar.icon.EditText +import com.susu.core.designsystem.theme.Gray100 +import com.susu.core.designsystem.theme.SusuTheme +import com.susu.feature.received.envelopdetail.component.DetailItem + +@Composable +fun ReceivedEnvelopeDetailRoute( + popBackStack: () -> Unit, + navigateReceivedEnvelopeEdit: () -> Unit, +) { + + ReceivedEnvelopeDetailScreen( + onClickEdit = navigateReceivedEnvelopeEdit, + ) +} + +@Composable +fun ReceivedEnvelopeDetailScreen( + modifier: Modifier = Modifier, + onClickBackIcon: () -> Unit = {}, + onClickEdit: () -> Unit = {}, + onClickDelete: () -> Unit = {}, +) { + val scrollState = rememberScrollState() + + Box( + modifier = modifier + .background(SusuTheme.colorScheme.background10), + ) { + Column { + SusuDefaultAppBar( + leftIcon = { + BackIcon( + onClick = onClickBackIcon, + ) + }, + actions = { + EditText( + onClick = onClickEdit, + ) + Spacer(modifier = modifier.size(SusuTheme.spacing.spacing_m)) + DeleteText( + onClick = onClickDelete, + ) + Spacer(modifier = modifier.size(SusuTheme.spacing.spacing_m)) + }, + ) + // TODO: text 수정 + Column( + modifier = modifier + .fillMaxSize() + .padding( + start = SusuTheme.spacing.spacing_m, + end = SusuTheme.spacing.spacing_m, + top = SusuTheme.spacing.spacing_xl, + ) + .verticalScroll(scrollState), + ) { + Text( + text = "150,000원", + style = SusuTheme.typography.title_xxl, + color = Gray100, + ) + Spacer(modifier = modifier.size(SusuTheme.spacing.spacing_m)) + Column { + DetailItem( + categoryText = "이름", + contentText = "김철수", + isEmptyContent = false, + ) + DetailItem( + categoryText = "나와의 관계", + contentText = "친구", + isEmptyContent = false, + ) + DetailItem( + categoryText = "방문 여부", + contentText = "예", + isEmptyContent = false, + ) + DetailItem( + categoryText = "선물", + contentText = "한끼 식사", + isEmptyContent = false, + ) + DetailItem( + categoryText = "연락처", + contentText = "01012345678", + isEmptyContent = false, + ) + DetailItem( + categoryText = "메모", + contentText = "가나다라마바사아자차카타파하가나다라마바사아자차카타파하가나다라마바사아자차카타파하가나다라마바사아자차카타파하가나다라마바사아자차카타파하", + isEmptyContent = false, + ) + } + } + } + } +} + +@Preview +@Composable +fun ReceivedEnvelopeDetailScreenPreview() { + SusuTheme { + ReceivedEnvelopeDetailScreen() + } +} diff --git a/feature/received/src/main/java/com/susu/feature/received/envelopdetail/component/DetailItem.kt b/feature/received/src/main/java/com/susu/feature/received/envelopdetail/component/DetailItem.kt new file mode 100644 index 00000000..b4ab7ddd --- /dev/null +++ b/feature/received/src/main/java/com/susu/feature/received/envelopdetail/component/DetailItem.kt @@ -0,0 +1,72 @@ +package com.susu.feature.received.envelopdetail.component + +import androidx.compose.foundation.layout.PaddingValues +import androidx.compose.foundation.layout.Row +import androidx.compose.foundation.layout.Spacer +import androidx.compose.foundation.layout.fillMaxWidth +import androidx.compose.foundation.layout.padding +import androidx.compose.foundation.layout.size +import androidx.compose.foundation.layout.width +import androidx.compose.material3.Text +import androidx.compose.runtime.Composable +import androidx.compose.ui.Alignment +import androidx.compose.ui.Modifier +import androidx.compose.ui.graphics.Color +import androidx.compose.ui.text.TextStyle +import androidx.compose.ui.tooling.preview.Preview +import androidx.compose.ui.unit.Dp +import androidx.compose.ui.unit.dp +import com.susu.core.designsystem.theme.Gray100 +import com.susu.core.designsystem.theme.Gray60 +import com.susu.core.designsystem.theme.SusuTheme + +@Composable +fun DetailItem( + modifier: Modifier = Modifier, + categoryText: String, + categoryStyle: TextStyle = SusuTheme.typography.title_xxs, + categoryTextColor: Color = Gray60, + categoryWidth: Dp = 72.dp, + contentText: String, + contentStyle: TextStyle = SusuTheme.typography.title_s, + contentColor: Color = Gray100, + isEmptyContent: Boolean, + padding: PaddingValues = PaddingValues(vertical = SusuTheme.spacing.spacing_m), +) { + if (!isEmptyContent) { + Row( + modifier = modifier + .fillMaxWidth() + .padding(padding), + verticalAlignment = Alignment.CenterVertically, + ) { + Text( + text = categoryText, + style = categoryStyle, + color = categoryTextColor, + modifier = modifier + .width(categoryWidth) + .align(Alignment.Top), + ) + Spacer(modifier = modifier.size(SusuTheme.spacing.spacing_m)) + Text( + text = contentText, + style = contentStyle, + color = contentColor, + modifier = modifier.weight(1f), + ) + } + } +} + +@Preview(showBackground = true, backgroundColor = 0xffffff) +@Composable +fun DetailItem() { + SusuTheme { + DetailItem( + categoryText = "경조사", + contentText = "결혼식", + isEmptyContent = false, + ) + } +} diff --git a/feature/received/src/main/java/com/susu/feature/received/ledgerdetail/LedgerDetailContract.kt b/feature/received/src/main/java/com/susu/feature/received/ledgerdetail/LedgerDetailContract.kt index 0b07876d..4bfd6851 100644 --- a/feature/received/src/main/java/com/susu/feature/received/ledgerdetail/LedgerDetailContract.kt +++ b/feature/received/src/main/java/com/susu/feature/received/ledgerdetail/LedgerDetailContract.kt @@ -15,6 +15,7 @@ data class LedgerDetailState( sealed interface LedgerDetailSideEffect : SideEffect { data object NavigateEnvelopeAdd : LedgerDetailSideEffect + data object NavigateEnvelopeDetail : LedgerDetailSideEffect data class NavigateLedgerEdit(val ledger: Ledger) : LedgerDetailSideEffect data class PopBackStackWithLedger(val ledger: String) : LedgerDetailSideEffect data class PopBackStackWithDeleteLedgerId(val ledgerId: Int) : LedgerDetailSideEffect diff --git a/feature/received/src/main/java/com/susu/feature/received/ledgerdetail/LedgerDetailScreen.kt b/feature/received/src/main/java/com/susu/feature/received/ledgerdetail/LedgerDetailScreen.kt index 526093f4..d6dcd1ba 100644 --- a/feature/received/src/main/java/com/susu/feature/received/ledgerdetail/LedgerDetailScreen.kt +++ b/feature/received/src/main/java/com/susu/feature/received/ledgerdetail/LedgerDetailScreen.kt @@ -53,6 +53,7 @@ fun LedgerDetailRoute( ledger: String?, navigateLedgerEdit: (Ledger) -> Unit, navigateEnvelopAdd: () -> Unit, + navigateEnvelopeDetail: () -> Unit, popBackStackWithLedger: (String) -> Unit, popBackStackWithDeleteLedgerId: (Int) -> Unit, onShowSnackbar: (SnackbarToken) -> Unit, @@ -89,6 +90,7 @@ fun LedgerDetailRoute( is LedgerDetailSideEffect.HandleException -> handleException(sideEffect.throwable, sideEffect.retry) is LedgerDetailSideEffect.ShowSnackbar -> onShowSnackbar(SnackbarToken(message = sideEffect.msg)) LedgerDetailSideEffect.NavigateEnvelopeAdd -> navigateEnvelopAdd() + LedgerDetailSideEffect.NavigateEnvelopeDetail -> navigateEnvelopeDetail() } } @@ -104,6 +106,7 @@ fun LedgerDetailRoute( onClickDelete = viewModel::showDeleteDialog, onClickBack = viewModel::popBackStackWithLedger, onClickFloatingButton = viewModel::navigateEnvelopeAdd, + onClickSeeMoreIcon = viewModel::navigateEnvelopeDetail, ) } diff --git a/feature/received/src/main/java/com/susu/feature/received/ledgerdetail/LedgerDetailViewModel.kt b/feature/received/src/main/java/com/susu/feature/received/ledgerdetail/LedgerDetailViewModel.kt index 5b0a3893..38b72ab2 100644 --- a/feature/received/src/main/java/com/susu/feature/received/ledgerdetail/LedgerDetailViewModel.kt +++ b/feature/received/src/main/java/com/susu/feature/received/ledgerdetail/LedgerDetailViewModel.kt @@ -82,4 +82,5 @@ class LedgerDetailViewModel @Inject constructor( } fun navigateEnvelopeAdd() = postSideEffect(LedgerDetailSideEffect.NavigateEnvelopeAdd) + fun navigateEnvelopeDetail() = postSideEffect(LedgerDetailSideEffect.NavigateEnvelopeDetail) } diff --git a/feature/received/src/main/java/com/susu/feature/received/navigation/ReceivedNavigation.kt b/feature/received/src/main/java/com/susu/feature/received/navigation/ReceivedNavigation.kt index 38f82d76..ada41928 100644 --- a/feature/received/src/main/java/com/susu/feature/received/navigation/ReceivedNavigation.kt +++ b/feature/received/src/main/java/com/susu/feature/received/navigation/ReceivedNavigation.kt @@ -11,6 +11,7 @@ import com.susu.core.model.Ledger import com.susu.core.ui.DialogToken import com.susu.core.ui.SnackbarToken import com.susu.core.ui.extension.encodeToUri +import com.susu.feature.received.envelopdetail.ReceivedEnvelopeDetailRoute import com.susu.feature.received.envelopeadd.ReceivedEnvelopeAddRoute import com.susu.feature.received.ledgeradd.LedgerAddRoute import com.susu.feature.received.ledgerdetail.LedgerDetailRoute @@ -48,6 +49,10 @@ fun NavController.navigateEnvelopeAdd() { navigate(ReceivedRoute.envelopeAddRoute) } +fun NavController.navigateEnvelopeDetail() { + navigate(ReceivedRoute.envelopeDetailRoute) +} + fun NavGraphBuilder.receivedNavGraph( padding: PaddingValues, navigateLedgerDetail: (Ledger) -> Unit, @@ -59,6 +64,7 @@ fun NavGraphBuilder.receivedNavGraph( navigateLedgerFilter: () -> Unit, navigateLedgerAdd: () -> Unit, navigateEnvelopAdd: () -> Unit, + navigateEnvelopeDetail: () -> Unit, onShowSnackbar: (SnackbarToken) -> Unit, onShowDialog: (DialogToken) -> Unit, handleException: (Throwable, () -> Unit) -> Unit, @@ -90,6 +96,7 @@ fun NavGraphBuilder.receivedNavGraph( ledger = ledger, navigateLedgerEdit = navigateLedgerEdit, navigateEnvelopAdd = navigateEnvelopAdd, + navigateEnvelopeDetail = navigateEnvelopeDetail, popBackStackWithLedger = popBackStackWithLedger, popBackStackWithDeleteLedgerId = popBackStackWithDeleteLedgerId, onShowSnackbar = onShowSnackbar, @@ -134,6 +141,15 @@ fun NavGraphBuilder.receivedNavGraph( popBackStack = popBackStack, ) } + + composable( + route = ReceivedRoute.envelopeDetailRoute, + ) { + ReceivedEnvelopeDetailRoute( + popBackStack = popBackStack, + navigateReceivedEnvelopeEdit = {}, + ) + } } object ReceivedRoute { @@ -148,4 +164,5 @@ object ReceivedRoute { const val ledgerFilterRoute = "ledger-filter" // TODO 파라미터 넘기는 방식으로 수정해야함. const val envelopeAddRoute = "envelope-add" + const val envelopeDetailRoute = "envelope-detail" // TODO 파라미터 넘기는 방식으로 수정해야함. } From afd9b2f77119fd6636ee6ec4e91574a73fbd1ac8 Mon Sep 17 00:00:00 2001 From: jinukeu Date: Sat, 20 Jan 2024 16:09:57 +0900 Subject: [PATCH 2/3] =?UTF-8?q?feat:=20=EB=B0=9B=EC=9D=80=20=EB=B4=89?= =?UTF-8?q?=ED=88=AC=20=ED=8E=B8=EC=A7=91=20ui?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- core/ui/src/main/res/values/strings.xml | 4 + .../susu/feature/navigator/MainNavigator.kt | 18 +- .../com/susu/feature/navigator/MainScreen.kt | 5 +- .../ReceivedEnvelopeDetailScreen.kt | 4 +- .../component/DetailItem.kt | 2 +- .../ReceivedEnvelopeEditScreen.kt | 236 ++++++++++++++++++ .../envelopeedit/component/EditDetailItem.kt | 92 +++++++ .../received/navigation/ReceivedNavigation.kt | 21 +- .../received/src/main/res/values/strings.xml | 8 + 9 files changed, 375 insertions(+), 15 deletions(-) rename feature/received/src/main/java/com/susu/feature/received/{envelopdetail => envelopedetail}/ReceivedEnvelopeDetailScreen.kt (97%) rename feature/received/src/main/java/com/susu/feature/received/{envelopdetail => envelopedetail}/component/DetailItem.kt (97%) create mode 100644 feature/received/src/main/java/com/susu/feature/received/envelopeedit/ReceivedEnvelopeEditScreen.kt create mode 100644 feature/received/src/main/java/com/susu/feature/received/envelopeedit/component/EditDetailItem.kt diff --git a/core/ui/src/main/res/values/strings.xml b/core/ui/src/main/res/values/strings.xml index 9c4835b0..68fa21c4 100644 --- a/core/ui/src/main/res/values/strings.xml +++ b/core/ui/src/main/res/values/strings.xml @@ -35,4 +35,8 @@ 구글 등록 %s원 + 예 + 아니요 + 연락처 + 메모 diff --git a/feature/navigator/src/main/java/com/susu/feature/navigator/MainNavigator.kt b/feature/navigator/src/main/java/com/susu/feature/navigator/MainNavigator.kt index c041a6b1..9ec65a83 100644 --- a/feature/navigator/src/main/java/com/susu/feature/navigator/MainNavigator.kt +++ b/feature/navigator/src/main/java/com/susu/feature/navigator/MainNavigator.kt @@ -16,8 +16,9 @@ import com.susu.feature.mypage.navigation.navigateMyPage import com.susu.feature.mypage.navigation.navigateMyPageInfo import com.susu.feature.mypage.navigation.navigateMyPageSocial import com.susu.feature.received.navigation.ReceivedRoute -import com.susu.feature.received.navigation.navigateEnvelopeAdd -import com.susu.feature.received.navigation.navigateEnvelopeDetail +import com.susu.feature.received.navigation.navigateReceivedEnvelopeAdd +import com.susu.feature.received.navigation.navigateReceivedEnvelopeDetail +import com.susu.feature.received.navigation.navigateReceivedEnvelopeEdit import com.susu.feature.received.navigation.navigateLedgerAdd import com.susu.feature.received.navigation.navigateLedgerDetail import com.susu.feature.received.navigation.navigateLedgerEdit @@ -52,6 +53,7 @@ internal class MainNavigator( ReceivedRoute.ledgerSearchRoute, ReceivedRoute.ledgerFilterRoute, ReceivedRoute.envelopeDetailRoute, + ReceivedRoute.envelopeEditRoute, SentRoute.sentEnvelopeRoute, SentRoute.sentEnvelopeDetailRoute, SentRoute.sentEnvelopeEditRoute, @@ -147,12 +149,16 @@ internal class MainNavigator( navController.navigateMyPageSocial() } - fun navigateEnvelopeAdd() { - navController.navigateEnvelopeAdd() + fun navigateReceivedEnvelopeAdd() { + navController.navigateReceivedEnvelopeAdd() } - fun navigateEnvelopeDetail() { - navController.navigateEnvelopeDetail() + fun navigateReceivedEnvelopeDetail() { + navController.navigateReceivedEnvelopeDetail() + } + + fun navigateReceivedEnvelopeEdit() { + navController.navigateReceivedEnvelopeEdit() } fun popBackStackIfNotHome() { diff --git a/feature/navigator/src/main/java/com/susu/feature/navigator/MainScreen.kt b/feature/navigator/src/main/java/com/susu/feature/navigator/MainScreen.kt index 71d8c489..3aa9f9cc 100644 --- a/feature/navigator/src/main/java/com/susu/feature/navigator/MainScreen.kt +++ b/feature/navigator/src/main/java/com/susu/feature/navigator/MainScreen.kt @@ -107,8 +107,9 @@ internal fun MainScreen( navigateLedgerEdit = navigator::navigateLedgerEdit, navigateLedgerFilter = navigator::navigateLedgerFilter, navigateLedgerAdd = navigator::navigateLedgerAdd, - navigateEnvelopAdd = navigator::navigateEnvelopeAdd, - navigateEnvelopeDetail = navigator::navigateEnvelopeDetail, + navigateEnvelopAdd = navigator::navigateReceivedEnvelopeAdd, + navigateEnvelopeDetail = navigator::navigateReceivedEnvelopeDetail, + navigateEnvelopeEdit = navigator::navigateReceivedEnvelopeEdit, onShowSnackbar = viewModel::onShowSnackbar, onShowDialog = viewModel::onShowDialog, handleException = viewModel::handleException, diff --git a/feature/received/src/main/java/com/susu/feature/received/envelopdetail/ReceivedEnvelopeDetailScreen.kt b/feature/received/src/main/java/com/susu/feature/received/envelopedetail/ReceivedEnvelopeDetailScreen.kt similarity index 97% rename from feature/received/src/main/java/com/susu/feature/received/envelopdetail/ReceivedEnvelopeDetailScreen.kt rename to feature/received/src/main/java/com/susu/feature/received/envelopedetail/ReceivedEnvelopeDetailScreen.kt index 3b0b4203..ad0141c1 100644 --- a/feature/received/src/main/java/com/susu/feature/received/envelopdetail/ReceivedEnvelopeDetailScreen.kt +++ b/feature/received/src/main/java/com/susu/feature/received/envelopedetail/ReceivedEnvelopeDetailScreen.kt @@ -1,4 +1,4 @@ -package com.susu.feature.received.envelopdetail +package com.susu.feature.received.envelopedetail import androidx.compose.foundation.background import androidx.compose.foundation.layout.Box @@ -19,7 +19,7 @@ import com.susu.core.designsystem.component.appbar.icon.DeleteText import com.susu.core.designsystem.component.appbar.icon.EditText import com.susu.core.designsystem.theme.Gray100 import com.susu.core.designsystem.theme.SusuTheme -import com.susu.feature.received.envelopdetail.component.DetailItem +import com.susu.feature.received.envelopedetail.component.DetailItem @Composable fun ReceivedEnvelopeDetailRoute( diff --git a/feature/received/src/main/java/com/susu/feature/received/envelopdetail/component/DetailItem.kt b/feature/received/src/main/java/com/susu/feature/received/envelopedetail/component/DetailItem.kt similarity index 97% rename from feature/received/src/main/java/com/susu/feature/received/envelopdetail/component/DetailItem.kt rename to feature/received/src/main/java/com/susu/feature/received/envelopedetail/component/DetailItem.kt index b4ab7ddd..817bdf27 100644 --- a/feature/received/src/main/java/com/susu/feature/received/envelopdetail/component/DetailItem.kt +++ b/feature/received/src/main/java/com/susu/feature/received/envelopedetail/component/DetailItem.kt @@ -1,4 +1,4 @@ -package com.susu.feature.received.envelopdetail.component +package com.susu.feature.received.envelopedetail.component import androidx.compose.foundation.layout.PaddingValues import androidx.compose.foundation.layout.Row diff --git a/feature/received/src/main/java/com/susu/feature/received/envelopeedit/ReceivedEnvelopeEditScreen.kt b/feature/received/src/main/java/com/susu/feature/received/envelopeedit/ReceivedEnvelopeEditScreen.kt new file mode 100644 index 00000000..1d3cf72f --- /dev/null +++ b/feature/received/src/main/java/com/susu/feature/received/envelopeedit/ReceivedEnvelopeEditScreen.kt @@ -0,0 +1,236 @@ +package com.susu.feature.received.envelopeedit + +import androidx.compose.foundation.background +import androidx.compose.foundation.layout.Box +import androidx.compose.foundation.layout.Column +import androidx.compose.foundation.layout.Spacer +import androidx.compose.foundation.layout.fillMaxSize +import androidx.compose.foundation.layout.fillMaxWidth +import androidx.compose.foundation.layout.imePadding +import androidx.compose.foundation.layout.padding +import androidx.compose.foundation.layout.size +import androidx.compose.foundation.rememberScrollState +import androidx.compose.foundation.text.KeyboardOptions +import androidx.compose.foundation.verticalScroll +import androidx.compose.material3.ExperimentalMaterial3Api +import androidx.compose.material3.Text +import androidx.compose.runtime.Composable +import androidx.compose.runtime.getValue +import androidx.compose.runtime.mutableStateOf +import androidx.compose.runtime.remember +import androidx.compose.runtime.setValue +import androidx.compose.ui.Alignment +import androidx.compose.ui.Modifier +import androidx.compose.ui.graphics.RectangleShape +import androidx.compose.ui.res.stringResource +import androidx.compose.ui.text.input.KeyboardType +import androidx.compose.ui.tooling.preview.Preview +import androidx.compose.ui.unit.dp +import com.susu.core.designsystem.component.appbar.SusuDefaultAppBar +import com.susu.core.designsystem.component.appbar.icon.BackIcon +import com.susu.core.designsystem.component.bottomsheet.datepicker.SusuDatePickerBottomSheet +import com.susu.core.designsystem.component.button.AddConditionButton +import com.susu.core.designsystem.component.button.FilledButtonColor +import com.susu.core.designsystem.component.button.MediumButtonStyle +import com.susu.core.designsystem.component.button.SmallButtonStyle +import com.susu.core.designsystem.component.button.SusuFilledButton +import com.susu.core.designsystem.component.textfield.SusuBasicTextField +import com.susu.core.designsystem.component.textfield.SusuPriceTextField +import com.susu.core.designsystem.theme.Gray100 +import com.susu.core.designsystem.theme.Gray30 +import com.susu.core.designsystem.theme.Gray40 +import com.susu.core.designsystem.theme.Gray70 +import com.susu.core.designsystem.theme.SusuTheme +import com.susu.core.ui.extension.susuClickable +import com.susu.feature.received.R +import com.susu.feature.received.envelopeedit.component.EditDetailItem + +@Composable +fun ReceivedEnvelopeEditRoute( + popBackStack: () -> Unit, +) { + + ReceivedEnvelopeEditScreen() +} + +@Composable +fun ReceivedEnvelopeEditScreen( + modifier: Modifier = Modifier, + onClickBackIcon: () -> Unit = {}, + onClickSave: () -> Unit = {}, +) { + // TODO: 수정 필요 + var money by remember { mutableStateOf(150000) } + var name by remember { mutableStateOf("김철수") } + var present by remember { mutableStateOf("") } + var phone by remember { mutableStateOf("") } + var memo by remember { mutableStateOf("") } + + Box( + modifier = modifier + .fillMaxSize() + .background(SusuTheme.colorScheme.background10), + ) { + Column { + SusuDefaultAppBar( + leftIcon = { + BackIcon( + onClick = onClickBackIcon, + ) + }, + ) + Column( + modifier = modifier + .verticalScroll(rememberScrollState()) + .weight(1f) + .padding( + start = SusuTheme.spacing.spacing_m, + end = SusuTheme.spacing.spacing_m, + top = SusuTheme.spacing.spacing_xl, + ), + ) { + SusuPriceTextField( + text = money.toString(), + onTextChange = { money = it.toInt() }, + textStyle = SusuTheme.typography.title_xxl, + modifier = modifier.fillMaxWidth(), + ) + Spacer(modifier = modifier.size(SusuTheme.spacing.spacing_m)) + EditDetailItem( + categoryText = stringResource(R.string.received_envelope_edit_screen_name), + categoryTextAlign = Alignment.CenterVertically, + ) { + SusuBasicTextField( + text = name, + onTextChange = { name = it }, + placeholder = stringResource(R.string.received_envelope_edit_screen_name_placeholder), + placeholderColor = Gray30, + textStyle = SusuTheme.typography.title_s, + modifier = modifier.fillMaxWidth(), + ) + } + EditDetailItem( + categoryText = stringResource(R.string.received_envelope_edit_screen_relationship), + categoryTextAlign = Alignment.Top, + ) { + SusuFilledButton( + color = FilledButtonColor.Orange, + style = SmallButtonStyle.height32, + text = "친구", + isActive = true, + onClick = {}, + ) + SusuFilledButton( + color = FilledButtonColor.Orange, + style = SmallButtonStyle.height32, + text = "가족", + isActive = false, + onClick = {}, + ) + SusuFilledButton( + color = FilledButtonColor.Orange, + style = SmallButtonStyle.height32, + text = "친척", + isActive = false, + onClick = {}, + ) + SusuFilledButton( + color = FilledButtonColor.Orange, + style = SmallButtonStyle.height32, + text = "동료", + isActive = false, + onClick = {}, + ) + AddConditionButton( + onClick = {}, + ) + } + EditDetailItem( + categoryText = stringResource(R.string.received_envelope_edit_screen_visited), + categoryTextAlign = Alignment.Top, + ) { + SusuFilledButton( + color = FilledButtonColor.Orange, + style = SmallButtonStyle.height32, + text = stringResource(com.susu.core.ui.R.string.word_yes), + isActive = true, + onClick = {}, + modifier = modifier.weight(1f), + ) + SusuFilledButton( + color = FilledButtonColor.Orange, + style = SmallButtonStyle.height32, + text = stringResource(com.susu.core.ui.R.string.word_no), + isActive = false, + onClick = {}, + modifier = modifier.weight(1f), + ) + } + EditDetailItem( + categoryText = stringResource(R.string.received_envelope_edit_screen_present), + categoryTextColor = if (present.isNotEmpty()) Gray70 else Gray40, + categoryTextAlign = Alignment.CenterVertically, + ) { + SusuBasicTextField( + text = present, + onTextChange = { present = it }, + placeholder = stringResource(R.string.received_envelope_edit_screen_present_placeholder), + placeholderColor = Gray30, + textStyle = SusuTheme.typography.title_s, + modifier = modifier.fillMaxWidth(), + ) + } + EditDetailItem( + categoryText = stringResource(com.susu.core.ui.R.string.word_phone_number), + categoryTextColor = if (phone.isNotEmpty()) Gray70 else Gray40, + categoryTextAlign = Alignment.CenterVertically, + ) { + SusuBasicTextField( + text = phone, + onTextChange = { phone = it }, + placeholder = stringResource(R.string.received_envelope_edit_screen_phone_number_placeholder), + placeholderColor = Gray30, + textStyle = SusuTheme.typography.title_s, + keyboardOptions = KeyboardOptions(keyboardType = KeyboardType.Number), + modifier = modifier.fillMaxWidth(), + ) + } + EditDetailItem( + categoryText = stringResource(com.susu.core.ui.R.string.word_memo), + categoryTextColor = if (memo.isNotEmpty()) Gray70 else Gray40, + categoryTextAlign = Alignment.Top, + ) { + SusuBasicTextField( + text = memo, + onTextChange = { memo = it }, + placeholder = stringResource(R.string.received_envelope_edit_screen_memo_placeholder), + placeholderColor = Gray30, + textStyle = SusuTheme.typography.title_s, + maxLines = 2, + modifier = modifier.fillMaxWidth(), + ) + } + Spacer(modifier = modifier.size(240.dp)) + } + + SusuFilledButton( + modifier = modifier + .fillMaxWidth() + .imePadding(), + color = FilledButtonColor.Black, + style = MediumButtonStyle.height60, + shape = RectangleShape, + text = stringResource(com.susu.core.ui.R.string.word_save), + onClick = onClickSave, + ) + } + } +} + +@Preview +@Composable +fun ReceivedEnvelopeEditScreenPreview() { + SusuTheme { + ReceivedEnvelopeEditScreen() + } +} diff --git a/feature/received/src/main/java/com/susu/feature/received/envelopeedit/component/EditDetailItem.kt b/feature/received/src/main/java/com/susu/feature/received/envelopeedit/component/EditDetailItem.kt new file mode 100644 index 00000000..7e1303fb --- /dev/null +++ b/feature/received/src/main/java/com/susu/feature/received/envelopeedit/component/EditDetailItem.kt @@ -0,0 +1,92 @@ +package com.susu.feature.received.envelopeedit.component + +import androidx.compose.foundation.layout.Arrangement +import androidx.compose.foundation.layout.Column +import androidx.compose.foundation.layout.ExperimentalLayoutApi +import androidx.compose.foundation.layout.FlowRow +import androidx.compose.foundation.layout.Row +import androidx.compose.foundation.layout.Spacer +import androidx.compose.foundation.layout.fillMaxWidth +import androidx.compose.foundation.layout.padding +import androidx.compose.foundation.layout.size +import androidx.compose.foundation.layout.width +import androidx.compose.material3.Text +import androidx.compose.runtime.Composable +import androidx.compose.runtime.getValue +import androidx.compose.runtime.mutableStateOf +import androidx.compose.runtime.remember +import androidx.compose.runtime.setValue +import androidx.compose.ui.Alignment +import androidx.compose.ui.Modifier +import androidx.compose.ui.graphics.Color +import androidx.compose.ui.text.TextStyle +import androidx.compose.ui.tooling.preview.Preview +import androidx.compose.ui.unit.Dp +import androidx.compose.ui.unit.dp +import com.susu.core.designsystem.component.textfield.SusuBasicTextField +import com.susu.core.designsystem.theme.Gray30 +import com.susu.core.designsystem.theme.Gray70 +import com.susu.core.designsystem.theme.SusuTheme + +@OptIn(ExperimentalLayoutApi::class) +@Composable +fun EditDetailItem( + modifier: Modifier = Modifier, + categoryText: String, + categoryStyle: TextStyle = SusuTheme.typography.title_xxs, + categoryTextColor: Color = Gray70, + categoryWidth: Dp = 72.dp, + categoryTextAlign: Alignment.Vertical, + content: @Composable () -> Unit, +) { + Row( + modifier = modifier + .fillMaxWidth() + .padding(vertical = SusuTheme.spacing.spacing_m), + verticalAlignment = Alignment.CenterVertically, + ) { + Text( + text = categoryText, + style = categoryStyle, + color = categoryTextColor, + modifier = modifier + .width(categoryWidth) + .align(categoryTextAlign), + ) + Spacer(modifier = modifier.size(SusuTheme.spacing.spacing_m)) + FlowRow( + modifier = modifier.weight(1f), + horizontalArrangement = Arrangement.spacedBy(SusuTheme.spacing.spacing_xxs), + verticalArrangement = Arrangement.spacedBy(SusuTheme.spacing.spacing_xxs), + ) { + content() + } + } +} + +@Preview(showBackground = true, backgroundColor = 0xffffff) +@Composable +fun DetailItemPreview() { + var name by remember { mutableStateOf("김철수") } + + SusuTheme { + Column( + verticalArrangement = Arrangement.spacedBy(16.dp), + ) { + // TextField 버전 + EditDetailItem( + categoryText = "이름", + categoryTextAlign = Alignment.CenterVertically, + ) { + SusuBasicTextField( + text = name, + onTextChange = { name = it }, + placeholder = "김철수", + placeholderColor = Gray30, + textStyle = SusuTheme.typography.title_s, + modifier = Modifier.fillMaxWidth(), + ) + } + } + } +} diff --git a/feature/received/src/main/java/com/susu/feature/received/navigation/ReceivedNavigation.kt b/feature/received/src/main/java/com/susu/feature/received/navigation/ReceivedNavigation.kt index ada41928..e0a62bdf 100644 --- a/feature/received/src/main/java/com/susu/feature/received/navigation/ReceivedNavigation.kt +++ b/feature/received/src/main/java/com/susu/feature/received/navigation/ReceivedNavigation.kt @@ -11,8 +11,9 @@ import com.susu.core.model.Ledger import com.susu.core.ui.DialogToken import com.susu.core.ui.SnackbarToken import com.susu.core.ui.extension.encodeToUri -import com.susu.feature.received.envelopdetail.ReceivedEnvelopeDetailRoute +import com.susu.feature.received.envelopedetail.ReceivedEnvelopeDetailRoute import com.susu.feature.received.envelopeadd.ReceivedEnvelopeAddRoute +import com.susu.feature.received.envelopeedit.ReceivedEnvelopeEditRoute import com.susu.feature.received.ledgeradd.LedgerAddRoute import com.susu.feature.received.ledgerdetail.LedgerDetailRoute import com.susu.feature.received.ledgeredit.LedgerEditRoute @@ -45,14 +46,18 @@ fun NavController.navigateLedgerAdd() { navigate(ReceivedRoute.ledgerAddRoute) } -fun NavController.navigateEnvelopeAdd() { +fun NavController.navigateReceivedEnvelopeAdd() { navigate(ReceivedRoute.envelopeAddRoute) } -fun NavController.navigateEnvelopeDetail() { +fun NavController.navigateReceivedEnvelopeDetail() { navigate(ReceivedRoute.envelopeDetailRoute) } +fun NavController.navigateReceivedEnvelopeEdit() { + navigate(ReceivedRoute.envelopeEditRoute) +} + fun NavGraphBuilder.receivedNavGraph( padding: PaddingValues, navigateLedgerDetail: (Ledger) -> Unit, @@ -65,6 +70,7 @@ fun NavGraphBuilder.receivedNavGraph( navigateLedgerAdd: () -> Unit, navigateEnvelopAdd: () -> Unit, navigateEnvelopeDetail: () -> Unit, + navigateEnvelopeEdit: () -> Unit, onShowSnackbar: (SnackbarToken) -> Unit, onShowDialog: (DialogToken) -> Unit, handleException: (Throwable, () -> Unit) -> Unit, @@ -147,9 +153,15 @@ fun NavGraphBuilder.receivedNavGraph( ) { ReceivedEnvelopeDetailRoute( popBackStack = popBackStack, - navigateReceivedEnvelopeEdit = {}, + navigateReceivedEnvelopeEdit = navigateEnvelopeEdit, ) } + + composable( + route = ReceivedRoute.envelopeEditRoute, + ) { + ReceivedEnvelopeEditRoute(popBackStack = popBackStack) + } } object ReceivedRoute { @@ -165,4 +177,5 @@ object ReceivedRoute { const val envelopeAddRoute = "envelope-add" const val envelopeDetailRoute = "envelope-detail" // TODO 파라미터 넘기는 방식으로 수정해야함. + const val envelopeEditRoute = "envelope-edit" // TODO 파라미터 넘기는 방식으로 수정해야함. } diff --git a/feature/received/src/main/res/values/strings.xml b/feature/received/src/main/res/values/strings.xml index 88184dc8..dfc63f46 100644 --- a/feature/received/src/main/res/values/strings.xml +++ b/feature/received/src/main/res/values/strings.xml @@ -44,4 +44,12 @@ 나와는\n어떤 사이 인가요 %s을 방문했나요? %s을 + 이름 + 김철수 + 나와의 관계 + 방문 여부 + 선물 + 한끼 식사 + 01012345678 + 입력해주세요 From 0a7da089d9a5e2cb200e64fd9c6c60b52fccaaa8 Mon Sep 17 00:00:00 2001 From: jinukeu Date: Sat, 20 Jan 2024 16:11:12 +0900 Subject: [PATCH 3/3] chore: ktlint --- .../main/java/com/susu/feature/navigator/MainNavigator.kt | 6 +++--- .../envelopedetail/ReceivedEnvelopeDetailScreen.kt | 2 +- .../received/envelopeedit/ReceivedEnvelopeEditScreen.kt | 7 +------ .../susu/feature/received/navigation/ReceivedNavigation.kt | 2 +- 4 files changed, 6 insertions(+), 11 deletions(-) diff --git a/feature/navigator/src/main/java/com/susu/feature/navigator/MainNavigator.kt b/feature/navigator/src/main/java/com/susu/feature/navigator/MainNavigator.kt index 9ec65a83..d2fd7660 100644 --- a/feature/navigator/src/main/java/com/susu/feature/navigator/MainNavigator.kt +++ b/feature/navigator/src/main/java/com/susu/feature/navigator/MainNavigator.kt @@ -16,15 +16,15 @@ import com.susu.feature.mypage.navigation.navigateMyPage import com.susu.feature.mypage.navigation.navigateMyPageInfo import com.susu.feature.mypage.navigation.navigateMyPageSocial import com.susu.feature.received.navigation.ReceivedRoute -import com.susu.feature.received.navigation.navigateReceivedEnvelopeAdd -import com.susu.feature.received.navigation.navigateReceivedEnvelopeDetail -import com.susu.feature.received.navigation.navigateReceivedEnvelopeEdit import com.susu.feature.received.navigation.navigateLedgerAdd import com.susu.feature.received.navigation.navigateLedgerDetail import com.susu.feature.received.navigation.navigateLedgerEdit import com.susu.feature.received.navigation.navigateLedgerFilter import com.susu.feature.received.navigation.navigateLedgerSearch import com.susu.feature.received.navigation.navigateReceived +import com.susu.feature.received.navigation.navigateReceivedEnvelopeAdd +import com.susu.feature.received.navigation.navigateReceivedEnvelopeDetail +import com.susu.feature.received.navigation.navigateReceivedEnvelopeEdit import com.susu.feature.sent.navigation.SentRoute import com.susu.feature.sent.navigation.navigateSent import com.susu.feature.sent.navigation.navigateSentEnvelope diff --git a/feature/received/src/main/java/com/susu/feature/received/envelopedetail/ReceivedEnvelopeDetailScreen.kt b/feature/received/src/main/java/com/susu/feature/received/envelopedetail/ReceivedEnvelopeDetailScreen.kt index ad0141c1..4cde88c5 100644 --- a/feature/received/src/main/java/com/susu/feature/received/envelopedetail/ReceivedEnvelopeDetailScreen.kt +++ b/feature/received/src/main/java/com/susu/feature/received/envelopedetail/ReceivedEnvelopeDetailScreen.kt @@ -23,10 +23,10 @@ import com.susu.feature.received.envelopedetail.component.DetailItem @Composable fun ReceivedEnvelopeDetailRoute( + @Suppress("detekt:UnusedParameter") popBackStack: () -> Unit, navigateReceivedEnvelopeEdit: () -> Unit, ) { - ReceivedEnvelopeDetailScreen( onClickEdit = navigateReceivedEnvelopeEdit, ) diff --git a/feature/received/src/main/java/com/susu/feature/received/envelopeedit/ReceivedEnvelopeEditScreen.kt b/feature/received/src/main/java/com/susu/feature/received/envelopeedit/ReceivedEnvelopeEditScreen.kt index 1d3cf72f..fef75fea 100644 --- a/feature/received/src/main/java/com/susu/feature/received/envelopeedit/ReceivedEnvelopeEditScreen.kt +++ b/feature/received/src/main/java/com/susu/feature/received/envelopeedit/ReceivedEnvelopeEditScreen.kt @@ -12,8 +12,6 @@ import androidx.compose.foundation.layout.size import androidx.compose.foundation.rememberScrollState import androidx.compose.foundation.text.KeyboardOptions import androidx.compose.foundation.verticalScroll -import androidx.compose.material3.ExperimentalMaterial3Api -import androidx.compose.material3.Text import androidx.compose.runtime.Composable import androidx.compose.runtime.getValue import androidx.compose.runtime.mutableStateOf @@ -28,7 +26,6 @@ import androidx.compose.ui.tooling.preview.Preview import androidx.compose.ui.unit.dp import com.susu.core.designsystem.component.appbar.SusuDefaultAppBar import com.susu.core.designsystem.component.appbar.icon.BackIcon -import com.susu.core.designsystem.component.bottomsheet.datepicker.SusuDatePickerBottomSheet import com.susu.core.designsystem.component.button.AddConditionButton import com.susu.core.designsystem.component.button.FilledButtonColor import com.susu.core.designsystem.component.button.MediumButtonStyle @@ -36,20 +33,18 @@ import com.susu.core.designsystem.component.button.SmallButtonStyle import com.susu.core.designsystem.component.button.SusuFilledButton import com.susu.core.designsystem.component.textfield.SusuBasicTextField import com.susu.core.designsystem.component.textfield.SusuPriceTextField -import com.susu.core.designsystem.theme.Gray100 import com.susu.core.designsystem.theme.Gray30 import com.susu.core.designsystem.theme.Gray40 import com.susu.core.designsystem.theme.Gray70 import com.susu.core.designsystem.theme.SusuTheme -import com.susu.core.ui.extension.susuClickable import com.susu.feature.received.R import com.susu.feature.received.envelopeedit.component.EditDetailItem @Composable fun ReceivedEnvelopeEditRoute( + @Suppress("detekt:UnusedParameter") popBackStack: () -> Unit, ) { - ReceivedEnvelopeEditScreen() } diff --git a/feature/received/src/main/java/com/susu/feature/received/navigation/ReceivedNavigation.kt b/feature/received/src/main/java/com/susu/feature/received/navigation/ReceivedNavigation.kt index e0a62bdf..c1e8d423 100644 --- a/feature/received/src/main/java/com/susu/feature/received/navigation/ReceivedNavigation.kt +++ b/feature/received/src/main/java/com/susu/feature/received/navigation/ReceivedNavigation.kt @@ -11,8 +11,8 @@ import com.susu.core.model.Ledger import com.susu.core.ui.DialogToken import com.susu.core.ui.SnackbarToken import com.susu.core.ui.extension.encodeToUri -import com.susu.feature.received.envelopedetail.ReceivedEnvelopeDetailRoute import com.susu.feature.received.envelopeadd.ReceivedEnvelopeAddRoute +import com.susu.feature.received.envelopedetail.ReceivedEnvelopeDetailRoute import com.susu.feature.received.envelopeedit.ReceivedEnvelopeEditRoute import com.susu.feature.received.ledgeradd.LedgerAddRoute import com.susu.feature.received.ledgerdetail.LedgerDetailRoute