Добавьте изображение в форме Laravel/Filament

Я пытаюсь создать форму мастера в Filament. Он состоит из 2 шагов:

  1. Сначала пользователю необходимо указать номер продукта.
  2. После этого скрипт получает некоторую информацию, включая URL-адрес изображения с другого сайта, через API. Я хочу, чтобы на этом шаге отображалось соответствующее изображение. В результате пользователь должен подтвердить, что это именно тот продукт, который ему нужен.

И теперь я не понимаю, как вывести изображение в таком виде. Это не загрузчик файлов. Это просто изображение.

Насколько я понимаю, это можно сделать через ViewField. Но не понимаю, как указать, что это должен быть какой-то компонент изображения и как передать туда URL-адрес в afterValidation на первом шаге. Пожалуйста помоги.

    public function getSteps(): array
    {
        return [
            Step::make('Product ID')
                ->description('Write a product id you want')
                ->schema([
                    TextInput::make('product_id')
                        ->required()
                        ->reactive()
                ])
                ->afterValidation(function(Get $get, Set $set){
                    $id = $get('product_id');
                    $product_image_url = Product::get_image_url($id);
                    $set('product_image', $product_image_url);
                }),
            Step::make('Confirmation')
                ->description('Check a product one more time and confirm you want it')
                ->schema([
                    ViewField::make('product_image')
                       ...............
                       ...............
                ]),
Стоит ли изучать PHP в 2026-2027 годах?
Стоит ли изучать PHP в 2026-2027 годах?
Привет всем, сегодня я хочу высказать свои соображения по поводу вопроса, который я уже много раз получал в своем сообществе: "Стоит ли изучать PHP в...
Оживление вашего приложения Laravel: Понимание режима обслуживания
Оживление вашего приложения Laravel: Понимание режима обслуживания
Здравствуйте, разработчики! В сегодняшней статье мы рассмотрим важный аспект управления приложениями, который часто упускается из виду в суете...
Коллекции в Laravel более простым способом
Коллекции в Laravel более простым способом
Привет, читатели, сегодня мы узнаем о коллекциях. В Laravel коллекции - это способ манипулировать массивами и играть с массивами данных. Благодаря...
Поиск нового уровня в Laravel с помощью MeiliSearch и Scout
Поиск нового уровня в Laravel с помощью MeiliSearch и Scout
Laravel Scout - это популярный пакет, который предоставляет простой и удобный способ добавить полнотекстовый поиск в ваше приложение Laravel. Он...
Освоение архитектуры микросервисов с Laravel: Лучшие практики, преимущества и советы для разработчиков
Освоение архитектуры микросервисов с Laravel: Лучшие практики, преимущества и советы для разработчиков
В последние годы архитектура микросервисов приобрела популярность как способ построения масштабируемых и гибких приложений. Laravel , популярный PHP...
Как построить CRUD-приложение в Laravel
Как построить CRUD-приложение в Laravel
Laravel - это популярный PHP-фреймворк, который позволяет быстро и легко создавать веб-приложения. Одной из наиболее распространенных задач в...
1
0
916
2
Перейти к ответу Данный вопрос помечен как решенный

Ответы 2

Моя первая попытка была бы следующей:

  • Добавьте директиву live(), возможно, с откатом , в поле product_id. Это снова отобразит всю форму после изменения значения этого поля. Итак, когда продукт выбран, все поля отображаются снова.
  • По вашему мнению, убедитесь, что у вас есть доступ к классу Get или к текущему состоянию формы любым способом, чтобы вы могли получить выбранный идентификатор продукта. Используйте PHP внутри своего представления, чтобы получить изображение и использовать его в качестве источника для элемента изображения HTML.

Если это не поможет, вот альтернативный путь:

  • Добавьте скрытое поле для URL-адреса изображения продукта.
  • В представлении ViewField добавьте элемент изображения с источником-заполнителем.
  • Используйте JS для обновления атрибута src элемента изображения при каждом изменении значения скрытых полей.
Ответ принят как подходящий

Повозившись некоторое время, мне понадобился аналогичный функционал. Вы можете просто отобразить изображение в заполнителе:

Placeholder::make('Image')
   ->content(function ($record): HtmlString {
      return new HtmlString("<img src= '" . $record->URL . "')>");
})

MikeC, ты спасаешь мой день ;) Узнал что-то новое и сэкономил много кода и логики. Это следует включить в документацию по Filament, рекомендации и советы.

Boyd Chung 03.05.2024 04:28

Другие вопросы по теме