import 'package:fis_jsonrpc/rpc.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:vitalapp/architecture/values/features.dart';
import 'package:vitalapp/components/button.dart';
import 'package:vitalapp/consts/styles.dart';
import 'package:vitalapp/store/store.dart';

import '../controller.dart';

/// 基本信息卡片
class BaseInfoCard extends GetView<PatientDetailController> {
  const BaseInfoCard({super.key});

  @override
  Widget build(BuildContext context) {
    final state = controller.state;
    return _InfoCardContainer(
      child: Stack(
        children: [
          Padding(
            padding: const EdgeInsets.symmetric(horizontal: 14, vertical: 12),
            child: Obx(
              () => Column(
                children: [
                  const SizedBox(height: 18),
                  _buildItem("姓名", state.name),
                  _buildItem("性别", state.genderDesc),
                  _buildItem("年龄", state.age.toString()),
                  _buildItem("电话", state.phoneNo, placeholder: "未填写"),
                  _buildItem("身份证", state.cardNo),
                  // const SizedBox(height: 8),
                  _buildItem("地址", state.address, enableTooltip: true),
                ],
              ),
            ),
          ),
          Positioned(
            top: 2,
            right: 6,
            child: _buildAvatar(),
          ),
        ],
      ),
    );
  }

  Widget _buildItem(String label, String? content,
      {bool enableTooltip = false, String placeholder = ""}) {
    String displayContent;
    if (content == null || content.isEmpty) {
      displayContent = placeholder;
    } else {
      displayContent = content;
    }

    Widget contentWidget = Text(
      displayContent,
      style: const TextStyle(
        color: Colors.black,
        fontSize: 18,
      ),
      overflow: TextOverflow.ellipsis,
    );

    if (enableTooltip) {
      contentWidget = Tooltip(
        message: displayContent,
        padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 12),
        textStyle: const TextStyle(fontSize: 18, color: Colors.white),
        triggerMode: TooltipTriggerMode.tap,
        child: contentWidget,
      );
    }

    return SizedBox(
      height: 30,
      child: Row(
        children: [
          SizedBox(
            width: 60,
            child: Text(
              label,
              style: const TextStyle(color: Colors.grey, fontSize: 18),
            ),
          ),
          const SizedBox(width: 12),
          Expanded(child: contentWidget),
        ],
      ),
    );
  }

  Widget _buildAvatar() {
    return Obx(() {
      final url = controller.state.avatarUrl;
      Widget image;
      if (url != null && url.isNotEmpty) {
        image = Image.network(url, fit: BoxFit.cover);
      } else {
        if (controller.state.gender == GenderEnum.Male) {
          image = Image.asset("assets/images/avatar_man.png");
        } else {
          image = Image.asset("assets/images/avatar_women.png");
        }
      }
      return SizedBox(
        width: 100,
        height: 150,
        child: Column(
          children: [
            Expanded(
              child: ClipOval(
                child: image,
              ),
            ),
            const SizedBox(
              height: 10,
            ),
            SizedBox(
              height: 40,
              child: Obx(() {
                if (Store.user.hasFeature(FeatureKeys.FaceRecognition) &&
                    controller.state.isOnline &&
                    (url == null || url.isEmpty)) {
                  return VButton(
                    label: '绑定人脸',
                    onTap: controller.queryIsNeedFaceInput,
                  );
                }
                return Container();
              }),
            ),
          ],
        ),
      );
    });
  }
}

class _InfoCardContainer extends StatelessWidget {
  final Widget child;

  const _InfoCardContainer({
    required this.child,
  });

  @override
  Widget build(BuildContext context) {
    return Container(
      alignment: Alignment.topLeft,
      padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 8),
      decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: GlobalStyles.borderRadius,
      ),
      child: child,
    );
  }
}
