import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import 'package:wallpaperx/common/components/navigation_bar/custom_appbar.dart';
import 'package:wallpaperx/generated/assets.dart';
import 'package:wallpaperx/page/feed_back/feed_back_controller.dart';

class FeedBackView extends GetView<FeedBackController> {
  const FeedBackView({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(
        decoration: const BoxDecoration(
          image: DecorationImage(
            image: AssetImage(Assets.imagesSettingBackground),
            fit: BoxFit.cover,
          ),
        ),
        padding: const EdgeInsets.symmetric(horizontal: 15).w,
        child: _buildFeedback(),
      ),
    );
  }

  Widget _buildFeedback() {
    return SizedBox(
      child: Column(
        mainAxisAlignment: MainAxisAlignment.start,
        children: [
          CustomAppbar(
            "Feed Back",
            backgroundColor: Colors.transparent,
            titleStyle: TextStyle(
              color: Colors.white,
              fontSize: 24.sp,
              fontWeight: FontWeight.w600,
            ),
          ),
          15.verticalSpace,
          // 输入框
          Container(
            height: 150.w,
            padding: const EdgeInsets.fromLTRB(10, 0, 10, 10).w,
            margin: const EdgeInsets.symmetric(vertical: 10).w,
            decoration: BoxDecoration(
              borderRadius: BorderRadius.circular(8).r,
              border: Border.all(color: Colors.grey),
            ),
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Expanded(
                  child: TextField(
                    focusNode: controller.focusNode,
                    onTapOutside: (e) => {controller.focusNode.unfocus()},
                    autofocus: false,
                    controller: controller.feedbackTextController,
                    maxLines: 7,
                    style: TextStyle(
                      color: Colors.white,
                      fontSize: 14.sp,
                    ),
                    decoration: InputDecoration(
                      border: InputBorder.none,
                      hintText: "Please input your opinion",
                      hintStyle: TextStyle(
                        color: Colors.grey,
                        fontSize: 14.sp,
                      ),
                    ),
                  ),
                ),
              ],
            ),
          ),
          GestureDetector(
            onTap: controller.submit,
            child: Container(
              width: double.infinity,
              padding:
                  const EdgeInsets.symmetric(vertical: 10, horizontal: 15).w,
              decoration: BoxDecoration(
                  borderRadius: BorderRadius.circular(50).r,
                  color: Colors.white),
              child: Row(
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                  Text(
                    "Submit",
                    style: TextStyle(
                      color: Colors.black87,
                      fontSize: 16.sp,
                    ),
                  ),
                ],
              ),
            ),
          ),
        ],
      ),
    );
  }
}