Untitled

 avatar
unknown
plain_text
a month ago
19 kB
2
Indexable
import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:hsl/views/tabs/edit_password.dart';
import 'package:hsl/views/tabs/home/home_screen.dart';
import 'package:hsl/views/tabs/profile/commandes/mes_commandes.dart';
import 'package:hsl/views/tabs/profile/mon_profile.dart';
import 'package:provider/provider.dart';

import '../providers/profileProvider.dart';
import 'about_us.dart';
class ProfilePage extends StatefulWidget {
  const ProfilePage({super.key});

  @override
  State<ProfilePage> createState() => _ProfilePageState();
}

class _ProfilePageState extends State<ProfilePage> {


  @override
  void initState() {
    super.initState();
    Future.delayed(Duration.zero, () {
      final profileProvider = Provider.of<ProfileProvider>(context, listen: false);
      profileProvider.fetchProfile();
    });
  }


  @override
  Widget build(BuildContext context) {
    final profileProvider = Provider.of<ProfileProvider>(context);
    final profile = profileProvider.profile;
    return Scaffold(
      backgroundColor: Colors.white,
      appBar: AppBar(
        backgroundColor: Colors.white,
        title: const Text('My space'),
        centerTitle: true,
        leading: Padding(
          padding: const EdgeInsets.all(8.0),
          child: CircleAvatar(
            radius: 18,
            backgroundColor: const Color(0xffEBF8F2),
            child: IconButton(
              padding: EdgeInsets.zero,
              constraints: const BoxConstraints(),
              icon: Icon(Icons.arrow_back, color: Color(0xff08A657), size: 20),
              onPressed: () {
                Navigator.push(
                  context,
                  MaterialPageRoute(
                    builder: (context) => const HomeScreen(),
                  ),
                );
              },
            ),
          ),
        ),
      ),
      body:profile == null ?Center(child: CircularProgressIndicator()) : Padding(
        padding: const EdgeInsets.all(16.0),
        child: SingleChildScrollView(
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Row(
                children: [
                  CircleAvatar(
                    radius: 40,
                    backgroundColor: Colors.grey[300], // Light grey background
                    backgroundImage: profile.photo != null && profile.photo!.isNotEmpty
                        ? NetworkImage(profile.imgUrl)
                        : null, // No image if photo is null or empty
                    child: profile.photo == null || profile.photo!.isEmpty
                        ? const Icon(Icons.person, size: 40, color: Colors.white) // Optional icon
                        : null,
                  ),

                  const SizedBox(width: 16),
                  Expanded(
                    child: Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        const Text(
                          'BONJOUR',
                          style: TextStyle(
                            fontSize: 18,
                            fontWeight: FontWeight.w300,
                          ),
                        ),
                        Text(
                          '${profile.firstName} ${profile.lastName} 👋',
                          style: const TextStyle(
                            fontSize: 20,
                            fontWeight: FontWeight.bold,
                          ),
                        ),
                      ],
                    ),
                  ),
                ],
              ),
              const SizedBox(height: 16),
              Container(
                padding: const EdgeInsets.all(16),
                decoration: BoxDecoration(
                  color: Colors.green.shade50,
                  borderRadius: BorderRadius.circular(12),
                ),
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Row(
                      children: [
                        SvgPicture.asset(
                          'assets/svgs/diamond.svg',
                          width: 18,
                          height: 18,
                        ),
                        const SizedBox(width: 8),
                        Text(
                          profile!.numberOfPoints.toString(),
                          style: TextStyle(
                            fontSize: 20,
                            color: Colors.green,
                            fontWeight: FontWeight.bold,
                          ),
                        ),
                      ],
                    ),
                    const SizedBox(height: 4),
                    const Text(
                      'Depassez-vous 500pt pour gagner une',
                      style: TextStyle(
                        fontSize: 14,
                        color: Colors.black54,
                      ),
                    ),
                    const Text(
                      'promotion de -20%',
                      style: TextStyle(
                        fontSize: 14,
                        color: Colors.black54,
                      ),
                    ),
                  ],
                ),
              ),
              const SizedBox(height: 20),
              ProfileOption(
                svgPath: 'assets/svgs/profile.svg',
                text: 'My profile',
                onTap: () {
                  Navigator.push(
                    context,
                    MaterialPageRoute(
                      builder: (context) => const MonProfilePage(),
                    ),
                  );
                },
              ),
              ProfileOption(
                svgPath: 'assets/svgs/profileCart.svg',
                text: 'My orders',
                onTap: () {
                  Navigator.push(
                    context,
                    MaterialPageRoute(
                      builder: (context) => MyOrdersPage(),
                    ),
                  );
                },
              ),
              ProfileOption(
                svgPath: 'assets/svgs/translate.svg',
                text: 'Change language',
                onTap: () {
                  _showLanguageSelectionModal(context);
                },
              ),
              ProfileOption(
                svgPath: 'assets/svgs/lock-cog.svg',
                text: 'Edit password',
                onTap: () {
                  Navigator.push(
                    context,
                    MaterialPageRoute(
                      builder: (context) => EditPassword(),
                    ),
                  );

                },
              ),
              ProfileOption(
                svgPath: 'assets/svgs/Group.svg',
                text: 'About us',
                onTap: () {
                  Navigator.push(
                    context,
                    MaterialPageRoute(
                      builder: (context) => AboutUs(),
                    ),
                  );

                },
              ),
              ProfileOption(
                svgPath: 'assets/svgs/logout1.svg',
                text: 'Log out',
                onTap: () {
                  showDialog(
                    context: context,
                    builder: (BuildContext context) {
                      return Dialog(
                        backgroundColor: Colors.white,
                        shape: RoundedRectangleBorder(
                          borderRadius: BorderRadius.circular(15),
                        ),
                        child: Padding(
                          padding: const EdgeInsets.all(20),
                          child: Column(
                            mainAxisSize: MainAxisSize.min,
                            children: [
                              const Text(
                                'Are you sure you want to\nto log out of your account?',
                                style: TextStyle(
                                  color: Colors.black,
                                  fontSize: 18,
                                  fontWeight: FontWeight.w600,
                                ),
                                textAlign: TextAlign.center,
                              ),
                              const SizedBox(height: 18),
                              // Subtitle
                              Row(
                                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                                children: [
                                  Expanded(
                                    child: TextButton(onPressed: (){
                                      Navigator.pop(context);
                                    },
                                        style: TextButton.styleFrom(
                                          backgroundColor: const Color(0xFFEFEFEF),
                                          shape: RoundedRectangleBorder(
                                            borderRadius: BorderRadius.circular(30),
                                            side: BorderSide(width: 0.50, color: Color(0xFFE9E9E9)),
                                          ),
                                        ),
                                        child: Text(
                                          'Cancel',
                                          style: TextStyle(
                                            color: Colors.black,
                                            fontSize: 13,
                                            fontFamily: 'Plus Jakarta Sans',
                                            fontWeight: FontWeight.w500,
                                            height: 1.54,
                                          ),
                                        )
                                    
                                    ),
                                  ),
                                  SizedBox(width: 18,),
                                  Expanded(
                                    child: TextButton(onPressed: (){},
                                        style: TextButton.styleFrom(
                                          backgroundColor: const Color(0x0CD62226),
                                          shape: RoundedRectangleBorder(
                                            borderRadius: BorderRadius.circular(30),
                                            side: BorderSide(width: 0.50, color: Color(0x0CD62226)),
                                          ),
                                        ),

                                      child: Row(
                                        mainAxisSize: MainAxisSize.min, // Prevents the row from stretching
                                        children: [
                                         SvgPicture.asset(
                                            'assets/svgs/logout1.svg',
                                          width: 24,
                                          height: 24,
                                          color: Color(0xFFD62226)
                                              // Optional: Add color if needed
                                        ),
                                      const SizedBox(width: 8), // Space between icon and text
                                      const Text(
                                        'Yes, log out',
                                        style: TextStyle(
                                          color: Color(0xFFD62226),
                                          fontSize: 13,
                                          fontFamily: 'Plus Jakarta Sans',
                                          fontWeight: FontWeight.w500,
                                          height: 1.54,
                                        ),
                                      ),])
                                    
                                    ),
                                  )
                                ],
                              )
                            ],
                          ),
                        ),
                      );
                    },
                  );
                },
              ),
            ],
          ),
        ),
      ),
    );
  }

  void _showLanguageSelectionModal(BuildContext context) {
    showModalBottomSheet(
      context: context,
      shape: const RoundedRectangleBorder(
        borderRadius: BorderRadius.vertical(top: Radius.circular(20.0)),
      ),
      isScrollControlled: true,
      isDismissible: true,
      enableDrag: true,
      builder: (context) {
        return LanguageSelectionModal();
      },
    );
  }
}

class LanguageSelectionModal extends StatefulWidget {
  @override
  _LanguageSelectionModalState createState() => _LanguageSelectionModalState();
}

class _LanguageSelectionModalState extends State<LanguageSelectionModal> {
  String _selectedLanguage = 'Français'; // Default selected language

  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: const EdgeInsets.all(16.0),
      child: Column(
        mainAxisSize: MainAxisSize.min,
        crossAxisAlignment: CrossAxisAlignment.stretch,
        children: [
          Center(
            child: Container(
              width: 60,
              height: 5,
              decoration: BoxDecoration(
                color: Colors.grey.shade300,
                borderRadius: BorderRadius.circular(10.0),
              ),
            ),
          ),
          const SizedBox(height: 16.0),
          const Text(
            'Sélectionnez votre langue',
            style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold),
            textAlign: TextAlign.center,
          ),
          const SizedBox(height: 16.0),
          Wrap(
            spacing: 12.0,
            runSpacing: 12.0,
            alignment: WrapAlignment.center,
            children: [
              _buildLanguageOption(context, 'Français'),
              _buildLanguageOption(context, 'Arabic'),
              _buildLanguageOption(context, 'English'),
            ],
          ),
          const SizedBox(height: 24.0),
          ElevatedButton(
            onPressed: () {
              Navigator.pop(context);
            },
            style: ElevatedButton.styleFrom(
              foregroundColor: Colors.white,
              backgroundColor: const Color(0xFF08A657),
              padding: const EdgeInsets.symmetric(vertical: 16.0),
            ),
            child: const Text('Sauvegarder'),
          ),
          const SizedBox(height: 16.0),
        ],
      ),
    );
  }

  Widget _buildLanguageOption(BuildContext context, String language) {
    final bool isSelected = _selectedLanguage == language;
    return GestureDetector(
      onTap: () {
        setState(() {
          _selectedLanguage = language;
        });
      },
      child: Container(
        padding: const EdgeInsets.symmetric(horizontal: 16.0, vertical: 8.0),
        decoration: BoxDecoration(
          border: Border.all(
            color: isSelected ? const Color(0xFF08A657) : Colors.grey,
            width: 2.0,
          ),
          borderRadius: BorderRadius.circular(20.0),
        ),
        child: Row(
          mainAxisSize: MainAxisSize.min,
          children: [
            Text(
              language,
              style: const TextStyle(
                color: Colors.black,
                fontSize: 16.0,
              ),
            ),
            if (isSelected)
              const Padding(
                padding: EdgeInsets.only(left: 8.0),
                child: Icon(
                  Icons.check_circle,
                  color: Color(0xFF08A657),
                  size: 20.0,
                ),
              ),
          ],
        ),
      ),
    );
  }
}

class ProfileOption extends StatelessWidget {
  final String svgPath;
  final String text;
  final VoidCallback onTap;

  const ProfileOption({
    required this.svgPath,
    required this.text,
    required this.onTap,
  });

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: onTap,
      child: Container(
        padding: const EdgeInsets.symmetric(vertical: 16, horizontal: 16),
        margin: const EdgeInsets.only(bottom: 12),
        decoration: BoxDecoration(
          color: text == "Log out" ? Color(0x0CD62226) : Color(0xFFF6F6F6),
          borderRadius: BorderRadius.circular(8),
          border: Border.all(
            color: text == "Log out" ? Color(0x0CD62226) : Color(0xFFE9E9E9),
            width: 0.5, // Thin border width
          ),
        ),
        child: Row(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [

                SvgPicture.asset(
                  svgPath,
                  width: 24,
                  height: 24,
                  color: text == "Log out"
                      ? Color(0xFFD62226)
                      : Colors.black, // Optional: Add color if needed
                ),
                const SizedBox(width: 12,),
                Text(
                  text,
                  style: TextStyle(
                    color: text == "Log out" ? Color(0xFFD62226) : Colors.black,
                    fontSize: 14,
                    fontWeight: FontWeight.w500,
                  ),
                ),


            const Spacer(),
            Align(
              alignment: Alignment.bottomRight,
              child: Transform.rotate(
                angle: -0.8,
                child: Icon(
                  Icons.arrow_forward,
                  color: text == "Log out" ? Colors.transparent : Colors.black,
                  size: 20,
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }
}
Editor is loading...
Leave a Comment