import 'package:doublefeel_flutter/app/routes/app_pages.dart';
import 'package:doublefeel_flutter/app/utils/platform_compact.dart';
import 'package:doublefeel_flutter/core/theme/app_colors.dart';
import 'package:doublefeel_flutter/core/theme/app_theme.dart';
import 'package:doublefeel_flutter/l10n/l10n_extensions.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';

import '../controllers/help_controller.dart';

class HelpView extends GetView<HelpController> {
  const HelpView({super.key});

  @override
  Widget build(BuildContext context) {
    final faqItems = _buildFaqItems(context);

    return Scaffold(
      appBar: AppBar(
        title: Text(
          context.l10n.help,
        ),
        leadingWidth: 56,
        leading: IconButton(
          highlightColor: Colors.transparent,
          splashColor: Colors.transparent,
          padding: EdgeInsets.zero,
          onPressed: Get.back,
          icon: Image.asset(
            'assets/images/common/ic_nav_back.webp',
            width: 24,
            height: 24,
          ),
        ),
      ),
      body: Stack(
        children: [
          ListView(
            physics: const ClampingScrollPhysics(),
            padding: EdgeInsets.fromLTRB(
              16,
              16,
              16,
              132 + MediaQuery.paddingOf(context).bottom,
            ),
            children: [
              _FaqCard(items: faqItems),
              SizedBox(height: 12),
              _ActionRow(
                title: context.l10n.feedbackLog,
                onTap: () => Get.toNamed(Routes.FEEDBACK_LIST),
              ),
            ],
          ),
          Positioned(
            left: 0,
            right: 0,
            bottom: 36 + MediaQuery.paddingOf(context).bottom,
            child: Center(
              child: _PrimaryHelpButton(
                label: context.l10n.reportAnIssue,
                onTap: () => Get.toNamed(Routes.SUBMIT_FEEDBACK),
              ),
            ),
          ),
        ],
      ),
    );
  }

  List<({String title, List<String> body})> _buildFaqItems(
      BuildContext context) {
    final l10n = context.l10n;

    if (isOhos()) {
      return [
        (
          title: "APP没有数据怎么办",
          body: [
            "1、 确定手表系统在 5.1.0.32SP3 及以上，手表型号需为 WATCH GT 5 系列（含 Pro）/ WATCH 4 系列以上，手环从华为手环 10 及以上。",
            "2、确认设备是否处于省电模式、低电量状态或手表佩戴未贴紧，以上情况会影响手表数据采集。",
            l10n.helpNoDataReasonFooter,
          ],
        ),
        (
          title: l10n.todayFaqLinkHrvRealtimeUpdate,
          body: [
            "在智能手表的默认设置下，HRV 每1小时更新一次。",
            "为了解决 HRV 更新间隔较长的问题，DoubleFeel 设计了实时压力功能：",
            "实时压力每6分钟更新一次（好友状态更新依赖 华为健康 同步，受系统机制影响可能存在短暂延迟。若好友经常使用DoubleFeel，健康状态会更新得更加及时）",
            l10n.todayRealtimeStressScenarioTimely,
            l10n.todayRealtimeStressScenarioConsistentTrend,
            l10n.todayRealtimeStressScenarioSummary,
          ],
        )
      ];
    }

    return [
      (
        title: l10n.todayFaqLinkNoData,
        body: [
          l10n.helpNoDataReason1,
          l10n.helpNoDataReason2,
          l10n.helpNoDataReason3,
          l10n.helpNoDataReasonFooter,
        ],
      ),
      (
        title: l10n.todayFaqLinkHrvRealtimeUpdate,
        body: [
          l10n.todayRealtimeStressScenarioHrvDefault,
          l10n.todayRealtimeStressScenarioRegionLimit,
          l10n.todayRealtimeStressScenarioIntro,
          l10n.todayRealtimeStressScenarioUpdateEvery6Min,
          l10n.todayRealtimeStressScenarioTimely,
          l10n.todayRealtimeStressScenarioConsistentTrend,
          l10n.todayRealtimeStressScenarioSummary,
        ],
      ),
      (
        title: l10n.todayFaqLinkWatchNoStatusAndInteractionNotification,
        body: [
          l10n.todayFaqWatchNoNotificationDescription1,
          l10n.todayFaqWatchNoNotificationDescription2,
          l10n.todayFaqWatchNoNotificationCheckPhoneNotification,
          l10n.todayFaqWatchNoNotificationCheckPhoneBackgroundRefresh,
          l10n.todayFaqWatchNoNotificationCheckWatchBackgroundRefresh,
          l10n.todayFaqWatchNoNotificationCheckModes,
          l10n.todayFaqWatchNoNotificationReinstall,
        ],
      ),
      (
        title: l10n.todayFaqLinkWatchFaceDataDelay,
        body: [
          l10n.todayFaqWatchFaceDelayDescription1,
          l10n.todayFaqWatchFaceDelayIfOverOneHour,
          l10n.todayFaqWatchFaceDelayOpenWatchApp,
          l10n.todayFaqWatchFaceDelayIfStill,
          l10n.todayFaqWatchFaceDelayRestartApp,
          l10n.todayFaqWatchFaceDelayCheckIntro,
          l10n.todayFaqWatchFaceDelayCheckData,
          l10n.todayFaqWatchFaceDelayCheckPhoneHealth,
          l10n.todayFaqWatchFaceDelayCheckWatchHealth,
          l10n.todayFaqWatchFaceDelayCheckBackgroundRefresh,
          l10n.todayFaqWatchFaceDelayRestartWatch,
        ],
      ),
      (
        title: l10n.todayFaqLinkWatchFaceBlackScreen,
        body: [
          l10n.todayFaqWatchFaceBlackScreenDescription,
        ],
      ),
    ];
  }
}

class _FaqCard extends StatelessWidget {
  const _FaqCard({required this.items});

  final List<({String title, List<String> body})> items;

  @override
  Widget build(BuildContext context) {
    return Container(
      padding: EdgeInsets.fromLTRB(20, 20, 20, 9),
      decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.circular(16),
      ),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Text(
            AppLocalizations.of(context)!.frequentlyAskedQuestions,
            style: TextStyle(
              color: context.colors.textPrimary,
              fontSize: 14,
              fontWeight: FontWeight.w600,
              height: 1.4,
            ),
          ),
          SizedBox(height: 8),
          ...items.map(
            (item) => _QuestionRow(
              title: item.title,
              onTap: () => _showQuestionBottomSheet(item),
            ),
          ),
        ],
      ),
    );
  }

  void _showQuestionBottomSheet(({String title, List<String> body}) item) {
    Get.bottomSheet(
      _QuestionBottomSheet(item: item),
      barrierColor: Colors.black.withValues(alpha: 0.7),
      enableDrag: true,
      isScrollControlled: true,
      persistent: false,
    );
  }
}

class _QuestionRow extends StatelessWidget {
  const _QuestionRow({
    required this.title,
    required this.onTap,
  });

  final String title;
  final VoidCallback onTap;

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      behavior: HitTestBehavior.opaque,
      onTap: onTap,
      child: SizedBox(
        height: 40,
        child: Row(
          children: [
            Expanded(
              child: Text(
                title,
                maxLines: 1,
                overflow: TextOverflow.ellipsis,
                style: TextStyle(
                  color: context.colors.textPrimary,
                  fontSize: 13,
                  fontWeight: FontWeight.w400,
                  height: 1.4,
                ),
              ),
            ),
            SizedBox(width: 12),
            Image.asset(
              'assets/images/common/ic_more_gray.png',
              width: 16,
              height: 16,
            ),
          ],
        ),
      ),
    );
  }
}

class _ActionRow extends StatelessWidget {
  const _ActionRow({
    required this.title,
    required this.onTap,
  });

  final String title;
  final VoidCallback onTap;

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      behavior: HitTestBehavior.opaque,
      onTap: onTap,
      child: Container(
        height: 56,
        padding: EdgeInsets.symmetric(horizontal: 20),
        decoration: BoxDecoration(
          color: Colors.white,
          borderRadius: BorderRadius.circular(16),
        ),
        child: Row(
          children: [
            Expanded(
              child: Text(
                title,
                maxLines: 1,
                overflow: TextOverflow.ellipsis,
                style: TextStyle(
                  color: context.colors.textPrimary,
                  fontSize: 14,
                  fontWeight: FontWeight.w600,
                  height: 1.4,
                ),
              ),
            ),
            Image.asset(
              'assets/images/common/ic_more_gray.png',
              width: 16,
              height: 16,
            ),
          ],
        ),
      ),
    );
  }
}

class _PrimaryHelpButton extends StatelessWidget {
  const _PrimaryHelpButton({
    required this.label,
    required this.onTap,
  });

  final String label;
  final VoidCallback onTap;

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      behavior: HitTestBehavior.opaque,
      onTap: onTap,
      child: Container(
        width: 280,
        height: 48,
        alignment: Alignment.center,
        decoration: BoxDecoration(
          color: AppColors.primary,
          borderRadius: BorderRadius.circular(24),
        ),
        child: Text(
          label,
          style: const TextStyle(
            color: Colors.white,
            fontSize: 16,
            fontWeight: FontWeight.w600,
          ),
        ),
      ),
    );
  }
}

class _QuestionBottomSheet extends StatelessWidget {
  const _QuestionBottomSheet({required this.item});

  final ({String title, List<String> body}) item;

  @override
  Widget build(BuildContext context) {
    return SizedBox(
      height: 331,
      child: Container(
        decoration: BoxDecoration(
          color: context.colors.backgroundPage,
          borderRadius: BorderRadius.vertical(top: Radius.circular(16)),
        ),
        child: SafeArea(
          top: false,
          child: Column(
            children: [
              SizedBox(height: 8),
              SizedBox(
                height: 56,
                child: Row(
                  // alignment: Alignment.center,

                  children: [
                    GestureDetector(
                      behavior: HitTestBehavior.opaque,
                      onTap: Get.back,
                      child: SizedBox(
                        width: 44,
                        height: 44,
                        child: Center(
                          child: Image.asset(
                            'assets/images/common/ic_close.png',
                            width: 20,
                            height: 20,
                            color: context.colors.chartPurple,
                          ),
                        ),
                      ),
                    ),
                    Expanded(
                      child: Text(
                        item.title,
                        maxLines: 1,
                        overflow: TextOverflow.ellipsis,
                        textAlign: TextAlign.center,
                        style: TextStyle(
                          color: context.colors.textPrimary,
                          fontSize: 16,
                          fontWeight: FontWeight.w600,
                          height: 1.2,
                        ),
                      ),
                    ),
                    SizedBox(
                      width: 44,
                    )
                  ],
                ),
              ),
              Container(
                height: 215,
                margin: EdgeInsets.symmetric(horizontal: 16),
                padding: EdgeInsets.fromLTRB(20, 20, 20, 18),
                decoration: BoxDecoration(
                  color: Colors.white,
                  borderRadius: BorderRadius.circular(16),
                ),
                child: ListView.separated(
                  physics: const ClampingScrollPhysics(),
                  padding: EdgeInsets.zero,
                  itemCount: item.body.length,
                  separatorBuilder: (_, __) => SizedBox(height: 12),
                  itemBuilder: (context, index) {
                    return Text(
                      item.body[index],
                      style: TextStyle(
                        color: context.colors.textSecondary,
                        fontSize: 13,
                        fontWeight: FontWeight.w400,
                        height: 17 / 12,
                      ),
                    );
                  },
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }
}