317 lines
13 KiB
Dart
317 lines
13 KiB
Dart
import 'package:flutter/material.dart';
|
|
import 'package:flutter_svg/flutter_svg.dart';
|
|
import 'package:grocery_app/src/common_widget/network_image.dart';
|
|
import 'package:grocery_app/src/logic/provider/home_provider.dart';
|
|
import 'package:grocery_app/utils/constants/assets_constant.dart';
|
|
import 'package:grocery_app/utils/constants/color_constant.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 FruitVeggieDetail extends StatefulWidget {
|
|
const FruitVeggieDetail({super.key});
|
|
|
|
@override
|
|
State<FruitVeggieDetail> createState() => _FruitVeggieDetailState();
|
|
}
|
|
|
|
class _FruitVeggieDetailState extends State<FruitVeggieDetail> {
|
|
@override
|
|
void initState() {
|
|
Provider.of<ProductProvider>(context, listen: false)
|
|
.getAllcategory(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: const Text(
|
|
"Vegetables & Fruits",
|
|
style: TextStyle(
|
|
fontSize: 20,
|
|
fontWeight: FontWeight.w700,
|
|
),
|
|
),
|
|
actions: [
|
|
Padding(
|
|
padding: const EdgeInsets.only(right: 10),
|
|
child: InkWell(
|
|
onTap: () {},
|
|
child: Icon(
|
|
MdiIcons.magnify,
|
|
size: 35,
|
|
),
|
|
),
|
|
)
|
|
],
|
|
),
|
|
body: Row(
|
|
children: [filterCategory(), productWidget()],
|
|
),
|
|
);
|
|
}
|
|
|
|
Widget productWidget()
|
|
{
|
|
return Consumer<ProductProvider>(builder: (context, provider, child) {
|
|
if (provider.isLoadingg) {
|
|
return Padding(
|
|
padding: const EdgeInsets.only(left: 120),
|
|
child: CircularProgressIndicator(),
|
|
);
|
|
} else if (provider.products.isEmpty) {
|
|
return Padding(
|
|
padding: const EdgeInsets.only(left: 80),
|
|
child: Center(child: Text('No products available')),
|
|
);
|
|
} else {
|
|
return Expanded(
|
|
child: Padding(
|
|
padding: const EdgeInsets.only(left: 10, right: 10),
|
|
child: LayoutBuilder(
|
|
builder: (context, constraints) {
|
|
final itemWidth = (constraints.maxWidth - 20) / 2;
|
|
final itemHeight = itemWidth * 1.5;
|
|
|
|
return GridView.builder(
|
|
itemCount: provider.products.length,
|
|
gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
|
|
crossAxisCount: 2,
|
|
childAspectRatio: itemWidth / itemHeight,
|
|
crossAxisSpacing: 10,
|
|
mainAxisSpacing: 10,
|
|
),
|
|
itemBuilder: (context, index) {
|
|
var product = provider.products[index];
|
|
return Container(
|
|
height: itemHeight,
|
|
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: itemWidth *
|
|
0.6, // Adjust height for image container
|
|
width: itemWidth,
|
|
decoration: BoxDecoration(
|
|
color: APPCOLOR.bgGrey,
|
|
borderRadius: BorderRadius.circular(15),
|
|
),
|
|
child: Stack(
|
|
alignment: Alignment.center,
|
|
children: [
|
|
AppNetworkImage(
|
|
height: 70,
|
|
width: 70,
|
|
imageUrl: product
|
|
.productImages!.first.url ??
|
|
"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),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
const SizedBox(height: 5),
|
|
Text(
|
|
product.name ?? " ",
|
|
textAlign: TextAlign.left,
|
|
maxLines: 2,
|
|
overflow: TextOverflow.ellipsis,
|
|
style: context.customMedium(
|
|
APPCOLOR.balck1A1A1A, 14),
|
|
),
|
|
const SizedBox(height: 5),
|
|
Text(
|
|
product.unit ?? " ",
|
|
textAlign: TextAlign.left,
|
|
maxLines: 1,
|
|
overflow: TextOverflow.ellipsis,
|
|
style: context.customMedium(
|
|
Colors.grey.withOpacity(0.8),
|
|
12,
|
|
),
|
|
),
|
|
const SizedBox(height: 3),
|
|
Row(
|
|
children: [
|
|
Column(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
Text(
|
|
"\$${product.discountPrice ?? " "}",
|
|
textAlign: TextAlign.left,
|
|
maxLines: 1,
|
|
overflow: TextOverflow.ellipsis,
|
|
style: context.customSemiBold(
|
|
Colors.black, 12),
|
|
),
|
|
const SizedBox(width: 5),
|
|
Text(
|
|
"\$${product.basePrice ?? " "}",
|
|
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: 40,
|
|
width: 60,
|
|
decoration: BoxDecoration(
|
|
color: APPCOLOR.lightGreen,
|
|
borderRadius: BorderRadius.circular(5),
|
|
),
|
|
child: Center(
|
|
child: Text(
|
|
'Add',
|
|
style: context.customRegular(
|
|
Colors.white, 12),
|
|
),
|
|
),
|
|
),
|
|
),
|
|
),
|
|
],
|
|
),
|
|
],
|
|
),
|
|
),
|
|
);
|
|
},
|
|
);
|
|
},
|
|
),
|
|
),
|
|
);
|
|
}
|
|
});
|
|
}
|
|
|
|
Widget filterCategory() {
|
|
final activeIndexProvider = Provider.of<ProductProvider>(context);
|
|
return Consumer<ProductProvider>(builder: (context, provider, child) {
|
|
if (provider.iscategroyloading) {
|
|
return Center(child: CircularProgressIndicator());
|
|
} else if (provider.categoryList.isEmpty) {
|
|
return Center(child: Text('No products available'));
|
|
} else {
|
|
return Container(
|
|
decoration: const BoxDecoration(color: Colors.white),
|
|
width: 100,
|
|
child: ListView.builder(
|
|
itemCount: provider.categoryList.length,
|
|
scrollDirection: Axis.vertical,
|
|
itemBuilder: (context, index) {
|
|
var category = provider.categoryList[index];
|
|
return InkWell(
|
|
onTap: () {
|
|
provider.isLoadingg = true;
|
|
provider.gettAllProduct(context, "/category/${category.id}");
|
|
activeIndexProvider.setActiveIndex(index);
|
|
},
|
|
child: SizedBox(
|
|
height: 150,
|
|
child: Column(
|
|
children: [
|
|
Row(
|
|
children: [
|
|
Expanded(
|
|
child: Center(
|
|
child: Container(
|
|
decoration: BoxDecoration(
|
|
color:
|
|
activeIndexProvider.activeIndex == index
|
|
? Colors.greenAccent.withOpacity(0.1)
|
|
: APPCOLOR.bgGrey,
|
|
borderRadius: BorderRadius.circular(5),
|
|
),
|
|
child: AppNetworkImage(
|
|
height: 80,
|
|
width: 80,
|
|
imageUrl: category.image ??
|
|
'https://i.pinimg.com/originals/a5/f3/5f/a5f35fb23e942809da3df91b23718e8d.png',
|
|
backGroundColor: APPCOLOR.bgGrey,
|
|
radius: 10,
|
|
),
|
|
),
|
|
),
|
|
),
|
|
Container(
|
|
width: 3,
|
|
height: 100,
|
|
color: activeIndexProvider.activeIndex == index
|
|
? APPCOLOR.lightGreen
|
|
: Colors.transparent,
|
|
),
|
|
],
|
|
),
|
|
Text(
|
|
category.name,
|
|
textAlign: TextAlign.center,
|
|
maxLines: 2,
|
|
overflow: TextOverflow.ellipsis,
|
|
style: activeIndexProvider.activeIndex == index
|
|
? context.customExtraBold(APPCOLOR.balck1A1A1A, 14)
|
|
: context.customMedium(APPCOLOR.balck1A1A1A, 14),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
);
|
|
},
|
|
),
|
|
);
|
|
}
|
|
});
|
|
}
|
|
}
|