CityCards_Customer_Flutter/lib/edit_profile/edit_profile_view.dart

import 'package:citycards_customer/common_package/custom_textfield.dart';
import 'package:flutter/material.dart';
import 'package:citycards_customer/common_package/custom_text.dart';

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

  @override
  Widget build(BuildContext context) {
    final TextEditingController firstNameController = TextEditingController();
    final TextEditingController lastNameController = TextEditingController();
    final TextEditingController emailController = TextEditingController();
    final TextEditingController phoneController = TextEditingController();
    final TextEditingController addressController = TextEditingController();

    return Scaffold(
      backgroundColor: Colors.white,
      body: SafeArea(
        child: SingleChildScrollView(
          padding: const EdgeInsets.symmetric(horizontal: 20, vertical: 10),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.center,
            children: [
              // Header
              Container(
                padding: const EdgeInsets.only(bottom: 10),
                decoration: const BoxDecoration(
                  border: Border(
                    bottom: BorderSide(color: Color(0xFFD9D9D9), width: 0.7),
                  ),
                ),
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    Image.asset("assets/logo/logo_city_cards.png", scale: 4),
                    Image.asset("assets/icons/shopping_cart.png", scale: 4),
                  ],
                ),
              ),
              const SizedBox(height: 22),

              // Back + title
              Row(
                children: [
                  GestureDetector(
                      onTap: (){
                        Navigator.pop(context);
                      },
                      child: Icon(Icons.arrow_back, size: 24)),
                  SizedBox(width: 8),
                  Text(
                    "Edit Profile",
                    style: TextStyle(fontSize: 12, fontWeight: FontWeight.w500),
                  ),
                ],
              ),
              const SizedBox(height: 33),

              // Profile Image
              const CircleAvatar(
                radius: 38,
                backgroundImage: AssetImage("assets/images/profile_img.png"),
              ),
              const SizedBox(height: 18),
              const Text(
                "Change Profile Picture",
                style: TextStyle(
                  fontSize: 12,
                  color: Color(0xFFF95F62),
                  fontWeight: FontWeight.w400,
                ),
              ),
              const SizedBox(height: 40),

              // Personal Information
              Align(
                alignment: Alignment.centerLeft,
                child: CustomText(
                  text: "Personal Information",
                  size: 18,
                  weight: FontWeight.w500,
                ),
              ),
              const SizedBox(height: 12),

              Padding(
                padding: const EdgeInsets.symmetric(horizontal: 12),
                child: CustomTextField(
                  label: "First Name",
                  hint: "Enter your first name",
                  controller: firstNameController,
                ),
              ),
              Padding(
                padding: const EdgeInsets.symmetric(horizontal: 12),
                child: CustomTextField(
                  label: "Last Name",
                  hint: "Enter your last name",
                  controller: lastNameController,
                ),
              ),
              Padding(
                padding: const EdgeInsets.symmetric(horizontal: 12),
                child: CustomTextField(
                  label: "Email",
                  hint: "Enter your email address",
                  controller: emailController,
                ),
              ),
              Padding(
                padding: const EdgeInsets.symmetric(horizontal: 12),
                child: CustomTextField(
                  label: "Phone Number",
                  hint: "Enter your phone number",
                  controller: phoneController,
                ),
              ),

              const SizedBox(height: 2),

              // Location Details
              Align(
                alignment: Alignment.centerLeft,
                child: CustomText(
                  text: "Location Details",
                  size: 18,
                  weight: FontWeight.w500,
                ),
              ),
              const SizedBox(height: 16),

              Padding(
                padding: const EdgeInsets.symmetric(horizontal: 12.0),
                child: CustomTextField(
                  label: "Address 1",
                  hint: "Enter address manually or tap to search",
                  controller: addressController,
                ),
              ),

              const SizedBox(height: 26),

              // Buttons
              Row(
                mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                children: [
                  Expanded(
                    child: OutlinedButton(
                      style: OutlinedButton.styleFrom(
                        foregroundColor: const Color(0xFFF95F62),
                        side: const BorderSide(color: Colors.transparent),
                        shape: RoundedRectangleBorder(
                          borderRadius: BorderRadius.circular(38),
                        ),
                        padding: const EdgeInsets.symmetric(vertical: 12),
                      ),
                      onPressed: () {},
                      child: const Text(
                        "Cancel",
                        style: TextStyle(
                          fontSize: 16,
                          fontWeight: FontWeight.w500,
                        ),
                      ),
                    ),
                  ),
                  const SizedBox(width: 16),
                  Expanded(
                    child: ElevatedButton(
                      style: ElevatedButton.styleFrom(
                        backgroundColor: const Color(0xFFF95F62),
                        shape: RoundedRectangleBorder(
                          borderRadius: BorderRadius.circular(38),
                        ),
                        padding: const EdgeInsets.symmetric(vertical: 6),
                      ),
                      onPressed: () {},
                      child: const Text(
                        "Save",
                        style: TextStyle(
                          fontSize: 16,
                          fontWeight: FontWeight.w500,
                          color: Colors.white,
                        ),
                      ),
                    ),
                  ),
                ],
              ),
              const SizedBox(height: 20),
            ],
          ),
        ),
      ),
    );
  }
}