calendar_view_demo/lib/calendar_page/month_calendar/schedule_popup.dart

import 'package:calendar_view/calendar_controller/controller.dart';
import 'package:calendar_view/utils/calendar_util.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';

class SchedulePopup extends StatefulWidget {
  const SchedulePopup({
    Key? key,
    required this.scheduleData,
  }) : super(key: key);

  /// 日程数据
  final MonthViewDayStructure scheduleData;

  @override
  SchedulePopupState createState() => SchedulePopupState();
}

class SchedulePopupState extends State<SchedulePopup> {
  static const double _itemHeight = 28;
  List<Schedule> _scheduleDataList = [];
  CalendarController calendarController = Get.find<CalendarController>();
  @override
  void initState() {
    super.initState();
    _scheduleDataList =
        calendarController.scheduleListFilter(widget.scheduleData.scheduleList);
  }

  @override
  void didUpdateWidget(covariant SchedulePopup oldWidget) {
    super.didUpdateWidget(oldWidget);
    _scheduleDataList =
        calendarController.scheduleListFilter(widget.scheduleData.scheduleList);
  }

  @override
  Widget build(BuildContext context) {
    return ListView(
      shrinkWrap: true,
      children: [
        Container(
          padding: const EdgeInsets.all(10),
          child: _buildScheduleList(),
        ),
      ],
    );
  }

  /// 构建icon
  Widget _buildIcon({
    required IconData icon,
    required double size,
  }) {
    return Icon(
      icon,
      size: size,
      color: const Color.fromRGBO(116, 118, 119, 1),
    );
  }

  /// 构建icon按钮
  Widget _buildIconButton({
    required VoidCallback onPressed,
    required IconData icon,
  }) {
    return IconButton(
      onPressed: () => onPressed,
      icon: _buildIcon(
        icon: icon,
        size: 20,
      ),
    );
  }

  Map<int, String> weekMap = {
    1: '星期一',
    2: '星期二',
    3: '星期三',
    4: '星期四',
    5: '星期五',
    6: '星期六',
    7: '星期天',
  };

  /// 日程卡片视图列表
  Widget _buildScheduleList() {
    final currentDate = widget.scheduleData.date;
    return Column(
      mainAxisSize: MainAxisSize.min,
      children: [
        _buildScheduleHeadActionBar(),
        _buildScheduleLayoutItem(
          iconWidget: const SizedBox(
            width: 18,
            child: CircleAvatar(
              radius: 6,
              backgroundColor: Colors.red,
            ),
          ),
          scheduleItemWidget: const Text(
            '杏聆荟每日站会',
          ),
        ),
        _buildScheduleLayoutItem(
          iconWidget: _buildIcon(
            icon: Icons.av_timer_rounded,
            size: 18,
          ),
          scheduleItemWidget: Text(
            currentDate.month.toString() +
                '月' +
                currentDate.day.toString() +
                '日 周 ' +
                weekMap[currentDate.weekday]! +
                ' 10:00-10:30',
          ),
        ),
        _buildScheduleLayoutItem(
          iconWidget: _buildIcon(
            icon: Icons.personal_injury_rounded,
            size: 18,
          ),
          scheduleItemWidget: const Text('组织人'),
        ),
        _buildScheduleLayoutItem(
          iconWidget: _buildIcon(
            icon: Icons.people_alt_outlined,
            size: 18,
          ),
          scheduleItemWidget: Row(
            mainAxisSize: MainAxisSize.max,
            children: const [
              Text(
                '邀请7人，5人接受',
              ),
              Expanded(child: SizedBox()),
              Text(
                '查看全部',
                style: TextStyle(
                  fontSize: 12,
                  color: Colors.grey,
                ),
              ),
            ],
          ),
        ),
        Row(
          mainAxisAlignment: MainAxisAlignment.start,
          children: [
            const SizedBox(
              width: 30,
            ),
            _buildHeadPortraitItem(),
            _buildHeadPortraitItem(),
            _buildHeadPortraitItem(),
            _buildHeadPortraitItem(),
            _buildHeadPortraitItem(),
          ],
        ),
        SizedBox(
          height: 15,
        ),
        Divider(),
        _buildSchedulebottomActionBar(),
      ],
    );
  }

  /// 日程卡片顶部操作栏
  Widget _buildScheduleHeadActionBar() {
    return SizedBox(
      height: 35,
      child: Row(
        mainAxisAlignment: MainAxisAlignment.end,
        children: [
          _buildIconButton(
            onPressed: () {},
            icon: Icons.delete_outlined,
          ),
          _buildIconButton(
            onPressed: () {},
            icon: Icons.launch_rounded,
          ),
          _buildIconButton(
            onPressed: () {},
            icon: Icons.close,
          ),
        ],
      ),
    );
  }

  /// 日程卡片底部操作栏
  Widget _buildSchedulebottomActionBar() {
    return SizedBox(
      height: 35,
      child: Row(
        children: [
          Container(
            margin: EdgeInsets.only(
              left: 5,
            ),
            child: Text('查看详情'),
          ),
          Expanded(
            child: Row(
              mainAxisAlignment: MainAxisAlignment.end,
              children: [
                _buildIconButton(
                  onPressed: () {},
                  icon: Icons.check_circle_outlined,
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }

  /// 日程卡片单行布局
  Widget _buildScheduleLayoutItem({
    required Widget iconWidget,
    required Widget scheduleItemWidget,
  }) {
    return Container(
      padding: const EdgeInsets.only(
        left: 10,
        bottom: 10,
        right: 10,
      ),
      child: Row(
        children: [
          Container(
            margin: const EdgeInsets.only(
              left: 5,
              right: 10,
            ),
            child: iconWidget,
          ),
          Expanded(child: scheduleItemWidget),
        ],
      ),
    );
  }

  Widget _buildHeadPortraitItem() {
    return Container(
      width: 55,
      height: 55,
      child: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          Container(
            width: 30,
            height: 30,
            decoration: BoxDecoration(
              borderRadius: BorderRadius.circular(
                4,
              ),
              color: Colors.red,
            ),
          ),
          Text(
            '11222qwwqqwww2',
            overflow: TextOverflow.ellipsis,
          ),
        ],
      ),
    );
  }
}