diff --git a/assets/images/complete_request.svg b/assets/images/complete_request.svg new file mode 100644 index 00000000..1e9d7667 --- /dev/null +++ b/assets/images/complete_request.svg @@ -0,0 +1,3 @@ + + + diff --git a/assets/images/high_priority.svg b/assets/images/high_priority.svg new file mode 100644 index 00000000..423cbebb --- /dev/null +++ b/assets/images/high_priority.svg @@ -0,0 +1,6 @@ + + + + + + diff --git a/assets/images/new_request.svg b/assets/images/new_request.svg new file mode 100644 index 00000000..2c9bcc64 --- /dev/null +++ b/assets/images/new_request.svg @@ -0,0 +1,3 @@ + + + diff --git a/assets/images/overdue.svg b/assets/images/overdue.svg new file mode 100644 index 00000000..ee9de58c --- /dev/null +++ b/assets/images/overdue.svg @@ -0,0 +1,4 @@ + + + + diff --git a/lib/new_views/common_widgets/app_floating_action_button.dart b/lib/new_views/common_widgets/app_floating_action_button.dart index 1d6a139c..a465b5aa 100644 --- a/lib/new_views/common_widgets/app_floating_action_button.dart +++ b/lib/new_views/common_widgets/app_floating_action_button.dart @@ -2,6 +2,7 @@ import 'package:flutter/material.dart'; import 'package:flutter_svg/svg.dart'; import 'package:test_sa/extensions/context_extension.dart'; import 'package:test_sa/extensions/int_extensions.dart'; +import 'package:test_sa/extensions/text_extensions.dart'; import 'package:test_sa/extensions/widget_extensions.dart'; import 'package:test_sa/new_views/pages/new_gas_refill_request_page.dart'; import 'package:test_sa/views/pages/device_transfer/request_device_transfer.dart'; @@ -31,7 +32,7 @@ class _AppFloatingActionButtonState extends State { @override Widget build(BuildContext context) { - const duration = Duration(milliseconds: 500); + const duration = Duration(milliseconds: 250); return Column( mainAxisAlignment: MainAxisAlignment.end, crossAxisAlignment: CrossAxisAlignment.end, @@ -44,19 +45,26 @@ class _AppFloatingActionButtonState extends State { child: AnimatedOpacity( opacity: turns != 0 ? 1 : 0, duration: duration, - child: Card( - shape: Theme.of(context).cardTheme.copyWith().shape, - margin: EdgeInsetsDirectional.only(start: 60.toScreenWidth), + child: Container( + width: MediaQuery.of(context).size.width * .66, + padding: EdgeInsets.all(16), + decoration: ShapeDecoration( + color: Colors.white, + shape: RoundedRectangleBorder( + borderRadius: BorderRadius.circular(10), + ), + shadows: const [BoxShadow(color: Color(0x0C000000), blurRadius: 10, offset: Offset(0, 0), spreadRadius: 0)], + ), child: Column( mainAxisSize: MainAxisSize.min, children: [ - _FloatingButtonListTile(iconName: "gas_refill_request", label: context.translation.gasRefillRequest, routeName: NewGasRefillRequestPage.routeName), - const Divider().defaultStyle(context).paddingOnly(start: 16, end: 16), - _FloatingButtonListTile(iconName: "transfer_request", label: context.translation.transferRequest, routeName: RequestDeviceTransfer.id), - const Divider().defaultStyle(context).paddingOnly(start: 16, end: 16), - _FloatingButtonListTile(iconName: "service_request", label: context.translation.serviceRequest, routeName: CreateServiceRequestPage.id), + fabItem(context.translation.gasRefillRequest, "gas_refill_request", NewGasRefillRequestPage.routeName), + 1.divider.paddingOnly(top: 16, bottom: 16), + fabItem(context.translation.transferRequest, "transfer_request", RequestDeviceTransfer.id), + 1.divider.paddingOnly(top: 16, bottom: 16), + fabItem(context.translation.serviceRequest, "service_request", CreateServiceRequestPage.id), ], - ).paddingOnly(top: 8, bottom: 8), + ), ), ), ), @@ -74,37 +82,33 @@ class _AppFloatingActionButtonState extends State { ], ); } -} - -class _FloatingButtonListTile extends StatelessWidget { - final String iconName, routeName; - final String label; - - const _FloatingButtonListTile({ - @required this.iconName, - @required this.routeName, - @required this.label, - Key key, - }) : super(key: key); - @override - Widget build(BuildContext context) { - return InkWell( - onTap: () { - Navigator.of(context).pushNamed(routeName); - }, - child: ListTile( - horizontalTitleGap: 40.toScreenWidth, - leading: SvgPicture.asset( - "assets/images/$iconName.svg", - height: 28.toScreenWidth, - color: context.isDark ? AppColor.primary40 : AppColor.primary70, - ), - title: Text( - label, - style: Theme.of(context).textTheme.titleLarge?.copyWith(fontWeight: FontWeight.w500), + Widget fabItem(String label, String iconName, routeName) { + return Row( + crossAxisAlignment: CrossAxisAlignment.center, + children: [ + Expanded( + flex: 4, + child: Text( + label, + textAlign: TextAlign.center, + style: AppTextStyles.heading5.copyWith(color: AppColor.neutral50), + ), ), - ), - ); + // 4.width, + Expanded( + flex: 1, + child: SvgPicture.asset( + "assets/images/$iconName.svg", + height: 24.toScreenHeight, + width: 24.toScreenWidth, + color: context.isDark ? AppColor.primary40 : AppColor.primary70, + ), + ) + ], + ).onPress(() { + _rotate(); + Navigator.of(context).pushNamed(routeName); + }); } } diff --git a/lib/new_views/pages/land_page/dashboard_fragments/progress_fragment.dart b/lib/new_views/pages/land_page/dashboard_fragments/progress_fragment.dart new file mode 100644 index 00000000..89de3701 --- /dev/null +++ b/lib/new_views/pages/land_page/dashboard_fragments/progress_fragment.dart @@ -0,0 +1,11 @@ +import 'package:flutter/material.dart'; + +class ProgressFragment extends StatelessWidget { + ProgressFragment({Key key}) : super(key: key); + + @override + Widget build(BuildContext context) { + // TODO: implement build + return Container(); + } +} diff --git a/lib/new_views/pages/land_page/dashboard_fragments/recent_activites_fragment.dart b/lib/new_views/pages/land_page/dashboard_fragments/recent_activites_fragment.dart new file mode 100644 index 00000000..7077e17e --- /dev/null +++ b/lib/new_views/pages/land_page/dashboard_fragments/recent_activites_fragment.dart @@ -0,0 +1,11 @@ +import 'package:flutter/material.dart'; + +class RecentActivitiesFragment extends StatelessWidget { + RecentActivitiesFragment({Key key}) : super(key: key); + + @override + Widget build(BuildContext context) { + // TODO: implement build + return Container(); + } +} diff --git a/lib/new_views/pages/land_page/dashboard_fragments/requests_fragment.dart b/lib/new_views/pages/land_page/dashboard_fragments/requests_fragment.dart new file mode 100644 index 00000000..a54b656a --- /dev/null +++ b/lib/new_views/pages/land_page/dashboard_fragments/requests_fragment.dart @@ -0,0 +1,84 @@ +import 'package:flutter/material.dart'; +import 'package:flutter_svg/flutter_svg.dart'; +import 'package:test_sa/extensions/int_extensions.dart'; +import 'package:test_sa/extensions/text_extensions.dart'; +import 'package:test_sa/extensions/widget_extensions.dart'; +import 'package:test_sa/new_views/app_style/app_color.dart'; +import 'package:test_sa/new_views/common_widgets/app_floating_action_button.dart'; + +class RequestsFragment extends StatelessWidget { + RequestsFragment({Key key}) : super(key: key); + + @override + Widget build(BuildContext context) { + return Scaffold( + // todo check here, nurse can add request not engineer + floatingActionButton: const AppFloatingActionButton(), + body: GridView( + padding: const EdgeInsets.only(left: 16, right: 16, bottom: 16), + gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(crossAxisCount: 2, childAspectRatio: 191 / 237, crossAxisSpacing: 16, mainAxisSpacing: 16), + children: [ + gridItem("12", "high_priority", "High Priority\nRequests"), + gridItem("12", "overdue", "Overdue\nRequests"), + gridItem("12", "new_request", "New\nRequests"), + gridItem("12", "complete_request", "Completed\nRequests"), + ], + ), + ); + } + + Widget gridItem(String value, String icon, String title) { + return Container( + padding: const EdgeInsets.all(16), + decoration: ShapeDecoration( + color: Colors.white, + shape: RoundedRectangleBorder( + borderRadius: BorderRadius.circular(20), + ), + shadows: const [ + BoxShadow( + color: Color(0x07000000), + blurRadius: 14, + offset: Offset(0, 0), + spreadRadius: 0, + ) + ], + ), + child: Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + Row( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + Text( + value, + style: AppTextStyles.heading1.copyWith(color: AppColor.neutral70, height: 1), + ).expanded, + SvgPicture.asset('assets/images/$icon.svg', height: 35, width: 35), + ], + ).expanded, + Text( + title, + style: AppTextStyles.heading5.copyWith(color: AppColor.neutral50), + ), + 8.height, + Row( + mainAxisSize: MainAxisSize.min, + children: [ + Text( + 'View Details', + style: AppTextStyles.bodyText.copyWith(color: const Color(0xFF4A8DB7)), + ), + 4.width, + const Icon( + Icons.arrow_forward, + color: Color(0xFF4A8DB7), + size: 14, + ) + ], + ), + ], + ), + ); + } +} diff --git a/lib/new_views/pages/land_page/dashboard_page.dart b/lib/new_views/pages/land_page/dashboard_page.dart index 37793396..af2f2522 100644 --- a/lib/new_views/pages/land_page/dashboard_page.dart +++ b/lib/new_views/pages/land_page/dashboard_page.dart @@ -7,6 +7,10 @@ import 'package:test_sa/models/enums/translation_keys.dart'; import 'package:test_sa/new_views/app_style/app_color.dart'; import 'package:test_sa/new_views/common_widgets/app_drawer.dart'; import 'package:test_sa/new_views/common_widgets/app_floating_action_button.dart'; +import 'package:test_sa/new_views/pages/land_page/dashboard_fragments/progress_fragment.dart'; +import 'package:test_sa/new_views/pages/land_page/dashboard_fragments/recent_activites_fragment.dart'; +import 'package:test_sa/new_views/pages/land_page/dashboard_fragments/requests_fragment.dart'; +import 'package:test_sa/views/pages/user/notifications/notifications_page.dart'; import 'dashboard_page_indicator.dart'; @@ -42,7 +46,6 @@ class _DashboardPageState extends State { @override Widget build(BuildContext context) { return Scaffold( - floatingActionButton: const AppFloatingActionButton(), appBar: AppBar( automaticallyImplyLeading: false, backgroundColor: const Color(0xffF8F9FB), @@ -86,55 +89,56 @@ class _DashboardPageState extends State { ), ) ], - ), + ).onPress(() { + Navigator.of(context).pushNamed(NotificationsPage.id); + }), ], ).paddingOnly(start: 16, end: 16), ), body: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ - Text( - context.translation.welcome, - style: AppTextStyles.heading6.copyWith(color: context.isDark ? AppColor.neutral10 : AppColor.neutral20), - ), - Text( - "Eng Mahmoud", - style: AppTextStyles.heading2.copyWith(color: context.isDark ? AppColor.neutral30 : AppColor.neutral50, fontWeight: FontWeight.w600), - ), - 24.height, - Row( + Column( + crossAxisAlignment: CrossAxisAlignment.start, + mainAxisSize: MainAxisSize.min, children: [ - DashboardPageIndicator(index: 0, currentPage: _currentPage, controller: _controller), - 3.width, - DashboardPageIndicator(index: 1, currentPage: _currentPage, controller: _controller), - 3.width, - DashboardPageIndicator(index: 2, currentPage: _currentPage, controller: _controller), - 10.width, Text( - "0$_currentPage/03", - style: Theme.of(context).textTheme.labelMedium?.copyWith(fontWeight: FontWeight.w500), + context.translation.welcome, + style: AppTextStyles.heading6.copyWith(color: context.isDark ? AppColor.neutral10 : AppColor.neutral20), + ), + Text( + "Eng Mahmoud", + style: AppTextStyles.heading2.copyWith(color: context.isDark ? AppColor.neutral30 : AppColor.neutral50, fontWeight: FontWeight.w600), + ), + 24.height, + Row( + children: [ + DashboardPageIndicator(index: 0, currentPage: _currentPage, controller: _controller), + 3.width, + DashboardPageIndicator(index: 1, currentPage: _currentPage, controller: _controller), + 3.width, + DashboardPageIndicator(index: 2, currentPage: _currentPage, controller: _controller), + 10.width, + Text( + "0$_currentPage/03", + style: Theme.of(context).textTheme.labelMedium?.copyWith(fontWeight: FontWeight.w500), + ), + ], ), ], - ), - 8.height, + ).paddingOnly(start: 16, end: 16, top: 8, bottom: 8), Expanded( child: PageView( controller: _controller, - children: const [ - Center( - child: Text('First Page'), - ), - Center( - child: Text('Second Page'), - ), - Center( - child: Text('Third Page'), - ), + children: [ + RequestsFragment(), + ProgressFragment(), + RecentActivitiesFragment(), ], ), ), ], - ).paddingAll(16), + ), ); } } diff --git a/lib/views/pages/user/notifications/notifications_list.dart b/lib/views/pages/user/notifications/notifications_list.dart index 22296c0d..8f9ea2be 100644 --- a/lib/views/pages/user/notifications/notifications_list.dart +++ b/lib/views/pages/user/notifications/notifications_list.dart @@ -1,5 +1,6 @@ import 'package:flutter/material.dart'; import 'package:test_sa/extensions/context_extension.dart'; +import 'package:test_sa/extensions/int_extensions.dart'; import 'package:test_sa/extensions/widget_extensions.dart'; import 'package:test_sa/models/system_notification_model.dart'; import 'package:test_sa/views/widgets/loaders/lazy_loading.dart'; @@ -22,28 +23,40 @@ class NotificationsList extends StatelessWidget { nextPage: nextPage, onLazyLoad: onLazyLoad, child: SingleChildScrollView( - child: Card( - child: ListView.builder( + padding: const EdgeInsets.all(16), + child: Container( + decoration: ShapeDecoration( + color: Colors.white, + shape: RoundedRectangleBorder( + borderRadius: BorderRadius.circular(20), + ), + shadows: const [ + BoxShadow( + color: Color(0x07000000), + blurRadius: 14, + offset: Offset(0, 0), + spreadRadius: 0, + ) + ], + ), + child: ListView.separated( + shrinkWrap: true, physics: const NeverScrollableScrollPhysics(), + padding: const EdgeInsets.all(16), itemCount: notifications.length, - shrinkWrap: true, + separatorBuilder: (context, itemIndex) => 1.divider.paddingOnly(top: 16, bottom: 16), itemBuilder: (context, itemIndex) { - return Column( - children: [ - NotificationItem( - notification: notifications[itemIndex], - onPressed: (notification) { - // todo @sikander, check notifications payload, because notification model is different to need to check from backend - //Navigator.of(context).pushNamed(FutureRequestServiceDetails.id, arguments: notification.requestId); - }, - ), - if (itemIndex != (notifications.length - 1)) const Divider().defaultStyle(context).paddingOnly(start: 16, end: 16), - ], + return NotificationItem( + notification: notifications[itemIndex], + onPressed: (notification) { + // todo @sikander, check notifications payload, because notification model is different to need to check from backend + //Navigator.of(context).pushNamed(FutureRequestServiceDetails.id, arguments: notification.requestId); + }, ); }, ), ), - ).paddingAll(16), + ), ); } } diff --git a/lib/views/widgets/notifications/notification_item.dart b/lib/views/widgets/notifications/notification_item.dart index 5e0b7a81..8940ee13 100644 --- a/lib/views/widgets/notifications/notification_item.dart +++ b/lib/views/widgets/notifications/notification_item.dart @@ -4,6 +4,7 @@ import 'package:test_sa/extensions/string_extensions.dart'; import 'package:test_sa/extensions/text_extensions.dart'; import 'package:test_sa/extensions/widget_extensions.dart'; import 'package:test_sa/models/system_notification_model.dart'; +import 'package:test_sa/new_views/app_style/app_color.dart'; class NotificationItem extends StatelessWidget { final SystemNotificationModel notification; @@ -19,22 +20,25 @@ class NotificationItem extends StatelessWidget { Row( crossAxisAlignment: CrossAxisAlignment.start, children: [ - Expanded( - child: Column( - crossAxisAlignment: CrossAxisAlignment.start, - children: [ - (notification.title ?? "No Hospital Found").heading6(context), - 8.height, - (notification.text ?? "complaint not available").bodyText2(context), - ], - ), + Text( + notification.title ?? "", + style: AppTextStyles.heading6.copyWith(color: AppColor.neutral50), + ).expanded, + 8.width, + Text( + notification.createdOn.toServiceRequestCardFormat ?? "", + textAlign: TextAlign.right, + style: AppTextStyles.tinyFont.copyWith(color: AppColor.neutral50), ), - (notification.createdOn.toServiceRequestCardFormat ?? "complaint not available").tinyFont(context), ], - ).onPress(() { - onPressed(notification); - }), + ), + Text( + notification.text ?? "", + style: AppTextStyles.bodyText2.copyWith(color: Color(0xFF757575)), + ), ], - ).paddingAll(16); + ).onPress(() { + onPressed(notification); + }); } }