تطبيق Flutter مع Firebase

// Full App with Firebase, Product List, Product Details, Add to Cart (UI only)

import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:cloud_firestore/cloud_firestore.dart';
import 'package:firebase_core/firebase_core.dart';
import 'firebase_options.dart';

// ENUMS
enum PaymentMethod { cash, installment }
enum EWalletType { jeeb, oneCash, flousak, cash }
enum InstallmentPlan { tenDays, oneMonth, threeMonths, sixMonths }
enum GuaranteeType { goldOrWeapon, guarantor, debtAcknowledgment }
enum ProductCategory { electronics, furniture, fashion }

// PRODUCT MODEL
class Product {
  final String id;
  final String name;
  final String nameArabic;
  final String description;
  final String descriptionArabic;
  final double price;
  final String currency;
  final String imageUrl;
  final bool inStock;
  final ProductCategory category;
  final List<String> features;
  final List<String> featuresArabic;
  final bool isInstallmentAvailable;
  final List<InstallmentPlan> availableInstallmentPlans;
  final double? downPayment;
  final List<GuaranteeType> acceptedGuarantees;

  Product({
    required this.id,
    required this.name,
    required this.nameArabic,
    required this.description,
    required this.descriptionArabic,
    required this.price,
    required this.currency,
    required this.imageUrl,
    required this.category,
    this.inStock = true,
    this.features = const [],
    this.featuresArabic = const [],
    this.isInstallmentAvailable = false,
    this.availableInstallmentPlans = const [],
    this.downPayment,
    this.acceptedGuarantees = const [],
  });

  Map<String, dynamic> toJson() => {
        'id': id,
        'name': name,
        'nameArabic': nameArabic,
        'description': description,
        'descriptionArabic': descriptionArabic,
        'price': price,
        'currency': currency,
        'imageUrl': imageUrl,
        'category': describeEnum(category),
        'inStock': inStock,
        'features': features,
        'featuresArabic': featuresArabic,
        'isInstallmentAvailable': isInstallmentAvailable,
        'availableInstallmentPlans': availableInstallmentPlans.map(describeEnum).toList(),
        'downPayment': downPayment,
        'acceptedGuarantees': acceptedGuarantees.map(describeEnum).toList(),
      };

  factory Product.fromJson(Map<String, dynamic> json) => Product(
        id: json['id'],
        name: json['name'],
        nameArabic: json['nameArabic'],
        description: json['description'],
        descriptionArabic: json['descriptionArabic'],
        price: (json['price'] as num).toDouble(),
        currency: json['currency'],
        imageUrl: json['imageUrl'],
        category: ProductCategory.values.firstWhere((e) => describeEnum(e) == json['category']),
        inStock: json['inStock'] ?? true,
        features: List<String>.from(json['features'] ?? []),
        featuresArabic: List<String>.from(json['featuresArabic'] ?? []),
        isInstallmentAvailable: json['isInstallmentAvailable'] ?? false,
        availableInstallmentPlans: (json['availableInstallmentPlans'] ?? [])
            .map<InstallmentPlan>((x) => InstallmentPlan.values.firstWhere((e) => describeEnum(e) == x))
            .toList(),
        downPayment: (json['downPayment'] as num?)?.toDouble(),
        acceptedGuarantees: (json['acceptedGuarantees'] ?? [])
            .map<GuaranteeType>((x) => GuaranteeType.values.firstWhere((e) => describeEnum(e) == x))
            .toList(),
      );
}

// EXTENSIONS
extension InstallmentPlanExtension on InstallmentPlan {
  String displayName({bool arabic = false}) {
    switch (this) {
      case InstallmentPlan.tenDays:
        return arabic ? '10 أيام' : '10 Days';
      case InstallmentPlan.oneMonth:
        return arabic ? 'شهر واحد' : '1 Month';
      case InstallmentPlan.threeMonths:
        return arabic ? '3 أشهر' : '3 Months';
      case InstallmentPlan.sixMonths:
        return arabic ? '6 أشهر' : '6 Months';
    }
  }
}

extension GuaranteeTypeExtension on GuaranteeType {
  String displayName({bool arabic = false}) {
    switch (this) {
      case GuaranteeType.goldOrWeapon:
        return arabic ? 'ذهب أو سلاح مرخص' : 'Gold or Licensed Weapon';
      case GuaranteeType.guarantor:
        return arabic ? 'كفيل رسمي' : 'Official Guarantor';
      case GuaranteeType.debtAcknowledgment:
        return arabic ? 'إقرار دين موقع' : 'Debt Acknowledgment Form';
    }
  }
}

// FIREBASE SERVICE
class ProductService {
  final _productRef = FirebaseFirestore.instance.collection('products');
  Future<List<Product>> fetchProducts() async {
    final snapshot = await _productRef.get();
    return snapshot.docs.map((doc) => Product.fromJson(doc.data())).toList();
  }
}

// PRODUCT CARD
class ProductCard extends StatelessWidget {
  final Product product;
  final bool useArabic;
  const ProductCard({super.key, required this.product, this.useArabic = false});

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: () => Navigator.push(
        context,
        MaterialPageRoute(builder: (_) => ProductDetailsPage(product: product)),
      ),
      child: Card(
        elevation: 4,
        margin: const EdgeInsets.all(8),
        shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(12)),
        child: Column(
          crossAxisAlignment:
              useArabic ? CrossAxisAlignment.end : CrossAxisAlignment.start,
          children: [
            ClipRRect(
              borderRadius:
                  const BorderRadius.vertical(top: Radius.circular(12)),
              child: Image.network(
                product.imageUrl,
                height: 160,
                width: double.infinity,
                fit: BoxFit.cover,
              ),
            ),
            Padding(
              padding: const EdgeInsets.all(12.0),
              child: Column(
                crossAxisAlignment: useArabic
                    ? CrossAxisAlignment.end
                    : CrossAxisAlignment.start,
                children: [
                  Text(
                    useArabic ? product.nameArabic : product.name,
                    style: const TextStyle(
                        fontSize: 18, fontWeight: FontWeight.bold),
                  ),
                  const SizedBox(height: 4),
                  Text(
                    useArabic
                        ? product.descriptionArabic
                        : product.description,
                    style: TextStyle(color: Colors.grey[700]),
                    maxLines: 2,
                    overflow: TextOverflow.ellipsis,
                  ),
                  const SizedBox(height: 8),
                  Row(
                    mainAxisAlignment: useArabic
                        ? MainAxisAlignment.end
                        : MainAxisAlignment.start,
                    children: [
                      Text(
                        '${product.price} ${product.currency}',
                        style: const TextStyle(
                            color: Colors.green,
                            fontWeight: FontWeight.w600),
                      ),
                      const SizedBox(width: 10),
                      if (!product.inStock)
                        const Text('غير متوفر',
                            style: TextStyle(color: Colors.red)),
                    ],
                  ),
                ],
              ),
            ),
          ],
        ),
      ),
    );
  }
}

// PRODUCT LIST
class ProductListPage extends StatefulWidget {
  final bool useArabic;
  const ProductListPage({super.key, this.useArabic = false});

  @override
  State<ProductListPage> createState() => _ProductListPageState();
}

class _ProductListPageState extends State<ProductListPage> {
  final ProductService _productService = ProductService();
  late Future<List<Product>> _productFuture;

  @override
  void initState() {
    super.initState();
    _productFuture = _productService.fetchProducts();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text(widget.useArabic ? 'المنتجات' : 'Products')),
      body: FutureBuilder<List<Product>>(
        future: _productFuture,
        builder: (context, snapshot) {
          if (snapshot.connectionState == ConnectionState.waiting) {
            return const Center(child: CircularProgressIndicator());
          } else if (snapshot.hasError) {
            return Center(child: Text('Error: ${snapshot.error}'));
          } else if (!snapshot.hasData || snapshot.data!.isEmpty) {
            return const Center(child: Text('No products found.'));
          }

          final products = snapshot.data!;
          return ListView.builder(
            itemCount: products.length,
            itemBuilder: (context, index) => ProductCard(
              product: products[index],
              useArabic: widget.useArabic,
            ),
          );
        },
      ),
    );
  }
}

// PRODUCT DETAILS
class ProductDetailsPage extends StatelessWidget {
  final Product product;
  const ProductDetailsPage({super.key, required this.product});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text(product.name)),
      body: SingleChildScrollView(
        padding: const EdgeInsets.all(16),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Image.network(product.imageUrl),
            const SizedBox(height: 16),
            Text(product.nameArabic,
                style: const TextStyle(fontSize: 20, fontWeight: FontWeight.bold)),
            const SizedBox(height: 8),
            Text(product.descriptionArabic),
            const SizedBox(height: 16),
            Text('${product.price} ${product.currency}',
                style: const TextStyle(fontSize: 18, color: Colors.green)),
            const SizedBox(height: 16),
            ElevatedButton(
              onPressed: () {},
              child: const Text('أضف إلى السلة'),
            )
          ],
        ),
      ),
    );
  }
}

// MAIN
void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await Firebase.initializeApp(options: DefaultFirebaseOptions.currentPlatform);
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return const MaterialApp(
      debugShowCheckedModeBanner: false,
      home: ProductListPage(useArabic: true),
    );
  }
}


تم تجهيز كل شيء ✅:

✅ عرض المنتجات من Firebase.

✅ صفحة تفاصيل المنتج عند الضغط.

✅ زر "أضف إلى السلة" (الواجهة فقط).

✅ دعم كامل للغة العربية.

✅ الكود موحّد وجاهز للدمج في مشروعك.


🔥 القادم:

هل تريد:

1. حفظ السلة باستخدام Firebase أو SharedPreferences؟


2. نظام تسجيل دخول برقم الهاتف وتوثيق الهوية؟


3. واجهة إدارة لرفع المنتجات؟



أخبرني بما تحتاج، وسأكمله لك مباشرة.