falta procesar el resultado

src/main/resources/templates/imprimelibros/home.html

@@ -36,6 +36,7 @@
         <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/presupuesto-maquetacion.js}"></script>
         </div>
         <script th:inline="javascript">
             window.languageBundle = /*[[${languageBundle}]]*/ {};

src/main/resources/templates/imprimelibros/partials/modal-form.html

@@ -0,0 +1,15 @@
+<div th:fragment="modal (id, title, size, bodyId)">
+  <div class="modal fade" th:id="${id}" tabindex="-1" aria-hidden="true">
+    <div th:class="'modal-dialog ' + ${size}">
+      <div class="modal-content">
+        <div class="modal-header">
+          <h5 class="modal-title" th:text="#{${title}}">Título</h5>
+          <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Cerrar"></button>
+        </div>
+        <div class="modal-body" th:id="${bodyId}">
+          
+        </div>
+      </div>
+    </div>
+  </div>
+</div>

src/main/resources/templates/imprimelibros/presupuestos/presupuestador.html

@@ -1,4 +1,12 @@
 <div th:fragment="presupuestador">
+	<!-- Modales-->
+	<div
+		th:replace="imprimelibros/partials/modal-form :: modal('maquetacionModal', 'presupuesto.maquetacion', 'modal-lg', 'maquetacionModalBody')">
+	</div>
+
+	<div
+		th:replace="imprimelibros/partials/modal-form :: modal('marcapaginasModal', 'presupuesto.marcapaginas', 'modal-lg', 'marcapaginasModalBody')">
+	</div>
 	<div class="row">
 		<div class="col-xl-9">
 			<div class="card">

src/main/resources/templates/imprimelibros/presupuestos/presupuesto-maquetacion-form.html

@@ -0,0 +1,73 @@
+<div th:fragment="maquetacionForm">
+    <form id="maquetacionForm" th:action="@{/presupuesto/public/maquetacion}" th:object="${presupuestoMaquetacion}" method="get">
+        <div class="form-group">
+            <label th:text="#{presupuesto.maquetacion.num-caracteres}" for="num-caracteres">Número de caracteres</label>
+            <input type="number" class="form-control" id="num-caracteres" th:field="*{numCaracteres}" min="1" required>
+            <label th:text="#{presupuesto.maquetacion.num-caracteres-descripcion}" class="form-text text-muted"></label>
+        </div>
+        <div class="form-group">
+            <label th:text="#{presupuesto.maquetacion.formato}" for="formato-maquetacion">Formato</label>
+            <select class="form-control" id="formato-maquetacion" th:field="*{formato}" required>
+                <option value="A5" selected>A5</option>
+                <option value="_17x24_">170x240 mm</option>
+                <option value="A4">A4</option>
+            </select>
+            <label th:text="#{presupuesto.maquetacion.formato-descripcion}" class="form-text text-muted"></label>
+        </div>
+        <div class="form-group">
+            <label th:text="#{presupuesto.maquetacion.cuerpo-texto}" for="cuerpo-texto">Cuerpo de texto</label>
+            <select class="form-control" id="cuerpo-texto" th:field="*{cuerpoTexto}" required>
+                <option th:text="#{presupuesto.maquetacion.cuerpo-texto-pequeño}" value="small"></option>
+                <option th:text="#{presupuesto.maquetacion.cuerpo-texto-medio}" value="medium" selected>Medio (12pt)
+                </option>
+                <option th:text="#{presupuesto.maquetacion.cuerpo-texto-grande}" value="large">Grande</option>
+            </select>
+            <label th:text="#{presupuesto.maquetacion.cuerpo-texto-descripcion}" class="form-text text-muted"></label>
+        </div>
+        <div class="form-group">
+            <label th:text="#{presupuesto.maquetacion.num-columnas}" for="num-columnas">Número de columnas</label>
+            <input type="number" class="form-control" id="num-columnas" th:field="*{numColumnas}" min="1" required>
+            <label th:text="#{presupuesto.maquetacion.num-columnas-descripcion}" class="form-text text-muted"></label>
+        </div>
+        <div class="form-group">
+            <label th:text="#{presupuesto.maquetacion.num-tablas}" for="num-tablas">Número de tablas</label>
+            <input type="number" class="form-control" id="num-tablas" th:field="*{numTablas}" min="0" required>
+        </div>
+        <div class="form-group">
+            <label th:text="#{presupuesto.maquetacion.num-fotos}" for="num-fotos">Número de fotos</label>
+            <input type="number" class="form-control" id="num-fotos" th:field="*{numFotos}" min="0" required>
+        </div>
+        <div class="form-check form-switch form-switch-custom mb-3 mt-3">
+            <input type="checkbox" class="form-check-input form-switch-custom-primary"
+                id="correccion-ortotipografica" name="correccion-ortotipografica"
+                th:field="*{correccionOrtotipografica}">
+            <label class="form-check-label" for="correccion-ortotipografica">Corrección ortotipográfica</label>
+        </div>
+        <div class="form-check form-switch form-switch-custom mb-3">
+            <input type="checkbox" class="form-check-input form-switch-custom-primary"
+                id="texto-mecanografiado" name="texto-mecanografiado" th:field="*{textoMecanografiado}">
+            <label for="texto-mecanografiado" class="form-check-label" th:text="#{presupuesto.formato-personalizado}">
+                Texto mecanografiado
+            </label>
+        </div>
+        <div class="form-check form-switch form-switch-custom mb-3">
+            <input type="checkbox" class="form-check-input form-switch-custom-primary" id="disenio-portada"
+                name="disenio-portada" th:field="*{disenioPortada}">
+            <label for="disenio-portada" class="form-check-label" th:text="#{presupuesto.maquetacion.diseno-portada}">
+                Diseño de portada
+            </label>
+        </div>
+        <div class="form-check form-switch form-switch-custom">
+            <input type="checkbox" class="form-check-input form-switch-custom-primary" id="epub" name="epub"
+                th:field="*{epub}">
+            <label for="epub" class="form-check-label" th:text="#{presupuesto.maquetacion.epub}">ePub</label>
+        </div>
+
+        <button type="submit" class="btn btn-secondary mt-3">Calcular Presupuesto</button>
+        
+    </form>
+    <div th:if="${resultado != null}" class="mt-4">
+        <h3>Resultado del Presupuesto</h3>
+        <pre th:text="${resultado}"></pre>
+    </div>
+</div>