import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:vnoteapp/components/appbar.dart';
import 'package:vnoteapp/pages/patient/info/widgets/base.dart';

import 'controller.dart';
import 'state.dart';
import 'widgets/detail.dart';
import 'widgets/health.dart';

class PatientInfoPage extends GetView<PatientInfoController> {
  const PatientInfoPage({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: const Color.fromRGBO(238, 238, 238, 1),
      appBar: VAppBar(
        titleText: "testlabel健康档案",
        actions: [
          TextButton(
            onPressed: () {
              //TODO:
            },
            child: const Text(
              "保存",
              style: TextStyle(
                color: Colors.white,
                fontSize: 32,
                fontWeight: FontWeight.bold,
              ),
            ),
          ),
          const SizedBox(width: 8),
        ],
      ),
      body: Padding(
        padding: const EdgeInsets.only(top: 2),
        child: Row(
          children: [
            Container(
              width: 130,
              color: Colors.blue,
              child: _NavBarWidget(),
            ),
            Expanded(child: _NavWidget()),
          ],
        ),
      ),
    );
  }
}

class _NavBarWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return LayoutBuilder(builder: (context, c) {
      return SizedBox(
        height: c.maxHeight,
        child: ListView(
          shrinkWrap: true,
          children: const [
            _NavBarItemWidget(anchor: NavAnchorType.base),
            _NavBarItemWidget(anchor: NavAnchorType.detail),
            _NavBarItemWidget(anchor: NavAnchorType.health),
          ],
        ),
      );
    });
  }
}

class _NavBarItemWidget extends StatelessWidget {
  static final _anchorLabels = <NavAnchorType, String>{
    NavAnchorType.base: "基本信息",
    NavAnchorType.detail: "详细信息",
    NavAnchorType.health: "健康信息",
  };

  final NavAnchorType anchor;

  const _NavBarItemWidget({
    super.key,
    required this.anchor,
  });

  @override
  Widget build(BuildContext context) {
    final label = _anchorLabels[anchor]!;
    final labelWidget = Text(
      label,
      style: const TextStyle(
        color: Colors.white,
        fontSize: 24,
      ),
    );
    final controller = Get.find<PatientInfoController>();
    return Obx(
      () {
        Widget child = labelWidget;
        final isActive = controller.state.anchor == anchor;
        if (isActive) {
          child = Stack(
            children: [
              Positioned.fill(
                child: Container(
                  color: Colors.black.withOpacity(.2),
                  alignment: Alignment.center,
                  child: labelWidget,
                ),
              ),
              Positioned(
                left: 0,
                top: 0,
                bottom: 0,
                child: Container(
                  width: 4,
                  color: Colors.white,
                ),
              ),
            ],
          );
        }

        return GestureDetector(
          onTap: () {
            controller.switchAnchor(anchor);
          },
          child: Container(
            height: 65,
            color: const Color.fromRGBO(0, 152, 218, 1),
            alignment: Alignment.center,
            child: child,
          ),
        );
      },
    );
  }
}

class _NavWidget extends GetView<PatientInfoController> {
  static final _pageBuilders = <NavAnchorType, WidgetBuilder>{
    NavAnchorType.base: (_) => PatientInfoBaseView(),
    NavAnchorType.detail: (_) => PatientInfoDetailView(),
    NavAnchorType.health: (_) => PatientInfoHealthView(),
  };

  @override
  Widget build(BuildContext context) {
    return Container(
      margin: const EdgeInsets.symmetric(horizontal: 12, vertical: 8),
      decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.circular(8),
      ),
      child: Obx(() {
        final builder = _pageBuilders[controller.state.anchor];
        if (builder != null) return builder(context);
        return const Center(child: Text("Unknown"));
      }),
    );
  }
}
