trbajando en los custom checks

This commit is contained in:
2024-10-05 19:17:52 +02:00
parent 13e3a69cd6
commit cece606bb1
25 changed files with 1801 additions and 80 deletions

View File

@ -3,48 +3,306 @@ import ClassSelect from '../../components/select2.js';
class DatosGenerales {
constructor(domItem) {
constructor(domItem, wizardForm, validatorStepper) {
this.domItem = domItem;
this.formatoLibro = new ClassSelect($("#papelFormatoId"), '/papel-formato/menuitems', window.translations["formatoLibro"]);
this.wizardStep = wizardForm.querySelector('#datos-generales');
this.validatorStepper = validatorStepper;
this.formatoLibro = new ClassSelect($("#papelFormatoId"), '/papel-formato/menuitems', window.translations["formatoLibro"]);
this.cliente = new ClassSelect($("#clienteId"), '/clientes/cliente/menuitems', window.translations["selectCliente"]);
this.titulo = this.domItem.find("#titulo");
this.checkFormatoPersonalizado = this.domItem.find("#papelFormatoPersonalizado");
this.formatoPersonalizado = this.domItem.find("#formatoPersonalizado");
this.anchoPersonalizado = this.domItem.find("#papelFormatoAncho");
this.altoPersonalizado = this.domItem.find("#papelFormatoAlto");
this.tiposLibro = this.domItem.find(".tipo-libro");
this.paginas = this.domItem.find("#paginas");
this.paginasNegro = this.domItem.find("#paginasNegro");
this.paginasColor = this.domItem.find("#paginasColor");
this.divPaginasColorConsecutivas = this.domItem.find("#divPaginasColorConsecutivas");
this.pagColorConsecutivas = this.domItem.find("#pagColorConsecutivas");
this.divPapelDiferente = this.domItem.find("#divPapelDiferente");
this.papelDiferente = this.domItem.find("#papelDiferente");
this.divPosPaginasColor = this.domItem.find("#divPosPaginasColor");
this.posPaginasColor = this.domItem.find("#posPaginasColor");
this.initValidation();
}
init() {
// Selects
this.formatoLibro.init();
this.cliente.init();
// Eventos
this.checkFormatoPersonalizado.bind('change', this.#handleFormatoLibro.bind(this));
this.tiposLibro.on('click', this.#handleTipolibro.bind(this));
this.tiposLibro.on('click', this.#handleTipolibro.bind(this));
this.domItem.find('.input-paginas').on('change', this.#handlePaginas.bind(this));
this.anchoPersonalizado.on('blur', this.#handleCheckFormatoPersonalizado.bind(this));
this.altoPersonalizado.on('blur', this.#handleCheckFormatoPersonalizado.bind(this));
this.pagColorConsecutivas.on('change', this.#handPaginasConsecutivas.bind(this));
this.papelDiferente.on('change', this.#handlePapelDiferente.bind(this));
this.titulo.on('change', () => { $(".titulo").html(this.titulo.val()); });
this.papelDiferente.on('change', () => { $(".titulo").html(this.titulo.val()); });
}
initValidation() {
const stepper = this.validatorStepper;
this.formValidation = FormValidation.formValidation(this.wizardStep, {
fields: {
titulo: {
validators: {
notEmpty: {
message: window.translations["validation"].requerido_short
},
}
},
cliente_id: {
validators: {
callback: {
message: window.translations["validation"].cliente,
callback: function (input) {
// Get the selected options
const options = $("#clienteId").select2('data');
const hasValidOption = options.some(option => parseInt(option.id) > 0);
return options !== null && options.length > 0 && hasValidOption;
},
}
}
},
tirada: {
validators: {
callback: {
message: window.translations["validation"].integer_greatherThan_0,
callback: function (input) {
const value = $("#tirada").val();
return value.length > 0 && Number.isInteger(parseInt(value)) && parseInt(value) > 0;
},
}
}
},
tirada2: {
validators: {
callback: {
message: window.translations["validation"].integer_greatherThan_0,
callback: function (input) {
let field = $("#tirada2");
field.val(field.val().replace(/[^0-9]/g, ''));
let value = field.value;
if (value == '')
return true;
return value.length > 0 && Number.isInteger(parseInt(value)) && parseInt(value) > 0;
},
}
}
},
tirada3: {
validators: {
callback: {
message: window.translations["validation"].integer_greatherThan_0,
callback: function (input) {
let field = $("#tirada3");
field.val(field.val().replace(/[^0-9]/g, ''));
let value = field.value;
if (value == '')
return true;
return value.length > 0 && Number.isInteger(parseInt(value)) && parseInt(value) > 0;
},
}
}
},
tirada4: {
validators: {
callback: {
message: window.translations["validation"].integer_greatherThan_0,
callback: function (input) {
let field = $("#tirada4");
field.val(field.val().replace(/[^0-9]/g, ''));
let value = field.value;
if (value == '')
return true;
return value.length > 0 && Number.isInteger(parseInt(value)) && parseInt(value) > 0;
},
}
}
},
papel_formato_id: {
validators: {
callback: {
message: window.translations["validation"].papelFormato,
callback: function (input) {
// Get the selected options
const options = $("#clienteId").select2('data');
const hasValidOption = options.some(option => parseInt(option.id) > 0);
const custom_format = $("#papelFormatoPersonalizado").is(":checked");
if (custom_format)
return true;
return options !== null && options.length > 0 && hasValidOption;
},
}
}
},
papel_formato_ancho: {
validators: {
callback: {
message: window.translations["validation"].integer_greatherThan_0,
callback: function (input) {
// Get the selected options
const custom_format = $("#papelFormatoPersonalizado").is(":checked");
if (!custom_format)
return true;
const value = $("#papelFormatoAncho").val();
return value.length > 0 && Number.isInteger(parseInt(value)) && parseInt(value) > 0;
},
}
}
},
papel_formato_alto: {
validators: {
callback: {
message: window.translations["validation"].integer_greatherThan_0,
callback: function (input) {
// Get the selected options
const custom_format = $("#papelFormatoPersonalizado").is(":checked");
if (!custom_format)
return true;
const value = $("#papelFormatoAlto").val();
return value.length > 0 && Number.isInteger(parseInt(value)) && parseInt(value) > 0;
},
}
}
},
paginasColor: {
validators: {
callback: {
message: window.translations["validation"].integer_greatherThan_0,
callback: function (input) {
// Get the selected options
const value = $("#paginasColor").val();
return value.length >= 0 && Number.isInteger(parseInt(value)) && parseInt(value) >= 0;
},
}
}
},
paginasNegro: {
validators: {
callback: {
message: window.translations["validation"].integer_greatherThan_0,
callback: function (input) {
// Get the selected options
const value = $("#paginasNegro").val();
return value.length >= 0 && Number.isInteger(parseInt(value)) && parseInt(value) >= 0;
},
}
}
},
paginas: {
validators: {
callback: {
message: window.translations["validation"].integer_greatherThan_0,
callback: function (input) {
// Get the selected options
const value = $("#paginas").val();
return value.length > 0 && Number.isInteger(parseInt(value)) && parseInt(value) > 0;
},
}
}
},
div_tipo_libro: {
validators: {
callback: {
callback: function (input) {
const divTipoLibro = $('#divTipoLibro'); // Selecciona el div
divTipoLibro.find('.fv-plugins-message-container').remove();
if ($('.tipo-libro.selected').length > 0) {
return true;
}
else {
divTipoLibro.append(`
<div class="fv-plugins-message-container invalid-feedback">
<div data-field="div_tipo_libro" data-validator="callback" style="margin-top: 50px;">
${window.translations["validation"].tipo_libro}
</div>
</div>
`);
}
return false;
},
}
}
}
},
plugins: {
trigger: new FormValidation.plugins.Trigger(),
bootstrap5: new FormValidation.plugins.Bootstrap5({
// Use this for enabling/changing valid/invalid class
// eleInvalidClass: '',
eleValidClass: '',
rowSelector: function (field, ele) {
// field is the field name
// ele is the field element
switch (field) {
case 'div_tipo_libro':
return '.col-sm-10';
case 'titulo':
return '.col-sm-8';
case 'cliente_id':
return '.col-sm-5';
case 'papel_formato_id':
return '.col-sm-4';
case 'papel_formato_ancho':
case 'papel_formato_ancho':
return '.col-sm-3';
case 'tirada':
case 'tirada2':
case 'tirada3':
case 'tirada4':
return '.col-sm-2';
default:
return '.col-sm-3';
}
}
}),
autoFocus: new FormValidation.plugins.AutoFocus(),
submitButton: new FormValidation.plugins.SubmitButton()
}
}).on('core.form.valid', () => {
stepper.next();
});
}
#handleFormatoLibro() {
if(this.checkFormatoPersonalizado.is(':checked')) {
if (this.checkFormatoPersonalizado.is(':checked')) {
this.formatoLibro.hide();
this.formatoPersonalizado.show();
this.formValidation.revalidateField('papel_formato_id');
}
else{
else {
this.formatoLibro.show();
this.formatoPersonalizado.hide();
this.formValidation.revalidateField('papel_formato_ancho');
this.formValidation.revalidateField('papel_formato_alto');
}
}
#handleTipolibro(event) {
// Accede al ID del elemento que disparó el evento
const element = $(event.target);
let containers = element.closest('.tipo-libro').parent().find('.tipo-libro');
for (let container of containers) {
if (container != element.closest('.tipo-libro')[0]) {
@ -58,7 +316,7 @@ class DatosGenerales {
}
#handlePaginas() {
let paginasNegro = this.paginasNegro.val();
let paginasColor = this.paginasColor.val();
@ -72,16 +330,16 @@ class DatosGenerales {
let totalPaginas = parseInt(paginasNegro) + parseInt(paginasColor);
this.paginas.val(totalPaginas);
let tipos = [this.domItem.find('#fresado'), this.domItem.find('#cosido')];
if (totalPaginas < 32){
let tipos = [this.domItem.find('#fresado'), this.domItem.find('#cosido')];
if (totalPaginas < 32) {
for (let tipo of tipos) {
tipo.removeClass('selected');
tipo.find('.image-presupuesto').removeClass('selected');
tipo.hide();
}
}
else{
else {
for (let tipo of tipos) {
tipo.show();
}
@ -92,9 +350,90 @@ class DatosGenerales {
this.domItem.find('#grapado').find('.image-presupuesto').removeClass('selected');
this.domItem.find('#grapado').hide();
}
else{
else {
this.domItem.find('#grapado').show();
}
this.formValidation.revalidateField('paginas');
// Se configura dependiento si hay color o no
if (paginasColor == 0) {
this.#handleInteriorLayout('negro');
this.divPaginasColorConsecutivas.addClass('d-none');
this.divPosPaginasColor.addClass('d-none');
this.posPaginasColor.val("");
this.pagColorConsecutivas.prop('checked', false);
}
else {
if(this.papelDiferente.is(":checked"))
this.#handleInteriorLayout('mixto');
else
this.#handleInteriorLayout('color');
this.divPaginasColorConsecutivas.removeClass('d-none');
this.divPosPaginasColor.removeClass('d-none');
}
}
#handPaginasConsecutivas() {
if (this.pagColorConsecutivas.is(':checked')) {
this.divPapelDiferente.removeClass('d-none');
}
else {
this.divPapelDiferente.addClass('d-none');
this.papelDiferente.prop('checked', false);
}
}
#handlePapelDiferente() {
if (this.papelDiferente.is(':checked')){
$(".interior-color").removeClass('d-none');
this.#handleInteriorLayout('mixto');
}
else {
$(".interior-color").addClass('d-none');
$("#divGramajeInteriorColor").addClass('d-none');
$(".papel-interior").removeClass('selected');
$(".gramaje-interior").prop('checked', false);
$(".gramaje-interior-color").prop('checked', false);
this.#handlePaginas();
}
}
#handleInteriorLayout(layout) {
switch (layout) {
case 'negro':
case 'mixto':
$('#negroEstandar').removeClass('d-none');
$('#negroPremium').removeClass('d-none');
$('#colorEstandar').addClass('d-none');
$('#colorPremium').addClass('d-none');
break;
case 'color':
$('#negroEstandar').addClass('d-none');
$('#negroPremium').addClass('d-none');
$('#colorEstandar').removeClass('d-none');
$('#colorPremium').removeClass('d-none');
break;
default:
break;
}
}
#handleCheckFormatoPersonalizado() {
const minAncho = this.anchoPersonalizado.min;
const minAlto = this.altoPersonalizado.min;
if (this.anchoPersonalizado.val() < minAncho || this.anchoPersonalizado.val() == '' || isNaN(this.anchoPersonalizado.val())) {
this.anchoPersonalizado.val(minAncho);
}
if (this.altoPersonalizado.val() < minAlto || this.altoPersonalizado.val() == '' || isNaN(this.altoPersonalizado.val())) {
this.altoPersonalizado.val(minAlto);
}
}
}

View File

@ -0,0 +1,562 @@
class DisenioInterior {
constructor(domItem, wizardForm, validatorStepper) {
this.domItem = domItem;
this.wizardStep = wizardForm.querySelector('#interior-libro');
this.validatorStepper = validatorStepper;
this.disenioInterior = this.domItem.find(".disenio-interior");
this.papelInterior = this.domItem.find(".papel-interior");
this.negroEstandar = this.domItem.find("#negroEstandar");
this.negroPremium = this.domItem.find("#negroPremium");
this.colorEstandar = this.domItem.find("#colorEstandar");
this.colorPremium = this.domItem.find("#colorPremium");
this.offsetBlanco = this.domItem.find("#offsetBlanco");
this.offsetAhuesado = this.domItem.find("#offsetAhuesado");
this.offsetAhuesadoVolumen = this.domItem.find("#offsetAhuesadoVolumen");
this.estucadoMate = this.domItem.find("#estucadoMate");
this.gramaje70 = this.domItem.find("#interiorGramaje70");
this.gramaje80 = this.domItem.find("#interiorGramaje80");
this.gramaje90 = this.domItem.find("#interiorGramaje90");
this.gramaje100 = this.domItem.find("#interiorGramaje100");
this.gramaje115 = this.domItem.find("#interiorGramaje115");
this.gramaje120 = this.domItem.find("#interiorGramaje120");
this.gramaje135 = this.domItem.find("#interiorGramaje135");
this.gramaje150 = this.domItem.find("#interiorGramaje150");
this.gramaje170 = this.domItem.find("#interiorGramaje170");
this.disenioInterior_color = this.domItem.find(".disenio-interior-color");
this.papelInterior_color = this.domItem.find(".papel-interior-color");
this.colorEstandar_color = this.domItem.find("#colorEstandarColor");
this.colorPremium_color = this.domItem.find("#colorPremiumColor");
this.offsetBlanco_color = this.domItem.find("#offsetBlancoColor");
this.offsetAhuesado_color = this.domItem.find("#offsetAhuesadoColor");
this.offsetAhuesadoVolumen_color = this.domItem.find("#offsetAhuesadoVolumenColor");
this.estucadoMate_color = this.domItem.find("#estucadoMateColor");
this.gramaje70_color = this.domItem.find("#interiorGramaje70Color");
this.gramaje80_color = this.domItem.find("#interiorGramaje80Color");
this.gramaje90_color = this.domItem.find("#interiorGramaje90Color");
this.gramaje100_color = this.domItem.find("#interiorGramaje100Color");
this.gramaje115_color = this.domItem.find("#interiorGramaje115Color");
this.gramaje120_color = this.domItem.find("#interiorGramaje120Color");
this.gramaje135_color = this.domItem.find("#interiorGramaje135Color");
this.gramaje150_color = this.domItem.find("#interiorGramaje150Color");
this.gramaje170_color = this.domItem.find("#interiorGramaje170Color");
this.initValidation();
// Creamos un nuevo observador que detecta cambios en los atributos
this.observer = new MutationObserver(mutations => {
mutations.forEach(mutation => {
if (mutation.type === 'attributes' && mutation.attributeName === 'class') {
const targetElement = mutation.target;
if (targetElement.id.includes("Color"))
this.#handleUpdateGramajeColor();
else
this.#handleUpdateGramaje();
}
});
});
}
init() {
// Eventos
this.disenioInterior.on('click', this.#handleDisenioInterior.bind(this));
this.papelInterior.on('click', this.#handlePapelInterior.bind(this));
this.disenioInterior_color.on('click', this.#handleDisenioInterior.bind(this));
this.papelInterior_color.on('click', this.#handlePapelInterior.bind(this));
// Observadores
this.observer.observe(this.negroEstandar[0], { attributes: true });
this.observer.observe(this.negroPremium[0], { attributes: true });
this.observer.observe(this.colorEstandar[0], { attributes: true });
this.observer.observe(this.colorPremium[0], { attributes: true });
this.observer.observe(this.offsetBlanco[0], { attributes: true });
this.observer.observe(this.offsetAhuesado[0], { attributes: true });
this.observer.observe(this.offsetAhuesadoVolumen[0], { attributes: true });
this.observer.observe(this.estucadoMate[0], { attributes: true });
this.observer.observe(this.colorEstandar_color[0], { attributes: true });
this.observer.observe(this.colorPremium_color[0], { attributes: true });
this.observer.observe(this.offsetBlanco_color[0], { attributes: true });
this.observer.observe(this.offsetAhuesado_color[0], { attributes: true });
this.observer.observe(this.offsetAhuesadoVolumen_color[0], { attributes: true });
this.observer.observe(this.estucadoMate_color[0], { attributes: true });
}
initValidation() {
const stepper = this.validatorStepper;
this.formValidation = FormValidation.formValidation(this.wizardStep, {
fields: {
div_impresion_interior: {
validators: {
callback: {
callback: function (input) {
const divImpresionInterior = $('#divImpresionInterior'); // Selecciona el div
divImpresionInterior.find('.fv-plugins-message-container').remove();
if ($('.disenio-interior.selected').length > 0) {
return true;
}
else {
divImpresionInterior.append(`
<div class="fv-plugins-message-container invalid-feedback">
<div data-field="div_impresion_interior" data-validator="callback" style="margin-top: 50px;">
${window.translations["validation"].disenio_interior}
</div>
</div>
`);
}
return false;
},
}
}
},
div_papel_interior: {
validators: {
callback: {
callback: function (input) {
const divPapelInterior = $('#divPapelInterior'); // Selecciona el div
divPapelInterior.find('.fv-plugins-message-container').remove();
if ($('.papel-interior.selected').length > 0) {
return true;
}
else {
divPapelInterior.append(`
<div class="fv-plugins-message-container invalid-feedback">
<div data-field="div_impresion_interior" data-validator="callback" style="margin-top: 50px;">
${window.translations["validation"].papel_interior}
</div>
</div>
`);
}
return false;
},
}
}
},
div_gramaje_interior: {
validators: {
callback: {
callback: function (input) {
const divGramajeInterior = $('#divGramajeInterior'); // Selecciona el div
if ($("#divGramajeInterior").hasClass("d-none")) return true;
divGramajeInterior.find('.fv-plugins-message-container').remove();
if ($('.check-interior-gramaje:checked').length > 0) {
return true;
}
else {
divGramajeInterior.append(`
<div class="fv-plugins-message-container invalid-feedback">
<div data-field="div_impresion_interior" data-validator="callback" style="margin-top: 50px;">
${window.translations["validation"].gramaje_interior}
</div>
</div>
`);
}
return false;
},
}
}
},
div_impresion_interior_color: {
validators: {
callback: {
callback: function (input) {
const divImpresionInterior = $('#divImpresionInteriorColor'); // Selecciona el div
if (divImpresionInterior.hasClass("d-none")) return true;
divImpresionInterior.find('.fv-plugins-message-container').remove();
if ($('.disenio-interior-color.selected').length > 0) {
return true;
}
else {
divImpresionInterior.append(`
<div class="fv-plugins-message-container invalid-feedback">
<div data-field="div_impresion_interior_color" data-validator="callback" style="margin-top: 50px;">
${window.translations["validation"].disenio_interior}
</div>
</div>
`);
}
return false;
},
}
}
},
div_papel_interior_color: {
validators: {
callback: {
callback: function (input) {
const divPapelInterior = $('#divPapelInteriorColor'); // Selecciona el div
if (divPapelInterior.hasClass("d-none")) return true;
divPapelInterior.find('.fv-plugins-message-container').remove();
if ($('.papel-interior.selected').length > 0) {
return true;
}
else {
divPapelInterior.append(`
<div class="fv-plugins-message-container invalid-feedback">
<div data-field="div_impresion_interior" data-validator="callback" style="margin-top: 50px;">
${window.translations["validation"].papel_interior}
</div>
</div>
`);
}
return false;
},
}
}
},
div_gramaje_interior_color: {
validators: {
callback: {
callback: function (input) {
const divGramajeInterior = $('#divGramajeInteriorColor'); // Selecciona el div
if ($("#divGramajeInterior").hasClass("d-none")) return true;
divGramajeInterior.find('.fv-plugins-message-container').remove();
if ($('.check-interior-gramaje:checked').length > 0) {
return true;
}
else {
divGramajeInterior.append(`
<div class="fv-plugins-message-container invalid-feedback">
<div data-field="div_impresion_interior" data-validator="callback" style="margin-top: 50px;">
${window.translations["validation"].gramaje_interior}
</div>
</div>
`);
}
return false;
},
}
}
},
},
plugins: {
trigger: new FormValidation.plugins.Trigger(),
bootstrap5: new FormValidation.plugins.Bootstrap5({
// Use this for enabling/changing valid/invalid class
// eleInvalidClass: '',
eleValidClass: '',
rowSelector: function (field, ele) {
// field is the field name
// ele is the field element
switch (field) {
case 'div_impresion_interior':
case 'div_papel_interior':
case 'div_gramaje_interior':
case 'div_impresion_interior_color':
case 'div_papel_interior_color':
case 'div_gramaje_interior_color':
return '.col-sm-10';
default:
return '.col-sm-3';
}
}
}),
autoFocus: new FormValidation.plugins.AutoFocus(),
submitButton: new FormValidation.plugins.SubmitButton()
}
}).on('core.form.valid', () => {
stepper.next();
});
}
#handleDisenioInterior(event) {
// Accede al ID del elemento que disparó el evento
const element = $(event.target);
let class2Find = '.disenio-interior';
if (element[0].closest('.image-container').id.includes('Color'))
class2Find = '.disenio-interior-color';
let containers = element.closest(class2Find).parent().find(class2Find);
for (let container of containers) {
if (container != element.closest(class2Find)[0]) {
$(container).removeClass('selected');
$(container).find('.image-presupuesto').removeClass('selected');
}
}
element.closest(class2Find).toggleClass('selected');
element.closest('.image-presupuesto').toggleClass('selected');
}
#handlePapelInterior(event) {
// Accede al ID del elemento que disparó el evento
const element = $(event.target);
let class2Find = '.papel-interior';
if (element[0].closest('.image-container').id.includes('Color'))
class2Find = '.papel-interior-color';
let containers = element.closest(class2Find).parent().find(class2Find);
for (let container of containers) {
if (container != element.closest(class2Find)[0]) {
$(container).removeClass('selected');
$(container).find('.image-presupuesto').removeClass('selected');
}
}
element.closest(class2Find).toggleClass('selected');
element.closest('.image-presupuesto').toggleClass('selected');
}
#handleUpdateGramaje() {
let showGramaje = false;
$(".check-interior-gramaje ").prop("checked", false);
if (this.negroEstandar.hasClass("selected") || this.colorEstandar.hasClass("selected")) {
if (this.offsetBlanco.hasClass("selected")) {
this.gramaje70.addClass("d-none");
this.gramaje80.removeClass("d-none");
this.gramaje90.removeClass("d-none");
this.gramaje100.addClass("d-none");
this.gramaje115.addClass("d-none");
this.gramaje120.removeClass("d-none");
this.gramaje135.addClass("d-none");
this.gramaje150.addClass("d-none");
this.gramaje170.addClass("d-none");
showGramaje = true;
}
else if (this.offsetAhuesado.hasClass("selected")) {
this.gramaje70.addClass("d-none");
this.gramaje80.removeClass("d-none");
this.gramaje90.removeClass("d-none");
this.gramaje100.addClass("d-none");
this.gramaje115.addClass("d-none");
this.gramaje120.addClass("d-none");
this.gramaje135.addClass("d-none");
this.gramaje150.addClass("d-none");
this.gramaje170.addClass("d-none");
showGramaje = true;
}
else if (this.offsetAhuesadoVolumen.hasClass("selected")) {
this.gramaje70.removeClass("d-none");
this.gramaje80.addClass("d-none");
this.gramaje90.addClass("d-none");
this.gramaje100.addClass("d-none");
this.gramaje115.addClass("d-none");
this.gramaje120.addClass("d-none");
this.gramaje135.addClass("d-none");
this.gramaje150.addClass("d-none");
this.gramaje170.addClass("d-none");
showGramaje = true;
}
else if (this.estucadoMate.hasClass("selected")) {
this.gramaje70.addClass("d-none");
this.gramaje80.addClass("d-none");
this.gramaje90.removeClass("d-none");
this.gramaje100.addClass("d-none");
this.gramaje115.addClass("d-none");
this.gramaje120.removeClass("d-none");
this.gramaje135.addClass("d-none");
this.gramaje150.addClass("d-none");
this.gramaje170.addClass("d-none");
showGramaje = true;
}
}
else if (this.negroPremium.hasClass("selected") || this.colorPremium.hasClass("selected")) {
if (this.offsetBlanco.hasClass("selected")) {
this.gramaje70.addClass("d-none");
this.gramaje80.removeClass("d-none");
this.gramaje90.removeClass("d-none");
this.gramaje100.removeClass("d-none");
this.gramaje115.addClass("d-none");
this.gramaje120.addClass("d-none");
this.gramaje135.addClass("d-none");
this.gramaje150.removeClass("d-none");
this.gramaje170.removeClass("d-none");
showGramaje = true;
}
else if (this.offsetAhuesado.hasClass("selected")) {
this.gramaje70.addClass("d-none");
this.gramaje80.removeClass("d-none");
this.gramaje90.removeClass("d-none");
this.gramaje100.removeClass("d-none");
this.gramaje115.addClass("d-none");
this.gramaje120.addClass("d-none");
this.gramaje135.addClass("d-none");
this.gramaje150.addClass("d-none");
this.gramaje170.addClass("d-none");
showGramaje = true;
}
else if (this.offsetAhuesadoVolumen.hasClass("selected")) {
this.gramaje70.addClass("d-none");
this.gramaje80.addClass("d-none");
this.gramaje90.addClass("d-none");
this.gramaje100.addClass("d-none");
this.gramaje115.addClass("d-none");
this.gramaje120.addClass("d-none");
this.gramaje135.addClass("d-none");
this.gramaje150.addClass("d-none");
this.gramaje170.addClass("d-none");
showGramaje = true;
}
else if (this.estucadoMate.hasClass("selected")) {
this.gramaje70.addClass("d-none");
this.gramaje80.addClass("d-none");
this.gramaje90.removeClass("d-none");
this.gramaje100.addClass("d-none");
this.gramaje115.removeClass("d-none");
this.gramaje120.addClass("d-none");
this.gramaje135.removeClass("d-none");
this.gramaje150.removeClass("d-none");
this.gramaje170.removeClass("d-none");
showGramaje = true;
}
}
if ($("#divGramajeInterior").hasClass("d-none") && showGramaje) {
$("#divGramajeInterior").removeClass("d-none");
}
else if (!showGramaje) {
$("#divGramajeInterior").addClass("d-none");
}
}
#handleUpdateGramajeColor() {
let showGramaje = false;
$(".check-interior-color-gramaje ").prop("checked", false);
if (this.colorEstandar_color.hasClass("selected")) {
if (this.offsetBlanco_color.hasClass("selected")) {
this.gramaje70_color.addClass("d-none");
this.gramaje80_color.removeClass("d-none");
this.gramaje90_color.removeClass("d-none");
this.gramaje100_color.addClass("d-none");
this.gramaje115_color.addClass("d-none");
this.gramaje120_color.removeClass("d-none");
this.gramaje135_color.addClass("d-none");
this.gramaje150_color.addClass("d-none");
this.gramaje170_color.addClass("d-none");
showGramaje = true;
}
else if (this.offsetAhuesado_color.hasClass("selected")) {
this.gramaje70_color.addClass("d-none");
this.gramaje80_color.removeClass("d-none");
this.gramaje90_color.removeClass("d-none");
this.gramaje100_color.addClass("d-none");
this.gramaje115_color.addClass("d-none");
this.gramaje120_color.addClass("d-none");
this.gramaje135_color.addClass("d-none");
this.gramaje150_color.addClass("d-none");
this.gramaje170_color.addClass("d-none");
showGramaje = true;
}
else if (this.offsetAhuesadoVolumen_color.hasClass("selected")) {
this.gramaje70_color.removeClass("d-none");
this.gramaje80_color.addClass("d-none");
this.gramaje90_color.addClass("d-none");
this.gramaje100_color.addClass("d-none");
this.gramaje115_color.addClass("d-none");
this.gramaje120_color.addClass("d-none");
this.gramaje135_color.addClass("d-none");
this.gramaje150_color.addClass("d-none");
this.gramaje170_color.addClass("d-none");
showGramaje = true;
}
else if (this.estucadoMate_color.hasClass("selected")) {
this.gramaje70_color.addClass("d-none");
this.gramaje80_color.addClass("d-none");
this.gramaje90_color.removeClass("d-none");
this.gramaje100_color.addClass("d-none");
this.gramaje115_color.addClass("d-none");
this.gramaje120_color.removeClass("d-none");
this.gramaje135_color.addClass("d-none");
this.gramaje150_color.addClass("d-none");
this.gramaje170_color.addClass("d-none");
showGramaje = true;
}
}
else if (this.colorPremium_color.hasClass("selected")) {
if (this.offsetBlanco_color.hasClass("selected")) {
this.gramaje70_color.addClass("d-none");
this.gramaje80_color.removeClass("d-none");
this.gramaje90_color.removeClass("d-none");
this.gramaje100_color.removeClass("d-none");
this.gramaje115_color.addClass("d-none");
this.gramaje120_color.addClass("d-none");
this.gramaje135_color.addClass("d-none");
this.gramaje150_color.removeClass("d-none");
this.gramaje170_color.removeClass("d-none");
showGramaje = true;
}
else if (this.offsetAhuesado_color.hasClass("selected")) {
this.gramaje70_color.addClass("d-none");
this.gramaje80_color.removeClass("d-none");
this.gramaje90_color.removeClass("d-none");
this.gramaje100_color.removeClass("d-none");
this.gramaje115_color.addClass("d-none");
this.gramaje120_color.addClass("d-none");
this.gramaje135_color.addClass("d-none");
this.gramaje150_color.addClass("d-none");
this.gramaje170_color.addClass("d-none");
showGramaje = true;
}
else if (this.offsetAhuesadoVolumen_color.hasClass("selected")) {
this.gramaje70_color.addClass("d-none");
this.gramaje80_color.addClass("d-none");
this.gramaje90_color.addClass("d-none");
this.gramaje100_color.addClass("d-none");
this.gramaje115_color.addClass("d-none");
this.gramaje120_color.addClass("d-none");
this.gramaje135_color.addClass("d-none");
this.gramaje150_color.addClass("d-none");
this.gramaje170_color.addClass("d-none");
showGramaje = true;
}
else if (this.estucadoMate_color.hasClass("selected")) {
this.gramaje70_color.addClass("d-none");
this.gramaje80_color.addClass("d-none");
this.gramaje90_color.removeClass("d-none");
this.gramaje100_color.addClass("d-none");
this.gramaje115_color.removeClass("d-none");
this.gramaje120_color.addClass("d-none");
this.gramaje135_color.removeClass("d-none");
this.gramaje150_color.removeClass("d-none");
this.gramaje170_color.removeClass("d-none");
showGramaje = true;
}
}
if ($("#divGramajeInteriorColor").hasClass("d-none") && showGramaje) {
$("#divGramajeInteriorColor").removeClass("d-none");
}
else if (!showGramaje) {
$("#divGramajeInteriorColor").addClass("d-none");
}
}
}
export default DisenioInterior;

View File

@ -1,26 +1,160 @@
import DatosGenerales from './datosGenerales.js';
import DisenioInterior from './disenioInterior.js';
import Ajax from '../../components/ajax.js';
class PresupuestoCliente {
function initPresupuesto(response){
constructor() {
this.clientePresupuestoWizard = document.querySelector('#wizard-presupuesto-cliente');
window.translations = JSON.parse(response);
this.validationStepper = new Stepper(this.clientePresupuestoWizard, {
linear: true
});
let datosGenerales = new DatosGenerales($("#datos-generales"));
datosGenerales.init();
this.btnNext = $('#btnNext');
this.btnPrev = $('#btnPrev');
this.btnPrint = $('#btnPrint');
this.btnSave = $('#btnSave');
this.btnConfirm = $('#btnConfirm');
this.datosGenerales = new DatosGenerales($("#datos-generales"), this.clientePresupuestoWizard, this.validationStepper);
this.disenioInterior = new DisenioInterior($("#interior-libro"), this.clientePresupuestoWizard, this.validationStepper);
}
init() {
this.btnNext.on('click', this.#nextStep.bind(this));
this.btnPrev.on('click', this.#prevtStep.bind(this));
// Fuerza el foco en el campo de búsqueda de select2
$(document).on('select2:open', () => {
document.querySelector('.select2-search__field').focus();
});
this.validationStepper._element.addEventListener('shown.bs-stepper', this.buttonsHandler.bind(this));
this.datosGenerales.init();
this.disenioInterior.init();
this.RELLENAR_PRESUPUESTO();
}
RELLENAR_PRESUPUESTO() {
$("#titulo").val("Titulo del libro");
const clienteId = $("#clienteId");
const newOption = new Option("Cliente 1", "1", true, true);
clienteId.append(newOption).trigger('change');
const papelFormatoId = $("#papelFormatoId");
const newOption2 = new Option("Formato 1", "1", true, true);
papelFormatoId.append(newOption2).trigger('change');
$("#paginasColor").val("5");
$("#paginasColor").trigger('change');
$("#fresado").trigger("click");
$("#colorEstandar").trigger("click");
$("#offsetBlanco").trigger("click");
$("#gramaje80").prop("checked", true);
$("#gramaje80").trigger("change");
}
buttonsHandler() {
switch (this.validationStepper._currentIndex + 1) {
case 0:
this.btnPrev.addClass('d-none');
this.btnNext.removeClass('d-none');
this.btnPrint.addClass('d-none');
this.btnSave.addClass('d-none');
this.btnConfirm.addClass('d-none');
break;
case 1:
this.btnPrev.removeClass('d-none');
this.btnNext.removeClass('d-none');
this.btnPrint.addClass('d-none');
this.btnSave.addClass('d-none');
this.btnConfirm.addClass('d-none');
break;
}
}
#nextStep() {
switch (this.validationStepper._currentIndex) {
case 0:
this.datosGenerales.formValidation.validate();
break;
case 1:
this.disenioInterior.formValidation.validate();
break;
/*
case 2:
FormValidation4.validate();
break;
case 3:
FormValidation5.validate();
break;
*/
default:
break;
}
}
#prevtStep() {
switch (this.validationStepper._currentIndex) {
case 4:
validationStepper.previous();
break;
case 3:
validationStepper.previous();
break;
case 2:
validationStepper.previous();
break;
case 1:
this.validationStepper.previous();
break;
default:
break;
}
}
}
function initialize(translations) {
window.translations = JSON.parse(translations);
let presupuestoCliente = new PresupuestoCliente();
presupuestoCliente.init();
}
document.addEventListener('DOMContentLoaded', function() {
document.addEventListener('DOMContentLoaded', function () {
const locale = document.querySelector('meta[name="locale"]').getAttribute('content');
new Ajax('/translate/getTranslation', {locale: locale, translationFile: 'Presupuestos'}, {},
initPresupuesto,
function(error){
new Ajax('/translate/getTranslation', { locale: locale, translationFile: 'Presupuestos' }, {},
initialize,
function (error) {
console.log("Error getting translations:", error);
}
).post();
});