add pagination to activities

ui/lib/activity.dart

@@ -2,6 +2,7 @@ import 'package:flutter/material.dart';
 import 'package:flutter_riverpod/flutter_riverpod.dart';
 import 'package:percent_indicator/circular_percent_indicator.dart';
 import 'package:ui/providers/activity.dart';
+import 'package:ui/utils.dart';
 import 'package:ui/widgets/progress_indicator.dart';
 
 class ActivityPage extends ConsumerWidget {
@@ -15,7 +16,8 @@ class ActivityPage extends ConsumerWidget {
     return activitiesWatcher.when(
         data: (activities) {
           return SingleChildScrollView(
-            child: DataTable(
+            child: PaginatedDataTable(
+              rowsPerPage: 10,
               columns: const [
                 DataColumn(label: Text("#"), numeric: true),
                 DataColumn(label: Text("名称")),
@@ -23,9 +25,36 @@ class ActivityPage extends ConsumerWidget {
                 DataColumn(label: Text("状态")),
                 DataColumn(label: Text("操作"))
               ],
-              rows: List<DataRow>.generate(activities.length, (i) {
+              source: ActivityDataSource(activities: activities, onDelete: onDelete(ref)),
-                var activity = activities[activities.length - i - 1];
+            ),
+          );
+        },
+        error: (err, trace) => Text("$err"),
+        loading: () => const MyProgressIndicator());
+  }
 
+  Function(int) onDelete(WidgetRef ref) {
+    return (id) {
+      ref
+          .read(activitiesDataProvider.notifier)
+          .deleteActivity(id)
+          .whenComplete(() => Utils.showSnakeBar("删除成功"))
+          .onError((error, trace) => Utils.showSnakeBar("删除失败：$error"));
+    };
+  }
+}
+
+class ActivityDataSource extends DataTableSource {
+  List<Activity> activities;
+  Function(int) onDelete;
+  ActivityDataSource({required this.activities, required this.onDelete});
+
+  @override
+  int get rowCount => activities.length;
+
+  @override
+  DataRow? getRow(int index) {
+    final activity = activities[index];
     return DataRow(cells: [
       DataCell(Text("${activity.id}")),
       DataCell(Text("${activity.sourceTitle}")),
@@ -33,9 +62,7 @@ class ActivityPage extends ConsumerWidget {
       DataCell(() {
         if (activity.status == "uploading") {
           return const SizedBox(
-                          width: 20,
+              width: 20, height: 20, child: CircularProgressIndicator());
-                          height: 20,
-                          child: CircularProgressIndicator());
         } else if (activity.status == "fail") {
           return const Icon(
             Icons.close,
@@ -48,9 +75,8 @@ class ActivityPage extends ConsumerWidget {
           );
         }
 
-                    double p = activity.progress == null
+        double p =
-                        ? 0
+            activity.progress == null ? 0 : activity.progress!.toDouble() / 100;
-                        : activity.progress!.toDouble() / 100;
         return CircularPercentIndicator(
           radius: 15.0,
           lineWidth: 5.0,
@@ -59,19 +85,13 @@ class ActivityPage extends ConsumerWidget {
           progressColor: Colors.green,
         );
       }()),
-                  DataCell(IconButton(
+      DataCell(IconButton(onPressed:() => onDelete(activity.id!), icon: const Icon(Icons.delete)))
-                      onPressed: () {
-                        ref
-                            .read(activitiesDataProvider.notifier)
-                            .deleteActivity(activity.id!);
-                      },
-                      icon: const Icon(Icons.delete)))
     ]);
-              }),
-            ),
-          );
-        },
-        error: (err, trace) => Text("$err"),
-        loading: () => const MyProgressIndicator());
   }
+
+  @override
+  bool get isRowCountApproximate => false;
+
+  @override
+  int get selectedRowCount => 0;
 }

ui/lib/movie_watchlist.dart

@@ -10,7 +10,7 @@ import 'package:ui/welcome_page.dart';
 import 'package:ui/widgets/progress_indicator.dart';
 
 class MovieDetailsPage extends ConsumerStatefulWidget {
-  static const route = "/movie/";
+  static const route = "/movie/:id";
 
   static String toRoute(int id) {
     return "/movie/$id";