import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:get/get.dart';
import 'package:qyuota/config/colors.dart';
import 'package:qyuota/config/images.dart';
import 'package:qyuota/config/text_style.dart';
import 'package:qyuota/widget/custom_button.dart';
import 'package:qyuota/widget/custom_textfield.dart';

class EditProfileScreen extends StatefulWidget {
  const EditProfileScreen({Key? key}) : super(key: key);

  @override
  State<EditProfileScreen> createState() => _EditProfileScreenState();
}

class _EditProfileScreenState extends State<EditProfileScreen> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Stack(
        children: [
          Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Container(
                height: Get.height / 2.2,
                color: ConstColors.primaryColor,
                child: Stack(
                  children: [
                    Column(
                      children: [
                        SizedBox(
                            height: MediaQuery.of(context).padding.top + 15),
                        Padding(
                          padding: const EdgeInsets.only(left: 20, right: 20),
                          child: Row(
                            mainAxisAlignment: MainAxisAlignment.spaceBetween,
                            children: [
                              InkWell(
                                onTap: () {
                                  Navigator.pop(context);
                                },
                                child: const Icon(
                                  Icons.arrow_back,
                                  color: ConstColors.whiteColor,
                                ),
                              ),
                              Text(
                                "Edit profil",
                                style: pSemiBold18.copyWith(
                                  fontSize: 20,
                                  color: ConstColors.whiteColor,
                                ),
                              ),
                              const Icon(
                                Icons.arrow_back,
                                color: Colors.transparent,
                              ),
                            ],
                          ),
                        ),
                        Center(
                          child: Padding(
                            padding: const EdgeInsets.only(top: 30),
                            child: Container(
                              height: 64,
                              width: 64,
                              decoration: const BoxDecoration(
                                image: DecorationImage(
                                  image: AssetImage(
                                    DefaultImages.p26,
                                  ),
                                ),
                              ),
                            ),
                          ),
                        ),
                      ],
                    ),
                    Padding(
                      padding: EdgeInsets.only(top: 140, left: Get.width / 1.9),
                      child: Container(
                        height: 18,
                        width: 18,
                        decoration: const BoxDecoration(
                          image: DecorationImage(
                            image: AssetImage(
                              DefaultImages.p25,
                            ),
                          ),
                        ),
                      ),
                    ),
                  ],
                ),
              ),
              Expanded(
                flex: 2,
                child: ListView(
                  padding:
                      EdgeInsets.only(top: Get.height / 4, left: 20, right: 20),
                  physics: const ClampingScrollPhysics(),
                  children: [
                    Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        Text(
                          "Akun Tertaut",
                          style: pSemiBold20.copyWith(
                            fontSize: 20,
                          ),
                        ),
                        const SizedBox(height: 20),
                        Container(
                          width: Get.width,
                          decoration: BoxDecoration(
                            borderRadius: BorderRadius.circular(12),
                            color: ConstColors.whiteColor,
                            boxShadow: [
                              BoxShadow(
                                color:
                                    const Color(0xff4E568C).withOpacity(0.06),
                              ),
                            ],
                          ),
                          child: Padding(
                            padding: const EdgeInsets.only(
                                left: 20, right: 20, top: 20, bottom: 20),
                            child: Column(
                              children: [
                                row(
                                  DefaultImages.fb,
                                  "Facebook",
                                ),
                                const SizedBox(height: 5),
                                Divider(
                                  color: ConstColors.lightTextColor
                                      .withOpacity(0.5),
                                ),
                                const SizedBox(height: 5),
                                row(
                                  DefaultImages.google,
                                  "Akun Google",
                                ),
                              ],
                            ),
                          ),
                        ),
                        const SizedBox(height: 20),
                        CustomButton(
                          text: "Simpan",
                          color: ConstColors.skyColor,
                          onTap: () {},
                        ),
                        const SizedBox(height: 20),
                      ],
                    ),
                  ],
                ),
              ),
            ],
          ),
          Padding(
            padding:
                EdgeInsets.only(left: 20, right: 20, top: Get.height / 3.6),
            child: Container(
              height: Get.height / 2.45,
              width: Get.width,
              decoration: BoxDecoration(
                borderRadius: BorderRadius.circular(12),
                color: ConstColors.whiteColor,
                boxShadow: [
                  BoxShadow(
                    color: const Color(0xff4E568C).withOpacity(0.06),
                  ),
                ],
              ),
              child: ListView(
                padding: EdgeInsets.zero,
                physics: const ClampingScrollPhysics(),
                children: [
                  Padding(
                    padding: const EdgeInsets.all(20),
                    child: Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        CustomTextField(
                          title: "Nama",
                          hintText: "Full Name",
                          textEditingController:
                              TextEditingController(text: "Hayung"),
                        ),
                        const SizedBox(height: 20),
                        CustomTextField(
                          title: "Email",
                          hintText: "Email",
                          textEditingController:
                              TextEditingController(text: "hayung@mail.com"),
                        ),
                        const SizedBox(height: 20),
                        CustomTextFieldWithSufix(
                          title: "Birthday",
                          hintText: "Birthday",
                          textEditingController:
                              TextEditingController(text: "10/10/01"),
                          widget: Padding(
                            padding: const EdgeInsets.all(8.0),
                            child: SvgPicture.asset(
                              DefaultImages.p10,
                            ),
                          ),
                        ),
                      ],
                    ),
                  ),
                ],
              ),
            ),
          ),
        ],
      ),
    );
  }
}

Widget row(String image, String text1) {
  return Row(
    children: [
      SizedBox(
        height: 24,
        width: 24,
        child: Image.asset(
          image,
          fit: BoxFit.fill,
        ),
      ),
      const SizedBox(width: 14),
      Expanded(
        child: Text(
          text1,
          style: pRegular14.copyWith(
            fontSize: 16,
          ),
        ),
      ),
      const Icon(
        Icons.arrow_forward_ios,
        color: ConstColors.lightTextColor,
        size: 15,
      )
    ],
  );
}