1

lib/pages/teacher/room/widgets/content_view.dart

@@ -0,0 +1,35 @@
+import 'package:flutter/material.dart';
+
+import 'student_item.dart';
+
+class ContentView extends StatelessWidget {
+  const ContentView({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    return Padding(
+      padding: const EdgeInsets.all(10),
+      child: Row(
+        spacing: 15,
+        children: [
+          Expanded(
+            child: StudentItem(),
+          ),
+          SizedBox(
+            width: 300,
+            child: ListView.separated(
+              itemBuilder: (_, index) {
+                return SizedBox(
+                  height: 250,
+                  child: StudentItem(),
+                );
+              },
+              separatorBuilder: (_, __) => SizedBox(height: 15),
+              itemCount: 7,
+            ),
+          ),
+        ],
+      ),
+    );
+  }
+}

lib/pages/teacher/room/widgets/status_view.dart

@@ -0,0 +1,114 @@
+import 'dart:async';
+
+import 'package:app/utils/time.dart';
+import 'package:flutter/material.dart';
+import 'package:provider/provider.dart';
+
+import 'content_view.dart';
+import '../viewmodel/students_view_model.dart';
+
+class StatusView extends StatefulWidget {
+  const StatusView({super.key});
+
+  @override
+  State<StatusView> createState() => _StatusViewState();
+}
+
+class _StatusViewState extends State<StatusView> {
+  ///房间状态
+  RoomStatus status = RoomStatus.loading;
+
+  ///剩余秒
+  int _seconds = 0;
+  Timer? _timer;
+
+  @override
+  void initState() {
+    super.initState();
+    _init();
+  }
+
+  @override
+  void dispose() {
+    super.dispose();
+    _timer?.cancel();
+    _timer = null;
+  }
+
+  void _init() {
+    final vm = context.read<StudentsViewModel>();
+    //如果房间可以开始
+    if (vm.canEnterRoom) {
+      status = RoomStatus.start;
+    } else {
+      status = RoomStatus.waiting;
+      startCountDown();
+    }
+  }
+
+  ///开始倒计时
+  void startCountDown() {
+    final vm = context.read<StudentsViewModel>();
+    //当前时间
+    DateTime now = DateTime.now();
+    //远端时间
+    setState(() {
+      _seconds = vm.startTime.difference(now).inSeconds;
+    });
+    _timer = Timer.periodic(Duration(seconds: 1), (timer) {
+      setState(() {
+        _seconds--;
+      });
+      if (_seconds <= 0) {
+        _timer?.cancel();
+        _timer = null;
+        setState(() {
+          status = RoomStatus.start;
+        });
+      }
+    });
+  }
+
+  ///开启自习室
+  void openRoom() {
+    final vm = context.read<StudentsViewModel>();
+    vm.toggleRoom(isOpen: true);
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    if (status == RoomStatus.waiting) {
+      return Align(
+        child: Column(
+          mainAxisAlignment: MainAxisAlignment.center,
+          children: [
+            Text(
+              "未到开播时间，到点后自动开播",
+              style: TextStyle(color: Colors.white),
+            ),
+            Container(
+              margin: EdgeInsets.symmetric(vertical: 10),
+              child: Text(
+                formatSeconds(_seconds),
+                style: TextStyle(
+                  color: Colors.white,
+                  fontSize: 26,
+                  fontWeight: FontWeight.bold,
+                ),
+              ),
+            ),
+          ],
+        ),
+      );
+    } else if (status == RoomStatus.start) {
+      return ContentView();
+    }
+    return SizedBox();
+  }
+}
+
+enum RoomStatus {
+  loading, // 加载中
+  waiting, //房间倒计时等待中
+  start, //房间开始中
+}

lib/pages/teacher/room/widgets/student_item.dart

@@ -0,0 +1,105 @@
+import 'package:app/widgets/room/file_drawer.dart';
+import 'package:app/widgets/room/video_surface.dart';
+import 'package:flutter/material.dart';
+import 'package:remixicon/remixicon.dart';
+
+class StudentItem extends StatefulWidget {
+  const StudentItem({super.key});
+
+  @override
+  State<StudentItem> createState() => _StudentItemState();
+}
+
+class _StudentItemState extends State<StudentItem> {
+  ///打开文件列表
+  void _openFileList(){
+    showFileDialog(context,isUpload: false);
+  }
+  @override
+  Widget build(BuildContext context) {
+    return ClipRRect(
+      borderRadius: BorderRadius.circular(10),
+      child: Container(
+        color: Color(0xFF404649),
+        child: Column(
+          children: [
+            Expanded(
+              child: SizedBox(
+                width: double.infinity,
+                child: Stack(
+                  children: [
+                    VideoSurface(
+                    ),
+                    Positioned(
+                      bottom: 0,
+                      left: 0,
+                      right: 0,
+                      child: Container(
+                        padding: EdgeInsets.symmetric(horizontal: 10, vertical: 8),
+                        decoration: BoxDecoration(
+                          gradient: LinearGradient(
+                            colors: [Color(0x0b050505), Color(0x54050505)],
+                            begin: Alignment.topCenter,
+                            end: Alignment.bottomCenter,
+                          ),
+                        ),
+                        child: Text(
+                          "李明辉",
+                          style: TextStyle(
+                            color: Colors.white,
+                            fontSize: 14,
+                          ),
+                        ),
+                      ),
+                    ),
+                  ],
+                ),
+              ),
+            ),
+            ColoredBox(
+              color: Color(0xFF232426),
+              child: Row(
+                children: [
+                  _actionItem(icon: RemixIcons.video_on_fill, isActive: false),
+                  _actionItem(
+                    icon: RemixIcons.mic_off_fill,
+                  ),
+                  _actionItem(
+                    icon: RemixIcons.volume_mute_fill,
+                  ),
+                  _actionItem(
+                    icon: RemixIcons.file_list_3_fill,
+                    onTap: _openFileList
+                  ),
+                ],
+              ),
+            ),
+          ],
+        ),
+      ),
+    );
+  }
+
+  ///
+  Widget _actionItem({
+    required IconData icon,
+    bool isActive = true,
+    void Function()? onTap,
+  }) {
+    Color offColor = Color(0xFFE75B61);
+    return Expanded(
+      child: Container(
+        height: 50,
+        color: isActive ? null : offColor.withValues(alpha: 0.3),
+        child: IconButton(
+          onPressed: onTap,
+          icon: Icon(
+            icon,
+            color: isActive ? Colors.white : offColor,
+            size: 20,
+          ),
+        ),
+      ),
+    );
+  }
+}