addtocart

This commit is contained in:
2025-01-30 18:59:34 +05:30
parent 12056d7521
commit 48fab4a1c0
21 changed files with 1662 additions and 742 deletions

View File

@@ -1,15 +1,24 @@
import 'package:flutter/material.dart';
import 'package:flutter/widgets.dart';
import 'package:flutter_animate/flutter_animate.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:flutter_svg/svg.dart';
import 'package:gap/gap.dart';
import 'package:grocery_app/src/common_widget/network_image.dart';
import 'package:grocery_app/src/common_widget/textfield_widget.dart';
import 'package:grocery_app/src/logic/provider/addTocart_provider.dart';
import 'package:grocery_app/src/logic/provider/home_provider.dart';
import 'package:grocery_app/src/ui/bestdeal/bestdeal_screen.dart';
import 'package:grocery_app/src/ui/cart/cart_item.dart';
import 'package:grocery_app/src/ui/widgets/custom_icon_button.dart';
import 'package:grocery_app/src/ui/widgets/elevated_button.dart';
import 'package:grocery_app/utils/constants/assets_constant.dart';
import 'package:grocery_app/utils/constants/color_constant.dart';
import 'package:grocery_app/utils/constants/string_constant.dart';
import 'package:grocery_app/utils/extensions/extensions.dart';
import 'package:grocery_app/utils/extensions/uicontext.dart';
import 'package:material_design_icons_flutter/material_design_icons_flutter.dart';
import 'package:provider/provider.dart';
class Mycart extends StatefulWidget {
const Mycart({super.key});
@@ -19,27 +28,22 @@ class Mycart extends StatefulWidget {
}
class _MycartState extends State<Mycart> {
@override
void initState() {
Provider.of<AddtocartProvider>(context, listen: false)
.getItemCards(context);
Provider.of<AddtocartProvider>(context, listen: false)
.getCurrentLocation(context);
super.initState();
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
backgroundColor: Colors.transparent,
centerTitle: true,
// leading: Center(
// child: SizedBox(
// height: 20,
// width: 20,
// child: InkWell(
// onTap: () {
// Navigator.of(context).pop();
// },
// child: SvgPicture.asset(
// APPASSETS.back,
// height: 20,
// width: 20,
// )),
// ),
// ),
title: Center(
child: const Text(
'Cart 🛒',
@@ -49,194 +53,457 @@ class _MycartState extends State<Mycart> {
),
),
),
// actions: [
// InkWell(
// onTap: () {},
// child: Icon(
// MdiIcons.magnify,
// size: 35,
// ),
// )
// ],
),
body: Column(
children: [
Expanded(
child: ListView.separated(
separatorBuilder: (_, index) => Padding(
padding: EdgeInsets.only(top: 12.h, bottom: 24.h),
child: const Divider(thickness: 1),
),
itemCount: 10,
itemBuilder: (context, index) => CartItem(
//product: controller.products[index],
)
.animate(delay: (100 * index).ms)
.fade()
.slideX(
duration: 300.ms,
begin: -1,
curve: Curves.easeInSine,
),
),
),
Row(
mainAxisAlignment: MainAxisAlignment.center,
body: SingleChildScrollView(
child: Padding(
padding: const EdgeInsets.all(8.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisAlignment: MainAxisAlignment.start,
children: [
Expanded(
cartItems(),
Padding(
padding: const EdgeInsets.all(8.0),
child: Text(
"Best Deal",
"Before you checkout",
style: context.customExtraBold(Colors.black, 18),
),
),
InkWell(
onTap: () {
Navigator.of(context).push(MaterialPageRoute(
builder: (context) {
return const BestDealScreen();
},
));
},
child: Text(
"See All",
style: context.customMedium(APPCOLOR.lightGreen, 16),
),
relatedProduct(),
const SizedBox(
height: 15,
),
Divider(),
cartPlace(),
],
),
const SizedBox(
height: 15,
),
SizedBox(
height: 222,
child: ListView.builder(
itemCount: 5,
scrollDirection: Axis.horizontal,
itemBuilder: (context, index) {
return Padding(
padding: const EdgeInsets.only(right: 10, bottom: 5, top: 5),
child: Container(
height: 215,
width: 150,
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(15),
boxShadow: [
BoxShadow(
color: Colors.grey.withOpacity(0.1),
blurRadius: 1,
offset: const Offset(5, 5),
),
]),
child: Padding(
padding: const EdgeInsets.all(5),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
),
),
);
}
Widget relatedProduct() {
return SizedBox(
height: 222,
child: ListView.builder(
itemCount: 5,
scrollDirection: Axis.horizontal,
itemBuilder: (context, index) {
return Padding(
padding: const EdgeInsets.only(right: 10, bottom: 5, top: 5),
child: Container(
height: 215,
width: 150,
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(15),
boxShadow: [
BoxShadow(
color: Colors.grey.withOpacity(0.1),
blurRadius: 1,
offset: const Offset(5, 5),
),
]),
child: Padding(
padding: const EdgeInsets.all(5),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Container(
height: 100,
width: 150,
decoration: BoxDecoration(
color: APPCOLOR.bgGrey,
borderRadius: BorderRadius.circular(15)),
child: const Stack(
alignment: Alignment.center,
children: [
Container(
height: 100,
width: 150,
decoration: BoxDecoration(
color: APPCOLOR.bgGrey,
borderRadius: BorderRadius.circular(15)),
child: const Stack(
alignment: Alignment.center,
children: [
AppNetworkImage(
height: 70,
width: 70,
imageUrl:
"https://5.imimg.com/data5/SELLER/Default/2024/2/385126988/OL/DA/VW/8627346/1l-fortune-sunflower-oil.jpg",
backGroundColor: Colors.transparent),
Positioned(
right: 5,
top: 5,
child: Icon(Icons.favorite_border))
],
AppNetworkImage(
height: 70,
width: 70,
imageUrl:
"https://5.imimg.com/data5/SELLER/Default/2024/2/385126988/OL/DA/VW/8627346/1l-fortune-sunflower-oil.jpg",
backGroundColor: Colors.transparent),
Positioned(
right: 5,
top: 5,
child: Icon(Icons.favorite_border))
],
),
),
Text(
"Fortune Arhar Dal (Toor Dal)",
textAlign: TextAlign.left,
maxLines: 2,
overflow: TextOverflow.ellipsis,
style: context.customMedium(APPCOLOR.balck1A1A1A, 14),
),
const SizedBox(
height: 5,
),
Text(
"500 ML",
textAlign: TextAlign.left,
maxLines: 1,
overflow: TextOverflow.ellipsis,
style: context.customMedium(
Colors.grey.withOpacity(0.8), 12),
),
const SizedBox(
height: 3,
),
Row(
children: [
Expanded(
child: Row(
children: [
Text(
"\$12",
textAlign: TextAlign.left,
maxLines: 1,
overflow: TextOverflow.ellipsis,
style: context.customSemiBold(Colors.black, 12),
),
const SizedBox(
width: 5,
),
Text(
"\$14",
textAlign: TextAlign.left,
maxLines: 1,
overflow: TextOverflow.ellipsis,
style: context
.customMedium(
Colors.grey.withOpacity(0.8), 12)
.copyWith(
decoration: TextDecoration.lineThrough,
),
),
],
)),
Expanded(
child: Align(
alignment: Alignment.centerRight,
child: Container(
height: 30,
width: 50,
decoration: BoxDecoration(
color: APPCOLOR.lightGreen,
borderRadius: BorderRadius.circular(5),
),
child: Center(
child: Text(
'Add',
style: context.customRegular(Colors.white, 12),
)),
),
),
Text(
"Fortune Arhar Dal (Toor Dal)",
textAlign: TextAlign.left,
maxLines: 2,
overflow: TextOverflow.ellipsis,
style:
context.customMedium(APPCOLOR.balck1A1A1A, 14),
),
const SizedBox(
height: 5,
),
Text(
"500 ML",
textAlign: TextAlign.left,
maxLines: 1,
overflow: TextOverflow.ellipsis,
style: context.customMedium(
Colors.grey.withOpacity(0.8), 12),
),
const SizedBox(
height: 3,
),
Row(
children: [
Expanded(
child: Row(
children: [
Text(
"\$12",
textAlign: TextAlign.left,
maxLines: 1,
overflow: TextOverflow.ellipsis,
style: context.customSemiBold(
Colors.black, 12),
),
const SizedBox(
width: 5,
),
Text(
"\$14",
textAlign: TextAlign.left,
maxLines: 1,
overflow: TextOverflow.ellipsis,
style: context
.customMedium(
Colors.grey.withOpacity(0.8), 12)
.copyWith(
decoration:
TextDecoration.lineThrough,
),
),
],
)),
Expanded(
child: Align(
alignment: Alignment.centerRight,
child: Container(
height: 30,
width: 50,
decoration: BoxDecoration(
color: APPCOLOR.lightGreen,
borderRadius: BorderRadius.circular(5),
),
child: Center(
child: Text(
'Add',
style: context.customRegular(
Colors.white, 12),
)),
),
)
],
),
],
),
),
),
);
},
),
);
}
Widget cartItems() {
return Consumer<AddtocartProvider>(builder: (context, provider, child) {
if (provider.isLoaddcartItem) {
return Padding(
padding: const EdgeInsets.only(left: 120),
child: CircularProgressIndicator(),
);
} else if (provider.allitem != null) {
return Center(child: Text('🛒 Your Front Shop Cart is empty'));
} else {
return ListView.separated(
shrinkWrap: true, // Prevents internal scrolling
physics: NeverScrollableScrollPhysics(), // Disables inner scroll
separatorBuilder: (_, index) => Padding(
padding: EdgeInsets.only(top: 12.h, bottom: 24.h),
child: const Divider(thickness: 1),
),
itemCount: provider.allitem.items!.length,
itemBuilder: (context, index) => Padding(
padding: EdgeInsets.symmetric(horizontal: 24.w),
child: Row(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Container(
decoration: BoxDecoration(
color: Colors.greenAccent.withOpacity(0.1),
borderRadius: BorderRadius.circular(5),
),
child: AppNetworkImage(
width: 50.w,
height: 40.h,
imageUrl:
'https://i.pinimg.com/originals/a5/f3/5f/a5f35fb23e942809da3df91b23718e8d.png',
backGroundColor: APPCOLOR.bgGrey,
radius: 10,
),
),
// Image.asset(product.image, width: 50.w, height: 40.h),
16.horizontalSpace,
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
"Vegitables and Fruits",
textAlign: TextAlign.center,
maxLines: 2,
overflow: TextOverflow.ellipsis,
style: context.customMedium(APPCOLOR.balck1A1A1A, 14),
),
5.verticalSpace,
Text(
'1kg, 10\$',
style: context.customMedium(APPCOLOR.balck1A1A1A, 14),
),
],
),
const Spacer(),
Row(
children: [
CustomIconButton(
width: 20.w,
height: 20.h,
onPressed: () {},
icon: SvgPicture.asset(
APPASSETS.removeIcon,
fit: BoxFit.none,
),
backgroundColor: APPCOLOR.appGreen,
),
16.horizontalSpace,
Text(
"10",
style: context.customMedium(APPCOLOR.balck1A1A1A, 14),
),
16.horizontalSpace,
CustomIconButton(
width: 20.w,
height: 20.h,
onPressed: () {},
icon: SvgPicture.asset(
APPASSETS.addIcon,
fit: BoxFit.none,
),
backgroundColor: APPCOLOR.appGreen,
),
],
)
],
),
).animate(delay: (100 * index).ms).fade().slideX(
duration: 300.ms,
begin: -1,
curve: Curves.easeInSine,
),
);
}
});
}
Widget cartPlace() {
return Consumer<AddtocartProvider>(builder: (context, provider, child) {
print("jdhfgkdfkjg ${provider.allitem.createdAt}");
if (provider.isLoaddcartItem) {
return Padding(
padding: const EdgeInsets.only(left: 120),
child: CircularProgressIndicator(),
);
} else if (provider.allitem == null) {
return Center(child: Text('🛒 Your Front Shop Cart is empty'));
} else if (provider.allitem.items != null) {
return Center(
child: ElevatedButton(
style: ElevatedButton.styleFrom(backgroundColor: Colors.green),
onPressed: () {},
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text('Continue Shopping',
style: TextStyle(fontSize: 16, color: Colors.white))
],
),
));
} else {
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
ListTile(
leading: Icon(Icons.local_offer, color: Colors.green),
title: Text('APPLY COUPON',
style: TextStyle(fontWeight: FontWeight.bold)),
trailing: Icon(Icons.arrow_forward_ios),
onTap: () {},
),
SummaryRow(label: 'Item Total', value: '\$24'),
SummaryRow(label: 'Discount', value: '\$2'),
SummaryRow(label: 'Delivery Free', value: 'Free', isGreen: true),
Divider(),
SummaryRow(label: 'Grand Total', value: '\$22', isBold: true),
ListTile(
leading: Icon(Icons.home, color: Colors.green),
title: provider.isDeliverable
? Text('Delivering to : ${provider.pinCode}')
: Text(
'Out Of Stock : ${provider.pinCode}',
style: TextStyle(color: Colors.red),
),
trailing: Text('Change', style: TextStyle(color: Colors.blue)),
onTap: () {
_showBottomSheet(context);
},
),
SizedBox(height: 10),
ElevatedButton(
style: ElevatedButton.styleFrom(backgroundColor: Colors.green),
onPressed: () {},
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text('\$22 Place Order', style: TextStyle(fontSize: 16))
],
),
),
],
);
}
});
}
void _showBottomSheet(BuildContext context) {
TextEditingController checkPinCode = TextEditingController();
showModalBottomSheet(
context: context,
builder: (BuildContext context) {
return Consumer<AddtocartProvider>(
builder: (context, pinProvider, child) {
return Container(
padding: EdgeInsets.all(20.w),
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
Form(
child: Container(
width: 200.h,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(
8), // Border radius for container
border: Border.all(color: Colors.grey, width: 1),
), // Border for the container
child: Padding(
padding: const EdgeInsets.all(8.0),
child: Row(
children: [
Expanded(
flex: 2,
child: Container(
height: 20.h,
child: TextFormField(
controller: checkPinCode,
keyboardType: TextInputType.phone,
decoration: InputDecoration(
hintText: 'Enter PIN',
border: InputBorder
.none, // Remove the inner border
),
)
],
validator: (value) {
if (value == null || value.isEmpty) {
return 'Cannot be empty';
} else if (!RegExp(r'^[0-9]{4,6}$')
.hasMatch(value)) {
return 'Enter a valid PIN (4-6 digits)';
}
return null;
},
),
),
),
InkWell(
onTap: () {
pinProvider.checkPin(context, checkPinCode.text);
},
child: Expanded(
flex: 1,
child: Text(
"Check PIN",
style: TextStyle(
fontSize: 15,
fontWeight: FontWeight.bold,
color: Colors.black),
)),
),
],
),
),
),
);
},
),
Gap(10.h),
// if (!pinProvider.isMatch)
Text(
'pin code invoild',
style: TextStyle(color: Colors.red),
),
Gap(10.h),
Center(
child: SizedBox(
child: SizedBox(
width: double.infinity,
child: ButtonElevated(
text: 'Submit',
onPressed: () {},
backgroundColor: APPCOLOR.appGreen),
),
),
),
],
),
),
);
});
},
);
}
}
class SummaryRow extends StatelessWidget {
final String label, value;
final bool isGreen, isBold;
SummaryRow(
{required this.label,
required this.value,
this.isGreen = false,
this.isBold = false});
@override
Widget build(BuildContext context) {
return Padding(
padding: EdgeInsets.symmetric(vertical: 4.0),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text(label,
style: TextStyle(
fontSize: 16,
fontWeight: isBold ? FontWeight.bold : FontWeight.normal)),
Text(value,
style: TextStyle(
fontSize: 16,
fontWeight: isBold ? FontWeight.bold : FontWeight.normal,
color: isGreen ? Colors.green : Colors.black)),
],
),
);