0
0
Lập trình
Admin Team
Admin Teamtechmely

Hướng dẫn sử dụng Filament Repeater trong Laravel

Đăng vào 2 tuần trước

• 5 phút đọc

Hướng dẫn sử dụng Filament Repeater trong Laravel

Giới thiệu

Trong phát triển ứng dụng web với Laravel, việc quản lý các nhóm dữ liệu lặp lại là một yêu cầu phổ biến. Filament cung cấp một cách dễ dàng để tạo ra các trường lặp lại (repeater fields) trong biểu mẫu. Bài viết này sẽ hướng dẫn bạn cách tính tổng giá trị của tất cả các hàng lặp lại, xác thực tổng số này và tự động cập nhật một trường khác.

Mục tiêu của bài viết

  • Tính tổng giá trị của tất cả các hàng lặp lại
  • Xác thực tổng số với một giá trị tối đa
  • Tự động cập nhật một trường khác dựa trên giá trị tổng

Cấu trúc biểu mẫu

Để bắt đầu, chúng ta cần tạo một biểu mẫu với một trường hiển thị tổng số và một repeater cho các nhóm. Dưới đây là đoạn mã mẫu mà bạn có thể sử dụng:

php Copy
return $form->schema([
    // Trường hiển thị tổng số đã tính toán
    Forms\Components\TextInput::make('qnt_allocated')
       ->label('Tổng số lượng')
        ->required()
        ->numeric()
        ->suffix('Kg'),
    
    // Repeater cho các nhóm
    Forms\Components\Repeater::make('groups')
        ->label('Nhóm:')
        ->relationship('groups')
        ->schema([
            Forms\Components\TextInput::make('quantity')
                ->label('Số lượng nhóm')
                ->required()
                ->numeric()
                ->reactive()
                ->rules([
                    fn (Get $get): \Closure => function (string $attribute, $value, \Closure $fail) use ($get) {
                        $total = collect($get('../../groups'))->sum('quantity');
                        if ($total > 7000) {
                           $fail("Tổng số lượng cho tất cả các nhóm không được vượt quá 7000 kg (Tổng hiện tại: {$total})");
                        }
                    },
                ])
                ->afterStateUpdated(function ($state, callable $get, callable $set) {
                    $total = collect($get('../../groups'))->sum('quantity');
                    $set('../../qnt_allocated', $total);
                })
                ->suffix('Kg'),
        ])
]);

Giải thích mã

Trường tổng số lượng

  • TextInput::make('qnt_allocated'): Đây là trường hiển thị tổng số lượng đã được tính toán từ các nhóm.
  • ->required(): Đảm bảo trường này là bắt buộc.
  • ->numeric(): Xác thực rằng giá trị nhập vào phải là số.
  • ->suffix('Kg'): Thêm đơn vị vào trường này.

Repeater cho nhóm

  • Repeater::make('groups'): Tạo một repeater cho các nhóm. Người dùng có thể thêm nhiều nhóm vào đây.
  • ->relationship('groups'): Thiết lập quan hệ giữa biểu mẫu và mô hình dữ liệu.

Quy tắc xác thực

  • rules([...]): Định nghĩa các quy tắc xác thực cho trường số lượng. Nếu tổng số lượng vượt quá 7000 kg, một thông báo lỗi sẽ được hiển thị.
  • afterStateUpdated(...): Khi trạng thái của trường số lượng được cập nhật, tổng số lượng sẽ được tính và cập nhật vào trường tổng số lượng.

Thực hành tốt nhất

  • Đảm bảo bạn luôn xác thực dữ liệu đầu vào để tránh lỗi không mong muốn.
  • Sử dụng các thông báo rõ ràng để người dùng biết lý do tại sao dữ liệu của họ bị từ chối.

Những điểm cần chú ý

  • Kiểm tra xem tổng số lượng có vượt quá giá trị tối đa hay không là rất quan trọng để tránh lỗi trong ứng dụng.
  • Cập nhật trường tổng số lượng ngay lập tức giúp người dùng có cái nhìn rõ ràng về số lượng mà họ đang nhập.

Mẹo hiệu suất

  • Sử dụng các phương thức tối ưu hóa truy vấn trong Laravel để xử lý dữ liệu lớn hơn.
  • Tránh việc tính toán tổng số lượng nhiều lần không cần thiết, chỉ thực hiện khi có sự thay đổi.

Giải quyết sự cố

Nếu bạn gặp phải vấn đề với việc không hiển thị tổng số lượng hoặc không nhận được thông báo xác thực, hãy kiểm tra lại các quy tắc xác thực và các phương thức cập nhật trạng thái.

Kết luận

Việc sử dụng Filament Repeater trong Laravel không chỉ đơn giản mà còn rất mạnh mẽ. Bằng cách áp dụng các kỹ thuật trong bài viết này, bạn có thể dễ dàng quản lý và xác thực dữ liệu người dùng. Hãy thử nghiệm và cải tiến ứng dụng của bạn ngay hôm nay!

Câu hỏi thường gặp (FAQ)

1. Tôi có thể thay đổi giá trị tối đa không?

Có, bạn có thể thay đổi giá trị tối đa bằng cách điều chỉnh điều kiện trong quy tắc xác thực.

2. Làm thế nào để thêm nhiều nhóm vào repeater?

Người dùng chỉ cần nhấn nút thêm để thêm nhóm mới vào repeater.

3. Có cách nào để tự động tính toán tổng số lượng không?

Có, tổng số lượng sẽ tự động được cập nhật khi có sự thay đổi trong các trường số lượng của nhóm.

Tài nguyên tham khảo

Hãy áp dụng những gì bạn đã học được và cải thiện kỹ năng lập trình của bạn!

Gợi ý câu hỏi phỏng vấn
Không có dữ liệu

Không có dữ liệu

Bài viết được đề xuất
Bài viết cùng tác giả

Bình luận

Chưa có bình luận nào

Chưa có bình luận nào