voy a empezar con los acabados de cubierta

This commit is contained in:
Jaime Jiménez
2025-08-06 08:33:37 +02:00
parent 3f89f323cf
commit a593a1af78
6 changed files with 137 additions and 82 deletions

View File

@ -33,8 +33,8 @@ class PresupuestoCliente {
solapasCubierta: 0,
tamanioSolapasCubierta: '80',
cubiertaCaras: 2,
papelGuardasId: 3,
gramajeGuardas: 170,
guardasPapelId: 3,
guardasGramaje: 170,
guardasImpresas: 0,
cabezada: 'WHI',
papelCubiertaId: 3,
@ -78,6 +78,11 @@ class PresupuestoCliente {
this.divGramajeCubierta = $("#div-gramaje-cubierta");
this.btn_plantilla_cubierta = $('#btn-plantilla-cubierta');
this.btn_impresion_cubierta_help = $('#impresion-cubierta-help');
this.carasImpresionCubierta = $('#impresion-cubierta');
this.tamanioSolapasCubierta = $('#tamanio-solapas-cubierta');
this.guardasCubierta = $('#papel-guardas');
this.guardasImpresas = $('#guardas-impresas');
this.cabezada = $('#cabezada');
}
init() {
@ -142,7 +147,7 @@ class PresupuestoCliente {
// Crear label
const label = document.createElement('label');
label.className = 'btn btn-outline-primary material-shadow gramaje-radio gramaje-interior';
label.className = 'btn btn-outline-primary material-shadow gramaje-radio ' + name;
label.setAttribute('for', id);
label.textContent = gramaje;
@ -192,7 +197,15 @@ class PresupuestoCliente {
#nextDatosGenerales() {
let data = this.#getPresupuestoData();
let data = this.#getDatosGeneralesData();
data = {
...data,
...{
papelInteriorId: this.formData.interior.papelInteriorId,
gramajeInterior: this.formData.interior.gramajeInterior,
tipoImpresion: this.formData.interior.tipoImpresion,
}
}
$.ajax({
url: '/presupuesto/public/validar/datos-generales',
@ -524,8 +537,14 @@ class PresupuestoCliente {
$('.max-solapa-text').text(function (_, textoActual) {
return textoActual.replace(/\d+/, maxSolapas);
});
$('.tapa-cubierta.selected').trigger('click');
this.#loadCubiertaData(data);
this.#changeTab('pills-cover');
const dataInterior = this.#getInteriorData();
this.#updateInteriorData(dataInterior);
this.#cacheFormData();
}
},
error: (xhr, status, error) => {
@ -562,8 +581,8 @@ class PresupuestoCliente {
const opcion = opciones_color[i];
const item = new imagen_presupuesto(opcion);
item.extraClass = 'interior-data opcion-color';
if ((this.formData.interior.color === '' && i === 0) ||
this.formData.interior.color === opcion.id) {
if ((this.formData.interior.tipoImpresion === '' && i === 0) ||
this.formData.interior.tipoImpresion === opcion.id) {
item.setSelected(true);
}
this.divOpcionesColor.append(item.render());
@ -574,7 +593,10 @@ class PresupuestoCliente {
const opcion = opciones_papel_interior[i];
const item = new imagen_presupuesto(opcion);
item.extraClass = 'interior-data papel-interior';
if( this.formData.interior.papelInteriorId == '' && i === 0 ||
this.formData.interior.papelInteriorId == opcion.extra_data["sk-id"]) {
item.setSelected(true);
}
this.divPapelInterior.append(item.render());
}
@ -668,8 +690,6 @@ class PresupuestoCliente {
$(document).on('click', '.tapa-cubierta', (e) => {
const prevTargetisTapaDura = !$('.tapa-dura-options').hasClass('d-none');
$('.tapa-dura-options').eq(0).removeClass('animate-fadeInUpBounce');
$('.tapa-blanda-options').eq(0).removeClass('animate-fadeInUpBounce');
@ -684,10 +704,7 @@ class PresupuestoCliente {
$('.tapa-dura-options').removeClass('d-none');
}
if (!(e.currentTarget.id !== 'tapaBlanda' && prevTargetisTapaDura)) {
this.#getPapelesCubierta(e.currentTarget.id);
}
this.#getPapelesCubierta(e.currentTarget.id);
});
$(document).on('click', '.solapas-cubierta', (e) => {
@ -729,6 +746,29 @@ class PresupuestoCliente {
console.error("Error al obtener los gramajes de interior: ", xhr.responseText);
});
});
$(document).on('change', '.datos-cubierta', (e) => {
const dataToStore = this.#getCubiertaData();
this.#updateCubiertaData(dataToStore);
this.#cacheFormData();
});
$('.btn-change-tab-cubierta').on('click', () => {
this.#changeTab('pills-inside');
/*const data = this.#getPresupuestoData();
$.ajax({
url: '/presupuesto/public/validar/cubierta',
type: 'POST',
data: data,
success: (data) => {
this.#changeTab('pills-inside');
},
error: (xhr, status, error) => {
console.error("Error al validar los datos de cubierta: ", xhr.responseText);
}
});*/
});
}
#getPapelesCubierta(tapa_id) {
@ -738,6 +778,7 @@ class PresupuestoCliente {
this.divGramajeCubierta.empty();
setTimeout(resolve, 250);
}).then(() => {
this.divPapelCubierta.removeClass('animate-fadeInUpBounce');
this.divGramajeCubierta.removeClass('animate-fadeInUpBounce');
@ -802,11 +843,11 @@ class PresupuestoCliente {
const tipoCubierta = $('.tapa-cubierta.selected').attr('id') || 'tapaBlanda';
const solapas = $('.solapas-cubierta.selected').id == 'sin-solapas' ? 0 : 1 || 0;
const tamanioSolapas = $('#tamanio-solapas-cubierta').val() || '80';
const cubiertaCaras = parseInt($('#cubierta-caras').val()) || 2;
const guardasPapel = parseInt($('#guardas-papel').val()) || 3;
const guardasGramaje = parseInt($('#guardas-gramaje').val()) || 170;
const guardasImpresas = parseInt($('#guardas-impresas').val()) || 0;
const cabezada = $('#cabezada').val() || 'WHI';
const cubiertaCaras = parseInt(this.carasImpresionCubierta.val()) || 2;
const guardasPapelId = parseInt($('#papel-guardas option:selected').data('papel-id')) || 3;
const guardasGramaje = parseInt($('#papel-guardas option:selected').data('gramaje')) || 170;
const guardasImpresas = parseInt(this.guardasImpresas) || 0;
const cabezada = this.cabezada.val() || 'WHI';
const papelCubiertaId = $('#div-papel-cubierta .image-container.selected').data('sk-id') || 3;
const gramajeCubierta = $('input[name="gramaje-cubierta"]:checked').data('gramaje') || 240;
@ -815,7 +856,7 @@ class PresupuestoCliente {
solapas: solapas,
tamanioSolapas: tamanioSolapas,
cubiertaCaras: cubiertaCaras,
guardasPapel: guardasPapel,
guardasPapelId: guardasPapelId,
guardasGramaje: guardasGramaje,
guardasImpresas: guardasImpresas,
cabezada: cabezada,
@ -830,7 +871,7 @@ class PresupuestoCliente {
this.formData.cubierta.solapas = data.solapas;
this.formData.cubierta.tamanioSolapas = data.tamanioSolapas;
this.formData.cubierta.cubiertaCaras = data.cubiertaCaras;
this.formData.cubierta.guardasPapel = data.guardasPapel;
this.formData.cubierta.guardasPapelId = data.guardasPapelId;
this.formData.cubierta.guardasGramaje = data.guardasGramaje;
this.formData.cubierta.guardasImpresas = data.guardasImpresas;
this.formData.cubierta.cabezada = data.cabezada;
@ -856,6 +897,44 @@ class PresupuestoCliente {
this.divGramajeCubierta.find('input[type="radio"]').first().prop('checked', true);
}
}
#loadCubiertaData() {
$('.tapa-cubierta').removeClass('selected');
$(`#${this.formData.cubierta.tipoCubierta}`).addClass('selected');
if (this.formData.cubierta.tipoCubierta === 'tapaBlanda') {
$('.tapa-blanda-options').removeClass('d-none');
$('.tapa-dura-options').addClass('d-none');
}
else {
$('.tapa-dura-options').removeClass('d-none');
$('.tapa-blanda-options').addClass('d-none');
$('#papel-guardas option[data-papel-id="' +
this.formData.cubierta.guardasPapelId + '"][data-gramaje="' +
this.formData.cubierta.guardasGramaje + '"]').prop('selected', true).trigger('change');
this.guardasImpresas.val(this.formData.cubierta.guardasImpresas);
this.cabezada.val(this.formData.cubierta.cabezada);
}
$(`#${this.formData.cubierta.tipoCubierta}`).trigger('click');
if (this.formData.cubierta.solapas === 0) {
$('.solapas-cubierta#sin-solapas').addClass('selected');
this.divSolapasCubierta.addClass('d-none');
}
else {
$('.solapas-cubierta').removeClass('selected');
$(`.solapas-cubierta#con-solapas`).addClass('selected');
this.divSolapasCubierta.removeClass('d-none');
this.carasImpresionCubierta.val(this.formData.cubierta.cubiertaCaras);
this.tamanioSolapasCubierta.val(this.formData.cubierta.tamanioSolapas);
}
this.carasImpresionCubierta.val(this.formData.cubierta.cubiertaCaras);
}
/******************************
* END CUBIERTA
******************************/

View File

@ -77,7 +77,7 @@
<label for="impresion-cubierta" class="form-label"
th:text="#{presupuesto.impresion-cubierta}">Impresión de cubierta</label>
<div class="input-group input-group-sm">
<select class="form-select select2" id="impresion-cubierta">
<select class="form-select select2 datos-cubierta" id="impresion-cubierta">
<option value="2" th:text="#{presupuesto.una-cara}">Una cara</option>
<option value="4" th:text="#{presupuesto.dos-caras}">Dos caras</option>
</select>
@ -93,7 +93,7 @@
<div id="div-solapas-cubierta" class="d-none">
<label for="tamanio-solapas-cubierta" class="form-label"
th:text="#{presupuesto.tamanio-solapa}">Tamaño solapa</label>
<input type="number" class="form-control form-control-sm solapas-presupuesto"
<input type="number" class="form-control form-control-sm solapas-presupuesto datos-cubierta"
id="tamanio-solapas-cubierta" min="60" max="120" value="80" step="1">
<div class="form-text">
<p class="mb-0">min: 60 mm</p>
@ -113,7 +113,7 @@
<div class="col-auto mb-3">
<label for="papel-guardas" class="form-label" th:text="#{presupuesto.papel-guardas}">Papel de
guardas</label>
<select class="form-select select2" id="papel-guardas">
<select class="form-select select2 datos-cubierta" id="papel-guardas">
<optgroup th:label="#{presupuesto.offset}">
<option value="1" data-papel-id="3" data-gramaje="170"
th:text="#{presupuesto.offset-blanco} + ' 170 gr'" selected>Offset blanco 170 gr
@ -130,7 +130,7 @@
<div class="col-auto mb-3">
<label for="guardas-impresas" class="form-label" th:text="#{presupuesto.guardas-impresas}">Guardas
impresas</label>
<select class="form-select select2" id="guardas-impresas">
<select class="form-select select2 datos-cubierta" id="guardas-impresas">
<option value="0" th:text="#{presupuesto.no}" selected>No</option>
<option value="4" th:text="#{presupuesto.una-cara}">Una cara</option>
<option value="8" th:text="#{presupuesto.dos-caras}">Dos caras</option>
@ -138,7 +138,7 @@
</div>
<div class="col-auto mb-3">
<label for="cabezada" class="form-label" th:text="#{presupuesto.cabezada}">Cabezada</label>
<select class="form-select select2" id="guardas-impresas">
<select class="form-select select2 datos-cubierta" id="cabezada">
<option value="WHI" th:text="#{presupuesto.cabezada-blanca}" selected>Blanca</option>
<option value="GRE" th:text="#{presupuesto.cabezada-verde}">Verde</option>
<option value="BLUE" th:text="#{presupuesto.cabezada-azul}">Azul</option>
@ -217,11 +217,11 @@
<!-- End Ribbon Shape -->
<div class="d-flex justify-content-between align-items-center mt-4 w-100">
<button type="button" class="btn btn-light d-flex align-items-center">
<button id="btn-prev-cubierta" type="button" class="btn btn-light d-flex align-items-center btn-change-tab-cubierta">
<i class=" ri-arrow-left-circle-line label-icon align-middle fs-16 me-2"></i>
<span th:text="#{presupuesto.volver-interior}">Volver a interior</span>
</button>
<button type="button" class="btn btn-primary d-flex align-items-center">
<button id="btn-next-cubierta" type="button" class="btn btn-primary d-flex align-items-center btn-change-tab-cubierta">
<span th:text="#{presupuesto.continuar-extras-libro}">Continuar a extras del libro</span>
<i class="ri-arrow-right-circle-line fs-16 ms-2"></i>
</button>