general UI chnages has been made

This commit is contained in:
Daniah Ayad Al-sultani
2025-12-14 13:05:32 +03:00
parent 489a99a0a3
commit 2ce0e0103e
5 changed files with 286 additions and 233 deletions

View File

@@ -1,3 +1,5 @@
import 'package:coda_project/screens/notifications_screen.dart';
import 'package:coda_project/screens/user_settings_screen.dart';
import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';
import '../widgets/login_animation.dart';
@@ -21,18 +23,31 @@ class AttendanceScreen extends StatelessWidget {
/// SETTINGS BAR (STATIC)
/// ------------------------------
SafeArea(
child: SettingsBar(
selectedIndex: 0,
showBackButton: false,
iconPaths: [
'assets/images/user.svg',
'assets/images/ball.svg',
],
onTap: (index) {
// Keep static, no animations
// You can navigate or add your logic later
},
),
child:SettingsBar(
selectedIndex: 0,
showBackButton: false,
iconPaths: [
'assets/images/user.svg',
'assets/images/ball.svg',
],
onTap: (index) {
if (index == 0) {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => UserSettingsScreen(),
),
);
} else if (index == 1) {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => NotificationsScreen(),
),
);
}
},
),
),
/// ------------------------------
@@ -143,7 +158,7 @@ class AttendanceScreen extends StatelessWidget {
/// LOGOUT BUTTON
/// ------------------------------
Positioned(
bottom: screenHeight * 0.16,
bottom: screenHeight * 0.2,
right: screenWidth * 0.1,
child: _ShadowedCard(
shadow: [

View File

@@ -1,3 +1,5 @@
import 'package:coda_project/screens/notifications_screen.dart';
import 'package:coda_project/screens/user_settings_screen.dart';
import 'package:flutter/material.dart';
import '../widgets/finance_summary_card.dart';
import '../widgets/work_day_card.dart';
@@ -39,17 +41,31 @@ class _FinanceScreenState extends State<FinanceScreen> {
physics: const BouncingScrollPhysics(),
slivers: [
SliverToBoxAdapter(
child: SettingsBar(
selectedIndex: 0,
showBackButton: false,
iconPaths: [
'assets/images/user.svg',
'assets/images/ball.svg',
],
onTap: (index) {
// Your logic here
},
),
child: SettingsBar(
selectedIndex: 0,
showBackButton: false,
iconPaths: [
'assets/images/user.svg',
'assets/images/ball.svg',
],
onTap: (index) {
if (index == 0) {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => UserSettingsScreen(),
),
);
} else if (index == 1) {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => NotificationsScreen(),
),
);
}
},
),
),
const SliverToBoxAdapter(child: SizedBox(height: 5)),

View File

@@ -1,3 +1,5 @@
import 'package:coda_project/screens/notifications_screen.dart';
import 'package:coda_project/screens/user_settings_screen.dart';
import 'package:flutter/material.dart';
import 'package:flutter/rendering.dart';
import 'package:flutter_svg/flutter_svg.dart';
@@ -74,165 +76,181 @@ class _HolidayScreenState extends State<HolidayScreen> {
@override
Widget build(BuildContext context) {
return Directionality(
textDirection: TextDirection.ltr,
child: Stack(
children: [
// ---------------------------------------------------------
// ⭐ MAIN CONTENT - CUSTOM SCROLL VIEW
// ---------------------------------------------------------
SafeArea(
child: CustomScrollView(
controller: _scrollController,
physics: const BouncingScrollPhysics(),
slivers: [
// SETTINGS BAR
SliverToBoxAdapter(
child: Padding(
padding: const EdgeInsets.only(top: 8),
child: SettingsBar(
selectedIndex: 0,
showBackButton: false,
iconPaths: [
'assets/images/user.svg',
'assets/images/ball.svg',
],
onTap: (index) {
// do your navigation logic
},
),
return Stack(
children: [
// ---------------------------------------------------------
// ⭐ MAIN CONTENT - CUSTOM SCROLL VIEW
// ---------------------------------------------------------
SafeArea(
child: CustomScrollView(
controller: _scrollController,
physics: const BouncingScrollPhysics(),
slivers: [
// SETTINGS BAR
SliverToBoxAdapter(
child: Padding(
padding: const EdgeInsets.only(top: 8),
// First, make sure you have your screens defined
// Then in your main widget:
child: SettingsBar(
selectedIndex: 0,
showBackButton: false,
iconPaths: [
'assets/images/user.svg',
'assets/images/ball.svg',
],
onTap: (index) {
if (index == 0) {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => UserSettingsScreen(),
),
);
} else if (index == 1) {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => NotificationsScreen(),
),
);
}
},
),
),
),
const SliverToBoxAdapter(child: SizedBox(height: 5)),
const SliverToBoxAdapter(child: SizedBox(height: 5)),
// TABS SECTION
SliverToBoxAdapter(
child: SizedBox(
height: 55,
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
// الأجازات
GestureDetector(
onTap: () => setState(() => activeTab = 1),
child: Column(
children: [
Text(
"الأجازات",
style: TextStyle(
fontSize: 22,
fontWeight: FontWeight.w600,
color: activeTab == 1
? const Color(0xFF8EFDC2)
: const Color(0x9EFFFFFF),
),
// TABS SECTION
SliverToBoxAdapter(
child: SizedBox(
height: 55,
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
// الأجازات
GestureDetector(
onTap: () => setState(() => activeTab = 1),
child: Column(
children: [
Text(
"الأجازات",
style: TextStyle(
fontSize: 22,
fontWeight: FontWeight.w600,
color:
activeTab == 1
? const Color(0xFF8EFDC2)
: const Color(0x9EFFFFFF),
),
if (activeTab == 1)
Container(
width: 60,
height: 2,
margin: const EdgeInsets.only(top: 4),
color: const Color(0xFF8EFDC2),
),
],
),
),
const SizedBox(width: 70),
// السلف
GestureDetector(
onTap: () => setState(() => activeTab = 0),
child: Column(
children: [
Text(
"السلف",
style: TextStyle(
fontSize: 22,
fontWeight: FontWeight.w600,
color: activeTab == 0
? const Color(0xFF8EFDC2)
: const Color(0x9EFFFFFF),
),
),
if (activeTab == 1)
Container(
width: 60,
height: 2,
margin: const EdgeInsets.only(top: 4),
color: const Color(0xFF8EFDC2),
),
if (activeTab == 0)
Container(
width: 60,
height: 2,
margin: const EdgeInsets.only(top: 4),
color: const Color(0xFF8EFDC2),
),
],
),
],
),
],
),
),
const SizedBox(width: 70),
// السلف
GestureDetector(
onTap: () => setState(() => activeTab = 0),
child: Column(
children: [
Text(
"السلف",
style: TextStyle(
fontSize: 22,
fontWeight: FontWeight.w600,
color:
activeTab == 0
? const Color(0xFF8EFDC2)
: const Color(0x9EFFFFFF),
),
),
if (activeTab == 0)
Container(
width: 60,
height: 2,
margin: const EdgeInsets.only(top: 4),
color: const Color(0xFF8EFDC2),
),
],
),
),
],
),
),
),
const SliverToBoxAdapter(child: SizedBox(height: 20)),
const SliverToBoxAdapter(child: SizedBox(height: 20)),
// CONTENT LISTS
activeTab == 1
? _buildLeaveRequestsSliver()
: _buildAdvanceRequestsSliver(),
// CONTENT LISTS
activeTab == 1
? _buildLeaveRequestsSliver()
: _buildAdvanceRequestsSliver(),
const SliverToBoxAdapter(child: SizedBox(height: 120)),
],
),
const SliverToBoxAdapter(child: SizedBox(height: 120)),
],
),
),
// ---------------------------------------------------------
// ⭐ FLOATING ACTION BUTTONS
// ---------------------------------------------------------
Positioned(
bottom: 60,
right: 20,
child: AnimatedSlide(
offset: _showActions ? Offset.zero : const Offset(0, 1.3),
duration: const Duration(milliseconds: 300),
child: AnimatedOpacity(
opacity: _showActions ? 1 : 0,
duration: const Duration(milliseconds: 250),
child: Column(
children: [
_HolidayActionButton(
label: "طلب سلفة",
svgPath: "assets/images/money2.svg",
iconWidth: 28,
iconHeight: 20,
onTap: () {
Navigator.push(
context,
MaterialPageRoute(
builder: (_) => const RequestAdvanceScreen(),
),
);
},
),
const SizedBox(height: 18),
_HolidayActionButton(
label: "طلب إجازة",
svgPath: "assets/images/plus.svg",
iconWidth: 28,
iconHeight: 20,
onTap: () {
Navigator.push(
context,
MaterialPageRoute(
builder: (_) => const RequestLeaveScreen(),
),
);
},
),
],
),
// ---------------------------------------------------------
// ⭐ FLOATING ACTION BUTTONS
// ---------------------------------------------------------
Positioned(
bottom: 150,
right: 20,
child: AnimatedSlide(
offset: _showActions ? Offset.zero : const Offset(0, 1.3),
duration: const Duration(milliseconds: 300),
child: AnimatedOpacity(
opacity: _showActions ? 1 : 0,
duration: const Duration(milliseconds: 250),
child: Column(
children: [
_HolidayActionButton(
label: "طلب سلفة",
svgPath: "assets/images/money2.svg",
iconWidth: 28,
iconHeight: 20,
onTap: () {
Navigator.push(
context,
MaterialPageRoute(
builder: (_) => const RequestAdvanceScreen(),
),
);
},
),
const SizedBox(height: 18),
_HolidayActionButton(
label: "طلب إجازة",
svgPath: "assets/images/plus.svg",
iconWidth: 28,
iconHeight: 20,
onTap: () {
Navigator.push(
context,
MaterialPageRoute(
builder: (_) => const RequestLeaveScreen(),
),
);
},
),
],
),
),
),
],
),
),
],
);
}
@@ -258,15 +276,12 @@ class _HolidayScreenState extends State<HolidayScreen> {
return SliverPadding(
padding: const EdgeInsets.symmetric(horizontal: 25),
sliver: SliverList(
delegate: SliverChildBuilderDelegate(
(context, index) {
return Padding(
padding: const EdgeInsets.only(bottom: 16),
child: _buildLeaveRequestCard(_leaveRequests[index]),
);
},
childCount: _leaveRequests.length,
),
delegate: SliverChildBuilderDelegate((context, index) {
return Padding(
padding: const EdgeInsets.only(bottom: 16),
child: _buildLeaveRequestCard(_leaveRequests[index]),
);
}, childCount: _leaveRequests.length),
),
);
}
@@ -289,15 +304,12 @@ class _HolidayScreenState extends State<HolidayScreen> {
return SliverPadding(
padding: const EdgeInsets.symmetric(horizontal: 25),
sliver: SliverList(
delegate: SliverChildBuilderDelegate(
(context, index) {
return Padding(
padding: const EdgeInsets.only(bottom: 16),
child: _buildAdvanceRequestCard(_advanceRequests[index]),
);
},
childCount: _advanceRequests.length,
),
delegate: SliverChildBuilderDelegate((context, index) {
return Padding(
padding: const EdgeInsets.only(bottom: 16),
child: _buildAdvanceRequestCard(_advanceRequests[index]),
);
}, childCount: _advanceRequests.length),
),
);
}
@@ -333,17 +345,29 @@ class _HolidayScreenState extends State<HolidayScreen> {
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
_statusCircle(isWaiting, "قيد الانتظار",
isWaiting ? "assets/images/waiting.svg" : null,
const Color(0xFFA58A1B), const Color(0xFFFFDC69)),
_statusCircle(
isWaiting,
"قيد الانتظار",
isWaiting ? "assets/images/waiting.svg" : null,
const Color(0xFFA58A1B),
const Color(0xFFFFDC69),
),
const SizedBox(width: 12),
_statusCircle(isApproved, "موافقة",
isApproved ? "assets/images/yes.svg" : null,
const Color(0xFF0A8A60), const Color(0xFF00D7A3)),
_statusCircle(
isApproved,
"موافقة",
isApproved ? "assets/images/yes.svg" : null,
const Color(0xFF0A8A60),
const Color(0xFF00D7A3),
),
const SizedBox(width: 12),
_statusCircle(isDenied, "تم الرفض",
isDenied ? "assets/images/no.svg" : null,
const Color(0xFFE63946), const Color(0xFFE63946)),
_statusCircle(
isDenied,
"تم الرفض",
isDenied ? "assets/images/no.svg" : null,
const Color(0xFFE63946),
const Color(0xFFE63946),
),
],
),
@@ -381,28 +405,32 @@ class _HolidayScreenState extends State<HolidayScreen> {
// REASON ROW
Row(
textDirection: TextDirection.ltr, // Add this
children: [
Expanded(
child: Text(
request.reason,
textAlign: TextAlign.right,
),
child: Text(request.reason, textAlign: TextAlign.right),
),
const SizedBox(width: 6),
const Text(
"السبب:",
style: TextStyle(fontWeight: FontWeight.bold),
textAlign: TextAlign.right,
),
],
)
),
],
),
),
);
}
Widget _statusCircle(bool active, String label, String? svg,
Color color, Color glow) {
Widget _statusCircle(
bool active,
String label,
String? svg,
Color color,
Color glow,
) {
return Column(
children: [
Container(
@@ -411,15 +439,15 @@ class _HolidayScreenState extends State<HolidayScreen> {
decoration: BoxDecoration(
shape: BoxShape.circle,
color: active ? color : const Color(0xFFD6D6D6),
boxShadow: active
? [BoxShadow(color: glow.withOpacity(0.6), blurRadius: 12)]
: [],
boxShadow:
active
? [BoxShadow(color: glow.withOpacity(0.6), blurRadius: 12)]
: [],
),
child: svg != null
? Center(
child: SvgPicture.asset(svg, width: 18, height: 18),
)
: null,
child:
svg != null
? Center(child: SvgPicture.asset(svg, width: 18, height: 18))
: null,
),
const SizedBox(height: 4),
Text(label, style: const TextStyle(fontSize: 10)),

View File

@@ -123,10 +123,7 @@ class _RequestLeaveScreenState extends State<RequestLeaveScreen> {
} catch (e) {
// Show an error message if something went wrong
ScaffoldMessenger.of(context).showSnackBar(
SnackBar(
content: Text('حدث خطأ: $e'),
backgroundColor: Colors.red,
),
SnackBar(content: Text('حدث خطأ: $e'), backgroundColor: Colors.red),
);
}
}
@@ -151,10 +148,9 @@ class _RequestLeaveScreenState extends State<RequestLeaveScreen> {
),
// Title
const SizedBox(height: 30),
Expanded(
child: SingleChildScrollView(
// const SizedBox(height: 30),
Flexible(
child: Padding(
padding: const EdgeInsets.symmetric(horizontal: 25),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
@@ -172,7 +168,7 @@ class _RequestLeaveScreenState extends State<RequestLeaveScreen> {
),
),
const SizedBox(height: 25),
const SizedBox(height: 10),
//=============================
// DROPDOWN: نوع الإجازة
//=============================
@@ -188,7 +184,7 @@ class _RequestLeaveScreenState extends State<RequestLeaveScreen> {
),
),
const SizedBox(height: 6),
const SizedBox(height: 5),
// Modified dropdown with disabled state
Directionality(
@@ -306,8 +302,8 @@ class _RequestLeaveScreenState extends State<RequestLeaveScreen> {
// ---------- TOGGLE ----------
AnimatedContainer(
duration: const Duration(milliseconds: 250),
width: 95,
height: 42,
width: 75,
height: 30,
padding: const EdgeInsets.symmetric(
horizontal: 4,
),
@@ -329,8 +325,8 @@ class _RequestLeaveScreenState extends State<RequestLeaveScreen> {
: Alignment.centerLeft,
child: AnimatedContainer(
duration: const Duration(milliseconds: 250),
width: 40,
height: 40,
width: 30,
height: 30,
decoration: BoxDecoration(
color:
isTimedLeave
@@ -461,7 +457,7 @@ class _RequestLeaveScreenState extends State<RequestLeaveScreen> {
),
),
const SizedBox(height: 25),
const SizedBox(height: 10),
// =============================
// REASON TEXTFIELD (Two Containers)
@@ -484,7 +480,7 @@ class _RequestLeaveScreenState extends State<RequestLeaveScreen> {
// OUTER BORDER CONTAINER
Container(
padding: const EdgeInsets.all(
15,
12,
), // border thickness space
decoration: BoxDecoration(
border: Border.all(
@@ -496,7 +492,7 @@ class _RequestLeaveScreenState extends State<RequestLeaveScreen> {
// INNER TEXTFIELD CONTAINER
child: Container(
height: 100,
height: 70,
padding: const EdgeInsets.symmetric(
horizontal: 14,
vertical: 10,
@@ -525,7 +521,7 @@ class _RequestLeaveScreenState extends State<RequestLeaveScreen> {
),
),
const SizedBox(height: 70),
const SizedBox(height: 20),
// CONFIRM BUTTON
Center(
@@ -536,8 +532,6 @@ class _RequestLeaveScreenState extends State<RequestLeaveScreen> {
onPressed: _saveLeaveRequest, // Call the save method
),
),
const SizedBox(height: 40),
],
),
),
@@ -642,4 +636,4 @@ class _RequestLeaveScreenState extends State<RequestLeaveScreen> {
return "";
}
}
}
}

View File

@@ -143,8 +143,8 @@ class _UserSettingsScreenState extends State<UserSettingsScreen> {
duration: const Duration(
milliseconds: 250,
),
width: 95,
height: 42,
width: 75,
height: 30,
padding: const EdgeInsets.symmetric(
horizontal: 4,
),
@@ -166,8 +166,8 @@ class _UserSettingsScreenState extends State<UserSettingsScreen> {
duration: const Duration(
milliseconds: 250,
),
width: 40,
height: 40,
width: 30,
height: 30,
decoration: BoxDecoration(
color:
_notificationsOn