nomo/lib/app/modules/feedback/views/feedback_view.dart

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 '../controllers/feedback_controller.dart';

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

  @override
  PreferredSizeWidget? get appBar => IXAppBar(title: 'Feedback');

  @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,
                  style: TextStyle(
                    fontSize: 16.sp,
                    height: 1.4,
                    color: Get.reactiveTheme.textTheme.bodyLarge!.color,
                    fontWeight: FontWeight.w400,
                  ),
                  decoration: InputDecoration(
                    hintText:
                        'An English version for reference: Describe\nyour issue or suggestion...',
                    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,
                style: TextStyle(
                  fontSize: 16.sp,
                  height: 1.4,
                  color: Get.reactiveTheme.textTheme.bodyLarge!.color,
                  fontWeight: FontWeight.w400,
                ),
                decoration: InputDecoration(
                  hintText: 'Enter your email',
                  hintStyle: TextStyle(
                    fontSize: 16.sp,
                    height: 1.4,
                    fontWeight: FontWeight.w400,
                    color: Get.reactiveTheme.hintColor,
                  ),
                  border: InputBorder.none,
                  contentPadding: EdgeInsets.zero,
                ),
              ),
            ),
          ),

          10.verticalSpaceFromWidth,

          Text(
            '• Your email address (for our reply)',
            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(
                  () => ClickOpacity(
                    onTap: controller.isSubmitting.value
                        ? null
                        : controller.submitFeedback,
                    child: Container(
                      width: double.infinity,
                      height: 50.w,
                      decoration: BoxDecoration(
                        color:
                            controller.canSubmit &&
                                !controller.isSubmitting.value
                            ? Get.reactiveTheme.shadowColor
                            : Get.reactiveTheme.highlightColor,
                        borderRadius: BorderRadius.circular(12.r),
                      ),
                      child: Center(
                        child: controller.isSubmitting.value
                            ? SpinKitRing(
                                size: 20.w,
                                lineWidth: 2.w,
                                color: Colors.white,
                              )
                            : Text(
                                'Send',
                                style: TextStyle(
                                  fontSize: 16.sp,
                                  fontWeight: FontWeight.w400,
                                  color: controller.canSubmit
                                      ? Get
                                            .reactiveTheme
                                            .textTheme
                                            .bodyLarge!
                                            .color
                                      : Get.reactiveTheme.hintColor,
                                ),
                              ),
                      ),
                    ),
                  ),
                ),
              ),
            ),
          ),
        ],
      ),
    );
  }
}