michielkempen / advanced-nova-media-library
Laravel Nova 用于管理 Spatie 媒体库的工具。
Requires
- php: >=7.1.0
- laravel/framework: ^5.6|^6.0|^7.0
- laravel/nova: ^2.0|^3.0
- spatie/laravel-medialibrary: ^7.5
This package is auto-updated.
Last update: 2024-09-09 02:16:55 UTC
README
管理spatie的媒体库包中的图像。可以上传多张图像并通过拖放排序。
目录
示例
安装
composer require ebess/advanced-nova-media-library
php artisan vendor:publish --tag=nova-media-library
模型媒体配置
假设您已配置模型使用媒体库如下
use Spatie\MediaLibrary\Models\Media; public function registerMediaConversions(Media $media = null) { $this->addMediaConversion('thumb') ->width(130) ->height(130); } public function registerMediaCollections() { $this->addMediaCollection('main')->singleFile(); $this->addMediaCollection('my_multi_collection'); }
通用文件管理
要能够上传和处理通用文件,请使用 Files
字段。
use Ebess\AdvancedNovaMediaLibrary\Fields\Files; Files::make('Single file', 'one_file'), Files::make('Multiple files', 'multiple_files'),
单张图像上传
use Ebess\AdvancedNovaMediaLibrary\Fields\Images; public function fields(Request $request) { return [ Images::make('Main image', 'main') // second parameter is the media collection name ->conversionOnIndexView('thumb') // conversion used to display the image ->rules('required'), // validation rules ]; }
多张图像上传
如果您启用了多文件上传功能,您可以通过 拖放 来排序图像。
use Ebess\AdvancedNovaMediaLibrary\Fields\Images; public function fields(Request $request) { return [ Images::make('Images', 'my_multi_collection') // second parameter is the media collection name ->conversionOnPreview('medium-size') // 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', 'size:3') // validation rules for the collection of images // validation rules for the collection of images ->singleImageRules('dimensions:min_width=100'), ]; }
选择现有媒体
如果您要将相同的媒体文件上传到多个模型,并且不想再次从文件系统中选择,请使用此功能。选择已存在的媒体将 复制 它。
注意:此功能将向应用程序的每个用户公开搜索现有媒体。如果您的媒体上传/媒体模型上的自定义属性是机密的,请 不要启用此功能!
- 如果尚未发布配置文件,请发布它们
artisan vendor:publish --tag=nova-media-library
- 在配置文件 config/nova-media-library 中启用此功能
return [ 'enable-existing-media' => true, ];
- 启用现有媒体字段的选择
Images::make('Image')->enableExistingMedia(),
上传图像名称
新上传文件的默认文件名为原始文件名。您可以使用 setFileName
函数来更改它,该函数仅接受一个回调函数作为参数。此回调函数有三个参数:$originalFilename
(原始文件名,如 Fotolia 4711.jpg
)、$extension
(文件扩展名,如 jpg
)和 $model
(当前模型)。以下是一些示例:
// Set the filename to the MD5 Hash of original filename Images::make('Image 1', 'img1') ->setFileName(function($originalFilename, $extension, $model){ return md5($originalFilename) . '.' . $extension; }); // Set the filename to the model name Images::make('Image 2', 'img2') ->setFileName(function($originalFilename, $extension, $model){ return str_slug($model->name) . '.' . $extension; });
默认情况下,媒体对象上的 "name" 字段设置为不带扩展名的原始文件名。要更改此设置,您可以使用 setName
函数。与 setFileName
一样,它仅接受一个回调函数作为参数。此回调函数有两个参数:$originalFilename
和 $model
。
Images::make('Image 1', 'img1') ->setName(function($originalFilename, $model){ return md5($originalFilename); });
响应式图像
如果您想使用来自 Spatie MediaLibrary 的响应式图像功能,您可以在模型上使用 withResponsiveImages()
函数。
Images::make('Image 1', 'img1') ->withResponsiveImages();
图像裁剪
默认情况下,您可以通过在编辑视图的左下角点击剪刀来裁剪/旋转图像。为此目的使用了 vue-js-clipper。裁剪功能仅限于 image/jpg
、image/jpeg
和 image/png
的 mime 类型。
重要:通过裁剪现有图像,原始媒体模型将被删除并替换为裁剪后的图像。所有自定义属性都将从旧模型复制到新模型。
要禁用此功能,请使用 croppable
方法
Images::make('Gallery')->croppable(false);
您可以设置所有配置,例如比例,如下所示
Images::make('Gallery')->croppingConfigs(['ratio' => 4/3]);
可用的裁剪配置,请参阅https://github.com/timtnleeProject/vuejs-clipper#clipper-basic。
自定义属性
Images::make('Gallery') ->customPropertiesFields([ Boolean::make('Active'), Markdown::make('Description'), ]); Files::make('Multiple files', 'multiple_files') ->customPropertiesFields([ Boolean::make('Active'), Markdown::make('Description'), ]); // custom properties without user input Files::make('Multiple files', 'multiple_files') ->customProperties([ 'foo' => auth()->user()->foo, 'bar' => $api->getNeededData(), ]);
显示图像尺寸
Images::make('Gallery') ->showDimensions();
自定义头部
Images::make('Gallery') ->customHeaders([ 'header-name' => 'header-value', ]);
媒体字段(视频)
要处理带有缩略图的视频,您需要使用 Media
字段而不是 Images
。这样,您就可以上传视频了。
use Ebess\AdvancedNovaMediaLibrary\Fields\Media; class Category extends Resource { public function fields(Request $request) { Media::make('Gallery') // media handles videos ->conversionOnIndexView('thumb') ->singleMediaRules('max:5000'); // max 5000kb } } // .. class YourModel extends Model implements HasMedia { public function registerMediaConversions(Media $media = null) { $this->addMediaConversion('thumb') ->width(368) ->height(232) ->extractVideoFrameAtSecond(1); } }