import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import 'package:nomo/app/base/base_view.dart';
import 'package:nomo/app/widgets/click_opacity.dart';
import 'package:nomo/app/widgets/ix_app_bar.dart';
import 'package:nomo/config/theme/theme_extensions/theme_extension.dart';

import '../controllers/feedback_controller.dart';

class FeedbackView extends BaseView<FeedbackController> {
  const FeedbackView({super.key});

  @override
  Widget buildContent(BuildContext context) {
    return Column(
      children: [
        IXAppBar(title: 'Feedback'),
        Expanded(
          child: Padding(
            padding: EdgeInsets.symmetric(horizontal: 14.w, vertical: 20.h),
            child: Column(
              children: [
                // 反馈内容输入区域
                Expanded(
                  child: Container(
                    decoration: BoxDecoration(
                      color: Get.reactiveTheme.highlightColor,
                      borderRadius: BorderRadius.circular(16.r),
                    ),
                    child: Padding(
                      padding: EdgeInsets.all(20.w),
                      child: TextField(
                        controller: controller.feedbackController,
                        maxLines: null,
                        expands: true,
                        textAlignVertical: TextAlignVertical.top,
                        style: TextStyle(fontSize: 16.sp, color: Colors.white),
                        decoration: InputDecoration(
                          hintText:
                              'An English version for reference: Describe\nyour issue or suggestion...',
                          hintStyle: TextStyle(
                            fontSize: 16.sp,
                            color: Get.reactiveTheme.hintColor,
                          ),
                          border: InputBorder.none,
                          contentPadding: EdgeInsets.zero,
                        ),
                      ),
                    ),
                  ),
                ),

                SizedBox(height: 20.h),

                // 邮箱输入区域
                Container(
                  decoration: BoxDecoration(
                    color: Get.reactiveTheme.highlightColor,
                    borderRadius: BorderRadius.circular(16.r),
                  ),
                  child: Padding(
                    padding: EdgeInsets.all(20.w),
                    child: Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        TextField(
                          controller: controller.emailController,
                          style: TextStyle(
                            fontSize: 16.sp,
                            color: Colors.white,
                          ),
                          decoration: InputDecoration(
                            hintText: 'Enter your email',
                            hintStyle: TextStyle(
                              fontSize: 16.sp,
                              color: Get.reactiveTheme.hintColor,
                            ),
                            border: InputBorder.none,
                            contentPadding: EdgeInsets.zero,
                          ),
                        ),
                        SizedBox(height: 8.h),
                        Text(
                          '• Your email address (for our reply)',
                          style: TextStyle(
                            fontSize: 12.sp,
                            color: Get.reactiveTheme.hintColor,
                          ),
                        ),
                      ],
                    ),
                  ),
                ),

                SizedBox(height: 30.h),

                // 发送按钮
                Obx(
                  () => ClickOpacity(
                    onTap: controller.isSubmitting.value
                        ? null
                        : controller.submitFeedback,
                    child: Container(
                      width: double.infinity,
                      height: 52.h,
                      decoration: BoxDecoration(
                        color:
                            controller.canSubmit &&
                                !controller.isSubmitting.value
                            ? const Color(0xFF00A8E8)
                            : Get.reactiveTheme.hintColor.withOpacity(0.3),
                        borderRadius: BorderRadius.circular(26.r),
                      ),
                      child: Center(
                        child: controller.isSubmitting.value
                            ? SizedBox(
                                width: 20.w,
                                height: 20.w,
                                child: CircularProgressIndicator(
                                  strokeWidth: 2,
                                  valueColor: AlwaysStoppedAnimation<Color>(
                                    Colors.white,
                                  ),
                                ),
                              )
                            : Text(
                                'Send',
                                style: TextStyle(
                                  fontSize: 16.sp,
                                  fontWeight: FontWeight.w600,
                                  color: controller.canSubmit
                                      ? Colors.white
                                      : Get.reactiveTheme.hintColor,
                                ),
                              ),
                      ),
                    ),
                  ),
                ),
              ],
            ),
          ),
        ),
      ],
    );
  }
}