diff --git a/httpdocs/assets/js/safekat/pages/presupuestoCliente/disenioInterior.js b/httpdocs/assets/js/safekat/pages/presupuestoCliente/disenioInterior.js index 93bdaedb..b9a42fc6 100644 --- a/httpdocs/assets/js/safekat/pages/presupuestoCliente/disenioInterior.js +++ b/httpdocs/assets/js/safekat/pages/presupuestoCliente/disenioInterior.js @@ -50,6 +50,8 @@ class DisenioInterior { this.gramaje150_color = this.domItem.find("#interiorGramaje150Color"); this.gramaje170_color = this.domItem.find("#interiorGramaje170Color"); + this.checksGramaje = $('.custom-option .form-check-input'); + this.initValidation(); // Creamos un nuevo observador que detecta cambios en los atributos @@ -69,6 +71,8 @@ class DisenioInterior { init() { + const self = this; + // Eventos this.disenioInterior.on('click', this.#handleDisenioInterior.bind(this)); this.papelInterior.on('click', this.#handlePapelInterior.bind(this)); @@ -91,6 +95,18 @@ class DisenioInterior { this.observer.observe(this.offsetAhuesadoVolumen_color[0], { attributes: true }); this.observer.observe(this.estucadoMate_color[0], { attributes: true }); + this.checksGramaje.each(function () { + + const customOptionEL = $(this); + // Update custom options check on page load + //self.#handleClickGramaje(customOptionEL); + + // Update custom options check on click + customOptionEL.on('click', function () { + self.#handleClickGramaje(customOptionEL); + }); + }); + } initValidation() { @@ -279,6 +295,25 @@ class DisenioInterior { } + #handleClickGramaje(customOption) { + + const el = customOption[0]; + + if (el.checked) { + // If custom option element is radio, remove checked from the siblings (closest `.row`) + if (el.type === 'radio') { + const customRadioOptionList = [].slice.call(el.closest('.row').querySelectorAll('.custom-option')) + customRadioOptionList.map(function (customRadioOptionEL) { + customRadioOptionEL.closest('.custom-option').classList.remove('checked') + }) + } + el.closest('.custom-option').classList.add('checked') + } else { + el.closest('.custom-option').classList.remove('checked') + } + } + + #handleDisenioInterior(event) { // Accede al ID del elemento que disparó el evento const element = $(event.target); @@ -319,12 +354,12 @@ class DisenioInterior { element.closest(class2Find).toggleClass('selected'); element.closest('.image-presupuesto').toggleClass('selected'); - if($('#fresado').hasClass('selected')) { - if(this.estucadoMate.hasClass('selected') || this.estucadoMate_color.hasClass('selected')) { + if ($('#fresado').hasClass('selected')) { + if (this.estucadoMate.hasClass('selected') || this.estucadoMate_color.hasClass('selected')) { $('#tapaDuraLomoRedondo').addClass('d-none'); $('#tapaDura').removeClass('d-none'); } - else{ + else { $('#tapaDuraLomoRedondo').removeClass('d-none'); $('#tapaDura').addClass('d-none'); } diff --git a/httpdocs/assets/js/safekat/pages/presupuestoCliente/presupuestoCliente.js b/httpdocs/assets/js/safekat/pages/presupuestoCliente/presupuestoCliente.js index 3efb6fa3..583aa934 100644 --- a/httpdocs/assets/js/safekat/pages/presupuestoCliente/presupuestoCliente.js +++ b/httpdocs/assets/js/safekat/pages/presupuestoCliente/presupuestoCliente.js @@ -63,12 +63,13 @@ class PresupuestoCliente { $("#fresado").trigger("click"); + $("#colorEstandar").trigger("click"); - $("#offsetBlanco").trigger("click"); - $("#gramaje80").prop("checked", true); - $("#gramaje80").trigger("change"); - - + $("#offsetBlanco").trigger("click"); + + setTimeout(function() { + $("#gramaje80").trigger("click"); + }, 0); }