[WIP] Fixes on Varieties & attributes prices, add uploader widget

This commit is contained in:
Ludovic CANDELLIER
2020-06-07 13:03:23 +02:00
parent 9acf35f5ee
commit 424fb43b20
27 changed files with 242 additions and 237 deletions

View File

@@ -12,6 +12,7 @@ var jsMain = [
// 'node_modules/@activix/bootstrap-datetimepicker/js/bootstrap-datetimepicker.min.js',
// 'node_modules/@activix/bootstrap-datetimepicker/js/locales/bootstrap-datetimepicker.fr.js',
'node_modules/bootstrap-fileinput/js/plugins/piexif.min.js',
'node_modules/bootstrap-fileinput/js/plugins/sortable.min.js',
// 'node_modules/bootstrap-slider/dist/bootstrap-slider.min.js',
// 'node_modules/bootstrap-validate/dist/bootstrap-validate.js',
// 'node_modules/jQuery-QueryBuilder/dist/js/jquery-builder.standalone.min.js',
@@ -30,7 +31,7 @@ var jsMain = [
'build/js/include/set_options.js',
// 'build/js/include/confirm.js',
'build/js/include/appender.js',
// 'build/js/include/app.js',
'build/js/include/app.js',
]
var cssMain = [

View File

@@ -54,20 +54,29 @@ class VarietyController extends Controller
public function edit($id)
{
$data = Varieties::getWithImages($id)->toArray();
$data = Varieties::get($id)->toArray();
$data['species'] = Species::getOptions();
$data['tags_list'] = TagGroups::getTreeTags();
return view('Botanic.Admin.Varieties.edit', $data);
}
public function getImages(Request $request, $id = false)
{
$id = $id ? $id : $request->input('id');
$data['images'] = Varieties::getImages($id);
return view('components.uploader.mini-gallery-items', $data);
}
public function destroy($id)
{
return Varieties::destroy($id);
}
public function deleteImage($id)
public function deleteImage(Request $request)
{
$id = $request->input('id');
$index = $request->input('index');
return Varieties::deleteImage($id, $index);
}
}

View File

@@ -68,4 +68,10 @@ class ArticleController extends Controller
return Articles::destroy($id);
}
public function deleteImage(Request $request)
{
$id = $request->input('id');
$index = $request->input('index');
return Articles::deleteImage($id, $index);
}
}

View File

@@ -45,17 +45,6 @@ class Varieties
return Variety::find($id);
}
public static function getWithImages($id)
{
$variety = self::get($id);
$variety->getMedia();
// $variety = $variety->toArray();
foreach ($variety->media as $key => $media) {
$variety->media[$key]['url'] = $media->getUrl();
}
return $variety;
}
public static function store($data)
{
return isset($data['id']) ? self::update($data) : self::create($data);
@@ -82,9 +71,27 @@ class Varieties
{
if ($files) {
foreach ($files as $file) {
$variety->addMedia($file)->toMediaCollection('images');
$variety->addMedia($file)->withResponsiveImages()->toMediaCollection('images');
}
}
}
public static function getImages($id)
{
$variety = self::get($id);
$variety->getMedia();
foreach ($variety->media as $key => $media) {
$variety->media[$key]['url'] = $media->getUrl();
}
return $variety->media;
}
public static function deleteImage($id, $index)
{
$variety = self::get($id);
$variety->getMedia();
$ret = $variety->media[$index]->delete();
return "1";
}
}

View File

@@ -51,4 +51,13 @@ class Articles
return Article::destroy($id);
}
public static function deleteImage($id, $index)
{
$article = self::get($id);
$article->getMedia();
$ret = $article->media[$index]->delete();
return "1";
}
}

View File

@@ -12,7 +12,6 @@
}
$(document).on('click', settings.addBtn, function (event) {
$(appendArea).append(rowHtml);
if (settings.appendEffect === 'fade') {
@@ -25,31 +24,27 @@
$(settings.rowNumber).last().text(rowCounter);
if (settings.type) {
type = settings.type;
} else {
type = settings.rowSection;
}
type = (settings.type) ? settings.type : settings.rowSection;
$(type).each(function(rowIndex) {
$(this).find('input[name]').each(function(){
var name;
name = $(this).attr('name');
name = name.replace(/\[[0-9]?\]/g, '['+rowIndex+']');
$(this).find('input[name]').each(function() {
var name = $(this).attr('name');
name = name.replace(/\[[0-9]?\]$/, '['+rowIndex+']');
$(this).attr('name',name);
});
$(this).find('select[name]').each(function(){
var name;
name = $(this).attr('name');
name = name.replace(/\[[0-9]?\]/g, '['+rowIndex+']');
$(this).find('select[name]').each(function() {
var name = $(this).attr('name');
name = name.replace(/\[[0-9]?\]$/, '['+rowIndex+']');
$(this).attr('name',name);
});
$(this).find('textarea[name]').each(function(){
var name;
name = $(this).attr('name');
name = name.replace(/\[[0-9]?\]/g, '['+rowIndex+']');
$(this).find('textarea[name]').each(function() {
var name = $(this).attr('name');
name = name.replace(/\[[0-9]?\]$/, '['+rowIndex+']');
$(this).attr('name',name);
});
$(this).find('.appender').each(function() {
$(this).data('id',rowIndex);
});
});
rowCounter++;
@@ -61,14 +56,13 @@
});
if(settings.deleteBtn) {
if (settings.deleteBtn) {
$(document).on('click', settings.deleteBtn, function (e) {
$(e.target).closest(settings.rowSection).remove();
if (settings.callback) {
settings.callback();
}
})
}
};

View File

@@ -7,10 +7,8 @@
@section('content')
{{ Form::open(['route' => 'Botanic.Admin.Varieties.store', 'id' => 'form', 'autocomplete' => 'off', 'files' => true]) }}
<input type="hidden" name="id" value="{{ $id }}">
<input type="hidden" name="id" id="id" value="{{ $id }}">
@include('Botanic.Admin.Varieties.form')
</form>
@endsection

View File

@@ -11,7 +11,7 @@
</div>
<div class="col-6">
{{ Form::label('genre', 'Espèce') }}
@include('components.select', ['name' => 'specie_id', 'list' => $species, 'value' => isset($specie_id) ? $specie_id : null, 'required' => false])
@include('components.select', ['name' => 'specie_id', 'list' => $species, 'value' => isset($specie_id) ? $specie_id : null, 'class' => 'select2 form-control', 'required' => false])
</div>
</div>
@@ -24,7 +24,7 @@
</div>
<div class="col-md-4">
@include('components.uploader.widget', ['images' => $media])
@include('components.uploader.widget', ['delete_url' => route('Botanic.Admin.Varieties.deleteImage') ])
</div>
</div>

View File

@@ -1,13 +0,0 @@
<div class="col-md-12 col-lg-4 row-lot-photo m-top-8">
<button type="button" class="btn btn-danger delete-lot-photo-btn"><i class="fa fa-minus-circle"></i></button>
<div class="thumbnail">
<img src="/storage/{{ $photo['filepath'] }}/{{ $photo['uuid'] }}.{{ $photo['filetype'] }}" alt="...">
<div class="caption">
<h3>{{ $photo['title'] }}</h3>
<p>Poids : {{ $photo['filesize'] }}</p>
</div>
</div>
</div>

View File

@@ -1,15 +0,0 @@
<div class="col-md-12 col-lg-4 row-new-lot-photo row-lot-photo m-top-8">
<p>
<button type="button" class="btn btn-danger delete-new-lot-photo-btn"><i class="fa fa-minus-circle"></i></button>
Photo <span class="row-photo-number"></span>
</p>
<input name="lot_photos[][file]" type="file" class="file" data-show-upload="false" data-show-caption="true" data-msg-placeholder="Choisissez une photo">
<label>Titre</label>
<input name="lot_photos[][title]" type="text" class="form-control">
<label>Type de photo</label>
@include('components.select',['name' => 'lot_photos[][type_photo_id]' , 'list' => $type_photos])
</div>

View File

@@ -1,41 +0,0 @@
@if (isset($photos) && count($photos))
<table class="table table-striped table-hover va-middle" id="photos-table">
<thead>
<tr>
<th>Photo</th>
<th>Type</th>
<th>Titre</th>
<th>Poids</th>
<th style="min-width: 82px; max-width: 82px;"></th>
</tr>
</thead>
<tbody>
@foreach($photos as $photo)
<tr>
<td>
<img src="/storage/{{ $photo['filepath'] }}/{{ $photo['uuid'] }}.{{ $photo['filetype'] }}" width="64">
</td>
<td>
{{ $photo['type_photo']['nom'] }}
</td>
<td>
{{ $photo['title'] }}
</td>
<td>
{{ $photo['filesize'] }}
</td>
<td>
<!--
<a href="{{ route('Hestimmo.LotPhotos.edit', $photo['id']) }}" class="btn btn-sm btn-primary">
<span class="fa fa-eye"></span>
</a>
-->
<a href="{{ route('Hestimmo.LotPhotos.destroy', $photo['id']) }}" class="btn btn-sm btn-danger destroy">
<span class="fa fa-trash"></span>
</a>
</td>
</tr>
@endforeach
</tbody>
</table>
@endif

View File

@@ -1,69 +0,0 @@
<div class="col-12 row-new-price row-price">
<input type="hidden" name="prices[][id]" value="">
<div class="card card-light">
<div class="card-header">
<div class="row">
<div class="col-2">
{{ Form::label('tax_id', 'TVA') }}<br/>
@include('components.select', ['name' => 'prices[][tax_id]', 'value' => (isset($tax_id)) ? $tax_id : null, 'list' => isset($taxes) ? $taxes : null, 'required' => true, 'class' => 'form-control-sm'])
</div>
<div class="col-2">
{{ Form::label('price', 'Prix HT') }}
@include('components.money', ['name' => 'prices[][price}', 'value' => (isset($price)) ? $price : 0, 'required' => true, 'class' => 'form-control-sm'])
</div>
<div class="col-2">
{{ Form::label('price_taxed', 'Prix TTC') }}
@include('components.money', ['name' => 'prices[][price_taxed]', 'value' => (isset($price_ht)) ? $price_ht : 0, 'required' => true, 'class' => 'form-control-sm'])
</div>
<div class="col-2">
<br/>
<button class="btn btn-primary btn-xs add-new-attribute mt-1" href="#attributes" type="button">
Ajout d'un attribut
<i class="fas fa-plus"></i>
</button>
</div>
<div class="col-4 text-right">
<button type="button" class="btn btn-danger delete-new-price-btn mt-2" data-card-widget="collapse" data-toggle="tooltip" title="supprimer">
<i class="fa-2x fas fa-trash"></i>
</button>
</div>
</div>
</div>
<div class="d-none" id="attributes">
<div class="card-body">
<div id="append_attribute" class="row">
</div>
<div class="row row-new-attribute row-attribute">
<div class="col-xs-3 col-md-2">
{{ Form::label('quantity', 'Quantité') }}<br/>
@include('components.input', ['name' => 'prices[][quantity][]', 'value' => (isset($quantity)) ? $quantity : 1, 'required' => true, 'class' => 'form-control-sm'])
</div>
<div class="col-xs-4 col-md-4">
{{ Form::label('attribute_family_id', 'Attributs') }}<br/>
@include('components.select', ['name' => 'prices[][attribute_family_id][]', 'value' => (isset($attribute_value['attribute_family_id'])) ? $attribute_value['attribute_family_id'] : null, 'list' => $attribute_families, 'required' => true, 'class' => 'form-control-sm'])
</div>
<div class="col-xs-5 col-md-4">
{{ Form::label('attribute_value_id', 'Valeur') }}<br/>
@include('components.select', ['name' => 'prices[][attribute_value_id][]', 'value' => (isset($attribute_value['id'])) ? $attribute_value['id'] : null, 'list' => (isset($attribute_values)) ? $attribute_values : null, 'required' => true, 'class' => 'form-control-sm'])
</div>
</div>
</div>
</div>
</div>
</div>

View File

@@ -46,6 +46,6 @@
</div>
<div class="col-md-4">
@include('components.uploader.widget', ['images' => isset($media) ? $media : null])
@include('components.uploader.widget', ['delete_url' => route('Shop.Admin.Articles.deleteImage') ])
</div>
</div>

View File

@@ -1,15 +1,16 @@
@include('Shop.Admin.Articles.partials.block_price_new')
@include('Shop.Admin.Articles.partials.prices.block_price_new')
<div id="append_price" class="row">
@include('Shop.Admin.Articles.partials.list-prices')
@include('Shop.Admin.Articles.partials.prices.list-prices')
</div>
<button type="button" class="btn btn-primary add-new-price">Ajouter un tarif <i class="fa fa-plus"></i></button>
<button type="button" class="btn btn-sm btn-primary add-new-price">Ajouter un tarif <i class="fa fa-plus"></i></button>
@push('js')
<script>
function append_price() {
handle_append_attribute();
}
$("#append_price").appender({
@@ -28,18 +29,21 @@
function append_attribute() {
}
$("#append_attribute").appender({
rowSection: '.row-new-attribute',
type: '.row-attribute',
addBtn: '.add-new-attribute',
appendEffect: 'slide',
addClass: 'animated bounceInLeft',
rowNumber: '.row-attribute-number',
deleteBtn: '.delete-new-attribute-btn',
callback: append_attribute,
rowNumberStart: 2,
hideSection: true
});
function handle_append_attribute(selector) {
console.log('handle_append_attribute');
$("#append_attribute").appender({
rowSection: '.row-new-attribute',
type: '.row-attribute',
addBtn: '.add-new-attribute',
appendEffect: 'slide',
addClass: 'animated bounceInLeft',
rowNumber: '.row-attribute-number',
deleteBtn: '.delete-new-attribute-btn',
callback: append_attribute,
rowNumberStart: 2,
hideSection: true
});
}
</script>

View File

@@ -0,0 +1,4 @@
<div id="attributes" class="appender" data-id="">
@include('Shop.Admin.Articles.partials.prices.block_attribute_new')
<div id="append_attribute"></div>
</div>

View File

@@ -0,0 +1,15 @@
<div class="row row-new-attribute row-attribute">
<div class="col-xs-3 col-lg-2">
{{ Form::label('quantity', 'Quantité') }}<br/>
@include('components.input', ['name' => 'prices[][quantity][]', 'value' => (isset($quantity)) ? $quantity : 1, 'required' => true, 'class' => 'form-control-sm'])
</div>
<div class="col-xs-4 col-lg-4">
{{ Form::label('attribute_family_id', 'Attributs') }}<br/>
@include('components.select', ['name' => 'prices[][attribute_family_id][]', 'value' => (isset($attribute_value['attribute_family_id'])) ? $attribute_value['attribute_family_id'] : null, 'list' => $attribute_families, 'required' => true, 'class' => 'form-control form-control-sm'])
</div>
<div class="col-xs-5 col-lg-4">
{{ Form::label('attribute_value_id', 'Valeur') }}<br/>
@include('components.select', ['name' => 'prices[][attribute_value_id][]', 'value' => (isset($attribute_value['id'])) ? $attribute_value['id'] : null, 'list' => (isset($attribute_values)) ? $attribute_values : null, 'required' => true, 'class' => 'form-control form-control-sm'])
</div>
</div>

View File

@@ -0,0 +1,50 @@
<div class="col-12 row-new-price row-price">
<input type="hidden" name="prices[][id]" value="">
<div class="card card-light">
<div class="card-body pt-2">
<div class="row">
<div class="col-lg-2">
{{ Form::label('tax_id', 'TVA') }}<br/>
@include('components.select', ['name' => 'prices[][tax_id]', 'value' => (isset($tax_id)) ? $tax_id : null, 'list' => isset($taxes) ? $taxes : null, 'required' => true, 'class' => 'form-control form-control-sm'])
</div>
<div class="col-lg-2">
{{ Form::label('quantity', 'Quantité') }}<br/>
@include('components.number', ['name' => 'prices[][quantity}', 'value' => (isset($quantity)) ? $quantity : 1, 'required' => true, 'class' => 'form-control-sm'])
</div>
<div class="col-lg-2">
{{ Form::label('price', 'Prix HT') }}
@include('components.money', ['name' => 'prices[][price}', 'value' => (isset($price)) ? $price : 0, 'required' => true, 'class' => 'form-control-sm'])
</div>
<div class="col-lg-2">
{{ Form::label('price_taxed', 'Prix TTC') }}
@include('components.money', ['name' => 'prices[][price_taxed]', 'value' => (isset($price_ht)) ? $price_ht : 0, 'required' => true, 'class' => 'form-control-sm'])
</div>
<div class="col-lg-2">
<br/>
<button class="btn btn-primary btn-xs add-new-attribute mt-1" href="#attributes" type="button">
Ajout d'un attribut
<i class="fas fa-plus"></i>
</button>
</div>
<div class="col-lg-2 text-right">
<button type="button" class="btn btn-danger delete-new-price-btn mt-2" data-card-widget="collapse" data-toggle="tooltip" title="supprimer">
<i class="fa-2x fas fa-trash"></i>
</button>
</div>
</div>
@include('Shop.Admin.Articles.partials.prices.attributes')
</div>
</div>
</div>

View File

@@ -9,10 +9,6 @@
{{ include("Shop._partials.sections")}}
<div id="_mobile_cart"></div>
<div id="_mobile_seach_widget"></div>
<div id="_mobile_user_info"></div>
<div class="clearfix"></div>
</div>
</div>
</div>

View File

@@ -1,5 +1,5 @@
<div class="col row-image"></div>
TEST
<button type="button" class="btn btn-danger delete-image-btn"><i class="fa fa-minus-circle"></i></button>
<div class="thumbnail">

View File

@@ -1,5 +1,5 @@
<label>Titre</label>
<input name="images[][title]" type="text" class="form-control">
<label>Titre</label>
<input name="images[][title]" type="text" class="form-control">
<label>Type de photo</label>
@include('components.select',['name' => 'images[][type_image_id]' , 'list' => isset($type_images) ? $type_images : null])
<label>Type de photo</label>
@include('components.select',['name' => 'images[][type_image_id]' , 'list' => isset($type_images) ? $type_images : null])

View File

@@ -0,0 +1,18 @@
@foreach($images as $key => $image)
<figure class="mr-2">
<img src="{{ $image['url'] }}" class="img-thumbnail img-caption" style="max-height:92px;">
<figcaption class="text-center pt-2">
<button type="button" class="btn btn-xs btn-outline-secondary">
<i class="fas fa-expand-alt"></i>
</button>
<button type="button" class="btn btn-xs btn-outline-danger">
<i class="fas fa-trash" data-index="{{ $key }}"></i>
</button>
</figcaption>
</figure>
@endforeach
<script>
handleDeleteImages();
handleEnlargeImages();
</script>

View File

@@ -1,34 +1,48 @@
@if ($images)
<div class="row" id="uploader-mini-gallery">
@foreach($images as $image)
<figure class="mr-2">
<img src="{{ $image['url'] }}" class="img-thumbnail img-caption" style="max-height:92px;">
<figcaption class="text-center pt-2">
<button type="button" class="btn btn-xs btn-outline-secondary">
<i class="fas fa-expand-alt" data-id="{{ $image['id'] }}"></i>
</button>
<button type="button" class="btn btn-xs btn-outline-danger">
<i class="fas fa-trash" data-id="{{ $image['id'] }}"></i>
</button>
</figcaption>
</figure>
@endforeach
<div class="row" id="uploader-mini-gallery"></div>
<div class="modal fade" id="mini-gallery-lightbox" tabindex="-1" role="dialog" aria-labelledby="mini-gallery-lightbox" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="mini-gallery-title-lightbox"></h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
</div>
<div class="modal-body">
<img src="" id="mini-gallery-img-lightbox" class="img-fluid" >
</div>
</div>
</div>
@endif
</div>
@push('js')
<script>
$('#uploader-mini-gallery .fa-trash').click(function() {
id = $(this).data('id');
console.log(id);
$.ajax({
type: 'DELETE',
url: {{ route('Botanic.Admin.Varieties.deleteImage') }},
data: {id: id},
success: function(data) {
source = data;
}
});
})
function handleDeleteImages() {
$('#uploader-mini-gallery .fa-trash').click(function() {
id = $('#id').val();
index = $(this).data('index');
console.log(id);
$.ajax({
type: 'post',
url: "{{ $delete_url }}",
data: {
id: id,
index: index
},
success: function(data) {
loadImages();
}
});
})
}
function handleEnlargeImages() {
$('#uploader-mini-gallery .fa-expand-alt').click(function() {
$img = $(this).parents('figure').find('.img-thumbnail');
url = $img.attr('src');
console.log(url);
$('#mini-gallery-img-lightbox').attr('src', url);
$('#mini-gallery-lightbox').modal('show');
})
}
</script>
@endpush

View File

@@ -2,15 +2,20 @@
<div class="card-header">
<h3 class="card-title">Photos</h3>
<div class="card-tools">
<button type="button" class="btn btn-xs btn-primary add-image pull-right">Ajout <i class="fa fa-plus"></i></button>
</div>
</div>
<div class="card-body pb-0">
@include('components.uploader.mini-gallery', ['images' => $images])
<div class="card-body pt-3 pb-0">
@if (isset($id))
@include('components.uploader.mini-gallery')
@endif
<div id="uploader-new-images"></div>
@include('components.uploader.block_image_new', ['name' => 'images[]', 'required' => true])
</div>
<div class="card-footer">
<button type="button" class="btn btn-xs btn-primary add-image pull-right">Ajout <i class="fa fa-plus"></i></button>
</div>
</div>
@push('js')
@@ -30,5 +35,15 @@
callback: append_image,
hideSection: true
});
function loadImages()
{
$gallery = $("#uploader-mini-gallery");
if ($gallery) {
$gallery.load("{{ route('Botanic.Admin.Varieties.getImages', ['id' => (isset($id)) ? $id : false]) }}");
}
}
loadImages();
</script>
@endpush

View File

@@ -9,6 +9,7 @@ Route::prefix('Varieties')->name('Varieties.')->group(function () {
Route::post('store', 'VarietyController@store')->name('store');
Route::get('edit/{id}', 'VarietyController@edit')->name('edit');
Route::post('getSelect', 'VarietyController@getOptionsWithSpecie')->name('getSelect');
Route::delete('deleteImage', 'VarietyController@deleteImage')->name('deleteImage');
Route::post('deleteImage', 'VarietyController@deleteImage')->name('deleteImage');
Route::any('getImages/{id?}', 'VarietyController@getImages')->name('getImages');
});

View File

@@ -7,6 +7,8 @@ Route::prefix('Articles')->name('Articles.')->group(function () {
Route::post('update', 'ArticleController@update')->name('update');
Route::post('store', 'ArticleController@store')->name('store');
Route::get('edit/{id}', 'ArticleController@edit')->name('edit');
Route::any('getImages/{id?}', 'ArticleController@getImages')->name('getImages');
Route::post('deleteImage', 'ArticleController@deleteImage')->name('deleteImage');
});