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

import '../../../../appRouters.dart';
import '../../../../app_settings/app_colors.dart';
import '../../../../tools/titleAppBar.dart';
import '../../../../translations/trans_lib.dart';

class SelectGatewayListPage extends StatefulWidget {
  const SelectGatewayListPage({Key? key}) : super(key: key);

  @override
  State<SelectGatewayListPage> createState() => _SelectGatewayListPageState();
}

class _SelectGatewayListPageState extends State<SelectGatewayListPage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: AppColors.mainBackgroundColor,
      appBar: TitleAppBar(
          barTitle: TranslationLoader.lanKeys!.selectGateway!.tr,
          haveBack: true,
          backgroundColor: AppColors.mainColor),
      body: ListView.builder(
          itemCount: 10,
          itemBuilder: (c, index) {
            return _selectGatewayListListItem(
                'images/mine/icon_mine_gatewayListMainIcon.png',
                "G2 41c21c",
                "-34", () {
              Navigator.pushNamed(
                  context, Routers.gatewayConfigurationWifiPage);
            });
          }),
    );
  }

  Widget _selectGatewayListListItem(String lockTypeIcon, String gateWayName,
      String networkSignal, Function() action) {
    return GestureDetector(
      onTap: action,
      child: Container(
        // height: 100.h,
        margin: const EdgeInsets.only(bottom: 2),
        padding:
            EdgeInsets.only(left: 10.w, right: 20.w, top: 16.h, bottom: 16.h),
        decoration: BoxDecoration(
          color: Colors.white,
          borderRadius: BorderRadius.circular(10.w),
        ),
        child: Row(
          children: [
            SizedBox(
              width: 10.w,
            ),
            Image.asset(
              lockTypeIcon,
              width: 60.w,
              height: 60.w,
            ),
            SizedBox(
              width: 20.w,
            ),
            Expanded(
              child: Column(
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                  Container(
                    // color: Colors.red,
                    child: Row(
                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                      children: [
                        Text(
                          gateWayName,
                          style: TextStyle(fontSize: 24.sp),
                        ),
                      ],
                    ),
                  ),
                  SizedBox(height: 5.h),
                  Container(
                    child: Row(
                      mainAxisAlignment: MainAxisAlignment.start,
                      children: [
                        Image.asset(
                          'images/mine/icon_mine_gatewaySignal_strong.png',
                          width: 22.w,
                          height: 22.w,
                        ),
                        SizedBox(
                          width: 10.w,
                        ),
                        Text(
                          networkSignal,
                          style: TextStyle(fontSize: 22.sp),
                        ),
                      ],
                    ),
                  ),
                  SizedBox(width: 20.h),
                ],
              ),
            ),
            SizedBox(width: 20.h),
            Image.asset(
              'images/icon_add_white.png',
              width: 36.w,
              height: 36.w,
              color: AppColors.mainColor,
            ),
            SizedBox(
              width: 20.w,
            ),
          ],
        ),
      ),
    );
  }
}