zozoh94/yii2-filemanager

Yii2 文件管理器

安装次数: 9

依赖项: 0

建议者: 0

安全: 0

星标: 1

关注者: 2

分支: 94

类型:yii2-extension

v0.12.1 2017-06-01 11:20 UTC

README

本模块基于 pendalf89/yii2-filemanager 开发。该模块提供了一种接口,用于收集和访问所有媒体文件,集中管理。灵感来源于 WordPress 文件管理器。

功能

  • 与 TinyMCE 编辑器集成。
  • 自动创建上传文件的实际目录,如 "2014/12"。或者您可以在模块设置中自定义它。
  • 自动为上传的图片创建缩略图
  • 无限数量的缩略图集
  • 所有媒体文件都存储在数据库中,允许您将对象附加到不链接到图片的媒体文件,而是链接到媒体文件的ID。这提供了更大的灵活性,因为将来可以轻松地更改缩略图的大小。
  • 如果更改缩略图大小,您可以在设置中调整所有现有缩略图的大小。

安装

安装此扩展的首选方法是通过 composer

运行

php composer.phar require zozoh94/yii2-filemanager "@dev"

或将其添加到您的 composer.json 文件的 require 部分。

"zozoh94/yii2-filemanager": "@dev"

应用迁移

yii migrate --migrationPath=@vendor/zozoh94/yii2-filemanager/migrations/

配置

'modules' => [
    'filemanager' => [
        'class' => 'zozoh94\filemanager\Module',
        
        // Rename files
        'rename' => false,
        
        // Upload routes
        'routes' => [
            // Base web directory url
			'basePath' => '@webroot',
			
			// Path for uploaded files in web directory
			'uploadPath' => 'uploads',
			
			// Directory format for uploaded files.
			'dateDirFormat' => 'Y/m',
			
			// Thumbs directory template. Path, where thumb files are located
			'thumbsDirTemplate' => '{uploadPath}/{dateDirFormat}',
        ],
        
        // Thumbnails info
        'thumbs' => [
            'small' => [
				'name' => 'Small size',
				'size' => [120, 80],
			],
			'medium' => [
				'name' => 'Medium size',
				'size' => [400, 300],
			],
			'large' => [
				'name' => 'Large size',
				'size' => [800, 600],
			],
        ],
    ],
],

配置。路由

默认值

'routes' => [
	// Base web directory url
	'basePath' => '@webroot',
	
	// Path for uploaded files in web directory
	'uploadPath' => 'uploads',
	
	// Directory format for uploaded files.
	'dateDirFormat' => 'Y/m',
	
	// Thumbs directory template. Path, where thumb files are located
	'thumbsDirTemplate' => '{uploadPath}/{dateDirFormat}',
],

如果某些参数未定义,则将使用默认值。

默认情况下,上传文件的路径为 @webroot/uploads/2016/06,如果您在2016年6月上传文件。缩略图的路径类似。

basePath

基本Web目录URL。用于生成Web目录的绝对路径。通过函数 Yii::getAlias() 渲染。

例如

'basePath' => '@webroot'
'basePath' => '@frontend/web'
'basePath' => 'system/upload/directory'

uploadPath

Web目录中上传文件的路径。不进行更改即可渲染。

例如

'uploadPath' => 'uploads'
'uploadPath' => 'files/upload'

dateDirFormat

上传文件的目录格式。递归创建目录。通过函数 date($dateDirFormat, time()) 渲染。更多信息请参阅 此处

例如

'dateDirFormat' => 'Y/m'
'dateDirFormat' => 'Y/m/d'
'dateDirFormat' => 'Y-m'

thumbsDirTemplate

缩略图目录模板。缩略图文件所在的路径。

参数 {uploadPath}{dateDirFormat} 在设置中替换为相应的值。

例如

'thumbsDirTemplate' => '{uploadPath}/{dateDirFormat}'
'thumbsDirTemplate' => '{uploadPath}/thumbs/{dateDirFormat}'
'thumbsDirTemplate' => '{uploadPath}/{dateDirFormat}/thumbs'

配置。缩略图

缩略图以 "输出" 模式调整大小。

默认配置

'thumbs' => [
	'small' => [
		'name' => 'Small size',
		'size' => [120, 80],
	],
	'medium' => [
		'name' => 'Medium size',
		'size' => [400, 300],
	],
	'large' => [
		'name' => 'Large size',
		'size' => [800, 600],
	],
],

缩略图配置结构

'thumbs' => [
	'<alias>' => [
		'name' => 'Name of alias',
		'size' => ['<width>', '<height>'],
	],
],

别名 default 被模块保留用于显示上传的图片。如果您设置它,它将被模块默认设置覆盖。

配置。其他参数

rename

如果想要在文件名已存在时重命名文件,请设置为 true。默认值:false

例如

'rename' => true

autoUpload

设置为 true 以启用自动上传。默认值:false

'autoUpload' => true

用法

简单的独立字段

use zozoh94\filemanager\widgets\FileInput;

echo $form->field($model, 'original_thumbnail')->widget(FileInput::className(), [
    'buttonTag' => 'button',
    'buttonName' => 'Browse',
    'buttonOptions' => ['class' => 'btn btn-default'],
    'options' => ['class' => 'form-control'],
    
    // Widget template
    'template' => '<div class="input-group">{input}<span class="input-group-btn">{button}</span></div>',
    
    // Optional, if set, only this image can be selected by user
    'thumb' => 'original',
    
    // Optional, if set, in container will be inserted selected image
    'imageContainer' => '.img',
    
    // Default to FileInput::DATA_URL. This data will be inserted in input field
    'pasteData' => FileInput::DATA_URL,
    
    // JavaScript function, which will be called before insert file data to input.
    // Argument data contains file data.
    // data example: [alt: "Four cats", description: "123", url: "/uploads/2014/12/cats-100x100.jpeg", id: "45"]
    'callbackBeforeInsert' => 'function(e, data) {
        console.log( data );
    }',
]);

echo FileInput::widget([
    'name' => 'mediafile',
    'buttonTag' => 'button',
    'buttonName' => 'Browse',
    'buttonOptions' => ['class' => 'btn btn-default'],
    'options' => ['class' => 'form-control'],
    
    // Widget template
    'template' => '<div class="input-group">{input}<span class="input-group-btn">{button}</span></div>',
    
    // Optional, if set, only this image can be selected by user
    'thumb' => 'original',
    
    // Optional, if set, in container will be inserted selected image
    'imageContainer' => '.img',
    
    // Default to FileInput::DATA_IDL. This data will be inserted in input field
    'pasteData' => FileInput::DATA_ID,
    
    // JavaScript function, which will be called before insert file data to input.
    // Argument data contains file data.
    // data example: [alt: "Four cats", description: "123", url: "/uploads/2014/12/cats-100x100.jpeg", id: "45"]
    'callbackBeforeInsert' => 'function(e, data) {
        console.log( data );
    }',
]);

与 TinyMCE 一起使用

use zozoh94\filemanager\widgets\TinyMCE;

<?= $form->field($model, 'content')->widget(TinyMCE::className(), [
    'clientOptions' => [
           'language' => 'ru',
        'menubar' => false,
        'height' => 500,
        'image_dimensions' => false,
        'plugins' => [
            'advlist autolink lists link image charmap print preview anchor searchreplace visualblocks code contextmenu table',
        ],
        'toolbar' => 'undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image | code',
    ],
]); ?>

在模型中,您必须设置媒体文件行为,如下例所示

use zozoh94\filemanager\behaviors\MediaFileBehavior;

public function behaviors()
{
    return [
        'mediafile' => [
            'class' => MediaFileBehavior::className(),
            'name' => 'post',
            'attributes' => [
                'thumbnail',
            ],
        ]
    ];
}

然后,您可以从所有者模型中获取媒体文件。请参阅示例

use zozoh94\filemanager\models\MediaFile;

$model = Post::findOne(1);
$mediaFile = MediaFile::loadOneByOwner('post', $model->id, 'thumbnail');

// Ok, we have mediafile object! Let's do something with him:
// return url for small thumbnail, for example: '/uploads/2014/12/flying-cats.jpg'
echo $mediaFile->thumbFiles->getUrl('small');