import 'package:flutter/material.dart';

class HealthApp extends StatelessWidget {
  const HealthApp({super.key});

  @override
  Widget build(BuildContext context) {
    return HomePage1();
  }
}

class HomePage1 extends StatefulWidget {
  const HomePage1({super.key});

  @override
  State<HomePage1> createState() => _HomePageState();
}

class _HomePageState extends State<HomePage1>
    with SingleTickerProviderStateMixin {
  late TabController _tabController;
  int _bottomNavIndex = 0;

  @override
  void initState() {
    super.initState();
    _tabController = TabController(length: 3, vsync: this);
  }

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

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: _buildAppBar(),
      body: SingleChildScrollView(
        child: Column(
          children: [
            // _buildSearchBar(),
            // _buildServicesGrid(),
            const SizedBox(height: 12),
            // _buildHealthManagementCard(),
            const SizedBox(height: 12),
            // _buildDoctorBanner(),
            const SizedBox(height: 12),
            // _buildPopularServices(),
          ],
        ),
      ),
      // bottomNavigationBar: _buildBottomNavigationBar(),
    );
  }

  // 构建顶部 AppBar
  PreferredSizeWidget _buildAppBar() {
    return AppBar(
      backgroundColor: Colors.blue,
      elevation: 0,
      leading: SizedBox(),
      title: const Center(
        child: Text(
          '企业列表',
          style: TextStyle(
            color: Colors.white,
            fontWeight: FontWeight.bold,
            fontFamily: 'MyFont',
          ),
        ),
      ),
      actions: [
        // IconButton(
        //   onPressed: () {},
        //   icon: const Icon(Icons.widgets_outlined, color: Colors.black),
        // ),
        IconButton(
          onPressed: () {},
          icon: const Icon(Icons.add, color: Colors.white),
        ),
      ],
      bottom: TabBar(
        controller: _tabController,
        isScrollable: true,
        labelColor: Colors.black,
        unselectedLabelColor: Colors.grey[700],
        indicatorColor: Colors.blue,
        indicatorWeight: 3,
        tabs: const [
          Tab(text: '问题列表'),
          Tab(text: '历史问题列表'),
          Tab(text: '企业基本情况'),
        ],
      ),
    );
  }

  // 构建顶部 AppBar
  PreferredSizeWidget _buildAppBar2() {
    return AppBar(
      backgroundColor: Colors.lightBlue[50],
      elevation: 0,
      leading: const Icon(Icons.arrow_back_ios, color: Colors.black),
      title: const Center(
        child: Text(
          '企业列表',
          style: TextStyle(color: Colors.black, fontWeight: FontWeight.bold),
        ),
      ),
      actions: [
        // IconButton(
        //   onPressed: () {},
        //   icon: const Icon(Icons.widgets_outlined, color: Colors.black),
        // ),
        IconButton(
          onPressed: () {},
          icon: const Icon(Icons.add, color: Colors.black),
        ),
      ],
      bottom: TabBar(
        controller: _tabController,
        isScrollable: true,
        labelColor: Colors.black,
        unselectedLabelColor: Colors.grey[700],
        indicatorColor: Colors.blue,
        indicatorWeight: 3,
        tabs: const [
          Tab(text: '问题列表'),
          Tab(text: '历史问题列表'),
          Tab(text: '企业基本情况'),
        ],
      ),
    );
  }

  // 构建搜索框
  Widget _buildSearchBar() {
    return Container(
      padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
      color: Colors.lightBlue[50],
      child: Row(
        children: [
          const Text('淄博', style: TextStyle(fontSize: 16)),
          const Icon(Icons.arrow_drop_down),
          const SizedBox(width: 8),
          Expanded(
            child: Container(
              height: 40,
              decoration: BoxDecoration(
                color: Colors.white,
                borderRadius: BorderRadius.circular(20),
              ),
              child: const TextField(
                decoration: InputDecoration(
                  hintText: '家庭共济',
                  prefixIcon: Icon(Icons.search, color: Colors.grey),
                  border: InputBorder.none,
                  contentPadding: EdgeInsets.symmetric(vertical: 10),
                ),
              ),
            ),
          ),
          TextButton(
            onPressed: () {},
            child: const Text(
              '搜索',
              style: TextStyle(color: Colors.black, fontSize: 16),
            ),
          ),
        ],
      ),
    );
  }

  // 构建功能网格
  Widget _buildServicesGrid() {
    // 辅助函数创建单个网格项
    Widget buildGridItem(
      IconData icon,
      String label, {
      bool isSpecial = false,
    }) {
      return Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          Stack(
            alignment: Alignment.topRight,
            children: [
              Icon(icon, size: 40, color: Colors.blue),
              if (isSpecial)
                Container(
                  padding: const EdgeInsets.symmetric(
                    horizontal: 4,
                    vertical: 1,
                  ),
                  decoration: BoxDecoration(
                    color: Colors.red,
                    borderRadius: BorderRadius.circular(8),
                  ),
                  child: const Text(
                    '正品药',
                    style: TextStyle(color: Colors.white, fontSize: 8),
                  ),
                ),
            ],
          ),
          const SizedBox(height: 8),
          Text(label, style: const TextStyle(fontSize: 12)),
        ],
      );
    }

    return Container(
      color: Colors.lightBlue[50],
      padding: const EdgeInsets.fromLTRB(16, 16, 16, 24),
      child: GridView.count(
        crossAxisCount: 5,
        shrinkWrap: true,
        physics: const NeverScrollableScrollPhysics(),
        children: [
          buildGridItem(Icons.qr_code_scanner, '医保码'),
          buildGridItem(Icons.add_box, '挂号'),
          buildGridItem(Icons.person, '问诊'),
          buildGridItem(Icons.medical_services, '买药', isSpecial: true),
          buildGridItem(Icons.shield, '健康保障'),
          buildGridItem(Icons.local_hospital, '好药源选'),
          buildGridItem(Icons.health_and_safety, '体检'),
          buildGridItem(Icons.mood, '口腔'),
          buildGridItem(Icons.grass, '中医'),
          buildGridItem(Icons.apps, '全部服务'),
        ],
      ),
    );
  }

  // 构建健康管理卡片
  Widget _buildHealthManagementCard() {
    return Container(
      margin: const EdgeInsets.symmetric(horizontal: 16),
      padding: const EdgeInsets.all(16),
      decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.circular(12),
      ),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          const Text(
            '我的健康管理',
            style: TextStyle(fontWeight: FontWeight.bold, fontSize: 16),
          ),
          const SizedBox(height: 12),
          Container(
            padding: const EdgeInsets.all(12),
            decoration: BoxDecoration(
              color: Colors.blue.withOpacity(0.1),
              borderRadius: BorderRadius.circular(8),
            ),
            child: Row(
              children: [
                const Icon(Icons.warning_amber_rounded, color: Colors.orange),
                const SizedBox(width: 8),
                const Expanded(
                  child: Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: [
                      Text(
                        '你的补充医保待激活',
                        style: TextStyle(fontWeight: FontWeight.bold),
                      ),
                      Text(
                        '√ 医保内外都能报 √ 带病投保首选',
                        style: TextStyle(color: Colors.grey, fontSize: 12),
                      ),
                    ],
                  ),
                ),
                ElevatedButton(
                  onPressed: () {},
                  style: ElevatedButton.styleFrom(
                    backgroundColor: Colors.orange,
                    shape: RoundedRectangleBorder(
                      borderRadius: BorderRadius.circular(18.0),
                    ),
                  ),
                  child: const Text('去激活'),
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }

  // 构建医生问诊横幅
  Widget _buildDoctorBanner() {
    return Container(
      margin: const EdgeInsets.symmetric(horizontal: 16),
      padding: const EdgeInsets.all(16),
      decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.circular(12),
        image: const DecorationImage(
          // 模拟医生背景图
          image: NetworkImage(
            'https://img.tukuppt.com/png_preview/00/34/83/8fT4fFFaLg.jpg!/fw/780',
          ), // 使用一个示例医生图片 URL
          fit: BoxFit.cover,
          alignment: Alignment.centerRight,
          opacity: 0.8,
        ),
      ),
      child: const Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: [
          Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Text(
                '三甲医生快速问诊',
                style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold),
              ),
              SizedBox(height: 4),
              Text('100%公立医生 不限制问诊次数', style: TextStyle(color: Colors.grey)),
            ],
          ),
          // 医生图片通过 DecorationImage 实现
        ],
      ),
    );
  }

  // 构建热门服务部分
  Widget _buildPopularServices() {
    return Container(
      margin: const EdgeInsets.symmetric(horizontal: 16),
      padding: const EdgeInsets.all(16),
      decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.circular(12),
      ),
      child: Column(
        children: [
          const Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: [
              Text(
                '热门服务',
                style: TextStyle(fontWeight: FontWeight.bold, fontSize: 16),
              ),
              Text('专病专科', style: TextStyle(color: Colors.grey)),
              Text('健康百科', style: TextStyle(color: Colors.grey)),
              Row(
                children: [
                  Text('更多', style: TextStyle(color: Colors.grey)),
                  Icon(Icons.arrow_forward_ios, size: 12, color: Colors.grey),
                ],
              ),
            ],
          ),
          const SizedBox(height: 16),
          Row(
            children: [
              _buildServiceCard(
                '百万医疗险',
                '600万医疗保障',
                Icons.add_to_photos,
                Colors.blue,
              ),
              const SizedBox(width: 12),
              _buildServiceCard(
                '百万住院保障',
                '医保内外都可报',
                Icons.security,
                Colors.cyan,
              ),
            ],
          ),
          const SizedBox(height: 12),
          Row(
            children: [
              _buildServiceCard(
                '医保种牙',
                '种植牙方案科普',
                Icons.mood,
                Colors.lightBlue,
              ),
              const SizedBox(width: 12),
              _buildServiceCard(
                '我的家',
                '家人健康我守护',
                Icons.home,
                Colors.purpleAccent,
              ),
            ],
          ),
        ],
      ),
    );
  }

  // 服务卡片的小组件
  Widget _buildServiceCard(
    String title,
    String subtitle,
    IconData icon,
    Color color,
  ) {
    return Expanded(
      child: Container(
        padding: const EdgeInsets.all(12),
        decoration: BoxDecoration(
          color: color.withOpacity(0.1),
          borderRadius: BorderRadius.circular(8),
        ),
        child: Row(
          children: [
            Expanded(
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Text(
                    title,
                    style: const TextStyle(fontWeight: FontWeight.bold),
                  ),
                  const SizedBox(height: 4),
                  Text(
                    subtitle,
                    style: const TextStyle(fontSize: 12, color: Colors.grey),
                  ),
                ],
              ),
            ),
            Icon(icon, color: color, size: 30),
          ],
        ),
      ),
    );
  }

  // 构建底部导航栏
  Widget _buildBottomNavigationBar() {
    return BottomNavigationBar(
      currentIndex: _bottomNavIndex,
      onTap: (index) {
        setState(() {
          _bottomNavIndex = index;
        });
      },
      type: BottomNavigationBarType.fixed,
      selectedItemColor: Colors.blue,
      unselectedItemColor: Colors.grey,
      items: const [
        BottomNavigationBarItem(icon: Icon(Icons.home), label: '企业'),
        BottomNavigationBarItem(
          icon: Icon(Icons.card_membership),
          label: '全部问题',
        ),
        // BottomNavigationBarItem(icon: Icon(Icons.waves), label: 'AQ-健康管家'),
        // BottomNavigationBarItem(icon: Icon(Icons.add_moderator), label: '医疗保障'),
        BottomNavigationBarItem(icon: Icon(Icons.person_outline), label: '我的'),
      ],
    );
  }
}