app-zj/lib/page/reap_step/reap_step_list_page.dart

import 'package:flutter/material.dart';
import 'package:lszlgl/base/base_lifecycle_state.dart';
import 'package:lszlgl/base/base_state.dart';
import 'package:lszlgl/config/colors.dart';
import 'package:lszlgl/page/reap_step/reap_step_tab_page.dart';
import 'package:lszlgl/widget/button.dart';

/// 扦样环节列表
class ReapStepListPage extends StatefulWidget {
  final StepType type;
  final bool complete;

  const ReapStepListPage({
    super.key,
    required this.type,
    this.complete = false,
  });

  @override
  State<ReapStepListPage> createState() => _ReapStepListPageState();
}

class _ReapStepListPageState extends BaseLifecycleState<ReapStepListPage> {
  late List<Map<String, String>> infoList;

  /// 详情
  void startDetail() {
    if (!widget.complete) return;
    switch (widget.type) {
      case StepType.reap:
        MyRouter.startReapSampleTask(detail: true);
        break;
      case StepType.stock:
        break;
    }
  }

  /// 扦样
  void startSample() {
    switch (widget.type) {
      case StepType.reap:
        MyRouter.startReapSampleTask();
        break;
      case StepType.stock:
        break;
    }
  }

  @override
  void onInit() {
    String taskType = switch (widget.type) {
      StepType.reap => '收购监测',
      StepType.stock => '库存监测',
      _ => '',
    };
    if (widget.complete) {
      infoList = [
        {'采样品种': '玉米'},
        {'粮食品类': '粮食品类'},
        {'监测类别': taskType},
        {'扦样数量(kg)': '10'},
        {'扦样人员': '李飞'},
        {'扦样时间': '2024-01-01'},
      ];
    } else {
      infoList = [
        {'采样品种': '玉米'},
        {'报送截止时间': '2024-01-01'},
        {'监测类别': taskType},
        {'扦样人员': '李飞'},
      ];
    }
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      clipBehavior: Clip.hardEdge,
      decoration: const BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.vertical(top: Radius.circular(16)),
      ),
      alignment: Alignment.center,
      child: buildList(),
    );
  }

  Widget buildList() {
    return ListView.builder(
      physics: const BouncingScrollPhysics(),
      padding: EdgeInsets.zero,
      itemCount: 10,
      itemBuilder: (_, index) => buildItem(index),
    );
  }

  Widget buildItem(int index) {
    return GestureDetector(
      behavior: HitTestBehavior.opaque,
      onTap: () => startDetail(),
      child: Container(
        margin: const EdgeInsets.only(left: 12, right: 12, top: 12),
        decoration: const BoxDecoration(
          color: Color(0xFFF5FFFD),
          borderRadius: BorderRadius.all(Radius.circular(8)),
        ),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            const SizedBox(height: 15),
            buildTop(),
            buildNumber(),
            buildGrid(),
            buildBottom(),
            const SizedBox(height: 15),
          ],
        ),
      ),
    );
  }

  Widget buildTop() {
    return Row(
      children: [
        buildVLine(),
        const Expanded(
          child: Text(
            '扦样任务单号',
            style: TextStyle(color: MyColor.c_333333, fontSize: 18, fontWeight: FontWeight.w500),
          ),
        ),
        buildState(),
      ],
    );
  }

  Widget buildVLine() {
    return Container(
      width: 4,
      height: 20,
      margin: const EdgeInsets.only(right: 8),
      decoration: const BoxDecoration(
        color: MyColor.c_25A6EE,
        borderRadius: BorderRadius.all(Radius.circular(2)),
      ),
    );
  }

  Widget buildState() {
    String state = widget.complete ? '已扦样' : '待扦样';
    return Container(
      padding: const EdgeInsets.symmetric(horizontal: 14, vertical: 4),
      decoration: BoxDecoration(
        color: MyColor.c_25A6EE.withOpacity(0.1),
        borderRadius: const BorderRadius.horizontal(left: Radius.circular(100)),
      ),
      child: Text(
        '状态：$state',
        style: const TextStyle(color: MyColor.c_1383C2, fontSize: 16),
      ),
    );
  }

  Widget buildNumber() {
    return const Padding(
      padding: EdgeInsets.only(left: 12, top: 4, bottom: 6),
      child: Text(
        '***********',
        style: TextStyle(color: MyColor.c_333333, fontSize: 18, fontWeight: FontWeight.w500),
      ),
    );
  }

  Widget buildGrid() {
    return Padding(
      padding: const EdgeInsets.symmetric(horizontal: 12),
      child: LayoutBuilder(builder: (context, constraints) {
        return Wrap(
          spacing: 4,
          runSpacing: 4,
          children: infoList.map((item) {
            return SizedBox(
              width: constraints.maxWidth / 2 - 2,
              child: Text(
                '${item.keys.first}：${item.values.first}',
                style: const TextStyle(fontSize: 16, color: MyColor.c_666666),
              ),
            );
          }).toList(),
        );
      }),
    );
  }

  Widget buildBottom() {
    if (widget.complete) return const SizedBox.shrink();
    return Column(
      children: [
        buildDivider(),
        Row(
          children: [
            const SizedBox(width: 12),
            const Expanded(
              child: Text(
                '[张三]创建于2024-01-01 00:00:00',
                style: TextStyle(fontSize: 16, color: MyColor.c_666666),
              ),
            ),
            const SizedBox(width: 4),
            MyButton(
              '开始扦样',
              onTap: () => startSample(),
              fountSize: 16,
              alignment: null,
              padding: const EdgeInsets.symmetric(vertical: 6, horizontal: 12),
            ),
            const SizedBox(width: 12),
          ],
        ),
      ],
    );
  }

  Widget buildDivider() {
    return Container(
      width: double.infinity,
      height: 1,
      color: MyColor.c_3BD2E5.withOpacity(0.15),
      margin: const EdgeInsets.symmetric(vertical: 10),
    );
  }
}