import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:flutter_spinkit/flutter_spinkit.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 '../../../../config/translations/strings_enum.dart';
import '../controllers/feedback_controller.dart';

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

  @override
  PreferredSizeWidget? get appBar => IXAppBar(
    title: Strings.feedback.tr,
    onBackPressed: controller.onBackPressed,
  );

  @override
  Widget buildContent(BuildContext context) {
    return Padding(
      padding: EdgeInsets.symmetric(horizontal: 14.w, vertical: 10.w),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          // 反馈内容输入区域
          Expanded(
            child: Container(
              decoration: BoxDecoration(
                color: Get.reactiveTheme.highlightColor,
                borderRadius: BorderRadius.circular(12.r),
                border: Border.all(
                  color: Get.reactiveTheme.dividerColor,
                  width: 1.w,
                ),
              ),
              child: Padding(
                padding: EdgeInsets.all(14.w),
                child: TextField(
                  controller: controller.feedbackController,
                  maxLines: null,
                  expands: true,
                  textAlignVertical: TextAlignVertical.top,
                  cursorHeight: 18.w,
                  focusNode: controller.feedbackFocusNode,
                  style: TextStyle(
                    fontSize: 16.sp,
                    height: 1.4,
                    color: Get.reactiveTheme.textTheme.bodyLarge!.color,
                    fontWeight: FontWeight.w400,
                  ),
                  decoration: InputDecoration(
                    hintText: Strings.feedbackPlaceholder.tr,
                    hintStyle: TextStyle(
                      fontSize: 16.sp,
                      height: 1.4,
                      fontWeight: FontWeight.w400,
                      color: Get.reactiveTheme.hintColor,
                    ),
                    border: InputBorder.none,
                    contentPadding: EdgeInsets.zero,
                  ),
                ),
              ),
            ),
          ),

          20.verticalSpaceFromWidth,

          // 邮箱输入区域
          Container(
            height: 50.w,
            alignment: Alignment.center,
            decoration: BoxDecoration(
              color: Get.reactiveTheme.highlightColor,
              borderRadius: BorderRadius.circular(12.r),
              border: Border.all(
                color: Get.reactiveTheme.dividerColor,
                width: 1.w,
              ),
            ),
            child: Padding(
              padding: EdgeInsets.symmetric(horizontal: 14.w),
              child: TextField(
                controller: controller.emailController,
                maxLines: 1, // 邮箱输入通常只需要一行
                cursorHeight: 18.w,
                scrollPadding: EdgeInsets.zero,
                focusNode: controller.emailFocusNode,
                style: TextStyle(
                  fontSize: 16.sp,
                  height: 1.4,
                  color: Get.reactiveTheme.textTheme.bodyLarge!.color,
                  fontWeight: FontWeight.w400,
                ),
                decoration: InputDecoration(
                  hintText: Strings.enterYourEmail.tr,
                  hintStyle: TextStyle(
                    fontSize: 16.sp,
                    height: 1.4,
                    fontWeight: FontWeight.w400,
                    color: Get.reactiveTheme.hintColor,
                  ),
                  border: InputBorder.none,
                  contentPadding: EdgeInsets.zero,
                ),
              ),
            ),
          ),

          10.verticalSpaceFromWidth,

          Text(
            Strings.emailAddressForReply.tr,
            style: TextStyle(
              fontSize: 13.sp,
              height: 1.4,
              fontWeight: FontWeight.w400,
              color: Get.reactiveTheme.hintColor,
            ),
          ),

          30.verticalSpaceFromWidth,

          // 发送按钮
          Expanded(
            child: SafeArea(
              child: Container(
                alignment: Alignment.bottomCenter,
                child: Obx(() {
                  final canSubmit = controller.canSubmit;
                  final isSubmitting = controller.isSubmitting.value;
                  final isEnabled = canSubmit && !isSubmitting;

                  return ClickOpacity(
                    onTap: isEnabled ? controller.submitFeedback : null,
                    child: AnimatedContainer(
                      duration: const Duration(milliseconds: 200),
                      width: double.infinity,
                      height: 50.w,
                      decoration: BoxDecoration(
                        color: isEnabled
                            ? Get.reactiveTheme.primaryColor
                            : Get.reactiveTheme.highlightColor,
                        borderRadius: BorderRadius.circular(12.r),
                        border: Border.all(
                          color: isEnabled
                              ? Get.reactiveTheme.primaryColor
                              : Get.reactiveTheme.dividerColor,
                          width: 1.w,
                        ),
                      ),
                      child: Center(
                        child: isSubmitting
                            ? SpinKitRing(
                                size: 20.w,
                                lineWidth: 2.w,
                                color: Get
                                    .reactiveTheme
                                    .textTheme
                                    .bodyLarge!
                                    .color!,
                              )
                            : Text(
                                Strings.send.tr,
                                style: TextStyle(
                                  fontSize: 16.sp,
                                  fontWeight: FontWeight.w600,
                                  color: isEnabled
                                      ? Colors.white
                                      : Get.reactiveTheme.hintColor,
                                ),
                              ),
                      ),
                    ),
                  );
                }),
              ),
            ),
          ),
        ],
      ),
    );
  }
}