From 0daef445a2068af71e0118f820bc5de5dcf29d00 Mon Sep 17 00:00:00 2001 From: Stephen Date: Thu, 11 Jan 2024 17:45:52 +0700 Subject: [PATCH] [Homepage] 7. add Rekap Presensi --- images/divider.png | Bin 0 -> 332 bytes images/person_available_grey.png | Bin 0 -> 450 bytes images/person_delete_grey.png | Bin 0 -> 477 bytes images/task_pending_grey.png | Bin 0 -> 467 bytes lib/app/constant.dart | 26 +++ lib/screen/homepage/homepage_screen.dart | 191 ++++++++++++++++++++++- 6 files changed, 213 insertions(+), 4 deletions(-) create mode 100644 images/divider.png create mode 100644 images/person_available_grey.png create mode 100644 images/person_delete_grey.png create mode 100644 images/task_pending_grey.png diff --git a/images/divider.png b/images/divider.png new file mode 100644 index 0000000000000000000000000000000000000000..466a04524b9a98e0b9cab80b1f30ac14764a3d8f GIT binary patch literal 332 zcmV-S0ki&zP)dF^QQo5~m<43OZyECtrs+=ysx$3WCqMI}>pbpAduJ z_4nC+s8DMDfR|Wc6Tg3xSTDplE)Nv$fWz9`=?vet` literal 0 HcmV?d00001 diff --git a/images/person_available_grey.png b/images/person_available_grey.png new file mode 100644 index 0000000000000000000000000000000000000000..5c8d1755dee3bc63c6bdda8ce00cfa08a9dfb24b GIT binary patch literal 450 zcmV;z0X_bSP)n5Aos0W9awIajj~wFhDw1m+SaPUk|i zqzg~Zm$a4w4|YEcRQy~l=SkK9oOO~u`6WCY2V1@tM6?=GTWcq74uNh?uP%7%KJ0jKc%tO`_Gy0>&b+s4D0QJ s*5|dp%TED(XUaDJ^2}%4wiUMVKUd*?_ayR|d;kCd07*qoM6N<$g2MN=bN~PV literal 0 HcmV?d00001 diff --git a/images/person_delete_grey.png b/images/person_delete_grey.png new file mode 100644 index 0000000000000000000000000000000000000000..efd948a24292d49198a633f8a63fffdcc114856e GIT binary patch literal 477 zcmV<30V4j1P)Ym z!$1s%Z8uey^akVz(;KuWKs`Yp5>j^*R3vsx_dv^@N4P<6&~k%vf(|z*>nLM9C6J_( zh$3MrFWd9^x2*vDgJD&mKh_Eelw@q9TfKn4LWYy+H8SY$Z)Pyoax0qaZCO5f3MRUp z2ka^#gmP)9Fb_f&+GUA|cmjt)M0}}aq;h{L#9EBxVLY^jdpH#0hF7n1M~3;Dy0+5F z`O}?_svw2!?A8j<+{@y@S1DTlu98pM@0B8hvnU_5otyQuBZ-jeQo4%T&QO8L+(mcxE1#W)Ri{oRHMz; z8FcMugGJ=2CxrM2el~@RgusZJGhx0sk7YIm$it0Z5phf8zGYHS*&3`JNK`1YxO4+% zfSwCC8Zb}0@NIOZ!#D;dz^3$Vf&fe$<5EIlnj#zH!Q(GKW~rTCYBd_`aNqw4PPUH~ TmFH(K00000NkvXXu0mjfAHKyh literal 0 HcmV?d00001 diff --git a/images/task_pending_grey.png b/images/task_pending_grey.png new file mode 100644 index 0000000000000000000000000000000000000000..c893fb2791b886ee3937671a139158a555cc4ef1 GIT binary patch literal 467 zcmV;^0WAKBP)$hKLGzNXkP{+={o}YyPPwEH6qL(Ze_d$Fr3H%B1X_8Yf9bwP|lPt zjFAXB&``)?*)oa{;1z0uNEbx-3Is2VoRpCQ&-v@wV4^00$83T;6&!GpWDeChx1g3I zu61_=_>f1wu`w1%k2!9|qK-k5BE{N~vT>TyA(s?#_xq}>EW?QZ$A6aK08WeN9`~jP z`i{P0!a!|4aySV_I~lkx9VsQxj8|p0jHJ;KMZkOG)iT&@Kr_G;)C9`$k^>%tc3GV( zKi7q}s1PBpFtB3+xM3^HKGowbKsnLUF;5@wv*pRDze3^wf-gRwJb(pn&4R(twuw?4 z-N~n4W3+eNmdop#YBzEw&-*EjwFV7k#0~rAn)jG?7|L=xe*nm3g&+b(!_5Ey002ov JPDHLkV1h*B!WjSn literal 0 HcmV?d00001 diff --git a/lib/app/constant.dart b/lib/app/constant.dart index 2d8564c..131afb7 100644 --- a/lib/app/constant.dart +++ b/lib/app/constant.dart @@ -8,9 +8,11 @@ class Constant { static double designWidthPhone = 390; // color theme + static Color textTrueBlack = const Color(0xff000000); static Color textBlack = const Color(0xff212B36); static Color textDarkGrey = const Color(0xff637381); static Color textLightGrey = const Color(0xff919EAB); + static Color textOrange = const Color(0xffF15A29); // size convertion static double getActualXPhone({ @@ -35,6 +37,14 @@ class Constant { ); } + static TextStyle titleH1_500_18({required BuildContext context}) { + return TextStyle( + fontSize: Constant.getActualYPhone(context: context, y: 18), + fontWeight: FontWeight.w500, + fontFamily: 'Public Sans' + ); + } + static TextStyle titleH2_600({required BuildContext context}) { return TextStyle( fontSize: Constant.getActualYPhone(context: context, y: 12), @@ -74,6 +84,22 @@ class Constant { ); } + static TextStyle subtitle_600_14({required BuildContext context}) { + return TextStyle( + fontSize: Constant.getActualYPhone(context: context, y: 14), + fontWeight: FontWeight.w700, + fontFamily: 'Public Sans', + ); + } + + static TextStyle subtitle_500_12({required BuildContext context}) { + return TextStyle( + fontSize: Constant.getActualYPhone(context: context, y: 12), + fontWeight: FontWeight.w700, + fontFamily: 'Public Sans', + ); + } + static TextStyle date_600({required BuildContext context}) { return TextStyle( fontSize: Constant.getActualYPhone(context: context, y: 16), diff --git a/lib/screen/homepage/homepage_screen.dart b/lib/screen/homepage/homepage_screen.dart index 873c774..804f152 100644 --- a/lib/screen/homepage/homepage_screen.dart +++ b/lib/screen/homepage/homepage_screen.dart @@ -169,12 +169,12 @@ class HomepageScreen extends StatelessWidget { height:Constant.getActualYPhone(context: context, y: 50), decoration: BoxDecoration( // color: Colors.green, - image: DecorationImage( + image: DecorationImage( // fit: BoxFit.contain, - image: AssetImage('images/person.png'), + image: AssetImage('images/person.png'), + ), ), ), - ), SizedBox( height: Constant.getActualYPhone(context: context, y: 8), @@ -248,11 +248,194 @@ class HomepageScreen extends StatelessWidget { ), ) ), - ], ), ), ), + + SizedBox( + height: Constant.getActualYPhone(context: context, y: 56), + ), + + //Menu Rekap Presensi + Padding( + padding: EdgeInsets.only( + right:Constant.getActualXPhone(context: context, x: 27), + left: Constant.getActualXPhone(context: context, x: 33), + ), + child: SizedBox( + width: Constant.getActualXPhone(context: context, x: 330), + child: Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + Text( + 'Rekap Presensi Bulan Ini', + style: Constant.titleH1_500_18(context: context).copyWith( + color: Constant.textTrueBlack, + ), + ), + + SizedBox( + height: Constant.getActualYPhone(context: context, y: 20), + ), + + Container( + decoration: BoxDecoration( + shape: BoxShape.rectangle, + borderRadius: BorderRadius.circular(16), + color: Colors.white, // Set background color to #FFF + boxShadow: [ + BoxShadow( + color: Color.fromRGBO(145, 158, 171, 0.20), + blurRadius: 2, + ), + ], + ), + child: Padding( + padding: EdgeInsets.only( + top: Constant.getActualYPhone(context: context, y: 12), + bottom: Constant.getActualYPhone(context: context, y: 12), + left: Constant.getActualXPhone(context: context, x: 24), + right:Constant.getActualXPhone(context: context, x: 24), + ), + child: Row( + mainAxisAlignment: MainAxisAlignment.spaceBetween, + children: [ + Container( + + child: Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + Text( + '24 hari', + style: Constant.subtitle_600_14(context: context).copyWith( + color: Constant.textOrange, + ), + ), + + SizedBox( + height: Constant.getActualYPhone(context: context, y: 4), + ), + + SizedBox( + child: Row( + children: [ + Image( + image:AssetImage('images/person_available_grey.png'), + ), + + SizedBox( + width: Constant.getActualXPhone(context: context, x: 4), + ), + + Text( + 'Kehadiran', + style: Constant.subtitle_500_12(context: context).copyWith( + color: Constant.textDarkGrey, + ), + ), + ], + ), + ) + ], + ), + ), + + Image( + image:AssetImage('images/divider.png'), + ), + + //Tidak Hadir + Container( + child: Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + Text( + '2 hari', + style: Constant.subtitle_600_14(context: context).copyWith( + color: Constant.textOrange, + ), + ), + + SizedBox( + height: Constant.getActualYPhone(context: context, y: 4), + ), + + SizedBox( + child: Row( + children: [ + Image( + image:AssetImage('images/person_delete_grey.png'), + ), + + SizedBox( + width: Constant.getActualXPhone(context: context, x: 4), + ), + + Text( + 'Tidak Hadir', + style: Constant.subtitle_500_12(context: context).copyWith( + color: Constant.textDarkGrey, + ), + ), + ], + ), + ) + ], + ), + ), + + Image( + image:AssetImage('images/divider.png'), + ), + + //Tidak Hadir + Container( + child: Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + Text( + '5 hari', + style: Constant.subtitle_600_14(context: context).copyWith( + color: Constant.textOrange, + ), + ), + + SizedBox( + height: Constant.getActualYPhone(context: context, y: 4), + ), + + SizedBox( + child: Row( + children: [ + Image( + image:AssetImage('images/task_pending_grey.png'), + ), + + SizedBox( + width: Constant.getActualXPhone(context: context, x: 4), + ), + + Text( + 'Lembur', + style: Constant.subtitle_500_12(context: context).copyWith( + color: Constant.textDarkGrey, + ), + ), + ], + ), + ) + ], + ), + ), + ], + ), + ), + ) + ], + ), + ), + ) ], ), ),