profile improvements
Sikander Saleem
2 years ago
parent
11bd7a7085
commit
20f7d98ce5
@ -0,0 +1,131 @@
|
||||
import 'package:easy_localization/easy_localization.dart';
|
||||
import 'package:flutter/cupertino.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter_svg/flutter_svg.dart';
|
||||
import 'package:mohem_flutter_app/classes/colors.dart';
|
||||
import 'package:mohem_flutter_app/config/routes.dart';
|
||||
import 'package:mohem_flutter_app/extensions/int_extensions.dart';
|
||||
import 'package:mohem_flutter_app/extensions/string_extensions.dart';
|
||||
import 'package:mohem_flutter_app/extensions/widget_extensions.dart';
|
||||
import 'package:mohem_flutter_app/generated/locale_keys.g.dart';
|
||||
import 'package:mohem_flutter_app/models/dashboard/menu_entries.dart';
|
||||
import 'package:mohem_flutter_app/models/member_information_list_model.dart';
|
||||
import 'package:mohem_flutter_app/models/profile_menu.model.dart';
|
||||
|
||||
class ProfileInFo extends StatefulWidget {
|
||||
ProfileInFo(this.memberInfo);
|
||||
|
||||
MemberInformationListModel memberInfo;
|
||||
|
||||
@override
|
||||
State<ProfileInFo> createState() => _ProfileInFoState();
|
||||
}
|
||||
|
||||
class _ProfileInFoState extends State<ProfileInFo> {
|
||||
static List<GetMenuEntriesList> menuData = [];
|
||||
String data = '.';
|
||||
double sliderValue = 75;
|
||||
List<ProfileMenu> menu = [
|
||||
ProfileMenu(name: LocaleKeys.profile_personalInformation.tr(), icon: 'personal-info.svg', route: AppRoutes.personalInfo, dynamicUrl: '', menuEntries: getMenuEntries('')),
|
||||
ProfileMenu(name: LocaleKeys.profile_basicDetails.tr(), icon: 'basic-details.svg', route: AppRoutes.basicDetails, menuEntries: getMenuEntries('BASIC_DETAILS')),
|
||||
ProfileMenu(name: LocaleKeys.profile_contactDetails.tr(), icon: 'contact-details.svg', route: AppRoutes.contactDetails, dynamicUrl: '', menuEntries: getMenuEntries('ADDRESS')),
|
||||
ProfileMenu(name: LocaleKeys.profile_familyDetails.tr(), icon: 'family-members.svg', route: AppRoutes.familyMembers, dynamicUrl: '', menuEntries: getMenuEntries('CONTACT')),
|
||||
];
|
||||
|
||||
@override
|
||||
void setState(VoidCallback fn) {
|
||||
super.setState(fn);
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.center,
|
||||
children: [
|
||||
16.height,
|
||||
widget.memberInfo.eMPLOYEENAME!.toText22(),
|
||||
("${widget.memberInfo.eMPLOYEENUMBER!} | ${widget.memberInfo.jOBNAME!}").toText13(color: MyColors.grey80Color),
|
||||
widget.memberInfo.eMPLOYEEEMAILADDRESS!.toText13(),
|
||||
12.height,
|
||||
const Divider(height: 8, thickness: 8, color: MyColors.lightGreyEFColor),
|
||||
12.height,
|
||||
LocaleKeys.completingYear.tr().toText11(),
|
||||
Row(children: [
|
||||
appreciationTime(LocaleKeys.year.tr(), widget.memberInfo.sERVICEYEARS.toString()),
|
||||
appreciationTime(LocaleKeys.month.tr(), widget.memberInfo.sERVICEMONTHS.toString()),
|
||||
appreciationTime(LocaleKeys.day.tr(), widget.memberInfo.sERVICEDAYS.toString()),
|
||||
]).paddingOnly(bottom: 12, top: 12),
|
||||
const Divider(height: 8, thickness: 8, color: MyColors.lightGreyEFColor),
|
||||
Column(
|
||||
// mainAxisAlignment: MainAxisAlignment.start,
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
(LocaleKeys.profile_profileCompletionPer.tr() + ' 75%').toText16(),
|
||||
8.height,
|
||||
Row(
|
||||
children: [
|
||||
for (var i = 0; i < 4; i++)
|
||||
if (i < 3) Expanded(child: drawSlider(Color(0xff2BB8A6))) else Expanded(child: drawSlider(const Color(0xffefefef)))
|
||||
],
|
||||
),
|
||||
14.height,
|
||||
LocaleKeys.profile_completeProfile.tr().toText16(color: MyColors.textMixColor, isUnderLine: true),
|
||||
],
|
||||
).paddingOnly(left: 21, right: 21, bottom: 18, top: 12),
|
||||
const Divider(height: 8, thickness: 8, color: MyColors.lightGreyEFColor),
|
||||
ListView.separated(
|
||||
padding: EdgeInsets.zero,
|
||||
shrinkWrap: true,
|
||||
physics: const NeverScrollableScrollPhysics(),
|
||||
itemBuilder: (cxt, index) => Row(
|
||||
children: [
|
||||
SvgPicture.asset('assets/images/' + menu[index].icon, width: 20, height: 20),
|
||||
16.width,
|
||||
menu[index].name.toText16().expanded,
|
||||
16.width,
|
||||
const Icon(Icons.arrow_forward, color: MyColors.darkIconColor)
|
||||
],
|
||||
).onPress(() {
|
||||
Navigator.pushNamed(context, menu[index].route);
|
||||
}).paddingOnly(left: 21, right: 21, top: 21),
|
||||
separatorBuilder: (cxt, index) => 12.height,
|
||||
itemCount: menu.length),
|
||||
],
|
||||
);
|
||||
}
|
||||
|
||||
Widget drawSlider(color) {
|
||||
return Row(children: [
|
||||
Expanded(
|
||||
flex: 1,
|
||||
child: ClipRRect(
|
||||
borderRadius: BorderRadius.circular(10),
|
||||
child: Container(
|
||||
height: 6,
|
||||
width: 20,
|
||||
color: color,
|
||||
),
|
||||
)),
|
||||
Container(height: 6, width: 3, color: Colors.white),
|
||||
]);
|
||||
}
|
||||
|
||||
Widget appreciationTime(String title, String value) {
|
||||
return Column(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
title.toText13(color: MyColors.grey80Color),
|
||||
value.padLeft(2, '0').toText20(color: MyColors.textMixColor),
|
||||
],
|
||||
).expanded;
|
||||
}
|
||||
}
|
||||
|
||||
GetMenuEntriesList getMenuEntries(String type) {
|
||||
List<GetMenuEntriesList> data = _ProfileInFoState.menuData.where((GetMenuEntriesList test) => test.functionName == type).toList();
|
||||
if (data.isNotEmpty) {
|
||||
return data[0];
|
||||
} else {
|
||||
return GetMenuEntriesList();
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,49 @@
|
||||
import 'package:flutter/cupertino.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:mohem_flutter_app/classes/utils.dart';
|
||||
import 'package:mohem_flutter_app/models/member_information_list_model.dart';
|
||||
import 'package:mohem_flutter_app/ui/profile/widgets/profile_info.dart';
|
||||
|
||||
class ProfilePanel extends StatelessWidget {
|
||||
ProfilePanel(this.memberInformationList);
|
||||
|
||||
late MemberInformationListModel memberInformationList;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return SizedBox(
|
||||
height: MediaQuery.of(context).size.height,
|
||||
child: Stack(
|
||||
children: [
|
||||
Container(
|
||||
margin: const EdgeInsets.only(top: 32),
|
||||
padding: const EdgeInsets.only(top: 37),
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.white,
|
||||
// border: Border.all(color: MyColors.lightGreyEFColor, width: 1),
|
||||
borderRadius: const BorderRadius.only(
|
||||
topLeft: Radius.circular(25),
|
||||
topRight: Radius.circular(25),
|
||||
),
|
||||
boxShadow: [
|
||||
BoxShadow(
|
||||
color: const Color(0xff000000).withOpacity(.1),
|
||||
blurRadius: 26,
|
||||
offset: const Offset(0, -3),
|
||||
),
|
||||
],
|
||||
),
|
||||
child: ProfileInFo(memberInformationList),
|
||||
),
|
||||
Container(height: 68, alignment: Alignment.center, child: profileImage())
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget profileImage() => CircleAvatar(
|
||||
radius: 68,
|
||||
backgroundImage: MemoryImage(Utils.getPostBytes(memberInformationList.eMPLOYEEIMAGE)),
|
||||
backgroundColor: Colors.black,
|
||||
);
|
||||
}
|
||||
@ -1,160 +0,0 @@
|
||||
import 'package:flutter/cupertino.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter_svg/flutter_svg.dart';
|
||||
import 'package:mohem_flutter_app/config/routes.dart';
|
||||
import 'package:mohem_flutter_app/generated/locale_keys.g.dart';
|
||||
import 'package:mohem_flutter_app/models/dashboard/menu_entries.dart';
|
||||
import 'package:mohem_flutter_app/models/member_information_list_model.dart';
|
||||
import 'package:easy_localization/easy_localization.dart';
|
||||
import 'package:mohem_flutter_app/models/profile_menu.model.dart';
|
||||
import 'package:mohem_flutter_app/provider/dashboard_provider_model.dart';
|
||||
import 'package:mohem_flutter_app/ui/my_attendance/dynamic_screens/dynamic_input_screen.dart';
|
||||
import 'package:mohem_flutter_app/ui/my_attendance/dynamic_screens/dynamic_listview_screen.dart';
|
||||
import 'package:provider/provider.dart';
|
||||
|
||||
// todo '@sultan' kindly follow structure of code written. use extension methods for widgets, also format code
|
||||
|
||||
class ProfileInFo extends StatefulWidget {
|
||||
ProfileInFo(this.memberInfo);
|
||||
|
||||
MemberInformationListModel memberInfo;
|
||||
|
||||
@override
|
||||
State<ProfileInFo> createState() => _ProfileInFoState();
|
||||
}
|
||||
|
||||
class _ProfileInFoState extends State<ProfileInFo> {
|
||||
static List<GetMenuEntriesList> menuData = [];
|
||||
String data = '.';
|
||||
double sliderValue = 75;
|
||||
List<ProfileMenu> menu = [
|
||||
ProfileMenu(name: LocaleKeys.profile_personalInformation.tr(), icon: 'personal-info.svg', route: AppRoutes.personalInfo, dynamicUrl: '', menuEntries: getMenuEntries('')),
|
||||
ProfileMenu(name: LocaleKeys.profile_basicDetails.tr(), icon: 'basic-details.svg', route: AppRoutes.basicDetails, menuEntries: getMenuEntries('BASIC_DETAILS')),
|
||||
ProfileMenu(name: LocaleKeys.profile_contactDetails.tr(), icon: 'contact-details.svg', route: AppRoutes.contactDetails, dynamicUrl: '', menuEntries: getMenuEntries('ADDRESS')),
|
||||
ProfileMenu(name: LocaleKeys.profile_familyDetails.tr(), icon: 'family-members.svg', route: AppRoutes.familyMembers, dynamicUrl: '', menuEntries: getMenuEntries('CONTACT')),
|
||||
];
|
||||
|
||||
@override
|
||||
void setState(VoidCallback fn) {
|
||||
super.setState(fn);
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Container(
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.center,
|
||||
children: [
|
||||
/// card header
|
||||
customLabel(widget.memberInfo.eMPLOYEENAME.toString(), 22, Colors.black, true),
|
||||
|
||||
customLabel(widget.memberInfo.eMPLOYEENUMBER.toString() + ' | ' + widget.memberInfo.jOBNAME.toString(), 14, Colors.grey, false),
|
||||
|
||||
customLabel(widget.memberInfo.eMPLOYEEEMAILADDRESS.toString(), 13, Colors.black, true),
|
||||
|
||||
Divider(height: 40, thickness: 8, color: const Color(0xffefefef)),
|
||||
|
||||
customLabel(LocaleKeys.completingYear.tr(), 10, Colors.black, true),
|
||||
|
||||
SizedBox(height: 10),
|
||||
Container(
|
||||
child: Row(mainAxisAlignment: MainAxisAlignment.spaceAround, crossAxisAlignment: CrossAxisAlignment.center, children: [
|
||||
Column(
|
||||
children: [customLabel(LocaleKeys.year.tr(), 14, const Color(0xff808080), true), customLabel(widget.memberInfo.sERVICEYEARS.toString().padLeft(2, '0'), 22, Color(0xff2BB8A6), true)],
|
||||
),
|
||||
Column(
|
||||
children: [customLabel(LocaleKeys.month.tr(), 14, const Color(0xff808080), true), customLabel(widget.memberInfo.sERVICEMONTHS.toString().padLeft(2, '0'), 22, Color(0xff2BB8A6), true)],
|
||||
),
|
||||
Column(
|
||||
children: [customLabel(LocaleKeys.day.tr(), 14, const Color(0xff808080), true), customLabel(widget.memberInfo.sERVICEDAYS.toString().padLeft(2, '0'), 22, Color(0xff2BB8A6), true)],
|
||||
)
|
||||
])),
|
||||
|
||||
Divider(height: 40, thickness: 8, color: const Color(0xffefefef)),
|
||||
Container(
|
||||
padding: EdgeInsets.only(
|
||||
left: 20,
|
||||
right: 20,
|
||||
),
|
||||
child: Column(
|
||||
mainAxisAlignment: MainAxisAlignment.start,
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
customLabel(LocaleKeys.profile_profileCompletionPer.tr() + ' 75%', 18, Colors.black, true),
|
||||
const SizedBox(height: 10),
|
||||
Row(
|
||||
children: [
|
||||
for (var i = 0; i < 4; i++)
|
||||
if (i < 3) Expanded(child: drawSlider(Color(0xff2BB8A6))) else Expanded(child: drawSlider(const Color(0xffefefef)))
|
||||
],
|
||||
),
|
||||
const SizedBox(height: 10),
|
||||
Text(
|
||||
LocaleKeys.profile_completeProfile.tr(),
|
||||
style: TextStyle(color: Color(0xff2BB8A6), fontWeight: FontWeight.bold, decoration: TextDecoration.underline),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
|
||||
/// description
|
||||
Divider(height: 50, thickness: 8, color: const Color(0xffefefef)),
|
||||
|
||||
Column(
|
||||
children: menu.map((i) => rowItem(i, context)).toList(),
|
||||
)
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget drawSlider(color) {
|
||||
return Row(children: [
|
||||
Expanded(
|
||||
flex: 1,
|
||||
child: ClipRRect(
|
||||
borderRadius: BorderRadius.circular(10),
|
||||
child: Container(
|
||||
height: 6,
|
||||
width: 20,
|
||||
color: color,
|
||||
),
|
||||
)),
|
||||
Container(height: 6, width: 3, color: Colors.white),
|
||||
]);
|
||||
}
|
||||
|
||||
Widget rowItem(obj, context) {
|
||||
return InkWell(
|
||||
onTap: () {
|
||||
//if (obj.dynamicUrl == '') {
|
||||
Navigator.pushNamed(context, obj.route);
|
||||
// } else {
|
||||
// Navigator.pushNamed(context, AppRoutes.addDynamicInputProfile, arguments: DynamicListViewParams(obj.name, obj.functionName, uRL: obj.dynamicUrl, requestID: obj.requestID));
|
||||
//}
|
||||
},
|
||||
child: ListTile(
|
||||
leading: SvgPicture.asset('assets/images/' + obj.icon),
|
||||
title: Text(obj.name),
|
||||
trailing: Icon(Icons.arrow_forward),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget customLabel(String label, double size, Color color, bool isBold, {double padding = 0.0}) => Container(
|
||||
padding: EdgeInsets.all(padding),
|
||||
// height: 50,
|
||||
child: Column(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
|
||||
crossAxisAlignment: CrossAxisAlignment.center,
|
||||
children: [Text(label, style: TextStyle(color: color, fontSize: size, fontWeight: isBold ? FontWeight.bold : FontWeight.normal))]));
|
||||
}
|
||||
|
||||
GetMenuEntriesList getMenuEntries(String type) {
|
||||
List<GetMenuEntriesList> data = _ProfileInFoState.menuData.where((GetMenuEntriesList test) => test.functionName == type).toList();
|
||||
if (data.isNotEmpty) {
|
||||
return data[0];
|
||||
} else {
|
||||
return GetMenuEntriesList();
|
||||
}
|
||||
}
|
||||
@ -1,39 +0,0 @@
|
||||
import 'package:flutter/cupertino.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:mohem_flutter_app/classes/utils.dart';
|
||||
import 'package:mohem_flutter_app/models/member_information_list_model.dart';
|
||||
import 'package:mohem_flutter_app/ui/screens/profile/widgets/profile_info.dart';
|
||||
|
||||
class ProfilePanle extends StatelessWidget {
|
||||
ProfilePanle(this.memberInformationList);
|
||||
|
||||
late MemberInformationListModel memberInformationList;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
double _width = MediaQuery.of(context).size.width;
|
||||
return Container(
|
||||
margin: EdgeInsets.fromLTRB(5, 0, 5, 10),
|
||||
height: MediaQuery.of(context).size.height,
|
||||
child: Stack(children: [
|
||||
Container(
|
||||
width: _width,
|
||||
margin: EdgeInsets.only(top: 50),
|
||||
padding: EdgeInsets.only(top: 50),
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.white,
|
||||
borderRadius: const BorderRadius.only(topLeft: Radius.circular(25), topRight: Radius.circular(25)),
|
||||
boxShadow: [BoxShadow(color: Colors.white60, blurRadius: 10, spreadRadius: 10)],
|
||||
),
|
||||
child: ProfileInFo(memberInformationList),
|
||||
),
|
||||
Container(height: 100, alignment: Alignment.center, child: ProfileImage())
|
||||
]));
|
||||
}
|
||||
|
||||
Widget ProfileImage() => CircleAvatar(
|
||||
radius: 70,
|
||||
backgroundImage: MemoryImage(Utils.getPostBytes(memberInformationList.eMPLOYEEIMAGE)),
|
||||
backgroundColor: Colors.black,
|
||||
);
|
||||
}
|
||||
Loading…
Reference in New Issue