import 'package:track_common/service/map_watch.dart';
import 'package:track_common/view/home/field_control/field_control.dart';
import 'package:track_common/view/home/field_control/field_control_controller.dart';
import 'package:track_common/widget/prelude.dart';

class FieldControlPageImpl extends FieldControlPage {
  const FieldControlPageImpl({super.key});

  @override
  Widget get rightColumn {
    return Obx(() => Container(
        width: 263,
        padding: const EdgeInsets.all(6.4),
        height: double.infinity,
        color: Colors.white,
        child: Column(
          children: [
            SizedBox(
                width: double.infinity,
                child: DarkButton(
                    child: const Text('注册比赛'),
                    onPressed: () {
                      Get.dialog(const RegisterDialog());
                    })),
            Expanded(
              child: ListView(
                children: controller.eventList
                    .map((element) => eventView(element))
                    .toList(),
              ),
            )
          ],
        )));
  }

  Widget eventView(EventOnMap event) {
    return Card(
      shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(3.56)),
      child: Row(
        children: [
          Text(event.name),
          Text('(${event.userList.length} 人)'),
          const Spacer(),
          IconButton(
              onPressed: () {},
              icon: const Icon(Icons.arrow_drop_down_outlined))
        ],
      ),
    );
  }
}

class FieldControlControllerImpl extends FieldControlController {
  var registerName = '';
  final registerStartAt = Rx<TimeOfDay?>(null);
  final registerStopAt = Rx<TimeOfDay?>(null);
}

class RegisterDialog extends GetView<FieldControlController> {
  const RegisterDialog({super.key});

  FieldControlControllerImpl get c => controller as FieldControlControllerImpl;

  @override
  Widget build(BuildContext context) {
    return AlertDialog(
      title: const Center(
          child: Text(
        '注册比赛',
        style: TextStyle(fontSize: 17),
      )),
      backgroundColor: Colors.white,
      shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(17.78)),
      content: SizedBox(
          width: 75.38,
          child: ListView(
            shrinkWrap: true,
            children: [
              const _TextField(hint: '请选择活动'),
              const SizedBox(height: 21.34),
              _TextField(
                  hint: '请输入名称',
                  onChanged: (v) {
                    c.registerName = v;
                  }),
              const SizedBox(height: 21.34),
              Row(children: [
                Expanded(
                    child: Obx(() => _TextField(
                        hint: '开始时间',
                        readOnly: true,
                        initText: c.registerStartAt.value?.format(context),
                        onTap: () async {
                          c.registerStartAt.value = await _showTimePicker(
                              context, c.registerStartAt.value);
                        }))),
                const SizedBox(width: 15.64),
                Expanded(
                    child: _TextField(
                        hint: '结束时间',
                        readOnly: true,
                        initText: c.registerStopAt.value?.format(context),
                        onTap: () async {
                          c.registerStopAt.value = await _showTimePicker(
                              context, c.registerStopAt.value);
                        })),
              ]),
              Row(
                mainAxisSize: MainAxisSize.min,
                children: [
                  Switch(value: true, onChanged: (v) {}),
                  const Text('查询密码')
                ],
              ),
              SizedBox(
                  width: double.infinity,
                  child: DarkButton(child: const Text('注 册'), onPressed: () {}))
            ],
          )),
    );
  }

  Future<TimeOfDay?> _showTimePicker(
      BuildContext context, TimeOfDay? init) async {
    final TimeOfDay? time = await showTimePicker(
      context: context,
      initialTime: init ?? TimeOfDay.now(),
    );
    return time;
  }
}

class _TextField extends StatelessWidget {
  const _TextField(
      {required this.hint,
      this.onChanged,
      this.readOnly = false,
      this.onTap,
      this.initText});

  final String hint;
  final void Function(String)? onChanged;
  final bool readOnly;
  final void Function()? onTap;
  final String? initText;

  @override
  Widget build(BuildContext context) {
    return SizedBox(
      height: 34.13,
      child: TextFormField(
        key: GlobalKey(),
        initialValue: initText,
        maxLines: 1,
        style: const TextStyle(fontSize: 11.38),
        onChanged: onChanged,
        onTap: onTap,
        readOnly: readOnly,
        decoration: InputDecoration(
            hintText: hint,
            border: OutlineInputBorder(
              borderSide:
                  const BorderSide(width: 0.71, color: Color(0xff818181)),
              borderRadius: BorderRadius.circular(2.13),
            ),
            isDense: true,
            contentPadding: const EdgeInsets.all(8.53)),
      ),
    );
  }
}