Orden de js y FIX: cambio a estado avisos

This commit is contained in:
2020-05-31 13:31:23 -04:00
parent 84e6808883
commit 2d2eccb600
9 changed files with 435 additions and 363 deletions

View File

@ -34,64 +34,84 @@
@push('scripts')
<script type="text/javascript">
var loaded = {
todo: false,
@foreach ($segmentos as $segmento)
var productos = {
id: '#productos',
current_hash: '',
loaded: {
todo: false,
@foreach ($segmentos as $segmento)
'{{mb_strtolower($segmento->titulo)}}': false,
@endforeach
}
function loadSegmento(segmento) {
if (loaded[segmento]) {
return
}
var name = segmento
if (name.indexOf(' ') > -1) {
name = name.replaceAll(' ', '_')
}
var url = '{{$urls->base}}/productos/segmento/' + name
$(".tab[data-tab='" + segmento + "']").find('.grid').html('')
loaded[segmento] = true
$.getJSON(url, (data) => {
$(".tab[data-tab='" + segmento + "']").find('.grid').append(
$('<div></div>').attr('class', 'ui active centered inline loader')
)
if (data.productos.length == 0) {
$(".tab[data-tab='" + segmento + "']").find('.grid').html('No hay productos en este segmento.')
@endforeach
},
loadSegmento: (segmento) => {
if (productos.loaded[segmento]) {
return
}
$.each(data.productos, (i, el) => {
getProducto(segmento, el)
})
})
}
function getProducto(segmento, id_producto) {
var url = '{{$urls->base}}/producto/' + id_producto + '/ficha'
$.ajax({
url: url,
success: (data) => {
if ($(".tab[data-tab='" + segmento + "']").find('.grid').find('.loader').length > 0) {
$(".tab[data-tab='" + segmento + "']").find('.grid').html('')
}
$(".tab[data-tab='" + segmento + "']").find('.grid').append(
$('<div></div>').attr('class', 'column').append(data)
)
var name = segmento
if (name.indexOf(' ') > -1) {
name = name.replaceAll(' ', '_')
}
})
}
$(document).ready(() => {
loadSegmento('todo')
$('#productos').find('.tabular.menu .item').tab({
onFirstLoad: (tabPath, parameterArray, historyEvent) => {
if (tabPath == 'todo') {
var url = '{{$urls->base}}/productos/segmento/' + name
$(".tab[data-tab='" + segmento + "']").find('.grid').html('')
productos.loaded[segmento] = true
$.getJSON(url, (data) => {
$(".tab[data-tab='" + segmento + "']").find('.grid').append(
$('<div></div>').attr('class', 'ui active centered inline loader')
)
if (data.productos.length == 0) {
$(".tab[data-tab='" + segmento + "']").find('.grid').html('No hay productos en este segmento.')
return
}
loadSegmento(tabPath)
$.each(data.productos, (i, el) => {
productos.getProducto(segmento, el)
})
})
},
getProducto: (segmento, id_producto) => {
var url = '{{$urls->base}}/producto/' + id_producto + '/ficha'
$.ajax({
url: url,
success: (data) => {
if ($(".tab[data-tab='" + segmento + "']").find('.grid').find('.loader').length > 0) {
$(".tab[data-tab='" + segmento + "']").find('.grid').html('')
}
$(".tab[data-tab='" + segmento + "']").find('.grid').append(
$('<div></div>').attr('class', 'column').append(data)
)
}
})
},
setup: () => {
productos.loadSegmento('todo')
$(productos.id).find('.tabular.menu .item').tab({
onFirstLoad: (tabPath, parameterArray, historyEvent) => {
if (tabPath == 'todo') {
return
}
productos.loadSegmento(tabPath)
}
})
$('#productos_menu').find('.menu .item').click(function() {
productos.getHash($(this).attr('href').split('#')[1])
})
if (window.location.hash) {
productos.getHash(window.location.hash)
}
})
if (window.location.hash) {
var start = (window.location.hash).replace('#', '').replace('%20', ' ')
$('#productos').find('.tabular.menu .item').tab('change tab', start)
},
getHash: (hash) => {
if (typeof hash == 'undefined') {
hash = window.location.hash
}
var start = (hash).replace('#', '').replace('%20', ' ')
if (productos.current_hash == start) {
return
}
productos.current_hash = start
$(productos.id).find('.tabular.menu .item').tab('change tab', start)
}
}
$(document).ready(() => {
productos.setup()
})
</script>
@endpush

View File

@ -30,15 +30,38 @@
@push('scripts')
<script type="text/javascript">
function changePrice(min, max) {
var buscar = {
min: 1000,
max: 30000,
changePrice: (min, max) => {
$("input[name='precio']").val(min + '-' + max)
formatter = new Intl.NumberFormat('de-DE')
$('.price_label').html(formatter.format(min) + ' - ' + formatter.format(max) + ' UF')
},
setup: () => {
buscar.changePrice(buscar.min, buscar.max)
$('#precio').slider({
min: buscar.min,
max: buscar.max,
start: buscar.min,
end: buscar.max,
step: 500,
onChange: (range, min, max) => {
buscar.changePrice(min, max)
}
})
}
}
/*function changePrice(min, max) {
$("input[name='precio']").val(min + '-' + max)
formatter = new Intl.NumberFormat('de-DE')
$('.price_label').html(formatter.format(min) + ' - ' + formatter.format(max) + ' UF')
}
var gMin = 1000
var gMax = 30000
var gMax = 30000*/
$(document).ready(() => {
changePrice(gMin, gMax)
buscar.setup()
/*changePrice(gMin, gMax)
$('#precio').slider({
min: gMin,
max: gMax,
@ -48,7 +71,7 @@
onChange: (range, min, max) => {
changePrice(min, max)
}
})
})*/
})
</script>
@endpush

View File

@ -20,49 +20,47 @@
@push('scripts')
<script type="text/javascript">
var images = [
@foreach ($producto->imagenes() as $image)
'{{$urls->images}}/{{mb_strtolower($producto->nombre)}}/{{$image}}',
@endforeach
]
function populateThumbs(current) {
var thumbs = $('#thumbnails')
thumbs.html('')
$.each(images, (i, el) => {
if (i == current) {
return
}
thumbs.append(
$('<div></div>').attr('class', 'three wide column').append(
$('<div></div>').attr('class', 'ui image').attr('data-id', i).append(
$('<img />').attr('src', el)
var galeria = {
images: [
@foreach ($producto->imagenes() as $image)
'{{$urls->images}}/{{mb_strtolower($producto->nombre)}}/{{$image}}',
@endforeach
],
populateThumbs: (current) => {
var thumbs = $('#thumbnails')
thumbs.html('')
$.each(galeria.images, (i, el) => {
if (i == current) {
return
}
thumbs.append(
$('<div></div>').attr('class', 'three wide column').append(
$('<div></div>').attr('class', 'ui image').attr('data-id', i).append(
$('<img />').attr('src', el)
)
)
)
)
})
$('#galeria').find('.grid .image').click(function(e) {
var id = $(this).attr('data-id')
changeImage(id)
})
}
function changeImage(id) {
var big = $('#galeria>.image')
big.find('img').attr('src', images[id])
big.attr('data-id', id)
populateThumbs(id)
}
$(document).ready(() => {
$('#galeria').find('.grid .image').click(function(e) {
var id = $(this).attr('data-id')
changeImage(id)
/*var big = $('#galeria>.image')
var big_id = big.attr('data-id')
})
$('#galeria').find('.grid .image').click(function(e) {
var id = $(this).attr('data-id')
galeria.changeImage(id)
})
},
changeImage: (id) => {
var big = $('#galeria>.image')
big.find('img').attr('src', images[id])
big.attr('data-id', id)
$(this).find('img').attr('src', images[big_id])
$(this).attr('data-id', big_id)
populateThumbs(id)*/
})
galeria.populateThumbs(id)
},
setup: () => {
$('#galeria').find('.grid .image').click(function(e) {
var id = $(this).attr('data-id')
galeria.changeImage(id)
})
}
}
$(document).ready(() => {
galeria.setup()
})
</script>
@endpush