README

A TALL Stack Media Manager to upload media files to multiple storages or select image from Unsplash, URL

CleanShot.2022-03-22.at.22.24.51.mp4

安装

您可以通过Composer安装此包

composer require phuclh/media-manager

在 tailwind.config.js 中添加Tailwind CSS类

module.exports = {
    content: [
        ...
        './vendor/phuclh/media-manager/resources/views/**/*.blade.php',
    ]
};

您可以使用以下命令发布配置文件

php artisan vendor:publish --tag="media-manager-config"

这是发布配置文件的内容

return [
    'storage'    => [
        'disk' => 'public'
    ],

    'image' => [
        'allowed_file_types' => ['png', 'jpg', 'jpeg', 'gif'],

        /*
         * Max file size in KB.
         */
        'max_file_size'      => 5000,
    ],

    'unsplash' => [
        'access_key' => env('UNSPLASH_ACCESS_KEY'),

        'utm_source' => env('APP_NAME')
    ]
];

可选地，您可以使用以下方法发布视图

php artisan vendor:publish --tag="media-manager-views"

如何打开媒体管理器模态框

通过Alpinejs

this.$wire.emitTo(
    'media-manager',
    'media-manager:show',
    {
        id: 'featured-image',
        file: null,
        metadata: null
    }
);

从Livewire组件

use Phuclh\MediaManager\WithMediaManager;

...

public function showUploader() 
{
    $this->showFileManager('featured-image', $file, $metadata);
}

您可以将文件URL作为第二个参数传递，这样媒体管理器将默认显示该文件。

从媒体管理器中删除文件

use Phuclh\MediaManager\WithMediaManager;

...

public function removeFeaturedImage() 
{
    $this->image = null;
    
    $this->removeFileFromMediaManager();
}

事件

文件已选择

当选择媒体文件时，它将触发一个名为 media-manager:file-selected 的事件

您可以使用AlpineJS来监听该事件，如下所示

x-on:media-manager:file-selected.window="setImage"

更新日志

有关最近更改的更多信息，请参阅更新日志

贡献

有关详细信息，请参阅贡献指南

安全漏洞

有关如何报告安全漏洞，请参阅我们的安全策略

致谢

许可证

MIT许可证（MIT）。有关更多信息，请参阅许可证文件

phuclh / media-manager

维护者

详细信息