From 675572be40792a5ef0fe7c2d8dc2442a24f875ca Mon Sep 17 00:00:00 2001 From: zaid_daoud Date: Mon, 6 Nov 2023 10:44:24 +0300 Subject: [PATCH] Profile Screen DONE --- lib/main.dart | 2 + lib/new_views/common_widgets/app_drawer.dart | 26 +- lib/views/pages/user/profile_page.dart | 369 +++++++++++-------- 3 files changed, 222 insertions(+), 175 deletions(-) diff --git a/lib/main.dart b/lib/main.dart index d9beaed7..fedc3b13 100644 --- a/lib/main.dart +++ b/lib/main.dart @@ -74,6 +74,7 @@ import 'package:test_sa/views/pages/user/gas_refill/request_gas_refill.dart'; import 'package:test_sa/views/pages/user/gas_refill/track_gas_refill.dart'; import 'package:test_sa/views/pages/user/land_page.dart' as old; import 'package:test_sa/views/pages/user/notifications/notifications_page.dart'; +import 'package:test_sa/views/pages/user/profile_page.dart'; import 'package:test_sa/views/pages/user/report_issues_page.dart'; import 'package:test_sa/views/pages/user/requests/create_service_request_page.dart'; import 'package:test_sa/views/pages/user/requests/future_request_service_details.dart'; @@ -227,6 +228,7 @@ class MyApp extends StatelessWidget { WorkOrderDetailsPage.id: (_) => const WorkOrderDetailsPage(), UpdateServiceRequestPage.id: (_) => const UpdateServiceRequestPage(), SettingsPage.id: (_) => const SettingsPage(), + ProfilePage.id: (_) => const ProfilePage(), }, ), ), diff --git a/lib/new_views/common_widgets/app_drawer.dart b/lib/new_views/common_widgets/app_drawer.dart index 22da115c..986e5be4 100644 --- a/lib/new_views/common_widgets/app_drawer.dart +++ b/lib/new_views/common_widgets/app_drawer.dart @@ -12,6 +12,7 @@ import 'package:test_sa/views/pages/user/notifications/notifications_page.dart'; import '../../controllers/providers/api/user_provider.dart'; import '../../controllers/providers/settings/setting_provider.dart'; +import '../../views/pages/user/profile_page.dart'; import '../../views/widgets/dialogs/dialog.dart'; import '../pages/settings_page.dart'; @@ -35,29 +36,24 @@ class AppDrawer extends StatelessWidget { Container( width: 90, height: 90, - decoration: const ShapeDecoration( + decoration: ShapeDecoration( image: DecorationImage( image: NetworkImage( - "https://www.shutterstock.com/shutterstock/photos/1714666150/display_1500/stock-photo-head-shot-portrait-close-up-smiling-confident-businessman-wearing-glasses-looking-at-camera-1714666150.jpg"), + (userProvider.user?.profilePhotoName?.isNotEmpty) ?? false + ? userProvider.user.profilePhotoName + : "https://www.shutterstock.com/shutterstock/photos/1714666150/display_1500/stock-photo-head-shot-portrait-close-up-smiling-confident-businessman-wearing-glasses-looking-at-camera-1714666150.jpg", + ), fit: BoxFit.cover, ), - shape: OvalBorder( - side: BorderSide(width: 1, color: Color(0xFFE4E5E6)), - ), + shape: const OvalBorder(side: BorderSide(width: 1, color: Color(0xFFE4E5E6))), ), - ), - Icon(Icons.clear).onPress(() => Navigator.of(context).pop()) + ).onPress(() => Navigator.of(context).pushNamed(ProfilePage.id)), + const Icon(Icons.clear).onPress(() => Navigator.of(context).pop()) ], ), 8.height, - Text( - "Eng Mahmoud", - style: AppTextStyles.heading2.copyWith(color: context.isDark ? AppColor.neutral30 : AppColor.neutral50, fontWeight: FontWeight.w600, letterSpacing: -0.12), - ), - Text( - "context.welcome@gmail.com", - style: AppTextStyles.heading6.copyWith(color: context.isDark ? AppColor.neutral10 : AppColor.neutral20), - ), + (userProvider.user?.username ?? "Eng Mahmoud").heading3(context).custom(fontWeight: FontWeight.w600), + (userProvider.user?.email ?? "context.welcome@gmail.com").heading6(context).custom(color: context.isDark ? AppColor.neutral10 : AppColor.neutral20), 18.height, 1.divider, ListView( diff --git a/lib/views/pages/user/profile_page.dart b/lib/views/pages/user/profile_page.dart index 456a703c..90fbabfb 100644 --- a/lib/views/pages/user/profile_page.dart +++ b/lib/views/pages/user/profile_page.dart @@ -1,23 +1,21 @@ import 'package:flutter/material.dart'; import 'package:provider/provider.dart'; -import 'package:test_sa/controllers/localization/localization.dart'; import 'package:test_sa/controllers/providers/api/user_provider.dart'; import 'package:test_sa/controllers/providers/settings/setting_provider.dart'; -import 'package:test_sa/controllers/validator/validator.dart'; import 'package:test_sa/extensions/context_extension.dart'; -import 'package:test_sa/models/hospital.dart'; -import 'package:test_sa/models/subtitle.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/models/user.dart'; -import 'package:test_sa/views/app_style/colors.dart'; -import 'package:test_sa/views/app_style/sizing.dart'; -import 'package:test_sa/views/widgets/app_text_form_field.dart'; -import 'package:test_sa/views/widgets/buttons/app_back_button.dart'; -import 'package:test_sa/views/widgets/buttons/app_button.dart'; -import 'package:test_sa/views/widgets/hospitals/hospital_button.dart'; +import 'package:test_sa/new_views/common_widgets/default_app_bar.dart'; import 'package:test_sa/views/widgets/loaders/loading_manager.dart'; +import '../../../new_views/app_style/app_color.dart'; + class ProfilePage extends StatefulWidget { - static final String id = "/user/profile"; + static const String id = "/user/profile"; + + const ProfilePage({Key key}) : super(key: key); @override _ProfilePageState createState() => _ProfilePageState(); @@ -46,166 +44,217 @@ class _ProfilePageState extends State { } return Scaffold( key: _scaffoldKey, + appBar: const DefaultAppBar(title: "My Profile"), body: LoadingManager( isLoading: _userProvider.isLoading, isFailedLoading: false, stateCode: 200, onRefresh: () async {}, child: SafeArea( - child: Stack( - children: [ - Form( - key: _formKey, - child: ListView( - children: [ - //AppNameBar(), - Hero( - tag: "logo", - child: Image( - height: _height / 4, - image: AssetImage("assets/images/logo.png"), - ), - ), - Container( - padding: EdgeInsets.symmetric(horizontal: 16, vertical: 16), - margin: EdgeInsets.symmetric(horizontal: 16), - decoration: BoxDecoration(color: AColors.primaryColor, borderRadius: BorderRadius.circular(AppStyle.getBorderRadius(context)), boxShadow: [ - BoxShadow( - color: AColors.grey, - offset: Offset(0, -1), - ) - ]), - child: Column( - children: [ - ATextFormField( - initialValue: _user.userName, - hintText: context.translation.name, - enable: false, - prefixIconData: Icons.account_circle, - style: Theme.of(context).textTheme.headline6, - validator: (value) => Validator.hasValue(value) ? null : context.translation.nameValidateMessage, - onSaved: (value) { - _user.userName = value; - }, - ), - SizedBox( - height: 8, - ), - ATextFormField( - initialValue: _user.email, - hintText: context.translation.email, - enable: false, - prefixIconData: Icons.email, - textInputType: TextInputType.emailAddress, - style: Theme.of(context).textTheme.headline6, - validator: (value) => Validator.isEmail(value) ? null : context.translation.emailValidateMessage, - onSaved: (value) { - _user.email = value; - }, - ), - SizedBox( - height: 8, - ), - AbsorbPointer( - child: HospitalButton( - hospital: Hospital(name: _user.clientName, id: _user.clientId), - onHospitalPick: (hospital) { - _user.clientName = hospital.name; - _user.clientId = hospital.id; - setState(() {}); - }, + child: Card( + child: Column( + mainAxisSize: MainAxisSize.min, + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + SizedBox( + width: double.infinity, + child: Column( + children: [ + Container( + width: 90, + height: 90, + decoration: ShapeDecoration( + image: DecorationImage( + image: NetworkImage( + (_user.profilePhotoName?.isNotEmpty ?? false) + ? _user.profilePhotoName + : "https://www.shutterstock.com/shutterstock/photos/1714666150/display_1500/stock-photo-head-shot-portrait-close-up-smiling-confident-businessman-wearing-glasses-looking-at-camera-1714666150.jpg", ), + fit: BoxFit.cover, ), - SizedBox( - height: 8, - ), - // DepartmentButton( - // department: Department(name: _user.departmentName, id: _user.departmentId), - // onDepartmentPick: (department) { - // _user.departmentName = department.name; - // _user.departmentId = department.id; - // setState(() {}); - // }, - // ), - SizedBox( - height: 8, - ), - ATextFormField( - initialValue: _user.phoneNumber, - hintText: context.translation.phoneNumber, - style: Theme.of(context).textTheme.headline6, - prefixIconData: Icons.phone_android, - validator: (value) => Validator.isPhoneNumber(value) ? null : context.translation.phoneNumberValidateMessage, - textInputType: TextInputType.phone, - onSaved: (value) { - _user.phoneNumber = value; - }, - ), - SizedBox( - height: 8, - ), - // ATextFormField( - // initialValue: _user.whatsApp, - // hintText: context.translation.whatsApp, - // style: Theme.of(context).textTheme.headline6, - // prefixIconData: FontAwesomeIcons.whatsapp, - // prefixIconSize: 36, - // validator: (value) => - // Validator.isPhoneNumber(value) ? null : context.translation.phoneNumberValidateMessage, - // textInputType: TextInputType.phone, - // onSaved: (value){ - // _user.whatsApp = value; - // }, - // ), - ], - ), - ), - SizedBox( - height: 16, - ), - Center( - child: SizedBox( - height: _width / 8, - width: _width / 1.2, - child: AButton( - text: context.translation.update, - onPressed: () async { - // if (!_formKey.currentState.validate()) return; - // _formKey.currentState.save(); - // if (_user.departmentId == null) { - // ScaffoldMessenger.of(context).showSnackBar(SnackBar( - // content: Text(context.translation.unitRequired), - // )); - // return; - // } - // int status = await _userProvider.updateProfile( - // user: _user, - // host: _settingProvider.host, - // ); - // if (status >= 200 && status < 300) { - // _settingProvider.setUser(_userProvider.user); - // ScaffoldMessenger.of(context).showSnackBar(SnackBar( - // content: Text(context.translation.requestCompleteSuccessfully), - // )); - // } else { - // String errorMessage = HttpStatusManger.getStatusMessage(status: status, subtitle: context.translation); - // ScaffoldMessenger.of(context).showSnackBar(SnackBar( - // content: Text(errorMessage), - // )); - // } - }, + shape: const OvalBorder(side: BorderSide(width: 1, color: Color(0xFFE4E5E6))), ), ), - ), - SizedBox( - height: 32, - ), - ], + (_user.username ?? "Eng Mahmoud").heading3(context).custom(fontWeight: FontWeight.w600), + (_user.email ?? "context.welcome@gmail.com").heading6(context).custom(color: context.isDark ? AppColor.neutral10 : AppColor.neutral20), + ], + ), + ), + 24.height, + const Divider().defaultStyle(context), + 8.height, + (_user.phoneNumber ?? "+966 433 443 344").heading5(context), + 8.height, + const Divider().defaultStyle(context), + 8.height, + ("Ext: ${"2212"}").heading5(context), + 8.height, + if ((_user.departmentName?.length ?? 0) > 0) const Divider().defaultStyle(context), + ListView.builder( + physics: const NeverScrollableScrollPhysics(), + itemCount: _user.departmentName?.length ?? 0, + shrinkWrap: true, + itemBuilder: (context, index) { + return (_user.departmentName[index] ?? "N/A").heading5(context).paddingOnly(top: 8, bottom: 8); + }, ), - ), - ABackButton(), - ], - ), + ], + ).paddingAll(16), + ).paddingAll(16), + // child: Stack( + // children: [ + // Form( + // key: _formKey, + // child: ListView( + // children: [ + // //AppNameBar(), + // Hero( + // tag: "logo", + // child: Image( + // height: _height / 4, + // image: AssetImage("assets/images/logo.png"), + // ), + // ), + // Container( + // padding: EdgeInsets.symmetric(horizontal: 16, vertical: 16), + // margin: EdgeInsets.symmetric(horizontal: 16), + // decoration: BoxDecoration(color: AColors.primaryColor, borderRadius: BorderRadius.circular(AppStyle.getBorderRadius(context)), boxShadow: [ + // BoxShadow( + // color: AColors.grey, + // offset: Offset(0, -1), + // ) + // ]), + // child: Column( + // children: [ + // ATextFormField( + // initialValue: _user.userName, + // hintText: context.translation.name, + // enable: false, + // prefixIconData: Icons.account_circle, + // style: Theme.of(context).textTheme.headline6, + // validator: (value) => Validator.hasValue(value) ? null : context.translation.nameValidateMessage, + // onSaved: (value) { + // _user.userName = value; + // }, + // ), + // SizedBox( + // height: 8, + // ), + // ATextFormField( + // initialValue: _user.email, + // hintText: context.translation.email, + // enable: false, + // prefixIconData: Icons.email, + // textInputType: TextInputType.emailAddress, + // style: Theme.of(context).textTheme.headline6, + // validator: (value) => Validator.isEmail(value) ? null : context.translation.emailValidateMessage, + // onSaved: (value) { + // _user.email = value; + // }, + // ), + // SizedBox( + // height: 8, + // ), + // AbsorbPointer( + // child: HospitalButton( + // hospital: Hospital(name: _user.clientName, id: _user.clientId), + // onHospitalPick: (hospital) { + // _user.clientName = hospital.name; + // _user.clientId = hospital.id; + // setState(() {}); + // }, + // ), + // ), + // SizedBox( + // height: 8, + // ), + // // DepartmentButton( + // // department: Department(name: _user.departmentName, id: _user.departmentId), + // // onDepartmentPick: (department) { + // // _user.departmentName = department.name; + // // _user.departmentId = department.id; + // // setState(() {}); + // // }, + // // ), + // SizedBox( + // height: 8, + // ), + // ATextFormField( + // initialValue: _user.phoneNumber, + // hintText: context.translation.phoneNumber, + // style: Theme.of(context).textTheme.headline6, + // prefixIconData: Icons.phone_android, + // validator: (value) => Validator.isPhoneNumber(value) ? null : context.translation.phoneNumberValidateMessage, + // textInputType: TextInputType.phone, + // onSaved: (value) { + // _user.phoneNumber = value; + // }, + // ), + // SizedBox( + // height: 8, + // ), + // // ATextFormField( + // // initialValue: _user.whatsApp, + // // hintText: context.translation.whatsApp, + // // style: Theme.of(context).textTheme.headline6, + // // prefixIconData: FontAwesomeIcons.whatsapp, + // // prefixIconSize: 36, + // // validator: (value) => + // // Validator.isPhoneNumber(value) ? null : context.translation.phoneNumberValidateMessage, + // // textInputType: TextInputType.phone, + // // onSaved: (value){ + // // _user.whatsApp = value; + // // }, + // // ), + // ], + // ), + // ), + // SizedBox( + // height: 16, + // ), + // Center( + // child: SizedBox( + // height: _width / 8, + // width: _width / 1.2, + // child: AButton( + // text: context.translation.update, + // onPressed: () async { + // // if (!_formKey.currentState.validate()) return; + // // _formKey.currentState.save(); + // // if (_user.departmentId == null) { + // // ScaffoldMessenger.of(context).showSnackBar(SnackBar( + // // content: Text(context.translation.unitRequired), + // // )); + // // return; + // // } + // // int status = await _userProvider.updateProfile( + // // user: _user, + // // host: _settingProvider.host, + // // ); + // // if (status >= 200 && status < 300) { + // // _settingProvider.setUser(_userProvider.user); + // // ScaffoldMessenger.of(context).showSnackBar(SnackBar( + // // content: Text(context.translation.requestCompleteSuccessfully), + // // )); + // // } else { + // // String errorMessage = HttpStatusManger.getStatusMessage(status: status, subtitle: context.translation); + // // ScaffoldMessenger.of(context).showSnackBar(SnackBar( + // // content: Text(errorMessage), + // // )); + // // } + // }, + // ), + // ), + // ), + // SizedBox( + // height: 32, + // ), + // ], + // ), + // ), + // ABackButton(), + // ], + // ), ), ), );