Проблема с kartik/fileinput

Общие вопросы по использованию второй версии фреймворка. Если не знаете как что-то сделать и это про Yii 2, вам сюда.
Ответить
ziablik
Сообщения: 1
Зарегистрирован: 2019.07.13, 23:31

Проблема с kartik/fileinput

Сообщение ziablik » 2019.07.13, 23:41

Всем привет, сразу скажу, что читал доку по kartik/fileinput, но решения на свои проблемы так и не нашел.

И так, имеется обычный crud таблицы заказов, которая связана с таблицей файлов:
Изображение
  • Создание заказа
Необходимо было сделать добавление файлов без ajax отправки, были проблемы с тем, что файлы стирались при выборе новых, но решил проблему неким костылем, а именно вот так:

Код: Выделить всё

echo $form->field($model, 'file[]')->widget(FileInput::classname(), [
                    'options' => [
                        'multiple' => true,
                        'accept' => Yii::$app->params['fileInputAccept'],
                    ],
                    'pluginOptions' => [
                        'uploadUrl' => '/',
                        'overwriteInitial' => false,
                        'showUpload' => false,
                        'layoutTemplates' => [
                            'actionUpload' => ''
                        ]
                    ]
                ]);
Но возникла следующая проблема, если добавить допустим 2 файла в preview, а потом добавить еще 3, то в этом случае, после нажатия на submit, сохраняются только последние 3 файла.
Изображение
Делал VarDump($_FILES), как я понял, после каждого очередного выбора файлов переменная $_FILES просто перезаписывается. Посоветуйте пожалуйста, как это можно исправить.
  • Обновление заказа
И так, что на счет обновления заказа, здесь уже ajax загрузка и удаление файлов и тд. Не буду вдаваться в подробности вот код:

Код: Выделить всё

echo FileInput::widget([
                    'model' => $model,
                    'attribute' => 'file',
                    'options' => [
                        'multiple' => true,
                        'accept' => Yii::$app->params['fileInputAccept'],
                    ],
                    'pluginOptions' => [
                        'initialPreview' => $fileUrls,
                        'initialPreviewAsData' => true,
                        'initialPreviewConfig' => $initialConfig,
                        'overwriteInitial' => false,
                        "uploadUrl" => Url::to(['/orders/files/upload']),
                        'deleteUrl' => Url::to(['/orders/files/delete']),
                        'showUpload' => false,
                    ]
                ]);
После очередной ajax загрузки файла на сервер, кнопка удаления не работает как ajax, она работает только у файлов, которые были инициализированы изначально. Не смог найти способ, как сделать работу этой кнопки через ajax

Если кто сталкивался с этими проблемами, жду ваших комментариев, буду очень признателен в любой помощи.

CCCZen
Сообщения: 16
Зарегистрирован: 2018.04.01, 15:41

Re: Проблема с kartik/fileinput

Сообщение CCCZen » 2019.07.15, 15:18

Вьюха:

Код: Выделить всё

<?php $form = ActiveForm::begin( [ 'options' => [ 'enctype' => 'multipart/form-data' ] ] ); ?>
	<?= $form->field( $model, 'objImages[]' )->widget( FileInput::classname(), [
		'options'       => [
			'multiple' => true,
			'accept'   => 'image/*',
			'id'       => 'imageLoader',
		],
		'name'          => 'imageLoader',
		'pluginOptions' => [
			'initialPreview'       => $model->generateImagesArray(),
			'initialPreviewConfig' => $model->generateImagesConfigArray(),
			'uploadUrl'            => Url::to( [ '/object/upload-image' ] ),
			'uploadExtraData'      => [ 'object' => $model->id ],
			'browseOnZoneClick'    => true,
			'overwriteInitial'     => false,
			'initialPreviewAsData' => true,
			'maxFileCount'         => 10,
			'showPreview'          => true,
			'showCaption'          => false,
			'showCancel'           => false,
			'showClose'            => false,
			'showRemove'           => false,
			'showUpload'           => false,
			'showDownload'         => false,
			'showBrowse'           => false,
			'otherActionButtons'   => '',//$buttonRotate,
			'browseClass'          => "btn btn-primary btn-block",
			'previewSettings'      => [
				'image' => [ 'width' => "auto", 'height' => "auto", 'max-width' => "100%", 'max-height' => "100%" ],
			],
			'layoutTemplates'      => [
				'modalMain' => '<div id="kvFileinputModal" class="file-zoom-dialog modal fade" tabindex="-1" aria-labelledby="kvFileinputModalLabel"></div>',
				'modal'     => '<div class="modal-dialog modal-lg" role="document">' .
				               '  <div class="modal-content">' .
				               '    <div class="modal-header">' .
				               '      <div class="kv-zoom-actions pull-right">{toggleheader}{fullscreen}{borderless}{close}</div>' .
				               '      <h3 class="modal-title"><small><span class="kv-zoom-title"></span></small></h3>' .
				               '    </div>' .
				               '    <div class="modal-body">' .
				               '      <div class="floating-buttons"></div>' .
				               '      <div class="file-zoom-content">'.				            
				               '</div>' .
				               '    </div>' .
				               '  </div>' .
				               '</div>',
				'actions'   => '<div class="file-actions">' .
				               '    <div class="file-footer-buttons">' .
				               '        {upload} {download} {delete} {zoom} {other}' .
				               '    </div>' .
				               '    {drag}' .
				               '    <div class="file-upload-indicator" title="{indicatorTitle}">{indicator}</div>' .
				               '    <div class="clearfix"></div>' .
				               '</div>',
			],
		],
		'pluginEvents'  => [
			'filebatchselected' => 'function(event, params) { $(imageLoader).fileinput("upload");  }',
			'filesorted'        => 'function(event, params) {  $.post({ url: "' . Url::to( [
					'/object/sort-image',
					'id' => $model->id
				] ) . '", data: JSON.stringify(params.stack)}) }',
			'filezoomshow'      => 'function(event, params) { console.log($(\'#\'+params.previewId)); resetImageEditor($(\'#\'+params.previewId+\' img\').attr(\'src\'),params.previewId); }',
		]
	] )->label( 'Изображения' ); ?>

	<? //= \common\widgets\ImageEditor\ImageEditorWidget::widget( [ 'type' => 'body' ] ) ?>
	<?php ActiveForm::end(); ?>
контроллер object

Код: Выделить всё

public function actionUploadImage() {

		$model       = new UploadImage();
		$model->path = 'objects/' . $_POST['object'];
		$model->uploadObject( $_POST['object'] );

		return Json::encode( $model->response );
	}

	public function actionDeleteImage( $id ) {
		if ( ( $model = ObjImage::findOne( $id ) ) !== null ) {
			$model->delete();

			return Json::encode( '' );
		}

		throw new NotFoundHttpException( 'Изображение не найдено.' );
	}

	public function actionSortImage( $id ) {
		$model = $this->findModel( $id );
		$model->sortImages( file_get_contents( 'php://input' ) );
	}
стартовые значения

Код: Выделить всё

'initialPreview'       => $model->generateImagesArray(),
			'initialPreviewConfig' => $model->generateImagesConfigArray(),

Код: Выделить всё

public function generateImagesArray() {
		$images = $this->getObjImages()->orderBy( 'order' )->all();
		$retArr = [];
		foreach ( $images as $item ) {
			$retArr[] = Yii::$app->urlManagerFrontend->createUrl( [ $item->link ] );
		}

		return $retArr;
	}

	public function generateImagesConfigArray() {
		$images = $this->getObjImages()->orderBy( 'order' )->all();
		$retArr = [];

		foreach ( $images as $item ) {
			$config   = [
				'key'         => $item->id,
				'caption'     => $item->description,
				'downloadUrl' => Yii::$app->urlManagerFrontend->createUrl( [ $item->link ] ),
				'url'         => Yii::$app->urlManager->createUrl( [ 'object/delete-image', 'id' => $item->id ] )
			];
			$retArr[] = $config;
		}

		return $retArr;

	}
загрузка изображения

Код: Выделить всё

public function uploadObject( $param ) {


		$this->imageFile = UploadedFile::getInstancesByName( 'Object' )[0];
		$path            = Yii::getAlias( '@frontend' ) . '/web/resources/' . $this->path . "/";

		if ( $this->validate() ) {
			FileHelper::createDirectory( $path, $mode = 0775, $recursive = true );
			$this->fileName = uniqid();

			$imageine = Image::resize( $this->imageFile->tempName, 1280, 1280, true, false );

			if ( $imageine->save( $path . $this->fileName . '.' . $this->imageFile->extension ) ) {
				$this->response = $this->loadObjectImage( $param );
			}

			return true;
		} else {

			return false;
		}
	}

CCCZen
Сообщения: 16
Зарегистрирован: 2018.04.01, 15:41

Re: Проблема с kartik/fileinput

Сообщение CCCZen » 2019.07.15, 15:20

loadObjectImage

Код: Выделить всё

private function loadObjectImage( $objectId ) {
		$image = new ObjImage();


		$image->link        = '/resources/' . $this->path . "/" . $this->fileName . '.' . $this->imageFile->extension;
		$image->description = "";
		$image->can_reserve = 0;
		$image->object      = $objectId;
		$image->order       = 0;
		if ( $image->save() ) {
			$preview  = Yii::$app->urlManagerFrontend->createUrl( [ $image->link ] );
			$config[] = [
				'key'         => $image->id,
				'caption'     => $image->description,
				'size'        => $this->imageFile->size,
				'downloadUrl' => Yii::$app->urlManagerFrontend->createUrl( [ $image->link ] ),
				'url'         => Yii::$app->urlManager->createUrl( [ 'object/delete-image', 'id' => $image->id ] )
			];
		} else {
			$errors = $this->imageFile->name;
		}

		$out = [ 'initialPreview' => $preview, 'initialPreviewConfig' => $config, 'initialPreviewAsData' => true ];
		if ( ! empty( $errors ) ) {
			$out['error'] = 'Мы не можем загрузить ' . $errors . ' сейчас. Попробуйте позже.';
		}

		return $out;
	}

Ответить