azizyus/image-manager

1.13 2024-01-06 22:05 UTC

This package is auto-updated.

Last update: 2024-09-24 19:04:03 UTC


README

此软件包能做什么?

  • 上传图片(拖放或直接从窗口选择)
  • 通过拖放排序图片
  • 可以创建和维护特定变体图像(可以重新创建)
  • 裁剪图像和变体
  • 从已上传的图像中选择变体
  • 从上传的图像中定义变体和特定图像,如“缩略图”或“封面”
  • 可能实现模型附件和查询限制
  • 可以从URL导入图像,其行为与正常上传的文件相同

安装

composer require azizyus/image-manager ^1.0

添加到您的config/app.php
\Azizyus\ImageManager\ImageManagerServiceProvider::class,

php artisan migrate
php artisan vendor:publish --tag=managed-images

NPM 依赖

        "bootstrap-vue": "^2.21.2",
        "vue-cropperjs": "^4.2.0",
        "vuedraggable": "^2.24.3"

示例

控制器

        public function listing()
        {
            $user = User::with('allImages','thumbnailImage','coverImage')->first();
            $data = [
                'images' => $user->allImages->map(function ($f){return $f->map();}),
                'thumbnailImage' => $user->thumbnailImage->map(),
                'coverImage' => $user->coverImage->map(),

            ];
            //dd($data['coverImage'],$data['thumbnailImage'],$data['images'][0]);
            return view('listing')->with($data);
        }

        public function index()
        {
            ImageManager::setUploadUrl(route('image.upload'));
            ImageManager::setFilesUrl(route('image.files'));
            return view('uploader');
        }

        public static function chooseSpecialImage(Request $request)
        {

            $user = User::first();
            return ImageManager::withModel($user,function()use($request){
                return ImageManager::chooseSpecialImage($request);
            });
        }

        public static function specialImages(Request $request)
        {
            $user = User::first();
            return ImageManager::withModel($user,function()use($request){
                return ImageManager::specialImages($request);
            });
        }

        public function upload(Request $request)
        {
            $user = User::first();
            return ImageManager::withModel($user,function()use($request){
                return ImageManager::upload($request);
            });
        }

        public function delete(Request $request)
        {
            $user = User::first();
            return ImageManager::withModel($user,function()use($request){
                return ImageManager::deleteFile($request);
            });
        }

        public function sort(Request $request)
        {
            $user = User::first();
            return ImageManager::withModel($user,function()use($request){
                return ImageManager::setSort($request);
            });
        }

        public function crop(Request $request)
        {
            $user = User::first();
            return ImageManager::withModel($user,function()use($request){
                return ImageManager::cropImage($request);
            });
        }

        public function remote(Request $request)
        {
            $user = User::first();
            return ImageManager::withModel($user,function()use($request){
                return ImageManager::importFromUrl($request);
            });
        }

        public function files()
        {
            $user = User::first();
            return ImageManager::withModel($user,function(){
                return ImageManager::getFiles();
            });
        }

路由

    Route::get('uploader','UploadController@index')->name('image.index');
    Route::any('specialImages','UploadController@specialImages')->name('image.specialImages');
    Route::any('chooseSpecialImage','UploadController@chooseSpecialImage')->name('image.chooseSpecialImage');
    Route::any('upload','UploadController@upload')->name('image.upload');
    Route::any('listing','UploadController@listing')->name('image.listing');
    Route::any('sort','UploadController@sort')->name('image.sort');
    Route::any('remote','UploadController@remote')->name('image.remote');
    Route::any('delete','UploadController@delete')->name('image.delete');
    Route::any('crop','UploadController@crop')->name('image.crop');
    Route::any('files','UploadController@files')->name('image.files');

路由附件

    $this->app->singleton('imageManager',function(){
                $s = new Manager(Storage::disk('public'));
                $s->setDeleteUrl('/delete');
                $s->setUploadUrl('/upload');
                $s->setFilesUrl('/files');
                $s->setSortUrl('/sort');
                $s->setCropFilesUrl('/crop');
                $s->setRemoteUrlUploadUrl('/remote');
                $s->setSpecialImagesUrl('/specialImages');
                $s->setChooseSpecialImageUrl('/chooseSpecialImage');
                return $s;
    });

变体定义

ImageManager::defineSpecialImage('thumbnail',150,150); //choose thumbnail from uploaded images
ImageManager::defineSpecialImage('cover',150,150); //choose thumbnail from uploaded images
ImageManager::defineVariation('sliderListingImage',75,75,'gallery'); //generate variation for uploaded images except special ones

预定义组件名称

Vue.component('wrapper',require('./components/Wrapper.vue').default)
Vue.component('ImageFileBox',require('./components/ImageFileBox').default);
Vue.use(require('vuedraggable'))
Vue.use(require('bootstrap-vue'));

预定义 Vue 组件

使用此功能构建您视图的组件
{!! \Azizyus\ImageManager\VueGeneration\VueComponentBuilder::build(imageManager()) !!}

重新生成变体

在您定义新内容时很有用 php artisan imagemanager:generate:variations