import 'package:flutter/material.

dart';
import 'package:image_picker/image_picker.dart';
import 'package:okji/Login/loginScreen.dart';
import 'package:okji/PersonalDetails/personalDetailsService.dart';
import 'dart:io';
import '../Category/homeScreen.dart';
import '../Widgets/elevatedButton.dart'; // Ensure this import is correct

class PersonalDetailsScreen extends StatefulWidget {

final String phoneNumber;

PersonalDetailsScreen({required this.phoneNumber});

@override
_PersonalDetailsScreenState createState() => _PersonalDetailsScreenState();
}

class _PersonalDetailsScreenState extends State<PersonalDetailsScreen> {

final _formKey = GlobalKey<FormState>();
final TextEditingController _firstNameController = TextEditingController();
final TextEditingController _lastNameController = TextEditingController();
final TextEditingController _emailController = TextEditingController();
final TextEditingController _phoneController = TextEditingController();

File? _profileImage;
final ImagePicker _picker = ImagePicker();

@override
void initState() {
super.initState();
_phoneController.text = widget.phoneNumber;
}

Future<void> _pickImage() async {

final ImageSource? source = await showDialog<ImageSource>(
context: context,
builder: (BuildContext context) {
return AlertDialog(
title: Text('Select Image Source'),
actions: <Widget>[
TextButton(
onPressed: () => Navigator.pop(context, ImageSource.camera),
child: Text('Take Photo'),
),
TextButton(
onPressed: () => Navigator.pop(context, ImageSource.gallery),
child: Text('Choose from Gallery'),
),
],
);
},
);

if (source != null) {
final pickedFile = await _picker.pickImage(source: source);
if (pickedFile != null) {
setState(() {
_profileImage = File(pickedFile.path);
});
 }
}
}

@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Personal Details', style: TextStyle(color: Colors.white)),
backgroundColor: Colors.purple,
leading: IconButton(
icon: const Icon(Icons.arrow_back, color: Colors.white),
onPressed: () {
Navigator.pushReplacement(
context,
MaterialPageRoute(builder: (context) => loginScreen()),
);
},
),
),
body: Center(
child: Padding(
padding: const EdgeInsets.all(25.0),
child: SingleChildScrollView(
child: Form(
key: _formKey,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
_buildProfileImage(), // The profile image section
SizedBox(height: 0),
Text(
'Personal Details',
textAlign:
TextAlign.left, // Ensures text is aligned to the left
style: TextStyle(
fontSize: 25,
fontWeight: FontWeight.bold,
color: Colors.purple,
),
),
SizedBox(height: 8), // Adds spacing between the two texts
Text(
'Tell Us More About You!', // New text below "Personal Details"
textAlign:
TextAlign.left, // Aligns this text to the left as well
style: TextStyle(
fontSize: 16,
color: Colors
.black, // You can adjust the color and style as needed
),
),
SizedBox(height: 20),
_buildTextFormField(
_firstNameController, 'First Name', Icons.person),
SizedBox(height: 10),
_buildTextFormField(
_lastNameController, 'Last Name', Icons.person),
SizedBox(height: 10),
 _buildTextFormField(
_emailController,
'Email',
Icons.email,
validator: _validateEmail,
),
SizedBox(height: 10),
_buildTextFormField(
_phoneController,
'Phone',
Icons.phone,
readOnly: true,
textStyle: TextStyle(color: Colors.grey),
),
SizedBox(
height: 30,
),
CustomElevatedButton(
text: 'Next',
width: 400.0,
color: Colors.purple,
onPressed: () async {
if (_formKey.currentState!.validate()) {
dynamic data = {
"first_name": _firstNameController.text,
"last_name": _lastNameController.text,
"email": _emailController.text,
"profile_photo": _profileImage,
};
print(" --- ${data}");

PersonalDetailsService().step_1(data).then((response) {
print("---- ${response}");
});

Navigator.push(
context,
MaterialPageRoute(builder: (context) => HomeScreen()),
);
}
},
child: Text('Go to Second Screen'),
),
],
),
),
),
),
),
);
}

Widget _buildProfileImage() {
return Column(
children: [
Stack(
alignment: Alignment.topCenter,
children: [
CircleAvatar(
 radius: 60, // Adjust radius as needed
backgroundColor: Colors.white,
backgroundImage:
_profileImage != null ? FileImage(_profileImage!) : null,
child: _profileImage == null
? Icon(Icons.camera_alt, size: 50, color: Colors.grey[600])
: null,
),
Positioned(
right: 4,
bottom: 4,
child: GestureDetector(
onTap: _pickImage,
child: CircleAvatar(
radius: 18,
backgroundColor: Colors.purple,
child: Icon(Icons.camera_alt, color: Colors.white),
),
),
),
],
),
SizedBox(height: 150),
],
);
}

Widget _buildTextFormField(
TextEditingController controller, String labelText, IconData icon,
{bool readOnly = false,
TextStyle? textStyle,
String? Function(String?)? validator}) {
return TextFormField(
controller: controller,
readOnly: readOnly,
style: textStyle,
decoration: InputDecoration(
labelText: labelText,
prefixIcon: Icon(icon),
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(10),
),
),
validator: validator ??
(value) {
if (value == null || value.isEmpty) {
return '$labelText is required';
}
return null;
},
);
}

String? _validateEmail(String? value) {

if (value == null || value.isEmpty) {
return 'Email is required';
}
final emailRegExp = RegExp(r'^[^@]+@[^@]+\.[^@]+');
if (!emailRegExp.hasMatch(value)) {
 return 'Please enter a valid email address';
}
return null;
}
}