import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:getx_scaffold/getx_scaffold.dart';
import 'package:ln_jq_app/pages/b_page/reservation/controller.dart';

class ReservationPage extends GetView<ReservationController> {
  const ReservationPage({super.key});

  @override
  Widget build(BuildContext context) {
    return GetBuilder<ReservationController>(
      init: ReservationController(),
      id: 'b_reservation',
      builder: (_) {
        return Scaffold(
          body: SingleChildScrollView(
            child: Padding(
              padding: const EdgeInsets.all(12.0),
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.stretch,
                children: [
                  _buildHeaderCard(),
                  const SizedBox(height: 12),
                  _buildInfoFormCard(context),
                  const SizedBox(height: 12),
                  _buildTipsCard(),
                  const SizedBox(height: 12),
                  _buildLogoutButton(),
                ],
              ),
            ),
          ),
        );
      },
    );
  }

  /// 构建顶部的站点信息头卡片
  Widget _buildHeaderCard() {
    return Card(
      elevation: 2,
      shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(8)),
      child: Column(
        children: [
          ListTile(
            leading: const Icon(Icons.local_gas_station, color: Colors.blue, size: 40),
            title: Text(
              controller.name,
              style: const TextStyle(fontWeight: FontWeight.bold, fontSize: 18),
            ),
            subtitle: Text(controller.address),
            trailing: Container(
              padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 4),
              decoration: BoxDecoration(
                color: Colors.blue[100],
                borderRadius: BorderRadius.circular(12),
              ),
              child: Text(
                controller.selectedOperationStatus,
                style: const TextStyle(
                  color: Colors.blue,
                  fontWeight: FontWeight.bold,
                  fontSize: 12,
                ),
              ),
            ),
          ),
          const Divider(height: 1, indent: 16, endIndent: 16),
          Padding(
            padding: const EdgeInsets.symmetric(vertical: 16.0),
            child: Row(
              mainAxisAlignment: MainAxisAlignment.spaceAround,
              children: [
                _buildHeaderStat(controller.customerPrice, '氢气价格'),
                _buildHeaderStat(controller.timeStr, '营业时间'),
                _buildHeaderStat('98%', '设备状态'),
              ],
            ),
          ),
        ],
      ),
    );
  }

  /// 构建头部卡片中的单个统计项
  Widget _buildHeaderStat(String value, String label) {
    return Column(
      children: [
        Text(
          value,
          style: const TextStyle(
            color: Colors.blue,
            fontSize: 20,
            fontWeight: FontWeight.bold,
          ),
        ),
        const SizedBox(height: 4),
        Text(label, style: const TextStyle(color: Colors.grey, fontSize: 12)),
      ],
    );
  }

  /// 构建包含所有信息表单的卡片（增加 Tab 切换功能）
  Widget _buildInfoFormCard(BuildContext context) {
    return Card(
      elevation: 2,
      shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(8)),
      clipBehavior: Clip.antiAlias, // 确保 Tab 背景圆角生效
      child: Column(
        children: [
          // Tab 切换栏
          Obx(
            () => Container(
              color: Colors.grey[50],
              child: Row(
                children: [
                  _buildTabItem(0, Icons.business_outlined, '站点信息'),
                  _buildTabItem(1, Icons.campaign_outlined, '站点广播'),
                ],
              ),
            ),
          ),
          const Divider(height: 1),
          // 内容区域
          Obx(
            () => controller.selectedTabIndex.value == 0
                ? _buildStationInfo(context)
                : _buildStationBroadcast(context),
          ),
        ],
      ),
    );
  }

  /// 构建单个 Tab 项
  Widget _buildTabItem(int index, IconData icon, String label) {
    bool isSelected = controller.selectedTabIndex.value == index;
    return Expanded(
      child: InkWell(
        onTap: () => controller.selectedTabIndex.value = index,
        child: Container(
          padding: const EdgeInsets.symmetric(vertical: 14),
          decoration: BoxDecoration(
            border: Border(
              bottom: BorderSide(
                color: isSelected ? Colors.blue : Colors.transparent,
                width: 2,
              ),
            ),
          ),
          child: Row(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              Icon(icon, size: 20, color: isSelected ? Colors.blue : Colors.grey[600]),
              const SizedBox(width: 8),
              Text(
                label,
                style: TextStyle(
                  fontSize: 15,
                  fontWeight: isSelected ? FontWeight.bold : FontWeight.normal,
                  color: isSelected ? Colors.blue : Colors.grey[600],
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }

  /// 站点信息子视图
  Widget _buildStationInfo(BuildContext context) {
    return Padding(
      padding: const EdgeInsets.all(16.0),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          _buildSectionTitle('基本信息'),
          _buildDisplayField(label: '站点名称', value: controller.name),
          _buildDisplayField(label: '运营企业', value: controller.operatingEnterprise),
          _buildDisplayField(label: '站点地址', value: controller.address),
          const SizedBox(height: 16),
          _buildSectionTitle('价格信息'),
          _buildDisplayField(label: '官方价格 (元/kg)', value: controller.customerPrice),
          const SizedBox(height: 16),
          _buildSectionTitle('运营信息'),
          Row(
            children: [
              Text('运营状态', style: TextStyle(color: Colors.grey[600], fontSize: 14)),
              //加氢站未执行的状态修改任务
              if (controller.jobTipStr.isNotEmpty)
                GestureDetector(
                  onTap: controller.showJob,
                  child: Row(
                    children: [
                      Text(
                        controller.jobTipStr,
                        style: TextStyle(color: Colors.yellow[800], fontSize: 14),
                      ),
                      SizedBox(width: 2.w),
                      Icon(AntdIcon.info_circle, size: 14, color: Colors.yellow[800]),
                    ],
                  ),
                ),
            ],
          ),
          const SizedBox(height: 8),
          DropdownButtonFormField<String>(
            value: controller.selectedOperationStatus,
            items: controller.operationStatusOptions.map((String value) {
              return DropdownMenuItem<String>(value: value, child: Text(value));
            }).toList(),
            onChanged: controller.onOperationStatusChanged,
            decoration: InputDecoration(
              border: OutlineInputBorder(borderRadius: BorderRadius.circular(8.0)),
              contentPadding: const EdgeInsets.symmetric(horizontal: 12.0),
            ),
          ),
          const SizedBox(height: 16),
          if (controller.selectedOperationStatus == "营运中")
            _buildDisplayField(label: '营业时间', value: controller.timeStr)
          else
            Column(
              children: [
                _buildClickField(
                  label: '开始时间',
                  value: controller.customStartTimeStr,
                  onTap: () => controller.pickDateTime(context, true),
                ),
                _buildClickField(
                  label: '结束时间',
                  value: controller.customEndTimeStr,
                  onTap: () => controller.pickDateTime(context, false),
                ),
              ],
            ),
          _buildDisplayField(label: '联系电话', value: controller.phone),
          const SizedBox(height: 24),
          ElevatedButton(
            onPressed: controller.saveInfo,
            style: ElevatedButton.styleFrom(
              minimumSize: const Size(double.infinity, 48),
              shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(8)),
            ),
            child: const Text('保存信息', style: TextStyle(fontSize: 16)),
          ),
        ],
      ),
    );
  }

  /// 站点广播子视图
  Widget _buildStationBroadcast(BuildContext context) {
    return Padding(
      padding: const EdgeInsets.all(16.0),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Row(
            children: [
              const Icon(Icons.campaign, color: Colors.blue, size: 28),
              const SizedBox(width: 10),
              const Text(
                '站点广播通知',
                style: TextStyle(
                  fontSize: 18,
                  fontWeight: FontWeight.bold,
                  color: Colors.black87,
                ),
              ),
            ],
          ),
          const SizedBox(height: 13),
          _buildTextFieldLabel('通知标题'),
          const SizedBox(height: 8),
          SizedBox(
            height: 45.h,
            child: TextField(
              controller: controller.broadcastTitleController,
              maxLength: 30,
              decoration: InputDecoration(
                hintText: '例如：临时闭站通知',
                hintStyle: TextStyle(color: Colors.grey[400], fontSize: 14),
                border: OutlineInputBorder(borderRadius: BorderRadius.circular(8)),
                contentPadding: const EdgeInsets.symmetric(horizontal: 12, vertical: 10),
                counterText: '', // 隐藏原生计数器，我们可以按需自定义
              ),
            ),
          ),
          const SizedBox(height: 20),
          _buildTextFieldLabel('通知内容'),
          const SizedBox(height: 8),
          TextField(
            controller: controller.broadcastContentController,
            maxLength: 150,
            maxLines: 5,
            decoration: InputDecoration(
              hintText: '请输入通知内容...',
              hintStyle: TextStyle(color: Colors.grey[400], fontSize: 14),
              border: OutlineInputBorder(borderRadius: BorderRadius.circular(8)),
              contentPadding: const EdgeInsets.symmetric(horizontal: 12, vertical: 10),
            ),
          ),
          const SizedBox(height: 12),
          ElevatedButton(
            onPressed: controller.sendBroadcast,
            style: ElevatedButton.styleFrom(
              backgroundColor: Colors.blue,
              foregroundColor: Colors.white,
              minimumSize: const Size(double.infinity, 50),
              shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(12)),
              elevation: 0,
            ),
            child: const Text(
              '发送',
              style: TextStyle(fontSize: 16, fontWeight: FontWeight.bold),
            ),
          ),
          const SizedBox(height: 20),
        ],
      ),
    );
  }

  Widget _buildTextFieldLabel(String label) {
    return Text(
      label,
      style: const TextStyle(
        fontSize: 14,
        fontWeight: FontWeight.w500,
        color: Colors.black87,
      ),
    );
  }

  /// 构建带标题的表单区域
  Widget _buildSectionTitle(String title) {
    return Padding(
      padding: const EdgeInsets.only(bottom: 12.0),
      child: Row(
        children: [
          Container(width: 4, height: 16, color: Colors.blue),
          const SizedBox(width: 8),
          Text(title, style: const TextStyle(fontSize: 16, fontWeight: FontWeight.bold)),
        ],
      ),
    );
  }

  /// 构建一个“标签+纯文本”的显示行
  Widget _buildDisplayField({required String label, required String value}) {
    return Padding(
      padding: const EdgeInsets.only(bottom: 12.0),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Text(label, style: TextStyle(color: Colors.grey[600], fontSize: 14)),
          const SizedBox(height: 8),
          Container(
            width: double.infinity,
            padding: const EdgeInsets.symmetric(horizontal: 12.0, vertical: 12.0),
            decoration: BoxDecoration(
              color: Colors.grey[200],
              borderRadius: BorderRadius.circular(8.0),
              border: Border.all(color: Colors.grey[300]!),
            ),
            child: Text(
              value,
              style: const TextStyle(fontSize: 14, color: Colors.black87),
            ),
          ),
        ],
      ),
    );
  }

  /// 构建一个“可点击”的选择行
  Widget _buildClickField({
    required String label,
    required String value,
    required VoidCallback onTap,
  }) {
    return Padding(
      padding: const EdgeInsets.only(bottom: 12.0),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Text(label, style: TextStyle(color: Colors.grey[600], fontSize: 14)),
          const SizedBox(height: 8),
          InkWell(
            onTap: onTap,
            child: Container(
              width: double.infinity,
              padding: const EdgeInsets.symmetric(horizontal: 12.0, vertical: 12.0),
              decoration: BoxDecoration(
                color: Colors.white,
                borderRadius: BorderRadius.circular(8.0),
                border: Border.all(color: Colors.blue.withOpacity(0.5)),
              ),
              child: Row(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                children: [
                  Text(
                    value,
                    style: const TextStyle(fontSize: 14, color: Colors.black87),
                  ),
                  const Icon(Icons.calendar_month, size: 18, color: Colors.blue),
                ],
              ),
            ),
          ),
        ],
      ),
    );
  }

  /// 构建静态提示信息卡片
  Widget _buildTipsCard() {
    return Card(
      elevation: 2,
      shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(8)),
      child: Padding(
        padding: const EdgeInsets.all(16.0),
        child: Column(
          children: [
            _buildInfoItem(Icons.info_outline, '请确保信息准确无误'),
            const SizedBox(height: 10),
            _buildInfoItem(Icons.help_outline, '价格信息将实时更新到用户端'),
            const SizedBox(height: 10),
            _buildInfoItem(Icons.headset_mic_outlined, '如有疑问请联系技术支持: 400-021-1773'),
            const SizedBox(height: 10),
            Row(
              children: [
                const Icon(Icons.verified_outlined, color: Colors.blue, size: 20),
                const SizedBox(width: 10),
                Expanded(
                  child: FutureBuilder<String>(
                    future: getVersion(),
                    builder: (context, snapshot) {
                      if (snapshot.connectionState == ConnectionState.waiting) {
                        return const Text("");
                      }
                      if (snapshot.hasData) {
                        return TextX.labelSmall(
                          "当前版本: ${snapshot.data}",
                          color: Colors.black54,
                        );
                      }
                      return const Text("");
                    },
                  ),
                ),
              ],
            ),
          ],
        ),
      ),
    );
  }

  /// 构建退出登录按钮
  Widget _buildLogoutButton() {
    return ElevatedButton(
      onPressed: controller.logout,
      style: ElevatedButton.styleFrom(
        backgroundColor: Colors.red,
        foregroundColor: Colors.white,
        minimumSize: const Size(double.infinity, 48),
        shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(24)),
        elevation: 2,
      ),
      child: const Text(
        '退出登录',
        style: TextStyle(fontSize: 16, fontWeight: FontWeight.bold),
      ),
    );
  }

  /// 构建带图标的提示信息行
  Widget _buildInfoItem(IconData icon, String text) {
    return Row(
      children: [
        Icon(icon, color: Colors.blue, size: 20),
        const SizedBox(width: 10),
        Expanded(
          child: Text(text, style: const TextStyle(fontSize: 14, color: Colors.black54)),
        ),
      ],
    );
  }
}