import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:keyboard/base/base_page.dart';
import 'package:keyboard/module/feedback/feedback_controller.dart';
import 'package:get/get.dart';
import 'package:keyboard/resource/colors.gen.dart';
import 'package:keyboard/widget/commonAppBar.dart';

import '../../resource/assets.gen.dart';
import '../../resource/string.gen.dart';
import '../../router/app_pages.dart';
import '../../utils/styles.dart';

class FeedbackPage extends BasePage<FeedbackController> {
  const FeedbackPage({super.key});

  static start(FeedbackType type) {
    Get.toNamed(RoutePath.feedback, arguments: {"type": type});
  }

  @override
  bool immersive() {
    return false;
  }

  @override
  Color backgroundColor() => Color(0xFFF6F5FA);

  @override
  Widget buildBody(BuildContext context) {
    return Scaffold(
      resizeToAvoidBottomInset: false,
      backgroundColor: backgroundColor(),
      appBar: CommonAppBar(
        title: controller.getTitleText(),
        backgroundColor: backgroundColor,
        onBack: () {
          controller.backClick();
        },
      ),
      body: Container(
        margin: EdgeInsets.only(left: 16.w, right: 16.w, top: 20.h),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.stretch,
          children: [
            Container(
              padding: EdgeInsets.all(16.r),
              // height: 221.w,
              decoration: BoxDecoration(
                color: Colors.white,
                borderRadius: BorderRadius.circular(12.r),
              ),
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Container(
                    decoration: BoxDecoration(
                      color: Colors.white,
                      borderRadius: BorderRadius.circular(8.r),
                    ),
                    child: Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        Text(
                          controller.getContentTitle(),
                          style: TextStyle(
                            color: Colors.black,
                            fontSize: 14.sp,
                            fontWeight: FontWeight.w400,
                          ),
                        ),
                        SizedBox(height: 8.h),
                        SizedBox(
                          height: 161.h,
                          child: TextField(
                            maxLength: 300,
                            maxLines: null,
                            expands: true,
                            textAlignVertical: TextAlignVertical.top,
                            decoration: InputDecoration(

                              hintText: controller.getContentHint(),
                              hintStyle: TextStyle(
                                color: Colors.black.withAlpha(66),
                              ),
                              border: OutlineInputBorder(
                                borderRadius: BorderRadius.circular(10.r),
                                borderSide: BorderSide.none, // 移除边框线
                              ),
                              filled: true,
                              fillColor: const Color(0xFFF5F4F9),
                            ),
                            onChanged: (value) {
                              controller.onContentChanged(value);
                            },
                          ),
                        ),
                      ],
                    ),
                  ),
                ],
              ),
            ),

            SizedBox(height: 8.h),
            Container(
              padding: EdgeInsets.all(16.r),
              decoration: BoxDecoration(
                color: Colors.white,
                borderRadius: BorderRadius.circular(12),
              ),
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Text(
                    StringName.feedbackPhone,
                    style: TextStyle(
                      fontSize: 16,
                      color: Colors.black.withAlpha(204),
                    ),
                  ),
                  const SizedBox(height: 8),
                  SizedBox(
                    height: 48.h,
                    child: TextField(
                      inputFormatters: [FilteringTextInputFormatter.digitsOnly],
                      maxLength: 11,
                      maxLines: null,
                      expands: true,
                      textAlignVertical: TextAlignVertical.top,
                      decoration: InputDecoration(
                        counterText: "",
                        hintText: StringName.feedbackPhoneHint,
                        hintStyle: TextStyle(color: Colors.black.withAlpha(66)),
                        border: OutlineInputBorder(
                          borderRadius: BorderRadius.circular(10.r),
                          borderSide: BorderSide.none,
                        ),
                        filled: true,
                        fillColor: const Color(0xFFF5F4F9),
                      ),
                      onChanged: (value) {
                        controller.onPhoneChanged(value);
                      },
                    ),
                  ),
                ],
              ),
            ),

            Spacer(),
            GestureDetector(
              onTap: () {
                controller.submitClick();
              },
              child: Container(
                height: 48.h,
                alignment: Alignment.center,
                decoration: Styles.getActivateButtonDecoration(31.r),
                child: Text(
                  StringName.feedbackSubmit,
                  style: Styles.getTextStyleWhiteW500(16.sp),
                ),
              ),
            ),

            SizedBox(height: 16.h),
          ],
        ),
      ),
    );
  }
}