section_page.dart 10.9 KB
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:nested_scroll_views/material.dart';
import 'package:wow_english/common/core/user_util.dart';
import 'package:wow_english/common/extension/string_extension.dart';
import 'package:wow_english/models/course_unit_entity.dart';
import 'package:wow_english/pages/section/section_type.dart';
import 'package:wow_english/pages/section/widgets/home_video_item.dart';
import 'package:wow_english/pages/section/widgets/section_bouns_item.dart';
import 'package:wow_english/pages/section/widgets/section_header_widget.dart';
import 'package:wow_english/route/route.dart';
import 'package:wow_english/utils/toast_util.dart';

import '../../models/course_section_entity.dart';
import 'bloc/section_bloc.dart';
import 'courese_module_model.dart';

/// 环节列表页
class SectionPage extends StatelessWidget {
  const SectionPage(
      {super.key, required this.courseUnitEntity, required this.courseUnitId});

  final CourseUnitEntity courseUnitEntity;

  /// unitId
  final int courseUnitId;

  @override
  Widget build(BuildContext context) {
    int initialPage = courseUnitEntity.courseUnitVOList
            ?.indexWhere((element) => element.id == courseUnitId) ??
        0;
    return BlocProvider(
      create: (context) => SectionBloc(courseUnitEntity, initialPage,
          PageController(initialPage: initialPage), ScrollController()),
      child: _SectionPageView(context),
    );
  }
}

class _SectionPageView extends StatelessWidget {
  const _SectionPageView(this.context);

  final BuildContext context;

  @override
  Widget build(BuildContext context) {
    final bloc = BlocProvider.of<SectionBloc>(context);
    return BlocListener<SectionBloc, SectionState>(
      listener: (context, state) {
        if (state is RequestVideoLessonState) {
          final videoUrl = bloc.processEntity?.videos?.videoUrl ?? '';
          var title = '';
          if (state.type == SectionType.song.value) {
            title = 'song';
          }

          if (state.type == SectionType.video.value) {
            title = 'video';
          }

          if (state.type == SectionType.bouns.value) {
            title = 'bonus';
          }

          if (videoUrl.isEmpty || !videoUrl.contains('http')) {
            return;
          }
          pushNamed(AppRouteName.lookVideo, arguments: {
            'videoUrl': videoUrl,
            'title': title,
            'courseLessonId': state.courseLessonId,
            'isTopic': true
          }).then((value) {
            if (value != null) {
              Map<String, dynamic> dataMap = value as Map<String, dynamic>;
              bloc.add(RequestEndClassEvent(
                  dataMap['courseLessonId']!, dataMap['isCompleted'],
                  currentTime: dataMap['currentTime'],
                  autoNextSection: dataMap['nextSection']));
            }
          });
          return;
        }

        if (state is RequestEnterClassState) {
          if (state.courseType != SectionType.practice.value &&
              state.courseType != SectionType.pictureBook.value) {
            ///视频类型
            ///获取视频课程内容
            bloc.add(RequestVideoLessonEvent(
                state.courseLessonId, state.courseType));
            return;
          }

          if (state.courseType == SectionType.pictureBook.value) {
            //绘本
            pushNamed(AppRouteName.reading,
                    arguments: {'courseLessonId': state.courseLessonId})
                .then((value) {
              if (value != null) {
                Map<String, dynamic> dataMap = value as Map<String, dynamic>;
                bloc.add(RequestEndClassEvent(
                  dataMap['courseLessonId']!,
                  dataMap['isCompleted'],
                  currentStep: dataMap['currentStep'],
                  autoNextSection: dataMap['nextSection'],
                ));
              }
            });
            return;
          }

          if (state.courseType == SectionType.practice.value) {
            //练习
            pushNamed(AppRouteName.topicPic,
                    arguments: {'courseLessonId': state.courseLessonId})
                .then((value) {
              if (value != null) {
                Map<String, dynamic> dataMap = value as Map<String, dynamic>;
                bloc.add(RequestEndClassEvent(
                    dataMap['courseLessonId']!, dataMap['isCompleted'],
                    currentStep: dataMap['currentStep'],
                    autoNextSection: dataMap['nextSection']));
              }
            });
            return;
          }
        }
      },
      child: _sectionView(),
    );
  }

  Widget _sectionView() =>
      BlocBuilder<SectionBloc, SectionState>(builder: (context, state) {
        final bloc = BlocProvider.of<SectionBloc>(context);
        return Scaffold(
          body: Container(
            color: Colors.white,
            child: Center(
              child: Column(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                children: [
                  SectionHeaderWidget(
                      title: bloc.getCourseUnitDetail().name,
                      courseModuleCode: bloc.courseUnitEntity.courseModuleCode),
                  Expanded(
                      child: Padding(
                    padding: EdgeInsets.symmetric(horizontal: 10.w),
                    child: OverflowBox(
                      child: NestedPageView.builder(
                          itemCount: bloc.unlockPageCount(),
                          controller: bloc.pageController,
                          onPageChanged: (int index) {
                            bloc.add(CurrentUnitIndexChangeEvent(index));
                          },
                          itemBuilder: (context, index) {
                            return ScrollConfiguration(
                              ///去掉 Android 上默认的边缘拖拽效果
                              behavior: ScrollConfiguration.of(context)
                                  .copyWith(overscroll: false),
                              child: _itemTransCard(
                                  bloc.getCourseUnitDetail(pageIndex: index),
                                  index,
                                  context),
                            );
                          }),
                    ), // 设置外部padding,
                  )),
                  SafeArea(
                    child: Padding(
                      padding: EdgeInsets.symmetric(horizontal: 13.w),
                      child: Row(
                        mainAxisAlignment: MainAxisAlignment.spaceBetween,
                        children: [
                          SizedBox(
                            height: 47.h,
                            width: 80.w,
                          ),
                          Container(
                            decoration: BoxDecoration(
                              color: CourseModuleModel(
                                      bloc.courseUnitEntity.courseModuleCode ??
                                          'Phase-1')
                                  .color,
                              borderRadius: BorderRadius.circular(14.5.r),
                            ),
                            padding: EdgeInsets.symmetric(
                                vertical: 8.h, horizontal: 24.w),
                            child: Text(
                              '${bloc.currentPage + 1}/${bloc.unlockPageCount()}',
                              style: TextStyle(
                                  color: Colors.white, fontSize: 12.sp),
                            ),
                          ),
                          Image.asset(
                            CourseModuleModel(
                                    bloc.courseUnitEntity.courseModuleCode ??
                                        'Phase-1')
                                .courseModuleLogo
                                .assetPng,
                            height: 47.h,
                            width: 80.w,
                            // color: Colors.red,
                          ),
                        ],
                      ),
                    ),
                  )
                ],
              ),
            ),
          ),
        );
      });
}

Widget _itemTransCard(
    CourseUnitDetail courseUnitDetail, int pageIndex, BuildContext context) {
  final bloc = BlocProvider.of<SectionBloc>(context);
  List<CourseSectionEntity>? courseSectionEntities =
      bloc.courseSectionDatasMap[courseUnitDetail.id];
  if (courseSectionEntities == null) {
    bloc.add(RequestDataEvent(courseUnitDetail.id!));
    return Center(
      child: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          const Text(
            '暂无数据',
            style: TextStyle(fontSize: 24.0),
          ),
          const SizedBox(height: 16.0),
          // 间距
          CircularProgressIndicator(
              color: CourseModuleModel(
                      bloc.courseUnitEntity.courseModuleCode ?? 'Phase-1')
                  .color),
          // 加载动画
        ],
      ),
    );
  } else {
    return NestedListView.builder(
        itemCount: bloc.courseSectionDatasMap[courseUnitDetail.id]?.length ?? 0,
        scrollDirection: Axis.horizontal,
        itemBuilder: (BuildContext context, int index) {
          CourseSectionEntity sectionData = courseSectionEntities[index];
          if (sectionData.courseType == SectionType.bouns.value) {
            //彩蛋
            return GestureDetector(
              onTap: () {
                if (!UserUtil.isLogined()) {
                  pushNamed(AppRouteName.login);
                  return;
                }
                if (sectionData.lock == true) {
                  showToast('当前课程暂未解锁');
                  return;
                }

                ///进入课堂
                bloc.add(RequestEnterClassEvent(
                    sectionData.id.toString(), sectionData.courseType));
              },
              child: SectionBoundsItem(
                imageUrl: sectionData.coverUrl,
              ),
            );
          } else {
            return GestureDetector(
              onTap: () {
                if (!UserUtil.isLogined()) {
                  pushNamed(AppRouteName.login);
                  return;
                }
                if (sectionData.lock == true) {
                  showToast('当前课程暂未解锁');
                  return;
                }

                ///进入课堂
                bloc.add(RequestEnterClassEvent(
                    sectionData.id.toString(), sectionData.courseType));
              },
              child: SectionVideoItem(
                unitEntity: bloc.courseUnitEntity,
                lessons: sectionData,
              ),
            );
          }
        });
  }
}