import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import 'package:wallpaperx/generated/assets.dart';
import 'package:wallpaperx/page/settings/settings_controller.dart';

class SettingsView extends GetView<SettingsController> {
  const SettingsView({super.key});

  @override
  Widget build(BuildContext context) {
    Get.put(SettingsController());
    return Scaffold(
      resizeToAvoidBottomInset: false,
      body: Container(
        decoration: const BoxDecoration(
          image: DecorationImage(
            image: AssetImage(Assets.imagesSettingBackground),
            fit: BoxFit.cover,
          ),
        ),
        padding: const EdgeInsets.only(top: 70).w,
        child: SafeArea(
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              _buildUserinfo(),
              Container(
                height: 1.w,
                width: double.infinity,
                margin: const EdgeInsets.symmetric(
                  horizontal: 58,
                  vertical: 15,
                ).w,
                decoration: BoxDecoration(color: Colors.white.withOpacity(.5)),
              ),
              _buildOptions(context),
            ],
          ),
        ),
      ),
    );
  }

  Widget _buildUserinfo() {
    return GetBuilder<SettingsController>(
      id: "userinfo",
      builder: (_) {
        return Row(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Column(
              children: [
                GestureDetector(
                  onTap: controller.toEdit,
                  child: Container(
                    height: 100.w,
                    width: 100.w,
                    clipBehavior: Clip.hardEdge,
                    decoration: BoxDecoration(
                      borderRadius: BorderRadius.circular(80).r,
                      border: Border.all(color: Colors.white),
                    ),
                    child: Image.asset(
                      fit: BoxFit.cover,
                      controller.homeController.userinfo.avatar ??
                          Assets.iconPlaceholderAvatar,
                    ),
                  ),
                ),
                14.verticalSpace,
                Text(
                  controller.homeController.userinfo.username ?? "————",
                  maxLines: 1,
                  overflow: TextOverflow.ellipsis,
                  style: TextStyle(
                    color: Colors.white,
                    fontSize: 21.sp,
                    fontWeight: FontWeight.w600,
                  ),
                ),
              ],
            ),
          ],
        );
      },
    );
  }

  Widget _buildOptions(context) {
    return Expanded(
      child: ListView.separated(
        shrinkWrap: true,
        padding: EdgeInsets.only(
          bottom: MediaQuery.of(context).padding.bottom + 70.w,
        ),
        itemCount: controller.options.length,
        itemBuilder: (context, index) {
          return Material(
            color: Colors.transparent,
            child: InkWell(
              onTap: () => controller.settingOptionOnTap(index),
              child: Row(
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                  Text(
                    controller.options[index],
                    maxLines: 1,
                    overflow: TextOverflow.ellipsis,
                    style: TextStyle(
                      color: Colors.white,
                      fontSize: 22.sp,
                    ),
                  )
                ],
              ),
            ),
          );
        },
        separatorBuilder: (context, index) {
          return Container(
            height: 16.w,
            color: Colors.transparent,
          );
        },
      ),
    );
  }
}
