import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';

import 'login_controller.dart';

class LoginView extends GetView<LoginController> {
  const LoginView({super.key});

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: () {
        // 收起键盘
        FocusScope.of(context).unfocus();
      },
      child: Scaffold(
        body: SafeArea(
          child: _buildBody(),
        ),
      ),
    );
  }

  Widget _buildBody() {
    return Container(
      margin: EdgeInsets.symmetric(vertical: 48.h),
      padding: EdgeInsets.symmetric(horizontal: 32.w),
      child: Column(
        children: [
          _buildTitle(),
          SizedBox(
            height: 32.h,
          ),
          _buildPhoneInputAndLoginButton(),
        ],
      ),
    );
  }

  Widget _buildTitle() {
    return SizedBox(
      width: double.infinity,
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Text(
            '欢迎使用斯凯签勤'.tr,
            style: TextStyle(
              fontSize: 22.sp,
              fontWeight: FontWeight.w500,
            ),
          ),
          SizedBox(
            height: 4.h,
          ),
          Text(
            '未注册手机号验证后将自动创建账号'.tr,
            style: TextStyle(
              fontSize: 14.sp,
              fontWeight: FontWeight.w500,
              color: Colors.grey,
            ),
          ),
        ],
      ),
    );
  }

  _buildPhoneInputAndLoginButton() {
    return Column(
      children: [
        TextField(
          keyboardType: TextInputType.phone,
          maxLength: 11,
          decoration: InputDecoration(
            counterText: '',
            hintText: '请输入手机号码'.tr,
            border: const UnderlineInputBorder(),
            // 获取焦点时的边框
            focusedBorder: const UnderlineInputBorder(
              borderSide: BorderSide(color: Colors.blue), // 🔥 你想要的颜色
            ),
          ),
        ),
        ElevatedButton(
          onPressed: () {},
          style: ButtonStyle(

          ),
          child: Text(
            '获取验证码'.tr,
          ),
        )
      ],
    );
  }
}