mirror of
https://git.imnavajas.es/jjimenez/erp-imprimelibros.git
synced 2026-02-28 21:59:13 +00:00
trabajando en leer datos de tipo cubierta
This commit is contained in:
@ -23,10 +23,6 @@
|
||||
transition: border 0.3s ease;
|
||||
}
|
||||
|
||||
/* === Borde visible cuando está seleccionada === */
|
||||
.image-container.selected {
|
||||
border-color: #92b2a7;
|
||||
}
|
||||
|
||||
/* === Imagen interna === */
|
||||
.image-container img {
|
||||
@ -37,6 +33,16 @@
|
||||
transition: transform 0.3s ease;
|
||||
}
|
||||
|
||||
/* Borde cuando está seleccionado, sin JS */
|
||||
.image-container:has(input:checked) {
|
||||
border-color: #92b2a7;
|
||||
}
|
||||
|
||||
/* Si quieres la animación al seleccionar */
|
||||
.image-container:has(input:checked) .image-presupuesto {
|
||||
animation: zoomPop 800ms cubic-bezier(0.68,-0.55,0.27,1.55);
|
||||
}
|
||||
|
||||
/* === Animación de zoom con rebote === */
|
||||
.image-presupuesto.zoom-anim {
|
||||
animation: zoomPop 800ms cubic-bezier(0.68, -0.55, 0.27, 1.55);
|
||||
|
||||
@ -7,17 +7,17 @@ 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 && !(data.extraClass===undefined))? (data.extraClass + ' ') : '';
|
||||
this.extraClass = (data.extraClass && !(data.extraClass === undefined)) ? (data.extraClass + ' ') : '';
|
||||
this.extraData = data.extra_data || {}; // Datos extra opcionales
|
||||
}
|
||||
|
||||
render() {
|
||||
const contenedor = $('<div>', {
|
||||
const contenedor = $('<label>', {
|
||||
id: this.id,
|
||||
class: `${this.extraClass + ' '}image-container imagen-selector${this.selected ? ' selected' : ''}`
|
||||
class: `${this.extraClass + ' '}image-container imagen-selector}`
|
||||
});
|
||||
// Añadir atributos extra al contenedor
|
||||
for (const [key, value] of Object.entries(this.extraData)) {
|
||||
for (const [key, value] of Object.entries(this.extraData)) {
|
||||
contenedor.attr(`data-${key}`, value);
|
||||
}
|
||||
contenedor.attr("data-summary-text", this.texto); // Para el resumen
|
||||
@ -26,7 +26,8 @@ class imagen_presupuesto {
|
||||
type: 'radio',
|
||||
name: this.group,
|
||||
value: this.id,
|
||||
hidden: true
|
||||
hidden: true,
|
||||
checked: this.selected
|
||||
});
|
||||
|
||||
|
||||
@ -37,13 +38,12 @@ class imagen_presupuesto {
|
||||
alt: this.alt
|
||||
});
|
||||
|
||||
const etiqueta = $('<label>', {
|
||||
for: this.id + '-img',
|
||||
class: 'form-label',
|
||||
const etiqueta = $('<div>', {
|
||||
class: 'form-text text-center',
|
||||
text: this.texto
|
||||
});
|
||||
|
||||
contenedor.append(imagen, etiqueta);
|
||||
contenedor.append(input, imagen, etiqueta);
|
||||
return contenedor;
|
||||
}
|
||||
|
||||
|
||||
@ -32,18 +32,18 @@ export function updatePaginas() {
|
||||
|
||||
export function updateTipoImpresion() {
|
||||
|
||||
const $selected = $('.opcion-color.selected');
|
||||
const $selected = $('.opcion-color input:checked');
|
||||
if ($selected.length > 0) {
|
||||
const resumen = $selected.data('summary-text') || $selected.attr('id');
|
||||
const resumen = $selected.closest('.opcion-color').data('summary-text') || $selected.closest('.opcion-color').attr('id');
|
||||
$('#summary-tipo-interior').text(resumen);
|
||||
}
|
||||
}
|
||||
|
||||
export function updatePapelInterior() {
|
||||
|
||||
const $selected = $('.papel-interior.selected');
|
||||
const $selected = $('.papel-interior input:checked');
|
||||
if ($selected.length > 0) {
|
||||
const resumen = $selected.data('summary-text') || $selected.val();
|
||||
const resumen = $selected.closest('.papel-interior').data('summary-text') || $selected.closest('.papel-interior').val();
|
||||
$('#summary-papel-interior').text(resumen);
|
||||
}
|
||||
}
|
||||
@ -58,12 +58,12 @@ export function updateGramajeInterior() {
|
||||
|
||||
export function updateTapaCubierta(){
|
||||
|
||||
const $selected = $('.tapa-cubierta.selected');
|
||||
const $selected = $('.tapa-cubierta input:checked');
|
||||
if ($selected.length > 0) {
|
||||
const resumen = $selected.data('summary-text') || $selected.attr('id');
|
||||
const resumen = $selected.closest('.tapa-cubierta').data('summary-text') || $selected.closest('.tapa-cubierta').attr('id');
|
||||
$('#summary-tapa-cubierta').text(resumen);
|
||||
}
|
||||
if($selected.attr('id') === 'tapaBlanda') {
|
||||
if($selected.closest('.tapa-cubierta').attr('id') === 'tapaBlanda') {
|
||||
|
||||
$('.tapa-blanda-row').removeClass('d-none');
|
||||
$('.tapa-dura-row').addClass('d-none');
|
||||
@ -88,9 +88,9 @@ export function updateTapaCubierta(){
|
||||
}
|
||||
|
||||
export function updatePapelCubierta() {
|
||||
const $selected = $('.papel-cubierta.selected');
|
||||
const $selected = $('.papel-cubierta input:checked');
|
||||
if ($selected.length > 0) {
|
||||
const resumen = $selected.data('summary-text') || $selected.val();
|
||||
const resumen = $selected.closest('.papel-cubierta').data('summary-text') || $selected.closest('.papel-cubierta').val();
|
||||
$('#summary-papel-cubierta').text(resumen);
|
||||
}
|
||||
}
|
||||
|
||||
@ -0,0 +1,4 @@
|
||||
import PresupuestoWizard from './wizard.js';
|
||||
|
||||
const app = new PresupuestoWizard({ mode: 'public' });
|
||||
app.init();
|
||||
@ -0,0 +1,9 @@
|
||||
import PresupuestoWizard from './wizard.js';
|
||||
|
||||
const app = new PresupuestoWizard({
|
||||
mode: 'view',
|
||||
readonly: true,
|
||||
canSave: false,
|
||||
useSessionCache: false,
|
||||
});
|
||||
app.init();
|
||||
@ -4,9 +4,16 @@ import TiradaCard from "./tirada-price-card.js";
|
||||
import * as Summary from "./summary.js";
|
||||
import { formateaMoneda } from "../utils.js";
|
||||
|
||||
class PresupuestoCliente {
|
||||
export default class PresupuestoWizard {
|
||||
|
||||
constructor() {
|
||||
constructor(options = {}) {
|
||||
this.opts = Object.assign({
|
||||
mode: 'public',
|
||||
presupuestoId: null,
|
||||
readonly: false,
|
||||
canSave: false,
|
||||
useSessionCache: true
|
||||
}, options);
|
||||
|
||||
this.DEBUG = true; // Activar o desactivar el modo de depuración
|
||||
|
||||
@ -168,18 +175,38 @@ class PresupuestoCliente {
|
||||
this.summaryTableExtras = $('#summary-servicios-extras');
|
||||
}
|
||||
|
||||
init() {
|
||||
async init() {
|
||||
|
||||
const root = document.getElementById('presupuesto-app');
|
||||
const mode = root?.dataset.mode || 'public';
|
||||
const presupuestoId = root?.dataset.id || null;
|
||||
|
||||
this.opts = { mode, presupuestoId };
|
||||
|
||||
const stored = sessionStorage.getItem("formData");
|
||||
|
||||
this.#initDatosGenerales();
|
||||
this.#initCubierta();
|
||||
|
||||
if (stored) {
|
||||
this.formData = JSON.parse(stored);
|
||||
this.#loadDatosGeneralesData();
|
||||
if (presupuestoId && mode !== 'public') {
|
||||
await fetch(`/presupuesto/api/get?id=${encodeURIComponent(presupuestoId)}`, {
|
||||
headers: {
|
||||
'Accept': 'application/json',
|
||||
}
|
||||
})
|
||||
.then(r => r.json())
|
||||
.then(dto => {
|
||||
this.formData = dto;
|
||||
this.#loadDatosGeneralesData();
|
||||
});
|
||||
} else {
|
||||
if (stored) {
|
||||
this.formData = JSON.parse(stored);
|
||||
this.#loadDatosGeneralesData();
|
||||
}
|
||||
}
|
||||
|
||||
this.#initCubierta();
|
||||
|
||||
Summary.updateEncuadernacion();
|
||||
Summary.updateFormato();
|
||||
Summary.updatePaginas();
|
||||
@ -205,10 +232,47 @@ class PresupuestoCliente {
|
||||
}
|
||||
});
|
||||
|
||||
if (this.opts.canSave) {
|
||||
$('#btn-guardar').on('click', async () => {
|
||||
// compón el payload con lo que ya tienes:
|
||||
const payload = {
|
||||
id: this.opts.presupuestoId,
|
||||
presupuesto: this.#getPresupuestoData(),
|
||||
};
|
||||
try {
|
||||
const res = await fetch(this.opts.endpoints.save, {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify(payload)
|
||||
}).then(r => r.json());
|
||||
|
||||
// feedback
|
||||
Swal.fire({
|
||||
icon: 'success',
|
||||
title: window.languageBundle?.get('common.guardado') || 'Guardado',
|
||||
timer: 1800,
|
||||
showConfirmButton: false
|
||||
});
|
||||
// opcional: actualizar window.PRESUPUESTO_ID/resumen con el id devuelto
|
||||
if (res.id) window.PRESUPUESTO_ID = res.id;
|
||||
} catch (e) {
|
||||
Swal.fire({ icon: 'error', title: 'Error al guardar', text: e?.message || '' });
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// Limpiar el sessionStorage al salir de la página
|
||||
window.addEventListener('beforeunload', () => {
|
||||
sessionStorage.removeItem('formData');
|
||||
});
|
||||
}
|
||||
|
||||
#cacheFormData() {
|
||||
sessionStorage.setItem("formData", JSON.stringify(this.formData));
|
||||
if (!this.opts.useSessionCache) return;
|
||||
const key = this.opts.mode === 'edit' && this.opts.presupuestoId
|
||||
? `formData:edit:${this.opts.presupuestoId}`
|
||||
: `formData:${this.opts.mode}`;
|
||||
sessionStorage.setItem(key, JSON.stringify(this.formData));
|
||||
}
|
||||
|
||||
#changeTab(idContenidoTab) {
|
||||
@ -445,7 +509,7 @@ class PresupuestoCliente {
|
||||
this.tirada4.val(this.formData.datosGenerales.tirada4);
|
||||
|
||||
this.paginasNegro.val(this.formData.datosGenerales.paginasNegro);
|
||||
this.paginasColor.val(this.formData.datosGenerales.paginasColor);
|
||||
this.paginasColor.val(this.formData.datosGenerales.paginasColor);;
|
||||
|
||||
this.posicionPaginasColor.val(this.formData.datosGenerales.posicionPaginasColor);
|
||||
|
||||
@ -456,7 +520,8 @@ class PresupuestoCliente {
|
||||
}
|
||||
|
||||
$('.tipo-libro').removeClass('selected');
|
||||
$('.image-container#' + this.formData.datosGenerales.tipoEncuadernacion).trigger('click');
|
||||
$('input[name="tipoEncuadernacion"][value="' + this.formData.datosGenerales.tipoEncuadernacion + '"]')
|
||||
.prop('checked', true);
|
||||
this.#updateTipoEncuadernacion();
|
||||
|
||||
this.formatoPersonalizado.trigger('change');
|
||||
@ -563,8 +628,8 @@ class PresupuestoCliente {
|
||||
});
|
||||
|
||||
|
||||
$(document).on('click', '.opcion-color', (e) => {
|
||||
|
||||
$(document).on('change', 'input[name="tipoImpresion"]', (e) => {
|
||||
|
||||
const data = this.#getPresupuestoData();
|
||||
Summary.updateTipoImpresion();
|
||||
|
||||
@ -614,8 +679,8 @@ class PresupuestoCliente {
|
||||
});
|
||||
});
|
||||
|
||||
$(document).on('click', '.papel-interior', (e) => {
|
||||
|
||||
$(document).on('change', 'input[name="papelInterior"]', (e) => {
|
||||
const data = this.#getPresupuestoData();
|
||||
|
||||
Summary.updatePapelInterior();
|
||||
@ -770,6 +835,7 @@ class PresupuestoCliente {
|
||||
for (let i = 0; i < opciones_color.length; i++) {
|
||||
const opcion = opciones_color[i];
|
||||
const item = new imagen_presupuesto(opcion);
|
||||
item.group = 'tipoImpresion';
|
||||
item.extraClass = 'interior-data opcion-color';
|
||||
if ((this.formData.interior.tipoImpresion === '' && i === 0) ||
|
||||
this.formData.interior.tipoImpresion === opcion.id) {
|
||||
@ -782,6 +848,7 @@ class PresupuestoCliente {
|
||||
for (let i = 0; i < opciones_papel_interior.length; i++) {
|
||||
const opcion = opciones_papel_interior[i];
|
||||
const item = new imagen_presupuesto(opcion);
|
||||
item.group = 'papelInterior';
|
||||
item.extraClass = 'interior-data papel-interior';
|
||||
if (this.formData.interior.papelInteriorId == '' && i === 0 ||
|
||||
this.formData.interior.papelInteriorId == opcion.extra_data["sk-id"]) {
|
||||
@ -823,8 +890,8 @@ class PresupuestoCliente {
|
||||
|
||||
#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 tipoImpresion = $('#div-opciones-color .image-container input:checked').parent().attr('id') || 'negro';
|
||||
const papelInteriorId = $('#div-papel-interior .image-container input:checked').parent().data('sk-id') || 3;
|
||||
const gramajeInterior = $('input[name="gramaje-interior"]:checked').data('gramaje') || 90;
|
||||
return {
|
||||
tipoImpresion: tipoImpresion,
|
||||
@ -882,12 +949,12 @@ class PresupuestoCliente {
|
||||
});
|
||||
});
|
||||
|
||||
$(document).on('click', '.tapa-cubierta', (e) => {
|
||||
$(document).on('change', 'input[name="tipoCubierta"]', (e) => {
|
||||
|
||||
$('.tapa-dura-options').eq(0).removeClass('animate-fadeInUpBounce');
|
||||
$('.tapa-blanda-options').eq(0).removeClass('animate-fadeInUpBounce');
|
||||
|
||||
if (e.currentTarget.id === 'tapaBlanda') {
|
||||
if (e.currentTarget.value === 'tapaBlanda') {
|
||||
$('.tapa-blanda-options').eq(0).addClass('animate-fadeInUpBounce');
|
||||
$('.tapa-dura-options').addClass('d-none');
|
||||
$('.tapa-blanda-options').removeClass('d-none');
|
||||
@ -898,13 +965,13 @@ class PresupuestoCliente {
|
||||
$('.tapa-dura-options').removeClass('d-none');
|
||||
}
|
||||
|
||||
this.#getPapelesCubierta(e.currentTarget.id);
|
||||
this.#getPapelesCubierta(e.currentTarget.value);
|
||||
Summary.updateTapaCubierta();
|
||||
});
|
||||
|
||||
$(document).on('click', '.solapas-cubierta', (e) => {
|
||||
$(document).on('change', 'input[name="solapasCubierta"]', (e) => {
|
||||
|
||||
if (e.currentTarget.id === 'sin-solapas') {
|
||||
if (e.currentTarget.closest('.image-container').id === 'sin-solapas') {
|
||||
this.divSolapasCubierta.addClass('d-none');
|
||||
}
|
||||
else {
|
||||
@ -918,6 +985,7 @@ class PresupuestoCliente {
|
||||
Summary.updateTapaCubierta();
|
||||
});
|
||||
|
||||
|
||||
$(document).on('click', '.papel-cubierta', (e) => {
|
||||
|
||||
const data = this.#getPresupuestoData();
|
||||
@ -1132,7 +1200,7 @@ class PresupuestoCliente {
|
||||
const gramajeGuardas = 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') || this.formData.cubierta.papelCubiertaId || 3;
|
||||
const papelCubiertaId = $('#div-papel-cubierta .image-container input:checked').parent().data('sk-id') || this.formData.cubierta.papelCubiertaId || 3;
|
||||
const gramajeCubierta = $('input[name="gramaje-cubierta"]:checked').data('gramaje') || this.formData.cubierta.gramajeCubierta || 170;
|
||||
const acabado = parseInt($(`input[name="acabado-cubierta"]:checked`).attr('sk-id')) || 1;
|
||||
const sobrecubierta = this.sobrecubierta.hasClass('active');
|
||||
@ -1230,9 +1298,9 @@ class PresupuestoCliente {
|
||||
|
||||
#loadCubiertaData() {
|
||||
|
||||
$('.tapa-cubierta').removeClass('selected');
|
||||
$(`#${this.formData.cubierta.tipoCubierta}`).addClass('selected');
|
||||
|
||||
$('input[name="tipoCubierta"][value="' + this.formData.cubierta.tipoCubierta + '"]')
|
||||
.prop('checked', true);
|
||||
|
||||
if (this.formData.cubierta.tipoCubierta === 'tapaBlanda') {
|
||||
$('.tapa-blanda-options').removeClass('d-none');
|
||||
$('.tapa-dura-options').addClass('d-none');
|
||||
@ -1247,7 +1315,7 @@ class PresupuestoCliente {
|
||||
this.cabezada.val(this.formData.cubierta.cabezada);
|
||||
}
|
||||
|
||||
$(`#${this.formData.cubierta.tipoCubierta}`).trigger('click');
|
||||
$('input[name="tipoCubierta"][value="' + this.formData.cubierta.tipoCubierta + '"]').trigger('change');
|
||||
|
||||
if (this.formData.cubierta.solapasCubierta === 0) {
|
||||
$('.solapas-cubierta#sin-solapas').addClass('selected');
|
||||
@ -1632,7 +1700,3 @@ class PresupuestoCliente {
|
||||
}
|
||||
|
||||
|
||||
document.addEventListener('DOMContentLoaded', function () {
|
||||
const presupuestoCliente = new PresupuestoCliente();
|
||||
presupuestoCliente.init();
|
||||
});
|
||||
@ -35,7 +35,7 @@
|
||||
<th:block layout:fragment="pagejs">
|
||||
<div th:unless="${#authorization.expression('isAuthenticated()')}">
|
||||
<script th:src="@{/assets/js/pages/imprimelibros/presupuestador/imagen-selector.js}"></script>
|
||||
<script type="module" th:src="@{/assets/js/pages/imprimelibros/presupuestador/presupuestador.js}"></script>
|
||||
<script type="module" th:src="@{/assets/js/pages/imprimelibros/presupuestador/wizard-home.js}"></script>
|
||||
<script type="module" th:src="@{/assets/js/pages/imprimelibros/presupuestador/presupuesto-maquetacion.js}"></script>
|
||||
<script type="module" th:src="@{/assets/js/pages/imprimelibros/presupuestador/presupuesto-marcapaginas.js}"></script>
|
||||
</div>
|
||||
|
||||
@ -21,29 +21,32 @@
|
||||
|
||||
<div class="ribbon-content mt-4">
|
||||
<div class="row justify-content-center imagen-container-group mt-3">
|
||||
<div id="tapaBlanda" class="tapa-cubierta image-container imagen-selector selected" th:attr="data-summary-text=#{presupuesto.tapa-blanda}">
|
||||
<label id="tapaBlanda" class="tapa-cubierta image-container imagen-selector" th:attr="data-summary-text=#{presupuesto.tapa-blanda}">
|
||||
<input type="radio" name="tipoCubierta" value="tapaBlanda" hidden>
|
||||
<img class="image-presupuesto" src="/assets/images/imprimelibros/presupuestador/tapa-blanda.png"
|
||||
alt="">
|
||||
<label for="titulo" class="form-label" th:text="#{presupuesto.tapa-blanda}">
|
||||
<div class="form-label" th:text="#{presupuesto.tapa-blanda}">
|
||||
Tapa blanda
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</label>
|
||||
|
||||
<div id="tapaDura" class="tapa-cubierta image-container imagen-selector" th:attr="data-summary-text=#{presupuesto.tapa-dura}">
|
||||
<label id="tapaDura" class="tapa-cubierta image-container imagen-selector" th:attr="data-summary-text=#{presupuesto.tapa-dura}">
|
||||
<input type="radio" name="tipoCubierta" value="tapaDura" hidden>
|
||||
<img class="image-presupuesto"
|
||||
src="/assets/images/imprimelibros/presupuestador/tapa-dura-lomo-recto.png" alt="">
|
||||
<label class="form-label" th:text="#{presupuesto.tapa-dura}">
|
||||
<div class="form-label" th:text="#{presupuesto.tapa-dura}">
|
||||
Tapa dura
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</label>
|
||||
|
||||
<div id="tapaDuraLomoRedondo" class="tapa-cubierta image-container imagen-selector" th:attr="data-summary-text=#{presupuesto.tapa-dura-lomo-redondo}">
|
||||
<label id="tapaDuraLomoRedondo" class="tapa-cubierta image-container imagen-selector" th:attr="data-summary-text=#{presupuesto.tapa-dura-lomo-redondo}">
|
||||
<input type="radio" name="tipoCubierta" value="tapaDuraLomoRedondo" hidden>
|
||||
<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}">
|
||||
<div class="form-label" th:text="#{presupuesto.tapa-dura-lomo-redondo}">
|
||||
Tapa dura lomo redondo
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</label>
|
||||
</div>
|
||||
|
||||
|
||||
@ -53,21 +56,23 @@
|
||||
|
||||
<!-- Bloque de solapas -->
|
||||
<div class="d-flex gap-3">
|
||||
<div id="sin-solapas" class="image-container imagen-selector solapas-cubierta selected" th:attr="data-summary-text=#{app.no}">
|
||||
<label id="sin-solapas" class="image-container imagen-selector solapas-cubierta" th:attr="data-summary-text=#{app.no}">
|
||||
<input type="radio" name="solapasCubierta" value="sinSolapas" checked hidden>
|
||||
<img class="image-presupuesto"
|
||||
src="/assets/images/imprimelibros/presupuestador/sinSolapasCubierta.png" alt="">
|
||||
<label class="form-label text-center d-block" th:text="#{presupuesto.sin-solapas}">
|
||||
<div class="form-label text-center d-block" th:text="#{presupuesto.sin-solapas}">
|
||||
Sin solapas
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</label>
|
||||
|
||||
<div id="con-solapas" class="image-container imagen-selector solapas-cubierta" th:attr="data-summary-text=#{app.yes}">
|
||||
<label id="con-solapas" class="image-container imagen-selector solapas-cubierta" th:attr="data-summary-text=#{app.yes}">
|
||||
<input type="radio" name="solapasCubierta" value="conSolapas" hidden>
|
||||
<img class="image-presupuesto"
|
||||
src="/assets/images/imprimelibros/presupuestador/conSolapasCubierta.png" alt="">
|
||||
<label class="form-label text-center d-block" th:text="#{presupuesto.con-solapas}">
|
||||
<div class="form-label text-center d-block" th:text="#{presupuesto.con-solapas}">
|
||||
Con solapas
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<!-- Inputs -->
|
||||
|
||||
@ -9,7 +9,7 @@
|
||||
|
||||
<div class="ribbon-content mt-4">
|
||||
|
||||
<div class="alert alert-danger alert-dismissible alert-label-icon rounded-label fade show material-shadow d-none"
|
||||
<div class="alert alert-danger alert-label-icon rounded-label fade show material-shadow d-none"
|
||||
role="alert" id="datos-generales-alert">
|
||||
<i class="ri-error-warning-line label-icon"></i>
|
||||
<strong th:text="#{presupuesto.errores-title}">Corrija los siguientes errores:</strong>
|
||||
@ -81,7 +81,7 @@
|
||||
<select class="form-select select2 datos-generales-data" id="formato">
|
||||
<optgroup th:label="#{presupuesto.orientacion.vertical}">
|
||||
<option data-ancho="148" data-alto="210" value="148x210">148x210 (A5)</option>
|
||||
<option data-ancho="120" data-alto="170" value="120x170">120x170</option>
|
||||
<option data-ancho="170" data-alto="240" value="170x240">170x240</option>
|
||||
<option data-ancho="210" data-alto="297" value="210x297">210x297 (A4)</option>
|
||||
</optgroup>
|
||||
<optgroup th:label="#{presupuesto.orientacion.cuadrado}">
|
||||
@ -195,56 +195,56 @@
|
||||
<div class="d-flex flex-wrap justify-content-center gap-3 imagen-container-group">
|
||||
|
||||
<!-- Opción: Fresado -->
|
||||
<div class="tipo-libro image-container imagen-selector selected datos-generales-data"
|
||||
<label class="tipo-libro image-container imagen-selector datos-generales-data"
|
||||
th:attr="data-summary-text=#{presupuesto.fresado}" id="fresado">
|
||||
<input type="radio" name="tipoEncuadernacion" value="fresado" hidden>
|
||||
<input type="radio" name="tipoEncuadernacion" value="fresado" checked hidden>
|
||||
<img class="image-presupuesto" src="/assets/images/imprimelibros/presupuestador/fresado.png"
|
||||
alt="Fresado" />
|
||||
<div class="form-text text-center" th:text="#{presupuesto.fresado-descripcion}">
|
||||
Fresado (a partir de 32 páginas)</div>
|
||||
</div>
|
||||
</label>
|
||||
|
||||
|
||||
<!-- Opción: Cosido -->
|
||||
<div class="tipo-libro image-container imagen-selector datos-generales-data"
|
||||
<label class="tipo-libro image-container imagen-selector datos-generales-data"
|
||||
th:attr="data-summary-text=#{presupuesto.cosido}" id="cosido">
|
||||
<input type="radio" name="tipoEncuadernacion" value="cosido" hidden>
|
||||
<img class="image-presupuesto" src="/assets/images/imprimelibros/presupuestador/cosido.png"
|
||||
alt="Cosido" />
|
||||
<div class="form-text text-center" th:text="#{presupuesto.cosido-descripcion}">
|
||||
Cosido (a partir de 32 páginas)</div>
|
||||
</div>
|
||||
</label>
|
||||
|
||||
|
||||
<!-- Opción: Grapado -->
|
||||
<div class="tipo-libro image-container imagen-selector datos-generales-data"
|
||||
<label class="tipo-libro image-container imagen-selector datos-generales-data"
|
||||
th:attr="data-summary-text=#{presupuesto.grapado}" id="grapado">
|
||||
<input type="radio" name="tipoEncuadernacion" value="grapado" hidden>
|
||||
<img class="image-presupuesto" src="/assets/images/imprimelibros/presupuestador/grapado.png"
|
||||
alt="Grapado" />
|
||||
<div class="form-text text-center" th:text="#{presupuesto.grapado-descripcion}">
|
||||
Grapado (entre 12 y 40 páginas)</div>
|
||||
</div>
|
||||
</label>
|
||||
|
||||
<!-- Opción: Espiral -->
|
||||
<div class="tipo-libro image-container imagen-selector datos-generales-data"
|
||||
<label class="tipo-libro image-container imagen-selector datos-generales-data"
|
||||
th:attr="data-summary-text=#{presupuesto.espiral}" id="espiral">
|
||||
<input type="radio" name="tipoEncuadernacion" value="espiral" hidden>
|
||||
<img class="image-presupuesto" src="/assets/images/imprimelibros/presupuestador/espiral.png"
|
||||
alt="Espiral" />
|
||||
<div class="form-text text-center" th:text="#{presupuesto.espiral-descripcion}">
|
||||
Espiral (a partir de 20 páginas)</div>
|
||||
</div>
|
||||
</label>
|
||||
|
||||
<!-- Opción: Wire-O -->
|
||||
<div class="tipo-libro image-container imagen-selector datos-generales-data"
|
||||
<label class="tipo-libro image-container imagen-selector datos-generales-data"
|
||||
th:attr="data-summary-text=#{presupuesto.wire-o}" id="wireo">
|
||||
<input type="radio" name="tipoEncuadernacion" value="wireo" hidden>
|
||||
<img class="image-presupuesto" src="/assets/images/imprimelibros/presupuestador/wire-o.png"
|
||||
alt="Wire-O" />
|
||||
<div class="form-text text-center" th:text="#{presupuesto.wire-o-descripcion}">
|
||||
Wire-O (a partir de 20 páginas)</div>
|
||||
</div>
|
||||
</label>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -1,4 +1,8 @@
|
||||
<div th:fragment="presupuestador">
|
||||
<div id="presupuesto-app"
|
||||
th:data-mode="${appMode} ?: 'public'"
|
||||
th:data-id="${id} ?: ''"
|
||||
th:fragment="presupuestador">
|
||||
|
||||
<!-- Modales-->
|
||||
<div
|
||||
th:replace="imprimelibros/partials/modal-form :: modal('maquetacionModal', 'presupuesto.maquetacion', 'modal-md', 'maquetacionModalBody')">
|
||||
|
||||
@ -49,7 +49,9 @@
|
||||
</script>
|
||||
|
||||
<!-- JS de Buttons y dependencias -->
|
||||
<script type="module" th:src="@{/assets/js/pages/imprimelibros/presupuestador/presupuestador.js}"></script>
|
||||
<div th:if="${appMode} == 'view'">
|
||||
<script type="module" th:src="@{/assets/js/pages/imprimelibros/presupuestador/wizard-publicos.js}"></script>
|
||||
</div>
|
||||
</th:block>
|
||||
</body>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user