flutter_adminpanel 1.0.0
flutter_adminpanel: ^1.0.0 copied to clipboard
A comprehensive Flutter admin panel library similar to react-admin with support for multiple data sources (Magento, Supabase, MySQL, PostgreSQL, ClickHouse)
example/lib/main.dart
import 'package:flutter/material.dart';
import 'package:flutter_adminpanel/flutter_adminpanel.dart';
void main() async {
WidgetsFlutterBinding.ensureInitialized();
// Initialize Supabase data provider
final dataProvider = await SupabaseDataProvider.initialize(
url: 'https://rxvckkqqunyqtxjyabub.supabase.co',
anonKey:
'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6InJ4dmNra3FxdW55cXR4anlhYnViIiwicm9sZSI6ImFub24iLCJpYXQiOjE3MjE4NzU1MzAsImV4cCI6MjAzNzQ1MTUzMH0.9DiNza2x0UEuGTAgtOz0StXW962pDF6S8b27_Igz6v4',
);
runApp(HolyAdminApp(dataProvider: dataProvider));
}
class HolyAdminApp extends StatelessWidget {
final DataProvider dataProvider;
const HolyAdminApp({super.key, required this.dataProvider});
@override
Widget build(BuildContext context) {
final config = AdminConfig(
appName: 'Holy Admin',
supportedLanguages: ['en', 'ru', 'hi'],
defaultLanguage: 'en',
enableDarkMode: true,
defaultPageSize: 10,
dateFormat: 'yyyy-MM-dd',
timeFormat: 'HH:mm:ss',
);
final resources = [
Resource(
name: 'countries',
label: 'Countries',
icon: Icons.public,
columns: [
const ColumnConfig(
key: 'id',
label: 'ID',
type: ColumnType.text,
visible: false,
),
const ColumnConfig(
key: 'name',
label: 'Name',
type: ColumnType.json,
required: true,
),
const ColumnConfig(
key: 'info',
label: 'Information',
type: ColumnType.json,
),
const ColumnConfig(
key: 'cities_count',
label: 'Cities Count',
type: ColumnType.number,
),
const ColumnConfig(
key: 'images',
label: 'Images',
type: ColumnType.image,
),
const ColumnConfig(
key: 'created_at',
label: 'Created',
type: ColumnType.date,
),
],
),
Resource(
name: 'cities',
label: 'Cities',
icon: Icons.location_city,
columns: [
const ColumnConfig(
key: 'id',
label: 'ID',
type: ColumnType.text,
visible: false,
),
const ColumnConfig(
key: 'name',
label: 'Name',
type: ColumnType.json,
required: true,
),
const ColumnConfig(
key: 'info',
label: 'Information',
type: ColumnType.json,
),
const ColumnConfig(
key: 'country',
label: 'Country',
type: ColumnType.reference,
referenceResource: 'countries',
),
const ColumnConfig(
key: 'spots_count',
label: 'Spots',
type: ColumnType.number,
),
const ColumnConfig(
key: 'routes_count',
label: 'Routes',
type: ColumnType.number,
),
const ColumnConfig(
key: 'events_count',
label: 'Events',
type: ColumnType.number,
),
const ColumnConfig(
key: 'images',
label: 'Images',
type: ColumnType.image,
),
],
),
Resource(
name: 'spots',
label: 'Spots',
icon: Icons.place,
columns: [
const ColumnConfig(
key: 'id',
label: 'ID',
type: ColumnType.text,
visible: false,
),
const ColumnConfig(
key: 'name',
label: 'Name',
type: ColumnType.json,
required: true,
),
const ColumnConfig(
key: 'info',
label: 'Information',
type: ColumnType.json,
),
const ColumnConfig(
key: 'city',
label: 'City',
type: ColumnType.reference,
referenceResource: 'cities',
),
const ColumnConfig(
key: 'type',
label: 'Type',
type: ColumnType.text,
required: true,
),
const ColumnConfig(
key: 'point',
label: 'Location',
type: ColumnType.text,
),
const ColumnConfig(
key: 'images',
label: 'Images',
type: ColumnType.image,
),
],
),
Resource(
name: 'routes',
label: 'Routes',
icon: Icons.route,
columns: [
const ColumnConfig(
key: 'id',
label: 'ID',
type: ColumnType.text,
visible: false,
),
const ColumnConfig(
key: 'name',
label: 'Name',
type: ColumnType.json,
required: true,
),
const ColumnConfig(
key: 'info',
label: 'Information',
type: ColumnType.json,
),
const ColumnConfig(
key: 'images',
label: 'Images',
type: ColumnType.image,
),
const ColumnConfig(
key: 'created_at',
label: 'Created',
type: ColumnType.date,
),
],
),
Resource(
name: 'events',
label: 'Events',
icon: Icons.event,
columns: [
const ColumnConfig(
key: 'id',
label: 'ID',
type: ColumnType.text,
visible: false,
),
const ColumnConfig(
key: 'name',
label: 'Name',
type: ColumnType.json,
required: true,
),
const ColumnConfig(
key: 'info',
label: 'Information',
type: ColumnType.json,
),
const ColumnConfig(
key: 'type',
label: 'Type',
type: ColumnType.text,
required: true,
),
const ColumnConfig(
key: 'time',
label: 'Date & Time',
type: ColumnType.date,
required: true,
),
const ColumnConfig(
key: 'status',
label: 'Status',
type: ColumnType.text,
),
const ColumnConfig(
key: 'capacity',
label: 'Capacity',
type: ColumnType.number,
),
const ColumnConfig(
key: 'price',
label: 'Price',
type: ColumnType.text,
),
const ColumnConfig(
key: 'contact_info',
label: 'Contact',
type: ColumnType.text,
),
const ColumnConfig(
key: 'teacher_info',
label: 'Teacher',
type: ColumnType.text,
),
const ColumnConfig(
key: 'location_details',
label: 'Location Details',
type: ColumnType.text,
),
const ColumnConfig(
key: 'registration_deadline',
label: 'Registration Deadline',
type: ColumnType.date,
),
const ColumnConfig(
key: 'images',
label: 'Images',
type: ColumnType.image,
),
],
),
Resource(
name: 'users',
label: 'Users',
icon: Icons.people,
columns: [
const ColumnConfig(
key: 'id',
label: 'ID',
type: ColumnType.text,
visible: false,
),
const ColumnConfig(
key: 'name',
label: 'Name',
type: ColumnType.text,
required: true,
),
const ColumnConfig(
key: 'email',
label: 'Email',
type: ColumnType.email,
required: true,
),
const ColumnConfig(
key: 'phone',
label: 'Phone',
type: ColumnType.text,
),
const ColumnConfig(
key: 'language',
label: 'Language',
type: ColumnType.text,
),
const ColumnConfig(key: 'role', label: 'Role', type: ColumnType.text),
const ColumnConfig(
key: 'tarif',
label: 'Tariff',
type: ColumnType.text,
),
const ColumnConfig(
key: 'points',
label: 'Points',
type: ColumnType.number,
),
const ColumnConfig(
key: 'created_at',
label: 'Created',
type: ColumnType.date,
),
],
),
];
return AdminApp(
config: config,
dataProvider: dataProvider,
resources: resources,
title: 'Holy Admin - Flutter Admin Panel',
dashboard: const HolyDashboard(),
);
}
}
/// Custom dashboard widget
class HolyDashboard extends StatelessWidget {
const HolyDashboard({super.key});
@override
Widget build(BuildContext context) {
return Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Icon(
Icons.dashboard,
size: 100,
color: Theme.of(context).colorScheme.primary,
),
const SizedBox(height: 24),
Text(
'Welcome to Holy Admin',
style: Theme.of(context).textTheme.headlineMedium,
),
const SizedBox(height: 16),
Text(
'Select a resource from the sidebar to get started',
style: Theme.of(context).textTheme.bodyLarge,
),
],
),
);
}
}