deepvoice_client/lib/modules/ota_upgrade/views/ota_upgrade_view.dart

import 'package:flutter/material.dart';
import 'package:get/get.dart';
import '../controllers/ota_upgrade_controller.dart';

class OtaUpgradeView extends GetView<OtaUpgradeController> {
  const OtaUpgradeView({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: ConstrainedBox(
          constraints: BoxConstraints(maxWidth: 600), // 限制最大宽度
          child: SingleChildScrollView(
            child: Padding(
              padding: EdgeInsets.all(20),
              child: Column(
                mainAxisSize: MainAxisSize.min,
                children: [
                  // 设备图标
                  _buildDeviceIcon(),
                  SizedBox(height: 30),

                  // 版本信息
                  _buildVersionInfo(),
                  SizedBox(height: 40),

                  // 状态显示区域
                  Obx(() {
                    if (controller.isFetchingDeviceInfo.value) {
                      return _buildLoadingIndicator();
                    }
                    if (controller.errorMessage.value.isNotEmpty) {
                      return _buildErrorInfo();
                    }
                    return _buildUpdateButton();
                  }),
                ],
              ),
            ),
          ),
        ),
      ),
    );
  }

  // 组件化构建方法
  Widget _buildDeviceIcon() => CircleAvatar(
        radius: 60,
        backgroundColor: Colors.blue[100],
        child: Icon(Icons.phone_iphone, size: 60, color: Colors.blue),
      );

  Widget _buildVersionInfo() => Column(
        children: [
          Text('当前版本', style: TextStyle(fontSize: 18, color: Colors.grey)),
          SizedBox(height: 8),
          Text('v${controller.currentVersion}',
              style: TextStyle(
                  fontSize: 24,
                  fontWeight: FontWeight.bold,
                  color: Colors.blue)),
        ],
      );

  Widget _buildLoadingIndicator() => Column(
        children: [
          CircularProgressIndicator(),
          SizedBox(height: 20),
          Text('正在连接设备...', style: TextStyle(color: Colors.grey))
        ],
      );

  Widget _buildErrorInfo() => Column(
        children: [
          Icon(Icons.error_outline, color: Colors.red, size: 40),
          SizedBox(height: 10),
          Text(controller.errorMessage.value,
              style: TextStyle(color: Colors.red)),
          SizedBox(height: 20),
          ElevatedButton(
            onPressed: controller.retryConnection,
            child: Text('重试连接'),
          )
        ],
      );

  Widget _buildUpdateButton() {
    return controller.isUpdating.value
        ? _buildProgressIndicator()
        : ElevatedButton(
            style: ElevatedButton.styleFrom(
              backgroundColor: controller.isUpdateAvailable.value
                  ? Colors.blue
                  : Colors.grey,
              padding: EdgeInsets.symmetric(horizontal: 40, vertical: 15),
              shape: RoundedRectangleBorder(
                borderRadius: BorderRadius.circular(30),
              ),
            ),
            onPressed: controller.isUpdateAvailable.value
                ? controller.startUpdate
                : null,
            child: Text(
              controller.isUpdateAvailable.value ? '立即更新' : '已是最新版本',
              style: TextStyle(fontSize: 16, color: Colors.white),
            ),
          );
  }

  Widget _buildProgressIndicator() => Column(
        children: [
          SizedBox(
            width: 200,
            child: LinearProgressIndicator(
              value: controller.downloadProgress.value,
              backgroundColor: Colors.grey[200],
              valueColor: AlwaysStoppedAnimation(Colors.blue),
              minHeight: 12,
              borderRadius: BorderRadius.circular(10),
            ),
          ),
          SizedBox(height: 20),
          Text(
              '${(controller.downloadProgress.value * 100).toStringAsFixed(1)}%',
              style: TextStyle(color: Colors.grey))
        ],
      );
}