1

lib/pages/student/room/controls/bottom_bar.dart

@@ -1,5 +1,7 @@
+import 'package:app/pages/student/room/viewmodel/stu_room_vm.dart';
 import 'package:app/widgets/room/file_drawer.dart';
 import 'package:flutter/material.dart';
+import 'package:provider/provider.dart';
 import 'package:remixicon/remixicon.dart';
 
 
@@ -23,31 +25,41 @@ class _BottomBarState extends State<BottomBar> {
         color: Color(0xff232426),
       ),
       height: 70,
-      child: Row(
-        children: [
-          BarItem(
-            title: "摄像头",
-            icon: RemixIcons.video_on_fill,
-          ),
-          BarItem(
-            title: "麦克风",
-            icon: RemixIcons.mic_off_fill,
-          ),
-          BarItem(
-            title: "已静音",
-            icon: RemixIcons.volume_mute_fill,
-            isOff: true,
-          ),
-          BarItem(
-            title: "举手",
-            icon: RemixIcons.hand,
-          ),
-          BarItem(
-            title: "拍照",
-            icon: RemixIcons.upload_2_fill,
-            onTap: _handShowFile,
-          ),
-        ],
+      child: Consumer<StuRoomVM>(
+        builder: (context,vm,_) {
+          //摄像头开关
+          return Row(
+            children: [
+              BarItem(
+                title: "摄像头",
+                icon: vm.cameraOpen ? RemixIcons.video_on_fill : RemixIcons.video_off_fill,
+                isOff: !vm.cameraOpen,
+                onTap: vm.changeCameraSwitch,
+              ),
+              BarItem(
+                title: "麦克风",
+                icon: vm.micOpen ? RemixIcons.mic_fill : RemixIcons.mic_off_fill,
+                isOff: !vm.micOpen,
+                onTap: vm.changeMicSwitch,
+              ),
+              BarItem(
+                title: "声音",
+                icon: vm.speakerOpen ? RemixIcons.volume_up_fill : RemixIcons.volume_mute_fill,
+                isOff: !vm.speakerOpen,
+                onTap: vm.changeSpeakerSwitch,
+              ),
+              BarItem(
+                title: "举手",
+                icon: RemixIcons.hand,
+              ),
+              BarItem(
+                title: "拍照",
+                icon: RemixIcons.upload_2_fill,
+                onTap: _handShowFile,
+              ),
+            ],
+          );
+        }
       ),
     );
   }

lib/pages/student/room/controls/top_bar.dart

@@ -1,37 +1,83 @@
+import 'dart:async';
+
+import 'package:app/utils/time.dart';
 import 'package:flutter/material.dart';
+import 'package:provider/provider.dart';
 import 'package:remixicon/remixicon.dart';
 
-class TopBar extends StatelessWidget implements PreferredSizeWidget {
+import '../viewmodel/stu_room_vm.dart';
+
+class TopBar extends StatefulWidget implements PreferredSizeWidget {
   final bool showOther;
   final void Function()? onOther;
 
-  const TopBar({super.key, this.showOther = false, this.onOther});
+  const TopBar({
+    super.key,
+    this.showOther = false,
+    this.onOther,
+  });
+
+  @override
+  State<TopBar> createState() => _TopBarState();
+
+  @override
+  Size get preferredSize => const Size.fromHeight(kToolbarHeight);
+}
+
+class _TopBarState extends State<TopBar> {
+  Timer? _timer;
+  int seconds = 0;
+  late DateTime startTime;
+
+  @override
+  void initState() {
+    super.initState();
+    final vm = context.read<StuRoomVM>();
+    startTime = parseTime(vm.roomInfo.startTime);
+
+    _timer = Timer.periodic(const Duration(seconds: 1), (_) {
+      final diff = DateTime.now().difference(startTime).inSeconds;
+      setState(() {
+        seconds = diff < 0 ? 0 : diff;
+      });
+    });
+  }
+
+  /// 你若想外面主动停，可以暴露这个方法
+  void stopTimer() {
+    _timer?.cancel();
+  }
+
+  @override
+  void dispose() {
+    _timer?.cancel();
+    super.dispose();
+  }
 
   @override
   Widget build(BuildContext context) {
+    final vm = context.read<StuRoomVM>();
+
     return AppBar(
       foregroundColor: Colors.white,
-      titleTextStyle: TextStyle(color: Colors.white, fontSize: 18),
-      backgroundColor: Color(0xff232426),
+      titleTextStyle: const TextStyle(color: Colors.white, fontSize: 18),
+      backgroundColor: const Color(0xff232426),
       centerTitle: true,
       title: Column(
         children: [
-          Text("会议"),
+          Text(vm.roomInfo.roomName),
           Text(
-            "01:12",
-            style: TextStyle(fontSize: 12, color: Colors.white24),
+            formatSeconds(seconds),
+            style: const TextStyle(fontSize: 12, color: Colors.white24),
           ),
         ],
       ),
       actions: [
         IconButton(
-          onPressed: onOther,
-          icon: Icon(showOther ? RemixIcons.team_fill : RemixIcons.team_line),
+          onPressed: widget.onOther,
+          icon: Icon(widget.showOther ? RemixIcons.team_fill : RemixIcons.team_line),
         ),
       ],
     );
   }
-
-  @override
-  Size get preferredSize => const Size.fromHeight(kToolbarHeight);
 }