Merge pull request 'profile_changes' (#224) from profile_changes into develop

Reviewed-on: https://repo.ravanertebat.com/TM/tm_app/pulls/224
This commit is contained in:
a.ghabeli
2026-05-24 12:13:00 +03:30
21 changed files with 1236 additions and 396 deletions
+43 -134
View File
@@ -1,19 +1,18 @@
import 'package:flutter/material.dart';
import 'package:flutter_svg/svg.dart';
import 'package:provider/provider.dart';
import 'package:tm_app/core/routes/app_routes.dart';
import 'package:tm_app/view_models/profile_view_model.dart';
import '../../../core/constants/assets.dart';
import '../../../core/constants/common_strings.dart';
import '../../../core/theme/colors.dart';
import '../../../core/utils/app_toast.dart';
import '../../../core/utils/size_config.dart';
import '../../../view_models/auth_view_model.dart';
import '../../shared/desktop_navigation_widget.dart';
import '../strings/profile_strings.dart';
import '../widgets/theme_toggle.dart';
import '../widgets/title_description.dart';
import '../widgets/main_data_tab.dart';
import '../widgets/members_tab.dart';
import '../widgets/profile_tab_bar.dart';
import '../widgets/subject_tab.dart';
class DesktopProfilePage extends StatefulWidget {
const DesktopProfilePage({super.key});
@@ -22,12 +21,15 @@ class DesktopProfilePage extends StatefulWidget {
State<DesktopProfilePage> createState() => _DesktopProfilePageState();
}
class _DesktopProfilePageState extends State<DesktopProfilePage> {
class _DesktopProfilePageState extends State<DesktopProfilePage>
with SingleTickerProviderStateMixin {
late ProfileViewModel viewModel;
late final TabController tabController;
@override
void initState() {
super.initState();
viewModel = context.read<ProfileViewModel>();
tabController = TabController(length: 3, vsync: this);
viewModel.addListener(_profileListener);
}
@@ -56,150 +58,57 @@ class _DesktopProfilePageState extends State<DesktopProfilePage> {
const DesktopNavigationWidget(
currentIndex: 4, // Tenders index
),
Consumer<ProfileViewModel>(
builder: (context, viewModel, child) {
if (viewModel.isLoading) {
return const Expanded(
child: Center(
Expanded(
child: Consumer<ProfileViewModel>(
builder: (context, viewModel, child) {
if (viewModel.isLoading) {
return const Center(
child: CircularProgressIndicator(
color: AppColors.secondary50,
),
),
);
}
if (viewModel.errorMessage != null) {
return Expanded(
child: Center(child: Text(viewModel.errorMessage!)),
);
}
);
}
if (viewModel.errorMessage != null) {
return Center(child: Text(viewModel.errorMessage!));
}
if (viewModel.profileData == null) {
return const Expanded(
child: Center(child: Text(CommonStrings.noData)),
);
}
if (viewModel.profileData == null) {
return const Center(child: Text(CommonStrings.noData));
}
return Expanded(
child: SingleChildScrollView(
return SizedBox(
width: 740,
height: double.infinity,
child: Column(
children: [
SizedBox(
width: 740,
child: Column(
const SizedBox(height: 46),
ProfileTabBar(
controller: tabController,
titles: [
ProfileStrings.mainDataTab,
ProfileStrings.membersTab,
ProfileStrings.subjectTab,
],
),
Expanded(
child: TabBarView(
controller: tabController,
children: [
SizedBox(height: 36.0.h()),
TitleDescription(
title: ProfileStrings.fullname,
description:
viewModel.profileData!.fullName ?? '',
),
TitleDescription(
title: ProfileStrings.username,
description:
viewModel.profileData!.username ?? '',
),
TitleDescription(
title: ProfileStrings.email,
description: viewModel.profileData!.email ?? '',
),
TitleDescription(
title: ProfileStrings.phone,
description: viewModel.profileData!.phone ?? '',
),
TitleDescription(
title: ProfileStrings.companyName,
description:
viewModel
.profileData!
.companies!
.first
.name ??
'',
),
SizedBox(height: 24.0.h()),
// Theme Toggle
Align(
alignment: AlignmentDirectional.centerStart,
child: Text(
ProfileStrings.settings,
style: TextStyle(
fontSize: 20.0.sp(),
fontWeight: FontWeight.w600,
color: AppColors.grey70,
),
),
),
SizedBox(height: 36.0.h()),
_themeChangeRow(),
SizedBox(height: 24.0.h()),
Divider(
color: AppColors.dividerColor,
thickness: 1,
),
SizedBox(height: 24.0.h()),
// Spacer(),
Align(
alignment: AlignmentDirectional.centerEnd,
child: InkWell(
onTap: () => viewModel.logout(),
borderRadius: BorderRadius.circular(100),
child: Container(
width: 156,
height: 56.0.h(),
decoration: BoxDecoration(
color: AppColors.primary20,
borderRadius: BorderRadius.circular(100),
),
alignment: Alignment.center,
child: Text(
ProfileStrings.logout,
style: TextStyle(
fontSize: 14.0.sp(),
fontWeight: FontWeight.w500,
color: AppColors.primaryColor,
),
),
),
),
MainDataTab(
profileData: viewModel.profileData!,
onLogout: () => viewModel.logout(),
),
const MembersTab(),
const SubjectTab(),
],
),
),
],
),
),
);
},
),
],
),
);
}
Widget _themeChangeRow() {
return Padding(
padding: EdgeInsets.symmetric(horizontal: 8.0.w()),
child: Row(
children: [
Text(
ProfileStrings.appTheme,
style: TextStyle(
fontSize: 16.0.sp(),
fontWeight: FontWeight.w400,
color: AppColors.grey70,
);
},
),
),
const Spacer(),
SvgPicture.asset(AssetsManager.sun),
SizedBox(width: 12.0.w()),
SizedBox(
width: 52.0.w(),
height: 32.0.h(),
child: const ThemeToggle(),
),
SizedBox(width: 12.0.w()),
SvgPicture.asset(AssetsManager.moon),
],
),
);
+43 -121
View File
@@ -1,11 +1,8 @@
import 'package:flutter/material.dart';
import 'package:flutter_svg/svg.dart';
import 'package:provider/provider.dart';
import 'package:tm_app/core/routes/app_routes.dart';
import 'package:tm_app/view_models/profile_view_model.dart';
import 'package:tm_app/views/profile/widgets/theme_toggle.dart';
import '../../../core/constants/assets.dart';
import '../../../core/constants/common_strings.dart';
import '../../../core/theme/colors.dart';
import '../../../core/utils/app_toast.dart';
@@ -13,7 +10,10 @@ import '../../../core/utils/size_config.dart';
import '../../../view_models/auth_view_model.dart';
import '../../shared/tender_app_bar.dart';
import '../strings/profile_strings.dart';
import '../widgets/title_description.dart';
import '../widgets/main_data_tab.dart';
import '../widgets/members_tab.dart';
import '../widgets/profile_tab_bar.dart';
import '../widgets/subject_tab.dart';
class MobileProfilePage extends StatefulWidget {
const MobileProfilePage({super.key});
@@ -22,12 +22,15 @@ class MobileProfilePage extends StatefulWidget {
State<MobileProfilePage> createState() => _MobileProfilePageState();
}
class _MobileProfilePageState extends State<MobileProfilePage> {
class _MobileProfilePageState extends State<MobileProfilePage>
with SingleTickerProviderStateMixin {
late ProfileViewModel viewModel;
late final TabController tabController;
@override
void initState() {
super.initState();
viewModel = context.read<ProfileViewModel>();
tabController = TabController(length: 3, vsync: this);
viewModel.addListener(_profileListener);
// Load notification info saved in SharedPreferences
}
@@ -53,137 +56,56 @@ class _MobileProfilePageState extends State<MobileProfilePage> {
return Scaffold(
backgroundColor: AppColors.backgroundColor,
appBar: tenderMobileAppBar(title: ProfileStrings.profileTitle),
body: Consumer<ProfileViewModel>(
builder: (context, viewModel, child) {
if (viewModel.isLoading) {
return const Center(
child: CircularProgressIndicator(color: AppColors.secondary50),
);
}
body: SafeArea(
child: Consumer<ProfileViewModel>(
builder: (context, viewModel, child) {
if (viewModel.isLoading) {
return const Center(
child: CircularProgressIndicator(color: AppColors.secondary50),
);
}
if (viewModel.errorMessage != null) {
return Center(child: Text(viewModel.errorMessage!));
}
if (viewModel.errorMessage != null) {
return Center(child: Text(viewModel.errorMessage!));
}
if (viewModel.profileData == null) {
return const Center(child: Text(CommonStrings.noData));
}
if (viewModel.profileData == null) {
return const Center(child: Text(CommonStrings.noData));
}
return SafeArea(
child: Padding(
return Padding(
padding: EdgeInsets.symmetric(
horizontal: 24.0.w(),
vertical: 16.0.h(),
),
child: Column(
children: [
SizedBox(height: 36.0.h()),
Align(
alignment: AlignmentDirectional.centerStart,
child: Text(
'Last Notification',
style: TextStyle(
fontSize: 18.0.sp(),
fontWeight: FontWeight.w600,
color: AppColors.grey70,
),
),
ProfileTabBar(
controller: tabController,
titles: [
ProfileStrings.mainDataTab,
ProfileStrings.membersTab,
ProfileStrings.subjectTab,
],
),
SizedBox(height: 24.0.h()),
TitleDescription(
title: ProfileStrings.fullname,
description: viewModel.profileData!.fullName ?? '',
),
TitleDescription(
title: ProfileStrings.username,
description: viewModel.profileData!.username ?? '',
),
TitleDescription(
title: ProfileStrings.email,
description: viewModel.profileData!.email ?? '',
),
TitleDescription(
title: ProfileStrings.phone,
description: viewModel.profileData!.phone ?? '',
),
TitleDescription(
title: ProfileStrings.companyName,
description:
viewModel.profileData!.companies!.first.name ?? '',
),
SizedBox(height: 32.0.h()),
Align(
alignment: AlignmentDirectional.centerStart,
child: Text(
ProfileStrings.settings,
style: TextStyle(
fontSize: 20.0.sp(),
fontWeight: FontWeight.w600,
color: AppColors.grey70,
),
),
),
SizedBox(height: 36.0.h()),
_themeChangeRow(),
SizedBox(height: 24.0.h()),
Divider(color: AppColors.dividerColor, thickness: 1),
SizedBox(height: 24.0.h()),
const Spacer(),
InkWell(
onTap: () => viewModel.logout(),
borderRadius: BorderRadius.circular(100),
child: Container(
width: double.infinity,
height: 56.0.h(),
decoration: BoxDecoration(
color: AppColors.primary20,
borderRadius: BorderRadius.circular(100),
),
alignment: Alignment.center,
child: Text(
ProfileStrings.logout,
style: TextStyle(
fontSize: 14.0.sp(),
fontWeight: FontWeight.w500,
color: AppColors.primaryColor,
Expanded(
child: TabBarView(
controller: tabController,
children: [
MainDataTab(
profileData: viewModel.profileData!,
onLogout: () => viewModel.logout(),
),
),
const MembersTab(),
const SubjectTab(),
],
),
),
],
),
),
);
},
),
);
}
Widget _themeChangeRow() {
return Padding(
padding: EdgeInsets.symmetric(horizontal: 8.0.w()),
child: Row(
children: [
Text(
ProfileStrings.appTheme,
style: TextStyle(
fontSize: 16.0.sp(),
fontWeight: FontWeight.w400,
color: AppColors.grey70,
),
),
const Spacer(),
SvgPicture.asset(AssetsManager.sun),
SizedBox(width: 12.0.w()),
SizedBox(
width: 52.0.w(),
height: 32.0.h(),
child: const ThemeToggle(),
),
SizedBox(width: 12.0.w()),
SvgPicture.asset(AssetsManager.moon),
],
);
},
),
),
);
}
+24 -116
View File
@@ -1,7 +1,5 @@
import 'package:flutter/material.dart';
import 'package:flutter_svg/svg.dart';
import 'package:provider/provider.dart';
import 'package:tm_app/core/constants/assets.dart';
import 'package:tm_app/core/constants/common_strings.dart';
import 'package:tm_app/core/routes/app_routes.dart';
import 'package:tm_app/view_models/profile_view_model.dart';
@@ -13,8 +11,9 @@ import '../../../view_models/auth_view_model.dart';
import '../../shared/tablet_navigation_widget.dart';
import '../../shared/tender_app_bar.dart';
import '../strings/profile_strings.dart';
import '../widgets/theme_toggle.dart';
import '../widgets/title_description.dart';
import '../widgets/main_data_tab.dart';
import '../widgets/members_tab.dart';
import '../widgets/profile_tab_bar.dart';
class TabletProfilePage extends StatefulWidget {
const TabletProfilePage({super.key});
@@ -23,12 +22,15 @@ class TabletProfilePage extends StatefulWidget {
State<TabletProfilePage> createState() => _TabletProfilePageState();
}
class _TabletProfilePageState extends State<TabletProfilePage> {
class _TabletProfilePageState extends State<TabletProfilePage>
with SingleTickerProviderStateMixin {
late ProfileViewModel viewModel;
late final TabController tabController;
@override
void initState() {
super.initState();
viewModel = context.read<ProfileViewModel>();
tabController = TabController(length: 3, vsync: this);
viewModel.addListener(_profileListener);
}
@@ -84,91 +86,25 @@ class _TabletProfilePageState extends State<TabletProfilePage> {
),
child: Column(
children: [
SizedBox(height: 128.0.h()),
TitleDescription(
title: ProfileStrings.fullname,
description: viewModel.profileData!.fullName ?? '',
ProfileTabBar(
controller: tabController,
titles: [
ProfileStrings.mainDataTab,
ProfileStrings.membersTab,
ProfileStrings.subjectTab,
],
),
TitleDescription(
title: ProfileStrings.username,
description: viewModel.profileData!.username ?? '',
),
TitleDescription(
title: ProfileStrings.email,
description: viewModel.profileData!.email ?? '',
),
TitleDescription(
title: ProfileStrings.phone,
description: viewModel.profileData!.phone ?? '',
),
TitleDescription(
title: ProfileStrings.companyName,
description:
viewModel.profileData!.companies!.first.name ?? '',
),
// TitleDescription(
// title: ProfileStrings.companyName,
// description: viewModel.companyProfileData!.name!,
// ),
// TitleDescription(
// title: ProfileStrings.nationalId,
// description: viewModel.companyProfileData!.id!,
// ),
// TitleDescription(
// title: ProfileStrings.registrationNumber,
// description:
// viewModel.companyProfileData!.registrationNumber!,
// ),
// const TitleDescription(
// title: ProfileStrings.businessType,
// description: '-',
// ),
// TitleDescription(
// title: ProfileStrings.founded,
// description:
// viewModel.companyProfileData!.foundedYear!.toString(),
// ),
SizedBox(height: 24.0.h()),
// Theme Toggle
Align(
alignment: AlignmentDirectional.centerStart,
child: Text(
ProfileStrings.settings,
style: TextStyle(
fontSize: 20.0.sp(),
fontWeight: FontWeight.w600,
color: AppColors.grey70,
),
),
),
SizedBox(height: 36.0.h()),
_themeChangeRow(),
SizedBox(height: 24.0.h()),
Divider(color: AppColors.dividerColor, thickness: 1),
SizedBox(height: 24.0.h()),
// Spacer(),
Align(
alignment: AlignmentDirectional.centerStart,
child: InkWell(
onTap: () => viewModel.logout(),
borderRadius: BorderRadius.circular(100),
child: Container(
width: 156,
height: 56.0.h(),
decoration: BoxDecoration(
color: AppColors.primary20,
borderRadius: BorderRadius.circular(100),
Expanded(
child: TabBarView(
controller: tabController,
children: [
MainDataTab(
profileData: viewModel.profileData!,
onLogout: () => viewModel.logout(),
),
alignment: Alignment.center,
child: Text(
ProfileStrings.logout,
style: TextStyle(
fontSize: 14.0.sp(),
fontWeight: FontWeight.w500,
color: AppColors.primaryColor,
),
),
),
const MembersTab(),
const Center(child: Text('Subject Tab Content')),
],
),
),
],
@@ -179,32 +115,4 @@ class _TabletProfilePageState extends State<TabletProfilePage> {
},
);
}
Widget _themeChangeRow() {
return Padding(
padding: EdgeInsets.symmetric(horizontal: 8.0.w()),
child: Row(
children: [
Text(
ProfileStrings.appTheme,
style: TextStyle(
fontSize: 16.0.sp(),
fontWeight: FontWeight.w400,
color: AppColors.grey70,
),
),
const Spacer(),
SvgPicture.asset(AssetsManager.sun),
SizedBox(width: 12.0.w()),
SizedBox(
width: 52.0.w(),
height: 32.0.h(),
child: const ThemeToggle(),
),
SizedBox(width: 12.0.w()),
SvgPicture.asset(AssetsManager.moon),
],
),
);
}
}
@@ -20,4 +20,7 @@ class ProfileStrings {
static const String position = 'position';
static const String phone = 'phone';
static const String fullname = 'full name';
static const String mainDataTab = 'Main Data';
static const String membersTab = 'Members';
static const String subjectTab = 'Subject';
}
@@ -0,0 +1,194 @@
import 'package:flutter/material.dart';
import 'package:flutter_svg/svg.dart';
import 'package:go_router/go_router.dart';
import 'package:tm_app/core/utils/size_config.dart';
import 'package:tm_app/views/login/widgets/widgets.dart';
import '../../../core/constants/assets.dart';
import '../../../core/theme/colors.dart';
class EditKeyWordBottomSheet extends StatefulWidget {
const EditKeyWordBottomSheet({
required this.keyWords,
required this.isDesktop,
this.onSubmit,
super.key,
});
final List<String> keyWords;
final Future<void> Function(List<String> keyWords)? onSubmit;
final bool isDesktop;
@override
State<EditKeyWordBottomSheet> createState() => _EditKeyWordBottomSheetState();
}
class _EditKeyWordBottomSheetState extends State<EditKeyWordBottomSheet> {
final TextEditingController _controller = TextEditingController();
final FocusNode _focusNode = FocusNode();
late final List<String> _keywords = List.from(widget.keyWords);
@override
Widget build(BuildContext context) {
return Wrap(
children: [
Container(
width: double.infinity,
padding: EdgeInsets.only(
left: 24.0.w(),
right: 24.0.w(),
top: 24.0.h(),
bottom: MediaQuery.of(context).viewInsets.bottom,
),
decoration: BoxDecoration(
color: AppColors.backgroundColor,
borderRadius: BorderRadius.vertical(
top: const Radius.circular(24),
bottom:
widget.isDesktop ? const Radius.circular(24) : Radius.zero,
),
),
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text(
'Edit Key Word',
style: TextStyle(
fontSize: 20.0.sp(),
fontWeight: FontWeight.w600,
),
),
IconButton(
onPressed: () => context.pop(),
icon: SvgPicture.asset(
AssetsManager.closeCircle,
width: 20.0.w(),
height: 20.0.w(),
fit: BoxFit.cover,
colorFilter: ColorFilter.mode(
AppColors.grey60,
BlendMode.srcIn,
),
),
),
],
),
SizedBox(height: 16.0.h()),
Divider(color: AppColors.grey20),
SizedBox(height: 24.0.h()),
TextField(
focusNode: _focusNode,
controller: _controller,
onSubmitted: (value) {
if (value.trim().isEmpty) {
return;
}
setState(() {
_keywords.add(value);
});
_controller.clear();
Future.delayed(const Duration(milliseconds: 50), () {
_focusNode.requestFocus();
});
},
decoration: InputDecoration(
hintText: 'Key Word',
hintStyle: TextStyle(
fontSize: 16.0.sp(),
fontWeight: FontWeight.w400,
color: AppColors.grey60,
),
border: OutlineInputBorder(
borderSide: BorderSide(color: AppColors.grey40),
borderRadius: const BorderRadius.all(Radius.circular(12)),
),
enabledBorder: OutlineInputBorder(
borderSide: BorderSide(color: AppColors.grey40),
borderRadius: const BorderRadius.all(Radius.circular(12)),
),
focusedBorder: OutlineInputBorder(
borderSide: BorderSide(color: AppColors.grey40),
borderRadius: const BorderRadius.all(Radius.circular(12)),
),
errorBorder: const OutlineInputBorder(
borderSide: BorderSide(color: AppColors.errorColor),
borderRadius: BorderRadius.all(Radius.circular(12)),
),
),
),
SizedBox(height: 16.0.h()),
SizedBox(
height: 200.0.h(), // Set a fixed height for the container
child: SingleChildScrollView(
child: Wrap(
spacing: 8,
runSpacing: 16.0.h(),
children:
_keywords
.map(
(e) => _chip(
label: e,
backgroundColor: Colors.green[200]!,
onDelete:
() => setState(() {
_keywords.remove(e);
}),
),
)
.toList(),
// [
// _chip(label: 'UIUX', backgroundColor: Colors.green[200]!),
// _chip(
// label: 'Lorem ipsum',
// backgroundColor: Colors.orange[100]!,
// ),
// _chip(label: 'sample', backgroundColor: Colors.grey[300]!),
// _chip(label: 'Unknown', backgroundColor: Colors.red[200]!),
// _chip(
// label: 'Lorem ipsum 02',
// backgroundColor: Colors.blue[100]!,
// ),
// ],
),
),
),
SizedBox(height: 32.0.h()),
BaseButton(
isEnabled: true,
text: 'Submit Request',
backgroundColor: AppColors.primary20,
textColor: AppColors.mainBlue,
onPressed: () async {
await widget.onSubmit?.call(_keywords);
if (context.mounted) {
context.pop();
}
},
),
SizedBox(height: 24.0.h()),
],
),
),
],
);
}
Widget _chip({
required String label,
required Color backgroundColor,
required VoidCallback onDelete,
}) {
return InputChip(
label: Text(label),
backgroundColor: backgroundColor,
onDeleted: onDelete,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(8),
side: const BorderSide(color: Colors.transparent),
),
);
}
}
@@ -0,0 +1,297 @@
import 'package:flutter/material.dart';
import 'package:go_router/go_router.dart';
import 'package:tm_app/core/utils/size_config.dart';
// Note: Ensure your size_config and theme imports are present
// import 'package:tm_app/core/utils/size_config.dart';
// import 'package:tm_app/core/theme/colors.dart';
class EditKeyWordBottomSheet extends StatefulWidget {
const EditKeyWordBottomSheet({super.key});
@override
State<EditKeyWordBottomSheet> createState() => _EditKeyWordBottomSheetState();
}
class _EditKeyWordBottomSheetState extends State<EditKeyWordBottomSheet> {
final List<String> _keywords = [
'1234',
'Lorem ipsum',
'sample',
'Unknown',
'Lorem ipsum 02',
];
// Location selection state
bool _isDropdownOpen = false;
final List<Map<String, String>> _selectedCountries = [
{'code': 'NO', 'name': 'Norway', 'flag': '🇳🇴'},
{'code': 'SE', 'name': 'Sweden', 'flag': '🇸🇪'},
];
final List<Map<String, String>> _allCountries = [
{'code': 'AU', 'name': 'Australia', 'flag': '🇦🇺'},
{'code': 'AT', 'name': 'Austria', 'flag': '🇦🇹'},
{'code': 'AZ', 'name': 'Azerbaijan', 'flag': '🇦🇿'},
{'code': 'BS', 'name': 'Bahamas', 'flag': '🇧🇸'},
{'code': 'BH', 'name': 'Bahrain', 'flag': '🇧🇭'},
];
@override
Widget build(BuildContext context) {
return Container(
width: double.infinity,
padding: EdgeInsets.only(
left: 24.0.w(),
right: 24.0.w(),
top: 24.0.h(),
bottom: MediaQuery.of(context).viewInsets.bottom + 24.0.h(),
),
decoration: const BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.vertical(top: Radius.circular(32)),
),
child: Column(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
// KEY WORD SECTION
_buildSectionHeader('Key Word'),
SizedBox(height: 16.0.h()),
Wrap(
spacing: 8,
runSpacing: 12.0.h(),
children: _keywords.map((e) => _buildKeywordChip(e)).toList(),
),
SizedBox(height: 32.0.h()),
const Divider(color: Color(0xFFF1F1F1)),
SizedBox(height: 24.0.h()),
// LOCATION SECTION
_buildSectionHeader('Location'),
SizedBox(height: 16.0.h()),
Stack(
clipBehavior: Clip.none,
children: [
// 1. Selected Country Chips (Below the input)
Padding(
padding: EdgeInsets.only(top: 64.0.h()),
child: Wrap(
spacing: 12,
runSpacing: 8,
children:
_selectedCountries
.map((c) => _buildCountryChip(c))
.toList(),
),
),
// 2. The Pseudo-TextField
GestureDetector(
onTap: () => setState(() => _isDropdownOpen = !_isDropdownOpen),
child: Container(
height: 52.0.h(),
padding: const EdgeInsets.symmetric(horizontal: 16),
decoration: BoxDecoration(
border: Border.all(color: const Color(0xFFD1E3FF)),
borderRadius: BorderRadius.circular(12),
),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text(
'Location',
style: TextStyle(
color: Colors.grey.shade400,
fontSize: 16.0.sp(),
),
),
Icon(
_isDropdownOpen
? Icons.keyboard_arrow_up
: Icons.keyboard_arrow_down,
color: Colors.grey,
),
],
),
),
),
// 3. Floating Dropdown Menu (Positioned ABOVE the input field)
if (_isDropdownOpen)
Positioned(
bottom: 60.0.h(), // Sits above the text field
left: 0,
right: 0,
child: Material(
elevation: 12,
shadowColor: Colors.black26,
borderRadius: BorderRadius.circular(12),
color: Colors.white,
child: Container(
constraints: BoxConstraints(maxHeight: 220.0.h()),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(12),
border: Border.all(color: Colors.grey.shade100),
),
child: ListView.separated(
shrinkWrap: true,
padding: EdgeInsets.zero,
itemCount: _allCountries.length,
separatorBuilder:
(context, index) => const Divider(
height: 1,
color: Color(0xFFF5F5F5),
),
itemBuilder: (context, index) {
final country = _allCountries[index];
return ListTile(
contentPadding: const EdgeInsets.symmetric(
horizontal: 16,
),
leading: Text(
country['flag']!,
style: const TextStyle(fontSize: 22),
),
title: Text(
country['name']!,
style: TextStyle(
fontSize: 15.0.sp(),
color: Colors.black87,
),
),
onTap: () {
setState(() {
// Add if not already selected
if (!_selectedCountries.any(
(c) => c['code'] == country['code'],
)) {
_selectedCountries.add(country);
}
_isDropdownOpen = false;
});
},
);
},
),
),
),
),
],
),
SizedBox(height: 40.0.h()),
// SAVE BUTTON
SizedBox(
width: double.infinity,
height: 54.0.h(),
child: ElevatedButton(
onPressed: () => context.pop(),
style: ElevatedButton.styleFrom(
backgroundColor: const Color(
0xFFE8F1FF,
), // Matches "Save" blue background
foregroundColor: const Color(
0xFF1A73E8,
), // Matches "Save" text color
elevation: 0,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(28),
),
),
child: Text(
'Save',
style: TextStyle(
fontSize: 16.0.sp(),
fontWeight: FontWeight.bold,
),
),
),
),
],
),
);
}
Widget _buildSectionHeader(String title) {
return Row(
children: [
Text(
title,
style: TextStyle(
fontSize: 18.0.sp(),
fontWeight: FontWeight.w500,
color: const Color(0xFF616161),
),
),
SizedBox(width: 8.0.w()),
Icon(
Icons.edit_outlined,
size: 20.0.w(),
color: const Color(0xFF757575),
),
],
);
}
Widget _buildKeywordChip(String label) {
// Coloring logic to match screenshot
Color bg = const Color(0xFFF5F5F5);
Color text = const Color(0xFF424242);
if (label == '1234') bg = const Color(0xFFE8F5E9);
if (label == 'Lorem ipsum') bg = const Color(0xFFFFF3E0);
if (label == 'Unknown') bg = const Color(0xFFFFEBEE);
if (label == 'Lorem ipsum 02' || label == 'sample')
bg = const Color(0xFFECEFF1);
return Container(
padding: const EdgeInsets.symmetric(horizontal: 14, vertical: 8),
decoration: BoxDecoration(
color: bg,
borderRadius: BorderRadius.circular(8),
),
child: Text(
label,
style: TextStyle(
color: text,
fontSize: 14.0.sp(),
fontWeight: FontWeight.w400,
),
),
);
}
Widget _buildCountryChip(Map<String, String> country) {
return Container(
padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 6),
decoration: BoxDecoration(
color: const Color(0xFFF5F5F5),
borderRadius: BorderRadius.circular(8),
),
child: Row(
mainAxisSize: MainAxisSize.min,
children: [
Text(
country['code']!,
style: TextStyle(
fontSize: 14.0.sp(),
fontWeight: FontWeight.w600,
color: const Color(0xFF424242),
),
),
SizedBox(width: 6.0.w()),
Text(country['flag']!, style: const TextStyle(fontSize: 18)),
SizedBox(width: 6.0.w()),
GestureDetector(
onTap: () => setState(() => _selectedCountries.remove(country)),
child: const Icon(Icons.cancel, size: 18, color: Colors.grey),
),
],
),
);
}
}
@@ -0,0 +1,133 @@
import 'package:flutter/material.dart';
import 'package:flutter_svg/svg.dart';
import 'package:tm_app/core/utils/size_config.dart';
import '../../../core/constants/assets.dart';
import '../../../core/theme/colors.dart';
import '../../../data/services/model/profile_data/profile_data.dart';
import '../strings/profile_strings.dart';
import 'theme_toggle.dart';
import 'title_description.dart';
class MainDataTab extends StatelessWidget {
const MainDataTab({
required this.profileData,
required this.onLogout,
super.key,
});
final ProfileData profileData;
final VoidCallback onLogout;
@override
Widget build(BuildContext context) {
return SingleChildScrollView(
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
SizedBox(height: 36.0.h()),
Align(
alignment: AlignmentDirectional.centerStart,
child: Text(
'Last Notification',
style: TextStyle(
fontSize: 18.0.sp(),
fontWeight: FontWeight.w600,
color: AppColors.grey70,
),
),
),
SizedBox(height: 24.0.h()),
TitleDescription(
title: ProfileStrings.fullname,
description: profileData.fullName ?? '',
),
TitleDescription(
title: ProfileStrings.username,
description: profileData.username ?? '',
),
TitleDescription(
title: ProfileStrings.email,
description: profileData.email ?? '',
),
TitleDescription(
title: ProfileStrings.phone,
description: profileData.phone ?? '',
),
TitleDescription(
title: ProfileStrings.companyName,
description: profileData.companies!.first.name ?? '',
),
SizedBox(height: 32.0.h()),
Align(
alignment: AlignmentDirectional.centerStart,
child: Text(
ProfileStrings.settings,
style: TextStyle(
fontSize: 20.0.sp(),
fontWeight: FontWeight.w600,
color: AppColors.grey70,
),
),
),
SizedBox(height: 36.0.h()),
_themeChangeRow(),
SizedBox(height: 24.0.h()),
Divider(color: AppColors.dividerColor, thickness: 1),
SizedBox(height: 24.0.h()),
InkWell(
onTap: onLogout,
borderRadius: BorderRadius.circular(100),
child: Container(
width: double.infinity,
height: 56.0.h(),
decoration: BoxDecoration(
color: AppColors.primary20,
borderRadius: BorderRadius.circular(100),
),
alignment: Alignment.center,
child: Text(
ProfileStrings.logout,
style: TextStyle(
fontSize: 14.0.sp(),
fontWeight: FontWeight.w500,
color: AppColors.primaryColor,
),
),
),
),
],
),
);
}
Widget _themeChangeRow() {
return Padding(
padding: EdgeInsets.symmetric(horizontal: 8.0.w()),
child: Row(
children: [
Text(
ProfileStrings.appTheme,
style: TextStyle(
fontSize: 16.0.sp(),
fontWeight: FontWeight.w400,
color: AppColors.grey70,
),
),
const Spacer(),
SvgPicture.asset(AssetsManager.sun),
SizedBox(width: 12.0.w()),
SizedBox(
width: 52.0.w(),
height: 32.0.h(),
child: const ThemeToggle(),
),
SizedBox(width: 12.0.w()),
SvgPicture.asset(AssetsManager.moon),
],
),
);
}
}
+116
View File
@@ -0,0 +1,116 @@
import 'package:flutter/material.dart';
import 'package:tm_app/core/theme/colors.dart';
import 'package:tm_app/core/utils/size_config.dart';
class MembersTab extends StatelessWidget {
const MembersTab({super.key});
@override
Widget build(BuildContext context) {
return Column(
children: [
SizedBox(height: 36.0.h()),
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
_columnName('Full Name'),
_columnName('Position'),
_columnName('Access level'),
],
),
SizedBox(height: 24.0.h()),
Divider(color: AppColors.grey50),
SizedBox(height: 24.0.h()),
Expanded(
child: ListView.separated(
scrollDirection: Axis.vertical,
itemBuilder: (context, index) {
final member = _members[index];
return _member(
fullName: member.fullName,
position: member.position,
accessLevel: member.accessLevel,
);
},
separatorBuilder:
(context, index) =>
Divider(color: AppColors.grey50.withValues(alpha: 0.2)),
itemCount: _members.length,
),
),
],
);
}
Widget _columnName(String text) {
return SizedBox(
width: 100.0.w(),
child: Text(
text,
style: TextStyle(
fontSize: 16.0.sp(),
fontWeight: FontWeight.w400,
color: AppColors.grey70,
),
),
);
}
Widget _member({
required String fullName,
required String position,
required String accessLevel,
}) {
return SizedBox(
height: 43.0.h(),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
_memberDetail(title: fullName),
// SizedBox(width: 40.0.w()),
_memberDetail(title: position),
// SizedBox(width: 40.0.w()),
_memberDetail(title: accessLevel),
],
),
);
}
Widget _memberDetail({required String title}) {
return SizedBox(
width: 100.0.w(),
child: Align(
alignment: Alignment.centerLeft,
child: Text(
title,
maxLines: 1,
overflow: TextOverflow.ellipsis,
style: TextStyle(
fontSize: 16.0.sp(),
fontWeight: FontWeight.w400,
color: AppColors.grey80,
),
),
),
);
}
}
class Member {
final String fullName;
final String position;
final String accessLevel;
Member({
required this.fullName,
required this.position,
required this.accessLevel,
});
}
final List<Member> _members = [
Member(fullName: 'Rick Novak', position: 'Director', accessLevel: 'Level 01'),
Member(fullName: 'Sara Novak', position: 'Director', accessLevel: 'Level 01'),
Member(fullName: 'Sarah Connor', position: 'Chief', accessLevel: 'Level 02'),
];
@@ -0,0 +1,70 @@
import 'package:flutter/material.dart';
import 'package:tm_app/core/utils/size_config.dart';
import '../../../core/theme/colors.dart';
class ProfileTabBar extends StatefulWidget {
const ProfileTabBar({
required this.controller,
required this.titles,
this.onTap,
super.key,
});
final TabController controller;
final List<String> titles;
final ValueChanged<int>? onTap;
@override
State<ProfileTabBar> createState() => _ProfileTabBarState();
}
class _ProfileTabBarState extends State<ProfileTabBar> {
@override
Widget build(BuildContext context) {
return SingleChildScrollView(
child: Container(
width: double.infinity,
height: 51.0.h(),
padding: EdgeInsets.symmetric(horizontal: 8.0.w(), vertical: 8.0.h()),
decoration: BoxDecoration(
color: AppColors.grey10,
borderRadius: BorderRadius.circular(10),
),
alignment: Alignment.center,
child: TabBar(
controller: widget.controller,
onTap: widget.onTap,
indicatorSize: TabBarIndicatorSize.tab,
dividerColor: Colors.transparent,
indicator: BoxDecoration(
color: AppColors.primary0,
borderRadius: BorderRadius.circular(10),
boxShadow: [
BoxShadow(
color: Colors.black.withValues(alpha: 0.12),
blurRadius: 4,
offset: const Offset(0, 2),
),
],
),
labelColor: AppColors.mainBlue,
unselectedLabelColor: AppColors.grey60,
labelStyle: TextStyle(
fontSize: 16.0.sp(),
fontWeight: FontWeight.w600,
),
unselectedLabelStyle: TextStyle(
fontSize: 16.0.sp(),
fontWeight: FontWeight.w600,
),
tabs: [
Tab(text: widget.titles[0]),
Tab(text: widget.titles[1]),
Tab(text: widget.titles[2]),
],
),
),
);
}
}
+219
View File
@@ -0,0 +1,219 @@
import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:go_router/go_router.dart';
import 'package:provider/provider.dart';
import 'package:tm_app/core/constants/assets.dart';
import 'package:tm_app/core/theme/colors.dart';
import 'package:tm_app/core/utils/size_config.dart';
import '../../../view_models/profile_view_model.dart';
import 'edit_key_word_bottom_sheet.dart';
class SubjectTab extends StatelessWidget {
const SubjectTab({super.key});
final bool isDesktop = true;
@override
Widget build(BuildContext context) {
final viewModel = context.read<ProfileViewModel>();
return Column(
children: [
SizedBox(height: 36.0.h()),
_companyActivity(companyActivity: 'IT'),
SizedBox(height: 24.0.h()),
_budget(budget: 'Telecom Solutions GmbH'),
SizedBox(height: 24.0.h()),
_keyWord(
onEditPressed: () {
if (isDesktop) {
showDialog(
context: context,
builder: (_) {
return Dialog(
child: SizedBox(
width: 560,
child: EditKeyWordBottomSheet(
isDesktop: true,
keyWords: viewModel.profileData?.keywords ?? [],
onSubmit: (keyWords) async {
context.pop();
await viewModel.updateProfileKeyWords(
keyWords: keyWords,
);
},
),
),
);
},
);
} else {
showModalBottomSheet(
context: context,
isScrollControlled: true,
builder: (_) {
return EditKeyWordBottomSheet(
isDesktop: false,
keyWords: viewModel.profileData?.keywords ?? [],
onSubmit: (keyWords) async {
context.pop();
await viewModel.updateProfileKeyWords(keyWords: keyWords);
},
);
},
);
}
},
),
SizedBox(height: 16.0.h()),
Wrap(
spacing: 8,
runSpacing: 16.0.h(),
// children: [
// _chip(label: 'UIUX', backgroundColor: Colors.green[200]!),
// _chip(label: 'Lorem ipsum', backgroundColor: Colors.orange[100]!),
// _chip(label: 'sample', backgroundColor: Colors.grey[300]!),
// _chip(label: 'Unknown', backgroundColor: Colors.red[200]!),
// _chip(label: 'Lorem ipsum 02', backgroundColor: Colors.blue[100]!),
// ],
children:
viewModel.profileData!.keywords!
.map(
(e) => _chip(label: e, backgroundColor: Colors.green[200]!),
)
.toList(),
),
SizedBox(height: 24.0.h()),
Divider(color: AppColors.grey20),
_location(onEditePressed: () {}),
],
);
}
Widget _companyActivity({required String companyActivity}) {
return Padding(
padding: EdgeInsets.symmetric(horizontal: 8.0.w()),
child: SizedBox(
height: 43.0.h(),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
'Company Activity ',
style: TextStyle(
fontSize: 16.0.sp(),
fontWeight: FontWeight.w400,
color: AppColors.grey60,
),
),
Text(
companyActivity,
style: TextStyle(
fontSize: 16.0.sp(),
fontWeight: FontWeight.w400,
color: AppColors.grey80,
),
),
],
),
),
);
}
Widget _budget({required String budget}) {
return Padding(
padding: EdgeInsets.symmetric(horizontal: 8.0.w()),
child: SizedBox(
height: 43.0.h(),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
'Budget',
style: TextStyle(
fontSize: 16.0.sp(),
fontWeight: FontWeight.w400,
color: AppColors.grey60,
),
),
Text(
budget,
style: TextStyle(
fontSize: 16.0.sp(),
fontWeight: FontWeight.w400,
color: AppColors.grey80,
),
),
],
),
),
);
}
Widget _keyWord({required VoidCallback onEditPressed}) {
return Padding(
padding: EdgeInsets.symmetric(horizontal: 8.0.w()),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Text(
'Key Word',
style: TextStyle(
fontSize: 16.0.sp(),
fontWeight: FontWeight.w400,
color: AppColors.grey60,
),
),
IconButton(
onPressed: onEditPressed,
icon: SvgPicture.asset(
AssetsManager.editting,
colorFilter: ColorFilter.mode(AppColors.grey70, BlendMode.srcIn),
),
),
],
),
);
}
Widget _chip({required String label, required Color backgroundColor}) {
return Chip(
label: Text(label),
backgroundColor: backgroundColor,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(8),
side: const BorderSide(color: Colors.transparent),
),
);
}
Widget _location({required VoidCallback onEditePressed}) {
return Padding(
padding: EdgeInsets.symmetric(horizontal: 8.0.w()),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Text(
'Location',
style: TextStyle(
fontSize: 16.0.sp(),
fontWeight: FontWeight.w400,
color: AppColors.grey60,
),
),
IconButton(
onPressed: onEditePressed,
icon: SvgPicture.asset(
AssetsManager.editting,
colorFilter: ColorFilter.mode(AppColors.grey70, BlendMode.srcIn),
),
),
],
),
);
}
}