You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
cloudsolutions-atoms/lib/views/pages/user/profile_page.dart

496 lines
23 KiB
Dart

import 'dart:io';
import 'package:flutter/material.dart';
import 'package:image_cropper/image_cropper.dart';
import 'package:image_picker/image_picker.dart';
import 'package:intl/intl.dart';
import 'package:provider/provider.dart';
import 'package:table_calendar/table_calendar.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/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/string_extensions.dart';
import 'package:test_sa/extensions/widget_extensions.dart';
import 'package:test_sa/models/user.dart';
import 'package:test_sa/models/user_rota_model.dart';
import 'package:test_sa/modules/cm_module/views/components/action_button/footer_action_button.dart';
import 'package:test_sa/new_views/common_widgets/app_dashed_button.dart';
import 'package:test_sa/new_views/common_widgets/app_filled_button.dart';
import 'package:test_sa/new_views/common_widgets/default_app_bar.dart';
import 'package:test_sa/views/pages/user/update_user_contact_info_bottomsheet.dart';
import '../../../new_views/app_style/app_color.dart';
class ProfilePage extends StatefulWidget {
static const String id = "/user/profile";
const ProfilePage({Key? key}) : super(key: key);
@override
_ProfilePageState createState() => _ProfilePageState();
}
class _ProfilePageState extends State<ProfilePage> {
late UserProvider _userProvider;
late DateTime _initialDate, _firstDate, _lastDate;
User _user = User();
bool _firstTime = true;
final GlobalKey<FormState> _formKey = GlobalKey<FormState>();
final GlobalKey<ScaffoldState> _scaffoldKey = GlobalKey<ScaffoldState>();
bool isTodayRota = true;
@override
void initState() {
super.initState();
_initialDate = DateTime.now();
_firstDate = DateTime.utc(2010, 10, 16);
_lastDate = DateTime.utc(2030, 3, 14);
}
@override
Widget build(BuildContext context) {
_userProvider = Provider.of<UserProvider>(context);
// _settingProvider = Provider.of<SettingProvider>(context);
// _width = MediaQuery.of(context).size.width;
// _height = MediaQuery.of(context).size.height;
if (_firstTime) {
_user = User.fromJsonCons(_userProvider.user!.toJson());
_firstTime = false;
}
Color color = context.isDark ? AppColor.neutral10 : AppColor.neutral50;
return Scaffold(
key: _scaffoldKey,
appBar: DefaultAppBar(title: context.translation.myProfile),
body: Column(
children: [
ListView(
padding: const EdgeInsets.all(16),
children: [
Column(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
SizedBox(
width: double.infinity,
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
Consumer<UserProvider>(builder: (context, snapshot, _) {
return Stack(
alignment: Alignment.bottomRight,
children: [
CircleAvatar(
radius: 45,
backgroundColor: const Color(0xFFE4E5E6),
child: Padding(
padding: const EdgeInsets.all(1), // Border radius
child: ClipOval(
child: snapshot.profileImage != null
? Image.file(snapshot.profileImage!)
: (snapshot.user!.profilePhotoName?.isNotEmpty ?? false)
? Image.network(snapshot.user!.profilePhotoName!)
: const Icon(
Icons.person,
size: 50,
color: Colors.white,
),
),
),
),
// CircleAvatar(
// radius: 14,
// backgroundColor: AppColor.primary70,
// child: Padding(
// padding: const EdgeInsets.all(1), // Border radius
// child: snapshot.isLoading
// ? const SizedBox(height: 16, width: 16, child: CircularProgressIndicator(color: Colors.white, strokeWidth: 2))
// : const Icon(Icons.upload, size: 16, color: Colors.white),
// ),
// ).onPress(snapshot.isLoading
// ? null
// : () async {
// final pickedFile = await ImagePicker().pickImage(source: ImageSource.gallery, imageQuality: 70, maxWidth: 800, maxHeight: 800);
//
// if (pickedFile != null) {
// CroppedFile? croppedFile = await ImageCropper().cropImage(
// sourcePath: pickedFile.path,
// aspectRatio: CropAspectRatio(ratioX: 1, ratioY: 1),
// uiSettings: [
// AndroidUiSettings(
// toolbarTitle: 'ATOMS',
// toolbarColor: Colors.white,
// toolbarWidgetColor: color,
// initAspectRatio: CropAspectRatioPreset.square,
// lockAspectRatio: false,
// ),
// IOSUiSettings(title: 'ATOMS'),
// ],
// );
// if (croppedFile != null) {
// await snapshot.uploadProfileImage(_user.userID!, File(croppedFile.path));
// Provider.of<SettingProvider>(context, listen: false).setUser(_userProvider.user!);
// }
// }
// }),
],
);
}),
8.height,
(_user.username ?? "").heading3(context).custom(fontWeight: FontWeight.w600, color: context.isDark ? AppColor.neutral10 : AppColor.neutral50),
],
),
),
16.height,
Text(
'${context.translation.email}: ${_user.email ?? "-"}',
style: AppTextStyles.bodyText.copyWith(color: context.isDark ? AppColor.neutral10 : AppColor.neutral120),
),
Text(
'${context.translation.phoneNumber}: ${_user.phoneNumber ?? "-"}',
style: AppTextStyles.bodyText.copyWith(color: context.isDark ? AppColor.neutral10 : AppColor.neutral120),
),
Text(
'${context.translation.extensionNo}: ${_user.extensionNo ?? "-"}',
style: AppTextStyles.bodyText.copyWith(color: context.isDark ? AppColor.neutral10 : AppColor.neutral120),
),
// if ((_user.phoneNumber ?? "").isNotEmpty) ...[
// const Divider().defaultStyle(context),
// 8.height,
// (_user.phoneNumber??"").heading5(context),
// 8.height,
// ],
// if ((_user.extensionNo ?? "").isNotEmpty) ...[
// const Divider().defaultStyle(context),
// 8.height,
// _user.extensionNo!.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,
padding: EdgeInsets.zero,
itemBuilder: (context, index) {
return Text(
_user.departmentName![index] ?? "N/A",
style: AppTextStyles.bodyText.copyWith(color: context.isDark ? AppColor.neutral10 : AppColor.neutral120),
).paddingOnly(top: 2, bottom: 2);
},
),
if ((_user.clientName ?? "").isNotEmpty) ...[
const Divider().defaultStyle(context),
8.height,
_user.clientName!.heading5(context).custom(color: context.isDark ? AppColor.neutral10 : AppColor.neutral50),
8.height,
],
Selector<UserProvider, bool>(
selector: (_, myModel) => myModel.isLoading, // Selects only the userName
builder: (_, isLoading, __) {
return AppDashedButton(
title: isLoading ? "Uploading..." : "Update Image",
height: 50,
width: MediaQuery.sizeOf(context).width / 2,
padding: EdgeInsets.all(4),
icon: isLoading
? const SizedBox(height: 16, width: 16, child: CircularProgressIndicator(color: AppColor.primary10, strokeWidth: 2))
: 'attachment_icon'.toSvgAsset(height: 24, width: 24),
buttonColor: AppColor.primary10,
onPressed: () async {
if (isLoading) return;
final pickedFile = await ImagePicker().pickImage(source: ImageSource.gallery, imageQuality: 70, maxWidth: 800, maxHeight: 800);
if (pickedFile != null) {
CroppedFile? croppedFile = await ImageCropper().cropImage(
sourcePath: pickedFile.path,
aspectRatio: CropAspectRatio(ratioX: 1, ratioY: 1),
uiSettings: [
AndroidUiSettings(
toolbarTitle: 'ATOMS',
toolbarColor: Colors.white,
toolbarWidgetColor: color,
initAspectRatio: CropAspectRatioPreset.square,
lockAspectRatio: false,
),
IOSUiSettings(title: 'ATOMS'),
],
);
if (croppedFile != null) {
await context.userProvider.uploadProfileImage(_user.userID!, File(croppedFile.path));
Provider.of<SettingProvider>(context, listen: false).setUser(_userProvider.user!);
}
}
},
).center;
})
],
).toShadowContainer(context),
if (context.settingProvider.isUserFlowMedical)
Container(
margin: const EdgeInsets.only(top: 16),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text(
"Rota Details",
style: AppTextStyles.heading6.copyWith(color: context.isDark ? AppColor.neutral30 : AppColor.black10),
),
8.width,
Container(
padding: const EdgeInsets.all(8),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(8),
color: AppColor.primary10,
),
child: Text(
isTodayRota ? "Monthly " : "Today",
style: AppTextStyles.bodyText2.copyWith(color: Colors.white),
),
).onPress(() => setState(() {
_initialDate = DateTime.now();
isTodayRota = !isTodayRota;
})),
],
),
(isTodayRota ? todayRotaWidget() : monthRotaWidget())
],
).toShadowContainer(context),
),
],
).expanded,
FooterActionButton.footerContainer(
context: context,
child: AppFilledButton(
label: "Update Information",
buttonColor: context.isDark ? AppColor.primary10 : AppColor.neutral50,
onPressed: () {
context.showBottomSheet(
UpdateUserContactInfoBottomSheet(
_userProvider.user!.userID!,
uEmail: _user.email,
uPhoneNo: _user.phoneNumber,
uExtensionNo: _user.extensionNo,
onUpdate: (email, phoneNo, extensionNo) {
_userProvider.user!.email = email;
_userProvider.user!.phoneNumber = phoneNo;
_userProvider.user!.extensionNo = extensionNo;
_firstTime = true;
Provider.of<SettingProvider>(context, listen: false).setUser(_userProvider.user!);
},
),
title: "Update Information");
},
),
)
],
),
);
}
Widget todayRotaWidget() {
final DateFormat fmt = DateFormat('MM-dd-yyyy');
final String startStr = fmt.format(_initialDate);
return FutureBuilder<UserRotaModel?>(
future: _userProvider.getUserTodayRota(startStr, startStr),
builder: (context, snapshot) {
bool isLoading = snapshot.connectionState == ConnectionState.waiting;
if ((!isLoading && (snapshot.hasError || !snapshot.hasData))) {
return const SizedBox();
}
return rotaDetailsWidget(isLoading, snapshot.data);
},
);
}
Widget monthRotaWidget() {
final DateTime startOfMonth = DateTime(_initialDate.year, _initialDate.month, 1);
final DateTime endOfMonth = DateTime(_initialDate.year, _initialDate.month + 1, 0);
final DateFormat fmt = DateFormat('MM-dd-yyyy');
final String startStr = fmt.format(startOfMonth);
final String endStr = fmt.format(endOfMonth);
return FutureBuilder<List<UserRotaModel>>(
future: _userProvider.getUserMonthlyRota(startStr, endStr),
builder: (context, snapshot) {
bool isLoading = snapshot.connectionState == ConnectionState.waiting;
if ((!isLoading && (snapshot.hasError || !snapshot.hasData))) {
return const SizedBox();
}
return TableCalendar(
firstDay: _firstDate,
lastDay: _lastDate,
focusedDay: _initialDate,
calendarFormat: CalendarFormat.month,
weekendDays: const [],
rowHeight: 45,
pageJumpingEnabled: true,
pageAnimationEnabled: true,
availableGestures: AvailableGestures.none,
onPageChanged: (dateTime) {
_initialDate = dateTime;
setState(() {});
},
onDaySelected: (selectedDate, focusDate) {
final List<UserRotaModel> matches = snapshot.data?.where((e) {
final dt = DateTime.tryParse(e.scheduleDate ?? '');
return dt != null && isSameDay(dt, selectedDate);
}).toList() ??
[];
final UserRotaModel? rota = matches.isNotEmpty ? matches.first : null;
if (rota == null) {
"No details found".showToast;
return;
}
context.showBottomSheet(rotaDetailsWidget(isLoading, rota), title: "Rota Details".addTranslation);
},
calendarBuilders: CalendarBuilders(
markerBuilder: (context, date, eventsOnDay) {
if (isLoading) return null;
final List<UserRotaModel> matches = snapshot.data?.where((e) {
final dt = DateTime.tryParse(e.scheduleDate ?? '');
return dt != null && isSameDay(dt, date);
}).toList() ??
[];
final UserRotaModel? rota = matches.isNotEmpty ? matches.first : null;
if (rota == null) return null;
return Container(
width: 6,
height: 6,
margin: const EdgeInsets.symmetric(horizontal: 1, vertical: 4),
decoration: BoxDecoration(
color: rota.leaveTypeCode == "ANNUAL"
? AppColor.red30
: rota.leaveTypeCode == "HOLIDAY"
? AppColor.green15
: AppColor.primary10,
shape: BoxShape.circle),
);
},
dowBuilder: (context, dateTime) {
final day = DateFormat("EE", context.isAr ? "ar" : "en").format(dateTime).toUpperCase();
return Align(alignment: Alignment.center, child: day.bodyText(context).custom(color: context.isDark ? AppColor.neutral10 : AppColor.neutral50));
},
defaultBuilder: (_cxt, dateTime, _) {
final day = DateFormat("d").format(dateTime);
if (isLoading) {
return const SizedBox(height: 36, width: 36).toShimmer(isShow: isLoading, context: _cxt);
} else {
null;
}
},
),
// eventLoader: (day) {
// print("eventLoader:$day");
// return [];
// },
daysOfWeekHeight: 35.toScreenHeight,
headerStyle: HeaderStyle(
leftChevronVisible: true,
rightChevronVisible: true,
formatButtonVisible: false,
titleCentered: true,
titleTextStyle: AppTextStyles.bodyText,
headerPadding: const EdgeInsets.all(0),
),
calendarStyle: CalendarStyle(
isTodayHighlighted: false,
todayDecoration: const BoxDecoration(color: AppColor.primary10, shape: BoxShape.circle),
defaultTextStyle: AppTextStyles.bodyText,
defaultDecoration: BoxDecoration(shape: BoxShape.circle, color: context.isDark ? AppColor.neutral50 : AppColor.neutral30),
),
).paddingOnly(top: 16);
},
);
}
Widget rotaDetailsWidget(bool isLoading, UserRotaModel? userRota) {
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
// 16.height,
if (isLoading) ...[
Text(
'Shift Start Time Time',
style: AppTextStyles.bodyText.copyWith(color: context.isDarkNotListen ? AppColor.neutral10 : AppColor.neutral120),
).toShimmer(context: context, isShow: isLoading),
4.height,
Text(
'Shift Actual Actual Start Time',
style: AppTextStyles.bodyText.copyWith(color: context.isDarkNotListen ? AppColor.neutral10 : AppColor.neutral120),
).toShimmer(context: context, isShow: isLoading)
] else
Column(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisSize: MainAxisSize.min,
children: [
// Text(
// 'Site: ${_user.clientName ?? "-"}',
// style: AppTextStyles.bodyText.copyWith(color: context.isDark ? AppColor.neutral10 : AppColor.neutral120),
// ),
Text(
'Shift Name: ${userRota!.shiftName ?? "-"}',
style: AppTextStyles.bodyText.copyWith(color: context.isDarkNotListen ? AppColor.neutral10 : AppColor.neutral120),
),
Text(
'Break: ${userRota.breakTime ?? "-"}',
style: AppTextStyles.bodyText.copyWith(color: context.isDarkNotListen ? AppColor.neutral10 : AppColor.neutral120),
),
if (userRota.leaveTypeCode?.isNotEmpty ?? false)
SizedBox(
width: double.infinity,
child: Column(children: [
8.height,
Text(
userRota.leaveTypeCode ?? "",
style: AppTextStyles.heading6.copyWith(color: context.isDarkNotListen ? AppColor.neutral10 : AppColor.neutral120, fontWeight: FontWeight.w600),
),
Text(
userRota.leaveDescription ?? "",
style: AppTextStyles.bodyText.copyWith(color: context.isDarkNotListen ? AppColor.neutral10 : AppColor.neutral120),
),
]),
)
else ...[
Text(
'Shift Start Time: ${userRota.shiftName?.split('-').first.trim() ?? "-"}',
style: AppTextStyles.bodyText.copyWith(color: context.isDarkNotListen ? AppColor.neutral10 : AppColor.neutral120),
),
Text(
'Shift End Time: ${userRota.shiftName?.split('-').last.trim() ?? "-"}',
style: AppTextStyles.bodyText.copyWith(color: context.isDarkNotListen ? AppColor.neutral10 : AppColor.neutral120),
),
const Divider().defaultStyle(context),
Text(
'Swipe In: ${userRota.shTActualStartTime?.toTime ?? "-"}',
style: AppTextStyles.bodyText.copyWith(color: context.isDarkNotListen ? AppColor.neutral10 : AppColor.neutral120),
),
Text(
'Swipe Out: ${userRota.shTActualEndTime?.toTime ?? "-"}',
style: AppTextStyles.bodyText.copyWith(color: context.isDarkNotListen ? AppColor.neutral10 : AppColor.neutral120),
),
],
],
),
],
);
}
}