modificando carro para añadir los nav tabs

This commit is contained in:
2025-10-28 08:17:15 +01:00
parent 9dad59fe16
commit cecc0c0ea0
4 changed files with 110 additions and 54 deletions

View File

@ -4,6 +4,9 @@ cart.empty=Tu cesta de la compra está vacía.
cart.item.presupuesto-numero=Presupuesto #
cart.precio=Precio
cart.tabs.details=Detalles
cart.tabs.envio=Envío
cart.resumen.title=Resumen de la cesta
cart.resumen.base=Base imponible:
cart.resumen.iva-4=IVA 4%:

View File

@ -0,0 +1,27 @@
$(() => {
const csrfToken = document.querySelector('meta[name="_csrf"]')?.getAttribute('content');
const csrfHeader = document.querySelector('meta[name="_csrf_header"]')?.getAttribute('content');
if (window.$ && csrfToken && csrfHeader) {
$.ajaxSetup({
beforeSend: function (xhr) {
xhr.setRequestHeader(csrfHeader, csrfToken);
}
});
}
const language = document.documentElement.lang || 'es-ES';
const modalEl = document.getElementById('direccionFormModal');
const modal = bootstrap.Modal.getOrCreateInstance(modalEl);
$("#onlyOneShipping").on('change', function () {
if ($(this).is(':checked')) {
$('#shippingAddressesContainer').empty().show();
$('#shippingMultipleAddressesContainer').show();
} else {
$('#shippingAddressesContainer').hide();
$('#shippingMultipleAddressesContainer').empty().hide();
}
});
});

View File

@ -1,71 +1,97 @@
<!-- _cartItem.html -->
<div th:fragment="cartItem(item)" class="card product mb-3 shadow-sm" th:attr="data-iva-4=${item.iva4},
<div th:fragment="cartItem(item)" class="card product mb-3 shadow-sm gy-3" th:attr="data-iva-4=${item.iva4},
data-iva-21=${item.iva21},
data-base=${item.base}">
<div class="card-body">
<div class="row gy-3">
<div class="col-sm-auto">
<div class="avatar-lg bg-light rounded p-1">
<img th:src="${item.imagen != null ? item.imagen : '/assets/images/products/placeholder.png'}"
alt="portada" class="img-fluid d-block rounded">
</div>
</div>
<!-- Detalles -->
<div class="col-sm">
<!-- Título / enlace -->
<h5 class="fs-18 text-truncate mb-1">
<a th:href="@{|presupuesto/edit/${item.presupuestoId}|}" class="text-dark"
th:text="${item.titulo != null ? item.titulo : 'Presupuesto #'}">
Presupuesto
</a>
</h5>
<h5 class="fs-14 text-truncate mb-1">
<span th:text="#{cart.item.presupuesto-numero}">Presupuesto #</span>
<span th:text="${item.presupuestoId != null ? item.presupuestoId : ''}">#</span>
</h5>
<!-- Detalles opcionales (ej: cliente, fecha, etc.) -->
<ul class="list-inline text-muted mb-1">
<div th:each="linea : ${item.resumen.lineas}">
<li class="list-inline-item me-3">
<div th:utext="${linea['descripcion']}"></div>
</li>
<ul class="nav nav-pills nav-justified custom-nav nav-product" role="tablist">
<li class="nav-item" role="presentation">
<button class="nav-link fs-15 active" id="pills-details-${item.id}-tab"
data-bs-target="#pills-details-${item.id}" type="button" role="tab"
aria-controls="pills-details-${item.id}" aria-selected="true">
<i class="ri-truck-line fs-5 p-1 bg-soft-primary text-primary rounded-circle align-middle me-2"></i>
<label class="fs-13 my-2" th:text="#{cart.tabs.details}">Detalles</label>
</button>
</li>
<li class="nav-item" role="presentation">
<button class="nav-link fs-15 p-3" id="pills-shipping-${item.id}-tab"
data-bs-target="#pills-shipping-${item.id}" type="button" role="tab"
aria-controls="pills-shipping-${item.id}" aria-selected="false">
<i class="ri-truck-line fs-5 p-1 bg-soft-primary text-primary rounded-circle align-middle me-2"></i>
<label class="fs-13 my-2" th:text="#{cart.tabs.envio}">Envío</label>
</button>
</li>
</ul>
<div class="tab-content row gy-3">
<div class="tab-pane fade show active" id="pills-details-${item.id}" role="tabpanel"
aria-labelledby="pills-details-${item.id}-tab">
<div class="col-sm-auto">
<div class="avatar-lg bg-light rounded p-1">
<img th:src="${item.imagen != null ? item.imagen : '/assets/images/products/placeholder.png'}"
alt="portada" class="img-fluid d-block rounded">
</div>
</ul>
</div>
<ul class="list-inline text-muted mb-1" th:if="${item.resumen.servicios != null}">
<span th:utext="#{pdf.servicios-adicionales}">Servicios adicionales</span>
<span class="spec-label" th:text="${item.resumen.servicios}"></span>
</ul>
<!-- Detalles -->
<div class="col-sm">
<!-- Título / enlace -->
<h5 class="fs-18 text-truncate mb-1">
<a th:href="@{|presupuesto/edit/${item.presupuestoId}|}" class="text-dark"
th:text="${item.titulo != null ? item.titulo : 'Presupuesto #'}">
Presupuesto
</a>
</h5>
<h5 class="fs-14 text-truncate mb-1">
<span th:text="#{cart.item.presupuesto-numero}">Presupuesto #</span>
<span th:text="${item.presupuestoId != null ? item.presupuestoId : ''}">#</span>
</h5>
<ul class="list-inline text-muted mb-1" th:if="${item.resumen != null
<!-- Detalles opcionales (ej: cliente, fecha, etc.) -->
<ul class="list-inline text-muted mb-1">
<div th:each="linea : ${item.resumen.lineas}">
<li class="list-inline-item me-3">
<div th:utext="${linea['descripcion']}"></div>
</li>
</div>
</ul>
<ul class="list-inline text-muted mb-1" th:if="${item.resumen.servicios != null}">
<span th:utext="#{pdf.servicios-adicionales}">Servicios adicionales</span>
<span class="spec-label" th:text="${item.resumen.servicios}"></span>
</ul>
<ul class="list-inline text-muted mb-1" th:if="${item.resumen != null
and #maps.containsKey(item.resumen, 'datosMaquetacion')
and item.resumen['datosMaquetacion'] != null}">
<li class="list-inline-item spec-row mb-1">
<span th:text="#{pdf.datos-maquetacion}">Datos de maquetación:</span>
<span th:utext="${item.resumen.datosMaquetacion}"></span>
</li>
</ul>
<li class="list-inline-item spec-row mb-1">
<span th:text="#{pdf.datos-maquetacion}">Datos de maquetación:</span>
<span th:utext="${item.resumen.datosMaquetacion}"></span>
</li>
</ul>
<ul class="list-inline text-muted mb-1" th:if="${item.resumen != null
<ul class="list-inline text-muted mb-1" th:if="${item.resumen != null
and #maps.containsKey(item.resumen, 'datosMarcapaginas')
and item.resumen['datosMarcapaginas'] != null}">
<li class="list-inline-item spec-row mb-1">
<span th:text="#{pdf.datos-marcapaginas}">Datos de marcapáginas:</span>
<span th:utext="${item.resumen.datosMarcapaginas}"></span>
</li>
</ul>
<li class="list-inline-item spec-row mb-1">
<span th:text="#{pdf.datos-marcapaginas}">Datos de marcapáginas:</span>
<span th:utext="${item.resumen.datosMarcapaginas}"></span>
</li>
</ul>
</div>
<!-- Precio o totales (si los tienes) -->
<div class="col-sm-auto text-end">
<p class="text-muted mb-1" th:text="#{cart.precio}">Precio</p>
<h5 class="fs-14 mb-0">
<span th:text="${item.baseTotal != null ? item.baseTotal : '-'}">0,00</span>
</h5>
</div>
</div>
</div>
<div class="tab-content">
<div class="tab-pane fade show active" id="pills-shipping-${item.id}" role="tabpanel"
aria-labelledby="pills-shipping-${item.id}-tab">
<!-- Precio o totales (si los tienes) -->
<div class="col-sm-auto text-end">
<p class="text-muted mb-1" th:text="#{cart.precio}">Precio</p>
<h5 class="fs-14 mb-0">
<span th:text="${item.baseTotal != null ? item.baseTotal : '-'}">0,00</span>
</h5>
</div>
</div>
</div>

View File

@ -53,7 +53,7 @@
<button type="button" class="btn btn-secondary" id="addOrderAddress"
th:text="#{checkout.shipping.add}">Añadir dirección</button>
<div id="orderShippingAddressesContainer" class="mt-4"></div>
<div id="shippingAddressesContainer" class="mt-4"></div>
</div>
</div>