mirror of
https://git.imnavajas.es/jjimenez/erp-imprimelibros.git
synced 2026-01-19 07:10:21 +00:00
trabajando en la pestaña cubierta
This commit is contained in:
Jaime Jiménez
@ -37,8 +37,8 @@ presupuesto.encuadernacion-descripcion=Seleccione la encuadernación del libro
|
||||
presupuesto.continuar-interior=Continuar a diseño interior
|
||||
|
||||
# Pestaña interior de presupuesto
|
||||
presupuesto.tipo-impresion=Tipo de impresión
|
||||
presupuesto.tipo-impresion-descripcion=Seleccione entre calidad estándar o premium
|
||||
presupuesto.tipo-encuadernacion=Tipo de impresión
|
||||
presupuesto.tipo-encuadernacion-descripcion=Seleccione entre calidad estándar o premium
|
||||
presupuesto.papel-interior=Papel interior
|
||||
presupuesto.papel-interior-descripcion=Seleccione el papel para el interior
|
||||
presupuesto.gramaje-interior=Gramaje interior
|
||||
@ -80,6 +80,7 @@ presupuesto.cabezada-roja-amarilla=Roja-Amarilla
|
||||
presupuesto.papel-cubierta=Papel cubierta
|
||||
presupuesto.papel-cubierta-descripcion=Seleccione el papel para la cubierta
|
||||
presupuesto.cartulina-grafica-cubierta=Cartulina gráfica estucada a una cara
|
||||
presupuesto.estucado-mate-cubierta=Estucado mate
|
||||
presupuesto.gramaje-cubierta=Gramaje cubierta
|
||||
presupuesto.gramaje-cubierta-descripcion=Seleccione el gramaje para la cubierta
|
||||
presupuesto.volver-interior=Volver a diseño interior
|
||||
@ -95,8 +96,15 @@ presupuesto.errores.paginasNegro.required=El número de páginas en negro es obl
|
||||
presupuesto.errores.paginasNegro.par=El número de páginas en negro debe ser par
|
||||
presupuesto.errores.paginasColor.required=El número de páginas en color es obligatorio
|
||||
presupuesto.errores.paginasColor.par=El número de páginas en color debe ser par
|
||||
presupuesto.errores.tipo-impresion=Seleccione el tipo de libro
|
||||
presupuesto.errores.tipo-encuadernacion=Seleccione el tipo de libro
|
||||
presupuesto.errores.ancho=El ancho no puede estar vacío
|
||||
presupuesto.errores.ancho.min_max=El ancho tiene que estar en el rango [{0}, {1}] mm;
|
||||
presupuesto.errores.alto=El alto no puede estar vacío
|
||||
presupuesto.errores.alto.min_max=El alto tiene que estar en el rango [{0}, {1}] mm
|
||||
presupuesto.errores.alto.min_max=El alto tiene que estar en el rango [{0}, {1}] mm
|
||||
presupuesto.errores.tipo-impresion=Seleccione el tipo de impresion
|
||||
presupuesto.errores.papel-interior=Seleccione el tipo de papel para el interior
|
||||
presupuesto.errores.gramaje-interior=Seleccione el gramaje del papel para el interior
|
||||
presupuesto.errores.tipo-cubierta=Seleccione el tipo de cubierta
|
||||
presupuesto.errores.solapas-cubierta=Seleccione si desea o no solapas en la cubierta
|
||||
presupuesto.errores.papel-cubierta=Seleccione el tipo de papel para la cubierta
|
||||
presupuesto.errores.gramaje-cubierta=Seleccione el gramaje del papel para la cubierta
|
||||
@ -7,14 +7,14 @@ class imagen_presupuesto {
|
||||
this.group = data.group || ""; // Grupo al que pertenece el radio
|
||||
this.texto = data.texto || ""; // Texto de la etiqueta
|
||||
this.selected = data.selected || false;
|
||||
this.extraClass = data.extraClass + " " || "";
|
||||
this.extraClass = (data.extraClass && !(data.extraClass===undefined))? (data.extraClass + ' ') : '';
|
||||
this.extraData = data.extra_data || {}; // Datos extra opcionales
|
||||
}
|
||||
|
||||
render() {
|
||||
const contenedor = $('<div>', {
|
||||
id: this.id,
|
||||
class: `${this.extraClass}image-container imagen-selector${this.selected ? ' selected' : ''}`
|
||||
class: `${this.extraClass + ' '}image-container imagen-selector${this.selected ? ' selected' : ''}`
|
||||
});
|
||||
// Añadir atributos extra al contenedor
|
||||
for (const [key, value] of Object.entries(this.extraData)) {
|
||||
|
||||
@ -15,8 +15,6 @@ $('.imagen-container-group').on('click', '.image-container', function () {
|
||||
void img[0].offsetWidth; // Forzar reflow
|
||||
img.addClass('zoom-anim');
|
||||
|
||||
// Guardar selección en hidden
|
||||
$('#tipoEncuadernacionSeleccionada').val(clicked.attr('id'));
|
||||
|
||||
clicked.find('input[type="radio"]').prop('checked', true).trigger('change');
|
||||
});
|
||||
|
||||
@ -21,14 +21,25 @@ class PresupuestoCliente {
|
||||
paginasNegro: '',
|
||||
paginasColor: '',
|
||||
posicionPaginasColor: '',
|
||||
tipoImpresion: 'fresado',
|
||||
tipoEncuadernacion: 'fresado',
|
||||
},
|
||||
interior: {
|
||||
color: '',
|
||||
papel: '',
|
||||
gramaje: '',
|
||||
},/*
|
||||
cubierta: {},*/
|
||||
tipoImpresion: 'negro',
|
||||
papelInteriorId: 3,
|
||||
gramajeInterior: 9,
|
||||
},
|
||||
cubierta: {
|
||||
tipoCubierta: 'tapaBlanda',
|
||||
solapasCubierta: 0,
|
||||
tamanioSolapasCubierta: '80',
|
||||
cubiertaCaras: 2,
|
||||
papelGuardasId: 3,
|
||||
gramajeGuardas: 170,
|
||||
guardasImpresas: 0,
|
||||
cabezada: 'WHI',
|
||||
papelCubiertaId: 3,
|
||||
gramajeCubierta: 170,
|
||||
}
|
||||
}
|
||||
|
||||
// pestaña datos generales
|
||||
@ -58,16 +69,21 @@ class PresupuestoCliente {
|
||||
this.divContentInterior = $('#content-interior');
|
||||
this.divOpcionesColor = $('#div-opciones-color');
|
||||
this.divPapelInterior = $('#div-papel-interior');
|
||||
this.divGramajeInterior = $("#div-gramaje-interior");
|
||||
this.interior_alert = $('#interior-alert');
|
||||
|
||||
// pestaña cubierta
|
||||
this.divSolapasCubierta = $('#div-solapas-cubierta');
|
||||
this.divPapelCubierta = $('#div-papel-cubierta');
|
||||
this.divGramajeCubierta = $("#div-gramaje-cubierta");
|
||||
this.btn_plantilla_cubierta = $('#btn-plantilla-cubierta');
|
||||
this.btn_impresion_cubierta_help = $('#impresion-cubierta-help');
|
||||
|
||||
}
|
||||
|
||||
init() {
|
||||
|
||||
this.#initDatosGenerales();
|
||||
this.#initInterior();
|
||||
this.#initCubierta();
|
||||
|
||||
const stored = sessionStorage.getItem("formData");
|
||||
@ -89,6 +105,36 @@ class PresupuestoCliente {
|
||||
}
|
||||
}
|
||||
|
||||
#getPresupuestoData() {
|
||||
return {
|
||||
...this.#getDatosGeneralesData(),
|
||||
...this.#getInteriorData(),
|
||||
...this.#getCubiertaData()
|
||||
};
|
||||
}
|
||||
|
||||
#addGramaje(contenedor, gramaje, name) {
|
||||
const id = `gramaje-${gramaje}`;
|
||||
|
||||
// Crear input
|
||||
const input = document.createElement('input');
|
||||
input.type = 'radio';
|
||||
input.className = 'btn-check';
|
||||
input.dataset.gramaje = gramaje;
|
||||
input.id = id;
|
||||
input.name = name;
|
||||
|
||||
// Crear label
|
||||
const label = document.createElement('label');
|
||||
label.className = 'btn btn-outline-primary material-shadow gramaje-radio';
|
||||
label.setAttribute('for', id);
|
||||
label.textContent = gramaje;
|
||||
|
||||
// Añadir al contenedor
|
||||
contenedor.append(input);
|
||||
contenedor.append(label);
|
||||
}
|
||||
|
||||
/******************************
|
||||
* END OF DATOS GENERALES
|
||||
******************************/
|
||||
@ -109,7 +155,7 @@ class PresupuestoCliente {
|
||||
else {
|
||||
this.divPosicionPaginasColor.removeClass('d-none');
|
||||
}
|
||||
this.#updateTipoImpresion();
|
||||
this.#updateTipoEncuadernacion();
|
||||
});
|
||||
|
||||
this.formatoPersonalizado.on('change', () => {
|
||||
@ -130,10 +176,10 @@ class PresupuestoCliente {
|
||||
|
||||
#nextDatosGenerales() {
|
||||
|
||||
const data = this.#getDatosGeneralesData();
|
||||
let data = this.#getPresupuestoData();
|
||||
|
||||
$.ajax({
|
||||
url: '/presupuesto/validar/datos-generales',
|
||||
url: '/presupuesto/public/validar/datos-generales',
|
||||
type: 'POST',
|
||||
data: data,
|
||||
success: (data) => {
|
||||
@ -166,6 +212,9 @@ class PresupuestoCliente {
|
||||
|
||||
this.#loadInteriorData(data);
|
||||
|
||||
const interiorData = this.#getInteriorData();
|
||||
this.#updateInteriorData(interiorData);
|
||||
|
||||
this.#changeTab('pills-inside');
|
||||
|
||||
this.divContentInterior.addClass('animate-fadeInUpBounce');
|
||||
@ -189,7 +238,7 @@ class PresupuestoCliente {
|
||||
paginasNegro: this.paginasNegro.val(),
|
||||
paginasColor: this.paginasColor.val(),
|
||||
posicionPaginasColor: this.posicionPaginasColor.val(),
|
||||
tipoImpresion: ($('.tipo-libro.selected').length > 0) ? $('.tipo-libro.selected').attr('id') : 'fresado',
|
||||
tipoEncuadernacion: ($('.tipo-libro.selected').length > 0) ? $('.tipo-libro.selected').attr('id') : 'fresado',
|
||||
};
|
||||
}
|
||||
|
||||
@ -209,7 +258,7 @@ class PresupuestoCliente {
|
||||
paginasNegro: data.paginasNegro,
|
||||
paginasColor: data.paginasColor,
|
||||
posicionPaginasColor: data.posicionPaginasColor,
|
||||
tipoImpresion: data.tipoImpresion,
|
||||
tipoEncuadernacion: data.tipoEncuadernacion,
|
||||
};
|
||||
}
|
||||
|
||||
@ -222,18 +271,18 @@ class PresupuestoCliente {
|
||||
this.tirada2.val(this.formData.datosGenerales.tirada2);
|
||||
this.tirada3.val(this.formData.datosGenerales.tirada3);
|
||||
this.tirada4.val(this.formData.datosGenerales.tirada4);
|
||||
|
||||
|
||||
this.paginasNegro.val(this.formData.datosGenerales.paginasNegro);
|
||||
this.paginasColor.val(this.formData.datosGenerales.paginasColor);
|
||||
|
||||
this.posicionPaginasColor.val(this.formData.datosGenerales.posicionPaginasColor);
|
||||
|
||||
$('.tipo-libro').removeClass('selected');
|
||||
$('.image-container#' + this.formData.datosGenerales.tipoImpresion).trigger('click');
|
||||
this.#updateTipoImpresion();
|
||||
$('.image-container#' + this.formData.datosGenerales.tipoEncuadernacion).trigger('click');
|
||||
this.#updateTipoEncuadernacion();
|
||||
|
||||
this.formatoPersonalizado.prop('checked', this.formData.datosGenerales.formatoPersonalizado).trigger('change');
|
||||
|
||||
|
||||
$('.paginas').trigger('change');
|
||||
|
||||
if (this.formatoPersonalizado.is(':checked')) {
|
||||
@ -270,7 +319,7 @@ class PresupuestoCliente {
|
||||
}
|
||||
}
|
||||
|
||||
#updateTipoImpresion() {
|
||||
#updateTipoEncuadernacion() {
|
||||
|
||||
const paginas = parseInt(this.paginas.val());
|
||||
const selectedTipo = $('.tipo-libro.selected').attr('id');
|
||||
@ -280,13 +329,24 @@ class PresupuestoCliente {
|
||||
$('.tipo-libro#fresado').addClass('d-none');
|
||||
$('.tipo-libro#cosido').addClass('d-none');
|
||||
}
|
||||
else {
|
||||
$('.tipo-libro#fresado').removeClass('d-none');
|
||||
$('.tipo-libro#cosido').removeClass('d-none');
|
||||
}
|
||||
if (paginas < 20) {
|
||||
$('.tipo-libro#espiral').addClass('d-none');
|
||||
$('.tipo-libro#wireo').addClass('d-none');
|
||||
}
|
||||
else {
|
||||
$('.tipo-libro#espiral').removeClass('d-none');
|
||||
$('.tipo-libro#wireo').removeClass('d-none');
|
||||
}
|
||||
if (paginas < 12 || paginas > 40) {
|
||||
$('.tipo-libro#grapado').addClass('d-none');
|
||||
}
|
||||
else {
|
||||
$('.tipo-libro#grapado').removeClass('d-none');
|
||||
}
|
||||
|
||||
if (selectedTipo && $('.tipo-libro#' + selectedTipo).length > 0 && !$('.tipo-libro#' + selectedTipo).hasClass('d-none')) {
|
||||
$('.tipo-libro#' + selectedTipo).addClass('selected');
|
||||
@ -300,10 +360,10 @@ class PresupuestoCliente {
|
||||
}
|
||||
|
||||
if ($('.tipo-libro.selected').length > 0) {
|
||||
this.formData.datosGenerales.tipoImpresion = $('.tipo-libro.selected').attr('id');
|
||||
this.formData.datosGenerales.tipoEncuadernacion = $('.tipo-libro.selected').attr('id');
|
||||
}
|
||||
else {
|
||||
this.formData.datosGenerales.tipoImpresion = '';
|
||||
this.formData.datosGenerales.tipoEncuadernacion = '';
|
||||
}
|
||||
}
|
||||
/******************************
|
||||
@ -314,17 +374,94 @@ class PresupuestoCliente {
|
||||
/******************************
|
||||
* INTERIOR
|
||||
******************************/
|
||||
|
||||
#initInterior() {
|
||||
|
||||
$(document).on('click', '.interior-data', (e) => {
|
||||
const dataToStore = this.#getInteriorData();
|
||||
this.#updateInteriorData(dataToStore);
|
||||
this.#cacheFormData();
|
||||
});
|
||||
|
||||
$(document).on('click', '.papel-interior', (e) => {
|
||||
|
||||
this.divGramajeInterior.removeClass('animate-fadeInUpBounce');
|
||||
|
||||
const data = this.#getPresupuestoData();
|
||||
$.ajax({
|
||||
url: '/presupuesto/public/get-gramaje-interior',
|
||||
type: 'POST',
|
||||
data: data,
|
||||
}).done((data) => {
|
||||
|
||||
this.divGramajeInterior.empty();
|
||||
const gramajes = data.opciones_gramaje_interior;
|
||||
this.#addGramajesInterior(gramajes);
|
||||
this.divGramajeInterior.addClass('animate-fadeInUpBounce');
|
||||
|
||||
const dataInterior = this.#getInteriorData();
|
||||
this.#updateInteriorData(dataInterior);
|
||||
this.#cacheFormData();
|
||||
|
||||
}).fail((xhr, status, error) => {
|
||||
|
||||
});
|
||||
});
|
||||
|
||||
$('.btn-change-tab-interior').on('click', (e) => {
|
||||
|
||||
let data = this.#getPresupuestoData();
|
||||
const id = e.currentTarget.id;
|
||||
|
||||
$.ajax({
|
||||
url: '/presupuesto/public/validar/interior',
|
||||
type: 'POST',
|
||||
data: data,
|
||||
success: (data) => {
|
||||
if( id === 'btn-prev-interior') {
|
||||
|
||||
this.#changeTab('pills-general-data');
|
||||
} else {
|
||||
$('.tapa-cubierta.selected').trigger('click');
|
||||
this.#changeTab('pills-cover');
|
||||
}
|
||||
},
|
||||
error: (xhr, status, error) => {
|
||||
|
||||
this.interior_alert.removeClass('d-none');
|
||||
this.interior_alert.find('#inside-alert-list').empty();
|
||||
const errors = xhr.responseJSON;
|
||||
if (errors && typeof errors === 'object') {
|
||||
if (!this.DEBUG && xhr.responseJSON.error && xhr.responseJSON.error == 'Internal Server Error') {
|
||||
console.error("Error al validar los datos generales. Internal Server Error");
|
||||
return;
|
||||
}
|
||||
Object.values(errors).forEach(errorMsg => {
|
||||
this.interior_alert.find('#inside-alert-list').append(`<li>${errorMsg}</li>`);
|
||||
});
|
||||
} else {
|
||||
this.interior_alert.find('#inside-alert-list').append('<li>Error desconocido. Por favor, inténtelo de nuevo más tarde.</li>');
|
||||
}
|
||||
$(window).scrollTop(0);
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
#loadInteriorData(data) {
|
||||
|
||||
|
||||
this.divOpcionesColor.empty();
|
||||
this.divPapelInterior.empty();
|
||||
this.divGramajeInterior.empty();
|
||||
|
||||
const opciones_color = data.opciones_color;
|
||||
|
||||
for (let i = 0; i < opciones_color.length; i++) {
|
||||
const opcion = opciones_color[i];
|
||||
const item = new imagen_presupuesto(opcion);
|
||||
item.extraClass = 'interior-data';
|
||||
if ((this.formData.interior.color === '' && i === 0) ||
|
||||
this.formData.interior.color === opcion.color) {
|
||||
this.formData.interior.color === opcion.id) {
|
||||
item.setSelected(true);
|
||||
}
|
||||
this.divOpcionesColor.append(item.render());
|
||||
@ -334,12 +471,55 @@ class PresupuestoCliente {
|
||||
for (let i = 0; i < opciones_papel_interior.length; i++) {
|
||||
const opcion = opciones_papel_interior[i];
|
||||
const item = new imagen_presupuesto(opcion);
|
||||
if ((this.formData.interior.papel === '' && i === 0) ||
|
||||
this.formData.interior.papel === opcion.papel) {
|
||||
item.setSelected(true);
|
||||
}
|
||||
item.extraClass = 'interior-data papel-interior';
|
||||
|
||||
this.divPapelInterior.append(item.render());
|
||||
}
|
||||
|
||||
const gramajes = data.opciones_gramaje_interior;
|
||||
this.#addGramajesInterior(gramajes);
|
||||
|
||||
const dataInterior = this.#getInteriorData();
|
||||
this.#updateInteriorData(dataInterior);
|
||||
this.#cacheFormData();
|
||||
}
|
||||
|
||||
#addGramajesInterior(gramajes) {
|
||||
|
||||
for (let i = 0; i < gramajes.length; i++) {
|
||||
const gramaje = gramajes[i];
|
||||
this.#addGramaje(this.divGramajeInterior, gramaje, 'gramaje-interior');
|
||||
|
||||
// Seleccionar el gramaje por defecto
|
||||
if (this.formData.interior.gramaje === '' && i === 0) {
|
||||
$(`#gramaje-${gramaje}`).prop('checked', true);
|
||||
} else if (this.formData.interior.gramaje === gramaje) {
|
||||
$(`#gramaje-${gramaje}`).prop('checked', true);
|
||||
}
|
||||
}
|
||||
if (this.divGramajeInterior.find('input[type="radio"]:checked').length === 0) {
|
||||
// If not, select the first one by default
|
||||
this.divGramajeInterior.find('input[type="radio"]').first().prop('checked', true);
|
||||
}
|
||||
}
|
||||
|
||||
#getInteriorData() {
|
||||
|
||||
const tipoImpresion = $('#div-opciones-color .image-container.selected').attr('id') || 'negro';
|
||||
const papelInteriorId = $('#div-papel-interior .image-container.selected').data('sk-id') || 3;
|
||||
const gramejeInterior = $('input[name="gramaje-interior"]:checked').data('gramaje') || 90;
|
||||
return {
|
||||
tipoImpresion: tipoImpresion,
|
||||
papelInteriorId: papelInteriorId,
|
||||
gramejeInterior: gramejeInterior
|
||||
};
|
||||
}
|
||||
|
||||
#updateInteriorData(data) {
|
||||
|
||||
this.formData.interior.tipoImpresion = data.tipoImpresion;
|
||||
this.formData.interior.papelInteriorId = data.papelInteriorId;
|
||||
this.formData.interior.gramejeInterior = data.gramejeInterior;
|
||||
}
|
||||
|
||||
|
||||
@ -383,6 +563,122 @@ class PresupuestoCliente {
|
||||
showCloseButton: true
|
||||
});
|
||||
});
|
||||
|
||||
$(document).on('click', '.tapa-cubierta', (e) => {
|
||||
|
||||
$('.tapa-dura-options').eq(0).removeClass('animate-fadeInUpBounce');
|
||||
$('.tapa-blanda-options').eq(0).removeClass('animate-fadeInUpBounce');
|
||||
|
||||
if(e.currentTarget.id === 'tapaBlanda') {
|
||||
$('.tapa-dura-options').addClass('d-none');
|
||||
$('.tapa-blanda-options').removeClass('d-none');
|
||||
$('.tapa-blanda-options').eq(0).addClass('animate-fadeInUpBounce');
|
||||
}
|
||||
else{
|
||||
$('.tapa-blanda-options').addClass('d-none');
|
||||
$('.tapa-dura-options').removeClass('d-none');
|
||||
$('.tapa-dura-options').eq(0).addClass('animate-fadeInUpBounce');
|
||||
}
|
||||
|
||||
this.#getPapelesCubierta(e.currentTarget.id);
|
||||
|
||||
const dataToStore = this.#getCubiertaData();
|
||||
this.#updateCubiertaData(dataToStore);
|
||||
this.#cacheFormData();
|
||||
});
|
||||
|
||||
$(document).on('click', '.solapas-cubierta', (e) => {
|
||||
|
||||
if(e.currentTarget.id === 'sin-solapas') {
|
||||
this.divSolapasCubierta.addClass('d-none');
|
||||
}
|
||||
else{
|
||||
this.divSolapasCubierta.removeClass('d-none');
|
||||
}
|
||||
|
||||
const dataToStore = this.#getCubiertaData();
|
||||
this.#updateCubiertaData(dataToStore);
|
||||
this.#cacheFormData();
|
||||
});
|
||||
}
|
||||
|
||||
#getPapelesCubierta(tapa_id) {
|
||||
|
||||
this.divPapelCubierta.removeClass('animate-fadeInUpBounce');
|
||||
|
||||
return $.ajax({
|
||||
url: '/presupuesto/public/get-papel-cubierta',
|
||||
type: 'POST',
|
||||
data: {
|
||||
tipoCubierta: tapa_id,
|
||||
papelCubiertaId: this.formData.cubierta.papelCubiertaId,
|
||||
gramajeCubierta: this.formData.cubierta.gramajeCubierta,
|
||||
},
|
||||
success: (data) => {
|
||||
|
||||
this.divPapelCubierta.empty();
|
||||
this.divGramajeCubierta.empty();
|
||||
|
||||
const papelesCubierta = data.opciones_papel_cubierta;
|
||||
for (let i = 0; i < papelesCubierta.length; i++) {
|
||||
const papel = papelesCubierta[i];
|
||||
const item = new imagen_presupuesto(papel);
|
||||
item.extraClass = 'cubierta-data papel-cubierta';
|
||||
if (papel.id === this.formData.cubierta.papelCubiertaId) {
|
||||
item.setSelected(true);
|
||||
}
|
||||
this.divPapelCubierta.append(item.render());
|
||||
}
|
||||
|
||||
this.divPapelCubierta.addClass('animate-fadeInUpBounce');
|
||||
},
|
||||
error: (xhr, status, error) => {
|
||||
|
||||
console.error("Error al obtener los papeles de cubierta: ", xhr.responseText);
|
||||
$(window).scrollTop(0);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
#getCubiertaData() {
|
||||
|
||||
const tipoCubierta = $('.cubierta-data.tapa.selected').attr('id') || 'tapaBlanda';
|
||||
const solapas = parseInt($('#div-solapas-cubierta input[type="radio"]:checked').val()) || 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 papelCubiertaId = $('#papel-cubierta-id').val() || 3;
|
||||
const gramajeCubierta = $('#gramaje-cubierta').val() || 170;
|
||||
|
||||
return {
|
||||
tipoCubierta: tipoCubierta,
|
||||
solapas: solapas,
|
||||
tamanioSolapas: tamanioSolapas,
|
||||
cubiertaCaras: cubiertaCaras,
|
||||
guardasPapel: guardasPapel,
|
||||
guardasGramaje: guardasGramaje,
|
||||
guardasImpresas: guardasImpresas,
|
||||
cabezada: cabezada,
|
||||
papelCubiertaId: papelCubiertaId,
|
||||
gramajeCubierta: gramajeCubierta
|
||||
};
|
||||
}
|
||||
|
||||
#updateCubiertaData(data) {
|
||||
|
||||
this.formData.cubierta.tipoCubierta = data.tipoCubierta;
|
||||
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.guardasGramaje = data.guardasGramaje;
|
||||
this.formData.cubierta.guardasImpresas = data.guardasImpresas;
|
||||
this.formData.cubierta.cabezada = data.cabezada;
|
||||
this.formData.cubierta.papelCubiertaId = data.papelCubiertaId;
|
||||
this.formData.cubierta.gramajeCubierta = data.gramajeCubierta;
|
||||
}
|
||||
/******************************
|
||||
* END CUBIERTA
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
<div>
|
||||
<div class="animate-fadeInUpBounce">
|
||||
<div class="row justify-content-center mb-3">
|
||||
<div class="col-auto">
|
||||
<button type="button" id="btn-plantilla-cubierta" class="btn btn-outline-primary btn-border">
|
||||
@ -20,8 +20,8 @@
|
||||
</div>
|
||||
|
||||
<div class="ribbon-content mt-4">
|
||||
<div class="row justify-content-center imagen-container-group">
|
||||
<div id="tapa-blanda" class="image-container imagen-selector selected">
|
||||
<div class="row justify-content-center imagen-container-group mt-3">
|
||||
<div id="tapaBlanda" class="tapa-cubierta image-container imagen-selector selected">
|
||||
<img class="image-presupuesto" src="/assets/images/imprimelibros/presupuestador/tapa-blanda.png"
|
||||
alt="">
|
||||
<label for="titulo" class="form-label" th:text="#{presupuesto.tapa-blanda}">
|
||||
@ -29,7 +29,7 @@
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<div id="tapa-dura" class="image-container imagen-selector">
|
||||
<div id="tapaDuraLomoRecto" class="tapa-cubierta image-container imagen-selector">
|
||||
<img class="image-presupuesto"
|
||||
src="/assets/images/imprimelibros/presupuestador/tapa-dura-lomo-recto.png" alt="">
|
||||
<label class="form-label" th:text="#{presupuesto.tapa-dura}">
|
||||
@ -37,7 +37,7 @@
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<div id="tapa-dura-lomo-redondo" class="image-container imagen-selector">
|
||||
<div id="tapaDuraLomoRedondo" class="tapa-cubierta image-container imagen-selector">
|
||||
<img class="image-presupuesto"
|
||||
src="/assets/images/imprimelibros/presupuestador/tapa-dura-lomo-redondo.png" alt="">
|
||||
<label class="form-label" th:text="#{presupuesto.tapa-dura-lomo-redondo}">
|
||||
@ -47,7 +47,8 @@
|
||||
</div>
|
||||
|
||||
<div class="row justify-content-center align-items-center mt-3 imagen-container-group tapa-blanda-options">
|
||||
<div id="sin-solapas" class="image-container imagen-selector">
|
||||
|
||||
<div id="sin-solapas" class="image-container imagen-selector solapas-cubierta selected">
|
||||
<img class="image-presupuesto"
|
||||
src="/assets/images/imprimelibros/presupuestador/sinSolapasCubierta.png" alt="">
|
||||
<label class="form-label" th:text="#{presupuesto.sin-solapas}">
|
||||
@ -55,7 +56,7 @@
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<div id="con-solapas" class="image-container imagen-selector">
|
||||
<div id="con-solapas" class="image-container imagen-selector solapas-cubierta">
|
||||
<img class="image-presupuesto"
|
||||
src="/assets/images/imprimelibros/presupuestador/conSolapasCubierta.png" alt="">
|
||||
<label class="form-label" th:text="#{presupuesto.con-solapas}">
|
||||
@ -79,7 +80,7 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-auto mb-3">
|
||||
<div id="div-solapas-cubierta" class="col-auto mb-3 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" id="tamanio-solapas-cubierta" value="80" step="1">
|
||||
@ -87,7 +88,8 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row justify-content-center align-items-center mt-3 imagen-container-group tapa-dura-options">
|
||||
<div class="row justify-content-center align-items-center mt-3 imagen-container-group tapa-dura-options d-none">
|
||||
|
||||
<div class="col-auto mb-3">
|
||||
<label for="papel-guardas" class="form-label" th:text="#{presupuesto.papel-guardas}">Papel de
|
||||
guardas</label>
|
||||
@ -133,22 +135,8 @@
|
||||
|
||||
<div class="ribbon-content mt-4">
|
||||
|
||||
<div class="row justify-content-center imagen-container-group">
|
||||
<div id="cartulina-grafica-cubierta" data-sk-id="3" class="image-container imagen-selector selected">
|
||||
<img class="image-presupuesto"
|
||||
src="/assets/images/imprimelibros/presupuestador/cartulina-grafica.png" alt="">
|
||||
<label for="titulo" class="form-label" th:text="#{presupuesto.cartulina-grafica-cubierta}">
|
||||
Cartulina gráfica estucada a una cara
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<div id="estucado-mate-cubierta" data-sk-id="2" class="image-container imagen-selector">
|
||||
<img class="image-presupuesto"
|
||||
src="/assets/images/imprimelibros/presupuestador/estucado-mate-cubierta.png" alt="">
|
||||
<label class="form-label" th:text="#{presupuesto.estucado-mate}">
|
||||
Estucado Mate
|
||||
</label>
|
||||
</div>
|
||||
<div id="div-papel-cubierta" class="row justify-content-center imagen-container-group">a
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -165,7 +153,7 @@
|
||||
</div>
|
||||
|
||||
<div class="ribbon-content mt-4">
|
||||
<div class="hstack gap-2 justify-content-center flex-wrap">
|
||||
<div id="div-gramaje-cubierta" class="hstack gap-2 justify-content-center flex-wrap">
|
||||
<input type="radio" class="btn-check" id="gramaje-cubierta-240" name="gramaje-cubierta"
|
||||
data-gramaje="240">
|
||||
<label class="btn btn-outline-primary material-shadow gramaje-radio" for="gramaje-cubierta-240">
|
||||
|
||||
@ -1,14 +1,22 @@
|
||||
<div id="content-interior">
|
||||
<div id="content-interior" class="animate-fadeInUpBounce">
|
||||
<!-- Ribbon Shape -->
|
||||
<div class="card ribbon-box border shadow-none mb-lg-0 material-shadow">
|
||||
<div class="card-body">
|
||||
<div class="ribbon ribbon-primary ribbon-shape" th:text="#{presupuesto.tipo-impresion}">Tipo de impresión
|
||||
<div class="ribbon ribbon-primary ribbon-shape" th:text="#{presupuesto.tipo-encuadernacion}">Tipo de impresión
|
||||
</div>
|
||||
<h5 class="fs-14 text-end" th:text="#{presupuesto.tipo-impresion-descripcion}">Elija entre calidad estándar
|
||||
<h5 class="fs-14 text-end" th:text="#{presupuesto.tipo-encuadernacion-descripcion}">Elija entre calidad estándar
|
||||
o premium</h5>
|
||||
</div>
|
||||
|
||||
<div class="ribbon-content mt-4">
|
||||
<div class="alert alert-danger alert-dismissible alert-label-icon rounded-label fade show material-shadow d-none"
|
||||
role="alert" id="inside-alert">
|
||||
<i class="ri-error-warning-line label-icon"></i>
|
||||
<strong th:text="#{presupuesto.errores-title}">Corrija los siguientes errores:</strong>
|
||||
<ul class="mb-0" id="inside-alert-list">
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div id="div-opciones-color" class="row justify-content-center imagen-container-group">
|
||||
|
||||
</div>
|
||||
@ -74,7 +82,7 @@
|
||||
</div>
|
||||
|
||||
<div class="ribbon-content mt-4">
|
||||
<div class="hstack gap-2 justify-content-center flex-wrap">
|
||||
<div id="div-gramaje-interior" class="hstack gap-2 justify-content-center flex-wrap">
|
||||
<input type="radio" class="btn-check" data-gramaje="70" id="gramaje-70" name="gramaje-interior">
|
||||
<label class="btn btn-outline-primary material-shadow gramaje-radio" for="gramaje-70">70</label>
|
||||
|
||||
@ -106,11 +114,11 @@
|
||||
</div>
|
||||
|
||||
<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-interior" type="button" class="btn btn-change-tab-interior btn-light d-flex align-items-center">
|
||||
<i class=" ri-arrow-left-circle-line label-icon align-middle fs-16 me-2"></i>
|
||||
<span th:text="#{presupuesto.volver-datos-generales}">Volver a datos generales</span>
|
||||
</button>
|
||||
<button type="button" class="btn btn-primary d-flex align-items-center">
|
||||
<button id="btn-next-interior" type="button" class="btn btn-change-tab-interior btn-primary d-flex align-items-center">
|
||||
<span th:text="#{presupuesto.continuar-cubierta}">Continuar a diseño cubierta</span>
|
||||
<i class="ri-arrow-right-circle-line fs-16 ms-2"></i>
|
||||
</button>
|
||||
|
||||
Reference in New Issue
Block a user