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.
363 lines
15 KiB
Dart
363 lines
15 KiB
Dart
import 'package:car_customer_app/views/dashboard/widgets/drawer_widget.dart';
|
|
import 'package:car_customer_app/views/dashboard/widgets/my_services_categories_widget.dart';
|
|
import 'package:easy_localization/easy_localization.dart';
|
|
import 'package:flutter/material.dart';
|
|
import 'package:mc_common_app/config/routes.dart';
|
|
import 'package:mc_common_app/extensions/int_extensions.dart';
|
|
import 'package:mc_common_app/extensions/string_extensions.dart';
|
|
import 'package:mc_common_app/generated/locale_keys.g.dart';
|
|
import 'package:mc_common_app/models/general_models/widgets_models.dart';
|
|
import 'package:mc_common_app/theme/colors.dart';
|
|
import 'package:mc_common_app/utils/enums.dart';
|
|
import 'package:mc_common_app/utils/navigator.dart';
|
|
import 'package:mc_common_app/view_models/ad_view_model.dart';
|
|
import 'package:mc_common_app/view_models/appointments_view_model.dart';
|
|
import 'package:mc_common_app/view_models/dashboard_view_model_customer.dart';
|
|
import 'package:mc_common_app/views/advertisement/components/ads_list_widget.dart';
|
|
import 'package:mc_common_app/views/appointments/widgets/common_appointment_slider_widget.dart';
|
|
import 'package:mc_common_app/widgets/common_widgets/app_bar.dart';
|
|
import 'package:mc_common_app/widgets/common_widgets/view_all_widget.dart';
|
|
import 'package:mc_common_app/widgets/extensions/extensions_widget.dart';
|
|
import 'package:mc_common_app/widgets/shimmer/home_shimmer_widgets.dart';
|
|
import 'package:provider/provider.dart';
|
|
|
|
class HomeFragment extends StatefulWidget {
|
|
const HomeFragment({Key? key}) : super(key: key);
|
|
|
|
@override
|
|
State<HomeFragment> createState() => _HomeFragmentState();
|
|
}
|
|
|
|
class _HomeFragmentState extends State<HomeFragment> {
|
|
bool _isSearchingServices = false;
|
|
final TextEditingController _searchController = TextEditingController();
|
|
String _searchQuery = '';
|
|
|
|
@override
|
|
void dispose() {
|
|
_searchController.dispose();
|
|
super.dispose();
|
|
}
|
|
|
|
void _toggleSearch() {
|
|
setState(() {
|
|
_isSearchingServices = !_isSearchingServices;
|
|
if (!_isSearchingServices) {
|
|
_searchController.clear();
|
|
_searchQuery = '';
|
|
}
|
|
});
|
|
}
|
|
|
|
List<FilterListModel> _filterServices(List<FilterListModel> services) {
|
|
if (_searchQuery.isEmpty) {
|
|
return services;
|
|
}
|
|
return services.where((service) {
|
|
return service.title.toLowerCase().contains(_searchQuery.toLowerCase());
|
|
}).toList();
|
|
}
|
|
|
|
Widget _buildServicesHeader() {
|
|
if (_isSearchingServices) {
|
|
return Padding(
|
|
padding: const EdgeInsets.symmetric(horizontal: 21),
|
|
child: Row(
|
|
children: [
|
|
Expanded(
|
|
child: Container(
|
|
height: 55,
|
|
decoration: BoxDecoration(
|
|
color: Colors.grey[200],
|
|
borderRadius: BorderRadius.circular(12),
|
|
border: Border.all(color: Colors.grey[300]!, width: 1),
|
|
),
|
|
child: TextField(
|
|
controller: _searchController,
|
|
autofocus: true,
|
|
style: const TextStyle(fontSize: 16),
|
|
onChanged: (value) {
|
|
setState(() {
|
|
_searchQuery = value;
|
|
});
|
|
},
|
|
decoration: InputDecoration(
|
|
hintText: LocaleKeys.searchService.tr(),
|
|
hintStyle: TextStyle(fontSize: 16, color: Colors.grey[600]),
|
|
prefixIcon: Icon(Icons.search, size: 26, color: Colors.grey[700]),
|
|
border: InputBorder.none,
|
|
contentPadding: const EdgeInsets.symmetric(horizontal: 18, vertical: 16),
|
|
),
|
|
),
|
|
),
|
|
),
|
|
14.width,
|
|
InkWell(
|
|
onTap: _toggleSearch,
|
|
child: Container(
|
|
height: 55,
|
|
width: 55,
|
|
decoration: BoxDecoration(
|
|
color: Colors.grey[200],
|
|
borderRadius: BorderRadius.circular(12),
|
|
border: Border.all(color: Colors.grey[300]!, width: 1),
|
|
),
|
|
child: Icon(Icons.close, size: 26, color: Colors.grey[700]),
|
|
),
|
|
),
|
|
],
|
|
),
|
|
);
|
|
} else {
|
|
return Row(
|
|
children: [
|
|
Expanded(
|
|
child: LocaleKeys.services.tr().toUpperCase().toText(fontSize: 20, isUpperCase: true, fontWeight: FontWeight.w600),
|
|
),
|
|
InkWell(
|
|
onTap: _toggleSearch,
|
|
child: const Icon(Icons.search, size: 28, color: MyColors.primaryColor),
|
|
),
|
|
],
|
|
).horPaddingMain();
|
|
}
|
|
}
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
return Scaffold(
|
|
drawer: CustomDrawer(dashboardVM: context.watch<DashboardVmCustomer>()),
|
|
appBar: CustomAppBar(
|
|
isDrawerEnabled: true,
|
|
leadingWidth: 100,
|
|
onTap: () => navigateWithName(context, AppRoutes.settingOptionsMore),
|
|
actions: [
|
|
// IconButton(
|
|
// onPressed: () {},
|
|
// icon: const b.Badge(
|
|
// badgeContent: Text(
|
|
// '3',
|
|
// style: TextStyle(
|
|
// fontSize: 10,
|
|
// color: Colors.white,
|
|
// ),
|
|
// ),
|
|
// badgeStyle: b.BadgeStyle(
|
|
// badgeColor: MyColors.primaryColor,
|
|
// padding: EdgeInsets.all(5),
|
|
// ),
|
|
// child: Icon(Icons.notifications_active),
|
|
// ),
|
|
// ),
|
|
// 10.width,
|
|
],
|
|
).toViewOnly(context, onTap: () {
|
|
navigateWithName(context, AppRoutes.loginWithPassword, arguments: false);
|
|
}),
|
|
body: SizedBox(
|
|
width: double.infinity,
|
|
height: double.infinity,
|
|
child: RefreshIndicator(
|
|
onRefresh: () async => await context.read<DashboardVmCustomer>().onRefresh(context),
|
|
child: ListView(
|
|
children: [
|
|
16.height,
|
|
ViewAllWidget(
|
|
title: LocaleKeys.upcoming_appointment.tr().toUpperCase(),
|
|
subTitle: LocaleKeys.view_all.tr(),
|
|
onSubtitleTapped: () {
|
|
context.read<DashboardVmCustomer>().onNavbarTapped(1);
|
|
context.read<AppointmentsVM>().applyFilterOnAppointmentsVMForCustomers(appointmentStatusEnum: AppointmentStatusEnum.allAppointments);
|
|
},
|
|
).horPaddingMain().toViewOnly(context, onTap: () {
|
|
navigateWithName(context, AppRoutes.loginWithPassword, arguments: false);
|
|
}),
|
|
Consumer<AppointmentsVM>(
|
|
builder: (BuildContext context, AppointmentsVM appointmentVM, Widget? child) {
|
|
// Show shimmer when loading
|
|
if (appointmentVM.state == ViewState.busy) {
|
|
return const AppointmentSliderShimmer();
|
|
}
|
|
// Show actual data when idle
|
|
return CommonAppointmentSliderWidget()
|
|
.toWhiteContainer(
|
|
width: double.infinity,
|
|
backgroundColor: Colors.transparent,
|
|
)
|
|
.margin(left: 21, right: 21)
|
|
.toViewOnly(context, onTap: () {
|
|
navigateWithName(context, AppRoutes.loginWithPassword, arguments: false);
|
|
});
|
|
},
|
|
),
|
|
|
|
// SERVICES SECTION
|
|
14.height,
|
|
Consumer(
|
|
builder: (BuildContext context, AppointmentsVM appointmentVM, Widget? child) {
|
|
// Show shimmer when loading
|
|
if (appointmentVM.state == ViewState.busy) {
|
|
return Column(
|
|
children: [
|
|
_buildServicesHeader(),
|
|
14.height,
|
|
const ServicesGridShimmer(),
|
|
],
|
|
);
|
|
}
|
|
// Show actual data when idle
|
|
if (appointmentVM.branchesCategoriesFilterOptions.isNotEmpty) {
|
|
// Filter services based on search query
|
|
final filteredServices = _filterServices(appointmentVM.branchesCategoriesFilterOptions);
|
|
|
|
return Column(
|
|
children: [
|
|
_buildServicesHeader().toViewOnly(context, onTap: () {
|
|
navigateWithName(context, AppRoutes.loginWithPassword, arguments: false);
|
|
}),
|
|
14.height,
|
|
filteredServices.isEmpty
|
|
? Padding(
|
|
padding: const EdgeInsets.all(40),
|
|
child: LocaleKeys.noServiceFound.tr().toText(
|
|
fontSize: 16,
|
|
color: Colors.grey,
|
|
textAlign: TextAlign.center,
|
|
),
|
|
)
|
|
: MyServicesCategoriesWidget(homeCategories: filteredServices).horPaddingMain(),
|
|
],
|
|
);
|
|
}
|
|
return const SizedBox();
|
|
},
|
|
),
|
|
|
|
// NEARBY BRANCHES SECTION
|
|
// 7.height,
|
|
// Consumer(
|
|
// builder: (BuildContext context, AppointmentsVM appointmentVM, Widget? child) {
|
|
// if (appointmentVM.state == ViewState.busy) {
|
|
// return Center(child: CircularProgressIndicator());
|
|
// }
|
|
//
|
|
// if (appointmentVM.myRecentBranches.isNotEmpty) {
|
|
// return Column(
|
|
// children: [
|
|
// ViewAllWidget(
|
|
// title: LocaleKeys.myRecentBranches.tr().toUpperCase(),
|
|
// subTitle: '',
|
|
// onSubtitleTapped: () {
|
|
// // context.read<DashboardVmCustomer>().onNavbarTapped(0);
|
|
// // context.read<AppointmentsVM>().applyFilterOnBranches(index: 0);
|
|
// },
|
|
// ).horPaddingMain(),
|
|
// MyRecentBranchesWidget(nearbyBranches: appointmentVM.myRecentBranches).horPaddingMain(),
|
|
// ],
|
|
// );
|
|
// }
|
|
// if (appointmentVM.nearbyBranches.isNotEmpty) {
|
|
// return Column(
|
|
// children: [
|
|
// ViewAllWidget(
|
|
// title: LocaleKeys.myNearbyBranches.tr().toUpperCase(),
|
|
// subTitle: LocaleKeys.view_all.tr(),
|
|
// onSubtitleTapped: () {
|
|
// context.read<DashboardVmCustomer>().onNavbarTapped(0);
|
|
// context.read<AppointmentsVM>().applyFilterOnBranches(index: 0);
|
|
// },
|
|
// ).horPaddingMain(),
|
|
// MyRecentBranchesWidget(nearbyBranches: appointmentVM.nearbyBranches).horPaddingMain(),
|
|
// ],
|
|
// );
|
|
// }
|
|
//
|
|
// return SizedBox();
|
|
// },
|
|
// ),
|
|
|
|
// ADS SECTION
|
|
Consumer(
|
|
builder: (BuildContext context, AdVM adVM, Widget? child) {
|
|
// Show shimmer when loading
|
|
if (adVM.state == ViewState.busy) {
|
|
return Column(
|
|
children: [
|
|
15.height,
|
|
ViewAllWidget(
|
|
title: LocaleKeys.my_active_Ads.tr().toUpperCase(),
|
|
subTitle: LocaleKeys.view_all.tr(),
|
|
onSubtitleTapped: () {},
|
|
).horPaddingMain(),
|
|
14.height,
|
|
const AdsListShimmer(itemCount: 2),
|
|
],
|
|
);
|
|
}
|
|
// Show actual data when idle
|
|
return Column(
|
|
children: [
|
|
if (adVM.myActiveAdsForHome.isNotEmpty) ...[
|
|
Column(
|
|
children: [
|
|
15.height,
|
|
ViewAllWidget(
|
|
title: LocaleKeys.my_active_Ads.tr().toUpperCase(),
|
|
subTitle: LocaleKeys.view_all.tr(),
|
|
onSubtitleTapped: () {
|
|
context.read<DashboardVmCustomer>().onNavbarTapped(3);
|
|
context.read<AdVM>().updateIsExploreAds(false);
|
|
}).horPaddingMain().toViewOnly(context, onTap: () {
|
|
navigateWithName(context, AppRoutes.loginWithPassword, arguments: false);
|
|
}),
|
|
AdsListWidget(
|
|
isDraftAds: false,
|
|
shouldShowAdStatus: true,
|
|
isAdsFragment: false,
|
|
adsList: adVM.myActiveAdsForHome,
|
|
scrollPhysics: const NeverScrollableScrollPhysics(),
|
|
hasMoreData: adVM.isExploreAdsTapped ? adVM.hasMoreDataForExploreAds : adVM.hasMoreDataForMyAds,
|
|
).toViewOnly(context, onTap: () {
|
|
navigateWithName(context, AppRoutes.loginWithPassword, arguments: false);
|
|
}),
|
|
],
|
|
)
|
|
],
|
|
// RECOMMENDED ADS SECTION - COMMENTED OUT
|
|
// if (adVM.exploreAds.isNotEmpty) ...[
|
|
// Column(
|
|
// children: [
|
|
// 15.height,
|
|
// ViewAllWidget(
|
|
// title: LocaleKeys.myRecommendedAds.tr().toUpperCase(),
|
|
// subTitle: LocaleKeys.view_all.tr(),
|
|
// onSubtitleTapped: () {
|
|
// context.read<DashboardVmCustomer>().onNavbarTapped(3);
|
|
// context.read<AdVM>().updateIsExploreAds(true);
|
|
// context.read<AdVM>().applyFilterOnExploreAds(vehicleBrandId: 0);
|
|
// },
|
|
// ).horPaddingMain(),
|
|
// AdsListWidget(
|
|
// isDraftAds: false,
|
|
// shouldShowAdStatus: false,
|
|
// adsList: adVM.exploreAds.length >= 3 ? adVM.exploreAds.take(3).toList() : adVM.exploreAds,
|
|
// isAdsFragment: false,
|
|
// scrollPhysics: NeverScrollableScrollPhysics(),
|
|
// hasMoreData: adVM.isExploreAdsTapped ? adVM.hasMoreDataForExploreAds : adVM.hasMoreDataForMyAds,
|
|
// ),
|
|
// ],
|
|
// )
|
|
// ]
|
|
],
|
|
);
|
|
},
|
|
),
|
|
20.height,
|
|
],
|
|
),
|
|
),
|
|
),
|
|
);
|
|
}
|
|
}
|