Skip to main content

Một số chức năng của admin panel hay dùng (có thể cần thiết)

Trong quá trình phát triển ứng dụng laravel cùng với filament, 1 số tùy chỉnh và cấu hình cần thiết trong admin panel của filament nên thực hiện

Toàn bộ cấu hình tại file configure của admin panel app/Providers/Filament/AdminPanelProvider.php

1. Dùng chính trang admin làm ứng dụng

Khi phát triển ứng dụng quản lý hoặc lưu trữ ,mà không cần đến giao diện front end mới, dùng chính admin của filament để làm ứng dụng, đường dẫn /admin lúc này không cần thiết nữa. Tiến hành như sau:

  • Tại file configure của admin panel app/Providers/Filament/AdminPanelProvider.php loại bỏ '/admin' trong ->path('/admin')
  ->path('')

  • Tại routes/web.php loại bỏ hoặc comment route mặc định '/'

  // Route::get('/', function () {
  //     ...
  // });

Lúc này, khi truy cập tên miền sẽ đi thẳng vào trang admin của filament mà không cần slug /admin

2. Dùng trang tùy chỉnh làm trang mặc định.

Mặc định khi vào admin filament, trang được hiển thị sẽ là trang welcome, tuy nhiên chúng ta không cần đến nó hoặc custom lại 1 trang mới phù hợp với nhu cầu. Lúc này điều chỉnh lại trang mặc định như sau

Tại file configure của admin panel app/Providers/Filament/AdminPanelProvider.php thêm cấu hình mới:

->homeUrl('/statistic') # đường dẫn cụ thể hoặc route tùy ý

Hoàn

3. tất,Tắt khibreadcrumbs

  ->breadcrumbs(false)

4. Nội dung full trang

use Filament\Support\Enums\Width;
...

  ->maxContentWidth(Width::Full)

5. Thay đổi favicon

  ->favicon('/storage/CDB-LOGO.png')

6. Cho phép sidebar có thể thu gọn ở giao diện desktop

  ->sidebarCollapsibleOnDesktop()

7. Điều chỉnh lại kích thước của sidebar

  ->sidebarWidth('13rem')

8. Thêm thẻ tùy chỉnh vào filamentthẻ admin,head trangcủa statisticfilament:

sẽ
use đượcFilament\View\PanelsRenderHook;
hiểnuse thị
Illuminate\Support\Facades\Blade;
...
public function panel(Panel $panel): Panel
  {
    FilamentView::registerRenderHook(
        PanelsRenderHook::HEAD_END,
        fn (): string => Blade::render(<<<'HTML'
            <link rel="manifest" href="/manifest.json">
            <meta name="theme-color" content="#0f172a">
  
            <!-- iOS specific -->
            <meta name="apple-mobile-web-app-capable" content="yes">
            <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
            <meta name="apple-mobile-web-app-title" content="CDB Admin">
            <link rel="apple-touch-icon" href="/storage/CDB-LOGO.png">
  
            <script>
                if ('serviceWorker' in navigator) {
                    navigator.serviceWorker.register('/service-worker.js', { scope: './' })
                        .then(reg => console.log('SW registered:', reg.scope))
                        .catch(err => console.error('SW registration failed:', err));
                }
            </script>
        HTML)
    );
    return $panel
    ....
  }
Back to top