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: 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: 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.costPrice, '氢气价格'),
                _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)),
      ],
    );
  }

  /// 构建包含所有信息表单的卡片
  Widget _buildInfoFormCard(BuildContext context) {
    return Card(
      elevation: 2,
      shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(8)),
      child: 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.costPrice),
            _buildDisplayField(label: '官方价格 (元/kg)', value: controller.customerPrice),
            const SizedBox(height: 16),

            // --- 运营信息 ---
            _buildSectionTitle('运营信息'),
            Text('运营状态', style: TextStyle(color: Colors.grey[600], fontSize: 14)),
            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: 12),
            _buildDisplayField(label: '营业时间', value: controller.timeStr),
            _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 _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'),
          ],
        ),
      ),
    );
  }

  /// 构建退出登录按钮
  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 _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 _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)),
        ),
      ],
    );
  }
}