import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:google_fonts/google_fonts.dart';
import '../controllers/setting_controller.dart';

class SettingView extends GetView<SettingController> {
  const SettingView({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.blue[400],
      body: SafeArea(
        child: Padding(
          padding: const EdgeInsets.all(20),
          child: Column(
            children: [
              _buildHeader(),
              const SizedBox(height: 20),
              Expanded(child: _buildSettingsForm()),
            ],
          ),
        ),
      ),
    );
  }

  Widget _buildHeader() {
    return Row(
      children: [
        IconButton(
          icon: const Icon(Icons.arrow_back, color: Colors.white, size: 30),
          onPressed: () => Get.back(),
        ),
        const SizedBox(width: 8),
        Expanded(
          child: Center(
            child: Text(
              'Pengaturan',
              style: GoogleFonts.poppins(
                color: Colors.white,
                fontSize: 30,
                fontWeight: FontWeight.bold,
              ),
            ),
          ),
        ),
      ],
    );
  }

  Widget _buildSettingsForm() {
    return Obx(() {
      if (controller.isLoading.value) {
        return const Center(
          child: CircularProgressIndicator(color: Colors.white),
        );
      }

      return SingleChildScrollView(
        child: Stack(
          clipBehavior: Clip.none,
          children: [
            Align(
              alignment: Alignment.topCenter,
              child: Container(
                width: MediaQuery.of(Get.context!).size.width * 0.9, // Biar ga full layar
                margin: const EdgeInsets.only(top: 30), // Dulu 70, diperkecil
                padding: const EdgeInsets.fromLTRB(16, 30, 16, 16), // Dulu top 80, jadi 30
                decoration: BoxDecoration(
                  color: Colors.white,
                  borderRadius: BorderRadius.circular(16),
                  boxShadow: [
                    BoxShadow(
                      color: Colors.black.withOpacity(0.1),
                      blurRadius: 10,
                      offset: const Offset(0, 5),
                    ),
                  ],
                ),
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    _buildNumberField(
                      label: 'Jarak Dekat (cm)',
                      initialValue: controller.jarakDekat.value.toString(),
                      onChanged: (value) => controller.jarakDekat.value = int.tryParse(value) ?? 0,
                    ),
                    const SizedBox(height: 16),
                    _buildNumberField(
                      label: 'Jarak Jauh (cm)',
                      initialValue: controller.jarakJauh.value.toString(),
                      onChanged: (value) => controller.jarakJauh.value = int.tryParse(value) ?? 0,
                    ),
                    const SizedBox(height: 16),
                    _buildNumberField(
                      label: 'Interval Kirim Lokasi (ms)',
                      initialValue: controller.intervalLokasi.value.toString(),
                      onChanged: (value) => controller.intervalLokasi.value = int.tryParse(value) ?? 0,
                    ),
                    const SizedBox(height: 30),
                    _buildSaveButton(),
                  ],
                ),
              ),
            ),
          ],
        ),
      );
    });
  }

  Widget _buildNumberField({
    required String label,
    required String initialValue,
    required Function(String) onChanged,
  }) {
    final textController = TextEditingController(text: initialValue);
    return TextField(
      keyboardType: TextInputType.number,
      controller: textController,
      decoration: InputDecoration(
        labelText: label,
        labelStyle: GoogleFonts.poppins(),
        border: const OutlineInputBorder(),
      ),
      onChanged: onChanged,
    );
  }

  Widget _buildSaveButton() {
    return SizedBox(
      width: double.infinity,
      child: ElevatedButton(
        onPressed: () => controller.updateSettings(),
        style: ElevatedButton.styleFrom(
          backgroundColor: Colors.blue[800],
          shape: RoundedRectangleBorder(
            borderRadius: BorderRadius.circular(10),
          ),
          padding: const EdgeInsets.symmetric(vertical: 16),
        ),
        child: Text(
          'Simpan',
          style: GoogleFonts.poppins(
            fontSize: 18,
            fontWeight: FontWeight.bold,
            color: Colors.white,
          ),
        ),
      ),
    );
  }
}