app-zj/lib/page/home/home_page.dart

import 'package:cached_network_image/cached_network_image.dart';
import 'package:card_swiper/card_swiper.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:lszlgl/base/base_state.dart';
import 'package:lszlgl/page/reap_step/reap_step_tab_page.dart';

/// 首页
class HomePage extends StatefulWidget {
  const HomePage({Key? key}) : super(key: key);

  @override
  State<HomePage> createState() => _HomePageState();
}

class _HomePageState extends BaseState<HomePage> with AutomaticKeepAliveClientMixin {
  List<String> bannerList = [
    'https://gd-hbimg.huaban.com/c7a22fb15d70a0a976e20fb810c048ec11c76fc31ac08-hajElf_fw658webp',
    'https://gd-hbimg.huaban.com/82e60fd3c61530d52ec1d01f80cfda11526c42e4495cb-6JwN1d_fw658webp',
  ];

  late List<ServiceModel> serviceList;

  void startReap() {
    MyRouter.startReapStepList(const ReapStepTabPageArgs(type: StepType.reap));
  }

  void startStore() {
    MyRouter.startReapStepList(const ReapStepTabPageArgs(type: StepType.stock));
  }

  @override
  void initState() {
    super.initState();
    serviceList = [
      ServiceModel(name: '收货环节', icon: imgHomeListPzjc, onTap: startReap),
      ServiceModel(name: '库存环节', icon: imgHomeListZcjy, onTap: startStore),
    ];
  }

  @override
  Widget build(BuildContext context) {
    super.build(context);
    return myScaffold(child: buildBody());
  }

  Widget buildBody() {
    return Column(
      children: [
        myAppBar(title: '质量安全检验监测', autoLeading: false),
        Expanded(
          child: SingleChildScrollView(
            physics: const BouncingScrollPhysics(),
            child: Column(
              children: [
                buildBanner(),
                const SizedBox(height: 24),
                ...List.generate(
                  serviceList.length,
                  (index) => buildServiceItem(serviceList[index]),
                ).toList(),
              ],
            ),
          ),
        ),
      ],
    );
  }

  Widget buildTitle() {
    return Container(
      alignment: Alignment.center,
      padding: EdgeInsets.only(top: MediaQuery.of(context).padding.top + 26, bottom: 26),
      child: const Text(
        '质量安全检验监测',
        style: TextStyle(color: Colors.white, fontSize: 22, fontWeight: FontWeight.w500),
      ),
    );
  }

  Widget buildBanner() {
    return Container(
      margin: const EdgeInsets.symmetric(horizontal: 12),
      decoration: const BoxDecoration(borderRadius: BorderRadius.all(Radius.circular(18))),
      clipBehavior: Clip.hardEdge,
      child: AspectRatio(
        aspectRatio: 2 / 1,
        child: Swiper(
          autoplay: true,
          autoplayDelay: const Duration(seconds: 5).inMilliseconds,
          itemCount: bannerList.length,
          itemBuilder: (_, index) => CachedNetworkImage(
            fit: BoxFit.cover,
            imageUrl: bannerList[index],
            placeholder: (_, __) => const Center(child: CircularProgressIndicator()),
            errorWidget: (context, url, error) => const Center(child: Icon(Icons.error)),
          ),
        ),
      ),
    );
  }

  Widget buildServiceItem(ServiceModel service) {
    return GestureDetector(
      onTap: service.onTap,
      child: Container(
        margin: const EdgeInsets.only(left: 14, right: 14, bottom: 28),
        padding: const EdgeInsets.symmetric(vertical: 24, horizontal: 48),
        clipBehavior: Clip.hardEdge,
        decoration: BoxDecoration(
          borderRadius: const BorderRadius.all(Radius.circular(12)),
          boxShadow: [BoxShadow(color: Colors.black.withOpacity(0.1), offset: const Offset(0, 5), blurRadius: 4)],
          image: const DecorationImage(image: AssetImage(imgHomeListBg), fit: BoxFit.fill),
        ),
        child: Row(
          children: [
            Image.asset(service.icon, height: 80),
            const SizedBox(width: 16),
            Expanded(
              child: Column(
                mainAxisSize: MainAxisSize.min,
                children: [
                  Text(
                    service.name,
                    textAlign: TextAlign.center,
                    style: const TextStyle(color: Color(0xFF333333), fontSize: 27, fontWeight: FontWeight.w500),
                  ),
                  service.nameEn != null
                      ? Padding(
                          padding: const EdgeInsets.only(top: 4),
                          child: Text(
                            service.nameEn!,
                            textAlign: TextAlign.center,
                            style: const TextStyle(color: Color(0xFF333333), fontSize: 12, fontWeight: FontWeight.w500),
                          ),
                        )
                      : const SizedBox.shrink(),
                ],
              ),
            ),
          ],
        ),
      ),
    );
  }

  @override
  bool get wantKeepAlive => true;
}

class ServiceModel {
  final String name;
  final String? nameEn;
  final String icon;
  final VoidCallback onTap;

  ServiceModel({
    required this.name,
    this.nameEn,
    required this.icon,
    required this.onTap,
  });
}