From cd1239e59550ec8727d08ab4fb93058d7eb13ac8 Mon Sep 17 00:00:00 2001 From: moon <56061215+MgKyawLay@users.noreply.github.com> Date: Wed, 10 Jun 2026 22:52:27 +0630 Subject: [PATCH] dashboard Ui changed --- .../ui/dashboard/DashboardScreen2.kt | 162 ++++++++++++++---- 1 file changed, 127 insertions(+), 35 deletions(-) diff --git a/app/src/main/java/com/mob/utsmyanmar/ui/dashboard/DashboardScreen2.kt b/app/src/main/java/com/mob/utsmyanmar/ui/dashboard/DashboardScreen2.kt index 5ae5da1..c39f237 100644 --- a/app/src/main/java/com/mob/utsmyanmar/ui/dashboard/DashboardScreen2.kt +++ b/app/src/main/java/com/mob/utsmyanmar/ui/dashboard/DashboardScreen2.kt @@ -17,6 +17,8 @@ import androidx.compose.foundation.layout.height import androidx.compose.foundation.layout.padding import androidx.compose.foundation.layout.size import androidx.compose.foundation.layout.width +import androidx.compose.foundation.lazy.LazyColumn +import androidx.compose.foundation.lazy.items import androidx.compose.foundation.pager.HorizontalPager import androidx.compose.foundation.pager.rememberPagerState import androidx.compose.foundation.shape.CircleShape @@ -33,7 +35,6 @@ import androidx.compose.material.icons.filled.Menu import androidx.compose.material.icons.filled.Replay import androidx.compose.material.icons.filled.SwapHoriz import androidx.compose.material.icons.filled.Sync -import androidx.compose.material.icons.filled.Undo import androidx.compose.material3.AlertDialog import androidx.compose.material3.Button import androidx.compose.material3.ButtonDefaults @@ -45,8 +46,6 @@ import androidx.compose.material3.Icon import androidx.compose.material3.MaterialTheme import androidx.compose.material3.ModalDrawerSheet import androidx.compose.material3.ModalNavigationDrawer -import androidx.compose.material3.NavigationDrawerItem -import androidx.compose.material3.NavigationDrawerItemDefaults import androidx.compose.material3.Scaffold import androidx.compose.material3.Text import androidx.compose.material3.TextButton @@ -67,6 +66,7 @@ import androidx.compose.ui.graphics.vector.ImageVector import androidx.compose.ui.layout.ContentScale import androidx.compose.ui.res.painterResource import androidx.compose.ui.text.font.FontWeight +import androidx.compose.ui.text.style.TextAlign import androidx.compose.ui.text.style.TextOverflow import androidx.compose.ui.tooling.preview.Preview import androidx.compose.ui.unit.dp @@ -83,6 +83,7 @@ import com.utsmyanmar.paylibs.sign_on.EchoTestProcess import com.utsmyanmar.paylibs.sign_on.SignOnListener import kotlinx.coroutines.delay import kotlinx.coroutines.launch +import kotlin.time.Duration.Companion.milliseconds @Composable fun DashboardScreen2( @@ -92,6 +93,7 @@ fun DashboardScreen2( onNavigateVersion: () -> Unit = {}, onNavigateFunctions: () -> Unit = {}, onNavigateAction: (String) -> Unit = {}, + dashboardUiState: DashboardUiState = DashboardUiState(), deviceInfoViewModel: DeviceInfoViewModel = viewModel() ) { val deviceInfo by deviceInfoViewModel.uiState.collectAsState() @@ -382,10 +384,10 @@ fun DashboardScreen2( ) { SummaryCard() } - //bottom section + //pager section Box( modifier = Modifier - .weight(1.5f) + .weight(1.3f) .fillMaxWidth(), ) { MenuPager( @@ -398,37 +400,18 @@ fun DashboardScreen2( modifier = Modifier.fillMaxSize() ) } + //transactions section + RecentTransactions( + transactions = dashboardUiState.recentTransactions, + modifier = Modifier + .weight(1.2f) + .fillMaxWidth() + ) } } } } -@Composable -private fun DrawerItem( - title: String, icon: ImageVector, onClick: () -> Unit -) { - NavigationDrawerItem( - label = { - Text( - text = title, fontWeight = FontWeight.Medium - ) - }, - selected = false, - onClick = onClick, - icon = { - Icon( - imageVector = icon, contentDescription = title - ) - }, - modifier = Modifier.padding(horizontal = 12.dp, vertical = 2.dp), - colors = NavigationDrawerItemDefaults.colors( - unselectedContainerColor = androidx.compose.ui.graphics.Color.Transparent, - unselectedIconColor = Color.LegacyRed, - unselectedTextColor = Color.Black - ) - ) -} - @Composable private fun AdvertisingArea() { @@ -441,7 +424,7 @@ private fun AdvertisingArea() { LaunchedEffect(pageState) { while (true) { - delay(10000) + delay(10000.milliseconds) val nextPage = (pageState.currentPage + 1) % imageArray.size pageState.animateScrollToPage( @@ -590,7 +573,7 @@ private fun buildMenuItems( DashboardMenuItem("History", { Icon(painterResource(R.drawable.ic_history), contentDescription = null, modifier = Modifier.size(32.dp), tint = Color.LegacyRed) }) { }, DashboardMenuItem("Sign On", { Icon(painterResource(R.drawable.ic_sign_on), contentDescription = null, modifier = Modifier.size(32.dp), tint = Color.LegacyRed) }) { onNavigateSignOn() }, DashboardMenuItem("Settlement", { Icon(painterResource(R.drawable.ic_settlement), contentDescription = null, modifier = Modifier.size(32.dp), tint = Color.LegacyRed) }) { onNavigateSettlement() }, - DashboardMenuItem("Void", { Icon(Icons.Default.Undo, contentDescription = null, modifier = Modifier.size(32.dp), tint = Color.LegacyRed) }) { onNavigateAction("Void") }, + DashboardMenuItem("Void", { Icon(Icons.Default.Lock, contentDescription = null, modifier = Modifier.size(32.dp), tint = Color.LegacyRed) }) { onNavigateAction("Void") }, DashboardMenuItem("Refund", { Icon(Icons.Default.Replay, contentDescription = null, modifier = Modifier.size(32.dp), tint = Color.LegacyRed) }) { onNavigateAction("Refund") }, DashboardMenuItem("Pre-Auth", { Icon(Icons.Default.Lock, contentDescription = null, modifier = Modifier.size(32.dp), tint = Color.LegacyRed) }) { onNavigateAction("Pre-Auth") }, DashboardMenuItem("Pre-Auth Void", { Icon(Icons.Default.LockOpen, contentDescription = null, modifier = Modifier.size(32.dp), tint = Color.LegacyRed) }) { onNavigateAction("Pre-Auth Void") }, @@ -717,16 +700,125 @@ private fun MenuCard( } } +@Composable +private fun RecentTransactions( + transactions: List, + modifier: Modifier = Modifier +) { + Column(modifier = modifier) { + Row( + modifier = Modifier + .fillMaxWidth() + .padding(horizontal = 16.dp, vertical = 6.dp), + verticalAlignment = Alignment.CenterVertically + ) { + Text( + text = "Recent Transactions", + fontWeight = FontWeight.SemiBold, + fontSize = 14.sp + ) + } + HorizontalDivider( + modifier = Modifier.padding(horizontal = 16.dp), + color = Color.Gray.copy(alpha = 0.2f) + ) + LazyColumn(modifier = Modifier.fillMaxSize()) { + if (transactions.isEmpty()) { + item { + Text( + text = "No recent transactions", + color = Color.Gray, + fontSize = 13.sp, + textAlign = TextAlign.Center, + modifier = Modifier + .fillMaxWidth() + .padding(vertical = 24.dp) + ) + } + } else { + items(items = transactions, key = { it.pid }) { record -> + TrnxRow(record = record) + } + } + } + } +} + +@Composable +private fun TrnxRow(record: TrnxRecord) { + Row( + modifier = Modifier + .fillMaxWidth() + .padding(horizontal = 12.dp, vertical = 4.dp) + .clip(RoundedCornerShape(10.dp)) + .background(Color.White) + .padding(horizontal = 12.dp, vertical = 10.dp), + verticalAlignment = Alignment.CenterVertically + ) { + Box( + modifier = Modifier + .size(36.dp) + .background(Color.LegacyRed.copy(alpha = 0.1f), CircleShape), + contentAlignment = Alignment.Center + ) { + Text( + text = record.typeLabel.take(1), + color = Color.LegacyRed, + fontWeight = FontWeight.Bold, + fontSize = 15.sp + ) + } + + Spacer(Modifier.width(10.dp)) + + Column(modifier = Modifier.weight(1f)) { + Text( + text = if (record.isVoided) "${record.typeLabel} (Voided)" else record.typeLabel, + fontSize = 13.sp, + fontWeight = FontWeight.SemiBold, + color = if (record.isVoided) Color.Gray else Color.Black + ) + Text( + text = record.maskedCard, + fontSize = 11.sp, + color = Color.Gray + ) + } + + Column(horizontalAlignment = Alignment.End) { + Text( + text = record.amountDisplay, + fontSize = 13.sp, + fontWeight = FontWeight.Bold, + color = if (record.isVoided) Color.Gray else Color.LegacyRed + ) + Text( + text = record.dateTime, + fontSize = 10.sp, + color = Color.Gray + ) + } + } +} + +private val previewTransactions = listOf( + TrnxRecord(1L, "Sale", "MMK 10,000", "**** 1234", "06/10 14:32", isVoided = false, isApproved = true), + TrnxRecord(2L, "Void", "MMK 5,500", "**** 5678", "06/10 13:10", isVoided = true, isApproved = false), + TrnxRecord(3L, "Refund", "MMK 2,000", "**** 9012", "06/09 09:45", isVoided = false, isApproved = true), + TrnxRecord(4L, "Sale", "MMK 30,000", "**** 3456", "06/09 08:00", isVoided = false, isApproved = true), + TrnxRecord(5L, "Settlement", "MMK 0", "----", "06/08 18:00", isVoided = false, isApproved = true), +) + @P2Preview @Composable fun PreviewDashboardScreen2() { - DashboardScreen2() + DashboardScreen2(dashboardUiState = DashboardUiState(previewTransactions)) } @P3Preview @Composable fun PreviewDashboardScreen3() { - DashboardScreen2() + DashboardScreen2(dashboardUiState = DashboardUiState(previewTransactions)) }