Clean/lib/module/locations_photo/locations_single_photo_view.dart

import 'package:clean/base/base_page.dart';
import 'package:clean/data/bean/photos_type.dart';
import 'package:clean/module/locations_photo/locations_single_photo_controller.dart';
import 'package:clean/module/people_photo/photo_group.dart';
import 'package:clean/resource/assets.gen.dart';
import 'package:clean/router/app_pages.dart';
import 'package:flutter/Material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import 'package:wechat_assets_picker/wechat_assets_picker.dart';

import '../../utils/styles.dart';

class LocationsSinglePhotoPage
    extends BasePage<LocationsSinglePhotoController> {
  const LocationsSinglePhotoPage({super.key});

  static void start({required PhotoGroup photoGroup}) {
    Get.toNamed(RoutePath.locationsSinglePhoto, arguments: {
      "PhotoGroup": photoGroup,
    });
  }

  @override
  bool statusBarDarkFont() {
    return false;
  }

  @override
  bool immersive() {
    return true;
  }

  @override
  Widget buildBody(BuildContext context) {
    return Stack(children: [
      PopScope(
          canPop: false,
          onPopInvokedWithResult: (didPop, result) {
            if (didPop) {
              return;
            }
            controller.clickBack();
          },
          child: Container(
            child: SafeArea(
              child: Obx(() {
                if (controller.photoGroups.isEmpty) {
                  return _noNoPicturesCard();
                }
                return Column(
                  children: [
                    _titleCard(),
                    Expanded(
                      child: Obx(() {
                        return SizedBox(
                          child: GridView.builder(
                              padding: EdgeInsets.symmetric(horizontal: 16.w),
                              scrollDirection: Axis.vertical,
                              // 设置为垂直方向滚动
                              physics: BouncingScrollPhysics(),
                              gridDelegate:
                                  SliverGridDelegateWithFixedCrossAxisCount(
                                crossAxisCount: 3, // 每行显示 3 个元素
                                mainAxisSpacing: 8.w, // 垂直间距
                                crossAxisSpacing: 8.h, // 水平间距
                              ),
                              itemCount:
                                  controller.photoGroups.first.images.length,
                              itemBuilder: _buildPhotoItem(
                                  controller.photoGroups.first.images)),
                        );
                      }),
                    ),
                    Obx(() {
                      if (controller.selectedFileCount.value == 0) {
                        return SizedBox();
                      } else {
                        return _bottomBarCard();
                      }
                    }),
                    SizedBox(height: 8.h),
                  ],
                );
              }),
            ),
          )),
      IgnorePointer(
        child: Assets.images.bgHome.image(
          width: 360.w,
        ),
      ),
    ]);
  }

  Widget _titleCard() {
    return Container(
      alignment: Alignment.centerLeft,
      padding: EdgeInsets.only(left: 16.w, top: 14.h, right: 16.w),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: [
              GestureDetector(
                onTap: controller.clickBack,
                child: Assets.images.iconBackArrow.image(
                  width: 28.w,
                  height: 28.h,
                ),
              ),
              Obx(() {
                if (controller.photoGroups.isEmpty) return SizedBox();
                return Text(
                  controller.photoGroups.first.location ?? "",
                  textAlign: TextAlign.center,
                  style: TextStyle(
                    color: Colors.white,
                    fontSize: 17.sp,
                    fontWeight: FontWeight.w500,
                  ),
                );
              }),
              Obx(() {
                if (controller.photoGroups.isEmpty) return SizedBox();
                return GestureDetector(
                  onTap: () => controller.toggleGroupSelection(
                      controller.photoGroups.first.images),
                  child: Obx(() => Text(
                        controller.photoGroups.first.isSelected.value
                            ? 'Deselect All'
                            : 'Select All',
                        style: TextStyle(
                          color: Colors.white.withValues(alpha: 0.7),
                          fontSize: 14.sp,
                          fontWeight: FontWeight.w400,
                        ),
                      )),
                );
              }),
            ],
          ),
          SizedBox(height: 30.h),
        ],
      ),
    );
  }

  Widget _bottomBarCard() {
    return GestureDetector(
      onTap: () => controller.clickDelete(),
      child: Container(
        width: 328.w,
        height: 48.h,
        decoration: ShapeDecoration(
          color: Color(0xFF0279FB),
          shape: RoundedRectangleBorder(
            borderRadius: BorderRadius.circular(10.r),
          ),
        ),
        padding: EdgeInsets.symmetric(horizontal: 16.w),
        child: Row(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Assets.images.iconDelete.image(
              width: 18.w,
              height: 18.h,
            ),
            SizedBox(width: 5.w),
            Obx(() {
              return Text(
                'Delete ${controller.selectedFileCount.value} Photos (${controller.selectedFilesSizeString})',
                textAlign: TextAlign.center,
                style: TextStyle(
                  color: Colors.white,
                  fontSize: 16.sp,
                  fontWeight: FontWeight.w500,
                ),
              );
            }),
          ],
        ),
      ),
    );
  }

  Widget Function(BuildContext, int) _buildPhotoItem(
          List<AssetEntity> images) =>
      (context, index) {
        final group = controller.getGroupByImages(images);

        return GestureDetector(
          onTap: () =>
              controller.clickImage(images, index, PhotosType.locationPhotos),
          child: Obx(() {
            final isSelected = group.selectedImages[index];
            return Stack(
              children: [
                Container(
                  width: 104.w,
                  height: 104.w,
                  decoration: ShapeDecoration(
                    color: Colors.white.withValues(alpha: 0.12),
                    shape: RoundedRectangleBorder(
                      borderRadius: BorderRadius.circular(9.27.sp),
                    ),
                  ),
                  child: ClipRRect(
                    borderRadius: BorderRadius.circular(9.27.sp),
                    child: AssetEntityImage(
                      group.images[index],
                      width: 104.w,
                      height: 104.w,
                      fit: BoxFit.cover,
                      frameBuilder: Styles.customFrameBuilder(
                        opacity: 0.22,
                        width: 80.w,
                        height: 80.w,
                      ),
                    ),
                  ),
                ),
                Positioned(
                  right: 8.w,
                  bottom: 8.h,
                  child: GestureDetector(
                      onTap: () =>
                          controller.toggleImageSelection(images, index),
                      child: Container(
                        child: isSelected
                            ? Center(
                                child: Assets.images.iconSelected.image(
                                  width: 20.w,
                                  height: 20.h,
                                ),
                              )
                            : Center(
                                child: Assets.images.iconUnselected.image(
                                width: 20.w,
                                height: 20.h,
                              )),
                      )),
                ),
              ],
            );
          }),
        );
      };

  Widget _noNoPicturesCard() {
    return Column(
      children: [
        _titleCard(),
        SizedBox(
          height: 170.h,
        ),
        Container(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            crossAxisAlignment: CrossAxisAlignment.center,
            children: [
              Container(
                width: 70.w,
                height: 70.h,
                clipBehavior: Clip.antiAlias,
                decoration: BoxDecoration(),
                child: Assets.images.iconNoPictures.image(),
              ),
              SizedBox(height: 22.h),
              Text(
                'No pictures found',
                textAlign: TextAlign.center,
                style: TextStyle(
                  color: Colors.white,
                  fontSize: 20.sp,
                  fontWeight: FontWeight.w700,
                ),
              ),
              SizedBox(height: 12.h),
              Text(
                'No pictures available at the moment',
                textAlign: TextAlign.center,
                style: TextStyle(
                  color: Colors.white.withValues(alpha: 0.6),
                  fontSize: 14.sp,
                  fontWeight: FontWeight.w400,
                ),
              ),
            ],
          ),
        ),
      ],
    );
  }
}