import 'package:auto_route/annotations.dart';
import 'package:eitc_erm_dental_flutter/exts.dart';
import 'package:eitc_erm_dental_flutter/funcs.dart';
import 'package:eitc_erm_dental_flutter/sp_util.dart';
import 'package:eitc_erm_dental_flutter/widget/custom_divider.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';

///延迟拍摄设置页面
@RoutePage(name: "delayShotSettingsRoute")
class DelayShotSettingsPage extends StatefulWidget {
  const DelayShotSettingsPage({super.key});

  @override
  State<DelayShotSettingsPage> createState() => _DelayShotSettingsPageState();
}

class _DelayShotSettingsPageState extends State<DelayShotSettingsPage> {
  int _isEnableDelayShot = 0;
  int _delayShotTime = 0;
  final TextStyle _titleStyle = const TextStyle(fontWeight: FontWeight.bold);
  final BoxDecoration _containerDecoration = BoxDecoration(
      color: const Color(0xFFF9F9F9),
      borderRadius: BorderRadius.circular(10.r));

  @override
  void initState() {
    super.initState();
    screenDisableRotate();

    _initData();
  }

  void _initData() async {
    bool enableDelayShot = await SpUtil.getEnableDelayShot();
    int delayShotTime = await SpUtil.getDelayShotTime();

    setState(() {
      _isEnableDelayShot = enableDelayShot ? 1 : 0;
      _delayShotTime = delayShotTime;
    });
  }

  @override
  void dispose() {
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        centerTitle: true,
        title: Text(getS().delayShot),
      ),
      body: SafeArea(
          child: SingleChildScrollView(
        child: Padding(
          padding: EdgeInsets.symmetric(horizontal: 10.w),
          child: Column(
            children: [_getShotSettings()],
          ),
        ),
      )),
    );
  }

  Widget _getDivider() {
    return const CustomDivider(
      height: 0.0,
    );
  }

  Widget _getShotSettings() {
    return Padding(
      padding: EdgeInsets.symmetric(horizontal: 16.w, vertical: 16.h),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Text(
            getS().delayShotColon,
            style: _titleStyle,
          ),
          SizedBox(
            height: 8.h,
          ),
          Container(
            decoration: _containerDecoration,
            child: Column(
              children: [
                _RadioItem(
                  text: getS().close,
                  isChecked: _isEnableDelayShot != 1,
                  onTap: () => _onEnableDelayShotChange(0),
                ),
                _getDivider(),
                _RadioItem(
                  text: getS().open,
                  isChecked: _isEnableDelayShot == 1,
                  onTap: () => _onEnableDelayShotChange(1),
                ),
              ],
            ),
          ),
          Visibility(
              visible: _isEnableDelayShot == 1,
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  SizedBox(
                    height: 12.h,
                  ),
                  Text(
                    getS().delayTimeColon,
                    style: _titleStyle,
                  ),
                  SizedBox(
                    height: 8.h,
                  ),
                  Container(
                    decoration: _containerDecoration,
                    child: Column(
                      children: [
                        _RadioItem(
                          text: getS().xxSecond(2),
                          isChecked: _delayShotTime == 2,
                          onTap: () => _onDelayShotTimeChange(2),
                        ),
                        _getDivider(),
                        _RadioItem(
                          text: getS().xxSecond(5),
                          isChecked: _delayShotTime == 5,
                          onTap: () => _onDelayShotTimeChange(5),
                        ),
                        _getDivider(),
                        _RadioItem(
                          text: getS().xxSecond(10),
                          isChecked: _delayShotTime == 10,
                          onTap: () => _onDelayShotTimeChange(10),
                        ),
                      ],
                    ),
                  ),
                ],
              ))
        ],
      ),
    );
  }

  void _onEnableDelayShotChange(int? value) async {
    await SpUtil.setEnabelDelayShot(value == 1);
    setState(() {
      _isEnableDelayShot = value ?? 0;
    });
  }

  void _onDelayShotTimeChange(int? value) async {
    SpUtil.setDelayShotTime(value ?? 2);
    setState(() {
      _delayShotTime = value ?? 2;
    });
  }
}

class _RadioItem extends StatelessWidget {
  final String text;
  final bool isChecked;
  final void Function() onTap;

  const _RadioItem(
      {required this.text, required this.isChecked, required this.onTap});

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      behavior: HitTestBehavior.opaque,
      onTap: onTap,
      child: Padding(
        padding: EdgeInsets.symmetric(horizontal: 16.w, vertical: 16.h),
        child: Row(
          children: [
            Text(
              text,
              style: TextStyle(color: context.onSurfaceVariantColor),
            ),
            const Spacer(),
            _CheckedIcon(isChecked: isChecked),
          ],
        ),
      ),
    );
  }
}

class _CheckedIcon extends StatelessWidget {
  final bool isChecked;

  const _CheckedIcon({required this.isChecked});

  @override
  Widget build(BuildContext context) {
    return isChecked
        ? Icon(
            size: 24.r,
            Icons.check_circle,
            color: context.primaryColor,
          )
        : Icon(
            size: 24.r,
            Icons.radio_button_unchecked,
            color: const Color(0xFF666666),
          );
  }
}