mardi 14 septembre 2021

Laravel Nova Image Collection upload "The image-collection must be an image"

I've inherited an Expo app with a Laravel backend, and I'm having trouble allowing images to be uploaded on the Nova admin panel. Whenever I try to upload a photo, I get an error that says "The image-collection must be an image." From the code, I can tell the name of the image collection is "image-collection", but I'm not sure why Nova thinks the image collection isn't an image. I'm able to upload photos through the app, so it looks like it should be a Nova issue. Here's a screenshot of the error I'm getting: Laravel Nova Image Upload error

Here is the Image model that we are using to store the images in the database

<?php

namespace App;

use App\Traits\Searchable;
use Cviebrock\EloquentSluggable\Sluggable;
use Illuminate\Database\Eloquent\Model;
use Illuminate\Support\Str;
use Illuminate\Support\Facades\Storage;

use Spatie\MediaLibrary\HasMedia\HasMedia;
use Spatie\MediaLibrary\HasMedia\HasMediaTrait;
use Spatie\MediaLibrary\Models\Media;

/**
 * App\Image
 *
 * @property int $id
 * @property int $restaurant_id
 * @property string|null $image_path
 * @property string|null $caption
 * @property string $slug
 * @property bool $active
 * @property \Illuminate\Support\Carbon|null $created_at
 * @property \Illuminate\Support\Carbon|null $updated_at
 * @property-read mixed $slug_title
 * @property-read \Illuminate\Database\Eloquent\Collection|\Spatie\MediaLibrary\Models\Media[] $media
 * @property-read \App\Restaurant $restaurant
 * @method static \Illuminate\Database\Eloquent\Builder|\App\Image findSimilarSlugs($attribute, $config, $slug)
 * @method static \Illuminate\Database\Eloquent\Builder|\App\Image newModelQuery()
 * @method static \Illuminate\Database\Eloquent\Builder|\App\Image newQuery()
 * @method static \Illuminate\Database\Eloquent\Builder|\App\Image query()
 * @method static \Illuminate\Database\Eloquent\Builder|\App\Image whereActive($value)
 * @method static \Illuminate\Database\Eloquent\Builder|\App\Image whereCaption($value)
 * @method static \Illuminate\Database\Eloquent\Builder|\App\Image whereCreatedAt($value)
 * @method static \Illuminate\Database\Eloquent\Builder|\App\Image whereId($value)
 * @method static \Illuminate\Database\Eloquent\Builder|\App\Image whereImagePath($value)
 * @method static \Illuminate\Database\Eloquent\Builder|\App\Image whereRestaurantId($value)
 * @method static \Illuminate\Database\Eloquent\Builder|\App\Image whereSlug($value)
 * @method static \Illuminate\Database\Eloquent\Builder|\App\Image whereUpdatedAt($value)
 * @mixin \Eloquent
 * @method static \Illuminate\Database\Eloquent\Builder|\App\Image searchBy($value)
 */
class Image extends Model implements HasMedia
{
    use Sluggable;
    use HasMediaTrait;
    use Searchable;

    public function sluggable()
    {
        return [
            'slug' => [
                'source' => 'slug_title',
                'unique' => true,
            ]
        ];
    }

    protected $fillable = [
        'caption', 'active', 'review_id'
    ];

    protected $searchable = [
        'id', 'caption',
    ];

    protected $casts = [
        'active' => 'boolean'
    ];

    public function getSlugTitleAttribute()
    {
        return Str::random(12);
    }

    public function restaurant()
    {
        return $this->belongsTo(Restaurant::class);
    }

    public function registerMediaConversions(Media $media = null)
    {
        $this->addMediaConversion('thumb')
//            ->width(130)
            ->height(300)
            ->withResponsiveImages();
    }

    public function registerMediaCollections()
    {
        $this->addMediaCollection('main-image')->singleFile();
        $this->addMediaCollection('image-collection');
    }
}

Here is the corresponding Nova panel:


namespace App\Nova;

use Laravel\Nova\Fields\BelongsTo;
use Laravel\Nova\Fields\ID;
use Illuminate\Http\Request;
use Laravel\Nova\Fields\Text;
use Laravel\Nova\Fields\Boolean;
use Laravel\Nova\Fields\Markdown;
use Laravel\Nova\Http\Requests\NovaRequest;
use Ebess\AdvancedNovaMediaLibrary\Fields\Images;

class Image extends Resource
{
    /**
     * The model the resource corresponds to.
     *
     * @var string
     */
    public static $model = 'App\Image';

    /**
     * The single value that should be used to represent the resource when being displayed.
     *
     * @var string
     */
    public static $title = 'caption';

    /**
     * The columns that should be searched.
     *
     * @var array
     */
    public static $search = [
        'caption'
    ];

    /**
     * Get the fields displayed by the resource.
     *
     * @param  \Illuminate\Http\Request  $request
     * @return array
     */
    public function fields(Request $request)
    {
        return [

            BelongsTo::make('Restaurant Name', 'restaurant', 'App\Nova\Restaurant')->creationRules('required')->sortable(),
            Text::make('Caption')->rules('required', 'max:84')->sortable(),

            // allow batch image upload
            Images::make('Image Collection', 'image-collection') // second parameter is the media collection name
                //->withResponsiveImages()
                ->customPropertiesFields([
                    Boolean::make('Active'),
                    Markdown::make('Description'),
                ])
                ->setFileName(function($originalFilename, $extension, $model){
                    return md5($originalFilename) . '.' . $extension;
                })
                ->conversionOnPreview('thumb') // conversion used to display the "original" image
                ->conversionOnDetailView('thumb') // conversion used on the model's view
                ->conversionOnIndexView('thumb') // conversion used to display the image on the model's index page
                ->conversionOnForm('thumb') // conversion used to display the image on the model's form
                ->fullSize() // full size column
                //->rules('required') // validation rules for the collection of images
                // validation rules for the collection of images
                ->singleImageRules('dimensions:min_width=100'),

            Boolean::make('Active'),
        ];
    }

    /**
     * Get the cards available for the request.
     *
     * @param  \Illuminate\Http\Request  $request
     * @return array
     */
    public function cards(Request $request)
    {
        return [];
    }

    /**
     * Get the filters available for the resource.
     *
     * @param  \Illuminate\Http\Request  $request
     * @return array
     */
    public function filters(Request $request)
    {
        return [];
    }

    /**
     * Get the lenses available for the resource.
     *
     * @param  \Illuminate\Http\Request  $request
     * @return array
     */
    public function lenses(Request $request)
    {
        return [];
    }

    /**
     * Get the actions available for the resource.
     *
     * @param  \Illuminate\Http\Request  $request
     * @return array
     */
    public function actions(Request $request)
    {
        return [];
    }
}

Any help on this would be much appreciated, as I am a Laravel and Laravel Nova beginner.



via Chebli Mohamed

Aucun commentaire:

Enregistrer un commentaire