// ignore_for_file: sized_box_for_whitespace

import 'package:flutter/material.dart';
import 'package:tour_travel_agr/helper/widget_responsive.dart';
import 'package:tour_travel_agr/resource/assets.dart';
import 'package:tour_travel_agr/resource/colors.dart';
import 'package:tour_travel_agr/resource/font.dart';
import 'package:tour_travel_agr/resource/routes.dart';
import 'package:tour_travel_agr/resource/size.dart';
import 'package:tour_travel_agr/resource/style.dart';

class HomeView extends StatelessWidget {
  const HomeView({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: ColorManager.backgroundColor,
      body: ScreenResponsive(
        widget: const BodyWIdget(),
        widthScreen: MediaQuery.of(context).size.width,
      ),
    );
  }
}

class BodyWIdget extends StatelessWidget {
  const BodyWIdget({
    Key? key,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Container(
      padding: EdgeInsets.only(
        top: AppPadding.safeAreaTop(context),
        bottom: AppPadding.safeAreaBot(context),
      ),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Container(
            margin: EdgeInsets.only(
              top: AppMargin.m12,
            ),
            padding: EdgeInsets.symmetric(
              horizontal: AppPadding.p20,
            ),
            child: Column(
              mainAxisAlignment: MainAxisAlignment.start,
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Text(
                  "Welcome",
                  style: getRegularStyle(
                    color: Colors.black,
                    fontFamily: FontConstants.mulish,
                  ),
                ),
                SizedBox(
                  height: AppMargin.m4,
                ),
                Text(
                  "Dio Maulana",
                  style: getBoldStyle(
                    color: Colors.black,
                    fontFamily: FontConstants.mulish,
                    fontSize: 18,
                  ),
                ),
              ],
            ),
          ),
          Expanded(
            child: SingleChildScrollView(
              child: Column(
                children: [
                  Container(
                    margin: EdgeInsets.only(
                      top: AppMargin.m25,
                    ),
                    height: 187,
                    width: double.infinity,
                    child: Image(
                      fit: BoxFit.fill,
                      image: AssetImage(
                        Assets.homeBanner,
                      ),
                    ),
                  ),
                  Container(
                    margin: EdgeInsets.only(
                      top: AppMargin.m25,
                    ),
                    padding: EdgeInsets.symmetric(
                      horizontal: AppPadding.p20,
                    ),
                    child: Row(
                      mainAxisAlignment: MainAxisAlignment.spaceAround,
                      crossAxisAlignment: CrossAxisAlignment.center,
                      children: [
                        CardSectionHome(
                          title: "Reimburse",
                          subtitle: "List Data Reimbursement",
                          logo: Assets.reimburseIcon,
                        ),
                        CardSectionHome(
                          title: "History",
                          subtitle: "Riwayat Perjalanan",
                          logo: Assets.historyIcon,
                        ),
                      ],
                    ),
                  ),
                  Container(
                    margin: EdgeInsets.only(
                      top: AppMargin.m12,
                    ),
                    padding: EdgeInsets.symmetric(
                      horizontal: AppPadding.p20,
                    ),
                    child: Row(
                      mainAxisAlignment: MainAxisAlignment.spaceAround,
                      crossAxisAlignment: CrossAxisAlignment.center,
                      children: [
                        GestureDetector(
                          onTap: () {
                            Navigator.pushNamed(
                              context,
                              Routes.profileRoute,
                            );
                          },
                          child: CardSectionHome(
                            title: "Profile",
                            subtitle:
                                "List Report Harian, mingguan dan Bulanan",
                            logo: Assets.profileIcon,
                          ),
                        ),
                        CardSectionHome(
                          title: "Log out",
                          logo: Assets.logoutIcon,
                        ),
                      ],
                    ),
                  ),
                ],
              ),
            ),
          )
        ],
      ),
    );
  }
}

class CardSectionHome extends StatelessWidget {
  const CardSectionHome({
    Key? key,
    required this.title,
    this.subtitle,
    required this.logo,
  }) : super(key: key);

  final String title;
  final String? subtitle;
  final String logo;

  @override
  Widget build(BuildContext context) {
    return Container(
      width: 155,
      height: 155,
      padding: EdgeInsets.all(
        AppPadding.p20,
      ),
      decoration: BoxDecoration(
        border: Border.all(
          color: ColorManager.primary,
        ),
        borderRadius: BorderRadius.circular(
          12,
        ),
      ),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Text(
            title,
            style: getSemiBoldStyle(
              color: ColorManager.grey,
              fontFamily: FontConstants.openSans,
              fontSize: FontSize.s16,
            ),
          ),
          SizedBox(
            height: AppMargin.m6,
          ),
          (subtitle != null)
              ? Text(
                  subtitle!,
                  style: getRegularStyle(
                    color: ColorManager.grey,
                    fontFamily: FontConstants.openSans,
                    fontSize: FontSize.s10,
                  ),
                )
              : const SizedBox(),
          const Spacer(),
          Row(
            children: [
              const Spacer(),
              Container(
                width: 36,
                height: 36,
                child: Image(
                  image: AssetImage(
                    logo,
                  ),
                ),
              )
            ],
          )
        ],
      ),
    );
  }
}
