general UI chnages has been made
This commit is contained in:
Daniah Ayad Al-sultani
@@ -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)),
|
||||
|
||||
Reference in New Issue
Block a user