import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:kaer_with_panels/app/widgets/kr_local_image.dart';
import 'package:kaer_with_panels/app/localization/app_translations.dart';
import 'package:kaer_with_panels/app/widgets/kr_app_text_style.dart';
import '../controllers/kr_order_status_controller.dart';

/// 订单状态视图
class KROrderStatusView extends GetView<KROrderStatusController> {
  const KROrderStatusView({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      extendBodyBehindAppBar: true,
      backgroundColor: Theme.of(context).primaryColor,
      appBar: AppBar(
        backgroundColor: Colors.transparent,
        elevation: 0,
        leading: IconButton(
          icon: Icon(
            Icons.arrow_back_ios,
            size: 20.r,
            color: Theme.of(context).textTheme.bodyMedium?.color,
          ),
          onPressed: () => Get.back(),
        ),
        centerTitle: true,
        title: Text(
          AppTranslations.kr_orderStatus.title,
          style: KrAppTextStyle(
            color: Theme.of(context).textTheme.bodyMedium?.color,
            fontSize: 16,
            fontWeight: FontWeight.w500,
          ),
        ),
      ),
      body: Container(
        decoration: BoxDecoration(
          gradient: LinearGradient(
            begin: Alignment.topCenter,
            end: Alignment.bottomCenter,
            colors: [
              Color.fromRGBO(23, 151, 255, 0.15),
              Color.fromRGBO(23, 151, 255, 0.05),
            ],
            stops: [0.0, 0.28],
          ),
        ),
        child: Obx(
          () => SafeArea(
            child: Center(
              child: Column(
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                  SizedBox(height: 60.h),
                  // 状态图标
                  _buildStatusIcon(),
                  SizedBox(height: 32.h),
                  // 状态文本
                  _buildStatusText(),
                  SizedBox(height: 16.h),
                  // 描述文本
                  _buildDescriptionText(),
                  const Spacer(),
                ],
              ),
            ),
          ),
        ),
      ),
    );
  }

  /// 构建状态图标
  Widget _buildStatusIcon() {
    return KrLocalImage(
      imageName: controller.kr_statusIcon.value,
      width: 160.w,
      height: 160.w,
    );
  }

  /// 构建状态文本
  Widget _buildStatusText() {
    return Padding(
      padding: EdgeInsets.symmetric(horizontal: 24.w),
      child: Text(
        controller.kr_statusTitle.value,
        textAlign: TextAlign.center,
        style: KrAppTextStyle(
          fontSize: 22,
          fontWeight: FontWeight.w600,
          color: Theme.of(Get.context!).textTheme.bodyMedium?.color,
        ),
      ),
    );
  }

  /// 构建描述文本
  Widget _buildDescriptionText() {
    return Padding(
      padding: EdgeInsets.symmetric(horizontal: 24.w),
      child: Text(
        controller.kr_statusDescription.value,
        textAlign: TextAlign.center,
        style: KrAppTextStyle(
          fontSize: 14,
          color: Theme.of(Get.context!).textTheme.bodySmall?.color,
        ).copyWith(height: 1.5),
      ),
    );
  }
}
