feat: 實作使用者管理與公共事業費分頁標準化

resources/js/Pages/Admin/ActivityLog/Index.tsx

@@ -339,21 +339,32 @@ export default function ActivityLogIndex({ activities, filters, subject_types, u
                     from={activities.from}
                 />
 
-                <div className="mt-6">
-                    <Pagination
-                        links={activities.links}
-                        total={activities.total}
-                        current_page={activities.current_page}
-                        last_page={activities.last_page}
-                        per_page={perPage}
-                        onPerPageChange={handlePerPageChange}
-                    />
+                <div className="mt-4 flex flex-col md:flex-row items-center justify-between gap-4">
+                    <div className="flex items-center gap-2 text-sm text-gray-500">
+                        <span>每頁顯示</span>
+                        <SearchableSelect
+                            value={perPage}
+                            onValueChange={handlePerPageChange}
+                            options={[
+                                { label: "10", value: "10" },
+                                { label: "20", value: "20" },
+                                { label: "50", value: "50" },
+                                { label: "100", value: "100" }
+                            ]}
+                            className="w-[100px] h-8"
+                            showSearch={false}
+                        />
+                        <span>筆</span>
+                    </div>
+                    <div className="w-full md:w-auto flex justify-center md:justify-end">
+                        <Pagination links={activities.links} />
+                    </div>
                 </div>
             </div>
 
             <ActivityDetailDialog
-                isOpen={detailOpen}
-                onClose={() => setDetailOpen(false)}
+                open={detailOpen}
+                onOpenChange={setDetailOpen}
                 activity={selectedActivity}
             />
         </AuthenticatedLayout>