jev/opensem
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

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

Browse Source
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
Download Patch File Download Diff File Expand all files Collapse all files

2
resources/views/components/uploader/block_image.blade.php
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">

8
resources/views/components/uploader/file-data.blade.php
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])

18
resources/views/components/uploader/mini-gallery-items.blade.php Normal file
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>

70
resources/views/components/uploader/mini-gallery.blade.php
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

21
resources/views/components/uploader/widget.blade.php
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