[Homepage] 3. add row transaksi
This commit is contained in:
Stephen
@@ -1,3 +1,5 @@
|
||||
import 'package:app_petty_cash/model/history_transaksi_model.dart';
|
||||
import 'package:app_petty_cash/widget/homepage_row_transaksi.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter_hooks/flutter_hooks.dart';
|
||||
import 'package:hooks_riverpod/hooks_riverpod.dart';
|
||||
@@ -12,6 +14,12 @@ class HomePageScreen extends HookConsumerWidget {
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context, WidgetRef ref) {
|
||||
final listSearchHistory = useState<List<HistoryTransaksiModel>>(
|
||||
List.empty(
|
||||
growable: true,
|
||||
),
|
||||
);
|
||||
|
||||
useEffect(() {
|
||||
WidgetsBinding.instance.addPostFrameCallback((timeStamp) async {
|
||||
final userID = ref.read(currentUserProvider)?.model.M_UserID ?? "0";
|
||||
@@ -27,190 +35,241 @@ class HomePageScreen extends HookConsumerWidget {
|
||||
return () {};
|
||||
}, []);
|
||||
|
||||
return Padding(
|
||||
padding: EdgeInsets.only(
|
||||
top: Constant.getActualYPhone(context: context, y: 30),
|
||||
),
|
||||
child: Scaffold(
|
||||
appBar: AppBar(
|
||||
title: Text(
|
||||
'Home Screen',
|
||||
style: TextStyle(color: Constant.textWhite),
|
||||
),
|
||||
backgroundColor: Constant.pcBtnBackgroundColor,
|
||||
iconTheme: IconThemeData(
|
||||
color: Constant.textWhite,
|
||||
),
|
||||
return Scaffold(
|
||||
appBar: AppBar(
|
||||
title: Text(
|
||||
'Home Screen',
|
||||
style: TextStyle(color: Constant.textWhite),
|
||||
),
|
||||
drawer: CustomDrawer(),
|
||||
body: SafeArea(
|
||||
child: Center(
|
||||
child: Container(
|
||||
width: Constant.getActualXPhone(context: context, x: 390),
|
||||
height: Constant.getActualYPhone(context: context, y: 844),
|
||||
child: Column(
|
||||
children: [
|
||||
SizedBox(
|
||||
height: Constant.getActualYPhone(context: context, y: 36),
|
||||
),
|
||||
//Card
|
||||
Container(
|
||||
decoration: BoxDecoration(
|
||||
borderRadius: BorderRadius.circular(20),
|
||||
image: DecorationImage(
|
||||
image: AssetImage('images/background_card.png'),
|
||||
fit: BoxFit.cover,
|
||||
),
|
||||
backgroundColor: Constant.pcBtnBackgroundColor,
|
||||
iconTheme: IconThemeData(
|
||||
color: Constant.textWhite,
|
||||
),
|
||||
),
|
||||
drawer: CustomDrawer(),
|
||||
body: SafeArea(
|
||||
child: Padding(
|
||||
padding: EdgeInsets.only(
|
||||
top: Constant.getActualYPhone(context: context, y: 36),
|
||||
left: Constant.getActualXPhone(context: context, x: 34),
|
||||
right: Constant.getActualXPhone(context: context, x: 34),
|
||||
),
|
||||
child: Container(
|
||||
width: Constant.getActualXPhone(context: context, x: 390),
|
||||
height: Constant.getActualYPhone(context: context, y: 844),
|
||||
child: Column(
|
||||
children: [
|
||||
Container(
|
||||
width: Constant.getActualXPhone(context: context, x: 332),
|
||||
height: Constant.getActualYPhone(context: context, y: 173),
|
||||
decoration: BoxDecoration(
|
||||
// color: Colors.black12,
|
||||
borderRadius: BorderRadius.circular(20),
|
||||
image: DecorationImage(
|
||||
image: AssetImage('images/background_card.png'),
|
||||
fit: BoxFit.cover,
|
||||
),
|
||||
child: Padding(
|
||||
padding: EdgeInsets.only(
|
||||
left: Constant.getActualXPhone(context: context, x: 34),
|
||||
right:
|
||||
Constant.getActualXPhone(context: context, x: 34),
|
||||
boxShadow: [
|
||||
BoxShadow(
|
||||
color: Color.fromRGBO(145, 158, 171, 0.16),
|
||||
offset: Offset(0, 24),
|
||||
blurRadius: 48,
|
||||
),
|
||||
child: Container(
|
||||
width:
|
||||
Constant.getActualXPhone(context: context, x: 332),
|
||||
height:
|
||||
Constant.getActualYPhone(context: context, y: 173),
|
||||
|
||||
//Isi Card
|
||||
child: Container(
|
||||
child: Column(
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
],
|
||||
),
|
||||
//Isi Card
|
||||
child: Container(
|
||||
child: Column(
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
children: [
|
||||
// Text1 & Text2
|
||||
Padding(
|
||||
padding: EdgeInsets.only(
|
||||
top: Constant.getActualYPhone(
|
||||
context: context, y: 17),
|
||||
left: Constant.getActualXPhone(
|
||||
context: context, x: 81),
|
||||
right: Constant.getActualXPhone(
|
||||
context: context, x: 81),
|
||||
),
|
||||
child: Container(
|
||||
child: Column(
|
||||
children: [
|
||||
// Text1 & Text2
|
||||
Padding(
|
||||
padding: EdgeInsets.only(
|
||||
top: Constant.getActualYPhone(
|
||||
context: context, y: 17),
|
||||
left: Constant.getActualXPhone(
|
||||
context: context, x: 81),
|
||||
right: Constant.getActualXPhone(
|
||||
context: context, x: 81),
|
||||
),
|
||||
child: Container(
|
||||
child: Column(
|
||||
children: [
|
||||
Text('Account Balance'),
|
||||
Text('Rp. 1,440,000'),
|
||||
],
|
||||
)),
|
||||
Text(
|
||||
'Account Balance',
|
||||
style: Constant.body1(context: context)
|
||||
.copyWith(
|
||||
fontWeight: FontWeight.w400,
|
||||
color: Constant.textWhite),
|
||||
),
|
||||
|
||||
SizedBox(
|
||||
height: Constant.getActualYPhone(
|
||||
context: context, y: 25),
|
||||
),
|
||||
|
||||
//Debit dan Kredit
|
||||
Row(
|
||||
mainAxisAlignment: MainAxisAlignment
|
||||
.center, // Menengahkan secara horizontal
|
||||
children: [
|
||||
// Spasi di sebelah kiri "Check In"
|
||||
Padding(
|
||||
padding: EdgeInsets.only(
|
||||
bottom: Constant.getActualYPhone(
|
||||
context: context, y: 17),
|
||||
left: Constant.getActualXPhone(
|
||||
context: context, x: 20),
|
||||
),
|
||||
child: Container(
|
||||
child: Column(
|
||||
children: [
|
||||
Text('Debit'),
|
||||
Text('Rp. 2,000,000'),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
|
||||
SizedBox(
|
||||
width: Constant.getActualXPhone(
|
||||
context: context, x: 51),
|
||||
), // Jarak antara "Check In" dan "Check Out"
|
||||
|
||||
Padding(
|
||||
padding: EdgeInsets.only(
|
||||
bottom: Constant.getActualYPhone(
|
||||
context: context, y: 17),
|
||||
right: Constant.getActualXPhone(
|
||||
context: context, x: 28),
|
||||
),
|
||||
child: Container(
|
||||
child: Column(
|
||||
children: [
|
||||
Text('Credit'),
|
||||
Text('Rp. 560,000'),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
SizedBox(
|
||||
height: Constant.getActualYPhone(
|
||||
context: context, y: 16),
|
||||
Text(
|
||||
'Rp. 1,440,000',
|
||||
style: Constant.H4_700V2(context: context)
|
||||
.copyWith(
|
||||
fontSize: Constant.getActualYPhone(
|
||||
context: context, y: 24),
|
||||
fontWeight: FontWeight.w600,
|
||||
color: Constant.textWhite),
|
||||
),
|
||||
],
|
||||
),
|
||||
)),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
|
||||
SizedBox(
|
||||
height: Constant.getActualYPhone(context: context, y: 44),
|
||||
),
|
||||
|
||||
Padding(
|
||||
padding: EdgeInsets.only(
|
||||
left: Constant.getActualXPhone(context: context, x: 20),
|
||||
right: Constant.getActualXPhone(context: context, x: 20),
|
||||
),
|
||||
child: Container(
|
||||
// color: Colors.amber,
|
||||
alignment: Alignment.centerLeft,
|
||||
|
||||
child: Column(children: [
|
||||
Text('Transaksi Terkini'),
|
||||
|
||||
SizedBox(
|
||||
height:
|
||||
Constant.getActualYPhone(context: context, y: 24),
|
||||
height: Constant.getActualYPhone(
|
||||
context: context, y: 27),
|
||||
),
|
||||
Container(
|
||||
width: Constant.getActualXPhone(
|
||||
context: context, x: 350),
|
||||
child: Row(
|
||||
children: [
|
||||
Column(
|
||||
children: [
|
||||
Container(
|
||||
child: Image(
|
||||
image:
|
||||
AssetImage('images/pizza_icon.png'),
|
||||
|
||||
//Debit dan Kredit
|
||||
Row(
|
||||
mainAxisAlignment: MainAxisAlignment
|
||||
.center, // Menengahkan secara horizontal
|
||||
children: [
|
||||
// Spasi di sebelah kiri "Check In"
|
||||
Padding(
|
||||
padding: EdgeInsets.only(
|
||||
left: Constant.getActualXPhone(
|
||||
context: context, x: 20),
|
||||
),
|
||||
child: Container(
|
||||
child: Column(
|
||||
children: [
|
||||
Text(
|
||||
'Debit',
|
||||
style: Constant.body1(context: context)
|
||||
.copyWith(
|
||||
fontWeight: FontWeight.w400,
|
||||
color: Constant.textWhite),
|
||||
),
|
||||
),
|
||||
],
|
||||
Text(
|
||||
'Rp. 2,000,000',
|
||||
style: Constant.titleH6_700(
|
||||
context: context)
|
||||
.copyWith(
|
||||
color: Constant.textWhite),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
SizedBox(
|
||||
width: Constant.getActualXPhone(
|
||||
context: context, x: 12),
|
||||
),
|
||||
|
||||
SizedBox(
|
||||
width: Constant.getActualXPhone(
|
||||
context: context, x: 51),
|
||||
),
|
||||
|
||||
Padding(
|
||||
padding: EdgeInsets.only(
|
||||
right: Constant.getActualXPhone(
|
||||
context: context, x: 28),
|
||||
),
|
||||
|
||||
Container(
|
||||
|
||||
)
|
||||
|
||||
],
|
||||
),
|
||||
)
|
||||
]),
|
||||
child: Container(
|
||||
child: Column(
|
||||
children: [
|
||||
Text(
|
||||
'Credit',
|
||||
style: Constant.body1(context: context)
|
||||
.copyWith(
|
||||
fontWeight: FontWeight.w400,
|
||||
color: Constant.textWhite),
|
||||
),
|
||||
Text(
|
||||
'Rp. 560,000',
|
||||
style: Constant.titleH6_700(
|
||||
context: context)
|
||||
.copyWith(
|
||||
color: Constant.textWhite),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
SizedBox(
|
||||
height: Constant.getActualYPhone(
|
||||
context: context, y: 17),
|
||||
),
|
||||
],
|
||||
),
|
||||
)
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
//Card
|
||||
SizedBox(
|
||||
height: Constant.getActualYPhone(context: context, y: 36),
|
||||
),
|
||||
|
||||
SizedBox(
|
||||
height: Constant.getActualYPhone(context: context, y: 44),
|
||||
),
|
||||
|
||||
Padding(
|
||||
padding: EdgeInsets.only(
|
||||
left: Constant.getActualXPhone(context: context, x: 20),
|
||||
right: Constant.getActualXPhone(context: context, x: 20),
|
||||
),
|
||||
child: Container(
|
||||
// color: Colors.amber,
|
||||
alignment: Alignment.centerLeft,
|
||||
|
||||
child: Column(children: [
|
||||
Text(
|
||||
'Transaksi Terkini',
|
||||
style: Constant.titleH5_600(context: context)
|
||||
.copyWith(color: Constant.textBlack),
|
||||
),
|
||||
SizedBox(
|
||||
height:
|
||||
Constant.getActualYPhone(context: context, y: 24),
|
||||
),
|
||||
// Expanded(
|
||||
// child: ListView.builder(
|
||||
// itemCount: listSearchHistory.value.length,
|
||||
// itemBuilder: (context, idx) {
|
||||
// return Padding(
|
||||
// padding: EdgeInsets.only(
|
||||
// bottom: Constant.getActualYPhone(
|
||||
// context: context,
|
||||
// y: 10,
|
||||
// ),
|
||||
// ),
|
||||
// child: Card(
|
||||
// elevation: 2.0,
|
||||
// child: Padding(
|
||||
// padding: EdgeInsets.all(10),
|
||||
// child: Column(
|
||||
// // crossAxisAlignment: CrossAxisAlignment.start,
|
||||
// // mainAxisAlignment: MainAxisAlignment.start,
|
||||
// children: [
|
||||
// // atas
|
||||
// HomepageRowTransaksiWidget(
|
||||
// icon_category_id: listSearchHistory
|
||||
// .value[idx].kategoriid
|
||||
// .toString(),
|
||||
// icon_category_name: listSearchHistory
|
||||
// .value[idx].kategoriname
|
||||
// .toString(),
|
||||
// amount: listSearchHistory
|
||||
// .value[idx].amount
|
||||
// .toString(),
|
||||
// tglTransaksi: listSearchHistory
|
||||
// .value[idx].tanggaltransaksi
|
||||
// .toString(),
|
||||
// tipe: listSearchHistory.value[idx].tipe
|
||||
// .toString(),
|
||||
// ),
|
||||
// ],
|
||||
// ),
|
||||
// ),
|
||||
// ),
|
||||
// );
|
||||
// },
|
||||
// ),
|
||||
// ),
|
||||
]),
|
||||
),
|
||||
)
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
|
||||
Reference in New Issue
Block a user